/**
 * GRP Blocks — Woodmart Header overrides.
 *
 * Visual-only tweaks to bring the Woodmart-built header closer to the
 * Figma design (node 528:22632). Loaded site-wide via grp-blocks.php
 * (enqueue_header_overrides), NOT from the child theme, because the
 * child theme is not the active theme on this site.
 *
 * IMPORTANT: every rule here is visual. Nothing touches the search-form
 * behaviour, the cart-fragments dependency, the wishlist AJAX, or any
 * Woodmart structural class that would break functionality.
 */

/* Top row — flush against the page, subtle gray bottom border. */
.whb-header .whb-row:first-child,
.whb-main-header .whb-row {
	border-bottom: 1px solid #E5E7EB;
}
.whb-header .whb-row:first-child .whb-flex-row {
	min-height: 98px;
	padding-top: 24px;
	padding-bottom: 24px;
}

/* Search input — pill shape, light-gray fill (#FAFAFC), placeholder gray-600.
   The `form.searchform` element is left FUNCTIONAL — we only style its box. */
.whb-header .searchform input[type="text"],
.whb-header .searchform input[type="search"],
.whb-header .searchform .search-field {
	background: #FAFAFC !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 14px 16px 14px 50px !important;
	color: #1F2937;
	font-family: inherit;
	font-size: 16px;
	line-height: 1.4;
	box-shadow: none !important;
}
.whb-header .searchform input[type="text"]::placeholder,
.whb-header .searchform input[type="search"]::placeholder,
.whb-header .searchform .search-field::placeholder {
	color: #6B7280;
	opacity: 1;
}
.whb-header .searchform .searchsubmit,
.whb-header .searchform button[type="submit"] {
	left: 14px;
	right: auto;
	background: transparent !important;
	color: #6B7280 !important;
}
.whb-header .wd-header-search-form {
	max-width: 448px;
	width: 100%;
}

/* User-action icons (Wishlist / Cart / Account) — labels stacked under icons,
   12px gray-800. */
.whb-header .wd-tools-element {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}
.whb-header .wd-tools-element .wd-tools-text,
.whb-header .wd-tools-element .wd-tools-label {
	font-size: 12px;
	line-height: 1.3;
	color: #1F2937;
	font-weight: 400;
}
.whb-header .wd-tools-element .wd-tools-icon,
.whb-header .wd-tools-element .wd-tools-icon svg {
	width: 24px;
	height: 24px;
}

/* Bottom row — slim, 54px high, two nav menus left + right. */
.whb-header .whb-row:nth-child(2) .whb-flex-row,
.whb-header .whb-secondary-header .whb-flex-row {
	min-height: 54px;
	padding-bottom: 16px;
}

/* Menu items — 16px Inter regular, gray-700, gap 26 between items. */
.whb-header .wd-nav > li > a,
.whb-header .menu > li > a {
	font-family: inherit;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	color: #364153;
	text-transform: none;
	letter-spacing: 0;
}
.whb-header .wd-nav,
.whb-header .menu {
	gap: 26px;
}
.whb-header .wd-nav > li > a:hover,
.whb-header .menu > li > a:hover {
	color: #1F2937;
}

/* Logo — fixed display size ~92.666 × 44 from Figma. */
.whb-header .wd-header-logo img,
.whb-header .site-logo img {
	max-height: 44px;
	width: auto;
}

/* Cart-count badge — small dot top-right of cart icon. */
.whb-header .wd-tools-element .wd-cart-number,
.whb-header .wd-tools-element .cart-counter {
	font-size: 10px;
	font-weight: 400;
	min-width: 16px;
	height: 16px;
	line-height: 16px;
}