/*
 ------------------------------------------------------------------------------------------
 SHOP (Produktseite, Karten, Warenkorb, Kasse, Danke-Seite) – nach Shopify-Vorbild
 Farben als Variablen: --ppop-blau, --ppop-grau-text, --ppop-hintergrund kommen aus ppop.neu.css (hier mit
 Rückfallwert), die übrigen Shop-Farben stehen unten in :root. Grautext mindestens #707070 (4,7:1 auf #fafafa).
 Lädt nach ppop.neu.css und überschreibt dessen Shop-Regeln gezielt.
 ------------------------------------------------------------------------------------------
 */

:root {
    --shop-text-2: #444;
    --shop-rahmen: #c9c9c9;
    --shop-linie: #e3e3e3;
    --shop-linie-summe: #dedede;
    --shop-flaeche-hover: #f2f2f2;
    --shop-blau-hover: #2a2aff;
    --shop-fehler: #d82c0d;
}

/* ---------- Gemeinsames ---------- */

/* Tastaturfokus überall im Shop sichtbar, einheitlich in Markenblau
   (button/a/input einzeln, weil ppop.neu.css „.woocommerce button:focus { outline: none }“ setzt) */
.woocommerce :focus-visible,
.woocommerce-page :focus-visible,
.ppop-kasse :focus-visible,
.woocommerce button:focus-visible,
.woocommerce a:focus-visible,
.woocommerce input:focus-visible,
.woocommerce select:focus-visible,
.woocommerce textarea:focus-visible,
.woocommerce summary:focus-visible {
    outline: 2px solid var(--ppop-blau, #0000FF);
    outline-offset: 2px;
}

.ppop-link-knopf {
    /* Zielfläche 44 px hoch, ohne den Abstand zu den Nachbarn zu verändern */
    background: none;
    border: 0;
    padding: 1.1rem 0;
    margin: -1.1rem 0;
    color: #000;
    text-decoration: underline;
    font: inherit;
    font-size: 1.5rem;
    cursor: pointer;
}

.ppop-link-knopf:hover {
    color: var(--ppop-blau, #0000FF);
}

.ppop-unsichtbar {
    position: absolute !important;
    left: -9999px !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.ppop-mwst,
.woocommerce-cart .cart-collaterals .cart_totals table small.ppop-mwst,
.woocommerce-checkout table.woocommerce-checkout-review-order-table small.ppop-mwst {
    display: block;
    font-weight: var(--gewicht-text);
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    line-height: 1.3;
}

/* Mengenfeld mit −/+ */
.woocommerce .quantity {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid var(--shop-rahmen);
    border-radius: 5px;
    overflow: hidden;
    height: 4.8rem;
    background: #fff;
}

.woocommerce .quantity input.qty {
    border: 0;
    width: 4.6rem;
    text-align: center;
    font-size: 1.6rem;
    color: #000;
    padding: 0 !important;
    -moz-appearance: textfield;
    background: #fff;
}

.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.woocommerce .quantity input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.ppop-qty-btn {
    width: 3.8rem;
    border: 0;
    background: #fff;
    font-size: 2rem;
    line-height: 1;
    color: #000;
    cursor: pointer;
}

.ppop-qty-btn:hover {
    background: var(--shop-flaeche-hover);
}

/* Das Mengenfeld schneidet nach außen ab (overflow: hidden) – Fokusrahmen deshalb innen */
.woocommerce .quantity .ppop-qty-btn:focus-visible,
.woocommerce .quantity input.qty:focus-visible {
    outline: 2px solid var(--ppop-blau, #0000FF);
    outline-offset: -2px;
    background: var(--shop-flaeche-hover);
}

.woocommerce .quantity:focus-within {
    border-color: var(--ppop-blau, #0000FF);
}

/* ---------- Produktkarte ---------- */

.ppop-karte {
    cursor: default;
}

.ppop-karte-bild {
    display: block;
    position: relative;
    padding-top: 100%;
    background: var(--ppop-hintergrund, #fafafa);
    border-radius: 5px;
    overflow: hidden;
}

.ppop-karte-bild img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 1.2rem;
    transition: opacity 0.2s ease-in-out, transform 0.3s ease-in-out;
}

.ppop-karte:hover .ppop-karte-bild img {
    transform: scale(1.02);
}

.ppop-karte-text {
    padding: 1.2rem 0 0;
    line-height: 1.35;
}

.ppop-karte-titel {
    display: block;
    color: var(--ppop-text);
    font-weight: 600;
    font-size: var(--schrift-text);
    text-decoration: none;
    line-height: 1.25;
    font-feature-settings: "ss01";
}

.ppop-karte-titel:hover {
    color: var(--ppop-blau, #0000FF);
    text-decoration: none;
}

.ppop-karte-unter {
    display: block;
    color: var(--ppop-dunkelgrau);
    font-size: var(--schrift-klein);
}

.ppop-karte-preis {
    display: block;
    color: #000;
    font-size: 1.6rem;
    margin-top: 0.4rem;
}

.ppop-karte-preis .woocommerce-Price-amount {
    color: #000;
}

/* Ähnliche Produkte / Up-Sells: Karten auf weißem Grund im grauen Band */
section.related .ppop-karte-bild,
section.up-sells .ppop-karte-bild {
    background: #fff;
}

/* ---------- Shop-Kopf ---------- */

#shop-kopf {
    padding: 1rem 0 2rem;
    text-align: center;
}

#shop-kopf h1 {
    font-size: var(--schrift-h1);
    margin-bottom: 1rem;
    line-height: 1.08;
    letter-spacing: -0.01em;
}

#shop-kopf .t-desc {
    max-width: 68rem;
    margin: 0 auto;
    color: var(--shop-text-2);
    font-size: var(--schrift-text);
}

#shop-kopf .t-desc p:last-child {
    margin-bottom: 0;
}

.woocommerce-menu {
    flex-wrap: wrap;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}

/* ---------- Produktseite ---------- */

.single-product h1.product_title {
    font-size: var(--schrift-h1);
    line-height: 1.08;
    letter-spacing: -0.01em;
}

.single-product p.price {
    margin: 1rem 0 0.5rem;
}

.single-product p.price span {
    color: #000;
    font-size: 2.8rem;
    font-weight: 500;
}

.single-product .preis-hinweis {
    color: var(--ppop-dunkelgrau) !important;
    font-size: var(--schrift-klein);
    margin-bottom: 1.5rem;
}

.single-product .woocommerce-product-details__short-description:empty {
    display: none;
}

/* Köpfe der Kaufoptionen: normale Schreibweise, ungesperrt, schwarz 600 (PS 16.10.2026, vorher Versalien #444 500 gesperrt) */
.ppop-pills-label {
    font-family: var(--font-jost);
    font-weight: 600;
    font-size: var(--schrift-klein);
    line-height: 1.3;
    color: #000;
    margin: 2.4rem 0 0.8rem;
}

/* Zusätze (Personalisieren, 3 für 2) als eigene Segmente: hellgraue Fläche, Karten darin weiß */
.ppop-segment {
    background: var(--shop-flaeche-hover);
    border-radius: 10px;
    padding: 1.6rem;
}

@media (max-width: 575px) {
    .ppop-segment {
        padding: 1.4rem 1.2rem;
    }
}

.ppop-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

.ppop-pill {
    border: 1px solid var(--shop-rahmen);
    border-radius: 5px;
    background: #fff;
    padding: 1rem 1.4rem;
    font: inherit;
    font-size: 1.6rem;
    line-height: 1.3;
    color: #000;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    cursor: pointer;
    min-width: 15rem;
    min-height: 4.4rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.ppop-pill:hover {
    border-color: #000;
}

.ppop-pill:focus-visible {
    border-color: var(--ppop-blau, #0000FF);
}

/* Nicht lieferbare Ausführung: gestrichelt, grau, nicht wählbar (aria-disabled) */
.ppop-pill.nicht-lieferbar,
.ppop-pill.nicht-lieferbar:hover {
    border-style: dashed;
    border-color: var(--shop-rahmen);
    background: var(--ppop-hintergrund, #fafafa);
    color: var(--ppop-grau-text, #707070);
    cursor: not-allowed;
    box-shadow: none;
}

.ppop-pill.nicht-lieferbar .ppop-pill-name {
    text-decoration: line-through;
}

.ppop-pill-status {
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    margin-top: 0.2rem;
}

.ppop-pill.aktiv {
    border-color: var(--ppop-blau, #0000FF);
    box-shadow: inset 0 0 0 1px var(--ppop-blau, #0000FF);
}

.ppop-pill-preis {
    font-size: var(--schrift-klein);
    color: var(--ppop-dunkelgrau);
    margin-top: 0.2rem;
}

table.variations.ppop-versteckt {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    margin: 0;
}

.woocommerce div.product form.cart .woocommerce-variation-description p {
    color: var(--shop-text-2);
    font-size: var(--schrift-klein);
    line-height: 1.55;
}

.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1.5rem;
}

.woocommerce div.product form.cart .woocommerce-variation-add-to-cart .quantity {
    flex: 0 0 auto;
    margin: 0;
    float: none;
}

.woocommerce div.product form.cart .button.single_add_to_cart_button {
    flex: 1 1 auto;
    height: 4.8rem;
    border-radius: 5px;
    font-size: 1.7rem;
    font-weight: 600;
    padding: 0 2rem;
    margin: 0;
    line-height: 1;
    text-transform: none;
    background: var(--ppop-blau, #0000FF);
    border: 1px solid var(--ppop-blau, #0000FF);
    color: #fff;
    transition: background 0.15s ease-in-out, color 0.15s ease-in-out;
}

.woocommerce div.product form.cart .button.single_add_to_cart_button:hover {
    background: var(--shop-blau-hover) !important;
    color: #fff !important;
}

.woocommerce div.product form.cart .button.single_add_to_cart_button.ppop-direkt {
    flex: 1 1 100%;
    background: #fff !important;
    color: #000 !important;
    border: 1px solid #000 !important;
}

.woocommerce div.product form.cart .button.single_add_to_cart_button.ppop-direkt:hover {
    background: #000 !important;
    color: #fff !important;
}

.woocommerce div.product form.cart .button.single_add_to_cart_button.disabled,
.woocommerce div.product form.cart .button.single_add_to_cart_button.wc-variation-selection-needed {
    background: var(--shop-rahmen) !important;
    border-color: var(--shop-rahmen) !important;
    color: #fff !important;
    cursor: not-allowed;
}

.ppop-vertrauen {
    margin: 2.5rem 0 0;
    font-size: var(--schrift-klein);
    color: var(--shop-text-2);
}

.ppop-vertrauen li {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 0.6rem;
}

.ppop-haken {
    width: 1.6rem;
    height: 1.6rem;
    flex: 0 0 1.6rem;
    color: var(--ppop-blau, #0000FF);
    margin-top: 0.3rem;
}

.ppop-akkordeon {
    margin-top: 2.5rem;
    border-top: 1px solid var(--shop-linie);
}

.ppop-akkordeon-teil {
    border-bottom: 1px solid var(--shop-linie);
}

.ppop-akkordeon-teil summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.4rem 0;
    font-family: var(--font-jost);
    font-weight: 600;
    color: #000;
    font-size: 1.6rem;
}

.ppop-akkordeon-teil summary::-webkit-details-marker {
    display: none;
}

.ppop-akkordeon-teil summary:focus-visible {
    color: var(--ppop-blau, #0000FF);
}

.ppop-akkordeon-pfeil {
    width: 1rem;
    height: 1rem;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    transform: rotate(45deg);
    transition: transform 0.2s ease-in-out;
    margin: -0.4rem 0.4rem 0 1rem;
}

.ppop-akkordeon-teil[open] .ppop-akkordeon-pfeil {
    transform: rotate(-135deg);
    margin-top: 0.4rem;
}

.ppop-akkordeon-inhalt {
    padding: 0 0 1.6rem;
    font-size: var(--schrift-klein);
    line-height: 1.55;
    color: var(--shop-text-2);
}

.ppop-akkordeon-inhalt p:last-child {
    margin-bottom: 0;
}

.ppop-akkordeon-inhalt a {
    text-decoration: underline;
}

/* ---------- Warenkorb ---------- */

.woocommerce-cart .entry-header h1 {
    text-align: left !important;
}

.ppop-wk-zeile {
    display: grid;
    grid-template-columns: 9rem 1fr auto;
    gap: 1.6rem;
    padding: 2rem 0;
    border-bottom: 1px solid var(--shop-linie);
    align-items: start;
}

.ppop-wk-bild img {
    width: 9rem;
    height: 9rem;
    object-fit: contain;
    background: var(--ppop-hintergrund, #fafafa);
    border-radius: 5px;
    padding: 0.4rem;
}

.ppop-wk-name a {
    color: #000;
    font-weight: 600;
    font-size: 1.7rem;
    text-decoration: none;
}

.ppop-wk-name a:hover {
    color: var(--ppop-blau, #0000FF);
}

.ppop-wk-variante,
.ppop-wk-einzelpreis {
    display: block;
    color: var(--ppop-grau-text, #707070);
    font-size: 1.4rem;
}

.ppop-wk-einzelpreis .woocommerce-Price-amount {
    color: var(--ppop-grau-text, #707070);
}

.ppop-wk-steuerung {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-top: 1.2rem;
}

.ppop-wk-steuerung .quantity {
    height: 4rem;
}

.ppop-wk-steuerung .quantity input.qty {
    width: 4rem;
}

.ppop-wk-steuerung .ppop-qty-btn {
    width: 3.4rem;
    font-size: 1.8rem;
}

.woocommerce a.remove.ppop-wk-entfernen {
    display: inline;
    width: auto;
    height: auto;
    font-size: 1.4rem;
    line-height: 1.4;
    padding: 0.6rem 0;
    font-weight: var(--gewicht-text);
    color: var(--ppop-grau-text, #707070) !important;
    text-decoration: underline;
    border-radius: 0;
    text-align: left;
}

.woocommerce a.remove.ppop-wk-entfernen:hover {
    background: none;
    color: var(--ppop-blau, #0000FF) !important;
}

.ppop-wk-summe {
    font-weight: 600;
    color: #000;
    text-align: right;
    font-size: 1.7rem;
    white-space: nowrap;
}

.ppop-wk-summe .woocommerce-Price-amount {
    color: #000;
}

.ppop-wk-aktionen {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 2rem 0;
    position: relative;
}

.ppop-wk-weiter {
    font-size: 1.5rem;
    color: #000;
    text-decoration: underline;
}

.ppop-gutschein-bereich {
    text-align: right;
}

.ppop-gutschein {
    display: none;
    margin-top: 1rem;
}

.ppop-gutschein .input-text {
    border: 1px solid var(--shop-rahmen);
    border-radius: 5px;
    height: 4.4rem;
    padding: 0 1.2rem;
    font-size: 1.5rem;
    width: 18rem;
    vertical-align: middle;
}

.woocommerce .ppop-gutschein .button {
    height: 4.4rem;
    border-radius: 5px;
    font-size: 1.5rem;
    font-weight: 600 !important;
    padding: 0 1.6rem;
    margin-left: 0.5rem;
    vertical-align: middle;
}

/* Gleiches Grau und gleiche Ecken wie die 3-für-2-Flächen daneben (PS 16.10.2026, vorher #fafafa, 5 px) */
.woocommerce .ppop-wk-kasten {
    background: var(--shop-flaeche-hover);
    border-radius: 10px;
    padding: 2.5rem;
    margin-top: 0;
    position: sticky;
    top: 12rem;
}

.woocommerce .ppop-wk-kasten .cart_totals,
.woocommerce-page .ppop-wk-kasten .cart_totals {
    width: 100%;
    float: none;
}

.ppop-wk-kasten h2 {
    font-size: 1.8rem;
    text-transform: none !important;
    margin: 0 0 1.5rem !important;
}

.woocommerce .ppop-wk-kasten table.shop_table {
    margin: 0;
}

.woocommerce .ppop-wk-kasten table.shop_table th,
.woocommerce .ppop-wk-kasten table.shop_table td {
    padding: 0.6rem 0 !important;
    border: 0 !important;
    font-size: 1.5rem;
    color: var(--shop-text-2);
    text-transform: none;
    font-weight: var(--gewicht-text);
    vertical-align: top;
}

.woocommerce .ppop-wk-kasten table.shop_table td {
    text-align: right;
    color: #000;
}

/* Kein Zebra-Streifen der Handy-Tabelle (WooCommerce tr:nth-child(2n) td) auf der grauen Fläche */
.woocommerce .ppop-wk-kasten table.shop_table tr td,
.woocommerce .ppop-wk-kasten table.shop_table tr th {
    background: transparent !important;
}

.woocommerce .ppop-wk-kasten table.shop_table tr.order-total th,
.woocommerce .ppop-wk-kasten table.shop_table tr.order-total td {
    font-size: 1.8rem;
    color: #000;
    font-weight: 600;
    border-top: 1px solid var(--shop-linie-summe) !important;
    padding-top: 1.5rem !important;
}

.woocommerce .ppop-wk-kasten table.shop_table tr.order-total .woocommerce-Price-amount {
    color: #000;
}

.woocommerce .ppop-wk-kasten .woocommerce-shipping-destination,
.woocommerce .ppop-wk-kasten .woocommerce-shipping-calculator {
    display: none;
}

.woocommerce .ppop-wk-kasten ul#shipping_method {
    margin: 0;
    padding: 0;
    list-style: none;
}

.woocommerce .ppop-wk-kasten ul#shipping_method li {
    margin: 0;
    padding: 0;
}

.woocommerce .ppop-wk-kasten ul#shipping_method label {
    margin: 0;
    color: #000;
}

.woocommerce .ppop-wk-kasten .wc-proceed-to-checkout {
    padding: 2rem 0 0;
}

.woocommerce .ppop-wk-kasten .wc-proceed-to-checkout a.checkout-button {
    display: block;
    width: 100%;
    text-align: center;
    border-radius: 5px;
    height: 5.2rem;
    line-height: 4.8rem;
    padding: 0 2rem;
    font-size: 1.7rem;
    font-weight: 600;
    text-transform: none;
    margin: 0;
}

.ppop-wk-sicher {
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    text-align: center;
    margin: 1.2rem 0 0;
    line-height: 1.4;
}

.woocommerce .ppop-wk-kasten .cross-sells {
    display: none;
}

/* Leerer Warenkorb */
.woocommerce-cart .cart-empty.woocommerce-info {
    border: 0;
    background: var(--ppop-hintergrund, #fafafa);
    font-size: 1.8rem;
    color: #000;
    padding: 2.5rem;
}

.woocommerce-cart .cart-empty.woocommerce-info::before {
    display: none;
}

.woocommerce-cart .return-to-shop a.button {
    border-radius: 5px;
    background: var(--ppop-blau, #0000FF);
    color: #fff;
    font-weight: 600;
    padding: 1.2rem 2.4rem;
}

/* ---------- Kasse ---------- */

.ppop-kasse #content.site-content {
    margin-top: 0;
}

.ppop-kasse header#masthead.ppop-kasse-kopf {
    position: static;
    box-shadow: none;
    border-bottom: 1px solid var(--shop-linie);
    background: #fff;
}

.ppop-kasse-kopf-zeile {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem 1.5rem;
}

.ppop-kasse-kopf-zeile .site-title {
    font-family: var(--font-jost);
    font-size: 2rem;
    color: #000 !important;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
}

.ppop-kasse-zurueck {
    font-size: 1.4rem;
    color: var(--shop-text-2);
    text-decoration: underline;
}

.ppop-kasse-zurueck:hover {
    color: var(--ppop-blau, #0000FF);
}

.ppop-kasse .entry-header,
.ppop-kasse .sharing-button-container {
    display: none;
}

.ppop-kasse #primary {
    margin-bottom: 0 !important;
}

.ppop-kasse .woocommerce-notices-wrapper {
    padding: 2rem 1.5rem 0;
}

.ppop-kasse .woocommerce-NoticeGroup {
    padding: 2rem 1.5rem 0;
}

.ppop-kasse .woocommerce-error,
.ppop-kasse .woocommerce-info,
.ppop-kasse .woocommerce-message {
    font-size: 1.5rem;
    border-radius: 5px;
    border-top-width: 2px;
}

.ppop-kasse .woocommerce-error {
    border-top-color: var(--shop-fehler);
}

/* Haken bei „Warenkorb aktualisiert“ u. ä. blau statt WooCommerce-Grün (PS 16.10.2026) */
.woocommerce-message::before {
    color: var(--ppop-blau, #0000FF);
}

.ppop-kasse-raster > .ppop-kasse-formular {
    padding: 3rem 1.5rem 4rem;
}

.ppop-kasse-raster > .ppop-kasse-summe {
    background: var(--ppop-hintergrund, #fafafa);
    border-bottom: 1px solid var(--shop-linie);
    padding: 0 1.5rem;
}

/* Nur ein Lieferland: das Länderfeld bleibt als verstecktes Feld im Formular, der Text darüber sagt es */
/* !important, weil WooCommerce das Feld per JS (address-i18n: field.show()) wieder einblendet; ein Hüll-Element
   geht nicht, weil die Feldsortierung alle Felder in den Elternknoten des ersten Feldes verschiebt */
.ppop-kasse #billing_country_field,
.ppop-kasse #shipping_country_field {
    display: none !important;
}

.ppop-summe-inhalt {
    display: none;
    padding: 0.5rem 0 2rem;
}

.ppop-kasse-summe.offen .ppop-summe-inhalt {
    display: block;
}

.ppop-summe-toggle {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: 0;
    padding: 1.5rem 0;
    font: inherit;
    font-size: 1.5rem;
    color: var(--ppop-blau, #0000FF);
    cursor: pointer;
}

.ppop-summe-toggle-text::after {
    content: "";
    display: inline-block;
    width: 0.7rem;
    height: 0.7rem;
    border-right: 2px solid var(--ppop-blau, #0000FF);
    border-bottom: 2px solid var(--ppop-blau, #0000FF);
    transform: rotate(45deg);
    margin: 0 0 0.3rem 0.8rem;
    transition: transform 0.2s ease-in-out;
}

.ppop-kasse-summe.offen .ppop-summe-toggle-text::after {
    transform: rotate(-135deg);
    margin-bottom: -0.2rem;
}

.ppop-summe-toggle strong {
    color: #000;
    font-size: 1.8rem;
}

.ppop-summe-hinweis {
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    margin: 1.5rem 0 0;
    line-height: 1.4;
}

.ppop-abschnitt {
    margin-bottom: 3.5rem;
}

.ppop-kasse .ppop-abschnitt h2,
.ppop-kasse .ppop-abschnitt-titel {
    font-size: 2.1rem;
    text-transform: none !important;
    margin: 0 0 1.5rem !important;
}

.ppop-kasse .ppop-abschnitt-untertitel {
    font-size: 1.7rem !important;
    margin-bottom: 1.2rem !important;
}

.ppop-abschnitt-text {
    font-size: 1.5rem;
    color: var(--ppop-grau-text, #707070);
    margin: -1rem 0 1.5rem;
}

/* Felder */
.ppop-kasse .woocommerce form .form-row {
    margin-bottom: 1.4rem;
    padding: 0;
}

.ppop-kasse .woocommerce form .form-row label {
    text-transform: none;
    font-size: 1.4rem;
    color: var(--shop-text-2);
    margin-bottom: 0.5rem;
    line-height: 1.3;
}

.ppop-kasse .woocommerce form .form-row .required {
    color: var(--ppop-blau, #0000FF);
    text-decoration: none;
}

.ppop-kasse .woocommerce form .form-row .optional {
    color: var(--ppop-grau-text, #707070);
    font-size: 1.3rem;
}

.ppop-kasse .woocommerce-input-wrapper input.input-text,
.ppop-kasse .woocommerce-input-wrapper textarea,
.ppop-kasse .woocommerce-input-wrapper select,
.ppop-kasse .woocommerce-input-wrapper .select2-container .select2-selection--single {
    width: 100%;
    border: 1px solid var(--shop-rahmen);
    border-radius: 5px !important;
    background: #fff;
    font-size: 1.6rem;
    padding: 0 1.2rem !important;
    height: 4.8rem;
    line-height: 4.6rem;
    color: #000;
    box-shadow: none;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.ppop-kasse .woocommerce-input-wrapper textarea {
    height: auto;
    min-height: 10rem;
    line-height: 1.5;
    padding: 1.2rem !important;
    font-size: 1.6rem;
}

.ppop-kasse .woocommerce-input-wrapper input.input-text:focus,
.ppop-kasse .woocommerce-input-wrapper textarea:focus,
.ppop-kasse .woocommerce-input-wrapper select:focus {
    border-color: var(--ppop-blau, #0000FF);
    outline: 2px solid var(--ppop-blau, #0000FF);
    outline-offset: 2px;
}

.ppop-kasse .form-row.woocommerce-invalid input.input-text,
.ppop-kasse .form-row.woocommerce-invalid select {
    border-color: var(--shop-fehler) !important;
}

.ppop-kasse .form-row.woocommerce-invalid label {
    color: var(--shop-fehler);
}

/* Fehlermeldung als Text unter dem Feld (shop.js bzw. WooCommerce nach dem Absenden), per aria-describedby verknüpft */
.woocommerce form .form-row .checkout-inline-error-message,
.woocommerce-checkout .checkout-inline-error-message {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    color: var(--shop-fehler);
    font-size: 1.4rem;
    line-height: 1.4;
    margin: 0.5rem 0 0;
}

.woocommerce-checkout .checkout-inline-error-message::before {
    content: "!";
    flex: 0 0 1.6rem;
    height: 1.6rem;
    margin-top: 0.1rem;
    border-radius: 50%;
    background: var(--shop-fehler);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 600;
    line-height: 1.6rem;
    text-align: center;
}

/* Fehlerliste nach dem Absenden bekommt den Fokus (WooCommerce) – sichtbar machen */
.woocommerce-checkout .woocommerce-NoticeGroup .woocommerce-error:focus {
    outline: 2px solid var(--shop-fehler);
    outline-offset: 2px;
}

.woocommerce-checkout .woocommerce-NoticeGroup .woocommerce-error a {
    color: inherit;
    text-decoration: underline;
}

.ppop-kasse .woocommerce-input-wrapper .description,
.ppop-kasse .woocommerce-input-wrapper .description p {
    display: block;
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    margin: 0.5rem 0 0;
    line-height: 1.4;
}

.ppop-kasse .woocommerce form .form-row-first,
.ppop-kasse .woocommerce-page form .form-row-first {
    width: 48%;
    float: left;
}

.ppop-kasse .woocommerce form .form-row-last,
.ppop-kasse .woocommerce-page form .form-row-last {
    width: 48%;
    float: right;
}

.ppop-kasse .woocommerce form .form-row-wide {
    clear: both;
}

/* Land: nur Deutschland, als ruhiges Feld */
.ppop-kasse .form-row .woocommerce-input-wrapper > strong {
    display: block;
    border: 1px solid var(--shop-linie);
    border-radius: 5px;
    height: 4.8rem;
    line-height: 4.6rem;
    padding: 0 1.2rem;
    background: var(--ppop-hintergrund, #fafafa);
    color: var(--shop-text-2);
    font-weight: var(--gewicht-text);
    font-size: 1.6rem;
}

/* Kästchen */
/* Unter den gefloateten Feldern PLZ/Stadt beginnen, sonst rutscht das Label (negativer Rand) zwischen sie */
.ppop-kasse .woocommerce-shipping-fields,
.ppop-kasse .woocommerce-additional-fields {
    clear: both;
}
.ppop-kasse .woocommerce-form__label-for-checkbox {
    display: flex !important;
    align-items: flex-start;
    padding: 1.1rem 0; /* Zielfläche ≥ 44 px, Abstand bleibt durch den negativen Rand gleich */
    gap: 1rem;
    text-transform: none !important;
    font-size: 1.5rem !important;
    color: #000;
    cursor: pointer;
    margin: -1.1rem 0;
    line-height: 1.4 !important;
}

.ppop-kasse .woocommerce-form__label-for-checkbox input[type="checkbox"] {
    width: 1.8rem;
    height: 1.8rem;
    margin: 0.2rem 0 0;
    flex: 0 0 auto;
    accent-color: var(--ppop-blau, #0000FF);
}

.ppop-kasse h3#ship-to-different-address {
    margin: 0 0 1.5rem;
    text-transform: none;
    font-weight: var(--gewicht-text);
    font-size: 1.5rem;
}

.ppop-kasse .shipping_address {
    padding: 2rem 2rem 0.6rem;
    border: 1px solid var(--shop-linie);
    border-radius: 5px;
    margin-bottom: 1.5rem;
}

.ppop-hinweis {
    margin-top: 1.5rem;
}

/* Versand */
.ppop-versand-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    border: 1px solid var(--ppop-blau, #0000FF);
    border-radius: 5px;
    padding: 1.5rem;
    background: #fff;
    font-size: 1.6rem;
    color: #000;
}

.ppop-versand-text {
    font-size: 1.4rem;
    color: var(--ppop-grau-text, #707070);
    margin: 1rem 0 0;
    line-height: 1.5;
}

/* Zahlung */
.ppop-kasse .woocommerce-checkout #payment {
    background: transparent;
    border-radius: 0;
}

.ppop-kasse .woocommerce-checkout #payment ul.payment_methods {
    border: 1px solid var(--shop-rahmen);
    border-radius: 5px;
    padding: 0;
    margin: 0 0 2rem;
    list-style: none;
    border-bottom: 1px solid var(--shop-rahmen);
}

.ppop-kasse .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
    position: relative;
    border-bottom: 1px solid var(--shop-rahmen);
    margin: 0;
    padding: 0;
    line-height: 1.4;
}

.ppop-kasse .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:last-child {
    border-bottom: 0;
}

.ppop-kasse .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > input.input-radio {
    position: absolute;
    top: 1.9rem;
    left: 1.5rem;
    margin: 0;
    width: 1.6rem;
    height: 1.6rem;
    accent-color: var(--ppop-blau, #0000FF);
}

.ppop-kasse .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem 1.5rem 1.5rem 4.4rem;
    min-height: 5.2rem;
    margin: 0;
    font-size: 1.6rem;
    color: #000;
    cursor: pointer;
    width: 100%;
    text-transform: none;
}

.ppop-kasse .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label img {
    max-height: 2.4rem;
    width: auto;
}

.ppop-kasse .woocommerce-checkout #payment div.payment_box {
    background: var(--ppop-hintergrund, #fafafa);
    margin: 0;
    padding: 1.5rem;
    border-top: 1px solid var(--shop-linie);
    border-radius: 0;
    font-size: 1.4rem;
    color: var(--shop-text-2);
}

.ppop-kasse .woocommerce-checkout #payment div.payment_box::before {
    display: none;
}

.ppop-kasse .woocommerce-checkout #payment div.payment_box p:last-child {
    margin-bottom: 0;
}

.ppop-kasse .woocommerce-checkout #payment .place-order {
    padding: 0;
}

.ppop-kasse .woocommerce-terms-and-conditions-wrapper {
    margin: 0 0 2rem;
}

.ppop-kasse .woocommerce-privacy-policy-text p {
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    line-height: 1.5;
    margin-bottom: 1.5rem;
}

.ppop-kasse .woocommerce-privacy-policy-text a {
    text-decoration: underline;
}

.ppop-kasse .woocommerce-terms-and-conditions-checkbox-text {
    font-size: 1.4rem;
    color: #000;
}

.ppop-kasse .woocommerce-terms-and-conditions-checkbox-text a {
    text-decoration: underline;
}

.ppop-kasse .woocommerce-terms-and-conditions {
    background: var(--ppop-hintergrund, #fafafa);
    border: 1px solid var(--shop-linie);
    border-radius: 5px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    max-height: 24rem;
    overflow: auto;
    font-size: 1.3rem;
}

.ppop-kasse .woocommerce-checkout #payment #place_order {
    width: 100%;
    height: 5.6rem;
    border-radius: 5px;
    font-size: 1.8rem;
    font-weight: 600;
    text-transform: none;
    margin: 0;
    padding: 0 2rem;
    line-height: 1;
    float: none;
    background: var(--ppop-blau, #0000FF);
    border-color: var(--ppop-blau, #0000FF);
}

.ppop-kasse .woocommerce-checkout #payment #place_order:hover {
    background: var(--shop-blau-hover) !important;
    color: #fff !important;
}

.ppop-zahlung-sicher {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    margin: 1.2rem 0 0;
}

/* Express-Zahlung (WooPayments: Apple Pay / Google Pay) */
#wcpay-express-checkout-element {
    margin-bottom: 0.5rem;
}

#wcpay-express-checkout-button-separator {
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
    margin-bottom: 3rem !important;
}

/* Bestellübersicht */
.ppop-kasse table.woocommerce-checkout-review-order-table {
    width: 100%;
    border: 0;
    margin: 0;
}

.ppop-kasse table.woocommerce-checkout-review-order-table td,
.ppop-kasse table.woocommerce-checkout-review-order-table th {
    padding: 0.6rem 0 !important;
    border: 0 !important;
    font-size: 1.5rem;
    color: var(--shop-text-2);
    text-transform: none;
    font-weight: var(--gewicht-text);
    vertical-align: top;
    line-height: 1.4;
}

.ppop-kasse table.woocommerce-checkout-review-order-table tfoot td {
    text-align: right;
    color: #000;
}

.ppop-kasse table.woocommerce-checkout-review-order-table tbody td {
    padding: 1rem 0 !important;
}

.ppop-kasse table.woocommerce-checkout-review-order-table tbody tr:last-child td {
    padding-bottom: 1.8rem !important;
    border-bottom: 1px solid var(--shop-linie-summe) !important;
}

.ppop-kasse table.woocommerce-checkout-review-order-table tfoot tr:first-of-type th,
.ppop-kasse table.woocommerce-checkout-review-order-table tfoot tr:first-of-type td {
    padding-top: 1.8rem !important;
    border-top: 0 !important;
}

.ppop-kasse table.woocommerce-checkout-review-order-table tfoot {
    border-top: 0;
}

.ppop-kasse table.woocommerce-checkout-review-order-table tr.order-total th,
.ppop-kasse table.woocommerce-checkout-review-order-table tr.order-total td {
    font-size: 1.8rem;
    color: #000;
    font-weight: 600;
    border-top: 1px solid var(--shop-linie-summe) !important;
    padding-top: 1.5rem !important;
}

.ppop-kasse table.woocommerce-checkout-review-order-table .woocommerce-Price-amount {
    color: inherit;
}

.ppop-kasse table.woocommerce-checkout-review-order-table ul#shipping_method {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ppop-kasse table.woocommerce-checkout-review-order-table ul#shipping_method li {
    margin: 0;
    padding: 0;
}

.ppop-kasse table.woocommerce-checkout-review-order-table ul#shipping_method label {
    margin: 0;
    color: #000;
    text-transform: none;
    font-size: 1.5rem;
    width: auto;
}

.ppop-pos {
    display: grid;
    grid-template-columns: 6.4rem 1fr auto;
    gap: 1.4rem;
    align-items: center;
}

.ppop-pos-bild {
    position: relative;
}

.ppop-pos-bild img {
    width: 6.4rem;
    height: 6.4rem;
    object-fit: contain;
    background: #fff;
    border: 1px solid var(--shop-linie);
    border-radius: 5px;
    padding: 0.3rem;
}

.ppop-pos-menge {
    position: absolute;
    top: -0.8rem;
    right: -0.8rem;
    background: var(--ppop-grau-text, #707070);
    color: #fff;
    border-radius: 1.1rem;
    min-width: 2.2rem;
    height: 2.2rem;
    font-size: 1.2rem;
    line-height: 2.2rem;
    text-align: center;
    padding: 0 0.6rem;
    font-weight: 600;
}

.ppop-pos-text {
    display: flex;
    flex-direction: column;
}

.ppop-pos-name {
    font-size: 1.5rem;
    color: #000;
    font-weight: 600;
}

.ppop-pos-variante {
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
}

.ppop-pos-text .variation {
    margin: 0.3rem 0 0;
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
}

.ppop-pos-preis {
    font-size: 1.5rem;
    color: #000;
    white-space: nowrap;
}

/* Kassen-Fuß */
.ppop-kasse-fuss {
    border-top: 1px solid var(--shop-linie);
    padding: 2rem 0 3rem;
    background: #fff;
    margin-top: auto;
}

.ppop-kasse-fuss .footer-menu {
    margin: 0;
    padding: 0;
}

.ppop-kasse-fuss .footer-menu li {
    text-transform: none;
    padding: 0.3rem 1.2rem;
}

.ppop-kasse-fuss .footer-menu li a {
    font-size: 1.3rem;
    color: var(--ppop-grau-text, #707070);
}

.ppop-kasse-fuss .footer-menu li a:hover {
    color: var(--ppop-blau, #0000FF);
}

/* ---------- Danke-Seite ---------- */

.ppop-danke {
    padding: 3rem 0 5rem;
}

.ppop-danke-kopf {
    display: flex;
    gap: 1.6rem;
    align-items: center;
    margin-bottom: 3rem;
}

.ppop-danke-haken {
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 50%;
    border: 2px solid var(--ppop-blau, #0000FF);
    color: var(--ppop-blau, #0000FF);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 5.2rem;
}

.ppop-danke-kopf h1 {
    font-size: 2.8rem;
    margin: 0.2rem 0 0;
}

.ppop-danke-nr {
    color: var(--ppop-grau-text, #707070);
    font-size: 1.4rem;
    margin: 0;
}

.ppop-danke-box {
    border: 1px solid var(--shop-linie);
    border-radius: 5px;
    padding: 2rem;
    margin-bottom: 2rem;
    font-size: 1.5rem;
    color: var(--shop-text-2);
    line-height: 1.5;
}

.ppop-danke-box h2 {
    font-size: 1.7rem;
    text-transform: none !important;
    margin: 0 0 1rem !important;
}

.ppop-danke-box address {
    margin: 0;
    color: #000;
}

.ppop-danke-box p {
    margin-bottom: 1rem;
}

.ppop-danke-label {
    text-transform: uppercase;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--ppop-grau-text, #707070);
    margin: 0 0 0.3rem !important;
}

.ppop-danke-schritte {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0 0;
    counter-reset: schritt;
}

.ppop-danke-schritte li {
    display: flex;
    gap: 1.2rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.ppop-danke-schritte li::before {
    counter-increment: schritt;
    content: counter(schritt);
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    background: var(--ppop-blau, #0000FF);
    color: #fff;
    font-size: 1.3rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 2.6rem;
}

.ppop-danke-hilfe {
    font-size: 1.4rem;
    color: var(--ppop-grau-text, #707070);
}

.ppop-danke-hilfe a {
    text-decoration: underline;
}

.woocommerce a.button.alt.ppop-danke-weiter {
    display: inline-block;
    border-radius: 5px;
    padding: 1.4rem 3rem;
    font-size: 1.6rem;
    text-transform: none;
}

.ppop-danke-bestellung {
    background: var(--ppop-hintergrund, #fafafa);
    border-radius: 5px;
    padding: 2rem;
}

.ppop-danke-bestellung .woocommerce-order-details {
    margin-top: 0 !important;
}

.ppop-danke-bestellung h2 {
    font-size: 1.7rem;
    text-transform: none !important;
    margin: 0 0 1rem !important;
}

.woocommerce .ppop-danke-bestellung table.shop_table th,
.woocommerce .ppop-danke-bestellung table.shop_table td {
    padding: 0.8rem 0 !important;
    font-size: 1.5rem;
    text-transform: none;
    color: var(--shop-text-2);
    font-weight: var(--gewicht-text);
    border: 0 !important;
}

.woocommerce .ppop-danke-bestellung table.shop_table thead th {
    color: var(--ppop-grau-text, #707070);
    font-size: 1.3rem;
    text-transform: uppercase;
    border-bottom: 1px solid var(--shop-linie-summe) !important;
}

.woocommerce .ppop-danke-bestellung table.shop_table tbody td {
    color: #000;
}

.woocommerce .ppop-danke-bestellung table.shop_table td.product-total,
.woocommerce .ppop-danke-bestellung table.shop_table tfoot td {
    text-align: right;
}

.woocommerce .ppop-danke-bestellung table.shop_table tfoot tr:first-child th,
.woocommerce .ppop-danke-bestellung table.shop_table tfoot tr:first-child td {
    border-top: 1px solid var(--shop-linie-summe) !important;
    padding-top: 1.5rem !important;
}

.woocommerce .ppop-danke-bestellung table.shop_table tfoot tr:last-child th,
.woocommerce .ppop-danke-bestellung table.shop_table tfoot tr:last-child td {
    color: #000;
    font-weight: 600;
    font-size: 1.7rem;
}

/* ---------- Bildschirmbreiten ---------- */

@media (min-width: 992px) {
    .ppop-kasse-raster > .ppop-kasse-formular {
        padding: 4rem 5rem 6rem 1.5rem;
    }

    .ppop-kasse-raster > .ppop-kasse-summe {
        border-bottom: 0;
        border-left: 1px solid var(--shop-linie);
        padding: 4rem 1.5rem 4rem 4rem;
        min-height: calc(100vh - 7.6rem);
    }

    .ppop-summe-inhalt {
        display: block;
        position: sticky;
        top: 3rem;
        padding: 0;
    }

    .ppop-kasse-raster {
        min-height: calc(100vh - 7.6rem);
    }

    .ppop-wk-rechts {
        padding-left: 4rem;
    }
}

@media (max-width: 991.98px) {
    .ppop-wk-kasten {
        position: static;
        margin-top: 3rem;
    }

    .ppop-pill {
        min-width: 0;
        flex: 1 1 calc(50% - 0.5rem);
    }

    .ppop-kasse-kopf-zeile {
        padding: 1.6rem 0;
    }
}

@media (max-width: 575.98px) {
    .ppop-wk-zeile {
        grid-template-columns: 7rem 1fr;
    }

    .ppop-wk-bild img {
        width: 7rem;
        height: 7rem;
    }

    .ppop-wk-summe {
        grid-column: 2;
        text-align: left;
        margin-top: -0.5rem;
    }

    .ppop-wk-aktionen,
    .ppop-gutschein-bereich {
        text-align: left;
    }

    .ppop-gutschein .input-text {
        width: 100%;
        margin-bottom: 0.8rem;
    }

    .woocommerce .ppop-gutschein .button {
        margin-left: 0;
    }

    .woocommerce div.product form.cart .button.single_add_to_cart_button {
        flex: 1 1 100%;
    }

    .ppop-danke-kopf h1 {
        font-size: 2.3rem;
    }
}

/* ---------- Teilen (Cartoon-Seite) und Lizenzen (T-018) ---------- */

/* Knopfleiste im Kaufkasten: „Cartoon kaufen“ als Hauptknopf, daneben runde Symbolknöpfe Teilen und Lizenzieren
   (Kreis in Höhe des Hauptknopfs). Bezeichnung als Tooltip bei Maus/Tastatur, für Screenreader per aria-label.
   Ersetzt den kleinen Link unter dem Bild. */
.ppop-aktionen {
    display: flex;
    align-items: center;
    flex-wrap: wrap; /* nur Notfall bei sehr schmalen Geräten */
    gap: 1.2rem 1rem;
}

.ppop-rund {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 4.4rem;
    height: 4.4rem;
    border: 2px solid var(--ppop-blau-90, rgba(0, 0, 255, 0.9));
    border-radius: 50%;
    background: #fff;
    color: var(--ppop-blau-90, rgba(0, 0, 255, 0.9));
    text-decoration: none !important;
    transition: background .2s ease-in-out, color .2s ease-in-out;
}

.ppop-rund:hover,
.ppop-rund:focus-visible,
.ppop-rund.ist-erledigt {
    background: var(--ppop-blau-90, rgba(0, 0, 255, 0.9));
    color: #fff;
}

/* Tooltip unter dem Knopf; nach dem Kopieren bleibt er als Rückmeldung „Link kopiert“ kurz stehen */
.ppop-rund-text {
    position: absolute;
    top: calc(100% + 0.6rem);
    left: 50%;
    transform: translateX(-50%);
    padding: 0.3rem 0.8rem;
    border-radius: 4px;
    background: #222;
    color: #fff;
    font-family: var(--font-jost);
    font-weight: 600;
    font-size: 1.25rem;
    line-height: 1.3;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transition: opacity .15s ease-in-out;
    z-index: 5;
}

@media (hover: hover) {
    .ppop-rund:hover .ppop-rund-text {
        opacity: 1;
    }
}

.ppop-rund:focus-visible .ppop-rund-text,
.ppop-rund.ist-erledigt .ppop-rund-text {
    opacity: 1;
}

#kaufkasten .ppop-aktionen .kaufkasten-knopf {
    flex: 0 0 auto;
    box-sizing: border-box;
    height: 4.4rem;
    display: inline-flex;
    align-items: center;
    padding: 0 1.1em;
    margin-right: 0.2rem;
}

/* Schmale Handys: Kaufknopf etwas kleiner, damit alle drei Knöpfe in eine Zeile passen */
@media (max-width: 400px) {
    #kaufkasten .ppop-aktionen .kaufkasten-knopf {
        padding: 0 0.9em;
        font-size: 1.5rem;
    }
}

.ppop-lizenz {
    max-width: 76rem;
    margin: 0 auto;
    color: var(--shop-text-2);
    font-size: 1.7rem;
    line-height: 1.5;
}

.ppop-lizenz-intro {
    font-size: 1.9rem;
    color: #000;
}

.ppop-lizenz h2 {
    font-size: 2.1rem;
    text-transform: none !important;
    margin: 3.5rem 0 1rem !important;
}

.ppop-lizenz-knopfzeile {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin: 2rem 0 1rem;
}

.ppop-lizenz-anfrage {
    display: inline-block;
    background: var(--ppop-blau, #0000FF);
    color: #fff !important;
    border-radius: 5px;
    padding: 1.3rem 2.6rem;
    font-weight: 600;
    font-size: 1.7rem;
    text-decoration: none !important;
}

.ppop-lizenz-anfrage:hover {
    background: var(--shop-blau-hover);
}

.ppop-lizenz-motiv {
    font-size: 1.5rem;
    color: #000;
}

.ppop-lizenz-tabelle {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0 1.5rem;
    font-size: 1.6rem;
}

.ppop-lizenz-tabelle th,
.ppop-lizenz-tabelle td {
    text-align: left;
    padding: 1rem 1rem 1rem 0;
    border-bottom: 1px solid var(--shop-linie);
    vertical-align: top;
}

.ppop-lizenz-tabelle th {
    color: var(--ppop-grau-text, #707070);
    font-size: 1.3rem;
    text-transform: uppercase;
    font-weight: 600;
}

.ppop-lizenz-tabelle td:first-child {
    color: #000;
    font-weight: 600;
}

.ppop-lizenz-tabelle td:last-child {
    white-space: nowrap;
    color: #000;
}

.ppop-lizenz ul {
    padding-left: 2rem;
}

.ppop-lizenz ul li {
    margin-bottom: 0.8rem;
}

.ppop-lizenz a {
    text-decoration: underline;
}

.ppop-lizenz-fuss {
    margin-top: 3rem;
    font-size: 1.5rem;
    color: var(--ppop-grau-text, #707070);
}

@media (max-width: 575.98px) {
    .ppop-lizenz-tabelle thead {
        display: none;
    }

    .ppop-lizenz-tabelle tr {
        display: block;
        border-bottom: 1px solid var(--shop-linie);
        padding: 1rem 0;
    }

    .ppop-lizenz-tabelle td {
        display: block;
        border: 0;
        padding: 0.2rem 0;
    }
}

/* SK.1 – Produktgalerie sofort sichtbar. WooCommerce gibt die Galerie mit style="opacity:0" aus (daher
   !important) und blendet sie erst nach dem FlexSlider-Start ein; bis dahin war das Produktbild unsichtbar und
   Lighthouse wertete den Cookie-Hinweis als größtes Element (LCP). Die Bilder 2 ff. zeigt WooCommerce vor dem
   Slider-Start schon als 25-%-Reihe (Core-Regel …__image:nth-child(n+2)), also in der Höhe der späteren
   Vorschaubildleiste – deshalb hier nicht ausblenden, sonst springt der Inhalt darunter beim Slider-Start. */
.woocommerce-product-gallery {
    opacity: 1 !important;
}
/* SK.1 – Vorschaubildleiste ohne Sprung: FlexSlider erzeugt die Leiste per JS mit <img> ohne width/height,
   die Leiste hat deshalb bis zum Laden der Bilder keine Höhe; zugleich verschwindet die 25-%-Reihe von oben.
   Mit festem Seitenverhältnis (alle Produktbilder sind quadratisch) ist die Höhe sofort da (CLS 0,63 → 0). */
.woocommerce-product-gallery .flex-control-thumbs li img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}
/* SK.1 – Die 25-%-Reihe vor dem Slider-Start bekommt dieselben Abstände wie die spätere Leiste (ol li: 0.75rem). */
.woocommerce-product-gallery:not(:has(.flex-viewport)) > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:nth-child(n+2) {
    box-sizing: border-box;
    padding: 0.75rem;
    margin-top: 0.75rem;
}
/* SK.1 – Eigentliche Ursache des Sprungs (Frame-Mitschnitt 07.10.2026): FlexSlider setzt den Wrapper sofort auf
   600 % Breite, die Slides bekommen ihre feste Breite aber erst 100 ms später. In diesem Frame ist das erste Bild
   so breit wie der Wrapper (2292 px) und ebenso hoch, Titel und Preis rutschen aus dem Bild (CLS 0,33 + 0,43).
   Der Viewport bekommt deshalb per Seitenverhältnis sofort seine Höhe (alle Produktbilder sind quadratisch,
   FlexSlider setzt später dieselbe Höhe inline), und bis die Vorschaubildleiste existiert, wird ihr Platz
   reserviert (Leiste 25 % + Abstände). */
.woocommerce-product-gallery .flex-viewport {
    aspect-ratio: 1 / 1;
}
.woocommerce-product-gallery:not(:has(.flex-control-thumbs)) > .flex-viewport {
    margin-bottom: calc(25% + 0.9rem);
}