/* Bovenaan volgt het contrast de paginakop; na scrollen geldt de gekozen kleurcombinatie. */
body:is(.home, .tt-role-home) {
    --tt-header-solid-bg: #0f172a;
    --tt-header-solid-fg: #ffffff;
    --tt-hero-header-gap: 64px;
}
body:is(.home, .tt-role-home).tt-preset-bold {
    --tt-header-solid-bg: #0b0d14;
    --tt-header-solid-fg: #ffffff;
    --tt-hero-header-gap: 40px;
}
body:is(.home, .tt-role-home).tt-preset-premium {
    --tt-hero-header-gap: 40px;
}
body:is(.home, .tt-role-home).tt-preset-onepage {
    --tt-header-solid-bg: #0a0b10;
    --tt-header-solid-fg: #ffffff;
    --tt-hero-header-gap: 40px;
}
body:is(.home, .tt-role-home)[class*="tt-preset-"] .tt-header {
    position: fixed;
    inset: 0 0 auto;
    width: 100%;
    z-index: 60;
    --tt-header-fg: var(--tt-header-top-fg, var(--tt-nav-fg));
    color: var(--tt-header-fg);
    border-bottom: 1px solid transparent;
    box-shadow: none;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}
body:is(.home, .tt-role-home)[class*="tt-preset-"]:not(.is-scrolled) .tt-header {
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
body:is(.home, .tt-role-home)[class*="tt-preset-"].is-scrolled .tt-header {
    --tt-nav: var(--tt-header-solid-bg);
    --tt-nav-fg: var(--tt-header-solid-fg);
    --tt-header-fg: var(--tt-header-solid-fg);
    background: var(--tt-header-solid-bg);
    background: color-mix(in srgb, var(--tt-header-solid-bg) 96%, transparent);
    border-bottom-color: color-mix(in srgb, var(--tt-header-solid-fg) 12%, transparent);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.12);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
body:is(.home, .tt-role-home) .tt-header .tt-brand,
body:is(.home, .tt-role-home) .tt-header .tt-nav > ul > li > a,
body:is(.home, .tt-role-home) .tt-header .tt-language-switch {
    color: var(--tt-header-fg);
    opacity: 1;
}
body:is(.home, .tt-role-home) .tt-header .tt-hamburger span {
    background: var(--tt-header-fg);
}
body:is(.home, .tt-role-home):not(.is-scrolled) .tt-header .tt-brand::before,
body:is(.home, .tt-role-home) .tt-header .tt-nav .current-menu-item > a::after {
    background: var(--tt-header-fg);
}
body:is(.home, .tt-role-home):not(.is-scrolled) .tt-header .tt-brand::after {
    color: var(--tt-header-fg);
}
body:is(.home, .tt-role-home)[class*="tt-preset-"]:not(.is-scrolled) .tt-header .tt-cta {
    background: var(--tt-header-fg);
    color: var(--tt-header-top-button-fg, #0f172a) !important;
    border-color: var(--tt-header-fg);
    box-shadow: none;
}
body:is(.home, .tt-role-home)[class*="tt-preset-"].is-scrolled .tt-header .tt-cta {
    background: var(--tt-accent);
    color: var(--tt-accent-fg) !important;
    border-color: var(--tt-accent);
}
body:is(.home, .tt-role-home).tt-preset-simpel.is-scrolled .tt-header .tt-cta {
    background: var(--tt-header-solid-fg);
    color: var(--tt-header-solid-bg) !important;
    border-color: var(--tt-header-solid-fg);
}
/* Het donkere accent van het monochrome palet krijgt een lichte knop. */
body:is(.home, .tt-role-home).tt-palette-premium-mono.is-scrolled .tt-header .tt-cta {
    background: var(--tt-header-solid-fg);
    color: var(--tt-header-solid-bg) !important;
    border-color: var(--tt-header-solid-fg);
}
/* Een geopend menu gebruikt altijd zijn eigen vaste achtergrond en tekstkleur. */
body:is(.home, .tt-role-home) .tt-header .tt-nav .tt-nav__dropdown {
    background: var(--tt-header-solid-bg);
    border-color: color-mix(in srgb, var(--tt-header-solid-fg) 16%, transparent);
}
body:is(.home, .tt-role-home) .tt-header .tt-nav .tt-nav__dropdown a {
    color: var(--tt-header-solid-fg);
    opacity: 1;
}
body:is(.home, .tt-role-home) .tt-header .tt-nav .tt-nav__dropdown a:hover {
    background: color-mix(in srgb, var(--tt-header-solid-fg) 9%, transparent);
}
/* De gemeten headerhoogte houdt ook bij een logo of mobiel menu de hero vrij. */
body:is(.home, .tt-role-home)[class*="tt-preset-"] :is(
    .tt-hero, .tt-hero-fs, .tt-premium-hero, .tt-onepage-hero, .tt-simpel-hero
) {
    padding-top: calc(var(--tt-home-header-height, 88px) + var(--tt-hero-header-gap));
}
body.admin-bar:is(.home, .tt-role-home)[class*="tt-preset-"] .tt-header {
    top: 32px;
}
@media (max-width: 900px) {
    body:is(.home, .tt-role-home) { --tt-hero-header-gap: 32px; }
}
@media screen and (max-width: 782px) {
    body.admin-bar:is(.home, .tt-role-home)[class*="tt-preset-"] .tt-header { top: 46px; }
}

/* Expliciet opgeslagen instellingen gelden voor alle pagina's en alle presets. */
body.tt-header-managed[class*="tt-preset-"]:is(.home, .tt-role-home, .tt-header-managed) .tt-header {
    --tt-header-fg: var(--tt-header-solid-fg);
    --tt-nav: var(--tt-header-solid-bg);
    --tt-nav-fg: var(--tt-header-solid-fg);
    --tt-header-top-fg: var(--tt-header-solid-fg);
    position: fixed;
    inset: 0 0 auto;
    width: 100%;
    z-index: 60;
    background: var(--tt-header-solid-bg);
    color: var(--tt-header-fg);
    border-bottom: 1px solid color-mix(in srgb, var(--tt-header-fg) 12%, transparent);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.12);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
body.tt-header-managed:is(.tt-header-transparent-home:is(.home, .tt-role-home), .tt-header-transparent-page):not(.is-scrolled) .tt-header {
    --tt-header-fg: var(--tt-header-top-fg, var(--tt-header-solid-fg));
    background: transparent;
    border-bottom-color: transparent;
    box-shadow: none;
}
body.tt-header-managed[class*="tt-preset-"] .tt-header :is(.tt-brand, .tt-nav > ul > li > a, .tt-language-switch) {
    color: var(--tt-header-fg);
    opacity: 1;
}
body.tt-header-managed[class*="tt-preset-"] .tt-header .tt-hamburger span { background: var(--tt-header-fg); }
body.tt-header-managed[class*="tt-preset-"]:is(.home, .tt-role-home, .tt-header-managed) .tt-header .tt-cta {
    background: var(--tt-header-action-bg, #ffffff);
    color: var(--tt-header-action-fg, #0f172a) !important;
    border-color: var(--tt-header-action-bg, #ffffff);
    box-shadow: none;
}
body.tt-header-managed:is(.tt-header-transparent-home:is(.home, .tt-role-home), .tt-header-transparent-page):not(.is-scrolled) .tt-header .tt-cta {
    background: var(--tt-header-fg);
    color: var(--tt-header-top-button-fg, var(--tt-header-action-fg, #0f172a)) !important;
    border-color: var(--tt-header-fg);
}
body.tt-header-managed[class*="tt-preset-"] :is(.tt-header .tt-nav .tt-nav__dropdown, .tt-mobile-menu__inner) {
    --tt-nav: var(--tt-header-solid-bg);
    --tt-nav-fg: var(--tt-header-solid-fg);
    background: var(--tt-header-solid-bg);
    color: var(--tt-header-solid-fg);
}
body.tt-header-managed[class*="tt-preset-"] :is(.tt-header .tt-nav .tt-nav__dropdown a, .tt-mobile-menu__nav a, .tt-mobile-menu__phone, .tt-mobile-menu__close) {
    color: var(--tt-header-solid-fg);
}
body.tt-header-managed[class*="tt-preset-"] .tt-mobile-menu__cta {
    background: var(--tt-header-action-bg, #ffffff);
    color: var(--tt-header-action-fg, #0f172a);
    border-color: var(--tt-header-action-bg, #ffffff);
}
/* Een vaste, ondoorzichtige header krijgt plaats in de documentflow. */
body.tt-header-managed.tt-header-position-fixed { padding-top: var(--tt-home-header-height, 88px); }
body.tt-header-managed.tt-header-position-fixed:is(.home, .tt-role-home) { padding-top: 0; }
body.tt-header-managed.tt-header-position-fixed.tt-header-transparent-page { padding-top: 0; }
/* De bestaande ruimte van de paginakop blijft intact; alleen de headerhoogte komt erbij. */
body.tt-header-transparent-page .tt-header-page-top > .tt-container { padding-top: var(--tt-home-header-height, 88px); }
body.tt-header-managed.tt-header-position-static[class*="tt-preset-"]:is(.home, .tt-role-home, .tt-header-managed) .tt-header {
    position: relative;
    inset: auto;
}
body.tt-header-managed.tt-header-position-static:is(.tt-header-transparent-home:is(.home, .tt-role-home), .tt-header-transparent-page) .tt-header {
    margin-bottom: calc(-1 * var(--tt-home-header-height, 88px));
}
body.tt-header-managed.tt-header-position-static:is(.home, .tt-role-home):not(.tt-header-transparent-home)[class*="tt-preset-"] :is(.tt-hero, .tt-hero-fs, .tt-premium-hero, .tt-onepage-hero, .tt-simpel-hero) {
    padding-top: var(--tt-hero-header-gap);
}
body.admin-bar.tt-header-managed.tt-header-position-fixed[class*="tt-preset-"] .tt-header { top: 32px; }
@media (max-width: 782px) {
    body.admin-bar.tt-header-managed.tt-header-position-fixed[class*="tt-preset-"] .tt-header { top: 46px; }
}
@media (max-width: 600px) {
    /* De mobiele WordPress-adminbalk scrollt zelf mee. */
    body.admin-bar.tt-header-managed.tt-header-position-fixed[class*="tt-preset-"].is-scrolled .tt-header { top: 0; }
}
