/**
 * Nexzey Custom Header Footer — front-end block layout baseline.
 * Used by the admin preview (Phase 1 builder). Not yet enqueued on the live
 * site — that happens at cutover, once Nexzey_CHF_Set_Render actually drives
 * front-end output.
 */

.nexzey-chf-set {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 16px;
	padding: 14px 24px;
}

.nexzey-chf-set-col {
	display: flex;
	align-items: center;
	gap: 14px;
}
.nexzey-chf-set-col--left { justify-content: flex-start; }
.nexzey-chf-set-col--center { flex: 1; justify-content: center; }
.nexzey-chf-set-col--right { justify-content: flex-end; margin-left: auto; }

.nexzey-chf-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.nexzey-chf-nav a { text-decoration: none; color: inherit; }
.nexzey-chf-nav--hover-underline a:hover { text-decoration: underline; }
.nexzey-chf-nav--hover-highlight a:hover { background: rgba(0, 0, 0, 0.06); padding: 2px 6px; border-radius: 4px; }

/* Fallback in case the active theme doesn't already define this WP-standard
   visually-hidden-but-accessible class — the hamburger button's label relies on it. */
.nexzey-chf-nav .screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0; overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* -----------------------------------------------------------------
 *  Navigation / mega menu
 * -------------------------------------------------------------- */

.nexzey-chf-nav { position: relative; }
.nexzey-chf-nav-toggle { display: none; }

.nexzey-chf-nav-item { position: relative; }
.nexzey-chf-nav-item > a { display: inline-flex; align-items: center; gap: 4px; }
.nexzey-chf-nav-item--highlight > a { background: rgba(0, 0, 0, 0.06); border-radius: 6px; padding: 4px 8px; }

.nexzey-chf-nav-badge {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 1px 6px;
	border-radius: 10px;
	background: #DC2626;
	color: #fff;
}
.nexzey-chf-nav-icon { display: inline-flex; }
.nexzey-chf-mega-desc { display: block; font-size: 11px; opacity: 0.65; font-weight: 400; }

/* Panels — mega grid and plain dropdown share the same open/closed mechanics. */
.nexzey-chf-mega-panel,
.nexzey-chf-sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	background: #fff;
	color: #111827;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	border-radius: 8px;
	padding: 16px;
	z-index: 200;
	display: none;
	min-width: 220px;
	list-style: none;
	margin: 0;
}
li.is-open > .nexzey-chf-mega-panel,
li.is-open > .nexzey-chf-sub-menu {
	display: block;
}
.nexzey-chf-mega-panel {
	grid-template-columns: repeat(var(--nexzey-mega-cols, 3), 1fr);
	gap: 24px;
	min-width: 480px;
}
li.is-open > .nexzey-chf-mega-panel {
	display: grid;
}

.nexzey-chf-mega-col--links ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.nexzey-chf-mega-col--links a { display: block; padding: 4px 0; }
.nexzey-chf-mega-col-title { display: block; font-weight: 600; margin-top: 6px; }
.nexzey-chf-mega-col-caption { display: block; font-size: 12px; opacity: 0.7; }
.nexzey-chf-mega-col--image img { max-width: 100%; border-radius: 6px; display: block; }
.nexzey-chf-mega-col--html { font-size: 14px; }

.nexzey-chf-sub-menu li { position: relative; }
.nexzey-chf-sub-menu .nexzey-chf-sub-menu { top: 0; left: 100%; }

/* Hamburger — three bars animating into an X via .is-open. */
.nexzey-chf-nav-toggle-bar {
	display: block;
	width: 20px;
	height: 2px;
	background: currentColor;
	margin: 4px 0;
	transition: transform .2s ease, opacity .2s ease;
}
.nexzey-chf-nav-toggle.is-open .nexzey-chf-nav-toggle-bar:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nexzey-chf-nav-toggle.is-open .nexzey-chf-nav-toggle-bar:nth-child(2) { opacity: 0; }
.nexzey-chf-nav-toggle.is-open .nexzey-chf-nav-toggle-bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.nexzey-chf-nav-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	z-index: 99998;
	display: none;
}
.nexzey-chf-nav-overlay.is-visible { display: block; }

body.nexzey-chf-nav-scroll-lock { overflow: hidden; }

/* Mobile layout — driven by the .nexzey-chf-nav--is-mobile class (set in JS
   from each block's own mobile_breakpoint setting, not a fixed @media query,
   since that breakpoint is configurable per navigation block instance). */
.nexzey-chf-nav--is-mobile .nexzey-chf-nav-toggle {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	background: none;
	border: none;
	cursor: pointer;
	padding: 8px;
	color: inherit;
}
.nexzey-chf-nav--is-mobile .nexzey-chf-nav-wrap {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 300px;
	max-width: 85vw;
	background: #fff;
	color: #111827;
	transform: translateX(100%);
	transition: transform .25s ease;
	overflow-y: auto;
	z-index: 99999;
	padding: 60px 20px 20px;
}
.nexzey-chf-nav--is-mobile .nexzey-chf-nav-wrap.is-mobile-open { transform: translateX(0); }
.nexzey-chf-nav--is-mobile .nexzey-chf-nav-list { flex-direction: column; align-items: stretch; gap: 4px; }
.nexzey-chf-nav--is-mobile .nexzey-chf-nav-item { position: static; }
.nexzey-chf-nav--is-mobile .nexzey-chf-mega-panel,
.nexzey-chf-nav--is-mobile .nexzey-chf-sub-menu {
	position: static;
	box-shadow: none;
	grid-template-columns: 1fr !important;
	min-width: 0;
	padding: 8px 0 8px 16px;
}
.nexzey-chf-nav--is-mobile .nexzey-chf-sub-menu .nexzey-chf-sub-menu { left: 0; }

@media (prefers-reduced-motion: reduce) {
	.nexzey-chf-nav-toggle-bar,
	.nexzey-chf-nav-wrap {
		transition: none;
	}
}

.nexzey-chf-search { display: flex; }
.nexzey-chf-search-input { padding: 6px 10px; border: 1px solid #ddd; border-radius: 4px 0 0 4px; }
.nexzey-chf-search-submit { border: 1px solid #ddd; border-left: 0; border-radius: 0 4px 4px 0; background: #f5f5f5; cursor: pointer; padding: 6px 10px; }

.nexzey-chf-social-icons { display: flex; gap: 10px; }
.nexzey-chf-social-icon { display: inline-flex; align-items: center; justify-content: center; }

.nexzey-chf-contact-info { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.nexzey-chf-contact-item { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: inherit; }

.nexzey-chf-cart-icon { display: inline-flex; align-items: center; gap: 4px; position: relative; text-decoration: none; color: inherit; }
.nexzey-chf-cart-count { font-size: 12px; font-weight: 600; }

.nexzey-chf-announcement-bar {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 10px 16px;
	text-align: center;
	/* Hidden until announcement-bar.js decides whether to reveal it (not
	   dismissed) — if JS never runs, this timeout-free fallback still shows
	   the bar after a beat rather than hiding a real announcement forever. */
	opacity: 0;
	transform: translateY(-100%);
	transition: opacity .25s ease, transform .25s ease;
}
.nexzey-chf-announcement-bar.is-visible { opacity: 1; transform: translateY(0); }
.nexzey-chf-announcement-bar.is-dismissing { opacity: 0; transform: translateY(-100%); }
.nexzey-chf-announcement-bar--floating_bottom.is-dismissing { transform: translateY(100%); }
/* If announcement-bar.js never runs (blocked, errored, slow network), fall
   back to showing the bar after a beat rather than hiding a real
   announcement forever — dismissed bars are already removed from the DOM
   by then in the vastly more common case where JS does run. */
.nexzey-chf-announcement-bar { animation: nexzey-chf-announcement-fallback 0s 1.5s forwards; }
@keyframes nexzey-chf-announcement-fallback { to { opacity: 1; transform: translateY(0); } }

.nexzey-chf-announcement-bar--floating_top,
.nexzey-chf-announcement-bar--floating_bottom {
	position: fixed;
	left: 0;
	right: 0;
	z-index: 99999;
}
.nexzey-chf-announcement-bar--floating_top { top: 0; transform: translateY(-100%); }
.nexzey-chf-announcement-bar--floating_top.is-visible { transform: translateY(0); }
.nexzey-chf-announcement-bar--floating_bottom { bottom: 0; transform: translateY(100%); }
.nexzey-chf-announcement-bar--floating_bottom.is-visible { transform: translateY(0); }

.nexzey-chf-announcement-icon { margin-right: 2px; }
.nexzey-chf-announcement-countdown { font-variant-numeric: tabular-nums; font-weight: 600; opacity: 0.9; }
.nexzey-chf-announcement-dismiss { background: none; border: none; cursor: pointer; font-size: 16px; line-height: 1; color: inherit; opacity: 0.7; }
.nexzey-chf-announcement-dismiss:hover { opacity: 1; }
.nexzey-chf-announcement-cta { text-decoration: underline; color: inherit; }

@media (prefers-reduced-motion: reduce) {
	.nexzey-chf-announcement-bar { transition: none; }
}

.nexzey-chf-btn { display: inline-block; text-decoration: none; padding: 8px 16px; font-weight: 600; }
.nexzey-chf-btn--small { padding: 5px 12px; font-size: 13px; }
.nexzey-chf-btn--large { padding: 12px 22px; font-size: 16px; }

.nexzey-chf-logo img { display: block; }