/*
 * Event Operations Manager semantic design tokens.
 *
 * This is the single colour source of truth for the shared EOM interface.
 * Feature modules must consume semantic tokens instead of hard-coded colours.
 * Deliberate exceptions (QR/print/stage output/user-selected colours) are
 * documented in docs/EOM-COLOR-TOKEN-ALLOWLIST.json.
 */
:root {
  color-scheme: light;

  /* Canvas and surfaces */
  --eom-page-bg: #f4f6f9;
  --eom-header-bg: #111827;
  --eom-surface-1: #ffffff;
  --eom-surface-2: #f8fafc;
  --eom-surface-3: #eef3f8;
  --eom-surface-raised: #ffffff;
  --eom-surface-input: #ffffff;
  --eom-surface-hover: #eef4fb;
  --eom-surface-disabled: #eef1f4;
  --eom-surface-code: #f2f4f7;

  /* Borders */
  --eom-border-subtle: #e5eaf0;
  --eom-border: #dce3eb;
  --eom-border-strong: #b8c5d5;
  --eom-border-focus: #0b57d0;

  /* Text and links */
  --eom-text: #202124;
  --eom-text-soft: #475569;
  --eom-text-muted: #5f6874;
  --eom-text-disabled: #94a3b8;
  --eom-text-inverse: #ffffff;
  --eom-link: #175cd3;
  --eom-link-hover: #123d8f;

  /* Brand and interaction */
  --eom-primary: #1967d2;
  --eom-primary-hover: #1755b5;
  --eom-primary-active: #123d8f;
  --eom-primary-soft: #eff6ff;
  --eom-primary-border: #bfdbfe;
  --eom-primary-text: #174ea6;
  --eom-focus: #0b57d0;
  --eom-focus-ring: rgba(11, 87, 208, .34);

  /* Feature accents and data visualisation */
  --eom-accent-blue: #2563eb;
  --eom-accent-cyan: #0369a1;
  --eom-accent-teal: #0f766e;
  --eom-accent-green: #15803d;
  --eom-accent-lime: #4d7c0f;
  --eom-accent-yellow: #ca8a04;
  --eom-accent-orange: #d97706;
  --eom-accent-red: #dc2626;
  --eom-accent-pink: #db2777;
  --eom-accent-purple: #7c3aed;
  --eom-chart-1: var(--eom-accent-blue);
  --eom-chart-2: var(--eom-accent-cyan);
  --eom-chart-3: var(--eom-accent-teal);
  --eom-chart-4: var(--eom-accent-green);
  --eom-chart-5: var(--eom-accent-orange);
  --eom-chart-6: var(--eom-accent-pink);
  --eom-chart-7: var(--eom-accent-purple);
  --eom-chart-8: var(--eom-accent-yellow);

  /* Semantic states */
  --eom-success: #137333;
  --eom-success-bg: #ecfdf3;
  --eom-success-border: #a7e2c0;
  --eom-success-text: #166534;

  --eom-warning: #9a6700;
  --eom-warning-bg: #fff8e8;
  --eom-warning-border: #f1c56e;
  --eom-warning-text: #7c4a03;

  --eom-danger: #a61b17;
  --eom-danger-bg: #fff1f2;
  --eom-danger-border: #f1b7b4;
  --eom-danger-text: #8c1d18;

  --eom-info: #175cd3;
  --eom-info-bg: #eff6ff;
  --eom-info-border: #bfdbfe;
  --eom-info-text: #174ea6;

  --eom-neutral-bg: #eef1f4;
  --eom-neutral-border: #d7dde5;
  --eom-neutral-text: #475569;

  /* Overlays, shadows and progress */
  --eom-overlay-soft: rgba(15, 23, 42, .18);
  --eom-overlay: rgba(15, 23, 42, .58);
  --eom-overlay-strong: rgba(15, 23, 42, .78);
  --eom-on-dark-surface: rgba(255, 255, 255, .10);
  --eom-on-dark-surface-hover: rgba(255, 255, 255, .18);
  --eom-on-dark-border: rgba(255, 255, 255, .22);
  --eom-on-dark-border-strong: rgba(255, 255, 255, .35);
  --eom-surface-translucent: rgba(255, 255, 255, .94);
  --eom-surface-translucent-strong: rgba(255, 255, 255, .97);
  --eom-primary-tint-10: rgba(37, 99, 235, .10);
  --eom-primary-tint-14: rgba(37, 99, 235, .14);
  --eom-primary-tint-18: rgba(37, 99, 235, .18);
  --eom-primary-tint-30: rgba(37, 99, 235, .30);
  --eom-success-tint: rgba(11, 143, 77, .13);
  --eom-warning-tint: rgba(245, 158, 11, .14);
  --eom-danger-tint: rgba(220, 38, 38, .12);
  --eom-shadow-subtle-color: rgba(15, 23, 42, .08);
  --eom-shadow-color: rgba(15, 23, 42, .12);
  --eom-shadow-medium-color: rgba(15, 23, 42, .22);
  --eom-shadow-strong-color: rgba(15, 23, 42, .34);
  --eom-shadow-soft: 0 3px 16px rgba(15, 23, 42, .06);
  --eom-shadow: 0 8px 28px rgba(15, 23, 42, .10);
  --eom-shadow-raised: 0 18px 46px rgba(15, 23, 42, .16);
  --eom-progress-track: #e2e8f0;
  --eom-progress-value: #2563eb;

  /* Intentionally light surfaces used for machine readability/document fidelity */
  --eom-fixed-light-bg: #ffffff;
  --eom-fixed-light-text: #111827;
  --eom-fixed-light-border: #cbd5e1;
  --eom-fixed-dark-bg: #000000;
  --eom-fixed-dark-text: #ffffff;

  /* Dedicated QR reception canvas. It intentionally stays near-black in every theme. */
  --eom-scanner-canvas: #050607;
  --eom-scanner-topbar: #111317;
  --eom-scanner-stage: #08090b;
  --eom-scanner-placeholder-center: #20242a;
  --eom-scanner-placeholder-edge: #090a0c;

  /* Legacy aliases. Existing modules may keep these names while migration proceeds. */
  --bg: var(--eom-page-bg);
  --card: var(--eom-surface-1);
  --surface: var(--eom-surface-1);
  --surface-soft: var(--eom-surface-2);
  --surface-subtle: var(--eom-surface-2);
  --panel: var(--eom-surface-1);
  --border: var(--eom-border);
  --line: var(--eom-border);
  --text: var(--eom-text);
  --muted: var(--eom-text-muted);
  --accent: var(--eom-primary);
  --primary: var(--eom-primary);
  --primary-dark: var(--eom-primary-active);
  --brand: var(--eom-primary);
  --brand-dark: var(--eom-primary-active);
  --focus: var(--eom-focus);
  --danger: var(--eom-danger);
  --ok: var(--eom-success);
  --warning: var(--eom-warning);
  --shadow: var(--eom-shadow);
  --shadow-sm: var(--eom-shadow-soft);
}

body.eom-field-dark {
  color-scheme: dark;

  --eom-page-bg: #05080d;
  --eom-header-bg: #070c13;
  --eom-surface-1: #0d141e;
  --eom-surface-2: #121c28;
  --eom-surface-3: #182433;
  --eom-surface-raised: #101b2a;
  --eom-surface-input: #070c13;
  --eom-surface-hover: #1d2c3d;
  --eom-surface-disabled: #172331;
  --eom-surface-code: #04070b;

  --eom-border-subtle: #223044;
  --eom-border: #29384b;
  --eom-border-strong: #3a4c63;
  --eom-border-focus: #53b9f7;

  --eom-text: #f2f6fa;
  --eom-text-soft: #d8e1eb;
  --eom-text-muted: #9eacbd;
  --eom-text-disabled: #6f7e92;
  --eom-text-inverse: #ffffff;
  --eom-link: #72c6ff;
  --eom-link-hover: #b7e4ff;

  --eom-primary: #0f6eaa;
  --eom-primary-hover: #1687cf;
  --eom-primary-active: #0b5b8e;
  --eom-primary-soft: #10283b;
  --eom-primary-border: #2a5c7d;
  --eom-primary-text: #d1edff;
  --eom-focus: #57b8ff;
  --eom-focus-ring: rgba(83, 185, 247, .22);

  --eom-accent-blue: #60a5fa;
  --eom-accent-cyan: #38bdf8;
  --eom-accent-teal: #2dd4bf;
  --eom-accent-green: #4ade80;
  --eom-accent-lime: #a3e635;
  --eom-accent-yellow: #facc15;
  --eom-accent-orange: #fb923c;
  --eom-accent-red: #f87171;
  --eom-accent-pink: #f472b6;
  --eom-accent-purple: #c084fc;

  --eom-success: #188755;
  --eom-success-bg: #0d2b20;
  --eom-success-border: #287153;
  --eom-success-text: #cef8e3;

  --eom-warning: #d29a23;
  --eom-warning-bg: #312711;
  --eom-warning-border: #806520;
  --eom-warning-text: #ffe4a0;

  --eom-danger: #b93d49;
  --eom-danger-bg: #32151a;
  --eom-danger-border: #87313d;
  --eom-danger-text: #ffd4d8;

  --eom-info: #279de9;
  --eom-info-bg: #10283b;
  --eom-info-border: #2a5c7d;
  --eom-info-text: #d1edff;

  --eom-neutral-bg: #263448;
  --eom-neutral-border: #3b4d64;
  --eom-neutral-text: #e7eef6;

  --eom-overlay-soft: rgba(0, 0, 0, .24);
  --eom-overlay: rgba(0, 0, 0, .58);
  --eom-overlay-strong: rgba(0, 0, 0, .78);
  --eom-on-dark-surface: rgba(255, 255, 255, .10);
  --eom-on-dark-surface-hover: rgba(255, 255, 255, .18);
  --eom-on-dark-border: rgba(255, 255, 255, .22);
  --eom-on-dark-border-strong: rgba(255, 255, 255, .35);
  --eom-surface-translucent: rgba(13, 20, 30, .94);
  --eom-surface-translucent-strong: rgba(13, 20, 30, .97);
  --eom-primary-tint-10: rgba(39, 157, 233, .10);
  --eom-primary-tint-14: rgba(39, 157, 233, .14);
  --eom-primary-tint-18: rgba(39, 157, 233, .18);
  --eom-primary-tint-30: rgba(39, 157, 233, .30);
  --eom-success-tint: rgba(24, 135, 85, .18);
  --eom-warning-tint: rgba(210, 154, 35, .18);
  --eom-danger-tint: rgba(185, 61, 73, .18);
  --eom-shadow-subtle-color: rgba(0, 0, 0, .18);
  --eom-shadow-color: rgba(0, 0, 0, .32);
  --eom-shadow-medium-color: rgba(0, 0, 0, .45);
  --eom-shadow-strong-color: rgba(0, 0, 0, .62);
  --eom-shadow-soft: 0 3px 16px rgba(0, 0, 0, .18);
  --eom-shadow: 0 14px 36px rgba(0, 0, 0, .28);
  --eom-shadow-raised: 0 18px 46px rgba(0, 0, 0, .32);
  --eom-progress-track: #253244;
  --eom-progress-value: #2f7df0;

  /* Legacy aliases must be rebound inside the dark scope.
     Custom-property aliases declared on :root otherwise resolve against the
     light palette before inheritance. */
  --bg: var(--eom-page-bg);
  --card: var(--eom-surface-1);
  --surface: var(--eom-surface-1);
  --surface-soft: var(--eom-surface-2);
  --surface-subtle: var(--eom-surface-2);
  --panel: var(--eom-surface-1);
  --border: var(--eom-border);
  --line: var(--eom-border);
  --text: var(--eom-text);
  --muted: var(--eom-text-muted);
  --accent: var(--eom-primary);
  --primary: var(--eom-primary);
  --primary-dark: var(--eom-primary-active);
  --brand: var(--eom-primary);
  --brand-dark: var(--eom-primary-active);
  --focus: var(--eom-focus);
  --danger: var(--eom-danger);
  --ok: var(--eom-success);
  --warning: var(--eom-warning);
  --shadow: var(--eom-shadow);
  --shadow-sm: var(--eom-shadow-soft);

  /* v18.18.x dark-theme aliases retained for backward-compatible modules. */
  --eom-dark-bg: var(--eom-page-bg);
  --eom-dark-bg-elevated: var(--eom-surface-raised);
  --eom-dark-surface: var(--eom-surface-1);
  --eom-dark-surface-2: var(--eom-surface-2);
  --eom-dark-surface-3: var(--eom-surface-3);
  --eom-dark-line: var(--eom-border);
  --eom-dark-line-strong: var(--eom-border-strong);
  --eom-dark-text: var(--eom-text);
  --eom-dark-text-soft: var(--eom-text-soft);
  --eom-dark-muted: var(--eom-text-muted);
  --eom-dark-link: var(--eom-link);
  --eom-dark-primary: var(--eom-primary);
  --eom-dark-primary-hover: var(--eom-primary-hover);
  --eom-dark-success: var(--eom-success);
  --eom-dark-warning: var(--eom-warning);
  --eom-dark-danger: var(--eom-danger);
  --eom-dark-shadow: var(--eom-shadow-raised);

}

/* Printing always uses a document-safe light palette, even from field-dark. */
@media print {
  body.eom-field-dark {
    --eom-page-bg: var(--eom-fixed-light-bg);
    --eom-header-bg: var(--eom-fixed-light-bg);
    --eom-surface-1: var(--eom-fixed-light-bg);
    --eom-surface-2: #f8fafc;
    --eom-surface-3: #eef1f4;
    --eom-surface-raised: var(--eom-fixed-light-bg);
    --eom-surface-input: var(--eom-fixed-light-bg);
    --eom-border-subtle: #e5eaf0;
    --eom-border: var(--eom-fixed-light-border);
    --eom-border-strong: #94a3b8;
    --eom-text: var(--eom-fixed-light-text);
    --eom-text-soft: #334155;
    --eom-text-muted: #475569;
    --eom-link: #174ea6;
    color-scheme: light;
  }
}
