/** Shopify CDN: Minification failed

Line 65:0 Unexpected "}"
Line 107:0 Unexpected "<"
Line 473:5 Unexpected "="

**/
/* ===== IM CART – Style final fidèle à la maquette ===== */

/* --- Conteneur & panneau --- */
.imc{position:fixed;inset:0;z-index:2147483647;display:none;pointer-events:none}
.imc.imc--open{display:block;pointer-events:auto}
.imc__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.35);pointer-events:auto}
.imc__panel{
  position:absolute;top:0;right:0;height:100%;width:min(420px,100%);
  background:#fff;display:flex;flex-direction:column;
  box-shadow:-8px 0 24px rgba(0,0,0,.15);pointer-events:auto;-webkit-overflow-scrolling:touch
}
@media (max-width:991px){.imc__panel{width:min(92vw,440px)}}

/* --- En-tête --- */
.imc__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #eee}
.imc__title{margin:0;font-size:18px;font-weight:600}
.imc__count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;margin-left:6px;border-radius:999px;background:#000;color:#fff;font-size:11px}
.imc__close{font-size:22px;line-height:1;background:none;border:0;cursor:pointer}

/* --- Liste articles --- */
.imc__content{flex:1 1 auto;overflow:auto;padding:12px 16px}
.imc__items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.imc__empty{padding:24px 0;color:#666;text-align:center}
.imc-it{display:flex;gap:12px}
.imc-it__img{width:74px;height:74px;object-fit:cover;border-radius:8px;background:#f6f6f6}
.imc-it__meta{flex:1}
.imc-it__title{font-weight:600;margin-bottom:2px}
.imc-it__variant,.imc-it__props{font-size:12px;color:#666}
.imc-it__row{display:flex;align-items:center;justify-content:space-between;margin-top:6px}
.imc-it__price{font-weight:600}
.imc-remove{margin-top:6px;background:none;border:0;color:#888;text-decoration:underline;cursor:pointer;font-size:12px}
.imc-qty{display:flex;align-items:center;border:1px solid #e6e6e6;border-radius:999px;overflow:hidden}
.imc-qty--dec,.imc-qty--inc{width:28px;height:28px;border:0;background:#f6f6f6;cursor:pointer;user-select:none}
.imc-qty__input{width:44px;height:28px;text-align:center;border:0;background:#fff}

/* --- Pied (réduction + totaux + payer) --- */
.imc__foot{background:#fff;padding:24px;border-top:none;box-shadow:none;display:flex;flex-direction:column;gap:10px}

/* Lignes de séparation */
.imc-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 0;border-top:1px solid #eee
}
.imc-row:last-child{border-bottom:none}
.imc-row--toggle{cursor:pointer}
.imc-row span{font-size:18px}
.imc-row--total strong{font-size:28px;font-weight:700;color:#111}

/* --- Réduction : ligne + panneau (champ + bouton dans le même bloc) --- */
.imc-disc__tog{
  appearance:none;-webkit-appearance:none;
  background:transparent!important;border:0!important;box-shadow:none!important;outline:none!important;
  padding:0;margin:0;font-size:22px;line-height:1;color:#2b2b2b;cursor:pointer
}
.imc-disc__icon{display:inline-block;transform:translateY(-1px)}


}
.imc-disc__form{display:flex;align-items:center;gap:16px;width:100%}
.imc-disc__input{
  flex:1 1 auto;min-height:48px;border:1px solid #E6E6E6;border-radius:14px;
  padding:0 16px;font-size:16px;background:#fff;color:#111
}
.imc-disc__btn{
  flex:0 0 auto;height:48px;padding:0 22px;border:0;border-radius:999px;
  background:#cdd6b0;font-weight:600;color:#111;cursor:pointer;transition:filter .2s ease,transform .1s ease
}
.imc-disc__btn:hover{filter:brightness(.95)}
.imc-disc__btn:active{transform:translateY(1px)}

/* Code actif + message */
.imc-disc__active{display:flex;flex-direction:column;gap:6px;padding:8px 0 0}
.imc-disc__tag{display:inline-flex;gap:8px;align-items:center;background:#f4f4f4;border-radius:999px;padding:6px 10px}
.imc-disc__clear{border:0;background:transparent;cursor:pointer;font-size:18px;line-height:1}
.imc-disc__hint{color:#666}

/* Lignes récap après saisie */
.imc-row--before span,.imc-row--disc span{color:#2b2b2b}
.imc-row--disc .imc-disc--amt{color:#18a058;font-weight:700}

/* --- Bouton PAYER (vert clair, très arrondi) --- */
.imc-checkout{
  display:block;width:100%;margin:16px 0 10px;height:64px;line-height:64px;text-align:center;
  background:#cdd6b0;color:#111;font-weight:600;font-size:18px;text-decoration:none;
  border:0;border-radius:999px;cursor:pointer;transition:opacity .2s ease,transform .1s ease
}
.imc-checkout:hover{opacity:.95}
.imc-checkout:active{transform:translateY(1px)}

/* --- Effets --- */
.imc-fade--in{animation:imcFade .18s ease}
@keyframes imcFade{from{opacity:.35;transform:translateY(2px)}to{opacity:1;transform:none}}

/* --- Icône panier du header (toujours visible) --- */
.site-header .header-cart-icon{display:inline-flex!important;align-items:center;gap:6px;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
.header-cart-count{
  min-width:18px;height:18px;padding:0 6px;margin-left:6px;display:inline-flex;align-items:center;justify-content:center;
  background:#000;color:#fff;border-radius:999px;font-size:11px;line-height:18px
}
<div id="im-cart" class="imc" aria-hidden="true">
  <div class="imc__backdrop" data-imc-close></div>

  <aside class="imc__panel" role="dialog" aria-modal="true" aria-label="Panier">
    <header class="imc__head">
      <h3 class="imc__title">Panier <span class="imc__count" data-imc-count>0</span></h3>
      <button class="imc__close" data-imc-close aria-label="Fermer">×</button>
    </header>

    <section class="imc__content">
      <ul class="imc__items" data-imc-items></ul>

      <template id="imc-item">
        <li class="imc-it" data-key="">
          <img class="imc-it__img" alt="">
          <div class="imc-it__meta">
            <div class="imc-it__title"></div>
            <div class="imc-it__variant" data-imc-variant></div>
            <div class="imc-it__props" data-imc-props></div>
            <div class="imc-it__row">
              <div class="imc-qty">
                <button class="imc-qty--dec" type="button" aria-label="Diminuer">−</button>
                <input class="imc-qty__input" type="number" inputmode="numeric" min="0" aria-label="Quantité">
                <button class="imc-qty--inc" type="button" aria-label="Augmenter">+</button>
              </div>
              <div class="imc-it__price"></div>
            </div>
            <button class="imc-remove" type="button" aria-label="Retirer l’article">Retirer</button>
          </div>
        </li>
      </template>

      <div class="imc__empty" data-imc-empty hidden>Votre panier est vide.</div>
    </section>

    <!-- === PIED DU PANIER (FOOTER) === -->
    <footer class="imc__foot">

     <!-- Réduction : ligne cliquable -->
<div class="imc-row imc-row--toggle" data-imc-disc-tog aria-expanded="false">
  <span>Réduction</span>
  <span class="imc-disc__icon">+</span>
</div>


      <!-- Bloc réduction (code promo) -->
      <div id="imc-disc-panel" class="imc-disc__panel" hidden>
        <div class="imc-disc__form">
          <input class="imc-disc__input" type="text" placeholder="Code de réduction" data-imc-disc-input>
          <button class="imc-disc__btn" type="button" data-imc-disc-apply>Appliquer</button>
        </div>

        <div class="imc-disc__active" data-imc-disc-line hidden>
          <span class="imc-disc__tag">
            <span data-imc-disc-code></span>
            <button class="imc-disc__clear" type="button" aria-label="Supprimer le code" data-imc-disc-clear>×</button>
          </span>
          <small class="imc-disc__hint" data-imc-disc-hint hidden></small>
        </div>
      </div>

      <!-- === BLOC RÉCAP PROPRE ET COMPACT === -->
      <div class="imc-recap">
        <div class="imc-row imc-row--before imc-fade" data-imc-before-row hidden>
          <span>Prix avant réductions</span>
          <strong data-imc-before>—</strong>
        </div>

        <div class="imc-row imc-row--disc imc-fade" data-imc-discount-row hidden>
          <span>Réductions</span>
          <strong class="imc-disc--amt" data-imc-disc-amount>—</strong>
        </div>

        <div class="imc-row imc-row--total imc-fade">
          <span>Total estimé</span>
          <strong class="imc-total" data-imc-total>—</strong>
        </div>
      </div>

      <!-- Bouton Payer -->
      <a class="imc-checkout" href="/checkout" data-imc-checkout>Payer</a>
    </footer>
  </aside>
</div>
/* === RÉCAP PLUS PETIT ET PLUS FIN === */
.imc-recap .imc-row {
  padding: 6px 0 !important; /* réduit les espaces verticaux */
}

.imc-recap .imc-row span {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #111 !important;
}

.imc-recap .imc-row strong {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111 !important;
}

.imc-recap .imc-row--disc .imc-disc--amt {
  font-size: 16px !important;
  color: #2fbf64 !important;
  font-weight: 600 !important;
}

/* Total estimé légèrement plus visible */
.imc-recap .imc-row--total strong {
  font-size: 18px !important;
  font-weight: 700 !important;
}

/* Bouton Payer toujours bien espacé dessous */
.imc-checkout {
  margin-top: 10px !important;
}
/* === RÉCAP COMPACT SANS LIGNES === */
.imc-recap .imc-row {
  padding: 6px 0 !important; /* réduit l’espace vertical */
  border: none !important;   /* supprime les séparateurs */
}

.imc-recap .imc-row span {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #111 !important;
}

.imc-recap .imc-row strong {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #111 !important;
}

.imc-recap .imc-row--disc .imc-disc--amt {
  font-size: 16px !important;
  color: #2fbf64 !important; /* vert doux */
  font-weight: 600 !important;
}

/* Ligne total légèrement plus marquée visuellement */
.imc-recap .imc-row--total strong {
  font-size: 18px !important;
  font-weight: 700 !important;
}

/* Retire TOUTES les bordures du bloc récap */
.imc-row--before,
.imc-row--disc,
.imc-row--total {
  border: none !important;
}

/* Bouton Payer bien séparé mais propre */
.imc-checkout {
  margin-top: 14px !important;
}
/* === Réduction : séparateur au bon endroit === */

/* Par défaut : pas de trait sous l'entête */
.imc-row--toggle{
  border-bottom: none !important;
  padding-bottom: 10px;
  margin-bottom: 0;
}

/* Cas FERMÉ : si le panneau suivant est hidden, on affiche le trait sous "Réduction" */
.imc-row--toggle:has(+ .imc-disc__panel[hidden]){
  border-bottom: 1px solid #eee !important;
  margin-bottom: 8px;
}

/* Cas OUVERT : le trait va en bas du panneau (et pas sous l'entête) */
.imc-disc__panel:not([hidden]){
  border-bottom: 1px solid #eee !important;
  padding-bottom: 12px;
  margin-bottom: 8px;
}

/* Optionnel : on harmonise un peu l’espacement interne du formulaire */
.imc-disc__form{ gap: 12px; }
/* === Réduction : panneau propre et aligné === */

/* Masquer le texte d'estimation sous le code */
.imc-disc__hint {
  display: none !important;
}

/* Alignement parfait du champ et du bouton */
.imc-disc__form {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
}

/* Champ code */
.imc-disc__input {
  flex: 1;
  height: 46px;
  border: 1px solid #ddd;
  border-radius: 999px;
  padding: 0 16px;
  font-size: 15px;
  color: #111;
}

/* Bouton appliquer */
.imc-disc__btn {
  height: 46px;
  padding: 0 22px;
  border: none;
  border-radius: 999px;
  background: #cdd6b0;
  font-weight: 600;
  color: #111;
  cursor: pointer;
  transition: opacity .2s ease;
}
.imc-disc__btn:hover { opacity: .9; }

/* Bloc code actif */
.imc-disc__tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #f4f4f4;
  border-radius: 999px;
  padding: 8px 14px;
  margin-top: 10px;
}

/* Icône de fermeture */
.imc-disc__clear {
  border: none;
  background: transparent;
  font-size: 18px;
  cursor: pointer;
}

/* Trait du bas bien positionné uniquement quand le panneau est ouvert */
.imc-row--toggle {
  border-bottom: none !important;
}
.imc-disc__panel:not([hidden]) {
  border-bottom: 1px solid #eee !important;
  padding-bottom: 12px;
}
.imc-row--toggle:has(+ .imc-disc__panel[hidden]) {
  border-bottom: 1px solid #eee !important;
  margin-bottom: 8px;
}
/* Réduction légère du champ pour rapprocher le bouton */
.imc-disc__form {
  gap: 8px !important; /* espace réduit entre champ et bouton */
}

.imc-disc__input {
  flex: 1 1 auto;
  width: 70% !important; /* réduit légèrement la largeur */
  max-width: 240px !important; /* limite maximale pour resserrer */
}
/* === STYLE DU CODE PROMO ACTIF (étiquette stylée) === */
.imc-disc__active {
  margin-top: 10px;
}

.imc-disc__tag {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #f4f4f4;
  border-radius: 999px;
  padding: 8px 14px 8px 12px;
  font-weight: 600;
  font-size: 15px;
  color: #111;
  position: relative;
}

/* Icône "étiquette" avant le texte */
.imc-disc__tag::before {
  content: "🏷️";
  font-size: 15px;
  margin-right: 2px;
}

/* Bouton X propre */
.imc-disc__clear {
  background: #e6e6e6;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s ease;
}

.imc-disc__clear:hover {
  background: #d5d5d5;
}
/* Tag code promo actif – ajusté et compact */
.imc-disc__active {
  margin-top: 2px !important;
}

/* Étiquette réduite et ajustée à son contenu */
.imc-disc__tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f5f5f5;
  border-radius: 999px;
  padding: 4px 8px 4px 8px;
  font-weight: 600;
  font-size: 13px;
  color: #111;
  width: fit-content; /* ← fond s’arrête après la croix */
}

/* Petite icône tag beige */
.imc-disc__tag::before {
  content: "🏷️";
  font-size: 12px;
  margin-right: 1px;
}

/* X compacte */
.imc-disc__clear {
  background: #e4e4e4;
  border: none;
  border-radius: 5px;
  font-size: 13px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease;
}

.imc-disc__clear:hover {
  background: #d5d5d5;
}
.imc-row--toggle{ cursor:pointer; }
/* Ligne cliquable */
.imc-row--toggle{ cursor:pointer; }

/* Panneau sans bordure (la ligne est gérée par .imc-divider) */
.imc-disc__panel{ padding:12px 0; border:none; }

/* Séparateur dédié, toujours en bas du bloc réduction */
.imc-divider{
  height:1px; background:#eee; width:100%;
  margin:12px 0 0; /* un petit espace au-dessus */
}

/* Quand fermé, on garde le même visuel (la .imc-divider reste sous la ligne) */
.imc-disc.is-open .imc-divider{ margin-top:12px; }
<!-- === RÉDUCTION (wrapper dédié) === -->

/* === Ajustement espacement bloc Réduction === */

/* Resserre la ligne Réduction */
.imc-row--toggle{
  padding:8px 0 !important;
}

/* Rapproche le champ du titre */
#imc-disc-panel{
  margin-top:4px !important;  /* avant 8–10px */
  padding-top:0 !important;
}

/* Réduit encore un peu l’écart entre le champ et le code actif */
.imc-disc__form{
  margin-top:4px !important;
  gap:10px !important;
}

/* Code actif plus proche */
.imc-disc__active{
  margin-top:4px !important;
}
/* === Ajustement bloc Réduction + suppression du séparateur du bas === */

/* Ligne Réduction cliquable – espacement propre */
.imc-row--toggle {
  padding: 10px 0 !important;
  border-top: 1px solid #eee !important;
  border-bottom: none !important;
  cursor: pointer;
}

/* Quand le panneau est fermé → garde le trait bas */
.imc-row--toggle:has(+ .imc-disc__panel[hidden]) {
  border-bottom: 1px solid #eee !important;
  margin-bottom: 8px;
}

/* Quand ouvert → supprime le trait du bas (celui que tu veux enlever) */
.imc-disc__panel:not([hidden]) {
  border-bottom: none !important;
  padding-bottom: 6px !important;
  margin-bottom: 6px !important;
}

/* Réduit les espacements internes */
.imc-disc__form {
  margin-top: 4px !important;
  gap: 8px !important;
}

.imc-disc__active {
  margin-top: 4px !important;
}

/* Champ plus carré */
.imc-disc__input {
  border-radius: 10px !important;
}

/* + Effet doux à l’ouverture */
#imc-disc-panel {
  transition: all 0.25s ease;
  opacity: 0;
  transform: translateY(-5px);
}
#imc-disc-panel:not([hidden]) {
  opacity: 1;
  transform: translateY(0);
}

/* Supprime le double trait juste sous la réduction (celui avec la flèche rouge) */
.imc-recap > .imc-row:first-child {
  border-top: none !important;
}
/* === Correction finale des séparateurs Réduction === */

/* Ligne sous "Réduction" : visible seulement quand fermé */
.imc-row--toggle {
  border-bottom: none !important;
}
.imc-row--toggle:has(+ #imc-disc-panel[hidden]) {
  border-bottom: 1px solid #eee !important;
  margin-bottom: 8px;
}

/* Ligne SOUS "Code de réduction" : toujours visible quand ouvert */
#imc-disc-panel:not([hidden]) {
  border-bottom: 1px solid #eee !important;
  padding-bottom: 12px !important;
  margin-bottom: 8px !important;
}

/* Supprime le tout dernier séparateur en bas du panier */
.imc-recap > .imc-row:last-child {
  border-bottom: none !important;
}
/* === Espacement ultra-compact du bloc Réduction === */
.imc-row--toggle {
  padding-bottom: 0 !important;   /* supprime presque tout l’espace sous le titre */
  margin-bottom: -2px !important; /* colle davantage le champ sans chevauchement */
}

#imc-disc-panel {
  margin-top: 0 !important;       /* champ collé juste sous "Réduction" */
  padding-top: 0 !important;
}
/* === Espacement maximalement réduit bloc Réduction === */
.imc-row--toggle {
  padding-bottom: 0 !important;
  margin-bottom: -6px !important; /* colle encore plus le champ */
}

#imc-disc-panel {
  margin-top: -4px !important;    /* champ quasi collé au titre */
  padding-top: 0 !important;
}
/* === Espacement ajusté du bloc Réduction === */

/* Quand le panneau est FERMÉ → un peu plus d’air entre les traits */
.imc-row--toggle:has(+ .imc-disc__panel[hidden]) {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  margin-top: 2px !important;
  margin-bottom: 4px !important;
}

/* Quand le panneau est OUVERT → espacement serré */
.imc-row--toggle:not(:has(+ .imc-disc__panel[hidden])) {
  padding-bottom: 0 !important;
  margin-bottom: -6px !important;
}

#imc-disc-panel {
  margin-top: -4px !important;
  padding-top: 0 !important;
}
/* === Taille réduite du mot Réduction === */
.imc-row--toggle span:first-child {
  font-size: 16px !important; /* avant 18px */
  font-weight: 500 !important;
  color: #222 !important;
  transform: translateY(1px); /* léger recentrage vertical */
}

/* Espacement conservé selon l’état */
.imc-row--toggle:has(+ .imc-disc__panel[hidden]) {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  margin-top: 2px !important;
  margin-bottom: 4px !important;
}

.imc-row--toggle:not(:has(+ .imc-disc__panel[hidden])) {
  padding-bottom: 0 !important;
  margin-bottom: -6px !important;
}

#imc-disc-panel {
  margin-top: -4px !important;
  padding-top: 0 !important;
}
.imc-free-badge{
  margin-left:8px;
  padding:2px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  background:#e8f6ea;
  color:#168a45;
}
.imc-free-badge{margin-left:8px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;background:#e8f6ea;color:#168a45}
/* === Bouton Payer en noir (panier custom IMC) === */
.imc-checkout {
  background: #181818 !important;    /* fond noir */
  color: #fff !important;         /* texte blanc */
  border: none !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
  font-size: 18px !important;
  transition: background .25s ease, transform .1s ease;
}

.imc-checkout:hover {
  background: #222 !important;    /* gris foncé au survol */
  color: #fff !important;
  transform: translateY(-1px);
}

.imc-checkout:active {
  transform: translateY(1px);
}
/* === Fix quantité invisible sur Desktop === */
@media (min-width: 991px){
  /* force l'affichage et le contraste */
  .imc-qty{ display:flex !important; align-items:center; border:1px solid #e6e6e6 !important; background:#fff !important; }
  .imc-qty--dec,
  .imc-qty--inc{ background:#f2f2f2 !important; color:#111 !important; }
  .imc-qty__input{
    width: 48px !important;            /* un peu plus large */
    color:#111 !important;              /* texte bien visible */
    -webkit-text-fill-color:#111 !important; /* Safari/Chrome */
    background:#fff !important;
    font-weight:600;
    font-size:14px;
  }

  /* retire les spins si besoin (peuvent masquer le chiffre) */
  .imc-qty__input::-webkit-outer-spin-button,
  .imc-qty__input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
  .imc-qty__input[type=number]{ -moz-appearance:textfield; }
}
.imc-it.removing {
  opacity: 0;
  transform: translateY(-8px);
  transition: all 0.25s ease;
}
/* Shimmer sur le Total */
.imc-total{
  position:relative;
  display:inline-block;
}
.imc-total.imc-total--loading{
  color:transparent; /* masque le chiffre le temps du shimmer */
}
.imc-total.imc-total--loading::after{
  content:"";
  position:absolute;
  top:0; bottom:0;
  left:-90%;
  width:80%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent);
  transform: skewX(-18deg);
  animation: imcShimmer .9s linear infinite;
}
@keyframes imcShimmer{
  0%   { left:-90%; opacity:.9; }
  100% { left:120%; opacity:.2; }
}
/* === IM Cart – Shimmer Total (barre lumineuse pendant MAJ) === */
.imc-total{ position:relative; display:inline-block; }
.imc-total.imc-total--loading{ color:transparent; }
.imc-total.imc-total--loading::after{
  content:"";
  position:absolute; inset:0 auto 0 -90%;
  width:80%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  transform: skewX(-18deg);
  animation: imcShimmer .9s linear infinite;
}
@keyframes imcShimmer{
  0%{ left:-90%; opacity:.95; }
  100%{ left:120%; opacity:.2; }
}
