/**
 * Legalcraps header styling (v4.6.0)
 * ---------------------------------------------------------------------------
 * Self-contained, loads on ALL pages (the header is global). Everything here is
 * scoped under GeneratePress header selectors (.site-header / .main-navigation)
 * so it cannot affect page content. No markup changes: this styles whatever menu
 * the site owner builds in Appearance > Menus.
 *
 * Brand: navy #0a2a52 / red #c8102e / gold #f0b429 / Barlow Condensed headings.
 *
 * Menu-item helper classes (add in Appearance > Menus > CSS Classes field):
 *   lc-cta   -> renders that single menu item as a solid gold button
 *   (big dropdowns flow into multiple columns automatically; no class needed)
 * ---------------------------------------------------------------------------
 */

/* ---- Header band: light, with red brand underline ---- */
body .site-header,
body #masthead,
body #masthead.site-header,
body .site-header .inside-header {
	background-color: #ffffff !important;
}
body .site-header,
body #masthead.site-header {
	border-bottom: 3px solid #c8102e;
}
.site-header .inside-header {
	padding-top: 14px;
	padding-bottom: 14px;
	align-items: center;
}

/* ---- Logo sizing (works for the transparent PNG or the existing SVG) ---- */
.site-header .site-logo .header-image,
.site-header .site-logo img {
	width: auto;
	height: 60px;
	max-height: 60px;
}

/* ---- Primary navigation: top-level links ---- */
body #site-navigation.main-navigation,
body #masthead .main-navigation,
.main-navigation,
.main-navigation .inside-navigation,
.main-navigation .main-nav,
.main-navigation .main-nav > ul {
	background-color: transparent !important;
}
body #site-navigation.main-navigation .main-nav ul li a,
.main-navigation .main-nav ul li a {
	font-family: "Barlow Condensed", "Oswald", sans-serif;
	font-weight: 600;
	font-size: 18px;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	color: #0a2a52 !important;
	background-color: transparent !important;
	padding: 10px 18px;
	transition: color 0.15s ease, background-color 0.15s ease;
}

/* Hover / focus / keyboard-open on top-level items */
body #site-navigation.main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
body #site-navigation.main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a,
body #site-navigation.main-navigation .main-nav ul li.sfHover:not([class*="current-menu-"]) > a,
.main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
.main-navigation .main-nav ul li.sfHover:not([class*="current-menu-"]) > a {
	color: #c8102e !important;
	background-color: transparent;
}

/* Current page: red text with a red underline accent (top level only) */
body #site-navigation.main-navigation .main-nav > ul > li[class*="current-menu-"] > a,
.main-navigation .main-nav > ul > li[class*="current-menu-"] > a {
	color: #c8102e !important;
	box-shadow: inset 0 -3px 0 #c8102e;
}

/* Dropdown caret colour follows the link */
.main-navigation .main-nav ul li a .gp-icon { opacity: 0.85; }

/* ---- Dropdown (sub-menu) panels ---- */
body #site-navigation.main-navigation ul ul,
.main-navigation ul ul {
	background-color: #0a2a52 !important;
	border-top: 3px solid #c8102e;
	box-shadow: 0 12px 28px rgba(10, 42, 82, 0.28);
	padding: 6px 0;
	opacity: 1 !important;
}
body #site-navigation.main-navigation .main-nav ul ul li,
.main-navigation .main-nav ul ul li {
	background-color: transparent !important;
}
body #site-navigation.main-navigation .main-nav ul ul li a,
.main-navigation .main-nav ul ul li a {
	color: #eef2f7 !important;
	background-color: transparent !important;
	font-size: 15px !important;
	text-transform: none !important;
	letter-spacing: 0.2px;
	padding: 9px 20px;
}
body #site-navigation.main-navigation .main-nav ul ul li:hover > a,
body #site-navigation.main-navigation .main-nav ul ul li:focus > a,
body #site-navigation.main-navigation .main-nav ul ul li.sfHover > a,
.main-navigation .main-nav ul ul li:hover > a,
.main-navigation .main-nav ul ul li:focus > a,
.main-navigation .main-nav ul ul li.sfHover > a {
	color: #ffffff !important;
	background-color: #14528f !important;
}
body #site-navigation.main-navigation .main-nav ul ul li[class*="current-menu-"] > a,
.main-navigation .main-nav ul ul li[class*="current-menu-"] > a {
	color: #f0b429 !important;
}

/* ---- Multi-column "mega" dropdown (opt-in via the lc-mega class) ---- *
 * Add the class "lc-mega" to a parent menu item (Appearance > Menus > CSS
 * Classes field) and ITS submenu becomes a wide multi-column panel. All other
 * dropdowns stay compact single columns. Ideal for the 50-state list.        */
.main-navigation .main-nav ul li.lc-mega {
	position: relative;
}
/* Closed state: keep the panel completely hidden and out of view so no strip
 * of it shows in the header bar. GeneratePress reveals submenus on hover, so we
 * only paint the wide panel while the parent item is hovered/focused/open. */
.main-navigation .main-nav ul li.lc-mega > ul.sub-menu {
	position: absolute;
	top: 100%;
	left: auto;
	right: 0;
	width: 1180px;
	max-width: 92vw;
	box-sizing: border-box;
	visibility: hidden;
	opacity: 0;
	max-height: 0;
	overflow: hidden;
}
/* Open state: parent hovered, focused, or keyboard-toggled -> show the wide
 * 5-column panel. */
.main-navigation .main-nav ul li.lc-mega:hover > ul.sub-menu,
.main-navigation .main-nav ul li.lc-mega:focus-within > ul.sub-menu,
.main-navigation .main-nav ul li.lc-mega.sfHover > ul.sub-menu {
	visibility: visible;
	opacity: 1;
	max-height: 520px;
	-webkit-columns: 5;
	-moz-columns: 5;
	columns: 5;
	column-gap: 0;
}
.main-navigation .main-nav ul li.lc-mega > ul.sub-menu > li {
	display: block;
	width: 100%;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid;
}

/* ---- Optional CTA button: add class "lc-cta" to a menu item ---- */
.main-navigation .main-nav ul li.lc-cta > a {
	background-color: #f0b429;
	color: #0a2a52;
	border-radius: 6px;
	margin: 0 0 0 10px;
	padding: 10px 22px;
}
.main-navigation .main-nav ul li.lc-cta:hover > a,
.main-navigation .main-nav ul li.lc-cta.sfHover > a {
	background-color: #ffc640;
	color: #0a2a52;
}

/* ---- Mobile (GeneratePress inline toggle) ---- */
.main-navigation .menu-toggle {
	font-family: "Barlow Condensed", "Oswald", sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	color: #0a2a52;
}
.main-navigation .menu-toggle:hover,
.main-navigation .menu-toggle:focus { color: #c8102e; }

@media (max-width: 768px) {
	/* On mobile the menu stacks; drop the multi-column treatment and the
	 * desktop dropdown panel styling so items read as a simple list. */
	.main-navigation .main-nav ul ul.sub-menu,
	.main-navigation .main-nav ul li.lc-mega > ul.sub-menu,
	.main-navigation .main-nav ul ul.sub-menu > li,
	.main-navigation .main-nav ul li.lc-mega > ul.sub-menu > li {
		-webkit-columns: auto;
		-moz-columns: auto;
		columns: auto;
		column-width: auto;
		width: 100%;
		max-width: none;
		max-height: none;
		overflow: visible;
	}
	.main-navigation .main-nav ul li a {
		font-size: 17px;
		padding: 12px 20px;
	}
	.main-navigation ul ul {
		box-shadow: none;
		border-top: 0;
	}
	.main-navigation .main-nav > ul > li[class*="current-menu-"] > a {
		box-shadow: none;
	}
	.site-header .site-logo .header-image,
	.site-header .site-logo img { height: 48px; max-height: 48px; }
}
