/* onlion® Reviews 1.4.1 · onlion® Studio
   Farben lassen sich je Website über die Variablen --olr-* anpassen, z. B. im Child-Theme:
   .olr { --olr-accent: #df0067; --olr-accent-2: #b8005a; }
   Standardwerte geprüft: Text ≥ 4,5:1, Sterne und Bedienelemente ≥ 3:1 auf Weiß. */

.olr {
  --olr-text: #2E2A26;
  --olr-muted: #5C534A;
  --olr-card: #FFFFFF;
  --olr-border: #DDCFBC;
  --olr-accent: #3B4C3D;
  --olr-accent-2: #4F6450;
  --olr-hover: #8E5235;
  --olr-star: #A8690F;          /* 4,5:1 auf Weiß */
  --olr-star-empty: #857868;    /* 4,3:1 auf Weiß */
  --olr-radius: 18px;
  --olr-shadow: 0 10px 30px rgba(46, 42, 38, .08);
  --olr-head: inherit;
  color: var(--olr-text);
  font-family: inherit;
}

.olr, .olr *, .olr *::before, .olr *::after { box-sizing: border-box; }
.olr .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* Zusammenfassung ------------------------------------------------------- */
.olr-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding: 22px 26px; margin-bottom: 24px; background: var(--olr-card); border-radius: var(--olr-radius); box-shadow: var(--olr-shadow); }
.olr-summary__score { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.olr-summary__value { font-family: var(--olr-head); font-size: 2.6rem; font-weight: 600; line-height: 1; color: var(--olr-text); }
.olr-summary__count { flex-basis: 100%; font-size: .98rem; color: var(--olr-muted); }
@media (min-width: 600px) { .olr-summary__count { flex-basis: auto; } }
.olr-summary__actions { display: flex; flex-wrap: wrap; gap: 10px; }

.olr-btn { display: inline-flex; align-items: center; min-height: 44px; padding: .6em 1.2em; border-radius: 999px; border: 2px solid var(--olr-accent-2); font-weight: 600; font-size: 1rem; line-height: 1.2; text-decoration: none !important; transition: background .2s, color .2s; }
.olr-btn--primary { background: var(--olr-accent-2); color: #FFFFFF !important; }
.olr-btn--primary:hover { background: var(--olr-accent); border-color: var(--olr-accent); }
.olr-btn--ghost { background: transparent; color: var(--olr-accent) !important; }
.olr-btn--ghost:hover { background: var(--olr-accent-2); color: #FFFFFF !important; }

/* Sterne ----------------------------------------------------------------- */
.olr-stars { position: relative; display: inline-block; line-height: 0; white-space: nowrap; vertical-align: middle; }
.olr-stars svg { width: 18px; height: 18px; margin-right: 2px; }
.olr-stars--lg svg { width: 24px; height: 24px; }
.olr-stars__bg svg { fill: none; stroke: var(--olr-star-empty); stroke-width: 1.4; stroke-linejoin: round; }
.olr-stars__fg { position: absolute; inset: 0 auto 0 0; overflow: hidden; white-space: nowrap; }
.olr-stars__fg svg { fill: var(--olr-star); stroke: var(--olr-star); stroke-width: 1.4; stroke-linejoin: round; }

/* Liste ------------------------------------------------------------------ */
.olr-track { list-style: none !important; margin: 0 !important; padding: 0 !important; display: grid; gap: 20px; }
.olr-item { position: relative; list-style: none !important; margin: 0 !important; padding: 0 !important; }
.olr--grid .olr-track { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }

.olr--slider .olr-track { position: relative; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 4px; padding: 6px 4px 18px !important; scrollbar-width: thin; }
.olr--slider .olr-item { flex: 0 0 calc((100% - 40px) / 3); scroll-snap-align: start; }
@media (max-width: 980px) { .olr--slider .olr-item { flex-basis: calc((100% - 20px) / 2); } }
@media (max-width: 640px) { .olr--slider .olr-item { flex-basis: 88%; } }
.olr-track:focus-visible { outline: 3px solid var(--olr-hover); outline-offset: 4px; border-radius: 12px; }

.olr-nav { display: flex; justify-content: center; gap: 12px; margin-top: 8px; }
.olr-nav__btn { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; border: 2px solid var(--olr-accent-2); background: var(--olr-card); color: var(--olr-accent); cursor: pointer; transition: background .2s, color .2s; }
.olr-nav__btn:hover:not([disabled]) { background: var(--olr-accent-2); color: #FFFFFF; }
.olr-nav__btn[disabled] { opacity: .45; cursor: default; }
.olr-nav__btn:focus-visible, .olr-btn:focus-visible, .olr-more:focus-visible, .olr-card__source:focus-visible { outline: 3px solid var(--olr-hover); outline-offset: 3px; }

/* Karte ------------------------------------------------------------------ */
.olr-card { display: flex; flex-direction: column; gap: 12px; height: 100%; padding: 24px; background: var(--olr-card); border-radius: var(--olr-radius); box-shadow: var(--olr-shadow); }
.olr-card__head { display: flex; align-items: center; gap: 12px; }
.olr-avatar { flex: 0 0 auto; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; font-weight: 700; font-size: .95rem; letter-spacing: .02em; color: #FFFFFF; background: #4F6450; }
.olr-avatar--1 { background: #8E5235; }
.olr-avatar--2 { background: #3B4C3D; }
.olr-avatar--3 { background: #6B5A47; }
.olr-avatar--4 { background: #5A6B7A; }
.olr-avatar--5 { background: #7A4E5E; }
.olr-card__meta { min-width: 0; }
.olr .olr-card__name { margin: 0 !important; padding: 0 !important; font-family: inherit; font-size: 1.02rem !important; font-weight: 700; line-height: 1.3; color: var(--olr-text); overflow-wrap: anywhere; }
.olr-card__date { display: block; font-size: .9rem; color: var(--olr-muted); }
.olr-card__text { position: relative; }
.olr-card__text.is-clamped { max-height: 9.6em; overflow: hidden; }
.olr-card__text p { margin: 0 0 .6em !important; padding: 0 !important; font-size: 1rem !important; line-height: 1.6 !important; color: var(--olr-text); }
.olr-card__text.is-clamped::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2.4em; background: linear-gradient(rgba(255,255,255,0), var(--olr-card)); }
.olr-card__text.is-open { max-height: none; }
.olr-card__text.is-open::after { display: none; }
.olr-more { align-self: flex-start; padding: 4px 0; border: 0; background: none; color: var(--olr-accent); font: inherit; font-size: .95rem; font-weight: 600; text-decoration: underline; text-underline-offset: .18em; cursor: pointer; }
.olr-more:hover { color: var(--olr-hover); }
.olr-card__source { margin-top: auto; font-size: .92rem; font-weight: 600; color: var(--olr-accent) !important; text-decoration: underline !important; text-underline-offset: .18em; }
.olr-card__source:hover { color: var(--olr-hover) !important; }

/* Mehrere Standorte ---------------------------------------------------- */
.olr-summaries { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; margin-bottom: 24px; }
.olr-summaries .olr-summary { margin-bottom: 0; }
.olr-summary--compact { flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 20px 22px; }
.olr .olr-summary__name { margin: 0 !important; padding: 0 !important; font-family: inherit; font-size: 1.05rem !important; font-weight: 700; line-height: 1.3; color: var(--olr-text); }
.olr-summary--compact .olr-summary__value { font-size: 2rem; }
.olr-summary--compact .olr-summary__count { flex-basis: 100%; }
.olr-badge { align-self: flex-start; display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--olr-accent); color: #FFFFFF; font-size: .8rem; font-weight: 700; line-height: 1.4; letter-spacing: .02em; }

/* Umschalter Gesamt / Einzelstandorte ---------------------------------- */
.olr-switch { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; width: fit-content; max-width: 100%; margin: 0 auto 24px; padding: 4px; background: var(--olr-card); border-radius: 26px; box-shadow: var(--olr-shadow); }
.olr-switch[hidden] { display: none; }
.olr-switch__tab { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: .55em 1.15em; border: 0; border-radius: 999px; background: transparent; color: var(--olr-text); font: inherit; font-size: .98rem; font-weight: 600; line-height: 1.2; white-space: nowrap; cursor: pointer; transition: background .2s, color .2s; }
.olr-switch__tab:hover { color: var(--olr-accent); }
.olr-switch__tab[aria-selected="true"] { background: var(--olr-accent-2); color: #FFFFFF; }
.olr-switch__tab:focus-visible { outline: 3px solid var(--olr-hover); outline-offset: 2px; }
.olr-switch__score { display: inline-flex; align-items: center; gap: 3px; font-size: .88em; font-weight: 700; opacity: .85; }
.olr-switch__score::after { content: "★"; color: var(--olr-star); }
.olr-switch__tab[aria-selected="true"] .olr-switch__score::after { color: currentColor; }
/* Schmal (Smartphone oder schmale Spalte): Auswahlliste statt Kacheln.
   Container-Abfrage, damit es auch in schmalen Divi-Spalten auf dem Desktop greift. */
.olr--switch { container-type: inline-size; container-name: olr; }
.olr-pick { display: none; max-width: 420px; margin: 0 auto 24px; }
.olr-pick__label { display: block; margin: 0 0 6px; font-size: .9rem; font-weight: 600; color: var(--olr-muted); text-align: center; }
.olr-pick__field { position: relative; display: block; }
.olr .olr-pick__select {
  -webkit-appearance: none; appearance: none;
  width: 100%; min-height: 48px; margin: 0; padding: .6em 2.8em .6em 1.2em;
  border: 2px solid var(--olr-accent-2); border-radius: 999px;
  background: var(--olr-card); color: var(--olr-text);
  font: inherit; font-size: 1rem; font-weight: 600; line-height: 1.3;
  box-shadow: var(--olr-shadow); cursor: pointer;
}
.olr .olr-pick__select:focus-visible { outline: 3px solid var(--olr-hover); outline-offset: 3px; }
.olr-pick__icon { position: absolute; top: 50%; right: 1.1em; transform: translateY(-50%); color: var(--olr-accent); pointer-events: none; }
@container olr (max-width: 640px) {
  .olr-switch:not([hidden]) { display: none; }
  .olr-pick:not([hidden]) { display: block; }
}
@supports not (container-type: inline-size) {
  @media (max-width: 640px) {
    .olr-switch:not([hidden]) { display: none; }
    .olr-pick:not([hidden]) { display: block; }
  }
}
.olr-panel:focus-visible { outline: 3px solid var(--olr-hover); outline-offset: 6px; border-radius: var(--olr-radius); }
.olr-panel[hidden] { display: none; }
.olr-summary--total { justify-content: center; text-align: center; }
.olr-summary--total .olr-summary__score { justify-content: center; }
.olr-empty { margin: 0 !important; padding: 22px 26px !important; text-align: center; color: var(--olr-muted); background: var(--olr-card); border-radius: var(--olr-radius); }

/* Divi-5-Modul ---------------------------------------------------------- */
.olr_divi_module__inner { width: 100%; }

/* Kennzeichnung ---------------------------------------------------------- */
.olr-attribution { margin: 18px 0 0 !important; padding: 0 !important; font-size: .88rem !important; line-height: 1.5 !important; color: var(--olr-muted) !important; text-align: center; }
.olr-attribution > span:first-child { display: block; font-weight: 600; }
.olr-notice { display: block; max-width: 70ch; margin: 4px auto 0; }
.olr-admin-hint { padding: 14px 18px; border: 2px dashed #B9A68E; border-radius: 12px; background: #FFF8E8; color: #5A4632; }

/* Design „minimal“ ------------------------------------------------------
   Dunkle, reduzierte Karten im Stil von onlion.com. Schrift kommt von der Website.
   Kontraste auf #141928: Text 12:1, Nebentext 5,5:1, Sterne leer 4,4:1, Fokus 6,4:1. */
.olr--minimal {
  --olr-text: #d4d7d1;
  --olr-muted: #8c919c;
  --olr-card: #141928;
  --olr-border: rgba(255, 255, 255, .09);
  --olr-accent: #d4d7d1;
  --olr-accent-2: #d4d7d1;
  --olr-hover: #7697ff;
  --olr-primary: #ffff00;
  --olr-primary-text: #141928;
  --olr-star: #d4d7d1;
  --olr-star-empty: #7a8090;
  --olr-radius: 12px;
  --olr-shadow: none;
}
.olr--minimal .olr-card,
.olr--minimal .olr-summary,
.olr--minimal .olr-empty { border: 1px solid var(--olr-border); box-shadow: none; }
.olr--minimal .olr-card { gap: 10px; padding: 26px 26px 24px; }
.olr--minimal .olr-card__head { display: block; }
.olr.olr--minimal .olr-card__name { font-size: 1.1rem !important; font-weight: 700; letter-spacing: .005em; }
.olr--minimal .olr-card__date { margin-top: 2px; font-size: .92rem; color: var(--olr-muted); }
.olr--minimal .olr-stars { margin: 8px 0 2px; }
.olr--minimal .olr-stars svg { width: 20px; height: 20px; margin-right: 3px; }
.olr--minimal .olr-stars__bg svg { stroke-width: 1.2; }
.olr--minimal .olr-card__text p { font-size: 1rem !important; line-height: 1.55 !important; }
/* Zweizeilig mit Auslassungspunkten statt Verlauf */
.olr--minimal .olr-card__text.is-clamped:not(.is-open) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; max-height: none; overflow: hidden; }
.olr--minimal .olr-card__text.is-clamped:not(.is-open) p { display: inline; margin: 0 !important; }
.olr--minimal .olr-card__text.is-clamped:not(.is-open) p + p::before { content: " "; }
.olr--minimal .olr-card__text.is-clamped::after { display: none; }
.olr--minimal .olr-more { padding: 2px 0; color: var(--olr-muted); font-weight: 400; text-decoration: none; }
.olr--minimal .olr-more:hover { color: var(--olr-text); text-decoration: underline; }
.olr--minimal .olr-card__source { font-size: .85rem; font-weight: 400; color: var(--olr-muted) !important; text-decoration: none !important; }
.olr--minimal .olr-card__source:hover { color: var(--olr-text) !important; text-decoration: underline !important; }
.olr--minimal .olr-badge { background: transparent; border: 1px solid var(--olr-border); color: var(--olr-muted); font-weight: 400; }
.olr--minimal .olr-btn { border-width: 1px; font-weight: 500; }
.olr--minimal .olr-btn--primary { background: var(--olr-primary); border-color: var(--olr-primary); color: var(--olr-primary-text) !important; }
.olr--minimal .olr-btn--primary:hover { background: var(--olr-text); border-color: var(--olr-text); }
.olr--minimal .olr-btn--ghost { border-color: var(--olr-border); color: var(--olr-text) !important; }
.olr--minimal .olr-btn--ghost:hover { background: rgba(255, 255, 255, .06); color: var(--olr-text) !important; }
.olr--minimal .olr-nav__btn { border: 1px solid var(--olr-border); background: transparent; color: var(--olr-text); }
.olr--minimal .olr-nav__btn:hover:not([disabled]) { background: rgba(255, 255, 255, .06); color: var(--olr-text); }
.olr--minimal .olr-switch { background: transparent; border: 1px solid var(--olr-border); box-shadow: none; }
.olr--minimal .olr-pick__select { border-color: var(--olr-border); box-shadow: none; }
.olr--minimal .olr-pick__icon { color: var(--olr-text); }
.olr--minimal .olr-switch__tab[aria-selected="true"] { background: var(--olr-text); color: var(--olr-card); }
.olr--minimal .olr-switch__score::after { color: currentColor; }
.olr--minimal .olr-summary__value { font-weight: 700; }
.olr--minimal :is(.olr-track, .olr-nav__btn, .olr-btn, .olr-more, .olr-card__source, .olr-switch__tab, .olr-panel):focus-visible { outline: 2px solid var(--olr-hover); outline-offset: 3px; }
.olr--minimal .olr-attribution { color: var(--olr-muted) !important; }
.olr--minimal .olr-attribution > span:first-child { font-weight: 500; }
.olr--minimal.olr--grid .olr-track { gap: 24px; }
.olr--minimal.olr--slider .olr-track { scrollbar-color: var(--olr-border) transparent; }

@media (prefers-reduced-motion: reduce) { .olr *, .olr-track, .olr-switch__tab { scroll-behavior: auto !important; transition: none !important; } }

/* 1.4.0: Name verlinkt aufs Google-Profil, wirkt wie Text, Unterstreichung beim Zeigen */
.olr .olr-card__name a { color: inherit; text-decoration: none; }
.olr .olr-card__name a:hover { text-decoration: underline; text-underline-offset: .18em; }
.olr .olr-card__name a:focus-visible { outline: 3px solid var(--olr-hover); outline-offset: 2px; border-radius: 2px; }
