/**
 * Restmaker WoodMart Header Builder responsive enhancements.
 * Enqueued early; selectors remain scoped to the WoodMart header.
 */

/* Responsive width applies only to Row columns = 3. */
@media (min-width: 1025px) {
	.whb-header .whb-row:not(.whb-col-1) .b2io-whb-column-width {
		flex: 0 0 var(--b2io-column-width-lg) !important;
		width: var(--b2io-column-width-lg) !important;
		max-width: var(--b2io-column-width-lg) !important;
	}
}

@media (min-width: 769px) and (max-width: 1024px) {
	.whb-header .whb-row:not(.whb-col-1) .b2io-whb-column-width {
		flex: 0 0 var(--b2io-column-width-md, var(--b2io-column-width-lg)) !important;
		width: var(--b2io-column-width-md, var(--b2io-column-width-lg)) !important;
		max-width: var(--b2io-column-width-md, var(--b2io-column-width-lg)) !important;
	}
}

@media (max-width: 768px) {
	.whb-header .whb-row:not(.whb-col-1) .b2io-whb-column-width {
		flex: 0 0 var(--b2io-column-width-sm, var(--b2io-column-width-md, var(--b2io-column-width-lg))) !important;
		width: var(--b2io-column-width-sm, var(--b2io-column-width-md, var(--b2io-column-width-lg))) !important;
		max-width: var(--b2io-column-width-sm, var(--b2io-column-width-md, var(--b2io-column-width-lg))) !important;
	}
}

/* Keep the fullscreen Search close control visible on light mobile/tablet overlays. */
@media (max-width: 1024px) {
	body .wd-search-full-screen-2 .wd-close-search,
	body .wd-search-full-screen-2 .wd-close-search > a,
	body .wd-search-full-screen-2 .wd-close-search .wd-action-icon,
	body .wd-search-full-screen-2 .wd-close-search .wd-action-icon::before {
		color: #777 !important;
		-webkit-text-fill-color: #777 !important;
		opacity: 1 !important;
	}

	body .wd-search-full-screen-2 .wd-close-search:hover,
	body .wd-search-full-screen-2 .wd-close-search:hover > a,
	body .wd-search-full-screen-2 .wd-close-search:hover .wd-action-icon::before {
		color: #555 !important;
		-webkit-text-fill-color: #555 !important;
	}
}

/* Alignment is attached to an individual element by the deferred header JS. */
.whb-header .whb-column > [data-b2io-element-align] {
	display: flex !important;
	flex: 1 1 0 !important;
	min-width: 0;
}

.whb-header .whb-column > [data-b2io-element-align="start"] {
	justify-content: flex-start !important;
}

.whb-header .whb-column > [data-b2io-element-align="center"],
.whb-header .whb-column > [data-b2io-element-align="equal-center-slots"] {
	justify-content: center !important;
}

.whb-header .whb-column > [data-b2io-element-align="end"] {
	justify-content: flex-end !important;
}

.whb-header .whb-column > [data-b2io-element-align="space-between"] {
	justify-content: space-between !important;
}

.whb-header .whb-column > [data-b2io-element-align="space-around"] {
	justify-content: space-around !important;
}

.whb-header .whb-column > [data-b2io-element-align="space-evenly"] {
	justify-content: space-evenly !important;
}

.whb-header .whb-column > [data-b2io-element-align="equal-center-slots"] > * {
	display: flex;
	flex: 1 1 0;
	align-items: center;
	justify-content: center;
	min-width: 0;
}

/* Resolve responsive icon caps without changing native sizes when unset. */
.whb-header :is(
	.wd-header-icon-element,
	.info-box-wrapper,
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-social-icons,
	.wd-header-search,
	.wd-header-mobile-nav
) {
	--b2io-header-icon-max-current: var(--b2io-header-icon-max-lg, 999px);
	--b2io-header-icon-shell-base: 42px;
}

.whb-header .whb-top-bar :is(
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-header-search,
	.wd-header-mobile-nav
) {
	--b2io-header-icon-shell-base: 28px;
}

@media (min-width: 769px) and (max-width: 1024px) {
	.whb-header :is(
		.wd-header-icon-element,
		.info-box-wrapper,
		.wd-header-my-account,
		.wd-header-cart,
		.wd-header-compare,
		.wd-header-wishlist,
		.wd-social-icons,
		.wd-header-search,
		.wd-header-mobile-nav
	) {
		--b2io-header-icon-max-current: var(--b2io-header-icon-max-md, var(--b2io-header-icon-max-lg, 999px));
	}
}

@media (max-width: 768px) {
	.whb-header :is(
		.wd-header-icon-element,
		.info-box-wrapper,
		.wd-header-my-account,
		.wd-header-cart,
		.wd-header-compare,
		.wd-header-wishlist,
		.wd-social-icons,
		.wd-header-search,
		.wd-header-mobile-nav
	) {
		--b2io-header-icon-max-current: var(--b2io-header-icon-max-sm, var(--b2io-header-icon-max-md, var(--b2io-header-icon-max-lg, 999px)));
	}
}

.whb-header :is(
	.wd-header-icon-element,
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-header-search,
	.wd-header-mobile-nav
) :is(.wd-custom-icon, picture.wd-custom-icon img) {
	max-height: var(--b2io-header-icon-max-current) !important;
	object-fit: contain;
}

.whb-header :is(
	.wd-header-icon-element,
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-header-search,
	.wd-header-mobile-nav
) .wd-tools-icon:before,
.whb-header :is(
	.wd-header-icon-element,
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-header-search,
	.wd-header-mobile-nav
) .wd-tools-icon:after {
	font-size: min(var(--wd-tools-icon-base-width, 20px), var(--b2io-header-icon-max-current)) !important;
}

/* Designs 6/7/8 draw a 42px visual shell around a 20px glyph. Cap both. */
.whb-header :is(
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-header-search,
	.wd-header-mobile-nav
):is([class*="wd-design-6"], [class*="wd-design-7"]) :is(.wd-tools-inner, .wd-tools-icon) {
	height: min(var(--b2io-header-icon-shell-base), var(--b2io-header-icon-max-current)) !important;
	max-height: var(--b2io-header-icon-max-current) !important;
}

.whb-header :is(
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-header-search,
	.wd-header-mobile-nav
):is([class*="wd-design-6"], [class*="wd-design-7"]):not(.wd-with-wrap) .wd-tools-icon {
	width: min(var(--b2io-header-icon-shell-base), var(--b2io-header-icon-max-current)) !important;
	max-width: var(--b2io-header-icon-max-current) !important;
}

.whb-header :is(
	.wd-header-my-account,
	.wd-header-cart,
	.wd-header-compare,
	.wd-header-wishlist,
	.wd-header-search,
	.wd-header-mobile-nav
).wd-design-8 .wd-tools-inner {
	height: min(var(--b2io-header-icon-shell-base), var(--b2io-header-icon-max-current)) !important;
	max-height: var(--b2io-header-icon-max-current) !important;
}

.whb-header .wd-social-icons > .wd-social-icon {
	max-width: var(--b2io-header-icon-max-current);
	max-height: var(--b2io-header-icon-max-current);
}

.whb-header .wd-social-icons:not(.wd-style-default) > .wd-social-icon {
	width: min(var(--wd-social-size, 40px), var(--b2io-header-icon-max-current));
	height: min(var(--wd-social-size, 40px), var(--b2io-header-icon-max-current));
}

.whb-header .wd-social-icons .wd-icon:before {
	font-size: min(var(--wd-social-icon-size, 16px), var(--b2io-header-icon-max-current)) !important;
}

/* Header Builder "Text with icon" (Infobox) supports images, SVG and icon text. */
.whb-header .info-box-wrapper .box-with-icon .info-box-icon > img,
.whb-header .info-box-wrapper .box-with-icon .info-box-icon > picture img,
.whb-header .info-box-wrapper .info-svg-wrapper,
.whb-header .info-box-wrapper .info-svg-wrapper :is(img, svg) {
	max-height: var(--b2io-header-icon-max-current) !important;
	object-fit: contain;
}

.whb-header .info-box-wrapper .box-with-text.text-size-small {
	font-size: min(38px, var(--b2io-header-icon-max-current)) !important;
}

.whb-header .info-box-wrapper .box-with-text:is(.text-size-default, .text-size-large) {
	font-size: min(52px, var(--b2io-header-icon-max-current)) !important;
}

.whb-header .info-box-wrapper .box-with-text .info-box-icon {
	max-height: var(--b2io-header-icon-max-current) !important;
	font-size: inherit;
	line-height: 1 !important;
}

.whb-header .info-box-wrapper [class*="box-icon-with-"].box-with-text {
	--text-bg-size: min(85px, var(--b2io-header-icon-max-current));
}

.whb-header .info-box-wrapper [class*="box-icon-with-"].box-with-text:is(.text-size-default, .text-size-large) {
	--text-bg-size: min(100px, var(--b2io-header-icon-max-current));
}

/* Exact source dimensions stay separate from the visual Header Builder width. */
.whb-header .wd-logo img.b2io-exact-logo {
	width: auto !important;
	height: auto !important;
	max-width: var(--b2io-logo-display-width) !important;
	object-fit: contain;
	image-rendering: auto;
}

/* Logo animation is replayed only when JS marks a return to page top. */
@keyframes b2io-logo-zoom-out-at-top {
	from {
		opacity: .68;
		filter: blur(7px) saturate(.82);
		transform: translateZ(0) scale(1.16);
	}
	to {
		opacity: 1;
		filter: blur(0) saturate(1);
		transform: translateZ(0) scale(1);
	}
}

.whb-header .site-logo.b2io-logo-returned-top .wd-logo img {
	animation: b2io-logo-zoom-out-at-top 560ms cubic-bezier(.16, 1, .3, 1) both;
	transform-origin: center center;
	will-change: opacity, filter, transform;
}

@media (prefers-reduced-motion: reduce) {
	.whb-header .site-logo.b2io-logo-returned-top .wd-logo img {
		animation: none !important;
	}
}