/* YTUnity centralized day/night color system. Keep all theme colors here. */
/* Shared panels must clear the legacy high-z-index search surface. */
.ytunity-platform-header .nav-right { position:relative!important; z-index:2147483642!important; }
.ytu-spidertaz-home { margin-top: 28px; padding: 32px 0; border-top: 1px solid var(--border-color); text-align: center; }
.ytu-spidertaz-home h2 { margin: 0 0 18px; font-size: 28px; letter-spacing: 0; }
.ytu-spidertaz-home h2 a { color: var(--link-color); }
.ytu-spidertaz-home h2 a:hover { color: var(--link-hover); }
.ytu-spidertaz-form { display: flex; align-items: stretch; gap: 8px; width: 100%; max-width: 640px; margin: 0 auto; }
.ytu-spidertaz-form input { box-sizing: border-box; flex: 1 1 0; min-width: 0; width: 0; height: 46px; padding: 0 10px; border: 1px solid #383838 !important; border-radius: 6px; background: #111 !important; color: #fff !important; font: inherit; font-size: 16px; }
.ytu-spidertaz-form input::placeholder { color: #aaa !important; }
.ytu-spidertaz-form button { box-sizing: border-box; flex: 0 0 auto; height: 46px; padding: 0 20px; border: 1px solid #3766c6; border-radius: 6px; background: linear-gradient(180deg, #4380ef, #2d5bbb); color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.ytu-spidertaz-form button:hover { background: #2d5bbb; }
.ytu-spidertaz-form input:focus-visible, .ytu-spidertaz-form button:focus-visible, .ytu-spidertaz-home a:focus-visible { outline: 2px solid var(--link-color); outline-offset: 3px; }
.ytu-spidertaz-footer { width: 100%; max-width: 340px; margin: 24px auto 0; }
.ytu-spidertaz-footer p { margin: 0 0 10px; text-align: center; font-size: 15px; font-weight: 700; color: var(--site-text); }
:root,
html[data-theme="dark"] {
    /* November 3, 2026: matched to the YTUnity logo (navy night sky, logo red, chrome silver,
       steel blue rim, orange swoosh glow). */
    color-scheme: dark;
    --site-bg: #060a14;
    --site-text: #f2f5fa;
    --heading-text: #ffffff;
    --muted-text: #b8c2d1;
    --muted-text-strong: #dce2ea;
    --card-bg: #0e1626;
    --card-bg-soft: #0a101d;
    --panel-bg: #0e1626;
    --panel-bg-soft: #0a101d;
    --panel-bg-alt: #16233a;
    --field-bg: #080d18;
    --field-text: #f2f5fa;
    --border-color: #2c3d5a;
    --border-soft: #213049;
    --link-color: #7fb4ec;
    --link-hover: #b6d6f8;
    --accent-red: #e3060f;
    --accent-red-strong: #d0000d;
    --accent-red-hover: #de0f19;
    --accent-orange: #ff7a2e;
    --chrome: #d6dbe2;
    --button-secondary-bg: #18243a;
    --button-secondary-hover: #22324e;
    --success-bg: #10291b;
    --success-border: #2c8b4a;
    --success-text: #c9f8d7;
    --error-bg: #311418;
    --error-border: #a63a43;
    --error-text: #ffd5d8;
    --shadow-soft: 0 10px 30px rgba(0,0,0,.38);
    --grid-blue: rgba(52,110,190,.16);
    --grid-blue-soft: rgba(52,110,190,.10);
    --bg: var(--site-bg);
    --panel: var(--card-bg);
    --soft: var(--panel-bg-alt);
    --text: var(--site-text);
    --muted: var(--muted-text);
    --line: var(--border-color);
    --accent: #7fb4ec;
}

html[data-theme="light"] {
    /* Day: chrome silver surfaces, navy text and links, the same logo red. */
    color-scheme: light;
    --site-bg: #eef1f6;
    --site-text: #121a2b;
    --heading-text: #0a1020;
    --muted-text: #4d5a6e;
    --muted-text-strong: #2f3a4d;
    --card-bg: #ffffff;
    --card-bg-soft: #f4f6fa;
    --panel-bg: #ffffff;
    --panel-bg-soft: #f1f4f8;
    --panel-bg-alt: #e4e9f1;
    --field-bg: #ffffff;
    --field-text: #121a2b;
    --border-color: #b7c1cf;
    --border-soft: #d6dce6;
    --link-color: #0b4a94;
    --link-hover: #062f63;
    --accent-red: #d4000f;
    --accent-red-strong: #c0000d;
    --accent-red-hover: #9a000a;
    --accent-orange: #b84a0a;
    --chrome: #5b6678;
    --button-secondary-bg: #e8eef6;
    --button-secondary-hover: #d9e2ed;
    --success-bg: #e8f7ed;
    --success-border: #278347;
    --success-text: #14532d;
    --error-bg: #fff0f1;
    --error-border: #cf3948;
    --error-text: #7f1721;
    --shadow-soft: 0 10px 28px rgba(30,50,80,.12);
    --grid-blue: rgba(11,74,148,.10);
    --grid-blue-soft: rgba(11,74,148,.06);
    --bg: var(--site-bg);
    --panel: var(--card-bg);
    --soft: var(--panel-bg-alt);
    --text: var(--site-text);
    --muted: var(--muted-text);
    --line: var(--border-color);
    --accent: #0b4a94;
}

html, body { background-color: var(--site-bg); color: var(--site-text); }
body {
    background:
        linear-gradient(var(--grid-blue) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid-blue) 1px, transparent 1px),
        linear-gradient(45deg, var(--grid-blue-soft) 2px, transparent 2px),
        linear-gradient(135deg, var(--grid-blue-soft) 2px, transparent 2px),
        radial-gradient(circle at top left, rgba(70,150,235,.12), transparent 38%),
        radial-gradient(circle at top right, rgba(229,9,20,.08), transparent 34%),
        linear-gradient(180deg, var(--site-bg), var(--panel-bg-soft));
    background-size: 10000px 10000px,10000px 10000px,42px 42px,42px 42px,auto,auto,auto;
}

/* Shared surfaces */
.ytunity-platform-header,
.top,
.site-footer,
.card,
.card-hero,
.panel,
.news-band,
.st-gear-panel,
.search-suggestions {
    color: var(--site-text);
    border-color: var(--border-color);
}
.ytunity-platform-header,
.top { background: var(--card-bg-soft) !important; }
.st-gear-panel,
.search-suggestions { background: var(--card-bg) !important; }

/* Inputs and controls */
input, select, textarea,
.nav-search input,
.form-input, .form-select, .form-textarea, .form-file {
    background: var(--field-bg) !important;
    color: var(--field-text) !important;
    border-color: var(--border-color) !important;
}
input::placeholder, textarea::placeholder { color: var(--muted-text) !important; opacity: 1; }
select option { background: var(--field-bg); color: var(--field-text); }

/* Discover pages previously forced dark colors. */
.top form input { background: var(--field-bg) !important; color: var(--field-text) !important; }
.hero { background: linear-gradient(135deg,var(--card-bg),var(--card-bg-soft)) !important; border-color: var(--border-color) !important; }
.card, .panel { background-color: var(--card-bg); }
.thumb { background: var(--panel-bg-alt); }
.title, .brand, .tabs a { color: var(--site-text) !important; }
.meta, .muted, .foot { color: var(--muted-text) !important; }
.badge, .tabs a { background: var(--panel-bg-alt) !important; color: var(--site-text) !important; }
.score { color: var(--heading-text) !important; }
.notice { background: var(--panel-bg-alt) !important; color: var(--site-text); }
.foot { border-color: var(--border-color); }
.category-card { background: var(--card-bg) !important; border-color: var(--border-color) !important; color: var(--site-text) !important; }

/* Navigation readability */
.nav-brand, .nav-link-rail a, .top-nav a, .st-gear-link { color: var(--link-color) !important; }
.nav-brand:hover, .nav-link-rail a:hover, .top-nav a:hover, .st-gear-link:hover { color: var(--link-hover) !important; }
.st-gear-row, .st-gear-toggle { color: var(--site-text) !important; }
.st-gear-row:hover, .st-gear-link:hover { background: var(--panel-bg-alt) !important; }

/* Prevent old hard-coded dark cards from leaking into light mode. */
.card .state-grid li a,
.card .city-grid li a,
.latest-video-item,
.nav-box {
    background: linear-gradient(180deg,var(--card-bg),var(--card-bg-soft)) !important;
    border-color: var(--border-color) !important;
    color: var(--site-text) !important;
}
.card .state-grid li a:hover,
.card .city-grid li a:hover,
.latest-video-item:hover,
.nav-box:hover {
    background: var(--button-secondary-hover) !important;
    border-color: var(--link-color) !important;
}

/* =========================================================
   YTUnity day/night control — authoritative final styling.
   This file loads after the older layout rules, so the switch
   and its settings panel stay readable in both themes.
   ========================================================= */
.st-gear-panel {
    background: var(--card-bg) !important;
    color: var(--site-text) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: var(--shadow-soft) !important;
}

.st-gear-panel .st-gear-head strong {
    color: var(--heading-text) !important;
}

.st-gear-panel .st-gear-head span {
    color: var(--muted-text) !important;
}

.st-gear-panel #themeToggle.st-gear-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    min-height: 46px !important;
    padding: 9px 10px 9px 14px !important;
    background: var(--panel-bg-soft) !important;
    color: var(--site-text) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 13px !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

.st-gear-panel #themeToggle.st-gear-row:hover,
.st-gear-panel #themeToggle.st-gear-row:focus-visible {
    background: var(--button-secondary-hover) !important;
    color: var(--heading-text) !important;
    border-color: var(--link-color) !important;
    outline: none !important;
}

.st-gear-panel #themeToggle span {
    color: inherit !important;
    font-weight: 900 !important;
}

.st-gear-panel #themeToggle strong {
    flex: 0 0 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    margin-left: auto !important;
    border-radius: 999px !important;
    line-height: 1 !important;
    font-size: 17px !important;
    background: var(--button-secondary-bg) !important;
    color: var(--heading-text) !important;
    border: 1px solid var(--border-soft) !important;
}

html[data-theme="light"] .st-gear-panel #themeToggle strong {
    background: #e8eef6 !important;
    color: #172033 !important;
    border-color: #b9c5d4 !important;
}

html[data-theme="dark"] .st-gear-panel #themeToggle strong {
    background: #1b2533 !important;
    color: #ffffff !important;
    border-color: #344154 !important;
}

/* YTUnity multilingual controls */
.ytu-language-picker{display:grid;gap:5px;padding:8px 12px}.ytu-language-picker label{font-size:.75rem;font-weight:700;opacity:.75}.ytu-language-picker select{width:100%;border:1px solid var(--border,#d7dce5);border-radius:8px;padding:8px 10px;background:var(--surface,#fff);color:inherit}.translation-note{margin:.5rem 0 0;font-size:.85rem;opacity:.78}[dir="rtl"] .nav-primary-row,[dir="rtl"] .footer-grid,[dir="rtl"] .watch-layout{direction:rtl}[dir="rtl"] .nav-search input,[dir="rtl"] .watch-description-panel{text-align:right}
.ytu-language-picker button{border:1px solid var(--border-soft,#d7dce5);border-radius:8px;padding:7px 12px;background:var(--button-secondary-bg,#eef2f7);color:var(--heading-text,inherit);font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.ytu-language-picker select:focus-visible,.ytu-language-picker button:focus-visible{outline:2px solid var(--link-color,#2563eb);outline-offset:2px}
.ytu-language-picker--rail{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:0;margin-inline-start:auto}
.ytu-language-picker--rail select{width:auto;max-width:12rem;padding:5px 8px}
.ytu-language-picker--rail button{padding:5px 10px}
.ytu-language-picker--footer{padding:12px 0 0;max-width:16rem}
[dir="rtl"] body,[dir="rtl"] .site-footer,[dir="rtl"] .nav-link-rail{text-align:right}
[dir="rtl"] .st-gear-panel #themeToggle strong{margin-left:0!important;margin-right:auto!important}

/* YTUnity footer separation and network note */
.site-footer { margin-top: 20px; }
.footer-network-note { display: inline-block; margin-top: 4px; opacity: .82; }


/* Hard footer separation: real spacer, not a collapsible margin. */
.site-footer-spacer {
    display: block;
    width: 100%;
    height: 24px;
    min-height: 24px;
    flex: 0 0 24px;
    grid-column: 1 / -1;
}
.site-footer {
    margin-top: 0 !important;
}

/* Channel Watch day/night readability */
html[data-theme="light"] .channel-watch-hero {
    background:
        radial-gradient(circle at top right, rgba(7, 95, 184, .10), transparent 38%),
        linear-gradient(135deg, #ffffff, var(--card-bg-soft)) !important;
    border-color: var(--border-soft) !important;
    color: var(--site-text) !important;
    box-shadow: var(--shadow-soft) !important;
}

html[data-theme="light"] .channel-watch-hero h1,
html[data-theme="light"] .channel-video-title,
html[data-theme="light"] .channel-card-title,
html[data-theme="light"] .watch-creator-row h3 a {
    color: var(--heading-text) !important;
}

html[data-theme="light"] .channel-watch-hero p,
html[data-theme="light"] .channel-watch-heading p,
html[data-theme="light"] .channel-video-meta,
html[data-theme="light"] .channel-video-body p,
html[data-theme="light"] .channel-card-body p,
html[data-theme="light"] .channel-profile-copy p,
html[data-theme="light"] .watch-meta,
html[data-theme="light"] .watch-creator-row p,
html[data-theme="light"] .watch-latest-list small {
    color: var(--muted-text) !important;
}

html[data-theme="light"] .discover-kicker {
    color: #075fb8 !important;
}

html[data-theme="light"] .watch-latest-list a > span {
    color: var(--link-color) !important;
}

html[data-theme="light"] .channel-video-creator,
html[data-theme="light"] .channel-card-action,
html[data-theme="light"] .channel-watch-breadcrumb a,
html[data-theme="light"] .watch-meta a,
html[data-theme="light"] .discover-channel-link {
    color: var(--link-color) !important;
}

html[data-theme="light"] .channel-video-creator:hover,
html[data-theme="light"] .channel-card-action:hover,
html[data-theme="light"] .channel-watch-breadcrumb a:hover,
html[data-theme="light"] .watch-meta a:hover,
html[data-theme="light"] .discover-channel-link:hover {
    color: var(--link-hover) !important;
}

html[data-theme="light"] .channel-tab,
html[data-theme="light"] .channel-video-card,
html[data-theme="light"] .channel-card,
html[data-theme="light"] .channel-profile-hero,
html[data-theme="light"] .watch-copy,
html[data-theme="light"] .watch-panel,
html[data-theme="light"] .watch-pills a,
html[data-theme="light"] .watch-pills span,
html[data-theme="light"] .watch-latest-list a,
html[data-theme="light"] .channel-pagination a,
html[data-theme="light"] .channel-pagination span {
    background: var(--card-bg) !important;
    border-color: var(--border-soft) !important;
    color: var(--site-text) !important;
}

html[data-theme="light"] .channel-tab strong,
html[data-theme="light"] .discover-description,
html[data-theme="light"] .watch-latest-list a.is-current {
    background: var(--panel-bg-alt) !important;
    color: var(--site-text) !important;
}

html[data-theme="dark"] .channel-watch-hero {
    background:
        radial-gradient(circle at top right, rgba(122, 167, 255, .22), transparent 38%),
        linear-gradient(135deg, var(--panel), #0d1428) !important;
}

.channel-video-meta,
.discover-video-card .meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.channel-video-meta time,
.discover-video-card time,
.watch-pills time,
.watch-latest-list time {
    color: inherit;
}

/* November 3, 2026: logo brand in the header (shown once logo/ytunity-platform-logo.png exists). */
.nav-brand.nav-brand-logo,.top-nav .nav-brand.nav-brand-logo{display:inline-flex!important;align-items:center;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;min-height:0!important}
.nav-brand.nav-brand-logo picture{display:block}.nav-brand.nav-brand-logo img{display:block;width:auto;height:52px;max-width:none;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(229,9,20,.35));transition:transform .2s ease,filter .2s ease}
.nav-brand.nav-brand-logo:hover img,.nav-brand.nav-brand-logo:focus-visible img{transform:scale(1.04);filter:drop-shadow(0 6px 18px rgba(63,153,255,.45))}
@media(max-width:600px){.nav-brand.nav-brand-logo img{height:40px}}
@media(prefers-reduced-motion:reduce){.nav-brand.nav-brand-logo img{transition:none}.nav-brand.nav-brand-logo:hover img,.nav-brand.nav-brand-logo:focus-visible img{transform:none}}
/* November 3, 2026: logo-matched accents replace the old purple, pink and cyan ones. */
.discover-search-form button,.ytu-home .discover-home-search button{background:linear-gradient(135deg,var(--accent-red-strong),#d8340f)!important;color:#fff!important;border:0!important}
.discover-search-form button:hover,.ytu-home .discover-home-search button:hover{background:linear-gradient(135deg,var(--accent-red-hover),#c42e0c)!important;box-shadow:0 10px 24px rgba(227,6,15,.3)!important}
html[data-theme="light"] .discover-search-form input{background:var(--field-bg)!important;color:var(--field-text)!important;border-color:var(--border-color)!important}
html[data-theme="light"] .discover-search-form input::placeholder{color:var(--muted-text)!important}
.discover-video-card .badge{background:rgba(52,110,190,.18)!important;border-color:rgba(127,180,236,.45)!important;color:var(--site-text)!important}
html[data-theme="light"] .discover-video-card .badge{background:rgba(11,74,148,.08)!important;border-color:rgba(11,74,148,.3)!important}
.ytu-kicker{border-color:rgba(227,6,15,.45)!important;box-shadow:inset 0 0 0 1px rgba(214,219,226,.06)}
.ytu-kicker::before{content:"";display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--accent-red);box-shadow:0 0 8px var(--accent-red);vertical-align:middle;align-self:center}
.discover-section-head h2,.ytu-section>h2{position:relative}
.ytu-home .ytu-hero::before{background:radial-gradient(38% 45% at 22% 30%,rgba(52,110,190,.26),transparent 70%),radial-gradient(34% 40% at 78% 70%,rgba(227,6,15,.18),transparent 70%),radial-gradient(28% 30% at 60% 15%,rgba(255,122,46,.10),transparent 70%)!important}
html[data-theme="light"] .ytu-home .ytu-hero::before{background:radial-gradient(38% 45% at 22% 30%,rgba(11,74,148,.10),transparent 70%),radial-gradient(34% 40% at 78% 70%,rgba(212,0,15,.08),transparent 70%)!important}
/* November 3, 2026: sign-in box (infile/auth-modal-view.php). */
.ytu-auth{width:min(440px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:0;border:0;border-radius:18px;background:transparent;color:var(--site-text);overflow:visible}
.ytu-auth::backdrop{background:rgba(3,6,14,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ytu-auth[open]{animation:ytu-auth-in .22s ease-out}
@keyframes ytu-auth-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.ytu-auth-card{position:relative;max-height:calc(100vh - 24px);overflow:auto;padding:26px 24px 22px;border:1px solid var(--border-color);border-radius:18px;background:radial-gradient(120% 80% at 0% 0%,rgba(227,6,15,.16),transparent 55%),radial-gradient(120% 80% at 100% 0%,var(--grid-blue),transparent 55%),var(--card-bg);box-shadow:0 30px 80px rgba(0,0,0,.55)}
html[data-theme="light"] .ytu-auth-card{box-shadow:0 24px 60px rgba(20,30,50,.25)}
.ytu-auth-close{position:absolute;top:10px;right:12px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--muted-text-strong);font-size:26px;line-height:1;cursor:pointer}
.ytu-auth-close:hover{background:var(--panel-bg-alt)}
.ytu-auth-head{text-align:center}
.ytu-auth-head img{display:block;width:150px;height:auto;margin:0 auto 6px;filter:drop-shadow(0 6px 16px rgba(227,6,15,.35))}
.ytu-auth-head h2{margin:0 0 4px;font-size:24px;color:var(--heading-text)}
.ytu-auth-head p{margin:0 0 16px;color:var(--muted-text-strong);font-size:14px}
.ytu-auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;margin-bottom:14px;border:1px solid var(--border-color);border-radius:12px;background:var(--card-bg-soft)}
.ytu-auth-tabs[hidden]{display:none}
.ytu-auth-tabs button{min-height:40px;border:0;border-radius:9px;background:transparent;color:var(--muted-text-strong);font:inherit;font-weight:800;cursor:pointer}
.ytu-auth-tabs button[aria-selected="true"]{background:linear-gradient(135deg,var(--accent-red-strong),#d8340f);color:#fff;box-shadow:0 6px 16px rgba(227,6,15,.3)}
.ytu-auth-panel{display:grid;gap:12px}
.ytu-auth-panel[hidden],.ytu-auth-done[hidden]{display:none}
.ytu-auth-panel label{display:grid;gap:6px;font-weight:700;font-size:14px}
.ytu-auth-panel label small{font-weight:500;color:var(--muted-text)}
.ytu-auth-panel input{box-sizing:border-box;width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--border-color);border-radius:10px;background:var(--field-bg);color:var(--field-text);font:inherit}
.ytu-auth-panel input:focus{outline:none;border-color:var(--link-color);box-shadow:0 0 0 4px var(--grid-blue)}
.ytu-auth-pass{display:flex;gap:6px}
.ytu-auth-pass input{flex:1;min-width:0}
.ytu-auth-pass button{flex:0 0 auto;padding:0 12px;border:1px solid var(--border-color);border-radius:10px;background:var(--button-secondary-bg);color:var(--site-text);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.ytu-auth-trap{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.ytu-auth-submit{display:flex;align-items:center;justify-content:center;min-height:48px;margin-top:4px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--accent-red-strong),#d8340f);color:#fff!important;font:inherit;font-weight:800;text-decoration:none;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease}
.ytu-auth-submit:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(227,6,15,.32)}
.ytu-auth-submit:disabled{opacity:.7;cursor:progress;transform:none}
.ytu-auth-status{margin:0 0 12px;padding:10px 12px;border-radius:10px;background:var(--panel-bg-alt);font-size:14px}
.ytu-auth-status.is-problem{background:var(--error-bg);color:var(--error-text);border:1px solid var(--error-border)}
.ytu-auth-done{text-align:center}
.ytu-auth-done-title{margin:8px 0 4px;font-size:22px;font-weight:800;color:var(--heading-text)}
.ytu-auth-done-actions{display:grid;gap:10px;margin-top:14px}
.ytu-auth-done-actions a:not(.ytu-auth-submit){color:var(--link-color)}
.ytu-auth :is(button,a,input):focus-visible{outline:3px solid var(--link-color);outline-offset:2px}
@media(prefers-reduced-motion:reduce){.ytu-auth[open]{animation:none}.ytu-auth-submit{transition:none}.ytu-auth-submit:hover{transform:none}}