/**
 * PRIMERA FUENTE - Design System Tokens
 * Versión 1.4 — Adaptación Estricta al Manual de Marca v1.1
 * 
 * Filosofía: "La certeza antes que la velocidad. No publicamos lo que se dice; publicamos lo que está confirmado."
 * 
 * PALETA CROMÁTICA OFICIAL (Manual de Marca Sección 33 y 34):
 * - Azul Cobalto:   #1746A2 (Color principal de identidad)
 * - Gris Carbón:    #252A31 (Color estructural)
 * - Cobre:          #B66A3C (Color de acento)
 * - Blanco:         #FFFFFF (Color principal de fondo)
 * - Gris Muy Claro: #F4F5F7 (Fondos secundarios)
 * - Gris Medio:     #8A9199 (Información auxiliar)
 * - Rojo Funcional: #D9383A (Exclusivo para emergencias, alertas y última hora)
 */

:root {
  /* ==========================================================================
     01. COLORES PRIMARIOS Y CORPORATIVOS (MANUAL DE MARCA SECCIÓN 33 - LOGO V1.5)
     ========================================================================== */
  --pf-cobalt: #004F9F;
  --pf-cobalt-rgb: 0, 79, 159;
  --pf-cobalt-light: #1A6AC5;
  --pf-cobalt-dark: #00366D;
  --pf-cobalt-glow: rgba(0, 79, 159, 0.45);

  --pf-carbon: #1E2530;
  --pf-carbon-rgb: 30, 37, 48;
  --pf-carbon-dark: #12161D;
  --pf-carbon-surface: #181D26;
  --pf-carbon-card: #1E2530;
  --pf-carbon-hover: #262E3B;

  --pf-copper: #BA6837;
  --pf-copper-rgb: 186, 104, 55;
  --pf-copper-light: #D47E4B;
  --pf-copper-dark: #914F27;
  --pf-copper-glow: rgba(186, 104, 55, 0.4);

  --pf-white: #FFFFFF;
  --pf-gray-light: #F4F5F7;
  --pf-gray-medium: #8A9199;
  
  /* Color Funcional de Alerta (Sección 34 - Exclusivo Alertas / Última Hora) */
  --pf-alert-red: #D9383A;
  --pf-alert-red-glow: rgba(217, 56, 58, 0.4);

  /* Variables Semánticas Universales */
  --pf-color-primary: var(--pf-cobalt);
  --pf-color-structural: var(--pf-carbon);
  --pf-color-accent: var(--pf-copper);
  --pf-color-white: var(--pf-white);
  --pf-color-bg-secondary: var(--pf-gray-light);
  --pf-color-auxiliary: var(--pf-gray-medium);
  --pf-color-alert: var(--pf-alert-red);

  /* ==========================================================================
     02. TIPOGRAFÍAS OFICIALES (MANUAL DE MARCA SECCIÓN 35)
     ========================================================================== */
  --pf-font-primary: 'Montserrat', system-ui, -apple-system, sans-serif;
  --pf-font-secondary: 'Roboto', system-ui, -apple-system, sans-serif;
  --pf-font-mono: 'JetBrains Mono', ui-monospace, Menlo, Monaco, monospace;

  /* Jerarquías Tipográficas */
  --pf-fs-hero: clamp(2.2rem, 5.5vw, 4.4rem);
  --pf-fs-title: clamp(1.6rem, 3.5vw, 2.6rem);
  --pf-fs-section: clamp(1.2rem, 2vw, 1.7rem);
  --pf-fs-card: 1.15rem;
  --pf-fs-body: 1rem;
  --pf-fs-aux: 0.85rem;
  --pf-fs-tech: 0.72rem;

  /* Trackings */
  --pf-tracking-tight: -0.02em;
  --pf-tracking-normal: 0em;
  --pf-tracking-wide: 0.12em;
  --pf-tracking-tech: 0.22em;

  /* Radios de Precisión & Geometría Porsche */
  --pf-radius-sharp: 2px;
  --pf-radius-sm: 4px;
  --pf-radius-md: 8px;
  --pf-radius-full: 9999px;
  --pf-porsche-radius: 4px;
  --pf-porsche-radius-card: 6px;

  /* Porsche Design System Motion Easing & Durations */
  --pf-porsche-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --pf-porsche-ease-out: cubic-bezier(0, 0, 0.2, 1);
  --pf-porsche-ease-in: cubic-bezier(0.4, 0, 0.5, 1);
  --pf-porsche-duration-short: 0.25s;
  --pf-porsche-duration-moderate: 0.4s;
  --pf-porsche-duration-long: 0.6s;
  --pf-porsche-hover-scale: scale3d(1.04, 1.04, 1.04);

  /* ==========================================================================
     03. TEMA 1: CINEMATOGRÁFICO DE ALTA PRECISIÓN (DARK RIMAC STYLE)
     ========================================================================== */
  --pf-theme-bg: #14171C;
  --pf-theme-surface: #1B2027;
  --pf-theme-card: #252A31;
  --pf-theme-text-primary: #FFFFFF;
  --pf-theme-text-secondary: #CBD5E1;
  --pf-theme-text-auxiliary: #8A9199;
  --pf-theme-border: rgba(255, 255, 255, 0.09);
  --pf-theme-border-highlight: rgba(23, 70, 162, 0.6);
  --pf-theme-border-copper: rgba(182, 106, 60, 0.6);
  --pf-theme-topbar-bg: rgba(20, 23, 28, 0.9);
  --pf-theme-input-bg: #181B20;

  /* Alias Legacy para retrocompatibilidad con styles.css */
  --pf-dark-base: var(--pf-theme-bg);
  --pf-dark-surface: var(--pf-theme-surface);
  --pf-dark-card: var(--pf-theme-card);
  --pf-border-hairline: var(--pf-theme-border);
  --pf-color-primary-glow: var(--pf-cobalt-glow);
  --pf-color-accent-glow: var(--pf-copper-glow);
}

/* ==========================================================================
   04. TEMA 2: EDITORIAL CANÓNICO (BLANCO SECCIÓN 33)
   "Blanco #FFFFFF: Color principal de fondo"
   "Gris Muy Claro #F4F5F7: Fondos secundarios"
   "Gris Carbón #252A31: Color estructural"
   ========================================================================== */
html.pf-theme-editorial {
  --pf-theme-bg: #FFFFFF;
  --pf-theme-surface: #F4F5F7;
  --pf-theme-card: #FFFFFF;
  --pf-theme-text-primary: #252A31;
  --pf-theme-text-secondary: #4A5568;
  --pf-theme-text-auxiliary: #8A9199;
  --pf-theme-border: rgba(37, 42, 49, 0.12);
  --pf-theme-border-highlight: #1746A2;
  --pf-theme-border-copper: #B66A3C;
  --pf-theme-topbar-bg: rgba(255, 255, 255, 0.95);
  --pf-theme-input-bg: #F4F5F7;

  /* Alias Legacy para retrocompatibilidad en modo claro */
  --pf-dark-base: var(--pf-theme-bg);
  --pf-dark-surface: var(--pf-theme-surface);
  --pf-dark-card: var(--pf-theme-card);
  --pf-border-hairline: var(--pf-theme-border);
  --pf-color-white: #252A31; /* Invertir blanco primario a texto Carbón */
}
