/* ==========================================================================
   NOTIFAST 3.0 DESIGN SYSTEM — DESIGN TOKENS
   Archetype: Tactile Papercraft / Muted Crimson & Aqua Green 3.0
   ========================================================================== */

:root {
  /* Lienzo y Superficies — Warm Paper Canvas (Modo Claro) */
  --bg-canvas: #FAF9F6;
  --bg-surface: #FFFFFF;
  --bg-surface-container: #F3EFEA;
  --bg-surface-container-high: #EBE6DF;
  --bg-surface-variant: #F3EFEA;

  /* Micro-Bordes Táctiles (1px optical weight 12-16%) */
  --border-hairline: #E5DFD7;
  --border-subtle: rgba(24, 26, 31, 0.08);

  /* Tintas Tipográficas de Alto Énfasis */
  --text-primary: #181A1F;      /* Tinta Oxford (16.2:1 AAA sobre #FAF9F6) */
  --text-secondary: #4B5563;    /* Grafito Muted (6.8:1 AAA) */
  --text-muted: #6B7280;        /* Grafito Suave */

  /* Identidad Primaria — Muted Crimson / Tenue Ruby */
  --brand-primary: #9E1B32;
  --brand-primary-hover: #801528;
  --brand-primary-light: #FDE8EB;
  --brand-on-primary: #FFFFFF;

  /* Identidad Secundaria — Studio Aqua Green */
  --brand-secondary: #2A7B7B;
  --brand-secondary-hover: #1F6161;
  --brand-secondary-light: #D6F2F0;
  --brand-on-secondary: #FFFFFF;

  /* Estados Semánticos */
  --brand-success: #15803D;      /* Forest Sage (Aprobando) */
  --brand-success-light: #DCFCE7;
  --brand-on-success: #FFFFFF;

  --brand-warning: #D97706;      /* Ámbar Estudio */
  --brand-warning-light: #FEF3C7;

  --brand-error: #B91C1C;        /* Ladrillo Carmesí */
  --brand-error-light: #FEE2E2;

  /* Paleta de Materias (Subject Palette Engine Normalizado) */
  --subject-calculus: #2563EB;
  --subject-physics: #7C3AED;
  --subject-literature: #D97706;
  --subject-chemistry: #059669;
  --subject-history: #B45309;

  /* Tipografía */
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Escala Tipográfica Fluida */
  --text-display: clamp(2.25rem, 5vw, 3.5rem);     /* 36px - 56px */
  --text-headline: clamp(1.75rem, 3.5vw, 2.5rem);  /* 28px - 40px */
  --text-title: clamp(1.25rem, 2vw, 1.5rem);       /* 20px - 24px */
  --text-body: 1rem;                               /* 16px */
  --text-small: 0.875rem;                          /* 14px */
  --text-caption: 0.75rem;                         /* 12px */

  /* Radios de Esquina Táctiles */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 9999px;

  /* Espaciados */
  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;
  --space-3xl: 64px;

  /* Sombras y Elevaciones Táctiles */
  --shadow-tactile: 0 4px 20px -2px rgba(24, 26, 31, 0.05);
  --shadow-hover: 0 12px 32px -4px rgba(24, 26, 31, 0.08);

  /* Transiciones y Físicas */
  --ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-normal: 250ms;
  --duration-slow: 400ms;
}

/* ==========================================================================
   PALETA DE ESTUDIO — SIEMPRE FONDO CLARO (WARM PAPER CANVAS)
   ========================================================================== */
@media (prefers-color-scheme: dark) {
  :root {
    /* Mantenemos fondo claro pergamino para máxima legibilidad según directiva de diseño */
    --bg-canvas: #FAF9F6;
    --bg-surface: #FFFFFF;
    --bg-surface-container: #F3EFEA;
    --bg-surface-container-high: #EBE6DF;
    --border-hairline: #E5DFD7;
    --text-primary: #181A1F;
    --text-secondary: #4B5563;
    --brand-primary: #9E1B32;
    --brand-secondary: #2A7B7B;
    --brand-success: #15803D;
  }
}

/* ==========================================================================
   PREFERENCIA DE MOVIMIENTO REDUCIDO
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-normal: 0ms;
    --duration-slow: 0ms;
  }
}