/* Cybercast - style uzupelniajace Tailwind */

/* Slider wyroznionych - ukryty scrollbar */
.hero-track { scrollbar-width: none; -ms-overflow-style: none; }
.hero-track::-webkit-scrollbar { display: none; }

/* Range inputy (seek / glosnosc) */
input[type="range"].seek {
    -webkit-appearance: none;
    appearance: none;
    outline: none;
}
input[type="range"].seek::-webkit-slider-runnable-track {
    height: 6px;
    border-radius: 9999px;
    background: transparent;
}
input[type="range"].seek::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    margin-top: -4px;
    border-radius: 2px;
    background: #00f2fe;
    box-shadow: 0 0 8px #00f2fe;
    transform: rotate(45deg);
    cursor: pointer;
}
input[type="range"].seek::-moz-range-track {
    height: 6px;
    border-radius: 9999px;
    background: transparent;
}
input[type="range"].seek::-moz-range-thumb {
    width: 12px;
    height: 12px;
    border: none;
    border-radius: 2px;
    background: #00f2fe;
    box-shadow: 0 0 8px #00f2fe;
    transform: rotate(45deg);
    cursor: pointer;
}

/* Pasek postepu - wypelnienie gradientem (JS ustawia --fill) */
#plSeek {
    background: linear-gradient(90deg, #9d4edd, #00f2fe var(--fill, 0%), #323440 var(--fill, 0%));
}
#plVol {
    background: linear-gradient(90deg, #00f2fe var(--fill, 80%), #323440 var(--fill, 80%));
}

/* Equalizer */
.eq-bar { transition: height .18s ease; }
#eqBars.playing .eq-bar { animation: eqb 0.9s ease-in-out infinite alternate; }
#eqBars.playing .eq-bar:nth-child(2) { animation-delay: .15s; }
#eqBars.playing .eq-bar:nth-child(3) { animation-delay: .3s; }
#eqBars.playing .eq-bar:nth-child(4) { animation-delay: .45s; }
#eqBars.playing .eq-bar:nth-child(5) { animation-delay: .6s; }
@keyframes eqb {
    from { height: 15%; }
    to   { height: 100%; }
}

/* Pusty obszar pod playerem gdy aktywny */
body.player-on main { padding-bottom: 9.5rem; }
@media (min-width: 1024px) {
    body.player-on main { padding-bottom: 7rem; }
}

/* Formularze admina */
.lbl { display:block; font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#a5bec0; margin-bottom:.35rem; }
.inp { width:100%; padding:.65rem .8rem; border-radius:.5rem; background:#0b0e18; border:1px solid #3a494b; color:#e1e1f1; font-size:15px; outline:none; transition:border-color .15s, box-shadow .15s; color-scheme:dark; }
.inp::placeholder { color:#7d9496; }
select.inp option { background:#0b0e18; color:#e1e1f1; }
.inp:focus { border-color:#00f2fe; box-shadow: inset 0 0 12px rgba(0,242,254,.08); }
.btn-p { display:inline-flex; align-items:center; gap:.5rem; padding:.65rem 1.25rem; border-radius:.75rem; background:#00f2fe; color:#002022; font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:14px; letter-spacing:.02em; transition:all .2s; cursor:pointer; }
.btn-p:hover { box-shadow:0 0 24px rgba(0,242,254,.45); }
.btn-g { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .9rem; border-radius:.5rem; background:#272935; color:#e1e1f1; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; transition:all .2s; cursor:pointer; }
.btn-g:hover { background:#323440; color:#00f2fe; }
.btn-d { display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .9rem; border-radius:.5rem; background:rgba(147,0,10,.3); color:#ffb4ab; font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; transition:all .2s; cursor:pointer; }
.btn-d:hover { background:rgba(147,0,10,.6); }