/* 1990s Prevue Channel / Scientific Atlanta Electronic Program Guide Re-Theme */
:root[data-hd-mode="cable"] {
  --hd-c-void: #000c24;
  --hd-c-base: #001848;
  --hd-ground: #001848;
  --hd-ground-top: #001030;
  --hd-ground-image: none;
  --hd-surface: #002266;
  --hd-surface-2: #001640;
  --hd-row: #002266;
  --hd-plate: #001c54;
  --hd-chrome: #ffdd00;
  --hd-chrome-hot: #ffdd00;
  --hd-chrome-dim: #cca800;
  --hd-chrome-fill: #aa0000;
  --hd-chrome-deep: #001233;
  --hd-chrome-rgb: 255, 221, 0;
  --hd-act: #ffdd00;
  --hd-act-soft: #ffee66;
  --hd-act-dim: #99bbff;
  --hd-act-fill: #aa0000;
  --hd-on-act: #001848;
  --hd-act-rgb: 255, 221, 0;
  --hd-select-bg: #ffdd00;
  --hd-select-ink: #001848;
  --hd-focus: #ffdd00;
  --hd-text: #ffffff;
  --hd-text-strong: #ffdd00;
  --hd-text-meta: #88bbff;
  --hd-text-disabled: #446699;
  --hd-signal: #00ff44;
  --hd-on-signal: #001848;
  --hd-good: #00ff44;
  --hd-bad: #ff2222;
  --hd-glow-strength: 0;
  --hd-glow-line: none;
  --hd-glow-text: none;
  --hd-glow-signal: none;
  --hd-glow-act: none;
  --hd-glow-drop: none;
  --hd-glow-drop-act: none;
  --hd-haze-top: none;
  --hd-scanline: none;
  --hd-cut-xs: 0px;
  --hd-cut-s: 0px;
  --hd-cut-m: 0px;
  --hd-cut-l: 0px;
  --oct: none;
  --hd-font-ui: "Share Tech Mono", "Courier New", Consolas, monospace;
  --hd-font-display: "Share Tech Mono", "Courier New", Consolas, monospace;
  --hd-font-num: "Share Tech Mono", "Courier New", Consolas, monospace;
  --hd-font-device: "Share Tech Mono", "Courier New", Consolas, monospace;
  --hd-font-mono: "Share Tech Mono", "Courier New", Consolas, monospace;
  --hd-font-ui-stretch: 100%;
}

:root[data-hd-mode="cable"] .bg-glow,
:root[data-hd-mode="cable"] .bg-shade,
:root[data-hd-mode="cable"] .tint,
:root[data-hd-mode="cable"] .hd-edge-rails,
:root[data-hd-mode="cable"] .brand__row .hd-barcode,
:root[data-hd-mode="cable"] .hero__spine,
:root[data-hd-mode="cable"] .hd-brackets__layer,
:root[data-hd-mode="cable"] .top-rule,
:root[data-hd-mode="cable"] .hd-glitch__echo {
  display: none !important;
}

/* Heavy 90s CRT Scanline Overlay */
:root[data-hd-mode="cable"] body::after {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 2000 !important;
  pointer-events: none !important;
  background:
    repeating-linear-gradient(
      180deg,
      rgba(0, 0, 0, 0) 0px,
      rgba(0, 0, 0, 0) 2px,
      rgba(0, 0, 0, 0.32) 2px,
      rgba(0, 0, 0, 0.32) 4px
    ),
    radial-gradient(130% 110% at 50% 50%, transparent 65%, rgba(0, 0, 0, 0.55) 100%) !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}

:root[data-hd-mode="cable"] .stage {
  background: #001030 !important;
  color: #ffffff !important;
  font-family: "Share Tech Mono", "Courier New", monospace !important;
  text-shadow: 2px 2px 0 #000000 !important;
}

/* Split Prevue Guide Background: Top half = Dark Navy PIP & Promo Deck, Bottom half = Royal Blue EPG Grid */
:root[data-hd-mode="cable"] .ground {
  background-color: #001848 !important;
  background-image:
    linear-gradient(180deg,
      #001238 0px, #001238 96px,
      #880000 96px, #880000 100px,
      #000c24 100px, #000c24 484px,
      #002b66 484px, #002b66 538px,
      #001848 538px, #001848 1036px,
      #111111 1036px, #111111 1080px) !important;
}

/* Bottom Cable Box Status Ticker Bar */
:root[data-hd-mode="cable"] .ground::after {
  content: "SCIENTIFIC ATLANTA 8600X // STEREO // SAP // [INFO] OPTIONS   [EXIT] JUMP TO   [A/B] LOCKED   PPV EVENT HOTLINE: 1-800-PPV-DECK";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #111111;
  border-top: 3px solid #ffdd00;
  color: #00ff44;
  font-family: "Share Tech Mono", "Courier New", monospace;
  font-size: 20px;
  letter-spacing: 0.1em;
  pointer-events: none;
}

/* Top Cable Box Header Banner */
:root[data-hd-mode="cable"] .top {
  left: 48px !important;
  right: 48px !important;
  top: 10px !important;
  height: 78px !important;
  align-items: center !important;
}

:root[data-hd-mode="cable"] .brand__mark {
  background: #aa0000 !important;
  color: #ffdd00 !important;
  border: 3px outset #ff5555 !important;
  padding: 6px 18px !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  box-shadow: 4px 4px 0 #000000 !important;
}
:root[data-hd-mode="cable"] .brand__mark .hd-glitch__main::before {
  content: "PREVUE // ";
  color: #ffffff;
}

:root[data-hd-mode="cable"] .brand__row {
  margin-top: 6px !important;
}
:root[data-hd-mode="cable"] .brand__row #brandSub {
  color: #00ff44 !important;
  font-size: 16px !important;
  letter-spacing: 0.1em !important;
}

/* Weather & Digital Cable Music Feed in Top Center */
:root[data-hd-mode="cable"] .mid {
  height: 68px !important;
  align-self: center !important;
}

:root[data-hd-mode="cable"] .radio {
  background: #002255 !important;
  border: 3px ridge #4488ff !important;
  padding: 0 18px !important;
  box-shadow: 4px 4px 0 #000000 !important;
}
:root[data-hd-mode="cable"] .radio::before,
:root[data-hd-mode="cable"] .radio::after {
  display: none !important;
}

:root[data-hd-mode="cable"] .radio__band .hd-label {
  background: #ffdd00 !important;
  color: #001848 !important;
  padding: 1px 6px !important;
  text-shadow: none !important;
  font-weight: 700 !important;
}
:root[data-hd-mode="cable"] .radio__band .hd-label::before {
  content: "DMX CH.94 // ";
}
:root[data-hd-mode="cable"] .radio__freq {
  color: #00ff44 !important;
  font-size: 28px !important;
}
:root[data-hd-mode="cable"] .radio__station {
  color: #ffdd00 !important;
  font-size: 15px !important;
}
:root[data-hd-mode="cable"] .radio__track {
  color: #ffffff !important;
  font-size: 21px !important;
}
:root[data-hd-mode="cable"] .radio__track b {
  color: #ffdd00 !important;
}
:root[data-hd-mode="cable"] .radio__meter i {
  background: #00ff44 !important;
}
:root[data-hd-mode="cable"] .radio__meter i:nth-child(n+9) {
  background: #ffdd00 !important;
}
:root[data-hd-mode="cable"] .radio__pp {
  border: 2px outset #88bbff !important;
  background: #003380 !important;
  color: #ffdd00 !important;
}

/* Set-Top Box 7-Segment LED Clock & Channel Readout in Top Right */
:root[data-hd-mode="cable"] .clock {
  background: #081208 !important;
  border: 3px inset #444444 !important;
  padding: 6px 20px !important;
  box-shadow: 4px 4px 0 #000000 !important;
}
:root[data-hd-mode="cable"] .clock__time {
  color: #00ff44 !important;
  font-size: 52px !important;
  text-shadow: 0 0 10px rgba(0, 255, 68, 0.7) !important;
}
:root[data-hd-mode="cable"] .clock__time .hd-num__frac,
:root[data-hd-mode="cable"] .clock__time .hd-num__unit {
  color: #00cc33 !important;
}
:root[data-hd-mode="cable"] .clock .hd-label,
:root[data-hd-mode="cable"] .clock .hd-label span {
  color: #ffdd00 !important;
  font-size: 16px !important;
}

/* Upper Left: Channel Info & Program Description Box (.hero) */
:root[data-hd-mode="cable"] .hero {
  left: 48px !important;
  top: 112px !important;
  width: 1120px !important;
  height: 356px !important;
  padding: 22px 28px !important;
  background: #001c54 !important;
  border: 4px ridge #4488ff !important;
  box-shadow: 6px 6px 0 #000000 !important;
  overflow: hidden !important;
}

:root[data-hd-mode="cable"] #hLabel {
  background: #aa0000 !important;
  color: #ffffff !important;
  padding: 4px 12px !important;
  border: 2px outset #ff5555 !important;
  font-size: 20px !important;
}
:root[data-hd-mode="cable"] #hChip {
  background: #ffdd00 !important;
  color: #001848 !important;
  clip-path: none !important;
  text-shadow: none !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  padding: 4px 12px !important;
}
:root[data-hd-mode="cable"] #hIdx {
  color: #00ff44 !important;
  font-size: 24px !important;
}
:root[data-hd-mode="cable"] #hIdx::before {
  content: "CH ";
}

:root[data-hd-mode="cable"] .hero__title {
  margin-top: 16px !important;
  font-size: 72px !important;
  color: #ffdd00 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

:root[data-hd-mode="cable"] .hero__desc {
  margin-top: 10px !important;
  font-size: 28px !important;
  color: #ffffff !important;
  white-space: normal !important;
}
:root[data-hd-mode="cable"] .hero__desc::after {
  content: "  [CC] [STEREO] [TV-PG]";
  color: #00ff44;
  font-size: 22px;
}

:root[data-hd-mode="cable"] .hero__next {
  margin-top: 20px !important;
  background: #001030 !important;
  border: 3px solid #ffdd00 !important;
  padding: 10px 20px !important;
}
:root[data-hd-mode="cable"] .hero__next::before,
:root[data-hd-mode="cable"] .hero__next::after {
  display: none !important;
}
:root[data-hd-mode="cable"] .hero__next .hd-label {
  color: #00ff44 !important;
  font-size: 22px !important;
}
:root[data-hd-mode="cable"] .hero__next .t {
  color: #ffffff !important;
  font-size: 24px !important;
}
:root[data-hd-mode="cable"] .hero__next .ok {
  color: #ffdd00 !important;
}

/* Upper Right: Quarter-Screen Live TV Picture-in-Picture (PIP) Window (.bg) */
:root[data-hd-mode="cable"] .bg {
  left: 1196px !important;
  top: 112px !important;
  width: 676px !important;
  height: 356px !important;
  padding: 28px !important;
  background: #050811 !important;
  border: 4px ridge #ffdd00 !important;
  box-shadow: 6px 6px 0 #000000 !important;
  z-index: 5 !important;
}
:root[data-hd-mode="cable"] .bg.on {
  opacity: 1 !important;
}
:root[data-hd-mode="cable"] .bg.on::after {
  content: "CH 03 // PIP PREVIEW";
  position: absolute;
  top: 12px;
  right: 18px;
  color: #00ff44;
  font-family: "Share Tech Mono", "Courier New", monospace;
  font-size: 22px;
  font-weight: 700;
  text-shadow: 2px 2px 0 #000000;
}

/* Middle EPG Time-Slot Header Bar (.bar) */
:root[data-hd-mode="cable"] .bar {
  left: 48px !important;
  right: 48px !important;
  top: 484px !important;
  height: 54px !important;
  padding: 0 20px !important;
  background: #002b66 !important;
  border-top: 3px solid #66aaff !important;
  border-bottom: 3px solid #ffdd00 !important;
}

:root[data-hd-mode="cable"] .bar .hd-tab {
  color: #ffffff !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  padding: 0 22px !important;
  min-height: 40px !important;
  border: 2px solid #4488ff !important;
  background: #001c54 !important;
}
:root[data-hd-mode="cable"] .bar .hd-tab::before {
  display: none !important;
}
:root[data-hd-mode="cable"] .bar .hd-tab[aria-selected="true"] {
  background: #aa0000 !important;
  color: #ffdd00 !important;
  border-color: #ffdd00 !important;
  font-size: 24px !important;
  text-shadow: 2px 2px 0 #000000 !important;
}
:root[data-hd-mode="cable"] .bar .hd-tab.is-focus,
:root[data-hd-mode="cable"] .barbtn.is-focus {
  background: #ffdd00 !important;
  color: #001848 !important;
  text-shadow: none !important;
  outline: 3px solid #ffffff !important;
  outline-offset: 0 !important;
}

/* Fake Time-Slot Columns in the Middle Bar Rule */
:root[data-hd-mode="cable"] .bar__rule {
  height: 36px !important;
  background: #001640 !important;
  border: 2px inset #3366cc !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-around !important;
}
:root[data-hd-mode="cable"] .bar__rule::before {
  content: "◀ 8:00 PM          |          8:30 PM          |          9:00 PM ▶";
  color: #ffdd00;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

:root[data-hd-mode="cable"] .barbtn {
  border: 2px outset #4488ff !important;
  background: #001c54 !important;
  color: #ffdd00 !important;
  font-size: 20px !important;
  min-height: 40px !important;
}
:root[data-hd-mode="cable"] .barbtn::before,
:root[data-hd-mode="cable"] .barbtn::after {
  display: none !important;
}

/* Bottom Half: Blue & Yellow EPG Channel Grid (.deck) */
:root[data-hd-mode="cable"] .deck {
  left: 48px !important;
  top: 552px !important;
  width: 1824px !important;
  height: 476px !important;
  perspective: none !important;
}

:root[data-hd-mode="cable"] .section {
  transform-style: flat !important;
}

:root[data-hd-mode="cable"] .row {
  transform: none !important;
  opacity: 1 !important;
  margin-bottom: 14px !important;
}

:root[data-hd-mode="cable"] .row__title {
  background: #880000 !important;
  color: #ffdd00 !important;
  border: 2px solid #ffdd00 !important;
  padding: 4px 16px !important;
  margin: 0 0 10px 0 !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}
:root[data-hd-mode="cable"] .row__title::after {
  display: none !important;
}
:root[data-hd-mode="cable"] .row__title .hd-mono {
  color: #ffffff !important;
  margin-left: auto !important;
  font-size: 20px !important;
}

/* EPG Channel Slots Grid: 4 Columns x 2 Rows */
:root[data-hd-mode="cable"] #favRow {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 8px 10px !important;
}
:root[data-hd-mode="cable"] #fav {
  display: contents !important;
}

/* Each EPG Channel Cell: Left Red/Yellow Channel Call-Sign Box + Right Blue Program Bar */
:root[data-hd-mode="cable"] #favRow .art,
:root[data-hd-mode="cable"] #favRow .badge,
:root[data-hd-mode="cable"] #favRow .slot,
:root[data-hd-mode="cable"] #favRow .scan {
  width: 100% !important;
  height: 98px !important;
  background:
    linear-gradient(90deg,
      #001238 0px, #001238 104px,
      #4488ff 104px, #4488ff 107px,
      #00246b 107px, #00246b 100%) !important;
  border: 3px ridge #4488ff !important;
  padding: 8px 14px 8px 120px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
}

:root[data-hd-mode="cable"] #favRow .art img,
:root[data-hd-mode="cable"] .tiles--apps .art--sm img,
:root[data-hd-mode="cable"] #inp .art img {
  position: absolute !important;
  left: 12px !important;
  top: 9px !important;
  width: 76px !important;
  height: 76px !important;
  opacity: 1 !important;
  object-fit: contain !important;
  border: 2px solid #ffdd00 !important;
  background: #000818 !important;
  filter: none !important;
}

/* Program Title inside EPG Bar */
:root[data-hd-mode="cable"] #favRow .art::before,
:root[data-hd-mode="cable"] .tiles--apps .art--sm::before,
:root[data-hd-mode="cable"] #inp .art::before {
  content: "▶ " attr(data-ms-name) "\A   ON NOW // STEREO";
  white-space: pre;
  color: #ffffff;
  font-family: "Share Tech Mono", "Courier New", monospace;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Scan Button in EPG Grid */
:root[data-hd-mode="cable"] #favRow .scan {
  padding-left: 20px !important;
  background: #002b66 !important;
  justify-content: center !important;
  display: flex !important;
  gap: 16px !important;
}
:root[data-hd-mode="cable"] #favRow .scan::before,
:root[data-hd-mode="cable"] #favRow .scan::after {
  display: none !important;
}
:root[data-hd-mode="cable"] .scan__name {
  color: #ffdd00 !important;
  font-size: 26px !important;
}
:root[data-hd-mode="cable"] .scan__mic {
  color: #00ff44 !important;
}

/* Highlighted EPG Cell: Classic Prevue Bright Yellow Highlight Bar (#ffdd00) with Dark Blue Text */
:root[data-hd-mode="cable"] #favRow .art.is-focus,
:root[data-hd-mode="cable"] #favRow .badge.is-focus,
:root[data-hd-mode="cable"] #favRow .slot.is-focus,
:root[data-hd-mode="cable"] #favRow .scan.is-focus,
:root[data-hd-mode="cable"] .tiles--apps .art--sm.is-focus,
:root[data-hd-mode="cable"] #inp .art.is-focus {
  background:
    linear-gradient(90deg,
      #aa0000 0px, #aa0000 104px,
      #ffffff 104px, #ffffff 107px,
      #ffdd00 107px, #ffdd00 100%) !important;
  border-color: #ffffff !important;
  transform: none !important;
  box-shadow: 0 0 0 3px #ffdd00, 6px 6px 0 #000000 !important;
}

:root[data-hd-mode="cable"] #favRow .art.is-focus::before,
:root[data-hd-mode="cable"] .tiles--apps .art--sm.is-focus::before,
:root[data-hd-mode="cable"] #inp .art.is-focus::before {
  color: #001848 !important;
  text-shadow: none !important;
}
:root[data-hd-mode="cable"] #favRow .scan.is-focus .scan__name,
:root[data-hd-mode="cable"] #favRow .scan.is-focus .scan__mic {
  color: #001848 !important;
  text-shadow: none !important;
}

/* Row 2: Pay-Per-View / Recently Tuned Channels (#cw) */
:root[data-hd-mode="cable"] #cw {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 10px !important;
}

:root[data-hd-mode="cable"] .cw {
  width: 100% !important;
  height: 118px !important;
  background: #002266 !important;
  border: 3px ridge #4488ff !important;
  padding: 10px 14px !important;
}
:root[data-hd-mode="cable"] .cw::before,
:root[data-hd-mode="cable"] .cw::after,
:root[data-hd-mode="cable"] .cw__strip {
  display: none !important;
}
:root[data-hd-mode="cable"] .cw__title {
  color: #ffdd00 !important;
  font-size: 24px !important;
}
:root[data-hd-mode="cable"] .cw__sub {
  color: #ffffff !important;
  font-size: 18px !important;
}
:root[data-hd-mode="cable"] .cw__left {
  color: #00ff44 !important;
  font-size: 17px !important;
}
:root[data-hd-mode="cable"] .cw__thumb {
  border: 2px solid #ffdd00 !important;
  background: #000818 !important;
}
:root[data-hd-mode="cable"] .cw.is-focus {
  background: #ffdd00 !important;
  border-color: #ffffff !important;
  transform: none !important;
  box-shadow: 0 0 0 3px #ffdd00, 6px 6px 0 #000000 !important;
}
:root[data-hd-mode="cable"] .cw.is-focus .cw__title,
:root[data-hd-mode="cable"] .cw.is-focus .cw__sub,
:root[data-hd-mode="cable"] .cw.is-focus .cw__left {
  color: #001848 !important;
  text-shadow: none !important;
}

/* All Apps & Inputs in EPG Cell Style */
:root[data-hd-mode="cable"] .tiles--apps .art--sm,
:root[data-hd-mode="cable"] .tiles--apps .badge--sm,
:root[data-hd-mode="cable"] #inp .art,
:root[data-hd-mode="cable"] #inp .badge {
  width: 400px !important;
  height: 96px !important;
  background:
    linear-gradient(90deg,
      #001238 0px, #001238 100px,
      #4488ff 100px, #4488ff 103px,
      #00246b 103px, #00246b 100%) !important;
  border: 3px ridge #4488ff !important;
  padding: 8px 14px 8px 116px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
}

/* Modals, Options, Jump To in 90s Set-Top Box OSD Style */
:root[data-hd-mode="cable"] .hd-panel {
  background: #001848 !important;
  border: 4px ridge #ffdd00 !important;
  box-shadow: 10px 10px 0 #000000 !important;
}
:root[data-hd-mode="cable"] .hd-panel::before,
:root[data-hd-mode="cable"] .hd-panel::after {
  display: none !important;
}
:root[data-hd-mode="cable"] .hd-panel__head {
  background: #aa0000 !important;
  color: #ffdd00 !important;
  border-bottom: 3px solid #ffdd00 !important;
}
:root[data-hd-mode="cable"] .jl.is-focus,
:root[data-hd-mode="cable"] .opts .hd-menu__item.is-focus {
  background: #ffdd00 !important;
  color: #001848 !important;
  text-shadow: none !important;
}
:root[data-hd-mode="cable"] .jl.is-focus .jl__name,
:root[data-hd-mode="cable"] .jl.is-focus .jl__val,
:root[data-hd-mode="cable"] .jl.is-focus .arr {
  color: #001848 !important;
  text-shadow: none !important;
}
