/* rmd-kadence-child/assets/css/header.css
   Globaler Header nach Mockup (Topbar, Logo, Nav, Mega-Panels, Aktions-Icons, Off-Canvas). NUR Tokens.
   Breakpoints: Tablet 1024, Mobile 640 (Off-Canvas ab 1024). */

.rmd-sprite{position:absolute;width:0;height:0;overflow:hidden}
.rmd-ic{width:20px;height:20px;display:inline-block;vertical-align:middle;flex:0 0 auto;color:currentColor;fill:none}

/* Skip-Link (A11y) */
.rmd-skip{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--color-headline);color:var(--color-bg);padding:var(--space-2) var(--space-4);border-radius:0 0 var(--radius-sm) 0;font-family:var(--font-head);font-weight:var(--fw-semibold)}
.rmd-skip:focus{left:0;top:0}

/* ===== Topbar ===== */
.rmd-topbar{background:var(--color-surface);border-bottom:1px solid var(--color-border);font-family:var(--font-head);font-size:var(--fs-xs);font-weight:var(--fw-medium)}
.rmd-topbar__inner{padding-top:var(--space-2);padding-bottom:var(--space-2);color:var(--color-text)}
.rmd-topbar__track{display:flex;justify-content:center;align-items:center;gap:var(--space-8)}
.rmd-topbar__item{display:inline-flex;align-items:center;gap:var(--space-2)}
.rmd-topbar__item[aria-hidden]{display:none}
.rmd-topbar__item .rmd-ic{width:16px;height:16px;color:var(--color-headline)}

/* ===== Header ===== */
.rmd-header{position:sticky;top:0;z-index:100;background:var(--color-bg);border-bottom:1px solid var(--color-border);transition:box-shadow .2s}
.rmd-header.is-scrolled{box-shadow:var(--shadow-header)}
.rmd-header__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding-top:var(--space-4);padding-bottom:var(--space-4)}
.rmd-header__inner>.rmd-header__burger{display:none}

/* Logo (gehostetes Logo, dunkel -> passt auf hellen Header. Bei heller SVG-Version .rmd-logo--invert nutzen.) */
.rmd-logo{display:inline-flex;align-items:center;flex:0 0 auto;text-decoration:none}
/* Logo fix: !important schlaegt einen evtl. durchschlagenden img{height:auto}-Reset (Kadence/Woo),
   sonst zeigt das PNG auf manchen Seiten seine volle Groesse. */
.rmd-logo__img{height:44px!important;width:auto!important;max-height:44px;display:block}
.rmd-logo--invert .rmd-logo__img{filter:brightness(0)}

/* ===== Navigation (animierter Unterstrich) ===== */
.rmd-nav{display:flex}
.rmd-nav__list{display:flex;align-items:center;gap:var(--space-1);list-style:none;margin:0;padding:0}
.rmd-nav__item{position:static}
.rmd-nav__list a{position:relative;white-space:nowrap;font-family:var(--font-head);font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--color-headline);text-decoration:none;display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-3);border-radius:var(--radius-sm)}
.rmd-nav__list a::after{content:"";position:absolute;left:var(--space-3);right:var(--space-3);bottom:6px;height:2px;background:var(--color-signal);border-radius:2px;transform:scaleX(0);transition:transform .18s}
.rmd-nav__list a:hover::after,.rmd-nav__item.is-open>a::after,.rmd-nav__list .current-menu-item>a::after,.rmd-nav__list .current-menu-parent>a::after{transform:scaleX(1)}
.rmd-nav__chev{width:13px;height:13px;stroke:currentColor;transition:transform .2s}
.rmd-nav__item.is-open .rmd-nav__chev{transform:rotate(180deg)}

/* ===== Aktions-Icons ===== */
.rmd-actions{display:flex;align-items:center;gap:var(--space-1);flex:0 0 auto}
.rmd-actions__btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-pill);background:transparent;border:none;cursor:pointer;color:var(--color-headline);text-decoration:none;transition:background .15s}
/* Kadence-Theme-Hover auf den Header-Icons neutralisieren (kein Fremd-Blau/-Schatten/-Unterstrich); eigener dezenter Hover */
.rmd-actions__btn:hover{background:var(--color-surface)!important;color:var(--color-headline)!important;box-shadow:none!important;text-decoration:none!important;transform:none!important}
.rmd-actions__btn:focus{background:transparent!important;box-shadow:none!important;text-decoration:none!important}
.rmd-actions__btn .rmd-ic,.rmd-actions__btn:hover .rmd-ic{color:var(--color-headline);stroke:currentColor}
.rmd-actions__btn .rmd-ic{width:21px;height:21px}
.rmd-actions__count{position:absolute;top:4px;right:4px;min-width:17px;height:17px;padding:0 4px;background:var(--color-signal);color:var(--color-on-signal);border-radius:var(--radius-pill);font-family:var(--font-head);font-size:11px;font-weight:var(--fw-bold);display:flex;align-items:center;justify-content:center;line-height:1}
.rmd-actions__trenner{width:1px;height:22px;background:var(--color-hairline,var(--color-border));margin:0 var(--space-2);flex:0 0 auto}
.rmd-actions__lang{display:inline-flex;align-items:center;height:44px;padding:0 var(--space-1);font-family:var(--font-head);font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--color-headline)}
.rmd-actions__burger{display:none}

/* ===== Mega-Panels ===== */
.rmd-mega{position:absolute;left:0;right:0;top:100%;background:var(--color-bg);border-top:1px solid var(--color-border);box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .18s,transform .18s,visibility .18s;z-index:99}
.rmd-mega.is-open{opacity:1;visibility:visible;transform:translateY(0)}
.rmd-mega__pad{padding-top:var(--space-10);padding-bottom:var(--space-10)}

/* Shop-Mega (Panel unten abgerundet) */
.rmd-mega{border-radius:0 0 var(--radius-lg) var(--radius-lg)}
.rmd-mega__cols{display:grid;grid-template-columns:repeat(4,1fr) var(--mega-feature-w);gap:var(--space-10);align-items:start}
.rmd-mega__cols>.rmd-c-cat-help{align-self:stretch} /* Beratungspanel fuellt die Feature-Spalte (wie im Anwendungsbereiche-Mega) */
.rmd-mega__group+.rmd-mega__group{margin-top:var(--space-8)}
/* Ueberkategorie = klare Ueberschrift (Montserrat, dunkel); Unterkategorien = dezente Body-Links. Keine Umbrueche. */
.rmd-mega__head{display:block;font-family:var(--font-head);font-size:var(--fs-base);font-weight:var(--fw-semibold);color:var(--color-headline);text-decoration:none;white-space:nowrap;margin-bottom:var(--space-2)}
a.rmd-mega__head:hover{text-decoration:underline;text-decoration-color:var(--color-signal);text-decoration-thickness:2px;text-underline-offset:4px}
.rmd-mega__links{list-style:none;margin:0;padding:0}
.rmd-mega__links a{display:block;white-space:nowrap;font-family:var(--font-body);font-size:var(--fs-sm);color:var(--color-text-muted);text-decoration:none;padding:var(--space-2) 0;transition:color .14s,padding-left .18s cubic-bezier(.4,0,.2,1)}
.rmd-mega__links a:hover{color:var(--color-headline);font-weight:var(--fw-medium);padding-left:var(--space-1)}

/* Feature-Card (Signal-Gelb erscheint NUR hier) */
.rmd-mega__feature{display:flex;flex-direction:column;border-left:1px solid var(--color-border);padding-left:var(--space-10)}
.rmd-mega__thumb{position:relative;aspect-ratio:5/4;background:var(--color-surface);border-radius:var(--radius);display:grid;place-items:center;overflow:hidden;margin-bottom:var(--space-4)}
.rmd-mega__fimg{width:var(--space-12);height:var(--space-12);color:var(--color-border-strong)}
.rmd-mega__fbadge{position:absolute;top:var(--space-3);left:var(--space-3);background:var(--color-headline);color:var(--color-on-dark);font-family:var(--font-head);font-size:var(--fs-xs);font-weight:var(--fw-semibold);letter-spacing:.04em;text-transform:uppercase;padding:var(--space-1) var(--space-2);border-radius:var(--radius-pill)}
.rmd-mega__ftitle{font-family:var(--font-head);font-size:var(--fs-base);font-weight:var(--fw-semibold);color:var(--color-headline);margin:0 0 var(--space-1)}
.rmd-mega__fdesc{font-family:var(--font-body);font-size:var(--fs-sm);color:var(--color-text-muted);line-height:var(--lh-normal);margin:0 0 var(--space-3)}
.rmd-mega__ffoot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.rmd-mega__fprice{font-family:var(--font-head);font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--color-headline)}
.rmd-mega__fprice small{display:block;font-family:var(--font-body);font-size:var(--fs-xs);font-weight:var(--fw-regular);color:var(--color-text-muted);margin-top:var(--space-1)}
.rmd-mega__cta{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-signal);color:var(--color-on-signal);font-family:var(--font-head);font-size:var(--fs-sm);font-weight:var(--fw-semibold);text-decoration:none;padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);transition:background .16s,transform .12s}
.rmd-mega__cta:hover{background:var(--color-signal-hover)}
.rmd-mega__cta:active{transform:scale(.97)}
.rmd-mega__cta .rmd-icon{width:var(--fs-sm);height:var(--fs-sm)}

/* Trust-Leiste unter dem Grid */
.rmd-mega__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:var(--space-4) var(--space-8);margin-top:var(--space-8);padding-top:var(--space-5);border-top:1px solid var(--color-border);font-family:var(--font-body);font-size:var(--fs-sm);color:var(--color-text-muted)}
.rmd-mega__mf{display:inline-flex;align-items:center;gap:var(--space-2)}
.rmd-mega__mf .rmd-icon{width:var(--fs-md);height:var(--fs-md)}

@media(max-width:1200px){.rmd-mega__cols{gap:var(--space-6)}}
@media(prefers-reduced-motion:reduce){.rmd-mega,.rmd-mega *{transition:none!important}}

/* Anwendungsbereiche-Mega (Variante 5c): 2-spaltige Foto-Liste + Beratungspanel (cat-help) rechts.
   Fotos = Beitragsbild der jeweiligen "Leuchten fuer ..."-Seite, grau -> bei Hover farbig. */
.rmd-megaarea__grid{display:grid;grid-template-columns:1fr var(--mega-feature-w);gap:var(--space-12);align-items:stretch}
.rmd-megaarea__cols{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--space-10);align-content:start}
.rmd-megaarea__col{min-width:0}
.rmd-megaarea__group+.rmd-megaarea__group{margin-top:var(--space-6)}
/* Ueberbegriff (schlichtes Label, ohne gelben Unterstrich). */
.rmd-megaarea__head{display:inline-block;font-family:var(--font-head);font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.06em;color:var(--color-headline);padding-bottom:var(--space-2);margin-bottom:var(--space-1)}
.rmd-megaarea__row{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) 0;text-decoration:none;color:inherit}
.rmd-megaarea__row+.rmd-megaarea__row{border-top:1px solid var(--color-hairline)}
.rmd-megaarea__ph{width:52px;height:52px;flex:0 0 auto;border-radius:var(--radius-sm);background:var(--color-surface);display:flex;align-items:center;justify-content:center;overflow:hidden}
.rmd-megaarea__ph img{width:100%;height:100%;object-fit:cover} /* immer farbig (kein Graustufen-Default) */
.rmd-megaarea__txt{min-width:0}
.rmd-megaarea__n{display:block;font-family:var(--font-head);font-size:var(--fs-base);font-weight:var(--fw-semibold);color:var(--color-headline)}
.rmd-megaarea__t{display:block;font-size:var(--fs-sm);color:var(--color-text-muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rmd-megaarea__row:hover .rmd-megaarea__n{text-decoration:underline;text-decoration-color:var(--color-signal);text-decoration-thickness:2px;text-underline-offset:3px}

/* ===== Off-Canvas (mobil) ===== */
.rmd-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.4);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:200}
.rmd-backdrop.is-open{opacity:1;visibility:visible}
.rmd-offcanvas{position:fixed;top:0;right:0;width:min(88vw,380px);height:100%;background:var(--color-bg);z-index:201;transform:translateX(100%);transition:transform .25s;overflow:hidden;box-shadow:-8px 0 30px rgba(0,0,0,.15)}
.rmd-offcanvas.is-open{transform:translateX(0)}

/* ---- Drill-Down-Menue (rmd-mnav): Drawer = feste Spalte, Panels schieben nach rechts rein ---- */
.rmd-mnav{display:flex;flex-direction:column}
.rmd-mnav__bar{display:flex;align-items:center;gap:var(--space-2);height:60px;flex:none;padding:0 var(--space-3) 0 0;border-bottom:1px solid var(--color-hairline)}
.rmd-mnav__ibtn{width:40px;height:40px;border-radius:var(--radius-pill);border:0;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none;color:var(--color-headline);padding:0}
/* display:block hebt den globalen .rmd-icon-Baseline-Versatz (vertical-align:-.125em) auf -> exakt zentriert */
.rmd-mnav__ibtn .rmd-icon{width:22px;height:22px;display:block;vertical-align:middle}
.rmd-mnav__ibtn--surface{background:var(--color-surface)}
.rmd-mnav__ibtn--surface .rmd-icon{width:18px;height:18px}
/* Zurueck-Button belegt am Root KEINEN Platz (display:none), damit der Titel linksbuendig bleibt.
   Erst ab Ebene 2 sichtbar; er ist 40px breit mit zentriertem Icon (Pfeil ~ auf Hoehe der Item-Einrueckung). */
.rmd-mnav__back{display:none}
.rmd-mnav.is-deep .rmd-mnav__back{display:flex}
/* Titel linksbuendig, gleiche Einrueckung wie die Menuepunkte (space-5); ab Ebene 2 sitzt er nach dem Pfeil. */
.rmd-mnav__title{flex:1;font-family:var(--font-head);font-weight:var(--fw-semibold);font-size:var(--fs-sm);color:var(--color-headline);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:var(--space-5)}
.rmd-mnav.is-deep .rmd-mnav__title{padding-left:var(--space-2)}

.rmd-mnav__viewport{position:relative;flex:1;overflow:hidden}
.rmd-mnav__panel{position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--color-bg);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1);will-change:transform}
.rmd-mnav__panel.is-active{transform:translateX(0)}
.rmd-mnav__panel.is-past{transform:translateX(-28%)}
@media(prefers-reduced-motion:reduce){.rmd-mnav__panel{transition:none}}

.rmd-mnav__list{list-style:none;margin:0;padding:var(--space-2) 0}
.rmd-mnav__item{display:flex;align-items:center;gap:var(--space-4);width:100%;padding:var(--space-3) var(--space-5);background:transparent;border:0;border-bottom:1px solid var(--color-hairline);cursor:pointer;font-family:var(--font-head);font-weight:var(--fw-medium);font-size:var(--fs-base);color:var(--color-headline);text-align:left;text-decoration:none}
.rmd-mnav__list li:last-child .rmd-mnav__item{border-bottom:0}
.rmd-mnav__item:active{background:var(--color-surface)}
.rmd-mnav__item>span:not(.rmd-mnav__thumb){flex:1}  /* nur das Text-Label dehnen - NICHT die Bild-Kachel (sonst Rechteck) */
.rmd-mnav__chev{width:20px;height:20px;flex:none;color:var(--color-icon-quiet)}
.rmd-mnav__item--plain{padding:var(--space-5)}
.rmd-mnav__item--all{color:var(--color-text-muted);font-weight:var(--fw-semibold);font-size:var(--fs-sm);padding:var(--space-4) var(--space-5)}
/* Gruppen-Label (Ueberbegriff) im Anwendungsbereiche-Panel */
.rmd-mnav__grouphead{padding:var(--space-4) var(--space-5) var(--space-1);font-family:var(--font-head);font-size:var(--fs-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}

/* Kachel: STRIKT quadratisch (1:1), duenner schwarzer Rand + runde Ecken. Bild fuellt die Box
   (cover), absolut positioniert. !important schlaegt evtl. durchschlagende Theme/Woo-img-Regeln
   (height:auto), die die Box sonst zum Rechteck machen. */
.rmd-mnav__thumb{position:relative;width:44px;height:44px;aspect-ratio:1/1;flex:none;overflow:hidden;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-bg);display:flex;align-items:center;justify-content:center;color:var(--color-icon-quiet)}
.rmd-mnav__thumb img{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;display:block}
.rmd-mnav__thumb .rmd-icon{width:24px;height:24px}

/* Kein Theme-Gelb im GESAMTEN Drawer (Kadence faerbt Buttons/Links sonst gelb bei Hover/Fokus/Aktiv).
   Der Kreis-Button (--surface) ist AUSGENOMMEN, damit er seinen grauen Hintergrundkreis IMMER behaelt
   (sonst frass die transparent-Regel bei Fokus den Kreis weg -> "X ohne Kreis"). */
.rmd-mnav a:hover,.rmd-mnav a:focus,.rmd-mnav a:active,
.rmd-mnav button:not(.rmd-mnav__ibtn--surface):hover,.rmd-mnav button:not(.rmd-mnav__ibtn--surface):focus,.rmd-mnav button:not(.rmd-mnav__ibtn--surface):active,.rmd-mnav button:not(.rmd-mnav__ibtn--surface):focus-visible{background-color:transparent!important;box-shadow:none!important;color:var(--color-headline)!important}
/* Kreis-Button: grauer Hintergrundkreis in ALLEN Zustaenden (Rest/Hover/Fokus/Aktiv). */
.rmd-mnav__ibtn--surface,.rmd-mnav__ibtn--surface:hover,.rmd-mnav__ibtn--surface:focus,.rmd-mnav__ibtn--surface:active,.rmd-mnav__ibtn--surface:focus-visible{background-color:var(--color-border)!important;color:var(--color-headline)!important;box-shadow:none!important}
.rmd-mnav__item:active{background-color:var(--color-surface)!important}
.rmd-mnav__wa,.rmd-mnav__wa:hover,.rmd-mnav__wa:focus{background-color:var(--color-signal)!important;color:var(--color-on-signal)!important}

.rmd-mnav__foot{margin-top:auto;flex:none;padding:var(--space-5);border-top:1px solid var(--color-hairline);display:flex;flex-direction:column;gap:var(--space-4)}
.rmd-mnav__acct{display:inline-flex;align-items:center;gap:var(--space-3);font-family:var(--font-head);font-weight:var(--fw-medium);font-size:var(--fs-sm);color:var(--color-headline);text-decoration:none}
.rmd-mnav__acct .rmd-icon{width:18px;height:18px}
.rmd-mnav__meta{margin:0;font-size:var(--fs-xs);color:var(--color-text-muted);line-height:1.7}
.rmd-mnav__meta a{color:var(--color-text-muted);text-decoration:none}
.rmd-mnav__meta a:hover{color:var(--color-headline)}
.rmd-mnav__wa{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:52px;border-radius:var(--radius-pill);background:var(--color-signal);color:var(--color-on-signal);font-family:var(--font-head);font-weight:var(--fw-semibold);font-size:var(--fs-sm);text-decoration:none}
.rmd-mnav__wa .rmd-icon--brand{width:18px;height:18px}

/* Such-Overlay (Tipp auf Lupe) mit B2B-Live-Suche: Eingabe oben (fix), Vorschlaege scrollen darunter */
.rmd-mnav__search{position:absolute;inset:0;z-index:20;background:var(--color-bg);display:flex;flex-direction:column;opacity:0;pointer-events:none;transform:translateY(-8px);transition:opacity .22s,transform .22s}
.rmd-mnav__search.is-open{opacity:1;pointer-events:auto;transform:none}
.rmd-mnav__search-bar{display:flex;align-items:flex-start;gap:var(--space-2);flex:1;min-height:0;padding:var(--space-3)}
.rmd-mnav__search-field{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column}
.rmd-mnav__search-field>form{margin:0}
.rmd-mnav__search-field>form input[name="s"]{width:100%;box-sizing:border-box;height:44px;border:0;background:var(--color-surface);border-radius:var(--radius-pill);padding:0 var(--space-4);font-family:var(--font-body);font-size:var(--fs-base);color:var(--color-text);outline:none}

/* B2B-Live-Suche im Drawer: gleiche Vorschlaege wie im Header, Design + Schriftgroessen an den Drawer angepasst. */
.rmd-mnav__search .wcb2b-livesearch{display:flex;flex-direction:column;min-height:0;flex:1}
.rmd-mnav__search .wcb2b-livesearch form,.rmd-mnav__search .wcb2b-livesearch .form-group{margin:0;flex:none}
.rmd-mnav__search .wcb2b-livesearch input.form-control,.rmd-mnav__search .wcb2b-livesearch input[type="search"]{width:100%;box-sizing:border-box;height:44px;border:0;background:var(--color-surface);border-radius:var(--radius-pill);padding:0 var(--space-4);font-family:var(--font-body);font-size:var(--fs-base);color:var(--color-text)}
.rmd-mnav__search .wcb2b-livesearch input.form-control:focus,.rmd-mnav__search .wcb2b-livesearch input[type="search"]:focus{outline:none;box-shadow:0 0 0 2px var(--color-headline)}
.rmd-mnav__search .wcb2b-livesearch.loading::before{display:none!important}
.rmd-mnav__search .wcb2b-livesearch-products{flex:1;min-height:0;overflow-y:auto;margin-top:var(--space-4);display:flex;flex-direction:column}
.rmd-mnav__search .wcb2b-livesearch-products:empty{display:none}
.rmd-mnav__search .wcb2b-livesearch-product{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) 0;border-bottom:1px solid var(--color-hairline);text-decoration:none}
.rmd-mnav__search .wcb2b-livesearch-product:last-child{border-bottom:0}
.rmd-mnav__search .wcb2b-livesearch-product-image-wrapper{flex:0 0 48px}
.rmd-mnav__search .wcb2b-livesearch-product-image-wrapper img{width:48px;height:48px;object-fit:contain;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-bg);padding:2px}
.rmd-mnav__search .wcb2b-livesearch-product-content-wrapper{flex:1;min-width:0}
/* Vorschlag-Text kompakt fuer mobile UX: kleiner, hoechstens 2 Zeilen. */
.rmd-mnav__search .wcb2b-livesearch-product-title a{font-family:var(--font-head);font-weight:var(--fw-medium);font-size:var(--fs-sm);line-height:var(--lh-snug);color:var(--color-headline);text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rmd-mnav__search .wcb2b-livesearch-product-sku{font-size:var(--fs-xs);color:var(--color-text-muted)}
.rmd-mnav__search .wcb2b-livesearch-product-price{font-family:var(--font-head);font-weight:var(--fw-semibold);font-size:var(--fs-xs);color:var(--color-headline);margin-top:2px}
.rmd-mnav__search .wcb2b-livesearch-product-buttons-wrapper{display:none} /* schmaler Drawer: nur Vorschlag, kein Kauf-Button */

/* Fokus-Sichtbarkeit */
/* Fokus-Ring: dezent DUNKEL statt Signal-Gelb (das Gelb sah aus wie ein Theme-Fremdkoerper).
   Wir stylen den Header selbst - Kadence-Outline wird bei echtem Maus-Klick unterdrueckt,
   sichtbar bleibt der Ring nur fuer Tastatur-Bedienung (:focus-visible, A11y). */
.rmd-header a:focus-visible,.rmd-actions__btn:focus-visible,.rmd-actions__lang:focus-visible,.rmd-nav__list a:focus-visible,.rmd-offcanvas a:focus-visible,.rmd-offcanvas summary:focus-visible{outline:2px solid var(--color-headline);outline-offset:2px}
/* Kein Theme-/Browser-Outline bei reinem Klick/Toggle (Maus): nur echtes Keyboard-Fokus zeigt den Ring. */
.rmd-header a:focus:not(:focus-visible),.rmd-nav__list a:focus:not(:focus-visible),.rmd-actions__btn:focus:not(:focus-visible),.rmd-offcanvas a:focus:not(:focus-visible),.rmd-offcanvas summary:focus:not(:focus-visible){outline:none!important;box-shadow:none!important}

/* ===== Responsive: Off-Canvas + Nav aus ab Tablet (<=1024px) ===== */
@media(max-width:1024px){
  .rmd-nav{display:none}
  .rmd-mega{display:none}
  /* Mobile-Header: Logo links | Icons rechts (Suche, Warenkorb, Burger). Konto + Sprache im Off-Canvas. */
  .rmd-header__inner{display:flex;align-items:center;gap:var(--space-1)}
  .rmd-logo{order:0;margin-right:auto}
  .rmd-logo__img{height:42px!important;max-height:42px}  /* = Button-Hoehe -> Logo maximal gross, Header-Hoehe bleibt (74px) */
  .rmd-actions{order:1;gap:0}                 /* Icons in der Gruppe eng */
  .rmd-actions__btn{width:36px}               /* schmaler -> weniger Luft zwischen den Icons */
  .rmd-header__inner>.rmd-header__burger{order:2;display:inline-flex}
  .rmd-actions__account,.rmd-actions__lang,.rmd-actions__trenner{display:none}
}
/* ===== Topbar-Marquee (Mobil): eine langsam laufende Zeile, kein Umbruch ===== */
@media(max-width:767px){
  .rmd-topbar{overflow:hidden}
  .rmd-topbar__inner{overflow:hidden;padding-left:0;padding-right:0}
  .rmd-topbar__track{width:max-content;justify-content:flex-start;gap:0;animation:rmd-marquee 26s linear infinite}
  .rmd-topbar__item{white-space:nowrap;padding-right:var(--space-10)}
  .rmd-topbar__item[aria-hidden]{display:inline-flex}
  .rmd-topbar:hover .rmd-topbar__track,.rmd-topbar:active .rmd-topbar__track{animation-play-state:paused}
}
@keyframes rmd-marquee{to{transform:translateX(-50%)}}
@keyframes rmd-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.rmd-topbar__track{animation:none}}
@media(max-width:640px){
  .rmd-topbar{font-size:11.5px}
}

/* ===== Header-Suche (Panel + B2B-Live-Suche im RMD-Design) ===== */
.rmd-search{background:var(--color-bg);border-top:1px solid var(--color-border);box-shadow:var(--shadow-md);max-height:0;overflow:hidden;transition:max-height .26s ease}
.rmd-search[hidden]{display:none}
.rmd-search.is-open{max-height:85vh;overflow:visible}
/* Mobil: Suche als Overlay unter dem Header (wie die Mega-Panels), statt im Flow -> schiebt die Seite nicht mehr runter. */
@media(max-width:1024px){
  .rmd-search{position:absolute;left:0;right:0;top:100%;z-index:98;box-shadow:var(--shadow-lg)}
}
.rmd-search__inner{display:flex;align-items:flex-start;gap:var(--space-3);padding-top:var(--space-4);padding-bottom:var(--space-4)}
.rmd-search__field{flex:1;min-width:0}
.rmd-search__close{flex:0 0 auto;width:48px;height:48px;border:1.5px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-bg);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .12s}
.rmd-search__close:hover{background:transparent}
.rmd-search__close .rmd-ic{width:18px;height:18px}
.rmd-search__close:focus-visible{outline:2px solid var(--color-headline);outline-offset:2px}

/* Plugin-Markup (wcb2b) auf unsere Tokens mappen - .rmd-search-Praefix schlaegt Plugin-CSS */
.rmd-search .wcb2b-livesearch{position:relative}
.rmd-search .wcb2b-livesearch form,.rmd-search .wcb2b-livesearch .form-group{margin:0}
.rmd-search .wcb2b-livesearch input.form-control,.rmd-search .wcb2b-livesearch input[type="search"]{width:100%;height:48px;box-sizing:border-box;border:1.5px solid var(--color-border);border-radius:var(--radius-pill);padding:0 var(--space-6);font-family:var(--font-body);font-size:var(--fs-base);background:var(--color-bg);color:var(--color-text)}
.rmd-search .wcb2b-livesearch input.form-control:focus{outline:none;border-color:var(--color-headline);box-shadow:0 0 0 3px var(--color-signal-soft)}
.rmd-search .wcb2b-livesearch-products{margin-top:var(--space-3);max-height:60vh;overflow-y:auto;display:flex;flex-direction:column;gap:2px;color:var(--color-text-muted);font-size:var(--fs-sm)}
.rmd-search .wcb2b-livesearch-products:empty{display:none}
.rmd-search .wcb2b-livesearch-product{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3);border-radius:var(--radius);text-decoration:none;transition:background .12s}
.rmd-search .wcb2b-livesearch-product:hover{background:var(--color-surface)}
.rmd-search .wcb2b-livesearch-product-image-wrapper{flex:0 0 56px}
.rmd-search .wcb2b-livesearch-product-image-wrapper img{width:56px;height:56px;object-fit:contain;border-radius:var(--radius-sm);background:var(--color-surface)}
.rmd-search .wcb2b-livesearch-product-content-wrapper{flex:1;min-width:0}
.rmd-search .wcb2b-livesearch-product-title a{font-family:var(--font-head);font-weight:var(--fw-semibold);font-size:var(--fs-base);color:var(--color-headline);text-decoration:none}
.rmd-search .wcb2b-livesearch-product-sku{font-size:var(--fs-xs);color:var(--color-text-muted)}
.rmd-search .wcb2b-livesearch-product-price{font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-sm);color:var(--color-headline);margin-top:2px}
.rmd-search .wcb2b-livesearch-product-buttons-wrapper{flex:0 0 auto}
.rmd-search .wcb2b-livesearch-product-addtocart{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 var(--space-4);background:var(--color-signal);color:var(--color-on-signal);border-radius:var(--radius-pill);font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-sm);text-decoration:none;border:1.5px solid transparent;white-space:nowrap}
.rmd-search .wcb2b-livesearch-product-addtocart:hover{background:var(--color-signal-hover)}
/* "Alle Ergebnisse anzeigen"-Fuss (JS-injiziert in .wcb2b-livesearch) -> native Suchseite. Wirkt in
   Overlay UND Drawer, da im moving-Knoten. */
.wcb2b-livesearch .rmd-search__all{display:flex;align-items:center;justify-content:center;gap:var(--space-2);border-top:1px solid var(--color-border);margin-top:var(--space-4);padding:var(--space-4) 0 var(--space-1);font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-sm);color:var(--color-headline);text-decoration:none}
.wcb2b-livesearch .rmd-search__all svg{transition:transform .15s}
.wcb2b-livesearch .rmd-search__all:hover svg{transform:translateX(3px)}
.wcb2b-livesearch .rmd-search__all[hidden]{display:none}
@media(max-width:640px){
  .rmd-search .wcb2b-livesearch-product-price,.rmd-search .wcb2b-livesearch-product-buttons-wrapper{display:none}
  /* Mobil: Ergebnisse VOLLE BREITE mit kleinem Rand-Padding (statt space-6-Container). Feld full-width,
     Schliessen-x absolut oben rechts (statt in der Flex-Reihe, die die Ergebnisse schmaler machte). */
  .rmd-search__inner{display:block;position:relative;padding-left:var(--space-4);padding-right:var(--space-4)}
  .rmd-search__field{width:100%}
  /* Mobil = EINE Pille (wie Vorlage): Lupe links, x rechts IN der Pille, KEIN separater Schliessen-Kreis.
     Plugin-::before neutralisieren, damit die Lupe nicht doppelt/versetzt erscheint. */
  .rmd-search .wcb2b-livesearch::before{display:none!important}
  .rmd-search .wcb2b-livesearch form{position:relative}
  .rmd-search .wcb2b-livesearch form::before{content:"";position:absolute;left:var(--space-4);top:50%;transform:translateY(-50%);width:18px;height:18px;background:var(--color-text-muted);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='7'/%3E%3Cline x1='16' y1='16' x2='21' y2='21'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='7'/%3E%3Cline x1='16' y1='16' x2='21' y2='21'/%3E%3C/svg%3E") center/contain no-repeat;pointer-events:none}
  .rmd-search .wcb2b-livesearch input.form-control,.rmd-search .wcb2b-livesearch input[type="search"]{padding-left:calc(var(--space-4) + 18px + var(--space-2));padding-right:calc(44px + var(--space-2))}
  /* x als schlichtes Icon rechts in der Pille (kein Rahmen/BG), vertikal auf Input-Hoehe zentriert.
     Kein Hover-BG, kein Tap-Highlight - reines Icon. */
  .rmd-search__close{position:absolute;top:var(--space-4);right:var(--space-4);width:44px;height:48px;border:0;background:transparent;box-shadow:none;transition:none;-webkit-tap-highlight-color:transparent}
  .rmd-search__close:hover,.rmd-search__close:focus,.rmd-search__close:active{background:transparent;box-shadow:none}
  /* Laden: Plugin-Spinner AUS -> das x-Feld selbst dreht sich (gleiche Stelle); x kommt zurueck, sobald
     Ergebnisse da sind (Plugin entfernt .loading). :has = moderne Mobil-Browser. */
  .rmd-search .wcb2b-livesearch.loading form::after{display:none!important}
  .rmd-search__inner:has(.wcb2b-livesearch.loading) .rmd-search__close .rmd-ic{opacity:0}
  .rmd-search__inner:has(.wcb2b-livesearch.loading) .rmd-search__close::after{content:"";position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border:2px solid var(--color-border);border-top-color:var(--color-headline);border-radius:50%;animation:rmd-spin .6s linear infinite}
  /* Trefferzeile: kleinerer Abstand Bild<->Text, KEIN horizontales Padding (volle Breite, Hover randlos). */
  .rmd-search .wcb2b-livesearch-product{gap:var(--space-3);padding:var(--space-2) 0;border-radius:0}
  .rmd-search .wcb2b-livesearch-product-image-wrapper{flex:0 0 48px}
  .rmd-search .wcb2b-livesearch-product-image-wrapper img{width:48px;height:48px;border:1px solid var(--color-border-strong);background:var(--color-bg);padding:2px}
  .rmd-search .wcb2b-livesearch-product-title a{font-size:var(--fs-sm);line-height:var(--lh-snug)}
}

/* ===== Header-Suche: Feinschliff (Bilder, kein Schleier, Breite) ===== */
.rmd-search__inner{max-width:1040px;margin-left:auto;margin-right:auto}
/* Plugin-Ladeschleier (rgba(0,0,0,.2)) entfernen - der machte Bilder + gelbe Buttons stumpf */
.rmd-search .wcb2b-livesearch.loading::before{display:none!important}
.rmd-search .wcb2b-livesearch.loading form::after{top:50%!important;right:18px!important;left:auto!important;margin-top:-10px;border-color:var(--color-border)!important;border-top-color:var(--color-headline)!important}
/* Trefferliste: eigener sauberer Rahmen statt Plugin-Standard */
.rmd-search .wcb2b-livesearch-products{border:none;background:transparent;margin-top:var(--space-4);gap:0}
/* Zeilen als klare Liste mit Trenner */
.rmd-search .wcb2b-livesearch-product{gap:var(--space-4);padding:var(--space-3) var(--space-2);border-radius:0;border-bottom:1px solid var(--color-border)}
.rmd-search .wcb2b-livesearch-product:last-child{border-bottom:none}
.rmd-search .wcb2b-livesearch-product:hover{background:var(--color-surface);border-radius:var(--radius)}
/* Produktbild sauber in weisse Kachel rahmen (Lampenfotos sind schmal -> Rahmen gibt Halt) */
.rmd-search .wcb2b-livesearch-product-image-wrapper{flex:0 0 64px}
.rmd-search .wcb2b-livesearch-product-image-wrapper img{width:64px;height:64px;object-fit:contain;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:5px;box-sizing:border-box;max-width:none}
/* Add-to-cart klar gelb (nicht mehr durch Schleier gedaempft) */
.rmd-search .wcb2b-livesearch-product-addtocart{box-shadow:var(--shadow-cta)}

/* ===== Header-Suche v3: Produkt-ansehen-Button, kein Gelb-Ring, schwarzes X ===== */
/* Fokus ohne gelben Ring - nur dezenter dunkler Rahmen */
.rmd-search .wcb2b-livesearch input.form-control:focus,.rmd-search .wcb2b-livesearch input[type="search"]:focus{border-color:var(--color-headline);box-shadow:none;outline:none}
/* Schliessen-X schwarz sichtbar (Linien-Icon faerbt sich ueber currentColor) */
/* Schliessen-X immer schwarz (Sprite nutzt currentColor -> color, nicht stroke) */
.rmd-search__close,.rmd-search__close:hover,.rmd-search__close:focus,.rmd-search__close .rmd-ic{color:var(--color-headline)!important}
/* "Produkt ansehen" als Outline-Button (Ansehen ist kein Kauf) */
.rmd-search .wcb2b-livesearch-product-view{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 var(--space-5);background:transparent;color:var(--color-headline);border:1.5px solid var(--color-headline);border-radius:var(--radius-pill);font-family:var(--font-head);font-weight:var(--fw-semibold);font-size:var(--fs-sm);text-decoration:none;white-space:nowrap;transition:background .12s,color .12s}
.rmd-search .wcb2b-livesearch-product-view:hover{background:var(--color-headline);color:var(--color-bg)}

/* ===== Header-Suche v4: ganze Zeile klickbar, Preis rechts, kein Extra-Button, native X aus ===== */
/* Natives Leeren-X im Suchfeld ausblenden (rechts gibt es das Schliessen-X). Gilt Header + Drawer. */
.rmd-search .wcb2b-livesearch input[type="search"]::-webkit-search-cancel-button,
.rmd-search .wcb2b-livesearch input[type="search"]::-webkit-search-decoration,
.rmd-mnav__search .wcb2b-livesearch input[type="search"]::-webkit-search-cancel-button,
.rmd-mnav__search .wcb2b-livesearch input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
/* Ganze Trefferzeile = Klickflaeche (JS navigiert) -> Extra-Button entfaellt. */
.rmd-search .wcb2b-livesearch-product{cursor:pointer}
.rmd-search .wcb2b-livesearch-product-buttons-wrapper{display:none}
/* Inhalt: Titel + Art.-Nr. links, Preis rechts (vertikal zentriert). */
.rmd-search .wcb2b-livesearch-product-content-wrapper{display:grid;grid-template-columns:1fr auto;grid-template-areas:"title price" "sku price";align-items:center;column-gap:var(--space-6);row-gap:2px}
.rmd-search .wcb2b-livesearch-product-title{grid-area:title;min-width:0}
.rmd-search .wcb2b-livesearch-product-title a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rmd-search .wcb2b-livesearch-product-sku{grid-area:sku}
.rmd-search .wcb2b-livesearch-product-price{grid-area:price;margin:0;text-align:right;white-space:nowrap;font-size:var(--fs-base)}
/* Dezenter Chevron rechts als Klick-Hinweis. */
.rmd-search .wcb2b-livesearch-product::after{content:"";flex:0 0 auto;width:8px;height:8px;margin-left:var(--space-2);border-right:2px solid var(--color-icon-quiet);border-bottom:2px solid var(--color-icon-quiet);transform:rotate(-45deg);transition:border-color .12s}
.rmd-search .wcb2b-livesearch-product:hover::after{border-color:var(--color-headline)}

/* ===== Sprach-Umschalter (GTranslate im RMD-Look) ===== */
.rmd-actions__lang .gtranslate_wrapper{display:inline-flex;align-items:center;line-height:1}
.rmd-actions__lang select,.rmd-actions__lang .gt_selector{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:var(--font-head);font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--color-headline);background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230D1012' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center;background-size:12px;border:1px solid var(--color-border);border-radius:var(--radius-pill);padding:7px 25px 7px 12px;cursor:pointer;width:auto;max-width:88px;transition:border-color .15s,background-color .15s}
.rmd-actions__lang select:hover,.rmd-actions__lang .gt_selector:hover{background-color:var(--color-surface);border-color:var(--color-border-strong)}
.rmd-actions__lang a{color:var(--color-headline)}
.rmd-actions__lang img{vertical-align:middle;display:inline-block}

/* ===== Warenkorb-Panel (Off-Canvas, Dialog) ===== */
.rmd-cartpanel{position:fixed;top:0;right:0;width:min(92vw,420px);height:100%;background:var(--color-bg);z-index:202;transform:translateX(100%);transition:transform .25s;display:flex;flex-direction:column;box-shadow:-8px 0 30px rgba(0,0,0,.15)}
.rmd-cartpanel.is-open{transform:translateX(0)}
.rmd-cartpanel__head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--color-border);flex:0 0 auto}
.rmd-cartpanel__title{font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-md);display:flex;align-items:center;gap:var(--space-2);margin:0}
.rmd-cartpanel__count{font-family:var(--font-body);font-size:var(--fs-xs);font-weight:var(--fw-semibold);background:var(--color-surface);color:var(--color-text-muted);padding:2px var(--space-2);border-radius:var(--radius-pill)}
/* Symbol bleibt IMMER dunkel - auf grauem Hover-Hintergrund waere weiss unsichtbar */
.rmd-cartpanel__close,.rmd-cartpanel__close:hover,.rmd-cartpanel__close:focus,.rmd-cartpanel__close:active,.rmd-cartpanel__close .rmd-icon{color:var(--color-headline)!important}
/* Hintergrund in ALLEN Zustaenden transparent - sonst greift Kadences button:focus-Schwarz
   (der Button wird beim Oeffnen fokussiert). Nur Hover = dezentes Grau. */
.rmd-cartpanel__close,.rmd-cartpanel__close:focus,.rmd-cartpanel__close:active,.rmd-cartpanel__close:focus-visible{background:transparent!important;box-shadow:none!important}
.rmd-cartpanel__close{width:36px;height:36px;border:0;border-radius:var(--radius-pill);display:flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto}
.rmd-cartpanel__close:hover{background:var(--color-surface)!important}
.rmd-cartpanel__close:focus-visible{outline:2px solid var(--color-headline);outline-offset:2px}
.rmd-cartpanel__close .rmd-icon{width:17px;height:17px}
/* Body scrollt NICHT selbst - die Flex-Spalte im Mini-Cart regelt Scroll + Sticky-Foot */
.rmd-cartpanel__body{flex:1 1 auto;min-height:0;display:flex}
.widget_shopping_cart_content{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;width:100%}
.rmd-cart{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;width:100%}
.rmd-cartpanel.is-loading .rmd-cart{opacity:.55;pointer-events:none;transition:opacity .12s}

/* Versand-Fortschritt (NIE gelb - Gelb gehoert dem CTA) */
.rmd-cart__ship{flex:0 0 auto;padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--color-border)}
.rmd-cart__ship-txt{display:flex;align-items:center;justify-content:center;gap:var(--space-2);font-size:var(--fs-sm);margin:0 0 var(--space-2);text-align:center}
.rmd-cart__ship-txt .rmd-icon{width:15px;height:15px;flex:0 0 15px}
.rmd-cart__ship-txt b{font-weight:var(--fw-bold)}
/* Fortschritt schwarz (nicht gruen): Text + Balken in Headline-Schwarz, Text mittig ueber dem Balken */
.rmd-cart__ship .rmd-cart__ship-txt,.rmd-cart__ship .rmd-cart__ship-txt .rmd-icon{color:var(--color-headline)}
.rmd-cart__bar{height:6px;background:var(--color-border);border-radius:var(--radius-pill);overflow:hidden}
.rmd-cart__bar span{display:block;height:100%;border-radius:var(--radius-pill);background:var(--color-headline);transition:width .3s}

/* Positionsliste (scrollt) */
.rmd-cart__list{flex:1 1 auto;min-height:0;overflow-y:auto;list-style:none;margin:0;padding:0 var(--space-5)}
.rmd-cart__list::-webkit-scrollbar{width:6px}
.rmd-cart__list::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:var(--radius-pill)}
.rmd-cart__item{display:grid;grid-template-columns:76px 1fr;gap:var(--space-4);padding:var(--space-4) 0;border-bottom:1px solid var(--color-border);position:relative}
.rmd-cart__item:last-child{border-bottom:none}
.rmd-cart__thumb{width:76px;height:76px;border-radius:var(--radius-sm);background:transparent;border:1px solid var(--color-border);display:flex;align-items:center;justify-content:center;padding:var(--space-2)}
.rmd-cart__thumb img{max-width:100%;max-height:100%;width:auto!important;height:auto;object-fit:contain;display:block;float:none!important;margin:0!important}
.rmd-cart__info{min-width:0;padding-right:var(--space-6)}
.rmd-cart__name{font-family:var(--font-head);font-weight:var(--fw-semibold);font-size:var(--fs-sm);color:var(--color-headline);text-decoration:none;line-height:var(--lh-snug);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rmd-cart__name:hover{text-decoration:underline;text-decoration-color:var(--color-signal);text-decoration-thickness:2px;text-underline-offset:2px}
.rmd-cart__meta{font-size:var(--fs-xs);color:var(--color-text-muted);margin-top:2px}
.rmd-cart__meta p{margin:0}
/* Varianten (dl.variation) UNTEREINANDER: je "Label: Wert" eine eigene Zeile */
.rmd-cart__meta dl.variation{margin:0}
.rmd-cart__meta dl.variation dt{display:inline;margin:0;font-weight:var(--fw-semibold)}
.rmd-cart__meta dl.variation dd{display:inline;margin:0 0 0 var(--space-1)}
.rmd-cart__meta dl.variation dd p{display:inline;margin:0}
.rmd-cart__meta dl.variation dd::after{content:"\A";white-space:pre}
.rmd-cart__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-top:var(--space-3)}
/* Mengen-Angabe: EIN Kasten um alles (Zahl + hoch/runter-Chevrons) */
/* Mengen-Angabe im Drawer = EXAKT die Pille der Warenkorb-Seite (Vorbild: cart.css
   .rmd-cart-form .quantity / .rmd-step / input.qty) - horizontal [-] [Zahl] [+]. */
.rmd-cart__qty{display:inline-flex;align-items:center;border-radius:var(--radius-pill);background:var(--color-surface);overflow:hidden;margin:0}
.rmd-cart__qty button{width:42px;height:44px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--color-headline);font-family:var(--font-head);font-size:var(--fs-lg);line-height:1;cursor:pointer;transition:background .15s}
.rmd-cart__qty button:hover{background:var(--btn-neutral-bg-hover)}
/* An den Container gebunden (0,0,2,0), damit es Kadences input[type=number] (Rahmen/Radius/BG,
   0,0,1,1) schlaegt - sonst Kasten um die Zahl. Kein !important noetig. */
.rmd-cart__qty .rmd-cart__qtyinput{width:36px;height:44px;padding:0;border:0;border-radius:0;background:transparent;text-align:center;font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-sm);color:var(--color-headline);-moz-appearance:textfield;box-shadow:none;outline:none}
.rmd-cart__qty .rmd-cart__qtyinput::-webkit-outer-spin-button,.rmd-cart__qty .rmd-cart__qtyinput::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.rmd-cart__price{font-family:var(--font-head);font-weight:var(--fw-bold);font-size:var(--fs-base);color:var(--color-headline);text-align:right;white-space:nowrap}
.rmd-cart__price small{display:block;font-family:var(--font-body);font-size:var(--fs-xs);font-weight:var(--fw-regular);color:var(--color-text-muted);line-height:1.2}
/* Entfernen: dezentes X oben rechts */
.rmd-cart__remove{position:absolute;top:var(--space-4);right:0;width:26px;height:26px;border:0;background:transparent;border-radius:var(--radius-pill);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--color-text-muted)}
/* Symbol nie weiss auf grauem Hover-Hintergrund -> auf Hover dunkler, nicht heller */
.rmd-cart__remove:hover{background:var(--color-surface);color:var(--color-headline)!important}
.rmd-cart__remove .rmd-icon{width:13px;height:13px}

/* Footer (sticky) */
.rmd-cart__foot{flex:0 0 auto;border-top:1px solid var(--color-border);padding:var(--space-4) var(--space-5) var(--space-5);background:var(--color-bg)}
.rmd-cart__subtotal{display:flex;justify-content:space-between;align-items:baseline}
.rmd-cart__subtotal span{font-family:var(--font-head);font-size:var(--fs-md);font-weight:var(--fw-semibold);color:var(--color-headline)}
.rmd-cart__subtotal b{font-family:var(--font-head);font-size:var(--fs-2xl);font-weight:var(--fw-bold);color:var(--color-headline);line-height:var(--lh-tight)}
.rmd-cart__note{font-size:var(--fs-xs);color:var(--color-text-muted);margin:2px 0 var(--space-4)}
.rmd-cart__cta{width:100%;height:auto;min-height:50px;font-size:var(--fs-md)}
.rmd-cart__link{display:block;text-align:center;margin-top:var(--space-3);font-family:var(--font-head);font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--color-text-muted);text-decoration:none}
.rmd-cart__link:hover{color:var(--color-headline)}
.rmd-cart__trust{display:flex;justify-content:center;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-4);padding-top:var(--space-3);border-top:1px solid var(--color-border)}
.rmd-cart__trust span{display:flex;align-items:center;gap:var(--space-2);font-size:var(--fs-xs);color:var(--color-text-muted)}
.rmd-cart__trust .rmd-icon{width:13px;height:13px;flex:0 0 13px}

/* Leerer Zustand */
.rmd-cart--empty{justify-content:center;align-items:center}
.rmd-cart__empty{text-align:center;padding:var(--space-10) var(--space-6)}
.rmd-cart__empty-ic{width:62px;height:62px;border-radius:var(--radius-pill);background:var(--color-surface);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-4);color:var(--color-text-muted)}
.rmd-cart__empty-ic .rmd-icon{width:26px;height:26px}
.rmd-cart__empty h4{font-family:var(--font-head);font-size:var(--fs-md);margin:0 0 var(--space-2)}
.rmd-cart__empty p{color:var(--color-text-muted);font-size:var(--fs-sm);margin:0 0 var(--space-5)}

/* Mobil: Panel volle Breite, groessere Tap-Targets */
@media(max-width:767px){
  .rmd-cartpanel{width:100vw}
  .rmd-cart__qty .rmd-cart__qtyinput{font-size:var(--fs-base)}
  .rmd-cart__remove{width:34px;height:34px;top:var(--space-3)}
}