.bt-cart-drawer {
  position: fixed;
  inset: 0;
  z-index: 9999;
}

.bt-cart-drawer__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}

.bt-cart-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  width: 42vw;
  max-width: 520px;
  height: 100%;
  background: #fff;

  display: flex;
  flex-direction: column;

  /* wichtig: nichts clippen, Content soll scrollen */
  overflow: hidden;
}

/* ================================
   Mini Cart Drawer – Header Reset
   ================================ */

.bt-cart-drawer__header {
  padding: 2%;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.bt-cart-drawer__title {
  margin-bottom: 0;}

.bt-cart-drawer__header,
.bt-cart-drawer__header * {
  list-style: none;

  display: flex;
  justify-content: space-between;
  align-items: stretch;
}

.bt-cart-drawer__header ul,
.bt-cart-drawer__header li {
  margin: 0;
  padding: 0;
}

/* Close Button – hart neutralisieren */
.bt-cart-drawer__close {
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;

  font: inherit;
  font-size: 30px;
  line-height: 1;

  color: #000;
  text-decoration: none;

  cursor: pointer;
}

.bt-cart-drawer__close:hover {
  background-color: #fff !important;
  color: #000 !important;
}

/* Killt Theme-/Woo-Pseudo-Elemente */
.bt-cart-drawer__close::before,
.bt-cart-drawer__close::after,
.bt-cart-drawer__header ::marker {
  content: none !important;
}

/* ==================================================
   Mini Cart Drawer – Loading State (Remove ohne White-Flash)
   PATCH 2026-02-10
   Zweck: Content bleibt optisch stabil während Remove/Reload.
   Warum: Mini-Cart kann kurz leer sein -> wirkt wie „weißes Loch“.
   ================================================== */

#bt-cart-drawer.bt-cart-drawer--loading #bt-cart-drawer-content {
  opacity: 0.45;
  position: relative; /* Anker fürs Overlay */
  /* kein pointer-events:none -> sonst können Klicks/Links je nach Timing blocken */
}

#bt-cart-drawer.bt-cart-drawer--loading #bt-cart-drawer-content::before {
  content: "Aktualisiere …";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: 999px;
  padding: 10px 14px;

  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  color: #000;

  z-index: 5;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
  pointer-events: none;
  white-space: nowrap;
}

/* ==================================================
   Mini Cart Drawer – Mini Cart Widget Layout (SSOT)
   PATCH 2026-02-10
   Zweck: Mini-Cart im Drawer komplett selbst stylen (ein Design, eine Quelle).
   ================================================== */

/* Reset: Liste im Drawer immer sauber, unabhängig von Woo/Theme */
#bt-cart-drawer .woocommerce-mini-cart,
#bt-cart-drawer ul.cart_list,
#bt-cart-drawer ul.product_list_widget {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Item-Container */
#bt-cart-drawer .woocommerce-mini-cart-item,
#bt-cart-drawer ul.cart_list li,
#bt-cart-drawer ul.product_list_widget li {
  position: relative;
  padding: 12px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* ==================================================
   Thumbnail – SSOT (größer + stabil)
   ================================================== */
#bt-cart-drawer ul.cart_list li img,
#bt-cart-drawer ul.product_list_widget li img {
  float: right;
  margin-left: 10px;

  width: 80px;
  height: 80px;

  object-fit: cover;
  border-radius: 8px;

  box-shadow: none;
}

/* Name/Link – genug Abstand für Remove links + Thumb rechts */
#bt-cart-drawer .woocommerce-mini-cart-item > a,
#bt-cart-drawer ul.cart_list li > a,
#bt-cart-drawer ul.product_list_widget li > a {
  display: block;
  padding-left: 28px; /* Platz für Remove */
  padding-right: 10px; /* Platz für 64px Thumb + Margin */
  text-decoration: none;
  color: inherit;
}

/* Produktname typografisch beruhigen */
#bt-cart-drawer .woocommerce-mini-cart-item > a,
#bt-cart-drawer .woocommerce-mini-cart-item > a * {
  line-height: 1.25;
}

/* Unsere Meta-Zeilen unter dem Namen */
#bt-cart-drawer .bt-mini-cart-meta {
  margin-top: 6px;
  padding-left: 28px; /* align mit Name */
  padding-right: 80px; /* align mit Thumb */
  font-size: 13px;
  opacity: 0.85;
}

#bt-cart-drawer .bt-mini-cart-meta__row {
  margin: 2px 0;
}

/* ==================================================
   Quantity+Price Zeile (unser Filter-Output)
   ================================================== */
#bt-cart-drawer .bt-mini-cart-qtyline {
  margin-top: 10px;
  padding-left: 28px; /* align mit Name */
  padding-right: 80px; /* align mit Thumb */

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#bt-cart-drawer .bt-mini-cart-unitprice {
  white-space: nowrap;
  font-weight: 600;
}

/* QTY Control – clean pill */
#bt-cart-drawer .bt-mini-cart-qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: 999px;
  overflow: hidden;

  /* nicht weiß: ruhiges, leichtes Grau */
  background: rgba(0, 0, 0, 0.04);
}

#bt-cart-drawer .bt-mini-cart-qty__btn {
  width: 32px;
  height: 30px;
  border: 0;
  background: transparent;
  cursor: pointer;

  /* echte Zentrierung */
  display: inline-flex;
  align-items: center;
  justify-content: center;

  /* Typography */
  font-size: 18px;
  line-height: 1;

  color: #111;
  opacity: 0.85;

  /* kein „padding drift“ */
  padding: 0;
}

/* Optical alignment: Minus wirkt sonst „zu weit rechts“ */
#bt-cart-drawer .bt-mini-cart-qty__btn[data-bt-qty="minus"] {
  transform: translateX(-0.5px);
}

#bt-cart-drawer .bt-mini-cart-qty__btn:hover {
  opacity: 1;
}

#bt-cart-drawer .bt-mini-cart-qty__val {
  min-width: 30px;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  line-height: 30px;
}

/* ==================================================
   Remove Button: Trash Icon (CSS-only)
   ================================================== */
#bt-cart-drawer a.remove.remove_from_cart_button {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: none !important;

  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  /* "×" unsichtbar */
  font-size: 0 !important;
  line-height: 0 !important;

  color: inherit !important;
  opacity: 0.75;
}

#bt-cart-drawer a.remove.remove_from_cart_button:hover {
  opacity: 1;
}

/* Icon als Mask (nimmt currentColor an) */
#bt-cart-drawer a.remove.remove_from_cart_button::before {
  content: "" !important;
  width: 18px;
  height: 18px;
  display: block;

  /* position: absolute;
  top: 45px;
  left: 0px; */

  background-color: currentColor;

  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%206h18%27/%3E%3Cpath%20d%3D%27M8%206V4h8v2%27/%3E%3Cpath%20d%3D%27M6%206l1%2014h10l1-14%27/%3E%3Cpath%20d%3D%27M10%2011v6%27/%3E%3Cpath%20d%3D%27M14%2011v6%27/%3E%3C/svg%3E")
    no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%206h18%27/%3E%3Cpath%20d%3D%27M8%206V4h8v2%27/%3E%3Cpath%20d%3D%27M6%206l1%2014h10l1-14%27/%3E%3Cpath%20d%3D%27M10%2011v6%27/%3E%3Cpath%20d%3D%27M14%2011v6%27/%3E%3C/svg%3E")
    no-repeat center / contain;
}

/* ==================================================
   Mini Cart Drawer – Scroll Container (SSOT)
   PATCH 2026-02-10
   Zweck: Scrollen innerhalb des Drawers (nicht die Seite).
   Warum: Ohne echten Scroll-Container scrollt die Page weiter.
   ================================================== */
#bt-cart-drawer-content {
  flex: 1 1 auto;
  min-height: 0;

  /* PATCH 2026-02-10: Content als Flex-Column, damit Footer nach unten kann */
  display: flex;
  flex-direction: column;

  overflow-y: auto;
  overflow-x: hidden;

  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;

  padding-bottom: 14px;
  padding: 2%;
}

/* ==================================================
   Mini Cart Drawer – Footer unten (Flex Trick)
   PATCH 2026-02-10
   Zweck: Bei wenig Items sitzt Total/Buttons unten, nicht direkt unterm 1. Item.
   Warum: Content ist Flex-Column; wir geben dem Total auto-top-margin.
   ================================================== */

/* Liste bleibt "normal" oben */
#bt-cart-drawer #bt-cart-drawer-content > ul.woocommerce-mini-cart {
  margin: 0;
  padding: 0;
}

/* Total wird nach unten gedrückt, Buttons folgen darunter */
#bt-cart-drawer #bt-cart-drawer-content .woocommerce-mini-cart__total {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

/* Buttons optisch sauber darunter */
#bt-cart-drawer #bt-cart-drawer-content .woocommerce-mini-cart__buttons {
  margin: 10px 0 0;
}

/* ==================================================
   Mini Cart Drawer – SSOT Typo & Controls (gegen Woo/Theme Overrides)
   PATCH 2026-02-10
   Zweck: Auf Shop/Kategorie greifen Woo/Theme Styles (pink, bold, andere Buttons).
   Lösung: Drawer komplett kapseln -> ein Design auf allen Seiten.
   ================================================== */

#bt-cart-drawer {
  color: #111;
}

#bt-cart-drawer,
#bt-cart-drawer * {
  font-family: inherit;
}

/* Titel/Name ruhiger (Shop macht oft fett) */
#bt-cart-drawer .woocommerce-mini-cart-item > a,
#bt-cart-drawer ul.cart_list li > a,
#bt-cart-drawer ul.product_list_widget li > a {
  font-weight: 600 !important;
}

/* Meta (Höhe/Flugzeit) immer dünner */
#bt-cart-drawer .bt-mini-cart-meta {
  font-weight: 400 !important;
  opacity: 0.82;
}

/* Preis nicht zu fett */
#bt-cart-drawer .bt-mini-cart-unitprice {
  font-weight: 600 !important;
}

/* Buttons im Drawer: SSOT (pink/Theme-Buttons killen) */
#bt-cart-drawer .woocommerce-mini-cart__buttons a,
#bt-cart-drawer .woocommerce-mini-cart__buttons a.button,
#bt-cart-drawer .woocommerce-mini-cart__buttons a.checkout,
#bt-cart-drawer .woocommerce-mini-cart__buttons a.wc-forward {
  background: #111 !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;

  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 1 !important;

  padding: 12px 14px !important;
  border-radius: 10px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
}

#bt-cart-drawer .woocommerce-mini-cart__buttons {
  display: grid;
  gap: 10px;
}

/* Warenkorb-Button weniger dominant als Checkout */
#bt-cart-drawer .woocommerce-mini-cart__buttons a.wc-forward:not(.checkout),
#bt-cart-drawer .woocommerce-mini-cart__buttons a.button:not(.checkout) {
  background: rgba(0, 0, 0, 0.08) !important;
  color: #111 !important;
}