/* ============================================
   Top Navigation Bar (informational pages)
   ============================================ */

.multitrade-top-nav {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.multitrade-top-nav .wp-block-group {
	gap: var(--wp--preset--spacing--30);
}

.multitrade-top-nav .wp-block-navigation {
	min-height: 0;
}

.multitrade-top-nav .wp-block-navigation a {
	padding: var(--wp--preset--spacing--30) 0;
	opacity: 0.8;
	transition: opacity 0.2s ease;
}

.multitrade-top-nav .wp-block-navigation a:hover {
	opacity: 1;
}

/* Hide WooCommerce account/cart icons injected by parent theme into top nav (catalogue mode) */
.multitrade-top-nav .wp-block-woocommerce-customer-account,
.multitrade-top-nav .wp-block-woocommerce-mini-cart {
	display: none;
}

/* ============================================
   Header Enhancements
   ============================================ */

/* UX-035: Solid background + dark text for search input readability */
.multitrade-header-search .wp-block-search__input {
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-radius: var(--wp--custom--input-border-radius);
	background: #fff;
	color: var(--wp--preset--color--contrast);
	min-height: var(--wp--custom--input-min-height);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	transition: border-color var(--wp--custom--transition-speed) ease,
		box-shadow var(--wp--custom--transition-speed) ease;
}

.multitrade-header-search .wp-block-search__input::placeholder {
	color: #888;
}

.multitrade-header-search .wp-block-search__input:focus {
	border-color: var(--wp--preset--color--tertiary);
	box-shadow: 0 0 0 2px rgba(212, 32, 32, 0.25);
	outline: none;
}

.multitrade-header-search .wp-block-search__inside-wrapper {
	border-radius: 20px;
	overflow: hidden;
}

.multitrade-header-search .wp-block-search__input {
	border-radius: 20px 0 0 20px;
}

.multitrade-header-search .wp-block-search__button {
	background: var(--wp--preset--color--tertiary);
	border: none;
	border-radius: 0 20px 20px 0;
	color: var(--wp--preset--color--base);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--45);
}

/* ============================================
   UX-030: Sticky Header (full unit)
   ============================================ */

header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
}

/* UX-036: Admin bar offset — WP admin bar is 32px desktop, 46px mobile */
.admin-bar header.wp-block-template-part {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar header.wp-block-template-part {
		top: 46px;
	}
}

/* Remove gap between header and hero on homepage */
.home header + main,
.home header + .wp-block-group {
	margin-top: 0 !important;
}

/* UX-044: Top padding for non-home pages (breadcrumbs/content spacing) */
body:not(.home) main {
	padding-top: clamp(1rem, 2vw, 1.5rem);
}

/* Hide WooCommerce customer-account and mini-cart icons injected by parent theme (catalogue mode — no purchasing) */
/* Nav bar link vertical breathing room */
.multitrade-nav-bar {
	padding-top: 3px !important;
	padding-bottom: 3px !important;
}

.multitrade-nav-bar .wp-block-woocommerce-customer-account,
.multitrade-nav-bar .wp-block-woocommerce-mini-cart {
	display: none;
}

/* Hide mini-cart drawer panel entirely (catalogue mode — no cart functionality) */
.wc-block-mini-cart__drawer,
.wp-block-woocommerce-mini-cart__drawer {
	display: none !important;
}

/* ============================================
   UX-026: Reduce Header Visual Weight (Desktop)
   ============================================ */

/* Search bar: constrain width so it doesn't dominate */
.multitrade-header-search .wp-block-search__inside-wrapper {
	max-width: 480px;
	margin: 0 auto;
}

/* Call Us: visual separator from search */
.multitrade-header-main .wp-block-column:last-child {
	padding-left: var(--wp--preset--spacing--50);
	border-left: 1px solid rgba(255, 255, 255, 0.12);
}

/* ============================================
   UX-025: Mobile Single-Row Header
   ============================================ */

@media (max-width: 781px) {
	/* Hide top nav */
	.multitrade-top-nav {
		display: none !important;
	}

	/* Compact header row */
	.multitrade-header-main {
		padding-top: var(--wp--preset--spacing--30) !important;
		padding-bottom: var(--wp--preset--spacing--30) !important;
		position: relative;
	}

	/* UX-032: Keep columns in a single row, push icons to far right */
	.multitrade-header-main .wp-block-columns {
		flex-wrap: nowrap !important;
		gap: 0 !important;
		align-items: center;
		justify-content: space-between;
	}

	/* Override WordPress is-stacked-on-mobile: prevent 100% width columns */
	.multitrade-header-main .wp-block-columns > .wp-block-column {
		flex-basis: auto !important;
	}

	/* Logo: fixed compact size (block-level elements expand to 100% without explicit width) */
	.multitrade-header-main .wp-block-column:first-child {
		flex: 0 0 auto !important;
		width: auto !important;
		min-width: 0 !important;
	}

	.multitrade-header-main .wp-block-column:first-child figure {
		margin: 0 !important;
		width: fit-content !important;
	}

	/* UX-033: Larger mobile logo for prominence */
	.multitrade-header-main .wp-block-column:first-child img {
		width: 150px !important;
	}

	/* Search column: dropdown panel below header */
	.multitrade-header-search {
		position: absolute !important;
		top: 100%;
		left: 0;
		right: 0;
		flex-basis: auto !important;
		background: var(--wp--preset--color--header-background) !important;
		padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50) !important;
		z-index: 99;
		display: none !important;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
		box-sizing: border-box;
	}

	.multitrade-header-search .wp-block-search__inside-wrapper {
		max-width: 100% !important;
	}

	.multitrade-header-search.is-search-open {
		display: block !important;
	}

	.multitrade-header-search .wp-block-search__input {
		min-width: 0;
	}

	/* Phone column: hidden (use nth-child(3), not :last-child, since JS appends mobile-utils) */
	.multitrade-header-main .wp-block-column:nth-child(3) {
		display: none !important;
		border-left: none;
		padding-left: 0;
	}

	/* Mobile utility icons container (injected by mobile-header.js) */
	.multitrade-mobile-utils {
		display: flex;
		align-items: center;
		gap: 0;
		margin-left: auto;
		flex-shrink: 0;
	}

	.mt-mobile-search-toggle,
	.mt-mobile-phone {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		background: none;
		border: none;
		cursor: pointer;
		padding: 0;
		color: var(--wp--preset--color--header-foreground);
		text-decoration: none;
	}

	.mt-mobile-search-toggle svg,
	.mt-mobile-phone svg {
		width: 22px;
		height: 22px;
		fill: none;
		stroke: currentColor;
		stroke-width: 2;
		stroke-linecap: round;
		stroke-linejoin: round;
	}

	/* Hamburger sizing (moved from nav-bar into mobile-utils by JS) */
	.multitrade-mobile-utils .wp-block-navigation__responsive-container-open {
		min-width: 44px;
		min-height: 44px;
		display: flex !important;
		align-items: center;
		justify-content: center;
		color: var(--wp--preset--color--header-foreground);
	}

	.multitrade-mobile-utils .wp-block-navigation__responsive-container-open svg {
		width: 24px;
		height: 24px;
	}

	/* Nav bar: collapsed on mobile (content moved to header row by JS) */
	.multitrade-nav-bar {
		min-height: 0;
		display: none;
	}

	/* UX-029: Mobile burger drawer section labels */
	.mt-drawer-label {
		display: block;
		font-size: 0.7rem;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 1.5px;
		color: var(--wp--preset--color--tertiary);
		padding: var(--wp--preset--spacing--35) 0 var(--wp--preset--spacing--20);
		opacity: 0.9;
	}

	.mt-drawer-divider {
		display: block;
		height: 1px;
		background: rgba(255, 255, 255, 0.12);
		margin: var(--wp--preset--spacing--30) 0;
	}


	/* Search results: full width on mobile */
	.multitrade-search-results {
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		border-radius: 0;
		max-height: 60vh;
	}

	/* UX-034: Soften footer copyright separator on mobile */
	.multitrade-footer + .wp-block-group.alignfull {
		border-top-color: rgba(255, 255, 255, 0.06) !important;
	}
}

