:root{--hpradio-primary:#d6a632}
.hpradio-player,.hpradio-panel,.hpradio-admin{font-family:Inter,Arial,Helvetica,sans-serif}
.hpradio-player *,.hpradio-panel *{box-sizing:border-box}
.hpradio-player{
--hpradio-bg:#05070c;
--hpradio-card:#0c111b;
max-width:980px;
margin:22px auto;
display:grid;
grid-template-columns:220px minmax(0,1fr);
gap:18px;
padding:18px;
border:1px solid color-mix(in srgb,var(--hpradio-primary) 42%, transparent);
border-radius:26px;
color:#fff;
background:linear-gradient(135deg,#05070c,#0d111b);
box-shadow:0 24px 70px rgba(0,0,0,.38);
overflow:hidden;
position:relative;
}
.hpradio-player:before{
content:"";
position:absolute;inset:-90px -120px auto auto;width:260px;height:260px;
background:radial-gradient(circle,color-mix(in srgb,var(--hpradio-primary) 26%, transparent),transparent 65%);
pointer-events:none;
}
.hpradio-cover-wrap{position:relative;min-height:220px;border-radius:22px;overflow:hidden;background:#07090d;border:1px solid rgba(255,255,255,.07)}
.hpradio-cover{width:100%;height:100%;object-fit:cover;display:block}
.hpradio-live-badge{position:absolute;top:12px;left:12px;padding:8px 11px;border-radius:999px;background:#e71724;color:#fff;font-size:11px;font-weight:900;letter-spacing:.08em}
.hpradio-info{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0}
.hpradio-brand{display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:12px}
.hpradio-brand img{width:92px;max-height:40px;object-fit:contain}
.hpradio-brand strong{display:block;font-size:18px;line-height:1.1;color:#fff}
.hpradio-brand span{display:block;color:#aeb7c5;font-size:12px;margin-top:3px}
.hpradio-now span{display:inline-flex;color:var(--hpradio-primary);font-size:11px;letter-spacing:.14em;font-weight:900;margin-bottom:7px}
.hpradio-now h3{font-size:29px;line-height:1.05;margin:0;color:#fff}
.hpradio-now p{margin:8px 0 0;color:#b8c0ce}
.hpradio-controls{display:flex;align-items:center;gap:12px;margin-top:auto;flex-wrap:wrap}
.hpradio-play{border:0;border-radius:999px;padding:13px 18px;background:linear-gradient(135deg,var(--hpradio-primary),#8d6514);color:#050505;font-weight:950;cursor:pointer;box-shadow:0 12px 28px color-mix(in srgb,var(--hpradio-primary) 18%, transparent)}
.hpradio-controls input[type=range]{accent-color:var(--hpradio-primary);width:130px}
.hpradio-controls span{color:#d8deea;font-size:12px}
.hpradio-msg{border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.035);border-radius:14px;padding:10px 12px;color:#b8c0ce;font-size:12px}
.hpradio-youtube-holder{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.hpradio-model-compact{grid-template-columns:90px minmax(0,1fr);max-width:720px;border-radius:18px;padding:12px}
.hpradio-model-compact .hpradio-cover-wrap{min-height:90px;border-radius:14px}
.hpradio-model-compact .hpradio-brand img{display:none}
.hpradio-model-compact .hpradio-now h3{font-size:20px}
.hpradio-model-card{grid-template-columns:1fr;max-width:440px}
.hpradio-model-card .hpradio-cover-wrap{min-height:260px}
.hpradio-model-card .hpradio-brand{justify-content:center;text-align:center}
.hpradio-model-card .hpradio-now{text-align:center}
.hpradio-model-card .hpradio-controls{justify-content:center}
.hpradio-panel-body{margin:0;background:#05070c;color:#fff}
.hpradio-panel{min-height:100vh;display:grid;grid-template-columns:250px minmax(0,1fr);background:linear-gradient(135deg,#030508,#0c111b);color:#fff}
.hpradio-panel aside{border-right:1px solid rgba(214,166,50,.28);padding:22px 18px;background:#05070c;position:sticky;top:0;height:100vh}
.hpradio-panel-logo{width:190px;display:block;margin:0 auto 22px;object-fit:contain}
.hpradio-panel aside button{display:block;width:100%;margin:8px 0;border:1px solid rgba(214,166,50,.28);border-radius:15px;background:#0c111b;color:#fff;padding:13px 14px;text-align:left;font-weight:850;cursor:pointer}
.hpradio-panel aside button.active,.hpradio-panel aside button:hover{background:linear-gradient(135deg,var(--hpradio-primary),#8d6514);color:#050505}
.hpradio-panel main{padding:24px;min-width:0}
.hpradio-login-box{max-width:460px;margin:8vh auto;border:1px solid rgba(214,166,50,.32);border-radius:26px;background:#0c111b;padding:28px;box-shadow:0 24px 70px rgba(0,0,0,.38)}
.hpradio-login-box img{width:230px;display:block;margin:0 0 22px}
.hpradio-login-box h1{font-size:30px;margin:0 0 8px}
.hpradio-login-box p{color:#aeb7c5;margin:0 0 22px}
.hpradio-login-box label,.hpradio-form-grid label,.hpradio-live-data label{display:block;color:#f5d278;font-size:11px;font-weight:900;letter-spacing:.06em;margin-bottom:12px}
.hpradio-login-box input,.hpradio-form-grid input,.hpradio-form-grid select,.hpradio-live-data input{
width:100%;margin-top:7px;background:#06090f;border:1px solid rgba(214,166,50,.26);color:#fff;border-radius:13px;padding:12px;min-height:42px
}
.hpradio-login-box button,.hpradio-save,.hpradio-form-grid button,.hpradio-live-actions button{
border:0;border-radius:14px;background:linear-gradient(135deg,var(--hpradio-primary),#8d6514);color:#050505;font-weight:950;padding:13px 16px;cursor:pointer
}
.hpradio-panel-header{display:flex;align-items:center;gap:18px;border:1px solid rgba(214,166,50,.28);background:#0c111b;border-radius:24px;padding:18px;margin-bottom:18px}
.hpradio-panel-header img{width:170px;max-height:62px;object-fit:contain}
.hpradio-panel-header h1{margin:0;font-size:25px}
.hpradio-panel-header p{margin:4px 0 0;color:#aeb7c5}
.hpradio-panel-header strong{margin-left:auto;border:1px solid rgba(214,166,50,.25);border-radius:999px;padding:10px 14px;color:#f5d278}
.hpradio-tab{display:none;border:1px solid rgba(214,166,50,.22);border-radius:22px;background:#0c111b;padding:20px;margin-bottom:16px}
.hpradio-tab.active{display:block}
.hpradio-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.hpradio-stats div{border:1px solid rgba(214,166,50,.20);border-radius:18px;background:#070a10;padding:18px}
.hpradio-stats span{display:block;color:#f5d278;font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.hpradio-stats strong{display:block;font-size:23px;margin-top:8px}
.hpradio-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:end}
.hpradio-form-grid .wide{grid-column:span 4}
.hpradio-form-grid select[multiple]{min-height:106px}
.hpradio-table{margin-top:18px;border:1px solid rgba(214,166,50,.22);border-radius:18px;overflow:hidden}
.hpradio-row{display:grid;grid-template-columns:160px 1fr 120px 1fr 120px;gap:12px;align-items:center;padding:12px;border-bottom:1px solid rgba(255,255,255,.07)}
.hpradio-row:last-child{border-bottom:0}
.hpradio-row small{color:#aeb7c5;word-break:break-all}
.hpradio-row button{border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#171d2a;color:#fff;padding:8px 10px;cursor:pointer}
.hpradio-shortcode{margin-top:16px;padding:16px;border-radius:14px;background:#070a10;border:1px solid rgba(214,166,50,.22)}
.hpradio-live-data{display:grid;grid-template-columns:1fr;gap:10px}
.hpradio-live-actions{display:flex;gap:10px;margin:16px 0;flex-wrap:wrap}
.hpradio-panel-msg{min-height:24px;color:#6ef0a7;margin:10px 0}
.hpradio-save{position:sticky;bottom:18px;float:right;box-shadow:0 18px 45px rgba(0,0,0,.35)}
.hpradio-admin{max-width:1300px;color:#fff}
.hpradio-admin-hero{display:flex;gap:22px;align-items:center;background:linear-gradient(135deg,#05070c,#0c111b);border:1px solid rgba(214,166,50,.28);border-radius:24px;padding:22px;margin:18px 0}
.hpradio-admin-hero img{width:220px;max-width:35%;height:auto}
.hpradio-admin-hero h1{color:#fff;margin:0 0 6px}
.hpradio-admin-hero p{color:#aeb7c5;margin:0}
.hpradio-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.hpradio-card{background:#0c111b;border:1px solid rgba(214,166,50,.25);border-radius:20px;padding:20px;margin-bottom:16px;color:#eef2f8}
.hpradio-card h2{color:#fff;margin-top:0}
.hpradio-card code{background:#05070c;color:#f5d278;padding:4px 7px;border-radius:6px}
.hpradio-card input,.hpradio-card select{background:#05070c!important;border:1px solid rgba(214,166,50,.24)!important;color:#fff!important;border-radius:10px!important}
@media(max-width:900px){
.hpradio-player{grid-template-columns:1fr;margin:12px;border-radius:18px;padding:12px}
.hpradio-cover-wrap{min-height:180px}
.hpradio-now h3{font-size:23px}
.hpradio-panel{grid-template-columns:1fr}
.hpradio-panel aside{position:relative;height:auto;display:flex;overflow-x:auto;gap:8px;padding:12px}
.hpradio-panel-logo{display:none}
.hpradio-panel aside button{min-width:140px;margin:0}
.hpradio-panel main{padding:12px}
.hpradio-panel-header{align-items:flex-start}
.hpradio-panel-header img{width:120px}
.hpradio-panel-header strong{display:none}
.hpradio-stats{grid-template-columns:1fr 1fr}
.hpradio-form-grid{grid-template-columns:1fr 1fr}
.hpradio-form-grid .wide{grid-column:span 2}
.hpradio-row{grid-template-columns:1fr}
.hpradio-admin-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
.hpradio-stats{grid-template-columns:1fr}
.hpradio-form-grid{grid-template-columns:1fr}
.hpradio-form-grid .wide{grid-column:span 1}
.hpradio-controls input[type=range]{width:100px}
.hpradio-play{width:100%}
}
/* v1.0.1 - painel funcional/bonito e players limpos */
.hpradio-panel-body{
margin:0!important;
min-height:100vh;
background:radial-gradient(circle at 18% 8%,rgba(214,166,50,.12),transparent 30%),linear-gradient(135deg,#030508,#0b111d)!important;
color:#fff!important;
}
.hpradio-panel:not(.is-logged){
display:flex!important;
align-items:center!important;
justify-content:center!important;
min-height:100vh!important;
padding:22px!important;
}
.hpradio-panel:not(.is-logged) aside{display:none!important}
.hpradio-panel:not(.is-logged) main{
width:100%!important;
max-width:520px!important;
padding:0!important;
}
.hpradio-login-box{
display:block!important;
width:100%!important;
max-width:520px!important;
margin:0 auto!important;
padding:34px!important;
border-radius:28px!important;
background:linear-gradient(180deg,#101622,#06090f)!important;
border:1px solid rgba(214,166,50,.38)!important;
box-shadow:0 30px 90px rgba(0,0,0,.48)!important;
}
.hpradio-login-brand{
display:flex;
justify-content:center;
padding-bottom:18px;
margin-bottom:20px;
border-bottom:1px solid rgba(214,166,50,.18);
}
.hpradio-login-brand img,
.hpradio-login-box img{
width:260px!important;
max-width:100%!important;
height:auto!important;
margin:0!important;
object-fit:contain!important;
}
.hpradio-login-box h1{
color:#fff!important;
font-size:32px!important;
line-height:1.05!important;
margin:0 0 8px!important;
}
.hpradio-login-box p{
color:#b7c0cf!important;
font-size:14px!important;
line-height:1.55!important;
margin:0 0 22px!important;
}
.hpradio-login-box label{
color:#f5d278!important;
display:block!important;
margin:14px 0 0!important;
}
.hpradio-login-box input{
width:100%!important;
margin-top:8px!important;
background:#05070c!important;
color:#fff!important;
border:1px solid rgba(214,166,50,.26)!important;
border-radius:14px!important;
padding:13px 14px!important;
min-height:46px!important;
outline:none!important;
}
.hpradio-login-box input:focus{
border-color:#f5d278!important;
box-shadow:0 0 0 2px rgba(245,210,120,.16)!important;
}
.hpradio-login-box button{
width:100%!important;
margin-top:20px!important;
border:0!important;
border-radius:16px!important;
padding:15px!important;
background:linear-gradient(135deg,#f5d278,#d6a632 55%,#8d6514)!important;
color:#050505!important;
font-weight:950!important;
cursor:pointer!important;
}
/* Painel operador após login */
.hpradio-panel.is-logged{
min-height:100vh!important;
display:grid!important;
grid-template-columns:260px minmax(0,1fr)!important;
background:linear-gradient(135deg,#030508,#0b111d)!important;
}
.hpradio-panel.is-logged aside{
display:block!important;
background:linear-gradient(180deg,#05070c,#070b12)!important;
border-right:1px solid rgba(214,166,50,.25)!important;
}
.hpradio-panel.is-logged main{
padding:24px!important;
}
.hpradio-panel-logo{
width:190px!important;
max-width:100%!important;
margin:0 auto 18px!important;
display:block!important;
}
.hpradio-panel-app{
display:block;
}
.hpradio-panel-header{
background:linear-gradient(180deg,#101622,#070a10)!important;
border-color:rgba(214,166,50,.28)!important;
}
.hpradio-panel-header img{
width:155px!important;
max-height:58px!important;
object-fit:contain!important;
}
.hpradio-tab{
background:linear-gradient(180deg,#101622,#070a10)!important;
}
.hpradio-tab h2{
margin-top:0!important;
color:#fff!important;
}
.hpradio-tab p{
color:#b7c0cf!important;
}
.hpradio-form-grid input,
.hpradio-form-grid select,
.hpradio-live-data input{
background:#05070c!important;
color:#fff!important;
border:1px solid rgba(214,166,50,.25)!important;
border-radius:14px!important;
min-height:44px!important;
padding:12px!important;
}
.hpradio-form-grid label,
.hpradio-live-data label{
color:#f5d278!important;
}
.hpradio-table{
background:#05070c!important;
}
.hpradio-row{
background:#080c13!important;
}
.hpradio-save{
border-radius:16px!important;
}
/* Admin WP mais legível */
.wp-admin .hpradio-admin{
background:#05070c;
padding:18px;
border-radius:20px;
}
.wp-admin .hpradio-admin-hero,
.wp-admin .hpradio-card{
background:linear-gradient(180deg,#101622,#070a10)!important;
}
.wp-admin .hpradio-card label,
.wp-admin .hpradio-card th{
color:#f5d278!important;
}
.wp-admin .hpradio-card input{
min-height:42px!important;
}
/* Players limpos: menos logo duplicada */
.hpradio-player{
isolation:isolate;
}
.hpradio-model-clean{
grid-template-columns:minmax(0,1fr)!important;
max-width:760px!important;
padding:18px 20px!important;
border-radius:22px!important;
}
.hpradio-model-clean .hpradio-cover-wrap{
display:none!important;
}
.hpradio-model-clean .hpradio-brand img{
display:none!important;
}
.hpradio-model-clean .hpradio-brand{
padding-bottom:10px!important;
}
.hpradio-model-clean .hpradio-now h3{
font-size:25px!important;
}
.hpradio-model-clean .hpradio-msg{
display:none!important;
}
.hpradio-model-bar{
grid-template-columns:minmax(0,1fr)!important;
max-width:980px!important;
padding:10px 14px!important;
border-radius:999px!important;
}
.hpradio-model-bar .hpradio-cover-wrap,
.hpradio-model-bar .hpradio-brand img,
.hpradio-model-bar .hpradio-msg,
.hpradio-model-bar .hpradio-now span,
.hpradio-model-bar .hpradio-now p{
display:none!important;
}
.hpradio-model-bar .hpradio-info{
display:grid!important;
grid-template-columns:1fr auto!important;
align-items:center!important;
gap:12px!important;
}
.hpradio-model-bar .hpradio-brand{
border:0!important;
padding:0!important;
}
.hpradio-model-bar .hpradio-brand strong{
font-size:13px!important;
}
.hpradio-model-bar .hpradio-brand span{
font-size:10px!important;
}
.hpradio-model-bar .hpradio-now h3{
margin:0!important;
font-size:15px!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.hpradio-model-bar .hpradio-controls{
margin:0!important;
flex-wrap:nowrap!important;
}
.hpradio-model-bar .hpradio-play{
padding:9px 12px!important;
font-size:12px!important;
}
.hpradio-model-bar .hpradio-controls input[type=range]{
width:90px!important;
}
.hpradio-model-premium .hpradio-brand img{
display:none!important;
}
.hpradio-model-compact .hpradio-brand img{
display:none!important;
}
.hpradio-model-card .hpradio-brand img{
display:none!important;
}
@media(max-width:900px){
.hpradio-panel.is-logged{
grid-template-columns:1fr!important;
}
.hpradio-panel.is-logged aside{
display:flex!important;
gap:8px!important;
overflow:auto!important;
height:auto!important;
position:relative!important;
}
.hpradio-panel-logo{
display:none!important;
}
.hpradio-player{
margin:12px!important;
}
.hpradio-model-bar{
border-radius:18px!important;
}
.hpradio-model-bar .hpradio-info{
grid-template-columns:1fr!important;
}
}
/* v1.0.2 - ajustes solicitados: painel, programação simples e players mais limpos */
/* Login não fica suspenso depois que entrar */
.hpradio-panel.is-logged .hpradio-login-box,
body.hpradio-logged .hpradio-login-box{
display:none!important;
visibility:hidden!important;
opacity:0!important;
pointer-events:none!important;
}
.hpradio-panel.is-logged main{
max-width:none!important;
width:100%!important;
}
.hpradio-panel.is-logged .hpradio-panel-app{
display:block!important;
}
/* Visual do painel de programação mais próximo ao painel TV */
.hpradio-panel.is-logged{
grid-template-columns:230px minmax(0,1fr)!important;
background:linear-gradient(135deg,#030508,#08101b)!important;
}
.hpradio-panel.is-logged aside{
padding:18px 14px!important;
}
.hpradio-panel aside button{
border-radius:16px!important;
padding:14px 14px!important;
margin:8px 0!important;
}
.hpradio-panel.is-logged main{
padding:22px 24px!important;
}
.hpradio-panel-header{
border-radius:24px!important;
padding:18px 22px!important;
margin-bottom:18px!important;
}
.hpradio-panel-header img{
display:none!important; /* no painel interno fica só nome da rádio, sem duplicar logo */
}
.hpradio-panel-header h1{
font-size:28px!important;
line-height:1.08!important;
}
.hpradio-tab{
border-radius:24px!important;
padding:24px!important;
}
.hpradio-tab h2{
font-size:24px!important;
}
.hpradio-form-grid{
grid-template-columns:1.2fr .8fr .7fr .7fr .8fr!important;
gap:14px!important;
}
.hpradio-form-grid .wide{
grid-column:span 5!important;
}
.hpradio-help-note{
color:#b8c0cf!important;
background:rgba(255,255,255,.035);
border:1px solid rgba(214,166,50,.18);
border-radius:14px;
padding:12px 14px;
margin:0!important;
letter-spacing:0!important;
font-size:12px!important;
font-weight:700!important;
}
.hpradio-form-grid input,
.hpradio-form-grid select{
min-height:42px!important;
}
.hpradio-table{
margin-top:20px!important;
border-radius:18px!important;
}
.hpradio-row{
grid-template-columns:120px 150px 1fr 105px minmax(180px,1fr) 120px!important;
gap:12px!important;
}
.hpradio-row:first-child{
background:#120f08!important;
}
/* Player deve ocupar melhor a largura da página */
.hpradio-player{
width:100%!important;
max-width:1280px!important;
margin:20px auto!important;
}
.hpradio-model-clean{
width:100%!important;
max-width:1280px!important;
min-height:96px!important;
}
.hpradio-model-bar{
width:100%!important;
max-width:1280px!important;
}
.hpradio-model-premium{
max-width:1280px!important;
}
.hpradio-model-compact{
max-width:920px!important;
}
.hpradio-model-card{
max-width:420px!important;
}
/* Remover sensação de várias logos: no player, usa só a logo/capa da rádio configurada */
.hpradio-model-clean .hpradio-brand,
.hpradio-model-bar .hpradio-brand{
border-bottom:0!important;
}
.hpradio-model-clean .hpradio-brand img,
.hpradio-model-bar .hpradio-brand img,
.hpradio-model-premium .hpradio-brand img,
.hpradio-model-compact .hpradio-brand img{
display:none!important;
}
/* Card: logo redonda da rádio, sem logo Host duplicada no texto */
.hpradio-model-card{
text-align:center!important;
padding:22px!important;
}
.hpradio-model-card .hpradio-cover-wrap{
width:150px!important;
height:150px!important;
min-height:150px!important;
margin:0 auto 14px!important;
border-radius:50%!important;
border:2px solid rgba(214,166,50,.38)!important;
overflow:hidden!important;
background:#05070c!important;
}
.hpradio-model-card .hpradio-cover{
width:100%!important;
height:100%!important;
object-fit:cover!important;
}
.hpradio-model-card .hpradio-brand{
display:none!important;
}
.hpradio-model-card .hpradio-now h3{
font-size:22px!important;
}
.hpradio-model-card .hpradio-now p{
font-size:13px!important;
}
.hpradio-model-card .hpradio-controls{
justify-content:center!important;
}
/* Premium: capa grande, mas logo textual do topo escondida */
.hpradio-model-premium .hpradio-cover-wrap{
min-height:210px!important;
}
/* Melhor visual no WordPress admin */
.wp-admin .hpradio-admin{
max-width:1320px!important;
}
.wp-admin .hpradio-card{
padding:22px!important;
}
.wp-admin .hpradio-admin-hero img{
max-width:220px!important;
}
/* Mobile */
@media(max-width:900px){
.hpradio-panel.is-logged{
grid-template-columns:1fr!important;
}
.hpradio-panel.is-logged main{
padding:12px!important;
}
.hpradio-form-grid{
grid-template-columns:1fr 1fr!important;
}
.hpradio-form-grid .wide{
grid-column:span 2!important;
}
.hpradio-row{
grid-template-columns:1fr!important;
}
.hpradio-player{
margin:12px auto!important;
width:calc(100% - 18px)!important;
}
}
@media(max-width:520px){
.hpradio-form-grid{
grid-template-columns:1fr!important;
}
.hpradio-form-grid .wide{
grid-column:span 1!important;
}
.hpradio-model-card .hpradio-cover-wrap{
width:120px!important;
height:120px!important;
min-height:120px!important;
}
}
/* v1.0.3 - seleção de dias em botões e reprodução melhorada */
.hpradio-days-box{
border:1px solid rgba(214,166,50,.22);
border-radius:18px;
padding:14px;
background:#070a10;
}
.hpradio-days-box>strong{
display:block;
color:#f5d278;
font-size:12px;
letter-spacing:.08em;
margin-bottom:10px;
text-transform:uppercase;
}
.hpradio-day-actions{
display:flex;
gap:8px;
flex-wrap:wrap;
margin-bottom:12px;
}
.hpradio-day-actions button{
border:1px solid rgba(214,166,50,.32);
background:rgba(214,166,50,.08);
color:#f5d278;
border-radius:999px;
padding:9px 12px;
font-weight:900;
cursor:pointer;
}
.hpradio-day-actions button:hover{
background:linear-gradient(135deg,#f5d278,#d6a632);
color:#050505;
}
.hpradio-days-grid{
display:grid;
grid-template-columns:repeat(7,minmax(0,1fr));
gap:8px;
}
.hpradio-days-grid label{
margin:0!important;
cursor:pointer;
}
.hpradio-days-grid input{
position:absolute;
opacity:0;
pointer-events:none;
}
.hpradio-days-grid span{
display:flex;
align-items:center;
justify-content:center;
min-height:38px;
border:1px solid rgba(214,166,50,.24);
border-radius:12px;
background:#05070c;
color:#d8deea;
font-size:12px;
font-weight:900;
}
.hpradio-days-grid input:checked + span{
background:linear-gradient(135deg,#f5d278,#d6a632 55%,#8d6514);
color:#050505;
border-color:#f5d278;
}
.hpradio-youtube-holder{
position:relative!important;
left:auto!important;
width:260px!important;
height:146px!important;
overflow:hidden!important;
margin-top:10px!important;
border-radius:14px!important;
border:1px solid rgba(214,166,50,.22)!important;
background:#05070c!important;
}
.hpradio-youtube-holder iframe{
width:100%!important;
height:100%!important;
display:block!important;
border:0!important;
}
.hpradio-model-bar .hpradio-youtube-holder,
.hpradio-model-clean .hpradio-youtube-holder{
width:180px!important;
height:100px!important;
}
@media(max-width:900px){
.hpradio-days-grid{
grid-template-columns:repeat(4,minmax(0,1fr));
}
}
@media(max-width:520px){
.hpradio-days-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.hpradio-youtube-holder{
width:100%!important;
height:170px!important;
}
}
/* v1.0.4 - botão Salvar Programação e feedback de salvamento */
.hpradio-tab-title-row{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:16px;
margin-bottom:18px;
}
.hpradio-tab-title-row h2{
margin-bottom:6px!important;
}
.hpradio-tab-title-row p{
margin:0!important;
}
.hpradio-save-program{
border:0;
border-radius:16px;
background:linear-gradient(135deg,#f5d278,#d6a632 55%,#8d6514);
color:#050505;
font-weight:950;
padding:13px 18px;
cursor:pointer;
box-shadow:0 14px 34px rgba(214,166,50,.18);
white-space:nowrap;
}
.hpradio-save-program:hover{
filter:brightness(1.08);
}
.hpradio-panel-msg{
position:sticky;
bottom:76px;
z-index:30;
display:inline-flex;
align-items:center;
min-height:32px;
padding:8px 12px;
border-radius:999px;
background:rgba(5,7,12,.78);
border:1px solid rgba(214,166,50,.22);
}
@media(max-width:720px){
.hpradio-tab-title-row{
flex-direction:column;
}
.hpradio-save-program{
width:100%;
}
}
/* v1.1.0 - comerciais e vinhetas com ducking */
.hpradio-ad-now{
position:absolute;
right:18px;
top:18px;
z-index:20;
display:flex;
align-items:center;
gap:8px;
padding:10px 14px;
border-radius:999px;
background:linear-gradient(135deg,#f5d278,#d6a632 60%,#8d6514);
color:#050505;
font-weight:950;
box-shadow:0 16px 38px rgba(0,0,0,.35);
}
.hpradio-ad-now strong{
font-size:11px;
letter-spacing:.12em;
}
.hpradio-ad-now span{
max-width:240px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
font-size:12px;
}
.hpradio-ad-toggle{
margin:0 0 16px;
border:1px solid rgba(214,166,50,.22);
background:#070a10;
border-radius:16px;
padding:13px 14px;
}
.hpradio-ad-toggle label{
display:flex;
align-items:center;
gap:10px;
color:#f5d278;
font-weight:900;
cursor:pointer;
}
.hpradio-ad-toggle input{
width:18px;
height:18px;
accent-color:#d6a632;
}
.hpradio-ads-form{
border:1px solid rgba(214,166,50,.18);
border-radius:18px;
background:rgba(255,255,255,.018);
padding:14px;
}
.hpradio-ad-row{
grid-template-columns:130px 1fr 140px minmax(220px,1fr) 190px 120px!important;
}
.hpradio-ad-row span{
display:inline-flex;
justify-content:center;
align-items:center;
min-height:28px;
padding:5px 8px;
border-radius:999px;
background:rgba(214,166,50,.14);
color:#f5d278;
font-size:11px;
font-weight:950;
}
@media(max-width:900px){
.hpradio-ad-row{
grid-template-columns:1fr!important;
}
.hpradio-ad-now{
left:12px;
right:12px;
top:12px;
justify-content:center;
}
}
/* v1.1.1 - otimização para Drive/internet fraca e teste do comercial */
.hpradio-ad-options{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
margin:0 0 16px;
border:1px solid rgba(214,166,50,.20);
background:#070a10;
border-radius:16px;
padding:13px 14px;
}
.hpradio-ad-options label{
display:flex;
align-items:center;
gap:10px;
color:#f5d278;
font-weight:900;
font-size:12px;
}
.hpradio-ad-options label:last-child{
display:block;
}
.hpradio-ad-options input[type=checkbox]{
width:18px;
height:18px;
accent-color:#d6a632;
}
.hpradio-ad-options input[type=number]{
width:100%;
margin-top:6px;
background:#05070c;
color:#fff;
border:1px solid rgba(214,166,50,.25);
border-radius:12px;
padding:10px;
}
.hpradio-row-actions{
display:flex;
gap:8px;
flex-wrap:wrap;
}
.hpradio-row-actions button{
min-width:96px;
}
.hpradio-row-actions [data-test-ad]{
background:linear-gradient(135deg,#f5d278,#d6a632)!important;
color:#050505!important;
}
@media(max-width:900px){
.hpradio-ad-options{
grid-template-columns:1fr;
}
}
/* v1.1.2 - teste real de comercial e botão tocar no player */
.hpradio-audio-test-box{
margin-top:16px;
border:1px solid rgba(214,166,50,.24);
border-radius:18px;
background:#070a10;
padding:14px;
}
.hpradio-audio-test-box strong{
display:block;
color:#f5d278;
margin-bottom:6px;
}
.hpradio-audio-test-box p{
color:#b8c0ce;
margin:0 0 10px;
}
.hpradio-audio-test-box audio{
width:100%;
display:block;
margin:8px 0;
}
.hpradio-audio-test-box small{
display:block;
color:#9fa8b8;
word-break:break-all;
}
.hpradio-row-actions [data-force-ad]{
background:linear-gradient(135deg,#2ce07b,#149d50)!important;
color:#041008!important;
}
/* v1.1.3 - estabilidade do player e fallback para vídeo do Drive */
.hpradio-msg{
min-height:38px;
}
.hpradio-ad-now{
animation:hpradioAdPulse 1.4s ease-in-out infinite alternate;
}
@keyframes hpradioAdPulse{
from{filter:brightness(1)}
to{filter:brightness(1.16)}
}
/* v1.2.1 - correção rota Tocar no Player */
.hpradio-row-actions [data-force-ad]{
border:0!important;
}
/* v1.2.1 - gravar comercial/vinheta no próprio WordPress */
.hpradio-row-actions [data-cache-ad]{
background:linear-gradient(135deg,#4aa3ff,#1e62d0)!important;
color:#fff!important;
}
.hpradio-row-actions [data-cache-ad]::before{
content:"💾 ";
}
.hpradio-row-actions [data-force-ad]::before{
content:"▶ ";
}
/* v1.2.1-drive-sem-gravar */
.hpradio-row-actions [data-cache-ad]{
background:linear-gradient(135deg,#46556f,#1a2233)!important;
color:#fff!important;
}
.hpradio-row-actions [data-cache-ad]::before{
content:"Opcional: ";
opacity:.75;
}
/* v1.2.7 - programação simples com dropdown de dias e edição de links */
.hpradio-program-form{
grid-template-columns:1.25fr .85fr .65fr .65fr .8fr!important;
align-items:end!important;
}
.hpradio-program-form .hpradio-program-link{
grid-column:span 5!important;
}
.hpradio-program-actions{
display:flex!important;
align-items:center!important;
gap:10px!important;
flex-wrap:wrap!important;
}
.hpradio-program-actions button{
min-width:190px!important;
text-align:center!important;
}
.hpradio-secondary-btn{
background:#171d2a!important;
color:#fff!important;
border:1px solid rgba(255,255,255,.16)!important;
}
.hpradio-program-actions small{
color:#b8c0cf!important;
font-size:12px!important;
font-weight:700!important;
letter-spacing:0!important;
}
.hpradio-program-table{
border-radius:20px!important;
overflow:hidden!important;
}
.hpradio-program-head,
.hpradio-program-row{
display:grid!important;
grid-template-columns:120px 140px 1fr 105px minmax(260px,1.5fr) 160px!important;
gap:12px!important;
align-items:center!important;
}
.hpradio-program-head{
padding:13px 14px!important;
background:#120f08!important;
color:#f5d278!important;
font-size:11px!important;
letter-spacing:.12em!important;
border-bottom:1px solid rgba(214,166,50,.20)!important;
}
.hpradio-program-row{
padding:13px 14px!important;
background:#080c13!important;
border-bottom:1px solid rgba(255,255,255,.07)!important;
}
.hpradio-program-row:last-child{border-bottom:0!important}
.hpradio-program-day,
.hpradio-type-badge{
display:inline-flex!important;
justify-content:center!important;
align-items:center!important;
min-height:28px!important;
padding:5px 9px!important;
border-radius:999px!important;
background:rgba(214,166,50,.14)!important;
color:#f5d278!important;
font-size:11px!important;
font-weight:950!important;
white-space:nowrap!important;
}
.hpradio-program-row small{
display:block!important;
max-width:100%!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
word-break:normal!important;
color:#aeb7c5!important;
}
.hpradio-program-empty{
padding:18px!important;
display:flex!important;
flex-direction:column!important;
gap:6px!important;
color:#fff!important;
background:#080c13!important;
}
.hpradio-program-empty span{color:#aeb7c5!important;font-size:13px!important}
.hpradio-program-row .hpradio-row-actions{
justify-content:flex-start!important;
gap:7px!important;
}
.hpradio-program-row [data-edit-program]{
background:linear-gradient(135deg,#f5d278,#d6a632)!important;
color:#050505!important;
border:0!important;
}
.hpradio-program-row [data-remove-program]{
background:#171d2a!important;
color:#fff!important;
}
@media(max-width:1050px){
.hpradio-program-head{display:none!important}
.hpradio-program-row{
grid-template-columns:1fr!important;
gap:8px!important;
}
.hpradio-program-row small{
white-space:normal!important;
word-break:break-all!important;
}
}
@media(max-width:900px){
.hpradio-program-form{
grid-template-columns:1fr 1fr!important;
}
.hpradio-program-form .wide,
.hpradio-program-form .hpradio-program-link{
grid-column:span 2!important;
}
}
@media(max-width:520px){
.hpradio-program-form{
grid-template-columns:1fr!important;
}
.hpradio-program-form .wide,
.hpradio-program-form .hpradio-program-link{
grid-column:span 1!important;
}
.hpradio-program-actions button{
width:100%!important;
}
}
/* v1.3.0 - modo rádio/TV estável: um clique, sem botão grande depois de tocar */
.hpradio-player.hpradio-is-playing .hpradio-play{
display:none!important;
}
.hpradio-player.hpradio-is-playing .hpradio-controls{
align-items:center!important;
}
.hpradio-controls input[type=range]{
cursor:pointer!important;
touch-action:pan-x!important;
}
/* YouTube fica oculto em modo rádio para não aparecer play no meio da tela */
.hpradio-youtube-holder,
.hpradio-model-bar .hpradio-youtube-holder,
.hpradio-model-clean .hpradio-youtube-holder{
position:absolute!important;
left:-99999px!important;
top:auto!important;
width:1px!important;
height:1px!important;
opacity:0!important;
pointer-events:none!important;
overflow:hidden!important;
margin:0!important;
border:0!important;
}
.hpradio-youtube-holder iframe{
width:1px!important;
height:1px!important;
}
/* v1.3.2 - botão mute ao lado do volume */
.hpradio-mute-btn{
width:42px!important;
height:42px!important;
min-width:42px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
border-radius:999px!important;
border:1px solid rgba(214,166,50,.28)!important;
background:#171d2a!important;
color:#fff!important;
cursor:pointer!important;
box-shadow:none!important;
padding:0!important;
}
.hpradio-mute-btn:hover{
border-color:rgba(245,210,120,.6)!important;
transform:translateY(-1px);
}
.hpradio-mute-btn span{
font-size:18px!important;
line-height:1!important;
}
.hpradio-mute-btn.is-muted{
background:rgba(255,90,90,.12)!important;
border-color:rgba(255,120,120,.4)!important;
}
.hpradio-player.hpradio-is-playing .hpradio-mute-btn{
display:inline-flex!important;
}
/* v1.3.3 - uso simples: play sempre visível para iniciar/pausar/continuar */
.hpradio-player.hpradio-is-playing .hpradio-play{
display:inline-flex!important;
}
.hpradio-play{
min-width:128px!important;
justify-content:center!important;
}
.hpradio-mute-btn[data-mute]{
display:inline-flex!important;
}
@media(max-width:520px){
.hpradio-controls{
gap:10px!important;
}
.hpradio-play{
width:auto!important;
flex:1 1 145px!important;
}
.hpradio-mute-btn{
flex:0 0 42px!important;
}
.hpradio-controls input[type=range]{
flex:1 1 110px!important;
min-width:100px!important;
}
}
/* v1.3.4 - player profissional com controle pequeno: play + volume + mute */
.hpradio-controls{
gap:10px!important;
}
.hpradio-play,
.hpradio-player.hpradio-is-playing .hpradio-play{
display:inline-flex!important;
width:42px!important;
height:42px!important;
min-width:42px!important;
flex:0 0 42px!important;
align-items:center!important;
justify-content:center!important;
padding:0!important;
border-radius:999px!important;
font-size:17px!important;
line-height:1!important;
letter-spacing:0!important;
}
.hpradio-mute-btn,
.hpradio-mute-btn[data-mute],
.hpradio-player.hpradio-is-playing .hpradio-mute-btn{
display:inline-flex!important;
width:42px!important;
height:42px!important;
min-width:42px!important;
flex:0 0 42px!important;
}
.hpradio-controls input[type=range]{
flex:0 1 160px!important;
max-width:180px!important;
min-width:95px!important;
}
.hpradio-muted .hpradio-mute-btn,
.hpradio-mute-btn.is-muted{
background:rgba(255,90,90,.16)!important;
border-color:rgba(255,120,120,.55)!important;
}
.hpradio-muted .hpradio-mute-btn span,
.hpradio-mute-btn.is-muted span{
filter:drop-shadow(0 0 8px rgba(255,130,130,.35));
}
.hpradio-model-compact .hpradio-controls,
.hpradio-model-bar .hpradio-controls{
gap:8px!important;
}
.hpradio-model-compact .hpradio-play,
.hpradio-model-compact .hpradio-mute-btn,
.hpradio-model-bar .hpradio-play,
.hpradio-model-bar .hpradio-mute-btn{
width:38px!important;
height:38px!important;
min-width:38px!important;
flex-basis:38px!important;
}
@media(max-width:520px){
.hpradio-controls{
flex-wrap:nowrap!important;
align-items:center!important;
}
.hpradio-play,
.hpradio-player.hpradio-is-playing .hpradio-play,
.hpradio-mute-btn,
.hpradio-mute-btn[data-mute]{
width:38px!important;
height:38px!important;
min-width:38px!important;
flex:0 0 38px!important;
}
.hpradio-controls input[type=range]{
flex:1 1 auto!important;
min-width:78px!important;
max-width:140px!important;
}
}
/* v1.3.6 - comerciais/vinhetas mais simples e player topo */
.hpradio-ad-toggle small,
.hpradio-ad-options small,
.hpradio-ads-form small{
display:block!important;
margin-top:4px!important;
color:#9fa9b8!important;
font-size:11px!important;
line-height:1.25!important;
letter-spacing:0!important;
font-weight:600!important;
}
.hpradio-ad-options-simple label{
align-items:flex-start!important;
flex-direction:column!important;
gap:6px!important;
}
.hpradio-ad-options-simple label input[type=checkbox]{
margin-right:8px!important;
}
.hpradio-ad-options-simple label:has(input[type=checkbox]){
display:grid!important;
grid-template-columns:24px 1fr!important;
}
.hpradio-ad-options-simple label:has(input[type=checkbox]) small{
grid-column:2!important;
margin-top:-4px!important;
}
.hpradio-ad-help{
margin:0 0 16px!important;
padding:13px 15px!important;
border-radius:16px!important;
border:1px solid rgba(90,180,255,.22)!important;
background:rgba(90,180,255,.07)!important;
color:#dbeafe!important;
line-height:1.45!important;
font-size:13px!important;
}
.hpradio-ad-help strong,
.hpradio-ad-help b{
color:#f5d278!important;
}
.hpradio-ads-form-pro{
grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.hpradio-ads-form-pro label{
min-width:0!important;
}
.hpradio-ads-form-pro select,
.hpradio-ads-form-pro input{
width:100%!important;
}
.hpradio-ads-form-pro .wide{
grid-column:span 4!important;
}
@media(max-width:950px){
.hpradio-ads-form-pro{grid-template-columns:1fr 1fr!important;}
.hpradio-ads-form-pro .wide{grid-column:span 2!important;}
}
@media(max-width:560px){
.hpradio-ads-form-pro{grid-template-columns:1fr!important;}
.hpradio-ads-form-pro .wide{grid-column:span 1!important;}
}
/* Play e mute prateados/brilhosos sem pegar a cor do tema */
.hpradio-play,
.hpradio-mute-btn,
.hpradio-mute-btn[data-mute]{
background:#d8dbe0!important;
background-image:none!important;
color:#18202a!important;
border:1px solid #b8bec8!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.9), inset 0 -5px 10px rgba(110,120,132,.35), 0 6px 18px rgba(0,0,0,.28)!important;
}
.hpradio-play:hover,
.hpradio-mute-btn:hover,
.hpradio-mute-btn[data-mute]:hover{filter:brightness(1.04);transform:translateY(-1px)}
.hpradio-play:active,
.hpradio-mute-btn:active,
.hpradio-mute-btn[data-mute]:active{transform:translateY(1px)}
.hpradio-muted .hpradio-mute-btn,
.hpradio-mute-btn.is-muted{color:#8c1b1b!important;border-color:#d5a0a0!important}
/* Modelo topo largura total sem logo */
.hpradio-model-topwide{
max-width:none!important;
width:100%!important;
margin:0!important;
border-radius:0!important;
border-left:0!important;
border-right:0!important;
grid-template-columns:minmax(0,1fr)!important;
padding:12px 18px!important;
}
.hpradio-model-topwide .hpradio-cover-wrap,
.hpradio-model-topwide .hpradio-brand img,
.hpradio-model-topwide .hpradio-msg,
.hpradio-model-topwide [data-slogan]{display:none!important;}
.hpradio-model-topwide .hpradio-brand{border:0!important;padding:0!important;}
.hpradio-model-topwide .hpradio-info{
display:grid!important;
grid-template-columns:minmax(190px,.8fr) minmax(0,1.2fr) auto!important;
gap:14px!important;
align-items:center!important;
}
.hpradio-model-topwide .hpradio-now span,
.hpradio-model-topwide .hpradio-now p{display:none!important;}
.hpradio-model-topwide .hpradio-now h3{margin:0!important;font-size:19px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.hpradio-model-topwide .hpradio-controls{margin:0!important;flex-wrap:nowrap!important;justify-content:flex-end!important;}
.hpradio-model-topwide .hpradio-play,
.hpradio-model-topwide .hpradio-mute-btn{width:42px!important;height:42px!important;min-width:42px!important;padding:0!important;font-size:18px!important;}
.hpradio-model-topwide .hpradio-controls input[type=range]{width:140px!important;max-width:160px!important;}
@media(max-width:900px){
.hpradio-model-topwide{border-radius:16px!important;margin:10px!important;padding:12px!important;}
.hpradio-model-topwide .hpradio-info{grid-template-columns:1fr!important;}
.hpradio-model-topwide .hpradio-controls{justify-content:flex-start!important;}
}
/* v1.3.7 - lista de comerciais mais limpa: somente Editar / Remover */
.hpradio-ad-list-row{
grid-template-columns:110px 1.2fr 150px 120px 150px!important;
min-height:64px!important;
padding:12px 14px!important;
}
.hpradio-ad-list-row small,
.hpradio-ad-list-row span{
font-size:12px!important;
color:#b8c0ce!important;
}
.hpradio-ad-list-row .hpradio-row-actions{
justify-content:flex-end!important;
flex-wrap:nowrap!important;
}
.hpradio-ad-list-row .hpradio-row-actions button{
min-width:auto!important;
padding:8px 12px!important;
font-size:12px!important;
border-radius:999px!important;
background:#171d2a!important;
color:#fff!important;
border:1px solid rgba(255,255,255,.13)!important;
}
.hpradio-ad-list-row .hpradio-row-actions [data-edit-ad]{
border-color:rgba(214,166,50,.45)!important;
color:#f5d278!important;
}
.hpradio-ad-list-row .hpradio-row-actions [data-remove-ad]{
color:#ffd0d0!important;
}
.hpradio-ad-list-row .hpradio-row-actions button::before{
content:""!important;
}
.hpradio-ad-form-actions{
display:flex!important;
gap:10px!important;
align-items:center!important;
}
.hpradio-ad-form-actions button{
width:auto!important;
min-width:180px!important;
}
.hpradio-ad-form-actions [data-cancel-edit-ad]{
background:#171d2a!important;
color:#fff!important;
border:1px solid rgba(255,255,255,.13)!important;
}
@media(max-width:900px){
.hpradio-ad-list-row{
grid-template-columns:1fr!important;
}
.hpradio-ad-list-row .hpradio-row-actions{
justify-content:flex-start!important;
}
}
/* v1.3.8 - dias de comerciais simplificados */
.hpradio-ads-form-pro select[data-ad-days]{min-height:42px!important;}
/* v1.4.1 - modelo Painel Rádio Azul Completo */
.hpradio-radiohero-social,
.hpradio-radiohero-clock{
display:none;
}
.hpradio-model-radiohero{
max-width:1180px!important;
width:100%!important;
min-height:360px!important;
margin:0 auto!important;
padding:26px 42px 38px!important;
grid-template-columns:1fr!important;
border-radius:8px!important;
border:6px solid #08246e!important;
background:
radial-gradient(circle at 52% 30%,rgba(255,255,255,.22),transparent 18%),
radial-gradient(circle at 26% 20%,rgba(255,255,255,.12),transparent 22%),
linear-gradient(90deg,#05065d 0%,#564fff 48%,#050058 100%)!important;
box-shadow:none!important;
overflow:hidden!important;
}
.hpradio-model-radiohero:before{
content:"";
position:absolute!important;
inset:0!important;
background:
radial-gradient(circle at 10% 80%,rgba(255,255,255,.9) 0 2px,transparent 3px),
radial-gradient(circle at 23% 16%,rgba(255,255,255,.75) 0 2px,transparent 3px),
radial-gradient(circle at 66% 18%,rgba(255,255,255,.75) 0 2px,transparent 3px),
radial-gradient(circle at 74% 70%,rgba(255,255,255,.75) 0 2px,transparent 3px),
linear-gradient(25deg,transparent 0 18%,rgba(255,255,255,.18) 18.3%,transparent 19% 100%),
linear-gradient(155deg,transparent 0 28%,rgba(255,255,255,.16) 28.3%,transparent 29% 100%);
opacity:.5!important;
pointer-events:none!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social{
display:flex!important;
position:absolute!important;
left:16px!important;
top:20px!important;
z-index:4!important;
flex-direction:column!important;
gap:9px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social a{
min-width:138px!important;
height:38px!important;
display:flex!important;
align-items:center!important;
padding:0 18px!important;
border-radius:999px!important;
background:#fff!important;
color:#fa2020!important;
font-size:13px!important;
text-decoration:none!important;
font-weight:800!important;
box-shadow:0 4px 14px rgba(0,0,0,.18)!important;
}
.hpradio-model-radiohero .hpradio-radiohero-clock{
display:flex!important;
align-items:center!important;
justify-content:center!important;
position:absolute!important;
right:16px!important;
top:20px!important;
z-index:4!important;
min-width:150px!important;
height:42px!important;
padding:0 18px!important;
border-radius:999px!important;
background:#fff!important;
color:#ff1616!important;
font-family:Consolas,monospace!important;
font-size:24px!important;
letter-spacing:1px!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap{
display:block!important;
width:132px!important;
height:132px!important;
min-height:132px!important;
border-radius:999px!important;
margin:0 auto 14px!important;
background:rgba(255,255,255,.24)!important;
border:5px solid rgba(255,255,255,.20)!important;
box-shadow:0 0 0 7px rgba(255,255,255,.10)!important;
z-index:3!important;
}
.hpradio-model-radiohero .hpradio-cover{
object-fit:contain!important;
padding:8px!important;
}
.hpradio-model-radiohero .hpradio-live-badge{
top:4px!important;
left:4px!important;
font-size:9px!important;
padding:5px 7px!important;
}
.hpradio-model-radiohero .hpradio-info{
z-index:3!important;
align-items:center!important;
text-align:center!important;
gap:10px!important;
}
.hpradio-model-radiohero .hpradio-brand{
border:0!important;
padding:0!important;
justify-content:center!important;
}
.hpradio-model-radiohero .hpradio-brand img{
display:none!important;
}
.hpradio-model-radiohero .hpradio-brand strong{
display:none!important;
}
.hpradio-model-radiohero .hpradio-brand span{
color:#fff!important;
font-size:15px!important;
letter-spacing:.16em!important;
text-transform:uppercase!important;
}
.hpradio-model-radiohero .hpradio-now span{
color:#fff!important;
font-size:10px!important;
letter-spacing:.16em!important;
margin-bottom:4px!important;
opacity:.88!important;
}
.hpradio-model-radiohero .hpradio-now h3{
color:#fff!important;
font-size:25px!important;
margin:0!important;
max-width:620px!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.hpradio-model-radiohero .hpradio-now p{
display:none!important;
}
.hpradio-model-radiohero .hpradio-controls{
width:min(560px,70%)!important;
margin:10px auto 0!important;
flex-wrap:nowrap!important;
justify-content:center!important;
gap:14px!important;
}
.hpradio-model-radiohero .hpradio-play{
order:2!important;
width:72px!important;
height:72px!important;
min-width:72px!important;
border-radius:999px!important;
font-size:0!important;
position:relative!important;
background:#f4f6fa!important;
color:#584dff!important;
border:6px solid rgba(255,255,255,.72)!important;
box-shadow:0 0 0 8px rgba(255,255,255,.15), inset 0 -8px 18px rgba(80,90,140,.18)!important;
}
.hpradio-model-radiohero .hpradio-play:before{
content:"▶";
font-size:28px!important;
color:#584dff!important;
margin-left:4px!important;
}
.hpradio-model-radiohero.hpradio-is-playing .hpradio-play:before{
content:"⏸";
margin-left:0!important;
font-size:25px!important;
}
.hpradio-model-radiohero .hpradio-controls input[type=range]{
order:1!important;
flex:1 1 auto!important;
max-width:100%!important;
min-width:200px!important;
accent-color:#fff!important;
}
.hpradio-model-radiohero .hpradio-mute-btn{
order:3!important;
width:48px!important;
height:48px!important;
min-width:48px!important;
background:rgba(255,255,255,.16)!important;
color:#fff!important;
border:1px solid rgba(255,255,255,.35)!important;
box-shadow:none!important;
}
.hpradio-model-radiohero .hpradio-controls span[data-listeners]{
order:4!important;
color:#fff!important;
white-space:nowrap!important;
}
.hpradio-model-radiohero .hpradio-msg{
position:absolute!important;
left:0!important;
right:0!important;
bottom:0!important;
border:0!important;
border-radius:0!important;
background:rgba(105,0,80,.82)!important;
color:#fff!important;
padding:8px 20px!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
@media(max-width:720px){
.hpradio-model-radiohero{
min-height:auto!important;
padding:22px 14px 46px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social{
position:relative!important;
left:auto!important;
top:auto!important;
flex-direction:row!important;
flex-wrap:wrap!important;
justify-content:center!important;
margin-bottom:14px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social a{
min-width:auto!important;
height:32px!important;
padding:0 12px!important;
font-size:11px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-clock{
position:relative!important;
right:auto!important;
top:auto!important;
margin:0 auto 12px!important;
height:36px!important;
font-size:18px!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap{
width:105px!important;
height:105px!important;
min-height:105px!important;
}
.hpradio-model-radiohero .hpradio-controls{
width:100%!important;
gap:9px!important;
}
.hpradio-model-radiohero .hpradio-controls input[type=range]{
min-width:110px!important;
}
.hpradio-model-radiohero .hpradio-play{
width:58px!important;
height:58px!important;
min-width:58px!important;
}
}
/* v1.4.2 - site de rádio com cor de fundo personalizável */
.hpradio-model-radiohero{
border-color:color-mix(in srgb,var(--hpradio-primary) 35%, #08246e)!important;
background:
radial-gradient(circle at 50% 30%,rgba(255,255,255,.18),transparent 20%),
radial-gradient(circle at 26% 20%,rgba(255,255,255,.10),transparent 22%),
linear-gradient(90deg,
color-mix(in srgb,var(--hpradio-primary) 20%, #050822) 0%,
color-mix(in srgb,var(--hpradio-primary) 72%, #2a2f88) 50%,
color-mix(in srgb,var(--hpradio-primary) 24%, #02061c) 100%)!important;
}
.hpradio-model-radiohero .hpradio-play{
background:#d8dbe0!important;
background-image:none!important;
color:#1a2230!important;
border:1px solid #b8bec8!important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 -5px 10px rgba(110,120,132,.35), 0 6px 18px rgba(0,0,0,.28)!important;
}
.hpradio-model-radiohero .hpradio-play:before{ color:#1b2130!important; }
.hpradio-model-radiohero .hpradio-controls{align-items:center!important;}
.hpradio-model-radiohero .hpradio-cover-wrap{ box-shadow:0 0 0 7px rgba(255,255,255,.10), 0 10px 30px rgba(0,0,0,.18)!important; }
/* v1.4.3 - 3 novos modelos de player com cor personalizável */
.hpradio-model-button3d,
.hpradio-model-glossywide,
.hpradio-model-neoncenter{
--hp-accent:var(--hpradio-primary,#d6a632);
}
/* 1) Botão redondo 3D - estilo botão antigo de rádio */
.hpradio-model-button3d{
max-width:520px!important;
grid-template-columns:1fr!important;
padding:30px 24px!important;
border-radius:34px!important;
text-align:center!important;
background:linear-gradient(180deg,#101722,#05070c)!important;
border:1px solid color-mix(in srgb,var(--hp-accent) 55%, transparent)!important;
box-shadow:0 26px 70px rgba(0,0,0,.38)!important;
}
.hpradio-model-button3d .hpradio-cover-wrap{display:none!important;}
.hpradio-model-button3d .hpradio-info{align-items:center!important;text-align:center!important;gap:13px!important;}
.hpradio-model-button3d .hpradio-brand{border:0!important;padding:0!important;justify-content:center!important;}
.hpradio-model-button3d .hpradio-brand img{max-width:150px!important;width:150px!important;max-height:70px!important;display:block!important;}
.hpradio-model-button3d .hpradio-brand strong{font-size:17px!important;}
.hpradio-model-button3d .hpradio-brand span{display:none!important;}
.hpradio-model-button3d .hpradio-now span{color:var(--hp-accent)!important;}
.hpradio-model-button3d .hpradio-now h3{font-size:24px!important;}
.hpradio-model-button3d .hpradio-controls{justify-content:center!important;margin-top:8px!important;gap:14px!important;}
.hpradio-model-button3d .hpradio-play{
width:92px!important;height:92px!important;min-width:92px!important;border-radius:999px!important;
font-size:0!important;padding:0!important;position:relative!important;order:1!important;
background:
radial-gradient(circle at 50% 38%,rgba(255,255,255,.96) 0 27%,transparent 28%),
linear-gradient(180deg,color-mix(in srgb,#fff 42%,var(--hp-accent)) 0%,var(--hp-accent) 46%,color-mix(in srgb,#000 36%,var(--hp-accent)) 100%)!important;
border:3px solid color-mix(in srgb,#fff 38%,var(--hp-accent))!important;
box-shadow:inset 0 10px 16px rgba(255,255,255,.42), inset 0 -12px 20px rgba(0,0,0,.25), 0 15px 26px rgba(0,0,0,.34)!important;
}
.hpradio-model-button3d .hpradio-play:before{content:"▶";font-size:32px!important;color:color-mix(in srgb,#000 28%,var(--hp-accent))!important;position:absolute;left:35px;top:27px;}
.hpradio-model-button3d.hpradio-is-playing .hpradio-play:before{content:"⏸";left:31px;top:28px;font-size:30px!important;}
.hpradio-model-button3d .hpradio-controls input[type=range]{order:2;flex:1 1 190px!important;max-width:220px!important;accent-color:var(--hp-accent)!important;}
.hpradio-model-button3d .hpradio-mute-btn{order:3;}
.hpradio-model-button3d .hpradio-controls span[data-listeners]{order:4;width:100%;}
/* 2) Botão retangular brilhante - inspirado no play grande glossy */
.hpradio-model-glossywide{
max-width:940px!important;
grid-template-columns:1fr!important;
padding:22px 26px!important;
border-radius:28px!important;
background:linear-gradient(180deg,#090d14,#030506)!important;
border:1px solid color-mix(in srgb,var(--hp-accent) 45%, transparent)!important;
}
.hpradio-model-glossywide .hpradio-cover-wrap{display:none!important;}
.hpradio-model-glossywide .hpradio-info{align-items:center!important;text-align:center!important;}
.hpradio-model-glossywide .hpradio-brand{border:0!important;justify-content:center!important;padding:0!important;}
.hpradio-model-glossywide .hpradio-brand img{display:none!important;}
.hpradio-model-glossywide .hpradio-now h3{font-size:28px!important;}
.hpradio-model-glossywide .hpradio-play{
width:185px!important;height:110px!important;min-width:185px!important;border-radius:32px!important;
font-size:0!important;padding:0!important;position:relative!important;
background:
linear-gradient(160deg,rgba(255,255,255,.72) 0%,rgba(255,255,255,.18) 35%,transparent 36%),
linear-gradient(180deg,color-mix(in srgb,#fff 26%,var(--hp-accent)) 0%,var(--hp-accent) 48%,color-mix(in srgb,#000 38%,var(--hp-accent)) 100%)!important;
border:2px solid color-mix(in srgb,#000 25%,var(--hp-accent))!important;
box-shadow:inset 0 9px 20px rgba(255,255,255,.34), inset 0 -14px 28px rgba(0,0,0,.30), 0 14px 28px rgba(0,0,0,.34)!important;
}
.hpradio-model-glossywide .hpradio-play:before{content:"▶";font-size:56px!important;color:#fff!important;text-shadow:0 2px 6px rgba(0,0,0,.28);position:absolute;left:72px;top:23px;}
.hpradio-model-glossywide.hpradio-is-playing .hpradio-play:before{content:"⏸";font-size:45px!important;left:68px;top:30px;}
.hpradio-model-glossywide .hpradio-controls{width:min(760px,100%)!important;justify-content:center!important;gap:16px!important;}
.hpradio-model-glossywide .hpradio-controls input[type=range]{flex:1 1 320px!important;max-width:520px!important;accent-color:var(--hp-accent)!important;}
/* 3) Neon central moderno - estilo palco/radio ao vivo */
.hpradio-model-neoncenter{
max-width:980px!important;
grid-template-columns:1fr!important;
padding:28px 34px!important;
border-radius:0!important;
text-align:center!important;
background:
radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--hp-accent) 22%, transparent),transparent 38%),
linear-gradient(180deg,#020204,#101010)!important;
border:0!important;
box-shadow:0 0 0 1px rgba(255,255,255,.06),0 0 48px color-mix(in srgb,var(--hp-accent) 22%, transparent)!important;
}
.hpradio-model-neoncenter .hpradio-cover-wrap{display:none!important;}
.hpradio-model-neoncenter .hpradio-info{align-items:center!important;text-align:center!important;}
.hpradio-model-neoncenter .hpradio-brand{border:0!important;padding:0!important;justify-content:center!important;}
.hpradio-model-neoncenter .hpradio-brand img{display:none!important;}
.hpradio-model-neoncenter .hpradio-brand strong{font-size:30px!important;letter-spacing:.35em!important;color:var(--hp-accent)!important;text-transform:uppercase!important;text-shadow:0 0 18px color-mix(in srgb,var(--hp-accent) 50%, transparent)!important;}
.hpradio-model-neoncenter .hpradio-brand span{display:none!important;}
.hpradio-model-neoncenter .hpradio-now span{display:none!important;}
.hpradio-model-neoncenter .hpradio-now h3{font-size:20px!important;font-weight:500!important;color:#fff!important;letter-spacing:.12em!important;}
.hpradio-model-neoncenter .hpradio-now p{font-size:11px!important;color:#bfc5d0!important;letter-spacing:.12em!important;text-transform:uppercase!important;}
.hpradio-model-neoncenter .hpradio-play{
width:106px!important;height:106px!important;min-width:106px!important;border-radius:24px!important;
font-size:0!important;padding:0!important;position:relative!important;order:1!important;
background:linear-gradient(135deg,color-mix(in srgb,#fff 34%,var(--hp-accent)),var(--hp-accent) 55%,color-mix(in srgb,#000 30%,var(--hp-accent)))!important;
border:0!important;
box-shadow:0 0 30px color-mix(in srgb,var(--hp-accent) 58%, transparent), inset 0 12px 18px rgba(255,255,255,.27), inset 0 -14px 22px rgba(0,0,0,.25)!important;
}
.hpradio-model-neoncenter .hpradio-play:before{content:"▶";font-size:48px!important;color:#fff!important;position:absolute;left:39px;top:26px;text-shadow:0 2px 10px rgba(0,0,0,.35)!important;}
.hpradio-model-neoncenter.hpradio-is-playing .hpradio-play:before{content:"⏸";font-size:42px!important;left:35px;top:31px;}
.hpradio-model-neoncenter .hpradio-controls{width:100%!important;justify-content:center!important;gap:16px!important;}
.hpradio-model-neoncenter .hpradio-controls input[type=range]{order:2;flex:1 1 500px!important;max-width:700px!important;accent-color:var(--hp-accent)!important;}
.hpradio-model-neoncenter .hpradio-mute-btn{order:3;background:rgba(255,255,255,.09)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important;}
.hpradio-model-neoncenter .hpradio-msg{display:none!important;}
@media(max-width:640px){
.hpradio-model-glossywide .hpradio-play{width:135px!important;height:82px!important;min-width:135px!important;border-radius:24px!important;}
.hpradio-model-glossywide .hpradio-play:before{font-size:40px!important;left:53px;top:19px;}
.hpradio-model-glossywide.hpradio-is-playing .hpradio-play:before{font-size:34px!important;left:49px;top:22px;}
.hpradio-model-neoncenter .hpradio-brand strong{font-size:20px!important;letter-spacing:.18em!important;}
.hpradio-model-button3d .hpradio-controls,
.hpradio-model-glossywide .hpradio-controls,
.hpradio-model-neoncenter .hpradio-controls{flex-wrap:wrap!important;}
}
/* v1.4.4 - rádio hero mais vivo e profissional */
@keyframes hpradioHeroFloat {
0% { transform: translate3d(0,0,0) scale(1); }
50% { transform: translate3d(10px,-8px,0) scale(1.02); }
100% { transform: translate3d(0,0,0) scale(1); }
}
@keyframes hpradioHeroShimmer {
0% { background-position: 0% 50%, 0 0, 0 0; }
50% { background-position: 100% 50%, 18px -14px, -10px 8px; }
100% { background-position: 0% 50%, 0 0, 0 0; }
}
.hpradio-model-radiohero{
position:relative!important;
border:3px solid color-mix(in srgb, var(--hpradio-primary) 55%, #59256d)!important;
border-radius:10px!important;
background:
radial-gradient(circle at 50% 26%, rgba(255,255,255,.20), transparent 16%),
linear-gradient(90deg,
color-mix(in srgb,var(--hpradio-primary) 55%, #420014) 0%,
color-mix(in srgb,var(--hpradio-primary) 88%, #aa1034) 48%,
color-mix(in srgb,var(--hpradio-primary) 50%, #3c0024) 100%)!important;
overflow:hidden!important;
}
.hpradio-model-radiohero:before{
animation:hpradioHeroShimmer 18s ease-in-out infinite!important;
opacity:.62!important;
}
.hpradio-model-radiohero:after{
content:"";
position:absolute!important;
inset:-10% -5% auto -5%!important;
height:130%!important;
background:
radial-gradient(circle at 18% 26%, rgba(255,255,255,.16) 0 2px, transparent 3px),
radial-gradient(circle at 83% 31%, rgba(255,255,255,.12) 0 2px, transparent 3px),
radial-gradient(circle at 70% 72%, rgba(255,255,255,.12) 0 2px, transparent 3px),
radial-gradient(circle at 30% 70%, rgba(255,255,255,.10) 0 2px, transparent 3px),
linear-gradient(120deg, transparent 0 18%, rgba(255,255,255,.14) 18.2%, transparent 19% 100%),
linear-gradient(35deg, transparent 0 40%, rgba(255,255,255,.10) 40.2%, transparent 41% 100%);
pointer-events:none!important;
animation:hpradioHeroFloat 14s ease-in-out infinite!important;
opacity:.55!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap{
width:128px!important;
height:128px!important;
background:rgba(255,255,255,.16)!important;
border:4px solid rgba(255,255,255,.18)!important;
box-shadow:0 0 0 8px rgba(255,255,255,.08), 0 18px 34px rgba(0,0,0,.22)!important;
}
.hpradio-model-radiohero .hpradio-cover{
object-fit:cover!important;
border-radius:999px!important;
}
.hpradio-model-radiohero .hpradio-info,
.hpradio-model-radiohero .hpradio-cover-wrap,
.hpradio-model-radiohero .hpradio-radiohero-social,
.hpradio-model-radiohero .hpradio-radiohero-clock{
position:relative!important;
z-index:3!important;
}
.hpradio-model-radiohero .hpradio-brand strong,
.hpradio-model-radiohero .hpradio-brand span,
.hpradio-model-radiohero .hpradio-now span,
.hpradio-model-radiohero .hpradio-now h3,
.hpradio-model-radiohero .hpradio-controls span[data-listeners]{
text-shadow:0 2px 8px rgba(0,0,0,.22)!important;
}
.hpradio-model-radiohero .hpradio-controls{
width:min(720px,84%)!important;
margin:12px auto 0!important;
gap:16px!important;
flex-wrap:nowrap!important;
}
.hpradio-model-radiohero .hpradio-play{
order:2!important;
width:70px!important;
height:70px!important;
min-width:70px!important;
border-radius:999px!important;
font-size:0!important;
position:relative!important;
background:linear-gradient(180deg,#f8fbff 0%, #dadfe7 52%, #bcc5d2 100%)!important;
border:1px solid rgba(255,255,255,.75)!important;
box-shadow:
inset 0 2px 0 rgba(255,255,255,.96),
inset 0 -10px 16px rgba(120,130,145,.28),
0 8px 24px rgba(0,0,0,.28),
0 0 0 6px rgba(255,255,255,.09)!important;
}
.hpradio-model-radiohero .hpradio-play:before{
content:"▶";
font-size:27px!important;
color:#c1272d!important;
margin-left:4px!important;
text-shadow:0 1px 0 rgba(255,255,255,.35)!important;
}
.hpradio-model-radiohero.hpradio-is-playing .hpradio-play:before{
content:"⏸";
margin-left:0!important;
font-size:25px!important;
color:#6a2147!important;
}
.hpradio-model-radiohero .hpradio-play:hover{
transform:translateY(-1px) scale(1.02)!important;
}
.hpradio-model-radiohero .hpradio-controls input[type=range]{
order:1!important;
flex:1 1 auto!important;
min-width:230px!important;
accent-color:#f29cff!important;
filter:drop-shadow(0 2px 8px rgba(0,0,0,.25));
}
.hpradio-model-radiohero .hpradio-mute-btn{
order:3!important;
width:46px!important;
height:46px!important;
min-width:46px!important;
border-radius:999px!important;
background:rgba(255,255,255,.18)!important;
border:1px solid rgba(255,255,255,.34)!important;
color:#fff!important;
box-shadow:0 6px 16px rgba(0,0,0,.18)!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social a{
background:rgba(255,255,255,.96)!important;
color:#d7111c!important;
border:1px solid rgba(255,255,255,.85)!important;
box-shadow:0 6px 18px rgba(0,0,0,.18)!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social a:hover{
transform:translateX(2px)!important;
}
.hpradio-model-radiohero .hpradio-radiohero-clock{
box-shadow:0 6px 18px rgba(0,0,0,.15)!important;
}
.hpradio-model-radiohero .hpradio-msg{
display:none!important;
}
.hpradio-panel label small{
display:block!important;
color:#9aa5c8!important;
margin-top:4px!important;
font-size:12px!important;
line-height:1.35!important;
}
@media(max-width:720px){
.hpradio-model-radiohero .hpradio-controls{
width:100%!important;
gap:10px!important;
}
.hpradio-model-radiohero .hpradio-controls input[type=range]{
min-width:110px!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap{
width:108px!important;
height:108px!important;
}
}
/* v1.4.5 - players bonitos e sem defeitos visuais */
.hpradio-model-button3d .hpradio-msg,
.hpradio-model-glossywide .hpradio-msg,
.hpradio-model-neoncenter .hpradio-msg,
.hpradio-model-radiohero .hpradio-msg{
display:none!important;
}
.hpradio-model-button3d .hpradio-play,
.hpradio-model-glossywide .hpradio-play,
.hpradio-model-neoncenter .hpradio-play,
.hpradio-model-radiohero .hpradio-play{
text-indent:-9999px!important;
overflow:hidden!important;
white-space:nowrap!important;
line-height:1!important;
}
.hpradio-model-button3d .hpradio-mute-btn,
.hpradio-model-glossywide .hpradio-mute-btn,
.hpradio-model-neoncenter .hpradio-mute-btn,
.hpradio-model-radiohero .hpradio-mute-btn{
font-size:0!important;
}
.hpradio-model-button3d .hpradio-mute-btn [data-mute-icon],
.hpradio-model-glossywide .hpradio-mute-btn [data-mute-icon],
.hpradio-model-neoncenter .hpradio-mute-btn [data-mute-icon],
.hpradio-model-radiohero .hpradio-mute-btn [data-mute-icon]{
font-size:18px!important;
}
.hpradio-model-button3d,
.hpradio-model-glossywide,
.hpradio-model-neoncenter{
background:linear-gradient(180deg,#07101a,#03070d)!important;
border:1px solid color-mix(in srgb,var(--hp-accent) 50%, rgba(255,255,255,.12))!important;
box-shadow:0 18px 50px rgba(0,0,0,.34)!important;
}
.hpradio-model-button3d .hpradio-brand,
.hpradio-model-glossywide .hpradio-brand,
.hpradio-model-neoncenter .hpradio-brand{
margin-bottom:6px!important;
}
.hpradio-model-button3d .hpradio-now,
.hpradio-model-glossywide .hpradio-now,
.hpradio-model-neoncenter .hpradio-now{
margin-bottom:6px!important;
}
.hpradio-model-button3d .hpradio-now p,
.hpradio-model-glossywide .hpradio-now p,
.hpradio-model-neoncenter .hpradio-now p{
margin-top:4px!important;
opacity:.85!important;
}
.hpradio-model-button3d .hpradio-controls,
.hpradio-model-glossywide .hpradio-controls,
.hpradio-model-neoncenter .hpradio-controls{
align-items:center!important;
justify-content:center!important;
flex-wrap:nowrap!important;
gap:16px!important;
margin-top:14px!important;
}
.hpradio-model-button3d .hpradio-controls span[data-listeners],
.hpradio-model-glossywide .hpradio-controls span[data-listeners],
.hpradio-model-neoncenter .hpradio-controls span[data-listeners]{
order:4!important;
width:auto!important;
min-width:72px!important;
text-align:left!important;
font-size:13px!important;
color:#f2f5fb!important;
}
.hpradio-model-button3d .hpradio-controls input[type=range],
.hpradio-model-glossywide .hpradio-controls input[type=range],
.hpradio-model-neoncenter .hpradio-controls input[type=range]{
order:2!important;
flex:1 1 auto!important;
max-width:390px!important;
min-width:150px!important;
}
.hpradio-model-button3d .hpradio-mute-btn,
.hpradio-model-glossywide .hpradio-mute-btn,
.hpradio-model-neoncenter .hpradio-mute-btn{
order:3!important;
width:44px!important;
height:44px!important;
min-width:44px!important;
border-radius:999px!important;
background:linear-gradient(180deg,#f6f7fb,#d8dce4)!important;
color:#9d1226!important;
border:1px solid rgba(255,255,255,.8)!important;
box-shadow:inset 0 2px 0 rgba(255,255,255,.95),0 6px 16px rgba(0,0,0,.24)!important;
}
.hpradio-model-button3d .hpradio-play{
width:84px!important;height:84px!important;min-width:84px!important;
}
.hpradio-model-button3d .hpradio-play:before{
left:31px!important;top:24px!important;font-size:30px!important;color:#fff!important;
}
.hpradio-model-button3d.hpradio-is-playing .hpradio-play:before{
left:29px!important;top:24px!important;font-size:28px!important;
}
.hpradio-model-glossywide{max-width:860px!important;padding:26px 32px!important;border-radius:24px!important;}
.hpradio-model-glossywide .hpradio-info{gap:8px!important;}
.hpradio-model-glossywide .hpradio-brand strong{font-size:28px!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:var(--hp-accent)!important;}
.hpradio-model-glossywide .hpradio-brand span{display:none!important;}
.hpradio-model-glossywide .hpradio-now span{display:none!important;}
.hpradio-model-glossywide .hpradio-now h3{font-size:26px!important;}
.hpradio-model-glossywide .hpradio-play{width:154px!important;height:90px!important;min-width:154px!important;border-radius:24px!important;}
.hpradio-model-glossywide .hpradio-play:before{left:58px!important;top:19px!important;font-size:46px!important;}
.hpradio-model-glossywide.hpradio-is-playing .hpradio-play:before{left:55px!important;top:22px!important;font-size:38px!important;}
.hpradio-model-neoncenter{max-width:920px!important;padding:30px 34px!important;border-radius:18px!important;}
.hpradio-model-neoncenter .hpradio-brand strong{font-size:28px!important;letter-spacing:.18em!important;}
.hpradio-model-neoncenter .hpradio-now h3{font-size:24px!important;}
.hpradio-model-neoncenter .hpradio-play{width:92px!important;height:92px!important;min-width:92px!important;border-radius:18px!important;}
.hpradio-model-neoncenter .hpradio-play:before{left:34px!important;top:21px!important;font-size:41px!important;}
.hpradio-model-neoncenter.hpradio-is-playing .hpradio-play:before{left:32px!important;top:25px!important;font-size:34px!important;}
@media(max-width:640px){
.hpradio-model-button3d .hpradio-controls,
.hpradio-model-glossywide .hpradio-controls,
.hpradio-model-neoncenter .hpradio-controls{flex-wrap:wrap!important;}
.hpradio-model-button3d .hpradio-controls span[data-listeners],
.hpradio-model-glossywide .hpradio-controls span[data-listeners],
.hpradio-model-neoncenter .hpradio-controls span[data-listeners]{width:100%!important;text-align:center!important;}
}
/* v1.4.6 - radio hero no estilo site de rádio */
@keyframes hpradioTickerMove{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.hpradio-model-radiohero{
position:relative!important;
max-width:1180px!important;
min-height:370px!important;
padding:22px 38px 56px!important;
border:4px solid color-mix(in srgb,var(--hpradio-primary) 35%, #0a2d7a)!important;
border-radius:8px!important;
background:
radial-gradient(circle at 50% 24%,rgba(255,255,255,.18),transparent 18%),
radial-gradient(circle at 16% 68%,rgba(255,255,255,.08),transparent 16%),
linear-gradient(90deg,
color-mix(in srgb,var(--hpradio-primary) 20%, #04145a) 0%,
color-mix(in srgb,var(--hpradio-primary) 55%, #5463ff) 48%,
color-mix(in srgb,var(--hpradio-primary) 18%, #06004b) 100%)!important;
overflow:hidden!important;
}
.hpradio-model-radiohero .hpradio-info,
.hpradio-model-radiohero .hpradio-cover-wrap,
.hpradio-model-radiohero .hpradio-radiohero-social,
.hpradio-model-radiohero .hpradio-radiohero-clock,
.hpradio-model-radiohero .hpradio-radiohero-ticker{position:relative!important;z-index:3!important;}
.hpradio-model-radiohero .hpradio-radiohero-social{
display:flex!important;position:absolute!important;left:14px!important;top:12px!important;flex-direction:column!important;gap:8px!important;align-items:flex-start!important;width:auto!important;max-width:150px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social a{
width:92px!important;min-width:92px!important;max-width:92px!important;height:30px!important;padding:0 10px!important;border-radius:999px!important;
display:flex!important;align-items:center!important;justify-content:flex-start!important;background:#fff!important;color:#e21818!important;
font-size:12px!important;font-weight:700!important;letter-spacing:.02em!important;text-decoration:none!important;box-shadow:0 4px 12px rgba(0,0,0,.16)!important;
}
.hpradio-model-radiohero .hpradio-radiohero-clock{
display:flex!important;position:absolute!important;right:14px!important;top:12px!important;min-width:126px!important;height:34px!important;padding:0 16px!important;
align-items:center!important;justify-content:center!important;border-radius:999px!important;background:#fff!important;color:#f21414!important;
font:700 16px/1 Consolas,monospace!important;letter-spacing:1px!important;box-shadow:0 4px 12px rgba(0,0,0,.14)!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap{
width:116px!important;height:116px!important;margin:4px auto 10px!important;border-radius:999px!important;background:rgba(255,255,255,.16)!important;border:4px solid rgba(255,255,255,.25)!important;
box-shadow:0 0 0 6px rgba(255,255,255,.09),0 12px 28px rgba(0,0,0,.18)!important;
}
.hpradio-model-radiohero .hpradio-cover{object-fit:contain!important;padding:8px!important;border-radius:999px!important;}
.hpradio-model-radiohero .hpradio-live-badge{display:none!important;}
.hpradio-model-radiohero .hpradio-brand{display:none!important;}
.hpradio-model-radiohero .hpradio-now span{display:none!important;}
.hpradio-model-radiohero .hpradio-now h3{
color:#fff!important;font-size:34px!important;letter-spacing:.03em!important;margin:0!important;text-shadow:0 2px 8px rgba(0,0,0,.18)!important;
}
.hpradio-model-radiohero .hpradio-now p{
display:block!important;color:#eef2ff!important;font-size:22px!important;letter-spacing:.08em!important;text-transform:uppercase!important;margin-top:6px!important;
}
.hpradio-model-radiohero .hpradio-controls{
width:min(560px,68%)!important;margin:12px auto 0!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:14px!important;flex-wrap:nowrap!important;
}
.hpradio-model-radiohero .hpradio-controls input[type=range]{order:1!important;flex:1 1 auto!important;min-width:220px!important;accent-color:#ffffff!important;filter:drop-shadow(0 2px 6px rgba(0,0,0,.18));}
.hpradio-model-radiohero .hpradio-play{
order:2!important;width:64px!important;height:64px!important;min-width:64px!important;border-radius:999px!important;position:relative!important;background:linear-gradient(180deg,#f5f7fb,#dfe3ea)!important;
border:2px solid rgba(255,255,255,.88)!important;box-shadow:inset 0 2px 0 rgba(255,255,255,.96),inset 0 -8px 12px rgba(100,115,133,.22),0 6px 18px rgba(0,0,0,.22)!important;
}
.hpradio-model-radiohero .hpradio-play:before,
.hpradio-model-radiohero.hpradio-is-playing .hpradio-play:before{content:"▶"!important;position:absolute!important;left:23px!important;top:17px!important;font-size:25px!important;color:#6d4dff!important;text-shadow:none!important;margin:0!important;}
.hpradio-model-radiohero .hpradio-mute-btn{
order:3!important;width:38px!important;height:38px!important;min-width:38px!important;border-radius:999px!important;background:rgba(255,255,255,.18)!important;color:#fff!important;border:1px solid rgba(255,255,255,.35)!important;box-shadow:0 4px 12px rgba(0,0,0,.15)!important;font-size:0!important;
}
.hpradio-model-radiohero .hpradio-mute-btn [data-mute-icon]{font-size:16px!important;}
.hpradio-model-radiohero .hpradio-controls span[data-listeners]{display:none!important;}
.hpradio-model-radiohero .hpradio-radiohero-ticker{
position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:30px!important;background:rgba(122,0,34,.82)!important;border-top:2px solid rgba(255,255,255,.18)!important;overflow:hidden!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker span{
display:inline-block!important;white-space:nowrap!important;color:#fff!important;font-size:14px!important;font-style:italic!important;line-height:30px!important;padding-left:100%!important;
animation:hpradioTickerMove 24s linear infinite!important;
}
.hpradio-model-radiohero .hpradio-msg{display:none!important;}
@media(max-width:860px){
.hpradio-model-radiohero{padding:18px 16px 48px!important;min-height:340px!important;}
.hpradio-model-radiohero .hpradio-radiohero-social{left:10px!important;top:10px!important;gap:6px!important;}
.hpradio-model-radiohero .hpradio-radiohero-social a{width:86px!important;min-width:86px!important;height:28px!important;font-size:11px!important;}
.hpradio-model-radiohero .hpradio-radiohero-clock{right:10px!important;top:10px!important;min-width:112px!important;height:32px!important;font-size:14px!important;}
.hpradio-model-radiohero .hpradio-now h3{font-size:26px!important;}
.hpradio-model-radiohero .hpradio-now p{font-size:16px!important;}
.hpradio-model-radiohero .hpradio-controls{width:min(500px,86%)!important;}
}
@media(max-width:640px){
.hpradio-model-radiohero .hpradio-radiohero-social{position:relative!important;left:auto!important;top:auto!important;flex-direction:row!important;flex-wrap:wrap!important;justify-content:center!important;max-width:none!important;margin-bottom:10px!important;}
.hpradio-model-radiohero .hpradio-radiohero-clock{position:relative!important;right:auto!important;top:auto!important;margin:0 auto 10px!important;}
.hpradio-model-radiohero .hpradio-controls{width:100%!important;gap:10px!important;}
.hpradio-model-radiohero .hpradio-controls input[type=range]{min-width:120px!important;}
}
/* v1.4.7 - refinamento dos ícones dos botões play */
.hpradio-model-button3d .hpradio-play,
.hpradio-model-glossywide .hpradio-play,
.hpradio-model-neoncenter .hpradio-play,
.hpradio-model-radiohero .hpradio-play{
--hp-play-icon-size: 30px;
}
.hpradio-model-button3d .hpradio-play:before,
.hpradio-model-glossywide .hpradio-play:before,
.hpradio-model-neoncenter .hpradio-play:before,
.hpradio-model-radiohero .hpradio-play:before{
content:none!important;
}
.hpradio-model-button3d .hpradio-play:after,
.hpradio-model-glossywide .hpradio-play:after,
.hpradio-model-neoncenter .hpradio-play:after,
.hpradio-model-radiohero .hpradio-play:after{
content:""!important;
position:absolute!important;
left:50%!important;
top:50%!important;
width:var(--hp-play-icon-size)!important;
height:var(--hp-play-icon-size)!important;
transform:translate(-50%,-50%)!important;
background-repeat:no-repeat!important;
background-position:center center!important;
background-size:contain!important;
filter:drop-shadow(0 1px 2px rgba(0,0,0,.18));
}
.hpradio-model-button3d .hpradio-play{--hp-play-icon-size:30px;}
.hpradio-model-glossywide .hpradio-play{--hp-play-icon-size:42px;}
.hpradio-model-neoncenter .hpradio-play{--hp-play-icon-size:36px;}
.hpradio-model-radiohero .hpradio-play{--hp-play-icon-size:28px;}
.hpradio-model-button3d .hpradio-play[data-state="play"]:after,
.hpradio-model-glossywide .hpradio-play[data-state="play"]:after,
.hpradio-model-neoncenter .hpradio-play[data-state="play"]:after,
.hpradio-model-radiohero .hpradio-play[data-state="play"]:after{
background-image:url("data:image/svg+xml;utf8,")!important;
}
.hpradio-model-button3d .hpradio-play[data-state="pause"]:after,
.hpradio-model-glossywide .hpradio-play[data-state="pause"]:after,
.hpradio-model-neoncenter .hpradio-play[data-state="pause"]:after{
background-image:url("data:image/svg+xml;utf8,")!important;
}
.hpradio-model-button3d .hpradio-play[data-state="pause"]:after,
.hpradio-model-glossywide .hpradio-play[data-state="pause"]:after,
.hpradio-model-neoncenter .hpradio-play[data-state="pause"]:after{
width:calc(var(--hp-play-icon-size) - 2px)!important;
height:calc(var(--hp-play-icon-size) - 2px)!important;
}
/* v1.4.8 - ajustes finais do site de rádio */
.hpradio-model-radiohero{
background:
radial-gradient(circle at 50% 24%, rgba(255,255,255,.14), transparent 20%),
linear-gradient(90deg,
color-mix(in srgb, var(--hpradio-primary) 82%, #120017) 0%,
var(--hpradio-primary) 50%,
color-mix(in srgb, var(--hpradio-primary) 82%, #0b0015) 100%)!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social a{
font-size:11px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker{
background:rgba(110,0,26,.88)!important;
}
.hpradio-model-radiohero.hpradio-bg-static:before,
.hpradio-model-radiohero.hpradio-bg-static:after{
animation:none!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:before{
content:"";
position:absolute!important;
inset:0!important;
background:
linear-gradient(120deg, transparent 0 18%, rgba(255,255,255,.12) 18.2%, transparent 19% 100%),
linear-gradient(35deg, transparent 0 40%, rgba(255,255,255,.09) 40.2%, transparent 41% 100%),
radial-gradient(circle at 20% 24%, rgba(255,255,255,.13) 0 2px, transparent 3px),
radial-gradient(circle at 84% 32%, rgba(255,255,255,.10) 0 2px, transparent 3px),
radial-gradient(circle at 70% 72%, rgba(255,255,255,.10) 0 2px, transparent 3px),
radial-gradient(circle at 30% 70%, rgba(255,255,255,.08) 0 2px, transparent 3px);
opacity:.58!important;
pointer-events:none!important;
animation:hpradioHeroShimmer 16s ease-in-out infinite!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:after{
content:"";
position:absolute!important;
inset:-10% -5% auto -5%!important;
height:130%!important;
background:
radial-gradient(circle at 15% 40%, rgba(255,255,255,.08) 0 1px, transparent 2px),
radial-gradient(circle at 75% 25%, rgba(255,255,255,.08) 0 1px, transparent 2px),
radial-gradient(circle at 55% 65%, rgba(255,255,255,.06) 0 1px, transparent 2px);
opacity:.7!important;
pointer-events:none!important;
animation:hpradioHeroFloat 12s ease-in-out infinite!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker span{
animation-duration: 28s!important;
}
/* v1.4.9 - correções finais: logo-play, redes selecionáveis e ticker funcionando */
.hpradio-social-switches{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:10px 16px!important;
padding:12px!important;
border:1px solid rgba(214,166,50,.22)!important;
border-radius:14px!important;
background:rgba(0,0,0,.18)!important;
}
.hpradio-social-switches strong{width:100%!important;color:#f6d878!important;text-transform:uppercase!important;font-size:12px!important;letter-spacing:.12em!important;}
.hpradio-social-switches label{display:inline-flex!important;align-items:center!important;gap:6px!important;margin:0!important;}
.hpradio-model-radiohero{
background:
radial-gradient(circle at 50% 24%, rgba(255,255,255,.12), transparent 18%),
linear-gradient(90deg,
color-mix(in srgb, var(--hpradio-primary) 82%, #000000) 0%,
var(--hpradio-primary) 50%,
color-mix(in srgb, var(--hpradio-primary) 82%, #000000) 100%)!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap{
cursor:pointer!important;
width:124px!important;
height:124px!important;
margin:4px auto 14px!important;
background:rgba(255,255,255,.16)!important;
border:4px solid rgba(255,255,255,.28)!important;
transition:transform .18s ease, box-shadow .18s ease!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap:hover{
transform:scale(1.03)!important;
box-shadow:0 0 0 8px rgba(255,255,255,.10),0 14px 32px rgba(0,0,0,.22),0 0 26px rgba(255,255,255,.16)!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap:after{
content:""!important;
position:absolute!important;
left:50%!important;
top:50%!important;
width:44px!important;
height:44px!important;
transform:translate(-50%,-50%)!important;
border-radius:999px!important;
background:
radial-gradient(circle at 32% 25%,rgba(255,255,255,.95),rgba(255,255,255,.15) 30%,transparent 31%),
linear-gradient(180deg,color-mix(in srgb,#fff 25%,var(--hpradio-primary)),var(--hpradio-primary))!important;
box-shadow:inset 0 2px 0 rgba(255,255,255,.65),0 3px 10px rgba(0,0,0,.35)!important;
z-index:4!important;
}
.hpradio-model-radiohero .hpradio-cover-wrap:before{
content:""!important;
position:absolute!important;
left:50%!important;
top:50%!important;
transform:translate(-38%,-50%)!important;
width:0!important;
height:0!important;
border-top:11px solid transparent!important;
border-bottom:11px solid transparent!important;
border-left:17px solid #fff!important;
z-index:5!important;
filter:drop-shadow(0 1px 1px rgba(0,0,0,.25));
background:none!important;
}
.hpradio-model-radiohero .hpradio-play{
display:none!important;
}
.hpradio-model-radiohero .hpradio-now h3{
font-size:32px!important;
line-height:1.1!important;
margin:0!important;
}
.hpradio-model-radiohero .hpradio-now p{
font-size:15px!important;
letter-spacing:.15em!important;
opacity:.92!important;
margin:8px 0 0!important;
}
.hpradio-model-radiohero .hpradio-controls{
width:min(520px,72%)!important;
margin:18px auto 0!important;
}
.hpradio-model-radiohero .hpradio-controls input[type=range]{
min-width:260px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-social a[style*="display: none"]{display:none!important;}
.hpradio-model-radiohero .hpradio-radiohero-ticker{
display:block;
position:absolute!important;
left:0!important;
right:0!important;
bottom:0!important;
height:32px!important;
background:rgba(88,0,28,.88)!important;
border-top:2px solid rgba(255,255,255,.18)!important;
overflow:hidden!important;
z-index:4!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker span{
display:inline-block!important;
white-space:nowrap!important;
color:#fff!important;
font-size:14px!important;
line-height:32px!important;
padding-left:100%!important;
animation:hpradioTickerMove 28s linear infinite!important;
}
.hpradio-model-radiohero.hpradio-bg-static:before,
.hpradio-model-radiohero.hpradio-bg-static:after{
animation:none!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:before{
opacity:.65!important;
animation:hpradioHeroShimmer 14s ease-in-out infinite!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:after{
opacity:.65!important;
animation:hpradioHeroFloat 10s ease-in-out infinite!important;
}
@media(max-width:720px){
.hpradio-model-radiohero .hpradio-cover-wrap{width:102px!important;height:102px!important;}
.hpradio-model-radiohero .hpradio-now h3{font-size:25px!important;}
.hpradio-model-radiohero .hpradio-controls{width:100%!important;}
.hpradio-model-radiohero .hpradio-controls input[type=range]{min-width:140px!important;}
}
/* v1.4.10 - faixa rolando fixada no rodapé sem cobrir controles */
.hpradio-model-radiohero{
padding-bottom:84px!important;
}
.hpradio-model-radiohero .hpradio-info{
padding-bottom:8px!important;
}
.hpradio-model-radiohero .hpradio-controls{
position:relative!important;
z-index:6!important;
margin:18px auto 22px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker{
left:0!important;
right:0!important;
bottom:0!important;
width:100%!important;
z-index:3!important;
}
@media(max-width:640px){
.hpradio-model-radiohero{padding-bottom:88px!important;}
.hpradio-model-radiohero .hpradio-controls{margin-bottom:24px!important;}
}
/* v1.4.11 - ticker infinito, sem bolha branca e fundo mais vivo */
.hpradio-model-radiohero{
padding-bottom:86px!important;
background:
radial-gradient(circle at 50% 24%, rgba(255,255,255,.18), transparent 18%),
radial-gradient(circle at 18% 70%, rgba(255,255,255,.10), transparent 20%),
radial-gradient(circle at 84% 16%, rgba(255,255,255,.08), transparent 18%),
linear-gradient(135deg,
color-mix(in srgb, var(--hpradio-primary) 86%, #2b0014) 0%,
var(--hpradio-primary) 48%,
color-mix(in srgb, var(--hpradio-primary) 88%, #390018) 100%)!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:before{
content:"";
position:absolute!important;
inset:0!important;
background:
linear-gradient(130deg, transparent 0 15%, rgba(255,255,255,.11) 15.2%, transparent 16% 100%),
linear-gradient(36deg, transparent 0 34%, rgba(255,255,255,.07) 34.2%, transparent 35% 100%),
radial-gradient(circle at 18% 32%, rgba(255,255,255,.16) 0 2px, transparent 3px),
radial-gradient(circle at 68% 30%, rgba(255,255,255,.10) 0 2px, transparent 3px),
radial-gradient(circle at 28% 76%, rgba(255,255,255,.08) 0 2px, transparent 3px),
radial-gradient(circle at 86% 62%, rgba(255,255,255,.09) 0 2px, transparent 3px)!important;
opacity:.72!important;
pointer-events:none!important;
z-index:1!important;
animation:hpradioHeroShimmer 12s ease-in-out infinite!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:after{
content:"";
position:absolute!important;
inset:-10% -4% auto -4%!important;
height:140%!important;
background:
radial-gradient(circle at 14% 28%, rgba(255,255,255,.10) 0 1px, transparent 2px),
radial-gradient(circle at 76% 18%, rgba(255,255,255,.10) 0 1px, transparent 2px),
radial-gradient(circle at 52% 74%, rgba(255,255,255,.08) 0 1px, transparent 2px),
linear-gradient(90deg, transparent 0 8%, rgba(255,255,255,.06) 8.1%, transparent 8.3% 100%)!important;
opacity:.68!important;
pointer-events:none!important;
z-index:1!important;
animation:hpradioHeroFloat 10s ease-in-out infinite!important;
}
.hpradio-model-radiohero .hpradio-info,
.hpradio-model-radiohero .hpradio-cover-wrap,
.hpradio-model-radiohero .hpradio-radiohero-social,
.hpradio-model-radiohero .hpradio-radiohero-clock,
.hpradio-model-radiohero .hpradio-radiohero-ticker{position:relative!important;z-index:3!important;}
.hpradio-model-radiohero .hpradio-controls{
width:min(520px,72%)!important;
margin:18px auto 26px!important;
justify-content:center!important;
gap:14px!important;
position:relative!important;
z-index:5!important;
}
.hpradio-model-radiohero .hpradio-controls .hpradio-play,
.hpradio-model-radiohero .hpradio-controls span[data-listeners]{
display:none!important;
}
.hpradio-model-radiohero .hpradio-controls input[type=range]{
flex:1 1 380px!important;
min-width:260px!important;
max-width:460px!important;
}
.hpradio-model-radiohero .hpradio-mute-btn{
width:42px!important;
height:42px!important;
min-width:42px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker{
left:0!important;
right:0!important;
bottom:0!important;
width:100%!important;
height:34px!important;
background:rgba(93,0,32,.92)!important;
border-top:1px solid rgba(255,255,255,.18)!important;
overflow:hidden!important;
z-index:2!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker-track{
display:flex!important;
width:max-content!important;
min-width:200%!important;
animation:hpradioTickerLoop 22s linear infinite!important;
will-change:transform;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker span{
display:block!important;
flex:0 0 auto!important;
white-space:nowrap!important;
color:#fff!important;
font-size:14px!important;
font-style:italic!important;
line-height:34px!important;
padding-right:56px!important;
}
@keyframes hpradioTickerLoop {
0% { transform:translate3d(0,0,0); }
100% { transform:translate3d(-50%,0,0); }
}
@media(max-width:640px){
.hpradio-model-radiohero{padding-bottom:92px!important;}
.hpradio-model-radiohero .hpradio-controls{width:100%!important;margin-bottom:28px!important;}
.hpradio-model-radiohero .hpradio-controls input[type=range]{min-width:140px!important;}
}
/* v1.4.12 - popup de redes e rodapé refinado */
.hpradio-model-radiohero{position:relative!important;overflow:hidden!important;padding:28px 28px 74px!important;}
.hpradio-model-radiohero.hpradio-has-bg-image{
background-image:
linear-gradient(135deg, color-mix(in srgb, var(--hpradio-primary) 78%, #170009) 0%, rgba(0,0,0,.08) 45%, color-mix(in srgb, var(--hpradio-primary) 82%, #130010) 100%),
var(--hpradio-bg-image)!important;
background-size:cover!important;
background-position:center center!important;
}
.hpradio-model-radiohero .hpradio-info{position:static!important;z-index:auto!important;padding-bottom:0!important;}
.hpradio-model-radiohero .hpradio-now,
.hpradio-model-radiohero .hpradio-cover-wrap,
.hpradio-model-radiohero .hpradio-radiohero-clock{position:relative!important;z-index:4!important;}
.hpradio-model-radiohero .hpradio-radiohero-socialwrap{position:absolute!important;top:16px!important;left:16px!important;z-index:8!important;display:block;}
.hpradio-model-radiohero .hpradio-radiohero-socialtoggle{
appearance:none!important;border:0!important;cursor:pointer!important;
border-radius:999px!important;padding:10px 18px!important;font-weight:700!important;
color:#b00016!important;background:#ffffff!important;box-shadow:0 8px 22px rgba(0,0,0,.16)!important;
}
.hpradio-model-radiohero .hpradio-radiohero-socialtoggle:hover{transform:translateY(-1px);}
.hpradio-model-radiohero .hpradio-radiohero-socialpopup{
position:absolute!important;top:54px!important;left:0!important;min-width:190px!important;
background:rgba(15,17,28,.94)!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:16px!important;
box-shadow:0 16px 40px rgba(0,0,0,.28)!important;padding:10px!important;display:grid!important;gap:8px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-socialpopup[hidden]{display:none!important;}
.hpradio-model-radiohero .hpradio-radiohero-socialpopup a{
display:block!important;padding:10px 14px!important;border-radius:12px!important;text-decoration:none!important;
color:#fff!important;background:rgba(255,255,255,.06)!important;font-size:14px!important;
}
.hpradio-model-radiohero .hpradio-radiohero-socialpopup a:hover{background:rgba(255,255,255,.12)!important;}
.hpradio-model-radiohero .hpradio-radiohero-clock{top:12px!important;right:14px!important;left:auto!important;}
.hpradio-model-radiohero .hpradio-controls{position:relative!important;z-index:6!important;margin:20px auto 18px!important;width:min(520px,68%)!important;}
.hpradio-model-radiohero .hpradio-radiohero-ticker{
position:absolute!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;height:38px!important;
margin:0!important;border-radius:0!important;z-index:5!important;background:rgba(88,0,31,.92)!important;
border-top:1px solid rgba(255,255,255,.16)!important;overflow:hidden!important;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker-track{
display:flex!important;align-items:center!important;width:max-content!important;min-width:200%!important;height:100%!important;
animation:hpradioTickerLoop 24s linear infinite!important;will-change:transform;
}
.hpradio-model-radiohero .hpradio-radiohero-ticker span{line-height:38px!important;padding-right:64px!important;font-size:14px!important;white-space:nowrap!important;}
.hpradio-model-radiohero .hpradio-controls .hpradio-play,
.hpradio-model-radiohero .hpradio-controls span[data-listeners]{display:none!important;}
.hpradio-model-radiohero.hpradio-bg-animated:before{
opacity:.85!important;animation:hpradioHeroShimmer 11s linear infinite!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:after{
opacity:.75!important;animation:hpradioHeroFloat 9s ease-in-out infinite!important;
}
@media(max-width:700px){
.hpradio-model-radiohero{padding:24px 16px 74px!important;}
.hpradio-model-radiohero .hpradio-controls{width:min(100%,420px)!important;}
}
/* v1.4.13 - redes popup funcional, relógio elegante e VU */
.hpradio-model-radiohero{padding:26px 26px 74px!important;overflow:hidden!important;}
.hpradio-model-radiohero .hpradio-radiohero-socialwrap{position:absolute!important;top:14px!important;left:14px!important;z-index:20!important;}
.hpradio-model-radiohero .hpradio-radiohero-socialtoggle{padding:8px 16px!important;min-height:36px!important;border-radius:999px!important;background:rgba(255,255,255,.96)!important;color:#93111d!important;border:1px solid rgba(0,0,0,.16)!important;font-size:13px!important;letter-spacing:.12em!important;text-transform:uppercase!important;box-shadow:0 10px 22px rgba(0,0,0,.18)!important;}
.hpradio-model-radiohero .hpradio-radiohero-socialpopup{top:46px!important;left:0!important;min-width:190px!important;padding:10px!important;border-radius:14px!important;background:rgba(20,12,28,.97)!important;border:1px solid rgba(255,255,255,.10)!important;box-shadow:0 18px 40px rgba(0,0,0,.32)!important;z-index:25!important;}
.hpradio-model-radiohero .hpradio-radiohero-socialpopup a{border-radius:10px!important;padding:10px 12px!important;background:rgba(255,255,255,.06)!important;}
.hpradio-model-radiohero .hpradio-radiohero-clock{position:absolute!important;top:14px!important;right:14px!important;left:auto!important;bottom:auto!important;width:auto!important;min-width:118px!important;max-width:none!important;height:38px!important;line-height:38px!important;padding:0 18px!important;margin:0!important;border-radius:999px!important;background:rgba(255,255,255,.96)!important;color:#b11422!important;font-size:22px!important;font-weight:800!important;letter-spacing:.06em!important;text-align:center!important;box-shadow:0 10px 24px rgba(0,0,0,.16)!important;z-index:20!important;}
.hpradio-model-radiohero .hpradio-controls{width:min(520px,68%)!important;margin:22px auto 8px!important;gap:16px!important;z-index:9!important;}
.hpradio-model-radiohero .hpradio-controls input[type=range]{flex:1 1 380px!important;min-width:260px!important;max-width:460px!important;}
.hpradio-model-radiohero .hpradio-controls .hpradio-play,.hpradio-model-radiohero .hpradio-controls span[data-listeners]{display:none!important;}
.hpradio-model-radiohero .hpradio-mute-btn{width:42px!important;height:42px!important;min-width:42px!important;}
.hpradio-model-radiohero .hpradio-radiohero-vu{width:120px!important;height:30px!important;margin:2px auto 14px!important;display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:4px!important;position:relative!important;z-index:8!important;}
.hpradio-model-radiohero .hpradio-radiohero-vu span{width:5px!important;height:8px!important;border-radius:4px 4px 0 0!important;background:linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.35))!important;box-shadow:0 0 8px rgba(255,255,255,.25)!important;opacity:.7!important;animation:hpradioVuPulse 1.1s ease-in-out infinite;animation-play-state:paused;}
.hpradio-model-radiohero.hpradio-is-playing .hpradio-radiohero-vu span{animation-play-state:running;}
.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(1){animation-delay:-.1s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(2){animation-delay:-.3s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(3){animation-delay:-.5s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(4){animation-delay:-.2s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(5){animation-delay:-.4s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(6){animation-delay:-.6s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(7){animation-delay:-.15s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(8){animation-delay:-.35s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(9){animation-delay:-.55s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(10){animation-delay:-.25s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(11){animation-delay:-.45s}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(12){animation-delay:-.65s}
@keyframes hpradioVuPulse{0%,100%{height:8px;opacity:.45}25%{height:24px;opacity:1}50%{height:14px;opacity:.7}75%{height:28px;opacity:.95}}
.hpradio-model-radiohero .hpradio-radiohero-ticker{position:absolute!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;height:38px!important;border-radius:0!important;margin:0!important;background:rgba(88,0,31,.92)!important;border-top:1px solid rgba(255,255,255,.15)!important;z-index:12!important;}
.hpradio-model-radiohero .hpradio-radiohero-ticker-track{display:flex!important;align-items:center!important;width:max-content!important;min-width:200%!important;height:100%!important;animation:hpradioTickerLoop 24s linear infinite!important;}
.hpradio-model-radiohero .hpradio-radiohero-ticker span{line-height:38px!important;font-size:14px!important;color:#fff!important;padding-right:60px!important;white-space:nowrap!important;}
.hpradio-model-radiohero.hpradio-bg-animated:before{animation:hpradioHeroShimmer 9s linear infinite!important;opacity:.9!important;}
.hpradio-model-radiohero.hpradio-bg-animated:after{animation:hpradioHeroFloat 8.5s ease-in-out infinite!important;opacity:.8!important;}
@media(max-width:700px){.hpradio-model-radiohero{padding:22px 14px 72px!important;}.hpradio-model-radiohero .hpradio-radiohero-clock{top:12px!important;right:12px!important;min-width:102px!important;height:34px!important;line-height:34px!important;font-size:18px!important;padding:0 14px!important;}.hpradio-model-radiohero .hpradio-controls{width:min(100%,420px)!important;}.hpradio-model-radiohero .hpradio-controls input[type=range]{min-width:150px!important;}}
/* v1.4.14 - seletor real de fundo e VU sempre visível */
.hpradio-model-radiohero .hpradio-radiohero-vu{
display:flex!important;
width:180px!important;
height:38px!important;
margin:6px auto 16px!important;
align-items:flex-end!important;
justify-content:center!important;
gap:5px!important;
position:relative!important;
z-index:10!important;
}
.hpradio-model-radiohero .hpradio-radiohero-vu span{
display:block!important;
width:6px!important;
min-height:7px!important;
border-radius:6px 6px 1px 1px!important;
background:linear-gradient(180deg,#fff,rgba(255,255,255,.34))!important;
box-shadow:0 0 12px rgba(255,255,255,.38)!important;
animation:hpradioVuPulse 1.15s ease-in-out infinite!important;
}
.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(1){animation-delay:-.10s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(2){animation-delay:-.28s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(3){animation-delay:-.46s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(4){animation-delay:-.18s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(5){animation-delay:-.36s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(6){animation-delay:-.54s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(7){animation-delay:-.12s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(8){animation-delay:-.32s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(9){animation-delay:-.52s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(10){animation-delay:-.22s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(11){animation-delay:-.42s!important}.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(12){animation-delay:-.62s!important}
@keyframes hpradioVuPulse{0%,100%{height:8px;opacity:.45}20%{height:30px;opacity:1}45%{height:15px;opacity:.68}70%{height:36px;opacity:.95}}
.hpradio-model-radiohero.hpradio-bg-static:before,
.hpradio-model-radiohero.hpradio-bg-static:after{display:none!important;animation:none!important;}
.hpradio-model-radiohero.hpradio-bg-style-ondas.hpradio-bg-animated:before{
background:
linear-gradient(126deg, transparent 0 12%, rgba(255,255,255,.13) 12.2%, transparent 13% 100%),
linear-gradient(38deg, transparent 0 32%, rgba(255,255,255,.10) 32.2%, transparent 33% 100%),
radial-gradient(circle at 42% 32%, rgba(255,255,255,.12), transparent 26%)!important;
}
.hpradio-model-radiohero.hpradio-bg-style-particulas.hpradio-bg-animated:before{
background:
radial-gradient(circle at 12% 22%, rgba(255,255,255,.30) 0 2px, transparent 3px),
radial-gradient(circle at 24% 72%, rgba(255,255,255,.22) 0 2px, transparent 3px),
radial-gradient(circle at 46% 18%, rgba(255,255,255,.22) 0 2px, transparent 3px),
radial-gradient(circle at 72% 44%, rgba(255,255,255,.20) 0 2px, transparent 3px),
radial-gradient(circle at 88% 78%, rgba(255,255,255,.18) 0 2px, transparent 3px),
linear-gradient(110deg, transparent 0 30%, rgba(255,255,255,.08) 30.2%, transparent 31% 100%)!important;
}
.hpradio-model-radiohero.hpradio-bg-style-luzes.hpradio-bg-animated:before{
background:
linear-gradient(100deg, transparent 0 20%, rgba(255,255,255,.18) 20.3%, transparent 23% 100%),
linear-gradient(140deg, transparent 0 54%, rgba(255,255,255,.12) 54.3%, transparent 56% 100%),
radial-gradient(circle at 55% 38%, rgba(255,255,255,.16), transparent 22%)!important;
}
.hpradio-model-radiohero.hpradio-bg-style-grade.hpradio-bg-animated:before{
background-image:
linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px),
radial-gradient(circle at 50% 40%, rgba(255,255,255,.12), transparent 26%)!important;
background-size:42px 42px,42px 42px,100% 100%!important;
}
.hpradio-model-radiohero.hpradio-bg-style-imagem.hpradio-has-bg-image{
background-image:
linear-gradient(135deg, color-mix(in srgb,var(--hpradio-primary) 60%, rgba(0,0,0,.28)), rgba(0,0,0,.10), color-mix(in srgb,var(--hpradio-primary) 58%, rgba(0,0,0,.32))),
var(--hpradio-bg-image)!important;
background-size:cover!important;
background-position:center!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:before{
animation:hpradioHeroShimmer 7s linear infinite!important;
opacity:.92!important;
}
.hpradio-model-radiohero.hpradio-bg-animated:after{
animation:hpradioHeroFloat 8s ease-in-out infinite!important;
opacity:.72!important;
}
/* v1.4.17 - playlist interna / rádio contínua */
.hpradio-program-form textarea[data-prog-url]{
width:100%!important;
min-height:112px!important;
resize:vertical!important;
background:#070b12!important;
border:1px solid rgba(214,166,50,.45)!important;
border-radius:14px!important;
color:#fff!important;
padding:12px 14px!important;
font:13px/1.45 monospace!important;
}
.hpradio-program-row small{display:block;opacity:.75;margin-top:4px;}
/* v1.4.19 - correções pontuais solicitadas */
/* Esconde totalmente a tarja de comercial/vinheta no player público. O áudio do comercial continua tocando normalmente. */
.hpradio-ad-now,
.hpradio-ad-now[style]{
display:none!important;
visibility:hidden!important;
opacity:0!important;
pointer-events:none!important;
}
/* VU sempre em movimento no modelo Site de rádio. */
.hpradio-model-radiohero .hpradio-radiohero-vu span{
animation-name:hpradioVuPulse!important;
animation-duration:.95s!important;
animation-timing-function:ease-in-out!important;
animation-iteration-count:infinite!important;
animation-play-state:running!important;
}
.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(odd){animation-duration:.82s!important;}
.hpradio-model-radiohero .hpradio-radiohero-vu span:nth-child(3n){animation-duration:1.08s!important;}