/**
 * Smart Directory Pro — customer-facing discovery UI.
 *
 * Self-contained. Theme-agnostic. BEM-ish `.sdp-d__` prefix throughout to
 * avoid collisions. Designed to look intentional in any 2026-era theme.
 */

/* ============================================================
 * Theme-bridge: break out of narrow theme containers + hide
 * theme sidebars on discovery pages. Scoped to a body class
 * set by PHP, so it only fires where the shortcode actually is.
 * ============================================================ */

body.has-sdp-discovery .sdt-entry-content,
body.has-sdp-discovery .sdt-container,
body.has-sdp-discovery .sdt-main,
body.has-sdp-discovery main.site-main,
body.has-sdp-discovery .site-content,
body.has-sdp-discovery .entry-content,
body.has-sdp-discovery .wp-block-post-content,
body.has-sdp-discovery article.page,
body.has-sdp-discovery article.type-page {
	max-width: 100% !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	float: none !important;
}

/* Hide theme sidebars on discovery pages. ID + class to outrank
 * any theme-side specificity. */
body.has-sdp-discovery #sdt-sidebar,
body.has-sdp-discovery .sdt-sidebar,
body.has-sdp-discovery #secondary,
body.has-sdp-discovery aside.sidebar,
body.has-sdp-discovery aside#secondary,
body.has-sdp-discovery .widget-area,
body.has-sdp-discovery .sidebar-primary,
body.has-sdp-discovery .sdt-page-with-sidebar > aside,
body.has-sdp-discovery .sdt-layout--with-sidebar > aside,
body.has-sdp-discovery .sdt-content-layout > aside {
	display: none !important;
	width: 0 !important;
	visibility: hidden !important;
}

/* Force any 2-column theme layout back to a single column on
 * discovery pages. We can't predict every theme's grid container
 * class, so hit the common ones. */
body.has-sdp-discovery .sdt-page-with-sidebar,
body.has-sdp-discovery .sdt-layout--with-sidebar,
body.has-sdp-discovery .sdt-content-layout,
body.has-sdp-discovery .has-sidebar,
body.has-sdp-discovery .sdt-grid--main-sidebar,
body.has-sdp-discovery #primary,
body.has-sdp-discovery #content {
	display: block !important;
	grid-template-columns: 1fr !important;
	max-width: 100% !important;
	width: 100% !important;
}

/* Theme sometimes adds inline styles to the parent of the
 * shortcode container — neutralise any width constraint we can. */
body.has-sdp-discovery .sdp-d {
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	width: 100vw !important;
	max-width: 100vw !important;
}

/* ============================================================
 * Design tokens — pull from theme custom-properties when they
 * exist, fall back to SDP defaults otherwise.
 * ============================================================ */

.sdp-d {
	--sdp-radius:        12px;
	--sdp-radius-sm:     8px;
	--sdp-radius-lg:     20px;

	/* Greys + body text — fall back to theme's slate scale, then WP
	 * editor presets, then safe defaults. */
	--sdp-color-text:    var(--sdp-slate-900, var(--wp--preset--color--foreground, #0f172a));
	--sdp-color-text-2:  var(--sdp-slate-700, #475569);
	--sdp-color-mute:    var(--sdp-slate-500, #64748b);
	--sdp-color-line:    var(--sdp-slate-200, #e2e8f0);
	--sdp-color-line-2:  var(--sdp-slate-100, #f1f5f9);
	--sdp-color-bg:      var(--wp--preset--color--background, #ffffff);
	--sdp-color-bg-soft: var(--sdp-slate-50, #f8fafc);
	--sdp-color-bg-card: #ffffff;

	/* Primary + accent come from the theme's active colour scheme
	 * (--sdp-primary is injected into :root by sdt-theme PHP). */
	--sdp-color-primary:      var(--sdp-primary, #4f46e5);
	--sdp-color-primary-dark: var(--sdp-primary-dark, #4338ca);
	--sdp-color-primary-bg:   color-mix(in srgb, var(--sdp-color-primary) 8%, transparent);
	--sdp-color-accent:       var(--sdp-accent, var(--sdp-color-primary));

	/* AI mode keeps its purple identity regardless of theme — it's a
	 * mode signal, not a brand colour. */
	--sdp-color-ai:    #7c3aed;
	--sdp-color-ai-bg: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%);

	--sdp-color-warn:  #f59e0b;
	--sdp-color-ok:    #10b981;
	--sdp-color-error: #dc2626;

	--sdp-shadow-1: 0 1px 2px rgba(15, 23, 42, 0.04);
	--sdp-shadow-2: 0 4px 12px -4px rgba(15, 23, 42, 0.08);
	--sdp-shadow-3: 0 12px 32px -12px rgba(15, 23, 42, 0.18);

	/* Hero gradient is fully scheme-driven. Picks up the theme's
	 * primary + primary-dark, builds a deep radial wash that always
	 * looks intentional in whatever scheme the user has active.
	 * Falls back to neutral indigo when no theme vars exist. */
	--sdp-hero-c1: var(--sdp-primary, #312e81);
	--sdp-hero-c2: var(--sdp-primary-dark, #1e1b4b);
	--sdp-hero-c3: color-mix(in srgb, var(--sdp-primary-dark, #1e1b4b) 70%, #000);
	--sdp-hero-grad: radial-gradient(120% 80% at 20% 0%, var(--sdp-hero-c1) 0%, var(--sdp-hero-c2) 45%, var(--sdp-hero-c3) 100%);
	--sdp-hero-glow-a: color-mix(in srgb, var(--sdp-color-accent) 32%, transparent);
	--sdp-hero-glow-b: color-mix(in srgb, var(--sdp-color-primary) 22%, transparent);

	/* Allow the shortcode to escape narrow theme containers entirely.
	 * Negative-margin breakout pulls .sdp-d to full viewport width
	 * regardless of what wraps it. */
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	width: 100vw !important;
	max-width: 100vw !important;

	color: var(--sdp-color-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 15px;
	line-height: 1.5;
}

.sdp-d *,
.sdp-d *::before,
.sdp-d *::after {
	box-sizing: border-box;
}

/* ============================================================
 * Hero
 * ============================================================ */

.sdp-d__hero {
	position: relative;
	padding: clamp(2.5rem, 6vw, 5rem) 1.25rem clamp(3rem, 7vw, 6rem);
	overflow: hidden;
	color: #fff;
	margin-bottom: 2.5rem;
}

.sdp-d__hero-bg {
	position: absolute;
	inset: 0;
	background: var(--sdp-hero-grad);
	z-index: 0;
}

.sdp-d__hero-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		radial-gradient(circle at 80% 20%, var(--sdp-hero-glow-a), transparent 50%),
		radial-gradient(circle at 30% 90%, var(--sdp-hero-glow-b), transparent 55%);
	pointer-events: none;
}

.sdp-d__hero-inner {
	position: relative;
	z-index: 1;
	max-width: 880px;
	margin: 0 auto;
	text-align: center;
}

.sdp-d__hero-eyebrow {
	display: inline-block;
	padding: 0.3rem 0.85rem;
	background: rgba(255, 255, 255, 0.12);
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.85);
	margin-bottom: 1rem;
	backdrop-filter: blur(8px);
}

.sdp-d__hero-title {
	font-size: clamp(2rem, 5vw, 3.5rem);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.025em;
	margin: 0 0 0.85rem;
	color: #fff;
}

.sdp-d__hero-sub {
	font-size: clamp(1rem, 1.8vw, 1.15rem);
	color: rgba(255, 255, 255, 0.78);
	max-width: 620px;
	margin: 0 auto 2rem;
	line-height: 1.55;
}

/* Hero search form */

.sdp-d__search-form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	justify-content: center;
	max-width: 720px;
	margin: 0 auto;
}

.sdp-d__search-input-wrap {
	position: relative;
	flex: 1 1 380px;
	min-width: 0;
	display: flex;
	align-items: center;
}

.sdp-d__search-icon {
	position: absolute;
	left: 1.1rem;
	font-size: 1.3rem;
	color: var(--sdp-color-mute);
	pointer-events: none;
	z-index: 1;
}

.sdp-d__search-input {
	width: 100%;
	height: 60px;
	padding: 0 60px 0 3.2rem;
	font-size: 1.1rem;
	border: 0;
	border-radius: var(--sdp-radius);
	background: #fff;
	color: var(--sdp-color-text);
	box-shadow: var(--sdp-shadow-3);
	transition: box-shadow 0.2s ease, transform 0.15s ease;
}

.sdp-d__search-input:focus {
	outline: none;
	box-shadow: var(--sdp-shadow-3), 0 0 0 4px rgba(99, 102, 241, 0.35);
}

.sdp-d__search-input::placeholder {
	color: #94a3b8;
}

.sdp-d__nearme {
	position: absolute;
	right: 0.5rem;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: var(--sdp-radius-sm);
	background: transparent;
	color: var(--sdp-color-primary);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s ease;
	font-size: 1.25rem;
}

.sdp-d__nearme:hover {
	background: var(--sdp-color-primary-bg);
}

.sdp-d__nearme.sdp-is-active {
	background: var(--sdp-color-primary);
	color: #fff;
}

/* Mode toggle inside the hero */

.sdp-d__mode {
	display: inline-flex;
	background: rgba(255, 255, 255, 0.12);
	border-radius: var(--sdp-radius);
	padding: 4px;
	gap: 2px;
	backdrop-filter: blur(10px);
	height: 60px;
}

.sdp-d__mode-opt {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0 1.25rem;
	border: 0;
	background: transparent;
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.95rem;
	font-weight: 600;
	border-radius: 9px;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
	font-family: inherit;
}

.sdp-d__mode-opt:hover {
	color: #fff;
}

.sdp-d__mode-opt i {
	font-size: 1.15rem;
}

.sdp-d__mode-opt.sdp-is-active {
	background: #fff;
	color: var(--sdp-color-primary);
	box-shadow: var(--sdp-shadow-1);
}

.sdp-d__mode-opt[data-mode="ai"].sdp-is-active {
	color: var(--sdp-color-ai);
	background: linear-gradient(135deg, #fff, #faf5ff);
}

.sdp-d__mode-opt[disabled] {
	opacity: 0.4;
	cursor: not-allowed;
}

/* Quick-search chips */

.sdp-d__quick-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	justify-content: center;
	margin-top: 1.4rem;
}

.sdp-d__quick-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.4rem 0.9rem;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 999px;
	color: rgba(255, 255, 255, 0.9);
	font-size: 0.85rem;
	font-weight: 500;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
	font-family: inherit;
}

.sdp-d__quick-chip:hover {
	background: rgba(255, 255, 255, 0.2);
	border-color: rgba(255, 255, 255, 0.4);
}

.sdp-d__quick-chip i {
	font-size: 0.95rem;
	opacity: 0.7;
}

/* ============================================================
 * Layout: sidebar + main
 * ============================================================ */

.sdp-d__layout {
	max-width: 1280px;
	margin: 0 auto 4rem;
	padding: 0 1.25rem;
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 2rem;
	align-items: start;
}

/*
 * Split-screen view: filters | (results + sticky map).
 *
 * The map markup lives INSIDE <main>, not as a third top-level column, so the
 * outer layout stays a simple sidebar | main split and <main> itself becomes a
 * nested grid. The header rows (toolbar, active chips, AI summary, pagination)
 * span the full width while the results column and the sticky map sit side by
 * side. This is what makes Split actually render the map next to the cards.
 */
.sdp-d__layout--split {
	max-width: 1680px;
	grid-template-columns: 264px minmax(0, 1fr);
	gap: 1.5rem;
}
.sdp-d__layout--split .sdp-d__main {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(400px, 520px);
	grid-template-areas:
		"toolbar toolbar"
		"chips   chips"
		"summary summary"
		"results map"
		"pager   pager";
	column-gap: 1.5rem;
	align-items: start;
}
.sdp-d__layout--split .sdp-d__toolbar      { grid-area: toolbar; }
.sdp-d__layout--split .sdp-d__active-chips { grid-area: chips; }
.sdp-d__layout--split .sdp-d__ai-summary   { grid-area: summary; }
.sdp-d__layout--split .sdp-d__results      { grid-area: results; }
.sdp-d__layout--split .sdp-d__pagination   { grid-area: pager; }
.sdp-d__layout--split .sdp-d__map {
	grid-area: map;
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + 16px);
	height: calc(100vh - var(--wp-admin--admin-bar--height, 0px) - 32px);
	min-height: 480px;
}
.sdp-d__layout--map .sdp-d__results { display: none; }
.sdp-d__layout--list .sdp-d__map    { display: none; }

@media (max-width: 1180px) {
	/* Tablet: stack results above a static map inside main. */
	.sdp-d__layout--split .sdp-d__main {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"toolbar"
			"chips"
			"summary"
			"results"
			"map"
			"pager";
	}
	.sdp-d__layout--split .sdp-d__map {
		position: static;
		height: clamp(420px, 60vh, 640px);
		min-height: 0;
	}
}
@media (max-width: 960px) {
	.sdp-d__layout--split .sdp-d__map {
		/* Phone: hide the map entirely in split mode; the user can switch
		   to Map view if they want it. */
		display: none;
	}
}

/* "Search this area" pill that surfaces after a pan/zoom. */
.sdp-d__map { position: relative; }
.sdp-d__map-research {
	position: absolute;
	top: 14px;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	border-radius: 999px;
	border: 0;
	background: #0f172a;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.25);
	z-index: 401;
	transition: transform .15s ease, box-shadow .15s ease;
}
.sdp-d__map-research:hover {
	transform: translateX(-50%) translateY(-1px);
	box-shadow: 0 10px 28px rgba(15, 23, 42, 0.32);
}
.sdp-d__map-research i { font-size: 15px; }

/* ============================================================
 * Sidebar
 * ============================================================ */

.sdp-d__sidebar {
	background: var(--sdp-color-bg-card);
	border: 1px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius-lg);
	padding: 1.25rem;
	position: sticky;
	top: 1.5rem;
	max-height: calc(100vh - 3rem);
	overflow-y: auto;
}

.sdp-d__sidebar-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1rem;
}

.sdp-d__sidebar-title {
	font-size: 1rem;
	font-weight: 700;
	margin: 0;
	color: var(--sdp-color-text);
}

.sdp-d__sidebar-close {
	display: none;
	width: 32px;
	height: 32px;
	border: 0;
	background: transparent;
	color: var(--sdp-color-mute);
	border-radius: 8px;
	cursor: pointer;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
}

.sdp-d__filter-group {
	border-top: 1px solid var(--sdp-color-line-2);
	padding: 1rem 0;
}

.sdp-d__filter-group:first-of-type {
	border-top: 0;
	padding-top: 0;
}

.sdp-d__filter-title {
	font-size: 0.78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--sdp-color-mute);
	margin: 0 0 0.7rem;
}

/* Category list */

.sdp-d__cat-search {
	position: relative;
	margin-bottom: 0.6rem;
}

.sdp-d__cat-search i {
	position: absolute;
	left: 0.65rem;
	top: 50%;
	transform: translateY(-50%);
	font-size: 0.95rem;
	color: var(--sdp-color-mute);
}

.sdp-d__cat-search-input {
	width: 100%;
	height: 34px;
	padding: 0 0.65rem 0 1.95rem;
	font-size: 0.85rem;
	border: 1px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius-sm);
	background: var(--sdp-color-bg-soft);
	color: var(--sdp-color-text);
}

.sdp-d__cat-search-input:focus {
	outline: none;
	border-color: var(--sdp-color-primary);
	background: #fff;
}

.sdp-d__cat-list {
	list-style: none;
	padding: 0;
	margin: 0;
	max-height: 320px;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.sdp-d__cat-list-empty {
	font-size: 0.85rem;
	color: var(--sdp-color-mute);
	padding: 0.5rem;
}

.sdp-d__cat-item {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.4rem 0.5rem;
	font-size: 0.88rem;
	color: var(--sdp-color-text);
	border-radius: 6px;
	cursor: pointer;
	transition: background 0.1s ease;
}

.sdp-d__cat-item:hover {
	background: var(--sdp-color-bg-soft);
}

.sdp-d__cat-item input[type="checkbox"] {
	margin: 0;
	width: 14px;
	height: 14px;
	accent-color: var(--sdp-color-primary);
	flex-shrink: 0;
}

.sdp-d__cat-item-name {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sdp-d__cat-item-count {
	font-size: 0.78rem;
	color: var(--sdp-color-mute);
	background: var(--sdp-color-line-2);
	padding: 1px 7px;
	border-radius: 999px;
	min-width: 26px;
	text-align: center;
}

.sdp-d__cat-item.sdp-is-active {
	background: var(--sdp-color-primary-bg);
	color: var(--sdp-color-primary);
	font-weight: 600;
}

/* Rating picker */

.sdp-d__rating-picker {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}

.sdp-d__rating-opt {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.35rem 0.7rem;
	border: 1px solid var(--sdp-color-line);
	border-radius: 999px;
	background: #fff;
	color: var(--sdp-color-text-2);
	font-size: 0.82rem;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: border-color 0.12s ease, background 0.12s ease, color 0.12s ease;
}

.sdp-d__rating-opt i {
	color: var(--sdp-color-warn);
	font-size: 0.95rem;
}

.sdp-d__rating-opt:hover {
	border-color: var(--sdp-color-warn);
}

.sdp-d__rating-opt.sdp-is-active {
	background: #fef3c7;
	border-color: var(--sdp-color-warn);
	color: #92400e;
}

/* Toggle switches */

.sdp-d__toggle {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	padding: 0.5rem 0;
	font-size: 0.88rem;
	cursor: pointer;
}

.sdp-d__toggle input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.sdp-d__toggle-track {
	flex-shrink: 0;
	width: 34px;
	height: 20px;
	background: #cbd5e1;
	border-radius: 999px;
	position: relative;
	transition: background 0.15s ease;
}

.sdp-d__toggle-knob {
	position: absolute;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
	top: 2px;
	left: 2px;
	transition: left 0.15s ease;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.sdp-d__toggle input:checked + .sdp-d__toggle-track {
	background: var(--sdp-color-primary);
}

.sdp-d__toggle input:checked + .sdp-d__toggle-track .sdp-d__toggle-knob {
	left: 16px;
}

.sdp-d__toggle-label {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	flex: 1;
}

.sdp-d__toggle-label i {
	font-size: 1rem;
	color: var(--sdp-color-mute);
}

.sdp-d__toggle input:checked ~ .sdp-d__toggle-label i {
	color: var(--sdp-color-primary);
}

.sdp-d__toggle-count {
	margin-left: auto;
	font-size: 0.78rem;
	color: var(--sdp-color-mute);
}

/* Distance slider */

.sdp-d__radius-range {
	width: 100%;
	accent-color: var(--sdp-color-primary);
}

.sdp-d__distance-readout {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.85rem;
	margin-top: 0.3rem;
}

.sdp-d__distance-val {
	color: var(--sdp-color-text);
	font-weight: 600;
}

.sdp-d__distance-clear {
	border: 0;
	background: transparent;
	color: var(--sdp-color-primary);
	font-size: 0.78rem;
	cursor: pointer;
	font-family: inherit;
}

/* Clear-all button */

.sdp-d__clear-filters {
	margin-top: 0.75rem;
	width: 100%;
	padding: 0.6rem;
	background: var(--sdp-color-bg-soft);
	border: 1px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius-sm);
	color: var(--sdp-color-text-2);
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	font-family: inherit;
	transition: background 0.12s ease;
}

.sdp-d__clear-filters:hover {
	background: var(--sdp-color-line-2);
}

/* ============================================================
 * Main column
 * ============================================================ */

.sdp-d__main {
	min-width: 0;
}

/* Toolbar */

.sdp-d__toolbar {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	flex-wrap: wrap;
	margin-bottom: 1rem;
	padding-bottom: 0.85rem;
	border-bottom: 1px solid var(--sdp-color-line);
}

.sdp-d__filter-toggle {
	display: none;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 0.85rem;
	background: var(--sdp-color-bg-soft);
	border: 1px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius-sm);
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--sdp-color-text);
	cursor: pointer;
	font-family: inherit;
}

.sdp-d__filter-toggle .sdp-d__filter-count {
	background: var(--sdp-color-primary);
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	padding: 1px 7px;
	border-radius: 999px;
}

.sdp-d__status {
	flex: 1;
	min-width: 100px;
	font-size: 0.9rem;
	color: var(--sdp-color-text-2);
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.sdp-d__status.sdp-is-error {
	color: var(--sdp-color-error);
}

.sdp-d__status .sdp-d__spinner {
	display: inline-block;
	width: 14px;
	height: 14px;
	border: 2px solid var(--sdp-color-line);
	border-top-color: var(--sdp-color-primary);
	border-radius: 50%;
	animation: sdp-d-spin 0.7s linear infinite;
}

@keyframes sdp-d-spin {
	to { transform: rotate(360deg); }
}

.sdp-d__view-toggle {
	display: inline-flex;
	background: var(--sdp-color-bg-soft);
	border-radius: var(--sdp-radius-sm);
	padding: 3px;
	gap: 2px;
}

.sdp-d__view-opt {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.4rem 0.85rem;
	border: 0;
	background: transparent;
	color: var(--sdp-color-text-2);
	font-size: 0.85rem;
	font-weight: 600;
	border-radius: 6px;
	cursor: pointer;
	font-family: inherit;
	transition: background 0.12s ease, color 0.12s ease;
}

.sdp-d__view-opt:hover {
	color: var(--sdp-color-text);
}

.sdp-d__view-opt.sdp-is-active {
	background: #fff;
	color: var(--sdp-color-primary);
	box-shadow: var(--sdp-shadow-1);
}

.sdp-d__view-opt i {
	font-size: 1rem;
}

.sdp-d__sort {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.88rem;
	color: var(--sdp-color-mute);
}

.sdp-d__sort-select {
	font-size: 0.88rem;
	color: var(--sdp-color-text);
	background: #fff;
	border: 1px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius-sm);
	padding: 0.4rem 0.6rem;
	font-family: inherit;
	cursor: pointer;
}

/* Active filter chips */

.sdp-d__active-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-bottom: 1rem;
}

.sdp-d__chip {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	background: var(--sdp-color-primary-bg);
	color: var(--sdp-color-primary);
	font-size: 0.82rem;
	font-weight: 600;
	padding: 0.3rem 0.6rem 0.3rem 0.8rem;
	border-radius: 999px;
	border: 1px solid rgba(99, 102, 241, 0.2);
}

.sdp-d__chip button {
	background: transparent;
	border: 0;
	color: inherit;
	cursor: pointer;
	padding: 0;
	width: 18px;
	height: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 0.95rem;
}

.sdp-d__chip button:hover {
	background: rgba(99, 102, 241, 0.18);
}

/* AI summary card */

/*
 * The HTML [hidden] attribute must always win inside the search UI. Several
 * toggled elements (AI summary, map, chips, pagination) carry a display rule
 * that would otherwise override the attribute, leaving them visible when the
 * JS sets hidden=true (this is why the "AI UNDERSTOOD" banner showed in
 * standard mode).
 */
.sdp-d [hidden] { display: none !important; }

.sdp-d__ai-summary {
	background: var(--sdp-color-ai-bg);
	border: 1px solid #e9d5ff;
	border-radius: var(--sdp-radius);
	padding: 1rem 1.1rem;
	margin-bottom: 1rem;
	display: flex;
	gap: 0.85rem;
	align-items: flex-start;
}

.sdp-d__ai-summary-icon {
	width: 36px;
	height: 36px;
	background: linear-gradient(135deg, #a855f7, #7c3aed);
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1.1rem;
	flex-shrink: 0;
}

.sdp-d__ai-summary-body {
	flex: 1;
	min-width: 0;
}

.sdp-d__ai-summary-label {
	font-size: 0.72rem;
	font-weight: 700;
	color: #6b21a8;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	display: block;
	margin-bottom: 0.3rem;
}

.sdp-d__ai-summary-text {
	font-size: 0.95rem;
	color: #4c1d95;
	margin: 0 0 0.4rem;
	line-height: 1.5;
}

.sdp-d__ai-parsed {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	margin-top: 0.4rem;
}

.sdp-d__parsed-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	background: rgba(255, 255, 255, 0.7);
	border: 1px solid #e9d5ff;
	border-radius: 999px;
	padding: 0.2rem 0.6rem;
	font-size: 0.78rem;
	color: #6b21a8;
	font-weight: 500;
}

.sdp-d__parsed-chip i {
	font-size: 0.85rem;
	opacity: 0.75;
}

/* ============================================================
 * Results grid
 * ============================================================ */

.sdp-d__results {
	display: grid;
	gap: 1rem;
}

.sdp-d__view--list { grid-template-columns: 1fr; }

/* ============================================================
 * Result card
 * ============================================================ */

.sdp-d__card {
	display: grid;
	grid-template-columns: 180px 1fr 220px;
	gap: 1.1rem;
	padding: 1rem;
	background: var(--sdp-color-bg-card);
	border: 1.5px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius);
	text-decoration: none;
	color: inherit;
	position: relative;
	transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

/*
 * Themes commonly underline content links via rules like
 * ".sdt-entry-content a { text-decoration: underline }" or "a:hover {…}".
 * Because the card itself is an <a> (and the Call/Directions actions are
 * nested <a>s), that decoration cascades onto every text node in the card.
 * Scope these resets under the plugin root (.sdp-d) so they outweigh a
 * single-class theme selector and stay portable across themes.
 */
.sdp-d .sdp-d__card,
.sdp-d .sdp-d__card:hover,
.sdp-d .sdp-d__card:focus,
.sdp-d .sdp-d__card:active,
.sdp-d .sdp-d__card:visited,
.sdp-d .sdp-d__card a,
.sdp-d .sdp-d__card a:hover,
.sdp-d .sdp-d__card a:focus {
	text-decoration: none;
}

.sdp-d__card:hover,
.sdp-d__card.sdp-is-hovered {
	border-color: #c7d2fe;
	transform: translateY(-1px);
	box-shadow: var(--sdp-shadow-2);
}

/* When buildScore() decided the panel isn't useful (no query, no AI mode,
 * no location signal), drop the third grid column so the body fills out. */
.sdp-d__card--no-score {
	grid-template-columns: 180px 1fr;
}

.sdp-d__card.sdp-is-featured {
	border-color: #fde68a;
	background: linear-gradient(180deg, #fffbeb 0%, #fff 30%);
}

.sdp-d__card-thumb {
	width: 180px;
	height: 140px;
	border-radius: var(--sdp-radius-sm);
	overflow: hidden;
	background: var(--sdp-color-line-2);
	flex-shrink: 0;
	position: relative;
}

.sdp-d__card-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.sdp-d__card-thumb-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #cbd5e1;
	font-size: 2.4rem;
}

/* === Card photo slider (Feature #3) === */
.sdp-d__card-slider { position: absolute; inset: 0; }
.sdp-d__card-slider-track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	width: 100%; height: 100%;
}
.sdp-d__card-slider-track::-webkit-scrollbar { display: none; }
.sdp-d__card-slider-track img {
	scroll-snap-align: start;
	scroll-snap-stop: always;
	flex: 0 0 100%;
	width: 100%; height: 100%;
	object-fit: cover;
}
.sdp-d__card-slider-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 28px; height: 28px;
	display: flex; align-items: center; justify-content: center;
	background: rgba(255,255,255,.92);
	color: #0f172a;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	box-shadow: 0 1px 3px rgba(0,0,0,.15);
	opacity: 0;
	transition: opacity .15s ease;
	z-index: 2;
}
.sdp-d__card-slider-arrow:hover { background: #fff; }
.sdp-d__card-slider-arrow--prev { left: 6px; }
.sdp-d__card-slider-arrow--next { right: 6px; }
.sdp-d__card:hover .sdp-d__card-slider-arrow,
.sdp-d__card:focus-within .sdp-d__card-slider-arrow { opacity: 1; }
.sdp-d__card-slider-dots {
	position: absolute;
	bottom: 6px;
	left: 50%;
	transform: translateX(-50%);
	display: flex; gap: 4px;
	pointer-events: none;
	z-index: 2;
}
.sdp-d__card-slider-dot {
	width: 5px; height: 5px;
	border-radius: 50%;
	background: rgba(255,255,255,.55);
	transition: background .15s ease, width .15s ease;
}
.sdp-d__card-slider-dot.is-active {
	background: #fff;
	width: 14px;
	border-radius: 3px;
}

/* === Open Now / Closed pill (Feature #1) === */
.sdp-d__card-open {
	position: absolute;
	top: 8px; left: 8px;
	display: inline-flex; align-items: center; gap: 4px;
	padding: 3px 8px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	z-index: 2;
	backdrop-filter: blur(4px);
}
.sdp-d__card-open i { font-size: 12px; }
.sdp-d__card-open--open   { background: rgba(22,163,74,.95);  color: #fff; }
.sdp-d__card-open--closed { background: rgba(100,116,139,.92); color: #fff; }

/* === Amenity icon row (Feature #2) === */
.sdp-d__card-amenities {
	display: flex; flex-wrap: wrap; gap: 6px;
	margin-top: 2px;
}
.sdp-d__card-amenity {
	display: inline-flex; align-items: center; justify-content: center;
	width: 22px; height: 22px;
	border-radius: 6px;
	background: var(--sdp-color-line-2, #f1f5f9);
	color: var(--sdp-color-text-2, #475569);
	font-size: 13px;
	cursor: help;
}
.sdp-d__card-amenity--more {
	width: auto;
	padding: 0 8px;
	font-size: 11px;
	font-weight: 600;
}

/* === Features (facilities) filter group === */
.sdp-d__features .sdp-d__facility-list {
	display: flex; flex-direction: column; gap: 4px;
}
.sdp-d__facility {
	display: flex; align-items: center; gap: 8px;
	padding: 4px 6px;
	border-radius: 6px;
	cursor: pointer;
	font-size: 13px;
	color: var(--sdp-color-text-1, #1e293b);
	transition: background .15s ease;
}
.sdp-d__facility:hover { background: var(--sdp-color-line-2, #f1f5f9); }
.sdp-d__facility input { margin: 0; }
.sdp-d__facility-name { flex: 1; }
.sdp-d__facility-count {
	font-size: 11px;
	color: var(--sdp-color-text-3, #64748b);
}
.sdp-d__features-empty {
	margin: 0;
	font-size: 12px;
	color: var(--sdp-color-text-3, #94a3b8);
	font-style: italic;
}
.sdp-d__facilities-more {
	appearance: none;
	background: transparent;
	border: 0;
	color: var(--sdp-color-accent, #2563eb);
	font-size: 12px;
	font-weight: 600;
	padding: 6px;
	cursor: pointer;
	text-align: left;
}
.sdp-d__facilities-more:hover { text-decoration: underline; }

.sdp-d__card-body {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.sdp-d__card-badges {
	display: flex;
	gap: 0.35rem;
	flex-wrap: wrap;
}

.sdp-d__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.2rem 0.55rem;
	font-size: 0.7rem;
	font-weight: 700;
	border-radius: 999px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.sdp-d__badge--featured { background: #fef3c7; color: #92400e; }
.sdp-d__badge--verified { background: #dcfce7; color: #166534; }
.sdp-d__badge--premium  {
	background: linear-gradient(135deg, #f3e8ff, #ddd6fe);
	color: #5b21b6;
}

.sdp-d__card-title {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--sdp-color-text);
	line-height: 1.25;
	margin: 0;
}

.sdp-d__card-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem;
	font-size: 0.875rem;
	color: var(--sdp-color-mute);
}

.sdp-d__card-meta-item {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
}

.sdp-d__card-meta-item i {
	font-size: 1rem;
	opacity: 0.75;
}

.sdp-d__card-rating {
	color: var(--sdp-color-warn);
	font-weight: 600;
}

.sdp-d__card-rating-count {
	color: var(--sdp-color-mute);
	font-weight: 400;
	margin-left: 0.15rem;
}

.sdp-d__card-excerpt {
	font-size: 0.92rem;
	line-height: 1.5;
	color: var(--sdp-color-text-2);
	margin: 0.15rem 0 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.sdp-d__card-actions {
	margin-top: auto;
	padding-top: 0.55rem;
	display: flex;
	gap: 0.5rem;
	align-items: center;
	flex-wrap: wrap;
}

.sdp-d__card-action {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.35rem 0.65rem;
	background: var(--sdp-color-bg-soft);
	border: 1px solid var(--sdp-color-line);
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--sdp-color-text);
	text-decoration: none;
	cursor: pointer;
	transition: background 0.12s ease, border-color 0.12s ease;
	font-family: inherit;
}

.sdp-d__card-action:hover {
	background: #fff;
	border-color: #c7d2fe;
	color: var(--sdp-color-primary);
}

.sdp-d__card-action i { font-size: 0.95rem; }

.sdp-d__card-cta {
	margin-left: auto;
	font-size: 0.85rem;
	color: var(--sdp-color-primary);
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
}

/* Score panel */

.sdp-d__score {
	background: var(--sdp-color-bg-soft);
	border: 1px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius-sm);
	padding: 0.85rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	min-width: 0;
}

.sdp-d__score-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.sdp-d__score-title {
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--sdp-color-mute);
}

.sdp-d__score-composite {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--sdp-color-text);
}

.sdp-d__bar {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.78rem;
}

.sdp-d__bar-label {
	width: 72px;
	color: var(--sdp-color-mute);
	font-weight: 500;
	flex-shrink: 0;
}

.sdp-d__bar-track {
	flex: 1;
	height: 6px;
	background: var(--sdp-color-line);
	border-radius: 999px;
	overflow: hidden;
	min-width: 0;
}

.sdp-d__bar-fill {
	height: 100%;
	border-radius: 999px;
	transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/*
 * Score bars track the active theme accent rather than a fixed palette, so
 * the panel always reads as on-brand. We resolve the theme's accent first
 * (--sdp-primary), fall back to the plugin's own primary, then to a sane
 * teal. A subtle opacity step keeps the metrics visually distinguishable
 * without reintroducing off-brand hues.
 */
.sdp-d__bar-fill {
	background: linear-gradient(
		90deg,
		var(--sdp-primary, var(--sdp-color-primary, #19747e)),
		var(--sdp-primary-dark, var(--sdp-color-primary-dark, #0e5159))
	);
}
.sdp-d__bar-fill--relevance { opacity: 1; }
.sdp-d__bar-fill--reviews   { opacity: 0.86; }
.sdp-d__bar-fill--proximity { opacity: 0.78; }
.sdp-d__bar-fill--recency   { opacity: 0.68; }
.sdp-d__bar-fill--ai        { opacity: 1; }

.sdp-d__bar-value {
	width: 32px;
	text-align: right;
	color: var(--sdp-color-text);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	flex-shrink: 0;
}

/* AI reasoning callout on the card */

.sdp-d__ai-reason {
	grid-column: 2 / -1;
	margin-top: 0.4rem;
	background: var(--sdp-color-ai-bg);
	border: 1px solid #e9d5ff;
	border-radius: var(--sdp-radius-sm);
	padding: 0.55rem 0.8rem;
	font-size: 0.85rem;
	color: #5b21b6;
	display: flex;
	gap: 0.5rem;
	align-items: flex-start;
	line-height: 1.4;
}

.sdp-d__ai-reason i {
	font-size: 1rem;
	color: #a855f7;
	flex-shrink: 0;
	margin-top: 0.1rem;
}

/* ============================================================
 * Skeleton loaders
 * ============================================================ */

.sdp-d__skeleton {
	display: grid;
	grid-template-columns: 180px 1fr 220px;
	gap: 1.1rem;
	padding: 1rem;
	background: #fff;
	border: 1.5px solid var(--sdp-color-line);
	border-radius: var(--sdp-radius);
}

.sdp-d__skeleton-block,
.sdp-d__skeleton-line {
	background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 50%, #f1f5f9 100%);
	background-size: 200% 100%;
	animation: sdp-d-shimmer 1.4s infinite;
	border-radius: 6px;
}

.sdp-d__skeleton-block { width: 180px; height: 140px; }
.sdp-d__skeleton-line  { height: 14px; margin-bottom: 0.55rem; }
.sdp-d__skeleton-line.long  { width: 80%; height: 22px; margin-bottom: 0.8rem; }
.sdp-d__skeleton-line.short { width: 55%; }
.sdp-d__skeleton-line.tiny  { width: 35%; }

@keyframes sdp-d-shimmer {
	from { background-position: 200% 0; }
	to   { background-position: -200% 0; }
}

/* ============================================================
 * Empty + error states
 * ============================================================ */

.sdp-d__empty {
	text-align: center;
	padding: 3rem 1rem;
	color: var(--sdp-color-mute);
	background: var(--sdp-color-bg-soft);
	border-radius: var(--sdp-radius-lg);
	border: 1.5px dashed var(--sdp-color-line);
}

.sdp-d__empty i {
	font-size: 2.5rem;
	color: #cbd5e1;
	display: block;
	margin-bottom: 0.5rem;
}

.sdp-d__empty h3 {
	margin: 0.4rem 0 0.3rem;
	font-size: 1.05rem;
	color: var(--sdp-color-text);
}

.sdp-d__empty p {
	margin: 0;
	font-size: 0.9rem;
}

/* ============================================================
 * Map view
 * ============================================================ */

.sdp-d__map {
	height: clamp(420px, 70vh, 720px);
	border-radius: var(--sdp-radius);
	overflow: hidden;
	border: 1.5px solid var(--sdp-color-line);
	background: var(--sdp-color-bg-soft);
}

.sdp-d__map-inner {
	width: 100%;
	height: 100%;
}

.sdp-d__map-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	color: var(--sdp-color-mute);
	font-size: 0.9rem;
	gap: 0.5rem;
}

/* Custom Leaflet popup (we override the default Leaflet styles minimally) */

.sdp-d-popup {
	min-width: 220px;
}

.sdp-d-popup__title {
	font-weight: 700;
	color: var(--sdp-color-text);
	margin: 0 0 0.3rem;
}

.sdp-d-popup__meta {
	font-size: 0.82rem;
	color: var(--sdp-color-mute);
	margin: 0 0 0.45rem;
}

.sdp-d-popup__link {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	color: var(--sdp-color-primary);
	font-weight: 600;
	font-size: 0.85rem;
	text-decoration: none;
}

/* Custom map marker (no images, pure CSS pin head) */

.sdp-d-marker {
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50% 50% 50% 0;
	background: var(--sdp-color-primary);
	color: #fff;
	transform: rotate(-45deg);
	box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.3);
	border: 2px solid #fff;
	font-size: 0.75rem;
	font-weight: 700;
	cursor: pointer;
	transition: transform 0.15s ease, background 0.15s ease;
}

.sdp-d-marker > span { transform: rotate(45deg); }

.sdp-d-marker.sdp-is-active,
.sdp-d-marker.sdp-is-hovered {
	background: var(--sdp-color-ai);
	transform: rotate(-45deg) scale(1.18);
}

.sdp-d-marker.sdp-is-featured {
	background: var(--sdp-color-warn);
}

/* ============================================================
 * Pagination / load more
 * ============================================================ */

.sdp-d__pagination {
	margin: 1.5rem 0 0;
	text-align: center;
}

.sdp-d__load-more {
	padding: 0.7rem 1.5rem;
	background: var(--sdp-color-primary);
	color: #fff;
	border: 0;
	border-radius: var(--sdp-radius-sm);
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: background 0.12s ease;
}

.sdp-d__load-more:hover {
	background: #4338ca;
}

.sdp-d__load-more:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* ============================================================
 * Responsive
 * ============================================================ */

@media (max-width: 960px) {
	.sdp-d__layout {
		grid-template-columns: 1fr;
	}

	.sdp-d__sidebar {
		position: fixed;
		top: 0;
		left: 0;
		width: min(320px, 90vw);
		height: 100vh;
		max-height: 100vh;
		border-radius: 0;
		z-index: 100;
		transform: translateX(-100%);
		transition: transform 0.3s ease;
		overflow-y: auto;
	}

	.sdp-d__sidebar[data-open="true"] {
		transform: translateX(0);
		box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
	}

	.sdp-d__sidebar-close { display: inline-flex; }

	.sdp-d__filter-toggle { display: inline-flex; }

	.sdp-d__card {
		grid-template-columns: 130px 1fr;
		gap: 0.85rem;
	}

	.sdp-d__card-thumb {
		width: 130px;
		height: 130px;
	}

	.sdp-d__score {
		grid-column: 1 / -1;
	}

	.sdp-d__ai-reason {
		grid-column: 1 / -1;
	}

	.sdp-d__skeleton {
		grid-template-columns: 130px 1fr;
	}

	.sdp-d__skeleton-block { width: 130px; height: 130px; }
}

@media (max-width: 600px) {
	.sdp-d__hero { padding-left: 1rem; padding-right: 1rem; }

	.sdp-d__layout { padding: 0 0.85rem; }

	.sdp-d__search-form {
		flex-direction: column;
	}

	.sdp-d__mode {
		align-self: stretch;
		justify-content: center;
	}

	.sdp-d__card {
		grid-template-columns: 1fr;
		padding: 0.85rem;
	}

	.sdp-d__card-thumb {
		width: 100%;
		height: 180px;
	}

	.sdp-d__skeleton { grid-template-columns: 1fr; }
	.sdp-d__skeleton-block { width: 100%; height: 180px; }

	.sdp-d__toolbar { gap: 0.5rem; }

	.sdp-d__sort .sdp-d__sort-label { display: none; }
}

/* Body lock when sidebar drawer is open on mobile */
body.sdp-d-locked { overflow: hidden; }