/* Start custom CSS *//* Side cart (FunnelKit Cart). Moved from the Kit section «funnelkit-side-cart» on 21.10.2026; plugin catchkeep
   (performance/frontend part 11) loads this document CSS without blocking the first paint. Every rule is scoped to
   body #fkcart-modal. */
/* Makes the open cart visible once these styles are loaded (Kit section «side-cart-async» keeps it invisible until then). */
html body #fkcart-modal.fkcart-modal.fkcart-show{visibility:visible}
 /* FunnelKit side cart (plugin Cart for WooCommerce, #fkcart-modal) after Figma "Cart Page" 21:3655 (drawer 580 wide, owner
   crops 73-77 of 07.10): grey header with the item count after the title, free-shipping bar with the truck (only reward
   shown), item rows with image tile, stepper, variation and trash icons and red saving chip, one-card upsell carousel with arrows pinned
   above the footer, FunnelKit's variation panel in the same style, grey footer with
   FunnelKit's collapsible coupon box (owner: compact standard box, brand colours only), totals with the customer's cashback
   balance and the cashback row of the plugin Catch & Keep Cashback, brand CTA (ends the drawer); one inner grid (36.5, phones 20) for
   every block, "Weiter einkaufen" off in the FunnelKit settings (owner 07.10). Section
   "funnelkit-side-cart" of the Kit Custom CSS: the drawer renders on every page and cannot carry global classes. The drawer
   gets its own --ck-design-unit (drawer width / 580; phones: the site mobile unit), so the brand CTA tokens of section
   "brand-cta-shape" (also declared on #fkcart-modal) scale with it. Figma measures text from cap height to baseline; the
   half leading of Barlow (ascent 1, descent 0.2, cap 0.7 em) is taken off with margins or paddings (line height L: top
   L/2 - 0.3 em, bottom L/2 - 0.4 em), so every browser lays it out alike without depending on text-box-trim (only the
   chips add it where supported, see there). Extra markup (Versand,
   Gesamtsumme, cashback balance, free chip, locked stepper) comes from WPCode "Warenkorb – Seitenwarenkorb
   Ergänzungen". FunnelKit uses up to one id and four classes; the prefix "body #fkcart-modal.fkcart-modal" wins. */ body #fkcart-modal.fkcart-modal {
  --fkcart-slider-desktop-width: max(420px, calc(580 * var(--ck-desktop-unit)));
  --ck-design-unit: calc(var(--fkcart-slider-desktop-width) / 580);
  --fkcart-primary-bg-color: var(--action-lime, #A9FF00);
  --fkcart-primary-font-color: var(--text-dark, #000000);
  --fkcart-primary-text-color: var(--text-dark, #000000);
  --fkcart-secondary-text-color: var(--text-dark, #000000);
  --fkcart-strike-through-price-text-color: var(--text-muted);
  --fkcart-saving-text-price-color: var(--brand-orange-text, #C62816);
  --fkcart-border-color: var(--line-soft);
  --fkcart-panel-color: var(--surface-soft, #F2F2F6);
  --fkcart-progressbar-active-color: #8BE10A;
  --fkcart-reward-color: var(--text-dark, #000000);
  --ck-sc-x: calc(36.5 * var(--ck-design-unit));
  --ck-sc-inset: var(--ck-sc-x);
  --ck-sc-inset-end: var(--ck-sc-x);
  --ck-sc-footer-inset: var(--ck-sc-x);
  --ck-sc-line: var(--line-soft);
  --ck-sc-muted: var(--text-subtle, #6B6A73);
  --ck-sc-strike: var(--text-muted);
  --ck-sc-chip-bg: rgba(255, 51, 10, 0.15);
  --ck-sc-chip-text: var(--brand-orange-text, #C62816);
  --ck-sc-green: #79C00A;
  --ck-sc-green-text: #4F7300;
  --ckcb-earn-color: var(--ck-sc-green-text);
  font-family: var(--brand-font), sans-serif;
}

/* Stepper size (owner 07.10: a bit smaller): 100 x 30 with a 32 number cell; the buttons stay at least 24 x 24 (WCAG 2.5.8). */ body #fkcart-modal.fkcart-modal {
  --ck-sc-qty-w: max(78PX, calc(100 * var(--ck-design-unit)));
  --ck-sc-qty-h: max(26PX, calc(30 * var(--ck-design-unit)));
  --ck-sc-qty-cell: max(24PX, calc(32 * var(--ck-design-unit)));
}

/* Header: grey bar 60, italic uppercase title with FunnelKit's item count "(n)" after it (owner 07.10; the number of
   pieces, WooCommerce's cart contents count, the same basis as the header cart badge), round close button. */ body #fkcart-modal.fkcart-modal .fkcart-slider-header {
  border: 0;
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading {
  min-height: calc(60 * var(--ck-design-unit));
  padding: calc(8 * var(--ck-design-unit)) var(--ck-sc-x);
  gap: calc(16 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-title {
  color: var(--text-dark, #000000);
  font: italic 900 calc(24 * var(--ck-design-unit))/1.1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-title span {
  margin: 0;
}

/* A real space instead of FunnelKit's 4 px margin: "DEIN WARENKORB (3)". */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-title span::before {
  content: " ";
}

/* Close button like the site's popups (GPSR 1729, Glove Finder 3147): round 44 on --surface-muted, cross 16 drawn with CSS,
   darker grey on hover, focus ring. */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: calc(44 * var(--ck-design-unit));
  min-width: 32PX;
  height: calc(44 * var(--ck-design-unit));
  min-height: 32PX;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--surface-muted, #DCDCE2);
  color: var(--text-dark, #000000);
  cursor: pointer;
  transition: background-color 160ms ease;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close::before, body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(16 * var(--ck-design-unit));
  min-width: 12PX;
  height: calc(2 * var(--ck-design-unit));
  min-height: 1.5PX;
  border-radius: 1PX;
  background: currentColor;
  transform: translate(-50%, -50%) rotate(45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close:hover {
  background: #C9C9D1;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close:focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: 2PX;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close svg {
  display: none;
}

/* Free-shipping bar (Figma 21:3657, crop 77): message 19, bar 13 (#E6E6E6 / #8BE10A), truck (media 3400) riding on the end
   of the fill; FunnelKit's milestone icons are hidden (the WPCode snippet keeps only the free-shipping reward). The message
   stays on one line (owner 07.10): at most 19, smaller only when the panel is too narrow for the longest text ("Es fehlen
   noch 149,95€ bis zum kostenlosen Versand!", 22.4 em; 4.3 % of the panel width keeps it on one line, 12.5 px at 320). */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel {
  container-type: inline-size;
  padding: calc(30 * var(--ck-design-unit)) var(--ck-sc-x) 0;
  border: 0;
  background: transparent;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel .fkcart-reward-message {
  margin: -0.3em 0 calc(18 * var(--ck-design-unit) - 0.2em);
  padding: 0;
  color: var(--text-dark, #000000);
  font: 400 calc(19 * var(--ck-design-unit))/1.2 var(--brand-font), sans-serif;
  font-size: min(calc(19 * var(--ck-design-unit)), 4.3cqi);
  letter-spacing: -0.01em;
  text-align: center;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel .fkcart-reward-message :is(strong, .woocommerce-Price-amount) {
  font-weight: 600;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel .fkcart-progress-wrap {
  position: relative;
  height: calc(13 * var(--ck-design-unit));
  margin: 0;
  overflow: visible;
  border-radius: 1000PX;
  background: #E6E6E6;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel .fkcart-progress-wrap .fkcart-progress-bar {
  position: relative;
  height: 100%;
  overflow: visible;
  border-radius: inherit;
  background: #8BE10A;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel .fkcart-progress-wrap .fkcart-progress-bar::after {
  content: '';
  position: absolute;
  top: calc(-6.35 * var(--ck-design-unit));
  left: calc(100% - 26.16 * var(--ck-design-unit));
  width: calc(33.26 * var(--ck-design-unit));
  height: calc(25.71 * var(--ck-design-unit));
  background: url('/wp-content/uploads/2026/10/ck-icon-shipping-progress-truck.svg') center / 100% 100% no-repeat;
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel .fkcart-rewards {
  display: none;
}

/* Body: items at the top, upsells pinned to the bottom (Figma: carousel ends 18 above the footer). */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-body {
  display: flex;
  flex-direction: column;
}

/* Items (Figma 21:3710, crop 74): rows of 120 with 11 between them, 30 below the free-shipping bar (the count sits in the
   header, owner 07.10). */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap.fkcart-pt-16 {
  padding-top: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap.fkcart-pt-16:not(.fkcart-carousel-wrap) {
  padding-top: calc(30 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item {
  align-items: stretch;
  gap: calc(20 * var(--ck-design-unit));
  min-height: calc(120 * var(--ck-design-unit));
  margin: 0 0 calc(11 * var(--ck-design-unit));
  padding: 0 var(--ck-sc-inset-end) 0 var(--ck-sc-inset);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-thumb-wrap {
  position: static;
  flex: 0 0 auto;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-image-wrapper {
  display: flex;
  flex: 0 0 calc(100 * var(--ck-design-unit));
  align-items: center;
  justify-content: center;
  width: calc(100 * var(--ck-design-unit));
  height: 100%;
  min-height: calc(120 * var(--ck-design-unit));
  margin: 0;
  padding: calc(7 * var(--ck-design-unit));
  overflow: hidden;
  border: 0;
  border-radius: calc(8.333 * var(--ck-design-unit));
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-image-wrapper img {
  width: 100%;
  max-width: none;
  height: 100%;
  border: 0;
  border-radius: 0;
  object-fit: contain;
  mix-blend-mode: multiply;
}

/* Trash icon (media 3401, 17.29 x 19) at the top of the price column; the hit area is larger than the icon. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-remove-item {
  position: absolute;
  top: calc(14 * var(--ck-design-unit));
  right: var(--ck-sc-inset-end);
  left: auto;
  z-index: 2;
  width: calc(17.29 * var(--ck-design-unit));
  min-width: 0;
  height: calc(19 * var(--ck-design-unit));
  min-height: 0;
  cursor: pointer;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-remove-item::before {
  content: '';
  position: absolute;
  inset: -10PX;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-remove-item span {
  position: static;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 0;
  background: url('/wp-content/uploads/2026/10/ck-icon-cart-remove.svg') center / 100% 100% no-repeat;
  transition: opacity 160ms ease;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-remove-item:hover span {
  opacity: 0.7;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-remove-item svg {
  display: none;
}

/* "Ausführung wählen" (variable products, owner 07.10): an icon button left of the trash, same size, top and hit area;
   sliders icon (media 946) drawn as a mask in black. The link text stays as its accessible name (font size 0); label,
   tooltip and role come from Elementor Custom Code "Seitenwarenkorb – Bedienhilfen". Its wrapper leaves the text column,
   so the row keeps name, attributes and stepper only. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content:has(> .fkcart-select-options) {
  display: contents;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-select-options {
  position: absolute;
  top: calc(14 * var(--ck-design-unit));
  right: calc(31.29 * var(--ck-design-unit));
  z-index: 2;
  display: block;
  width: calc(17.29 * var(--ck-design-unit));
  height: calc(19 * var(--ck-design-unit));
  overflow: visible;
  color: var(--text-dark, #000000);
  font-size: 0;
  line-height: 0;
  text-decoration: none;
  cursor: pointer;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-select-options::before {
  content: '';
  position: absolute;
  inset: -10PX 0 -10PX -10PX;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-select-options::after {
  content: '';
  position: absolute;
  inset: 0;
  background: currentColor;
  -webkit-mask: url('/wp-content/uploads/2026/09/ck-category-filter.svg') center / calc(22.4 * var(--ck-design-unit)) calc(22.4 * var(--ck-design-unit)) no-repeat;
  mask: url('/wp-content/uploads/2026/09/ck-category-filter.svg') center / calc(22.4 * var(--ck-design-unit)) calc(22.4 * var(--ck-design-unit)) no-repeat;
  transition: opacity 160ms ease;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-select-options:hover::after {
  opacity: 0.7;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item :is(.fkcart-select-options, .fkcart-remove-item):focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: 3PX;
  border-radius: 2PX;
}

/* Info column: name 20/26 SemiBold, stepper, attributes 14; 8 between them, centred on the image tile, so name, stepper and
   up to three attributes with a personalisation line fit the tile height (owner 07.10). */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-info {
  position: relative;
  flex: 1 1 auto;
  gap: calc(20 * var(--ck-design-unit));
  min-width: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-wrap-start .fkcart-item-meta {
  flex: 1 1 auto;
  justify-content: center;
  gap: calc(8 * var(--ck-design-unit));
  min-width: 0;
}

/* Owner 07.10: the stepper sits directly under the name, the attributes follow; the name and attribute wrappers leave the
   column so all three line up in it. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-title-price {
  display: contents;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-wrap-start .fkcart-item-meta .fkcart-item-title {
  order: 1;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-wrap-start .fkcart-item-meta .fkcart-qty-wrap {
  order: 2;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-wrap-start .fkcart-item-meta .fkcart-item-meta-content {
  order: 3;
}

/* Name: up to two lines, then an ellipsis (line clamp; the max-height keeps two lines where clamping is unsupported). */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-title {
  display: -webkit-box;
  max-height: calc(2 * 1.3em);
  margin: -0.35em 0 -0.25em;
  overflow: hidden;
  color: var(--text-dark, #000000);
  font: 600 calc(20 * var(--ck-design-unit))/1.3 var(--brand-font), sans-serif;
  letter-spacing: -0.008em;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content {
  margin: -0.3em 0 -0.2em;
  color: var(--text-dark, #000000);
  font: 400 calc(14 * var(--ck-design-unit))/1.15 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content:empty {
  display: none;
}

/* Attributes in one flowing text, comma separated ("Größe: 9, Schnitt: Hybrid, Personalisierung: …"), wrapping like a sentence
   so the lines fill up (side cart only; the checkout summary keeps its table). */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content:has(> .fkcart-attr-wrap) {
  display: block;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content .fkcart-attr-wrap {
  display: inline;
  margin: 0;
  padding: 0;
  overflow-wrap: break-word;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content .fkcart-attr-wrap:not(:last-of-type)::after {
  content: ',';
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content :is(.fkcart-attr-key, .fkcart-attr-value) {
  display: inline;
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
}

/* FunnelKit prints name and value without a space between them; a real space keeps "Personalisierung:" and its text apart
   as two words, so a line breaks between them and never inside the text. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content .fkcart-attr-key::after {
  content: " ";
}

/* The personalisation entry stays one unit (label and inscription together); if even then it is wider than the column,
   Custom Code "Seitenwarenkorb – Bedienhilfen" shortens the label to "Pers." (data-ck-pers marks the entry once decided). */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-meta-content .fkcart-attr-wrap:has(> .fkcart-attr-key:is([data-ck-pers="full"], [data-ck-pers="short"])) {
  display: inline-block;
  max-width: 100%;
}

/* The unit price line repeats the price column; the price column keeps the former price and the saving chip. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap .fkcart_mini_cart_widget_quantity {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-qty-wrap {
  margin: 0;
}

/* Stepper (size tokens on the drawer, 100 x 30): 1.167 border #E8E8EC, radius 8, quantity cell 32 on #E8E8EC, icons 9; the
   same stepper in the item rows and in FunnelKit's variation panel. Matched by a class fragment: Elementor replaces the word "sel"+"ector"
   in Kit Custom CSS with the kit class. */ body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] {
  display: inline-flex;
  align-items: stretch;
  box-sizing: border-box;
  width: var(--ck-sc-qty-w);
  height: var(--ck-sc-qty-h);
  min-height: 0;
  overflow: hidden;
  border: calc(1.167 * var(--ck-design-unit)) solid #E8E8EC;
  border-radius: calc(8 * var(--ck-design-unit));
  background: transparent;
  box-shadow: none;
}

/* Focus (owner 07.10): the stepper is one rounded box without inner dividers; while any part has keyboard focus (the -/+
   keys are keyboard buttons, Custom Code "Seitenwarenkorb – Bedienhilfen"; a click on them shows nothing) only its outer
   border turns black (flush, no offset ring). */ body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"]:has(:focus-visible) {
  border-color: var(--text-dark, #000000);
  border-width: max(1.5PX, calc(1.167 * var(--ck-design-unit)));
}

body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] :is(.fkcart-quantity__input, .fkcart-quantity-button):is(:focus, :focus-visible) {
  outline: 0;
  box-shadow: none;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] .fkcart-quantity-button {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 0;
  height: 100%;
  margin: 0;
  padding: 0;
  color: var(--text-dark, #000000);
  cursor: pointer;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] .fkcart-quantity-button:hover {
  background: var(--surface-soft, #F2F2F6);
}

/* FunnelKit's 20-unit icons drawn 10 wide with Figma's 2-unit stroke. */ body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] .fkcart-quantity-button svg {
  width: calc(9 * var(--ck-design-unit));
  height: calc(9 * var(--ck-design-unit));
  overflow: visible;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] .fkcart-quantity-button svg path {
  fill: currentColor;
  stroke: currentColor;
  stroke-width: 1.3PX;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] :is(.fkcart-quantity__input, .ck-sc-qty-value) {
  flex: 0 0 var(--ck-sc-qty-cell);
  width: var(--ck-sc-qty-cell);
  min-width: 0;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 0;
  outline: 0;
  box-shadow: none;
  background: #E8E8EC;
  color: var(--text-dark, #000000);
  font: 400 calc(16 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  text-align: center;
}

/* No seam on hover (owner 07.10): FunnelKit leaves a 1-pixel margin between the buttons and the number, and fractional
   widths can open a hairline at any zoom; the buttons reach 1 pixel under the number cell, which sits on top. */ body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] .fkcart-quantity-down {
  margin-inline-end: -1PX;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] .fkcart-quantity-up {
  margin-inline-start: -1PX;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item, .fkcart-quick-view-drawer) [class*="fkcart-quantity-sel"] .fkcart-quantity__input {
  position: relative;
  z-index: 1;
}

/* Price column 125.2 (Figma 21:3726): trash, 25, prices (former price 16 Regular #606060, struck through so the saving reads
   clearly (owner 07.10, instead of Figma's plain grey), 5, 20 SemiBold), 10, chip. Free gift: price and "Frei" chip centred
   on the row, no trash. The column sits on the row's right edge, so prices, chips, the trash and the variation button share
   one edge. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-wrap-start .fkcart-item-misc {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  gap: calc(10 * var(--ck-design-unit));
  width: auto;
  min-width: calc(125.2 * var(--ck-design-unit));
  max-width: none;
  margin-inline-start: auto;
  padding: calc(58 * var(--ck-design-unit)) 0 0;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item.fkcart-free-item .fkcart-item-wrap-start .fkcart-item-misc {
  justify-content: center;
  padding: 0 0 calc(34 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-price {
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  justify-content: flex-end;
  gap: calc(5 * var(--ck-design-unit));
  margin: 0;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-price del {
  order: 1;
  margin: -0.2em 0 -0.1em;
  color: var(--ck-sc-strike);
  font: 400 calc(16 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.015em;
  text-decoration: line-through;
  text-decoration-thickness: 1PX;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-price :is(ins, > .woocommerce-Price-amount) {
  order: 2;
  width: auto;
  margin: -0.2em 0 -0.1em;
  color: var(--text-dark, #000000);
  font: 600 calc(20 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.015em;
  text-decoration: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-price :is(del, ins) :is(.woocommerce-Price-amount, bdi, .woocommerce-Price-currencySymbol) {
  color: inherit;
  font: inherit;
}

/* Saving chip "Spare 30%" and "Frei" chip (WPCode, free gift): as wide as their text, 7 / 9 padding around the cap height.
   Text in the darker brand red #C62816 instead of Figma's #FF330A (4.5:1 contrast on the light red). The paddings take
   Barlow's half leading off (Firefox lays the baseline out exactly there); browsers with text-box trimming (Chromium,
   Safari, which round the font's ascent and so set the baseline up to a pixel higher) trim the line to cap height and
   baseline and use 7 above and below, so the capitals sit optically centred in every engine and at every scale factor. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-discounted-price {
  display: block;
  align-self: flex-end;
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: calc(4.2 * var(--ck-design-unit)) calc(9 * var(--ck-design-unit)) calc(5.6 * var(--ck-design-unit));
  border-radius: calc(4 * var(--ck-design-unit));
  background: var(--ck-sc-chip-bg);
  color: var(--ck-sc-chip-text);
  text-align: center;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-discounted-price .fkcart-discounted-text {
  display: block;
  margin: 0;
  color: inherit;
  font: 600 calc(14 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-discounted-price .fkcart-discounted-text * {
  color: inherit;
  font: inherit;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .ck-sc-free-badge {
  position: absolute;
  top: 50%;
  right: 0;
  display: block;
  width: fit-content;
  margin: 0;
  padding: calc(4.2 * var(--ck-design-unit)) calc(11 * var(--ck-design-unit)) calc(5.6 * var(--ck-design-unit));
  border-radius: calc(4 * var(--ck-design-unit));
  background: var(--ck-sc-chip-bg);
  color: var(--ck-sc-chip-text);
  font: 600 calc(14 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  text-transform: uppercase;
  white-space: nowrap;
}

@supports (text-box: trim-both cap alphabetic) {
  body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item :is(.fkcart-discounted-price, .ck-sc-free-badge) {
    padding-block: calc(7 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item :is(.fkcart-discounted-price .fkcart-discounted-text, .ck-sc-free-badge) {
    text-box: trim-both cap alphabetic;
  }
}

/* Fixed quantity (owner 07.10; free gift, sold individually, locked items): the same "- n +" box, locked (markup from WPCode
   "Warenkorb - Seitenwarenkorb Ergänzungen"): disabled buttons in the muted text colour, read-only number, no hover fill,
   not-allowed cursor; hidden wherever FunnelKit prints its own stepper. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-qty-wrap:has(.fkcart-quantity__input) .ck-sc-qty-locked, body #fkcart-modal.fkcart-modal .fkcart-carousel-wrap .ck-sc-qty-locked {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .ck-sc-qty-locked {
  cursor: not-allowed;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .ck-sc-qty-locked :is(.fkcart-quantity-button, .ck-sc-qty-value) {
  color: var(--text-faint, #95949D);
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .ck-sc-qty-locked .ck-sc-qty-value {
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .ck-sc-qty-locked .fkcart-quantity-button:disabled {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
}

/* Upsells (Figma 21:3670, crop 75): green heading between green lines across the drawer, cards 236.67 x 120 from 41, track. */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-body .fkcart-carousel-wrap {
  margin-top: auto;
  padding: calc(28 * var(--ck-design-unit)) 0 calc(18 * var(--ck-design-unit));
  border: 0;
  background: transparent;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-upsell-heading {
  display: flex;
  align-items: center;
  gap: calc(12 * var(--ck-design-unit));
  margin: 0 0 calc(22 * var(--ck-design-unit) - 0.1em);
  padding: 0;
  color: var(--ck-sc-green-text);
  font: italic 700 calc(16 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: 0.01em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-upsell-heading::before, body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-upsell-heading::after {
  content: '';
  flex: 1 1 0;
  height: 1PX;
  background: var(--ck-sc-green);
}

/* Carousel (owner 07.10): one card per view across the inner grid (FunnelKit's Embla snaps one card per step, so the first and
   the last card both sit on the grid edges); below it the scroll track and FunnelKit's own arrows in the site's carousel
   arrow style (made accessible by Elementor Custom Code "Seitenwarenkorb – Bedienhilfen"); arrows and track are hidden when
   one card is all there is. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  column-gap: calc(8 * var(--ck-design-unit));
  row-gap: calc(14 * var(--ck-design-unit));
  overflow: hidden;
  padding: 0 var(--ck-sc-x);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel__viewport {
  grid-column: 1 / -1;
  grid-row: 1;
  width: auto;
  min-width: 0;
  overflow: hidden;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel__container {
  gap: var(--ck-carousel-gap);
  margin-left: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item.fkcart-carousel__slide {
  display: grid;
  flex: 0 0 100%;
  grid-template-columns: calc(91.67 * var(--ck-design-unit)) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto auto auto minmax(0, 1fr);
  grid-template-areas: 'image .' 'image title' 'image price' 'image button' 'image .';
  column-gap: calc(17 * var(--ck-design-unit));
  row-gap: calc(13 * var(--ck-design-unit));
  box-sizing: border-box;
  min-width: 0;
  height: calc(120 * var(--ck-design-unit));
  margin: 0;
  padding: calc(5 * var(--ck-design-unit)) calc(20 * var(--ck-design-unit)) calc(5 * var(--ck-design-unit)) calc(4 * var(--ck-design-unit));
  border: 0;
  border-radius: calc(8.333 * var(--ck-design-unit));
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item.fkcart-carousel__slide :is(.fkcart-item-info, .fkcart-item-meta, .fkcart-item-misc) {
  display: contents;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-image-wrapper {
  display: flex;
  grid-area: image;
  align-items: center;
  justify-content: center;
  width: calc(91.67 * var(--ck-design-unit));
  height: calc(110 * var(--ck-design-unit));
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: calc(7.639 * var(--ck-design-unit));
  background: var(--text-light, #FFFFFF);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-image-wrapper img {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  object-fit: contain;
}

/* Name (up to two lines) and price 17 SemiBold; the bottom padding keeps descenders inside the line clamp. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-item-title {
  grid-area: title;
  display: -webkit-box;
  overflow: hidden;
  margin: -0.3em 0 -0.35em;
  padding: 0 0 0.15em;
  color: var(--text-dark, #000000);
  font: 600 calc(17 * var(--ck-design-unit))/1.2 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-item-meta-content:empty, body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-item-price:has(> .wc-gzd-additional-info-placeholder:only-child), body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-item-price:empty {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap.fkcart-item-wrap .fkcart--item .fkcart-item-price {
  display: block;
  grid-area: price;
  justify-self: start;
  margin: -0.2em 0 -0.1em;
  color: var(--text-dark, #000000);
  font: 600 calc(17 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-align: start;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap.fkcart-item-wrap .fkcart--item .fkcart-item-price :is(.woocommerce-Price-amount, bdi, ins) {
  color: inherit;
  font: inherit;
  text-decoration: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap.fkcart-item-wrap .fkcart--item .fkcart-item-price del {
  margin-inline-end: calc(5 * var(--ck-design-unit));
  color: var(--ck-sc-strike);
  font-size: calc(14 * var(--ck-design-unit));
  font-weight: 400;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-button {
  display: block;
  grid-area: button;
  justify-self: start;
  min-height: 0;
  margin: 0;
  padding: calc(6.2 * var(--ck-design-unit)) calc(10 * var(--ck-design-unit)) calc(7.6 * var(--ck-design-unit));
  border: 0;
  border-radius: calc(6 * var(--ck-design-unit));
  background: var(--action-lime, #A9FF00);
  color: var(--text-dark, #000000);
  font: 700 calc(14 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: 0.02em;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart--item .fkcart-button:is(:hover, :focus-visible) {
  background: var(--action-hover, #95E600);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn {
  position: relative;
  inset: auto;
  display: flex;
  grid-row: 2;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: calc(34 * var(--ck-design-unit));
  min-width: 28PX;
  height: calc(34 * var(--ck-design-unit));
  min-height: 28PX;
  margin: 0;
  padding: 0;
  border: 1PX solid var(--action-lime, #A9FF00);
  border-radius: calc(10 * var(--ck-design-unit));
  background: var(--action-lime, #A9FF00);
  box-shadow: none;
  color: var(--text-dark, #000000);
  opacity: 1;
  transform: none;
  cursor: pointer;
  transition: background-color 160ms ease, opacity 160ms ease;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn--prev {
  grid-column: 2;
  background: transparent;
  color: #8ED600;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn--next {
  grid-column: 3;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn svg {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn::before {
  content: '';
  width: calc(14 * var(--ck-design-unit));
  height: calc(2 * var(--ck-design-unit));
  min-height: 1.5PX;
  background: currentColor;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn::after {
  content: '';
  position: absolute;
  width: calc(7 * var(--ck-design-unit));
  height: calc(7 * var(--ck-design-unit));
  border-top: max(1.5PX, calc(2 * var(--ck-design-unit))) solid currentColor;
  border-right: max(1.5PX, calc(2 * var(--ck-design-unit))) solid currentColor;
  transform: translateX(calc(3.5 * var(--ck-design-unit))) rotate(45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn--prev::after {
  transform: translateX(calc(-3.5 * var(--ck-design-unit))) rotate(225deg);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn:not([disabled]):hover {
  background: var(--action-hover, #95E600);
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn:focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: 3PX;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-nav-btn[disabled] {
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel:has(.fkcart-nav-btn--prev[disabled]):has(.fkcart-nav-btn--next[disabled]) :is(.fkcart-nav-btn, .fkcart-carousel-dots) {
  display: none;
}

/* Scroll track (#DCDCE4) with the dark thumb on the current card. */ body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel-dots {
  grid-column: 1;
  grid-row: 2;
  align-self: center;
  gap: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: var(--surface-muted);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel-dot {
  flex: 1 1 0;
  width: auto;
  height: calc(1.2 * var(--ck-design-unit));
  min-height: 1PX;
  margin: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel-dot::after {
  height: 100%;
  border-radius: 0;
  background: transparent;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel-dot.is-selected::after {
  background: #333333;
}

/* Footer (Figma 21:3749): grey area; the brand CTA ends it with the drawer's side inset below (no trust row, owner 07.10). */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-footer {
  padding: 0 0 var(--ck-sc-x);
  border-top: 0;
  background: var(--surface-soft, #F2F2F6);
}

/* Coupon: FunnelKit's own collapsible box (owner decision 07.10), brand colours only. */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-coupon-area {
  padding-inline: 0;
  border-color: var(--ck-sc-line);
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-coupon-area .fkcart-panel {
  padding-inline: var(--ck-sc-x);
}

/* The coupon header is a disclosure button for the keyboard (Custom Code "Seitenwarenkorb – Bedienhilfen"): inset ring. */ body #fkcart-modal.fkcart-modal .fkcart-coupon-area .fkcart-coupon-head:focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: -2PX;
}

body #fkcart-modal.fkcart-modal .fkcart-coupon-area .fkcart-coupon-head .fkcart-coupon-title {
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-coupon-area .fkcart-coupon-input-wrap #fkcart-coupon__input {
  border-color: var(--text-subtle, #6B6A73);
  background: var(--text-light, #FFFFFF);
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-coupon-area .fkcart-coupon-input-wrap .fkcart-coupon-button {
  border-color: var(--text-dark, #000000);
  background: var(--text-dark, #000000);
  color: var(--text-light, #FFFFFF);
}

/* While the coupon is checked (FunnelKit .fkcart-loading) the label stays white; the shared busy sheen (Kit section
   "brand-button-loading") runs over the black fill. */ body #fkcart-modal.fkcart-modal .fkcart-coupon-area .fkcart-coupon-input-wrap .fkcart-coupon-button.fkcart-primary-button.fkcart-loading:not(#ck-busy) {
  color: var(--text-light, #FFFFFF);
}

/* Totals (crop 73): rows 18 with 15 between them, line, Gesamtsumme with the inline tax note (WPCode), then one row with the
   customer's cashback balance on the left (WPCode, logged-in customers with a balance) and the plugin's cashback row on the
   right. */ body #fkcart-modal.fkcart-modal .fkcart_summary_cta {
  display: flex;
  flex-direction: column;
  padding: 0;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary {
  padding: calc(21 * var(--ck-design-unit)) var(--ck-sc-footer-inset) 0;
  border: 0;
  background: transparent;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-order-summary-container {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: calc(12 * var(--ck-design-unit));
  row-gap: calc(15 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-order-summary-container > * {
  grid-column: 1 / -1;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-order-summary-container > .ck-sc-credits {
  grid-column: 1;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-order-summary-container > .ckcb-earn-row--side {
  grid-column: 2;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-summary-line-item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: calc(12 * var(--ck-design-unit));
  margin: 0;
  padding: 0;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-summary-line-item :is(.fkcart-summary-text, .fkcart-summary-amount) {
  display: block;
  margin: -0.3em 0 -0.2em;
  color: var(--text-dark, #000000);
  font: 400 calc(18 * var(--ck-design-unit))/1.2 var(--brand-font), sans-serif;
  letter-spacing: -0.025em;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-summary-line-item .fkcart-summary-amount {
  letter-spacing: -0.01em;
  text-align: end;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-summary-line-item :is(strong, .woocommerce-Price-amount, bdi, .woocommerce-Price-currencySymbol) {
  color: inherit;
  font: inherit;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-summary-line-item:has(> .fkcart-shipping-tax-calculation-text), body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-text-light:empty, body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary.fkcart-germanized, body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ckcb-earn-row__hint {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary :is(.ck-sc-shipping, .fkcart-shipping-wrap) .fkcart-summary-amount {
  font-size: calc(16 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-coupon-applied .fkcart-coupon-label {
  display: inline;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .fkcart-coupon-applied .fkcart-coupon-code-wrapper {
  display: inline-flex;
  align-items: center;
  gap: calc(6 * var(--ck-design-unit));
  margin-inline-start: calc(8 * var(--ck-design-unit));
  font-size: calc(14 * var(--ck-design-unit));
  text-transform: uppercase;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ck-sc-total {
  padding-top: calc(15 * var(--ck-design-unit));
  border-top: 1PX solid var(--ck-sc-line);
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ck-sc-total .ck-sc-total-label {
  font-weight: 600;
  letter-spacing: -0.01em;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ck-sc-total .ck-sc-total-tax {
  font-size: calc(14 * var(--ck-design-unit));
  letter-spacing: 0;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ck-sc-total .fkcart-summary-amount {
  font-weight: 700;
}

/* Cashback balance (Figma "75 C&K - Credits erhalten") and the plugin's row "Dein 7% Cashback | amount": 16 text-subtle,
   separator #B2B2B2 Light, amount #4F7300 SemiBold via --ckcb-earn-color (Figma #89898F / #79C00A fail WCAG 1.4.3). The plugin's hints under the row stay hidden. */ body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ck-sc-credits {
  min-width: 0;
  margin: -0.2em 0 -0.1em;
  color: var(--ck-sc-muted);
  font: 400 calc(16 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.02em;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ck-sc-credits :is(.woocommerce-Price-amount, bdi, .woocommerce-Price-currencySymbol) {
  color: inherit;
  font: inherit;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ckcb-earn-row--side {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 0;
  margin: -0.2em 0 -0.1em;
  color: var(--ck-sc-muted);
  font: 400 calc(16 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.02em;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ckcb-earn-row--side :is(.fkcart-summary-text, .fkcart-summary-amount) {
  display: contents;
  margin: 0;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ckcb-earn-row--side .ckcb-earn-amount {
  color: var(--ckcb-earn-color);
  font-weight: 600;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-order-summary .ckcb-earn-row--side .ckcb-earn-amount::before {
  content: '|';
  margin: 0 calc(3 * var(--ck-design-unit));
  color: #B2B2B2;
  font-weight: 300;
}

/* Brand CTA 491.87 x 49, 28 below the totals. */ body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-checkout-wrap {
  display: contents;
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-checkout-info {
  order: 1;
  padding: calc(28 * var(--ck-design-unit)) var(--ck-sc-x) 0;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button {
  --ck-button-fill: var(--action-lime, #A9FF00);
  position: relative;
  z-index: 0;
  isolation: isolate;
  align-items: center;
  height: calc(49 * var(--ck-design-unit));
  min-height: 44PX;
  padding: 0 calc(84 * var(--ck-design-unit)) 0 calc(35 * var(--ck-design-unit));
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 1;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button::before, body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button::after {
  content: '';
  position: absolute;
  z-index: -1;
  display: block;
  background: var(--ck-button-fill);
  pointer-events: none;
  transition: background-color 160ms ease;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button::before {
  inset: 0;
  clip-path: var(--ck-brand-cta-clip);
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button::after {
  inset: 0 0 0 auto;
  width: calc(70.479 * var(--ck-design-unit));
  -webkit-mask: var(--ck-brand-mark) center / 100% 100% no-repeat;
  mask: var(--ck-brand-mark) center / 100% 100% no-repeat;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button .fkcart-checkout--text {
  margin: 0;
  color: var(--text-dark, #000000);
  font: 800 calc(22 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:hover {
  --ck-button-fill: var(--action-hover, #95E600);
  opacity: 1;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:focus-visible {
  --ck-button-fill: var(--error-red, #D9231C);
  outline: none;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:focus-visible .fkcart-checkout--text {
  color: var(--text-light, #FFFFFF);
}

body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-shopping-link:not(.fkcart-hide) {
  order: 3;
  display: inline-block;
  align-self: center;
  margin: calc(16 * var(--ck-design-unit)) auto 0;
  color: var(--text-dark, #000000);
  font: 500 calc(15 * var(--ck-design-unit))/1.2 var(--brand-font), sans-serif;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-shopping-link, .fkcart-primary-button, .fkcart-button):focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: 2PX;
}

/* Text fields of the drawer and its variation panel (owner 07.10): the site's field focus as on the product page ("input-focus"
   of template 1126), a flush black border without an outer ring or gap; that border is the visible focus indicator for mouse
   and keyboard. The stepper's number cells mark focus on the stepper's outer border instead. */ body #fkcart-modal.fkcart-modal :is(input[type="text"], input[type="email"], input[type="search"], input[type="tel"], input:not([type]), textarea):is(:focus, :focus-visible):not(.fkcart-quantity__input, .ck-sc-qty-value) {
  border-color: var(--text-dark, #000000);
  outline: none;
  outline-offset: 0;
  box-shadow: none;
}

body #fkcart-modal.fkcart-modal .fkcart-coupon-area .fkcart-coupon-input-wrap #fkcart-coupon__input:focus {
  border-color: var(--text-dark, #000000);
  outline: 0;
  box-shadow: none;
}

/* Empty cart (owner 07.10): the background of the current shop's empty cart (matchball photo, media 3421, under a 90 % white
   veil, FunnelKit's class has-zero-state), black cart icon, italic uppercase title, text and the brand CTA. */ body #fkcart-modal.fkcart-modal .fkcart-preview-ui.has-zero-state {
  background: var(--text-light, #FFFFFF) url('/wp-content/uploads/2026/10/ck-sidecart-empty-matchball.webp') center / cover no-repeat;
  box-shadow: inset 0 0 0 100vmax rgba(255, 255, 255, 0.9);
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui.has-zero-state .fkcart-slider-body {
  background: transparent;
}

body #fkcart-modal.fkcart-modal .fkcart-preview-ui.has-zero-state .fkcart-slider-footer {
  padding: 0;
  background: transparent;
}

body #fkcart-modal.fkcart-modal .fkcart-zero-state:not(.fkcart-hide) {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(16 * var(--ck-design-unit));
  margin: 0;
  padding: calc(40 * var(--ck-design-unit)) calc(36 * var(--ck-design-unit));
  text-align: center;
}

body #fkcart-modal.fkcart-modal .fkcart-zero-state .fkcart-icon-cart {
  margin: 0;
  color: var(--text-dark, #000000);
  line-height: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-zero-state .fkcart-icon-cart svg {
  width: calc(56 * var(--ck-design-unit));
  height: calc(56 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-zero-state .fkcart-zero-state-title {
  margin: 0;
  color: var(--text-dark, #000000);
  font: italic 900 calc(28 * var(--ck-design-unit))/1.1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

body #fkcart-modal.fkcart-modal .fkcart-zero-state .fkcart-zero-state-text {
  max-width: calc(380 * var(--ck-design-unit));
  margin: 0;
  color: var(--text-dark, #000000);
  font: 400 calc(17 * var(--ck-design-unit))/calc(25 * var(--ck-design-unit)) var(--brand-font), sans-serif;
}

/* Brand CTA with the C mark: the empty cart's shop button and the variation panel's "Aktualisieren". */ body #fkcart-modal.fkcart-modal :is(.fkcart-zero-state .fkcart-shop-button, .fkcart-quick-view-drawer .fkcart-add-variant-product) {
  --ck-button-fill: var(--action-lime, #A9FF00);
  position: relative;
  z-index: 0;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: calc(49 * var(--ck-design-unit));
  min-height: 44PX;
  margin: calc(8 * var(--ck-design-unit)) 0 0;
  padding: 0 calc(84 * var(--ck-design-unit)) 0 calc(35 * var(--ck-design-unit));
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--text-dark, #000000);
  font: 800 calc(22 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-zero-state .fkcart-shop-button, .fkcart-quick-view-drawer .fkcart-add-variant-product)::before, body #fkcart-modal.fkcart-modal :is(.fkcart-zero-state .fkcart-shop-button, .fkcart-quick-view-drawer .fkcart-add-variant-product)::after {
  content: '';
  position: absolute;
  z-index: -1;
  display: block;
  background: var(--ck-button-fill);
  pointer-events: none;
  transition: background-color 160ms ease;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-zero-state .fkcart-shop-button, .fkcart-quick-view-drawer .fkcart-add-variant-product)::before {
  inset: 0;
  clip-path: var(--ck-brand-cta-clip);
}

body #fkcart-modal.fkcart-modal :is(.fkcart-zero-state .fkcart-shop-button, .fkcart-quick-view-drawer .fkcart-add-variant-product)::after {
  inset: 0 0 0 auto;
  width: calc(70.479 * var(--ck-design-unit));
  -webkit-mask: var(--ck-brand-mark) center / 100% 100% no-repeat;
  mask: var(--ck-brand-mark) center / 100% 100% no-repeat;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-zero-state .fkcart-shop-button, .fkcart-quick-view-drawer .fkcart-add-variant-product):hover {
  --ck-button-fill: var(--action-hover, #95E600);
}

body #fkcart-modal.fkcart-modal :is(.fkcart-zero-state .fkcart-shop-button, .fkcart-quick-view-drawer .fkcart-add-variant-product):focus-visible {
  --ck-button-fill: var(--error-red, #D9231C);
  color: var(--text-light, #FFFFFF);
  outline: none;
}

/* Side cart messages (coupon applied / invalid, stock): the site's notice box (Kit section "wc-notices") with the round
   status icon instead of FunnelKit's svg. */ body #fkcart-modal.fkcart-modal .fkcart-slider-notices {
  top: calc(12 * var(--ck-design-unit));
  right: calc(12 * var(--ck-design-unit));
  left: auto;
  width: calc(var(--fkcart-slider-desktop-width) - 24 * var(--ck-design-unit));
  max-width: calc(100% - 24 * var(--ck-design-unit));
  min-height: 0;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0;
  text-align: left;
  padding: calc(18 * var(--ck-design-unit)) calc(24 * var(--ck-design-unit)) calc(18 * var(--ck-design-unit)) calc(64 * var(--ck-design-unit));
  border: 0;
  border-radius: calc(16 * var(--ck-design-unit));
  background: var(--surface-soft, #F2F2F6);
  box-shadow: 0 calc(8 * var(--ck-design-unit)) calc(24 * var(--ck-design-unit)) rgba(0, 0, 0, 0.12);
  color: var(--text-dark, #000000);
  font: 400 calc(17 * var(--ck-design-unit))/calc(25 * var(--ck-design-unit)) var(--brand-font), sans-serif;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices .fkcart-notice-icon {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices .fkcart-notice-text {
  margin: 0;
  color: inherit;
  font: inherit;
  text-align: left;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices::before, body #fkcart-modal.fkcart-modal .fkcart-slider-notices::after {
  position: absolute;
  top: calc(18.5 * var(--ck-design-unit));
  left: calc(24 * var(--ck-design-unit));
  display: block;
  width: calc(24 * var(--ck-design-unit));
  height: calc(24 * var(--ck-design-unit));
  margin: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices::before {
  content: '';
  border-radius: 50%;
  background: var(--brand-orange, #FF330A);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices::after {
  content: '!';
  color: var(--text-light, #FFFFFF);
  font: 800 calc(15 * var(--ck-design-unit))/calc(24 * var(--ck-design-unit)) var(--brand-font), sans-serif;
  text-align: center;
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices[data-status='warning']::before {
  background: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices[data-status='warning']::after {
  content: 'i';
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices[data-status='success']::before {
  background: var(--action-lime, #A9FF00);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices[data-status='success']::after {
  content: '';
  top: calc(24 * var(--ck-design-unit));
  left: calc(33 * var(--ck-design-unit));
  width: calc(6 * var(--ck-design-unit));
  height: calc(11 * var(--ck-design-unit));
  border: solid var(--text-dark, #000000);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-slider-notices a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: calc(1 * var(--ck-design-unit));
  text-underline-offset: calc(3 * var(--ck-design-unit));
}

/* Cashback gift picker of the plugin Catch & Keep Cashback (after the cart items). */ body #fkcart-modal.fkcart-modal .ckcb-gifts--side {
  margin: 0 var(--ck-sc-inset) calc(20 * var(--ck-design-unit));
  padding: calc(16 * var(--ck-design-unit));
  border-radius: calc(10 * var(--ck-design-unit));
  background: var(--surface-soft, #F2F2F6);
  font-size: calc(16 * var(--ck-design-unit));
}

/* Variation panel "Ausführung wählen" (FunnelKit quick view inside the drawer, owner 07.10): grey header with the italic
   title and the round close button like the drawer; a head like a cart row (image tile, name in up to two lines, former
   price struck through + price + saving chip, stepper + stock chip); the product page's swatches (.ck-pdp-swatch, built over
   FunnelKit's selects by Custom Code "Seitenwarenkorb – Bedienhilfen"), "Zurücksetzen", the product page's personalisation
   block (WPCode 3396 / "Produkte – Personalisierung"), hint and messages, and the brand CTA in a grey footer. No short
   description and no "View details" link (owner 07.10). */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer {
  display: flex;
  flex-direction: column;
  background: var(--text-light, #FFFFFF);
  color: var(--text-dark, #000000);
  font-family: var(--brand-font), sans-serif;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-drawer-header {
  flex: 0 0 auto;
  border: 0;
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-drawer-header-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--ck-design-unit));
  min-height: calc(60 * var(--ck-design-unit));
  padding: calc(8 * var(--ck-design-unit)) var(--ck-sc-x);
  border: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-drawer-header-heading {
  margin: 0;
  color: var(--text-dark, #000000);
  font: italic 900 calc(24 * var(--ck-design-unit))/1.1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: calc(44 * var(--ck-design-unit));
  min-width: 32PX;
  height: calc(44 * var(--ck-design-unit));
  min-height: 32PX;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--surface-muted, #DCDCE2);
  color: var(--text-dark, #000000);
  cursor: pointer;
  transition: background-color 160ms ease;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close::before, body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(16 * var(--ck-design-unit));
  min-width: 12PX;
  height: calc(2 * var(--ck-design-unit));
  min-height: 1.5PX;
  border-radius: 1PX;
  background: currentColor;
  transform: translate(-50%, -50%) rotate(45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close:hover {
  background: #C9C9D1;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close:focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: 2PX;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close svg {
  display: none;
}

/* Scroll: the content scrolls between the fixed header and the CTA footer, so short screens reach every option. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.fkcart-drawer-content, .fkcart-drawer-shimmer) {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  padding: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Head like a cart row: image tile 100 x 120 beside name, price row and stepper row, centred on the tile; everything else
   across the inner width below. FunnelKit's and WooCommerce's wrappers take no box (display: contents), so their parts
   join one grid while WooCommerce still finds them inside the form (:where keeps that catch-all below the placements). */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: calc(100 * var(--ck-design-unit)) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto auto auto minmax(0, 1fr);
  column-gap: calc(20 * var(--ck-design-unit));
  margin: 0;
  padding: calc(30 * var(--ck-design-unit)) var(--ck-sc-x) calc(30 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap :is(.fkcart-product-form-fields, .fkcart-product-form-fields > .fkcart-product-form-field, form.variations_form, .single_variation_wrap, .single_variation_wrap > .fkcart-product-form-field, .woocommerce-variation-add-to-cart) {
  display: contents;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap :where(.fkcart-product-form-fields > .fkcart-product-form-field, form.variations_form, .single_variation_wrap, .single_variation_wrap > .fkcart-product-form-field, .woocommerce-variation-add-to-cart) > * {
  grid-column: 1 / -1;
  min-width: 0;
  margin: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap > .fkcart-panel {
  margin: 0;
  padding: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap > .fkcart-product-form-thumbnail {
  grid-column: 1;
  grid-row: 1 / 6;
  align-self: start;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-thumbnail .fkcart-image-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100 * var(--ck-design-unit));
  height: calc(120 * var(--ck-design-unit));
  margin: 0;
  padding: calc(7 * var(--ck-design-unit));
  overflow: hidden;
  border: 0;
  border-radius: calc(8.333 * var(--ck-design-unit));
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-thumbnail .fkcart-image-wrapper img {
  width: 100%;
  max-width: none;
  height: 100%;
  border: 0;
  border-radius: 0;
  object-fit: contain;
  mix-blend-mode: multiply;
}

/* Name 20/26 SemiBold, up to two lines, then an ellipsis (the max-height keeps two lines where clamping is unsupported). */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap > .fkcart-product-name-thumbnail {
  grid-column: 2;
  grid-row: 2;
  text-align: start;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-name-thumbnail .fkcart-item-title {
  display: -webkit-box;
  max-height: calc(2 * 1.3em);
  margin: -0.35em 0 -0.25em;
  overflow: hidden;
  color: var(--text-dark, #000000);
  font: 600 calc(20 * var(--ck-design-unit))/1.3 var(--brand-font), sans-serif;
  letter-spacing: -0.008em;
  text-align: start;
  text-decoration: none;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-name-thumbnail .fkcart-item-title:focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: 2PX;
}

/* Price row: the product's price range until a variation is chosen, then the variation price with its saving chip. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap :is(.fkcart-item-product-stock, .fkcart-item-custom) {
  grid-column: 2;
  grid-row: 3;
  margin-top: calc(12 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .fkcart-item-custom.fkcart-hide {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .woocommerce-variation.single_variation {
  display: grid;
  grid-column: 2;
  grid-row: 3 / 5;
  grid-template-columns: calc(var(--ck-sc-qty-w) + 12 * var(--ck-design-unit)) minmax(0, 1fr);
  grid-template-rows: subgrid;
  align-items: center;
  margin: 0;
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap:not(:has(.fkcart-quantity__input)) .woocommerce-variation.single_variation {
  grid-template-columns: minmax(0, 1fr);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap:not(:has(.fkcart-quantity__input)) .woocommerce-variation-availability {
  grid-column: 1;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation.single_variation > * {
  pointer-events: auto;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-description {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-price {
  display: flex;
  flex-wrap: wrap;
  grid-column: 1 / -1;
  grid-row: 1;
  align-items: center;
  gap: calc(6 * var(--ck-design-unit)) calc(10 * var(--ck-design-unit));
  margin-top: calc(12 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-price:empty {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.woocommerce-variation-price, .fkcart-item-price) .price, body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-item-price {
  display: flex;
  align-items: baseline;
  gap: calc(6 * var(--ck-design-unit));
  margin: 0;
  color: var(--text-dark, #000000);
  font: 600 calc(20 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.woocommerce-variation-price, .fkcart-item-price) del {
  margin: 0;
  color: var(--ck-sc-strike);
  font: 400 calc(16 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  text-decoration: line-through;
  text-decoration-thickness: 1PX;
  opacity: 1;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.woocommerce-variation-price, .fkcart-item-price) ins {
  margin: 0;
  color: var(--text-dark, #000000);
  font: inherit;
  text-decoration: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.woocommerce-variation-price, .fkcart-item-price) :is(.woocommerce-Price-amount, bdi, .woocommerce-Price-currencySymbol) {
  color: inherit;
  font: inherit;
  text-decoration: none;
}

/* Saving chip "Spare n%" (Custom Code), the side cart's chip look; stock chip: lime in stock, the red chip for low stock
   ("Nur noch n vorrätig", WPCode 3396), grey when sold out or on backorder. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.ck-sc-panel-saving, .woocommerce-variation-availability .stock) {
  display: block;
  width: fit-content;
  margin: 0;
  padding: calc(4.2 * var(--ck-design-unit)) calc(9 * var(--ck-design-unit)) calc(5.6 * var(--ck-design-unit));
  border: 0;
  border-radius: calc(4 * var(--ck-design-unit));
  font: 600 calc(14 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  text-transform: uppercase;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-sc-panel-saving {
  background: var(--ck-sc-chip-bg);
  color: var(--ck-sc-chip-text);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-availability {
  grid-column: 2;
  grid-row: 2;
  justify-self: start;
  margin-top: calc(14 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-availability:empty {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-availability .fkcart-stock-detail {
  margin: 0;
  padding: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-availability .stock {
  background: var(--action-lime, #A9FF00);
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-availability .stock.ck-low-stock {
  background: var(--ck-sc-chip-bg);
  color: var(--ck-sc-chip-text);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-availability .stock:is(.out-of-stock, .available-on-backorder) {
  background: var(--surface-muted, #DCDCE2);
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-availability .stock::before {
  content: none;
  display: none;
}

@supports (text-box: trim-both cap alphabetic) {
  body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.ck-sc-panel-saving, .woocommerce-variation-availability .stock) {
    padding-block: calc(7 * var(--ck-design-unit));
    text-box: trim-both cap alphabetic;
  }
}

/* Stepper row: the item stepper (shared stepper rules; its wrapper takes FunnelKit's "display: inherit", so it is set here),
   no visible label (the input is named "Menge"). */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .woocommerce-variation-add-to-cart > .fkcart-input-label {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .woocommerce-variation-add-to-cart > .fkcart-form-input-wrap {
  position: relative;
  display: block;
  z-index: 1;
  grid-column: 2;
  grid-row: 4;
  justify-self: start;
  align-self: center;
  margin: calc(14 * var(--ck-design-unit)) 0 0 !important;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer [class*="fkcart-quantity-sel"].is-disabled {
  opacity: 0.5;
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .wc-gzd-additional-info-placeholder:empty {
  display: none;
}

/* Options: label 15 SemiBold over the product page's swatches (colour tiles, size and cut chips); the selects stay in the
   form for WooCommerce and FunnelKit, hidden like on the product page. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .fkcart-product-form-field.variations {
  order: 1;
  margin-top: calc(28 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer table.variations, body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer table.variations :is(tbody, tr, th, td) {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: start;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer table.variations tr + tr {
  margin-top: calc(20 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-input-label {
  display: block;
  margin: -0.3em 0 calc(10 * var(--ck-design-unit) - 0.2em);
  padding: 0;
  color: var(--text-dark, #000000);
  font: 600 calc(15 * var(--ck-design-unit))/1.2 var(--brand-font), sans-serif;
  letter-spacing: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-form-input-wrap {
  position: relative;
  margin: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-form-input-wrap:has(> select:not(.ck-pdp-native-select))::after {
  content: '';
  position: absolute;
  top: 50%;
  right: calc(19 * var(--ck-design-unit));
  width: calc(8 * var(--ck-design-unit));
  height: calc(8 * var(--ck-design-unit));
  border: solid var(--text-dark, #000000);
  border-width: 0 1.5PX 1.5PX 0;
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-form-input-wrap select {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: calc(48 * var(--ck-design-unit));
  min-height: 40PX;
  margin: 0;
  padding: 0 calc(44 * var(--ck-design-unit)) 0 calc(16 * var(--ck-design-unit));
  border: 1PX solid var(--line-soft);
  border-radius: calc(8 * var(--ck-design-unit));
  outline: 0;
  background: var(--text-light, #FFFFFF);
  box-shadow: none;
  color: var(--text-dark, #000000);
  font: 400 calc(17 * var(--ck-design-unit))/1.2 var(--brand-font), sans-serif;
  cursor: pointer;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-form-input-wrap select:hover {
  border-color: var(--text-subtle, #6B6A73);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-form-input-wrap select:focus {
  border-color: var(--text-dark, #000000);
  outline: 0;
  box-shadow: inset 0 0 0 1PX var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-form-input-wrap select.ck-pdp-native-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 0 !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
  white-space: nowrap !important;
}

/* While the colours load (quick-buy card data) the option rows show the site's busy sheen instead of the bare selects. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer form.ck-sc-panel-loading table.variations td.value {
  height: calc(35 * var(--ck-design-unit));
  border-radius: calc(10 * var(--ck-design-unit));
  background-color: var(--surface-soft, #F2F2F6);
  background-image: var(--ck-busy-sheen);
  background-repeat: no-repeat;
  background-size: 300% 100%;
  animation: ck-busy-sheen-body 2.2s ease-in-out infinite;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer form.ck-sc-panel-loading table.variations td.value > * {
  visibility: hidden;
}

/* Swatches as on the product page (template 1126, ckdcart): 35 high, radius 10, size and cut chips, colour tiles with the
   check on the chosen one; sold-out choices that can be requested again stay selectable (struck through, half opacity),
   unavailable ones are disabled. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: round(calc(6 * var(--ck-design-unit)), 1px) round(calc(5 * var(--ck-design-unit)), 1px);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch {
  all: unset;
  box-sizing: border-box;
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: calc(35 * var(--ck-design-unit));
  height: calc(35 * var(--ck-design-unit));
  padding: 0.1em calc(12 * var(--ck-design-unit)) 0;
  border: 1px solid var(--line-soft);
  border-radius: calc(10 * var(--ck-design-unit));
  background: var(--text-light, #FFFFFF);
  color: var(--text-muted, #606060);
  font: 500 calc(18 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-transform: none;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch:hover:not(:disabled):not([aria-pressed="true"]) {
  border-color: var(--surface-ink, #09090B);
  color: var(--surface-ink, #09090B);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch[aria-pressed="true"] {
  border-color: var(--surface-ink, #09090B);
  background: var(--surface-ink, #09090B);
  color: var(--text-light, #FFFFFF);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch:focus-visible {
  outline: 2px solid var(--text-dark, #000000);
  outline-offset: 2px;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch:disabled::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(45deg, transparent calc(50% - 0.7px), currentColor calc(50% - 0.7px), currentColor calc(50% + 0.7px), transparent calc(50% + 0.7px));
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch.ck-pdp-swatch--oos:not(:disabled) {
  opacity: 0.5;
  cursor: pointer;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches button.ck-pdp-swatch.ck-pdp-swatch--oos:not(:disabled)::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(45deg, transparent calc(50% - 0.7px), var(--swatch-line, #8E94A3) calc(50% - 0.7px), var(--swatch-line, #8E94A3) calc(50% + 0.7px), transparent calc(50% + 0.7px));
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches--groesse button.ck-pdp-swatch {
  padding-inline: calc(12 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ck-pdp-swatches--schnitt button.ck-pdp-swatch {
  padding-inline: calc(17 * var(--ck-design-unit));
  font-size: calc(17 * var(--ck-design-unit));
}

/* While FunnelKit updates the line the choices pause. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer form.ck-sc-panel-busy :is(.ck-pdp-swatches, .ckpers, [class*="fkcart-quantity-sel"], .reset_variations) {
  pointer-events: none;
}

/* "Zurücksetzen": site link under the options, end-aligned (WooCommerce shows it once a value is chosen). */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .fkcart-product-form-reset-form {
  display: flex;
  order: 2;
  justify-content: flex-end;
  margin-top: calc(14 * var(--ck-design-unit));
  padding: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-reset-form .reset_variations {
  margin: 0;
  color: var(--text-dark, #000000);
  font: 400 calc(15 * var(--ck-design-unit))/1.2 var(--brand-font), sans-serif;
  text-decoration: underline;
  text-decoration-thickness: calc(1 * var(--ck-design-unit));
  text-underline-offset: calc(3 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .reset_variations:focus-visible {
  outline: 2PX solid var(--text-dark, #000000);
  outline-offset: 2PX;
}

/* Personalisation: the product page's block (template 1126, ckdperssc) in the drawer's units: dashed toggle with price and
   "Details", fields with counters, inline error; its details dialog slides in from the right like on the product page. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .ckpers {
  order: 3;
  width: 100%;
  margin-top: calc(28 * var(--ck-design-unit));
  color: var(--text-dark, #000000);
  font-family: var(--brand-font), sans-serif;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-heading {
  display: flex;
  align-items: center;
  gap: calc(11 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-toggle {
  flex: 0 1 calc(255 * var(--ck-design-unit));
  min-width: 0;
  min-height: calc(37 * var(--ck-design-unit));
  margin: 0;
  padding: calc(8 * var(--ck-design-unit)) calc(12 * var(--ck-design-unit));
  border: 1px dashed rgb(0 0 0 / 0.27);
  border-radius: calc(10 * var(--ck-design-unit));
  background: var(--text-light, #FFFFFF);
  box-shadow: none;
  color: var(--text-dark, #000000);
  font: 500 calc(18 * var(--ck-design-unit))/1.1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-transform: none;
  cursor: pointer;
  transition: background-color 0.15s, color 0.15s;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-toggle:hover {
  background: var(--surface-soft, #F2F2F6);
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-active .ckpers-toggle {
  border: 1px solid var(--text-dark, #000000);
  border-bottom: 0;
  border-radius: calc(10 * var(--ck-design-unit)) calc(10 * var(--ck-design-unit)) 0 0;
  background: var(--text-dark, #000000);
  color: var(--text-light, #FFFFFF);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-price {
  font: 600 calc(18 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-price :is(.woocommerce-Price-amount, bdi, .woocommerce-Price-currencySymbol) {
  color: inherit;
  font: inherit;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-details {
  margin: 0 0 0 auto;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  color: #4F7300;
  font: 500 calc(15 * var(--ck-design-unit))/1 var(--brand-font), sans-serif;
  text-decoration: underline;
  text-transform: none;
  text-underline-offset: 0.15em;
  cursor: pointer;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(11 * var(--ck-design-unit));
  min-height: calc(95 * var(--ck-design-unit));
  padding: calc(9 * var(--ck-design-unit));
  border: 1px dashed rgb(0 0 0 / 0.27);
  border-radius: 0 calc(10 * var(--ck-design-unit)) calc(10 * var(--ck-design-unit)) calc(10 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-fields[hidden] {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-example {
  display: flex;
  flex: 0 1 calc(154 * var(--ck-design-unit));
  align-items: center;
  justify-content: center;
  height: calc(72 * var(--ck-design-unit));
  overflow: hidden;
  border-radius: calc(15 * var(--ck-design-unit));
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-example img {
  width: calc(135.45 * var(--ck-design-unit));
  max-width: 100%;
  height: auto;
  mix-blend-mode: darken;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-inputs {
  display: grid;
  flex: 1 1 0;
  gap: calc(8 * var(--ck-design-unit));
  min-width: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-field {
  position: relative;
  width: 100%;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-field input {
  box-sizing: border-box;
  width: 100%;
  height: calc(40 * var(--ck-design-unit));
  margin: 0;
  padding: 0 calc(56 * var(--ck-design-unit)) 0 calc(18 * var(--ck-design-unit));
  border: 1px solid transparent;
  border-radius: calc(10 * var(--ck-design-unit));
  outline: 0;
  background: var(--surface-soft, #F2F2F6);
  box-shadow: none;
  color: var(--text-dark, #000000);
  font-family: inherit;
  font-size: max(16px, calc(15 * var(--ck-design-unit)));
  line-height: normal;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-field input:is(:focus, :focus-visible) {
  border-color: var(--text-dark, #000000);
  outline: none;
  box-shadow: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-field input[aria-invalid="true"] {
  border-color: var(--error-red, #D9231C);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-count {
  position: absolute;
  top: 50%;
  right: calc(13 * var(--ck-design-unit));
  color: var(--text-muted, #606060);
  font-size: calc(13 * var(--ck-design-unit));
  transform: translateY(-50%);
  pointer-events: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-error {
  flex: 1 0 100%;
  margin: 0;
  color: var(--error-red, #D9231C);
  font-size: max(13px, calc(15 * var(--ck-design-unit)));
  line-height: 1.3;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-error:empty {
  display: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers button:focus-visible {
  outline: 2px solid var(--text-dark, #000000);
  outline-offset: 3px;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog {
  position: fixed;
  inset: 0 0 0 auto;
  box-sizing: border-box;
  width: calc(543 * var(--ck-desktop-unit));
  min-width: min(420px, 100%);
  max-width: 100%;
  height: 100dvh;
  max-height: 100dvh;
  margin: 0;
  padding: 0;
  border: 0;
  background: var(--text-light, #FFFFFF);
  color: var(--text-muted, #606060);
  font-family: var(--brand-font), sans-serif;
  transform: translateX(100%);
  transition: transform 0.2s ease-out;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog[open] {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: translateX(0);
}

@starting-style {
  body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog[open] {
    transform: translateX(100%);
  }
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog.ckpers-closing {
  transform: translateX(100%);
  transition-duration: 0.18s;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog::backdrop {
  background: rgb(0 0 0 / 0.33);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: calc(18 * var(--ck-design-unit));
  min-height: calc(60 * var(--ck-design-unit));
  padding: calc(8 * var(--ck-design-unit)) var(--ck-sc-x);
  background: var(--surface-soft, #F2F2F6);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-header h2 {
  margin: 0;
  color: var(--text-dark, #000000);
  font: italic 900 calc(24 * var(--ck-design-unit))/1.1 var(--brand-font), sans-serif;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-close {
  display: flex;
  flex: 0 0 calc(44 * var(--ck-design-unit));
  align-items: center;
  justify-content: center;
  width: calc(44 * var(--ck-design-unit));
  min-width: 32PX;
  height: calc(44 * var(--ck-design-unit));
  min-height: 32PX;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--surface-muted, #DCDCE2);
  box-shadow: none;
  color: var(--text-dark, #000000);
  font-size: 0;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-close-icon {
  display: block;
  flex: 0 0 auto;
  width: calc(12 * var(--ck-design-unit));
  min-width: 10PX;
  height: calc(12 * var(--ck-design-unit));
  min-height: 10PX;
  position: relative;
}

/* The cross is drawn with two pseudo-element bars (project rule: close icons in CSS, not SVG). */
body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-close-icon::before,
body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-close-icon::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 141%;
  height: 2px;
  border-radius: 1px;
  background: currentColor;
  transform: translate(-50%, -50%) rotate(45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-close-icon::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-close:is(:hover, :focus-visible) {
  background: #C9C9D1;
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-content {
  flex: 1 1 auto;
  min-height: 0;
  padding: calc(30 * var(--ck-design-unit)) var(--ck-sc-x) calc(40 * var(--ck-design-unit));
  overflow-y: auto;
  overscroll-behavior: contain;
  font-size: calc(18 * var(--ck-design-unit));
  line-height: 1.3;
  letter-spacing: -0.02em;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-content p {
  margin: 0 0 1.3em;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-content strong {
  color: var(--text-dark, #000000);
  font-weight: 600;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-content ul {
  margin: 0;
  padding-left: 1.2em;
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-content li + li {
  margin-top: 1.2em;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog-content hr {
  height: 0;
  margin: calc(35 * var(--ck-design-unit)) 0;
  border: 0;
  border-top: 1px solid var(--photo-caption);
}

/* Hint while options are missing (status text), the server's refusal (site notice box, Kit section "wc-notices") and
   WooCommerce's "no matching variation" note across the inner width; the restock request replaces that note. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .wc-no-matching-variations {
  order: 4;
  margin-top: calc(20 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer:has(.ckrestock-trigger) .wc-no-matching-variations {
  display: none !important;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .ck-sc-panel-hint {
  order: 5;
  margin-top: calc(20 * var(--ck-design-unit));
  color: var(--text-subtle, #6B6A73);
  font: 400 calc(15 * var(--ck-design-unit))/1.3 var(--brand-font), sans-serif;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap .ck-sc-panel-error {
  order: 6;
  margin-top: calc(20 * var(--ck-design-unit));
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-wrap :is(.ck-sc-panel-hint, .ck-sc-panel-error)[hidden] {
  display: none;
}

/* No short description ("Beschreibung") and no "View details" link in the panel (owner 07.10). */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.fkcart-desc-title, .fkcart-product-description, .fkcart-view-link-wrap) {
  display: none;
}

/* Loading (FunnelKit's placeholder while the panel loads): the site's busy sheen on soft grey blocks. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-drawer-shimmer .fkcart-shimmer {
  border-radius: calc(8 * var(--ck-design-unit));
  background-color: var(--surface-soft, #F2F2F6);
  background-image: var(--ck-busy-sheen);
  background-repeat: no-repeat;
  background-size: 300% 100%;
  animation: ck-busy-sheen-body 2.2s ease-in-out infinite;
}

/* Footer: grey bar with the full-width brand CTA at the bottom of the panel. */ body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-product-form-button {
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: auto 0 0;
  padding: calc(18 * var(--ck-design-unit)) var(--ck-sc-x);
  border: 0;
  background: var(--surface-soft, #F2F2F6);
  box-shadow: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product {
  display: flex;
  width: 100%;
  margin: 0;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product:is(:disabled, .is-disabled) {
  opacity: 0.45;
  cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
  body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(form.ck-sc-panel-loading table.variations td.value, .fkcart-drawer-shimmer .fkcart-shimmer) {
    animation: none;
  }

  body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer :is(.ckpers-dialog, .ckpers-dialog[open], .ckpers-dialog.ckpers-closing, .ck-pdp-swatch, .ckpers-toggle) {
    transition: none;
  }
}

/* Phones: the personalisation dialog fills the screen (100 %, not 100vw: the page's scrollbar gutter stays while a dialog is open). */ @media (max-width: 480px) {
  body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .ckpers-dialog {
    width: 100%;
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button::before, body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button::after, body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading .fkcart-modal-close, body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-quick-view-close, body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-select-options::after, body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-remove-item span {
    transition: none;
  }
}

/* Phones (FunnelKit's full-width drawer): the site mobile unit, so text keeps the mobile size; 20 side insets. */ @media (max-width: 480px) {
  body #fkcart-modal.fkcart-modal {
    --ck-design-unit: var(--ck-mobile-unit);
    --ck-sc-x: calc(20 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-slider-heading {
    padding-inline: calc(20 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-preview-ui .fkcart-reward-panel {
    padding-inline: calc(20 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item {
    gap: calc(14 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-info {
    gap: calc(10 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-wrap-start .fkcart-item-misc {
    min-width: calc(110 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-carousel-wrap .fkcart-carousel {
    padding-left: calc(20 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart_summary_cta .fkcart-checkout-info {
    padding-inline: calc(20 * var(--ck-design-unit));
  }

  body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button .fkcart-checkout--text {
    font-size: calc(19 * var(--ck-design-unit));
  }
}

/* Narrow phones: the stepper keeps its 24-pixel targets, so the info column gives back 2 between its parts. */ @media (max-width: 360px) {
  body #fkcart-modal.fkcart-modal .fkcart-slider-body .fkcart-item-wrap:not(.fkcart-carousel-wrap) .fkcart--item .fkcart-item-wrap-start .fkcart-item-meta {
    gap: calc(6 * var(--ck-design-unit));
  }
}

/* Busy states of the side cart buttons: the fkcart rules of the Kit section «brand-button-loading», repeated here
   because they must come after the side cart rules above (same specificity; in the Kit they followed the side cart
   section). Keyframes ck-busy-sheen-* and --ck-busy-* stay in the Kit. Keep both copies in sync. */
body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *) {
  opacity: 1;
  cursor: progress !important;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *)::before {
  background-image: var(--ck-busy-sheen);
  background-size: 300% 100%;
  background-repeat: no-repeat;
  background-position: 90% 0;
  animation: ck-busy-sheen-body 2.2s ease-in-out infinite;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *)::after {
  background-image: var(--ck-busy-sheen);
  background-size: 300% 100%;
  background-repeat: no-repeat;
  background-position: 90% 0;
  transform: none;
  animation: ck-busy-sheen-mark 2.2s ease-in-out infinite;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *)::after {
  height: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  transform: none;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *) .fkcart-checkout--text {
  color: var(--text-dark, #000000) !important;
}

body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *):focus-visible .fkcart-checkout--text {
  color: var(--text-light, #FFFFFF) !important;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-button, .fkcart-primary-button).fkcart-loading:not(.fkcart-loaded, .fkcart-quick-view-drawer .fkcart-add-variant-product):not(#ck-busy) {
  color: var(--text-dark, #000000);
  cursor: progress;
  background-image: var(--ck-busy-sheen);
  background-size: 300% 100%;
  background-repeat: no-repeat;
  background-position: 90% 0;
  animation: ck-busy-sheen-body 2.2s ease-in-out infinite;
}

body #fkcart-modal.fkcart-modal :is(.fkcart-button, .fkcart-primary-button).fkcart-loading:not(.fkcart-loaded, .fkcart-quick-view-drawer .fkcart-add-variant-product):not(#ck-busy)::after {
  content: none;
  animation: none;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product:is(.fkcart-loading, .fkcart-loaded):not(#ck-busy) {
  cursor: progress;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product:is(.fkcart-loading, .fkcart-loaded):not(#ck-busy):not(:focus-visible) {
  color: var(--text-dark, #000000);
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product:is(.fkcart-loading, .fkcart-loaded):not(#ck-busy)::before {
  background-image: var(--ck-busy-sheen);
  background-size: 300% 100%;
  background-repeat: no-repeat;
  background-position: 90% 0;
  animation: ck-busy-sheen-body 2.2s ease-in-out infinite;
}

body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product:is(.fkcart-loading, .fkcart-loaded):not(#ck-busy)::after {
  content: '';
  height: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  opacity: 1;
  transform: none;
  background-image: var(--ck-busy-sheen);
  background-size: 300% 100%;
  background-repeat: no-repeat;
  background-position: 90% 0;
  animation: ck-busy-sheen-mark 2.2s ease-in-out infinite;
}

#fkcart-modal .blockUI:is(.blockOverlay, .blockMsg) {
  opacity: 0 !important;
  cursor: progress !important;
}

@media (prefers-reduced-motion: reduce) {
body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *)::before,
body #fkcart-modal.fkcart-modal .fkcart-checkout-wrap #fkcart-checkout-button:is(.fkcart-loading, .fkcart-loading-active, .fkcart_spl_addon_active *)::after,
body #fkcart-modal.fkcart-modal :is(.fkcart-button, .fkcart-primary-button).fkcart-loading:not(.fkcart-loaded, .fkcart-quick-view-drawer .fkcart-add-variant-product):not(#ck-busy),
body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product:is(.fkcart-loading, .fkcart-loaded):not(#ck-busy)::before,
body #fkcart-modal.fkcart-modal .fkcart-quick-view-drawer .fkcart-add-variant-product:is(.fkcart-loading, .fkcart-loaded):not(#ck-busy)::after {
    background-image: var(--ck-busy-veil);
    background-size: auto;
    animation: none;
}
}/* End custom CSS */