/**
 * Estilos para el módulo CE / VAL
 * Control de Ejecución y Valorización
 */

/* ========================================
   CONTENEDOR PRINCIPAL
   ======================================== */
#ejecucionObra.module-content {
    padding: 0 !important;
    margin: 0 !important;
}

#ejecucionObra.module-content.active {
    display: flex !important;
    flex-direction: column !important;
    height: calc(100vh - 60px) !important;
    overflow: hidden !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    padding: 0 !important;
    margin: 0 !important;
}

.ejecucion-container {
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
    background: #f8f9fa;
    overflow: hidden;
    justify-content: flex-start;
}

.ejecucion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    background: white;
    border-bottom: 1px solid #e0e0e0;
    gap: 20px;
    min-height: 50px;
    flex-shrink: 0;
}

/* ========================================
   PESTAÑAS CE / VAL
   ======================================== */
.ejecucion-tabs {
    display: flex;
    gap: 0;
    background: #e9ecef;
    border-radius: 8px;
    padding: 3px;
}

.ejecucion-tab {
    padding: 8px 20px;
    border: none;
    background: transparent;
    color: #666;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ejecucion-tab:hover {
    background: rgba(255, 255, 255, 0.5);
    color: #333;
}

.ejecucion-tab.active {
    background: #4caf50;
    color: white;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.ejecucion-tab i {
    font-size: 12px;
}

/* Contenido de pestañas */
.tab-content-ce,
.tab-content-val {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

.tab-content-ce:not(.active),
.tab-content-val:not(.active) {
    display: none;
}

/* Placeholder VAL */
.val-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    color: #888;
    text-align: center;
    padding: 40px;
}

.val-placeholder i {
    font-size: 48px;
    color: #ccc;
    margin-bottom: 15px;
}

.val-placeholder h3 {
    margin: 0 0 10px 0;
    color: #666;
}

.val-placeholder p {
    margin: 0;
    font-size: 14px;
}

/* Selector de proyecto */
.ejecucion-proyecto-select {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ejecucion-proyecto-select select {
    min-width: 280px;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
}

/* Controles */
.ejecucion-controls {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* Navegación de período */
.ejecucion-period-nav {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ejecucion-period-nav button {
    height: 32px;
    border: 1px solid #ddd;
    background: white;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    transition: all 0.2s;
    padding: 0 10px;
}

.ejecucion-period-nav button:hover {
    background: #f0f0f0;
    border-color: #ccc;
}

.ejecucion-period-nav .btn-today {
    font-size: 13px;
    gap: 5px;
    color: #6366f1;
    border-color: #6366f1;
}

.ejecucion-period-nav .btn-today:hover {
    background: #6366f1;
    color: white;
}

#ejecucionPeriodLabel {
    font-weight: 500;
    color: #333;
    min-width: 150px;
    text-align: center;
}

/* ========================================
   RESUMEN - Ultra Minimalista
   ======================================== */
#ejecucionSummaryCards {
    display: flex;
    gap: 8px;
    padding: 8px 20px;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
    align-items: center;
    font-size: 13px;
    color: #555;
}

.summary-stat {
    color: #666;
}

.summary-stat strong {
    color: #333;
    font-weight: 600;
}

.summary-divider {
    color: #ddd;
}

/* Botón exportar */
.btn-export {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: white;
    color: #4caf50;
    border: 1px solid #4caf50;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}

.btn-export:hover {
    background: #4caf50;
    color: white;
}

/* ========================================
   CONTENIDO PRINCIPAL - TABLA UNIFICADA
   ======================================== */
.ejecucion-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
    background: white;
}

.ejecucion-content.hidden {
    display: none;
}

/* ========================================
   ESTILOS LEGACY (mantener por compatibilidad)
   ======================================== */
.expand-toggle {
    cursor: pointer;
    width: 20px;
    display: inline-flex;
    justify-content: center;
}

.expand-toggle:hover {
    color: #6366f1;
}

.expand-icon {
    font-size: 10px;
    color: #888;
    transition: transform 0.2s;
}

.expand-placeholder {
    width: 10px;
    display: inline-block;
}

/* Estado vacío */
.grid-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: #999;
    font-size: 14px;
}

.grid-empty-state i {
    font-size: 36px;
    margin-bottom: 12px;
    color: #ccc;
}

.grid-empty-state p {
    margin: 0;
}

/* Progress bars mini */
.progress-mini {
    height: 6px;
    background: #e9ecef;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 3px;
}

.progress-bar-mini {
    height: 100%;
    border-radius: 3px;
    transition: width 0.3s;
}

.progress-bar-mini.progress-complete { background: #10b981; }
.progress-bar-mini.progress-warning { background: #f59e0b; }
.progress-bar-mini.progress-danger { background: #ef4444; }
.progress-bar-mini.progress-empty { background: #e9ecef; }

.progress-text {
    font-size: 11px;
    color: #666;
}

/* Badges */
.badge-sm {
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 10px;
    margin-left: 8px;
}

.badge-secondary { background: #6b7280; color: white; }
.badge-primary { background: #6366f1; color: white; }
.badge-success { background: #10b981; color: white; }
.badge-warning { background: #f59e0b; color: white; }

/* ========================================
   PANEL DERECHO - GRID DE AVANCES
   ======================================== */
.ejecucion-grid-panel {
    flex: 1;
    background: #f8f9fa;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
}

.ejecucion-grid-header-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    background: white;
    border-bottom: 1px solid #e0e0e0;
}

.ejecucion-grid-header-bar h4 {
    margin: 0;
    font-size: 0.9rem;
    color: #555;
}

/* Acciones del grid */
.ejecucion-grid-actions {
    display: flex;
    gap: 10px;
}

/* Botón Guardar Cambios */
.btn-save-changes {
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 500;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 6px;
}

.btn-save-changes:disabled {
    background: #e9ecef;
    color: #999;
    cursor: not-allowed;
}

.btn-save-changes:not(:disabled) {
    background: #10b981;
    color: white;
    box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3);
}

.btn-save-changes:not(:disabled):hover {
    background: #059669;
    transform: translateY(-1px);
}

.btn-save-changes.has-changes {
    animation: pulse-save 1.5s ease-in-out infinite;
}

@keyframes pulse-save {
    0%, 100% { box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3); }
    50% { box-shadow: 0 4px 12px rgba(16, 185, 129, 0.5); }
}

#ejecucionGridContainer {
    flex: 1;
    overflow: auto;
    padding: 0;
}

/* Grid de avances - SOLO fechas */
.ejecucion-grid-header {
    display: flex;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 10;
    background: #6366f1;
    color: white;
    height: 38px;
    box-sizing: border-box;
}

.ejecucion-grid-body {
    background: white;
}

.ejecucion-grid-row {
    display: flex;
    align-items: center;
    height: 36px;
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.2s;
    box-sizing: border-box;
}

.ejecucion-grid-row:hover {
    background: #f8f9ff;
}

.ejecucion-grid-row.highlighted {
    background: #e8edff;
    box-shadow: inset 3px 0 0 #6366f1;
}

.ejecucion-grid-row:last-child {
    border-bottom: none;
}

/* Celdas del grid - header de fechas */
.grid-cell {
    text-align: center;
    font-size: 12px;
    flex: 1;
    min-width: 65px;
    max-width: 80px;
}

.grid-header-fecha {
    padding: 8px 4px;
    font-size: 11px;
    font-weight: 500;
}

.grid-header-fecha.today {
    background: rgba(255,255,255,0.2);
}

.grid-header-fecha.weekend {
    background: rgba(0,0,0,0.1);
}

/* Celdas editables */
.grid-value-cell {
    flex: 1;
    min-width: 65px;
    max-width: 80px;
    padding: 2px 3px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.grid-value-cell .grid-input {
    width: 100%;
    height: 28px;
    padding: var(--input-padding-sm);
    border: 1px solid var(--input-border-color);
    border-radius: var(--input-radius-sm);
    font-size: var(--input-font-size-sm);
    text-align: center;
    background: var(--input-bg);
    transition: var(--transition-fast);
}

.grid-value-cell .grid-input:focus {
    outline: none;
    border-color: var(--table-header-bg);
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
}

.grid-value-cell .grid-input:hover:not(:focus) {
    border-color: #aaa;
}

/* Celda con valor existente */
.grid-value-cell.has-value .grid-input {
    background: #f0f9ff;
    border-color: var(--color-info);
    color: #1e40af;
    font-weight: var(--font-weight-medium);
}

/* Celda con cambios pendientes */
.grid-value-cell.pending .grid-input {
    background: var(--table-row-modified);
    border-color: var(--color-warning-dark);
    color: #92400e;
    font-weight: var(--font-weight-semibold);
}

/* Quitar flechas del input number */
.grid-input::-webkit-outer-spin-button,
.grid-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.grid-input[type=number] {
    -moz-appearance: textfield;
}

/* Celdas de fin de semana */
.grid-value-cell.weekend {
    background: #f9fafb;
}

.grid-value-cell.weekend .grid-input {
    background: #f3f4f6;
}

/* Celda de hoy */
.grid-value-cell.today {
    background: rgba(99, 102, 241, 0.1);
}

.grid-value-cell.today .grid-input {
    border-color: #6366f1;
}

.grid-value:hover {
    background: #e8edff;
    box-shadow: inset 0 0 0 2px #6366f1;
}

.grid-value.has-value {
    background: #d1fae5;
    color: #065f46;
    font-weight: 500;
}

.grid-value.today {
    box-shadow: inset 0 0 0 2px #f59e0b;
}

.grid-value.weekend {
    background: #fef3c7;
}

.grid-header-fecha.today {
    background: rgba(245, 158, 11, 0.3);
}

.grid-header-fecha.weekend {
    background: rgba(0,0,0,0.1);
}

/* Colores de porcentaje */
.grid-pct.progress-complete { color: #10b981; }
.grid-pct.progress-warning { color: #f59e0b; }
.grid-pct.progress-danger { color: #ef4444; }

/* ========================================
   MODAL DE AVANCE
   ======================================== */
#avanceModal .modal-content {
    max-width: 420px;
}

#avanceModal .modal-header {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    color: white;
    border-radius: 8px 8px 0 0;
}

#avanceModal .modal-close {
    background: transparent;
    border: none;
    color: white;
    font-size: 20px;
    cursor: pointer;
}

.avance-info {
    background: #f8f9fa;
    padding: 12px;
    border-radius: 6px;
    margin-bottom: 15px;
}

.avance-info p {
    margin: 0 0 5px 0;
    font-size: 13px;
    color: #555;
}

.avance-info p:last-child {
    margin-bottom: 0;
    color: #888;
}

.avance-info i {
    color: #6366f1;
    margin-right: 5px;
}

#formAvance .form-group {
    margin-bottom: 15px;
}

#formAvance label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
    color: #333;
    font-size: 13px;
}

#formAvance label i {
    color: #6366f1;
    margin-right: 5px;
}

#formAvance input,
#formAvance textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
}

#formAvance input:focus,
#formAvance textarea:focus {
    outline: none;
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

#avanceModal .modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 15px 20px;
    border-top: 1px solid #e0e0e0;
}

#avanceModal .modal-footer .btn-danger {
    margin-right: auto;
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 1200px) {
    .ejecucion-tree-panel {
        width: 40%;
        min-width: 350px;
    }
}

@media (max-width: 992px) {
    .ejecucion-content {
        flex-direction: column;
    }
    
    .ejecucion-tree-panel {
        width: 100%;
        max-width: none;
        height: 50%;
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
    }
    
    .ejecucion-grid-panel {
        height: 50%;
    }
}

@media (max-width: 768px) {
    .ejecucion-header {
        flex-wrap: wrap;
    }
    
    #ejecucionSummaryCards {
        flex-wrap: wrap;
    }
    
    .summary-card {
        flex: 1;
        min-width: 120px;
    }
}

/* ========================================
   TABLA UNIFICADA
   ======================================== */

/* Header unificado */
.ejecucion-unified-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    background: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
}

.ejecucion-header-left,
.ejecucion-header-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ejecucion-unified-header h4 {
    margin: 0;
    font-size: 0.9rem;
    color: #555;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Contenedor de acciones: buscador + botones en línea */
.ejecucion-tree-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
}

.ejecucion-tree-actions button {
    padding: 4px 10px;
    font-size: 12px;
    border: 1px solid #ddd;
    background: white;
    border-radius: 4px;
    cursor: pointer;
    margin-left: 0;
}

.ejecucion-tree-actions button:hover {
    background: #f0f0f0;
}

/* Botón de refrescar */
.ejecucion-tree-actions .btn-refresh {
    background: #e3f2fd;
    border-color: #2196f3;
    color: #2196f3;
}

.ejecucion-tree-actions .btn-refresh:hover {
    background: #bbdefb;
}

/* Barra de búsqueda */
.ejecucion-search-box {
    display: flex;
    align-items: center;
    background: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 4px 8px;
    margin-right: 5px;
}

.ejecucion-search-box i {
    color: #888;
    font-size: 12px;
    margin-right: 6px;
}

.ejecucion-search-box input {
    border: none;
    outline: none;
    font-size: 12px;
    width: 150px;
}

.ejecucion-search-box input::placeholder {
    color: #aaa;
}

/* Contador de filas */
.row-count {
    font-size: 12px;
    color: #666;
    background: #e9ecef;
    padding: 4px 10px;
    border-radius: 12px;
    margin-right: 15px;
}

/* Botón Guardar Cambios */
.btn-save-changes {
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s;
}

.btn-save-changes:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-save-changes.has-changes {
    animation: pulse-save 2s infinite;
    background: #10b981;
    border-color: #10b981;
}

@keyframes pulse-save {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
    50% { box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); }
}

/* Wrapper para scroll horizontal y vertical */
.ejecucion-table-wrapper {
    flex: 1;
    overflow: auto;
    background: white;
    max-height: calc(100vh - 280px);
    position: relative;
}

/* Tabla unificada - aplica a CE y VAL */
.ejecucion-unified-table {
    width: auto;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11px;
    table-layout: auto;
}

.ejecucion-unified-table thead tr {
    position: sticky;
    top: 0;
    z-index: 20;
}

.ejecucion-unified-table thead {
    position: relative;
}

.ejecucion-unified-table th {
    padding: 4px 6px;
    text-align: left;
    font-weight: 500;
    color: white;
    border: 1px solid #2e7d32;
    background: #4caf50;
    white-space: nowrap;
    height: 28px;
    box-sizing: border-box;
    font-size: 11px;
}

.ejecucion-unified-table td {
    padding: 3px 6px;
    border: 1px solid #ddd;
    vertical-align: middle;
    height: 26px;
    box-sizing: border-box;
}

/* ========================================
   COLUMNAS FIJAS (Sticky)
   ======================================== */
.col-item {
    position: sticky;
    left: 0;
    z-index: 10;
    background: inherit;
    white-space: nowrap;
    min-width: 90px;
}

.col-descripcion {
    position: sticky;
    left: 90px;
    z-index: 10;
    background: inherit;
    max-width: 280px;
    min-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.col-unidad {
    position: sticky;
    left: 290px;
    z-index: 10;
    background: inherit;
    text-align: center;
    white-space: nowrap;
    min-width: 45px;
}

.col-plan {
    position: sticky;
    left: 335px;
    z-index: 10;
    background: inherit;
    text-align: right;
    white-space: nowrap;
    min-width: 60px;
}

.col-ejec {
    position: sticky;
    left: 395px;
    z-index: 10;
    background: inherit;
    text-align: right;
    white-space: nowrap;
    min-width: 50px;
}

.col-avance {
    position: sticky;
    left: 445px;
    z-index: 10;
    background: inherit;
    text-align: right;
    white-space: nowrap;
    font-weight: 500;
    min-width: 50px;
    border-right: 2px solid #999 !important;
}

/* Headers fijos tienen z-index mayor */
.ejecucion-unified-table th.col-item,
.ejecucion-unified-table th.col-descripcion,
.ejecucion-unified-table th.col-unidad,
.ejecucion-unified-table th.col-plan,
.ejecucion-unified-table th.col-ejec,
.ejecucion-unified-table th.col-avance {
    z-index: 25;
    background: #43a047;
}

/* Sombra en la última columna fija para indicar scroll */
.col-avance::after {
    content: '';
    position: absolute;
    top: 0;
    right: -6px;
    bottom: 0;
    width: 6px;
    background: linear-gradient(to right, rgba(0,0,0,0.08), transparent);
    pointer-events: none;
}

/* Columnas de fecha */
.col-fecha {
    width: 55px;
    min-width: 55px;
    text-align: center;
    padding: 2px !important;
}

/* Header de fecha */
.ejecucion-unified-table th.col-fecha {
    font-size: 11px;
    padding: 4px 2px;
    font-weight: 500;
    background: #66bb6a;
}

/* Filas */
.ejecucion-row {
    transition: background 0.15s;
}

/* Fila de partida (título) */
.partida-row {
    background: #f5f5f5;
}

.partida-row td {
    background: #f5f5f5;
}

.partida-row:hover td {
    background: #eee;
}

.partida-row td {
    padding: 4px 6px !important;
    font-weight: normal;
}

/* Títulos (partidas sin unidad) en negrita */
.partida-row.is-title td {
    font-weight: 600;
}

.partida-row.is-title .col-descripcion {
    font-weight: 600;
}

.partida-row .expand-toggle {
    cursor: pointer;
    width: 18px;
    display: inline-flex;
    justify-content: center;
    margin-right: 4px;
}

.partida-row .expand-toggle:hover {
    color: #6366f1;
}

.partida-row .expand-icon {
    font-size: 10px;
    color: #888;
}

.partida-row .partida-codigo {
    font-weight: 600;
    color: #6366f1;
}

.partida-row .col-avance {
    color: #888;
}

.partida-row .col-fecha.blocked {
    background: #eaeaea;
}

/* Fila de lote */
.lote-row {
    background: white;
}

.lote-row td {
    background: white;
}

.lote-row:hover td {
    background: #f5f8ff;
}

.lote-row td {
    padding: 2px 6px !important;
}

.lote-row .col-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.lote-row .lote-icon {
    color: #8b5cf6;
    font-size: 11px;
}

.lote-row .lote-nombre {
    font-weight: 500;
    color: #555;
}

.lote-row .lote-label {
    font-size: 12px;
    color: #666;
}

/* Input en celdas de fecha */
.lote-row .col-fecha {
    padding: 0 !important;
}

.lote-row .col-fecha .grid-input {
    width: 100%;
    height: 28px;
    border: none;
    background: transparent;
    text-align: center;
    font-size: 12px;
    padding: 0 2px;
    box-sizing: border-box;
}

.lote-row .col-fecha .grid-input:focus {
    background: #fff;
    outline: 2px solid #6366f1;
    z-index: 5;
    position: relative;
}

.lote-row .col-fecha .grid-input::-webkit-inner-spin-button,
.lote-row .col-fecha .grid-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.lote-row .col-fecha.has-value {
    background: #e8f4ff;
}

.lote-row .col-fecha.pending {
    background: #fff3cd;
}

.lote-row .col-fecha.today {
    background: #fffde7;
}

/* Fechas dentro del rango planificado del lote */
.lote-row .col-fecha.in-plan-range {
    border: 2px solid #4caf50 !important;
    border-radius: 2px;
}

/* Prioridades de estilos */
.lote-row .col-fecha.in-plan-range.has-value {
    border-color: #2e7d32 !important;
    background: #e8f4ff;
}

.lote-row .col-fecha.in-plan-range.pending {
    border-color: #f59e0b !important;
    background: #fff3cd;
}

/* Clases de progreso */
.progress-success { color: #10b981; }
.progress-warning { color: #f59e0b; }
.progress-danger { color: #ef4444; }
.progress-info { color: #3b82f6; }

/* ========================================
   FIX: Ocultar elementos cuando CE/VAL está activo
   ======================================== */
/* Ocultar el header "Análisis de Proyectos" que está fuera del main */
body:has(#ejecucionObra.active) > .module-content,
body:has(#ejecucionObra[style*="display: block"]) > .module-content,
body:has(#ejecucionObra[style*="display: flex"]) > .module-content {
    display: none !important;
}

/* Ocultar .module-header cuando ejecucionObra está activo */
body:has(#ejecucionObra.active) .module-header,
body:has(#ejecucionObra[style*="display: block"]) .module-header,
body:has(#ejecucionObra[style*="display: flex"]) .module-header {
    display: none !important;
}

/* Quitar padding y altura mínima del main-content */
body:has(#ejecucionObra.active) .main-content,
body:has(#ejecucionObra[style*="display: block"]) .main-content,
body:has(#ejecucionObra[style*="display: flex"]) .main-content {
    padding: 0 !important;
    overflow: hidden !important;
    min-height: 0 !important;
}

/* El módulo CE/VAL debe ocupar todo el espacio disponible */
body:has(#ejecucionObra.active) .main-content > .module-content:not(#ejecucionObra) {
    display: none !important;
}

/* ========================================
   ESTILOS VAL (VALORIZACIÓN) - COLOR NARANJA
   Solo override de colores, usa las mismas clases que CE
   ======================================== */

/* Header VAL - fondo naranja claro */
.val-header {
    background: #fff8f0 !important;
    border-bottom-color: #ffd9b3 !important;
}

.val-header h4 {
    color: #e65100 !important;
}

/* Tabla VAL - headers naranja */
.val-table thead th {
    background: #ff9800 !important;
    border-color: #f57c00 !important;
}

/* Columnas fijas VAL con color naranja oscuro */
.val-table th.col-item,
.val-table th.col-descripcion,
.val-table th.col-unidad,
.val-table th.col-plan,
.val-table th.col-ejec,
.val-table th.col-avance {
    background: #e65100 !important;
    border-color: #bf360c !important;
}

/* Headers de fecha VAL - naranja claro */
.val-table th.col-fecha {
    background: #ffb74d !important;
    border-color: #f57c00 !important;
}

/* Celdas con valor VAL - fondo naranja claro */
.val-table .lote-row .col-fecha.has-value {
    background: #fff3e0;
}

/* Celdas pending VAL */
.val-table .lote-row .col-fecha.pending {
    background: #fff3cd;
}

/* Fechas dentro del rango planificado del lote - VAL (naranja) */
.val-table .lote-row .col-fecha.in-plan-range {
    border: 2px solid #ff9800 !important;
    border-radius: 2px;
}

.val-table .lote-row .col-fecha.in-plan-range.has-value {
    border-color: #e65100 !important;
    background: #fff3e0;
}

.val-table .lote-row .col-fecha.in-plan-range.pending {
    border-color: #f59e0b !important;
    background: #fff3cd;
}

/* Botón guardar VAL */
.btn-val {
    background: #ff9800 !important;
    border-color: #f57c00 !important;
}

.btn-val:hover {
    background: #f57c00 !important;
}

.btn-val:disabled {
    background: #ffcc80 !important;
    border-color: #ffcc80 !important;
}

/* Summary VAL - igual que CE, sin fondo de color */
#valSummaryCards {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    background: #f5f5f5;
    color: #333;
    font-size: 13px;
    border-bottom: 1px solid #ddd;
}

#valSummaryCards .summary-stat {
    color: #333;
}

#valSummaryCards .summary-divider {
    color: #ccc;
}

#valSummaryCards .btn-export {
    margin-left: auto;
    background: #ff9800;
    border-color: #f57c00;
    color: white;
}

/* ========================================
   PLACEHOLDERS PARA PESTAÑAS EN DESARROLLO
   ======================================== */
.tab-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    color: #666;
    background: #fafafa;
    border-radius: 8px;
    margin: 20px;
}

.tab-placeholder i {
    font-size: 48px;
    color: #ccc;
    margin-bottom: 16px;
}

.tab-placeholder h3 {
    margin: 0 0 8px 0;
    color: #555;
    font-weight: 500;
}

.tab-placeholder p {
    margin: 0;
    color: #888;
    font-size: 14px;
}

/* Colores por pestaña */
.tab-content-mo .tab-placeholder i { color: #2196f3; }
.tab-content-mt .tab-placeholder i { color: #9c27b0; }
.tab-content-eq .tab-placeholder i { color: #ff5722; }
.tab-content-sr .tab-placeholder i { color: #009688; }

/* ========================================
   NAVEGACIÓN POR MESES (MT)
   ======================================== */

.mt-month-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 10px 15px;
    background: linear-gradient(135deg, #0288d1 0%, #01579b 100%);
    border-bottom: 1px solid #01579b;
    flex-shrink: 0;
}

.btn-month-nav {
    width: 36px;
    height: 36px;
    border: 2px solid rgba(255,255,255,0.3);
    background: rgba(255,255,255,0.1);
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 14px;
    transition: all 0.2s;
}

.btn-month-nav:hover {
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.5);
    transform: scale(1.05);
}

.month-display {
    font-size: 18px;
    font-weight: 600;
    color: white;
    min-width: 180px;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.btn-month-today {
    padding: 8px 16px;
    border: 2px solid rgba(255,255,255,0.5);
    background: rgba(255,255,255,0.15);
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    color: white;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
    margin-left: 10px;
}

.btn-month-today:hover {
    background: rgba(255,255,255,0.3);
    border-color: white;
}

/* ========================================
   TABLA DE GASTOS (MT, MO, EQ, SR) - ESTILO EXCEL
   ======================================== */

/* Contenedor de pestaña de gastos */
.tab-content-mt,
.tab-content-mo,
.tab-content-eq,
.tab-content-sr {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

/* Header de la sección */
.gastos-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    background: #f5f5f5;
    border-bottom: 1px solid #ddd;
    flex-shrink: 0;
}

.gastos-header-left {
    display: flex;
    align-items: center;
    gap: 15px;
}

.gastos-header-left h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.gastos-header-left h4 i {
    margin-right: 8px;
}

.gastos-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
}

.total-display {
    font-weight: 600;
    font-size: 14px;
    padding: 6px 12px;
    background: #e8f5e9;
    border-radius: 4px;
    color: #2e7d32;
}

/* Tema MT (Materiales) - Celeste */
.mt-theme h4 { color: #0277bd; }
.mt-theme h4 i { color: #03a9f4; }
.btn-mt { background: #03a9f4 !important; border-color: #0288d1 !important; }
.btn-mt:hover { background: #0288d1 !important; }
.btn-mt:disabled { background: #81d4fa !important; border-color: #81d4fa !important; }

/* Botones minimalistas */
.gastos-header .btn {
    padding: 5px 12px;
    font-size: 11px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
}

.gastos-header .btn-secondary {
    background: #f5f5f5;
    color: #555;
    border: 1px solid #ddd;
}

.gastos-header .btn-secondary:hover {
    background: #e0e0e0;
}

.gastos-header .btn-primary {
    background: #03a9f4;
    color: white;
}

.gastos-header .btn-primary:hover {
    background: #0288d1;
}

.gastos-header .btn-primary:disabled {
    background: #b3e5fc;
    cursor: not-allowed;
}

/* Botones de acción alineados */
.gastos-header-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.gastos-header-right .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 30px;
    padding: 0 12px;
    font-size: 12px;
    border-radius: 4px;
    white-space: nowrap;
}

/* Barra de búsqueda MT */
.mt-search-bar {
    display: flex;
    gap: 12px;
    padding: 8px 15px;
    background: #fafafa;
    border-bottom: 1px solid #eee;
    flex-shrink: 0;
}

.mt-search-bar .search-field {
    display: flex;
    align-items: center;
    gap: 6px;
}

.mt-search-bar .search-field label {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    white-space: nowrap;
}

.mt-search-bar .search-field input {
    padding: var(--input-padding-sm);
    border: 1px solid var(--input-border-color);
    border-radius: var(--input-radius-sm);
    font-size: var(--font-size-xs);
    width: 150px;
}

.mt-search-bar .search-field input:focus {
    outline: none;
    border-color: var(--color-info);
    box-shadow: var(--input-focus-shadow);
}

.btn-clear-filter {
    width: 24px;
    height: 24px;
    padding: 0;
    border: 1px solid #ddd;
    background: #f5f5f5;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #888;
    font-size: 10px;
    transition: all 0.2s;
}

.btn-clear-filter:hover {
    background: #e0e0e0;
    color: #555;
}

/* Wrapper de la tabla */
.gastos-table-wrapper {
    flex: 1;
    overflow: auto;
    background: white;
    min-height: 0;
    position: relative;
}

/* Tabla de gastos - estilo minimalista */
.gastos-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    table-layout: fixed;
}

.gastos-table thead {
    position: sticky;
    top: 0;
    z-index: 20;
}

.gastos-table thead th {
    position: sticky;
    top: 0;
    z-index: 20;
    background: #0288d1;
}

.gastos-table th {
    background: #0288d1;
    color: white;
    padding: 6px 4px;
    text-align: center;
    font-weight: 500;
    font-size: 11px;
    border: none;
    border-bottom: 2px solid #01579b;
    white-space: nowrap;
}

.gastos-table td {
    padding: 0;
    border: none;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
    height: 26px;
}

.gastos-table tr:hover td {
    background: #f8f4fc;
}

/* Anchos de columnas - Minimalista */
.gastos-table .col-status { width: 20px; text-align: center; }
.gastos-table .col-fecha { width: 68px; }
.gastos-table .col-codigo { width: 85px; }
.gastos-table .col-partida { width: 200px; }
.gastos-table .col-recurso { width: 200px; }
.gastos-table .col-unidad { width: 42px; text-align: center; }
.gastos-table .col-cant { width: 48px; }
.gastos-table .col-pu { width: 50px; }
.gastos-table .col-subtotal { width: 58px; }
.gastos-table .col-igv { width: 45px; }
.gastos-table .col-total { width: 58px; }
.gastos-table .col-actions { width: 44px; }

/* Inputs dentro de celdas */
.gastos-table input {
    width: 100%;
    height: 26px;
    border: none;
    padding: 3px 5px;
    font-size: var(--table-font-size-sm);
    background: transparent;
    box-sizing: border-box;
}

.gastos-table input::placeholder {
    color: var(--text-muted);
    font-style: italic;
    font-size: 10px;
}

.gastos-table input:focus {
    outline: none;
    background: #e1f5fe;
    box-shadow: inset 0 0 0 1px var(--color-info);
}

.gastos-table input[type="number"] {
    text-align: right;
}

.gastos-table input:disabled {
    background: var(--input-bg-disabled);
    color: var(--text-secondary);
}

/* Celdas calculadas (solo lectura) */
.gastos-table td.calculated {
    background: #fafafa;
    text-align: right;
    padding: 4px 6px;
    color: #333;
}

/* Celda de partida name (auto-fill) */
.gastos-table td.auto-fill {
    background: #f9f9f9;
    padding: 4px 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #555;
}

/* Estados de validación */
.gastos-table tr.row-valid td.col-status { color: #4caf50; }
.gastos-table tr.row-invalid td.col-status { color: #f44336; }
.gastos-table tr.row-empty td.col-status { color: #ccc; }
.gastos-table tr.row-saved td { background: #e8f5e9; }
.gastos-table tr.row-modified td { background: #fff8e1; }
.gastos-table tr.row-modified td.col-status { color: #ff9800; }

.gastos-table tr.row-invalid td.col-codigo input,
.gastos-table tr.row-invalid td.col-fecha input {
    background: #ffebee;
}

/* Input inválido individualmente */
.gastos-table input.input-invalid {
    background: #ffebee !important;
    color: #c62828;
}

.gastos-table tr.row-invalid td.auto-fill {
    background: #ffebee;
    color: #c62828;
    font-style: italic;
}

/* Errores específicos de partida */
.gastos-table td.auto-fill.error-title {
    background: #fff3e0;
    color: #e65100;
}

.gastos-table td.auto-fill.error-notfound {
    background: #ffebee;
    color: #c62828;
}

/* Columna de acciones */
.gastos-table td.col-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2px;
    padding: 0 2px;
}

/* Botón editar fila */
.gastos-table .btn-edit-row {
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: #999;
    cursor: pointer;
    font-size: 12px;
    border-radius: 3px;
}

.gastos-table .btn-edit-row:hover {
    color: #1976d2;
    background: #e3f2fd;
}

/* Botón eliminar fila */
.gastos-table .btn-delete-row {
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: #999;
    cursor: pointer;
    font-size: 14px;
    border-radius: 3px;
}

.gastos-table .btn-delete-row:hover {
    color: #f44336;
    background: #ffebee;
}

/* Fila hover */
.gastos-table tbody tr:hover td {
    background: #f5f5f5;
}

.gastos-table tbody tr:hover td.calculated,
.gastos-table tbody tr:hover td.auto-fill {
    background: #efefef;
}

/* Ocultar flechas de input number */
.gastos-table input[type="number"]::-webkit-inner-spin-button,
.gastos-table input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.gastos-table input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* Estandarización de fuentes */
.gastos-header,
.gastos-header h4,
.gastos-header .row-count,
.gastos-header .total-display,
.gastos-table,
.gastos-table th,
.gastos-table td,
.gastos-table input {
    font-family: var(--font-family);
}

.gastos-header h4 {
    font-size: 14px;
    font-weight: 600;
}

.gastos-header .row-count {
    font-size: 12px;
    color: #666;
}

.gastos-header .total-display {
    font-size: 13px;
}

.gastos-table th {
    font-size: 12px;
    font-weight: 600;
}

.gastos-table td,
.gastos-table input {
    font-size: 12px;
}

/* ========================================
   MO (Mano de Obra) - Estilos específicos
   ======================================== */

/* Tema MO - Naranja/Ámbar */
.mo-theme h4 { color: #e65100; }
.mo-theme h4 i { color: #ff9800; }
.btn-mo { background: #ff9800 !important; border-color: #f57c00 !important; color: white !important; }
.btn-mo:hover { background: #f57c00 !important; }
.btn-mo:disabled { background: #ffcc80 !important; border-color: #ffcc80 !important; }

/* Navegación de meses MO */
.mo-month-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 15px;
    background: #fff3e0;
    border-bottom: 1px solid #ffe0b2;
    flex-shrink: 0;
}

.mo-month-nav .btn-month-nav {
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid #ffcc80;
    background: white;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #e65100;
    transition: all 0.2s;
}

.mo-month-nav .btn-month-nav:hover {
    background: #fff3e0;
    border-color: #ff9800;
}

.mo-month-nav .month-display {
    font-size: 13px;
    font-weight: 600;
    color: #e65100;
    min-width: 120px;
    text-align: center;
}

.mo-month-nav .btn-month-today {
    padding: 4px 10px;
    border: 1px solid #ffcc80;
    background: white;
    border-radius: 4px;
    cursor: pointer;
    font-size: 11px;
    color: #e65100;
    display: flex;
    align-items: center;
    gap: 4px;
    transition: all 0.2s;
}

.mo-month-nav .btn-month-today:hover {
    background: #fff3e0;
    border-color: #ff9800;
}

/* Botón configurar tarifas */
.mo-month-nav .btn-config-tarifas {
    padding: 4px 10px;
    border: 1px solid #ffcc80;
    background: #ff9800;
    color: white;
    border-radius: 4px;
    cursor: pointer;
    font-size: 11px;
    display: flex;
    align-items: center;
    gap: 4px;
    transition: all 0.2s;
    margin-left: auto;
}

.mo-month-nav .btn-config-tarifas:hover {
    background: #f57c00;
}

/* Barra de búsqueda MO */
.mo-search-bar {
    display: flex;
    gap: 12px;
    padding: 8px 15px;
    background: #fafafa;
    border-bottom: 1px solid #eee;
    flex-shrink: 0;
}

.mo-search-bar .search-field {
    display: flex;
    align-items: center;
    gap: 6px;
}

.mo-search-bar .search-field label {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    white-space: nowrap;
}

.mo-search-bar .search-field input {
    padding: var(--input-padding-sm);
    border: 1px solid var(--input-border-color);
    border-radius: var(--input-radius-sm);
    font-size: var(--font-size-xs);
    width: 150px;
}

.mo-search-bar .search-field input:focus {
    outline: none;
    border-color: var(--color-warning-dark);
    box-shadow: var(--input-focus-shadow-warning);
}

/* Tabla MO */
.mo-table thead th {
    background: #f57c00 !important;
    border-bottom: 2px solid #e65100 !important;
}

/* ========================================
   DISEÑO HORIZONTAL MO - Categorías como columnas
   ======================================== */
.mo-table.mo-horizontal {
    font-size: 11px;
}

/* Columnas de horas (HH) - compactas */
.mo-table .col-hh {
    width: 50px;
    min-width: 50px;
    max-width: 55px;
    text-align: center;
    padding: 2px 4px !important;
}

.mo-table .col-horas {
    padding: 1px 2px !important;
}

.mo-table .col-horas input,
.mo-table .mo-horas-input {
    width: 45px;
    padding: 3px 2px;
    text-align: center;
    font-size: 11px;
    border: 1px solid transparent;
    background: transparent;
    border-radius: 3px;
}

.mo-table .col-horas input:focus,
.mo-table .mo-horas-input:focus {
    border-color: #ff9800;
    background: #fff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(255, 152, 0, 0.15);
}

.mo-table .col-horas input:hover,
.mo-table .mo-horas-input:hover {
    background: #fff3e0;
}

/* Ajustar ancho de columnas fijas */
.mo-table.mo-horizontal .col-fecha {
    width: 85px;
}

.mo-table.mo-horizontal .col-codigo {
    width: 80px;
}

.mo-table.mo-horizontal .col-partida {
    width: 180px;
    max-width: 180px;
}

.mo-table.mo-horizontal .col-subtotal {
    width: 75px;
    text-align: right;
}

.mo-table.mo-horizontal .col-actions {
    width: 35px;
}

/* Header de categorías con color naranja gradiente */
.mo-table.mo-horizontal thead th.col-hh {
    background: linear-gradient(180deg, #ff9800, #f57c00) !important;
    font-size: 10px;
    font-weight: 600;
    padding: 4px 2px !important;
    white-space: nowrap;
}

/* Alternar colores sutiles en columnas de categorías */
.mo-table.mo-horizontal tbody td.col-horas:nth-child(even) {
    background: rgba(255, 152, 0, 0.03);
}

/* Tab content MO */
.tab-content-mo {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* Modal de tarifas */
.tarifas-config-table {
    width: 100%;
    border-collapse: collapse;
}

.tarifas-config-table th,
.tarifas-config-table td {
    padding: 10px 8px;
    border-bottom: 1px solid #eee;
}

.tarifas-config-table input[type="number"],
.tarifas-config-table input[type="date"] {
    padding: 6px 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 12px;
}

.tarifas-config-table input[type="number"] {
    width: 90px;
    text-align: right;
}

.tarifas-config-table .btn-save-tarifa {
    padding: 6px 10px;
    border: 1px solid #ddd;
    background: #f5f5f5;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}

.tarifas-config-table .btn-save-tarifa:hover {
    background: #4caf50;
    color: white;
    border-color: #4caf50;
}

/* ========================================
   TEMA SR - Servicios/Subcontratos (Morado)
   ======================================== */

.sr-theme {
    border-left: 4px solid #9c27b0 !important;
}

.sr-theme h4 {
    color: #7b1fa2 !important;
}

.btn-sr {
    background: linear-gradient(180deg, #9c27b0, #7b1fa2) !important;
    border-color: #7b1fa2 !important;
}

.btn-sr:hover {
    background: linear-gradient(180deg, #ab47bc, #8e24aa) !important;
}

.btn-sr:disabled {
    background: #e1bee7 !important;
    border-color: #ce93d8 !important;
}

/* Navegación por mes SR */
.sr-month-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    background: linear-gradient(180deg, #f3e5f5, #e1bee7);
    border-bottom: 1px solid #ce93d8;
}

.sr-month-nav .btn-month-nav {
    background: white;
    border: 1px solid #9c27b0;
    color: #9c27b0;
}

.sr-month-nav .btn-month-nav:hover {
    background: #9c27b0;
    color: white;
}

.sr-month-nav .btn-month-today {
    background: #9c27b0;
    color: white;
    border: none;
    padding: 5px 12px;
    border-radius: 4px;
    cursor: pointer;
}

.sr-month-nav .btn-month-today:hover {
    background: #7b1fa2;
}

/* Barra de búsqueda SR */
.sr-search-bar {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 8px 15px;
    background: #faf5fb;
    border-bottom: 1px solid #e1bee7;
}

.sr-search-bar .search-field label {
    font-size: var(--font-size-xs);
    color: #7b1fa2;
    margin-right: 5px;
}

.sr-search-bar .search-field input {
    padding: var(--input-padding-sm);
    border: 1px solid #ce93d8;
    border-radius: var(--input-radius-sm);
    font-size: var(--input-font-size-sm);
    width: 130px;
}

.sr-search-bar .search-field input:focus {
    border-color: #9c27b0;
    outline: none;
    box-shadow: 0 0 0 2px rgba(156, 39, 176, 0.15);
}

/* Tabla SR */
.sr-table thead th {
    background: #9c27b0 !important;
    border-bottom: 2px solid #7b1fa2 !important;
}

.sr-table tbody tr:hover {
    background: rgba(156, 39, 176, 0.05);
}

/* Columna proveedor */
.sr-table .col-proveedor {
    width: 140px;
}

.sr-table .col-proveedor input {
    width: 100%;
}

/* Columna afecto IGV - checkbox */
.sr-table .col-afecto-igv {
    width: 45px;
    text-align: center;
}

.sr-table .col-afecto-igv input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: #9c27b0;
}

/* Tab content SR */
.tab-content-sr {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* ========================================
   ESTILOS EQ (Equipos) - Tema Naranja
   ======================================== */
.eq-theme {
    border-left: 4px solid #f57c00 !important;
}

.eq-theme h4 {
    color: #e65100 !important;
}

.btn-eq {
    background: linear-gradient(180deg, #f57c00, #e65100) !important;
    border-color: #e65100 !important;
}

.btn-eq:hover {
    background: linear-gradient(180deg, #fb8c00, #ef6c00) !important;
}

.btn-eq:disabled {
    background: #ffe0b2 !important;
    border-color: #ffcc80 !important;
}

/* Navegación por mes EQ */
.eq-month-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    background: linear-gradient(180deg, #fff3e0, #ffe0b2);
    border-bottom: 1px solid #ffcc80;
}

.eq-month-nav .btn-month-nav {
    background: white;
    border: 1px solid #f57c00;
    color: #f57c00;
}

.eq-month-nav .btn-month-nav:hover {
    background: #f57c00;
    color: white;
}

.eq-month-nav .btn-month-today {
    background: #f57c00;
    color: white;
    border: none;
    padding: 5px 12px;
    border-radius: 4px;
    cursor: pointer;
}

.eq-month-nav .btn-month-today:hover {
    background: #e65100;
}

.eq-month-nav .btn-config-tarifas {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #f57c00;
    padding: 5px 12px;
    border-radius: 4px;
    cursor: pointer;
    margin-left: auto;
}

.eq-month-nav .btn-config-tarifas:hover {
    background: #f57c00;
    color: white;
}

/* Barra de búsqueda EQ */
.eq-search-bar {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 8px 15px;
    background: #fffaf5;
    border-bottom: 1px solid #ffe0b2;
}

.eq-search-bar .search-field label {
    font-size: var(--font-size-xs);
    color: #e65100;
    margin-right: 5px;
}

.eq-search-bar .search-field input {
    padding: var(--input-padding-sm);
    border: 1px solid #ffcc80;
    border-radius: var(--input-radius-sm);
    font-size: var(--input-font-size-sm);
    width: 130px;
}

.eq-search-bar .search-field input:focus {
    border-color: #f57c00;
    outline: none;
    box-shadow: 0 0 0 2px rgba(245, 124, 0, 0.15);
}

/* Tabla EQ */
.eq-table thead th {
    background: #f57c00 !important;
    border-bottom: 2px solid #e65100 !important;
}

.eq-table tbody tr:hover {
    background: rgba(245, 124, 0, 0.05);
}

/* Columna código de equipo */
.eq-table .col-id-recurso {
    width: 90px;
}

.eq-table .col-id-recurso input {
    width: 80px;
    font-family: var(--font-family);
    text-transform: uppercase;
}

/* Indicador equipo propio (ACF) */
.eq-table .eq-propio {
    background: rgba(76, 175, 80, 0.15) !important;
}

.eq-table .eq-propio .col-igv {
    color: #999;
    font-style: italic;
}

/* Indicador equipo alquilado */
.eq-table .eq-alquilado {
    background: rgba(245, 124, 0, 0.08) !important;
}

/* Indicador equipo encontrado en tarifario */
.eq-table .eq-found .col-id-recurso input {
    border-color: #4caf50 !important;
    font-weight: 600;
}

/* Animación de autocompletado */
@keyframes highlightField {
    0% { background-color: #d4edda; }
    100% { background-color: transparent; }
}

.eq-table input.autocompleted {
    animation: highlightField 2s ease-out;
}

/* Tab content EQ */
.tab-content-eq {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* Leyenda EQ */
.eq-legend {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 8px 15px;
    background: #fff3e0;
    border-top: 1px solid #ffe0b2;
    font-size: 11px;
    color: #666;
}

.eq-legend .legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
}

.eq-legend .legend-badge {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 600;
}

.eq-legend .legend-badge.eq-propio {
    background: rgba(76, 175, 80, 0.2);
    color: #388e3c;
}

.eq-legend .legend-badge.eq-alquilado {
    background: rgba(245, 124, 0, 0.2);
    color: #e65100;
}

/* ========================================
   NAVEGACIÓN UNIFICADA POR MESES (TODAS LAS PESTAÑAS)
   ======================================== */
.gastos-month-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 15px;
    background: linear-gradient(180deg, #fff8e1, #ffecb3);
    border-bottom: 1px solid #ffd54f;
    flex-shrink: 0;
}

.gastos-month-nav .btn-month-nav {
    width: 32px;
    height: 32px;
    border: 1px solid #ff9800;
    background: white;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff9800;
    font-size: 12px;
    transition: all 0.2s;
}

.gastos-month-nav .btn-month-nav:hover {
    background: #ff9800;
    color: white;
}

.gastos-month-nav .month-display {
    font-size: 15px;
    font-weight: 600;
    color: #e65100;
    min-width: 140px;
    text-align: center;
}

.gastos-month-nav .btn-month-today {
    padding: 6px 12px;
    border: none;
    background: #ff9800;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
    color: white;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s;
}

.gastos-month-nav .btn-month-today:hover {
    background: #f57c00;
}

.gastos-month-nav .nav-right-buttons {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.gastos-month-nav .btn-refresh {
    width: 32px;
    height: 32px;
    border: 1px solid #666;
    background: white;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    font-size: 12px;
    transition: all 0.2s;
}

.gastos-month-nav .btn-refresh:hover {
    background: #666;
    color: white;
}

.gastos-month-nav .btn-refresh:hover i {
    animation: spin 0.5s ease;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.gastos-month-nav .btn-config {
    padding: 6px 12px;
    border: 1px solid #666;
    background: white;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 5px;
    color: #666;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s;
}

.gastos-month-nav .btn-config:hover {
    background: #666;
    color: white;
}

/* Tema MO - Naranja */
.mo-nav-theme {
    background: linear-gradient(180deg, #fff8e1, #ffecb3);
    border-bottom-color: #ffd54f;
}
.mo-nav-theme .btn-month-nav { border-color: #ff9800; color: #ff9800; }
.mo-nav-theme .btn-month-nav:hover { background: #ff9800; color: white; }
.mo-nav-theme .month-display { color: #e65100; }
.mo-nav-theme .btn-month-today { background: #ff9800; }
.mo-nav-theme .btn-month-today:hover { background: #f57c00; }
.mo-nav-theme .btn-config { border-color: #ff9800; color: #e65100; }
.mo-nav-theme .btn-config:hover { background: #ff9800; color: white; }
.mo-nav-theme .btn-refresh { border-color: #ff9800; color: #e65100; }
.mo-nav-theme .btn-refresh:hover { background: #ff9800; color: white; }

/* Tema MT - Azul */
.mt-nav-theme {
    background: linear-gradient(180deg, #e3f2fd, #bbdefb);
    border-bottom-color: #64b5f6;
}
.mt-nav-theme .btn-month-nav { border-color: #2196f3; color: #2196f3; }
.mt-nav-theme .btn-month-nav:hover { background: #2196f3; color: white; }
.mt-nav-theme .month-display { color: #1565c0; }
.mt-nav-theme .btn-month-today { background: #2196f3; }
.mt-nav-theme .btn-month-today:hover { background: #1976d2; }
.mt-nav-theme .btn-refresh { border-color: #2196f3; color: #1565c0; }
.mt-nav-theme .btn-refresh:hover { background: #2196f3; color: white; }

/* Tema EQ - Naranja oscuro */
.eq-nav-theme {
    background: linear-gradient(180deg, #fff3e0, #ffe0b2);
    border-bottom-color: #ffcc80;
}
.eq-nav-theme .btn-month-nav { border-color: #f57c00; color: #f57c00; }
.eq-nav-theme .btn-month-nav:hover { background: #f57c00; color: white; }
.eq-nav-theme .month-display { color: #e65100; }
.eq-nav-theme .btn-month-today { background: #f57c00; }
.eq-nav-theme .btn-month-today:hover { background: #e65100; }
.eq-nav-theme .btn-config { border-color: #f57c00; color: #e65100; }
.eq-nav-theme .btn-config:hover { background: #f57c00; color: white; }
.eq-nav-theme .btn-refresh { border-color: #f57c00; color: #e65100; }
.eq-nav-theme .btn-refresh:hover { background: #f57c00; color: white; }

/* Tema SR - Púrpura */
.sr-nav-theme {
    background: linear-gradient(180deg, #f3e5f5, #e1bee7);
    border-bottom-color: #ce93d8;
}
.sr-nav-theme .btn-month-nav { border-color: #9c27b0; color: #9c27b0; }
.sr-nav-theme .btn-month-nav:hover { background: #9c27b0; color: white; }
.sr-nav-theme .month-display { color: #7b1fa2; }
.sr-nav-theme .btn-month-today { background: #9c27b0; }
.sr-nav-theme .btn-month-today:hover { background: #7b1fa2; }
.sr-nav-theme .btn-refresh { border-color: #9c27b0; color: #7b1fa2; }
.sr-nav-theme .btn-refresh:hover { background: #9c27b0; color: white; }

/* ========================================
   MODAL TARIFARIO EQ - MINIMALISTA
   ======================================== */

/* Estilos para filas del tarifario */
#tarifasEQBody tr {
    border-bottom: 1px solid #eee;
}
#tarifasEQBody tr:hover {
    background: #fafafa;
}
#tarifasEQBody td {
    padding: 5px 6px;
    vertical-align: middle;
}

/* Tipo de equipo */
#tarifasEQBody .tipo-propio {
    color: #2e7d32;
    font-size: 0.75rem;
    font-weight: 500;
}
#tarifasEQBody .tipo-alquilado {
    color: #e65100;
    font-size: 0.75rem;
    font-weight: 500;
}

/* Código monospace */
#tarifasEQBody .codigo {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 0.8rem;
}

/* Inputs del tarifario */
#tarifasEQBody input[type="text"],
#tarifasEQBody input[type="number"],
#tarifasEQBody input[type="date"],
#tarifasEQBody select {
    width: 100%;
    padding: 3px 5px;
    border: 1px solid #ddd;
    border-radius: 2px;
    font-size: 0.8rem;
    box-sizing: border-box;
}
#tarifasEQBody input[readonly] {
    background: #f8f8f8;
    border-color: transparent;
}
#tarifasEQBody .center { text-align: center; }
#tarifasEQBody .right { text-align: right; }
#tarifasEQBody .center input { text-align: center; }
#tarifasEQBody .right input { text-align: right; }

/* Botones de acción - HORIZONTALES */
#tarifasEQBody .actions {
    white-space: nowrap;
    text-align: center;
}
#tarifasEQBody .btn-edit,
#tarifasEQBody .btn-save,
#tarifasEQBody .btn-del {
    border: none;
    padding: 2px 7px;
    cursor: pointer;
    border-radius: 2px;
    font-size: 0.85rem;
    margin: 0 1px;
    display: inline-block;
}
#tarifasEQBody .btn-edit { background: #2196f3; color: white; }
#tarifasEQBody .btn-save { background: #4caf50; color: white; }
#tarifasEQBody .btn-del { background: #f44336; color: white; }
#tarifasEQBody .btn-edit:hover { background: #1976d2; }
#tarifasEQBody .btn-save:hover { background: #388e3c; }
#tarifasEQBody .btn-del:hover { background: #d32f2f; }