/* === ESTILOS DEL INVENTARIO (VERSIÓN MEJORADA) === */

.inventory-view {
    padding: 2rem 2rem 2rem;
    max-width: 1400px;
    margin: 0 auto;
    animation: fadeIn 0.5s ease-out;
}

@media (max-width: 768px) {
    .inventory-view {
        padding: 1rem;
    }
}

/* === LÓGICA DE FILAS PARA EL FORMULARIO DE INVENTARIO === */
.inventory-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem 1.5rem;
    align-items: end;
}

.inventory-grid .form-group {
    margin-bottom: 2px;
    margin-top: 10px;
}

/* Fila 1: Datos principales */
.inventory-grid .name-group { grid-column: span 2; }
.inventory-grid .sku-group { grid-column: span 1; }
.inventory-grid .cat-group { grid-column: span 1; }

/* Fila 2: Clasificación y Proveedor */
.inventory-grid .unit-group { grid-column: span 1; }
.inventory-grid .supplier-group { grid-column: span 3; }

/* Fila 3: Valores y Stock */
.inventory-grid .cost-group { grid-column: span 1; }
.inventory-grid .price-group { grid-column: span 1; }
.inventory-grid .stock-group { grid-column: span 1; }
.inventory-grid .min-stock-group { grid-column: span 1; }

/* Fila 4: Descripción */
.inventory-grid .desc-group { grid-column: span 4; }

/* Fila de Botones */
.inventory-grid .actions-group {
    grid-column: span 4;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding-top: 1rem;
}

/* Responsividad para pantallas medianas (Tablets) */
@media (max-width: 1024px) {
    .inventory-grid {
        grid-template-columns: 1fr 1fr;
    }
    .inventory-grid .name-group,
    .inventory-grid .supplier-group,
    .inventory-grid .desc-group,
    .inventory-grid .actions-group { grid-column: span 2; }
    
    .inventory-grid .sku-group,
    .inventory-grid .cat-group,
    .inventory-grid .unit-group,
    .inventory-grid .cost-group,
    .inventory-grid .price-group,
    .inventory-grid .stock-group,
    .inventory-grid .min-stock-group { grid-column: span 1; }
}

/* Responsividad para móviles */
@media (max-width: 768px) {
    .inventory-grid {
        grid-template-columns: 1fr;
    }
    .inventory-grid .form-group,
    .inventory-grid .actions-group { grid-column: span 1 !important; }
}

/* === MODIFICADORES DE TABLA Y TEXTO === */
.stock-low {
    color: #f39c12 !important;
}

.stock-out {
    color: #e74c3c !important;
}

/* Estilos para la tabla de historial de inventario (dentro del modal) */
#inventory-history-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
}

#inventory-history-table th, #inventory-history-table td {
    border-bottom: 1px solid var(--card-border);
    padding: 12px 10px;
    text-align: left;
    font-size: 0.9rem;
}

#inventory-history-table th {
    background-color: var(--input-bg);
    color: var(--text-secondary);
    font-weight: 600;
    position: sticky;
    top: 0;
    z-index: 10;
}

#inventory-history-table tbody tr:hover {
    background-color: rgba(0,0,0,0.05);
}

body.light-mode #inventory-history-table tbody tr:hover {
    background-color: rgba(0,0,0,0.02);
}

.history-type {
    padding: 4px 8px;
    border-radius: 12px;
    font-weight: bold;
    font-size: 0.8rem;
    white-space: nowrap;
}

.history-type.sale {
    background-color: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}

.history-type.purchase {
    background-color: rgba(16, 185, 129, 0.1);
    color: #10b981;
}

.modal-content.large {
    max-width: 1000px;
    width: 90%;
}