/** Shopify CDN: Minification failed

Line 65:4 Expected identifier but found whitespace
Line 65:5 Unexpected "24px"
Line 66:75 Unterminated string token
Line 390:0 Expected "}" to go with "{"

**/
/* =======================
   QUICK VIEW — TAILLES (final propre & centré)
   ======================= */

/* Titre "Taille : S" */
#im-qv .im-qv__sizes{ margin:12px 0 6px !important; }
#im-qv .im-qv__sizes-head{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:6px !important;
  margin:0 0 12px !important;
  text-align:center !important;
}
#im-qv .im-qv__sizes-label{ font-weight:800 !important; }
#im-qv .im-qv__sizes-current{ font-weight:700 !important; opacity:.7 !important; }

/* *** RANGÉE DE PASTILLES — centrage inratable *** */
#im-qv .im-qv__options{
  /* on annule tout ce qui existait avant */
  all: unset;
  display: grid !important;
  grid-auto-flow: column !important;         /* en ligne */
  grid-auto-columns: max-content !important; /* largeur au contenu */
  justify-content: center !important;        /* centre la rangée */
  align-items: center !important;
  gap: 16px 24px !important;                 /* espace (row/col) */
  width: 100% !important;
  margin: 0 auto !important;
  padding: 8px 0 12px !important;
}

/* Pastilles */
#im-qv .im-qv__opt-btn{
  all: unset;
  display: inline-grid !important;
  place-items: center !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  border: 1.8px solid #cfcfcf !important;
  background: #fff !important;
  font: 700 14px/1 system-ui, -apple-system, Segoe UI, Roboto, Arial !important;
  letter-spacing: .2px !important;
  cursor: pointer !important;
  user-select: none !important;
}
#im-qv .im-qv__opt-btn:hover{ border-color:#9c9c9c !important; }
#im-qv .im-qv__opt-btn.is-active{
  background:#111 !important; color:#fff !important; border-color:#111 !important;
}
#im-qv .im-qv__opt-btn[disabled]{ opacity:.45 !important; cursor:not-allowed !important; }
/* === Ajuste l'espacement entre les pastilles de taille === */
#im-qv .im-qv__options {
  gap: 22px !important; /* augmente la distance (avant : 16px) */
}
gap: 24px !important;
regarde peut etre que j'ai trop de regle la : * ===========================
   TAILLES – centrées, bien espacées (incl. fallback)
   =========================== */
.im-qv__sizes{ margin:8px 0 10px; }
.im-qv__sizes-head{
  display:flex;
  justify-content:center;     /* ✅ centre le mot "Taille : S" */
  align-items:center;
  gap:6px;
  margin:0 0 10px;
  text-align:center;
}


.im-qv__sizes-label{ font-weight:800; }
.im-qv__sizes-current{ font-weight:700; opacity:.7; }

.im-qv__options{
  width:100%;
  max-width:520px;
  margin:0 auto;
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;             /* passe à 2 lignes si besoin */
  column-gap:24px;            /* écart horizontal */
  row-gap:16px;               /* écart vertical si 2 lignes */
  padding:8px 0 12px;
  overflow:visible;
}
/* Fallback si gap non supporté (vieux Safari) */
@supports not (gap:1rem){
  .im-qv__options .im-qv__opt-btn{ margin-right:24px; margin-bottom:16px; }
  .im-qv__options .im-qv__opt-btn:last-child{ margin-right:0; }
}

.im-qv__opt-btn{
  box-sizing:border-box;
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 auto; width:48px; height:48px; border-radius:50%;
  border:1.8px solid #cfcfcf; background:#fff;
  font-weight:700; font-size:14px; letter-spacing:.2px;
  transition:border-color .15s ease, background .15s ease, color .15s ease;
}
.im-qv__opt-btn:hover{ border-color:#9c9c9c; }
.im-qv__opt-btn.is-active{ background:#111; color:#fff; border-color:#111; }
.im-qv__opt-btn[disabled]{ opacity:.45; cursor:not-allowed; }

/* ===========================
   Switch Flocage
   =========================== */
.im-qv__props{ margin:6px 0 12px; }
.im-qv__switch{ display:inline-flex; align-items:center; gap:8px; font-weight:800; }
.im-qv__switch input{ display:none; }
.im-qv__switch-ui{
  width:42px; height:24px; border-radius:999px; background:#eee; position:relative;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.08); transition:background .2s ease;
}
.im-qv__switch-ui::after{
  content:""; position:absolute; left:3px; top:3px; width:18px; height:18px; border-radius:999px;
  background:#fff; box-shadow:0 2px 6px rgba(0,0,0,.12); transition:transform .2s ease;
}
.im-qv__switch input:checked + .im-qv__switch-ui{ background:#111; }
.im-qv__switch input:checked + .im-qv__switch-ui::after{ transform:translateX(16px); }
.im-qv__switch-label{ font-weight:700; }

/* ===========================
   Footer + CTA
   =========================== */
.im-qv__footer{
  position:sticky; bottom:0; left:0; right:0;
  padding:12px 14px 14px;
  background:linear-gradient(180deg,#fff0 0%,#fff 40%,#fff 100%);
  border-bottom-left-radius:24px; border-bottom-right-radius:24px;
}
.im-qv__submit{
  width:100%; height:48px; border:0; border-radius:12px;
  background:#111; color:#fff; font-weight:900; font-size:15px;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
  transition:transform .05s ease, opacity .2s ease;
}
.im-qv__submit:active{ transform:translateY(1px); }
.im-qv__submit[disabled]{ opacity:.5; cursor:not-allowed; }

/* === ESPACEMENT FORCÉ ENTRE LES TAILLES (remplace gap) === */
.im-qv__options{
  width:100% !important;
  max-width:520px !important;
  margin:0 auto !important;
  display:flex !important;
  justify-content:flex-start !important;   /* aligné à gauche proprement */
  align-items:center !important;
  flex-wrap:nowrap !important;             /* reste sur 1 ligne */
  gap:0 !important;                        /* on neutralise gap */
 padding:8px 24px 12px !important;

  overflow:visible !important;
}

/* marge entre chaque pastille */
.im-qv__opt-btn{
  margin:0 10px 0 0 !important;            /* ← écart horizontal */
  width:43px !important;
  height:43px !important;
  border-radius:50% !important;
  border:1.8px solid #cfcfcf !important;
  background:#fff !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-weight:700 !important;
  font-size:14px !important;
}
.im-qv__opt-btn:last-child{ margin-right:0 !important; }  /* pas de marge après la dernière */

.im-qv__opt-btn.is-active{
  background:#111 !important; color:#fff !important; border-color:#111 !important;
}

/* --- 1) Bouton panier (im-mpb) propre, rond, au bon z-index --- */
.im-mpb{
  all: unset;                     /* enlève le style bouton par défaut (carré) */
  position:absolute;
  right:0;
  bottom:0;
  width:32px; height:32px;
  border-radius:12px 0 0 0;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 10px rgba(0,0,0,.10);
  cursor:pointer;
  z-index:30;                     /* au-dessus des autres badges/icons */
  transition:transform .15s ease, box-shadow .15s ease;
}
.im-mpb svg{ width:16px; height:16px; fill:#555; }
@media (min-width:769px){ .im-mpb{ display:none!important; } }  /* mobile only */
.product-card__image-wr,
.image-content__image-wrapper{ position:relative; }             /* ancre le bouton */

/* séparateur léger au-dessus des champs */
.im-qv__flocage-fields{
  margin-top: 12px;
  padding-top: 16px;
  border-top: 1px solid #EDEDED;
}

/* label gras */
.im-qv__label{
  font-weight: 800;
  color: #111;
  margin-bottom: 8px;
}

/* champs arrondis comme sur ta capture */
.im-qv__input{
  width: 100%;
  border: 2px solid #111;
  border-radius: 40px;
  padding: 14px 18px;
  font-size: 16px;
  background: #F6F6F6;
}

/* espace entre les champs */
.im-qv__field{ margin-bottom: 22px; }

/* switch + badge offert */
.im-qv__switch{ display:flex; align-items:center; gap:10px; }
.im-qv__switch-ui{
  width:52px; height:30px; border-radius:999px; background:#1111; position:relative;
}
.im-qv__switch-ui::after{
  content:""; position:absolute; left:4px; top:4px; width:22px; height:22px; border-radius:999px;
  background:#fff; box-shadow:0 2px 6px rgba(0,0,0,.12); transition:transform .2s ease;
}
#im-qv-flocage:checked + .im-qv__switch-ui{ background:#111; }
#im-qv-flocage:checked + .im-qv__switch-ui::after{ transform:translateX(22px); }
.im-qv__badge-offert{ color:#22c55e; font-style:normal; font-weight:700; }

/* Empêche le décalage de clic en mode clavier (focus dans un input) */
.im-qv--keyboard .im-qv__sheet{
  transform: none !important;
  transition: none !important;
  bottom: 0 !important;
}
.im-qv--keyboard .im-qv__scrim{
  /* garde le fond mais sans transition pour éviter les “sauts” */
  transition: none !important;
}

/* Sécurité : la zone sheet doit être au-dessus du scrim */
.im-qv__sheet{ position: absolute; z-index: 2; }
.im-qv__scrim{ z-index: 1; }

/* Si certains thèmes mettent des transforms parents, on isole le conteneur */
#im-qv{ transform: none !important; }


/* ---- FIX iOS : désactiver tout scale/transform sur la feuille quand elle est ouverte ---- */
.im-qv__sheet{
  will-change: transform;
  transform: translateY(100%);           /* uniquement slide, pas de scale */
}
.im-qv.is-open .im-qv__sheet{
  transform: translateY(0);              /* pas de scale, pas de perspective */
}

/* Dans le doute, on neutralise toute autre origine de transform héritée */
.im-qv,
.im-qv *,
.im-qv__sheet{
  -webkit-transform: translateZ(0);      /* force layer sans décaler la hitbox */
}

/* Empêche un overlay fantôme de couvrir la zone (z-index propre + pointer-events) */
.im-qv__scrim{ z-index: 1; pointer-events:auto; }
.im-qv__sheet{ z-index: 2; pointer-events:auto; }

/* Le groupe flocage ne doit jamais créer de calque transform (pas d’animations, etc.) */
.im-qv__flocage-fields{
  transform: none !important;
  -webkit-transform: none !important;
}

/* Après l'ouverture, on neutralise tout transform résiduel sur la sheet */
#im-qv.is-open .im-qv__sheet[style*="transform: none"] {
  transform: none !important;
}

/* Sécurité : la scrim reste derrière et ne capte pas les clics sur la sheet */
.im-qv__scrim { z-index: 1; pointer-events: auto; }
.im-qv__sheet { z-index: 2; }

/* La sheet au-dessus de la scrim */
.im-qv__scrim { z-index: 1; }
.im-qv__sheet { z-index: 2; }

/* Si la sheet a transform: none (après anim), on évite tout override */
#im-qv.is-open .im-qv__sheet[style*="transform: none"] {
  transform: none !important;
}
/* --- Taille réduite du switch Flocage --- */
.im-qv__switch-ui{
  width: 36px !important;      /* ← largeur réduite (avant 52px) */
  height: 20px !important;     /* ← hauteur réduite (avant 30px) */
  border-radius: 999px !important;
  background: #ddd !important;
  position: relative;
  transition: background .2s ease;
}
.im-qv__switch-ui::after{
  content:"";
  position:absolute;
  left:3px; top:3px;
  width:14px !important;       /* ← diamètre du rond réduit */
  height:14px !important;
  border-radius:999px;
  background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.12);
  transition:transform .2s ease;
}
#im-qv-flocage:checked + .im-qv__switch-ui{
  background:#111 !important;
}
#im-qv-flocage:checked + .im-qv__switch-ui::after{
  transform:translateX(16px) !important; /* adapte au nouveau width */
}

/* Ajuste l’espacement avec le texte “Flocage (Offert)” */
.im-qv__switch{
  display:flex;
  align-items:center;
  gap:8px !important;          /* réduit un peu l’espace */
}

.im-qv__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;

  /* Champs : noir par défaut, gris au focus (clic) */
.im-qv__input{
  width:100% !important;
  display:block;
  box-sizing:border-box;

  /* — état par défaut — */
  border:1.2px solid #000 !important;   /* noir constant au repos */
  border-radius:26px !important;         /* même forme arrondie */
  padding:10px 14px !important;          /* taille plus petite */
  background:#f8f8f8 !important;
  font-size:14px !important;
  color:#111;

  transition:border-color .2s ease, background-color .2s ease;
}

/* — état focus (clic/tap) — */
.im-qv__input:focus{
  border-color:#b5b5b5 !important;       /* devient gris au clic */
  background:#fff !important;            /* éclaircit le fond (optionnel) */
  outline: none !important;              /* pas d’outline bleu iOS */
}

/* Placeholder doux (inchangé) */
.im-qv__input::placeholder{ color:#9a9a9a; opacity:1; font-weight:400; }

/* iOS/Chrome auto-fill : garder la bordure grise au focus et supprimer le jaune */
.im-qv__input:-webkit-autofill{
  -webkit-box-shadow: 0 0 0px 1000px #fff inset;
  -webkit-text-fill-color: #111;
  border-color:#b5b5b5 !important;
}

  .im-qv__options {
  display: flex !important;
  justify-content: center !important; /* centre parfaitement les pastilles */
  align-items: center !important;
  gap: 12px !important;               /* espace équilibré */
  width: 100% !important;
  margin: 0 auto !important;
}

