/**
 * Turquoise Commerce Framework — Desert Dream Network bar
 * Layer: header (Build 2)
 *
 * Markup: GP Premium Hook Element on generate_before_header (site Layer 2).
 * See: deployments/woo-lab/elements/desert-dream-network.html
 */

.tq-network-bar {
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	width: 100vw;
	max-width: 100vw;
	z-index: 99999;
	font-family: var(--tq-font-ui);
}

.tq-network-bar__inner {
	background: var(--tq-ddn-bg);
	color: var(--tq-ddn-text);
	border-bottom: 1px solid var(--tq-ddn-border);
	padding: 10px 16px;
	box-sizing: border-box;
	position: relative;
}

.tq-network-bar__check {
	display: none;
}

.tq-network-bar__toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	user-select: none;
	color: var(--tq-ddn-text);
	line-height: 1.2;
}

.tq-network-bar__toggle:hover {
	color: var(--tq-surface);
}

.tq-network-bar__arrow {
	font-size: 16px;
	width: 16px;
	display: inline-block;
	text-align: center;
}

.tq-network-bar__title {
	font-size: 15px;
	letter-spacing: 0.05em;
	white-space: nowrap;
}

.tq-network-bar__check:not(:checked) + .tq-network-bar__toggle .tq-network-bar__arrow::before {
	content: "▸";
}

.tq-network-bar__check:checked + .tq-network-bar__toggle .tq-network-bar__arrow::before {
	content: "▾";
}

.tq-network-bar__menu {
	display: none;
	margin-top: 10px;
	background: var(--tq-ddn-bg);
	border: 1px solid var(--tq-ddn-border);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
	box-sizing: border-box;
	width: 260px;
}

.tq-network-bar__check:checked + .tq-network-bar__toggle + .tq-network-bar__menu {
	display: block;
}

.tq-network-bar__header {
	display: block;
	color: var(--tq-ddn-muted);
	padding: 10px 14px;
	font-size: 11px;
	line-height: 1.35;
	border-bottom: 1px solid var(--tq-ddn-hover-bg);
	margin: 0;
	box-sizing: border-box;
}

.tq-network-bar__link {
	display: block;
	color: var(--tq-ddn-text);
	text-decoration: none;
	padding: 10px 14px;
	font-size: 12px;
	border-top: 1px solid var(--tq-ddn-hover-bg);
	box-sizing: border-box;
}

.tq-network-bar__link:first-of-type {
	border-top: none;
}

.tq-network-bar__link:hover,
.tq-network-bar__link:focus {
	background: var(--tq-ddn-hover-bg);
	color: var(--tq-surface);
	outline: none;
}

.tq-network-bar__link strong {
	display: block;
	font-weight: 600;
	font-size: 12px;
}

.tq-network-bar__link span {
	display: block;
	font-size: 11px;
	color: var(--tq-muted);
	margin-top: 2px;
	line-height: 1.35;
}

.tq-network-bar__link--active strong {
	color: var(--tq-signal);
}

@media (min-width: 768px) {
	.tq-network-bar__menu {
		position: absolute;
		top: 100%;
		left: 16px;
		width: 260px;
		margin-top: 6px;
		z-index: 100000;
	}
}

/* --- Site header + primary nav (Mission 015 — campus masthead) --- */

.site-header {
	background-color: var(--tq-paper);
	background-image: var(--tq-texture-page);
	background-repeat: repeat;
	border-bottom: 1px solid var(--tq-border);
}

/* Nav band — near-black with herringbone textile (campus GP Additional CSS) */
.main-navigation,
.main-navigation .menu-toggle {
	background-color: var(--tq-band);
	background-image: var(--tq-texture-nav);
	background-repeat: repeat;
}

.site-header .inside-header {
	padding-top: var(--tq-space-sm);
	padding-bottom: var(--tq-space-sm);
	text-align: center;
}

/* Launch polish: shrink oversized circular badge masthead */
.site-header .custom-logo-link img,
.site-header .header-image,
.site-header img.custom-logo {
	max-height: 96px;
	width: auto;
	height: auto;
}

@media (min-width: 769px) {
	.site-header .custom-logo-link img,
	.site-header img.custom-logo {
		max-height: 112px;
	}
}

.site-header .main-title {
	font-family: var(--tq-font-display);
	font-size: 2rem;
	font-weight: 600;
	line-height: 1.15;
	margin: 0;
	letter-spacing: var(--tq-tracking-masthead);
}

.site-header .main-title a {
	color: var(--tq-cta-ink);
	text-decoration: none;
}

.site-header .main-title a:hover,
.site-header .main-title a:focus {
	color: var(--tq-signal-hover);
}

.site-header .site-description {
	font-family: var(--tq-font-ui);
	font-size: var(--tq-size-ui);
	font-weight: 600;
	letter-spacing: var(--tq-tracking-ui);
	text-transform: uppercase;
	color: var(--tq-muted);
	margin-top: 0.25rem;
}

/* Primary nav — near-black band (GP var(--shadow-black)); do not override with navy */
.main-navigation .main-nav ul li a,
.main-navigation .menu-toggle,
.main-navigation .menu-bar-items {
	font-family: var(--tq-font-ui);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: var(--tq-tracking-ui);
	text-transform: uppercase;
}

/* Submenu — band ink, paper text */
.main-navigation .main-nav ul ul {
	border: 1px solid color-mix(in srgb, var(--tq-paper) 12%, transparent);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.main-navigation .main-nav ul ul li a {
	color: var(--tq-footer-ink) !important;
	background-color: transparent !important;
	text-transform: none;
	letter-spacing: 0.02em;
	font-weight: 500;
}

.main-navigation .main-nav ul ul li:not([class*="current-menu-"]):hover > a,
.main-navigation .main-nav ul ul li:not([class*="current-menu-"]):focus > a,
.main-navigation .main-nav ul ul li.sfHover:not([class*="current-menu-"]) > a {
	color: var(--tq-surface) !important;
	background-color: color-mix(in srgb, var(--tq-signal) 12%, transparent) !important;
}

.main-navigation .main-nav ul ul li[class*="current-menu-"] > a {
	color: var(--tq-signal) !important;
	background-color: color-mix(in srgb, var(--tq-signal) 8%, transparent) !important;
}

/* Woo cart — bone nav text; turquoise badge only (scarce accent) */
.main-navigation .wc-menu-item .cart-contents,
.main-navigation .mobile-bar-items .cart-contents {
	color: var(--tq-paper) !important;
	font-family: var(--tq-font-ui);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: var(--tq-tracking-ui);
	text-transform: uppercase;
	padding: 0.5rem 0.75rem;
}

.main-navigation .wc-menu-item .cart-contents:hover,
.main-navigation .mobile-bar-items .cart-contents:hover {
	color: var(--tq-surface) !important;
}

.main-navigation .cart-contents .number-of-items {
	background: var(--tq-signal);
	color: var(--tq-band);
	border-radius: var(--tq-radius-pill);
	min-width: 1.25rem;
	height: 1.25rem;
	line-height: 1.25rem;
	font-size: 0.6875rem;
	font-weight: 700;
	text-align: center;
	margin-right: 0.35rem;
}