/* BetAnalytics — Custom CSS over Tailwind */

/* HTMX transitions */
.htmx-swapping { opacity: 0; transition: opacity 0.2s ease-out; }
.htmx-settling { opacity: 1; transition: opacity 0.3s ease-in; }
.htmx-added { opacity: 0; }
.htmx-added.htmx-settling { opacity: 1; transition: opacity 0.3s ease-in; }

/* Loading spinner */
.htmx-indicator {
    display: none;
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
    display: inline-block;
}
.spinner {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    border: 2px solid #374151;
    border-top-color: #34d399;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Intermediate gray tone for hover */
.bg-gray-750 { background-color: #2d3748; }
.hover\:bg-gray-750:hover { background-color: #2d3748; }

/* Dark scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #1f2937; }
::-webkit-scrollbar-thumb { background: #4b5563; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #6b7280; }

/* Chart canvas max height */
canvas { max-height: 300px; }