
/* Mi Portal de Noticias · Radio Widget Pro */
.radio-widget-pro{
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    overflow:visible !important;
}
.radio-pro-shell{
    position:relative;
    overflow:hidden;
    min-height:360px;
    padding:20px;
    border-radius:24px;
    color:#fff;
    background:
      linear-gradient(145deg,rgba(13,18,31,.98),rgba(31,39,58,.96) 48%,rgba(135,0,24,.96));
    border:1px solid rgba(255,255,255,.14);
    box-shadow:0 22px 50px rgba(10,15,25,.26);
    isolation:isolate;
}
.radio-pro-shell::before{
    content:"";
    position:absolute;inset:0;
    background:linear-gradient(120deg,rgba(255,255,255,.08),transparent 35%);
    pointer-events:none;
}
.radio-pro-glow{
    position:absolute;
    border-radius:50%;
    filter:blur(15px);
    opacity:.28;
    z-index:-1;
}
.radio-pro-glow-a{
    width:220px;height:220px;
    right:-95px;top:-80px;
    background:#ff335c;
    animation:radioFloat 7s ease-in-out infinite;
}
.radio-pro-glow-b{
    width:160px;height:160px;
    left:-70px;bottom:-60px;
    background:#455bff;
    animation:radioFloat 8.5s ease-in-out infinite reverse;
}
@keyframes radioFloat{
    0%,100%{transform:translate3d(0,0,0) scale(1)}
    50%{transform:translate3d(12px,18px,0) scale(1.12)}
}
.radio-pro-top,.radio-pro-brand,.radio-pro-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    position:relative;
    z-index:2;
}
.radio-pro-live{
    display:inline-flex;align-items:center;gap:8px;
    font-size:11px;font-weight:900;letter-spacing:.14em;
}
.radio-pro-live i{
    width:9px;height:9px;border-radius:50%;
    background:#ff334f;
    box-shadow:0 0 0 0 rgba(255,51,79,.75);
    animation:radioLive 1.55s infinite;
}
@keyframes radioLive{
    70%{box-shadow:0 0 0 10px rgba(255,51,79,0)}
    100%{box-shadow:0 0 0 0 rgba(255,51,79,0)}
}
.radio-pro-status{
    padding:6px 9px;
    border-radius:999px;
    background:rgba(255,255,255,.11);
    color:rgba(255,255,255,.82);
    font-size:10px;font-weight:900;
    backdrop-filter:blur(8px);
}
.radio-pro-status.online{background:rgba(34,197,94,.18);color:#b8ffcd}
.radio-pro-status.offline{background:rgba(239,68,68,.18);color:#ffc0c0}
.radio-pro-brand{justify-content:flex-start;margin-top:18px}
.radio-pro-logo{
    display:grid;place-items:center;
    width:50px;height:50px;border-radius:16px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.16);
    font-size:14px;font-weight:1000;letter-spacing:.08em;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
}
.radio-pro-brand small,.radio-pro-now small{
    display:block;
    font-size:10px;font-weight:900;letter-spacing:.13em;
    color:rgba(255,255,255,.58);
}
.radio-pro-brand h2{
    margin:3px 0 0;
    color:#fff;
    font-size:20px;line-height:1.15;
}
.radio-pro-now{
    position:relative;z-index:2;
    margin-top:21px;
    min-height:66px;
}
.radio-pro-now strong{
    display:block;
    margin-top:5px;
    font-size:16px;
    line-height:1.35;
    color:#fff;
}
.radio-pro-now span{
    display:block;
    margin-top:5px;
    font-size:11px;
    color:rgba(255,255,255,.62);
}
.radio-pro-visual{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    height:105px;
    margin:6px 0 2px;
    z-index:2;
}
.radio-pro-play{
    position:relative;z-index:4;
    display:grid;place-items:center;
    width:68px;height:68px;
    border:0;border-radius:50%;
    background:#fff;color:#a9001a;
    font-size:25px;
    cursor:pointer;
    box-shadow:0 14px 34px rgba(0,0,0,.28);
    transition:transform .22s ease,box-shadow .22s ease;
}
.radio-pro-play:hover{transform:scale(1.05);box-shadow:0 17px 40px rgba(0,0,0,.34)}
.radio-pro-play:active{transform:scale(.98)}
.radio-pro-play.is-playing{animation:radioButtonGlow 2s ease-in-out infinite}
@keyframes radioButtonGlow{
    50%{box-shadow:0 0 0 10px rgba(255,255,255,.05),0 16px 42px rgba(255,0,60,.35)}
}
.radio-pro-wave{
    position:absolute;
    width:68px;height:68px;border-radius:50%;
    border:1px solid rgba(255,255,255,.35);
    opacity:0;
}
.radio-pro-wave.playing{
    opacity:1;
    animation:radioWave 1.8s linear infinite;
}
.radio-pro-wave.playing::before,.radio-pro-wave.playing::after{
    content:"";position:absolute;inset:0;border-radius:50%;
    border:1px solid rgba(255,255,255,.25);
    animation:radioWave 1.8s linear infinite;
}
.radio-pro-wave.playing::before{animation-delay:.6s}
.radio-pro-wave.playing::after{animation-delay:1.2s}
@keyframes radioWave{
    0%{transform:scale(.9);opacity:.7}
    100%{transform:scale(1.95);opacity:0}
}
.radio-pro-eq{
    position:absolute;
    right:8px;bottom:13px;
    display:flex;align-items:flex-end;gap:3px;
    height:30px;
}
.radio-pro-eq i{
    width:3px;height:6px;border-radius:4px;
    background:linear-gradient(#fff,#ff8ba0);
    animation:radioEq .85s ease-in-out infinite;
    animation-play-state:paused;
}
.radio-pro-eq.playing i{animation-play-state:running}
.radio-pro-eq i:nth-child(2){animation-delay:.08s}
.radio-pro-eq i:nth-child(3){animation-delay:.17s}
.radio-pro-eq i:nth-child(4){animation-delay:.26s}
.radio-pro-eq i:nth-child(5){animation-delay:.35s}
.radio-pro-eq i:nth-child(6){animation-delay:.44s}
.radio-pro-eq i:nth-child(7){animation-delay:.53s}
@keyframes radioEq{
    0%,100%{height:5px;opacity:.65}
    50%{height:27px;opacity:1}
}
.radio-pro-bottom{
    margin-top:4px;
    padding-top:14px;
    border-top:1px solid rgba(255,255,255,.11);
}
.radio-pro-listeners{
    display:flex;align-items:baseline;gap:5px;
}
.radio-pro-listeners strong{font-size:16px}
.radio-pro-listeners small{font-size:10px;color:rgba(255,255,255,.58)}
.radio-pro-volume{display:flex;align-items:center;gap:8px}
.radio-pro-volume input{
    width:92px;
    accent-color:#fff;
}
.radio-pro-message{
    position:relative;z-index:2;
    margin-top:12px;
    text-align:center;
    font-size:11px;
    color:rgba(255,255,255,.68);
}
@media(max-width:700px){
    .radio-pro-shell{min-height:340px}
}

.radio-pro-bottom-simple{justify-content:flex-end}.radio-pro-listeners{display:none!important}
