/* KANTARA Study Planner – Ergänzungen zum Original-Stylesheet.
   Hier liegen nur die Teile, die früher vom React-Framework kamen. */

/* Klappboxen: sanftes Auf- und Zuklappen */
[data-slot="accordion-content"] { overflow: hidden; }
[data-slot="accordion-content"][data-state="open"] { animation: kantara-acc-down .3s ease-out; }
[data-slot="accordion-content"][data-state="closed"]:not([hidden]) { animation: kantara-acc-up .25s ease-out forwards; }
@keyframes kantara-acc-down { from { height: 0; } to { height: var(--radix-collapsible-content-height); } }
@keyframes kantara-acc-up { from { height: var(--radix-collapsible-content-height); } to { height: 0; } }
@media (prefers-reduced-motion: reduce) {
  [data-slot="accordion-content"] { animation: none !important; }
}

/* Rechtstexte: Abstände und Aufzählungszeichen */
.legal-sections p + p { margin-top: 12px; }
.legal-sections .legal-subsection { margin-top: 18px; }
.legal-subsection ul { list-style: disc; margin-top: 10px; margin-bottom: 10px; }
.legal-subsection li { padding-left: 4px; }

/* Rechtsseiten: lange Überschriften dürfen nie über die Karte hinausragen */
.legal-card h1 { font-size: clamp(34px, 7vw, 88px); overflow-wrap: anywhere; hyphens: manual; max-width: 100%; }
.legal-card { overflow-wrap: anywhere; }
.legal-topbar > a:last-child { white-space: nowrap; }
@media (max-width: 420px) { .legal-card { padding: 28px 22px; } .legal-card h1 { font-size: clamp(32px, 9.5vw, 44px); } }

/* Kauf-Block: Preis und Schaltfläche zentral, Infokasten darunter */
.final-buy > strong { display: block; margin: 18px auto 6px; }
.final-buy > small { display: block; margin: 0 auto 6px; }
.final-buy .compatibility-brief { margin: 34px auto 0; }

/* Checkout (Stripe Payment Links) */
.checkout { display: grid; justify-items: center; gap: 14px; width: min(640px, 100%); margin: 6px auto 10px; }
.checkout-editions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; border: 0; padding: 0; margin: 0; }
.checkout-editions legend { color: #aab5c4; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 10px; width: 100%; text-align: center; }
.checkout-edition { display: inline-flex; align-items: center; gap: 9px; padding: 10px 16px; border: 1px solid #ffffff40; border-radius: 999px; color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; transition: border-color .25s, background-color .25s; }
.checkout-edition:has(input:checked) { border-color: #fff; background: #ffffff14; }
.checkout-edition input { position: absolute; opacity: 0; width: 0; height: 0; }
.checkout-edition .edition-swatch { width: 16px; height: 16px; border-radius: 50%; }
.checkout-consent { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; text-align: left; color: #c9d3e0; font-size: 13px; line-height: 1.55; background: #ffffff0b; border: 1px solid #fff3; border-radius: 16px; padding: 14px 16px; cursor: pointer; }
.checkout-consent input { width: 18px; height: 18px; margin-top: 2px; accent-color: #fff; cursor: pointer; }
.checkout-consent a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.checkout-consent.invalid { border-color: #ff8a8a; }
.checkout-error { color: #ffb4b4; font-size: 13px; margin: -6px 0 0; }
.checkout .primary-button { margin: 4px auto 0; }
.checkout > small { color: #8795a8; font-size: 12px; }