/* Custom scrollbar - dark theme */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: #0a0a0a;
}

::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #3a3a3a;
}

/* Firefox scrollbar */
* {
    scrollbar-width: thin;
    scrollbar-color: #2a2a2a #0a0a0a;
}

/* Transition utilities */
.fade-in {
    animation: fadeIn 0.2s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.slide-in-left {
    animation: slideInLeft 0.3s ease-out;
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-16px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Crimson gradient helpers */
.gradient-crimson {
    background: linear-gradient(135deg, #DC143C 0%, #B01030 100%);
}

.gradient-crimson-subtle {
    background: linear-gradient(135deg, rgba(220, 20, 60, 0.1) 0%, rgba(176, 16, 48, 0.05) 100%);
}

.border-glow-crimson {
    box-shadow: 0 0 0 1px rgba(220, 20, 60, 0.3), 0 0 20px rgba(220, 20, 60, 0.1);
}

/* Input focus glow */
input:focus,
textarea:focus,
select:focus {
    box-shadow: 0 0 0 1px rgba(220, 20, 60, 0.3);
}

/* HTMX loading indicator */
.htmx-indicator {
    display: none;
}

.htmx-request .htmx-indicator {
    display: inline-block;
}

.htmx-request.htmx-indicator {
    display: inline-block;
}