/*
 * Stilul playerului public al transmisiunilor (`/radio`, `/live`) — T6.4, pista A2b.
 * Copiat din V2: `STIL_PLAYER` (packages/comanda/src/player.ts) + `STIL_BUTON` (buton.ts), fără
 * regulile panoului (`.ctl-player`, care trăiesc în stilul panoului, A2a). Culorile vin din
 * variabilele lui `stil.css` (`--ink`, `--paper`, `--soft`, `--faint`, `--rule`, `--rosu`).
 */

/* Pagina publica: fara titlu, totul centrat — arata la fel pe telefon si pe desktop */
.live { text-align:center; padding-top:24px }
.live .direct-butoane { justify-content:center }
.live .rad { margin-left:auto; margin-right:auto; max-width:36em }
.direct-stare { font-size:18px; min-height:1.5em }
.direct-stare[data-stare="reda"]::before { content:"● "; color:var(--rosu) }
.direct-slujba { font-size:17px; font-weight:600; color:var(--ink); margin:-8px 0 16px; overflow-wrap:anywhere }
.direct-urmatoarea { font-size:15px; color:var(--soft); margin:-8px 0 16px }
/* Cand vine DUPA cartela radioului (pagina radioului), nu mai urca sub buton: se desparte de ea. */
.rad + .direct-urmatoarea { margin-top:18px }
.direct-urmatoarea .urm-eticheta, .direct-urmatoarea .urm-slujba { display:block }
.direct-urmatoarea .urm-slujba { color:var(--ink); margin-top:2px }
.direct-butoane { display:flex; gap:12px; margin:16px 0 24px }
.direct-btn { font:inherit; font-size:18px; padding:12px 28px; border-radius:999px; border:1px solid var(--rule);
  background:var(--ink); color:var(--paper); cursor:pointer }
.direct-btn[disabled] { opacity:.45; cursor:default }
.rad { margin:16px 0 24px }
.rad-piesa { font-size:18px; font-weight:600; margin:0 0 2px; overflow-wrap:anywhere }
.rad-album { font-size:14px; color:var(--soft); margin:0 0 10px; overflow-wrap:anywhere }
.rad-timp { font-size:13px; color:var(--faint); font-variant-numeric:tabular-nums; margin:0 }
.rad-urmeaza { font-size:13px; color:var(--faint); margin:10px 0 0; overflow-wrap:anywhere }

/* Butonul unic play/stop: rotund, cu forma in mijloc; culorile raman ale paginii. */
.btn-ps { padding:0; width:60px; height:60px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; line-height:0 }
.btn-ps svg { width:26px; height:26px; fill:currentColor }
.btn-ps[data-mod="play"] svg { transform:translateX(2px) }  /* triunghiul pare centrat abia asa */
.btn-ps[data-mod="play"] .ps-stop { display:none }
.btn-ps[data-mod="stop"] .ps-play { display:none }
/* [hidden] bate display-ul din regulile de mai sus (cartela radioului, slujba, urmatoarea). */
.rad[hidden], .direct-slujba[hidden], .direct-urmatoarea[hidden] { display:none }