/* hw-product-tabs.css: CSS-only-Tabs (Radio + Label, ohne JavaScript), Hell/Dunkel-Farben und DE/EN-Umschaltung für Produktseiten-Langtexte (product_page-Addon).
   Erzeugt von marketing/produktseite/build.py (Projekt Hallo-Webseite-Backup), nicht von Hand ändern. Geladen von includes/hooks/hw_product_tabs.php, weil der Editor <style> entfernt. Alles unter .hwb gekapselt. */
.hwb{--hwb-b:#173f9c;--hwb-g:#0d7a47;--hwb-card:rgba(15,23,42,.035);--hwb-line:rgba(127,127,127,.38);--hwb-focus:#1f56c8;--hwb-warn:#9a5b00;position:relative;max-width:960px;margin:0 auto;color:inherit;line-height:1.55;text-align:left}
.lagom-dark-mode .hwb{--hwb-b:#8db4ff;--hwb-g:#4ade80;--hwb-card:rgba(255,255,255,.055);--hwb-line:rgba(255,255,255,.2);--hwb-focus:#ffd166;--hwb-warn:#ffc266}
.hwb *{box-sizing:border-box}
.hwb img{max-width:100%;height:auto}
.hwb .hwb-r{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.hwb .hwb-nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px;padding:0}
.hwb .hwb-l{display:block;min-height:44px;padding:10px 18px;border:1px solid var(--hwb-line);border-radius:999px;font-weight:600;font-size:15px;line-height:1.3;cursor:pointer;color:inherit;background:transparent;margin:0;user-select:none}
.hwb .hwb-l:hover{background:var(--hwb-card);border-color:var(--hwb-b)}
.hwb .hwb-p{display:none}
.hwb .hwb-acc{color:var(--hwb-b)}
.hwb .hwb-ok{color:var(--hwb-g)}
.hwb .hwb-warnbox{border-left:5px solid var(--hwb-warn)}
.hwb .hwb-warnbox .hwb-wt{color:var(--hwb-warn)}
.hwb summary{cursor:pointer}
.hwb summary:focus-visible{outline:3px solid var(--hwb-focus);outline-offset:2px;border-radius:6px}
.hwb .hwb-tag-ok,.hwb .hwb-tag-no,.hwb .hwb-tag-test{font-weight:700}
.hwb .hwb-tag-ok{color:var(--hwb-g)}
.hwb .hwb-tag-test{color:var(--hwb-warn)}
.hwb .hwb-r1:checked ~ .hwb-nav .hwb-l1{background:#1f56c8;border-color:#1f56c8;color:#ffffff}
.hwb .hwb-r1:checked ~ .hwb-p1{display:block}
.hwb .hwb-r1:focus-visible ~ .hwb-nav .hwb-l1{outline:3px solid var(--hwb-focus);outline-offset:2px}
.hwb .hwb-r2:checked ~ .hwb-nav .hwb-l2{background:#1f56c8;border-color:#1f56c8;color:#ffffff}
.hwb .hwb-r2:checked ~ .hwb-p2{display:block}
.hwb .hwb-r2:focus-visible ~ .hwb-nav .hwb-l2{outline:3px solid var(--hwb-focus);outline-offset:2px}
.hwb .hwb-r3:checked ~ .hwb-nav .hwb-l3{background:#1f56c8;border-color:#1f56c8;color:#ffffff}
.hwb .hwb-r3:checked ~ .hwb-p3{display:block}
.hwb .hwb-r3:focus-visible ~ .hwb-nav .hwb-l3{outline:3px solid var(--hwb-focus);outline-offset:2px}
.hwb .hwb-r4:checked ~ .hwb-nav .hwb-l4{background:#1f56c8;border-color:#1f56c8;color:#ffffff}
.hwb .hwb-r4:checked ~ .hwb-p4{display:block}
.hwb .hwb-r4:focus-visible ~ .hwb-nav .hwb-l4{outline:3px solid var(--hwb-focus);outline-offset:2px}
.hwb .hwb-r5:checked ~ .hwb-nav .hwb-l5{background:#1f56c8;border-color:#1f56c8;color:#ffffff}
.hwb .hwb-r5:checked ~ .hwb-p5{display:block}
.hwb .hwb-r5:focus-visible ~ .hwb-nav .hwb-l5{outline:3px solid var(--hwb-focus);outline-offset:2px}
.hwb .hwb-r6:checked ~ .hwb-nav .hwb-l6{background:#1f56c8;border-color:#1f56c8;color:#ffffff}
.hwb .hwb-r6:checked ~ .hwb-p6{display:block}
.hwb .hwb-r6:focus-visible ~ .hwb-nav .hwb-l6{outline:3px solid var(--hwb-focus);outline-offset:2px}
@media (max-width:600px){.hwb .hwb-nav{gap:6px}.hwb .hwb-l{flex:1 1 calc(50% - 6px);text-align:center;padding:10px 8px;font-size:14px}}
@media (prefers-reduced-motion:no-preference){.hwb .hwb-l{transition:background .15s,border-color .15s}}
/* Nebenfix für ALLE Produktseiten des product_page-Addons: .tabs-container ist ein Grid; dessen Kinder (Reiter, Inhalt) haben min-width:auto und
   wachsen auf dem Handy über die Spalte hinaus, .pp-wrapper (overflow:hidden) schneidet rechts ab (auch eRechnung betroffen). min-width:0 hält sie in der Spalte. */
.pp-wrapper .tabs-container > *{min-width:0}
/* Zweisprachig: Lagom setzt <html lang> nach der Seitensprache. Englisch zeigt den EN-Block, alles andere den DE-Block. */
.hwb-i18n > .hwb-en{display:none}
html:lang(en) .hwb-i18n > .hwb-en{display:block}
html:lang(en) .hwb-i18n > .hwb-de{display:none}

/* Handy (04.10.): Die Addon-Reiter „Beschreibung / Bewertungen / Screenshots“ ragten rechts aus dem Rahmen.
   Unter 576 px teilen sie sich die Breite zu gleichen Teilen, etwas kleinere Schrift, alles in einer Zeile. */
@media (max-width:575px){
  .pp-wrapper .tabs{flex-wrap:nowrap}
  .pp-wrapper .tabs .tab{padding:8px 4px;font-size:13px;flex:1 1 0;min-width:0;white-space:nowrap;text-align:center}
}