/* =======================================================
   ESTÉTICA PREMIUM GLOBAL Y RESPONSIVIDAD
   ======================================================= */
/* FORZAR PADDING CONTRA INLINE STYLES DE OTROS ARCHIVOS */
body { 
    padding-top: 5px !important; 
    transition: background-color 0.3s ease, color 0.3s ease; 
}
.content { margin-top: 0px !important; }

@media (max-width: 768px) {
    body { padding-top: 5px !important; }
    .header-container h2 { font-size: 16px !important; }
        }
@media (max-width: 768px) and (orientation: landscape) { 
    body { padding-top: 200px !important; } 
    .header-container h2 { font-size: 16px !important; }
        }
        .header-container h2 {
            margin: 0;
            font-size: 16px;
            font-weight: bold;
        }
/* =======================================================
   HIJACK DE BOTONES Y CONTENEDORES VIEJOS (Modernizar todo)
   ======================================================= */
/* Transformamos todos los botones viejos de bootstrap a Píldoras */
.btn {
    border-radius: 12px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease-in-out !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

/* Redondeamos paneles viejos */
.panel, .well {
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}

/* Tablas Responsivas Universales */
.table-responsive { border: none !important; }
.table > thead > tr > th, .table > tbody > tr > td { 
    white-space: nowrap !important; 
    vertical-align: middle !important; 
}

/* =======================================================
   MODO OSCURO PREMIUM (NIGHT MODE)
   ======================================================= */
body.dark-mode { background-color: #0f172a !important; color: #e2e8f0 !important; }
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, body.dark-mode h4, body.dark-mode p { color: #f8fafc !important; }
body.dark-mode hr { border-top-color: #334155 !important; }

/* Enlaces */
body.dark-mode a:not(.btn):not(.label):not(.navbar-brand) { color: #38bdf8 !important; }
body.dark-mode a:hover:not(.btn):not(.label) { color: #7dd3fc !important; }

/* Navegación Oscura */
body.dark-mode .navbar-default { background-color: #1e293b !important; border-color: #334155 !important; }
body.dark-mode .navbar-default .navbar-brand, 
body.dark-mode .navbar-default .navbar-nav > li > a { color: #94a3b8 !important; }
body.dark-mode .navbar-default .navbar-nav > li > a:hover { color: #f8fafc !important; }
body.dark-mode .navbar-default .navbar-nav > .active > a { background-color: #0f172a !important; color: #38bdf8 !important; }
body.dark-mode .navbar-default .navbar-toggle { border-color: #475569 !important; background-color: #0f172a !important; }
body.dark-mode .navbar-default .navbar-toggle .icon-bar { background-color: #e2e8f0 !important; }
body.dark-mode .navbar-collapse { border-color: #334155 !important; }

/* Forzar modo oscuro en contenedores viejos del sitio */
body.dark-mode .well, body.dark-mode .panel, body.dark-mode .panel-default > .panel-heading { 
    background: #1e293b !important; border-color: #334155 !important; color: #f8fafc !important;
}
body.dark-mode .panel-body { background: #0f172a !important; }

/* Tablas Oscuras Globales */
body.dark-mode .table { color: #cbd5e1 !important; }
body.dark-mode .table-striped > tbody > tr:nth-of-type(odd) { background-color: rgba(255,255,255,0.02) !important; }
body.dark-mode .table-hover > tbody > tr:hover { background-color: rgba(255,255,255,0.05) !important; }
body.dark-mode .table > thead > tr > th { border-bottom: 2px solid #334155 !important; color: #94a3b8 !important; }
body.dark-mode .table > tbody > tr > td { border-top: 1px solid #1e293b !important; }

/* Formularios y Modales globales */
body.dark-mode .form-control { background-color: #0f172a !important; color: #fff !important; border-color: #475569 !important; }
body.dark-mode .form-control[disabled] { background-color: #162032 !important; }
body.dark-mode .modal-content { background-color: #1e293b !important; color: #f8fafc !important; border: 1px solid #475569 !important; }
body.dark-mode .modal-header { border-bottom: 1px solid #334155 !important; }
body.dark-mode .modal-footer { border-top: 1px solid #334155 !important; }
body.dark-mode .close { color: #fff !important; text-shadow: none !important; opacity: 0.7 !important; }

/* =======================================================
   SECUESTRO DE COLORES DE BOTONES PARA MODO OSCURO
   ======================================================= */
body.dark-mode .btn-primary { background-color: #3b82f6 !important; border-color: #2563eb !important; color: white !important; }
body.dark-mode .btn-primary:hover { background-color: #2563eb !important; }

body.dark-mode .btn-success { background-color: #059669 !important; border-color: #047857 !important; color: white !important; }
body.dark-mode .btn-success:hover { background-color: #047857 !important; }

body.dark-mode .btn-info { background-color: #0284c7 !important; border-color: #0369a1 !important; color: white !important; }
body.dark-mode .btn-warning { background-color: #b45309 !important; border-color: #a16207 !important; color: white !important; }
body.dark-mode .btn-danger { background-color: #dc2626 !important; border-color: #b91c1c !important; color: white !important; }

body.dark-mode .btn-default { background-color: #334155 !important; color: #cbd5e1 !important; border-color: #475569 !important; }
body.dark-mode .btn-default:hover { background-color: #475569 !important; color: #fff !important; }

/* Semáforos Desaturados Globales */
body.dark-mode .label-success { background-color: #064e3b !important; color: #a7f3d0 !important; border: 1px solid #065f46 !important; }
body.dark-mode .label-info { background-color: #0c4a6e !important; color: #bae6fd !important; border: 1px solid #075985 !important; }
body.dark-mode .label-warning { background-color: #713f12 !important; color: #fef08a !important; border: 1px solid #854d0e !important; }
body.dark-mode .label-danger { background-color: #7f1d1d !important; color: #fecaca !important; border: 1px solid #991b1b !important; }
body.dark-mode .label-default { background-color: #334155 !important; color: #cbd5e1 !important; border: 1px solid #475569 !important; }
/* =======================================================
   ASESINO DEL DISEÑO VIEJO DE BOOTSTRAP 3 (GLOBAL)
   ======================================================= */
/* Matamos los gradientes 3D, sombras viejas y los hacemos píldoras modernas */
.btn, .btn-primary, .btn-success, .btn-warning, .btn-danger, .btn-info, .btn-default {
    background-image: none !important;
    text-shadow: none !important;
    border-radius: 20px !important; /* Formato Píldora Global */
    font-weight: 600 !important;
    box-shadow: none !important;
}

/* Modales y Paneles Viejos redondeados */
.panel, .well, .modal-content {
    border-radius: 12px !important;
}