
::-webkit-scrollbar { 
    width: 6px; 
    height: 6px; 
}
::-webkit-scrollbar-track { 
    background: transparent; 
}
::-webkit-scrollbar-thumb { 
    background: #3f2222; 
    border-radius: 10px; 
}
::-webkit-scrollbar-thumb:hover { 
    background: #5c3030; 
}


.sidebar-gradient {
    background: linear-gradient(180deg, #1a0a0a 0%, #0f0303 50%, #0a0000 100%);
}


.category-gradient {
    background: linear-gradient(135deg, #1a0505 0%, #2d0a0a 100%);
    border: 1px solid rgba(220, 38, 38, 0.15);
    transition: all 0.3s ease;
}
.category-gradient:hover {
    background: linear-gradient(135deg, #dc2626 0%, #991b1b 100%);
    border-color: #dc2626;
    box-shadow: 0 0 20px rgba(220, 38, 38, 0.45);
    transform: translateY(-2px);
}


.course-card {
    transition: all 0.3s ease;
}
.course-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px -10px rgba(220, 38, 38, 0.2);
    border-color: rgba(220, 38, 38, 0.3);
}


.marquee-container { 
    overflow: hidden; 
    white-space: nowrap; 
    width: 100%; 
}
.marquee-content { 
    display: inline-block; 
    animation: marquee 25s linear infinite; 
}
@keyframes marquee { 
    0% { transform: translateX(100%); } 
    100% { transform: translateX(-100%); } 
}

@keyframes progress {
    0% { width: 0%; }
    100% { width: 100%; }
}

/* Dark theme red bleed overlay */
body {
    background-color: #0d0d0d;
}
body::before {
    content: '';
    position: fixed;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(ellipse at 30% 20%, rgba(180, 20, 20, 0.06) 0%, transparent 50%),
                radial-gradient(ellipse at 70% 80%, rgba(200, 30, 30, 0.04) 0%, transparent 50%),
                radial-gradient(ellipse at 50% 50%, rgba(160, 10, 10, 0.03) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}