/* =====================================================
   SGPPBN – ESTILO INSTITUCIONAL BN
   SOLO ROJO 🔴 / PLOMO 🪨
===================================================== */

/* ===== VARIABLES GLOBALES BN ===== */
:root{
    --bn-red:#c62828;
    --bn-red-dark:#b71c1c;

    --bn-gray-dark:#263238;
    --bn-gray:#455a64;
    --bn-gray-light:#cfd8dc;

    --bn-bg:#f4f6f9;
    --white:#ffffff;

    /* Alias de compatibilidad (NO USAR NUEVOS) */
    --primary: var(--bn-red);
    --info: var(--bn-red);
    --dark: var(--bn-gray-dark);
    --light: var(--white);
}

/* ===== BODY / CONTENEDOR ===== */
body{
    background-color:var(--bn-bg);
}

.content-wrapper{
    background-color:var(--bn-bg);
}

/* ===== SIDEBAR ===== */
.main-sidebar,
.bg-navy,
.bg-gradient-black{
    background-color:var(--bn-gray-dark) !important;
}

.brand-link{
    background-color:var(--bn-gray-dark) !important;
    color:#fff !important;
}

/* ===== NAV ===== */
.nav-sidebar .nav-link{
    color:#cfd8dc;
}

.nav-sidebar .nav-link.active,
.nav-sidebar .menu-open > .nav-link{
    background-color:var(--bn-red) !important;
    color:#fff !important;
}

.nav-sidebar .nav-header{
    color:#b0bec5;
}

/* ===== BOTONES ===== */
.btn-primary{
    background-color:var(--bn-red) !important;
    border-color:var(--bn-red) !important;
}
.btn-primary:hover{
    background-color:var(--bn-red-dark) !important;
}

.btn-secondary{
    background-color:var(--bn-gray);
    border-color:var(--bn-gray);
}

/* ===== LINKS ===== */
a{
    color:var(--bn-red);
}
a:hover{
    color:var(--bn-red-dark);
}

/* ===== TARJETAS ===== */
.card{
    border-radius:0;
}

.card-header,
.bn-header{
    background-color:var(--bn-red) !important;
    color:#fff !important;
    font-weight:600;
}

/* ===== INPUTS ===== */
.form-control{
    border-radius:0;
}

.form-control:focus{
    border-color:var(--bn-red) !important;
    box-shadow:0 0 0 .2rem rgba(198,40,40,.25) !important;
}

/* ===== SELECT2 ===== */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple{
    border:0;
    border-bottom:1px solid var(--bn-gray-light);
    border-radius:0;
}

.select2-container--default.select2-container--focus .select2-selection{
    border-bottom:2px solid var(--bn-red);
}

/* ===== TABLAS ===== */
.table thead{
    background-color:var(--bn-gray-dark);
    color:#fff;
}

.table-bordered th,
.table-bordered td{
    border-color:var(--bn-gray-light);
}

table.dataTable th,
table.dataTable td{
    padding:6px;
}

/* ===== TRUNCATE ===== */
.truncate,
.truncate-1,
.truncate-3,
.truncate-5{
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-box-orient:vertical;
}
.truncate{-webkit-line-clamp:3;font-style:italic;}
.truncate-1{-webkit-line-clamp:1;}
.truncate-3{-webkit-line-clamp:3;}
.truncate-5{-webkit-line-clamp:5;}

/* ===== MODALES ===== */
.modal-header{
    background-color:var(--bn-red);
    color:#fff;
}

.modal-dialog.large{width:80%!important;max-width:unset;}
.modal-dialog.mid-large{width:50%!important;max-width:unset;}

@media(max-width:900px){
    .modal-dialog.large,
    .modal-dialog.mid-large{
        width:100%!important;
    }
}

/* ===== LOGIN ===== */
.login-title{
    color:#fff !important;
    font-size:4em;
    text-shadow:3px 3px 8px #000;
}

/* ===== PROGRESOS BN ===== */
.bn-arc{
    width:140px;
    height:140px;
    border-radius:50%;
    background:conic-gradient(
        var(--bn-color) calc(var(--value)*1%),
        #e0e0e0 0
    );
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    position:relative;
}

.bn-arc::before{
    content:'';
    width:95px;
    height:95px;
    background:#fff;
    border-radius:50%;
    position:absolute;
}

.bn-arc-value{
    position:relative;
    font-size:26px;
    font-weight:700;
    color:var(--bn-gray-dark);
}

.bn-green{--bn-color:#2e7d32;}   /* SOLO SEMÁFORO */
.bn-yellow{--bn-color:#f9a825;} /* SOLO SEMÁFORO */
.bn-red{--bn-color:var(--bn-red);}
.bn-gray{--bn-color:#9e9e9e;}

/* ===== UTILITARIOS ===== */
span.btn{
    cursor:unset;
}

.custom-checkbox{
    cursor:pointer;
}

/* ===== FIN SGPPBN ===== */
