/* Custom CSS */

/* Custom scrollbar for webkit browsers */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.dark ::-webkit-scrollbar-track {
    background: #2d3748;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e0;
    border-radius: 4px;
}

.dark ::-webkit-scrollbar-thumb {
    background: #4a5568;
}

::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: #718096;
}

/* Transitions for theme switching */
body,
.bg-white,
.bg-gray-50,
.bg-gray-100,
.bg-gray-200,
.bg-gray-800,
.bg-gray-900,
.border-gray-200,
.border-gray-700,
.text-gray-100,
.text-gray-200,
.text-gray-300,
.text-gray-600,
.text-gray-700,
.text-gray-900 {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* HTMX indicator styles */
.htmx-indicator {
    opacity: 0;
    transition: opacity 200ms ease-in;
}

.htmx-request .htmx-indicator {
    opacity: 1;
}

.htmx-request.htmx-indicator {
    opacity: 1;
}

/* My Tasks responsive grid */
.my-tasks-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

/* Task cards in My Tasks widget - fixed height to prevent layout expansion */
.my-tasks-grid .kanban-task {
    height: 162px;
    overflow: hidden;
}

/* At 1900px and down: 2 columns */
@media (max-width: 1900px) {
    .my-tasks-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* At 1400px and down: 1 column */
@media (max-width: 1400px) {
    .my-tasks-grid {
        grid-template-columns: 1fr;
    }
}