/* Karaoke V7 V15.9.4.20 TEST - No Status Cards + Default Info Ticker + Separate Custom Ticker
   UI-only overlay. Does not touch YouTube Player, playback, queue, syncPlayer,
   handleCommand, Firebase room state, running-text command data, or cache logic. */

/* Hidden outside TV fullscreen. */
body.route-tv.manual-tv .player > .karaoke-fs-qr-panel,
body.route-tv.manual-tv .player > .karaoke-fs-guide-ticker,
body.route-tv.manual-tv .player > .karaoke-fs-status-panel{
  display:none;
}

/* QR: keep available in fullscreen so a closed HP remote can be joined again. */
body.route-tv.manual-tv .player.karaoke-fullscreen > .karaoke-fs-qr-panel,
body.route-tv.manual-tv .player.karaoke-fullscreen-fallback > .karaoke-fs-qr-panel{
  display:flex!important;
  position:absolute!important;
  z-index:57!important;
  inset:auto auto clamp(10px,1.25vh,20px) clamp(12px,1.55vw,30px)!important;
  width:clamp(92px,7.7vw,132px)!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:4px!important;
  padding:0!important;
  margin:0!important;
  pointer-events:none!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:#fff!important;
  text-align:center!important;
}
body.route-tv.manual-tv .karaoke-fs-qr-label{
  width:100%!important;
  color:#fff!important;
  font-size:clamp(9px,.68vw,12px)!important;
  line-height:1.05!important;
  font-weight:950!important;
  letter-spacing:.025em!important;
  white-space:nowrap!important;
  text-shadow:0 2px 8px rgba(0,0,0,1)!important;
}
body.route-tv.manual-tv .karaoke-fs-qr{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:clamp(82px,6.9vw,118px)!important;
  height:clamp(82px,6.9vw,118px)!important;
  min-width:0!important;
  min-height:0!important;
  padding:5px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid rgba(255,255,255,.94)!important;
  border-radius:6px!important;
  box-shadow:0 5px 18px rgba(0,0,0,.30)!important;
}
body.route-tv.manual-tv .karaoke-fs-qr canvas,
body.route-tv.manual-tv .karaoke-fs-qr img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
}
body.route-tv.manual-tv .karaoke-fs-room{
  color:#fff!important;
  font-size:clamp(9px,.75vw,13px)!important;
  line-height:1.05!important;
  font-weight:900!important;
  letter-spacing:.02em!important;
  white-space:nowrap!important;
  text-shadow:0 2px 8px rgba(0,0,0,1)!important;
}
body.route-tv.manual-tv .karaoke-fs-room strong{
  color:#b98cff!important;
  font-size:1.12em!important;
  letter-spacing:.04em!important;
}

/* V15.9.4.20: remove the bottom-right status cards entirely.
   Now-playing + next-song information is carried by the DEFAULT ticker instead. */
body.route-tv.manual-tv .player > .karaoke-fs-status-panel,
body.route-tv.manual-tv .player.karaoke-fullscreen > .karaoke-fs-status-panel,
body.route-tv.manual-tv .player.karaoke-fullscreen-fallback > .karaoke-fs-status-panel{
  display:none!important;
  visibility:hidden!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  max-width:0!important;
  max-height:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
}

/* Hide the legacy now/next fullscreen ticker; V17 uses compact cards above. */
body.route-tv.manual-tv .player.karaoke-fullscreen > .karaoke-fs-ticker,
body.route-tv.manual-tv .player.karaoke-fullscreen-fallback > .karaoke-fs-ticker{
  display:none!important;
}

/* DEFAULT ticker: system info (now playing / next / QR hint). */
body.route-tv.manual-tv .player.karaoke-fullscreen > .karaoke-fs-guide-ticker,
body.route-tv.manual-tv .player.karaoke-fullscreen-fallback > .karaoke-fs-guide-ticker{
  display:block!important;
  position:absolute!important;
  z-index:56!important;
  top:auto!important;
  left:clamp(104px,8.85vw,155px)!important;
  right:clamp(12px,1.45vw,28px)!important;
  bottom:clamp(9px,1.1vh,18px)!important;
  width:auto!important;
  height:38px!important;
  min-height:38px!important;
  max-height:38px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  pointer-events:none!important;
  background:rgba(0,0,0,.48)!important;
  border-top:1px solid rgba(255,255,255,.18)!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  border-left:0!important;
  border-right:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.route-tv.manual-tv .karaoke-fs-guide-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  min-width:100%!important;
  height:100%!important;
  animation:karaokeV7FsGuideTicker 26s linear infinite!important;
  will-change:transform!important;
}
body.route-tv.manual-tv .karaoke-fs-guide-copy{
  flex:0 0 auto!important;
  padding-right:100px!important;
  white-space:nowrap!important;
  color:#ffffff!important;
  font-size:clamp(16px,1.22vw,22px)!important;
  line-height:1!important;
  font-weight:850!important;
  letter-spacing:.025em!important;
  text-shadow:0 2px 3px rgba(0,0,0,1),0 0 8px rgba(0,0,0,.95)!important;
}
@keyframes karaokeV7FsGuideTicker{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* CUSTOM running text from HP stays SEPARATE from the default system ticker.
   When custom text is active, it uses its own yellow bar and is never concatenated
   with now-playing / next-song text. */
body.route-tv.manual-tv .player.karaoke-event-ticker-active > .karaoke-fs-guide-ticker{
  display:none!important;
}
body.route-tv.manual-tv .player.karaoke-fullscreen.karaoke-event-ticker-active > .karaoke-event-ticker,
body.route-tv.manual-tv .player.karaoke-fullscreen-fallback.karaoke-event-ticker-active > .karaoke-event-ticker{
  display:block!important;
  position:absolute!important;
  z-index:56!important;
  top:auto!important;
  left:clamp(104px,8.85vw,155px)!important;
  right:clamp(12px,1.45vw,28px)!important;
  bottom:clamp(9px,1.1vh,18px)!important;
  width:auto!important;
  height:40px!important;
  min-height:40px!important;
  max-height:40px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  pointer-events:none!important;
  background:rgba(0,0,0,.52)!important;
  border-top:1px solid rgba(255,212,0,.30)!important;
  border-bottom:1px solid rgba(255,212,0,.14)!important;
  border-left:0!important;
  border-right:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.route-tv.manual-tv .player.karaoke-fullscreen .karaoke-event-ticker-copy,
body.route-tv.manual-tv .player.karaoke-fullscreen-fallback .karaoke-event-ticker-copy{
  color:#ffd400!important;
  font-size:clamp(18px,1.48vw,27px)!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:.04em!important;
  text-shadow:0 2px 2px #000,0 0 6px rgba(0,0,0,1),0 0 12px rgba(0,0,0,.95)!important;
  -webkit-text-stroke:.25px rgba(0,0,0,.95)!important;
}

/* Small TV/browser viewport tuning. */
@media(max-width:1050px){
  body.route-tv.manual-tv .player.karaoke-fullscreen > .karaoke-fs-guide-ticker,
  body.route-tv.manual-tv .player.karaoke-fullscreen-fallback > .karaoke-fs-guide-ticker,
  body.route-tv.manual-tv .player.karaoke-fullscreen.karaoke-event-ticker-active > .karaoke-event-ticker,
  body.route-tv.manual-tv .player.karaoke-fullscreen-fallback.karaoke-event-ticker-active > .karaoke-event-ticker{
    left:104px!important;
    right:10px!important;
  }
}
