/*
 * JRS Mega Menu: the header's nested nav (template 15859). Tokens only.
 * Source of truth: Workflows/jrs-site/bricks/install/jrs-megamenu.css
 */

/* Top row, matching the previous nav */
.jrs-mega .brx-nav-nested-items { display: flex; align-items: center; column-gap: var(--jrs-nav-gap); list-style: none; margin: 0; padding: 0; }
.jrs-mega .brxe-dropdown > .brx-submenu-toggle { display: flex; align-items: center; gap: 6px; }
.jrs-mega .brx-nav-nested-items > li > a.brxe-text-link,
.jrs-mega .brxe-dropdown > .brx-submenu-toggle > a,
.jrs-mega .brxe-dropdown > .brx-submenu-toggle > span {
	font-size: var(--jrs-nav-size); font-weight: var(--fw-head); font-family: var(--font-body); color: var(--ink);
	padding: 0; white-space: nowrap; background: none; border: 0; text-decoration: none;
	transition: color var(--motion-fast) var(--motion-ease);
}
.jrs-mega .brxe-dropdown > .brx-submenu-toggle > button { padding: 0; background: none; border: 0; color: var(--ink); }
.jrs-mega .brx-nav-nested-items > li > a.brxe-text-link:hover,
.jrs-mega .brxe-dropdown > .brx-submenu-toggle:hover > a,
.jrs-mega .brxe-dropdown > .brx-submenu-toggle:hover > button,
.jrs-mega .brxe-dropdown.open > .brx-submenu-toggle > a { color: var(--brand-deep); }

/* The panel, full header width with its content in the site's column */
.jrs-mega .brx-dropdown-content.jrs-mega__panel {
	margin-top: var(--jrs-mega-gap, 35px); padding: var(--space-m) var(--jrs-gutter) var(--space-l); min-width: 0;
	background: var(--white); border-top: 1px solid var(--black); border-bottom: 6px solid var(--brand);
}
/* Bridges the gap between the label and the panel, so the panel stays open on the way down */
.jrs-mega .brx-dropdown-content.jrs-mega__panel::before { content: ""; position: absolute; left: 0; right: 0; top: calc(var(--jrs-mega-gap, 35px) * -1); height: var(--jrs-mega-gap, 35px); }
.jrs-mega__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.6fr); gap: var(--space-l); max-width: var(--width-content); margin-inline: auto; width: 100%; }
.jrs-mega__col { display: flex; flex-direction: column; align-items: stretch; gap: 0; min-width: 0; }
.jrs-mega__h { margin: 0 0 var(--space-xs); padding-bottom: 8px; border-bottom: 1px solid var(--brand-soft); font-size: var(--text-micro); font-weight: var(--fw-label); letter-spacing: var(--label-tracking); text-transform: uppercase; color: var(--brand-deep); }
.jrs-mega__col .jrs-mega__h:not(:first-child) { margin-top: var(--space-s); }
.jrs-mega a.jrs-mega__link { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 0; font-size: 1rem; line-height: 1.3; font-weight: 400; color: var(--ink); text-decoration: none; white-space: normal; background: none; }
.jrs-mega a.jrs-mega__link:hover, .jrs-mega a.jrs-mega__link.is-active, .jrs-mega a.jrs-mega__link:focus-visible { color: var(--brand-deep); font-weight: 600; }
.jrs-mega a.jrs-mega__link[data-mega]::after { content: "\203A"; color: var(--brand-deep); font-size: 1.125rem; line-height: 1; }

/* The right-hand area: a feature box, or the list of the item being hovered */
.jrs-mega__side { min-width: 0; align-self: stretch; display: flex; }
.jrs-mega__default { width: 100%; display: flex; }
.jrs-mega__default[hidden], .jrs-mega__list[hidden] { display: none; }
.jrs-mega__list { width: 100%; padding: var(--space-s) var(--space-m); background: var(--brand-soft); }
.jrs-mega__listhead { margin: 0 0 8px; font-size: 1rem; font-weight: 600; color: var(--brand-deep); }
.jrs-mega__listitems { display: grid; gap: 0 var(--space-m); }
.jrs-mega__listitems--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.jrs-mega__listitems a { display: block; padding: 5px 0; font-size: .9375rem; line-height: 1.3; color: var(--ink); text-decoration: none; }
.jrs-mega__listitems a:hover, .jrs-mega__listitems a:focus-visible { color: var(--brand-deep); text-decoration: underline; }
a.jrs-mega__all { display: inline-block; margin-top: 10px; font-size: .9375rem; font-weight: 600; color: var(--brand-deep); text-decoration: none; }
a.jrs-mega__all:hover { text-decoration: underline; }
a.jrs-mega__feature { width: 100%; display: flex; align-items: flex-end; gap: var(--space-s); padding: var(--space-s) var(--space-m); background: var(--brand-deep); color: var(--white); text-decoration: none; }
a.jrs-mega__feature--soft { background: var(--brand-soft); color: var(--ink); }
a.jrs-mega__feature > span { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.jrs-mega__cover { width: 120px; height: auto; flex: none; display: block; }
.jrs-mega__eyebrow { font-size: var(--text-micro); font-weight: var(--fw-label); letter-spacing: var(--label-tracking); text-transform: uppercase; color: var(--brand-soft); }
.jrs-mega__ftitle { font-size: 1.25rem; line-height: 1.25; font-weight: 600; }
.jrs-mega__fmore { font-size: .9375rem; color: var(--brand-soft); }
a.jrs-mega__feature--soft .jrs-mega__fmore { color: var(--brand-deep); }
a.jrs-mega__feature:hover .jrs-mega__ftitle { text-decoration: underline; }

/* Phones and small tablets: Bricks' slide-in menu, columns stacked, no feature boxes.
 * Tapping an item with a list opens the list under it (jrs-megamenu.js). */
@media (max-width: 991px) {
	.jrs-mega .brx-nav-nested-items { flex-direction: column; align-items: stretch; row-gap: 4px; padding: 56px 20px 28px; overflow-y: auto; justify-content: flex-start;  }
	.jrs-mega .brx-nav-nested-items > .menu-item:has(> .brx-toggle-div), .jrs-mega .brx-nav-nested-items > .brx-toggle-div { position: absolute; top: 12px; right: 16px; width: auto; border: 0; padding: 0; }
	.jrs-mega .brx-toggle-div { color: var(--ink); font-size: 22px; }
	.jrs-mega .brxe-dropdown { flex-wrap: wrap; }
	.jrs-mega .brxe-dropdown > .brx-submenu-toggle { justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--brand-soft); }
	.jrs-mega .brxe-dropdown > .brx-submenu-toggle > a, .jrs-mega .brx-nav-nested-items > li > a.brxe-text-link { font-size: 1.125rem; }
	.jrs-mega .brx-nav-nested-items > li > a.brxe-text-link { display: block; padding: 10px 0; border-bottom: 1px solid var(--brand-soft); }
	.jrs-mega .brx-dropdown-content.jrs-mega__panel { position: static; width: auto !important; left: auto !important; margin: 0; padding: 8px 0 8px 12px; border: 0; }
	.jrs-mega .brx-dropdown-content.jrs-mega__panel::before { display: none; }
	.jrs-mega__inner { display: block; }
	.jrs-mega__col + .jrs-mega__col { margin-top: var(--space-s); }
	.jrs-mega__side { display: none; }
	.jrs-mega__list--inline { margin: 2px 0 8px; padding: 8px 12px; }
	.jrs-mega__list--inline .jrs-mega__listhead { display: none; }
	.jrs-mega__list--inline .jrs-mega__listitems--2 { grid-template-columns: minmax(0, 1fr); }
	.jrs-mega a.jrs-mega__link[data-mega].is-open::after { transform: rotate(90deg); }
}