/* ═══════════════════════════════════════════════════════════════
   COLOR BLUE · paleta de marca
   Tokens derivados del logo oficial (#1F323A navy). El acento azul
   vivo se mantiene para los CTAs.
   ═══════════════════════════════════════════════════════════════ */
:root {
    --cb-navy:        #1F323A;
    --cb-navy-dark:   #16252B;
    --cb-navy-soft:   #2C4651;
    --cb-azul:        #2563EB;
    --cb-azul-vivo:   #1D4ED8;
    --cb-gris-bg:     #F5F7FA;
    --cb-gris-line:   #E2E8F0;
    --cb-texto:       #1F2937;
    --cb-muted:       #64748B;
}

body {
    background-color: var(--cb-gris-bg);
    color: var(--cb-texto);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;
}

/* ───────────────── Navbar COLOR BLUE ───────────────── */
.navbar.bg-primary,
.navbar-cb {
    background: var(--cb-navy) !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.15);
}

/* Sticky en TODA la app — header siempre visible al hacer scroll. */
.navbar-cb,
.navbar.bg-primary {
    position: sticky;
    top: 0;
    z-index: 1030;
}

.navbar-brand img.logo-cb {
    height: 28px;
    width: auto;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
    /* El SVG original es navy oscuro; en fondo navy lo invertimos a blanco. */
    filter: brightness(0) invert(1);
}

.navbar-brand {
    font-size: 1.05rem;
    letter-spacing: 0.2px;
    font-weight: 600;
}

.navbar-dark .nav-link {
    color: rgba(255, 255, 255, 0.88);
    font-weight: 500;
}
.navbar-dark .nav-link:hover,
.navbar-dark .nav-link.show {
    color: #fff;
}

.navbar-dark .dropdown-menu {
    border-color: var(--cb-gris-line);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}

/* ───────────────── Botones / acentos ───────────────── */
.btn-primary {
    background-color: var(--cb-azul);
    border-color: var(--cb-azul);
}
.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--cb-azul-vivo);
    border-color: var(--cb-azul-vivo);
}

.btn-success {
    background-color: #0F766E;
    border-color: #0F766E;
}
.btn-success:hover { background-color: #115E59; border-color: #115E59; }

a, .text-primary { color: var(--cb-azul); }
a:hover { color: var(--cb-azul-vivo); }

/* ───────────────── Cards y tablas ───────────────── */
.card {
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
    border-color: var(--cb-gris-line);
    border-radius: 8px;
}

.table th {
    white-space: nowrap;
    color: var(--cb-navy);
    font-weight: 600;
}

.table-light th {
    background-color: #EEF2F7;
}

/* Estado badges en la tabla */
.estado-descansa { background-color: #6c757d; }
.estado-vacaciones { background-color: #0dcaf0; }
.estado-incapacidad { background-color: #ffc107; color: #000; }
.estado-compensa { background-color: #6f42c1; }
.estado-licencia { background-color: #343a40; }

/* Highlight hoy */
.table-success td {
    background-color: rgba(25, 135, 84, 0.08) !important;
}

/* Inputs compactos en tabla */
.table input[type="time"] {
    min-width: 90px;
    font-size: 0.82rem;
    padding: 2px 4px;
}

.table select.form-select-sm {
    font-size: 0.8rem;
}

/* ───────────────── Alertas con tono de marca ───────────────── */
.alert {
    border: none;
    border-left: 3px solid transparent;
    border-radius: 6px;
}
.alert-info    { background: #EFF6FF; color: #1E3A8A; border-left-color: var(--cb-azul); }
.alert-success { background: #ECFDF5; color: #065F46; border-left-color: #10B981; }
.alert-warning { background: #FFFBEB; color: #92400E; border-left-color: #F59E0B; }
.alert-danger  { background: #FEF2F2; color: #991B1B; border-left-color: #EF4444; }

/* ───────────────── Login pages ───────────────── */
.login-brand-mark {
    height: 48px;
    width: auto;
    display: block;
    margin: 0 auto 12px auto;
}