/*
 * Design tokens — Clarkson University brand colors + semantic light/dark themes.
 * Source: CU brand guide (green base, gold accent, white third primary).
 */

/* ========== BRAND CONSTANTS (theme-independent) ========== */

:root {
  --brand-green: #004e42;
  --brand-gold: #ffcd00;

  --bold-green: #7a9a01;
  --bold-orange: #cf4520;
  --bold-blue: #418fde;
  --bold-navy: #002d72;

  --mature-sage: #a2a569;
  --mature-tan: #c6893f;
  --mature-blue: #7bafd4;
  --mature-teal: #005587;

  --neutral-light: #d7d2cb;
  --neutral-medium: #a59c94;
  --neutral-dark: #6e6259;

  --color-yahoo: #6001d2;
  --color-yahoo-dark: #4b01a5;
  --color-google: #db4437;
  --color-google-dark: #a33224;

  --sos-gap-positive: var(--bold-green);
  --sos-gap-negative: var(--bold-orange);
  --sos-gap-neutral: var(--neutral-medium);

  --radius-card: 6px;
  --radius-badge: 4px;
  --spacing-unit: 8px;

  --commissioner-subnav-sticky-top: 0.5rem;
  --commissioner-subnav-z-index: 10;

  /* Legacy aliases */
  --core-primary: var(--brand-green);
  --core-secondary: var(--brand-gold);
  --yahoo-purple: var(--color-yahoo);
  --yahoo-purple-dark: var(--color-yahoo-dark);
}

/* ========== LIGHT THEME (default, brand-faithful) ========== */

:root,
[data-theme="light"] {
  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-surface-raised: #f7f6f4;
  --color-navbar-bg: var(--brand-green);
  --color-footer-bg: var(--brand-green);
  --color-navbar-text: rgba(255, 255, 255, 0.85);
  --color-navbar-text-hover: #ffffff;
  --color-navbar-active-bg: var(--brand-gold);
  --color-navbar-active-text: var(--brand-green);
  --color-footer-link: rgba(255, 255, 255, 0.75);

  --color-text-primary: var(--brand-green);
  --color-text-on-dark: #ffffff;
  --color-text-muted: var(--neutral-dark);
  --color-border: var(--neutral-light);

  --color-accent: var(--brand-green);
  --color-accent-dim: #003c33;
  --color-accent-highlight: var(--brand-gold);
  --color-accent-glow: rgba(255, 205, 0, 0.15);

  --color-success: var(--bold-green);
  --color-danger: var(--bold-orange);
  --color-warning: var(--mature-tan);
  --color-info: var(--mature-blue);

  --color-state-success-bg: rgba(122, 154, 1, 0.15);
  --color-state-success-text: var(--brand-green);
  --color-state-danger-bg: rgba(207, 69, 32, 0.15);
  --color-state-danger-text: var(--bold-orange);
  --color-state-warning-bg: rgba(255, 205, 0, 0.15);
  --color-state-warning-text: var(--brand-green);
  --color-state-info-bg: rgba(123, 175, 212, 0.2);
  --color-state-info-text: var(--mature-teal);

  --color-stat-bar: var(--brand-green);
  --color-stat-bar-warning: var(--brand-gold);
  --color-stat-bar-secondary: var(--neutral-medium);
  --color-stat-bar-danger: var(--bold-orange);

  --color-card-header-bg: var(--brand-green);
  --color-card-header-text: #ffffff;

  --color-table-header-bg: var(--brand-green);
  --color-table-header-text: #ffffff;
  --color-table-stripe-bg: var(--color-surface-raised);
  --color-table-hover-bg: var(--color-accent-glow);
  --color-table-row-home-bg: rgba(0, 78, 66, 0.08);
  --color-table-row-away-bg: rgba(122, 154, 1, 0.08);

  --color-badge-playoff-bg: var(--brand-gold);
  --color-badge-playoff-text: var(--brand-green);
  --color-badge-consolation-bg: var(--color-surface-raised);
  --color-badge-consolation-text: var(--color-text-muted);

  --color-form-bg: var(--color-surface-raised);
  --color-form-text: var(--color-text-primary);
  --color-form-border: var(--color-border);
  --form-select-indicator: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236e6259' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");

  --color-chart-positive: var(--bold-green);
  --color-chart-negative: var(--bold-orange);
  --color-chart-neutral: var(--neutral-medium);
  --color-chart-grid: var(--neutral-light);

  --color-datatable-header-bg: var(--brand-green);
  --color-datatable-header-text: #ffffff;
  --color-datatable-cell-bg: var(--color-surface);
  --color-datatable-cell-text: var(--color-text-primary);
  --color-datatable-stripe-bg: rgba(215, 210, 203, 0.3);
  --color-datatable-border: var(--neutral-light);

  --shadow-elevated: 0 2px 8px rgba(0, 0, 0, 0.1);
  --shadow-navbar: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* ========== DARK THEME (Clarkson green-tinted) ========== */

[data-theme="dark"] {
  --form-select-indicator: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23a59c94' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");

  --color-bg: #0a1a16;
  --color-surface: #0f241f;
  --color-surface-raised: #163028;
  --color-navbar-bg: var(--color-surface);
  --color-footer-bg: var(--color-surface);
  --color-navbar-text: var(--neutral-medium);
  --color-navbar-text-hover: #f5f5f0;
  --color-navbar-active-bg: transparent;
  --color-navbar-active-text: var(--brand-gold);
  --color-footer-link: rgba(245, 245, 240, 0.75);

  --color-text-primary: #f5f5f0;
  --color-text-on-dark: #f5f5f0;
  --color-text-muted: var(--neutral-medium);
  --color-border: #2a4a40;

  --color-accent: var(--brand-gold);
  --color-accent-dim: #c9a900;
  --color-accent-highlight: var(--brand-gold);
  --color-accent-glow: rgba(255, 205, 0, 0.15);

  --color-success: var(--bold-green);
  --color-danger: var(--bold-orange);
  --color-warning: var(--mature-tan);
  --color-info: var(--mature-blue);

  --color-state-success-bg: rgba(122, 154, 1, 0.22);
  --color-state-success-text: #dce8a2;
  --color-state-danger-bg: rgba(207, 69, 32, 0.22);
  --color-state-danger-text: #f2a38d;
  --color-state-warning-bg: rgba(255, 205, 0, 0.18);
  --color-state-warning-text: var(--brand-gold);
  --color-state-info-bg: rgba(123, 175, 212, 0.18);
  --color-state-info-text: #b9d8ec;

  --color-stat-bar: var(--brand-gold);
  --color-stat-bar-warning: var(--mature-tan);
  --color-stat-bar-secondary: var(--neutral-light);
  --color-stat-bar-danger: var(--bold-orange);

  --color-card-header-bg: var(--color-surface-raised);
  --color-card-header-text: var(--color-text-primary);

  --color-table-header-bg: var(--color-surface-raised);
  --color-table-header-text: var(--color-text-muted);
  --color-table-stripe-bg: var(--color-surface-raised);
  --color-table-hover-bg: var(--color-accent-glow);
  --color-table-row-home-bg: rgba(255, 205, 0, 0.08);
  --color-table-row-away-bg: rgba(123, 175, 212, 0.08);

  --color-badge-playoff-bg: var(--brand-gold);
  --color-badge-playoff-text: var(--brand-green);
  --color-badge-consolation-bg: var(--color-surface-raised);
  --color-badge-consolation-text: var(--color-text-muted);

  --color-form-bg: var(--color-surface-raised);
  --color-form-text: var(--color-text-primary);
  --color-form-border: var(--color-border);

  --color-chart-positive: var(--bold-green);
  --color-chart-negative: var(--bold-orange);
  --color-chart-neutral: var(--neutral-medium);
  --color-chart-grid: var(--color-border);

  --color-datatable-header-bg: var(--color-surface-raised);
  --color-datatable-header-text: var(--color-text-primary);
  --color-datatable-cell-bg: var(--color-surface);
  --color-datatable-cell-text: var(--color-text-primary);
  --color-datatable-stripe-bg: rgba(255, 255, 255, 0.04);
  --color-datatable-border: var(--color-border);

  --shadow-elevated: 0 4px 20px rgba(0, 0, 0, 0.5);
  --shadow-navbar: 0 1px 0 var(--color-border);
}