/*
 * Veriko Docs — design tokens (PORT desde "Fase L" a la identidad Veriko).
 *
 * Esta hoja reemplaza el sistema genérico azul/monospace anterior por el
 * cascade de marca Veriko del sistema principal (admin/app):
 *   primitives → semantics/brand → docs-adapter.
 *
 * Los NOMBRES de variable son los mismos que ya consumen los componentes
 * (layout/sidebar/breadcrumb/markdoc/schemas), de modo que el reskin no
 * requiere reescribir esos archivos salvo el sidebar oscuro.
 *
 * Marca: zafiro #2f4f99 · neutrales achromáticos · Inter (UI/prosa) +
 * JetBrains Mono (superficies técnicas, = --font-display). Estados con los
 * valores AA bloqueados de Veriko (verde #15803d, danger #dc2626,
 * warning #b45309). Sidebar OSCURO #0a0a0a (firma del shell Veriko).
 *
 * Cargar DESPUÉS de /styles/fonts.css (que declara las @font-face).
 */

:root {
  /* ── Colors — light ── */
  --color-bg: #fafafa;
  --color-bg-subtle: #f5f5f5;
  --color-bg-hover: #ededed;
  --color-text: #171717;
  --color-text-muted: #525252;
  --color-text-subtle: #737373;
  --color-border: #e5e5e5;
  --color-border-strong: #d4d4d4;
  --color-link: #294385;          /* Veriko link / surface = AAA */
  --color-link-hover: #25386b;
  --color-code-bg: #f5f5f5;
  --color-code-text: #171717;

  /* ── Brand accent (zafiro) ── */
  --color-primary: #2f4f99;
  --color-primary-hover: #294385;
  --color-primary-light: #eef2fb;
  --color-danger: #dc2626;
  --color-warning: #b45309;
  --color-success: #15803d;

  /* ── Sidebar (dark · #0a0a0a) ── */
  --color-bg-sidebar: #0a0a0a;
  --color-sidebar-text: #f2f2f2;        /* nivel 1: ítems / summaries (casi blanco) */
  --color-sidebar-subitem: #b8b8b8;     /* nivel 2: enlaces dentro de carpeta (más tenue) */
  --color-sidebar-text-active: #ffffff;
  --color-sidebar-section: #9a9a9a;     /* encabezado de sección (label tenue, contrasta con ítems) */
  --color-sidebar-icon: #8f8f8f;
  --color-sidebar-item-hover: rgba(255, 255, 255, 0.08);
  --color-sidebar-item-active: rgba(255, 255, 255, 0.12);
  --color-sidebar-divider: rgba(255, 255, 255, 0.08);

  /* ── Method badges — Veriko palette (dual -base/-fg/-bg, AA en bg) ── */
  --badge-get-base: #2f4f99;  --badge-get-fg: #294385;  --badge-get-bg: #eef2fb;
  --badge-post-base: #15803d; --badge-post-fg: #15803d; --badge-post-bg: #f0fdf4;
  --badge-put-base: #b45309;  --badge-put-fg: #b45309;  --badge-put-bg: #fffbeb;
  --badge-patch-base: #7e22ce;--badge-patch-fg: #7e22ce;--badge-patch-bg: #faf5ff;
  --badge-delete-base: #dc2626;--badge-delete-fg: #b91c1c;--badge-delete-bg: #fef2f2;

  --badge-2xx-base: #15803d; --badge-2xx-fg: #15803d; --badge-2xx-bg: #f0fdf4;
  --badge-3xx-base: #2f4f99; --badge-3xx-fg: #294385; --badge-3xx-bg: #eef2fb;
  --badge-4xx-base: #b45309; --badge-4xx-fg: #b45309; --badge-4xx-bg: #fffbeb;
  --badge-5xx-base: #dc2626; --badge-5xx-fg: #b91c1c; --badge-5xx-bg: #fef2f2;

  /* ── Callouts ── */
  --callout-info-border: #2f4f99;    --callout-info-bg: #eef2fb;
  --callout-warning-border: #b45309; --callout-warning-bg: #fffbeb;
  --callout-danger-border: #dc2626;  --callout-danger-bg: #fef2f2;
  --callout-success-border: #15803d; --callout-success-bg: #f0fdf4;

  /* ── Changelog callouts ── */
  --changelog-callout-breaking-border: #dc2626;     --changelog-callout-breaking-bg: #fef2f2;
  --changelog-callout-deprecation-border: #b45309;  --changelog-callout-deprecation-bg: #fffbeb;
  --changelog-callout-security-border: #7e22ce;     --changelog-callout-security-bg: #faf5ff;
  --changelog-callout-tip-border: #15803d;          --changelog-callout-tip-bg: #f0fdf4;

  /* ── Changelog category/severity badges ── */
  --changelog-badge-feat-bg: #eef2fb;        --changelog-badge-feat-fg: #294385;
  --changelog-badge-fix-bg: #f0fdf4;         --changelog-badge-fix-fg: #15803d;
  --changelog-badge-breaking-bg: #fef2f2;    --changelog-badge-breaking-fg: #b91c1c;
  --changelog-badge-deprecation-bg: #fffbeb; --changelog-badge-deprecation-fg: #b45309;
  --changelog-badge-security-bg: #faf5ff;    --changelog-badge-security-fg: #7e22ce;

  /* ── Changelog cards ── */
  --changelog-card-border: #e5e5e5;
  --changelog-card-hover-border: #737373;

  /* ── Typography — Inter (UI/prosa) + JetBrains Mono (técnico) ── */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', Consolas, 'Liberation Mono', monospace;
  --font-display: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', Consolas, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  /* Fluid heading sizes: shrink with the viewport (phones) up to the
     original desktop size. Only consumed by h1/h2/h3 + changelog headings. */
  --text-2xl: clamp(1.25rem, 1.05rem + 1vw, 1.5rem);
  --text-3xl: clamp(1.4rem, 1.05rem + 1.7vw, 1.875rem);
  --text-4xl: clamp(1.75rem, 1.3rem + 2.2vw, 2.25rem);

  --leading-tight: 1.25;
  --leading-snug: 1.375;
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ── Spacing ── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* ── Radii (Veriko 4/6/8) ── */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-pill: 999px;

  /* ── Shadows (light) ── */
  --shadow-sm: 0 1px 2px hsl(220 9% 13% / 0.05);
  --shadow-md: 0 4px 12px hsl(220 9% 13% / 0.08);
  --shadow-lg: 0 12px 32px hsl(220 9% 13% / 0.12);

  /* ── Layout ── */
  --sidebar-width: 280px;
  --content-max-width: 880px;
  --content-max-width-prose: 70ch;
  --header-height: 64px;

  /* ── Transitions ── */
  --transition-fast: 120ms ease;
  --transition-base: 200ms ease;
}

[data-theme="dark"] {
  --color-bg: #101116;
  --color-bg-subtle: #1c1e24;
  --color-bg-hover: #23262e;
  --color-text: #ededed;
  --color-text-muted: #b5b5b5;
  --color-text-subtle: #8a8a8a;
  --color-border: #2a2c33;
  --color-border-strong: #3a3d45;
  --color-link: #8aa6e0;
  --color-link-hover: #a9bff0;
  --color-code-bg: #1c1e24;
  --color-code-text: #ededed;

  --color-primary-light: #1b2440;

  /* Sidebar ya es oscuro; se mantiene igual en dark. */

  /* Badge bg lifts para seguir visibles sobre superficie oscura */
  --badge-get-bg: #1b2440;
  --badge-post-bg: #10231a;
  --badge-put-bg: #241a0d;
  --badge-patch-bg: #241430;
  --badge-delete-bg: #2a1414;
  --badge-2xx-bg: #10231a;
  --badge-3xx-bg: #1b2440;
  --badge-4xx-bg: #241a0d;
  --badge-5xx-bg: #2a1414;

  --badge-get-fg: #9db4e8;
  --badge-post-fg: #5cc98a;
  --badge-put-fg: #e0a24a;
  --badge-patch-fg: #c79df0;
  --badge-delete-fg: #f08a8a;
  --badge-2xx-fg: #5cc98a;
  --badge-3xx-fg: #9db4e8;
  --badge-4xx-fg: #e0a24a;
  --badge-5xx-fg: #f08a8a;

  --callout-info-bg: #1b2440;
  --callout-warning-bg: #241a0d;
  --callout-danger-bg: #2a1414;
  --callout-success-bg: #10231a;

  --changelog-callout-breaking-bg: #2a1414;
  --changelog-callout-deprecation-bg: #241a0d;
  --changelog-callout-security-bg: #241430;
  --changelog-callout-tip-bg: #10231a;

  --changelog-badge-feat-bg: #1b2440;        --changelog-badge-feat-fg: #9db4e8;
  --changelog-badge-fix-bg: #10231a;         --changelog-badge-fix-fg: #5cc98a;
  --changelog-badge-breaking-bg: #2a1414;    --changelog-badge-breaking-fg: #f08a8a;
  --changelog-badge-deprecation-bg: #241a0d; --changelog-badge-deprecation-fg: #e0a24a;
  --changelog-badge-security-bg: #241430;    --changelog-badge-security-fg: #c79df0;

  --changelog-card-border: #2a2c33;
  --changelog-card-hover-border: #3a3d45;

  --shadow-sm: 0 1px 2px hsl(0 0% 0% / 0.3);
  --shadow-md: 0 4px 12px hsl(0 0% 0% / 0.4);
  --shadow-lg: 0 12px 32px hsl(0 0% 0% / 0.5);
}

/* Reduced motion (WCAG 2.3.3) */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
