/* Prevent sliders from causing shifts in layout */
#volume-slider,
#progress-slider {
    width: 100%;
    position: relative;
}

/* Sliders Styling */
input[type="range"] {
    appearance: none;
    width: 120px;
    height: 8px;
    background: #F288A4;
    border-radius: 5px;
}

input[type="range"]::-webkit-slider-thumb {
    appearance: none;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #8C4653;
    cursor: pointer;
}

input[type="range"]::-webkit-slider-thumb:hover {
    background-color: #402525;
}