/*
 * RicoReWi / Senderwelt Cast Center 2.0 – additive design layer.
 * The old #rrw-device-panel and its device APIs are preserved.
 * Nothing here changes the page menu, player engine or Visual Radio tabs.
 */
#rrw-device-panel.rrw-cast-center{
  width:min(610px,calc(100vw - 28px));
  max-height:min(860px,calc(100dvh - 24px));
  padding:clamp(16px,2.6vw,25px);
  background:
    radial-gradient(ellipse at 88% -10%,rgba(64,146,236,.18),transparent 48%),
    radial-gradient(ellipse at 4% 76%,rgba(116,67,206,.18),transparent 50%),
    linear-gradient(148deg,#101d3d 0%,#0b1531 64%,#0b1128 100%);
  border:1px solid rgba(119,207,246,.24);
  border-radius:25px;
  box-shadow:0 29px 90px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.08);
  scrollbar-width:thin;
  scrollbar-color:rgba(120,216,246,.35) transparent;
}
.rrw-cast-center .rrw-cast-center-head{
  margin-bottom:14px;
  align-items:center;
}
.rrw-cast-center .rrw-cast-center-head h3{
  font-size:clamp(1.45rem,3.8vw,1.95rem);
  font-weight:850;
  letter-spacing:-.035em;
}
.rrw-cast-center .rrw-cast-center-subhead{
  font-size:.77rem;color:#adcfe9;margin:3px 0 0;line-height:1.4;
}
.rrw-cast-center .rrw-cast-center-close{
  display:grid;place-items:center;
  width:42px;height:42px;min-width:42px;
  padding:0;border-radius:12px;
  color:#d9efff;background:rgba(255,255,255,.06);
  border:1px solid rgba(146,224,255,.13);
  cursor:pointer;
}
.rrw-cast-center .rrw-cast-center-close>span{display:none}
.rrw-cast-center .rrw-cast-center-now{
  display:grid;grid-template-columns:72px minmax(0,1fr);
  align-items:center;gap:14px;
  padding:13px 14px;
  margin-bottom:12px;
  border-radius:16px;
  border:1px solid rgba(106,212,250,.23);
  background:linear-gradient(120deg,rgba(32,104,159,.24),rgba(13,32,73,.7));
}
.rrw-cast-center .rrw-cast-center-cover{
  width:72px;height:72px;object-fit:contain;border-radius:12px;
  background:rgba(5,14,35,.5);
  border:1px solid rgba(161,225,255,.14);
}
.rrw-cast-center .rrw-cast-center-cover[hidden]{display:none!important}
.rrw-cast-center .rrw-cast-center-now:has(.rrw-cast-center-cover[hidden]){
  grid-template-columns:minmax(0,1fr);
}
.rrw-cast-center .rrw-cast-center-now-text{
  display:flex;flex-direction:column;gap:3px;min-width:0;
  color:#effaff;
}
.rrw-cast-center .rrw-cast-center-eyebrow{
  color:#73eaf6;letter-spacing:.12em;font-size:.66rem;font-weight:850;
}
.rrw-cast-center .rrw-cast-center-track{
  font-size:clamp(1.02rem,2vw,1.22rem);line-height:1.24;
  white-space:normal;overflow-wrap:anywhere;
}
.rrw-cast-center .rrw-cast-center-artist{
  color:#d2e5fa;font-size:.78rem;line-height:1.35;
}
.rrw-cast-center .rrw-cast-center-artist[hidden]{display:none!important}
.rrw-cast-center .rrw-cast-center-station{
  color:#9ebad6;font-size:.7rem;line-height:1.3;
}
.rrw-cast-center .rrw-cast-center-status{
  display:flex;gap:12px;align-items:center;
  padding:12px 14px;border-radius:14px;
  background:rgba(7,22,52,.7);
  border:1px solid rgba(133,190,240,.16);
  margin-bottom:12px;
}
.rrw-cast-center[data-cast-connected="true"] .rrw-cast-center-status{
  border-color:rgba(48,230,182,.34);
  background:rgba(18,93,96,.15);
}
.rrw-cast-center .rrw-cast-center-status-icon{
  width:39px;height:39px;min-width:39px;
  display:grid;place-items:center;border-radius:12px;
  color:#88e4ff;background:rgba(70,164,235,.14);
}
.rrw-cast-center[data-cast-connected="true"] .rrw-cast-center-status-icon{
  background:rgba(39,195,160,.16);color:#74ead1;
}
.rrw-cast-center .rrw-cast-center-status-info{
  display:flex;flex-direction:column;gap:2px;min-width:0;
}
.rrw-cast-center .rrw-cast-center-status-info strong{
  color:#effaff;font-size:.9rem;overflow-wrap:anywhere;
}
.rrw-cast-center .rrw-cast-center-status-info small{
  color:#b1cde7;font-size:.71rem;line-height:1.4;
}
.rrw-cast-center .rrw-cast-center-controls{
  display:flex;flex-direction:column;gap:12px;
  padding:12px;border-radius:14px;margin-bottom:13px;
  background:rgba(29,65,112,.24);
  border:1px solid rgba(100,190,238,.17);
}
.rrw-cast-center .rrw-cast-center-controls[hidden],
.rrw-cast-center .rrw-cast-center-control[hidden],
.rrw-cast-center .rrw-cast-center-volume[hidden]{
  display:none!important;
}
.rrw-cast-center .rrw-cast-center-controls-row{
  display:flex;flex-wrap:wrap;gap:8px;
}
.rrw-cast-center .rrw-cast-center-control{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:9px 13px;border:1px solid rgba(122,204,247,.25);
  border-radius:10px;background:rgba(23,80,123,.45);
  color:#ecfaff;font-weight:750;font-size:.77rem;
  min-height:39px;cursor:pointer;
}
.rrw-cast-center .rrw-cast-center-danger{
  background:rgba(155,43,72,.18);
  border-color:rgba(243,109,139,.28);
  color:#ffcbd7;
}
.rrw-cast-center .rrw-cast-center-volume{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:6px 12px;align-items:center;color:#cce7f9;
  font-size:.75rem;font-weight:650;
}
.rrw-cast-center .rrw-cast-center-volume input{
  grid-column:1/-1;
  width:100%;accent-color:#6ddef5;
  cursor:pointer;
}
.rrw-cast-center .rrw-cast-center-volume-value{
  font-variant-numeric:tabular-nums;color:#fff;
}
.rrw-cast-center .rrw-cast-center-section-title{
  display:flex;justify-content:space-between;align-items:center;
  gap:12px;margin:6px 0 10px;
}
.rrw-cast-center .rrw-cast-center-section-title strong{
  color:#f5fcff;font-size:.92rem;
}
.rrw-cast-center .rrw-cast-center-refresh{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:9px;
  border:1px solid rgba(147,207,249,.19);
  background:rgba(58,97,142,.2);color:#bdefff;
  cursor:pointer;font-size:.68rem;font-weight:750;
}
.rrw-cast-center .rrw-cast-center-refresh:focus-visible,
.rrw-cast-center button:focus-visible{
  outline:2px solid #7fe9fa;outline-offset:3px;
}
.rrw-cast-center .rrw-cast-center-options{
  gap:8px;
}
.rrw-cast-center .rrw-cast-center-options .rrw-cast-center-option{
  grid-template-columns:46px minmax(0,1fr) auto;
  min-height:68px;
  padding:10px 13px;
  border:1px solid rgba(124,205,246,.18);
  border-radius:13px;
  background:rgba(10,39,79,.51);
}
.rrw-cast-center .rrw-cast-center-options .rrw-cast-center-option:hover:not(:disabled){
  background:rgba(36,98,151,.4);
  border-color:rgba(125,238,255,.45);
}
.rrw-cast-center .rrw-cast-center-options .rrw-cast-center-option:disabled{
  opacity:.43;
}
.rrw-cast-center .rrw-cast-center-option-icon{
  display:grid;place-items:center;width:43px;height:43px;
  color:#98eafe;background:rgba(74,147,215,.16);
  border-radius:12px;font-size:1.08rem;
}
.rrw-cast-center .rrw-cast-center-option-info{
  display:flex;flex-direction:column;gap:3px;min-width:0;
}
.rrw-cast-center .rrw-cast-center-option-info strong{
  font-size:.85rem;line-height:1.22;color:#f2fcff;
}
.rrw-cast-center .rrw-cast-center-option-info small{
  font-size:.69rem;line-height:1.4;color:#adcae6;
}
.rrw-cast-center .rrw-cast-center-tv{
  display:grid;grid-template-columns:38px minmax(0,1fr);
  gap:8px 12px;
  margin-top:15px;padding:14px;
  background:linear-gradient(120deg,rgba(59,94,150,.25),rgba(75,47,127,.21));
  border:1px solid rgba(139,221,244,.18);
  border-radius:15px;
}
.rrw-cast-center .rrw-cast-center-tv-icon{
  width:36px;height:36px;display:grid;place-items:center;
  border-radius:10px;color:#a4efff;background:rgba(103,200,241,.14);
}
.rrw-cast-center .rrw-cast-center-tv-text{
  display:flex;flex-direction:column;gap:5px;min-width:0;
}
.rrw-cast-center .rrw-cast-center-tv-text strong{
  font-size:.87rem;color:#f5faff;
}
.rrw-cast-center .rrw-cast-center-tv-text p{
  color:#b9d1ed;font-size:.73rem;line-height:1.55;margin:0;
}
.rrw-cast-center .rrw-cast-center-tv-button{
  grid-column:2;justify-self:start;
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:9px;
  background:linear-gradient(110deg,#1384b2,#405ac2);
  border:1px solid rgba(151,232,255,.29);
  color:#fff;font-size:.73rem;font-weight:780;
  min-height:36px;cursor:pointer;
}
.rrw-cast-center .rrw-cast-center-tv-button:disabled{opacity:.4;cursor:not-allowed}
.rrw-cast-center .rrw-cast-center-browser-tv{
  text-decoration:none;justify-self:start;background:linear-gradient(115deg,#166a91,#4b57a7);
}
.rrw-cast-center .rrw-cast-center-copy-tv{
  background:rgba(20,73,108,.73);
  border-color:rgba(132,218,247,.29);
  justify-self:start;
}
.rrw-cast-center .rrw-cast-center-tv-button[hidden]{display:none!important}
.rrw-cast-center .rrw-cast-center-tv-button:is(:hover,:focus-visible){
  background:#247fa5;border-color:#86f2ff;color:#fff;
  outline-offset:2px;
}
.rrw-cast-center .rrw-cast-center-hint{
  color:#97adc8;font-size:.69rem;line-height:1.5;margin:12px 2px 0;
}
.rrw-cast-center .rrw-cast-center-feedback{
  padding:10px 12px;margin:12px 0 0;
  background:rgba(46,162,183,.13);
  border:1px solid rgba(62,189,223,.25);
  border-radius:11px;color:#bff7ff;font-size:.78rem;
}
.rrw-cast-center .rrw-cast-center-feedback[hidden]{display:none!important}
.rrw-cast-center .rrw-cast-center-feedback.is-error{
  background:rgba(188,58,83,.11);
  border-color:rgba(248,114,138,.29);
  color:#ffcada;
}
@media(max-width:620px){
  #rrw-device-panel.rrw-cast-center{
    width:100%;
    max-width:none;
    left:0;bottom:0;
    transform:translateY(22px);
    padding:16px 15px calc(18px + env(safe-area-inset-bottom));
    border-radius:22px 22px 0 0;
    max-height:96dvh;
  }
  #rrw-device-panel.rrw-cast-center.open{
    transform:translateY(0);
  }
  .rrw-cast-center .rrw-cast-center-now{
    grid-template-columns:57px minmax(0,1fr);
    padding:10px 11px;gap:10px;
  }
  .rrw-cast-center .rrw-cast-center-cover{width:57px;height:57px}
  .rrw-cast-center .rrw-cast-center-options .rrw-cast-center-option{
    min-height:59px;padding:9px 10px;
  }
  .rrw-cast-center .rrw-cast-center-tv{padding:12px}
}

/* Visual Radio's existing first-party widget overlay, not a browser popup. */
#sheet-back.rrw-vr-widget-sheet{
  z-index:10110;
  background:rgba(2,8,27,.8);
  backdrop-filter:blur(13px);
  -webkit-backdrop-filter:blur(13px);
}
#sheet-back.rrw-vr-widget-sheet .sheet{
  width:min(660px,100%);
  max-width:none;
  max-height:min(900px,calc(100dvh - 26px));
  background:
    radial-gradient(ellipse at 10% -10%,rgba(39,192,226,.15),transparent 65%),
    linear-gradient(140deg,#11254b,#0b1530 75%,#141130);
  border:1px solid rgba(119,213,251,.36);
  box-shadow:0 30px 100px rgba(0,0,0,.7);
  border-radius:23px;
}
#sheet-back.rrw-vr-widget-sheet .sheet-head{
  padding:16px 18px;
  background:rgba(10,29,68,.58);
  border-bottom:1px solid rgba(111,209,244,.19);
}
#sheet-back.rrw-vr-widget-sheet .sheet-head h3{
  font-weight:850;letter-spacing:-.01em;font-size:1.08rem;
}
#sheet-back.rrw-vr-widget-sheet .sheet-head h3 small{color:#b1dff4}
#sheet-back.rrw-vr-widget-sheet .sheet-head .ico{
  background:rgba(58,174,210,.17);
  border:1px solid rgba(135,226,252,.21);
  color:#83eaff;
}
#sheet-back.rrw-vr-widget-sheet .sheet-close{
  border:1px solid rgba(137,221,246,.3);
  background:rgba(81,154,193,.14);min-width:42px;height:42px;
}
#sheet-back.rrw-vr-widget-sheet .sheet-body iframe{
  height:min(740px,calc(100dvh - 115px));
  min-height:310px;
  background:#0b1631;
}
@media(max-width:620px){
  #sheet-back.rrw-vr-widget-sheet .sheet{
    max-height:calc(100dvh - env(safe-area-inset-top));
    border-radius:21px 21px 0 0;
    padding-bottom:env(safe-area-inset-bottom);
  }
  #sheet-back.rrw-vr-widget-sheet .sheet-head{padding:12px 14px}
  #sheet-back.rrw-vr-widget-sheet .sheet-body iframe{
    height:min(690px,calc(100dvh - 102px));
  }
}
@media(prefers-reduced-motion:reduce){
  #rrw-device-panel.rrw-cast-center,
  #sheet-back.rrw-vr-widget-sheet .sheet{
    animation:none!important;transition:none!important;
  }
}


/* Locally generated QR for the existing standalone TV browser page. */
.rrw-cast-center .rrw-cast-center-qr{
  grid-column:1 / -1;
  display:grid;grid-template-columns:110px minmax(0,1fr);align-items:center;
  gap:12px;min-width:0;padding:12px;
  border:1px solid rgba(124,211,247,.21);
  border-radius:13px;background:rgba(8,28,61,.52);
}
.rrw-cast-center .rrw-cast-center-qr[hidden]{display:none!important}
.rrw-cast-center .rrw-cast-center-qr-image{
  width:110px;height:110px;max-width:100%;display:block;
  border:5px solid #fff;border-radius:9px;object-fit:contain;
  background:#fff;image-rendering:pixelated;box-sizing:border-box;
}
.rrw-cast-center .rrw-cast-center-qr-image[hidden]{display:none!important}
.rrw-cast-center .rrw-cast-center-qr-text{
  display:flex;flex-direction:column;gap:5px;min-width:0;
}
.rrw-cast-center .rrw-cast-center-qr-text strong{
  font-size:.8rem;color:#fff;font-weight:850;
}
.rrw-cast-center .rrw-cast-center-qr-text p{
  margin:0;color:#aacce7;font-size:.7rem;line-height:1.48;
}
@media(max-width:390px){
 .rrw-cast-center .rrw-cast-center-qr{
   grid-template-columns:84px minmax(0,1fr);gap:9px;padding:9px;
 }
 .rrw-cast-center .rrw-cast-center-qr-image{
   width:84px;height:84px;border-width:3px;
 }
}

/* TV-Video vs TV-Seite: explicit user-facing distinction */
.rrw-cast-center .rrw-cast-center-tv-modes{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;min-width:0;margin:10px 0;
}
.rrw-cast-center .rrw-cast-center-tv-mode{
  min-width:0;display:flex;flex-direction:column;gap:6px;
  padding:12px;border-radius:13px;
  border:1px solid rgba(110,211,246,.20);
  background:linear-gradient(140deg,rgba(12,41,82,.72),rgba(12,25,52,.75));
}
.rrw-cast-center .rrw-cast-center-tv-mode strong{
  font-size:.81rem;line-height:1.28;font-weight:850;
  color:#e6faff;
}
.rrw-cast-center .rrw-cast-center-tv-mode small{
  font-size:.71rem;line-height:1.5;color:#b7d4eb;
}
@media(max-width:460px){
  .rrw-cast-center .rrw-cast-center-tv-modes{grid-template-columns:minmax(0,1fr)}
}