/*
 * Administra — tokens de marca (generado desde tokens.json, versión 3: «Menta y pizarra»).
 * Para materiales de marca y sitios fuera de la plataforma. La aplicación no importa este archivo: sus temas
 * (frontend/src/platform/themes/themes.css) derivan de los mismos valores y sirven las fuentes localmente.
 * Las fuentes las enlaza cada página: Plus Jakarta Sans (400, 600, 800) y JetBrains Mono (500, 600) desde Google Fonts.
 * El tema oscuro sigue los mismos identificadores que la plataforma: data-theme="administra-dark" lo fuerza,
 * data-theme="administra-light" fuerza el claro y sin atributo se sigue al dispositivo.
 */

:root {
  --surface: #F3F5F7;
  --surface-raised: #FFFFFF;
  --line: #D9DEE4;
  --ink: #182430;
  --ink-muted: #546270;
  --primario: #334E68;
  --on-primario: #FFFFFF;
  --primario-soft: #E3EAF1;
  --acento: #1AA584;
  --acento-texto: #1E7A4C;
  --on-acento: #0F1A14;
  --profundo: #1B2A3A;
  --on-profundo: #FFFFFF;
  --positivo: #1E7A4C;
  --negativo: #B3261E;
  --alerta: #8A5600;
  --info: #1F5FA8;
  --font-display: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --shadow-sm: 0 1px 2px #18243014;
  --shadow-lg: 0 8px 24px -4px #18243029;
  --focus-ring: 0 0 0 2px #F3F5F7, 0 0 0 4px #334E68;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="administra-light"]) {
    --surface: #0F161D;
    --surface-raised: #172028;
    --line: #2A3642;
    --ink: #E9EEF3;
    --ink-muted: #A4B1BE;
    --primario: #A9C1DA;
    --on-primario: #0F161D;
    --primario-soft: #243444;
    --acento: #70E3C9;
    --acento-texto: #70E3C9;
    --on-acento: #0F161D;
    --profundo: #090E14;
    --on-profundo: #FFFFFF;
    --positivo: #5CC995;
    --negativo: #FF8B78;
    --alerta: #F2B840;
    --info: #7DB2F0;
    --shadow-sm: 0 1px 3px #00000099;
    --shadow-lg: 0 12px 28px -4px #000000cc;
    --focus-ring: 0 0 0 2px #0F161D, 0 0 0 4px #A9C1DA;
    color-scheme: dark;
  }
}

:root[data-theme="administra-dark"] {
  --surface: #0F161D;
  --surface-raised: #172028;
  --line: #2A3642;
  --ink: #E9EEF3;
  --ink-muted: #A4B1BE;
  --primario: #A9C1DA;
  --on-primario: #0F161D;
  --primario-soft: #243444;
  --acento: #70E3C9;
  --acento-texto: #70E3C9;
  --on-acento: #0F161D;
  --profundo: #090E14;
  --on-profundo: #FFFFFF;
  --positivo: #5CC995;
  --negativo: #FF8B78;
  --alerta: #F2B840;
  --info: #7DB2F0;
  --shadow-sm: 0 1px 3px #00000099;
  --shadow-lg: 0 12px 28px -4px #000000cc;
  --focus-ring: 0 0 0 2px #0F161D, 0 0 0 4px #A9C1DA;
  color-scheme: dark;
}

/* Estilos de texto */
.text-display-xl { font-family: var(--font-display); font-size: 56px; line-height: 56px; font-weight: 800; letter-spacing: -0.03em; }
.text-display { font-family: var(--font-display); font-size: 32px; line-height: 36px; font-weight: 800; letter-spacing: -0.02em; }
.text-heading { font-family: var(--font-sans); font-size: 20px; line-height: 28px; font-weight: 600; }
.text-body { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.text-body-strong { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 600; }
.text-caption { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
.text-cifra { font-family: var(--font-mono); font-size: 14px; line-height: 20px; font-weight: 500; font-variant-numeric: tabular-nums; }
.text-cifra-lg { font-family: var(--font-mono); font-size: 28px; line-height: 32px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }