/* =====================================================
   SISTEMA WEB DIGESTO - Municipalidad
   Tema verde institucional - Bootstrap 5
   ===================================================== */

/* ── Variables de color verde municipal ── */
:root {
    --verde-pri:    #1a6b3a;   /* verde institucional principal */
    --verde-hover:  #145530;   /* hover más oscuro */
    --verde-oscuro: #0f3d22;   /* encabezados y barras */
    --verde-claro:  #e8f5ee;   /* fondos suaves */
    --verde-musgo:  #4a7c59;   /* Digesto - variante */
    --verde-musgo-osc: #2e4f38;
    --gris-tabla:   #2c3e30;   /* cabecera de tablas */
    --blanco:       #ffffff;
}

/* ── Override Bootstrap primary ── */
.btn-primary, .bg-primary    { background-color: var(--verde-pri) !important; border-color: var(--verde-pri) !important; }
.btn-primary:hover            { background-color: var(--verde-hover) !important; border-color: var(--verde-hover) !important; }
.navbar.bg-primary            { background-color: var(--verde-pri) !important; }
.card-header.bg-primary       { background-color: var(--verde-pri) !important; }
.text-primary                 { color: var(--verde-pri) !important; }
.border-primary               { border-color: var(--verde-pri) !important; }

/* ── Clases utilitarias de verde ── */
.fondo-verde        { background-color: var(--verde-pri) !important; }
.fondo-verde-oscuro { background-color: var(--verde-oscuro) !important; }
.fondo-musgo        { background-color: var(--verde-musgo) !important; }
.fondo-musgo-oscuro { background-color: var(--verde-musgo-osc) !important; }
.texto-blanco       { color: var(--blanco) !important; }
.nav-verde-oscuro   { background-color: var(--verde-oscuro) !important; }
.nav-verde-musgo    { background-color: var(--verde-musgo-osc) !important; }

/* ── Botones personalizados ── */
.btn-verde {
    background-color: var(--verde-pri);
    border-color:     var(--verde-pri);
    color:            var(--blanco);
    font-weight:      700;
}
.btn-verde:hover {
    background-color: var(--verde-hover);
    border-color:     var(--verde-hover);
    color:            var(--blanco);
}
.btn-musgo {
    background-color: var(--verde-musgo);
    border-color:     var(--verde-musgo);
    color:            var(--blanco);
    font-weight:      700;
}
.btn-musgo:hover {
    background-color: var(--verde-musgo-osc);
    border-color:     var(--verde-musgo-osc);
    color:            var(--blanco);
}
.btn-verde-oscuro {
    background-color: var(--verde-oscuro);
    border-color:     var(--verde-oscuro);
    color:            var(--blanco);
}
.btn-verde-oscuro:hover {
    background-color: var(--verde-hover);
    border-color:     var(--verde-hover);
    color:            var(--blanco);
}
.btn-musgo-oscuro {
    background-color: var(--verde-musgo-osc);
    border-color:     var(--verde-musgo-osc);
    color:            var(--blanco);
}
.btn-musgo-oscuro:hover {
    background-color: var(--verde-musgo);
    border-color:     var(--verde-musgo);
    color:            var(--blanco);
}

/* Botones robustos globales */
.btn { font-weight: 600; letter-spacing: .02em; }
.btn-lg { padding: .65rem 1.6rem; font-size: 1rem; }
.btn-sm { padding: .35rem .85rem; }

/* ── Cabecera de tablas verde ── */
.tabla-header th {
    background-color: var(--gris-tabla);
    color:            var(--blanco);
    font-weight:      700;
    font-size:        .78rem;
    text-transform:   uppercase;
    letter-spacing:   .04em;
    white-space:      nowrap;
}
.table-hover tbody tr:hover { background-color: var(--verde-claro); }
.table-active               { background-color: #c5e8d4 !important; }

/* ── Navbar ── */
.navbar { padding: .45rem 1rem; }
.navbar-brand { font-size: .95rem; letter-spacing: .05em; }

/* ── Card headers con títulos en negrita ── */
.card-header {
    font-weight: 700;
    letter-spacing: .04em;
}
.card-header h4, .card-header h5, .card-header span.fw-bold {
    font-weight: 800 !important;
}

/* ── Labels formulario en negrita ── */
.form-label.fw-bold, .form-label.fw-semibold { font-weight: 700 !important; }

/* ── Login ── */
.bg-login { background: linear-gradient(135deg, var(--verde-oscuro) 0%, var(--verde-musgo) 100%); }
.login-card { width: 100%; max-width: 420px; border: none; border-radius: 12px; }
.login-card .card-header { border-radius: 12px 12px 0 0 !important; padding: 1.5rem !important; }

/* ── Home – cards de selección ── */
.home-card {
    border-radius: 12px;
    transition: transform .15s, box-shadow .15s;
    border: 2px solid transparent;
    background: var(--blanco);
}
.home-card:hover {
    transform:    translateY(-5px);
    box-shadow:   0 8px 24px rgba(0,0,0,.15) !important;
    border-color: var(--verde-pri);
}
.home-card i { color: var(--verde-pri) !important; }
.home-card h4 { color: var(--verde-oscuro); font-weight: 800; }

/* ── Alertas dentro del formulario ── */
#alerta .alert { border-left: 4px solid; }
#alerta .alert-success { border-left-color: var(--verde-pri); }

/* ── Badge de estado (Digesto) ── */
.badge { font-size: .72rem; padding: .35em .6em; border-radius: 4px; }

/* ── Inputs de fecha y file ── */
input[type="date"] { max-width: 180px; }
input[type="file"].form-control-sm { font-size: .82rem; }

/* ── Scrollbar de tablas ── */
.table-responsive::-webkit-scrollbar { width: 6px; height: 6px; }
.table-responsive::-webkit-scrollbar-thumb { background: var(--verde-pri); border-radius: 3px; }

/* ── General body ── */
body { background-color: #f4f7f5; font-size: .9rem; }
