/**
 * tokens.css - CyberIA Solutions SaaS Design Tokens
 * Follows Apple Human Interface Guidelines & Fluid Web Motion
 */

:root {
  /* Dynamic Tenant Theming Overrides (injected dynamically via JS) */
  --tenant-primary: #002B49;
  --tenant-secondary: #2563EB;
  --tenant-accent: #0284C7;
  --tenant-ring: rgba(37, 99, 235, 0.35);

  /* Typography Stack */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, -apple-system-subheadline, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  /* Fluid Type Scale */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.8125rem);
  --text-sm: clamp(0.8125rem, 0.78rem + 0.2vw, 0.875rem);
  --text-base: clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
  --text-lg: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --text-xl: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --text-2xl: clamp(1.5rem, 1.35rem + 0.75vw, 1.875rem);
  --text-3xl: clamp(1.875rem, 1.65rem + 1vw, 2.25rem);

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-full: 9999px;

  /* Physical Motion & Springs */
  --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --duration-fast: 120ms;
  --duration-normal: 220ms;
  --duration-slow: 350ms;

  /* Z-Index Hierarchy */
  --z-back: -1;
  --z-base: 1;
  --z-dropdown: 50;
  --z-sticky: 100;
  --z-modal-backdrop: 500;
  --z-modal: 600;
  --z-toast: 1000;
}

/* Light Theme Variables */
:root[data-theme="light"],
:root:not([data-theme="dark"]) {
  color-scheme: light;
  --bg-app: #F8FAFC;
  --bg-surface: #FFFFFF;
  --bg-surface-elevated: rgba(255, 255, 255, 0.85);
  --bg-surface-subtle: #F1F5F9;
  --bg-hover: rgba(0, 0, 0, 0.04);
  --bg-active: rgba(0, 0, 0, 0.08);

  --border-subtle: rgba(15, 23, 42, 0.08);
  --border-strong: rgba(15, 23, 42, 0.16);

  --text-primary: #0F172A;
  --text-secondary: #475569;
  --text-tertiary: #94A3B8;
  --text-inverse: #FFFFFF;

  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.05);
  --shadow-ambient: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05);

  --material-blur: blur(20px) saturate(180%);
  --sidebar-bg: #FFFFFF;
  --sidebar-border: rgba(15, 23, 42, 0.08);
}

/* Dark Theme Variables (Deep OLED-friendly palette) */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg-app: #080C14;
  --bg-surface: #0E1422;
  --bg-surface-elevated: rgba(14, 20, 34, 0.8);
  --bg-surface-subtle: #151D2E;
  --bg-hover: rgba(255, 255, 255, 0.06);
  --bg-active: rgba(255, 255, 255, 0.1);

  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);

  --text-primary: #F8FAFC;
  --text-secondary: #94A3B8;
  --text-tertiary: #64748B;
  --text-inverse: #0F172A;

  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 10px -1px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 10px 20px -3px rgba(0, 0, 0, 0.6);
  --shadow-ambient: 0 25px 35px -5px rgba(0, 0, 0, 0.7);

  --material-blur: blur(24px) saturate(190%);
  --sidebar-bg: #0A0F1A;
  --sidebar-border: rgba(255, 255, 255, 0.07);
}

/* Automatic System Preference */
@media (prefers-color-scheme: dark) {
  :root[data-theme="system"] {
    color-scheme: dark;
    --bg-app: #080C14;
    --bg-surface: #0E1422;
    --bg-surface-elevated: rgba(14, 20, 34, 0.8);
    --bg-surface-subtle: #151D2E;
    --bg-hover: rgba(255, 255, 255, 0.06);
    --bg-active: rgba(255, 255, 255, 0.1);
    --border-subtle: rgba(255, 255, 255, 0.08);
    --border-strong: rgba(255, 255, 255, 0.16);
    --text-primary: #F8FAFC;
    --text-secondary: #94A3B8;
    --text-tertiary: #64748B;
    --text-inverse: #0F172A;
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 10px -1px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 10px 20px -3px rgba(0, 0, 0, 0.6);
    --shadow-ambient: 0 25px 35px -5px rgba(0, 0, 0, 0.7);
    --sidebar-bg: #0A0F1A;
    --sidebar-border: rgba(255, 255, 255, 0.07);
  }
}

/* Status Semantics */
:root {
  --status-submitted-bg: rgba(59, 130, 246, 0.12);
  --status-submitted-text: #3B82F6;
  --status-submitted-border: rgba(59, 130, 246, 0.25);

  --status-inreview-bg: rgba(245, 158, 11, 0.12);
  --status-inreview-text: #F59E0B;
  --status-inreview-border: rgba(245, 158, 11, 0.25);

  --status-approved-bg: rgba(16, 185, 129, 0.12);
  --status-approved-text: #10B981;
  --status-approved-border: rgba(16, 185, 129, 0.25);

  --status-rejected-bg: rgba(244, 63, 94, 0.12);
  --status-rejected-text: #F43F5E;
  --status-rejected-border: rgba(244, 63, 94, 0.25);

  --status-enrolled-bg: rgba(139, 92, 246, 0.12);
  --status-enrolled-text: #8B5CF6;
  --status-enrolled-border: rgba(139, 92, 246, 0.25);
}
