/* Shared header contract for every Quick Tech Plus section. */
:root {
    color-scheme: dark;
    --qtp-menu-bg: #000000;
    --qtp-menu-surface: #16181c;
    --qtp-menu-text: #e7e9ea;
    --qtp-menu-muted: #71767b;
    --qtp-menu-border: #2f3336;
    --qtp-menu-accent: #1d9bf0;
}

.yt-sidebar.sidebar-unified,
.qtp-static-header {
    color: var(--qtp-menu-text) !important;
    background: var(--qtp-menu-bg) !important;
    border-color: var(--qtp-menu-border) !important;
}

.yt-sidebar .brand-title,
.yt-sidebar .brand-subtitle,
.yt-sidebar .nav-label,
.yt-sidebar .nav-item-link,
.yt-sidebar .nav-item-link i,
.qtp-static-brand-title,
.qtp-static-menu a,
.qtp-static-menu a i {
    color: var(--qtp-menu-text) !important;
}

.yt-sidebar .yt-search-input {
    color: var(--qtp-menu-text) !important;
    background: var(--qtp-menu-surface) !important;
    border: 1px solid var(--qtp-menu-border) !important;
}

.yt-sidebar .nav-item-link:hover,
.yt-sidebar .nav-item-link:focus-visible,
.qtp-static-menu a:hover,
.qtp-static-menu a:focus-visible {
    color: #ffffff !important;
    background: var(--qtp-menu-surface) !important;
}

.yt-sidebar .nav-item-link.active,
.yt-sidebar .nav-item-link.active i,
.yt-sidebar .qtp-section-item,
.yt-sidebar .qtp-section-item i,
.qtp-static-section {
    color: var(--qtp-menu-accent) !important;
}

/* Shared section icon colors for desktop and mobile menu links. */
.nav-item-link[data-slug="discover"] i,
.mobile-menu-link[data-slug="discover"] i { color: #1d9bf0 !important; }
.nav-item-link[data-slug="videos"] i,
.mobile-menu-link[data-slug="videos"] i { color: #ff0000 !important; }
.nav-item-link[data-slug="shorts"] i,
.mobile-menu-link[data-slug="shorts"] i { color: #ff9800 !important; }
.nav-item-link[data-slug="photos"] i,
.mobile-menu-link[data-slug="photos"] i { color: #4caf50 !important; }
.nav-item-link[data-slug="music"] i,
.mobile-menu-link[data-slug="music"] i { color: #e91e63 !important; }
.nav-item-link[data-slug="chat"] i,
.mobile-menu-link[data-slug="chat"] i { color: #03a9f4 !important; }
.nav-item-link[data-slug="games"] i,
.mobile-menu-link[data-slug="games"] i { color: #9c27b0 !important; }
.nav-item-link[data-slug="shop"] i,
.mobile-menu-link[data-slug="shop"] i { color: #ffc107 !important; }
.nav-item-link[data-slug="news"] i,
.mobile-menu-link[data-slug="news"] i { color: #607d8b !important; }
.nav-item-link[data-slug="store"] i,
.mobile-menu-link[data-slug="store"] i { color: #795548 !important; }
.nav-item-link[data-slug="discount"] i,
.mobile-menu-link[data-slug="discount"] i { color: #f44336 !important; }
.nav-item-link[data-slug="finance"] i,
.mobile-menu-link[data-slug="finance"] i { color: #009688 !important; }
.nav-item-link[data-slug="food"] i,
.mobile-menu-link[data-slug="food"] i { color: #ff5722 !important; }
.nav-item-link[data-slug="travel"] i,
.mobile-menu-link[data-slug="travel"] i { color: #00bcd4 !important; }
.nav-item-link[data-slug="jobs"] i,
.mobile-menu-link[data-slug="jobs"] i { color: #8d6e63 !important; }
.nav-item-link[data-slug="learn"] i,
.mobile-menu-link[data-slug="learn"] i { color: #3f51b5 !important; }
.nav-item-link[data-slug="dating"] i,
.mobile-menu-link[data-slug="dating"] i { color: #e91e63 !important; }
.nav-item-link[data-slug="inspiration"] i,
.mobile-menu-link[data-slug="inspiration"] i { color: #ffeb3b !important; }
.nav-item-link[data-slug="notes"] i,
.mobile-menu-link[data-slug="notes"] i { color: #ff9800 !important; }
.nav-item-link[data-slug="rewards"] i,
.mobile-menu-link[data-slug="rewards"] i { color: #f44336 !important; }

/* The compact top-header wordmark sits on the page canvas and stays black. */
.mobile-header .brand-title {
    color: #000000 !important;
}

/* A desktop header must remain visible even when a section stylesheet differs. */
@media (min-width: 769px) {
    .yt-sidebar.sidebar-unified {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .yt-sidebar #mainNavContainer,
    .yt-sidebar .sidebar-main-nav {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .yt-sidebar #mainNavContainer > .nav-item-link,
    .yt-sidebar #mainNavContainer > .desktop-sub-menu,
    .yt-sidebar .sidebar-main-nav .nav-item-link {
        visibility: visible !important;
        opacity: 1 !important;
    }

    .qtp-static-header {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .qtp-static-menu {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}