/**
 * Liceo Jacinto — Design tokens
 * Fuente única de colores, tipografía y espaciado del sistema.
 */
:root {
    /* Colores institucionales */
    --lj-color-primary: #1f2f46;
    --lj-color-primary-dark: #1a2739;
    --lj-color-primary-mid: #2a4d7a;
    --lj-color-secondary: #2f80ed;
    --lj-color-secondary-hover: #2980b9;
    --lj-color-accent: #e74c3c;

    /* Superficies y texto */
    --lj-color-surface: #ffffff;
    --lj-color-page-bg: #f4f7fb;
    --lj-color-text: #1f2937;
    --lj-color-text-muted: #64748b;
    --lj-color-border: #e5e7eb;
    --lj-color-border-light: #dbe4f0;

    /* Estados semánticos */
    --lj-color-success: #198754;
    --lj-color-info: #0dcaf0;
    --lj-color-warning: #ffc107;
    --lj-color-danger: #dc3545;

    /* Sidebar y navegación */
    --lj-color-sidebar-text: #334155;
    --lj-color-sidebar-hover-bg: #eaf2ff;
    --lj-color-sidebar-active-text: #0f3d8a;

    /* Tipografía */
    --lj-font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    --lj-font-size-base: 1rem;
    --lj-font-size-sm: 0.875rem;
    --lj-font-size-xs: 0.75rem;
    --lj-font-weight-semibold: 600;
    --lj-font-weight-bold: 700;

    /* Espaciado */
    --lj-space-1: 0.25rem;
    --lj-space-2: 0.5rem;
    --lj-space-3: 0.75rem;
    --lj-space-4: 1rem;
    --lj-space-5: 1.25rem;
    --lj-space-6: 1.5rem;
    --lj-space-8: 2rem;

    /* Bordes y sombras */
    --lj-radius-sm: 8px;
    --lj-radius-md: 10px;
    --lj-radius-lg: 12px;
    --lj-radius-xl: 14px;
    --lj-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.05);
    --lj-shadow-md: 0 4px 16px rgba(15, 23, 42, 0.06);
    --lj-shadow-lg: 0 8px 24px rgba(47, 128, 237, 0.22);

    /* Compatibilidad con estilos previos (Fases 1–2) */
    --primary-color: var(--lj-color-primary);
    --secondary-color: var(--lj-color-secondary);
    --accent-color: var(--lj-color-accent);
    --surface-color: var(--lj-color-surface);
    --page-bg: var(--lj-color-page-bg);
    --muted-text: var(--lj-color-text-muted);
}