/* Zusatz fuer die "X vs. Y"-Seiten. Setzt thema.css voraus. */

/* Die kurze Antwort steht bewusst ganz oben und optisch hervorgehoben:
   Sprachmodelle zitieren den ersten zusammenhaengenden Antwortabsatz. */
.antwort {
  background: var(--akzent-soft); border-radius: var(--radius);
  padding: 18px 20px; margin: 26px 0 34px;
}
.antwort h2 { margin-bottom: 8px }
.antwort p { margin: 0; font-size: 1.04rem }

.tabwrap { overflow-x: auto; -webkit-overflow-scrolling: touch }
table.vgl {
  width: 100%; border-collapse: collapse; font-size: .95rem;
  background: var(--flaeche); border: 1px solid var(--rand); border-radius: var(--radius);
}
table.vgl caption {
  caption-side: top; text-align: left; font-size: .84rem;
  color: var(--gedaempft); padding: 0 0 10px;
}
table.vgl th, table.vgl td { padding: 10px 12px; border-bottom: 1px solid var(--rand); text-align: left; vertical-align: top }
table.vgl thead th { font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; color: var(--gedaempft); font-weight: 700; white-space: nowrap }
table.vgl tbody th { font-weight: 600; min-width: 150px }
table.vgl tbody th .erkl { display: block; font-weight: 400; font-size: .78rem; color: var(--dim); line-height: 1.4; margin-top: 2px }
table.vgl .bar { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: -1px; color: var(--akzent); font-size: .8rem }
table.vgl .diff { color: var(--gedaempft); font-size: .86rem; min-width: 130px }
table.vgl tfoot th, table.vgl tfoot td { border-bottom: 0; font-size: .88rem; color: var(--gedaempft) }

.beleg { border-left: 3px solid var(--akzent); padding: 2px 0 2px 16px; margin: 20px 0 }
.beleg h3 { margin-bottom: 4px }
.beleg p { margin: 0 0 8px }
.beleg .mehr { font-size: .9rem }

.faq details {
  border: 1px solid var(--rand); border-radius: var(--radius);
  padding: 12px 16px; margin: 10px 0; background: var(--flaeche);
}
.faq summary { cursor: pointer; font-weight: 600; list-style: none }
.faq summary::-webkit-details-marker { display: none }
.faq summary::before { content: '+ '; color: var(--akzent); font-weight: 700 }
.faq details[open] summary::before { content: '– ' }
.faq details p { margin: 10px 0 0; color: var(--gedaempft) }

.vgl-liste { list-style: none; padding: 0 }
.vgl-liste li { margin: 0; border-bottom: 1px solid var(--rand) }
.vgl-liste a { display: block; padding: 13px 2px; text-decoration: none; color: var(--text) }
.vgl-liste a b { display: block; font-family: var(--font-titel); font-size: 1.02rem }
.vgl-liste a span { display: block; font-size: .9rem; color: var(--gedaempft); margin-top: 2px }
.vgl-liste a:hover b { color: var(--akzent) }
