/* ==========================================================================
   WOLTERS Partnerportal – Layout
   Seitenstruktur: Header, Footer, Login, Dashboard, Produktübersicht.
   ========================================================================== */

/* -- Site-Header ----------------------------------------------------------- */
.wo-header {
	position: sticky;
	top: 0;
	z-index: var(--z-header);
	background-color: var(--color-header-bg);
	border-bottom: 5px solid var(--color-accent); /* markentypischer roter Streifen */
}
.wo-header__inner {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	min-height: var(--header-height);
}
.wo-header__brand {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	color: var(--color-text);
	font-size: var(--fs-md);
}
.wo-header__brand img { max-height: 34px; width: auto; }

/* Marken-Wortmarke mit rotem Quadrat */
.wo-logo { display: inline-flex; align-items: center; gap: 0.5rem; }
.wo-logo__text {
	font-family: var(--font-head);
	font-weight: 700;
	font-size: 1.25rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-primary);
	line-height: 1;
}
.wo-logo__mark {
	width: 0.85rem;
	height: 0.85rem;
	background-color: var(--color-accent);
	display: inline-block;
}
.wo-header__brand-badge {
	font-size: var(--fs-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--color-text-soft);
	border-left: 1px solid rgba(66, 61, 55, 0.2);
	padding-left: 0.7rem;
}
.wo-header__nav {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0.25rem;
	margin-inline: auto;
}

/* WordPress-Menü zurücksetzen und erste Navigationsebene horizontal anzeigen */
.wo-header__nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.wo-header__nav > ul,
.wo-header__nav .menu {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}
.wo-header__nav li {
	position: relative;
	margin: 0;
}
.wo-header__nav a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.6rem;
	font-size: var(--fs-sm);
	font-weight: 600;
	color: var(--color-text-soft);
	padding: 0.5rem 0.8rem;
	border-radius: var(--radius-button);
	white-space: nowrap;
	transition: background-color var(--transition), color var(--transition);
}
.wo-header__nav a:hover,
.wo-header__nav a:focus-visible,
.wo-header__nav .current-menu-item > a,
.wo-header__nav .current-menu-ancestor > a {
	background-color: transparent;
	color: rgb(195, 13, 13);
}

/* Pfeil für Menüpunkte mit Untermenü */
.wo-header__nav .menu-item-has-children > a::after {
	content: "";
	display: inline-block;
	width: 0.42rem;
	height: 0.42rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-0.1rem);
	flex: 0 0 auto;
	opacity: 0.65;
}

/* Ebene 2 und 3 zunächst ausblenden */
.wo-header__nav .sub-menu {
	position: absolute;
	top: calc(100% + 0.45rem);
	left: 0;
	z-index: calc(var(--z-header) + 1);
	min-width: 18rem;
	padding: 0.45rem;
	background-color: var(--color-header-bg);
	border-radius: var(--radius-card);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(0.4rem);
	transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
}
.wo-header__nav .sub-menu a {
	width: 100%;
	padding: 0.65rem 0.75rem;
	border-radius: calc(var(--radius-button) * 0.75);
}

.wo-header__nav .sub-menu a:hover,
.wo-header__nav .sub-menu a:focus {
	background-color: transparent;
	color: rgb(195, 13, 13);
}

/* Ebene 3 rechts neben Ebene 2 öffnen */
.wo-header__nav .sub-menu .sub-menu {
	top: -0.45rem;
	left: 100%;
	transform: none;
	border-left: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.wo-header__nav .sub-menu .menu-item-has-children > a::after {
	transform: rotate(-45deg);
}

/* Dropdown per Maus und Tastatur öffnen */
.wo-header__nav li:hover > .sub-menu,
.wo-header__nav li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate(0);
}

/* Dritte Ebene bei wenig Platz optional nach links öffnen */
.wo-header__nav .sub-menu .opens-left > .sub-menu {
	right: 100%;
	left: auto;
}

/* Mobile Navigation: alle Ebenen untereinander darstellen */
@media (max-width: 860px) {
	.wo-header__nav,
	.wo-header__nav > ul,
	.wo-header__nav .menu {
		align-items: stretch;
	}
	.wo-header__nav > ul,
	.wo-header__nav .menu {
		flex-direction: column;
		width: 100%;
	}
	.wo-header__nav li,
	.wo-header__nav a {
		width: 100%;
	}
	.wo-header__nav .sub-menu,
	.wo-header__nav .sub-menu .sub-menu {
		position: static;
		min-width: 0;
		padding: 0 0 0 1rem;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: none;
	}
	.wo-header__nav .sub-menu .sub-menu {
		padding-left: 1rem;
	}
	.wo-header__nav .sub-menu .menu-item-has-children > a::after {
		transform: rotate(45deg) translateY(-0.1rem);
	}
}
.wo-header__actions { display: flex; align-items: center; gap: 0.6rem; }

/* Sprachumschalter DE | EN (inc/languages.php) */
.wo-lang {
	display: inline-flex;
	align-items: center;
	font-family: var(--font-strong);
	font-size: var(--fs-sm);
	letter-spacing: 0.04em;
}
.wo-lang__link {
	padding: 0.25rem 0.35rem;
	color: var(--color-muted);
	text-decoration: none;
}
.wo-lang__link + .wo-lang__link { border-left: 1px solid var(--color-line); }
.wo-lang__link:hover,
.wo-lang__link:focus-visible { color: var(--color-accent); }
.wo-lang__link.is-active { color: var(--color-text); }
.wo-header__cart {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: var(--fs-sm);
	font-weight: 600;
	color: var(--color-text);
}
.wo-header__cart-count {
	min-width: 1.25rem;
	height: 1.25rem;
	padding: 0 0.35rem;
	display: inline-grid;
	place-items: center;
	background-color: var(--color-accent);
	color: var(--color-white);
	font-size: var(--fs-xs);
	font-weight: 700;
	border-radius: 999px;
}
.wo-header__toggle { display: none; }

/* Produktsuche: Icon in den Aktionen, Suchleiste klappt unter dem Header auf */
.wo-header__search-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	border: 0;
	border-radius: var(--radius-input);
	background: none;
	color: var(--color-text);
	cursor: pointer;
}
.wo-header__search-toggle:hover,
.wo-header__search-toggle:focus-visible,
.wo-header__search-toggle[aria-expanded="true"] { color: var(--color-accent); }
.wo-header__search {
	position: absolute;
	top: calc(100% + 5px); /* unterhalb des roten Streifens */
	left: 0; right: 0;
	padding: 0.75rem 0;
	background-color: var(--color-bg);
	border-bottom: 1px solid var(--color-line);
	box-shadow: var(--shadow-soft);
}
.wo-header__search-form {
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.wo-header__search-form .wo-input-icon { flex: 1; min-width: 0; }

/* Live-Vorschau unter dem Suchfeld (assets/js/portal.js → initLiveSearch) */
.wo-live-search {
	margin-top: 0.75rem;
	max-height: min(70vh, 34rem);
	overflow-y: auto;
	transition: opacity var(--transition);
}
.wo-live-search.is-loading { opacity: 0.55; }
.wo-live-search__list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--color-line);
}
.wo-live-search__item { border-bottom: 1px solid var(--color-line); }
.wo-live-search__link {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	padding: 0.55rem 0.5rem;
	color: var(--color-text);
	text-decoration: none;
}
.wo-live-search__link:hover,
.wo-live-search__link:focus-visible {
	background-color: var(--color-primary-soft);
	outline: none;
}
.wo-live-search__media {
	flex: 0 0 3.25rem;
	width: 3.25rem;
	height: 3.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--color-surface-card);
}
.wo-live-search__media img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}
.wo-live-search__body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}
.wo-live-search__name {
	font-family: var(--font-strong);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.wo-live-search__variant { font-size: var(--fs-sm); }
.wo-live-search__sku {
	font-size: var(--fs-sm);
	color: var(--color-muted);
}
.wo-live-search__price {
	flex: 0 0 auto;
	font-family: var(--font-strong);
	text-align: right;
	white-space: nowrap;
}
.wo-live-search__price del { color: var(--color-muted); font-family: var(--font-sans); }
.wo-live-search__price ins { text-decoration: none; color: var(--color-accent); }
.wo-live-search__all {
	display: inline-block;
	margin-top: 0.6rem;
	font-family: var(--font-strong);
	color: var(--color-accent);
}
.wo-live-search__empty {
	margin: 0;
	padding: 0.5rem 0;
	color: var(--color-muted);
}
@media (max-width: 600px) {
	.wo-live-search__price { font-size: var(--fs-sm); }
	.wo-live-search__link { gap: 0.6rem; }
}

/* -- Footer ---------------------------------------------------------------- */
.wo-footer {
	background-color: var(--color-text);
	color: #d8d3cd;
	margin-top: 4rem;
}
.wo-footer a { color: #efe9e3; }
.wo-footer a:hover { color: var(--color-white); }
.wo-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr repeat(3, 1fr);
	gap: 2rem;
	padding-block: 3rem;
}
.wo-footer__grid h4 { color: var(--color-white); font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: 0.08em; }
.wo-footer__grid ul { list-style: none; margin: 0; padding: 0; }
.wo-footer__grid li { margin-bottom: 0.4rem; font-size: var(--fs-sm); }
.wo-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	padding-block: 1.25rem;
	font-size: var(--fs-xs);
	color: var(--color-muted);
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5rem;
}

/* -- Page-Heading ---------------------------------------------------------- */
.wo-page-head {
	background-color: var(--color-bg);
	border-bottom: 1px solid var(--color-line);
	padding-block: 2rem;
}
.wo-page-head h1 { margin-bottom: 0.25rem; }
.wo-breadcrumb { font-size: var(--fs-sm); color: var(--color-muted); }
.wo-breadcrumb a { color: var(--color-muted); }
.wo-breadcrumb a:hover { color: var(--color-accent); }

/* ==========================================================================
   Login-Seite
   ========================================================================== */
.wo-login {
	min-height: 100vh;
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	background-color: var(--color-bg-soft);
}
.wo-login__media {
	position: relative;
	background-size: cover;
	background-position: center;
	background-color: var(--color-bg-sand);
}
.wo-login__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(43,43,46,0.05), rgba(43,43,46,0.45));
}
.wo-login__media-caption {
	position: absolute;
	left: 2.5rem;
	bottom: 2.5rem;
	z-index: 1;
	color: var(--color-white);
	max-width: 26rem;
}
.wo-login__media-caption h2 { color: var(--color-white); font-size: var(--fs-2xl); text-transform: none; }
.wo-login__panelwrap {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.5rem;
	padding: 2rem;
}
.wo-login__topbar {
	display: flex;
	justify-content: flex-end;
	width: 100%;
	max-width: 27rem;
	margin: 0 auto;
}
.wo-login__legal {
	width: 100%;
	max-width: 27rem;
	margin: 0 auto;
	text-align: center;
}
.wo-login__legal p { margin: 0; }
.wo-login__panel {
	width: 100%;
	max-width: 27rem;
	margin: 0 auto;
	background-color: var(--color-bg);
	border: 1px solid var(--color-line);
	border-radius: var(--radius-card);
	box-shadow: var(--shadow-soft);
	padding: 2.75rem 2.5rem;
}
.wo-login__logo { margin-bottom: 1.75rem; }
.wo-login__logo img { max-height: 44px; width: auto; }
.wo-login__title { font-size: var(--fs-xl); text-transform: none; }
.wo-login__sub { color: var(--color-muted); margin-bottom: 1.75rem; }

/* Wortmarke (Fallback, wenn kein Logo gesetzt) */
.wo-wordmark {
	display: block;
	font-family: var(--font-head);
	font-size: 1.6rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--color-text);
	line-height: 1;
}
.wo-wordmark__sub {
	display: block;
	font-size: 0.7rem;
	letter-spacing: 0.35em;
	text-transform: uppercase;
	color: var(--color-accent);
	margin-top: 0.25rem;
}
.wo-login__meta {
	margin-top: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--color-line);
	font-size: var(--fs-sm);
	color: var(--color-muted);
}

/* ==========================================================================
   Dashboard
   ========================================================================== */
.wo-dash__greeting { margin-bottom: 1.5rem; }
.wo-dash__greeting h1 { margin-bottom: 0.15rem; }

.wo-shortcuts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: var(--gutter);
	margin-bottom: 2.5rem;
}
.wo-shortcut {
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
	padding: 1.4rem;
	background-color: var(--color-bg);
	border: 0;
	color: var(--color-text);
	transition: background-color var(--transition);
}
.wo-shortcut:hover { background-color: var(--color-primary-soft); color: var(--color-text); }
.wo-shortcut__icon {
	width: 2.6rem; height: 2.6rem;
	display: grid; place-items: center;
	color: var(--color-accent);
}
.wo-shortcut:hover .wo-shortcut__icon { color: var(--color-accent); }
.wo-shortcut__label { font-weight: 700; font-size: var(--fs-sm); }
.wo-shortcut__hint { font-size: var(--fs-xs); color: var(--color-muted); }

.wo-dash__layout {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: var(--gutter);
	align-items: start;
}
.wo-panel {
	background-color: var(--color-bg);
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 1.75rem;
}
.wo-panel__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1rem;
}
.wo-panel__head h3 { margin: 0; }

/* -- CampaignBanner -------------------------------------------------------- */
.wo-campaign {
	position: relative;
	border-radius: var(--radius-card);
	overflow: hidden;
	background-color: var(--color-bg-sand);
	background-size: cover;
	background-position: center;
	color: var(--color-white);
	padding: 2.5rem;
	min-height: 220px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.wo-campaign::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(43,43,46,0.55), rgba(43,43,46,0.05));
}
.wo-campaign > * { position: relative; z-index: 1; }
.wo-campaign h2 { color: var(--color-white); max-width: 30rem; }
.wo-campaign p { color: rgba(255,255,255,0.9); max-width: 34rem; }

/* -- OrderStatusCard / AccountSummary -------------------------------------- */
.wo-orderrow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--color-line);
}
.wo-orderrow:last-child { border-bottom: 0; }
.wo-orderrow__meta { font-size: var(--fs-xs); color: var(--color-muted); }

/* ==========================================================================
   Produktübersicht
   ========================================================================== */
.wo-shop-layout {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: var(--gutter);
	align-items: start;
}
.wo-filters {
	position: sticky;
	top: calc(var(--header-height) + 1rem);
	background-color: var(--color-bg);
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 1.5rem;
}
.wo-filters__group { padding-block: 0.9rem; border-bottom: 1px solid var(--color-line); }
.wo-filters__group:last-child { border-bottom: 0; }
.wo-filters__group h4 { font-size: var(--fs-sm); margin-bottom: 0.6rem; }
.wo-filters__check { display: flex; align-items: center; gap: 0.5rem; font-size: var(--fs-sm); color: var(--color-text-soft); padding: 0.2rem 0; cursor: pointer; }

.wo-shop-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.25rem;
	flex-wrap: wrap;
}

.wo-product-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: var(--gutter);

	/* Alle Kacheln gleich hoch: jede Zeile bekommt dieselbe Hoehe, und die
	   Karten fuellen sie aus. Zusammen mit den reservierten Textzeilen weiter
	   unten liegen Titel, SKU, Preis und Badge in allen Kacheln auf einer
	   Linie -- unabhaengig von Namenslaenge oder gepflegten Feldern. */
	grid-auto-rows: 1fr;

	/* Zeilen, die der Kacheltext bekommt. Reicht der Platz fuer lange
	   Produktnamen nicht, hier auf 3 erhoehen -- der Rest rechnet mit. */
	--card-title-lines: 2;
	--card-line-height: 1.3;
}

/* -- ProductCard (flach, fotogetrieben, wie Marken-Website) ---------------- */
.wo-product-card {
	display: flex;
	flex-direction: column;
	/* Weiche Flaeche statt transparent: auf dem weissen Seitengrund war die
	   Kachelgrenze vorher nur am Bild ablesbar. Das Innenpolster macht sie
	   sichtbar -- gegliedert wird weiter ueber Flaeche und Abstand, nicht
	   ueber Rahmen oder Schatten (--radius-card/--shadow-soft stehen auf
	   0/none). */
	background-color: var(--color-surface-card);
	padding: 0.9rem;
	height: 100%;

	/* Bezugsrahmen fuer den Stretched-Link auf dem Titel. */
	position: relative;
}
.wo-product-card__media {
	position: relative;
	aspect-ratio: var(--product-media-ratio);
	/* Transparent, damit die Kachelfarbe durchlaeuft: bei freigestellten
	   Produktbildern mit Alphakanal saesse sonst ein weisses Quadrat in der
	   weichen Flaeche. */
	background-color: transparent;
	overflow: hidden;
	margin-bottom: 0.9rem;
	/* Nicht stauchen, wenn die Karte auf Zeilenhoehe gestreckt wird. */
	flex: 0 0 auto;
}
/* cover statt contain (anders als auf der Produktdetailseite): Das Bild
   fuellt die quadratische Kachelflaeche immer vollstaendig, Ueberstand wird
   mittig abgeschnitten. Mit contain und Innenabstand wirkten hoch-, quer-
   und quadratformatige Fotos in der Kategorieansicht unterschiedlich gross.
   Die Bildgroesse 'wolters-card' liefert functions.php als quadratische
   Bounding-Box ohne harten Zuschnitt; beschnitten wird nur hier im CSS. */
.wo-product-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform var(--transition-slow);
}
.wo-product-card:hover .wo-product-card__media img { transform: scale(1.035); }
.wo-product-card__flags { position: absolute; top: 0.75rem; left: 0.75rem; display: flex; gap: 0.35rem; flex-wrap: wrap; }
.wo-product-card__body {
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.3rem;
	flex: 1;
}

/* Jede Textzeile der Kachel bekommt festen Platz -- auch wenn Serie, SKU oder
   UVP am Produkt nicht gepflegt sind. Sonst wandert der Preisblock je nach
   Datenlage nach oben und die Kacheln wirken unterschiedlich hoch. */
.wo-product-card__series,
.wo-product-card__title,
.wo-product-card__sku,
.wo-product-card__foot { width: 100%; }

.wo-product-card__series {
	font-size: var(--fs-xs);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--color-muted);
	font-weight: 600;
	line-height: var(--card-line-height, 1.3);
	min-height: calc(var(--fs-xs) * var(--card-line-height, 1.3));
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.wo-product-card__title {
	--card-title-size: calc(var(--fs-md) * 0.15); /* 15 % kleiner als --fs-md */
	font-size: var(--card-title-size);
	font-weight: 500;
	letter-spacing: 0.01em;
	margin: 0;
	text-transform: none;
	line-height: var(--card-line-height, 1.3);
	/* Feste Zeilenzahl: kuerzere Namen reservieren den Platz, laengere werden
	   mit Auslassungspunkten gekuerzt (vollstaendiger Name im title-Attribut). */
	min-height: calc(var(--card-title-size) * var(--card-line-height, 1.3) * var(--card-title-lines, 2));
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--card-title-lines, 2);
	line-clamp: var(--card-title-lines, 2);
	overflow: hidden;
}
.wo-product-card__title a { color: var(--color-text); }
.wo-product-card__title a:hover { color: var(--color-accent); }

/* Ganze Kachel klickbar. Verlinkt waren nur Bild und Titel -- Serie, SKU,
   Preis und das Innenpolster blieben tot. Gestreckt wird der Titel-Link, weil
   sein Linktext der Produktname ist; der Bild-Link darunter zeigt auf dasselbe
   Ziel, es geht also nichts verloren. Der Bild-Zoom haengt an
   .wo-product-card:hover und funktioniert weiterhin. */
.wo-product-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.wo-product-card__sku {
	line-height: var(--card-line-height, 1.3);
	min-height: calc(var(--fs-xs) * var(--card-line-height, 1.3));
	overflow: hidden;
	text-overflow: ellipsis;
}
.wo-product-card__foot {
	/* Preis und Lagerstatus sitzen immer am unteren Rand der Kachel. */
	margin-top: auto;
	padding-top: 0.35rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
}
/* Preisblock in der Kachel zentriert, mit reservierter UVP-Zeile:
   Haendlerpreis (fs-lg) + gap + UVP (fs-sm). */
.wo-product-card .wo-price {
	align-items: center;
	min-height: calc(
		var(--fs-lg) * var(--card-line-height, 1.3)
		+ 0.15rem
		+ var(--fs-sm) * var(--card-line-height, 1.3)
	);
}
.wo-product-card .wo-price__dealer,
.wo-product-card .wo-price__rrp,
.wo-product-card .wo-price__locked { line-height: var(--card-line-height, 1.3); }

/* -- Empty / Loading ------------------------------------------------------- */
.wo-empty {
	text-align: center;
	padding: 4rem 1rem;
	color: var(--color-muted);
}