/**
 * Menu Modern (v1.9.3)
 * A cleaner desktop dropdown / mega menu and a properly right-aligned mobile toggle + drawer.
 * Loads last, so it overrides menu-plus.css, college-header.css and extras.css.
 * Remove the "delaware-menu-modern" enqueue in inc/extras/bootstrap.php to go back to the old look.
 */

:root {
	--mm-ink: #14213d;
	--mm-muted: #5b6577;
	--mm-line: #e7eaf0;
	--mm-tint: #f4f6fb;
	--mm-ease: cubic-bezier(0.22, 0.8, 0.28, 1);
}

/* =====================================================================
   DESKTOP (1200px and up)
   ===================================================================== */
@media (min-width: 1200px) {

	/* The bar itself: quieter hover, gold underline instead of a dark box */
	body.dwc-ch .dwc-ch__nav .main-nav .menu > li:hover > a,
	body.dwc-ch .dwc-ch__nav .main-nav .menu > li:focus-within > a,
	body.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-open > a,
	body.dwc-ch .dwc-ch__nav .main-nav .menu > li.current-menu-item > a,
	body.dwc-ch .dwc-ch__nav .main-nav .menu > li.current_page_item > a,
	body.dwc-ch .dwc-ch__nav .main-nav .menu > li.current-menu-ancestor > a {
		background: rgba(255, 255, 255, 0.07);
		box-shadow: inset 0 -3px 0 var(--ch-accent);
	}

	/* The theme floats .main-nav, which collapses the bar's container to 0px tall.
	   Clear that so panels open exactly under the bar, and drop the theme's extra li padding
	   so the whole bar height is the link's hit area. */
	body.dwc-ch .dwc-ch__nav:not(.dwc-ch__nav--inline) .main-nav {
		float: none;
	}
	body.dwc-ch .dwc-ch__nav:not(.dwc-ch__nav--inline) .container {
		display: flow-root;
	}
	body.dwc-ch .dwc-ch__nav:not(.dwc-ch__nav--inline) .main-nav .menu > li.menu-item {
		padding: 0;
		float: none;
	}

	/* Mega items anchor to the menu container, so the panel lines up with the page grid */
	body.dwc-ch .dwc-ch__nav .container {
		position: relative;
	}
	body.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-mega {
		position: static;
	}

	/* ---------- Shared panel look ---------- */
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu {
		display: block;
		top: 100%;
		left: 0;
		min-width: 260px;
		padding: 10px;
		margin: 0;
		border: 0;
		border-top: 3px solid var(--ch-accent);
		border-radius: 0 0 14px 14px;
		background: #fff;
		box-shadow: 0 26px 60px -20px rgba(9, 18, 36, 0.4), 0 2px 8px rgba(9, 18, 36, 0.06);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(10px);
		transition: opacity 0.22s ease, transform 0.28s var(--mm-ease), visibility 0s linear 0.28s;
	}
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li:hover > ul.sub-menu,
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li:focus-within > ul.sub-menu,
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-open > ul.sub-menu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: none;
		transition-delay: 0s;
	}

	/* Items */
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li {
		position: relative;
		margin: 0;
		padding: 0;
		border: 0;
		background: none;
		opacity: 1;
		transform: none;
	}
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li > a {
		position: relative;
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 13px 16px 13px 18px;
		border-radius: 10px;
		color: var(--mm-ink);
		font-size: 15px;
		font-weight: 600;
		line-height: 1.3;
		text-transform: none;
		white-space: normal;
		transition: background-color 0.2s ease, color 0.2s ease, padding-left 0.25s var(--mm-ease);
	}
	/* Small gold marker that grows on hover */
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li > a:before {
		content: "";
		display: block;
		flex: 0 0 auto;
		width: 6px;
		height: 6px;
		border-radius: 50%;
		background: var(--ch-accent);
		opacity: 0.55;
		transition: transform 0.25s var(--mm-ease), opacity 0.2s ease;
	}
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li:hover > a,
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li > a:focus-visible {
		padding-left: 22px;
		background: var(--mm-tint);
		color: var(--ch-nav);
	}
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li:hover > a:before,
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li > a:focus-visible:before {
		opacity: 1;
		transform: scale(1.5);
	}
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu > li.current-menu-item > a {
		color: var(--ch-nav);
		background: var(--mm-tint);
	}

	/* ---------- Mega panel (7+ children, or the "mega" CSS class) ---------- */
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-mega > ul.sub-menu {
		display: grid;
		grid-template-columns: repeat(var(--mx-cols, 3), minmax(0, 1fr));
		gap: 4px 12px;
		left: 0;
		right: 0;
		width: 100%;
		min-width: 0;
		padding: 26px 28px 30px;
		border-radius: 0 0 16px 16px;
	}
	/* Small heading strip on top of the mega panel */
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-mega > ul.sub-menu:after {
		content: "";
		grid-column: 1 / -1;
		order: 99;
		height: 0;
	}
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-mega > ul.sub-menu > li > a {
		padding: 16px 18px;
		border: 1px solid var(--mm-line);
		min-height: 58px;
	}
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-mega > ul.sub-menu > li:hover > a,
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-mega > ul.sub-menu > li > a:focus-visible {
		border-color: color-mix(in srgb, var(--ch-accent) 60%, #fff);
		background: color-mix(in srgb, var(--ch-accent) 9%, #fff);
		padding-left: 22px;
	}
	/* Small dropdown arrow on the parent: turn it when open */
	body.dwc-ch.dwc-nav-dd .dwc-ch__nav .main-nav .menu > li.menu-item-has-children > a:after {
		transition: transform 0.25s var(--mm-ease);
	}
	body.dwc-ch.dwc-nav-dd .dwc-ch__nav .main-nav .menu > li.menu-item-has-children:hover > a:after,
	body.dwc-ch.dwc-nav-dd .dwc-ch__nav .main-nav .menu > li.menu-item-has-children.dwc-open > a:after {
		transform: rotate(-135deg) translateY(2px);
	}

	/* Third-level flyouts (normal, non-mega dropdowns) */
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li:not(.dwc-mega) ul.sub-menu ul.sub-menu {
		top: -10px;
		left: calc(100% + 6px);
		min-width: 240px;
		padding: 10px;
		border-radius: 14px;
		box-shadow: 0 26px 60px -20px rgba(9, 18, 36, 0.4);
	}
}

/* Narrow desktop: mega panel uses two columns so text never squeezes */
@media (min-width: 1200px) and (max-width: 1360px) {
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li.dwc-mega > ul.sub-menu {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* =====================================================================
   TABLET + PHONE (under 1200px), layouts H1 to H6
   Logo on the left, menu button on the RIGHT, drawer slides in from the right.
   Flexbox only (no grid), so it fits narrow screens.
   ===================================================================== */
@media (max-width: 1199px) {

	/* Header row: [logo] ... [menu button] */
	body.dwc-ch .dwc-ch__midin {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding-left: 16px;
		padding-right: 12px;
		text-align: left;
	}
	body.dwc-ch .dwc-ch__mid .nav-mobile {
		position: relative;
		display: block;
		order: 99;
		flex: 0 0 46px;
		width: 46px;
		height: 46px;
		margin: 0 0 0 auto;
	}
	body.dwc-ch .dwc-ch__mid .site-logo {
		order: 0;
		flex: 0 1 auto;
		width: auto;
		min-width: 0;
		margin: 0 auto 0 0;
		justify-content: flex-start;
	}
	body.dwc-ch .dwc-ch__mid .site-logo img {
		max-width: 100%;
		height: auto;
	}
	/* H3 has its own rounded bar padding */
	body.dwc-ch-h3 .dwc-ch__midin {
		padding-left: 14px;
		padding-right: 10px;
	}

	/* The button fills its own 46px box, pinned to the right */
	body.dwc-drawer .dwc-ch__mid .navbar-icon,
	body.dwc-ch .dwc-ch__mid .navbar-icon {
		position: absolute;
		inset: 0;
		left: auto;
		right: 0;
		top: 0;
		width: 46px;
		height: 46px;
		transform: none;
		border-radius: 12px;
	}
	body.dwc-drawer .dwc-ch__mid .navbar-icon:active {
		transform: scale(0.94);
	}

	/* ---------- Drawer: slides in from the right ---------- */
	body.dwc-drawer #menu-sidebar-panel,
	body.dwc-drawer-left #menu-sidebar-panel,
	body.dwc-drawer-full #menu-sidebar-panel {
		top: 0;
		bottom: 0;
		left: auto;
		right: 0;
		width: min(340px, 86vw);
		max-width: 100%;
		height: 100vh;
		height: 100dvh;
		max-height: 100dvh;
		border-radius: 20px 0 0 20px;
		opacity: 1;
		transform: translate3d(105%, 0, 0);
		transition: transform 0.4s cubic-bezier(0.32, 0.72, 0, 1), visibility 0s linear 0.4s, box-shadow 0.4s ease;
	}
	body.dwc-drawer #menu-sidebar-panel.open,
	body.dwc-drawer-left #menu-sidebar-panel.open,
	body.dwc-drawer-full #menu-sidebar-panel.open {
		transform: none;
		visibility: visible;
		box-shadow: -18px 0 50px rgba(8, 12, 28, 0.32);
		transition-delay: 0s;
	}
	/* Items glide in from the right edge */
	body.dwc-mx.dwc-drawer #menu-sidebar-panel ul.menu > li,
	body.dwc-mx.dwc-drawer-left #menu-sidebar-panel ul.menu > li,
	body.dwc-mx.dwc-drawer-full #menu-sidebar-panel ul.menu > li {
		transform: translateX(22px);
	}
	body.dwc-mx.dwc-drawer #menu-sidebar-panel.open ul.menu > li,
	body.dwc-mx.dwc-drawer-left #menu-sidebar-panel.open ul.menu > li,
	body.dwc-mx.dwc-drawer-full #menu-sidebar-panel.open ul.menu > li {
		transform: none;
	}

	/* ---------- Drawer contents: simple stacked rows ---------- */
	body.dwc-drawer #menu-sidebar-panel .widget-panel-header {
		min-height: 68px;
		padding: 10px 14px 10px 18px;
	}
	body.dwc-drawer #menu-sidebar-panel .dwc-drawer-logo {
		min-width: 0;
	}
	body.dwc-drawer #menu-sidebar-panel .dwc-drawer-logo img {
		max-width: 100%;
		height: auto;
	}
	body.dwc-drawer #menu-sidebar-panel .widget-canvas-content {
		height: 100%;
		max-height: 100%;
	}
	body.dwc-drawer #menu-sidebar-panel .widget-panel-content {
		padding: 8px 14px 20px;
		overflow-x: hidden;
		overflow-y: auto;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu {
		display: block;
		margin: 0;
		padding: 0;
		text-align: left;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu > li {
		display: block;
		border-bottom: 1px solid var(--dwc-drawer-line);
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu > li:last-child {
		border-bottom: 0;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu > li > a {
		display: block;
		padding: 15px 48px 15px 4px;
		font-size: 16.5px;
		font-weight: 600;
		line-height: 1.3;
		letter-spacing: 0.01em;
		overflow-wrap: anywhere;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu > li > a:before {
		left: -14px;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu li a .toggle-menu-children {
		width: 40px;
		height: 40px;
		margin-top: -20px;
	}

	/* Submenus: indented tap rows with a gold guide line */
	body.dwc-drawer #menu-sidebar-panel ul.menu ul.sub-menu {
		margin: 0 0 12px 4px;
		padding: 2px 0 2px 10px;
		border-left: 2px solid var(--mx-gold, #c9a24b);
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu ul.sub-menu li a {
		display: block;
		padding: 11px 8px 11px 6px;
		border-radius: 8px;
		font-size: 15px;
		font-weight: 500;
		line-height: 1.35;
		color: var(--dwc-drawer-text);
		overflow-wrap: anywhere;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu ul.sub-menu li a:active {
		background: var(--dwc-drawer-soft);
	}

	/* Buttons and contact details at the bottom */
	.dwc-drawer-cta {
		padding: 12px 14px calc(14px + env(safe-area-inset-bottom, 0px));
	}
	.dwc-drawer-btn {
		min-height: 46px;
		font-size: 15px;
	}
	.dwc-drawer-info {
		padding: 14px;
		font-size: 13.5px;
	}
}

/* Short screens: tighter rows so the menu and the button fit without scrolling where possible */
@media (max-width: 1199px) and (max-height: 700px) {
	body.dwc-drawer #menu-sidebar-panel .widget-panel-header {
		min-height: 56px;
		padding-top: 6px;
		padding-bottom: 6px;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu > li > a {
		padding-top: 11px;
		padding-bottom: 11px;
		font-size: 15.5px;
	}
	body.dwc-drawer #menu-sidebar-panel ul.menu ul.sub-menu li a {
		padding-top: 8px;
		padding-bottom: 8px;
	}
	.dwc-drawer-cta {
		padding-top: 10px;
	}
	.dwc-drawer-btn {
		min-height: 42px;
	}
	.dwc-drawer-info {
		display: none;
	}
}

/* Small phones */
@media (max-width: 480px) {
	body.dwc-ch .dwc-ch__mid .site-logo img {
		max-height: 42px;
	}
	body.dwc-ch .dwc-ch__midin {
		min-height: 66px;
		gap: 10px;
	}
	body.dwc-drawer #menu-sidebar-panel,
	body.dwc-drawer-left #menu-sidebar-panel,
	body.dwc-drawer-full #menu-sidebar-panel {
		width: min(320px, 90vw);
	}
}
@media (max-width: 360px) {
	body.dwc-drawer #menu-sidebar-panel,
	body.dwc-drawer-left #menu-sidebar-panel,
	body.dwc-drawer-full #menu-sidebar-panel {
		width: 92vw;
	}
	body.dwc-ch .dwc-ch__mid .site-logo img {
		max-height: 38px;
	}
	.dwc-drawer-row > .dwc-drawer-btn {
		flex-basis: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.dwc-mx.dwc-ch .dwc-ch__nav .main-nav .menu > li > ul.sub-menu {
		transition: none;
		transform: none;
	}
}