/* ==========================================================================
   Header on pages without a hero photo (blog, shop, privacy, cart, account…)
   Beige bar with a dark logo and dark menu, so the menu is readable.
   Pages with a photo header (home, vans, contact) keep the white-on-photo menu.
   ========================================================================== */

body.blog #header-menu,
body.category #header-menu,
body.archive #header-menu,
body.search #header-menu,
body.single-post #header-menu,
body.single-product #header-menu,
body.single-amazon_product #header-menu,
body.page-template-default #header-menu,
body #header-menu.relative-header {
    background: var(--beige-color);
    color: #2b2724;
}

/* The logo file is white; render it near-black on the sand bar. */
body.blog #header-menu .custom-logo,
body.category #header-menu .custom-logo,
body.archive #header-menu .custom-logo,
body.search #header-menu .custom-logo,
body.single-post #header-menu .custom-logo,
body.single-product #header-menu .custom-logo,
body.single-amazon_product #header-menu .custom-logo,
body.page-template-default #header-menu .custom-logo,
body #header-menu.relative-header .custom-logo {
    filter: brightness(0) saturate(100%);
}

body.blog #header-menu .primary-menu > li > a,
body.category #header-menu .primary-menu > li > a,
body.archive #header-menu .primary-menu > li > a,
body.search #header-menu .primary-menu > li > a,
body.single-post #header-menu .primary-menu > li > a,
body.single-product #header-menu .primary-menu > li > a,
body.single-amazon_product #header-menu .primary-menu > li > a,
body.page-template-default #header-menu .primary-menu > li > a,
body #header-menu.relative-header .primary-menu > li > a,
body.blog #header-menu .icon,
body.category #header-menu .icon,
body.archive #header-menu .icon,
body.page-template-default #header-menu .icon,
body #header-menu.relative-header .icon,
body.blog #header-menu .toggle-icon_menu,
body.category #header-menu .toggle-icon_menu,
body.archive #header-menu .toggle-icon_menu,
body.page-template-default #header-menu .toggle-icon_menu,
body #header-menu.relative-header .toggle-icon_menu {
    color: #2b2724;
    fill: #2b2724;
}

body.blog #header-menu .primary-menu > li > a:hover,
body.category #header-menu .primary-menu > li > a:hover,
body.archive #header-menu .primary-menu > li > a:hover,
body.page-template-default #header-menu .primary-menu > li > a:hover,
body #header-menu.relative-header .primary-menu > li > a:hover {
    color: #6b4442;
}

/* Van pages: the header becomes a normal bar (the wave photo banner is gone). */
body.single-product #header-menu {
    position: relative;
}

body.single-product #header-menu .icon,
body.single-product #header-menu .toggle-icon_menu {
    color: #2b2724;
}