/* --- CONFIGURACIÓN GLOBAL --- */

/* Scrollbar Oscura y Moderna (Estilo Hacker/Pro) */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #111827; /* gray-900 */
}
::-webkit-scrollbar-thumb {
    background: #4b5563; /* gray-600 */
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #6b7280; /* gray-500 */
}

/* Icono de calendario blanco para inputs date en modo oscuro */
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
}

/* --- ANIMACIONES --- */
.loader {
    border: 3px solid #374151;
    border-top: 3px solid #3b82f6; /* Azul */
    border-radius: 50%;
    width: 20px;
    height: 20px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* --- ESTILOS ESPECÍFICOS: AGENDA --- */
.calendar-grid {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr); /* 1 col hora, 7 cols días */
    background-color: #374151; /* Color de las líneas */
    gap: 1px;
    border: 1px solid #374151;
}

.calendar-header {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
    border-bottom: 1px solid #374151;
}

/* --- ESTILOS ESPECÍFICOS: IMPRESIÓN (Presupuestos) --- */
@media print {
    body {
        background-color: white !important;
        color: black !important;
        font-family: Arial, sans-serif !important;
    }

    /* Ocultar sidebar, botones y elementos de interfaz */
    .print\:hidden, 
    aside, 
    header, 
    #viewList, 
    .no-print {
        display: none !important;
    }

    /* Forzar visibilidad del editor de presupuesto */
    #viewBuilder {
        display: block !important;
        position: static !important;
        background-color: white !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    /* Resetear colores oscuros de Tailwind para papel */
    .dark .bg-gray-900, 
    .dark .bg-gray-800,
    .dark .bg-gray-50 {
        background-color: white !important;
        border: none !important;
        color: black !important;
    }
    
    .dark .text-white,
    .dark .text-gray-300,
    .dark .text-gray-400 {
        color: black !important;
    }

    input, select, textarea {
        border: none !important;
        background: transparent !important;
        color: black !important;
        box-shadow: none !important;
    }

    /* Ajustes de la hoja */
    .hoja-presupuesto {
        box-shadow: none !important;
        border: none !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}