/* ============================================================
   YBT Management Software — Theme Tokens
   Curated high-contrast Light and Dark mode variables
   ============================================================ */

/* Light mode defaults are defined in global.css :root */

/* ---------- Dark Theme Tokens ---------- */
[data-theme="dark"] {
  /* Surfaces */
  --color-bg: #0B1120;
  --color-surface: #131D33;
  --color-surface-hover: #1E293B;
  --color-sidebar-bg: #0F172A;
  --color-card-bg: #131D33;

  /* Typography */
  --color-text: #F8FAFC;
  --color-text-secondary: #CBD5E1;
  --color-text-muted: #8492A6;
  --color-text-inverse: #0B1120;

  /* Borders */
  --color-border: #1E293B;
  --color-border-hover: #334155;
  --color-border-light: #162032;

  /* Brand Accents */
  --color-primary: #38BDF8;
  --color-primary-hover: #0EA5E9;
  --color-primary-light: rgba(14, 165, 233, 0.16);
  --color-primary-dark: #0284C7;
  --color-secondary: #38BDF8;
  --color-accent: #0EA5E9;

  /* Status Colors */
  --color-success: #34D399;
  --color-success-light: rgba(52, 211, 153, 0.16);
  --color-warning: #FBBF24;
  --color-warning-light: rgba(251, 191, 36, 0.16);
  --color-error: #F87171;
  --color-error-light: rgba(248, 113, 113, 0.16);
  --color-info: #38BDF8;
  --color-info-light: rgba(56, 189, 248, 0.16);

  /* Elevation Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 4px 8px -1px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 10px 20px -3px rgba(0, 0, 0, 0.7);
  --shadow-xl: 0 20px 30px -4px rgba(0, 0, 0, 0.85);
}

/* System Preference Adaptation */
@media (prefers-color-scheme: dark) {
  [data-theme="system"] {
    --color-bg: #0B1120;
    --color-surface: #131D33;
    --color-surface-hover: #1E293B;
    --color-sidebar-bg: #0F172A;
    --color-card-bg: #131D33;
    --color-text: #F8FAFC;
    --color-text-secondary: #CBD5E1;
    --color-text-muted: #8492A6;
    --color-text-inverse: #0B1120;
    --color-border: #1E293B;
    --color-border-hover: #334155;
    --color-border-light: #162032;
    --color-primary: #38BDF8;
    --color-primary-hover: #0EA5E9;
    --color-primary-light: rgba(14, 165, 233, 0.16);
    --color-primary-dark: #0284C7;
    --color-secondary: #38BDF8;
    --color-accent: #0EA5E9;
    --color-success: #34D399;
    --color-success-light: rgba(52, 211, 153, 0.16);
    --color-warning: #FBBF24;
    --color-warning-light: rgba(251, 191, 36, 0.16);
    --color-error: #F87171;
    --color-error-light: rgba(248, 113, 113, 0.16);
    --color-info: #38BDF8;
    --color-info-light: rgba(56, 189, 248, 0.16);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 4px 8px -1px rgba(0, 0, 0, 0.6);
    --shadow-lg: 0 10px 20px -3px rgba(0, 0, 0, 0.7);
    --shadow-xl: 0 20px 30px -4px rgba(0, 0, 0, 0.85);
  }
}