/* iPhone-Display-Reparatur (app/content/seiten/iphone-display-reparatur.php): Preisliste aller Modelle als Tabelle */

.idsp-kopf { padding-top: 24px; }
.idsp-kopf .gross { max-width: 50ch; }
.idsp-suche { margin: 28px 0 0; max-width: 560px; }

/* Kurzbeleg im Kopf – Klassen aus dem Werkstattbeleg */
.idsp-kurzbeleg { align-self: center; width: 100%; max-width: 480px; justify-self: end; }
.idsp-kurzbeleg .beleg__titel { margin-bottom: 14px; }
.idsp-kurzbeleg .beleg__link { padding-block: 11px; }
.idsp-kurzbeleg__fuss { margin: 16px 0 0; }
.idsp-kurzbeleg__fuss .pfeil-link { color: var(--schwarz); font-size: .95rem; }
.idsp-kurzbeleg__fuss .pfeil-link:hover { color: var(--rot); }
@media (max-width: 959px) { .idsp-kurzbeleg { justify-self: stretch; max-width: none; } }

/* Preisliste */
.idsp-preise { padding-top: clamp(40px, 1.5rem + 3vw, 88px); }
.idsp-preise__kopf { max-width: 760px; margin-bottom: 28px; }
.idsp-preise__kopf p:not(.etikett) { color: var(--text-2); }
.idsp-sprung { margin-bottom: 28px; }
.idsp-sprung a { border-radius: 4px; }

.idsp-tabelle { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.idsp-tabelle__titel { caption-side: top; text-align: left; padding: 0 0 12px; font: 400 .78rem/1.5 var(--din); letter-spacing: .14em; text-transform: uppercase; color: var(--stahl); }
.idsp-tabelle thead th { padding: 10px 10px 10px 4px; border-bottom: 2px solid var(--schwarz); text-align: left; font: 400 .74rem var(--din); letter-spacing: .2em; text-transform: uppercase; color: var(--stahl); }
.idsp-tabelle .idsp-rechts { text-align: right; }
.idsp-gruppe th { padding: 30px 4px 10px; border-bottom: 1px solid var(--schwarz); text-align: left; font: 700 1.2rem/1.1 var(--din); letter-spacing: -.005em; }
.idsp-tabelle tbody:first-of-type .idsp-gruppe th { padding-top: 18px; }
.idsp-tabelle tbody { scroll-margin-top: calc(var(--kopf-h) + 16px); }
.idsp-tabelle tbody tr:not(.idsp-gruppe) :is(th, td) { padding: 13px 10px 13px 4px; border-bottom: 1px dashed var(--alu); vertical-align: baseline; font-weight: 400; }
.idsp-tabelle tbody th { text-align: left; }
.idsp-tabelle tbody tr:not(.idsp-gruppe):hover :is(th, td) { background: var(--werkbank); }
.idsp-modell { width: 34%; }
.idsp-modell a { font-weight: 600; text-decoration: none; }
.idsp-modell a:hover { text-decoration: underline; }
.idsp-q { width: 30%; }
.idsp-dauer { width: 14%; color: var(--text-2); font-size: .95rem; white-space: nowrap; }
/* so spezifisch wie die Zeilenregel oben (font-weight: 400), sonst bleibt der Preis normal statt fett */
.idsp-tabelle tbody tr:not(.idsp-gruppe) td.idsp-preis { width: 12%; text-align: right; font: 700 1.2rem var(--din); white-space: nowrap; }
.idsp-tabelle td.idsp-aktion { width: 10%; text-align: right; }
.idsp-marke { display: inline-block; margin: 0 6px 2px 0; padding: 2px 8px; border: 1px solid var(--alu); border-radius: 3px; background: #fff; font: 600 .78rem/1.5 var(--din); letter-spacing: .02em; white-space: nowrap; }
.idsp-leer { color: var(--stahl); font-size: .92rem; white-space: nowrap; }
.idsp-leer__vor { display: none; }
.idsp-buchen { font: 700 .95rem var(--din); color: var(--rot); text-decoration: none; white-space: nowrap; }
.idsp-buchen::after { content: " →"; }
.idsp-buchen:hover { text-decoration: underline; color: var(--rot-tief); }
.idsp-fussnote { max-width: 760px; margin: 22px 0 0; font-size: .92rem; color: var(--text-2); }

@media (max-width: 699px) {
  .idsp-tabelle thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .idsp-tabelle, .idsp-tabelle tbody, .idsp-tabelle caption { display: block; }
  .idsp-gruppe { display: block; }
  .idsp-gruppe th { display: block; padding: 26px 2px 10px; }
  .idsp-tabelle tbody tr:not(.idsp-gruppe) { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "modell modell preis" "q dauer aktion"; align-items: baseline; gap: 4px 10px; padding: 12px 2px; border-bottom: 1px dashed var(--alu); }
  .idsp-tabelle tbody tr:not(.idsp-gruppe) :is(th, td) { display: block; width: auto; padding: 0; border: 0; background: none; }
  .idsp-tabelle tbody tr:not(.idsp-gruppe):hover :is(th, td) { background: none; }
  .idsp-modell { grid-area: modell; }
  .idsp-tabelle tbody tr:not(.idsp-gruppe) td.idsp-preis { grid-area: preis; width: auto; font-size: 1.15rem; }
  .idsp-q { grid-area: q; }
  .idsp-q .idsp-marke { margin-bottom: 0; }
  .idsp-leer { font-size: .85rem; }
  .idsp-leer__vor { display: inline; }
  .idsp-dauer { grid-area: dauer; font-size: .85rem; }
  .idsp-tabelle td.idsp-aktion { grid-area: aktion; }
  .idsp-buchen { display: inline-block; padding: 6px 0; }
}

/* Teilequalität – Karten gleich gestaltet, egal ob zwei oder drei Qualitäten in der Liste vorkommen */
.idsp-einleitung { max-width: 760px; margin-bottom: 32px; }
.idsp-einleitung p:not(.etikett) { color: var(--text-2); }
.idsp-qkarten > .karte { background: none; border-radius: 0; padding: 22px 0 0; border-top: 2px solid var(--schwarz); }
.idsp-qkarten > .karte .h4 { font-size: 1.25rem; margin-bottom: .5em; }
.idsp-weiter { max-width: 760px; margin: 28px 0 0; }
.idsp-weiter a, .idsp-meldung a, .idsp-verwandt a { color: var(--rot); }

/* Meldung „Unbekanntes Teil“ */
.idsp-meldung { align-self: start; border-radius: 4px; border-left: 3px solid var(--rot); }
.idsp-meldung p:not(.etikett) { color: var(--text-2); }
.idsp-meldung .etikett { letter-spacing: .14em; }

/* Ablauf an der Werkbank */
.idsp-ablauf { list-style: none; margin: 8px 0 24px; padding: 0; counter-reset: schritt; border-top: 2px solid var(--schwarz); }
.idsp-ablauf li { counter-increment: schritt; position: relative; padding: 16px 0 14px 46px; border-bottom: 1px solid var(--alu); }
.idsp-ablauf li::before { content: counter(schritt, decimal-leading-zero); position: absolute; left: 0; top: 17px; font: 700 .95rem var(--din); letter-spacing: .04em; color: var(--rot); }
.idsp-ablauf .h4 { margin-bottom: .25em; }
.idsp-ablauf p { margin: 0; color: var(--text-2); font-size: .98rem; }
.idsp-wege { align-self: start; }
.idsp-wege .weg-kurz__block { background: #fff; }
.idsp-wege .weg-kurz__block--leise { background: transparent; }
@media (min-width: 900px) {
  .idsp-ablauf-raster { grid-template-columns: 7fr 5fr; }
  .idsp-wege { position: sticky; top: calc(var(--kopf-h) + 24px); }
}

/* Kombi-Beispiel */
.idsp-kombi { align-self: center; }
.idsp-kombi__liste { grid-template-columns: 1fr; }
.idsp-kombi__liste li { align-items: baseline; }
.idsp-kombi__liste small { display: block; font-size: .82rem; color: var(--stahl); }
.idsp-kombi__liste strong { font-size: 1.15rem; color: var(--schwarz); }
.idsp-kombi__liste s { color: var(--stahl); font-weight: 400; margin-right: 6px; }
.idsp-kombi__summe { border-bottom: 2px solid var(--schwarz) !important; }
.idsp-kombi__summe span { font-weight: 700; }
.idsp-kombi__summe strong { color: var(--rot); }
.idsp-kombi__hinweis { margin: 14px 0 0; font-size: .88rem; color: var(--stahl); }

/* Schluss */
.idsp-schluss { padding-top: 0; }
.idsp-verwandt { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: baseline; margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--alu); }
.idsp-verwandt .etikett { margin: 0 8px 0 0; }

/* Zweite Teile-Stufe unter dem Preis mit Originaldisplay (Preisregel vom 03.10.2026) */
.idsp-premium { display: block; margin-top: 2px; font: 400 .78rem/1.3 var(--sans); color: var(--stahl); white-space: nowrap; }