/*
Theme Name:   Wagtec Child
Description:  Wagtec v4 – Einheitliches Kachel-Design
Template:     storefront
Version:      4.0.22
Text Domain:  wagtec-child
*/

/* ═══ TOKENS ════════════════════════════════════════════════ */
:root {
  --red:    #cc1230; --red-d:  #a50f25;
  --navy:   #2d2f7e; --navy-d: #212360;
  --bg:     #f2f4f8; --white:  #ffffff;
  --text:   #1c1e2e; --muted:  #6b7280;
  --border: #e4e8f0;
  --r: 12px; --rs: 8px;
  --sh:  0 2px 16px rgba(44,47,126,.08);
  --sh2: 0 8px 32px rgba(44,47,126,.12);
  --sb: 230px; --hh: 62px;
  --font: 'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --ease: .18s cubic-bezier(.4,0,.2,1);
}

/* ═══ BASE ══════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box}
body{font-family:var(--font)!important;background:var(--bg)!important;color:var(--text)!important;margin:0!important;-webkit-font-smoothing:antialiased}
a{color:var(--navy);text-decoration:none;transition:color var(--ease)}
a:hover{color:var(--red)}
h1,h2,h3,h4,h5,h6{font-family:var(--font)!important;line-height:1.25;font-weight:700}
img{max-width:100%;height:auto}

/* ═══ HEADER (full-width, fixed) ════════════════════════════ */
.site-header{
  background:var(--white)!important;border-bottom:2px solid var(--border)!important;
  box-shadow:none!important;padding:0!important;
  position:fixed!important;top:0!important;left:0!important;right:0!important;
  height:var(--hh)!important;z-index:300!important;width:100%!important;
}
body.admin-bar .site-header{top:32px!important}
@media(max-width:782px){body.admin-bar .site-header{top:46px!important}}
.site-header .col-full{
  position:static!important;display:block!important;
  height:var(--hh)!important;
  width:100%!important;
  box-sizing:border-box!important;
}
.site-header .col-full>*:not(.wt-hl):not(.wt-hc):not(.wt-hr){display:none!important}
.main-navigation,.storefront-header-cart,.site-search,
.storefront-handheld-footer-bar,.secondary-navigation{display:none!important}

/* Buttons absolut positioniert – unabhängig von col-full max-width */
.wt-hl{position:absolute!important;left:16px!important;top:50%!important;transform:translateY(-50%)!important;display:flex;align-items:center;gap:8px}
.wt-hr{position:absolute!important;right:16px!important;top:50%!important;transform:translateY(-50%)!important;display:flex;align-items:center;gap:8px}
.wt-hc{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;
  pointer-events:none;
}
.wt-logo{pointer-events:auto;display:flex;flex-direction:column;align-items:center;text-decoration:none}
.wt-logo img{height:34px;width:auto;display:block}
.wt-logo-text{font-size:22px;font-weight:800;letter-spacing:-.03em;color:var(--navy);line-height:1}
.wt-logo-text em{color:var(--red);font-style:normal}
.wt-logo-tag{font-size:8px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin-top:1px}
.wt-lbl{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--red);line-height:1;margin-bottom:2px}

.wt-ibtn{
  width:38px;height:38px;border-radius:var(--rs);
  background:var(--bg);border:1px solid var(--border);
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:var(--navy);text-decoration:none;flex-shrink:0;padding:0;
  transition:background var(--ease);position:relative;
}
.wt-ibtn:hover{background:var(--border);color:var(--navy)}
.wt-ibtn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}

.wt-cart{
  height:38px;min-width:38px;border-radius:var(--rs);
  background:var(--bg);border:1px solid var(--border);
  display:flex;align-items:center;gap:5px;padding:0 10px;
  text-decoration:none;color:var(--navy);flex-shrink:0;
  transition:background var(--ease);
}
.wt-cart:hover{background:var(--border)}
.wt-cart svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;flex-shrink:0}
.wt-cart-n{font-size:13px;font-weight:700;line-height:1}
.wt-cart-t{font-size:11px;color:var(--muted);white-space:nowrap}

body.sb-hidden .wt-hamburger{background:var(--navy)!important;border-color:var(--navy)!important}
body.sb-hidden .wt-hamburger svg{stroke:white!important}
@media(max-width:1023px){
  body.sb-open .wt-hamburger{background:var(--navy)!important;border-color:var(--navy)!important}
  body.sb-open .wt-hamburger svg{stroke:white!important}
}

/* ═══ LAYOUT ════════════════════════════════════════════════ */
:root{--max-w:1400px}
#page{
  display:flex;flex-direction:column;min-height:100vh;
  padding-top:var(--hh);
  width:100%;
}
body.admin-bar #page{padding-top:calc(var(--hh) + 32px)}
@media(max-width:782px){body.admin-bar #page{padding-top:calc(var(--hh) + 46px)}}
@media(min-width:1024px){
  body:not(.sb-hidden) #page{padding-left:calc(var(--sb) + 24px)}
}

/* ═══ SIDEBAR ═══════════════════════════════════════════════ */
#wt-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:198}
body.sb-open #wt-overlay{display:block}

#wt-sidebar{
  position:fixed;top:var(--hh);
  left:0;
  width:var(--sb);height:calc(100vh - var(--hh));
  background:var(--bg);border-right:1px solid var(--border);
  z-index:199;overflow-y:auto;padding:12px 10px 60px;
  transition:transform var(--ease);
}
#wt-sidebar::-webkit-scrollbar{width:3px}
#wt-sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
@media(min-width:1024px){
  #wt-sidebar{transform:translateX(0)}
  body.sb-hidden #wt-sidebar{transform:translateX(-100%)}
}
@media(max-width:1023px){
  #wt-sidebar{transform:translateX(-100%)}
  body.sb-open #wt-sidebar{transform:translateX(0)}
}

/* Admin-Bar Offset */
body.admin-bar #wt-sidebar{top:calc(var(--hh) + 32px)!important;height:calc(100vh - var(--hh) - 32px)!important}
@media(max-width:782px){
  body.admin-bar #wt-sidebar{top:calc(var(--hh) + 46px)!important;height:calc(100vh - var(--hh) - 46px)!important}
}

/* Sidebar Inhalt */
.sb-search{display:flex!important;align-items:center!important;gap:7px!important;background:var(--white)!important;border:1px solid var(--border)!important;border-radius:var(--rs)!important;padding:0 10px!important;height:36px!important;margin-bottom:12px!important}
.sb-search svg{width:14px!important;height:14px!important;stroke:var(--muted)!important;fill:none!important;stroke-width:2!important;flex-shrink:0!important}
#wt-sidebar .sb-search input,
#wt-sidebar .sb-search input[type="text"]{background:none!important;border:none!important;outline:none!important;font-size:13px!important;font-family:var(--font)!important;color:var(--text)!important;width:100%!important;padding:0!important;margin:0!important;height:auto!important;min-height:0!important;max-height:none!important;box-shadow:none!important;border-radius:0!important;line-height:normal!important}
.sb-search input::placeholder{color:var(--muted)!important}
.sb-lbl{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:8px 8px 3px;display:block}
.sb-div{height:1px;background:var(--border);margin:6px 0}

.sb-nav{list-style:none;margin:0;padding:0}
.sb-nav>li{margin:1px 0}
.sb-nav>li>a{
  display:flex;align-items:center;gap:7px;padding:7px 10px;
  border-radius:var(--rs);font-size:13px;font-weight:500;color:var(--text);
  text-decoration:none;width:100%;transition:background var(--ease),color var(--ease);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.sb-nav>li>a:hover{background:rgba(44,47,126,.06);color:var(--navy)}
.sb-nav>li>a.active{background:var(--navy);color:white}
.sb-nav>li>a svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;flex-shrink:0;opacity:.7}
.sb-nav>li>a.active svg{opacity:1}

/* Gewerk: Link + Pfeil getrennt */
.sb-gewerk{display:flex;align-items:stretch;border-radius:var(--rs);overflow:hidden;margin:1px 0}
.sb-gewerk-a{
  flex:1;display:flex;align-items:center;gap:7px;
  padding:7px 4px 7px 10px;font-size:13px;font-weight:500;
  color:var(--text);text-decoration:none;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:background var(--ease),color var(--ease);
}
.sb-gewerk-a:hover{background:rgba(44,47,126,.06);color:var(--navy)}
.sb-gewerk-a.active{background:var(--navy);color:white}
.sb-gewerk-a svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;flex-shrink:0;opacity:.7}
.sb-gewerk-a.active svg{opacity:1}
.sb-gewerk-t{
  width:28px;border:none;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;padding:0;transition:background var(--ease);
}
.sb-gewerk-t:hover{background:rgba(44,47,126,.08)}
.sb-gewerk-a.active~.sb-gewerk-t{background:rgba(255,255,255,.15)}
.sb-gewerk-a.active~.sb-gewerk-t:hover{background:rgba(255,255,255,.25)}
.sb-chev{width:11px;height:11px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;transition:transform .2s,stroke var(--ease)}
.sb-gewerk-a.active~.sb-gewerk-t .sb-chev{stroke:white}

/* Sub-Menu */
.sb-sub{display:none;list-style:none;padding:2px 0 4px 0;margin:0}
.sb-gewerk-wrap.open .sb-chev{transform:rotate(180deg)}
.sb-gewerk-wrap.open>.sb-sub{display:block}
.sb-sub>li{margin:1px 0}
.sb-sub>li>a{
  display:flex;align-items:center;gap:6px;
  padding:5px 8px 5px 20px;font-size:12px;font-weight:500;
  color:var(--muted);text-decoration:none;border-radius:6px;
  transition:background var(--ease),color var(--ease);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.sb-sub>li>a:hover{background:rgba(44,47,126,.06);color:var(--navy)}
.sb-sub>li>a.active{color:var(--navy);font-weight:600}
.sb-sub>li>a svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0}

/* Produkte mit aufklappbaren Kategorien */
.sb-prod-row{display:flex;align-items:stretch;border-radius:6px;overflow:hidden;margin:1px 0}
.sb-prod-a{
  flex:1;display:flex;align-items:center;gap:6px;
  padding:5px 4px 5px 20px;font-size:12px;font-weight:500;
  color:var(--muted);text-decoration:none;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:background var(--ease),color var(--ease);
}
.sb-prod-a:hover{color:var(--navy)}
.sb-prod-a.active{color:var(--navy);font-weight:600}
.sb-prod-a svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0}
.sb-prod-t{width:22px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0}
.sb-chev2{width:9px;height:9px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;transition:transform .2s}
.sb-prod-wrap.open .sb-chev2{transform:rotate(180deg)}
.sb-prod-wrap.open>.sb-cats{display:block}
.sb-cats{display:none;list-style:none;padding:2px 0 4px 30px;margin:0}
.sb-cats>li>a{
  display:block;padding:3px 8px;font-size:11px;color:var(--muted);
  border-radius:5px;text-decoration:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:background var(--ease),color var(--ease);
}
.sb-cats>li>a:hover{background:rgba(44,47,126,.06);color:var(--navy)}
.sb-cats>li>a.active{color:var(--red);font-weight:600}
/* Tiefere Unterkategorien */
.sb-cats-deep{display:none;list-style:none;padding:2px 0 2px 10px;margin:0}
.sb-cat-row{display:flex;align-items:center;gap:2px}
.sb-cat-row>a{flex:1;display:block;padding:3px 8px;font-size:11px;color:var(--muted);border-radius:5px;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background var(--ease),color var(--ease)}
.sb-cat-row>a:hover{background:rgba(44,47,126,.06);color:var(--navy)}
.sb-cat-row>a.active{color:var(--red);font-weight:600}
.sb-cat-toggle{width:18px;height:18px;border:none;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0;color:var(--muted);transition:transform var(--ease)}
.sb-cat-item.open>.sb-cat-row>.sb-cat-toggle{transform:rotate(180deg)}
.sb-cat-item.open>.sb-cats-deep{display:block}

/* ═══ CONTENT ═══════════════════════════════════════════════ */
#content,.site-content{padding:0!important;width:100%!important;overflow:visible!important}
#content>.col-full{padding:20px 32px 60px 32px!important;max-width:var(--max-w)!important;margin-left:auto!important;margin-right:auto!important;width:100%!important;box-sizing:border-box!important;overflow:visible!important}
#primary,#main,.content-area{padding:0!important;width:100%!important;float:none!important}
#secondary.widget-area{display:none!important}
.woocommerce-breadcrumb,.storefront-breadcrumb{display:none!important}
.entry-title,.page-title{font-size:22px!important;font-weight:800!important;margin:0 0 16px!important}
/* Checkout/Cart: Header + Titel komplett ausblenden */
body.woocommerce-checkout .entry-header,
body.woocommerce-cart .entry-header{display:none!important}
/* Checkout/Cart: entry-content ohne weiße Box */
body.woocommerce-checkout .entry-content,
body.woocommerce-cart .entry-content{background:transparent!important;box-shadow:none!important;padding:0!important}
/* Checkout/Cart: edit-link ausblenden */
body.woocommerce-checkout .edit-link,
body.woocommerce-cart .edit-link{display:none!important}
.entry-content{background:var(--white);border-radius:var(--r);box-shadow:var(--sh);padding:28px;line-height:1.75}
/* WC Loop wrapper: keine float-basierten Breiten */
.woocommerce-page #content #primary{width:100%!important}
/* WC-Archiv: #primary Padding = gleich wie Startseite (kein extra links/rechts, nur oben/unten) */
body.tax-product_cat>#page>#primary,
body.post-type-archive-product>#page>#primary{
  padding:20px 0 60px 0!important;max-width:var(--max-w)!important;box-sizing:border-box!important;
}

/* Portal-Seite: entry-content ohne weiße Box – Kacheln direkt auf grauem BG */
.entry-content:has(.wagtec-dd){background:transparent!important;box-shadow:none!important;padding:0!important;line-height:1!important}

/* WC-Archiv/Kategorie: kein weißer Box-Container, gleich wie Portal */
.woocommerce-page.archive .entry-content,
.woocommerce-page.tax-product_cat .entry-content,
.woocommerce-page.post-type-archive-product .entry-content,
body.tax-product_cat #main,
body.post-type-archive-product #main{
  background:transparent!important;box-shadow:none!important;padding:0!important;
}
/* Page-title: Startseiten-Stil für Kategorie-Seiten */
.woocommerce-page.archive .woocommerce-result-count,
.woocommerce-page.archive .woocommerce-ordering{display:none!important}
body.tax-product_cat .woocommerce-products-header{
  display:block!important;margin-bottom:4px!important;
}
body.tax-product_cat .woocommerce-products-header__title.page-title{
  display:block!important;
  font-size:24px!important;font-weight:800!important;
  letter-spacing:-.02em!important;margin:0 0 4px!important;
  color:var(--text)!important;text-align:left!important;
}
/* WC-Archiv: alle inneren Container-Paddings resetten */
body.tax-product_cat #primary .woocommerce,
body.post-type-archive-product #primary .woocommerce,
body.tax-product_cat #primary article,
body.tax-product_cat #primary .hentry{
  padding:0!important;margin:0!important;background:transparent!important;box-shadow:none!important;
}
/* Storefront Sorting/Leerraum zwischen Heading und Kacheln entfernen */
.storefront-sorting{display:none!important}
/* Produkt-Navigation (Blättern) ausblenden */
.storefront-product-pagination{display:none!important}

/* ═══ KACHELN ═══════════════════════════════════════════════ */
/* Einheitliches Layout für WC-Archiv: Flexbox statt Grid (Storefront Grid-Bug) */
.woocommerce ul.products{
  display:flex!important;flex-wrap:wrap!important;gap:16px!important;
  list-style:none!important;margin:0!important;padding:0!important;
  width:100%!important;float:none!important;clear:both!important;
}
.woocommerce ul.products li.product{
  float:none!important;clear:none!important;margin:0!important;
  width:calc((100% - 64px) / 5)!important;flex-shrink:0!important;
}
@media(max-width:1200px){
  .woocommerce ul.products li.product{width:calc((100% - 48px) / 4)!important}
}
@media(max-width:900px){
  .woocommerce ul.products li.product{width:calc((100% - 32px) / 3)!important}
}
@media(max-width:600px){
  .woocommerce ul.products li.product{width:calc((100% - 16px) / 2)!important}
}
/* Portal/wagtec Grids: behalten CSS Grid */
.wt-grid,.wagtec-grid{
  display:grid!important;grid-template-columns:repeat(6,1fr)!important;
  gap:16px!important;list-style:none!important;margin:0!important;padding:0!important;
  align-items:start!important;width:100%!important;
}
@media(max-width:1200px){.wt-grid,.wagtec-grid{grid-template-columns:repeat(4,1fr)!important}}
@media(max-width:900px){.wt-grid,.wagtec-grid{grid-template-columns:repeat(3,1fr)!important}}
@media(max-width:600px){
  .wt-grid,.wagtec-grid,.woocommerce ul.products{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
}
/* Mobile (<400px iPhone-SE/Mini): 2 Spalten beibehalten — Single-Column wirkt zu leer
   und 2 Kacheln nebeneinander gehen problemlos auch auf 320px breiten Screens. */
@media(max-width:400px){
  .wt-grid,.wagtec-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .woocommerce ul.products li.product{width:calc((100% - 8px) / 2)!important}
}

/* Storefront-Override (Bug 07.05.): "first" + "last" Klassen am ersten/letzten Produkt
   im Shop-Listing erzwingen auf Mobile einen `clear: both` + Full-Width was zu
   "1 Kachel alleine, dann 2-spaltig" führt. Hier rückgängig machen. */
@media(max-width:768px){
  body.woocommerce ul.products,
  body .woocommerce ul.products{
    display:flex!important;flex-wrap:wrap!important;gap:10px!important;
    list-style:none!important;margin:0!important;padding:0!important;
  }
  body.woocommerce ul.products li.product,
  body.woocommerce ul.products li.product.first,
  body.woocommerce ul.products li.product.last,
  body .woocommerce ul.products li.product,
  body .woocommerce ul.products li.product.first,
  body .woocommerce ul.products li.product.last{
    width:calc((100% - 10px) / 2)!important;
    clear:none!important;float:none!important;
    margin:0!important;
  }
}
/* Storefront's ::before/::after Pseudo-Elemente (display:table für Clearfix)
   werden im Flex/Grid-Container zu Items und schieben das 1. Produkt
   um eine Spalte nach rechts → falsche Anordnung. Universell unterdrücken
   (nicht nur mobile, sondern auch für related/upsells im Single-Product). */
body.woocommerce ul.products::before,
body.woocommerce ul.products::after,
body .woocommerce ul.products::before,
body .woocommerce ul.products::after{
  content:none!important;display:none!important;
}

@media(max-width:400px){
  body.woocommerce ul.products,
  body .woocommerce ul.products{gap:8px!important}
  body.woocommerce ul.products li.product,
  body.woocommerce ul.products li.product.first,
  body.woocommerce ul.products li.product.last,
  body .woocommerce ul.products li.product,
  body .woocommerce ul.products li.product.first,
  body .woocommerce ul.products li.product.last{
    width:calc((100% - 8px) / 2)!important;
  }
}

/* Kachel – einheitlicher Look */
.wt-card,
.woocommerce ul.products li.product,
.wagtec-card {
  background:var(--white)!important;
  border-radius:var(--r)!important;
  overflow:hidden!important;
  box-shadow:var(--sh2)!important;
  display:flex!important;flex-direction:column!important;
  border:1.5px solid transparent!important;
  transition:transform var(--ease),border-color var(--ease)!important;
  text-decoration:none!important;color:inherit!important;
  cursor:pointer;margin:0!important;padding:0!important;
  height:auto!important;min-height:0!important;
}
.wt-card:hover,
.woocommerce ul.products li.product:hover,
.wagtec-card:hover {
  transform:translateY(-3px)!important;
  border-color:var(--navy)!important;
  color:inherit!important;
}

/* Kachel Bild-Bereich – aspect-ratio 4:3, einheitlich für alle Kachel-Typen */
.wt-card-img,.wagtec-media{
  padding:12px 12px 0!important;
  aspect-ratio:4/3!important;height:auto!important;
  box-sizing:border-box!important;overflow:hidden!important;flex-shrink:0!important;
}
.wt-card-img img,.wagtec-img,
.woocommerce ul.products li.product img{
  width:100%!important;height:140px!important;
  min-height:0!important;max-height:140px!important;
  object-fit:contain!important;background:#fff!important;
  border-radius:10px!important;display:block!important;padding:6px!important;
  margin:0!important;
}
.woocommerce ul.products li.product a.woocommerce-loop-product__link{
  display:block!important;
  padding:12px 12px 0!important;
  aspect-ratio:auto!important;height:auto!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  flex-shrink:0!important;
}

/* Kachel Body */
.wt-card-body,.wagtec-body{
  padding:10px 12px 12px!important;
  display:flex!important;flex-direction:column!important;gap:6px!important;flex:1!important;
}
.wt-card-name,.wagtec-name{
  font-size:14px!important;font-weight:700!important;margin:0!important;
  color:var(--text)!important;display:-webkit-box!important;
  -webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;
  overflow:hidden!important;min-height:2.2em!important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:14px!important;font-weight:700!important;padding:0 12px 4px!important;
  color:var(--text)!important;margin:0!important;
  display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;
  word-break:break-word!important;
  white-space:normal!important;
}
/* WC Subkategorie-Kacheln (Storefront rendert sie) */
.woocommerce ul.products li.product-category .woocommerce-loop-category__title{
  font-size:14px!important;font-weight:700!important;padding:0 12px 8px!important;
  color:var(--text)!important;margin:0!important;word-break:break-word!important;
  white-space:normal!important;
}
.wt-card-meta,.wagtec-meta{
  margin-top:auto!important;display:flex!important;
  align-items:center!important;justify-content:space-between!important;
}
.wt-card-cta,.wagtec-cta{
  font-size:10px!important;letter-spacing:.18em!important;
  text-transform:uppercase!important;color:var(--muted)!important;font-weight:700!important;
}
.wt-card:hover .wt-card-cta,.wagtec-card:hover .wagtec-cta{color:var(--navy)!important}
.wt-arrow,.wagtec-arrow{
  width:28px!important;height:28px!important;border-radius:50%!important;
  background:#eef2ff!important;display:inline-flex!important;
  align-items:center!important;justify-content:center!important;
  color:var(--navy)!important;font-size:14px!important;line-height:1!important;
  transition:background var(--ease),color var(--ease)!important;
}
.wt-card:hover .wt-arrow,.wagtec-card:hover .wagtec-arrow{background:var(--navy)!important;color:white!important}
.wt-card-price,.wagtec-price{font-weight:700!important;color:var(--navy)!important;font-size:13px!important}
.woocommerce ul.products li.product .price{
  padding:0 12px 6px!important;color:var(--navy)!important;
  font-weight:700!important;font-size:13px!important;display:block!important;
}
.woocommerce ul.products li.product .button{
  margin:0 12px 12px!important;width:calc(100% - 24px)!important;
  background:var(--red)!important;color:white!important;
  border-radius:var(--rs)!important;font-size:12px!important;
  font-weight:600!important;text-align:center!important;
  padding:8px!important;display:block!important;
  transition:background var(--ease)!important;
}
.woocommerce ul.products li.product .button:hover{background:var(--red-d)!important}

/* Wagtec Suite Topbar + Breadcrumbs: im Child-Theme Context verstecken */
.wagtec-child .wagtec-topbar{display:none!important}
.wagtec-child .wagtec-bc,.wagtec-child .wagtec-bc-bottom{display:none!important}
.wagtec-bc a,.wagtec-bc-bottom a{color:var(--navy)}
.wagtec-bc a:hover,.wagtec-bc-bottom a:hover{color:var(--red)}
.wagtec-bc span,.wagtec-bc-bottom span{color:var(--border)}
/* Portal-Logo in BC verstecken */
.wagtec-bc-logo img{display:none!important}
.wagtec-bc-logo::after{content:'Portal';color:var(--navy);font-size:12px}
.wagtec-error{padding:12px 14px;border:1px solid #fecaca;background:#fff1f2;border-radius:var(--rs);color:#991b1b}
.wagtec-box{background:var(--white);border-radius:var(--r);box-shadow:var(--sh2);padding:20px}
.wagtec-dd{max-width:100%;margin:0;padding:0}
.wagtec-dd.wagtec-loading{opacity:.65;pointer-events:none}
/* Store grid = unser grid – auto-fill wie alle anderen Grids
   ENTFERNT (07.05.): überschrieb alle @media-Spaltenregeln oben weil source-order
   später war → mobile zeigte fälschlich 1 Spalte mit 358px breitem Item.
   Die @media-cascade weiter oben gibt eh schon das gewünschte 6/4/3/2-Spalten-Verhalten.
.wagtec-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))!important;grid-auto-rows:auto!important}
*/

/* ═══ WOOCOMMERCE GLOBAL ════════════════════════════════════ */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{
  background:var(--red)!important;color:white!important;border:none!important;
  border-radius:var(--rs)!important;font-family:var(--font)!important;
  font-size:13px!important;font-weight:600!important;padding:10px 20px!important;
  transition:background var(--ease)!important;cursor:pointer!important;
}
.woocommerce a.button:hover,.woocommerce button.button:hover{background:var(--red-d)!important;color:white!important}
.woocommerce a.button.alt,.woocommerce button.button.alt{background:var(--navy)!important}
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover{background:var(--navy-d)!important}

/* Auftraege-Tabelle: Auftragsnummer sichtbar auf dunklem Hintergrund */
.woocommerce-orders-table__cell-order-number{background:var(--navy)!important;color:#fff!important}
.woocommerce-orders-table__cell-order-number a{color:#fff!important;font-weight:700!important;text-decoration:none!important}
.woocommerce-orders-table__cell-order-number a:hover{text-decoration:underline!important}

.woocommerce input[type=text],.woocommerce input[type=email],.woocommerce input[type=password],.woocommerce input[type=number],.woocommerce input[type=tel],.woocommerce textarea,.woocommerce select{
  border:1px solid var(--border)!important;border-radius:var(--rs)!important;
  padding:9px 12px!important;font-family:var(--font)!important;
  font-size:14px!important;color:var(--text)!important;background:var(--white)!important;width:100%!important;
}
.woocommerce input:focus,.woocommerce textarea:focus,.woocommerce select:focus{
  border-color:#2b58ff!important;outline:none!important;
  box-shadow:0 0 0 3px rgba(43,88,255,.1)!important;
}
.woocommerce-message{background:#dcfce7!important;border-top:3px solid #16a34a!important;color:#15803d!important;border-radius:var(--rs)!important;padding:12px 16px!important;margin-bottom:16px!important;position:relative}
/* Bug #2149: Info/Error-Icons in WC Mein-Konto Meldungen sauber positionieren (überlappten Text) */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before{position:relative!important;float:none!important;display:inline-block!important;margin-right:8px!important;top:auto!important;left:auto!important}
.woocommerce-info{background:#eff6ff!important;border-top:3px solid #2b58ff!important;color:#1e40af!important;padding:14px 18px!important;border-radius:8px!important;margin-bottom:16px!important;display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important}
.woocommerce-info a{color:#2b58ff!important;margin-left:auto!important}
.woocommerce-info{background:#dbeafe!important;border-top:3px solid #2563eb!important;color:#1d4ed8!important;border-radius:var(--rs)!important;padding:12px 16px!important;margin-bottom:16px!important}
.woocommerce-error{background:#fee2e2!important;border-top:3px solid var(--red)!important;color:#dc2626!important;border-radius:var(--rs)!important;padding:12px 16px!important;margin-bottom:16px!important}
.woocommerce table.shop_table{border:none!important;border-radius:var(--r)!important;overflow:hidden!important;box-shadow:var(--sh)!important;width:100%!important;border-collapse:separate!important;border-spacing:0!important}
.woocommerce table.shop_table th{background:var(--navy)!important;color:white!important;font-size:11px!important;font-weight:600!important;letter-spacing:.05em!important;text-transform:uppercase!important;padding:11px 14px!important;border:none!important}
.woocommerce table.shop_table td{padding:12px 14px!important;border-color:var(--border)!important;background:var(--white)!important;vertical-align:middle!important}
mark.processing{background:#dcfce7!important;color:#15803d!important;padding:3px 10px!important;border-radius:100px!important;font-size:11px!important;font-weight:600!important}
mark.completed{background:#dbeafe!important;color:#1d4ed8!important;padding:3px 10px!important;border-radius:100px!important;font-size:11px!important;font-weight:600!important}
mark.pending,mark.on-hold{background:#fef3c7!important;color:#b45309!important;padding:3px 10px!important;border-radius:100px!important;font-size:11px!important;font-weight:600!important}
mark.cancelled{background:#fee2e2!important;color:#dc2626!important;padding:3px 10px!important;border-radius:100px!important;font-size:11px!important;font-weight:600!important}
/* ═══ SINGLE PRODUCT (DESKTOP) ══════════════════════════════════ */
/* Container an Portal-Layout angleichen: max-width var(--max-w), zentriert */
body.single-product #main,
body.single-product #content,
body.single-product .content-area{
  max-width:var(--max-w)!important;margin:0 auto!important;
  padding-left:24px!important;padding-right:24px!important;box-sizing:border-box!important;
}
.single-product div.product{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)!important;
  gap:24px!important;float:none!important;width:100%!important;
  align-items:stretch!important;
  margin:0 auto 24px auto!important;max-width:var(--max-w)!important;
}
.single-product div.product > .woocommerce-product-gallery,
.single-product div.product .woocommerce-product-gallery{
  grid-column:1!important;grid-row:1!important;
  background:var(--white)!important;border-radius:var(--r)!important;
  box-shadow:var(--sh2)!important;padding:20px!important;
  float:none!important;width:100%!important;max-width:100%!important;
  margin:0!important;box-sizing:border-box!important;
  align-self:stretch!important;
  display:flex!important;flex-direction:column!important;
}
/* Wrapper bekommt flex-grow, damit die Bildfläche den vollen verfügbaren
   Platz der Galerie-Karte einnimmt (gleicht Höhe der Summary-Karte aus). */
.single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper{
  flex:1 1 auto!important;display:flex!important;flex-direction:column!important;
}
.single-product div.product .woocommerce-product-gallery .flex-viewport{
  flex:1 1 auto!important;
}
/* Nur der äußere Viewport bekommt min-height + Hintergrund — NICHT die einzelnen
   Slides, sonst überschreibt display:flex !important das display:none, das
   Flexslider zum Verstecken nicht-aktiver Slides nutzt → alle Bilder sichtbar. */
.single-product div.product .woocommerce-product-gallery .flex-viewport{
  border-radius:8px!important;overflow:hidden!important;
  background:var(--bg)!important;width:100%!important;float:none!important;
  min-height:320px!important;
}
/* WICHTIG: weder width:100% noch float:none auf .__image — Flexslider setzt
   inline float:left + width:<viewport>px, damit Slides nebeneinander liegen
   und die viewport-overflow:hidden Maske die Slideshow erzeugt. */
.single-product div.product .woocommerce-product-gallery__image{
  background:var(--bg)!important;
}
.single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper{
  display:block!important;
}
.single-product div.product .woocommerce-product-gallery img{
  width:100%!important;height:auto!important;display:block!important;
  object-fit:contain!important;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs{
  display:grid!important;grid-template-columns:repeat(6,1fr)!important;
  gap:8px!important;margin:12px 0 0 0!important;padding:0!important;
  list-style:none!important;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li{
  width:100%!important;margin:0!important;float:none!important;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs img{
  border-radius:6px!important;border:2px solid var(--border)!important;
  cursor:pointer!important;opacity:.75!important;transition:opacity var(--ease),border-color var(--ease)!important;
  width:100%!important;aspect-ratio:1/1!important;object-fit:cover!important;
}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs img:hover{opacity:1!important}
.single-product div.product .woocommerce-product-gallery .flex-control-thumbs img.flex-active{
  border-color:var(--red)!important;opacity:1!important;
}
.single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__trigger{
  background:rgba(255,255,255,.92)!important;border-radius:50%!important;
  width:36px!important;height:36px!important;display:flex!important;align-items:center!important;justify-content:center!important;
  box-shadow:var(--sh)!important;top:12px!important;right:12px!important;
  font-size:18px!important;text-decoration:none!important;color:var(--navy)!important;
}

.single-product div.product > .summary,
.single-product div.product .summary,
.single-product div.product .entry-summary{
  grid-column:2!important;grid-row:1!important;
  background:var(--white)!important;border-radius:var(--r)!important;
  box-shadow:var(--sh2)!important;padding:28px!important;
  float:none!important;width:100%!important;max-width:100%!important;
  margin:0!important;box-sizing:border-box!important;
  align-self:stretch!important;
  display:flex!important;flex-direction:column!important;
}
.single-product .product_title{
  font-size:28px!important;font-weight:800!important;color:var(--text)!important;
  margin:0 0 6px 0!important;word-break:break-word!important;letter-spacing:-.02em!important;
  line-height:1.2!important;
}
.single-product .summary .price,
.single-product div.product .price{
  font-size:28px!important;font-weight:800!important;color:var(--red)!important;
  margin:0 0 14px 0!important;line-height:1.15!important;
}
.single-product .summary .price del{font-size:16px!important;opacity:.55!important;font-weight:600!important;color:var(--muted)!important;margin-right:8px!important}
.single-product .summary .price ins{text-decoration:none!important;background:transparent!important}
.single-product .summary .woocommerce-product-details__short-description{
  font-size:15px!important;line-height:1.55!important;color:var(--text)!important;
  margin:0 0 18px 0!important;padding:0 0 16px 0!important;
  border-bottom:1px solid var(--border)!important;
}
.single-product .summary .woocommerce-product-details__short-description p{margin:0 0 8px 0!important}
.single-product .summary .woocommerce-product-details__short-description p:last-child{margin-bottom:0!important}

/* Variations Tabelle */
.single-product div.product table.variations{
  width:100%!important;margin:0 0 14px 0!important;
  border:none!important;background:transparent!important;
}
.single-product div.product table.variations tr{display:block!important;margin-bottom:10px!important}
.single-product div.product table.variations td,
.single-product div.product table.variations th{
  display:block!important;width:100%!important;padding:0!important;
  border:none!important;background:transparent!important;text-align:left!important;
}
.single-product div.product table.variations th{
  font-size:12px!important;font-weight:700!important;color:var(--muted)!important;
  text-transform:uppercase!important;letter-spacing:.04em!important;margin-bottom:4px!important;
}
.single-product div.product table.variations select{
  width:100%!important;height:44px!important;padding:0 12px!important;
  border:1.5px solid var(--border)!important;border-radius:var(--r)!important;
  background:var(--white)!important;font-size:15px!important;color:var(--text)!important;
  box-sizing:border-box!important;cursor:pointer!important;
  transition:border-color var(--ease)!important;
}
.single-product div.product table.variations select:focus{border-color:var(--red)!important;outline:none!important}
.single-product .reset_variations{font-size:12px!important;color:var(--muted)!important;margin-top:6px!important;display:inline-block!important}

/* Add-to-Cart */
.single-product div.product form.cart{
  display:flex!important;flex-wrap:wrap!important;align-items:center!important;
  gap:10px!important;margin:0 0 16px 0!important;padding:0!important;
}
.single-product div.product form.cart .quantity{
  margin:0!important;float:none!important;
  display:flex!important;align-items:center!important;
}
.single-product div.product form.cart .quantity input.qty,
.single-product div.product form.cart input.qty{
  width:90px!important;height:52px!important;
  font-size:17px!important;font-weight:600!important;text-align:center!important;
  padding:0 10px!important;border:1.5px solid var(--border)!important;
  border-radius:var(--r)!important;background:var(--white)!important;
  box-sizing:border-box!important;
}
.single-product div.product form.cart .quantity input.qty:focus{border-color:var(--red)!important;outline:none!important}
.single-product div.product form.cart button.single_add_to_cart_button,
.single-product div.product form.cart .single_add_to_cart_button{
  flex:1 1 auto!important;min-width:200px!important;
  height:52px!important;padding:0 28px!important;
  font-size:15px!important;font-weight:700!important;
  border-radius:var(--r)!important;
  background:var(--red)!important;color:var(--white)!important;
  border:none!important;cursor:pointer!important;
  text-transform:none!important;letter-spacing:0!important;
  box-shadow:0 4px 12px rgba(204,18,48,.25)!important;
  transition:background var(--ease),transform var(--ease),box-shadow var(--ease)!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
}
.single-product div.product form.cart button.single_add_to_cart_button:hover{
  background:var(--red-d)!important;transform:translateY(-1px)!important;
  box-shadow:0 6px 16px rgba(204,18,48,.32)!important;
}
.single-product div.product form.cart button.single_add_to_cart_button:active{transform:translateY(0)!important}
.single-product div.product form.cart button.single_add_to_cart_button.disabled,
.single-product div.product form.cart button.single_add_to_cart_button:disabled,
.single-product div.product form.cart button.single_add_to_cart_button.wc-variation-selection-needed{
  background:#94a3b8!important;color:var(--white)!important;
  opacity:1!important;cursor:not-allowed!important;
  box-shadow:none!important;transform:none!important;
}
.single-product div.product form.cart button.single_add_to_cart_button.disabled:hover,
.single-product div.product form.cart button.single_add_to_cart_button.wc-variation-selection-needed:hover{
  background:#94a3b8!important;transform:none!important;box-shadow:none!important;
}
/* Hinweis "Bitte Variante wählen" */
.single-product div.product form.cart .woocommerce-variation-add-to-cart-disabled{opacity:1!important}
.single-product div.product form.cart .single_variation_wrap .woocommerce-variation-price{
  font-size:24px!important;font-weight:800!important;color:var(--red)!important;
  margin:0 0 12px 0!important;
}
.single-product div.product form.cart .single_variation_wrap .woocommerce-variation-availability{
  font-size:13px!important;color:var(--muted)!important;margin:0 0 10px 0!important;
}

/* Trust-Liste unter dem Button (wir montieren, versenden nicht).
   margin-top:auto schiebt die Zeile in einer Flex-Spalte ans untere Ende
   → Summary füllt die Galerie-Höhe sauber aus. */
.single-product .summary::after{
  content:"✓ Bezahlung erst nach Leistung  •  ✓ Persönlicher Service vor Ort  •  ✓ Montage durch Meisterbetrieb";
  display:block;font-size:12px;color:var(--muted);
  margin-top:auto;padding-top:14px;border-top:1px solid var(--border);
  line-height:1.6;letter-spacing:.01em;
}

/* Product Meta */
.single-product div.product .product_meta{
  margin:14px 0 0 0!important;padding:14px 0 0 0!important;
  border-top:1px solid var(--border)!important;
  font-size:12px!important;color:var(--muted)!important;line-height:1.7!important;
}
.single-product div.product .product_meta > span{display:block!important}
.single-product div.product .product_meta a{color:var(--text)!important;font-weight:500!important}
.single-product div.product .product_meta a:hover{color:var(--red)!important}

/* Tabs */
.single-product .related.products,
.single-product .upsells.products{grid-column:1/-1!important;margin:32px 0 0 0!important;clear:both!important}
.single-product div.product .woocommerce-tabs{
  grid-column:1/-1!important;background:var(--white)!important;
  border-radius:var(--r)!important;box-shadow:var(--sh2)!important;
  padding:16px!important;margin:24px 0 0 0!important;
  display:flex!important;flex-direction:column!important;
}
.single-product div.product .woocommerce-tabs ul.tabs{
  display:flex!important;flex-wrap:wrap!important;gap:6px!important;
  margin:0 0 16px 0!important;padding:0!important;border:none!important;background:transparent!important;
  float:none!important;width:100%!important;
}
.single-product div.product .woocommerce-tabs .woocommerce-Tabs-panel,
.single-product div.product .woocommerce-tabs .panel{
  float:none!important;width:100%!important;clear:both!important;
}
.single-product div.product .woocommerce-tabs ul.tabs::before,
.single-product div.product .woocommerce-tabs ul.tabs::after{display:none!important}
.single-product div.product .woocommerce-tabs ul.tabs li{
  background:var(--bg)!important;border:none!important;border-radius:10px!important;
  margin:0!important;padding:0!important;
  transition:background var(--ease)!important;
}
.single-product div.product .woocommerce-tabs ul.tabs li:hover{background:#e6e9f0!important}
.single-product div.product .woocommerce-tabs ul.tabs li.active{background:var(--red)!important}
.single-product div.product .woocommerce-tabs ul.tabs li a{
  padding:10px 18px!important;font-size:14px!important;font-weight:600!important;
  color:var(--text)!important;text-decoration:none!important;
}
.single-product div.product .woocommerce-tabs ul.tabs li.active a{color:var(--white)!important}
.single-product div.product .woocommerce-tabs .panel{
  padding:16px 12px!important;margin:0!important;
  font-size:15px!important;line-height:1.65!important;color:var(--text)!important;
}
.single-product div.product .woocommerce-tabs .panel h2{
  font-size:18px!important;font-weight:700!important;margin:0 0 12px 0!important;
}

/* Related Products Headline */
.single-product .related.products > h2,
.single-product .upsells.products > h2{
  font-size:20px!important;font-weight:800!important;color:var(--text)!important;
  margin:0 0 16px 0!important;
}
/* Related Products: Grid passt sich an WooCommerce columns-N Klasse an, sodass
   bei 3 Produkten 3 Spalten und nicht 4 mit Leerraum entstehen. */
.single-product .related.products ul.products,
.single-product .upsells.products ul.products{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;flex-wrap:nowrap!important;
  list-style:none!important;margin:0!important;padding:0!important;
}
.single-product .related.products ul.products.columns-1,
.single-product .upsells.products ul.products.columns-1{grid-template-columns:repeat(1,minmax(0,1fr))!important;max-width:480px!important}
.single-product .related.products ul.products.columns-2,
.single-product .upsells.products ul.products.columns-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:780px!important}
.single-product .related.products ul.products.columns-3,
.single-product .upsells.products ul.products.columns-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.single-product .related.products ul.products.columns-4,
.single-product .upsells.products ul.products.columns-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.single-product .related.products ul.products li.product,
.single-product .upsells.products ul.products li.product{
  width:auto!important;max-width:none!important;
  margin:0!important;float:none!important;clear:none!important;
}
@media(max-width:1200px){
  .single-product .related.products ul.products,
  .single-product .upsells.products ul.products,
  .single-product .related.products ul.products.columns-4,
  .single-product .upsells.products ul.products.columns-4{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:768px){
  .single-product .related.products ul.products,
  .single-product .upsells.products ul.products,
  .single-product .related.products ul.products.columns-3,
  .single-product .related.products ul.products.columns-4,
  .single-product .upsells.products ul.products.columns-3,
  .single-product .upsells.products ul.products.columns-4{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
}

/* Breadcrumb */
.single-product .woocommerce-breadcrumb{
  font-size:13px!important;color:var(--muted)!important;margin:0 0 16px 0!important;
}
.single-product .woocommerce-breadcrumb a{color:var(--navy)!important;text-decoration:none!important}
.single-product .woocommerce-breadcrumb a:hover{color:var(--red)!important}

/* Stock-Hinweis */
.single-product .stock{
  display:inline-block!important;font-size:12px!important;font-weight:700!important;
  padding:4px 10px!important;border-radius:6px!important;
  text-transform:uppercase!important;letter-spacing:.04em!important;
  margin:0 0 10px 0!important;
}
.single-product .stock.in-stock{background:#dcfce7!important;color:#166534!important}
.single-product .stock.out-of-stock{background:#fee2e2!important;color:#991b1b!important}
.single-product .stock.available-on-backorder{background:#fef3c7!important;color:#92400e!important}

@media(max-width:768px){
  .single-product div.product{grid-template-columns:1fr!important;gap:14px!important}
  .single-product div.product .summary,
  .single-product div.product .entry-summary{position:static!important;top:auto!important}
  .single-product .summary::after{font-size:11px;line-height:1.5}
}

/* ═══ CHECKOUT / CART ═══════════════════════════════════════ */
/* Standard WC Checkout mit Wagtec CSS */
.woocommerce-checkout #content>.col-full,
.woocommerce-cart #content>.col-full{
  display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start;
}
.woocommerce-checkout .woocommerce,
.woocommerce-cart .woocommerce{
  grid-column:1/-1;display:contents;
}
/* Billing/Shipping Box */
#customer_details{
  background:var(--white);border-radius:var(--r);
  box-shadow:var(--sh);padding:24px;
}
/* Order Review Box */
#order_review_heading{
  background:var(--white);border-radius:var(--r) var(--r) 0 0;
  box-shadow:0 2px 0 var(--border);padding:16px 24px 12px;
  font-size:16px;font-weight:700;margin:0!important;
}
#order_review{
  background:var(--white);border-radius:0 0 var(--r) var(--r);
  box-shadow:var(--sh);padding:0 24px 24px;
  position:sticky;top:78px;
}
/* Payment Box */
.woocommerce #payment{
  background:var(--bg)!important;border-radius:var(--r)!important;border:none!important;
}
.woocommerce #payment div.payment_box{background:rgba(44,47,126,.04)!important;border-radius:var(--rs)!important}
/* Cart Table */
.woocommerce-cart-form{grid-column:1;background:var(--white);border-radius:var(--r);box-shadow:var(--sh);padding:20px}
.cart-collaterals{grid-column:2;background:var(--white);border-radius:var(--r);box-shadow:var(--sh);padding:20px;position:sticky;top:78px}
@media(max-width:900px){
  .woocommerce-checkout #content>.col-full,
  .woocommerce-cart #content>.col-full{grid-template-columns:1fr}
  .cart-collaterals{position:static}
}

/* ═══ MEIN KONTO ════════════════════════════════════════════ */
.woocommerce-MyAccount-navigation{display:none!important}
.woocommerce-MyAccount-content{
  background:var(--white);border-radius:var(--r);
  box-shadow:var(--sh);padding:24px;width:100%!important;float:none!important;
}
/* Mein Konto: Überschriften links ausrichten */
.woocommerce-account .entry-title,
.woocommerce-account .page-title,
.woocommerce-account h1.entry-title,
.woocommerce-account .woocommerce h1,
.woocommerce-account .woocommerce h2,
.woocommerce-account .woocommerce h3{
  text-align:left!important;margin-left:0!important;
}

/* ═══ SUITE MODULE CSS ══════════════════════════════════════ */
/* Amelia */
.el-button--primary,.am-button-primary{background-color:var(--red)!important;border-color:var(--red)!important}
.el-button--primary:hover{background-color:var(--red-d)!important;border-color:var(--red-d)!important}
.amelia-app-booking .am-step-container .am-selected{border-color:var(--red)!important}
.amelia-app-booking .el-radio__input.is-checked .el-radio__inner{border-color:var(--red)!important;background:var(--red)!important}
/* Chat */
.wt-chat-header{background:var(--navy)!important}
.wt-chat-msg-in{background:var(--bg)!important}
.wt-chat-msg-out{background:var(--navy)!important;color:white!important}
/* Wartung */
.wt-contract-status-active{background:#dcfce7!important;color:#15803d!important}
.wt-contract-status-pending{background:#fef3c7!important;color:#b45309!important}

/* ═══ PORTAL PAGE HEADER ═══════════════════════════════════ */
.wt-page-hd{margin-bottom:20px}
.wt-page-hd h1{font-size:24px!important;font-weight:800!important;letter-spacing:-.02em!important;margin:0 0 4px!important;color:var(--text)!important}
.wt-page-hd p{font-size:13px;color:var(--muted);line-height:1.5;margin:0}

/* ═══ DIVIDER ════════════════════════════════════════════════ */
.wt-divider{display:flex;align-items:center;gap:14px;margin:28px 0 20px}
.wt-divider::before,.wt-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.wt-divider span{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--navy);white-space:nowrap}

/* Portal-Buttons: max 3 Spalten */
.wt-portal-grid{grid-template-columns:repeat(4,1fr)!important}

/* ═══ GUT ZU WISSEN AKKORDEON ═══════════════════════════════ */
.wt-info-box{background:var(--white);border-radius:var(--r);box-shadow:var(--sh);margin-top:28px;overflow:hidden}
.wt-info-hd{padding:16px 22px;border-bottom:1px solid var(--border);text-align:center}
.wt-info-hd h3{font-size:16px;font-weight:700;margin:0}
.wt-acc{border-bottom:1px solid var(--border)}
.wt-acc:last-child{border-bottom:none}
.wt-acc-btn{
  width:100%;padding:13px 22px;background:none;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;
  font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--navy);transition:background var(--ease)
}
.wt-acc-btn:hover{background:var(--bg)}
.wt-acc-btn svg{width:13px;height:13px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;transition:transform .18s;flex-shrink:0}
.wt-acc.wt-acc-open .wt-acc-btn svg{transform:rotate(180deg)}
.wt-acc-body{display:none;padding:4px 22px 16px;font-size:13px;color:var(--muted);line-height:1.7}
.wt-acc-body strong{color:var(--navy)}
.wt-acc.wt-acc-open .wt-acc-body{display:block}

/* ═══ FOOTER ════════════════════════════════════════════════ */
.site-footer{
  background:#ffffff!important;border-top:3px solid var(--red)!important;
  color:#334155!important;padding:36px 0 0!important;margin-top:60px!important;
}
.site-footer .col-full{max-width:var(--max-w)!important;margin:0 auto!important;padding:0 24px!important}
.site-footer a{color:#475569!important;text-decoration:none!important;transition:color var(--ease)!important}
.site-footer a:hover{color:var(--navy)!important}
.site-footer h3{color:#0f172a!important;font-size:10px!important;font-weight:700!important;letter-spacing:.08em!important;text-transform:uppercase!important;margin-bottom:12px!important;padding:0!important;border:none!important;background:none!important}
.site-footer ul{list-style:none!important;margin:0!important;padding:0!important}
.site-footer ul li{margin-bottom:7px!important;font-size:13px!important}
.wt-ftr-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:40px;padding-bottom:28px;margin-bottom:0}
@media(max-width:768px){.wt-ftr-grid{grid-template-columns:1fr 1fr!important;gap:24px!important}}
@media(max-width:480px){.wt-ftr-grid{grid-template-columns:1fr!important}}
.wt-ftr-bottom{background:var(--navy)!important;font-size:11px;color:rgba(255,255,255,.5);width:100vw!important;position:relative!important;left:50%!important;transform:translateX(-50%)!important;padding:14px 24px!important;box-sizing:border-box!important}
.wt-ftr-bottom a{color:rgba(255,255,255,.5)!important}
.wt-ftr-bottom a:hover{color:white!important}
.wt-ftr-legal{display:flex;gap:14px}
.wt-ftr-legal a{font-size:11px!important}
.wt-ftr-name{font-size:16px;font-weight:800;color:white;margin-bottom:2px}
.wt-ftr-name em{color:var(--red);font-style:normal}
.wt-ftr-tag{font-size:10px;color:rgba(255,255,255,.35);letter-spacing:.04em;margin-bottom:14px}
.wt-ftr-brand{font-size:12px;color:rgba(255,255,255,.45);margin-bottom:6px}
.wt-ftr-brand strong{color:rgba(255,255,255,.7);display:block;font-size:13px}
.wt-ftr-contact{display:flex;flex-direction:column;gap:8px}
.wt-ftr-contact a{font-size:13px!important;display:flex!important;align-items:center!important;gap:6px!important}
.wt-ftr-contact svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.8;flex-shrink:0}

/* ═══ RESPONSIVE ════════════════════════════════════════════ */
@media(max-width:1023px){
  #content>.col-full{padding:16px 14px 60px!important}
  .wt-ftr-grid{grid-template-columns:1fr 1fr;gap:20px}
}
@media(max-width:767px){
  .wt-ftr-grid{grid-template-columns:1fr}
}

/* ═══ WC SUBKATEGORIEN (product-category) = Wagtec Kacheln ═ */
.woocommerce ul.products li.product-category {
  background:var(--white)!important;
  border-radius:var(--r)!important;
  overflow:hidden!important;
  box-shadow:var(--sh2)!important;
  border:1.5px solid transparent!important;
  transition:transform var(--ease),border-color var(--ease)!important;
  margin:0!important;padding:0!important;
}
.woocommerce ul.products li.product-category:hover {
  transform:translateY(-3px)!important;
  border-color:var(--navy)!important;
}
.woocommerce ul.products li.product-category a {
  display:flex!important;flex-direction:column!important;
  height:100%!important;text-decoration:none!important;color:inherit!important;
}
.woocommerce ul.products li.product-category img {
  width:100%!important;height:160px!important;
  object-fit:cover!important;object-position:center top!important;
  border-radius:0!important;padding:0!important;
  background:var(--bg)!important;margin:0!important;display:block!important;
}
.woocommerce ul.products li.product-category .woocommerce-loop-category__title {
  font-size:14px!important;font-weight:700!important;
  padding:10px 12px 8px!important;color:var(--text)!important;
  margin:0!important;flex:1!important;word-break:break-word!important;
  white-space:normal!important;
}
/* "mark" mit Produktanzahl ausblenden */
.woocommerce ul.products li.product-category .woocommerce-loop-category__title mark {
  background:none!important;color:var(--muted)!important;
  font-size:12px!important;font-weight:400!important;
  display:block!important;margin-top:2px!important;
}
/* "Öffnen" Button am unteren Rand */
.woocommerce ul.products li.product-category a::after {
  content:'ÖFFNEN →';
  display:block;
  padding:8px 12px 12px;
  font-size:10px;font-weight:700;letter-spacing:.18em;
  color:var(--muted);
  margin-top:auto;
}
.woocommerce ul.products li.product-category:hover a::after {
  color:var(--navy);
}

/* ═══ MOBILE OPTIMIERUNGEN ═════════════════════════════════ */
@media (max-width: 600px) {
  /* Mein Konto */
  .woocommerce-MyAccount-content { padding: 12px !important; }
  .woocommerce-orders-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .woocommerce-orders-table .button { font-size: 0.75em; padding: 6px 8px; white-space: nowrap; }

  /* Checkout */
  #customer_details { padding: 12px; }
  #order_review { padding: 0 12px 12px; }
  .woocommerce #payment { padding: 12px !important; }

  /* Header */
  .site-branding img { max-height: 32px; }
  .wt-page-hd h1 { font-size: 18px !important; }

  /* Portal */
  .wt-portal-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* Sidebar */
  #wt-sidebar { padding-top: 8px; }
  #wt-sidebar .sb-lbl { font-size: 9px; }
  #wt-sidebar .sb-nav a { font-size: 12px; padding: 6px 10px; }
}

@media (max-width: 400px) {
  /* 2 Spalten auch unter 400px (Bug Portal/Shop mobile 1-statt-2) */
  .woocommerce ul.products li.product { width: calc(50% - 4px) !important; }
  .wt-portal-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .woocommerce-orders-table .button { display: block; margin: 2px 0; text-align: center; }
}

/* Bug #3150: Einheitliche Spacing — links/rechts gleich, oben/unten gleich auf allen Seiten */
.col-full,
.site-content .col-full,
.woocommerce-page .col-full {
  padding-left: 24px !important;
  padding-right: 24px !important;
  padding-top: 24px !important;
  padding-bottom: 24px !important;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .col-full,
  .site-content .col-full,
  .woocommerce-page .col-full {
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
}
/* ═══ EINHEITLICHER PAGE-HEADER (Portal, Shop, Kategorie, Single-Product) ═══
   Roter Akzentbalken links, Titel fett, optionaler Untertitel grau.
   Greift überall: .wt-page-hd, .wt-gewerk-hd, .woocommerce-products-header,
   .woocommerce-Address-title, Account-Endpoint-Header. */
.wt-page-hd,
.wt-gewerk-hd,
.woocommerce-products-header,
body.woocommerce .page-title-wrapper,
body.woocommerce-account .entry-header,
body.woocommerce-account .woocommerce-MyAccount-content > h2:first-of-type {
  margin: 0 0 20px 0 !important;
  padding: 4px 0 4px 14px !important;
  border-left: 4px solid var(--red) !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.woocommerce-account .entry-header .entry-title,
body.woocommerce-account .entry-title {
  margin: 0 0 2px 0 !important;
  padding: 0 !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  color: var(--text) !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  border: none !important;
  background: transparent !important;
}

/* ═══ MEIN KONTO Dashboard Schnellzugriff-Karten ════════════════ */
.wt-konto-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 0 0 20px 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.wt-konto-welcome {
  background: var(--white);
  border-radius: var(--r);
  box-shadow: var(--sh2);
  padding: 20px 24px;
  font-size: 14px;
  line-height: 1.65;
  color: var(--text);
}
.wt-konto-welcome p { margin: 0 0 10px 0; }
.wt-konto-welcome p:last-child { margin-bottom: 0; }
.wt-konto-welcome a { color: var(--navy); font-weight: 600; }
.wt-konto-card {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px 18px !important;
  background: var(--white) !important;
  border-radius: var(--r) !important;
  box-shadow: var(--sh2) !important;
  border: 1.5px solid transparent !important;
  text-decoration: none !important;
  color: var(--text) !important;
  transition: transform var(--ease), border-color var(--ease), box-shadow var(--ease) !important;
}
.wt-konto-card:hover {
  transform: translateY(-2px) !important;
  border-color: var(--red) !important;
  box-shadow: 0 6px 20px rgba(204,18,48,.12) !important;
  color: var(--text) !important;
}
.wt-konto-icon {
  flex: 0 0 44px;
  width: 44px; height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(45,47,126,.08), rgba(204,18,48,.10));
  display: flex; align-items: center; justify-content: center;
  color: var(--navy);
}
.wt-konto-card:hover .wt-konto-icon {
  background: linear-gradient(135deg, rgba(204,18,48,.12), rgba(204,18,48,.20));
  color: var(--red);
}
.wt-konto-body { flex: 1 1 auto; min-width: 0; }
.wt-konto-name {
  font-size: 15px; font-weight: 700; color: var(--text);
  margin: 0 0 2px 0; line-height: 1.2;
}
.wt-konto-desc {
  font-size: 12px; color: var(--muted); line-height: 1.4;
}
.wt-konto-arrow {
  flex: 0 0 24px;
  display: flex; align-items: center; justify-content: center;
  color: var(--muted);
  transition: color var(--ease), transform var(--ease);
}
.wt-konto-card:hover .wt-konto-arrow {
  color: var(--red);
  transform: translateX(3px);
}
@media (max-width: 900px) {
  .wt-konto-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 480px) {
  .wt-konto-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .wt-konto-card { padding: 12px 14px !important; }
}
.wt-page-hd h1,
.wt-page-hd .woocommerce-products-header__title,
.wt-gewerk-hd h1,
.woocommerce-products-header h1,
.woocommerce-products-header .woocommerce-products-header__title,
.woocommerce-products-header .page-title,
body.woocommerce .page-title {
  margin: 0 0 2px 0 !important;
  padding: 0 !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  color: var(--text) !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  border: none !important;
  background: transparent !important;
}
.wt-page-hd p,
.wt-gewerk-hd p,
.woocommerce-products-header p,
.term-description,
.term-description p {
  margin: 0 !important;
  font-size: 13px !important;
  color: var(--muted) !important;
  line-height: 1.4 !important;
}
/* Auf Kategorie-Seiten ist die term-description meist ein separater Block
   unterhalb des Titels — wir docken sie visuell ans Heading an. */
.woocommerce-products-header + .term-description,
.term-description {
  margin: -16px 0 20px 0 !important;
  padding: 0 0 0 18px !important;
  border-left: 4px solid var(--red) !important;
  margin-left: 0 !important;
}
@media (max-width: 768px) {
  .wt-page-hd,
  .wt-gewerk-hd,
  .woocommerce-products-header {
    margin: 0 0 14px 0 !important;
    padding: 2px 0 2px 12px !important;
    border-left-width: 3px !important;
  }
  .wt-page-hd h1,
  .wt-gewerk-hd h1,
  .woocommerce-products-header h1,
  .woocommerce-products-header .woocommerce-products-header__title {
    font-size: 20px !important;
  }
  .wt-page-hd p,
  .wt-gewerk-hd p,
  .woocommerce-products-header p {
    font-size: 12px !important;
  }
}

/* Bug #3097: Footer-Logos nicht abschneiden */
.wt-ftr-grid img {
  display: block;
  max-width: 180px;
  width: 100%;
  height: auto !important;
  max-height: none !important;
  object-fit: contain;
}
.site-footer .col-full,
.storefront-footer .col-full {
  overflow: visible !important;
}
.wt-ftr-grid > div {
  min-height: 0;
  overflow: visible;
}

/* Bug #3128: Produktbeschreibung kompakter */
.woocommerce-product-details__short-description,
.woocommerce-Tabs-panel--description {
  font-size: 0.95em;
  line-height: 1.5;
}
.woocommerce-product-details__short-description p,
.woocommerce-Tabs-panel--description p {
  margin: 0 0 0.6em;
}
.woocommerce-product-details__short-description ul,
.woocommerce-product-details__short-description ol,
.woocommerce-Tabs-panel--description ul,
.woocommerce-Tabs-panel--description ol {
  margin: 0.3em 0 0.8em 1.2em;
  padding: 0;
}
.woocommerce-product-details__short-description li,
.woocommerce-Tabs-panel--description li {
  margin-bottom: 0.2em;
  line-height: 1.4;
}
.woocommerce-product-details__short-description h1,
.woocommerce-product-details__short-description h2,
.woocommerce-product-details__short-description h3,
.woocommerce-product-details__short-description h4,
.woocommerce-Tabs-panel--description h1,
.woocommerce-Tabs-panel--description h2,
.woocommerce-Tabs-panel--description h3,
.woocommerce-Tabs-panel--description h4 {
  margin: 0.8em 0 0.4em;
  font-size: 1.05em;
}

/* ═══ SHOP MOBILE POLISH (v4.0.7) ════════════════════════════════════════
   Konsistente Spacings + überarbeitete Single-Product-Seite auf Mobile.
   Greift auf Shop-, Kategorie-, Produkt-, Cart-, Checkout-Seiten. */

/* 1) Container-Spacing site-wide auf Mobile vereinheitlichen (analog Portal).
      Auf Shop-Seiten gibt es teils .site-content / .content-area Wrapper
      ohne Padding → Produkte kleben am Viewport-Rand. Hier säubern.
      Wir geben den Padding direkt dem Hauptcontainer (.site-main/.content-area)
      und ul.products, weil col-full im Theme Width:100% mit Auto-Margin hat
      und Padding daher visuell verschluckt wird. */
@media (max-width: 768px) {
  body.woocommerce .col-full,
  body.woocommerce-page .col-full,
  body.woocommerce #content > .col-full,
  body.woocommerce-page #content > .col-full {
    padding: 16px 16px 32px 16px !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body.woocommerce #content,
  body.woocommerce-page #content,
  body.woocommerce .content-area,
  body.woocommerce-page .content-area {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  body.woocommerce #main.site-main,
  body.woocommerce-page #main.site-main,
  body.woocommerce main.site-main,
  body.woocommerce-page main.site-main {
    padding-left: 16px !important;
    padding-right: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Wenn .site-main bereits Padding hat, soll col-full innen kein Doppel-Padding */
  body.woocommerce .site-main > .col-full,
  body.woocommerce-page .site-main > .col-full {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Page-Header (Kategorie/Shop) Innenabstand */
  body.woocommerce .woocommerce-products-header,
  body.woocommerce .woocommerce-products-header__title,
  body.woocommerce-page .woocommerce-products-header {
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
  }
  body.woocommerce .woocommerce-products-header__title {
    font-size: 22px !important;
    line-height: 1.2 !important;
  }
  /* Result-Count + Ordering kompakt */
  body.woocommerce .woocommerce-result-count,
  body.woocommerce .woocommerce-ordering {
    margin: 0 0 8px 0 !important;
    font-size: 13px !important;
    float: none !important;
    width: 100% !important;
  }
  body.woocommerce .woocommerce-ordering select { width: 100% !important; }
}

/* 2) SINGLE PRODUCT PAGE — Mobile-Layout neu */
@media (max-width: 768px) {
  body.single-product div.product {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /* Galerie volle Breite, sauber gerundet */
  body.single-product.woocommerce div.product .woocommerce-product-gallery,
  body.single-product.woocommerce-page div.product .woocommerce-product-gallery,
  body.single-product div.product .woocommerce-product-gallery {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    float: none !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
  }
  body.single-product div.product .woocommerce-product-gallery .flex-viewport,
  body.single-product div.product .woocommerce-product-gallery__image {
    border-radius: var(--r) !important;
    overflow: hidden !important;
    background: var(--white) !important;
    box-shadow: var(--sh2) !important;
  }
  body.single-product div.product .woocommerce-product-gallery img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }
  /* Thumbnail-Strip 4-spaltig, kompakt */
  body.single-product div.product .woocommerce-product-gallery .flex-control-thumbs {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
    margin: 8px 0 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }
  body.single-product div.product .woocommerce-product-gallery .flex-control-thumbs li {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
  }
  body.single-product div.product .woocommerce-product-gallery .flex-control-thumbs img {
    border-radius: 6px !important;
    border: 1.5px solid var(--border) !important;
    cursor: pointer !important;
  }
  body.single-product div.product .woocommerce-product-gallery .flex-control-thumbs img.flex-active {
    border-color: var(--red) !important;
  }

  /* Summary — volle Breite, klare Karte */
  body.single-product div.product .summary,
  body.single-product div.product .entry-summary {
    width: 100% !important;
    float: none !important;
    margin: 0 0 16px 0 !important;
    padding: 16px !important;
    background: var(--white) !important;
    border-radius: var(--r) !important;
    box-shadow: var(--sh2) !important;
    box-sizing: border-box !important;
  }
  body.single-product div.product .product_title {
    font-size: 20px !important;
    line-height: 1.25 !important;
    margin: 0 0 8px 0 !important;
    color: var(--text) !important;
  }
  body.single-product div.product .price,
  body.single-product div.product .summary .price {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: var(--red) !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.2 !important;
  }
  body.single-product div.product .price del { font-size: 14px !important; opacity: 0.6 !important; }
  body.single-product div.product .price ins { text-decoration: none !important; }
  body.single-product div.product .woocommerce-product-details__short-description {
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: var(--text) !important;
    margin: 0 0 14px 0 !important;
  }

  /* Add-to-Cart Form: Quantity + Button stacked, große Touch-Targets */
  body.single-product div.product form.cart {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin: 12px 0 14px 0 !important;
    padding: 0 !important;
  }
  body.single-product div.product form.cart .quantity {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  body.single-product div.product form.cart .quantity input.qty,
  body.single-product div.product form.cart input.qty {
    width: 100% !important;
    max-width: none !important;
    height: 48px !important;
    font-size: 17px !important;
    text-align: center !important;
    padding: 0 12px !important;
    border: 1.5px solid var(--border) !important;
    border-radius: var(--r) !important;
    background: var(--white) !important;
    box-sizing: border-box !important;
  }
  body.single-product div.product form.cart button.single_add_to_cart_button,
  body.single-product div.product form.cart .single_add_to_cart_button {
    width: 100% !important;
    height: 52px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border-radius: var(--r) !important;
    background: var(--red) !important;
    color: var(--white) !important;
    border: none !important;
    box-shadow: var(--sh2) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
  }
  body.single-product div.product form.cart button.single_add_to_cart_button:hover,
  body.single-product div.product form.cart button.single_add_to_cart_button:focus {
    background: var(--red-d) !important;
  }

  /* Varianten-Tabelle responsive */
  body.single-product div.product table.variations {
    width: 100% !important;
    margin: 0 0 10px 0 !important;
  }
  body.single-product div.product table.variations tr,
  body.single-product div.product table.variations td,
  body.single-product div.product table.variations th {
    display: block !important;
    width: 100% !important;
    padding: 4px 0 !important;
    border: none !important;
    text-align: left !important;
  }
  body.single-product div.product table.variations select {
    width: 100% !important;
    height: 44px !important;
    padding: 0 12px !important;
    border: 1.5px solid var(--border) !important;
    border-radius: var(--r) !important;
    background: var(--white) !important;
    font-size: 15px !important;
    box-sizing: border-box !important;
  }

  /* Meta-Info (SKU/Kategorie) klein, ruhig */
  body.single-product div.product .product_meta {
    font-size: 12px !important;
    color: var(--muted) !important;
    margin: 10px 0 0 0 !important;
    padding: 10px 0 0 0 !important;
    border-top: 1px solid var(--border) !important;
    line-height: 1.6 !important;
  }
  body.single-product div.product .product_meta > span { display: block !important; }
  body.single-product div.product .product_meta a { color: var(--text) !important; }

  /* Tabs als Karte; aktive Tab klar markiert */
  body.single-product div.product .woocommerce-tabs {
    background: var(--white) !important;
    border-radius: var(--r) !important;
    box-shadow: var(--sh2) !important;
    padding: 8px !important;
    margin: 0 0 16px 0 !important;
  }
  body.single-product div.product .woocommerce-tabs ul.tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
  }
  body.single-product div.product .woocommerce-tabs ul.tabs::before,
  body.single-product div.product .woocommerce-tabs ul.tabs::after { display: none !important; }
  body.single-product div.product .woocommerce-tabs ul.tabs li {
    background: var(--bg) !important;
    border: none !important;
    border-radius: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.single-product div.product .woocommerce-tabs ul.tabs li.active {
    background: var(--red) !important;
  }
  body.single-product div.product .woocommerce-tabs ul.tabs li a {
    padding: 8px 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--text) !important;
  }
  body.single-product div.product .woocommerce-tabs ul.tabs li.active a { color: var(--white) !important; }
  body.single-product div.product .woocommerce-tabs .panel {
    padding: 8px !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
  }

  /* Related/Up-Sells: 2-spaltig (greift bereits via ul.products Override) */
  body.single-product .related.products,
  body.single-product .upsells.products {
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    clear: both !important;
  }
  body.single-product .related.products > h2,
  body.single-product .upsells.products > h2 {
    font-size: 16px !important;
    margin: 0 0 10px 0 !important;
  }

  /* Breadcrumbs kompakt */
  body.single-product .woocommerce-breadcrumb {
    font-size: 12px !important;
    margin: 0 0 10px 0 !important;
    color: var(--muted) !important;
  }
}

/* ═══ FOOTER MOBILE POLISH (v4.0.11) ════════════════════════════════════
   Footer auf Mobile: 2-spaltiges Logo-Grid in Karten, kompakte Kontakt-
   spalte, eigene Bottom-Bar mit zentriertem Layout. */

@media (max-width: 768px) {
  /* Footer-Container Padding angleichen an Shop-Spacing */
  body .site-footer {
    padding: 24px 0 0 !important;
    margin-top: 32px !important;
  }
  body .site-footer .col-full {
    padding: 0 16px !important;
    max-width: 100% !important;
  }

  /* Logo-Grid: 2 Spalten, kompakte Karten, einheitliche Höhe */
  body .site-footer .wt-ftr-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    padding: 0 0 18px 0 !important;
    margin: 0 !important;
  }
  body .site-footer .wt-ftr-grid > div {
    background: var(--bg) !important;
    border-radius: var(--r) !important;
    padding: 14px 12px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    min-height: 96px !important;
    box-sizing: border-box !important;
  }
  /* Wenn Zelle Kontaktliste/h3 enthält, links-bündig & größer */
  body .site-footer .wt-ftr-grid > div:has(ul),
  body .site-footer .wt-ftr-grid > div:has(.wt-ftr-contact) {
    grid-column: 1 / -1 !important;
    align-items: flex-start !important;
    text-align: left !important;
    background: var(--white) !important;
    box-shadow: var(--sh2) !important;
    padding: 16px !important;
    min-height: 0 !important;
  }
  body .site-footer .wt-ftr-grid img {
    max-width: 100% !important;
    max-height: 60px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
  }
  body .site-footer h3 {
    font-size: 11px !important;
    margin-bottom: 8px !important;
    text-align: left !important;
  }
  body .site-footer ul {
    width: 100% !important;
  }
  body .site-footer ul li {
    font-size: 13px !important;
    margin-bottom: 6px !important;
  }
  body .site-footer .wt-ftr-contact {
    gap: 6px !important;
  }
  body .site-footer .wt-ftr-contact a {
    font-size: 13px !important;
    padding: 4px 0 !important;
  }

  /* Bottom-Bar: stacked, zentriert, fließend in Mobile */
  body .site-footer .wt-ftr-bottom {
    padding: 14px 16px !important;
    margin-top: 8px !important;
  }
  body .site-footer .wt-ftr-bottom .col-full {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 !important;
    text-align: center !important;
  }
  body .site-footer .wt-ftr-bottom span {
    font-size: 11px !important;
    line-height: 1.4 !important;
    opacity: 0.85 !important;
  }
  body .site-footer .wt-ftr-legal {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 6px 14px !important;
  }
  body .site-footer .wt-ftr-legal a {
    font-size: 11px !important;
    padding: 4px 0 !important;
  }
}

/* Sehr schmale Screens: Logos einspaltig */
@media (max-width: 360px) {
  body .site-footer .wt-ftr-grid {
    grid-template-columns: 1fr !important;
  }
  body .site-footer .wt-ftr-grid > div {
    min-height: 80px !important;
  }
}