/**
 * Header brand unification (plan 088).
 *
 * Turns Flatsome's light-gray menu strip into a white menu bar with cyan
 * accents (plan 088, restyled white in plan 092) and drops a brand logo in
 * front of every dropdown item. Every rule is scoped to a header region
 * (.header-bottom / .nav-dropdown / #main-menu) or the header search form, so
 * nothing here leaks to page content, checkout/cart buttons, or the homepage
 * brand grid. Removing this file (and its require in bootstrap.php) fully
 * reverts the header to today's look.
 *
 * Colours (Logidirect design system): dark #404141 (top bar / logo block
 * background, dark menu text), cyan #2ab6f1 (accent). Cyan is accent-only
 * (underline / chevron / accent line), never body text.
 *
 * MENU-ITEM → LOGO MAPPING (primary menu "Logidirect", term_id 68). If the
 * menu is rebuilt with new item IDs, every ::before rule below goes stale and
 * this list is the source for re-mapping. Logos live in assets/brands/ and are
 * copied from the WordPress media library (product_brand term thumbnails, the
 * same files the homepage brand grid uses); grt-ribbon.svg is a generic
 * house-brand pictogram.
 *
 *   Printers (291):     292 Zebra→zebra  293 CAB→cab  303 Toshiba→toshiba
 *                       304 Sato→sato    305 Novexx→novexx  1736 Epson→epson
 *   Scanners (294):     1660 Zebra→zebra  628 Datalogic→datalogic
 *                       489 ProGlove→proglove  2593 Newland→newland
 *   Labelsoftware (295):1040 Bartender→bartender  1536 Loftware→loftware
 *   Printlinten (296):  1232 GRT→grt-ribbon  1233 Toshiba printlint→toshiba
 *   Etiketten (297):    1987 Zebra labels→zebra
 *   Printkoppen (300):  1651 CAB→cab  1499 Toshiba→toshiba  1500 Zebra→zebra
 *                       2205 Sato→sato  2206 Novexx→novexx
 *   Platenrollers (301):1513 Zebra→zebra  1512 Toshiba→toshiba  2207 Sato→sato
 */

:root {
	--ld-dark: #404141;
	--ld-cyan: #2ab6f1;
}

/* ---- 1. White menu bar with cyan accents (desktop) --------------------- */

.header-bottom {
	background-color: #fff !important;
	border-bottom: 2px solid var(--ld-cyan);
}

.header-bottom .header-nav > li > a,
.header-bottom .header-nav > li > a.nav-top-link {
	color: var(--ld-dark);
}

/* dropdown chevrons in cyan */
.header-bottom .header-nav > li > a .icon-angle-down {
	color: var(--ld-cyan);
}

/* Flatsome draws the hover/active underline with a pseudo-element bar whose
   colour follows the theme accent; repaint it cyan and keep the text dark. */
.header-bottom .header-nav > li > a:hover,
.header-bottom .header-nav > li.active > a,
.header-bottom .header-nav > li.current-dropdown > a,
.header-bottom .header-nav > li.current-menu-item > a {
	color: var(--ld-dark);
}

.header-bottom .header-nav > li > a::before {
	background-color: var(--ld-cyan) !important;
}

/* ---- 2. Cyan accent line under the header on mobile -------------------- */

@media (max-width: 849px) {
	.header-wrapper {
		border-bottom: 2px solid var(--ld-cyan);
	}
}

/* ---- 3. Header search submit: orange -> cyan -------------------------- */

.header .ux-search-submit,
.header .ux-search-submit.submit-button,
#main-menu .ux-search-submit {
	background-color: var(--ld-cyan) !important;
	border-color: var(--ld-cyan) !important;
	color: #fff !important;
}

/* ---- 4. Dropdown panel breathing room -------------------------------- */

.header-bottom .nav-dropdown.nav-dropdown-default {
	min-width: 260px;
}

.header-bottom .nav-dropdown.nav-dropdown-default > li > a {
	padding-top: 10px;
	padding-bottom: 10px;
}

/* ---- 5. Off-canvas (mobile) light treatment --------------------------- */

#main-menu.mobile-sidebar {
	background-color: #fff;
}

#main-menu .nav-sidebar > li > a,
#main-menu .nav-sidebar li > a {
	color: var(--ld-dark);
}

#main-menu .nav-sidebar li.active > a,
#main-menu .nav-sidebar li.current-menu-item > a {
	color: var(--ld-cyan);
}

/* ---- 6. Brand logos in dropdown + off-canvas items ------------------- */

/* desktop dropdown: make room for the logo */
.nav-dropdown li.menu-item-292 > a,
.nav-dropdown li.menu-item-293 > a,
.nav-dropdown li.menu-item-303 > a,
.nav-dropdown li.menu-item-304 > a,
.nav-dropdown li.menu-item-305 > a,
.nav-dropdown li.menu-item-489 > a,
.nav-dropdown li.menu-item-628 > a,
.nav-dropdown li.menu-item-1040 > a,
.nav-dropdown li.menu-item-1232 > a,
.nav-dropdown li.menu-item-1233 > a,
.nav-dropdown li.menu-item-1499 > a,
.nav-dropdown li.menu-item-1500 > a,
.nav-dropdown li.menu-item-1512 > a,
.nav-dropdown li.menu-item-1513 > a,
.nav-dropdown li.menu-item-1536 > a,
.nav-dropdown li.menu-item-1651 > a,
.nav-dropdown li.menu-item-1660 > a,
.nav-dropdown li.menu-item-1736 > a,
.nav-dropdown li.menu-item-1987 > a,
.nav-dropdown li.menu-item-2205 > a,
.nav-dropdown li.menu-item-2206 > a,
.nav-dropdown li.menu-item-2207 > a,
.nav-dropdown li.menu-item-2593 > a {
	display: flex;
	align-items: center;
	gap: .6em;
}

/* desktop dropdown logo box (grayscale, colors on hover) */
.nav-dropdown li.menu-item-292 > a::before,
.nav-dropdown li.menu-item-293 > a::before,
.nav-dropdown li.menu-item-303 > a::before,
.nav-dropdown li.menu-item-304 > a::before,
.nav-dropdown li.menu-item-305 > a::before,
.nav-dropdown li.menu-item-489 > a::before,
.nav-dropdown li.menu-item-628 > a::before,
.nav-dropdown li.menu-item-1040 > a::before,
.nav-dropdown li.menu-item-1232 > a::before,
.nav-dropdown li.menu-item-1233 > a::before,
.nav-dropdown li.menu-item-1499 > a::before,
.nav-dropdown li.menu-item-1500 > a::before,
.nav-dropdown li.menu-item-1512 > a::before,
.nav-dropdown li.menu-item-1513 > a::before,
.nav-dropdown li.menu-item-1536 > a::before,
.nav-dropdown li.menu-item-1651 > a::before,
.nav-dropdown li.menu-item-1660 > a::before,
.nav-dropdown li.menu-item-1736 > a::before,
.nav-dropdown li.menu-item-1987 > a::before,
.nav-dropdown li.menu-item-2205 > a::before,
.nav-dropdown li.menu-item-2206 > a::before,
.nav-dropdown li.menu-item-2207 > a::before,
.nav-dropdown li.menu-item-2593 > a::before {
	content: "";
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	filter: grayscale(1) opacity(.7);
	transition: filter .15s ease;
}

.nav-dropdown li.menu-item-292 > a:hover::before,
.nav-dropdown li.menu-item-293 > a:hover::before,
.nav-dropdown li.menu-item-303 > a:hover::before,
.nav-dropdown li.menu-item-304 > a:hover::before,
.nav-dropdown li.menu-item-305 > a:hover::before,
.nav-dropdown li.menu-item-489 > a:hover::before,
.nav-dropdown li.menu-item-628 > a:hover::before,
.nav-dropdown li.menu-item-1040 > a:hover::before,
.nav-dropdown li.menu-item-1232 > a:hover::before,
.nav-dropdown li.menu-item-1233 > a:hover::before,
.nav-dropdown li.menu-item-1499 > a:hover::before,
.nav-dropdown li.menu-item-1500 > a:hover::before,
.nav-dropdown li.menu-item-1512 > a:hover::before,
.nav-dropdown li.menu-item-1513 > a:hover::before,
.nav-dropdown li.menu-item-1536 > a:hover::before,
.nav-dropdown li.menu-item-1651 > a:hover::before,
.nav-dropdown li.menu-item-1660 > a:hover::before,
.nav-dropdown li.menu-item-1736 > a:hover::before,
.nav-dropdown li.menu-item-1987 > a:hover::before,
.nav-dropdown li.menu-item-2205 > a:hover::before,
.nav-dropdown li.menu-item-2206 > a:hover::before,
.nav-dropdown li.menu-item-2207 > a:hover::before,
.nav-dropdown li.menu-item-2593 > a:hover::before,
.nav-dropdown li.menu-item-292 > a:focus::before,
.nav-dropdown li.menu-item-293 > a:focus::before,
.nav-dropdown li.menu-item-303 > a:focus::before,
.nav-dropdown li.menu-item-304 > a:focus::before,
.nav-dropdown li.menu-item-305 > a:focus::before,
.nav-dropdown li.menu-item-489 > a:focus::before,
.nav-dropdown li.menu-item-628 > a:focus::before,
.nav-dropdown li.menu-item-1040 > a:focus::before,
.nav-dropdown li.menu-item-1232 > a:focus::before,
.nav-dropdown li.menu-item-1233 > a:focus::before,
.nav-dropdown li.menu-item-1499 > a:focus::before,
.nav-dropdown li.menu-item-1500 > a:focus::before,
.nav-dropdown li.menu-item-1512 > a:focus::before,
.nav-dropdown li.menu-item-1513 > a:focus::before,
.nav-dropdown li.menu-item-1536 > a:focus::before,
.nav-dropdown li.menu-item-1651 > a:focus::before,
.nav-dropdown li.menu-item-1660 > a:focus::before,
.nav-dropdown li.menu-item-1736 > a:focus::before,
.nav-dropdown li.menu-item-1987 > a:focus::before,
.nav-dropdown li.menu-item-2205 > a:focus::before,
.nav-dropdown li.menu-item-2206 > a:focus::before,
.nav-dropdown li.menu-item-2207 > a:focus::before,
.nav-dropdown li.menu-item-2593 > a:focus::before {
	filter: none;
}

/* mobile off-canvas: make room for the logo */
#main-menu li.menu-item-292 > a,
#main-menu li.menu-item-293 > a,
#main-menu li.menu-item-303 > a,
#main-menu li.menu-item-304 > a,
#main-menu li.menu-item-305 > a,
#main-menu li.menu-item-489 > a,
#main-menu li.menu-item-628 > a,
#main-menu li.menu-item-1040 > a,
#main-menu li.menu-item-1232 > a,
#main-menu li.menu-item-1233 > a,
#main-menu li.menu-item-1499 > a,
#main-menu li.menu-item-1500 > a,
#main-menu li.menu-item-1512 > a,
#main-menu li.menu-item-1513 > a,
#main-menu li.menu-item-1536 > a,
#main-menu li.menu-item-1651 > a,
#main-menu li.menu-item-1660 > a,
#main-menu li.menu-item-1736 > a,
#main-menu li.menu-item-1987 > a,
#main-menu li.menu-item-2205 > a,
#main-menu li.menu-item-2206 > a,
#main-menu li.menu-item-2207 > a,
#main-menu li.menu-item-2593 > a {
	display: flex;
	align-items: center;
	gap: .6em;
}

/* mobile off-canvas logo (full colour) */
#main-menu li.menu-item-292 > a::before,
#main-menu li.menu-item-293 > a::before,
#main-menu li.menu-item-303 > a::before,
#main-menu li.menu-item-304 > a::before,
#main-menu li.menu-item-305 > a::before,
#main-menu li.menu-item-489 > a::before,
#main-menu li.menu-item-628 > a::before,
#main-menu li.menu-item-1040 > a::before,
#main-menu li.menu-item-1232 > a::before,
#main-menu li.menu-item-1233 > a::before,
#main-menu li.menu-item-1499 > a::before,
#main-menu li.menu-item-1500 > a::before,
#main-menu li.menu-item-1512 > a::before,
#main-menu li.menu-item-1513 > a::before,
#main-menu li.menu-item-1536 > a::before,
#main-menu li.menu-item-1651 > a::before,
#main-menu li.menu-item-1660 > a::before,
#main-menu li.menu-item-1736 > a::before,
#main-menu li.menu-item-1987 > a::before,
#main-menu li.menu-item-2205 > a::before,
#main-menu li.menu-item-2206 > a::before,
#main-menu li.menu-item-2207 > a::before,
#main-menu li.menu-item-2593 > a::before {
	content: "";
	flex: 0 0 26px;
	width: 26px;
	height: 26px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

/* per-brand logo images (desktop dropdown + mobile off-canvas) */
/* zebra */
.nav-dropdown li.menu-item-292 > a::before,
#main-menu li.menu-item-292 > a::before,
.nav-dropdown li.menu-item-1660 > a::before,
#main-menu li.menu-item-1660 > a::before,
.nav-dropdown li.menu-item-1987 > a::before,
#main-menu li.menu-item-1987 > a::before,
.nav-dropdown li.menu-item-1500 > a::before,
#main-menu li.menu-item-1500 > a::before,
.nav-dropdown li.menu-item-1513 > a::before,
#main-menu li.menu-item-1513 > a::before {
	background-image: url(brands/zebra.jpg);
}

/* cab */
.nav-dropdown li.menu-item-293 > a::before,
#main-menu li.menu-item-293 > a::before,
.nav-dropdown li.menu-item-1651 > a::before,
#main-menu li.menu-item-1651 > a::before {
	background-image: url(brands/cab.jpg);
}

/* toshiba */
.nav-dropdown li.menu-item-303 > a::before,
#main-menu li.menu-item-303 > a::before,
.nav-dropdown li.menu-item-1233 > a::before,
#main-menu li.menu-item-1233 > a::before,
.nav-dropdown li.menu-item-1499 > a::before,
#main-menu li.menu-item-1499 > a::before,
.nav-dropdown li.menu-item-1512 > a::before,
#main-menu li.menu-item-1512 > a::before {
	background-image: url(brands/toshiba.jpg);
}

/* sato */
.nav-dropdown li.menu-item-304 > a::before,
#main-menu li.menu-item-304 > a::before,
.nav-dropdown li.menu-item-2205 > a::before,
#main-menu li.menu-item-2205 > a::before,
.nav-dropdown li.menu-item-2207 > a::before,
#main-menu li.menu-item-2207 > a::before {
	background-image: url(brands/sato.jpg);
}

/* novexx */
.nav-dropdown li.menu-item-305 > a::before,
#main-menu li.menu-item-305 > a::before,
.nav-dropdown li.menu-item-2206 > a::before,
#main-menu li.menu-item-2206 > a::before {
	background-image: url(brands/novexx.jpg);
}

/* epson */
.nav-dropdown li.menu-item-1736 > a::before,
#main-menu li.menu-item-1736 > a::before {
	background-image: url(brands/epson.png);
}

/* datalogic */
.nav-dropdown li.menu-item-628 > a::before,
#main-menu li.menu-item-628 > a::before {
	background-image: url(brands/datalogic.jpg);
}

/* proglove */
.nav-dropdown li.menu-item-489 > a::before,
#main-menu li.menu-item-489 > a::before {
	background-image: url(brands/proglove.jpg);
}

/* newland */
.nav-dropdown li.menu-item-2593 > a::before,
#main-menu li.menu-item-2593 > a::before {
	background-image: url(brands/newland.jpg);
}

/* bartender */
.nav-dropdown li.menu-item-1040 > a::before,
#main-menu li.menu-item-1040 > a::before {
	background-image: url(brands/bartender.jpg);
}

/* loftware */
.nav-dropdown li.menu-item-1536 > a::before,
#main-menu li.menu-item-1536 > a::before {
	background-image: url(brands/loftware.jpg);
}

/* grt-ribbon */
.nav-dropdown li.menu-item-1232 > a::before,
#main-menu li.menu-item-1232 > a::before {
	background-image: url(brands/grt-ribbon.svg);
}