/* ============================================================================
   ACELERA LMS · Tema visual
   ----------------------------------------------------------------------------
   Este archivo se carga después de lms.css y es el único punto donde se
   cambian colores, tipografías y medidas. No toca rutas, formularios,
   nombres de campos ni comportamiento.

   Cómo funciona: lms.css construye toda la interfaz sobre las variables de
   abajo. Al cambiar un valor aquí, el cambio se propaga a botones, enlaces,
   estados activos, barras de progreso, portadas, paneles de módulo e
   insignias sin editar nada más.

   Los estilos de componente viven en lms.css, por secciones numeradas.
   Mantener este archivo solo con variables es lo que permite recolorear
   toda la plataforma sin revisar la hoja grande.
   ========================================================================== */

:root {
    /* --- Paleta de marca · Aceleración Comercial ------------------------- */
    --navy-900: #071b32;   /* barra lateral, reproductor y fondos profundos */
    --navy-800: #0e1b2e;   /* color de texto principal */
    --navy-700: #0a2540;   /* botón secundario */
    --navy-600: #14304c;

    --cobalt: #2b7fff;     /* color de interacción: enlaces, foco, activo */
    --cobalt-dark: #1a5fd6;
    --cobalt-soft: #eef4ff;

    --gold: #ffc629;       /* acentos y destacados */
    --gold-soft: #fff6e0;

    --orange: #ff6a1a;     /* reservado para llamadas a la acción */
    --orange-dark: #d9500a;

    /* --- Neutros --------------------------------------------------------- */
    --canvas: #f5f6f8;     /* fondo de la aplicación */
    --surface: #ffffff;    /* tarjetas y paneles */
    --surface-2: #f7f8fa;  /* fondos secundarios y filas alternas */
    --surface-3: #eef0f4;  /* insignias, progreso y marcos de imagen */
    --line: #e5e8ee;
    --line-strong: #cbd2dd;
    --muted: #5d6b80;

    /* --- Barra lateral oscura -------------------------------------------- */
    /* Para una barra lateral clara, iguala estos valores a los neutros:
       --rail: #ffffff; --rail-ink: #0e1b2e; --rail-muted: #5d6b80;
       --rail-line: #e5e8ee; */
    --rail: var(--navy-900);
    --rail-2: #0c2440;
    --rail-line: rgba(255, 255, 255, .10);
    --rail-ink: #e8eef7;
    --rail-muted: #93a7c2;

    /* --- Tipografía ------------------------------------------------------ */
    --font-body: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --font-display: Cambria, Georgia, "Times New Roman", ui-serif, serif;

    /* --- Forma ----------------------------------------------------------- */
    --r-xs: 5px;
    --r-sm: 8px;
    --r: 10px;
    --r-lg: 14px;
    --radius: var(--r);

    /* --- Medidas del armazón --------------------------------------------- */
    --header-h: 66px;
    --sidebar-w: 288px;
    --shell-max: 1560px;
    --content-max: 1160px;
    --reading-max: 760px;
}