/**
 * Ceggesta design tokens — RESOLVED from the Figma brand kit.
 * Authoring source: Figma file xAzpzf69IeZjYlfZGz5I8K (ceggesta project).
 * GENERATED ARTIFACT — do not hand-edit. Re-sync from Figma when the kit changes.
 *
 * Dark-first, dual-mode. :root is DARK (primary surface).
 * Light mode is applied via [data-theme="light"] or prefers-color-scheme.
 * Emerald #2DD4A7 is the only brand chroma. Status colors are separate.
 */

:root {
  /* text */
  --ceg-text-primary: #e8ebed;
  --ceg-text-secondary: #a7adb3;
  --ceg-text-muted: #727981;
  --ceg-text-on-accent: #06231b;
  --ceg-text-on-inverse: #0e1113;
  --ceg-text-brand: #25b893;

  /* surface */
  --ceg-surface-page: #0c0e10;
  --ceg-surface-default: #15181b;
  --ceg-surface-raised: #1c2024;
  --ceg-surface-inverse: #e8ebed;
  --ceg-surface-panel: #101315;

  /* action (brand emerald) */
  --ceg-action-default: #2dd4a7;
  --ceg-action-hover: #25b893;
  --ceg-action-emphasis: #5ce8c0;
  --ceg-accent-highlight: #8ff0d6;

  /* border */
  --ceg-border-subtle: #2a2f34;
  --ceg-border-strong: #727981;

  /* status — separate from brand. emerald = success only. */
  --ceg-status-danger: #ff5c5c;
  --ceg-status-danger-surface: #3a1e1f;
  --ceg-status-warning: #f5a623;
  --ceg-status-warning-surface: #3a2e17;
  --ceg-status-info: #4c8dff;
  --ceg-status-info-surface: #1b2740;
  --ceg-status-success: #2dd4a7;
  --ceg-status-success-surface: #0f2a22;

  /* spacing (8pt ramp) */
  --ceg-space-2xs: 4px;
  --ceg-space-xs: 8px;
  --ceg-space-sm: 12px;
  --ceg-space-md: 16px;
  --ceg-space-lg: 24px;
  --ceg-space-xl: 32px;
  --ceg-space-2xl: 48px;
  --ceg-space-3xl: 64px;
  --ceg-space-4xl: 96px;

  /* radius — near-square */
  --ceg-radius-sm: 2px;
  --ceg-radius-md: 4px;
  --ceg-radius-lg: 6px;
  --ceg-radius-xl: 8px;
  --ceg-radius-full: 999px;

  /* type */
  --ceg-font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --ceg-tracking-display: -0.03em;
  --ceg-tracking-h1: -0.025em;
  --ceg-tracking-h2: -0.02em;
  --ceg-tracking-h3: -0.015em;
  --ceg-tracking-body: -0.01em;
}

/* LIGHT mode — explicit opt-in */
[data-theme="light"] {
  --ceg-text-primary: #0e1113;
  --ceg-text-secondary: #565c63;
  --ceg-text-muted: #868d95;
  --ceg-text-on-accent: #ffffff;
  --ceg-text-on-inverse: #f8f9fa;
  --ceg-text-brand: #1e9e7c;

  --ceg-surface-page: #f8f9fa;
  --ceg-surface-default: #f4f6f7;
  --ceg-surface-raised: #ffffff;
  --ceg-surface-inverse: #0e1113;
  --ceg-surface-panel: #0c0e10;

  --ceg-action-default: #17b588;
  --ceg-action-hover: #1e9e7c;
  --ceg-action-emphasis: #2dd4a7;
  --ceg-accent-highlight: #7fe8c8;

  --ceg-border-subtle: #e1e4e8;
  --ceg-border-strong: #868d95;

  --ceg-status-danger: #d92d2d;
  --ceg-status-danger-surface: #fce9e9;
  --ceg-status-warning: #b76e00;
  --ceg-status-warning-surface: #fbf1de;
  --ceg-status-info: #2563eb;
  --ceg-status-info-surface: #e8eefc;
  --ceg-status-success: #17b588;
  --ceg-status-success-surface: #e4f7f0;
}

/* LIGHT mode — system preference, only when no explicit theme set */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]):not([data-theme="light"]) {
    --ceg-text-primary: #0e1113;
    --ceg-text-secondary: #565c63;
    --ceg-text-muted: #868d95;
    --ceg-text-on-accent: #ffffff;
    --ceg-text-on-inverse: #f8f9fa;
    --ceg-text-brand: #1e9e7c;

    --ceg-surface-page: #f8f9fa;
    --ceg-surface-default: #f4f6f7;
    --ceg-surface-raised: #ffffff;
    --ceg-surface-inverse: #0e1113;
    --ceg-surface-panel: #0c0e10;

    --ceg-action-default: #17b588;
    --ceg-action-hover: #1e9e7c;
    --ceg-action-emphasis: #2dd4a7;
    --ceg-accent-highlight: #7fe8c8;

    --ceg-border-subtle: #e1e4e8;
    --ceg-border-strong: #868d95;

    --ceg-status-danger: #d92d2d;
    --ceg-status-danger-surface: #fce9e9;
    --ceg-status-warning: #b76e00;
    --ceg-status-warning-surface: #fbf1de;
    --ceg-status-info: #2563eb;
    --ceg-status-info-surface: #e8eefc;
    --ceg-status-success: #17b588;
    --ceg-status-success-surface: #e4f7f0;
  }
}
