/* 
    Evitar que el evento click se accione en los iconos de un boton 
    con esto nos aseguramos que el boton sea el target del evento
*/
button > i {
    pointer-events: none;
}

button > h1, h2, h3, h4, h5, h6 {
    pointer-events: none;
}

a > span {
    pointer-events: none;
}

/* ============================================================
   Estilos generales para AdminLTE
   ============================================================ */

/* --- Fuente más moderna y legible --- */
body {
    font-family: 'Poppins', 'Segoe UI', sans-serif;
    font-size: 15px;
    background-color: #f4f6f9;
    color: #333;
}

/* --- Navbar más elegante --- */
.main-header.navbar {
    background: linear-gradient(90deg, #004e92, #000428);
    border: none;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.navbar-nav .nav-link {
    color: #fff !important;
    transition: 0.3s;
}
.navbar-nav .nav-link:hover {
    color: #ffd700 !important;
}

/* --- Sidebar mejorado --- */
.main-sidebar {
    background: linear-gradient(180deg, #001f3f, #003366);
}
.sidebar a {
    color: #cfd8dc !important;
    transition: 0.3s;
}
.sidebar a:hover {
    background: rgba(255,255,255,0.1);
    color: #fff !important;
    border-radius: 8px;
}
.nav-sidebar > .nav-item.menu-open > .nav-link,
.nav-sidebar > .nav-item:hover > .nav-link {
    background-color: rgba(255,255,255,0.15);
}

/* --- Botones con mejor contraste --- */
.btn-primary {
    background: linear-gradient(90deg, #004e92, #000428);
    border: none;
    transition: 0.3s;
}
.btn-primary:hover {
    background: linear-gradient(90deg, #000428, #004e92);
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

/* --- Tarjetas (cards) más limpias --- */
.card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.08);
    transition: transform 0.2s ease-in-out;
}
.card:hover {
    transform: translateY(-2px);
}
.card-header {
    background: linear-gradient(90deg, #003366, #004e92);
    color: white;
    font-weight: 600;
    border-radius: 12px 12px 0 0 !important;
}

/* --- Tablas más claras y legibles --- */
.table th {
    background: #003366;
    color: white;
    text-align: center;
}
.table td {
    vertical-align: middle;
}
.table-hover tbody tr:hover {
    background-color: #f0f8ff;
}

/* --- Formularios más estéticos --- */
.form-control {
    border-radius: 8px;
    border: 1px solid #ccc;
    transition: all 0.3s ease;
}
.form-control:focus {
    border-color: #004e92;
    box-shadow: 0 0 4px rgba(0,78,146,0.4);
}

/* --- Login / páginas centradas --- */
/*
.login-page, .register-page {
    background: linear-gradient(135deg, #00264d, #336699);
    color: #fff;
}
.login-box, .register-box {
    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
    border-radius: 12px;
}*/

/* --- Footer discreto --- */
.main-footer {
    background-color: #001f3f;
    color: #ccc;
    border: none;
    text-align: center;
}

/* --- Animaciones suaves al entrar contenido --- */
.content-wrapper {
    animation: fadeIn 0.4s ease-in;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}