/* ============================================================
   REFORCE CHIPS — CSS Custom Properties (Design Tokens)
   ============================================================ */

:root {
  /* ── Brand Colors ── */
  --color-primary:            #0693E3;
  --color-primary-dark:       #0577C2;
  --color-primary-light:      #38ADEF;
  --color-primary-ultra-light:#E0F2FE;
  --color-accent:             #E5691D;
  --color-accent-dark:        #c45a17;
  --color-accent-light:       #f97316;

  /* ── Neutrals ── */
  --color-dark:               #0C1117;
  --color-gray-900:           #111827;
  --color-gray-800:           #1f2937;
  --color-gray-700:           #374151;
  --color-gray-600:           #4b5563;
  --color-gray-500:           #6b7280;
  --color-gray-400:           #9ca3af;
  --color-gray-300:           #d1d5db;
  --color-gray-200:           #e5e7eb;
  --color-gray-100:           #f3f4f6;
  --color-gray-50:            #f9fafb;
  --color-white:              #ffffff;

  /* ── Status / Semantic Colors ── */
  --color-status-active:      #22c55e;
  --color-status-stock:       #3b82f6;
  --color-status-suspended:   #f59e0b;
  --color-status-cancelled:   #ef4444;
  --color-status-returned:    #6b7280;
  --color-status-pending:     #8b5cf6;

  --color-success:            #22c55e;
  --color-success-light:      #dcfce7;
  --color-warning:            #f59e0b;
  --color-warning-light:      #fef3c7;
  --color-error:              #ef4444;
  --color-error-light:        #fee2e2;
  --color-info:               #3b82f6;
  --color-info-light:         #dbeafe;

  /* ── Layout ── */
  --sidebar-width:            260px;
  --sidebar-collapsed-width:  64px;

  --topbar-height:            64px;

  /* ── Border Radii ── */
  --border-radius:            8px;
  --border-radius-lg:         12px;
  --border-radius-xl:         16px;
  --border-radius-2xl:        24px;
  --border-radius-full:       9999px;

  /* ── Shadows ── */
  --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow:    0 1px 3px 0 rgba(0, 0, 0, 0.10),
               0 1px 2px -1px rgba(0, 0, 0, 0.10);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.10),
               0 2px 4px -2px rgba(0, 0, 0, 0.10);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.10),
               0 4px 6px -4px rgba(0, 0, 0, 0.10);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.10),
               0 8px 10px -6px rgba(0, 0, 0, 0.10);
  --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  --shadow-primary: 0 4px 14px 0 rgba(6, 147, 227, 0.35);
  --shadow-accent:  0 4px 14px 0 rgba(229, 105, 29, 0.35);

  /* ── Typography ── */
  --font-family:       'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont,
                        'Helvetica Neue', Arial, sans-serif;
  --font-mono:         'Cascadia Code', 'Fira Code', 'Consolas', monospace;

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

  --line-height-tight:  1.25;
  --line-height-snug:   1.375;
  --line-height-normal: 1.5;
  --line-height-relaxed:1.625;

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

  /* ── Transitions ── */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   350ms ease;
  --transition-spring: 250ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Z-Index Scale ── */
  --z-base:    1;
  --z-raised:  10;
  --z-dropdown:60;
  --z-topbar:  90;
  --z-sidebar: 100;
  --z-overlay: 150;
  --z-modal:   200;
  --z-toast:   300;
  --z-tooltip: 400;
}