/* Viva FM ONAIR: estilos aislados para temporizador de la tarjeta expansiva. */
/* ONAIR sleep timer: Spotify-style floating panel, without altering card layout. */
#onair .onair-sleep-wrap { position:relative; display:flex; align-items:center; justify-content:center; background:transparent !important; }
#onair button.onair-sleep-button,
#onair button.onair-sleep-button:hover,
#onair button.onair-sleep-button:focus,
#onair button.onair-sleep-button:active {
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; min-width:42px; min-height:42px; padding:0;
  border:1px solid rgba(255,255,255,.14); border-radius:50%;
  color:#fff; background:transparent !important; background-color:transparent !important;
  box-shadow:none !important; -webkit-appearance:none; appearance:none;
  -webkit-tap-highlight-color:transparent; outline-offset:3px; cursor:pointer;
}
#onair button.onair-sleep-button::before,
#onair button.onair-sleep-button::after { content:none !important; display:none !important; }
#onair .onair-sleep-button i,
#onair .onair-sleep-button i::before { color:#fff !important; background:transparent !important; background-color:transparent !important; font-size:18px; }
#onair button.onair-sleep-button.is-timing {
  border-color:#fc3900 !important;
  background:#fc3900 !important;
  background-color:#fc3900 !important;
  color:#fff !important;
  box-shadow:0 0 0 2px rgba(252,57,0,.22) !important;
}
#onair button.onair-sleep-button.is-timing i,
#onair button.onair-sleep-button.is-timing i::before {
  color:#fff !important; background:transparent !important; background-color:transparent !important;
}
.onair-sleep-panel {
  display:none; position:fixed; z-index:2147483000; box-sizing:border-box;
  width:min(320px, calc(100vw - 24px)); max-height:min(75vh, 520px); overflow-y:auto;
  padding:20px; border:1px solid rgba(255,255,255,.12); border-radius:18px;
  background:#001341 !important; color:#fff; box-shadow:0 12px 40px rgba(0,0,0,.45);
  font-family:inherit; cursor:default; overscroll-behavior:contain;
}
.onair-sleep-panel.is-open { display:block; }
.onair-sleep-panel strong { display:block; margin:0 0 6px; color:#fff; font-size:18px; font-weight:700; }
.onair-sleep-panel p { margin:0 0 14px; color:rgba(255,255,255,.72); font-size:13px; line-height:1.4; }
.onair-sleep-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.onair-sleep-options button { min-width:0; min-height:40px; padding:7px 4px; border:1px solid rgba(255,255,255,.16); border-radius:10px; color:#fff; background:#001b59; font:inherit; font-size:13px; cursor:pointer; }
.onair-sleep-options button:hover,
.onair-sleep-options button:focus-visible,
.onair-sleep-options button:active { background:#fc3900 !important; border-color:#fc3900 !important; }
.onair-sleep-options button:focus-visible { outline:2px solid rgba(252,57,0,.45); outline-offset:2px; }
.onair-sleep-status { margin-top:14px; color:#fff; font-size:13px; line-height:1.45; }
.onair-sleep-cancel { display:block; margin-top:10px; padding:8px 0; border:0; color:#fc3900; background:transparent !important; font:inherit; font-size:13px; cursor:pointer; }
.onair-sleep-cancel[hidden] { display:none !important; }
@media (max-width:600px) {
  #onair button.onair-sleep-button,
  #onair button.onair-sleep-button:hover,
  #onair button.onair-sleep-button:focus,
  #onair button.onair-sleep-button:active { background:transparent !important; background-color:transparent !important; box-shadow:none !important; }
  #onair .onair-sleep-button i, #onair .onair-sleep-button i::before { background:transparent !important; background-color:transparent !important; }
  .onair-sleep-panel { padding:18px; }
}