/* 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;
}

/* 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;
    }
}