/* Radios Player 3.0 – player en vivo [radio_en_vivo] y barra fija.
   El player se acomoda al espacio que le dan (container queries): angosto = formato celular. */

.rdpv-caja{container-type:inline-size;container-name:rdpv;width:100%;margin:0 auto 1.5em;max-width:100%}
.rdpv,#rdpv-persist{--rdpv-accent:#ff5b45;--rdpv-accent2:#ffb547;--rdpv-bg:#0d1322;--rdpv-ink:#f3efe6;
  --rdpv-bg2:color-mix(in srgb,var(--rdpv-bg) 88%,#ffffff);--rdpv-muted:color-mix(in srgb,var(--rdpv-ink) 58%,var(--rdpv-bg));
  --rdpv-line:color-mix(in srgb,var(--rdpv-ink) 16%,var(--rdpv-bg));
  --rdpv-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;--rdpv-display:inherit}
.rdpv-f-anybody{--rdpv-display:"Anybody",system-ui,sans-serif}
.rdpv-f-anybody .rdpv,.rdpv-f-anybody .rdpv-fija{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}

/* Reset: que el tema no meta márgenes, bordes ni fondos */
.rdpv,.rdpv *,#rdpv-persist,#rdpv-persist *{box-sizing:border-box}
.rdpv p,.rdpv h3,#rdpv-persist p{margin:0;padding:0;border:0;background:none;text-transform:none;letter-spacing:normal}
.rdpv img,#rdpv-persist img{max-width:100%;border:0;border-radius:0;box-shadow:none;margin:0;padding:0}
.rdpv button,#rdpv-persist button{font:inherit!important;color:inherit!important;background:none!important;border:0!important;border-radius:0;margin:0!important;padding:0!important;cursor:pointer;box-shadow:none!important;text-transform:none!important;letter-spacing:normal!important;min-height:0!important;min-width:0!important;width:auto;height:auto;line-height:1!important;-webkit-appearance:none;appearance:none;text-decoration:none!important}
.rdpv button:focus-visible,.rdpv a:focus-visible,#rdpv-persist button:focus-visible{outline:2px solid var(--rdpv-accent)!important;outline-offset:2px}
.rdpv a{text-decoration:none!important;box-shadow:none!important}
.rdpv [hidden],#rdpv-persist [hidden]{display:none!important}
.rdpv input[type=range],#rdpv-persist input[type=range]{-webkit-appearance:none;appearance:none;height:4px!important;border-radius:4px;border:0!important;margin:0!important;padding:0!important;box-shadow:none!important;outline:none;
  background:linear-gradient(to right,var(--rdpv-accent) 0,var(--rdpv-accent) var(--rdpv-vol,80%),var(--rdpv-line) var(--rdpv-vol,80%))!important;cursor:pointer}
.rdpv input[type=range]::-webkit-slider-thumb,#rdpv-persist input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--rdpv-ink);border:0}
.rdpv input[type=range]::-moz-range-thumb,#rdpv-persist input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--rdpv-ink);border:0}

/* ===================== Player grande ===================== */
.rdpv{background:var(--rdpv-bg);color:var(--rdpv-ink);border-radius:18px;overflow:hidden;position:relative;isolation:isolate;
  box-shadow:0 20px 50px -24px rgba(13,19,34,.55);font-size:15px;line-height:1.45;text-align:left}
.rdpv::before{content:"";position:absolute;inset:-40% -10% auto auto;width:70%;aspect-ratio:1;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--rdpv-prog,var(--rdpv-accent)) 38%,transparent),transparent);transition:background 1s}
.rdpv-top{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:28px;padding:28px}

.rdpv-arte{position:relative;aspect-ratio:1;border-radius:14px;overflow:hidden;background:var(--rdpv-bg2)}
.rdpv-arte .rdpv-img{width:100%;height:100%;display:block;object-fit:cover}
.rdpv-tag{position:absolute;left:12px;top:12px;display:flex;align-items:center;gap:7px;background:rgba(13,19,34,.78);color:#fff;font:700 11px/1 var(--rdpv-mono);letter-spacing:.12em;padding:7px 10px;border-radius:20px}
.rdpv-tag i,.rdpv-l1 i,.rdpv-rot i{width:8px;height:8px;border-radius:50%;background:var(--rdpv-accent);display:inline-block;flex:none}
.rdpv-sonando .rdpv-tag i,.rdpv-sonando .rdpv-l1 i{animation:rdpv-pulso 1.4s ease-in-out infinite}
@keyframes rdpv-pulso{50%{opacity:.25;transform:scale(.7)}}
.rdpv-fuera .rdpv-tag{display:none}
.rdpv-aviso{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .5s}
.rdpv-aviso img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rdpv-aviso span{position:absolute;left:12px;bottom:12px;background:var(--rdpv-accent2);color:#1b1a17;font:700 11px/1 var(--rdpv-mono);letter-spacing:.12em;padding:6px 10px;border-radius:20px}
.rdpv-con-aviso .rdpv-aviso{opacity:1}

.rdpv-info{display:flex;flex-direction:column;gap:12px;min-width:0}
.rdpv-radio{display:flex;align-items:center;gap:14px}
.rdpv-radio img{width:60px;height:60px;border-radius:50%!important;object-fit:cover;flex:none;background:#fff;box-shadow:0 0 0 3px var(--rdpv-bg),0 0 0 5px color-mix(in srgb,var(--rdpv-prog,var(--rdpv-accent)) 70%,transparent)}
.rdpv-radio-txt{display:grid;gap:2px;min-width:0}
.rdpv-radio-txt small{font:700 10px/1.2 var(--rdpv-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--rdpv-muted)}
.rdpv-radio-txt strong{font-family:var(--rdpv-display);font-weight:800;font-stretch:110%;font-size:22px;line-height:1.1;color:var(--rdpv-ink)}
.rdpv-estado{font:700 11px/1.2 var(--rdpv-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--rdpv-accent2)}
.rdpv-prog{font-family:var(--rdpv-display);font-weight:900;font-stretch:125%;font-size:clamp(34px,7cqi,76px);line-height:.95;letter-spacing:-.02em;margin:0;color:var(--rdpv-ink);text-wrap:balance;overflow-wrap:anywhere}
.rdpv-con{font-size:17px;color:var(--rdpv-ink)}
.rdpv-con.rdpv-mensaje{font-size:clamp(17px,2.4cqi,22px);font-weight:600;line-height:1.3;max-width:40ch;text-wrap:balance}
.rdpv-con b{font-weight:600}
.rdpv-con:empty,.rdpv-desc:empty{display:none}
.rdpv-desc{color:var(--rdpv-muted);max-width:52ch}

.rdpv-linea{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;font:500 12px var(--rdpv-mono);color:var(--rdpv-muted);font-variant-numeric:tabular-nums}
.rdpv-barra{height:4px;background:var(--rdpv-line);border-radius:4px;position:relative}
.rdpv-barra b{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--rdpv-accent),var(--rdpv-accent2));border-radius:4px;transition:width 1s linear}
.rdpv-barra b::after{content:"";position:absolute;right:-5px;top:-4px;width:12px;height:12px;border-radius:50%;background:var(--rdpv-ink);box-shadow:0 0 0 3px var(--rdpv-bg)}

.rdpv-controles{display:flex;align-items:center;gap:14px 16px;flex-wrap:wrap;margin-top:auto;padding-top:4px}
.rdpv .rdpv-play,#rdpv-persist .rdpv-play{width:64px!important;height:64px!important;border-radius:50%!important;background:var(--rdpv-accent)!important;color:#fff!important;display:grid;place-items:center;flex:none;position:relative;transition:transform .15s;box-shadow:0 8px 24px -8px var(--rdpv-accent)!important}
.rdpv .rdpv-play:hover,#rdpv-persist .rdpv-play:hover{transform:scale(1.05)}
.rdpv .rdpv-play:active,#rdpv-persist .rdpv-play:active{transform:scale(.96)}
.rdpv-play svg{width:26px;height:26px;fill:currentColor;display:block}
.rdpv-i-pausa,.rdpv-spin{display:none!important}
.rdpv-sonando .rdpv-i-play,.rdpv-conectando .rdpv-i-play,.rdpv-tanda .rdpv-i-play{display:none!important}
.rdpv-sonando .rdpv-i-pausa,.rdpv-tanda .rdpv-i-pausa{display:block!important}
.rdpv-conectando:not(.rdpv-tanda) .rdpv-spin{display:block!important;width:26px;height:26px;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:rdpv-giro .8s linear infinite}
@keyframes rdpv-giro{to{transform:rotate(360deg)}}
.rdpv-vol{display:flex;align-items:center;gap:8px;color:var(--rdpv-muted)}
.rdpv-vol svg{width:18px;height:18px;fill:currentColor;flex:none}
.rdpv-vol input[type=range]{width:110px!important;max-width:110px!important}
.rdpv-botones{display:flex;gap:8px;align-items:center;margin-left:auto}
.rdpv-msg{font:500 12px var(--rdpv-mono);color:var(--rdpv-muted);margin-right:4px;max-width:260px}
.rdpv .rdpv-ico,#rdpv-persist .rdpv-ico{width:40px!important;height:40px!important;border-radius:50%!important;border:1px solid var(--rdpv-line)!important;display:grid;place-items:center;color:var(--rdpv-ink)!important}
.rdpv-ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Barras de colores */
.rdpv-eq{display:block;width:calc(100% - 56px);height:110px;margin:0 28px 18px}

/* Próximos programas */
.rdpv-sigue{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;padding:0 0 22px 28px}
.rdpv-sigue h3,.rdpv-carru-head h3{font:700 11px/1.2 var(--rdpv-mono)!important;letter-spacing:.14em!important;text-transform:uppercase!important;color:var(--rdpv-muted)!important;margin:0!important}
.rdpv-sigue-pista{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-right:28px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.rdpv-sigue-pista::-webkit-scrollbar{display:none}
.rdpv-prox{flex:0 0 auto;scroll-snap-align:start;display:grid;grid-template-columns:48px auto;gap:2px 12px;align-items:center;background:var(--rdpv-bg2);border:1px solid var(--rdpv-line);border-radius:12px;padding:8px 16px 8px 8px;min-width:220px}
.rdpv-prox img,.rdpv-prox-sin{grid-row:span 3;width:48px;height:48px;border-radius:8px!important;display:block;object-fit:cover;background:var(--rdpv-line)}
.rdpv-cuando{font:700 10px/1.3 var(--rdpv-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--rdpv-muted)}
.rdpv-cuando b{color:#fff;background:var(--rdpv-accent);padding:1px 6px;border-radius:4px;margin-right:6px}
.rdpv-nom{font-family:var(--rdpv-display);font-weight:800;font-stretch:112%;font-size:16px;line-height:1.1}
.rdpv-sub{font-size:12.5px;color:var(--rdpv-muted);white-space:nowrap}
.rdpv-prox:first-child{border-color:color-mix(in srgb,var(--rdpv-accent) 60%,var(--rdpv-line))}

/* Slide de noticias y publicidad */
.rdpv-carru{border-top:1px solid var(--rdpv-line);padding:20px 0 22px;background:linear-gradient(180deg,var(--rdpv-bg2),var(--rdpv-bg))}
.rdpv-carru-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 28px 12px}
.rdpv-flechas{display:flex;gap:6px}
.rdpv-flechas button{width:34px!important;height:34px!important;border-radius:50%!important;border:1px solid var(--rdpv-line)!important;color:var(--rdpv-ink)!important;font-size:15px!important}
.rdpv-pista{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 28px;padding:2px 28px 6px;scrollbar-width:none}
.rdpv-pista::-webkit-scrollbar{display:none}
.rdpv-card{flex:0 0 clamp(220px,28%,280px);scroll-snap-align:start;background:var(--rdpv-bg2);border:1px solid var(--rdpv-line);border-radius:12px;overflow:hidden;color:var(--rdpv-ink)!important;display:flex;flex-direction:column;transition:transform .2s,border-color .2s}
.rdpv-card:hover{transform:translateY(-3px);border-color:var(--rdpv-muted)}
.rdpv-card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.rdpv-txt{padding:12px 14px 14px;display:grid;gap:6px}
.rdpv-cat{font:700 10px/1.2 var(--rdpv-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--rdpv-accent2)}
.rdpv-tit{font-weight:600;font-size:16px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rdpv-ad{background:#000;position:relative}
.rdpv-ad img,.rdpv-ad video{aspect-ratio:auto;width:100%;height:100%;min-height:100%;object-fit:cover;display:block}
.rdpv-lbl{position:absolute;left:10px;top:10px;background:rgba(0,0,0,.65);color:#fff;font:700 10px/1 var(--rdpv-mono);letter-spacing:.12em;padding:5px 8px;border-radius:12px}

/* Ticker */
.rdpv-ticker{display:flex;align-items:stretch;background:var(--rdpv-accent);color:#fff;overflow:hidden;font-weight:600;font-size:14px}
.rdpv-rot{flex:none;background:#1b1a17;color:#fff;font:700 11px/1 var(--rdpv-mono);letter-spacing:.14em;padding:11px 14px;display:flex;align-items:center;gap:8px}
.rdpv-ventana{overflow:hidden;flex:1;min-width:0;display:flex;align-items:center}
.rdpv-cinta{display:flex;white-space:nowrap;animation:rdpv-cinta 40s linear infinite;will-change:transform}
.rdpv-cinta span{padding-right:44px}
.rdpv-ticker .rdpv-cinta span::after{content:"◆";padding-left:44px;opacity:.6;font-size:10px;vertical-align:2px}
.rdpv-ticker:hover .rdpv-cinta{animation-play-state:paused}
@keyframes rdpv-cinta{to{transform:translateX(-50%)}}

/* Alto fijo: el contenido se desliza adentro y el ticker queda abajo */
.rdpv-alto-fijo .rdpv{height:var(--rdpv-alto);overflow-y:auto;scrollbar-width:thin}
.rdpv-alto-fijo .rdpv-ticker{position:sticky;bottom:0;z-index:2}

/* ---------- Angosto (barra lateral o celular): formato tipo app ---------- */
@container rdpv (max-width:640px){
  .rdpv-top{grid-template-columns:minmax(0,1fr);text-align:center;padding:20px 18px 16px;gap:18px}
  .rdpv-arte{width:min(68%,260px);margin:0 auto;box-shadow:0 18px 40px -18px rgba(0,0,0,.8)}
  .rdpv-info{align-items:center;gap:10px}
  .rdpv-radio{justify-content:center;text-align:left}
  .rdpv-radio img{width:52px;height:52px}
  .rdpv-radio-txt strong{font-size:19px}
  .rdpv-prog{font-size:clamp(32px,13cqi,54px)}
  .rdpv-desc{font-size:14px}
  .rdpv-linea{width:100%}
  .rdpv-controles{justify-content:center}
  .rdpv .rdpv-controles .rdpv-play{width:72px!important;height:72px!important;order:-1}
  .rdpv-controles .rdpv-vol{flex:1 1 100%;justify-content:center}
  .rdpv-controles .rdpv-vol input[type=range]{width:min(70%,260px)!important;max-width:none!important}
  .rdpv-botones{flex:1 1 100%;justify-content:center;margin-left:0;flex-wrap:wrap}
  .rdpv-msg{flex:1 1 100%;text-align:center;margin:0}
  .rdpv-msg:empty{display:none}
  .rdpv-eq{width:calc(100% - 36px);margin:0 18px 14px;height:80px}
  .rdpv-sigue{grid-template-columns:minmax(0,1fr);gap:10px;padding:0 0 18px 18px}
  .rdpv-carru-head{padding:0 18px 12px}
  .rdpv-pista{padding:2px 18px 6px;scroll-padding:0 18px}
  .rdpv-card{flex-basis:76%}
  .rdpv-ticker{font-size:13px}
  .rdpv-rot{padding:10px}
}
@media (max-width:640px){.rdpv-alto-fijo .rdpv{height:auto;overflow:visible}}
.rdpv-en-popup .rdpv-caja{margin:0}

/* ===================== Barra fija ===================== */
#rdpv-persist .rdpv-fija{position:fixed;left:0;right:0;bottom:0;z-index:99990;background:color-mix(in srgb,var(--rdpv-bg) 96%,transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--rdpv-ink);border-top:3px solid var(--rdpv-accent);
  transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.8,.2,1);padding-bottom:env(safe-area-inset-bottom,0px);font-size:14px;line-height:1.3}
html.rdpv-fija-visible #rdpv-persist .rdpv-fija{transform:none}
html.rdpv-fija-visible body{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}
.rdpv-fija-in{max-width:1200px;margin:0 auto;padding:10px max(16px,env(safe-area-inset-right,0px)) 10px max(16px,env(safe-area-inset-left,0px));display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center}
.rdpv-fija-arte{width:52px;height:52px;border-radius:9px;overflow:hidden;background:var(--rdpv-bg2);flex:none}
.rdpv-fija-arte img{width:100%;height:100%;display:block;object-fit:cover}
.rdpv-fija-txt{min-width:0;display:grid;gap:2px}
.rdpv-l1{display:flex;align-items:center;gap:8px;font:700 10px/1.2 var(--rdpv-mono);letter-spacing:.14em;color:var(--rdpv-accent2);text-transform:uppercase;white-space:nowrap;overflow:hidden}
.rdpv-l2{font-family:var(--rdpv-display);font-weight:800;font-stretch:115%;font-size:18px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rdpv-l3{overflow:hidden;font-size:12.5px;color:var(--rdpv-muted);white-space:nowrap}
.rdpv-l3 .rdpv-cinta{display:inline-flex;animation-duration:26s}
.rdpv-fija-ctl{display:flex;align-items:center;gap:10px}
.rdpv-mini{width:64px;height:30px;display:block;flex:none}
#rdpv-persist .rdpv-play{width:48px!important;height:48px!important;box-shadow:none!important}
#rdpv-persist .rdpv-play svg{width:20px;height:20px}
#rdpv-persist .rdpv-conectando:not(.rdpv-tanda) .rdpv-spin,#rdpv-persist.rdpv-conectando:not(.rdpv-tanda) .rdpv-spin{width:20px;height:20px}
@media (max-width:640px){#rdpv-persist .rdpv-vol,#rdpv-persist .rdpv-solo-ancho{display:none}.rdpv-fija-in{gap:10px}.rdpv-l2{font-size:16px}}

/* Cambiando de página (navegación sin recarga) */
html.rdpv-cargando body>*:not(#rdpv-persist){opacity:.55;transition:opacity .15s}
html.rdpv-cargando::after{content:"";position:fixed;top:0;left:0;height:3px;width:35%;z-index:100000;background:#ff5b45;animation:rdpv-carga 1s ease-in-out infinite}
@keyframes rdpv-carga{0%{left:-35%}100%{left:100%}}

@media (prefers-reduced-motion:reduce){
  .rdpv *,#rdpv-persist *{animation:none!important;transition:none!important}
  html.rdpv-cargando::after{animation:none}
}
