/* Pasek postępu - Biały */
#audio-progress-bar {
    background-color: #ffffff !important;
    transition: width 0.1s linear;
}

.progress-wrapper:hover .progress {
    height: 8px !important;
}

/* Tytuły i Teksty */
.main-title {
    color: #ffffff !important;
    font-weight: 700;
}

/* Lista utworów */
.list-group-item {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.5) !important; /* Przygaszony biały dla nieaktywnych */
    border: none !important;
    transition: all 0.2s ease;
}

.active-item {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
    border-left: 3px solid #ffffff !important;
}

/* SUWAK GŁOŚNOŚCI - BIAŁY */
.custom-range::-webkit-slider-runnable-track {
    background: rgba(255, 255, 255, 0.2); /* Tło paska głośności */
    height: 4px;
    border-radius: 2px;
}

.custom-range::-webkit-slider-thumb {
    background: #ffffff !important; /* Kropka suwaka - Biała */
    border: none;
    width: 14px;
    height: 14px;
    margin-top: -5px; /* Wyśrodkowanie kropki */
    cursor: pointer;
    box-shadow: 0 0 5px rgba(0,0,0,0.3);
}

/* Firefox */
.custom-range::-moz-range-thumb {
    background: #ffffff !important;
    border: none;
    width: 14px;
    height: 14px;
    cursor: pointer;
}

.custom-range::-moz-range-track {
    background: rgba(255, 255, 255, 0.2);
    height: 4px;
}

/* Scrollbar i Reszta */
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 10px;
}

.playing-bars span {
    background: #ffffff;
    width: 3px;
    animation: bounce 1s infinite alternate;
}

@@keyframes bounce {
    from {
        height: 3px;
    }

    to {
        height: 14px;
    }
}