/* Custom Animations and Glassmorphism */

.glass-panel {
    background: rgba(21, 16, 36, 0.6);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.2);
}

.animate-fade-in-down {
    animation: fadeInDown 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-fade-in-up {
    animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    animation-delay: 0.1s;
    opacity: 0;
}

@keyframes fadeInDown {
    from { opacity: 0; transform: translateY(-20px); }
    to { opacity: 1; transform: translateY(0); }
}

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

.animate-pulse-slow {
    animation: pulseSlow 8s ease-in-out infinite alternate;
}

@keyframes pulseSlow {
    from { transform: scale(1); opacity: 0.4; }
    to { transform: scale(1.2); opacity: 0.7; }
}

.progress-stripe {
    background-image: linear-gradient(
        45deg,
        rgba(255,255,255,0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255,255,255,0.15) 50%,
        rgba(255,255,255,0.15) 75%,
        transparent 75%,
        transparent
    );
    background-size: 1rem 1rem;
}

.animate-progress {
    animation: moveProgress 1s linear infinite;
}

@keyframes moveProgress {
    from { background-position: 1rem 0; }
    to { background-position: 0 0; }
}

select option {
    background-color: #0b0813;
    color: white;
}