/* ==========================================================================
   NL Cargo — tokens de marca
   --------------------------------------------------------------------------
   Colores extraidos del logotipo oficial. Fuente unica de verdad del color
   para toda la aplicacion: cualquier pantalla que se rebrandee debe consumir
   estas variables en lugar de escribir hex sueltos.

   Rol elegido: ROJO primario (acciones, enlaces, estado activo),
                AZUL MARINO de soporte (fondos, barras, encabezados).
   ========================================================================== */

:root {
    /* --- Colores literales del logotipo --------------------------------- */
    --nl-red:           #C90F14;  /* monograma NL y palabra CARGO           */
    --nl-navy:          #001570;  /* base del panel de estrellas            */
    --nl-blue:          #012C8D;  /* facetas intermedias del panel          */
    --nl-blue-bright:   #0165C3;  /* faceta superior del panel              */

    /* --- Escalas derivadas ---------------------------------------------- */
    --nl-red-600:       #B10D11;
    --nl-red-700:       #8F0A0E;
    --nl-red-050:       #FBE8E9;
    --nl-navy-900:      #000E4C;
    --nl-blue-050:      #E8EEF9;

    /* --- Roles semanticos ------------------------------------------------ */
    --nl-primary:        var(--nl-red);
    --nl-primary-hover:  var(--nl-red-600);
    --nl-primary-active: var(--nl-red-700);
    --nl-on-primary:     #FFFFFF;

    --nl-support:        var(--nl-navy);
    --nl-support-accent: var(--nl-blue-bright);
    --nl-on-support:     #FFFFFF;

    /* --- Neutros --------------------------------------------------------- */
    --nl-ink:           #16181D;
    --nl-ink-muted:     #5A6270;
    --nl-line:          #DDE1E8;
    --nl-surface:       #FFFFFF;
    --nl-surface-alt:   #F5F7FA;

    /* --- Estado ----------------------------------------------------------
       El rojo de marca ya es el primario, asi que el error NO puede ser el
       mismo tono: usa un carmin mas oscuro y siempre sobre fondo tintado,
       para que no se confunda con un boton de accion.                      */
    --nl-danger:        #9B0018;
    --nl-danger-bg:     #FDECEE;
    --nl-success:       #0E7C4A;
    --nl-warning:       #B26A00;

    /* --- Forma ----------------------------------------------------------- */
    --nl-radius:        10px;
    --nl-radius-lg:     16px;
    --nl-focus-ring:    0 0 0 3px rgba(201, 15, 20, .28);
    --nl-focus-ring-on-dark: 0 0 0 3px rgba(255, 255, 255, .45);
}