/* Estilos para módulo de Liquidaciones */

.kpi-card {
    transition: transform 0.2s ease;
}

.kpi-card:hover {
    transform: translateY(-2px);
}

.pedido-row {
    transition: background-color 0.2s ease;
}

.pedido-row:hover {
    background-color: rgba(0, 123, 255, 0.05);
}

.pedido-row.selected {
    background-color: rgba(40, 167, 69, 0.1);
}

/* Checkbox styling */
.check-pedido {
    cursor: pointer;
    width: 1.2rem;
    height: 1.2rem;
}

.check-pedido:checked {
    background-color: #28a745;
    border-color: #28a745;
}

/* Progress bar animation */
.progress-bar {
    transition: width 0.5s ease;
}

/* Cards hover effect */
.card {
    transition: box-shadow 0.3s ease;
}

.card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Alert animation */
#alertDiferencia {
    transition: all 0.3s ease;
}

/* Table row selection */
#tablaPedidos tbody tr:has(.check-pedido:checked) {
    background-color: rgba(40, 167, 69, 0.08);
}

/* Button loading state */
#btnCrearLiquidacion:disabled {
    opacity: 0.8;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .kpi-card .h4 {
        font-size: 1.25rem;
    }
}

/* Historial table */
#tablaHistorial tbody tr {
    cursor: pointer;
}

#tablaHistorial tbody tr:hover {
    background-color: rgba(0, 123, 255, 0.05);
}

/* Modal enhancements */
#modalDetalleLiquidacion .modal-body {
    max-height: 70vh;
    overflow-y: auto;
}

/* Badge animations */
.badge {
    transition: transform 0.2s ease;
}

.badge:hover {
    transform: scale(1.05);
}

/* Info repartidor */
#infoRepartidor {
    border-top: 1px solid #dee2e6;
    padding-top: 1rem;
}

/* Panel liquidación sticky */
@media (min-width: 992px) {
    #panelLiquidacion {
        position: sticky;
        top: 1rem;
    }
}