/* ============================================================
   Système de tokens partagés — App d'analyse Énergie
   ============================================================ */

:root {
  /* Typo */
  --font-sans: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", monospace;
  --font-serif: "IBM Plex Serif", Georgia, serif;

  /* Type scale */
  --text-xs:   10px;
  --text-sm:   11px;
  --text-base: 13px;
  --text-md:   15px;
  --text-lg:   18px;
  --text-xl:   22px;
  --text-2xl:  28px;
  --text-3xl:  36px;

  /* Line height */
  --leading-tight:  1.2;
  --leading-base:   1.4;
  --leading-relaxed: 1.6;

  /* Density */
  --gap-xs: 4px;
  --gap-sm: 8px;
  --gap-md: 12px;
  --gap-lg: 16px;
  --gap-xl: 24px;
  --gap-2xl: 32px;
  --gap-3xl: 48px;

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 14px;

  /* Shadows */
  --shadow-sm:  0 1px 3px oklch(0.22 0.04 270 / 0.08), 0 1px 2px oklch(0.22 0.04 270 / 0.04);
  --shadow-md:  0 4px 16px oklch(0.22 0.04 270 / 0.10), 0 1px 4px oklch(0.22 0.04 270 / 0.06);
  --shadow-lg:  0 8px 32px oklch(0.22 0.04 270 / 0.14), 0 2px 8px oklch(0.22 0.04 270 / 0.08);
  --shadow-card: 0 1px 3px oklch(0.22 0.04 270 / 0.06);

  /* Transitions */
  --ease-default: 150ms ease-out;
  --ease-appear:  220ms cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring:  400ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Focus ring */
  --focus-ring: 0 0 0 3px oklch(0.32 0.12 270 / 0.25);
}

/* Compact density override */
[data-density="compact"] {
  --gap-xs: 2px;
  --gap-sm: 6px;
  --gap-md: 8px;
  --gap-lg: 12px;
  --gap-xl: 16px;
  --gap-2xl: 22px;
}

/* ===== Palette A — Trading desk (dark graphite) ===== */
.palette-a {
  --bg: oklch(0.18 0.01 250);
  --bg-elev: oklch(0.215 0.012 250);
  --bg-elev-2: oklch(0.255 0.014 250);
  --border: oklch(0.32 0.012 250);
  --border-soft: oklch(0.265 0.012 250);
  --fg: oklch(0.95 0.005 250);
  --fg-muted: oklch(0.72 0.012 250);
  --fg-dim: oklch(0.55 0.012 250);
  --accent: oklch(0.78 0.15 75);    /* ambre */
  --accent-fg: oklch(0.18 0.01 250);
  --pos: oklch(0.78 0.15 155);      /* vert */
  --neg: oklch(0.7 0.18 25);        /* rouge */
  --info: oklch(0.72 0.13 240);     /* bleu data */
  --warn: oklch(0.82 0.15 95);      /* jaune */
  color-scheme: dark;
}

/* ===== Palette B — Executive cockpit (light editorial) ===== */
.palette-b {
  --bg: oklch(0.985 0.006 95);
  --bg-elev: oklch(1 0 0);
  --bg-elev-2: oklch(0.965 0.008 95);
  --border: oklch(0.88 0.012 95);
  --border-soft: oklch(0.94 0.008 95);
  --fg: oklch(0.18 0.015 240);
  --fg-muted: oklch(0.42 0.012 240);
  --fg-dim: oklch(0.62 0.01 240);
  --accent: oklch(0.45 0.08 155);    /* vert profond */
  --accent-fg: oklch(0.99 0.005 95);
  --pos: oklch(0.55 0.13 155);
  --neg: oklch(0.55 0.18 25);
  --info: oklch(0.5 0.13 240);
  --warn: oklch(0.65 0.15 70);
  color-scheme: light;
}

/* ===== Palette C — Command center (duotone slate + indigo) ===== */
.palette-c {
  --bg: oklch(0.96 0.012 250);
  --bg-elev: oklch(1 0 0);
  --bg-elev-2: oklch(0.93 0.014 250);
  --border: oklch(0.86 0.014 250);
  --border-soft: oklch(0.92 0.012 250);
  --fg: oklch(0.22 0.04 270);
  --fg-muted: oklch(0.45 0.04 270);
  --fg-dim: oklch(0.50 0.025 270);
  --accent: oklch(0.32 0.12 270);    /* indigo profond */
  --accent-fg: oklch(0.99 0.005 250);
  --pos: oklch(0.55 0.13 155);
  --neg: oklch(0.55 0.18 25);
  --info: oklch(0.5 0.13 240);
  --heat-1: oklch(0.94 0.04 80);
  --heat-2: oklch(0.85 0.1 60);
  --heat-3: oklch(0.7 0.16 40);
  --heat-4: oklch(0.55 0.18 25);
  --heat-5: oklch(0.4 0.18 20);
  color-scheme: light;
}

/* ===== Reset / shared ===== */
.app-shell {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--fg);
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: -0.005em;
  height: 100%;
  width: 100%;
  font-feature-settings: "ss01", "cv11";
}

.app-shell *,
.app-shell *::before,
.app-shell *::after {
  box-sizing: border-box;
}

.app-shell button {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.mono { font-family: var(--font-mono); font-feature-settings: "tnum", "zero"; }
.tnum { font-variant-numeric: tabular-nums; }
.tag-pos { color: var(--pos); }
.tag-neg { color: var(--neg); }
.tag-info { color: var(--info); }

/* Scrollbars discrètes */
.app-shell ::-webkit-scrollbar { width: 8px; height: 8px; }
.app-shell ::-webkit-scrollbar-track { background: transparent; }
.app-shell ::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }

/* SVG placeholder pattern */
.placeholder-stripes {
  background-image: repeating-linear-gradient(
    -45deg,
    var(--border-soft) 0 6px,
    transparent 6px 12px
  );
}