+
@@ -344,7 +477,8 @@
Program Info
+ data-name="{{ ch.name|e }}"
+ data-logo="{{ ch.logo }}">
{% if ch.logo %}
{% endif %}
{{ ch.name }}
@@ -441,6 +575,118 @@
Program Info
}
}
+/* --- NEW: Fixed time header logic with left spacer ---
+ The goal: the fixed bar visually extends across the left channel area (blank),
+ while the actual time cells remain aligned with the program grid.
+ Implementation: fixedBar covers full viewport width (left:0). Inside it we create
+ a left spacer whose width == channel column width and paint that spacer with the
+ channel column background (theme-aware via CSS variables). The cloned time-header
+ is appended after the spacer so times start where they already do.
+*/
+
+function createOrUpdateFixedTimeBar(){
+ const fixedBar = document.getElementById('fixedTimeBar');
+ const gridTimeRow = document.getElementById('gridTimeRow');
+ const guideOuter = document.getElementById('guideOuter');
+ const playerRow = document.getElementById('playerRow');
+
+ if (!gridTimeRow || !fixedBar || !guideOuter) return;
+
+ // Clone the server-side time header cells
+ const serverTimeHeader = gridTimeRow.querySelector('.time-header-wrap .grid-content .time-header');
+ if (!serverTimeHeader) return;
+
+ // clear existing
+ fixedBar.innerHTML = '';
+
+ // cloned container
+ const clonedGridContent = document.createElement('div');
+ clonedGridContent.className = 'grid-content';
+
+ // left spacer so the times start where the grid content starts
+ const spacer = document.createElement('div');
+ spacer.className = 'left-spacer';
+
+ // compute current channel column width
+ const firstChanCol = document.querySelector('.guide-row .chan-col');
+ const chanColWidth = firstChanCol ? Math.round(firstChanCol.getBoundingClientRect().width) : 200;
+ spacer.style.width = chanColWidth + 'px';
+ spacer.style.minWidth = chanColWidth + 'px';
+ spacer.style.maxWidth = chanColWidth + 'px';
+
+ // clone the time header and append after the spacer
+ const clonedTimeHeader = serverTimeHeader.cloneNode(true);
+ clonedTimeHeader.classList.add('time-header');
+ clonedTimeHeader.style.display = 'flex';
+ clonedTimeHeader.style.height = '100%';
+
+ // append in order: spacer then header
+ clonedGridContent.appendChild(spacer);
+ clonedGridContent.appendChild(clonedTimeHeader);
+
+ // create a now-line for the fixed header (positioned absolutely within clonedGridContent)
+ const nowLine = document.createElement('div');
+ nowLine.id = 'nowLineFixed';
+ nowLine.className = 'now-line';
+ nowLine.style.position = 'absolute';
+ nowLine.style.top = '0';
+ nowLine.style.bottom = '0';
+ nowLine.style.width = '2px';
+ nowLine.style.left = '0px';
+ nowLine.style.pointerEvents = 'none';
+ clonedGridContent.appendChild(nowLine);
+
+ fixedBar.appendChild(clonedGridContent);
+
+ // fixedBar spans whole viewport left->right (so the left spacer covers the channel area)
+ fixedBar.style.left = '0px';
+ fixedBar.style.width = window.innerWidth + 'px';
+
+ // Position top: place it directly below the player row
+ if (playerRow) {
+ const rect = playerRow.getBoundingClientRect();
+ fixedBar.style.top = rect.bottom + 'px';
+ } else {
+ const header = document.querySelector('.header');
+ const headerRect = header ? header.getBoundingClientRect() : { bottom: 40 };
+ fixedBar.style.top = headerRect.bottom + 'px';
+ }
+
+ // ensure the guide content is pushed down by the fixed bar height
+ requestAnimationFrame(() => {
+ const fbHeight = fixedBar.getBoundingClientRect().height || 34;
+ const currentPaddingTop = parseFloat(window.getComputedStyle(guideOuter).paddingTop) || 0;
+ if (currentPaddingTop < fbHeight) {
+ guideOuter.style.paddingTop = fbHeight + 'px';
+ }
+ });
+
+ // hide the original in-grid now-line (we use the fixed one)
+ const origNow = document.getElementById('nowLineOriginal');
+ if (origNow) origNow.style.display = 'none';
+}
+
+// update fixed now-line and also original now-line left (if original present)
+function updateNowLine(){
+ const gridStart = new Date("{{ grid_start.isoformat() }}");
+ const scale = {{ SCALE }};
+ const now = new Date();
+ const minutesFromStart = (now - gridStart) / 60000;
+ const leftPx = (minutesFromStart * scale);
+
+ // compute channel column width again (ensure sync if responsive)
+ const firstChanCol = document.querySelector('.guide-row .chan-col');
+ const chanColWidth = firstChanCol ? firstChanCol.getBoundingClientRect().width : 0;
+
+ // Fixed now-line: because we include the left spacer inside the fixed bar, add its width
+ const nlFixed = document.getElementById('nowLineFixed');
+ if (nlFixed) nlFixed.style.left = (leftPx + chanColWidth) + 'px';
+
+ // In case original now-line is being used, update it too
+ const nlOrig = document.getElementById('nowLineOriginal');
+ if (nlOrig) nlOrig.style.left = leftPx + 'px';
+}
+
document.addEventListener("DOMContentLoaded", () => {
const savedTheme = localStorage.getItem("theme") || "dark";
document.body.classList.add(savedTheme);
@@ -462,26 +708,67 @@
Program Info
prog.title = `${prog.dataset.title}\n${start.toLocaleTimeString([], {hour:'2-digit',minute:'2-digit'})} - ${stop.toLocaleTimeString([], {hour:'2-digit',minute:'2-digit'})}`;
});
+ // Create and position the fixed time bar immediately after DOM ready
+ createOrUpdateFixedTimeBar();
updateClock();
- setInterval(updateClock, 1000);
updateNowLine();
+
+ // Keep clock & now-line updated
+ setInterval(updateClock, 1000);
setInterval(updateNowLine, 60000);
});
-function setTheme(theme) {
- const body = document.body;
- // Remove all possible theme classes
- body.classList.remove("light", "dark", "retro-tvguide", "retro-aol", "retro-webtv", "retro-tvguide2000", "retro-magazine", "directv", "comcast");
- // Add the new one
- body.classList.add(theme);
- // Save it for next load
- localStorage.setItem("theme", theme);
+// Recompute positions on resize (so fixed bar stays aligned)
+window.addEventListener('resize', () => {
+ createOrUpdateFixedTimeBar();
+ updateNowLine();
+});
+
+/* --- Theme & UI helpers --- (unchanged) */
+function setTheme(theme){
+ const b=document.body;
+ /* start fade out */
+ b.classList.add("fade-switch");
+ setTimeout(()=>{
+ const wasTVG=b.classList.contains("tvguide1990");
+ b.classList.remove("light","dark","retro-tvguide","retro-aol","retro-webtv",
+ "retro-tvguide2000","retro-magazine","directv","comcast","tvguide1990");
+ b.classList.add(theme);
+ localStorage.setItem("theme",theme);
+
+ /* ๐งฉ Restore logos + names when leaving TV Guide 1990 */
+ if(wasTVG && theme!=="tvguide1990"){
+ document.querySelectorAll(".chan-col .chan-name").forEach(el=>{
+ const name=el.dataset.name||"Channel";
+ const logo=el.dataset.logo;
+ el.innerHTML=logo?`
${name}`:`
${name}`;
+ });
+ document.querySelectorAll(".grid-row,.chan-col").forEach(r=>r.style.height="");
+ }
+
+ /* ๐จ Inject number capsules for TV Guide 1990 */
+ if(theme==="tvguide1990") requestAnimationFrame(applyTvGuide1990Capsules);
+
+ /* end fade back in */
+ setTimeout(()=>b.classList.remove("fade-switch"),100);
+ },150);
}
-// On load, apply saved theme or default
-document.addEventListener("DOMContentLoaded", () => {
- const savedTheme = localStorage.getItem("theme") || "dark";
- setTheme(savedTheme);
+function applyTvGuide1990Capsules(){
+ document.querySelectorAll(".chan-col .chan-name").forEach((box,i)=>{
+ if(box.querySelector(".channel-number")) return;
+ const cap=document.createElement("span");
+ cap.className="channel-number";
+ cap.textContent=String(i+1);
+ box.innerHTML="";
+ box.appendChild(cap);
+ });
+}
+
+document.addEventListener("DOMContentLoaded",()=>{
+ const t=localStorage.getItem("theme")||"dark";
+ setTheme(t);
+ if(t==="tvguide1990") requestAnimationFrame(applyTvGuide1990Capsules);
});
function updateClock() {
@@ -495,16 +782,28 @@
Program Info
}
}
-function updateNowLine() {
- const gridStart = new Date("{{ grid_start.isoformat() }}");
- const scale = {{ SCALE }};
- const now = new Date();
- const minutesFromStart = (now - gridStart) / 60000;
- const nl = document.getElementById('nowLine');
- if (nl) nl.style.left = (minutesFromStart * scale) + "px";
-}
-
+
+
@@ -522,8 +821,6 @@
Program Info
document.getElementById("settingsMenu")?.remove();
document.getElementById("manageUsersMenu")?.remove();
- // Remove the HOME link
- const homeLink = document.querySelector('.header .links a[href*="guide"]');
if (homeLink) homeLink.remove();
// Insert simplified Themes dropdown
From 61f8ea856f422b1ebd5540631d2d055a3c6e533f Mon Sep 17 00:00:00 2001
From: thehack904 <35552907+thehack904@users.noreply.github.com>
Date: Wed, 22 Oct 2025 21:56:21 -0500
Subject: [PATCH 2/6] Updated AOL / CompuServe
---
templates/guide.html | 453 +++++++++++++++++++++++++------------------
1 file changed, 263 insertions(+), 190 deletions(-)
diff --git a/templates/guide.html b/templates/guide.html
index 59e6e77..a620457 100644
--- a/templates/guide.html
+++ b/templates/guide.html
@@ -26,109 +26,144 @@
.dropdown:hover .dropdown-content { display:block; }
/* Submenu (fly-out for Themes) */
- .submenu {
- position: relative;
- }
- .submenu > a {
- display: flex;
- justify-content: space-between;
- align-items: center;
- }
- .submenu-content {
- display: none;
- position: absolute;
- top: 0;
- left: 100%; /* fly out to the right */
- background-color: #333;
- min-width: 160px;
- border-radius: 3px;
- box-shadow: 0 4px 6px rgba(0,0,0,0.3);
- z-index: 10;
- }
- .submenu-content li a {
- padding: 10px 14px;
- display: block;
- color: #eee;
- text-decoration: none;
- }
- .submenu-content li a:hover {
- background-color: #0af;
- color: #fff;
- }
- .submenu:hover .submenu-content {
- display: block;
- }
+ .submenu { position: relative; }
+ .submenu > a { display: flex; justify-content: space-between; align-items: center; }
+ .submenu-content { display: none; position: absolute; top: 0; left: 100%; background-color: #333; min-width: 160px; border-radius: 3px; box-shadow: 0 4px 6px rgba(0,0,0,0.3); z-index: 10; }
+ .submenu-content li a { padding: 10px 14px; display: block; color: #eee; text-decoration: none; }
+ .submenu-content li a:hover { background-color: #0af; color: #fff; }
+ .submenu:hover .submenu-content { display: block; }
/* Remove default list bullets and padding for all dropdowns & submenus */
.dropdown-content,
.submenu ul,
- .submenu-content {
- list-style: none;
- margin: 0;
- padding: 0;
- }
+ .submenu-content { list-style: none; margin: 0; padding: 0; }
/* Player row: Program Info (left) | Video (right) */
.player { display:flex; gap:16px; padding:12px; }
.summary { flex:1; }
#video { width:620px; height:350px; }
- /* Guide grid */
- .guide-outer {
- height: calc(100vh - 420px);
- overflow-y: auto;
- padding-bottom: 80px;
- position: relative;
- }
- .guide-row { display:flex; }
- .chan-col { width: 200px; flex-shrink:0; border-right:1px solid; position: relative; z-index: 2; background: var(--chan-col-bg, #1a1a1a); }
- .grid-col { position:relative; flex:1; overflow-x:auto; overflow-y:visible; z-index:1; }
- .chan-header { height: 34px; border-bottom:1px solid; position:sticky; top:0; z-index:5; }
- .time-header-wrap { position:sticky; top:0; z-index:6; border-bottom:1px solid; }
-
- .time-cell { flex:0 0 {{ 30*SCALE }}px; width:{{ 30*SCALE }}px; text-align:center; border-right:1px solid; font-weight:600; }
- .chan-name {
- padding: 10px; height: auto; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
- gap: 6px; border-bottom: 1px solid; cursor: pointer; position: relative; z-index: 10; pointer-events: auto; user-select: none;
- }
- .chan-name img { width:36px; height:36px; object-fit:contain; margin-bottom: 4px; }
- .grid-row { position:relative; height:60px; border-bottom:1px solid; }
- .grid-content { position:relative; width: {{ total_width }}px; min-height:100%; }
- .program { position:absolute; top:6px; height:48px; border:1px solid; padding:4px 6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
- font-size:12px; border-radius:6px; z-index:1; } /* ensure fixed header sits above programs */
- .program.now { font-weight:bold; }
- .now-line { position:absolute; top:0; bottom:0; width:2px; z-index:8; pointer-events:none; left: {{ now_offset }}px; }
+/* === REPLACE the existing "Guide grid" block with the code below === */
+
+/* Guide grid */
+.guide-outer {
+ height: calc(100vh - 420px);
+ overflow-y: auto;
+ padding-bottom: 80px;
+ position: relative;
+}
+
+.guide-row { display:flex; }
+
+.chan-col {
+ width: 200px;
+ flex-shrink:0;
+ border-right:1px solid;
+ position: relative;
+ z-index: 2;
+ background: var(--chan-col-bg, #1a1a1a);
+}
+
+/* NOTE: grid-col now allows vertical scrolling but we hide visual scrollbars by default */
+.grid-col {
+ position:relative;
+ flex:1;
+ overflow-x:auto;
+ overflow-y:auto; /* allow vertical scrolling but hide visuals by default */
+ z-index:1;
+
+ /* Firefox: hide scrollbar */
+ scrollbar-width: none;
+ /* IE10+ */
+ -ms-overflow-style: none;
+}
+
+/* hide webkit scrollbars by default */
+.grid-col::-webkit-scrollbar {
+ width: 0;
+ height: 0;
+}
+
+/* keep headers same */
+.chan-header { height: 34px; border-bottom:1px solid; position:sticky; top:0; z-index:5; }
+.time-header-wrap { position:sticky; top:0; z-index:6; border-bottom:1px solid; }
+
+.time-cell { flex:0 0 {{ 30*SCALE }}px; width:{{ 30*SCALE }}px; text-align:center; border-right:1px solid; font-weight:600; }
+
+.chan-name {
+ padding: 10px;
+ height: auto;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ text-align: center;
+ gap: 6px;
+ border-bottom: 1px solid;
+ cursor: pointer;
+ position: relative;
+ z-index: 10;
+ pointer-events: auto;
+ user-select: none;
+}
+.chan-name img { width:36px; height:36px; object-fit:contain; margin-bottom: 4px; }
+
+.grid-row { position:relative; height:60px; border-bottom:1px solid; }
+.grid-content { position:relative; width: {{ total_width }}px; min-height:100%; }
+.program {
+ position:absolute;
+ top:6px;
+ height:48px;
+ border:1px solid;
+ padding:4px 6px;
+ overflow:hidden;
+ text-overflow:ellipsis;
+ white-space:nowrap;
+ font-size:12px;
+ border-radius:6px;
+ z-index:1;
+} /* ensure fixed header sits above programs */
+.program.now { font-weight:bold; }
+.now-line { position:absolute; top:0; bottom:0; width:2px; z-index:8; pointer-events:none; left: {{ now_offset }}px; }
+
+/* === Scrollbar reveal styles ===
+ We hide the native scrollbars by default (cross-browser) and show a thin, themed scrollbar
+ when .show-scroll is present (or the element has keyboard focus via :focus-within).
+*/
+.grid-col.show-scroll,
+.grid-col:focus-within {
+ /* Firefox: show thin scrollbar when revealed */
+ scrollbar-width: thin;
+}
+
+/* Webkit: styled visible scrollbar when .show-scroll is added */
+.grid-col.show-scroll::-webkit-scrollbar {
+ width: 10px; /* vertical scrollbar width */
+ height: 8px; /* horizontal scrollbar height (if any) */
+}
+.grid-col.show-scroll::-webkit-scrollbar-track {
+ background: rgba(0,0,0,0.08);
+ border-radius: 6px;
+}
+.grid-col.show-scroll::-webkit-scrollbar-thumb {
+ background: rgba(0,0,0,0.28);
+ border-radius: 6px;
+ border: 2px solid transparent;
+ background-clip: padding-box;
+}
/* Fixed time header (new) */
- .time-header-fixed {
- position: fixed;
- z-index: 1200; /* high so it always sits on top */
- left: 0; /* now covers entire viewport width; we add a left spacer to keep times aligned */
- display: flex;
- align-items: stretch;
- overflow: hidden;
- background: transparent; /* spacer will paint the left channel background */
- box-shadow: 0 2px 6px rgba(0,0,0,0.12);
- height: 34px;
- top: 0; /* set by JS */
- }
+ .time-header-fixed { position: fixed; z-index: 1200; left: 0; display: flex; align-items: stretch; overflow: hidden; background: transparent; box-shadow: 0 2px 6px rgba(0,0,0,0.12); height: 34px; top: 0; /* set by JS */ }
.time-header-fixed .grid-content { display:flex; align-items:stretch; position:relative; height:100%; width:100%; }
.time-header-fixed .time-header { display:flex; align-items:center; height:100%; flex: 0 0 auto; }
.time-header-fixed .time-cell { display:inline-flex; align-items:center; justify-content:center; height:100%; border-right:1px solid var(--timebar-border, #ccc); padding:0 6px; font-weight:600; background: var(--timebar-bg, rgba(255,255,255,0.95)); color:var(--timebar-color,#000); }
.time-header-fixed .now-line { position:absolute; top:0; bottom:0; width:2px; z-index:1300; pointer-events:none; }
- .time-header-fixed .left-spacer {
- flex: 0 0 auto;
- height:100%;
- background: var(--chan-col-bg, #1a1a1a);
- border-right: 1px solid var(--timebar-border, rgba(0,0,0,0.12));
- }
+ .time-header-fixed .left-spacer { flex: 0 0 auto; height:100%; background: var(--chan-col-bg, #1a1a1a); border-right: 1px solid var(--timebar-border, rgba(0,0,0,0.12)); }
/* Keep original in-grid time header hidden when using fixed header */
.hide-in-grid .time-header-wrap { visibility: hidden; height: 0; margin:0; padding:0; }
- /* Theme-specific timebar and channel background variables (so fixed bar and the left spacer match theme) */
-
/* Dark theme */
body.dark { --timebar-bg:#222; --timebar-border:#444; --timebar-color:#ddd; --chan-col-bg:#1a1a1a; background:#111; color:#ddd; }
body.dark .time-header-fixed .now-line { background:#0f0; }
@@ -163,125 +198,137 @@
body.light .program.now { background:#cfe8cf; border-color:#090; }
body.light .now-line { background:#090; }
- /* Retro AOL / CompuServe Theme */
- body.retro-aol { --timebar-bg:#2f4f4f; --timebar-border:#33cccc; --timebar-color:#000; --chan-col-bg:#2f4f4f; }
- body.retro-aol .time-header-fixed .now-line { background:#090; }
- body.retro-aol { --timebar-bg: #2f4f4f; --timebar-border: #33cccc; --timebar-color: #000; --now-line-color: #090; --chan-col-bg: #2f4f4f; }
- body.retro-aol { background:#2f4f4f; color:#f0f0f0; font-family:"Tahoma","Arial",sans-serif; }
- body.retro-aol .header { background:#004466; color:#ffcc00; border-bottom:2px solid #33cccc; }
- body.retro-aol #video { background:#000; }
- body.retro-aol .summary { color:#e0e0e0; }
- body.retro-aol .chan-col { background:#355f5f; border-color:#33cccc; }
- body.retro-aol .grid-col { background:#3b6b6b; }
- body.retro-aol .chan-header,
- body.retro-aol .time-header-wrap { background:#004466; color:#ffcc00; border-color:#33cccc; }
- body.retro-aol .time-cell { color:#ffcc00; border-color:#1a3d3d; }
- body.retro-aol .chan-name { color:#ffffff; border-color:#33cccc; font-weight:bold; }
- body.retro-aol .program { background:#406d6d; border-color:#33cccc; color:#ffffff; }
- body.retro-aol .program.now { background:#33cccc; border-color:#004466; color:#000; font-weight:bold; }
- body.retro-aol .now-line { background:#ffcc00; }
+ /* compacted retro-aol theme + scrollbar reveal (drop-in replacement) */
+body.retro-aol{--timebar-bg:#004466;--timebar-border:#33cccc;--timebar-color:#33cccc;--now-line-color:#090;--chan-col-bg:#004466;--panel-bg-top:#e6f7f5;--panel-bg-bottom:#cfeff0;--now-line-panel-color:var(--panel-bg-top);--now-line-glow:rgba(198,242,240,0.6);background:#2f4f4f;color:#f0f0f0;font-family:"Tahoma","Arial",sans-serif}
+body.retro-aol .header{background:#004466;color:#ffcc00;border-bottom:2px solid #33cccc}
+body.retro-aol .dropdown-content,body.retro-aol .submenu-content{background:#004466;border:1px solid #33cccc;color:#ffcc01;box-shadow:0 4px 6px rgba(0,0,0,.3)}
+body.retro-aol .dropdown-content a,body.retro-aol .submenu-content li a,body.retro-aol .dropdown-content .submenu> a,body.retro-aol .submenu-content .submenu> a{color:#ffcc01!important}
+body.retro-aol .dropdown-content a:hover,body.retro-aol .submenu-content li a:hover{background:#33cccc!important;color:#004466!important}
+body.retro-aol .summary{background:linear-gradient(to bottom,var(--panel-bg-top) 0%,var(--panel-bg-bottom) 100%);color:#00313a;border:2px solid #004466;border-top-color:#66e0e0;border-left-color:#66e0e0;border-right-color:#004466;border-bottom-color:#004466;box-shadow:4px 4px 0 rgba(0,0,0,.28);padding:12px;border-radius:6px;box-sizing:border-box}
+body.retro-aol .summary h3{margin:0 0 6px 0;color:#004466;font-size:1.05em;font-weight:700}
+body.retro-aol .summary p{margin:0;color:#05383a;line-height:1.3}
+body.retro-aol .time-header-fixed .now-line,body.retro-aol .now-line{background:var(--now-line-panel-color);box-shadow:0 0 6px var(--now-line-glow);width:3px}
+body.retro-aol .chan-col{background:#355f5f;border-color:#33cccc}
+body.retro-aol .grid-col{background:#3b6b6b}
+body.retro-aol .chan-header,body.retro-aol .time-header-wrap{background:#3b6b6b;color:#ffcc00;border-color:#33cccc}
+body.retro-aol .time-cell{color:#ffcc00;border-color:var(--timebar-border,#33cccc);border-top:1px solid var(--timebar-border,#33cccc)}
+body.retro-aol .time-header-fixed .time-cell{border-top:1px solid var(--timebar-border,#33cccc)}
+body.retro-aol .chan-name{color:#fff;border-color:#33cccc;font-weight:700}
+body.retro-aol .program{background:#406d6d;border-color:#33cccc;color:#fff}
+body.retro-aol .program.now{background:#33cccc;border-color:#004466;color:#000;font-weight:700}
+body.retro-aol .now-line{background:#ffcc00}
+body.retro-aol .header .links>a,body.retro-aol .header .links>.dropdown>.dropbtn,body.retro-aol .header .links>span,body.retro-aol .header .links>div#clock{color:#ffcc01}
+
+/* guide grid scrollbar rules (compact) */
+/*.grid-col{position:relative;flex:1;overflow-x:auto;overflow-y:auto;z-index:1;scrollbar-width:none;-ms-overflow-style:none}
+.grid-col::-webkit-scrollbar{width:0;height:0}
+.grid-col.show-scroll,.grid-col:focus-within{scrollbar-width:thin}
+.grid-col.show-scroll::-webkit-scrollbar{width:10px;height:8px}
+.grid-col.show-scroll::-webkit-scrollbar-track{background:rgba(0,0,0,.08);border-radius:6px}
+.grid-col.show-scroll::-webkit-scrollbar-thumb{background:rgba(0,0,0,.28);border-radius:6px;border:2px solid transparent;background-clip:padding-box} */
+body.retro-aol .grid-col.show-scroll::-webkit-scrollbar-thumb{background:rgba(0,68,102,.55)}
+body.retro-aol .grid-col.show-scroll::-webkit-scrollbar-track{background:rgba(51,204,204,.06)}
/* === RetroIPTVGuide Theme: TV Guide 1990 Edition (Final Compact) === */
body.tvguide1990 { --timebar-bg: #fff; --timebar-border: #000; --timebar-color: #000; --chan-col-bg: #d8d7d3; }
body.tvguide1990 .time-header-fixed { box-shadow:none; }
body.tvguide1990 .time-header-fixed .now-line { background:#000; height:3px; }
body.tvguide1990 { --timebar-bg: #fff; --timebar-border: #000; --timebar-color: #000; --now-line-color: #000; --chan-col-bg: #d8d7d3; }
- body.tvguide1990{background:#d8d7d3;color:#000;font-family:'Times New Roman',serif;font-size:.9em;}
- body.tvguide1990 .header{background:#fff;color:#000;border-bottom:2px solid #000;box-shadow:none;}
- body.tvguide1990 .header .links>a,
- body.tvguide1990 .header .links>.dropdown>.dropbtn,
- body.tvguide1990 .header .links>span,
- body.tvguide1990 .header .links>#clock{color:#000!important;background:#fff!important;}
- body.tvguide1990 .header .links>a:hover,
- body.tvguide1990 .header .links>.dropdown:hover>.dropbtn{background:#e0e0e0!important;color:#000!important;}
- body.tvguide1990 .dropdown-content{background:#fff!important;color:#000!important;border:1px solid #000!important;box-shadow:none!important;}
- body.tvguide1990 .dropdown-content a{color:#000!important;}
- body.tvguide1990 .dropdown-content a:hover{background:#e0e0e0!important;color:#000!important;}
- body.tvguide1990 .submenu-content{background:#fff!important;border:1px solid #000!important;box-shadow:none!important;z-index:1000;}
- body.tvguide1990 .submenu-content li a{color:#000!important;}
- body.tvguide1990 .submenu-content li a:hover{background:#e0e0e0!important;color:#000!important;}
- body.tvguide1990 .dropdown-content .submenu>a{color:#000!important;padding-right:22px!important;position:relative;}
- body.tvguide1990 .dropdown-content .submenu>a::after{content:"โธ";position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#000;}
- body.tvguide1990 .dropdown-content .submenu:hover>a{background:#e0e0e0!important;color:#000!important;}
- body.tvguide1990 .footer{background:transparent;color:#000;border-top:2px solid #000;}
- body.tvguide1990 .chan-name img{display:none!important;}
- body.tvguide1990 .chan-name span:not(.channel-number){display:none!important;}
- body.tvguide1990 .chan-col{height:38px!important;padding:2px 0!important;display:flex;align-items:center;justify-content:center;background:#d8d7d3;border-bottom:1px solid #000;}
- body.tvguide1990 .guide-row>.chan-col{border-right:1px solid #000!important;} /* vertical divider */
- body.tvguide1990 .channel-number{display:inline-flex;align-items:center;justify-content:center;font-family:'Arial Narrow','Helvetica Neue',sans-serif;font-weight:700;font-size:.9em;min-width:32px;padding:3px 12px;border-radius:999px;background:#000;color:#fff;letter-spacing:-.2px;border:1px solid #000;line-height:1;transform:scale(.9);}
- body.tvguide1990 .chan-header{border-bottom:none!important;}
- body.tvguide1990 .guide-row{align-items:stretch!important;}
- body.tvguide1990 .time-header-wrap{border-top:1px solid #000!important;border-bottom:1px solid #000!important;margin-bottom:0!important;padding-bottom:0!important;height:38px!important;box-sizing:border-box;}
- body.tvguide1990 .chan-col{height:38px!important;box-sizing:border-box;}
- body.tvguide1990 .grid-content,body.tvguide1990 .time-header{transform:scaleX(.9);transform-origin:left center;}
- body.tvguide1990 .time-cell{border-right:1px solid #000;color:#000;font-weight:700;font-size:.8em;padding:0 2px;min-width:0;}
- body.tvguide1990 .grid-row{height:38px!important;position:relative;padding:1px 0;box-sizing:border-box;border-bottom:1px solid #000;}
- body.tvguide1990 .program,
- body.tvguide1990 .program.now{position:absolute;top:1px!important;height:calc(100% - 2px)!important;margin:0!important;padding:2px 4px!important;border:1px solid #000;box-sizing:border-box;border-radius:0!important;line-height:1.2;font-size:.8em!important;display:flex;align-items:center;background:#fff;font-weight:400!important;}
- body.tvguide1990 .program.now{background:#e7e5dd!important;font-weight:700!important;}
- body.tvguide1990 .grid-col{overflow-x:auto!important;overflow-y:hidden!important;height:38px!important;box-sizing:border-box;}
- body.tvguide1990 .grid-content{height:100%!important;}
- body.tvguide1990 #clock::before{content:"IPTV GUIDE";display:inline-block;margin-right:10px;padding:4px 10px;background:#fff;color:#000;font-weight:900;font-size:12px;line-height:1;border-radius:50px;border:2px solid #000;box-shadow:none;letter-spacing:.3px;vertical-align:middle;}
- body.tvguide1990 #summary{border:2px solid #000;background:#fff;padding:12px;margin:10px;box-shadow:2px 2px 5px rgba(0,0,0,.25);}
- body.tvguide1990 #video{border:2px solid #000;background:#000;box-shadow:3px 3px 6px rgba(0,0,0,.35);}
- body.tvguide1990 .chan-col{position:relative;}
- body.tvguide1990 .chan-col::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:20px;height:60%;background:#000;border-right:1px solid #000;}
-
+ body.tvguide1990{background:#d8d7d3;color:#000;font-family:'Times New Roman',serif;font-size:.9em;}
+ body.tvguide1990 .header{background:#fff;color:#000;border-bottom:2px solid #000;box-shadow:none;}
+ body.tvguide1990 .header .links>a,
+ body.tvguide1990 .header .links>.dropdown>.dropbtn,
+ body.tvguide1990 .header .links>span,
+ body.tvguide1990 .header .links>#clock{color:#000!important;background:#fff!important;}
+ body.tvguide1990 .header .links>a:hover,
+ body.tvguide1990 .header .links>.dropdown:hover>.dropbtn{background:#e0e0e0!important;color:#000!important;}
+ body.tvguide1990 .dropdown-content{background:#fff!important;color:#000!important;border:1px solid #000!important;box-shadow:none!important;}
+ body.tvguide1990 .dropdown-content a{color:#000!important;}
+ body.tvguide1990 .dropdown-content a:hover{background:#e0e0e0!important;color:#000!important;}
+ body.tvguide1990 .submenu-content{background:#fff!important;border:1px solid #000!important;box-shadow:none!important;z-index:1000;}
+ body.tvguide1990 .submenu-content li a{color:#000!important;}
+ body.tvguide1990 .submenu-content li a:hover{background:#e0e0e0!important;color:#000!important;}
+ body.tvguide1990 .dropdown-content .submenu>a{color:#000!important;padding-right:22px!important;position:relative;}
+ body.tvguide1990 .dropdown-content .submenu>a::after{content:"โธ";position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#000;}
+ body.tvguide1990 .dropdown-content .submenu:hover>a{background:#e0e0e0!important;color:#000!important;}
+ body.tvguide1990 .footer{background:transparent;color:#000;border-top:2px solid #000;}
+ body.tvguide1990 .chan-name img{display:none!important;}
+ body.tvguide1990 .chan-name span:not(.channel-number){display:none!important;}
+ body.tvguide1990 .chan-col{height:38px!important;padding:2px 0!important;display:flex;align-items:center;justify-content:center;background:#d8d7d3;border-bottom:1px solid #000;}
+ body.tvguide1990 .guide-row>.chan-col{border-right:1px solid #000!important;} /* vertical divider */
+ body.tvguide1990 .channel-number{display:inline-flex;align-items:center;justify-content:center;font-family:'Arial Narrow','Helvetica Neue',sans-serif;font-weight:700;font-size:.9em;min-width:32px;padding:3px 12px;border-radius:999px;background:#000;color:#fff;letter-spacing:-.2px;border:1px solid #000;line-height:1;transform:scale(.9);}
+ body.tvguide1990 .chan-header{border-bottom:none!important;}
+ body.tvguide1990 .guide-row{align-items:stretch!important;}
+ body.tvguide1990 .time-header-wrap{border-top:1px solid #000!important;border-bottom:1px solid #000!important;margin-bottom:0!important;padding-bottom:0!important;height:38px!important;box-sizing:border-box;}
+ body.tvguide1990 .chan-col{height:38px!important;box-sizing:border-box;}
+ body.tvguide1990 .grid-content,body.tvguide1990 .time-header{transform:scaleX(.9);transform-origin:left center;}
+ body.tvguide1990 .time-cell{border-right:1px solid #000;color:#000;font-weight:700;font-size:.8em;padding:0 2px;min-width:0;}
+ body.tvguide1990 .grid-row{height:38px!important;position:relative;padding:1px 0;box-sizing:border-box;border-bottom:1px solid #000;}
+ body.tvguide1990 .program,
+ body.tvguide1990 .program.now{position:absolute;top:1px!important;height:calc(100% - 2px)!important;margin:0!important;padding:2px 4px!important;border:1px solid #000;box-sizing:border-box;border-radius:0!important;line-height:1.2;font-size:.8em!important;display:flex;align-items:center;background:#fff;font-weight:400!important;}
+ body.tvguide1990 .program.now{background:#e7e5dd!important;font-weight:700!important;}
+ body.tvguide1990 .grid-col{overflow-x:auto!important;overflow-y:hidden!important;height:38px!important;box-sizing:border-box;}
+ body.tvguide1990 .grid-content{height:100%!important;}
+ body.tvguide1990 #clock::before{content:"IPTV GUIDE";display:inline-block;margin-right:10px;padding:4px 10px;background:#fff;color:#000;font-weight:900;font-size:12px;line-height:1;border-radius:50px;border:2px solid #000;box-shadow:none;letter-spacing:.3px;vertical-align:middle;}
+ body.tvguide1990 #summary{border:2px solid #000;background:#fff;padding:12px;margin:10px;box-shadow:2px 2px 5px rgba(0,0,0,.25);}
+ body.tvguide1990 #video{border:2px solid #000;background:#000;box-shadow:3px 3px 6px rgba(0,0,0,.35);}
+ body.tvguide1990 .chan-col{position:relative;}
+ body.tvguide1990 .chan-col::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:20px;height:60%;background:#000;border-right:1px solid #000;}
/* DirecTV */
body.directv { --timebar-bg:#002b80; --timebar-border:#001f66; --timebar-color:#d8ebff; --chan-col-bg:#001b50; }
body.directv .time-header-fixed .now-line { background:#ffcc00; }
body.directv { --timebar-bg: #002b80; --timebar-border: #001f66; --timebar-color: #d8ebff; --now-line-color: #ffcc00; --chan-col-bg: #001b50; }
- body.directv { background:#001a66; color:#fff; font-family:"Segoe UI","Arial",sans-serif; }
- body.directv .header { background:linear-gradient(to bottom,#1d72ff,#003a8c); border-bottom:2px solid #001f66; }
- body.directv .header .links > a, body.directv .header .links > .dropdown > .dropbtn, body.directv .header .links > span, body.directv .header .links > div#clock { color:#ffffff !important; font-weight:bold !important; text-shadow:1px 1px 2px #000 !important; }
- body.directv .header .links > a:hover, body.directv .header .links > .dropdown:hover > .dropbtn { background:#003f9e !important; color:#ffd802 !important; }
- body.directv .dropdown-content, body.directv .submenu-content { background:#003a8c !important; border:1px solid #0070ff !important; box-shadow:0 4px 8px rgba(0,0,0,.4) !important; }
- body.directv .dropdown-content a, body.directv .submenu-content li a { color:#ffffff !important; font-weight:bold !important; }
- body.directv .dropdown-content a:hover, body.directv .submenu-content li a:hover { background:#0070ff !important; color:#fff !important; }
- body.directv .dropdown-content .submenu > a { color:#fff !important; padding-right:28px !important; position:relative; }
- body.directv .dropdown-content .submenu > a::after { content:"โธ"; position:absolute; right:10px; top:50%; transform:translateY(-50%); color:#fff; }
- body.directv .dropdown-content .submenu:hover > a { background:#0070ff !important; color:#fff !important; }
- body.directv .summary, body.directv #program-info { background:linear-gradient(to bottom,#66b2ff,#003f9e); color:#fff; border:1px solid #004bdb; }
- body.directv .time-header-wrap { background:#002b80; color:#d8ebff; border-bottom:2px solid #001f66; }
- body.directv .time-cell { background:#002b80; color:#b9dcff; border-color:#001f66; font-weight:bold; }
- body.directv .chan-col { background:#001f66; border-right:1px solid #004bdb; color:#fff; font-weight:bold; text-shadow:1px 1px 2px #000; }
- body.directv .chan-header { background:linear-gradient(to bottom,#0b3b8c,#3c8dff); color:#fff; border-color:#003b91; }
- body.directv .grid-col { background:#001f66; }
- body.directv .program { background:#003a8c; border:1px solid #004bdb; color:#fff; border-radius:2px; }
- body.directv .program.now { background:#ffd802; border:1px solid #caa600; color:#000; font-weight:bold; box-shadow:none; }
- body.directv .program:hover { background:linear-gradient(to right,#1d67d9,#7fbfff); color:#fff; }
- body.directv .now-line { background:#ffcc00; }
- body.directv .footer { background:linear-gradient(to top,#001f66,#004bdb); color:#fff; border-top:2px solid #003580; padding:5px 10px; font-size:0.9em; }
- body.directv .footer .dot-red { color:#ff3c3c; } body.directv .footer .dot-green { color:#00cc00; } body.directv .footer .dot-yellow { color:#ffd700; } body.directv .footer .dot-blue { color:#4ca9ff; }
- body.directv #video { background:#000; border:2px solid #004bdb; box-shadow:0 0 6px rgba(0,0,0,0.6); }
- body.directv #clock::before { content:"IPTV GUIDE"; display:inline-block; margin-right:10px; padding:3px 8px; background:#e41e26; color:#fff; font-weight:900; font-size:12px; line-height:1; border-radius:3px; border:1px solid rgba(255,255,255,.85); box-shadow:0 1px 2px rgba(0,0,0,.35); letter-spacing:.4px; vertical-align:middle; }
+ body.directv { background:#001a66; color:#fff; font-family:"Segoe UI","Arial",sans-serif; }
+ body.directv .header { background:linear-gradient(to bottom,#1d72ff,#003a8c); border-bottom:2px solid #001f66; }
+ body.directv .header .links > a, body.directv .header .links > .dropdown > .dropbtn, body.directv .header .links > span, body.directv .header .links > div#clock { color:#ffffff !important; font-weight:bold !important; text-shadow:1px 1px 2px #000 !important; }
+ body.directv .header .links > a:hover, body.directv .header .links > .dropdown:hover > .dropbtn { background:#003f9e !important; color:#ffd802 !important; }
+ body.directv .dropdown-content, body.directv .submenu-content { background:#003a8c !important; border:1px solid #0070ff !important; box-shadow:0 4px 8px rgba(0,0,0,.4) !important; }
+ body.directv .dropdown-content a, body.directv .submenu-content li a { color:#ffffff !important; font-weight:bold !important; }
+ body.directv .dropdown-content a:hover, body.directv .submenu-content li a:hover { background:#0070ff !important; color:#fff !important; }
+ body.directv .dropdown-content .submenu > a { color:#fff !important; padding-right:28px !important; position:relative; }
+ body.directv .dropdown-content .submenu > a::after { content:"โธ"; position:absolute; right:10px; top:50%; transform:translateY(-50%); color:#fff; }
+ body.directv .dropdown-content .submenu:hover > a { background:#0070ff !important; color:#fff !important; }
+ body.directv .summary, body.directv #program-info { background:linear-gradient(to bottom,#66b2ff,#003f9e); color:#fff; border:1px solid #004bdb; }
+ body.directv .time-header-wrap { background:#002b80; color:#d8ebff; border-bottom:2px solid #001f66; }
+ body.directv .time-cell { background:#002b80; color:#b9dcff; border-color:#001f66; font-weight:bold; }
+ body.directv .chan-col { background:#001f66; border-right:1px solid #004bdb; color:#fff; font-weight:bold; text-shadow:1px 1px 2px #000; }
+ body.directv .chan-header { background:linear-gradient(to bottom,#0b3b8c,#3c8dff); color:#fff; border-color:#003b91; }
+ body.directv .grid-col { background:#001f66; }
+ body.directv .program { background:#003a8c; border:1px solid #004bdb; color:#fff; border-radius:2px; }
+ body.directv .program.now { background:#ffd802; border:1px solid #caa600; color:#000; font-weight:bold; box-shadow:none; }
+ body.directv .program:hover { background:linear-gradient(to right,#1d67d9,#7fbfff); color:#fff; }
+ body.directv .now-line { background:#ffcc00; }
+ body.directv .footer { background:linear-gradient(to top,#001f66,#004bdb); color:#fff; border-top:2px solid #003580; padding:5px 10px; font-size:0.9em; }
+ body.directv .footer .dot-red { color:#ff3c3c; } body.directv .footer .dot-green { color:#00cc00; } body.directv .footer .dot-yellow { color:#ffd700; } body.directv .footer .dot-blue { color:#4ca9ff; }
+ body.directv #video { background:#000; border:2px solid #004bdb; box-shadow:0 0 6px rgba(0,0,0,0.6); }
+ body.directv #clock::before { content:"IPTV GUIDE"; display:inline-block; margin-right:10px; padding:3px 8px; background:#e41e26; color:#fff; font-weight:900; font-size:12px; line-height:1; border-radius:3px; border:1px solid rgba(255,255,255,.85); box-shadow:0 1px 2px rgba(0,0,0,.35); letter-spacing:.4px; vertical-align:middle; }
/* Comcast */
body.comcast { --timebar-bg:linear-gradient(to bottom,#0055cc,#001b50); --timebar-border:#003090; --timebar-color:#fff; --chan-col-bg:#001b50; }
body.comcast .time-header-fixed .now-line { background:#ffcc00; }
body.comcast { --timebar-bg: linear-gradient(to bottom,#0055cc,#001b50); --timebar-border: #003090; --timebar-color: #fff; --now-line-color: #ffcc00; --chan-col-bg: #001b50; }
body.comcast { background:#001b50; color:#fff; font-family:"Segoe UI","Arial",sans-serif; }
- body.comcast .header { background:linear-gradient(to bottom,#0055cc,#001b50); border-bottom:2px solid #003090; }
- body.comcast .header .links > a, body.comcast .header .links > .dropdown > .dropbtn, body.comcast .header .links > span, body.comcast .header .links > div#clock { color:#ffffff !important; font-weight:bold !important; text-shadow:1px 1px 2px #000 !important; }
- body.comcast .header .links > a:hover, body.comcast .header .links > .dropdown:hover > .dropbtn { background:#003890 !important; color:#ffcc00 !important; }
- body.comcast .dropdown-content, body.comcast .submenu-content { background:#002a70 !important; border:1px solid #0044cc !important; box-shadow:0 4px 8px rgba(0,0,0,.4) !important; }
- body.comcast .dropdown-content a, body.comcast .submenu-content li a { color:#ffffff !important; font-weight:bold !important; }
- body.comcast .dropdown-content a:hover, body.comcast .submenu-content li a:hover { background:#0044cc !important; color:#fff !important; }
- body.comcast .summary, body.comcast #program-info { background:linear-gradient(to bottom,#001b50,#003890); color:#fff; border:1px solid #003090; }
- body.comcast .time-header-wrap { background:#003890; color:#bcd8ff; border-bottom:2px solid #002b80; }
- body.comcast .time-cell { background:#003890; color:#ffffff; border-color:#002b80; font-weight:bold; }
- body.comcast .chan-col { background:#001b50; border-right:1px solid #0044cc; color:#fff; font-weight:bold; text-shadow:1px 1px 2px #000; }
- body.comcast .chan-header { background:#002a70; color:#fff; border-color:#0044cc; }
- body.comcast .grid-col { background:#002a70; }
- body.comcast .program { background:#003890; border:1px solid #0044cc; color:#fff; border-radius:2px; }
- body.comcast .program.now { background:#ffffff; border:1px solid #cccccc; color:#000; font-weight:bold; }
- body.comcast .program:hover { background:#0044cc; color:#fff; }
- body.comcast .now-line { background:#ffcc00; }
- body.comcast #video { background:#000; border:2px solid #0044cc; box-shadow:0 0 8px rgba(0,0,0,.6); }
- body.comcast .footer { background:linear-gradient(to top,#001b50,#0044cc); color:#fff; border-top:2px solid #002b80; padding:5px 10px; font-size:0.9em; }
- body.comcast .footer .dot-red { color:#ff3c3c; } body.comcast .footer .dot-green { color:#00cc00; } body.comcast .footer .dot-yellow { color:#ffd700; } body.comcast .footer .dot-blue { color:#4ca9ff; }
- body.comcast #clock::before { content:"IPTV GUIDE"; display:inline-block; margin-right:10px; padding:3px 8px; background:#e41e26; color:#fff; font-weight:900; font-size:12px; line-height:1; border-radius:3px; border:1px solid rgba(255,255,255,.85); box-shadow:0 1px 2px rgba(0,0,0,.35); letter-spacing:.4px; vertical-align:middle; }
+ body.comcast .header { background:linear-gradient(to bottom,#0055cc,#001b50); border-bottom:2px solid #003090; }
+ body.comcast .header .links > a, body.comcast .header .links > .dropdown > .dropbtn, body.comcast .header .links > span, body.comcast .header .links > div#clock { color:#ffffff !important; font-weight:bold !important; text-shadow:1px 1px 2px #000 !important; }
+ body.comcast .header .links > a:hover, body.comcast .header .links > .dropdown:hover > .dropbtn { background:#003890 !important; color:#ffcc00 !important; }
+ body.comcast .dropdown-content, body.comcast .submenu-content { background:#002a70 !important; border:1px solid #0044cc !important; box-shadow:0 4px 8px rgba(0,0,0,.4) !important; }
+ body.comcast .dropdown-content a, body.comcast .submenu-content li a { color:#ffffff !important; font-weight:bold !important; }
+ body.comcast .dropdown-content a:hover, body.comcast .submenu-content li a:hover { background:#0044cc !important; color:#fff !important; }
+ body.comcast .summary, body.comcast #program-info { background:linear-gradient(to bottom,#001b50,#003890); color:#fff; border:1px solid #003090; }
+ body.comcast .time-header-wrap { background:#003890; color:#bcd8ff; border-bottom:2px solid #002b80; }
+ body.comcast .time-cell { background:#003890; color:#ffffff; border-color:#002b80; font-weight:bold; }
+ body.comcast .chan-col { background:#001b50; border-right:1px solid #0044cc; color:#fff; font-weight:bold; text-shadow:1px 1px 2px #000; }
+ body.comcast .chan-header { background:#002a70; color:#fff; border-color:#0044cc; }
+ body.comcast .grid-col { background:#002a70; }
+ body.comcast .program { background:#003890; border:1px solid #0044cc; color:#fff; border-radius:2px; }
+ body.comcast .program.now { background:#ffffff; border:1px solid #cccccc; color:#000; font-weight:bold; }
+ body.comcast .program:hover { background:#0044cc; color:#fff; }
+ body.comcast .now-line { background:#ffcc00; }
+ body.comcast #video { background:#000; border:2px solid #0044cc; box-shadow:0 0 8px rgba(0,0,0,.6); }
+ body.comcast .footer { background:linear-gradient(to top,#001b50,#0044cc); color:#fff; border-top:2px solid #002b80; padding:5px 10px; font-size:0.9em; }
+ body.comcast .footer .dot-red { color:#ff3c3c; } body.comcast .footer .dot-green { color:#00cc00; } body.comcast .footer .dot-yellow { color:#ffd700; } body.comcast .footer .dot-blue { color:#4ca9ff; }
+ body.comcast #clock::before { content:"IPTV GUIDE"; display:inline-block; margin-right:10px; padding:3px 8px; background:#e41e26; color:#fff; font-weight:900; font-size:12px; line-height:1; border-radius:3px; border:1px solid rgba(255,255,255,.85); box-shadow:0 1px 2px rgba(0,0,0,.35); letter-spacing:.4px; vertical-align:middle; }
/* Retro TV Guide Magazine Theme */
body.retro-magazine { background:#ffffff; color:#000000; font-family:"Times New Roman","Georgia",serif; }
@@ -309,7 +356,6 @@
body.retro-magazine #current-tuner { color:#000000 !important; font-weight:bold; }
/* Add other theme variables as needed */
-
body{transition:background-color .3s ease,color .3s ease;}
body.fade-switch{opacity:0;transition:opacity .25s ease;}
@@ -328,9 +374,7 @@
/* If you want submenu children to stack above parent dropdowns too */
.dropdown-content .submenu,
-.submenu-content .submenu {
- z-index: 2200;
-}
+.submenu-content .submenu { z-index: 2200; }
/* If you need to keep the time bar behind menus explicitly, ensure it's lower than header */
.time-header-fixed {
@@ -430,10 +474,8 @@