/* ============================================================
   „Eintrag prüfen“ (/eintrag-pruefen): Selbstcheck für
   Sachverständige. Zwei Werkzeug-Karten nebeneinander, darunter
   das Ergebnis — die Umkreise 20/50/100 km als Kennzahlen und die
   Trefferliste wie in der Gutachter-Suche. Farben, Radien und
   Schatten aus dem Theme (tailwind/input.css), Präfix lc-.
   ============================================================ */

/* ---------- Kopfbereich ---------- */
.lc-hero { padding-block: clamp(1.75rem, 1.2rem + 2.4vw, 3rem); }
.lc-title {
  margin-top: 0.8rem; max-width: 24ch;
  font-size: clamp(1.9rem, 1.4rem + 2.3vw, 3rem); line-height: 1.08;
}
.lc-lead { margin-top: 1.1rem; }
.lc-facts {
  display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem;
  margin-top: 1.4rem; padding: 0; list-style: none;
  font-size: 0.95rem; color: var(--color-primary-800);
}
.lc-facts li { display: inline-flex; align-items: center; gap: 0.35rem; }
.lc-facts li::before {
  content: ""; width: 0.45rem; height: 0.45rem; border-radius: 999px;
  background: var(--color-accent-500);
}
.lc-facts strong { font-family: var(--font-display); font-size: 1.15rem; color: var(--color-primary-900); }

/* ---------- Werkzeug-Karten ---------- */
.lc-grid { display: grid; gap: 1.25rem; }
@media (min-width: 56rem) {
  .lc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem; align-items: start; }
}
.lc-panel {
  scroll-margin-top: 6rem;
  padding: clamp(1.3rem, 1rem + 1.2vw, 1.9rem);
  background: #fff;
  border: 1px solid color-mix(in oklch, var(--color-primary-900) 10%, transparent);
  border-radius: var(--radius-xl2);
  box-shadow: var(--shadow-card);
}
.lc-panel--active {
  border-color: color-mix(in oklch, var(--color-primary-600) 45%, transparent);
  box-shadow: var(--shadow-lift), inset 0 4px 0 var(--color-primary-600);
}
.lc-panel-kicker {
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-primary-700);
}
.lc-panel-title { margin-top: 0.4rem; font-size: clamp(1.3rem, 1.1rem + 0.8vw, 1.65rem); line-height: 1.2; }
.lc-panel-text { margin-top: 0.6rem; color: color-mix(in oklch, var(--color-primary-950) 80%, #000); line-height: 1.55; }

.lc-form { display: grid; gap: 1rem; margin-top: 1.25rem; }
.lc-field .field { margin-top: 0.35rem; }
.lc-field--short .field { max-width: 12rem; }
.lc-submit { justify-self: start; }

/* ---------- Ergebnis ---------- */
.lc-result {
  scroll-margin-top: 6rem;
  margin-top: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  padding: clamp(1.3rem, 1rem + 1.4vw, 2.1rem);
  background: linear-gradient(160deg, var(--color-primary-50), #fff 60%);
  border: 1px solid color-mix(in oklch, var(--color-primary-600) 22%, transparent);
  border-radius: var(--radius-xl2);
}
.lc-result:focus { outline: none; }
.lc-result:focus-visible { outline: 3px solid var(--color-primary-600); outline-offset: 3px; }
.lc-result .signup-alert { margin-top: 0; }
.lc-result-title { font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.6rem); line-height: 1.25; }
.lc-result-sub { margin-top: 0.5rem; color: var(--color-primary-800); }
.lc-result-note { margin-top: 1rem; }
.lc-result .btn-row { margin-top: 1.5rem; }

.lc-empty { margin-top: 1rem; max-width: 44rem; line-height: 1.55; }
.lc-empty-title { font-weight: 700; color: var(--color-primary-900); margin-bottom: 0.4rem; }

/* Treffer der Namenssuche */
.lc-hits { display: grid; gap: 0.75rem; margin-top: 1.1rem; padding: 0; list-style: none; }
.lc-hit {
  display: grid; gap: 0.9rem;
  padding: 1rem 1.1rem;
  background: #fff;
  border: 1px solid color-mix(in oklch, var(--color-primary-900) 9%, transparent);
  border-radius: var(--radius-xl);
}
@media (min-width: 44rem) {
  .lc-hit { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
}
.lc-hit-name { font-weight: 700; font-size: 1.05rem; color: var(--color-primary-950); }
.lc-hit-meta { margin-top: 0.15rem; font-size: 0.93rem; color: var(--color-primary-800); }
.lc-hit-field { font-size: 0.86rem; }
.lc-hit-state { margin-top: 0.5rem; }
.lc-hit-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.lc-state {
  display: inline-flex; padding: 0.15rem 0.6rem;
  font-size: 0.78rem; font-weight: 600; line-height: 1.5;
  color: var(--color-primary-800);
  background: var(--color-primary-100); border-radius: 999px;
}
.lc-state--open { color: #5c3d00; background: color-mix(in oklch, var(--color-accent-400) 35%, #fff); }

/* Umkreise 20 / 50 / 100 km */
.lc-rings {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem;
  margin-top: 1.2rem; padding: 0; list-style: none;
}
.lc-ring {
  display: flex; flex-direction: column; gap: 0.1rem;
  padding: 0.9rem 0.8rem;
  background: #fff;
  border: 1px solid color-mix(in oklch, var(--color-primary-900) 9%, transparent);
  border-radius: var(--radius-xl);
}
.lc-ring-km { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-primary-700); }
.lc-ring-no { font-family: var(--font-display); font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); line-height: 1.1; color: var(--color-primary-950); }
.lc-ring-label { font-size: 0.9rem; color: var(--color-primary-800); }
.lc-ring-premium { margin-top: 0.35rem; font-size: 0.8rem; font-weight: 600; color: var(--color-primary-700); }

.lc-verdict {
  margin-top: 1.1rem; max-width: 48rem;
  padding: 0.9rem 1rem;
  background: #fff; border-left: 4px solid var(--color-accent-500);
  border-radius: 0.6rem; line-height: 1.55;
}

/* Beispiel-Trefferliste */
.lc-list-title { margin-top: 1.5rem; font-size: 1.1rem; }
.lc-list {
  display: grid; gap: 0.45rem; margin-top: 0.75rem; padding: 0;
  list-style: none; counter-reset: lc;
}
.lc-list-item {
  counter-increment: lc;
  display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: 0.35rem 0.5rem; align-items: center;
  padding: 0.7rem 0.9rem;
  background: #fff;
  border: 1px solid color-mix(in oklch, var(--color-primary-900) 8%, transparent);
  border-radius: 0.8rem;
}
.lc-list-item::before {
  content: counter(lc) "."; grid-row: span 2;
  font-weight: 700; color: var(--color-primary-600);
}
.lc-list-item--premium { border-color: color-mix(in oklch, var(--color-accent-600) 55%, transparent); background: color-mix(in oklch, var(--color-accent-300) 14%, #fff); }
.lc-list-main { display: flex; flex-direction: column; min-width: 0; }
.lc-list-name {
  font-weight: 600; color: var(--color-primary-900);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
  overflow-wrap: anywhere;
}
.lc-list-name:hover { color: var(--color-primary-700); }
.lc-list-meta { font-size: 0.86rem; color: var(--color-primary-800); }
.lc-list-side { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.6rem; grid-column: 2; }
.lc-list .ad-mark { position: static; }
.lc-list-km { font-size: 0.88rem; font-variant-numeric: tabular-nums; color: var(--color-primary-800); }
@media (min-width: 44rem) {
  .lc-list-item { grid-template-columns: 2rem minmax(0, 1fr) auto; }
  .lc-list-item::before { grid-row: auto; }
  .lc-list-side { grid-column: auto; justify-content: flex-end; }
}

/* ---------- „Und dann?“: kostenlose Übernahme ----------
   Direkt unter Werkzeugen und Ergebnis, gleich breit und mit derselben
   Randbetonung wie die aktive Werkzeug-Karte; rechts die Knöpfe. */
.lc-next {
  scroll-margin-top: 6rem;
  display: grid; gap: 1.5rem;
  margin-top: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  padding: clamp(1.3rem, 1rem + 1.4vw, 2.1rem);
  background: linear-gradient(160deg, var(--color-primary-50), var(--color-sand));
  border: 1px solid color-mix(in oklch, var(--color-primary-600) 45%, transparent);
  border-radius: var(--radius-xl2);
  box-shadow: var(--shadow-lift), inset 0 4px 0 var(--color-primary-600);
}
@media (min-width: 56rem) {
  .lc-next { grid-template-columns: minmax(0, 1fr) minmax(17rem, 21rem); gap: 2.5rem; align-items: center; }
}
.lc-next-title { margin-top: 0.7rem; max-width: 28ch; font-size: clamp(1.45rem, 1.15rem + 1.3vw, 2.1rem); line-height: 1.15; }
.lc-next-lead {
  margin-top: 0.8rem; max-width: 70ch;
  font-size: 1.05rem; line-height: 1.6;
  color: color-mix(in oklch, var(--color-primary-950) 80%, #000);
}
.lc-next-points { display: grid; gap: 0.55rem; margin-top: 1.1rem; padding: 0; list-style: none; }
@media (min-width: 40rem) {
  .lc-next-points { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem 1.5rem; }
}
.lc-next-points li { position: relative; padding-left: 1.75rem; line-height: 1.45; color: var(--color-primary-900); }
.lc-next-points li::before {
  content: ""; position: absolute; left: 0; top: 0.12rem;
  width: 1.15rem; height: 1.15rem; border-radius: 999px;
  background: var(--color-primary-600);
}
.lc-next-points li::after {
  content: ""; position: absolute; left: 0.42rem; top: 0.33rem;
  width: 0.32rem; height: 0.58rem;
  border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.lc-next-actions { display: grid; gap: 0.7rem; align-content: center; }
.lc-next-actions .btn { width: 100%; }
.lc-next-free { margin-top: -0.25rem; text-align: center; font-size: 0.88rem; font-weight: 600; color: var(--color-primary-800); }
.lc-next-link {
  justify-self: center; padding-block: 0.35rem;
  font-weight: 600; color: var(--color-primary-700);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.lc-next-link:hover { color: var(--color-primary-800); }

/* ---------- Region: Paket je Umkreis, kurze Liste mit Scrollbalken ----------
   Die Trefferliste zeigt wenige Plätze und scrollt in ihrem Kasten, damit die
   Paket-Knöpfe darunter ohne langes Scrollen sichtbar bleiben. */
.lc-ring-plan {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem;
  margin-top: 0.5rem; padding-top: 0.5rem;
  border-top: 1px solid color-mix(in oklch, var(--color-primary-900) 8%, transparent);
  font-size: 0.78rem; color: var(--color-primary-800);
}
.lc-list-sub { margin-top: 0.2rem; font-size: 0.86rem; color: var(--color-primary-800); }
.lc-list-scroll {
  margin-top: 0.6rem; max-height: 15.5rem; overflow-y: auto;
  padding: 0.35rem; scrollbar-width: thin; scrollbar-gutter: stable;
  background: color-mix(in oklch, var(--color-primary-100) 45%, #fff);
  border: 1px solid color-mix(in oklch, var(--color-primary-900) 10%, transparent);
  border-radius: var(--radius-xl);
}
.lc-list-scroll:focus-visible { outline: 3px solid var(--color-primary-600); outline-offset: 2px; }
.lc-list-scroll .lc-list { margin-top: 0; }
.lc-result .lc-region-cta { margin-top: 1.1rem; }
@media (max-width: 36rem) {
  .lc-rings { gap: 0.4rem; }
  .lc-ring { padding: 0.7rem 0.55rem; }
  .lc-ring-plan { font-size: 0.72rem; }
}
.lc-result-note a { text-decoration: underline; text-underline-offset: 2px; }
.lc-list-scroll .lc-list-item { padding-block: 0.55rem; }