:root{
    --db-dark: #0f172a;
    --db-dark-2: #1e293b;
    --db-orange: #f97316;
    --db-orange-hover: #ea580c;
    --db-orange-soft: rgba(249, 115, 22, 0.12);

    --db-bg: #f1f5f9;
    --db-surface: #ffffff;
    --db-surface-2: #f8fafc;

    --db-border: #e2e8f0;
    --db-border-soft: #edf2f7;

    /* TEXTO PRINCIPAL (alto contraste) */
    --db-text: #74777c;

    /* TEXTO SECUNDARIO */
    --db-muted: #64748b;

    /* TEXTO SUAVE / placeholders */
    --db-muted-2: #94a3b8;
    --db-success: #22c55e;
    --db-info: #0ea5e9;
    --db-warning: #f59e0b;
    --db-danger: #ef4444;

    --db-shadow-sm: 0 4px 12px rgba(15, 23, 42, 0.04);
    --db-shadow-md: 0 10px 30px rgba(15, 23, 42, 0.06);
    --db-shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.10);

    --db-radius-sm: .65rem;
    --db-radius-md: .9rem;
    --db-radius-lg: 1rem;
}

/* ===== BASE ===== */
html,
body{
    min-height: 100%;
}

body{
    color: var(--db-text) !important;
    background-color: var(--db-bg) !important;
}

#wrapper,
#content-wrapper,
#content{
    background-color: transparent !important;
}

.container-fluid{
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

a{
    color: var(--db-orange);
    transition: color .2s ease-in-out;
}

a:hover{
    color: var(--db-orange-hover);
    text-decoration: none;
}

hr{
    border-top: 1px solid var(--db-border-soft);
}

/* ===== TIPOGRAFIA ===== */
.text-primary{
    color: var(--db-orange) !important;
}

.text-gray-300{
    color: #cbd5e1 !important;
}

.text-gray-600{
    color: var(--db-muted) !important;
}

.text-gray-800{
    color: var(--db-text) !important;
}

.text-xs{
    font-size: .72rem !important;
    letter-spacing: .05em;
    font-weight: 800 !important;
}

.h1, .h2, .h3, .h4, .h5, .h6,
h1, h2, h3, h4, h5, h6{
    color: var(--db-text);
}

.h5.mb-0.font-weight-bold,
.h5.mb-0{
    font-weight: 800 !important;
    color: var(--db-text) !important;
}

/* ===== FONDOS Y BORDES ===== */
.bg-primary{
    background-color: var(--db-orange) !important;
}

.bg-white{
    background-color: var(--db-surface) !important;
}

.border-primary{
    border-color: var(--db-orange) !important;
}

/* ===== BOTONES ===== */
.btn{
    border-radius: var(--db-radius-sm) !important;
    font-weight: 700;
    transition: all .2s ease-in-out;
}

.btn-primary{
    color: #fff !important;
    background-color: var(--db-orange) !important;
    border-color: var(--db-orange) !important;
    box-shadow: 0 8px 18px rgba(249, 115, 22, 0.18);
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary.active{
    color: #fff !important;
    background-color: var(--db-orange-hover) !important;
    border-color: var(--db-orange-hover) !important;
    box-shadow: 0 10px 22px rgba(249, 115, 22, 0.24);
    transform: translateY(-1px);
}

.btn-primary:focus,
.btn-primary.focus{
    color: #fff !important;
    background-color: var(--db-orange-hover) !important;
    border-color: var(--db-orange-hover) !important;
    box-shadow: 0 0 0 .2rem rgba(249, 115, 22, 0.18) !important;
}

.btn-outline-primary{
    color: var(--db-orange) !important;
    border-color: var(--db-orange) !important;
    background-color: transparent !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus{
    color: #fff !important;
    background-color: var(--db-orange) !important;
    border-color: var(--db-orange) !important;
    box-shadow: 0 0 0 .2rem rgba(249, 115, 22, 0.16) !important;
}

/* ===== SIDEBAR ===== */
.bg-gradient-primary{
    background-color: var(--db-dark) !important;
    background-image: linear-gradient(180deg, var(--db-dark) 0%, var(--db-dark-2) 100%) !important;
    background-size: cover !important;
}

.sidebar{
    background-color: var(--db-dark) !important;
    background-image: linear-gradient(180deg, var(--db-dark) 0%, var(--db-dark-2) 100%) !important;
    box-shadow: 8px 0 30px rgba(15, 23, 42, 0.16);
}

.sidebar .sidebar-brand{
    color: #fff !important;
    font-weight: 800;
}

.sidebar .sidebar-brand:hover{
    color: #fff !important;
}

.sidebar .sidebar-heading{
    color: rgba(255,255,255,0.48) !important;
    font-weight: 800;
}

.sidebar hr.sidebar-divider{
    border-top: 1px solid rgba(255,255,255,0.08) !important;
}

.sidebar .nav-item{
    margin-bottom: .15rem;
}

.sidebar .nav-item .nav-link{
    color: rgba(255,255,255,0.84) !important;
    font-weight: 600;
    border-radius: .75rem;
    margin: 0 .6rem;
    padding-top: .8rem;
    padding-bottom: .8rem;
    transition: all .2s ease-in-out;
}

.sidebar .nav-item .nav-link i{
    color: rgba(255,255,255,0.70) !important;
    transition: all .2s ease-in-out;
}

.sidebar .nav-item .nav-link:hover{
    color: #fff !important;
    background: rgba(255,255,255,0.06);
}

.sidebar .nav-item .nav-link:hover i{
    color: var(--db-orange) !important;
}

.sidebar .nav-item.active .nav-link{
    color: #fff !important;
    background: rgba(249, 115, 22, 0.14);
    box-shadow: inset 0 0 0 1px rgba(249,115,22,0.10);
}

.sidebar .nav-item.active .nav-link i{
    color: var(--db-orange) !important;
}

/* ===== BOTON TOGGLE SIDEBAR ===== */
.sidebar #sidebarToggle,
.sidebar #sidebarToggleTop{
    background-color: rgba(255,255,255,0.08) !important;
}

.sidebar #sidebarToggle::after,
.sidebar #sidebarToggleTop::after{
    color: rgba(255,255,255,0.78) !important;
}

/* ===== TOPBAR ===== */
.topbar{
    background-color: var(--db-surface) !important;
    border-bottom: 1px solid var(--db-border);
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04) !important;
}

.topbar .navbar-search .form-control{
    background-color: var(--db-surface-2) !important;
    border-color: var(--db-border) !important;
}

.topbar .nav-item .nav-link{
    color: var(--db-muted) !important;
}

.topbar .nav-item .nav-link:hover{
    color: var(--db-orange) !important;
}

.topbar-divider{
    border-right: 1px solid var(--db-border-soft) !important;
}




/* ===== CARDS ===== */
.card{
    border: 1px solid var(--db-border-soft) !important;
    border-radius: var(--db-radius-lg) !important;
    background: var(--db-surface) !important;
    box-shadow: var(--db-shadow-sm) !important;
    transition: transform .18s ease-in-out, box-shadow .18s ease-in-out, border-color .18s ease-in-out;
    overflow: hidden;
}

.card:hover{
    box-shadow: var(--db-shadow-md) !important;
    border-color: #e6edf5 !important;
}

.card-header{
    background-color: var(--db-surface) !important;
    border-bottom: 1px solid var(--db-border-soft) !important;
    color: var(--db-text) !important;
    font-weight: 800 !important;
    padding: 1rem 1.25rem !important;
}

.card-body{
    padding: 1.25rem !important;
}

.card-footer{
    background-color: var(--db-surface) !important;
    border-top: 1px solid var(--db-border-soft) !important;
}

/* ===== TARJETAS KPI / DASHBOARD ===== */
.border-left-primary,
.border-left-success,
.border-left-info,
.border-left-warning,
.border-left-danger{
    border-left-width: .25rem !important;
    border-left-style: solid !important;
}

.border-left-primary{
    border-left-color: var(--db-orange) !important;
}

.border-left-success{
    border-left-color: var(--db-success) !important;
}

.border-left-info{
    border-left-color: var(--db-info) !important;
}

.border-left-warning{
    border-left-color: var(--db-warning) !important;
}

.border-left-danger{
    border-left-color: var(--db-danger) !important;
}

.border-bottom-primary{
    border-bottom: .2rem solid var(--db-orange) !important;
}

/* Hace que las tarjetas resumen se vean mejor alineadas */
.card .row.no-gutters.align-items-center{
    min-height: 64px;
}

/* ===== TABLAS ===== */
.table{
    color: var(--db-text) !important;
}

.table thead th{
    background-color: var(--db-surface-2);
    color: var(--db-text);
    border-bottom: 1px solid var(--db-border) !important;
    font-weight: 800;
    text-transform: none;
}

.table td,
.table th{
    border-top: 1px solid var(--db-border-soft) !important;
    vertical-align: middle !important;
}

.table-hover tbody tr:hover{
    background-color: rgba(249, 115, 22, 0.035) !important;
}

/* ===== FORMULARIOS ===== */
label{
    color: var(--db-text);
    font-weight: 700;
}

.form-control,
.custom-select{
    border-color: #dbe2ea !important;
    color: var(--db-text) !important;
    border-radius: var(--db-radius-sm) !important;
    background-color: #fff !important;
}

.form-control:focus,
.custom-select:focus{
    border-color: rgba(249,115,22,0.55) !important;
    box-shadow: 0 0 0 .2rem rgba(249,115,22,0.10) !important;
}

.form-control::placeholder{
    color: var(--db-muted-2) !important;
}

.form-control[readonly],
.form-control:disabled{
    background-color: #f8fafc !important;
}

.input-group-text{
    background-color: var(--db-surface-2) !important;
    border-color: #dbe2ea !important;
    color: var(--db-muted) !important;
}

/* ===== PAGINACION ===== */
.page-link{
    color: var(--db-orange) !important;
    border-color: var(--db-border) !important;
    background-color: #fff !important;
}

.page-link:hover{
    color: var(--db-orange-hover) !important;
    background-color: #fff7ed !important;
    border-color: #fed7aa !important;
}

.page-link:focus{
    box-shadow: 0 0 0 .2rem rgba(249,115,22,0.12) !important;
}

.page-item.active .page-link{
    background-color: var(--db-orange) !important;
    border-color: var(--db-orange) !important;
    color: #fff !important;
}

/* ===== BADGES ===== */
.badge{
    border-radius: .5rem !important;
    font-weight: 700;
}

.badge-primary{
    background-color: var(--db-orange) !important;
    color: #fff !important;
}

.badge-success{
    background-color: var(--db-success) !important;
    color: #fff !important;
}

.badge-info{
    background-color: var(--db-info) !important;
    color: #fff !important;
}

.badge-warning{
    background-color: var(--db-warning) !important;
    color: #fff !important;
}

.badge-danger{
    background-color: var(--db-danger) !important;
    color: #fff !important;
}

/* ===== ALERTAS ===== */
.alert{
    border-radius: .85rem !important;
}

.alert-primary{
    color: #9a3412 !important;
    background-color: #fff7ed !important;
    border-color: #fdba74 !important;
}

/* ===== MODALES ===== */
.modal-content{
    border: 1px solid var(--db-border-soft) !important;
    border-radius: 1rem !important;
    box-shadow: var(--db-shadow-lg) !important;
}

.modal-header{
    border-bottom: 1px solid var(--db-border-soft) !important;
}

.modal-footer{
    border-top: 1px solid var(--db-border-soft) !important;
}

/* ===== DROPDOWNS ===== */
.dropdown-menu{
    border: 1px solid var(--db-border-soft) !important;
    border-radius: .9rem !important;
    box-shadow: var(--db-shadow-md) !important;
}

.dropdown-item{
    color: var(--db-text) !important;
}

.dropdown-item:hover,
.dropdown-item:focus{
    background-color: #fff7ed !important;
    color: var(--db-orange-hover) !important;
}

/* ===== LOGIN / IMAGENES ===== */
.bg-login-image,
.bg-register-image,
.bg-password-image{
    background-position: center;
    background-size: cover;
}

/* ===== FOOTER ===== */
footer.sticky-footer{
    background: transparent !important;
}

footer.sticky-footer .copyright{
    color: var(--db-muted) !important;
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar{
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-thumb{
    background: rgba(15, 23, 42, 0.22);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover{
    background: rgba(15, 23, 42, 0.36);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px){
    .container-fluid{
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .card-body{
        padding: 1rem !important;
    }

    .card-header{
        padding: .9rem 1rem !important;
    }
}