/* Cabecera del reporte con el color del menú principal */
.report-header {
    background-color: var(--primary-solid-color, #4399d3);
    color: white;
    padding: 0.75rem 1.25rem;
    border-radius: 0.375rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}
#existe-container {
    zoom: 0.9;
}
.report-title {
    font-size: 1.5rem;
    margin: 0;
    flex-shrink: 0;
}

.report-controls {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-grow: 1;
    justify-content: flex-end;
}

.report-controls #search-input {
    max-width: 300px;
}

.report-controls #sucursal-select {
    max-width: 250px;
}

/* Contenedor de la tabla con scroll */
.table-container {
    max-height: 65vh; /* Altura máxima antes de que aparezca el scroll */
    overflow-y: auto;
    position: relative; /* Necesario para que el thead sticky funcione */
}

/* SOLUCIÓN: Nuevos estilos para el contenedor de totales (pie de página del reporte).
   Se posiciona fuera y debajo de la tabla con scroll. */
#totals-container {
    display: none; /* Oculto por defecto, se muestra con JS */
    /* SOLUCIÓN: Se usan los mismos estilos que .module-footer para consistencia. */
    background: linear-gradient(to bottom, var(--secondary-solid-color, #2c3e50), var(--primary-solid-color, #4399d3));
    color: #ffffff;
    padding: 0.75rem 1.5rem;
    margin-top: 1.5rem;
    border-radius: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: bold;
    font-size: 1.1rem;
}

.total-item {
    flex-shrink: 0;
}

/* NUEVO: Estilo para las cabeceras de las tablas (principal y colapsable) */
/* Se aplica a las celdas 'th' dentro de un thead con esta clase */
/* Aumentamos la especificidad para ganar la batalla contra Bootstrap */
.table > thead.table-custom-header-footer th {
    /* 
      Usa la variable --primary-solid-color definida globalmente por main.js.
      Si no existe, usa un color oscuro por defecto.
    */
    background-color: var(--primary-solid-color, #343a40) !important;
    color: white !important;
}

/* --- Estilo para ocultar/mostrar la fila de detalles de lotes --- */
.lotes-details-row.lotes-hidden {
    display: none;
}

/* --- ESTILOS PARA INSIGNIAS (Importado de compras.css para consistencia) --- */

/* Estilos para las insignias de vencimiento */
.venc-default, .venc-lejano, .venc-medio, .venc-cercano, .venc-pasado {
    padding: 0.2em 0.6em;
    border-radius: 0.25rem;
    font-size: 0.75em;
    font-weight: 700;
    display: inline-block;
    color: #fff; /* Texto blanco por defecto */
}
.venc-default {
    background-color: #6c757d; /* Gris */
}
.venc-pasado {
    background-color: #000000; /* Negro */
}
.venc-cercano {
    background-color: #dc3545; /* Rojo */
}
.venc-medio {
    background-color: #fd7e14; /* Naranja */
    color: #000; /* Texto negro para mejor contraste */
}
.venc-lejano {
    background-color: #0dcaf0; /* Celeste */
    color: #000; /* Texto negro para mejor contraste */
}

/* --- NUEVO: Estilos para los INPUTS de fecha editables --- */
/* Se aplica el color al texto y al borde para mantener la usabilidad */

input.venc-pasado {
    background-color: #000000;
    color: #ffffff !important;
    font-weight: bold;
    border-color: #000000;
}
input.venc-cercano {
    background-color: #dc3545;
    color: #ffffff !important; /* Rojo */
    font-weight: bold;
    border-color: #dc3545;
}
input.venc-medio {
    background-color: #fd7e14;
    /* SOLUCIÓN: Se cambia el color del texto a negro para que sea legible sobre el fondo naranja. */
    color: #000000 !important;
    font-weight: bold;
}
input.venc-lejano {
    background-color: #0dcaf0;
    /* SOLUCIÓN: Se cambia el color del texto a negro para que sea legible sobre el fondo celeste. */
    color: #000000 !important;
}
input.venc-default {
    /* Para fechas lejanas o sin fecha, se mantiene el color por defecto del input */
    background-color: #6c757d;
    color: #ffffff !important;
}

/* Clases para el color del fondo del stock (como badges) */
.stock-zero, .stock-low, .stock-ok {
    display: inline-block;
    padding: 0.2em 0.6em;
    font-size: 0.85em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.375rem;
    color: #fff; /* Texto blanco por defecto */
}
.stock-zero {
    background-color: #212529; /* Negro/Gris oscuro */
}
.stock-low {
    background-color: #dc3545; /* Rojo */
}
.stock-ok {
    background-color: #0dcaf0; /* Celeste */
    color: #000; /* Texto negro para mejor contraste */
}