/* ============================================================
   Variante escura do tema Clássico 98.
   Carregada sobre theme-98.css pelo seletor de modo de cor.
   ============================================================ */

:root {
    color-scheme: dark;
    --w98-face: #3a3a3a;
    --w98-face-dark: #262626;
    --w98-face-darker: #121212;
    --w98-face-light: #666666;
    --w98-titlebar-start: #17346f;
    --w98-titlebar-end: #5579ad;
    --w98-highlight: #315a9b;
    --w98-text: #f0f0f0;
}

body {
    background: #102727;
    color: var(--w98-text);
}

.title-bar {
    border-bottom-color: #0b0b0b;
}

.menu-option.disabled,
.menu-option.disabled:hover {
    color: #8a8a8a;
}

.format-row span {
    color: #bdbdbd;
}

.playlist-header-actions button:hover:not(:disabled),
.playback-setting-toggle:hover {
    background: #4a4a4a;
}

.playlist-item {
    color: #d0d0d0;
}

.playlist-item-index,
.playlist-item-duration,
.playlist-item-remove {
    color: #929292;
}

#playBtn .icon-play {
    border-left-color: #79cf79;
}

#stopBtn .icon-stop {
    background: #d66b6b;
}

.volume-bar {
    background: linear-gradient(to right, #e8e8e8 0%, #e8e8e8 var(--fill-percent, 0%), #1b1b1b var(--fill-percent, 0%), #1b1b1b 100%);
}

.setting-switch {
    background: #171717;
}

.setting-switch::after {
    background: #a0a0a0;
}

#settingsSpeedBar {
    background: #171717;
}

#settingsSpeedBar::-moz-range-track {
    background: #171717;
}

.modal-input {
    background: #181818;
    color: var(--w98-text);
}

.modal-input::placeholder {
    color: #888888;
}

.library-manage-item,
.library-category-header {
    border-bottom-color: #202020;
}

.library-manage-url,
.about-tagline,
.about-details {
    color: #b0b0b0;
}

::-webkit-scrollbar {
    width: 16px;
    height: 16px;
}

::-webkit-scrollbar-track {
    background: #242424;
    border: 2px inset var(--w98-face);
}

::-webkit-scrollbar-thumb {
    background: var(--w98-face);
    border: 2px outset var(--w98-face);
}