/**
 * Unified public + logged-in header layout (matches index.php positioning).
 * Load after ppc-style.css and public-responsive.css.
 */

/* ---------- Shell: override legacy fixed/table header from ppc-style.css ---------- */
.header_wraper,
.header_wraperindex,
.header_wraper.header_wraperindex,
.header_wraperinner {
	position: fixed !important;
	top: 0;
	left: 0;
	right: 0;
	width: 100% !important;
	float: none !important;
	height: auto !important;
	min-height: 90px;
	z-index: 10050 !important;
	border-top: 0 !important;
	box-sizing: border-box;
	overflow: visible !important;
}

.header_wraperindex > .mainwraper,
.header_wraperindex .mainwraper[style] {
	box-sizing: border-box;
	width: 100% !important;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: clamp(12px, 1.5vw, 20px);
	padding-right: clamp(12px, 1.5vw, 20px);
	overflow: visible !important;
}

.header_wraperindex .top_header {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding-top: 8px;
	padding-bottom: 8px;
}

.header_wraperindex .header1,
.header_wraperindex .header2 {
	float: none !important;
	box-sizing: border-box;
}

.header_wraperindex .header1 {
	margin: 0;
	padding: 0;
}

.header_wraperindex .logoDiv.left {
	width: auto !important;
	max-width: min(280px, 42vw);
	padding: 8px 0 0 0 !important;
	margin: 0 !important;
	float: none !important;
	box-sizing: border-box;
}

.header_wraperindex .styleImage {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	max-width: 100%;
}

.header_wraperindex .styleImage img {
	display: block;
	max-height: 52px;
	width: auto;
	max-width: 100%;
}

.header_wraperindex .header2 .right {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 10px 14px;
	width: 100%;
	box-sizing: border-box;
}

.header_wraperindex .languages {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	float: none !important;
	position: static !important;
	left: auto !important;
	right: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}

.header_wraperindex .userDets,
.header_wraperindex .langugelogdin {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	float: none !important;
}

.header_wraperindex #primary-nav.headbar {
	float: none !important;
	clear: both !important;
	width: 100%;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.header_wraperindex .menu {
	float: none !important;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	box-sizing: border-box;
}

.header_wraperindex .menu > li {
	float: left;
	box-sizing: border-box;
	position: relative;
	z-index: 1;
}

/* Sibling nav items share the row — raise hovered item so its dd is not covered (e.g. FAQ under Contact Us) */
.header_wraperindex .menu > li:hover,
.header_wraperindex .menu > li:focus-within,
.header_wraperindex .menu > li.submenu-open {
	z-index: 10300 !important;
}

.margin_topdiv {
	margin-top: 96px !important;
}

/* ---------- Desktop: logo left, language row + menu right (index layout) ---------- */
@media (min-width: 992px) {
	.header_wraperindex .top_header {
		display: flex !important;
		align-items: flex-start;
		justify-content: space-between;
		gap: 20px;
	}

	.header_wraperindex .header1 {
		display: block !important;
		flex: 0 0 auto;
		width: auto !important;
		margin-left: 0 !important;
		padding-left: 0 !important;
	}

	.header_wraperindex .logoDiv.left {
		padding-left: 0 !important;
		margin-left: 0 !important;
	}

	.header_wraperindex .header2 {
		display: flex !important;
		flex: 1 1 0;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		gap: 10px 14px;
		min-width: 0;
		width: auto !important;
		position: relative;
		z-index: auto;
	}

	.header_wraperindex .header2 .right {
		order: 2;
		width: auto;
		flex: 0 0 auto;
		justify-content: flex-end;
	}

	.header_wraperindex #primary-nav.headbar {
		order: 1;
		width: auto;
		clear: none !important;
		max-height: none !important;
		overflow: visible !important;
		flex: 0 1 auto;
	}

	.header_wraperindex .menu {
		display: flex !important;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: stretch;
		width: auto !important;
		border-radius: 10px;
		overflow: visible;
	}

	.header_wraperindex .menu > li {
		float: none !important;
		width: auto !important;
		flex: 0 0 auto;
	}

	.nav-toggle {
		display: none !important;
	}
}

/* ---------- Mobile / tablet: stacked header, collapsible nav ---------- */
@media (max-width: 991px) {
	.header_wraper,
	.header_wraperindex,
	.header_wraper.header_wraperindex,
	.header_wraperinner {
		position: relative !important;
	}

	.margin_topdiv {
		margin-top: 0 !important;
	}

	.header_wraperindex .top_header {
		display: block !important;
		width: 100%;
	}

	.header_wraperindex .header1,
	.header_wraperindex .header2 {
		display: block !important;
		width: 100% !important;
	}

	.header_wraperindex .logoDiv.left {
		max-width: 100%;
		text-align: center;
		margin: 0 auto;
	}

	.header_wraperindex .header2 .right {
		justify-content: space-between;
	}

	.header_wraperindex .languages {
		flex: 1 1 auto;
		min-width: 0;
		justify-content: flex-start;
	}

	.nav-toggle {
		display: inline-flex !important;
	}

	.header_wraperindex .menu {
		display: block !important;
		width: 100% !important;
	}

	.header_wraperindex .menu > li {
		float: none !important;
		width: 100% !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.2);
	}

	.header_wraperindex .menu a {
		float: none !important;
		display: block !important;
	}

	/* Collapsed until hamburger — must override desktop overflow:visible on #primary-nav */
	.header_wraperindex #primary-nav.headbar {
		max-height: 0 !important;
		overflow: hidden !important;
		transition: max-height 0.35s ease;
	}

	body.public-nav-open .header_wraperindex #primary-nav.headbar {
		max-height: 2200px !important;
		overflow: hidden !important;
	}

	/* Accordion submenus only — no hover/focus flyouts on touch */
	.header_wraperindex .menu li dl.menulinks > dd,
	.header_wraperindex .menulinks dd,
	.header_wraper .menu li dd {
		display: none !important;
		position: static !important;
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
		z-index: auto !important;
	}

	.header_wraperindex .menu li.submenu-open > dl.menulinks > dd,
	.header_wraper .menu li.submenu-open > dl.menulinks > dd {
		display: block !important;
	}

	.header_wraperindex .menu li:hover > dl.menulinks > dd,
	.header_wraperindex .menu li:focus-within > dl.menulinks > dd,
	.header_wraper .menu li:hover > dl.menulinks > dd,
	.header_wraper .menu li:focus-within > dl.menulinks > dd,
	.header_wraper .menu li:hover dd,
	.header_wraper .menu li a:hover dd {
		display: none !important;
	}

	.header_wraperindex .menu li.submenu-open:hover > dl.menulinks > dd,
	.header_wraperindex .menu li.submenu-open:focus-within > dl.menulinks > dd,
	.header_wraper .menu li.submenu-open:hover > dl.menulinks > dd,
	.header_wraper .menu li.submenu-open:focus-within > dl.menulinks > dd {
		display: block !important;
	}

	.header_wraperindex .menu > li:hover,
	.header_wraperindex .menu > li:focus-within,
	.header_wraper .menu > li:hover,
	.header_wraper .menu > li:focus-within {
		z-index: 1 !important;
	}
}

/* ---------- Active nav item (current page) ---------- */
.header_wraperindex .menu > li.nav-active > dl.menulinks > dt > a,
.header_wraperindex .menu > li.nav-active > dl.menulinks > dt > a:hover {
	background: rgba(59, 130, 246, 0.38) !important;
	color: #ffffff !important;
	box-shadow: inset 0 -3px 0 #38bdf8;
}

.header_wraperindex .menulinks dd a.nav-active,
.header_wraperindex .menulinks dd a.nav-active:hover,
.header_wraperindex .menulinks dt > a.nav-active,
.header_wraperindex .menulinks dt > a.nav-active:hover {
	background: #eff6ff !important;
	color: #1d4ed8 !important;
	font-weight: 600 !important;
}

.header_wraperindex .menu > li.nav-active > dl.menulinks > dt > a.nav-active,
.header_wraperindex .menu > li.nav-active > dl.menulinks > dt > a.nav-active:hover {
	background: rgba(59, 130, 246, 0.38) !important;
	color: #ffffff !important;
	box-shadow: inset 0 -3px 0 #38bdf8;
}

@media (max-width: 991px) {
	.header_wraperindex .menu > li.nav-active > dl.menulinks > dt > a {
		box-shadow: inset 4px 0 0 #38bdf8;
	}
}

/* ---------- Language dropdown: avoid nav overlap + visible chevron ---------- */
.header_wraperindex,
.header_wraperindex .top_header,
.header_wraperindex .header2,
.header_wraperindex .header2 .right,
.header_wraperindex .languages,
.header_wraperindex .langugelogdin {
	overflow: visible !important;
}

.header_wraperindex .languages {
	margin: 0 !important;
	right: auto !important;
}

.header_wraperindex .languages .langugelogdin,
.header_wraperindex .languages .sbHolder {
	position: relative !important;
	z-index: 100 !important;
}

.header_wraperindex .languages .sbHolder:has(.sbToggleOpen) {
	z-index: 10250 !important;
}

.header_wraperindex .languages .sbHolder {
	width: 152px !important;
	min-width: 132px;
	margin: 0 !important;
}

.header_wraperindex .languages .sbSelector {
	width: calc(100% - 34px) !important;
	box-sizing: border-box;
}

.header_wraperindex .languages .sbOptions {
	z-index: 10255 !important;
	width: 100% !important;
	min-width: 152px !important;
	max-height: min(280px, 52vh) !important;
	overflow-y: auto !important;
	-webkit-overflow-scrolling: touch;
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
	top: calc(100% + 4px) !important;
	bottom: auto !important;
	left: auto !important;
	right: 0 !important;
}

/* Desktop: language sits right of nav — list opens down into page content */
@media (min-width: 992px) {
	.header_wraperindex .languages .sbOptions {
		top: calc(100% + 6px) !important;
	}
}

/* CSS chevron — sprite arrow is invisible on dark header */
.header_wraperindex .languages .sbToggle,
.header_wraperindex .languages .sbToggleOpen,
.header_wraperindex .languages .sbToggle:hover,
.header_wraperindex .languages .sbToggleOpen:hover {
	background: none !important;
	width: 32px !important;
	height: 100% !important;
	position: absolute !important;
	right: 0 !important;
	top: 0 !important;
}

.header_wraperindex .languages .sbToggle::before,
.header_wraperindex .languages .sbToggleOpen::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 7px;
	height: 7px;
	margin: -5px 0 0 -5px;
	border-right: 2px solid #f8fafc;
	border-bottom: 2px solid #f8fafc;
	transform: rotate(45deg);
	opacity: 0.95;
	pointer-events: none;
}

.header_wraperindex .languages .sbToggleOpen::before,
.header_wraperindex .languages .sbToggleOpen:hover::before {
	transform: rotate(-135deg);
	margin-top: -2px;
}

/* ---------- Nav submenus (FAQ, Account) — prevent text clipping (desktop only) ---------- */
@media (min-width: 992px) {
	.header_wraperindex,
	.header_wraperindex .mainwraper,
	.header_wraperindex .top_header,
	.header_wraperindex .header2,
	.header_wraperindex #primary-nav.headbar,
	.header_wraperindex .headbar,
	.header_wraperindex .menu,
	.header_wraperindex .menu > li,
	.header_wraperindex .menu li dl.menulinks {
		overflow: visible !important;
	}

	.header_wraperindex .menu li dl.menulinks > dd,
	.header_wraperindex .menulinks dd {
		overflow: visible !important;
		height: auto !important;
		min-height: 0 !important;
		line-height: normal !important;
		min-width: 220px !important;
		width: max-content !important;
		max-width: none !important;
		box-sizing: border-box;
		z-index: 10200 !important;
	}

	/* Beat .menu a { float:left; text-transform:uppercase; padding:0 15px 20px } on submenu links */
	.header_wraperindex .menu li dl.menulinks > dd > a,
	.header_wraperindex .menulinks dd a {
		display: block !important;
		float: none !important;
		clear: both !important;
		width: auto !important;
		min-width: 100% !important;
		max-width: none !important;
		white-space: nowrap !important;
		overflow: visible !important;
		text-overflow: clip !important;
		text-transform: none !important;
		letter-spacing: normal !important;
		font-weight: 500 !important;
		padding: 10px 18px !important;
		box-sizing: border-box;
	}

	/* v20260630 — nav submenu stacking (search "20260630" on demo to verify deploy) */
	.header_wraper.header_wraperindex .menu li,
	.header_wraper.header_wraperindex .menulinks,
	.header_wraperindex .menu > li {
		position: relative;
		z-index: 1 !important;
	}

	.header_wraper.header_wraperindex .menu > li:hover,
	.header_wraper.header_wraperindex .menu > li:focus-within,
	.header_wraper.header_wraperindex .menu > li.submenu-open,
	.header_wraperindex .menu > li:hover,
	.header_wraperindex .menu > li:focus-within,
	.header_wraperindex .menu > li.submenu-open {
		z-index: 10300 !important;
	}
}
