/* Neue Produktkarte – nur mit body.wcbr-pc2 (inc/karten-neu.php). Freigegeben 21.10.2026 nach Mockup „Produkt-Schiene“.
   Liegt über category.css und F19 (karten-handy.css); deren !important-Regeln werden hier mit gleicher oder höherer
   Spezifität überschrieben. Farben aus dem Design-System: Bordeaux #8e153c, Text #3a2b2b, Grau AA #6b5e58,
   Linien #ece1d8/#e3d7cc, Creme #fdfaf7, Grün (Knopf) wie im Shop #4da209. */

body.wcbr-pc2 .wcbr-pcard {
    container: pcard / inline-size;
    background: #fff;
    border: 1px solid #ece1d8 !important;
    border-radius: 14px;
}
body.wcbr-pc2 .wcbr-pcard:hover { transform: none; border-color: #dccbbd !important; box-shadow: 0 6px 18px rgba(51, 48, 45, .08); }

/* ---------- Text linksbündig, ruhige Abstände ---------- */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__body { padding: .7rem .75rem .8rem !important; gap: 0; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__title { text-align: left; font-weight: 600; color: #3a2b2b; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__titlelink:hover .wcbr-pcard__title { color: #8e153c; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__desc { text-align: left !important; }

/* ---------- Preis groß und zentriert (Marcel 21.10.2026); bei Rabatt Streichpreis + „Sie sparen“ in Bordeaux ---------- */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__pricerow {
    display: block !important; margin-top: auto !important; padding-top: .5rem !important; text-align: center;
}
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__pricerow .wcbr-pcard__price {
    margin: 0 !important; padding: 0 !important; text-align: center !important; font-size: 1.35rem !important; font-weight: 700;
    line-height: 1.2; letter-spacing: -.01em; color: #3a2b2b;
}
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__price del,
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__price del .woocommerce-Price-amount { color: #8e153c !important; font-size: .82rem; font-weight: 500; opacity: .85; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__save { text-align: center !important; margin: 0 0 .1rem !important; font-size: .74rem; font-weight: 700; color: #8e153c !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__save .woocommerce-Price-amount { color: #8e153c !important; }

/* ---------- Pflichtzeile ganz unten: „inkl. 7 % MwSt. · zzgl. Versand · 40,88 €/kg“ ----------
   Schrift wächst/schrumpft mit der Kartenbreite (cqi), damit die Zeile fast immer einzeilig ist. In sehr schmalen Karten
   (Bestseller am Handy) bricht sie lieber um, statt abgeschnitten zu werden – der Grundpreis muss sichtbar bleiben (PAngV). */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__fine {
    margin: .55rem 0 0 !important; min-height: 0 !important; text-align: center !important;
    font-size: clamp(8.5px, calc(4.4cqi - 1px), 11px) !important; line-height: 1.35; color: #6b5e58;
    white-space: normal !important; overflow: visible !important; text-overflow: clip !important; text-wrap: balance;
}
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__fine-gp,
body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-pcard__fine-gp { display: inline !important; white-space: nowrap; }
/* Schmale Karte (Handy): passt ohnehin nicht in eine Zeile – dann lieber zwei gut lesbare Zeilen statt Winzschrift */
@container pcard (max-width: 199px) {
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__fine { font-size: 10px !important; line-height: 1.35; }
}
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__mhd { align-self: center; }   /* mittig wie der Preis darunter (Marcel 22.10.2026) */

/* ---------- Menge + Warenkorb in EINER Zeile ---------- */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart { margin-top: .7rem !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form {
    display: flex !important; flex-wrap: nowrap !important; align-items: center; gap: .4rem !important;
}

/* Mengen-Pille: − 1 + */
body.wcbr-pc2 .wcbr-pcard .wcbr-qty,
body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-qty {
    display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; width: auto !important;
    height: 44px !important; min-height: 44px !important; padding: 0 !important; margin: 0 !important;
    border: 1px solid #e3d7cc !important; border-radius: 999px !important; background: #fdfaf7 !important;
    overflow: hidden !important; box-shadow: none !important;
}
body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-qty__btn,
body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-qty .wcbr-qty__btn {
    flex: 0 0 34px !important; width: 34px !important; min-width: 34px !important; height: 42px !important; min-height: 42px !important;
    background: transparent !important; color: #6b5e58 !important; border: 0 !important; border-radius: 0 !important;
    display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; cursor: pointer;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
/* „+“ Bordeaux; „−“ grau bei Mindestmenge, Bordeaux sobald es etwas zu verringern gibt (Klasse per Skript) */
body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-qty__btn[data-dir="1"],
body.wcbr-pc2 .wcbr-pcard .wcbr-qty.wcbr-qty--mehr .wcbr-qty__btn[data-dir="-1"] { color: #8e153c !important; }
/* Minus immer Bordeaux wie Plus (Marcel 21.10.2026 – grau bei Menge 1 wirkte wie schwarz/kaputt) */
body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-qty__btn[data-dir="-1"] { color: #8e153c !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-qty__btn:hover,
body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-qty__btn:active { background: #f1e8df !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-qty__btn svg { width: 15px !important; height: 15px !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-pcard__qty,
body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-qty .wcbr-pcard__qty {
    flex: 0 0 24px !important; width: 24px !important; min-width: 24px !important; max-width: 24px !important;
    height: 42px !important; min-height: 42px !important; padding: 0 !important; margin: 0 !important;
    border: 0 !important; background: transparent !important; box-shadow: none !important;
    font-size: 15px !important; font-weight: 700 !important; color: #3a2b2b !important; text-align: center !important;
}

/* Warenkorb-Knopf: Pille, Rest der Zeile */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form .wcbr-pcard__addbtn,
body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form .wcbr-pcard__addbtn {
    flex: 1 1 auto !important; width: auto !important; min-width: 44px !important;
    height: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 .75rem !important;
    border-radius: 999px !important; gap: .4rem; white-space: nowrap !important;
    font-size: .82rem !important; font-weight: 700 !important; line-height: 1 !important;
}
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__addbtn .wcbr-cart-ic { display: inline-flex !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__addbtn .wcbr-cart-ic svg { width: 18px; height: 18px; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__addbtn .wcbr-pcard__addlabel { display: inline !important; }

/* Karte < 320 px: Knopf nur mit Symbol (Text bleibt für Screenreader im Knopf). Grenze 21.10.2026 von 270 auf 320 –
   in Safari lief „In den Warenkorb“ bei ~300 px Kartenbreite über den Knopf hinaus. */
@container pcard (max-width: 319px) {
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__addbtn .wcbr-pcard__addlabel {
        display: block !important; position: absolute !important; width: 1px !important; height: 1px !important;
        overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; margin: -1px !important; padding: 0 !important;
    }
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__addbtn .wcbr-cart-ic svg { width: 22px; height: 22px; }
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form .wcbr-pcard__addbtn { padding: 0 !important; }
}
/* Sehr schmale Karte (Bestseller-Raster am Handy ~146 px): weniger Innenabstand, Pille enger – Pille + 44-px-Knopf
   brauchen dann 126 px und passen in jede Karte ab 142 px. */
@container pcard (max-width: 160px) {
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__body { padding: .6rem .5rem .7rem !important; }
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form { gap: 4px !important; }
    body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-qty__btn,
    body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-qty .wcbr-qty__btn { flex-basis: 28px !important; width: 28px !important; min-width: 28px !important; }
    body.wcbr-pc2 .wcbr-pcard .wcbr-qty .wcbr-pcard__qty,
    body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-qty .wcbr-pcard__qty { flex-basis: 20px !important; width: 20px !important; min-width: 20px !important; max-width: 20px !important; }
}
/* Winzige Karte (< 141 px, z. B. Bestseller bei 360 px Bildschirm): zwei Zeilen – Pille volle Breite, Knopf darunter */
@container pcard (max-width: 140px) {
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form { flex-wrap: wrap !important; }
    body.wcbr-pc2 .wcbr-pcard .wcbr-qty,
    body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-qty { flex: 1 1 100% !important; width: 100% !important; justify-content: space-between !important; }
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form .wcbr-pcard__addbtn,
    body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-pcard__cart .wcbr-pcard__form .wcbr-pcard__addbtn { flex: 1 1 100% !important; width: 100% !important; }
}

/* Ausverkauft: „Benachrichtigen Sie mich“ über die volle Breite, Umriss-Pille in Bordeaux (klar anders als der grüne
   Kaufknopf), gleiche Höhe wie die Kaufzeile – der unsichtbare Mengen-Platzhalter aus F19 entfällt. */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__form--notify .wcbr-qty--platzhalter { display: none !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__form--notify .wcbr-pcard__notify { flex: 1 1 100% !important; width: 100% !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notify .button,
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notifylink,
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__cart > .button {
    width: 100% !important; min-height: 44px !important; margin: 0 !important; padding: .3rem .9rem !important;
    border-radius: 999px !important; display: flex !important; align-items: center; justify-content: center;
    font-size: .8rem !important; font-weight: 700 !important; line-height: 1.15 !important; white-space: nowrap; text-align: center;
}
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notify .button,
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notifylink {
    background: #fff !important; color: #8e153c !important; border: 1.5px solid #8e153c !important; box-shadow: none !important;
}
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notify .button:hover,
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notifylink:hover { background: #8e153c !important; color: #fff !important; }
@container pcard (max-width: 269px) {
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notify .button,
    body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__notifylink { white-space: normal; font-size: .74rem !important; padding: .25rem .6rem !important; }
}
/* Suchseite: eigener Zusatz-Link „Benachrichtigen, wenn lieferbar“ nur noch, wenn die Karte keinen Knopf hat */
body.wcbr-pc2 .wcbr-pcard:has(.cwg_popup_submit) .wcbr-such__benachr { display: none !important; }

/* Mengenzahl auf einer Höhe mit − und + (Raleway setzt sonst Mediävalziffern, die „2“ saß tiefer) – Marcel 21.10.2026 */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__qty { font-variant-numeric: lining-nums tabular-nums !important; font-feature-settings: "lnum" 1, "tnum" 1 !important; }

/* Sicherheitsnetz: Knopftext läuft nie über die Pille hinaus */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__addbtn { overflow: hidden !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__addbtn .wcbr-pcard__addlabel { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* Gleiche Höhe in der Reihe (Marcel 21.10.2026): MHD-Chip und Preisblock unten bündeln – unterschiedlich lange
   Kurzbeschreibungen schoben den Chip sonst auf verschiedene Höhen. */
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__body > .wcbr-pcard__mhd { margin-top: auto !important; }
body.wcbr-pc2 .wcbr-pcard .wcbr-pcard__body > .wcbr-pcard__pricerow { margin-top: auto !important; }
/* Preis direkt unter den Chip (der Chip sitzt unten, siehe oben). Der Chip ist seit 21.10. überall sichtbar (karten-handy.css);
   ist er per Schalter aus (ohne Body-Klasse wcbr-f19), gehört der Preis selbst nach unten. */
body.wcbr-pc2.wcbr-f19 .wcbr-pcard .wcbr-pcard__body > .wcbr-pcard__mhd + .wcbr-pcard__pricerow { margin-top: .4rem !important; }

/* Bestand erreicht / nicht mehr vorrätig (Marcel 22.10.2026: bei nur noch 1 Stück kam beim Plus kein Feedback) */
.wcbr-pcard .wcbr-qty.wcbr-qty--voll .wcbr-qty__btn[data-dir="1"] { opacity: .35; }
.wcbr-pcard .wcbr-pcard__hinweis { margin: .35rem 0 0; font-size: 12px; font-weight: 600; line-height: 1.35; color: #8e153c; flex-basis: 100%; }
