/* ATLAS V6 — Design Token Override
   Replaces V5 dark-cyber tokens with warm enterprise palette.
   Extracted from atlas-v6-mockup/index.html.
   Load AFTER jarvis.css to override. */

:root {
  /* === CORE SURFACE TOKENS === */
  --bg: #f6f3ec;
  --bg2: #fbfaf7;
  --bg3: #ebe7de;
  --surface: #fffdf8;
  --surface-2: #ebe7de;
  --surface-3: #f0eee8;
  --panel: #fffdf8;
  --panel2: #ebe7de;
  --line: #d7d0c3;
  --line-strong: #c4b9a8;
  --border: #d7d0c3;
  --border2: #ebe7de;

  /* === TYPOGRAPHY COLOR === */
  --ink: #101722;
  --text: #101722;
  --muted: #647184;
  --soft: #647184;
  --faint: #8a95a3;
  --text-base: #101722;
  --text-dim: #647184;
  --text-muted: #647184;
  --text-meta: #8a95a3;

  /* === ACCENT === */
  --champagne: #c18a25;
  --champagne-soft: #fbecd0;
  --gold: #c18a25;
  --accent: #c18a25;
  --teal: #0f857c;
  --teal-soft: #d8f2ee;
  --blue: #2f66c3;
  --blue-soft: #e0e9fb;
  --rose: #ca3f6b;
  --rose-soft: #fde1ea;

  /* === SEMANTIC STATUS === */
  --good: #2e8b57;
  --good-soft: #dff2e7;
  --warn: #c18a25;
  --warn-soft: #fbecd0;
  --bad: #ca3f6b;
  --bad-soft: #fde1ea;

  /* === NAV (sidebar) === */
  --nav: #141b22;
  --nav-2: #1d2630;
  --nav-text: #edf4fb;
  --nav-muted: #9fb0bf;
  --paper: #f6f3ec;

  /* === SHADOW & ELEVATION === */
  --shadow: 0 18px 44px rgba(29,24,14,.11);
  --soft-shadow: 0 10px 24px rgba(29,24,14,.07);
  --card-shadow: 0 10px 24px rgba(29,24,14,.07);

  /* === TYPOGRAPHY SCALE === */
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base-size: 15px;
  --text-lg: 16px;
  --text-xl: 18px;
  --text-2xl: 22px;
  --text-3xl: 28px;
  --text-4xl: 32px;
  --font-display: "Aptos Display", Inter, "Segoe UI", system-ui, sans-serif;
  --font-ui: "Aptos", Inter, "Segoe UI", system-ui, sans-serif;
  --font-mono: "Cascadia Mono", "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  --display: var(--font-display);
  --sans: var(--font-ui);
  --mono: var(--font-mono);

  /* === RADIUS === */
  --radius: 8px;
  --radius-sm: 6px;
  --radius-lg: 12px;
  --radius-pill: 999px;
  --rad: 8px;
  --v6-radius: 8px;

  /* === LAYOUT === */
  --sidebar-width: 286px;
  --topbar-height: 76px;
}

/* BODY — light mode baseline (V6 overrides V5's dark default) */
body, html {
  background:
    linear-gradient(90deg, rgba(20,27,34,.035) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(180deg, #fbfaf7, #f6f3ec);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--text-base-size);
  line-height: 1.42;
}

/* Only apply grid background in light mode or when NOT overridden */
[data-theme="light"] body, body:not([data-theme="dark"]) {
  background:
    linear-gradient(90deg, rgba(20,27,34,.035) 1px, transparent 1px) 0 0 / 80px 80px,
    linear-gradient(180deg, #fbfaf7, #f6f3ec);
}

/* V6 2026-06-23: dark-theme override retired. ATLAS is now single-theme —
   a dark command rail over a light / cream work surface. The old
   [data-theme="dark"] palette block was removed so the warm enterprise
   surface is the only render path. Do not re-introduce a dark variant. */

/* ── V6 polish tokens + skeleton (2026-06-28 design audit) ───────────────────
   Enterprise-calm card elevation (Linear / Ramp / Attio grade). The prior card
   shadow (0 10px 24px) read as a "floating" card; these two-layer subtle shadows
   sit flush on the cream surface with the 1px border carrying definition. Kept
   warm-tinted (rgba 29,24,14) — faithful to the V6 mockup's warm shadow language
   rather than the cold rgba(0,0,0) generic. Named aliases expose the tokens the
   V6 system "should" surface (--shadow-card / --radius-card / --surface-cream). */
:root {
  --surface-cream: #f6f3ec;                 /* warm paper alias */
  --radius-card: 8px;                        /* alias of --radius */
  --shadow-card: 0 1px 2px rgba(29,24,14,.05), 0 1px 3px rgba(29,24,14,.08);
  --shadow-card-hover: 0 6px 16px rgba(29,24,14,.10), 0 2px 6px rgba(29,24,14,.06);
}

/* Skeleton shimmer — drop .v6-skeleton on a placeholder block while a panel
   fetches; reads as "loading", never as broken/empty. */
@keyframes v6-shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
.v6-skeleton {
  background: linear-gradient(90deg, #f0ede9 25%, #e8e4df 50%, #f0ede9 75%);
  background-size: 200% 100%;
  animation: v6-shimmer 1.5s infinite;
  border-radius: 4px;
}
