/* Core Platform Design System (CPDS) — Tokens puente
   Mantiene la API --cp-* usada por app.css, pero deriva los colores de
   ds.css (--color-*, --surface-*, --text-*) para que el tema claro/oscuro
   funcione en toda la app. Cargar DESPUÉS de ds.css. */

[data-bs-theme="light"], [data-bs-theme="dark"] {
  /* Marca → ds.css */
  --cp-primary: var(--color-primary);
  --cp-primary-hover: var(--color-primary-hover);
  --cp-primary-subtle: var(--color-primary-subtle);

  /* Semánticos → ds.css */
  --cp-success: var(--color-success);
  --cp-warning: var(--color-warning);
  --cp-danger: var(--color-danger);
  --cp-info: var(--color-info);

  /* Superficies y texto → ds.css */
  --cp-text: var(--text-primary);
  --cp-text-secondary: var(--text-secondary);
  --cp-bg: var(--surface-body);
  --cp-card: var(--surface-card);
  --cp-border: var(--border-default);

  /* Mapeo a Bootstrap: que TODOS los componentes adopten la paleta */
  --bs-primary: var(--color-primary);
  --bs-body-bg: var(--surface-body);
  --bs-body-color: var(--text-primary);
  --bs-border-color: var(--border-default);
  --bs-link-color: var(--color-primary);
  --bs-link-hover-color: var(--color-primary-hover);
}

:root {
  /* Segundo color de marca CPDS (la escuela puede sobrescribirlo igual que --cp-primary) */
  --cp-secondary: #a06bff;

  /* Degradados de marca (se recalculan si la escuela cambia --cp-primary) */
  --cp-gradient: linear-gradient(120deg, var(--cp-primary) 0%, var(--cp-secondary) 100%);
  /* Degradado atenuado para la barra lateral */
  --cp-sidebar: linear-gradient(180deg,
    color-mix(in srgb, var(--cp-primary) 84%, #0f172a) 0%,
    color-mix(in srgb, var(--cp-secondary) 66%, #0f172a) 100%);

  /* Tipografía CPDS: Inter (texto) + Sora (títulos) */
  --cp-font: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --cp-font-head: 'Sora', 'Inter', system-ui, sans-serif;
  --bs-font-sans-serif: var(--cp-font);

  /* Espaciado (sistema 4px) */
  --cp-sp-1: 4px;  --cp-sp-2: 8px;   --cp-sp-3: 12px; --cp-sp-4: 16px;
  --cp-sp-6: 24px; --cp-sp-8: 32px;  --cp-sp-12: 48px; --cp-sp-16: 64px;

  /* Bordes */
  --cp-radius: 12px;
  --cp-radius-card: 16px;
  --cp-radius-btn: 10px;
  --cp-radius-input: 10px;

  /* Sombras */
  --cp-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --cp-shadow-md: 0 4px 12px rgba(15, 23, 42, .08);
  --cp-shadow-lg: 0 10px 30px rgba(15, 23, 42, .12);

  /* Animaciones */
  --cp-anim-fast: 150ms;
  --cp-anim: 200ms;
}

/* Sombras más profundas en tema oscuro */
[data-bs-theme="dark"] {
  --cp-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
  --cp-shadow-md: 0 4px 12px rgba(0, 0, 0, .4);
  --cp-shadow-lg: 0 10px 30px rgba(0, 0, 0, .5);
}