/* ════════════════════════════════════════════════════════════════════
   Localworks Design System — Canonical Tokens (v1.0)
   ────────────────────────────────────────────────────────────────────
   Source of truth for ALL Localworks platforms:
     • Savvy Storefront + Admin  (savvy.localworks.com.au)
     • Forge Pipeline            (forge.localworks.com.au)
     • Rapidline Datafeed        (forge.localworks.com.au/datafeed)
     • GTVR Service & Repairs    (savvy.localworks.com.au/gtvr)
     • BTS Delivery              (savvy.localworks.com.au/bts-delivery)
     • Organisation Portal       (savvy.localworks.com.au/org_portal.php)

   ⚠️  DO NOT EDIT PER-APP COPIES — change this file, then sync to:
       savvy-v2/assets/lw-tokens.css
       forge/lw-tokens.css
       rapidline-scraper/assets/lw-tokens.css

   Every token has been audited for cross-platform consistency.
   ════════════════════════════════════════════════════════════════════ */

:root {
    /* ── Brand ───────────────────────────────────────────────────── */
    /* Deep Navy — canonical brand primary (settled April 2026).     */
    /* Previous divergence: admin.css used #1A0B4E, now deprecated.  */
    --lw-navy: #1A1464;
    --lw-navy-hover: #120e4d;
    --lw-navy-light: #2a1f7a;
    --lw-navy-dark: #0D0A32;
    --lw-navy-rgb: 26, 20, 100;

    /* Bright Orange — canonical brand accent */
    --lw-orange: #FF8C00;
    --lw-orange-hover: #e67e00;
    --lw-orange-light: #ffa033;
    --lw-orange-dark: #cc7000;
    --lw-orange-rgb: 255, 140, 0;

    /* Peach — warm secondary (storefront heroes, empty states) */
    --lw-peach: #FFC080;
    --lw-peach-light: #FFD4A3;

    /* Gold — premium accents (loyalty tier pills, featured badges) */
    --lw-gold: #FFD700;

    /* ── Neutrals (Tailwind-aligned) ─────────────────────────────── */
    --lw-gray-50:  #f9fafb;
    --lw-gray-100: #f3f4f6;
    --lw-gray-200: #e5e7eb;
    --lw-gray-300: #d1d5db;
    --lw-gray-400: #9ca3af;
    --lw-gray-500: #6b7280;
    --lw-gray-600: #4b5563;
    --lw-gray-700: #374151;
    --lw-gray-800: #1f2937;
    --lw-gray-900: #111827;

    /* ── Semantic ────────────────────────────────────────────────── */
    --lw-success:       #10b981;
    --lw-success-light: #d1fae5;
    --lw-success-dark:  #059669;
    --lw-warning:       #f59e0b;
    --lw-warning-light: #fef3c7;
    --lw-warning-dark:  #d97706;
    --lw-danger:        #ef4444;
    --lw-danger-light:  #fee2e2;
    --lw-danger-dark:   #dc2626;
    --lw-info:          #3b82f6;
    --lw-info-light:    #dbeafe;
    --lw-info-dark:     #2563eb;

    /* ── Surfaces ────────────────────────────────────────────────── */
    --lw-bg:         #f8f9fc;  /* App background */
    --lw-surface:    #ffffff;  /* Cards, panels, modals */
    --lw-surface-2:  #f1f3f9;  /* Nested surfaces, hover states */
    --lw-border:     #e5e7eb;
    --lw-border-strong: #d1d5db;

    /* ── Text ────────────────────────────────────────────────────── */
    --lw-text:           #111827;  /* Primary */
    --lw-text-secondary: #6b7280;  /* Secondary / labels */
    --lw-text-muted:     #9ca3af;  /* Disabled / placeholders */
    --lw-text-inverse:   #ffffff;

    /* ── Typography ──────────────────────────────────────────────── */
    --lw-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --lw-font-mono: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;

    --lw-text-xs:   0.75rem;    /* 12px */
    --lw-text-sm:   0.875rem;   /* 14px */
    --lw-text-base: 1rem;       /* 16px */
    --lw-text-lg:   1.125rem;   /* 18px */
    --lw-text-xl:   1.25rem;    /* 20px */
    --lw-text-2xl:  1.5rem;     /* 24px */
    --lw-text-3xl:  1.875rem;   /* 30px */
    --lw-text-4xl:  2.25rem;    /* 36px */

    --lw-weight-normal:   400;
    --lw-weight-medium:   500;
    --lw-weight-semibold: 600;
    --lw-weight-bold:     700;

    /* ── Spacing (Tailwind-aligned) ──────────────────────────────── */
    --lw-space-1:  0.25rem;   /* 4px  */
    --lw-space-2:  0.5rem;    /* 8px  */
    --lw-space-3:  0.75rem;   /* 12px */
    --lw-space-4:  1rem;      /* 16px */
    --lw-space-5:  1.25rem;   /* 20px */
    --lw-space-6:  1.5rem;    /* 24px */
    --lw-space-8:  2rem;      /* 32px */
    --lw-space-10: 2.5rem;    /* 40px */
    --lw-space-12: 3rem;      /* 48px */
    --lw-space-16: 4rem;      /* 64px */

    /* ── Radii ───────────────────────────────────────────────────── */
    --lw-radius-sm:   6px;
    --lw-radius:      8px;
    --lw-radius-md:   12px;
    --lw-radius-lg:   16px;
    --lw-radius-xl:   20px;
    --lw-radius-full: 9999px;

    /* ── Shadows ─────────────────────────────────────────────────── */
    --lw-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --lw-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    --lw-shadow:    0 1px 3px rgba(0, 0, 0, 0.10), 0 1px 2px rgba(0, 0, 0, 0.06);
    --lw-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
    --lw-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
    --lw-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
    --lw-shadow-glow-orange: 0 0 20px rgba(255, 140, 0, 0.25);
    --lw-shadow-glow-navy:   0 0 20px rgba(26, 20, 100, 0.25);

    /* ── Motion ──────────────────────────────────────────────────── */
    --lw-ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
    --lw-ease-in:     cubic-bezier(0.4, 0, 1, 1);
    --lw-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --lw-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

    --lw-duration-fast:   150ms;
    --lw-duration-normal: 250ms;
    --lw-duration-slow:   400ms;

    --lw-transition:      all var(--lw-duration-normal) var(--lw-ease-in-out);
    --lw-transition-fast: all var(--lw-duration-fast) var(--lw-ease-in-out);

    /* ── Layout ──────────────────────────────────────────────────── */
    --lw-topbar-height:     56px;
    --lw-sidebar-width:     260px;
    --lw-sidebar-collapsed: 80px;
    --lw-content-max:       1400px;
    --lw-content-wide:      1800px;

    /* ── Focus ring (accessibility) ──────────────────────────────── */
    --lw-focus-ring: 0 0 0 3px rgba(26, 20, 100, 0.25);
    --lw-focus-ring-orange: 0 0 0 3px rgba(255, 140, 0, 0.25);
    --lw-focus-ring-danger: 0 0 0 3px rgba(239, 68, 68, 0.25);

    /* ════════════════════════════════════════════════════════════════
       Legacy aliases — DO NOT use in new code, provided for backward
       compatibility with existing components. Will be removed v2.0.
       ════════════════════════════════════════════════════════════════ */
    --brand-navy:        var(--lw-navy);
    --brand-navy-hover:  var(--lw-navy-hover);
    --brand-navy-light:  var(--lw-navy-light);
    --brand-navy-dark:   var(--lw-navy-dark);
    --brand-navy-rgb:    var(--lw-navy-rgb);
    --brand-orange:      var(--lw-orange);
    --brand-orange-hover:var(--lw-orange-hover);
    --brand-orange-light:var(--lw-orange-light);
    --brand-orange-rgb:  var(--lw-orange-rgb);
    --brand-peach:       var(--lw-peach);
    --brand-peach-light: var(--lw-peach-light);
    --brand-gold:        var(--lw-gold);
    --brand-purple:      var(--lw-navy);          /* legacy, when Savvy used "purple" */
    --brand-purple-hover:var(--lw-navy-hover);
    --brand-purple-light:var(--lw-navy-light);
    --brand-purple-dark: var(--lw-navy-dark);
    --brand-blue:        var(--lw-navy);          /* legacy, when navy was "blue" */
    --brand-blue-hover:  var(--lw-navy-hover);
    --brand-blue-light:  var(--lw-navy-light);
    --brand-primary:     var(--lw-navy);          /* admin.css alias */
    --brand-secondary:   var(--lw-navy-light);
    --brand-accent:      var(--lw-orange);
    --brand-purple-dark: var(--lw-navy-dark);
    --gray-50:  var(--lw-gray-50);
    --gray-100: var(--lw-gray-100);
    --gray-200: var(--lw-gray-200);
    --gray-300: var(--lw-gray-300);
    --gray-400: var(--lw-gray-400);
    --gray-500: var(--lw-gray-500);
    --gray-600: var(--lw-gray-600);
    --gray-700: var(--lw-gray-700);
    --gray-800: var(--lw-gray-800);
    --gray-900: var(--lw-gray-900);
    --success:       var(--lw-success);
    --success-light: var(--lw-success-light);
    --warning:       var(--lw-warning);
    --warning-light: var(--lw-warning-light);
    --danger:        var(--lw-danger);
    --danger-light:  var(--lw-danger-light);
    --error:         var(--lw-danger);
    --error-light:   var(--lw-danger-light);
    --info:          var(--lw-info);
    --info-light:    var(--lw-info-light);
    --shadow-xs: var(--lw-shadow-xs);
    --shadow-sm: var(--lw-shadow-sm);
    --shadow:    var(--lw-shadow);
    --shadow-md: var(--lw-shadow-md);
    --shadow-lg: var(--lw-shadow-lg);
    --shadow-xl: var(--lw-shadow-xl);
    --radius-sm:   var(--lw-radius-sm);
    --radius:      var(--lw-radius);
    --radius-md:   var(--lw-radius-md);
    --radius-lg:   var(--lw-radius-lg);
    --radius-xl:   var(--lw-radius-xl);
    --radius-full: var(--lw-radius-full);
    --transition:      var(--lw-transition);
    --transition-fast: var(--lw-transition-fast);
    --ease-out:    var(--lw-ease-out);
    --ease-spring: var(--lw-ease-spring);
    --ease-smooth: var(--lw-ease-in-out);
    --duration-fast:   var(--lw-duration-fast);
    --duration-normal: var(--lw-duration-normal);
    --duration-slow:   var(--lw-duration-slow);
    --font-sans: var(--lw-font-sans);
    --font-mono: var(--lw-font-mono);
}

/* ════════════════════════════════════════════════════════════════════
   Baseline type + reset — minimal, non-intrusive.
   Each app can still define its own body/heading styles over this.
   ════════════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::selection {
    background: rgba(var(--lw-orange-rgb), 0.25);
    color: var(--lw-navy-dark);
}

/* Accessibility: reduce motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}