/* ============================================================
   NXT Design Tokens — extraído de projetos/terminal.net.br/src/styles.css
   Single source of truth. Herdado por catalogo e docs.
   ============================================================ */

/* Geist Sans + Geist Mono via @fontsource (jsdelivr CDN) */
@import url('https://cdn.jsdelivr.net/npm/@fontsource-variable/geist@5.2.5/index.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource-variable/geist-mono@5.2.5/index.css');

:root {
  /* ─── radius (shadcn new-york base) ─── */
  --radius: 0.625rem;
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);

  /* ─── surfaces (neutral zinc, zero chroma — sem tint azul) ─── */
  --background: oklch(0.14 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.21 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.21 0 0);
  --popover-foreground: oklch(0.985 0 0);

  --primary: oklch(0.93 0 0);
  --primary-foreground: oklch(0.21 0 0);
  --secondary: oklch(0.28 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.28 0 0);
  --muted-foreground: oklch(0.71 0 0);
  --accent: oklch(0.28 0 0);
  --accent-foreground: oklch(0.985 0 0);

  /* ─── NXT signature accent — lime #deff3f ─── */
  /* único saturado: ring, selection, selected states, CTAs */
  --nxt: oklch(0.92 0.20 110);
  --nxt-fg: oklch(0.16 0 0);
  --ring: var(--nxt);
  --destructive: oklch(0.704 0.191 22.216);

  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);

  /* ─── icon tokens (match pilot) ─── */
  /* Ícones em chrome (topbar, toolbar, tablist) usam --icon em vez de
     --foreground (branco-puro 0.985) pra evitar contraste agressivo.
     Hover/foco/ativo restaura --foreground. */
  --icon: oklch(0.82 0 0);
  --icon-muted: oklch(0.62 0 0);

  /* ─── chart palette ─── */
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);

  /* ─── sidebar surface ─── */
  --sidebar: oklch(0.21 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(1 0 0 / 10%);

  /* ─── easing ─── */
  --ease-expo-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-quart-out: cubic-bezier(0.25, 1, 0.5, 1);

  /* ─── layout ─── */
  --titlebar-h: 2.5rem;

  /* ─── typography ─── */
  --font-sans: 'Geist Variable', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'Geist Mono Variable', 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --font-display: 'Geist Variable', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ─── NXT símbolo: white by default (dark theme), black when light ─── */
.nxt-logo-light { display: none !important; }
[data-theme="nxt-light"] .nxt-logo-dark { display: none !important; }
[data-theme="nxt-light"] .nxt-logo-light { display: inline-block !important; }

/* ─── Surface nav (catálogo / docs / assets) — chrome compartilhado ─── */
.nxt-surface-nav {
  display: flex;
  gap: 2px;
  margin-left: auto;
  margin-right: 0.5rem;
  align-items: center;
  order: 50;
  padding: 3px;
  background: oklch(from var(--background) l c h / 0.5);
  border: 1px solid var(--border);
  border-radius: calc(var(--radius-md) + 2px);
}
.nxt-surface-nav a {
  color: var(--muted-foreground);
  text-decoration: none !important;
  border: none !important;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 4px 10px;
  border-radius: var(--radius-md);
  transition:
    color 150ms var(--ease-quart-out),
    background 150ms var(--ease-quart-out);
}
.nxt-surface-nav a:hover {
  color: var(--foreground) !important;
  background: oklch(from var(--foreground) l c h / 0.06);
}
.nxt-surface-nav a.active {
  color: var(--foreground) !important;
  background: var(--card);
  box-shadow:
    inset 0 1px 0 0 oklch(from var(--foreground) l c h / 0.05),
    0 1px 2px oklch(from var(--background) l c h / 0.4);
}

/* ─── Light theme (data-theme="nxt-light") ─── */
[data-theme="nxt-light"] {
  --background: oklch(0.98 0 0);
  --foreground: oklch(0.16 0 0);
  --card: oklch(0.96 0 0);
  --card-foreground: oklch(0.16 0 0);
  --popover: oklch(0.99 0 0);
  --popover-foreground: oklch(0.16 0 0);
  --primary: oklch(0.20 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.92 0 0);
  --secondary-foreground: oklch(0.16 0 0);
  --muted: oklch(0.94 0 0);
  --muted-foreground: oklch(0.40 0 0);
  --accent: oklch(0.92 0 0);
  --accent-foreground: oklch(0.16 0 0);
  --nxt: oklch(0.55 0.20 110);
  --destructive: oklch(0.55 0.22 22);
  --border: oklch(0 0 0 / 12%);
  --input: oklch(0 0 0 / 18%);
  --sidebar: oklch(0.96 0 0);
  --sidebar-foreground: oklch(0.16 0 0);
  --sidebar-border: oklch(0 0 0 / 12%);
  --icon: oklch(0.30 0 0);
  --icon-muted: oklch(0.50 0 0);
}

/* ─── chrome icons herdam --icon, hover restaura --foreground ─── */
header svg,
header img.icon,
.nxt-surface-nav svg,
[role="toolbar"] svg,
.md-header svg {
  color: var(--icon);
  transition: color 150ms var(--ease-quart-out);
}
header svg:hover,
header button:hover svg,
.nxt-surface-nav a:hover svg,
[role="toolbar"] button:hover svg,
.md-header button:hover svg {
  color: var(--foreground);
}
