/** Shopify CDN: Minification failed

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

**/
/* ==============================
   Größen-Utilities für Inputs
============================== */
input.size-s, select.size-s, .bv_atual.size-s, .size-s input, .size-s select, .size-s .bv_atual { --input_h: calc(var(--btn_fz) * var(--main_lh_h) + var(--btn_pv) * 0.65 * 2) }
input.size-m, select.size-m, .bv_atual.size-m, .size-m input, .size-m select, .size-m .bv_atual { --input_h: calc(var(--btn_fz) * var(--main_lh_h) + var(--btn_pv) * 1.2 * 2) }
input.size-l, select.size-l, .bv_atual.size-l, .size-l input, .size-l select, .size-l .bv_atual { --input_h: calc(var(--btn_fz) * var(--main_lh_h) + var(--btn_pv) * 1.35 * 2) }

/* Logos / Inline-Bilder in Listen */
.l4al img, .l4al svg, .l4al picture { max-height: 25px !important; }

/* Responsive Layout-Anpassungen */
@media only screen and (max-width: 1356px) {
  .l4ft.static li.w33, .l4ft.static.w33 li { --mih: 22vw; }
  .l4ft.static li.w12,
  .l4ft.static li.w15,
  .l4ft.static li.w16,
  .l4ft.static li.w20,
  .l4ft.static li.w25,
  .l4ft.static li.w33,
  .l4ft.static.w12 li,
  .l4ft.static.w14 li,
  .l4ft.static.w16 li,
  .l4ft.static.w20 li,
  .l4ft.static.w25 li,
  .l4ft.static.w33 li { --mih: 22vw; }
}
@media only screen and (max-width: 1000px) {
  #root .l4ft.mobile-compact li { --mih: 145px; }
}
@media only screen and (max-width: 760px) {
  h1, .h1, .l4cl.category h1, #root .l4cl.category .size-50 { font-size: var(--mob_h1); }
  h1, .h1, .l4cl.category h1, #root .l4cl.category .size-50 { font-size: var(--mob_h1); }
  h2, .h2, .l4cl.category h2 { font-size: var(--mob_h2); }
  h3, .h3, .l4cl.category h3 { font-size: var(--mob_h3); }
  h4, .h4, .l4cl.category h4 { font-size: var(--mob_h4); }
  h5, .h5, .l4cl.category h5 { font-size: var(--mob_h5); }
  h6, .h6, .l4cl.category h6 { font-size: var(--mob_h6); }
  .lead { font-size: var(--mob_lead); }

  .f8sr { --f8sr_dist: 20px; }
  .f8sr fieldset > *:not(h1, h2, h3, h4, h5, h6, :first-child):before { display: none; }

  .l4ft.static li.w12,
  .l4ft.static li.w15,
  .l4ft.static li.w16,
  .l4ft.static li.w20,
  .l4ft.static li.w25,
  .l4ft.static li.w33,
  .l4ft.static.w12 li,
  .l4ft.static.w14 li,
  .l4ft.static.w16 li,
  .l4ft.static.w20 li,
  .l4ft.static.w25 li,
  .l4ft.static.w33 li { --mih: 300px; }
  .l4vw li.active:not(:first-child:last-child) { display: none; }
}

/* Multivariants (App/Layout) */
.multivariants_block_img_holder { width: 20% !important; flex: none !important; }
.multivariants_block_last_holder_labels { width: 45% !important; justify-content: center; }
.multivariants_block_qty_holder { width: 23% !important; }
.multivariants_block_prc_holder { width: 12% !important; justify-content: center; }
.multivariants_block_qty_box_right { margin-top: 0 !important; justify-content: flex-end; }
.multivariants_block_qty_input { color: #323231 !important; }

/* ==============================
   Password Page: Text schwarz
============================== */
body.template-password { color: #000 !important; }
body.template-password a,
body.template-password p,
body.template-password h1,
body.template-password h2,
body.template-password h3,
body.template-password h4,
body.template-password h5,
body.template-password h6,
body.template-password button,
body.template-password input,
body.template-password select,
body.template-password textarea { color: #000 !important; }











/* =========================================
   Header Wunschliste (Zähler + Hover)
========================================= */
.header__icon--wishlist {
  text-decoration: none !important;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s ease, color 0.25s ease;
}
.header__icon--wishlist:hover {
  transform: scale(1.05);
  color: rgb(0, 0, 0);
}
#wishlist-count {
  position: absolute;
  top: 47%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: rgb(0, 0, 0);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  z-index: 3;
  pointer-events: none;
}
.header__icon--wishlist svg,
.header__icon--wishlist span { text-decoration: none !important; }

/* =========================================
   Produktseite – Lieferfeld & Wunschliste
   (pp-delivery-wishlist + pp-heart im Kreis)
========================================= */

/* Lieferfeld ohne graue Umrandung, bündig links */
.f8pr .pp-delivery-wishlist {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 52px 12px 12px;    /* Platz rechts für das Herz */
  border: none !important;
  border-radius: 8px;
  background: #fff;
  position: relative;
  margin: 8px 0 10px;
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* Standardtext im Lieferfeld */
.f8pr .pp-delivery-wishlist p { margin: 0 !important; }

/* Herz-Kreis (EA4E3C Kontur, neutraler Hintergrund) */
.f8pr .pp-delivery-wishlist .pp-heart {
  all: unset !important;
  position: absolute !important;
  right: 8px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 45px !important;
  height: 45px !important;
  border-radius: 50% !important;
  border: 2px solid #EA4E3C !important;  /* neues Orange */
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease-in-out !important;
  z-index: 2 !important;
}

/* Kein Hover-Scale – Verhalten ruhig wie Warenkorb */
.f8pr .pp-delivery-wishlist .pp-heart:hover {
  transform: translateY(-50%) !important;
}

/* Herz-SVG final – fein, leer, proportional */
.f8pr .pp-delivery-wishlist .pp-heart svg {
  width: 21px !important;
  height: 21px !important;
}
.f8pr .pp-delivery-wishlist .pp-heart svg path {
  fill: none !important;
  stroke: #000 !important;
  stroke-width: 2.0px !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transition: transform .18s ease, fill .18s ease, stroke .18s ease !important;
}

/* Aktiv = rot gefüllt (Outline rot) */
.f8pr .pp-delivery-wishlist .pp-heart.is-active svg path,
.f8pr .pp-delivery-wishlist .pp-heart.active svg path {
  fill: #e00000 !important;
  stroke: #e00000 !important;
  stroke-width: 2px !important;
}

/* Dezentes Klick-Feedback wie Warenkorb */
.f8pr .pp-delivery-wishlist .pp-heart:active {
  transform: translateY(-50%) scale(0.98) !important;
}

.f8pr .pp-delivery-wishlist .pp-heart.js-pp-wish {
  border-color: #EA4E3C !important; /* Markenfarbe im Ruhezustand */
}

/* ===== Wishlist Herz – Fix-Pack V2 (scharfe Selektoren) ===== */

/* Kreis in Markenorange #EA4E3C, keine Hover-Bewegung */
.pp-delivery-wishlist .pp-heart.js-pp-wish,
.pp-heart.js-pp-wish {
  border: 2px solid #EA4E3C !important;
  background: #fff !important;
  border-radius: 50% !important;
  width: 46px !important;
  height: 46px !important;
  position: absolute !important;
  right: 8px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;   /* fix ohne Hover-Scale */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Theme-Pseudo-Elemente & alte Ringe sicher abschalten */
.pp-heart.js-pp-wish::before,
.pp-heart.js-pp-wish::after {
  content: none !important;
  display: none !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
}

/* Herz-Icon: leer & schwarz im Ruhezustand */
.pp-heart.js-pp-wish svg {
  width: 21px !important;
  height: 21px !important;
  display: block !important;
}
.pp-heart.js-pp-wish svg path {
  fill: none !important;
  stroke: #000 !important;
  stroke-width: 1.9px !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  transition: fill .18s ease, stroke .18s ease !important;
}

/* Aktiv: rot gefüllt (Outline rot) */
.pp-heart.js-pp-wish.is-active svg path,
.pp-heart.js-pp-wish.active svg path {
  fill: #e00000 !important;
  stroke: #e00000 !important;
  stroke-width: 2px !important;
}

/* Hover ohne „Anheben“ wie beim Warenkorb-Button */
.pp-heart.js-pp-wish:hover {
  transform: translateY(-50%) !important;
}








.pp-reward-line {
  margin-top: 10px;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  color: #EA4E3C;
}

.pp-reward-icon {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ffeac0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pp-reward-icon svg {
  width: 12px;
  height: 12px;
  fill: #EA4E3C;
}

.pp-reward-text strong {
  font-weight: 700;
  color: #EA4E3C;
}









/* Gesamt-Bonuspunkte im Warenkorb – PurrfectPets Style */
.pp-cart-points {
  margin-top: 0px;
  margin-bottom: 15px;
  padding: 18px 18px;
  
  border-radius: 16px;                     /* komplett rund wie gewünscht */
  background: rgba(255, 242, 204, 0.62);
  border: 1px solid rgb(233, 205, 157);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);

  display: flex;
  align-items: center;
  gap: 12px;

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

/* Icon-Kreis */
.pp-cart-points-icon {
  width: 42px;
  height: 42px;
  border-radius: 999px;

  background: #FFF2CC;
  border: 2px solid #EA4E3C;               /* ORANGE RING – wie gewünscht */

  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* SVG selbst */
.pp-cart-points-icon svg {
  width: 22px;
  height: 22px;
  display: block;
  color: #EA4E3C;                           /* PurrfectPets-Orange */
}

/* Punktezahl hervorheben */
.pp-cart-points-text strong {
  font-weight: 700;
  color: #EA4E3C;
}

/* Mobile optimiert */
@media (max-width: 768px) {
  .pp-cart-points {
    font-size: 14px;
    padding: 15px 16px;
  }

  .pp-cart-points-icon {
    width: 36px;
    height: 36px;
  }

  .pp-cart-points-icon svg {
    width: 18px;
    height: 18px;
  }




/* Markenbox rechts auf der Produktseite */
.pp-brand-card {
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 8px 16px;
  background: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
}

/* Logo-Größe Desktop – greift auf jedes IMG in der Box */
.template-product .pp-brand-card img {
  width: 120px !important;   /* hier Desktop-Größe */
  max-width: none !important;
  height: auto !important;
}

/* Mobile-Anpassung */
@media (max-width: 768px) {
  .pp-brand-card {
    justify-content: flex-start;
  }

  .template-product .pp-brand-card img {
    width: 90px !important;  /* hier Mobile-Größe */
  }
}