/**
 * Doctor AK Portal — Site-wide header (templates/site-header.php).
 *
 * Two siblings: .dak-site-topbar (slim contact/account strip that scrolls
 * away) and header.dak-site-header (the sticky main bar). The main bar keeps
 * one fixed height at every scroll position, so nothing below it jumps, and
 * other scripts that measure `.dak-site-header` for anchor offsets
 * (booking page, policy pages) get exactly the sticky part.
 *
 * Colours are the public design system's (doctor-ak-public.css --pub-*),
 * restated here as --hdr-* because this file loads on every page, not just
 * the ones that load doctor-ak-public.css. Almost every declaration is
 * !important: the active theme / Elementor kit style bare `button`, `a` and
 * `ul` with higher-specificity selectors (uppercase text, coloured
 * backgrounds, hover colours), and the header has to look the same on top
 * of all of them.
 */

/* Closed panels are `hidden` (display: none) so they can't widen the page,
   but other plugin and theme blocks can — kept from the previous header. */
html {
	overflow-x: hidden !important;
}

/* Fragment links land below the sticky bar (see --dak-site-header-offset,
   kept up to date by doctor-ak-site-header.js; the fallback is the bar's
   fixed height). */
html:has( .dak-site-header ) {
	scroll-padding-top: calc( var( --dak-site-header-offset, 76px ) + 12px );
}

.dak-site-topbar,
.dak-site-header {
	--hdr-primary: #16634b;
	--hdr-primary-hover: #104d3a;
	--hdr-tint: #eaf4ef;
	--hdr-tint-strong: #d5eadf;
	--hdr-on-primary: #ffffff;
	--hdr-text: #182b3a;
	--hdr-muted: #526273;
	--hdr-border: #dfe5eb;
	--hdr-surface: #ffffff;
	--hdr-subtle: #f6f8fa;
	--hdr-focus: #245fa8;
	--hdr-warn-text: #8a4b08;
	--hdr-warn-tint: #fff4d8;
	--hdr-shadow: 0 16px 40px rgba( 16, 24, 40, 0.12 ), 0 2px 6px rgba( 16, 24, 40, 0.06 );
	--hdr-max: 1180px;
	--hdr-gutter: 24px;
	--hdr-row: 76px;
	--hdr-radius: 14px;
	--hdr-font: var( --dak-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif );
}

html[data-theme='dark'] .dak-site-topbar,
html[data-theme='dark'] .dak-site-header {
	--hdr-primary: #3aa679;
	--hdr-primary-hover: #7fd3ab;
	--hdr-tint: #12261d;
	--hdr-tint-strong: #1a3628;
	--hdr-on-primary: #06140e;
	--hdr-text: #e6ebef;
	--hdr-muted: #a3afba;
	--hdr-border: #2a3139;
	--hdr-surface: #13171b;
	--hdr-subtle: #1a1f25;
	--hdr-focus: #8db8f2;
	--hdr-warn-text: #f2c26b;
	--hdr-warn-tint: #2b2310;
	--hdr-shadow: 0 16px 40px rgba( 0, 0, 0, 0.5 ), 0 2px 6px rgba( 0, 0, 0, 0.35 );
}

/* ---------------------------------------------------------------- Resets */

/* Wrapped in :where() so they carry almost no specificity: they beat the
   theme's plain `a` / `button` rules (Elementor kit: green links at 16px,
   pill buttons with padding and uppercase text) only through !important,
   and every header class rule below still overrides them. */
:where( .dak-site-topbar, .dak-site-header ),
:where( .dak-site-topbar, .dak-site-header ) * {
	box-sizing: border-box !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	word-spacing: normal !important;
}

.dak-site-topbar,
.dak-site-header {
	font-family: var( --hdr-font ) !important;
	color: var( --hdr-text ) !important;
	line-height: 1.4 !important;
}

:where( .dak-site-topbar, .dak-site-header ) button {
	margin: 0 !important;
	padding: 0 !important;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: 1.3 !important;
	color: inherit !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	text-decoration: none !important;
	text-align: inherit !important;
	white-space: normal !important;
	min-height: 0 !important;
	cursor: pointer !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

:where( .dak-site-topbar, .dak-site-header ) a {
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
	color: inherit !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

:where( .dak-site-topbar, .dak-site-header ) :is( ul, li, p, form ) {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

:where( .dak-site-header ) li::before,
:where( .dak-site-header ) li::marker {
	content: none !important;
}

:where( .dak-site-topbar, .dak-site-header ) svg {
	display: block !important;
	flex: 0 0 auto !important;
	width: 18px !important;
	height: 18px !important;
	fill: none !important;
	stroke: currentColor !important;
}

/* Doubled attribute selector: outranks every display rule below, so a
   `hidden` panel, list or row is never shown (or focusable). */
.dak-site-topbar [hidden][hidden],
.dak-site-header [hidden][hidden] {
	display: none !important;
}

.dak-site-topbar .dak-sr-only,
.dak-site-header .dak-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect( 0, 0, 0, 0 ) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* One visible focus ring for every control in the header. */
.dak-site-topbar a:focus-visible,
.dak-site-topbar button:focus-visible,
.dak-site-header a:focus-visible,
.dak-site-header button:focus-visible,
.dak-site-header input:focus-visible {
	outline: 2px solid var( --hdr-focus ) !important;
	outline-offset: 2px !important;
}

.dak-site-topbar a:focus:not( :focus-visible ),
.dak-site-topbar button:focus:not( :focus-visible ),
.dak-site-header a:focus:not( :focus-visible ),
.dak-site-header button:focus:not( :focus-visible ) {
	outline: none !important;
}

/* ---------------------------------------------------------------- Top strip */

.dak-site-topbar {
	position: relative !important;
	z-index: 210 !important;
	background: var( --hdr-subtle ) !important;
	border-bottom: 1px solid var( --hdr-border ) !important;
	font-size: 0.8125rem !important;
}

.dak-site-topbar-inner {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	max-width: var( --hdr-max ) !important;
	min-height: 40px !important;
	margin: 0 auto !important;
	padding: 0 var( --hdr-gutter ) !important;
}

.dak-site-topbar-contact,
.dak-site-topbar-actions {
	display: flex !important;
	align-items: center !important;
	min-width: 0 !important;
}

.dak-site-topbar-contact {
	gap: 20px !important;
}

.dak-site-topbar-actions {
	gap: 8px !important;
	flex: 0 0 auto !important;
}

.dak-site-topbar-item {
	font-size: 0.8125rem !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	min-height: 32px !important;
	color: var( --hdr-muted ) !important;
	white-space: nowrap !important;
	min-width: 0 !important;
}

.dak-site-topbar-item span {
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.dak-site-topbar-item svg {
	width: 15px !important;
	height: 15px !important;
	color: var( --hdr-primary ) !important;
}

a.dak-site-topbar-item:hover {
	color: var( --hdr-primary ) !important;
}

.dak-site-topbar-login,
.dak-site-topbar .dak-site-topbar-account-trigger {
	font-size: 0.8125rem !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	min-height: 32px !important;
	padding: 0 10px !important;
	border-radius: 999px !important;
	color: var( --hdr-text ) !important;
	font-weight: 600 !important;
	white-space: nowrap !important;
}

.dak-site-topbar-login svg {
	width: 16px !important;
	height: 16px !important;
}

.dak-site-topbar-login:hover,
.dak-site-topbar .dak-site-topbar-account-trigger:hover,
.dak-site-topbar .dak-site-topbar-account-trigger[aria-expanded='true'] {
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
}

.dak-site-topbar-account {
	position: relative !important;
}

.dak-site-topbar .dak-site-topbar-account-trigger {
	padding: 0 8px 0 3px !important;
	border-radius: 999px !important;
}

.dak-site-topbar-avatar {
	width: 26px !important;
	height: 26px !important;
	border-radius: 50% !important;
	object-fit: cover !important;
	border: 1px solid var( --hdr-border ) !important;
}

.dak-site-topbar-account-name {
	max-width: 12ch !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.dak-site-topbar .dak-nav-chevron svg {
	width: 14px !important;
	height: 14px !important;
}

.dak-site-topbar-account-menu {
	right: 0 !important;
	min-width: 190px !important;
}

/* Theme toggle — also used by the dashboards' top bar (dashboard/partials/topbar-actions.php). */
.dak-public-theme-toggle {
	position: relative !important;
	flex: 0 0 auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 36px !important;
	height: 36px !important;
	padding: 0 !important;
	border: 1px solid var( --dak-border ) !important;
	border-radius: 50% !important;
	background: var( --dak-bg-card ) !important;
	color: var( --dak-text ) !important;
	cursor: pointer !important;
	transition: background 0.15s ease, border-color 0.15s ease !important;
}

.dak-public-theme-toggle:hover {
	border-color: var( --dak-primary ) !important;
	color: var( --dak-primary-dark ) !important;
}

.dak-public-theme-toggle .dak-theme-icon {
	width: 18px !important;
	height: 18px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Fixed pixels and explicit fill/stroke: some themes reset every <svg> to
   fill: currentColor; stroke: none, which would leave this line icon blank. */
.dak-public-theme-toggle .dak-theme-icon svg {
	display: inline-block !important;
	width: 18px !important;
	height: 18px !important;
	fill: none !important;
	stroke: var( --dak-text ) !important;
	stroke-width: 1.5 !important;
	color: var( --dak-text ) !important;
}

.dak-public-theme-toggle:hover .dak-theme-icon svg {
	color: var( --dak-primary-dark ) !important;
	stroke: var( --dak-primary-dark ) !important;
}

.dak-public-theme-toggle .dak-theme-icon-moon,
.dak-public-theme-toggle[aria-pressed='true'] .dak-theme-icon-sun {
	display: none !important;
}

.dak-public-theme-toggle[aria-pressed='true'] .dak-theme-icon-moon {
	display: flex !important;
}

/* In the strip: a quieter 32px version in the header's own colours. */
.dak-site-topbar .dak-public-theme-toggle {
	width: 32px !important;
	height: 32px !important;
	border: 1px solid var( --hdr-border ) !important;
	border-radius: 50% !important;
	background: var( --hdr-surface ) !important;
	color: var( --hdr-text ) !important;
}

.dak-site-topbar .dak-public-theme-toggle .dak-theme-icon svg {
	width: 16px !important;
	height: 16px !important;
	stroke: currentColor !important;
	color: inherit !important;
}

.dak-site-topbar .dak-public-theme-toggle:hover {
	border-color: var( --hdr-primary ) !important;
	color: var( --hdr-primary ) !important;
}

/* ---------------------------------------------------------------- Main bar */

.dak-site-header {
	position: sticky !important;
	top: 0 !important;
	z-index: 200 !important;
	background: var( --hdr-surface ) !important;
	border-bottom: 1px solid var( --hdr-border ) !important;
	box-shadow: none !important;
}

/* Logged-in admins: stay below the fixed WordPress toolbar. */
body.admin-bar .dak-site-header {
	top: 32px !important;
}

@media screen and ( max-width: 782px ) {
	body.admin-bar .dak-site-header {
		top: 46px !important;
	}
}

@media screen and ( max-width: 600px ) {
	/* The toolbar scrolls away with the page at this width. */
	body.admin-bar .dak-site-header {
		top: 0 !important;
	}
}

.dak-site-header-inner {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	gap: 24px !important;
	max-width: var( --hdr-max ) !important;
	height: var( --hdr-row ) !important;
	margin: 0 auto !important;
	padding: 0 var( --hdr-gutter ) !important;
}

.dak-site-header-logo {
	display: flex !important;
	align-items: center !important;
	flex: 0 0 auto !important;
	height: 100% !important;
	padding: 8px 0 !important;
}

.dak-site-header-logo img {
	display: block !important;
	width: auto !important;
	height: 60px !important;
	max-height: 60px !important;
	max-width: none !important;
}

.dak-site-header-logo .custom-logo {
	height: 60px !important;
	width: auto !important;
}

.dak-site-header-logo-text {
	font-size: 1.125rem !important;
	font-weight: 700 !important;
	color: var( --hdr-primary ) !important;
}

.dak-site-header-drawer {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: flex !important;
	justify-content: center !important;
}

.dak-site-header-drawer-head,
.dak-site-header-drawer-foot,
.dak-site-header-scrim {
	display: none !important;
}

.dak-site-header-menu {
	display: flex !important;
	align-items: center !important;
	gap: 2px !important;
}

/* Static so each panel positions against .dak-site-header-inner (aligned to
   the page container), not under its own item. */
.dak-nav-item {
	position: static !important;
}

.dak-nav-link,
.dak-site-header .dak-nav-trigger {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
	min-height: 44px !important;
	padding: 0 12px !important;
	border-radius: 10px !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	color: var( --hdr-text ) !important;
	white-space: nowrap !important;
	transition: background-color 0.15s ease, color 0.15s ease !important;
}

.dak-nav-link:hover,
.dak-site-header .dak-nav-trigger:hover {
	background: var( --hdr-subtle ) !important;
	color: var( --hdr-primary ) !important;
}

/* Open: pale green fill + rotated chevron. */
.dak-site-header .dak-nav-trigger[aria-expanded='true'] {
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
}

/* Current page / section: a green underline, independent of the open state. */
.dak-nav-link.is-current,
.dak-site-header .dak-nav-trigger.is-current {
	color: var( --hdr-primary ) !important;
}

.dak-nav-link.is-current::after,
.dak-site-header .dak-nav-trigger.is-current::after {
	content: '' !important;
	position: absolute !important;
	left: 12px !important;
	right: 12px !important;
	bottom: -16px !important;
	height: 3px !important;
	border-radius: 3px 3px 0 0 !important;
	background: var( --hdr-primary ) !important;
}

.dak-site-header .dak-nav-trigger.is-current::after {
	right: 30px !important;
}

.dak-nav-chevron {
	display: inline-flex !important;
	transition: transform 0.2s ease !important;
}

.dak-nav-chevron svg {
	width: 16px !important;
	height: 16px !important;
}

[aria-expanded='true'] > .dak-nav-chevron {
	transform: rotate( 180deg ) !important;
}

/* ---------------------------------------------------------------- Panels */

.dak-nav-panel {
	position: absolute !important;
	top: calc( 100% + 1px ) !important;
	left: var( --hdr-gutter ) !important;
	right: var( --hdr-gutter ) !important;
	z-index: 5 !important;
	display: flex !important;
	justify-content: center !important;
	padding-top: 8px !important;
	pointer-events: none !important;
}

.dak-nav-panel-card {
	pointer-events: auto !important;
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	max-width: 1040px !important;
	max-height: var( --dak-nav-panel-max, calc( 100vh - 140px ) ) !important;
	background: var( --hdr-surface ) !important;
	border: 1px solid var( --hdr-border ) !important;
	border-radius: var( --hdr-radius ) !important;
	box-shadow: var( --hdr-shadow ) !important;
	overflow: hidden !important;
	animation: dak-nav-in 0.14s ease-out !important;
}

@keyframes dak-nav-in {
	from {
		opacity: 0;
		transform: translateY( -4px );
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.dak-nav-panel-search {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	flex: 0 0 auto !important;
	margin: 0 !important;
	padding: 16px 20px !important;
	border-bottom: 1px solid var( --hdr-border ) !important;
	background: var( --hdr-surface ) !important;
}

.dak-nav-search-field {
	position: relative !important;
	flex: 1 1 auto !important;
	display: flex !important;
	align-items: center !important;
	min-width: 0 !important;
}

.dak-nav-search-icon {
	position: absolute !important;
	left: 14px !important;
	color: var( --hdr-muted ) !important;
	pointer-events: none !important;
}

.dak-site-header .dak-nav-search-input {
	width: 100% !important;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 44px 0 42px !important;
	border: 1px solid var( --hdr-border ) !important;
	border-radius: 10px !important;
	background: var( --hdr-subtle ) !important;
	color: var( --hdr-text ) !important;
	font: inherit !important;
	font-size: 0.9375rem !important;
	box-shadow: none !important;
	outline: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.dak-site-header .dak-nav-search-input::placeholder {
	color: var( --hdr-muted ) !important;
	opacity: 1 !important;
}

.dak-site-header .dak-nav-search-input::-webkit-search-cancel-button {
	display: none !important;
	-webkit-appearance: none !important;
}

.dak-site-header .dak-nav-search-input:focus {
	border-color: var( --hdr-primary ) !important;
	background: var( --hdr-surface ) !important;
	box-shadow: 0 0 0 3px var( --hdr-tint-strong ) !important;
}

.dak-site-header .dak-nav-search-clear {
	position: absolute !important;
	right: 4px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 36px !important;
	height: 36px !important;
	border-radius: 8px !important;
	color: var( --hdr-muted ) !important;
}

.dak-site-header .dak-nav-search-clear:hover {
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
}

.dak-site-header .dak-nav-search-submit {
	flex: 0 0 auto !important;
	display: inline-flex !important;
	align-items: center !important;
	min-height: 44px !important;
	padding: 0 16px !important;
	border: 1px solid var( --hdr-primary ) !important;
	border-radius: 10px !important;
	color: var( --hdr-primary ) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	white-space: nowrap !important;
}

.dak-site-header .dak-nav-search-submit:hover {
	background: var( --hdr-tint ) !important;
}

.dak-nav-panel-body {
	flex: 1 1 auto !important;
	min-height: 0 !important;
	overflow-y: auto !important;
	overscroll-behavior: contain !important;
	padding: 18px 20px 20px !important;
}

.dak-nav-heading {
	margin: 0 0 10px !important;
	font-size: 0.75rem !important;
	font-weight: 700 !important;
	color: var( --hdr-muted ) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.06em !important;
}

.dak-nav-note {
	color: var( --hdr-muted ) !important;
	font-size: 0.9375rem !important;
}

.dak-nav-panel-foot {
	flex: 0 0 auto !important;
	display: flex !important;
	justify-content: flex-end !important;
	padding: 12px 20px !important;
	border-top: 1px solid var( --hdr-border ) !important;
	background: var( --hdr-subtle ) !important;
}

.dak-nav-view-all {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	min-height: 40px !important;
	padding: 0 14px !important;
	border-radius: 10px !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	color: var( --hdr-primary ) !important;
}

.dak-nav-view-all:hover {
	background: var( --hdr-tint ) !important;
}

/* Tiles (specialties) and result rows share one look: icon + title + meta. */
.dak-nav-tiles {
	display: grid !important;
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) ) !important;
	gap: 6px !important;
}

.dak-nav-tile,
.dak-nav-result {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	min-height: 52px !important;
	padding: 8px 10px !important;
	border-radius: 10px !important;
	color: var( --hdr-text ) !important;
	transition: background-color 0.12s ease !important;
}

.dak-nav-tile:hover,
.dak-nav-tile:focus-visible,
.dak-nav-result:hover,
.dak-nav-result:focus-visible {
	background: var( --hdr-tint ) !important;
}

.dak-nav-tile-icon,
.dak-nav-result-icon,
.dak-nav-category-icon,
.dak-book-option-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 auto !important;
	width: 36px !important;
	height: 36px !important;
	border-radius: 10px !important;
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
}

.dak-nav-tile-text,
.dak-nav-result-text,
.dak-book-option-text {
	display: flex !important;
	flex-direction: column !important;
	min-width: 0 !important;
}

.dak-nav-tile-title,
.dak-nav-result-title,
.dak-book-option-title {
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	color: var( --hdr-text ) !important;
	overflow-wrap: anywhere !important;
}

.dak-nav-tile-meta,
.dak-nav-result-meta,
.dak-book-option-meta {
	font-size: 0.8125rem !important;
	color: var( --hdr-muted ) !important;
	overflow-wrap: anywhere !important;
}

.dak-nav-tile:hover .dak-nav-tile-title,
.dak-nav-result:hover .dak-nav-result-title {
	color: var( --hdr-primary ) !important;
}

/* Search results: grouped, two columns on wide panels. */
.dak-nav-results {
	display: grid !important;
	grid-template-columns: repeat( auto-fit, minmax( 280px, 1fr ) ) !important;
	gap: 8px 24px !important;
}

.dak-nav-result-list {
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
}

.dak-nav-more {
	margin-top: 8px !important;
	padding: 0 10px !important;
	font-size: 0.875rem !important;
	color: var( --hdr-muted ) !important;
}

.dak-nav-more a {
	color: var( --hdr-primary ) !important;
	font-weight: 600 !important;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
}

.dak-nav-empty {
	padding: 28px 12px !important;
	text-align: center !important;
}

.dak-nav-empty-title {
	font-size: 1rem !important;
	font-weight: 600 !important;
	color: var( --hdr-text ) !important;
	overflow-wrap: anywhere !important;
}

.dak-nav-empty-text {
	margin-top: 4px !important;
	font-size: 0.875rem !important;
	color: var( --hdr-muted ) !important;
}

/* Services: category list on the left, the chosen category's services on the
   right. Buttons and panes alternate in the markup (button, pane, button,
   pane…) so the same order works as an accordion in the mobile drawer. */
.dak-nav-categories {
	display: grid !important;
	grid-template-columns: minmax( 220px, 260px ) minmax( 0, 1fr ) !important;
	grid-template-rows: repeat( var( --dak-nav-category-rows, 6 ), auto ) 1fr !important;
	column-gap: 24px !important;
	row-gap: 2px !important;
	align-items: start !important;
}

.dak-site-header .dak-nav-category {
	grid-column: 1 !important;
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	width: 100% !important;
	min-height: 48px !important;
	padding: 6px 10px !important;
	border-radius: 10px !important;
	text-align: left !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	color: var( --hdr-text ) !important;
}

.dak-site-header .dak-nav-category:hover {
	background: var( --hdr-subtle ) !important;
}

.dak-site-header .dak-nav-category[aria-expanded='true'] {
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
	box-shadow: inset 3px 0 0 var( --hdr-primary ) !important;
}

.dak-nav-category .dak-nav-category-icon {
	width: 32px !important;
	height: 32px !important;
	border-radius: 8px !important;
}

.dak-nav-category-label {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	overflow-wrap: anywhere !important;
}

.dak-nav-category-count {
	flex: 0 0 auto !important;
	min-width: 26px !important;
	padding: 1px 8px !important;
	border-radius: 999px !important;
	background: var( --hdr-subtle ) !important;
	color: var( --hdr-muted ) !important;
	font-size: 0.75rem !important;
	font-weight: 600 !important;
	text-align: center !important;
}

.dak-nav-category[aria-expanded='true'] .dak-nav-category-count {
	background: var( --hdr-surface ) !important;
	color: var( --hdr-primary ) !important;
}

/* The accordion chevron is only for the mobile drawer. */
.dak-nav-category .dak-nav-chevron {
	display: none !important;
}

.dak-nav-category-pane {
	grid-column: 2 !important;
	grid-row: 1 / -1 !important;
	min-width: 0 !important;
	padding: 4px 0 0 24px !important;
	border-left: 1px solid var( --hdr-border ) !important;
	align-self: stretch !important;
}

.dak-nav-link-list {
	display: grid !important;
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) ) !important;
	gap: 2px 16px !important;
}

.dak-nav-plain-link {
	display: flex !important;
	align-items: center !important;
	min-height: 40px !important;
	padding: 8px 10px !important;
	border-radius: 8px !important;
	font-size: 0.9375rem !important;
	line-height: 1.35 !important;
	color: var( --hdr-text ) !important;
	overflow-wrap: anywhere !important;
}

.dak-nav-plain-link:hover,
.dak-nav-plain-link:focus-visible {
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
}

/* While searching: every category with a match, stacked, no left list. */
.dak-nav-categories.is-searching {
	display: block !important;
}

.dak-nav-categories.is-searching .dak-nav-category {
	display: none !important;
}

.dak-nav-categories.is-searching .dak-nav-category-pane {
	padding: 0 !important;
	border-left: 0 !important;
}

.dak-nav-categories.is-searching .dak-nav-category-pane:not( [hidden] ) ~ .dak-nav-category-pane:not( [hidden] ) {
	margin-top: 16px !important;
}

/* Clinics: city chips + a list of name/area rows. */
.dak-nav-chips {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	flex: 0 0 auto !important;
	padding: 12px 20px 0 !important;
}

.dak-site-header .dak-nav-chip {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	min-height: 36px !important;
	padding: 0 12px !important;
	border: 1px solid var( --hdr-border ) !important;
	border-radius: 999px !important;
	background: var( --hdr-surface ) !important;
	color: var( --hdr-text ) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
}

.dak-site-header .dak-nav-chip:hover {
	border-color: var( --hdr-primary ) !important;
	color: var( --hdr-primary ) !important;
}

.dak-site-header .dak-nav-chip[aria-pressed='true'] {
	border-color: var( --hdr-primary ) !important;
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
}

.dak-nav-chip-count {
	font-size: 0.75rem !important;
	font-weight: 600 !important;
	color: var( --hdr-muted ) !important;
}

.dak-nav-chip[aria-pressed='true'] .dak-nav-chip-count {
	color: inherit !important;
}

.dak-nav-clinics {
	display: grid !important;
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) ) !important;
	gap: 4px 12px !important;
}

/* ---------------------------------------------------------------- Book Now */

.dak-site-header-actions {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	flex: 0 0 auto !important;
	margin-left: auto !important;
}

.dak-site-header-book {
	position: relative !important;
}

.dak-site-header .dak-site-header-cta {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	min-height: 44px !important;
	padding: 0 14px 0 18px !important;
	border-radius: 10px !important;
	background: var( --hdr-primary ) !important;
	color: var( --hdr-on-primary ) !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	white-space: nowrap !important;
	transition: background-color 0.15s ease !important;
}

.dak-site-header .dak-site-header-cta:hover,
.dak-site-header .dak-site-header-cta[aria-expanded='true'] {
	background: var( --hdr-primary-hover ) !important;
	color: var( --hdr-on-primary ) !important;
}

html[data-theme='dark'] .dak-site-header .dak-site-header-cta:hover,
html[data-theme='dark'] .dak-site-header .dak-site-header-cta[aria-expanded='true'] {
	background: #7fd3ab !important;
}

/* Small dropdowns (Book Now, account): same card style as the panels. */
.dak-nav-dropdown {
	position: absolute !important;
	top: calc( 100% + 8px ) !important;
	right: 0 !important;
	z-index: 6 !important;
	background: var( --hdr-surface ) !important;
	border: 1px solid var( --hdr-border ) !important;
	border-radius: var( --hdr-radius ) !important;
	box-shadow: var( --hdr-shadow ) !important;
	padding: 6px !important;
	animation: dak-nav-in 0.14s ease-out !important;
}

.dak-site-topbar-account-menu a {
	display: flex !important;
	align-items: center !important;
	min-height: 40px !important;
	padding: 0 12px !important;
	border-radius: 8px !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	color: var( --hdr-text ) !important;
}

.dak-site-topbar-account-menu a:hover {
	background: var( --hdr-tint ) !important;
	color: var( --hdr-primary ) !important;
}

.dak-site-header-book-menu {
	width: 340px !important;
	max-width: calc( 100vw - 32px ) !important;
}

.dak-book-options {
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
}

.dak-site-header .dak-book-option {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	width: 100% !important;
	min-height: 56px !important;
	padding: 8px 10px !important;
	border-radius: 10px !important;
	text-align: left !important;
	color: var( --hdr-text ) !important;
}

.dak-site-header .dak-book-option:hover {
	background: var( --hdr-tint ) !important;
}

.dak-site-header .dak-book-option:hover .dak-book-option-title {
	color: var( --hdr-primary ) !important;
}

.dak-book-option-text {
	flex: 1 1 auto !important;
}

.dak-book-option.is-unavailable .dak-book-option-icon {
	background: var( --hdr-subtle ) !important;
	color: var( --hdr-muted ) !important;
}

.dak-book-option-title:has( .dak-book-option-badge ) {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 4px 8px !important;
}

.dak-book-option-badge {
	flex: 0 0 auto !important;
	padding: 2px 8px !important;
	border-radius: 999px !important;
	background: var( --hdr-warn-tint ) !important;
	color: var( --hdr-warn-text ) !important;
	font-size: 0.75rem !important;
	font-weight: 600 !important;
	white-space: nowrap !important;
}

.dak-site-header .dak-site-header-toggle {
	display: none !important;
}

/* ---------------------------------------------------------------- Tablet */

@media ( max-width: 1180px ) and ( min-width: 1024px ) {
	.dak-site-header-inner {
		gap: 12px !important;
	}

	.dak-nav-link,
	.dak-site-header .dak-nav-trigger {
		padding: 0 9px !important;
	}

	.dak-nav-link.is-current::after,
	.dak-site-header .dak-nav-trigger.is-current::after {
		left: 9px !important;
		right: 9px !important;
	}

	.dak-site-header .dak-nav-trigger.is-current::after {
		right: 27px !important;
	}
}

@media ( max-width: 1100px ) {
	.dak-site-topbar-location {
		display: none !important;
	}
}

/* ---------------------------------------------------------------- Drawer (≤1023px) */

@media ( max-width: 1023px ) {
	.dak-site-topbar,
	.dak-site-header {
		--hdr-row: 64px;
		--hdr-gutter: 16px;
	}

	.dak-site-topbar-email {
		display: none !important;
	}

	.dak-site-header-inner {
		gap: 12px !important;
	}

	.dak-site-header-logo img,
	.dak-site-header-logo .custom-logo {
		height: 50px !important;
		max-height: 50px !important;
	}

	.dak-site-header .dak-site-header-toggle {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 44px !important;
		height: 44px !important;
		border: 1px solid var( --hdr-border ) !important;
		border-radius: 10px !important;
		color: var( --hdr-text ) !important;
	}

	.dak-site-header .dak-site-header-toggle svg {
		width: 22px !important;
		height: 22px !important;
	}

	.dak-site-header .dak-site-header-toggle:hover,
	.dak-site-header .dak-site-header-toggle[aria-expanded='true'] {
		background: var( --hdr-tint ) !important;
		color: var( --hdr-primary ) !important;
	}

	/* Closed: display none, so nothing inside can take focus. */
	.dak-site-header-drawer {
		display: none !important;
	}

	.dak-site-header-drawer.is-open {
		position: fixed !important;
		top: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		z-index: 30 !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: flex-start !important;
		width: min( 420px, 100vw ) !important;
		background: var( --hdr-surface ) !important;
		border-left: 1px solid var( --hdr-border ) !important;
		box-shadow: var( --hdr-shadow ) !important;
		animation: dak-drawer-in 0.2s ease-out !important;
	}

	body.admin-bar .dak-site-header-drawer.is-open {
		top: 46px !important;
	}

	@keyframes dak-drawer-in {
		from {
			transform: translateX( 24px );
			opacity: 0;
		}
		to {
			transform: none;
			opacity: 1;
		}
	}

	.dak-site-header-scrim:not( [hidden] ) {
		display: block !important;
		position: fixed !important;
		inset: 0 !important;
		z-index: 29 !important;
		background: rgba( 16, 24, 40, 0.45 ) !important;
	}

	html.dak-nav-drawer-open,
	html.dak-nav-drawer-open body {
		overflow: hidden !important;
	}

	/* The strip would otherwise draw over the open drawer. */
	html.dak-nav-drawer-open .dak-site-topbar {
		z-index: 1 !important;
	}

	.dak-site-header-drawer-head {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		flex: 0 0 auto !important;
		height: 64px !important;
		padding: 0 12px 0 20px !important;
		border-bottom: 1px solid var( --hdr-border ) !important;
	}

	.dak-site-header-drawer-title {
		font-size: 1rem !important;
		font-weight: 700 !important;
	}

	.dak-site-header .dak-site-header-drawer-close {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 44px !important;
		height: 44px !important;
		border-radius: 10px !important;
	}

	.dak-site-header .dak-site-header-drawer-close:hover {
		background: var( --hdr-tint ) !important;
		color: var( --hdr-primary ) !important;
	}

	.dak-site-header-drawer.is-open .dak-site-header-nav {
		flex: 1 1 auto !important;
		min-height: 0 !important;
		overflow-y: auto !important;
		overscroll-behavior: contain !important;
		padding: 8px 12px 16px !important;
	}

	.dak-site-header-drawer-foot {
		display: block !important;
		flex: 0 0 auto !important;
		padding: 12px 16px !important;
		border-top: 1px solid var( --hdr-border ) !important;
	}

	.dak-site-header-drawer-call {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		min-height: 48px !important;
		border: 1px solid var( --hdr-border ) !important;
		border-radius: 10px !important;
		font-weight: 600 !important;
		color: var( --hdr-primary ) !important;
	}

	.dak-site-header-menu {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 2px !important;
	}

	.dak-nav-link,
	.dak-site-header .dak-nav-trigger {
		display: flex !important;
		width: 100% !important;
		min-height: 48px !important;
		padding: 0 12px !important;
		font-size: 1rem !important;
		justify-content: space-between !important;
	}

	/* Current item in the drawer: a left bar instead of the underline. */
	.dak-nav-link.is-current::after,
	.dak-site-header .dak-nav-trigger.is-current::after {
		left: 0 !important;
		right: auto !important;
		top: 12px !important;
		bottom: 12px !important;
		width: 3px !important;
		height: auto !important;
		border-radius: 0 3px 3px 0 !important;
	}

	/* Panels expand inline under their trigger. */
	.dak-nav-panel {
		position: static !important;
		display: block !important;
		padding: 4px 0 8px !important;
		pointer-events: auto !important;
	}

	.dak-nav-panel-card {
		max-height: none !important;
		max-width: none !important;
		border-radius: 12px !important;
		box-shadow: none !important;
		background: var( --hdr-subtle ) !important;
		animation: none !important;
	}

	.dak-nav-panel-search {
		flex-wrap: wrap !important;
		padding: 12px !important;
		background: transparent !important;
	}

	.dak-site-header .dak-nav-search-input {
		background: var( --hdr-surface ) !important;
	}

	.dak-site-header .dak-nav-search-submit {
		width: 100% !important;
		justify-content: center !important;
	}

	.dak-nav-chips {
		padding: 10px 12px 0 !important;
	}

	.dak-nav-panel-body {
		overflow: visible !important;
		padding: 12px !important;
	}

	.dak-nav-panel-foot {
		justify-content: stretch !important;
		padding: 8px 12px !important;
		background: transparent !important;
	}

	.dak-nav-view-all {
		width: 100% !important;
		justify-content: center !important;
		min-height: 44px !important;
		border: 1px solid var( --hdr-border ) !important;
		background: var( --hdr-surface ) !important;
	}

	.dak-nav-tiles,
	.dak-nav-clinics,
	.dak-nav-link-list {
		grid-template-columns: minmax( 0, 1fr ) !important;
	}

	.dak-nav-results {
		grid-template-columns: minmax( 0, 1fr ) !important;
	}

	.dak-nav-tile,
	.dak-nav-result,
	.dak-nav-plain-link {
		min-height: 44px !important;
	}

	/* Services: an accordion of categories. */
	.dak-nav-categories {
		display: flex !important;
		flex-direction: column !important;
		gap: 2px !important;
	}

	.dak-nav-category .dak-nav-chevron {
		display: inline-flex !important;
		margin-left: 4px !important;
	}

	.dak-site-header .dak-nav-category[aria-expanded='true'] {
		box-shadow: none !important;
	}

	.dak-nav-category-pane {
		padding: 4px 0 8px 12px !important;
		border-left: 0 !important;
	}

	.dak-nav-category-pane .dak-nav-heading {
		display: none !important;
	}

	.dak-nav-categories.is-searching .dak-nav-category-pane .dak-nav-heading {
		display: block !important;
	}

	/* Book Now: compact, still in the bar. Its menu lines up with the bar's
	   right edge (not the button's, which sits left of the menu button) so it
	   always fits on a phone. */
	.dak-site-header .dak-site-header-cta {
		padding: 0 10px 0 14px !important;
	}

	.dak-site-header-book {
		position: static !important;
	}

	.dak-site-header-book-menu {
		top: calc( 100% + 4px ) !important;
		right: var( --hdr-gutter ) !important;
	}
}

@media ( max-width: 480px ) {
	.dak-site-topbar-contact {
		gap: 12px !important;
	}

	.dak-site-topbar-login {
		padding: 0 6px !important;
	}

	.dak-site-header-inner {
		gap: 8px !important;
	}

	.dak-site-header-logo img,
	.dak-site-header-logo .custom-logo {
		height: 46px !important;
		max-height: 46px !important;
	}

	.dak-site-header .dak-site-header-cta {
		font-size: 0.875rem !important;
	}

	.dak-site-topbar-account-name {
		display: none !important;
	}
}

@media ( max-width: 360px ) {
	.dak-site-topbar-login span {
		display: none !important;
	}

	.dak-site-topbar-login {
		width: 32px !important;
		justify-content: center !important;
		padding: 0 !important;
	}
}

/* ---------------------------------------------------------------- Motion, print */

@media ( prefers-reduced-motion: reduce ) {
	.dak-site-header *,
	.dak-site-topbar * {
		animation: none !important;
		transition: none !important;
	}
}

@media print {
	.dak-site-topbar,
	.dak-site-header {
		display: none !important;
	}
}

/* ---------------------------------------------------------------- Toast */

/* "Coming soon" toast for the not-yet-built Lab / Pharmacy options (header,
   footer and home page — [data-dak-coming-soon]). One shared element,
   created by doctor-ak-site-header.js. */
.dak-coming-soon-toast {
	position: fixed !important;
	left: 50% !important;
	bottom: 24px !important;
	transform: translate( -50%, 12px ) !important;
	max-width: min( 90vw, 420px ) !important;
	background: var( --dak-text, #182b3a ) !important;
	color: var( --dak-bg-card, #ffffff ) !important;
	padding: 0.75rem 1.1rem !important;
	border-radius: var( --dak-radius-md ) !important;
	box-shadow: var( --dak-shadow ) !important;
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	text-align: center !important;
	z-index: 999 !important;
	opacity: 0 !important;
	pointer-events: none !important;
	transition: opacity 0.2s ease, transform 0.2s ease !important;
}

.dak-coming-soon-toast.is-visible {
	opacity: 1 !important;
	transform: translate( -50%, 0 ) !important;
}

/* ==========================================================================
   One typeface everywhere
   ========================================================================== */

/*
 * The page body and form controls use the site typeface (browsers don't
 * pass a page's font on to buttons and fields by default), and Elementor's
 * global fonts are pointed at it too, so content built in Elementor or the
 * theme matches the plugin's own pages instead of switching to another
 * font (e.g. Roboto/Roboto Slab from the Elementor kit). The attribute
 * selector outranks Elementor's own .elementor-kit-N rule.
 */
html body,
html body[class*='elementor-kit-'] {
	font-family: var( --dak-font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif ) !important;
}

html body :is( button, input, select, textarea, optgroup ) {
	font-family: inherit;
}

html body[class*='elementor-kit-'],
html body[class*='elementor-kit-'] .elementor {
	--e-global-typography-primary-font-family: var( --dak-font-sans );
	--e-global-typography-secondary-font-family: var( --dak-font-sans );
	--e-global-typography-text-font-family: var( --dak-font-sans );
	--e-global-typography-accent-font-family: var( --dak-font-sans );
}

/* ---- Doctors menu: "Find doctors by symptoms" link (only when that page is live) ---- */
.dak-nav-panel-foot.has-symptom-link {
	justify-content: space-between !important;
	flex-wrap: wrap !important;
	gap: 8px 16px !important;
	align-items: center !important;
}

.dak-nav-symptom-link {
	display: inline-flex !important;
	align-items: center !important;
	min-height: 44px !important;
	color: var( --hdr-primary, var( --dak-primary ) ) !important;
	font-weight: 600 !important;
	text-decoration: underline !important;
	text-underline-offset: 3px !important;
}

@media ( max-width: 1023px ) {
	.dak-nav-panel-foot.has-symptom-link {
		flex-direction: column !important;
		align-items: stretch !important;
	}

	.dak-nav-symptom-link {
		justify-content: center !important;
	}
}