/**
 * Campus Latino Real — Tokens de diseño.
 * Paleta institucional de Colegio Latino aplicada a la plataforma real
 * (dashboard claro, superficies blancas, azul y verde como acentos).
 * Reutilizado responsablemente desde CAMPUS LATINO MOCK (identidad
 * visual, sin lógica ni datos simulados).
 */
:root {
  /* ---- Marca ---- */
  --color-blue: #023c90;
  --color-blue-deep: #012455;
  --color-blue-soft: #e7edf9;
  --color-green: #bcf568;
  --color-green-deep: #4f8a1a;
  --color-green-soft: #eefadd;

  /* ---- Superficies ---- */
  --color-white: #ffffff;
  --color-surface: #ffffff;
  --color-surface-alt: #f7f9fc;
  --color-surface-muted: #eef1f6;
  --color-border: #e1e6ee;
  --color-border-strong: #c7cede;

  /* ---- Texto ---- */
  --color-text: #16233d;
  --color-text-secondary: #5b6478;
  --color-text-muted: #8891a1;
  --color-text-on-blue: #ffffff;
  --color-text-on-green: #123a02;

  /* ---- Estado ---- */
  --color-success: #2f8f4e;
  --color-success-bg: #e7f6ec;
  --color-warning: #a9760a;
  --color-warning-bg: #fbf1dc;
  --color-danger: #b3261e;
  --color-danger-bg: #fbe9e8;
  --color-info: #2064d6;
  --color-info-bg: #e7effc;
  --color-neutral-bg: #eef1f6;

  /* ---- Tipografía ---- */
  --font-family-base: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.8125rem;
  --font-size-base: 0.9375rem;
  --font-size-md: 1.0625rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.625rem;
  --font-size-2xl: 2.1rem;
  --line-height-tight: 1.2;
  --line-height-base: 1.5;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* ---- Espaciado ---- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4rem;

  /* ---- Radios ---- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  /* ---- Sombras (discretas) ---- */
  --shadow-sm: 0 1px 2px rgba(16, 32, 64, 0.06);
  --shadow-md: 0 4px 16px rgba(16, 32, 64, 0.08);
  --shadow-lg: 0 12px 32px rgba(16, 32, 64, 0.12);

  /* ---- Layout ---- */
  --shell-sidebar-width: 264px;
  --shell-sidebar-width-collapsed: 76px;
  --shell-topbar-height: 64px;
  --z-topbar: 40;
  --z-sidebar: 50;
  --z-drawer: 60;
  --z-modal: 70;
  --z-toast: 80;

  /* ---- Transición ---- */
  --transition-base: 160ms ease;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-base: 0ms;
  }
}