/**
 * LDHS · Paleta oficial corporativa
 *
 * Fuente: extraída de https://www.ldhs.cl/ (CSS :root oficial)
 * 2026-05-27 · Aplicar en toda la intranet (Adm, Correo, Reuniones, CRM, etc.)
 *
 * Uso: <link rel="stylesheet" href="/shared/views/ldhs_palette.css"> en cada layout.
 * Las variables están scopeadas a :root para que estén globales.
 *
 * Reglas de uso recomendado:
 *   - Backgrounds primary  → var(--ldhs-navy)
 *   - Backgrounds soft     → var(--ldhs-cream)
 *   - Acentos / CTAs       → var(--ldhs-gold)
 *   - Texto sobre cream    → var(--ldhs-ink)
 *   - Texto sobre navy     → var(--ldhs-paper)
 *   - Bordes sutiles       → var(--ldhs-line)
 */

:root {
    /* — Navy (color corporativo principal) ————————————————— */
    --ldhs-navy:        #0F2147;   /* azul oscuro corporativo */
    --ldhs-navy-deep:   #081229;   /* hover/active más profundo */
    --ldhs-navy-soft:   #1E3563;   /* surface secundaria, hover */

    /* — Gold (acento ejecutivo) —————————————————————————— */
    --ldhs-gold:        #C9A961;   /* color de acento, badges, links */
    --ldhs-gold-deep:   #A88B47;   /* hover gold */
    --ldhs-gold-warm:   #D4B574;   /* gradient warm */
    --ldhs-gold-light:  #E8D9B0;   /* tint suave */

    /* — Cream (background corporativo) ———————————————————— */
    --ldhs-cream:       #FAF7F0;   /* fondo papel suave */
    --ldhs-cream-deep:  #F2EDDF;   /* fondo activo, hover sobre cream */
    --ldhs-paper:       #FFFFFF;   /* paneles, cards, modales */

    /* — Texto y neutros ————————————————————————————————— */
    --ldhs-ink:         #0F172A;   /* texto principal sobre cream/paper */
    --ldhs-muted:       #5B6B7F;   /* texto secundario, hints */
    --ldhs-muted-soft:  #94A3B8;   /* texto terciario, placeholders */
    --ldhs-line:        rgba(15, 33, 71, 0.12); /* bordes sutiles */
    --ldhs-line-strong: rgba(15, 33, 71, 0.24); /* bordes pronunciados */

    /* — Estados semánticos (paleta LDHS-consistent) ————————— */
    --ldhs-ok:          #2A7F62;   /* verde oliva discreto */
    --ldhs-warn:        #B8862B;   /* ámbar tipo gold-deep */
    --ldhs-bad:         #9B2C2C;   /* rojo ladrillo */

    /* — Compatibilidad con código viejo (aliases sin prefijo) — */
    --navy:        var(--ldhs-navy);
    --navy-deep:   var(--ldhs-navy-deep);
    --navy-soft:   var(--ldhs-navy-soft);
    --gold:        var(--ldhs-gold);
    --gold-deep:   var(--ldhs-gold-deep);
    --gold-warm:   var(--ldhs-gold-warm);
    --gold-light:  var(--ldhs-gold-light);
    --cream:       var(--ldhs-cream);
    --cream-deep:  var(--ldhs-cream-deep);
    --paper:       var(--ldhs-paper);
    --ink:         var(--ldhs-ink);
    --mut:         var(--ldhs-muted);
    --muted:       var(--ldhs-muted);
    --line:        var(--ldhs-line);
}

/* — Utilidades cross-página que pueden incluir cualquier layout — */
.ldhs-brand-navy { background: var(--ldhs-navy); color: var(--ldhs-paper); }
.ldhs-brand-gold { background: var(--ldhs-gold); color: var(--ldhs-navy); }
.ldhs-brand-cream { background: var(--ldhs-cream); color: var(--ldhs-ink); }

a.ldhs-link, .ldhs-link {
    color: var(--ldhs-gold-deep);
    text-decoration: none;
    border-bottom: 1px dotted var(--ldhs-gold);
    transition: color 0.15s ease, border-color 0.15s ease;
}
a.ldhs-link:hover, .ldhs-link:hover {
    color: var(--ldhs-navy);
    border-bottom-color: var(--ldhs-navy);
}

button.ldhs-btn-primary, .ldhs-btn-primary {
    background: var(--ldhs-navy);
    color: var(--ldhs-paper);
    border: 1px solid var(--ldhs-navy);
    padding: 8px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: background 0.15s ease;
}
button.ldhs-btn-primary:hover, .ldhs-btn-primary:hover {
    background: var(--ldhs-navy-deep);
}

button.ldhs-btn-gold, .ldhs-btn-gold {
    background: var(--ldhs-gold);
    color: var(--ldhs-navy);
    border: 1px solid var(--ldhs-gold-deep);
    padding: 8px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: background 0.15s ease;
}
button.ldhs-btn-gold:hover, .ldhs-btn-gold:hover {
    background: var(--ldhs-gold-deep);
    color: var(--ldhs-paper);
}