/** Shopify CDN: Minification failed

Line 302:0 Expected "}" to go with "{"

**/
/*
 *  1.0. Mixins
*/
.product-item {
  position: relative;
  overflow: visible;

.product-item__image-figure {
  border-radius: var(--border-radius-cards) var(--border-radius-cards) 0 0;
  transition: opacity 0.3s linear, visibility 0.3s linear !important;
}
.product-item__image .lazy-image:before, .product-item__image .lazy-image:after {
  border-radius: var(--border-radius-cards) 0 0;
}
.product-item__image--no-text .product-item__image-figure {
  border-radius: var(--border-radius-cards);
}
.product-item__image-figure--secondary {
  opacity: 0;
  visibility: hidden;
}
.no-touchevents .product-item__image--has-secondary:hover .product-item__image-figure--primary {
  opacity: 0;
  visibility: hidden;
}
.no-touchevents .product-item__image--has-secondary:hover .product-item__image-figure--secondary {
  opacity: 1;
  visibility: visible;
}

div + .equalize-white-space {
  margin-top: -0.1875rem;
}

.product-item__price span {
  width: auto;
}
.product-item__price span:not(:first-child) {
  padding-inline-start: 0.5rem;
}
.product-item__price span:empty {
  display: none;
}
.product-item__price .product-price--unit {
  display: block;
  padding-inline-start: 0 !important;
  opacity: 0.76;
  font-size: 80%;
  margin-top: -0.125rem;
  margin-bottom: 0.125rem;
}

.product-item__text {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
}
.product-item__text.text-align--center {
  align-items: center;
}
.product-item__text.text-align--right {
  align-items: flex-end;
}
.product-item__text:empty {
  display: none;
}

.product-item__quick-buy {
  width: 100%;
}
.product-item__quick-buy .add-to-cart-preloader svg circle {
  stroke: var(--color-text-cards);
}
.product-item__title + .product-item__quick-buy {
  margin-top: 0.5rem;
}
.product-item__quick-buy .button {
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}

.product-item__title:last-child {
  margin-bottom: 0.5rem;
}

.product-item__text + .product-item__quick-buy {
  margin-top: 0.25rem;
}

.product-item__local-availability .alert {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
}
.product-item__local-availability .alert:before {
  width: 0.625rem;
  height: 0.625rem;
  margin-inline-end: 0.3125rem;
  top: 0.0625rem;
}
.product-item__local-availability .alert.alert--note:before {
  border-color: var(--color-text-cards);
}

.product-item__badges {
  position: absolute;
  top: var(--gutter-small);
  width: calc(100% - (var(--gutter-small) * 2));
  pointer-events: none;
}
html[dir=rtl] .product-item__badges {
  left: var(--gutter-small);
}
html[dir=ltr] .product-item__badges {
  right: var(--gutter-small);
}
.product-text .product-item__badges {
  position: static;
  display: flex;
  gap: 0.75rem;
  width: auto;
}

.product-item__badge {
  clear: both;
  float: right;
  margin-bottom: calc(var(--gutter-small) / 2);
  width: auto;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-inline-start: 0.4375rem;
  padding-inline-end: 0.4375rem;
  height: 1.5rem;
  border-radius: clamp(0px, var(--border-radius-buttons), 3px);
  background-color: #bbb;
  line-height: 1.5rem;
  text-transform: uppercase;
}
.product-text .product-item__badge {
  margin-bottom: 0;
  max-width: none;
  float: none;
  height: 1.75rem;
  line-height: 1.75rem;
  padding-inline-start: 0.5625rem;
  padding-inline-end: 0.5625rem;
}

.product-item__icons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 0;
}

.star-rating {
  font-size: 0;
  width: 100%;
  height: 1rem;
  display: grid;
  grid-template-columns: max-content auto;
  align-items: center;
  gap: 0.625rem;
}
.star-rating__stars {
  background-repeat: repeat-x;
  font-size: 0;
  display: inline-block;
  text-align: start;
}
.star-rating__stars-active {
  display: inline-block;
  font-size: 0;
  height: 0.875rem;
  background-repeat: repeat-x;
}

.main-content--align-product-items .product-item {
  display: flex;
  flex-direction: column;
}
.main-content--align-product-items .product-item__text:first-of-type {
  flex-grow: 1;
}

.product-item .stamped-badge-caption {
  margin-inline-start: 8px;
  font-size: 80%;
}
.product-item .yotpo .yotpo-bottomline .yotpo-icon-star, .product-item .yotpo .yotpo-bottomline .yotpo-icon-half-star, .product-item .yotpo .yotpo-bottomline .yotpo-icon-empty-star {
  color: var(--color-text-cards);
}
.product-item .yotpo a, .product-item .yotpo a:hover {
  color: var(--color-text-cards) !important;
  margin-inline-start: 8px;
  pointer-events: none !important;
}
.product-item .yotpo .standalone-bottomline.star-clickable, .product-item .yotpo .standalone-bottomline .star-clickable {
  cursor: default !important;
}

.libori-label {
  clear: both;
  float: right;
  margin-bottom: calc(var(--gutter-small) / 2);
  width: auto;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-inline-start: 0.4375rem;
  padding-inline-end: 0.4375rem;
  height: 1.5rem;
  border-radius: clamp(0px, var(--border-radius-buttons), 3px);
  background: #F69125;
  letter-spacing: .5px;
  color: var(--color-text-main);
  line-height: 1.5rem;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  z-index: 10;
  pointer-events: none;
}
.black-friday-label{
 color: #fff;
 background-color: #000;
 height: 1.5rem;
 padding: 3px;
 border-radius: clamp(0px, var(--border-radius-buttons), 3px);
}
.lx-flex-for-product-badges{
  display: flex;
  justify-content: end;
  gap: 5px;
}

/* ---------------------------------------------------------------------------
   a11y: eine Kachel, ein Link (WCAG 2.4.4 / 4.1.2)
   Der Titel-Link legt sich per ::after ueber die gesamte Karte. Dadurch ist die
   ganze Kachel klickbar, es gibt aber nur einen Tabstopp mit sprechendem Namen.
   Interaktive Elemente und Badges liegen darueber, damit sie bedienbar bleiben.
--------------------------------------------------------------------------- */
.product-item__title::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.product-item__quick-buy,
.product-item__icons,
.product-item__ratings,
.product-item__local-availability,
.product-item .yotpo,
.product-item .stamped-badge-caption {
  position: relative;
  z-index: 2;
}
/* Badges bleiben absolut positioniert (oben rechts) - nur die Ebene anheben */
.product-item__badges {
  z-index: 2;
}
.product-item__title:focus-visible {
  outline: none;
}


/* Fokusrahmen liegt auf der ganzen Kachel, nicht nur auf dem Titeltext.
   Nach innen versetzt, damit ihn das Raster bzw. der Slider nicht abschneidet. */
/* Fokusrahmen der Produktkachel. Liegt exakt auf dem 1px-Rahmen der Karte,
   damit nicht zwei Linien nebeneinander stehen. :has(:focus-visible) statt
   :focus-within, damit der Rahmen nur bei Tastaturbedienung erscheint und
   nicht bei jedem Mausklick. */
.product-item:has(.product-item__title:focus-visible) {
  outline: 3px solid var(--color-text-main);
  outline-offset: calc(-1 * var(--border-width-cards, 1px));
  border-radius: var(--border-radius-cards);
}

/* ---------------------------------------------------------------------------
   a11y: Seit das Produktbild kein eigener Link mehr ist (nur noch der Titel
   verlinkt und zieht sich per ::after ueber die Kachel), greift die
   Theme-Regel ".no-touchevents a:hover .lazy-image ... img" nicht mehr.
   Der Zoom haengt deshalb jetzt an der Kachel selbst - bei Hover UND Fokus.
--------------------------------------------------------------------------- */
.no-touchevents .product-item:hover .lazy-image.lazy-image--animation.lazyloaded img,
.product-item:has(a:focus-visible) .lazy-image.lazy-image--animation.lazyloaded img {
  transform: scale(1.0125);
  transition: transform 0.3s ease-out, opacity 300ms !important;
}
.no-touchevents .product-item:hover .text-animation--underline-thin,
.product-item:has(.product-item__title:focus-visible) .text-animation--underline-thin {
  background-size: 100% 1px;
}
