/*
 * [ledl_reviews] – siehe includes/class-ledl_reviews.php.
 * Nach dem Domaintechnik Design System (Artboard 12 "reviews panel", Artboard 8 Buttons/Pills/Suche):
 * Tiefe nur über graue Panels, flache Karten, keine Schatten, Buttons/Suche/Chips als Pills.
 * Werte kommen aus den --dt-* Tokens; die Fallbacks entsprechen tokens-domaintechnik.css, solange das
 * WordPress-Theme die Tokens nicht selbst definiert.
 */
.ledl-reviews,
.ledl-reviews-cards {
	--rv-ink: var(--dt-ink, #333336);
	--rv-text: var(--dt-text, #46464a);
	--rv-muted: var(--dt-muted, #6e6f6f);
	--rv-line: var(--dt-line, #d6d6d6);
	--rv-panel: var(--dt-panel, #f1f1f1);
	--rv-white: var(--dt-white, #fff);
	--rv-blue: var(--dt-blue, #1462c5);
	--rv-blue-dark: var(--dt-blue-dark, #094b9f);
	--rv-blue-100: var(--dt-blue-100, #dce7f6);
	--rv-star: var(--dt-star, #e97c00);
	--rv-mark: var(--site-cream, #fef0db);
	--rv-radius-xs: var(--dt-radius-xs, 4px);
	--rv-radius-panel: var(--dt-radius-panel, 20px);
	--rv-radius-pill: var(--dt-radius-pill, 999px);
	--rv-gap: var(--dt-gap, 20px);
	--rv-card-pad: var(--dt-card-pad, 24px);
	--rv-panel-pad: var(--dt-panel-pad, clamp(16px, 3.3vw, 48px));
	--rv-focus-ring: var(--dt-focus-ring, 0 0 0 3px rgb(20 98 197 / .25));
	color: var(--rv-text);
}
.ledl-reviews button,
.ledl-reviews input,
.ledl-reviews select { font: inherit; }
.ledl-reviews button { cursor: pointer; }
.ledl-reviews a:focus-visible,
.ledl-reviews button:focus-visible,
.ledl-reviews select:focus-visible { outline: 2px solid var(--rv-blue); outline-offset: 2px; box-shadow: var(--rv-focus-ring); }
.ledl-reviews [hidden] { display: none !important; }
.ledl-reviews .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Sterne: ein Element, Füllung über --rating (0–5); Wert steht als Text im aria-label */
.ledl-stars {
	display: inline-block;
	font-size: 16px;
	line-height: 1;
	letter-spacing: 2px;
	background: linear-gradient(90deg, var(--rv-star) calc(var(--rating) / 5 * 100%), var(--rv-line) 0);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	white-space: nowrap;
	/* Nur so breit wie die 5 Sterne: in Flex-Spalten (Karte) würde es sonst gestreckt und die %-Füllung stimmt nicht mehr.
	   Kein align-self, damit die Ausrichtung des Containers gilt (Bewertungskarte links, Quellen-Kacheln zentriert). */
	width: max-content;
}
.ledl-stars::before { content: "★★★★★"; }

/* Einleitung: eyebrow + h2 + Lesebreite */
.ledl-reviews__intro { max-width: var(--dt-container-text, 760px); margin: 0 auto 32px; text-align: center; }
.ledl-reviews__eyebrow {
	margin: 0 0 8px;
	font-size: var(--dt-fs-eyebrow, 16px); letter-spacing: 2.2px; text-transform: uppercase; color: var(--rv-ink);
}
.ledl-reviews__intro h2 { margin: 0 0 16px; color: var(--rv-ink); }
.ledl-reviews__summary { margin: 0; line-height: 1.55; }

/* Graues Panel (.dt-reviews) */
.ledl-reviews__panel { padding: var(--rv-panel-pad); background: var(--rv-panel); border-radius: var(--rv-radius-panel); }

/* Zusammenfassungskarten je Plattform */
.ledl-reviews__sources {
	display: flex; flex-wrap: wrap; justify-content: center; gap: var(--rv-gap);
	margin: 0 0 32px; padding: 0; list-style: none;
}
.ledl-reviews__source {
	flex: 0 1 260px; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 8px;
	padding: var(--rv-card-pad); background: var(--rv-white); border-radius: var(--rv-radius-xs); text-align: center;
}
.ledl-reviews__source-name { font-weight: 600; color: var(--rv-ink); }
.ledl-reviews__source-score { color: var(--rv-ink); }

/* Textlink mit Chevron (.dt-link) */
.ledl-reviews__link {
	display: inline-flex; align-items: center; gap: 10px; padding: 0; background: none; border: 0;
	font-size: var(--dt-fs-button, 15.7px); font-weight: 500; letter-spacing: .25px;
	color: var(--rv-blue); text-decoration: none;
}
.ledl-reviews__link::after {
	content: ""; width: 7px; height: 7px; margin-top: 1px;
	border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg);
}
.ledl-reviews__link:hover { color: var(--rv-blue-dark); }

/* Suche + Sortierung (.dt-search: Pill, 56px, 1px Linie, Fokus = blaue Linie + Ring) */
.ledl-reviews__filters { display: flex; flex-direction: column; gap: 16px; }
.ledl-reviews__toolbar { display: flex; flex-wrap: wrap; gap: 12px; }
.ledl-reviews__search { flex: 1 1 320px; }
.ledl-reviews__sort { flex: 0 1 240px; }
.ledl-reviews__toolbar input,
.ledl-reviews__toolbar select {
	box-sizing: border-box; width: 100%; height: var(--dt-input-h, 56px); margin: 0; padding: 0 16px 0 30px;
	font-size: var(--dt-fs-sm, 16px); color: var(--rv-ink);
	background: var(--rv-white); border: 1px solid var(--rv-line); border-radius: var(--rv-radius-pill);
}
.ledl-reviews__toolbar select { padding-left: 24px; }
.ledl-reviews__toolbar input::placeholder { color: #6b6b70; }
.ledl-reviews__toolbar input:focus,
.ledl-reviews__toolbar select:focus { outline: none; border-color: var(--rv-blue); box-shadow: var(--rv-focus-ring); }

/* Begriffe (.dt-pill-label: blue-100, 9 × 16) */
.ledl-reviews__chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ledl-reviews__chips-label { margin-right: 4px; font-size: var(--dt-fs-sm, 16px); color: var(--rv-ink); }
.ledl-reviews__chip {
	padding: 9px 16px; font-size: var(--dt-fs-sm, 16px); line-height: 1;
	color: var(--rv-blue); background: var(--rv-blue-100); border: 0; border-radius: var(--rv-radius-pill);
}
.ledl-reviews__chip:hover { color: var(--rv-blue-dark); }
.ledl-reviews__chip[aria-pressed="true"] { color: var(--rv-white); background: var(--rv-blue); }
.ledl-reviews__chip-count { margin-left: 4px; font-size: 13px; opacity: .7; }
.ledl-reviews__chips [data-control="reset"] { margin-left: 8px; }

.ledl-reviews__status { margin: 24px 0 16px; font-size: var(--dt-fs-xs, 14px); color: var(--rv-muted); }

/* Bewertungskarten: weiß auf grau, Radius 4, 14px, Sterne 16 */
.ledl-reviews__list {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: var(--rv-gap);
	margin: 0; padding: 0; list-style: none;
}
.ledl-review { display: flex; margin: 0; }
.ledl-review:focus { outline: none; }
.ledl-review article {
	display: flex; flex-direction: column; gap: 10px; width: 100%;
	padding: var(--rv-card-pad); background: var(--rv-white); border-radius: var(--rv-radius-xs);
	font-size: var(--dt-fs-xs, 14px); line-height: 1.5;
}
.ledl-review.is-target article { outline: 2px solid var(--rv-blue); }
.ledl-review__title { margin: 0 !important; font-size: var(--dt-fs-sm, 16px) !important; font-weight: 600; line-height: 1.35; color: var(--rv-ink); }
.ledl-review__text { margin: 0; padding: 0; border: 0; font-style: normal; font-size: inherit; color: var(--rv-text); }
.ledl-review__text::before,
.ledl-review__text::after { content: none; }
.ledl-review__text p { margin: 0 0 8px; font-size: inherit; }
.ledl-review__text p:last-child { margin: 0; }
.ledl-reviews.is-enhanced .ledl-review__text { position: relative; max-height: calc(1.5em * 8); overflow: hidden; }
.ledl-reviews.is-enhanced .ledl-review.is-clamped .ledl-review__text::after {
	content: ""; position: absolute; inset: auto 0 0; height: 3em; background: linear-gradient(transparent, var(--rv-white));
}
.ledl-reviews.is-enhanced .ledl-review.is-expanded .ledl-review__text { max-height: none; }
.ledl-reviews.is-enhanced .ledl-review.is-expanded .ledl-review__text::after { content: none; }
.ledl-review__toggle { align-self: flex-start; font-size: var(--dt-fs-xs, 14px); }
.ledl-review mark { background: var(--rv-mark); color: inherit; padding: 0 .1em; border-radius: 2px; }
.ledl-review__reply { padding: 12px 16px; background: var(--rv-panel); border-radius: var(--rv-radius-xs); }
.ledl-review__meta { display: flex; flex-direction: column; gap: 2px; margin-top: auto; padding-top: 6px; color: var(--rv-muted); font-size: 13px; }
.ledl-review__author { font-size: var(--dt-fs-xs, 14px); font-weight: 600; color: var(--rv-ink); }

.ledl-reviews__empty { padding: 32px; text-align: center; color: var(--rv-muted); }
.ledl-reviews__notice { margin: 32px 0 0; font-size: 13px; line-height: 1.5; color: var(--rv-muted); }

/* .dt-btn--outline: 48px, 12 × 30, 15.7/500/1px, Hover invertiert */
.ledl-reviews__more {
	display: block; height: var(--dt-btn-h, 48px); margin: 32px auto 0; padding: 12px 30px;
	font-size: var(--dt-fs-button, 15.7px); font-weight: 500; letter-spacing: 1px; line-height: 1.5;
	color: var(--rv-ink); background: transparent; border: 1px solid var(--rv-ink); border-radius: var(--rv-radius-pill);
}
.ledl-reviews__more:hover { color: var(--rv-white); background: var(--rv-ink); }

@media (max-width: 767px) {
	.ledl-reviews__sources { gap: 12px; margin-bottom: 24px; }
	.ledl-reviews__source { flex: 1 1 0; padding: 16px 8px; }
	.ledl-reviews__source .ledl-reviews__link { font-size: 14px; }
	.ledl-review article { padding: 16px; }
	.ledl-reviews__sort { flex-basis: 100%; }
	.ledl-reviews__toolbar input,
	.ledl-reviews__toolbar select { height: 46px; padding-left: 20px; }
}
@media print {
	.ledl-reviews__filters, .ledl-reviews__more { display: none !important; }
	.ledl-reviews .ledl-review[hidden] { display: flex !important; }
	.ledl-reviews .ledl-review__text { max-height: none !important; }
}

/* Themenseiten: Karten mit Ø-Wertung (eigene Seiten, nicht zu verwechseln mit den Filter-Chips darunter) */
.ledl-reviews__topics { margin: 0 0 32px; padding-bottom: 32px; border-bottom: 1px solid var(--rv-line); }
.ledl-reviews__topics h3 { margin: 0 0 16px !important; font-size: var(--dt-fs-sm, 16px) !important; font-weight: 600; color: var(--rv-ink); }
.ledl-reviews__topics ul {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 12px;
	margin: 0; padding: 0; list-style: none;
}
.ledl-reviews__topics li { display: flex; margin: 0; }
.ledl-topic {
	position: relative; display: flex; flex-direction: column; gap: 6px; width: 100%;
	padding: 16px 40px 16px 16px; background: var(--rv-white); border: 1px solid transparent; border-radius: var(--rv-radius-xs);
	color: var(--rv-text); text-decoration: none; font-size: var(--dt-fs-xs, 14px); line-height: 1.3;
}
/* Chevron rechts wie .dt-link: zeigt "führt auf eine eigene Seite" */
.ledl-topic::after {
	content: ""; position: absolute; top: 50%; right: 18px; width: 7px; height: 7px; margin-top: -4px;
	border-top: 1.5px solid var(--rv-blue); border-right: 1.5px solid var(--rv-blue); transform: rotate(45deg);
}
.ledl-topic:hover { border-color: var(--rv-blue); }
.ledl-topic[aria-current="page"] { border-color: var(--rv-blue); box-shadow: inset 3px 0 0 var(--rv-blue); }
.ledl-topic__name { font-weight: 600; color: var(--rv-ink); }
.ledl-topic:hover .ledl-topic__name { color: var(--rv-blue); }
.ledl-topic__score { display: flex; align-items: center; gap: 6px; color: var(--rv-ink); }
.ledl-topic__score .ledl-stars { font-size: 13px; letter-spacing: 1px; }
.ledl-topic__count { font-size: 13px; color: var(--rv-muted); }
.ledl-reviews__back { margin-top: 16px; }
.ledl-reviews__summary a { color: var(--rv-blue); }