/* Base */
body { 
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
    background-color: #121416; 
    margin: 0; 
    padding: 20px;
    color: #e1e1e1; 
}

/* Typography */
h2, h3 { color: #ffffff; }

/* Buttons */
.btn { 
    padding: 10px 15px; 
    border: none; 
    border-radius: 4px; 
    font-size: 14px; 
    cursor: pointer; 
    text-decoration: none; 
    font-weight: bold; 
    display: inline-block; 
    transition: background 0.3s; 
    box-sizing: border-box;
}
.btn-primary { background-color: #0d6efd; color: white; }
.btn-primary:hover { background-color: #0b5ed7; }
.btn-success { background-color: #198754; color: white; border: 1px solid #146c43; }
.btn-success:hover { background-color: #157347; }
.btn-warning { background-color: #ffc107; color: #000; }
.btn-warning:hover { background-color: #ffca2c; }
.btn-danger { background-color: #dc3545; color: white; }
.btn-danger:hover { background-color: #bb2d3b; }

/* Forms */
.form-group { margin-bottom: 15px; }
.form-group label { display: block; margin-bottom: 5px; color: #adb5bd; }
.form-group input, .form-group select, .form-group textarea { 
    width: 100%; 
    padding: 10px; 
    background-color: #2c3034; 
    border: 1px solid #495057; 
    border-radius: 4px; 
    box-sizing: border-box; 
    color: #ffffff; 
    font-size: 15px; 
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { 
    outline: none; 
    border-color: #0d6efd; 
    box-shadow: 0 0 0 2px rgba(13,110,253,0.25); 
}

/* Alerts / Errors */
.error, .alert-error { 
    color: #ea868f; 
    background-color: #2c0b0e; 
    border: 1px solid #842029; 
    padding: 10px; 
    border-radius: 4px; 
    margin-bottom: 15px; 
    text-align: center; 
}

/* Tables */
table { width: 100%; border-collapse: collapse; margin-top: 10px; }
th, td { padding: 12px 15px; text-align: left; border-bottom: 1px solid #2c3034; }
th { background-color: #212529; color: #adb5bd; font-weight: bold; }
tr:hover { background-color: #2c3034; }

/* Badges */
.badge { padding: 5px 10px; border-radius: 12px; font-size: 12px; font-weight: bold; display: inline-block; }
.badge-activo { background-color: #051b11; color: #75b798; border: 1px solid #0f5132; }
.badge-inactivo { background-color: #2c0b0e; color: #ea868f; border: 1px solid #842029; }

/* Containers & Common Structures */
.container { 
    max-width: 1000px; 
    margin: 20px auto; 
    background: #1e2125; 
    padding: 30px; 
    border-radius: 8px; 
    box-shadow: 0 8px 16px rgba(0,0,0,0.5); 
    border: 1px solid #2c3034; 
}
.header-flex { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    border-bottom: 2px solid #0d6efd; 
    padding-bottom: 10px; 
    margin-bottom: 20px; 
}

/* Navbar */
.navbar { 
    background-color: #1e2125; 
    color: white; 
    padding: 15px 20px; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    border-radius: 8px; 
    border: 1px solid #2c3034; 
    box-shadow: 0 4px 6px rgba(0,0,0,0.3); 
    margin-bottom: 20px;
}
.navbar h2 { margin: 0 0 5px 0; font-size: 20px; }
.navbar small { color: #adb5bd; }
.navbar-logout { 
    color: #ea868f; 
    text-decoration: none; 
    font-weight: bold; 
    padding: 8px 15px; 
    border-radius: 4px; 
    border: 1px solid #842029; 
    transition: all 0.3s; 
}
.navbar-logout:hover { background-color: #2c0b0e; color: #ffffff; }

/* Cards (Dashboard) */
.grid-modulos { display: flex; gap: 20px; margin-top: 25px; flex-wrap: wrap; }
.tarjeta { 
    background: #1e2125; 
    padding: 25px; 
    border-radius: 8px; 
    box-shadow: 0 4px 8px rgba(0,0,0,0.4); 
    flex: 1; 
    min-width: 250px; 
    text-align: center; 
    border-top: 4px solid #0d6efd; 
    border-bottom: 1px solid #2c3034; 
    border-left: 1px solid #2c3034; 
    border-right: 1px solid #2c3034; 
    display: flex; 
    flex-direction: column; 
    justify-content: space-between; 
}
.tarjeta h3 { margin-top: 0; }
.tarjeta p { color: #adb5bd; margin-bottom: 20px; }
.acciones-tarjeta { display: flex; flex-direction: column; gap: 10px; margin-top: auto; }

/* Utils */
.acciones { display: flex; gap: 8px; }

/* Configuración e Imágenes de Boletas */
.preview-img { max-width: 250px; max-height: 150px; object-fit: contain; margin-top: 15px; border-radius: 4px; border: 1px solid #495057; display: block; }
.img-oficial { max-width: 120px; max-height: 120px; object-fit: contain; }
.img-firma-dir { max-width: 200px; max-height: 80px; object-fit: contain; }

/* Ocultar información del navegador al imprimir boletas */
@media print {
    @page {
        margin: 0; /* Elimina encabezados y pies de página (URL, fecha) del navegador */
    }
    body, h1, h2, h3, h4, h5, h6, p, td, th, span, div, strong {
        margin: 1.5cm; /* Añade margen físico al documento impreso para que no se corte */
        background-color: white !important;
        color: black !important;
        -webkit-print-color-adjust: exact;
    }
    /* Restablecer margen solo para el body, no para los textos */
    h1, h2, h3, h4, h5, h6, p, td, th, span, div, strong {
        margin: unset;
        background-color: transparent !important;
    }
    .no-print-bar {
        display: none !important;
    }
}