/** Shopify CDN: Minification failed

Line 966:0 Unexpected "@media"

**/
/* =============================================
   Carousel de Collection - Desactiver scroll textes
   Section: featured-collections-carousel
   5 collections: Snacks, Thes, Poissons, Cereales, Boissons
   Date: 2026-03-28
   ============================================= */

/* ---- Container contenu par collection (override theme overflow-y:auto) ---- */
.yv-collection-content {
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}

/* Variante layout rounded (override max-height:100% du theme) */
.collection-layout-rounded .yv-collection-content {
  overflow: hidden !important;
  overflow-y: hidden !important;
}

/* ---- Titre collection (par carte) - max 2 lignes ---- */
.yv-collection-title {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
}

/* ---- Description collection (par carte) - max 2 lignes ---- */
.yv-collection-desc {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
}

/* ---- Description section-level (header du module) ---- */
.yv-collections-desc {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  text-overflow: ellipsis !important;
}

/* ---- Sous-titre section-level ---- */
.yv-collections-subtitle {
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

/* ---- Conteneur texte global de la section ---- */
.yv-collections-text {
  overflow: hidden !important;
}


/* =============================================
   Produits Vedettes & Meilleures Ventes
   Fix: layout horizontal + vignettes coherentes
   Date: 2026-03-28
   ============================================= */

/* ---- Slider wrapper (PV + BS) ---- */
.nkosi-slider-wrap {
  position: relative;
  overflow: hidden;
}

/* ---- Produits Vedettes : grille horizontale ---- */
.nkosi-pv-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 4px;
}
.nkosi-pv-grid::-webkit-scrollbar {
  display: none;
}

/* ---- Meilleures Ventes : track horizontal ---- */
.nkosi-bs-track {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 4px;
}
.nkosi-bs-track::-webkit-scrollbar {
  display: none;
}

/* ---- Largeur carte : 5 par ligne desktop ---- */
.nkosi-pv-grid > .yv-product-card,
.nkosi-pv-grid > .nkosi-pv-card {
  flex: 0 0 calc((100% - 48px) / 5);
  min-width: 180px;
  max-width: 280px;
}
.nkosi-bs-track > .yv-product-card {
  flex: 0 0 calc((100% - 48px) / 5);
  min-width: 180px;
  max-width: 280px;
}

/* ---- Images carrees coherentes ---- */
.nkosi-pv-grid .image-wrapper.image-square,
.nkosi-bs-track .image-wrapper.image-square {
  padding-bottom: 100% !important;
  height: 0;
  position: relative;
  overflow: hidden;
}
.nkosi-pv-grid .image-wrapper img,
.nkosi-bs-track .image-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* ---- Fleches de navigation slider ---- */
.nkosi-slider-arrow {
  position: absolute;
  top: 35%;
  transform: translateY(-50%);
  z-index: 10;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}
.nkosi-slider-arrow:hover {
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.nkosi-slider-arrow svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: #333;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nkosi-slider-arrow--prev {
  left: -4px;
}
.nkosi-slider-arrow--next {
  right: -4px;
}

/* ---- En-tete sections ---- */
.nkosi-pv-heading,
.nkosi-bs-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}

/* ---- Lien "Voir tout" ---- */
.nkosi-slider-viewall {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  color: #055B49;
  text-decoration: none;
  font-weight: 500;
}
.nkosi-slider-viewall:hover {
  text-decoration: underline;
}

/* ---- Controles shuffle ---- */
.nkosi-slider-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}
.nkosi-pv-shuffle-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: 1.5px solid rgba(5, 91, 73, 0.25);
  border-radius: 20px;
  padding: 6px 14px;
  color: #055B49;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.nkosi-pv-shuffle-btn:hover {
  background: rgba(5, 91, 73, 0.05);
  border-color: #055B49;
}

/* ---- Responsive : tablette (3 cartes) ---- */
@media screen and (max-width: 1024px) and (min-width: 750px) {
  .nkosi-pv-grid > .yv-product-card,
  .nkosi-pv-grid > .nkosi-pv-card,
  .nkosi-bs-track > .yv-product-card {
    flex: 0 0 calc((100% - 24px) / 3);
  }
}

/* ---- Responsive : mobile (2 cartes) ---- */
@media screen and (max-width: 749px) {
  .nkosi-pv-grid > .yv-product-card,
  .nkosi-pv-grid > .nkosi-pv-card,
  .nkosi-bs-track > .yv-product-card {
    flex: 0 0 calc((100% - 12px) / 2);
    min-width: 140px;
  }
  .nkosi-slider-arrow {
    width: 32px;
    height: 32px;
  }
}


/* =============================================
   MoonBundle — Masquer selecteur quantite
   Le module "8 unites" ne doit PAS afficher +/-
   Date: 2026-03-28
   ============================================= */
.moonbundle-quantity-preview-selector {
  display: none !important;
}
.moonbundle-quantity-multiplier {
  display: none !important;
}


/* =============================================
   Judge.me Featured Carousel — Layout horizontal force
   Empecher l'empilement vertical des cartes
   Date: 2026-03-28
   ============================================= */
.jdgm-carousel-wrapper {
  overflow-x: auto !important;
}
.jdgm-carousel__cards-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
}
.jdgm-carousel__card {
  flex: 0 0 auto !important;
  min-width: 280px;
  max-width: 350px;
}
/* Judge.me arrows — masquer (navigation par swipe/scroll uniquement) */
.jdgm-carousel__arrows,
.jdgm-carousel__left-arrow,
.jdgm-carousel__right-arrow {
  display: none !important;
}


/* =============================================
   Newsletter fallback (non-FR) — Style identique Klaviyo
   Le formulaire custom doit matcher exactement le Klaviyo FR
   Date: 2026-03-28
   ============================================= */
.nkosi-newsletter-custom {
  width: 100%;
  box-sizing: border-box;
}
.nkosi-newsletter-inner {
  background: #f9f9f9;
  border-radius: 15px;
  padding: 20px 24px;
  max-width: 100%;
  box-sizing: border-box;
}
.nkosi-newsletter-title {
  font-family: 'DM Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-weight: 800;
  font-size: 28px;
  color: #055B49;
  margin: 0 0 10px 0;
  text-align: left;
}
.nkosi-newsletter-desc {
  font-family: 'DM Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-weight: 400;
  font-size: 17px;
  color: #055B49;
  margin: 0 0 15px 0;
  text-align: left;
}
.nkosi-newsletter-email {
  flex: 1;
  height: 54px;
  border-radius: 30px;
  border: 1px solid #F29E24;
  padding: 0 16px;
  font-family: 'DM Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 16px;
  color: #000;
  background: #fff;
  outline: none;
  box-sizing: border-box;
}
.nkosi-newsletter-email::placeholder {
  color: #999;
}
.nkosi-newsletter-row {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.nkosi-newsletter-btn {
  height: 54px;
  min-width: 180px;
  border-radius: 30px;
  border: none;
  background: #055B49;
  color: #fff;
  font-family: 'DM Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: opacity 0.2s;
}
.nkosi-newsletter-btn:hover {
  opacity: 0.9;
}
/* Language preference radios */
.nkosi-newsletter-prefs {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.nkosi-newsletter-prefs-label {
  font-family: 'DM Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #055B49;
  margin-right: 8px;
}
.nkosi-newsletter-radio-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-family: 'DM Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 16px;
  color: #055B49;
  margin-right: 16px;
}
.nkosi-newsletter-radio-label input[type="radio"] {
  accent-color: #F29E24;
  width: 18px;
  height: 18px;
  cursor: pointer;
}
@media screen and (max-width: 749px) {
  .nkosi-newsletter-row {
    flex-direction: column;
  }
  .nkosi-newsletter-btn {
    min-width: 100%;
  }
  .nkosi-newsletter-title {
    font-size: 22px;
  }
  .nkosi-newsletter-desc {
    font-size: 15px;
  }
}


/* =============================================
   Judge.me Carousel — Espacement reduit 30%
   Desktop + mobile
   Date: 2026-03-28
   ============================================= */
.jdgm-carousel-wrapper {
  padding-top: 34px !important;
  padding-bottom: 34px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.jdgm-carousel-title-and-link {
  margin-bottom: 12px !important;
}
.jdgm-carousel {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
/* Section Shopify wrapping Judge.me — reduire padding 30% */
[id*="judge_me_reviews_featured_carousel"] {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}


/* =============================================
   Header — Design ameliore barre de recherche & menu
   Date: 2026-03-28
   ============================================= */

/* ---- Barre de recherche : fond blanc + coins arrondis ---- */
.yv-header-searchbar {
  border-radius: 25px !important;
  border: none !important;
  background: rgba(255, 255, 255, 0.95) !important;
  transition: all 0.25s ease !important;
  overflow: hidden !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06) !important;
}
.yv-header-searchbar:hover,
.yv-header-searchbar:focus-within {
  background: #fff !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1) !important;
}

/* ---- Input de recherche ---- */
.yv-header-searchbar .search-input {
  border: none !important;
  background: transparent !important;
  color: #333 !important;
  font-size: 14px !important;
  padding-left: 18px !important;
  border-radius: 25px !important;
  height: 38px !important;
}
.yv-header-searchbar .search-input::placeholder {
  color: #999 !important;
  font-style: italic !important;
}
.yv-header-searchbar .search-input:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* ---- Icones dans la barre (loupe, micro) ---- */
.yv-header-searchbar .yv-header-searchbar-icon {
  background: transparent !important;
  border: none !important;
  color: #055B49 !important;
  transition: color 0.2s ease !important;
}
.yv-header-searchbar .yv-header-searchbar-icon:hover {
  color: #333 !important;
}
.yv-header-searchbar .yv-header-searchbar-icon svg {
  fill: currentColor !important;
}

/* ---- Navigation menu principal — liens plus lisibles ---- */
.list-menu--inline .nav-link {
  font-size: 13.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  transition: background 0.2s ease, color 0.15s ease !important;
}
.list-menu--inline .nav-link:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* ---- Dropdown menus — design premium ---- */
.yv-dropdown-menus-outer {
  padding-top: 8px !important;
}
.yv-dropdown-menus {
  border-radius: 14px !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06) !important;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  overflow: hidden !important;
  background: #fff !important;
  min-width: 270px !important;
  padding: 8px 0 !important;
  animation: nkosi-dropdown-in 0.2s ease-out !important;
}
@keyframes nkosi-dropdown-in {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---- Liste items container ---- */
.menu-type-dropdown-list {
  padding: 0 6px !important;
}

/* ---- Chaque item du dropdown ---- */
.dropdown-inner-menu-item {
  margin: 2px 0 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  transition: background 0.15s ease !important;
}
.dropdown-inner-menu-item:hover {
  background: rgba(5, 91, 73, 0.06) !important;
}

/* ---- Lien menu categorie ---- */
.menu-category-title {
  display: flex !important;
  align-items: center !important;
  padding: 10px 14px !important;
  color: #1a1a1a !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.01em !important;
  transition: color 0.15s ease, padding-left 0.15s ease !important;
  border-radius: 10px !important;
  border-left: 3px solid transparent !important;
}
.dropdown-inner-menu-item:hover .menu-category-title {
  color: #055B49 !important;
  border-left-color: #055B49 !important;
  padding-left: 16px !important;
}

/* ---- Emoji dans les items — espacement ---- */
.menu-category-title span {
  display: inline !important;
}

/* ---- Separateurs subtils entre items ---- */
.dropdown-inner-menu-item + .dropdown-inner-menu-item {
  border-top: 1px solid rgba(0, 0, 0, 0.04) !important;
}
.dropdown-inner-menu-item:hover + .dropdown-inner-menu-item,
.dropdown-inner-menu-item:hover {
  border-top-color: transparent !important;
}

/* ---- Parent nav link actif (quand dropdown ouvert) ---- */
.nav-item.dropdown-menu-list:hover > .nav-link {
  background: rgba(255, 255, 255, 0.15) !important;
}

/* ---- Chevron indicateur dropdown ---- */
.nav-link.dropdown-menu-item::after {
  transition: transform 0.2s ease !important;
}
.nav-item.dropdown-menu-list:hover .nav-link.dropdown-menu-item::after {
  transform: rotate(180deg) !important;
}

/* ---- Header icons (lang, user, cart) — espacement + hover ---- */
.header__icons.normal-icon {
  gap: 4px !important;
  display: flex !important;
  align-items: center !important;
}
.header__icons .customer-links a,
.header__icons .cart-icon,
.header__icons .nkosi-header-lang .country-name {
  transition: opacity 0.2s ease !important;
}
.header__icons .customer-links a:hover,
.header__icons .cart-icon:hover {
  opacity: 0.8 !important;
}


/* =============================================
   Mobile — Masquer selecteur langue dans header
   Visible uniquement dans le menu mobile (drawer)
   Date: 2026-03-28
   ============================================= */
@media screen and (max-width: 749px) {
  .header__icons .nkosi-header-lang {
    display: none !important;
  }
}


/* =============================================
   Cart Drawer - Recommandations Meilleures Ventes
   Affiche des produits quand le panier est vide
   + bandeau upsell compact pour panier rempli
   Date: 2026-04-09
   ============================================= */

/* ---- Section recommandations panier vide ---- */
.nkosi-empty-cart-reco {
  padding: 16px 16px 8px;
  border-top: 1px solid rgba(0,0,0,0.06);
  margin-top: 8px;
}

.nkosi-reco-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #055B49;
  margin: 0 0 12px;
  padding: 0;
  display: flex;
  align-items: center;
}

/* ---- Grille produits recommandés ---- */
.nkosi-reco-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.nkosi-reco-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border-radius: 10px;
  background: #f9f9f9;
  text-decoration: none;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.nkosi-reco-item:hover {
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.nkosi-reco-img {
  flex: 0 0 60px;
  width: 60px;
  height: 60px;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.nkosi-reco-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.nkosi-reco-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.nkosi-reco-name {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #1a1a1a;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nkosi-reco-price {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #055B49;
}

/* =============================================
   Cart Drawer - Bandeau de reassurance
   Trust badges + review badge avant le checkout
   Date: 2026-04-09
   ============================================= */

.nkosi-cart-reassurance {
  display: flex;
  justify-content: center;
  gap: 16px;
  padding: 10px 0;
  margin-bottom: 6px;
  border-top: 1px solid rgba(0,0,0,0.06);
}

.nkosi-reassurance-item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  font-weight: 500;
  color: #055B49;
  white-space: nowrap;
}

.nkosi-reassurance-item svg {
  flex-shrink: 0;
}

.nkosi-cart-reviews-badge {
  text-align: center;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  color: #666;
  padding: 4px 0 10px;
  font-weight: 500;
}

.nkosi-cart-reviews-badge svg {
  margin-right: 2px;
}

/* ---- Responsive mobile : badges en wrap ---- */
@media screen and (max-width: 400px) {
  .nkosi-cart-reassurance {
    flex-wrap: wrap;
    gap: 6px 12px;
  }
}

/* =============================================
   Product Page - Trust Badges sous Add to Cart
   4 badges de confiance : paiement, livraison,
   service client, satisfait/rembourse
   Date: 2026-04-09
   ============================================= */

.nkosi-product-trust {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 16px;
  padding: 14px 12px;
  background: #f9f9f9;
  border-radius: 10px;
  border: 1px solid rgba(5, 91, 73, 0.08);
}

.nkosi-trust-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
  flex: 1;
}

.nkosi-trust-item svg {
  flex-shrink: 0;
}

.nkosi-trust-item span {
  font-family: 'DM Sans', sans-serif;
  font-size: 9.5px;
  font-weight: 500;
  color: #333;
  line-height: 1.2;
  letter-spacing: -0.1px;
}

@media screen and (max-width: 480px) {
  .nkosi-product-trust {
    gap: 4px;
    padding: 10px 6px;
  }
  .nkosi-trust-item span {
    font-size: 8.5px;
    letter-spacing: -0.2px;
  }
}


/* =============================================
   Product Page - Sticky Dual Column (v2)
   Both columns sticky: whichever is shorter
   stays pinned while the taller one scrolls.
   No white space on either side.
   Date: 2026-04-10
   ============================================= */

@media screen and (min-width: 750px) {
  /* Parent row: flex-start alignment */
  .main-product-section > .row.no-gutters {
    align-items: flex-start !important;
  }

  /* Both columns sticky */
  .main-product-section > .row.no-gutters > .col-md-6:first-child,
  .main-product-section > .row.no-gutters > .col-md-6:last-child {
    position: sticky;
    top: var(--header-height, 60px);
    align-self: flex-start;
    height: fit-content;
  }

  /* Remove old sticky-item override on right column */
  .main-product-section > .row.no-gutters > .col-md-6:last-child > .sticky-item {
    position: static !important;
    top: auto !important;
  }

  /* Ensure no overflow breaks sticky */
  .main-product-section {
    overflow: visible !important;
  }

  product-info.container,
  product-info.main-product-slider-wrapper {
    overflow: visible !important;
  }
}


/* =============================================
   Breadcrumb — Consolidated & CWV-optimized
   Date: 2026-04-16
   ============================================= */
.breadcrumb, .yv-breadcrumbs, nav.breadcrumb, .product-breadcrumb {
  font-size: 0.84em !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  contain: layout style !important;
  min-height: 28px;
}
.breadcrumb a, .yv-breadcrumbs a, .breadcrumb span, .yv-breadcrumbs span {
  font-size: inherit !important;
}


/* =============================================
   Cart Page - Produits similaires horizontal
   Date: 2026-04-10
   ============================================= */
.upsell-product-wrapper .upsell-product-slider {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  gap: 12px;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.upsell-product-wrapper .upsell-product-slider::-webkit-scrollbar {
  display: none;
}
.upsell-product-wrapper .upsell-product-slider .yv-product-card,
.upsell-product-wrapper .upsell-product-slider .small-product-card {
  flex: 0 0 200px !important;
  min-width: 180px;
  max-width: 220px;
}

/* =============================================
   Cart Page - Upsell & Reassurance section
   Date: 2026-04-10
   ============================================= */
.nkosi-cart-page-reassurance {
  margin-top: 20px;
  padding: 16px;
  background: #f9f9f9;
  border-radius: 12px;
  border: 1px solid rgba(5, 91, 73, 0.08);
}

.nkosi-cart-page-reassurance .nkosi-cart-reassurance {
  border-top: none;
  padding-top: 0;
}

.nkosi-cart-page-reco-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #055B49;
  margin: 0 0 12px;
  display: flex;
  align-items: center;
}

.nkosi-cart-page-reco-grid {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
}
.nkosi-cart-page-reco-grid::-webkit-scrollbar {
  display: none;
}
.nkosi-cart-page-reco-card {
  flex: 0 0 150px;
  text-decoration: none;
  text-align: center;
}
.nkosi-cart-page-reco-card img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 10px;
  background: #fff;
}
.nkosi-cart-page-reco-card .reco-name {
  display: block;
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #1a1a1a;
  margin-top: 6px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nkosi-cart-page-reco-card .reco-price {
  display: block;
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #055B49;
  margin-top: 2px;
}


/* Badge -10% flottant - fixer en bas a gauche, ne pas deborder */
.yv-discount-label,

/* =============================================
   Collection Page - Fix sidebar + products layout
   Override theme's absolute positioning with proper flex
   Date: 2026-04-10
   ============================================= */

@media screen and (min-width: 768px) {
  /* Parent: force flex row layout */
  .collection-products-section .yv-collection-products,
  .collection-products-section #CollectionProductsContainer {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    overflow: visible !important;
    position: relative !important;
  }

  /* Sidebar: override absolute to sticky, fix width — tablette */
  .collection-products-section .yv-filter-sidebar,
  .collection-products-section #filterSideBar {
    position: sticky !important;
    top: calc(var(--header-height, 60px) + 10px) !important;
    flex: 0 0 23% !important;
    max-width: 23% !important;
    width: 23% !important;
    height: auto !important;
    left: auto !important;
    opacity: 1 !important;
    transform: none !important;
    overflow-y: auto !important;
    max-height: calc(100vh - var(--header-height, 60px) - 30px) !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(5, 91, 73, 0.25) transparent;
    align-self: flex-start !important;
  }

  /* Products: fill remaining space, no margin-left */
  .collection-products-section .yv-products-list {
    margin-left: 0 !important;
    flex: 1 1 0% !important;
    max-width: 77% !important;
    padding-top: 0 !important;
  }
}

/* Rules applying from tablet up (768px+) */
@media screen and (min-width: 768px) {
  /* Remove the border-top between sidebar and products */
  .yv-filter-sidebar + .yv-products-list {
    border-top: none !important;
  }

  /* Webkit scrollbar */
  #filterSideBar::-webkit-scrollbar { width: 4px; }
  #filterSideBar::-webkit-scrollbar-track { background: transparent; }
  #filterSideBar::-webkit-scrollbar-thumb { background: rgba(5,91,73,0.2); border-radius: 4px; }

  /* Ensure ancestors don't break layout */
  .yv-collection-container {
    overflow: visible !important;
  }
}

/* Sidebar +25% sur desktop ≥ 1024px */
@media screen and (min-width: 1024px) {
  .collection-products-section .yv-filter-sidebar,
  .collection-products-section #filterSideBar {
    flex: 0 0 29% !important;
    max-width: 29% !important;
    width: 29% !important;
  }
  .collection-products-section .yv-products-list {
    max-width: 71% !important;
  }
}

/* =============================================
   Search Results Page - Fix sidebar + products layout
   PERMANENT FIX — ne pas modifier sans tester la page /search
   Corrige le décalage vertical entre filtres et grille produits
   Cause racine : theme.min.css applique margin-left:20% + flex-wrap:wrap
   sur .main-search-section .yv-products-list, ce qui pousse les produits
   sous la sidebar au lieu de les afficher à côté.
   Date: 2026-04-14
   ============================================= */

/* Override theme.min.css padding:90px 0 sur la section search */
.main-search-section {
  padding-top: 20px !important;
  padding-bottom: 30px !important;
}

@media screen and (min-width: 768px) {
  /* Parent: force flex row layout on search page
     Override theme.min.css: flex-wrap:wrap → nowrap */
  .main-search-section .yv-collection-products,
  .main-search-section #CollectionProductsContainer,
  .main-search-section .productResultContainer {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    overflow: visible !important;
    position: relative !important;
  }

  /* Sidebar: override to sticky, fix width at 23% — tablette */
  .main-search-section .yv-filter-sidebar,
  .main-search-section #filterSideBar {
    position: sticky !important;
    top: calc(var(--header-height, 60px) + 10px) !important;
    flex: 0 0 23% !important;
    max-width: 23% !important;
    width: 23% !important;
    height: auto !important;
    left: auto !important;
    opacity: 1 !important;
    transform: none !important;
    overflow-y: auto !important;
    max-height: calc(100vh - var(--header-height, 60px) - 30px) !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(5, 91, 73, 0.25) transparent;
    align-self: flex-start !important;
  }

  /* Products: fill remaining 77%, KILL the 20% margin-left from theme.min.css
     theme.min.css rule: .main-search-section .yv-products-list{margin-left:20%}
     This is the primary cause of the spacing bug */
  .main-search-section .yv-products-list {
    margin-left: 0 !important;
    flex: 1 1 0% !important;
    max-width: 77% !important;
    padding-top: 0 !important;
    transition: none !important;
  }
}

/* Also override the drawer-filters variant — all sizes ≥ 768px */
@media screen and (min-width: 768px) {
  .main-search-section .yv-drawer-filters .yv-products-list {
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  /* best-selling variant from theme.min.css */
  .main-search-section .best-selling .yv-products-list {
    padding-left: 30px !important;
    margin-left: 0 !important;
  }

  /* filters-toggle variant from theme.min.css */
  .main-search-section .filters-toggle .yv-products-list {
    margin-left: 0 !important;
  }

  /* filters-hide: when sidebar is hidden, products take full width */
  .main-search-section .filters-hide .yv-products-list {
    margin-left: 0 !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
  }

  /* Ensure search containers don't clip or break flex layout */
  .main-search-section .yv-search-result-content,
  .main-search-section .yv-tab-content,
  .main-search-section .yv-tab-pane,
  .main-search-section .yv-search-page-container {
    overflow: visible !important;
  }
}

/* Search sidebar +25% sur desktop ≥ 1024px */
@media screen and (min-width: 1024px) {
  .main-search-section .yv-filter-sidebar,
  .main-search-section #filterSideBar {
    flex: 0 0 29% !important;
    max-width: 29% !important;
    width: 29% !important;
  }
  .main-search-section .yv-products-list {
    max-width: 71% !important;
  }
}

/* Search page: reduce top spacing between elements */
.main-search-section .section-heading {
  margin-bottom: 5px !important;
  padding-bottom: 0 !important;
}
.main-search-section .yv-search-result-inputbox {
  margin-bottom: 5px !important;
  padding-bottom: 5px !important;
}
.main-search-section .yv-tabs-wrapper .yv-tabs {
  margin-bottom: 5px !important;
  padding-bottom: 5px !important;
}
.main-search-section .yv-collections-topbar {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  margin-bottom: 0 !important;
}


/* =============================================
   Collection Page - Réduire espace banner + gap produits
   Aligner la grille produits au niveau des filtres
   Date: 2026-04-10
   ============================================= */

/* Banner titre collection : compact */
.yv-collection-banner {
  min-height: 0 !important;
  padding: 8px 0 4px !important;
}
.yv-collection-banner[data-image="false"] {
  min-height: 0 !important;
  height: auto !important;
}
.yv-collection-banner .collection-banner-title {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 1.3em !important;
}
.yv-collection-banner .collection-banner-content {
  padding: 0 !important;
}

/* Réduire espace entre banner et zone produits */
.yv-collection-container {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Topbar (Filtre + Trier par) : réduire padding */
.yv-collections-topbar {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  margin-bottom: 0 !important;
}

/* Réduire gap entre topbar et grille produits */
#CollectionProductsContainer {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Liste produits : remonter au niveau des filtres */
.yv-products-list {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.yv-filter-sidebar + .yv-products-list {
  border-top: none !important;
}

/* Grille produits row : réduire marge haute */
.yv-products-list > .row[data-collection-products] {
  margin-top: 0 !important;
}
.yv-products-list .yv-product-card:first-child {
  margin-top: 0 !important;
}

/* Breadcrumb margin/padding → consolidé dans bloc principal L841+ */

/* Section wrapper du main-collection : réduire padding */
.shopify-section-main-collection {
  padding-top: 0 !important;
}

@media screen and (max-width: 749px) {
  .yv-collection-banner {
    padding: 6px 0 4px !important;
  }
  .yv-collection-banner .collection-banner-title {
    font-size: 1.1em !important;
  }
  .yv-products-list {
    padding-top: 0 !important;
  }
}

/* =============================================
   Newsletter "Rejoignez nous" — Désactiver scroll
   Le widget custom Liquid ne doit pas scroller
   Date: 2026-04-10
   ============================================= */

.custom-liquid-section .section-spacer,
.custom-liquid-section .rich-text-description {
  overflow: hidden !important;
  max-height: none !important;
}
.custom-liquid-section .nkosi-newsletter-custom,
.custom-liquid-section .nk-klaviyo-form {
  overflow: hidden !important;
}

/* =============================================
   MoonBundle — Masquer dans Produit en Vedette (homepage)
   L'app doit rester active sur les pages produit
   Date: 2026-04-10
   ============================================= */

.featured-product-section .moonbundle-box,
.featured-product-section .nkosi-featured-moonbundle,
.featured-product-section [class*="moonbundle"] {
  display: none !important;
}


/* =============================================
   Product Page Mobile - Fix image behind content
   L'image produit apparait en arriere-plan des
   elements texte sur mobile (z-index/position)
   Date: 2026-04-10
   ============================================= */

@media screen and (max-width: 749px) {
  /* Galerie images : relative, pas sticky/fixed */
  .main-product-section > .row.no-gutters > .col-md-6:first-child,
  .main-product-slider-wrapper .col-lg-8,
  .product-detail-slider,
  .main-slider-wrapper {
    position: relative !important;
    z-index: 1 !important;
    top: auto !important;
  }

  /* Colonne info produit : fond opaque, au-dessus de la galerie */
  .main-product-section > .row.no-gutters > .col-md-6:last-child,
  .main-product-section .sticky-item {
    position: relative !important;
    z-index: 2 !important;
    background: var(--color-body-bg, #fff) !important;
    top: auto !important;
  }

  /* Conteneur principal : pas d overflow hidden qui casse le flow */
  .main-product-section {
    overflow: visible !important;
  }

  product-info.main-product-slider-wrapper,
  product-info.container {
    overflow: visible !important;
  }
}


/* =============================================
   Bouton Acheter maintenant — cote a cote avec Ajouter au panier
   Date: 2026-04-10
   ============================================= */

/* Conteneur : les deux boutons en ligne */
.pdp-action-container {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
  align-items: stretch;
}

/* Ajouter au panier : prend l espace restant */
.pdp-action-container .Sd_addProduct {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  width: auto !important;
}

/* Acheter maintenant */
.nkosi-buy-now {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  background: #055B49 !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--layoutRadius, 0px) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: background 0.15s !important;
  padding: 12px 16px !important;
  text-align: center !important;
  white-space: nowrap !important;
}
.nkosi-buy-now:hover {
  background: #044a3b !important;
}
.nkosi-buy-now:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

/* Dynamic checkout (Shopify Pay etc) prend toute la largeur en dessous */
.pdp-action-container .shopify-payment-button {
  flex: 0 0 100% !important;
}

/* Mobile : les deux boutons en ligne aussi, plus petits */
@media screen and (max-width: 767px) {
  .nkosi-buy-now {
    font-size: 13px !important;
    padding: 10px 12px !important;
  }
}


/* =============================================
   Boutons produit — Hover states
   Date: 2026-04-10
   ============================================= */

/* Les deux boutons : meme forme, texte toujours blanc */
.pdp-action-container .Sd_addProduct,
.pdp-action-container .nkosi-buy-now {
  border-radius: 25px !important;
  color: #fff !important;
  transition: background 0.2s, border-color 0.2s !important;
}
.pdp-action-container .Sd_addProduct span {
  color: #fff !important;
}

/* Hover identique pour les deux boutons : fond #DEE7E3, texte vert fonce */
.pdp-action-container .Sd_addProduct:hover {
  background: #DEE7E3 !important;
  border-color: #DEE7E3 !important;
  color: #055B49 !important;
}
.pdp-action-container .Sd_addProduct:hover span {
  color: #055B49 !important;
}
.nkosi-buy-now {
  background: #055B49 !important;
  color: #fff !important;
}
.nkosi-buy-now:hover {
  background: #DEE7E3 !important;
  color: #055B49 !important;
}


/* =============================================
   Trust Badges Produit — Taille augmentee
   Date: 2026-04-10
   ============================================= */

.nkosi-product-trust {
  gap: 16px !important;
}
.nkosi-product-trust .nkosi-trust-item svg {
  width: 26px !important;
  height: 26px !important;
}
.nkosi-product-trust .nkosi-trust-item span {
  font-size: 13px !important;
  line-height: 1.3 !important;
}


/* =============================================
   Cacher le bouton Shop Pay (Acheter avec Shop)
   sur les widgets produits vedettes / homepage
   Date: 2026-04-10
   ============================================= */

.nkosi-produit-vedette .shopify-payment-button,
.featured-product .shopify-payment-button,
[class*="featured-product"] .shopify-payment-button,
[class*="produit-vedette"] .shopify-payment-button {
  display: none !important;
}

/* =============================================
   Cart Drawer — Desktop plus large, rien de coupe
   Produits similaires reactives
   Widget Meilleures Ventes scrollable horizontal
   Date: 2026-04-10
   ============================================= */

/* Desktop : drawer elargi pour que tout le contenu soit visible */
@media screen and (min-width: 768px) {
  .yv_side_drawer_wrapper {
    max-width: 560px !important;
    overflow: visible !important;
  }
  .yv_side_drawer_body {
    overflow: visible !important;
  }
  /* Forcer les elements du panier a ne pas depasser */
  .yv_side_drawer_body,
  .yv-side-drawer-container,
  [data-drawer-body] {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Les items du panier : pas de debordement */
  .cart-items-wrapper,
  .cart-items-wrapper > div,
  .price-details,
  .totle-price {
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }
}

/* Pas de scroll horizontal sur le drawer — desktop: visible pour upsell */
@media screen and (min-width: 768px) {
  .yv_side_drawer_wrapper {
    overflow: visible !important;
  }
}
@media screen and (max-width: 767px) {
  .yv_side_drawer_wrapper,
  [data-drawer-body] {
    overflow-x: hidden !important;
  }
}

/* Scroll vertical natif */
.yv-side-drawer-container {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
}

/* Reactiver les produits similaires (upsell) */
.upsell-product-wrapper,
[data-cart-upsell-wrapper] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* --- Widget Meilleures Ventes --- */
.nkosi-cart-bestsellers {
  padding: 12px;
  margin-top: 8px;
  border-top: 1px solid #eee;
  background: #fafafa;
  border-radius: 10px;
  overflow: hidden;
}
.nkosi-cart-bs-title {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  margin: 0 0 8px;
}
.nkosi-cart-bs-grid {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  gap: 8px;
  padding-bottom: 6px;
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
}
.nkosi-cart-bs-grid::-webkit-scrollbar {
  height: 4px;
}
.nkosi-cart-bs-grid::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 4px;
}
.nkosi-cart-bs-item {
  flex: 0 0 110px;
  width: 110px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  background: #fff;
  border-radius: 8px;
  padding: 8px;
  border: 1px solid #eee;
  transition: border-color 0.15s;
}
.nkosi-cart-bs-item:hover {
  border-color: #055B49;
}
.nkosi-cart-bs-img {
  width: 60px;
  height: 60px;
  overflow: hidden;
  border-radius: 6px;
  margin-bottom: 4px;
}
.nkosi-cart-bs-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nkosi-cart-bs-name {
  display: block;
  font-size: 11px;
  color: #333;
  line-height: 1.3;
  margin-bottom: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100px;
  text-align: center;
}
.nkosi-cart-bs-price {
  font-size: 11px;
  font-weight: 600;
  color: #055B49;
}

/* Mobile : widget compact */
@media screen and (max-width: 767px) {
  .nkosi-cart-bestsellers {
    padding: 10px 8px;
  }
  .nkosi-cart-bs-item {
    flex: 0 0 95px;
    width: 95px;
    padding: 6px;
  }
  .nkosi-cart-bs-img {
    width: 50px;
    height: 50px;
  }
  .nkosi-cart-bs-name {
    font-size: 10px;
    max-width: 85px;
  }
  .nkosi-cart-bs-price {
    font-size: 10px;
  }
}

/* --- Reassurance : retour a la ligne --- */
.nkosi-cart-reassurance {
  flex-wrap: wrap !important;
}
.nkosi-cart-reassurance .nkosi-reassurance-item {
  white-space: normal !important;
}


/* =============================================
   Cart Drawer — Bandeau titre "Votre panier" compact
   Desktop : -50% hauteur | Mobile : -30% hauteur
   Croix non rognee, non reduite sur desktop
   Date: 2026-04-10
   ============================================= */

/* Desktop : padding reduit de 50% */
@media screen and (min-width: 768px) {
  .yv_side_drawer_title {
    padding: 12px 20px !important;
    min-height: 0 !important;
  }
  .yv_side_drawer_title h6,
  .yv_side_drawer_title [data-drawer-title] {
    font-size: 16px !important;
    margin: 0 !important;
    line-height: 1.2 !important;
  }
  /* Croix : taille normale, bien positionnee */
  .yv_side_drawer_close {
    width: 44px !important;
    height: 44px !important;
    top: 0 !important;
    right: 0 !important;
  }
}

/* Mobile : padding reduit de 30% */
@media screen and (max-width: 767px) {
  .yv_side_drawer_title {
    padding: 14px 16px !important;
    min-height: 0 !important;
  }
  .yv_side_drawer_title h6,
  .yv_side_drawer_title [data-drawer-title] {
    font-size: 15px !important;
    margin: 0 !important;
    line-height: 1.2 !important;
  }
  .yv_side_drawer_close {
    width: 36px !important;
    height: 36px !important;
    top: 4px !important;
    right: 4px !important;
  }
}


/* =============================================
   Cart Drawer — Section Total/Footer compacte
   Date: 2026-04-10
   ============================================= */

/* Zone Total : tres compact, pas d espace */
.price-details {
  padding: 2px 16px 0 !important;
  margin: 0 !important;
}
.totle-price {
  padding: 4px 16px !important;
  margin: 0 !important;
  font-size: 14px !important;
}
.totle-price .h4 {
  font-size: 15px !important;
}

/* Reassurance + reviews : serres */
.nkosi-cart-reassurance {
  padding: 4px 0 !important;
  margin: 0 !important;
  gap: 10px !important;
}
.nkosi-cart-reviews-badge {
  padding: 0 0 2px !important;
  margin: 0 !important;
  font-size: 11px !important;
}

/* Bouton checkout : plus petit sur desktop */
.cart-btn-container {
  padding: 2px 16px !important;
  margin: 0 !important;
}
.cart-btn-container .checkout-btn {
  padding: 8px 14px !important;
  font-size: 12px !important;
}
.cart-btn-container .checkout-btn svg {
  width: 14px !important;
  height: 14px !important;
}

/* Voir le panier — MASQUE (demande Antonio 2026-04-10) */
.shopping_cont {
  display: none !important;
}

/* Gift wrap */
.giftcard-box {
  padding: 2px 16px !important;
  margin: 0 !important;
}

/* [REMOVED] Old redundant mobile block — merged into main mobile section below */


/* =============================================
   Cart Drawer — Boutons checkout + voir panier reduits desktop
   Date: 2026-04-10
   ============================================= */

/* Merged into main footer section above */


/* =============================================
   Cart Drawer — Supprimer espaces blancs,
   resserrer footer, exploiter max pour produits
   Date: 2026-04-10
   ============================================= */

/* Zone grise footer : coller au contenu, pas d espace blanc */
.yv_cart-poroduct-container .price-details,
.yv_cart-poroduct-container .cart-footer,
.yv_cart-poroduct-container > div:last-child {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Supprimer les marges et paddings inutiles dans le footer */
.price-details ul {
  padding: 4px 0 !important;
  margin: 0 !important;
}
.price-details ul li {
  padding: 2px 16px !important;
}

/* Total : compact mais lisible */
.price-details .totle-price {
  padding: 6px 16px !important;
  border-top: 1px solid #eee;
}

/* Espace entre articles et footer : minimal */
.cart-items-wrapper {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Widget meilleures ventes : coller en bas, pas d espace apres */
.nkosi-cart-bestsellers {
  margin-bottom: 4px !important;
}

/* Supprimer tout espace blanc en bas du drawer */
.yv-side-drawer-container {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
.yv-side-drawer-container > div:last-child {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
/* Partie grise (footer) : coller en bas */
.yv_cart-poroduct-container .price-details {
  margin-top: 0 !important;
}

/* Mobile : encore plus serre */
@media screen and (max-width: 767px) {
  .price-details ul li {
    padding: 2px 12px !important;
  }
  .price-details .totle-price {
    padding: 4px 12px !important;
  }
  .nkosi-cart-bestsellers {
    margin-bottom: 2px !important;
  }
}


/* =============================================
   Cart Drawer — Bandeau Total encore plus fin
   Date: 2026-04-10
   ============================================= */

.price-details .totle-price,
.totle-price.text-large,
ul.list-unstyled .totle-price {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  line-height: 1.1 !important;
}


/* =============================================
   Cart Drawer — Espace blanc bas + reassurance taille
   Date: 2026-04-10
   ============================================= */

/* Eliminer espace blanc sous la zone grise */
.yv_side_drawer_body {
  display: flex !important;
  flex-direction: column !important;
}
.yv-side-drawer-container.yv_cart-poroduct-container {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}
.yv-side-drawer-container.yv_cart-poroduct-container > div:last-child {
  margin-top: auto !important;
}

/* Reassurance : police legerement plus grande */
.nkosi-cart-reassurance .nkosi-reassurance-item {
  font-size: 12px !important;
}
.nkosi-cart-reassurance .nkosi-reassurance-item svg {
  width: 15px !important;
  height: 15px !important;
}

@media screen and (max-width: 767px) {
  .nkosi-cart-reassurance .nkosi-reassurance-item {
    font-size: 11px !important;
  }
}

/* =============================================
   Cart Drawer Mobile — Tout visible, rien de rogne
   Prix, badges, texte reassurance tout affiche
   FIX: override paddings fixes du theme (30px -> 10px)
   + contraindre cart-item-container, bottom-cart-box,
     quantity input, cart-item-price-unit
   Date: 2026-04-10
   ============================================= */

/* ===== RESPONSIVE PANIER — Toutes tailles ===== */

/* Mobile et tablette : drawer pleine largeur, tout en % */
@media screen and (max-width: 767px) {
  .yv_side_drawer_wrapper {
    max-width: 100vw !important;
    width: 100% !important;
    right: 0 !important;
    left: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }
  /* Upsell drawer masque sur mobile (pas de place) */
  .yv-upsell-drawer {
    display: none !important;
  }
  /* Empecher le body de scroller horizontalement quand drawer ouvert */
  body.side_Drawer_open,
  body.yv_side_Drawer_open {
    overflow-x: hidden !important;
  }
  .yv_side_drawer_body {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 0 !important;
  }
  .yv-side-drawer-container,
  [data-drawer-body] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  /* ---- CAUSE RACINE #1 : padding 30px du theme + width fixe ---- */
  .yv-cart-drawer {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    max-width: 100% !important;
  }
  .cart-item-container {
    padding: 0 10px !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* ---- CAUSE RACINE #2 : padding 30px + margin 30px du footer ---- */
  .bottom-cart-box {
    padding: 10px !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    width: auto !important;
    left: 0 !important;
    right: 0 !important;
    position: relative !important;
  }

  /* ---- CAUSE RACINE #3 : input quantite 100px fixe ---- */
  .cart-items-wrapper .quantity input {
    width: 70px !important;
    padding: 2px 18px !important;
    font-size: 13px !important;
  }
  .cart-items-wrapper .quantity-button {
    width: 24px !important;
  }

  /* ---- CAUSE RACINE #4 : prix unitaire flex 52% trop large ---- */
  .cart-item-price-unit {
    max-width: 48% !important;
    flex: 0 0 auto !important;
  }

  /* ---- Elements internes : box-sizing + pas de debordement ---- */
  /* EXCEPTION : .nkosi-cart-bs-grid doit garder overflow-x: auto */
  .yv_side_drawer_body *:not(.nkosi-cart-bs-grid),
  .yv-side-drawer-container *:not(.nkosi-cart-bs-grid) {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Article produit : layout flexible */
  .cart-items-wrapper,
  .cart-items-wrapper > div,
  .yv-cart-content-box {
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  /* Nom produit : tronquer si trop long */
  .cart-items-wrapper .yv-product-title,
  .cart-items-wrapper .yv-product-information a {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    word-break: break-word !important;
    font-size: 13px !important;
  }

  /* Prix : toujours visibles, pas de troncature */
  .cart-item-price,
  .cart-item-total {
    white-space: nowrap !important;
    font-size: 13px !important;
    overflow: visible !important;
  }
  .cart-item-price .yv-prizebox {
    flex-wrap: wrap !important;
    gap: 2px !important;
  }

  /* Image produit dans le drawer */
  .cart-items-wrapper .yv-product-image,
  .yv-cart-content-box > a:first-child {
    flex: 0 0 70px !important;
    width: 70px !important;
    min-width: 70px !important;
  }

  /* Livraison gratuite : retour a la ligne */
  .free_shipping_wrapper {
    padding: 6px 8px !important;
  }
  .free_shipping_wrapper p,
  .yv_side_drawer_wrapper .free_shipping_wrapper p,
  [data-free-shipping-text],
  .yv_side_drawer_wrapper [data-free-shipping-text] {
    font-size: 14px !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    line-height: 1.3 !important;
  }

  /* Reassurance : wrap si necessaire */
  .nkosi-cart-reassurance {
    padding: 4px 6px !important;
    gap: 4px 8px !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
  }
  .nkosi-cart-reassurance .nkosi-reassurance-item {
    font-size: 10px !important;
    gap: 2px !important;
    white-space: nowrap !important;
  }
  .nkosi-cart-reassurance .nkosi-reassurance-item svg {
    width: 12px !important;
    height: 12px !important;
    flex-shrink: 0 !important;
  }

  /* Reviews */
  .nkosi-cart-reviews-badge {
    font-size: 10px !important;
    padding: 0 0 2px !important;
  }

  /* Checkout + voir panier */
  .cart-btn-container {
    padding: 4px 8px !important;
  }
  .cart-btn-container .checkout-btn {
    padding: 10px 14px !important;
    font-size: 13px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* VOIR LE PANIER — MASQUE mobile + desktop */
  .shopping_cont,
  .yv_side_drawer_wrapper .shopping_cont,
  .bottom-cart-box .shopping_cont {
    display: none !important;
  }

  /* Total */
  .price-details {
    padding: 2px 8px 0 !important;
  }
  .price-details ul li {
    padding: 2px 10px !important;
  }
  .totle-price {
    padding: 4px 8px !important;
  }
  .price-details .totle-price {
    padding: 4px 10px !important;
  }

  /* Meilleures ventes mobile — grid garde son scroll horizontal */
  .nkosi-cart-bestsellers {
    padding: 8px !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }
  .nkosi-cart-bs-grid {
    max-width: none !important;
    overflow-x: auto !important;
  }
  .nkosi-cart-bs-item {
    flex: 0 0 90px !important;
    width: 90px !important;
    padding: 5px !important;
  }
  .nkosi-cart-bs-img {
    width: 48px !important;
    height: 48px !important;
  }
  .nkosi-cart-bs-name {
    font-size: 9px !important;
    max-width: 80px !important;
  }
  .nkosi-cart-bs-price {
    font-size: 9px !important;
  }
  .item-discount-tag {
    font-size: 10px !important;
  }

  /* Upsell sidebar — garder le style du theme */
  .yv-suggest-sidebar-content,
  .yv-drawer-sidebar {
    box-sizing: border-box !important;
  }

  /* Desktop : upsell drawer visible a gauche du panier */
  @media screen and (min-width: 768px) {
    .yv-upsell-drawer {
      display: grid !important;
      overflow: visible !important;
    }
  }

  /* Gift wrap compact */
  .giftcard-box {
    padding: 2px 10px !important;
    max-width: 100% !important;
  }
}

/* Tres petit ecran < 380px */
@media screen and (max-width: 380px) {
  .cart-item-container {
    padding: 0 6px !important;
  }
  .bottom-cart-box {
    padding: 8px 6px !important;
  }
  .cart-items-wrapper .quantity input {
    width: 58px !important;
    padding: 2px 14px !important;
    font-size: 12px !important;
  }
  .cart-items-wrapper .quantity-button {
    width: 20px !important;
  }
  .cart-items-wrapper .yv-product-image,
  .yv-cart-content-box > a:first-child {
    flex: 0 0 60px !important;
    width: 60px !important;
    min-width: 60px !important;
  }
  .nkosi-cart-reassurance .nkosi-reassurance-item {
    font-size: 8px !important;
  }
  .cart-btn-container .checkout-btn {
    padding: 8px 10px !important;
    font-size: 12px !important;
  }
  .free_shipping_wrapper p,
  [data-free-shipping-text] {
    font-size: 13px !important;
  }
  .nkosi-cart-bs-item {
    flex: 0 0 80px !important;
    width: 80px !important;
  }
  .nkosi-cart-bs-img {
    width: 40px !important;
    height: 40px !important;
  }
  .cart-items-wrapper .yv-product-title,
  .cart-items-wrapper .yv-product-information a {
    font-size: 12px !important;
  }
  .cart-item-price,
  .cart-item-total {
    font-size: 12px !important;
  }
}


/* =============================================
   Cart Drawer Mobile — Flexbox overflow fix
   Root cause: flex children without min-width:0
   overflow their parent on narrow viewports.
   Date: 2026-04-10
   ============================================= */

@media screen and (max-width: 767px) {
  /* Force all flex children in the drawer to shrink properly */
  .media-link {
    display: flex !important;
    overflow: hidden !important;
    max-width: 100% !important;
  }
  .media-body {
    min-width: 0 !important;
    flex: 1 1 0% !important;
    overflow: hidden !important;
  }
  .media-img {
    flex-shrink: 0 !important;
  }
  /* Price row: allow wrapping */
  .cart-item-price.yv-product-information {
    flex-wrap: wrap !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  /* Price unit: don't exceed remaining space */
  .cart-item-price-unit {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .cart-item-price-unit .yv-prizebox {
    flex-wrap: wrap !important;
  }
  /* Total line: prevent overflow from app elements */
  .qb-total-line-item {
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }
  /* Product title in cart: truncate */
  .media-body .yv-product-title {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    max-width: 100% !important;
  }
  /* Cart note textarea */
  .cartNoteContainer textarea {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Remove button: prevent overflow */
  .sd_mini_removeproduct {
    flex-shrink: 0 !important;
  }
}


/* =============================================
   FAQ Section — Elargir a la meme largeur que
   le custom-liquid Klaviyo en dessous
   Date: 2026-04-10
   ============================================= */

.faq-section .container,
.yv-faq-detail {
  max-width: 100% !important;
  width: 100% !important;
}
.faq-section .yv-faq-accordion {
  max-width: 100% !important;
}


/* =============================================
   Tous les boutons du site — Hover #DEE7E3
   Date: 2026-04-10
   ============================================= */

.button:hover,
button.button:hover,
a.button:hover,
.btn:hover,
.Sd_addProduct:hover,
.nkosi-buy-now:hover,
.checkout-btn:hover,
.shopify-payment-button button:hover,
.add_to_cart:hover,
input[type="submit"]:hover,
.yv-btn:hover,
.med-btn:hover,
.black-btn:hover,
.yv-product-card .button:hover,
.collection-card .button:hover {
  background: #DEE7E3 !important;
  border-color: #DEE7E3 !important;
  color: #055B49 !important;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

/* Texte dans les boutons hover */
.button:hover span,
button.button:hover span,
.Sd_addProduct:hover span,
.checkout-btn:hover span,
.med-btn:hover span,
.black-btn:hover span {
  color: #055B49 !important;
}

/* SVG dans les boutons hover */
.button:hover svg,
.checkout-btn:hover svg,
.med-btn:hover svg,
.black-btn:hover svg {
  fill: #055B49 !important;
  stroke: #055B49 !important;
}

/* Masquer le bouton de recherche vocale (micro) partout */
.search__speech,
.header-search-bar-speech,
[data-speech-search] {
  display: none !important;
}

/* Bouton "Aller a la caisse" dans le cart drawer — hover blanc */
.yv_side_drawer_wrapper .checkout-btn:hover,
.yv_cart-poroduct-container .checkout-btn:hover,
.bottom-cart-box .checkout-btn:hover {
  background: #ffffff !important;
  border-color: #055B49 !important;
  color: #055B49 !important;
}
.yv_side_drawer_wrapper .checkout-btn:hover span,
.bottom-cart-box .checkout-btn:hover span {
  color: #055B49 !important;
}
.yv_side_drawer_wrapper .checkout-btn:hover svg,
.bottom-cart-box .checkout-btn:hover svg {
  fill: #055B49 !important;
  stroke: #055B49 !important;
}

/* =============================================
   Pages Produit — Espacement breadcrumb → contenu
   Desktop : ~7px entre breadcrumb et images/titre
   (demande Antonio 2026-04-14 — reduit 50% supplementaire)
   ============================================= */

@media screen and (min-width: 768px) {
  /* Breadcrumb compact */
  .breadcrumb-nav {
    padding: 3px 0 2px !important;
  }
  .breadcrumb-item a,
  .breadcrumb-item span {
    padding: 2px 0 !important;
  }
  /* Shopify section wrapper autour du main-product : supprimer marge haute */
  [class*="shopify-section"] > product-info,
  .shopify-section > product-info {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  #MainContent > .shopify-section:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Container produit global : 7px de marge haute */
  product-info.container,
  product-info.main-product-slider-wrapper {
    padding-top: 7px !important;
    margin-top: 0 !important;
  }

  /* Section produit interne */
  .yv_product_content_section.main-product-section {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Detail produit (colonne droite) */
  .yv-main-product-detail {
    padding-top: 0 !important;
  }
  .yv-main-product-detail.slider-product-detail {
    padding-top: 0 !important;
  }

  /* Section produit wrapper */
  .product-section.single__product {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Images produit */
  .yv-main-product-gallery,
  .yv-product-gallery,
  .product-media-container {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* Container section produit */
  .product-section .container {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
}


/* =============================================
   Cart Drawer — Polices footer +30%
   Total, reassurance, reviews, bouton checkout
   Date: 2026-04-10
   ============================================= */

/* Total */
.yv_cart-poroduct-container .totle-price {
  font-size: 18px !important;
}
.yv_cart-poroduct-container .totle-price .h4 {
  font-size: 20px !important;
}

/* Reassurance */
.nkosi-cart-reassurance .nkosi-reassurance-item {
  font-size: 15px !important;
}
.nkosi-cart-reassurance .nkosi-reassurance-item svg {
  width: 18px !important;
  height: 18px !important;
}

/* Reviews badge */
.nkosi-cart-reviews-badge {
  font-size: 15px !important;
}

/* Bouton Aller a la caisse */
.yv_cart-poroduct-container .checkout-btn {
  font-size: 16px !important;
  padding: 12px 18px !important;
}
.yv_cart-poroduct-container .checkout-btn svg {
  width: 20px !important;
  height: 20px !important;
}

/* Voir le panier */
.yv_cart-poroduct-container .shopping_cont {
  font-size: 14px !important;
}


/* =============================================
   Moon Bundle — Reduire largeur sur mobile
   Ajouter marges laterales pour ne pas toucher les bords
   Date: 2026-04-10
   ============================================= */

@media screen and (max-width: 767px) {
  .moonbundle-box {
    margin-left: 12px !important;
    margin-right: 12px !important;
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    box-sizing: border-box !important;
  }
}


/* =============================================
   Mobile — Marges 12px trust badges + chatbot
   Date: 2026-04-10
   ============================================= */

@media screen and (max-width: 767px) {
  /* Trust badges reassurance */
  .nkosi-product-trust {
    margin-left: 12px !important;
    margin-right: 12px !important;
    width: calc(100% - 24px) !important;
    box-sizing: border-box !important;
  }

}


/* =============================================
   Sticky Add-to-Cart Bar — Titre produit reduit de 50%
   Desktop + Mobile (demande Antonio 2026-04-10)
   ============================================= */

/* Bandeau : padding reduit (16px -> 6px), hauteur minimale */
#yvProductStickyBar,
.yv-product-viewbar {
  padding: 4px 0 !important;
}

/* Alignement vertical : tout centre sur la meme ligne */
#yvProductStickyBar .product-view-wrapper,
.yv-product-viewbar .product-view-wrapper {
  align-items: center !important;
  gap: 0 !important;
}

/* Bouton : compact et aligne */
#yvProductStickyBar .button.xsmall-btn,
.yv-product-viewbar .button.xsmall-btn,
#yvProductStickyBar .Sd_addProductSticky,
.yv-product-viewbar .Sd_addProductSticky {
  padding: 6px 14px !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  min-height: 0 !important;
  height: auto !important;
}

/* Titre : 50% plus petit */
#yvProductStickyBar .product-view-name h5,
#yvProductStickyBar .product-view-name h6,
.yv-product-viewbar .product-view-name h5,
.yv-product-viewbar .product-view-name h6 {
  font-size: calc(var(--text) * 0.625) !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

/* Image : compacte */
.yv-product-viewbar .product-view-img {
  min-width: 30px !important;
  max-width: 30px !important;
  margin-right: 10px !important;
}

/* Nom produit : pas de marge excessive */
.yv-product-viewbar .product-view-name {
  padding-right: 8px !important;
}

/* Prix : resserrer */
.yv-product-viewbar .yv-prizebox {
  padding: 0 15px 0 8px !important;
}

/* Bouton : compact */
.yv-product-viewbar .pdp-action-container {
  margin: 0 !important;
}
.yv-product-viewbar .product_button {
  margin-top: 0 !important;
}

/* Erreurs : pas de marge */
.yv-product-viewbar .productErrors {
  margin-bottom: 0 !important;
}

/* Desktop uniquement : bandeau encore -15% + bouton aligne */
@media screen and (min-width: 768px) {
  #yvProductStickyBar,
  .yv-product-viewbar {
    padding: 3px 0 !important;
  }

  /* Bouton : aligne verticalement avec le reste */
  #yvProductStickyBar .pdp-action-container,
  .yv-product-viewbar .pdp-action-container {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
  }
  #yvProductStickyBar .product-view-link,
  .yv-product-viewbar .product-view-link {
    display: flex !important;
    align-items: center !important;
  }
  #yvProductStickyBar .product_button,
  .yv-product-viewbar .product_button {
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
  }
  #yvProductStickyBar .button.xsmall-btn,
  .yv-product-viewbar .button.xsmall-btn,
  #yvProductStickyBar .Sd_addProductSticky,
  .yv-product-viewbar .Sd_addProductSticky {
    padding: 5px 16px !important;
    margin: 0 !important;
    vertical-align: middle !important;
  }
}


/* =============================================
   Quick View — Boutons variantes arrondis
   + phrase remise volume + bouton ATC arrondi
   Date: 2026-04-10
   ============================================= */

/* Boutons variantes (format, poids, etc.) dans le Quick View */
#quick-add-popup .variant_option .option,
#quick-add-popup .product-loop-variants .option,
.quick-add-popup .variant_option .option,
.quick-add-popup .product-loop-variants .option {
  border-radius: 25px !important;
}

/* Supprimer le cadre carre autour du bouton variant arrondi */
#quick-add-popup .variant_option,
.quick-add-popup .variant_option {
  border: none !important;
  outline: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
#quick-add-popup .variant_option .productOption,
.quick-add-popup .variant_option .productOption {
  /* Cacher l'input radio natif — le <span class="option"> est le visuel */
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}
#quick-add-popup .product-loop-variants,
.quick-add-popup .product-loop-variants {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
#quick-add-popup .product-variants-fieldset,
.quick-add-popup .product-variants-fieldset {
  border: none !important;
  padding: 0 !important;
}

/* Bouton "Ajouter au panier" du Quick View — arrondi aussi */
#quick-add-popup .Sd_addProduct,
#quick-add-popup .add_to_cart,
.quick-add-popup .Sd_addProduct,
.quick-add-popup .add_to_cart {
  border-radius: 25px !important;
}

/* Phrase remise volume sous le titre */
.nkosi-volume-discount-hint {
  font-size: 16px;
  color: #055B49;
  margin: 6px 0 8px;
  line-height: 1.4;
  font-style: italic;
  opacity: 0.85;
}

/* Tiers de remise Moon Bundle dans Quick View */
.nkosi-qa-discount-tiers {
  margin: 10px 0 6px;
  padding: 8px 12px;
  background: #f0f7f4;
  border-radius: 10px;
  font-size: 13px;
  color: #333;
  line-height: 1.6;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
}
.nkosi-qa-tiers-label {
  font-weight: 600;
  color: #055B49;
  margin-right: 2px;
}
.nkosi-qa-tier {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: #fff;
  border: 1px solid #dde8e3;
  border-radius: 20px;
  padding: 2px 10px;
  font-size: 12px;
  white-space: nowrap;
}
.nkosi-qa-tier strong {
  color: #055B49;
}


/* =============================================
   PERFORMANCE BOOST — Affichage instantané des éléments
   PERMANENT — ne pas modifier sans tester search + collection
   Problème : éléments s'affichent lentement (AOS fade-up, transitions
   longues 0.6-1s, lazy opacity, page-loader 500ms delay)
   Solution : override toutes les sources de lenteur
   Date: 2026-04-14
   ============================================= */

/* 1. PAGE LOADER — Suppression du délai d'affichage (SEO-safe)
      theme.min.css: .page-loading .yv-page-loader { opacity:1 }
      common.js: setTimeout(remove("page-loading"), 500)
      Override: forcer le loader transparent + non-bloquant.
      Note: on ne met pas display:none pour ne pas bloquer
      le rendering pipeline de Googlebot. */
.yv-page-loader {
  opacity: 0 !important;
  pointer-events: none !important;
  z-index: -1 !important;
}
body.page-loading .yv-page-loader {
  opacity: 0 !important;
  pointer-events: none !important;
}
/* Forcer le body visible même pendant "page-loading" */
body.page-loading {
  overflow: visible !important;
}
body.page-loading #MainContent,
body.page-loading .shopify-section {
  opacity: 1 !important;
  visibility: visible !important;
}

/* 2. AOS ANIMATIONS — Désactiver les délais, affichage instantané
      Les éléments [data-aos] commencent à opacity:0 et attendent
      d'entrer dans le viewport pour apparaître avec fade-up/fade-in.
      Override: tout visible immédiatement, sans animation */
[data-aos] {
  opacity: 1 !important;
  transform: none !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
}
[data-aos].aos-init {
  opacity: 1 !important;
  transform: none !important;
}
[data-aos].aos-animate {
  opacity: 1 !important;
  transform: none !important;
  transition-duration: 0s !important;
}
/* AOS fade variants */
[data-aos="fade-up"],
[data-aos="fade-down"],
[data-aos="fade-left"],
[data-aos="fade-right"],
[data-aos="fade"],
[data-aos="zoom-in"],
[data-aos="zoom-out"] {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
.fade-animate {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* 3. LAZY LOADING IMAGES — Transition ultra-rapide (SEO-safe)
      IMPORTANT: On garde opacity:0 sur .lazyload (pas encore chargée)
      pour éviter de montrer des espaces vides = mauvais CLS.
      On accélère juste la transition de lazyloading → lazyloaded
      de ~0.75s (thème) à 0.05s (quasi instantané).
      Le lazy loading natif reste actif = bon pour LCP et page weight. */
html:not(.no-js) .lazyloading {
  opacity: 0.5 !important;
  transition: opacity 0.05s ease !important;
}
.lazyloaded {
  opacity: 1 !important;
  transition: opacity 0.05s ease !important;
}
/* lazy-image wrapper — visible immédiatement, l'image fade ultra-rapide */
.lazy-image {
  opacity: 1 !important;
}

/* 4. PRODUCT CARDS — Transitions accélérées
      theme.min.css: .yv-product-card transitions 0.7s-1s
      Override: rendre les cartes produit visibles instantanément */
.yv-product-card {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  transition-duration: 0.1s !important;
}
/* Hover image transition rapide (pas 0.7s) */
.yv-product-card .yv-product-hover-img,
.yv-product-card .product-hover-slider {
  transition-duration: 0.15s !important;
}
/* Product hover slider */
.yv-product-card .main-slider-wrapper {
  transition-duration: 0.15s !important;
}

/* 5. COLLECTION/SEARCH LAYOUT — Transitions supprimées
      theme.min.css: .yv-products-list { transition: 0.6s ease all }
      Cause un décalage visible au chargement */
.yv-products-list {
  transition: none !important;
}
.yv-filter-sidebar {
  transition: none !important;
}
.yv-collection-products {
  transition: none !important;
}
.yv-tab-content {
  transition: none !important;
}

/* 6. HEADER — Supprimer transition lente du sticky */
.shopify-section-main-header {
  transition-duration: 0.15s !important;
}

/* 7. SEARCH RESULTS — Affichage instantané des résultats */
.main-search-section .yv-tab-pane,
.main-search-section .yv-search-result-page-list {
  opacity: 1 !important;
  visibility: visible !important;
  transition: none !important;
}
.yv-search-result-content {
  transition: none !important;
}

/* 8. COLLECTION FILTER SLIDE — Pas de fade lent */
.filter-slide {
  opacity: 1 !important;
  transition: none !important;
}
.filter-slide.active {
  opacity: 1 !important;
}

/* 9. BANNER ITEMS — Affichage immédiat (pas fadeIn 0.2s) */
.yv-banner-item {
  opacity: 1 !important;
}
.yv-banner-item.is-selected {
  opacity: 1 !important;
}

/* 10. PRESERVE — Garder les hover effects rapides (UX) */
.yv-product-card:hover .yv-product-hover-img,
.yv-product-card:hover .product-hover-slider .main-slider-wrapper {
  opacity: 1 !important;
  visibility: visible !important;
  transition-duration: 0.15s !important;
}


/* =============================================
   FIX GLOBAL: Tous les sliders produit Flickity → ligne horizontale
   Appliqué sur TOUT le site : page d'accueil, pages produit,
   pages collection, articles, etc.
   Sections ciblées :
     - collection-product-section (Catégories essentielles / Tabbed)
     - product-page-recommendations (Nos clients ont aussi aimé)
     - new-arrival-section (Featured collection / Nouvelles arrivées)
     - recent-product-section (Produits récents)
     - nkosi-bs-section (Meilleures Ventes custom)
   Règle : JAMAIS de position:absolute sur les cartes produit.
   TOUJOURS flex horizontal + scroll.
   Date: 2026-04-14
   ============================================= */

/* ---- A. CONTENEURS: flex horizontal scrollable ---- */
.collection-product-section .yv-collection-product-grid,
.collection-product-section .yv-tabbed-collection-filter-items,
.product-page-recommendations .yv-recent-product-grid,
.new-arrival-section .yv-collection-product-grid,
.recent-product-section .yv-recent-product-grid,
.yv-collection-product-grid[data-flickity-slider],
.yv-recent-product-grid[data-flickity-slider] {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  margin: 0 !important;
  padding-bottom: 4px;
  position: relative !important;
}
.collection-product-section .yv-collection-product-grid::-webkit-scrollbar,
.collection-product-section .yv-tabbed-collection-filter-items::-webkit-scrollbar,
.product-page-recommendations .yv-recent-product-grid::-webkit-scrollbar,
.new-arrival-section .yv-collection-product-grid::-webkit-scrollbar,
.recent-product-section .yv-recent-product-grid::-webkit-scrollbar,
.yv-collection-product-grid[data-flickity-slider]::-webkit-scrollbar,
.yv-recent-product-grid[data-flickity-slider]::-webkit-scrollbar {
  display: none;
}

/* ---- B. FLICKITY NEUTRALISÉ: viewport + slider transparents ---- */
.collection-product-section .flickity-viewport,
.product-page-recommendations .flickity-viewport,
.new-arrival-section .flickity-viewport,
.recent-product-section .flickity-viewport {
  height: auto !important;
  overflow: visible !important;
  position: static !important;
  display: contents !important;
}
.collection-product-section .flickity-slider,
.product-page-recommendations .flickity-slider,
.new-arrival-section .flickity-slider,
.recent-product-section .flickity-slider {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  transform: none !important;
  display: contents !important;
}

/* ---- C. CARTES PRODUIT: jamais absolute, toujours flex items ---- */
.collection-product-section .yv-product-card,
.product-page-recommendations .yv-product-card,
.new-arrival-section .yv-collection-product-grid .yv-product-card,
.recent-product-section .yv-product-card,
.yv-tabs-wrapper .yv-collection-product-grid .yv-product-card {
  position: static !important;
  transform: none !important;
  left: auto !important;
  flex: 0 0 calc((100% - 48px) / 5) !important;
  min-width: 180px !important;
  max-width: 280px !important;
  width: auto !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
}

/* ---- D. CARTES INACTIVES (filtrage onglets) ---- */
.yv-product-card.filter-slide:not(.active) {
  display: none !important;
}

/* ---- E. FLÈCHES FLICKITY CACHÉES ---- */
.collection-product-section .flickity-button,
.product-page-recommendations .flickity-button,
.new-arrival-section .flickity-button,
.recent-product-section .flickity-button {
  display: none !important;
}

/* ---- F. IMAGES: carrées, pleine largeur ---- */
.collection-product-section .animated-grid,
.product-page-recommendations .animated-grid,
.new-arrival-section .animated-grid,
.recent-product-section .animated-grid {
  width: 100% !important;
}
.collection-product-section .yv-product-card-img,
.product-page-recommendations .yv-product-card-img,
.new-arrival-section .yv-product-card-img,
.recent-product-section .yv-product-card-img {
  width: 100% !important;
}
.collection-product-section .yv-product-card-img .yv-product-img,
.product-page-recommendations .yv-product-card-img .yv-product-img,
.new-arrival-section .yv-product-card-img .yv-product-img,
.recent-product-section .yv-product-card-img .yv-product-img {
  display: block;
  width: 100%;
}
.collection-product-section .image-wrapper,
.product-page-recommendations .image-wrapper,
.new-arrival-section .yv-product-card-img .image-wrapper,
.recent-product-section .image-wrapper {
  padding-bottom: 100% !important;
  position: relative;
  overflow: hidden;
  border-radius: var(--layoutRadius, 8px);
  width: 100%;
}
.collection-product-section .yv-product-card-img .image-wrapper img,
.product-page-recommendations .image-wrapper img,
.new-arrival-section .yv-product-card-img .image-wrapper img,
.recent-product-section .image-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* ---- G. TITRES: max 2 lignes, jamais de débordement ---- */
.collection-product-section .yv-product-title,
.product-page-recommendations .yv-product-title,
.new-arrival-section .yv-product-title,
.recent-product-section .yv-product-title {
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  display: -webkit-box !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: break-word;
  font-size: 14px;
  line-height: 1.4;
}

/* ---- H. ZONE INFO + PRIX ---- */
.collection-product-section .yv-product-information,
.product-page-recommendations .yv-product-information,
.new-arrival-section .yv-product-information,
.recent-product-section .yv-product-information {
  padding: 8px 4px 4px;
}
.collection-product-section .yv-prizebox,
.product-page-recommendations .yv-prizebox,
.new-arrival-section .yv-prizebox,
.recent-product-section .yv-prizebox {
  margin-top: 4px;
}

/* ---- I. RESPONSIVE — tablette ---- */
@media (max-width: 1024px) {
  .collection-product-section .yv-product-card,
  .product-page-recommendations .yv-product-card,
  .new-arrival-section .yv-collection-product-grid .yv-product-card,
  .recent-product-section .yv-product-card,
  .yv-tabs-wrapper .yv-collection-product-grid .yv-product-card {
    flex: 0 0 calc((100% - 36px) / 4) !important;
    min-width: 160px !important;
  }
}

/* ---- J. RESPONSIVE — mobile ---- */
@media (max-width: 767px) {
  .collection-product-section .yv-product-card,
  .product-page-recommendations .yv-product-card,
  .new-arrival-section .yv-collection-product-grid .yv-product-card,
  .recent-product-section .yv-product-card,
  .yv-tabs-wrapper .yv-collection-product-grid .yv-product-card {
    flex: 0 0 calc((100% - 24px) / 2.3) !important;
    min-width: 150px !important;
  }
}


/* =============================================
   PADDING LATERAL GLOBAL — Cohérence responsive
   Réduit de 30% + sections pleine largeur
   Demande Antonio 2026-04-14
   ============================================= */

/* --- Desktop large (≥1200px) : réduit 30% supp. → ~1vw, max 20px --- */
@media screen and (min-width: 1200px) {
  .content-for-layout > .shopify-section {
    padding-left: clamp(10px, 1vw, 20px);
    padding-right: clamp(10px, 1vw, 20px);
  }

  /* Exceptions : tout ce qui est deja pleine largeur / edge-to-edge */
  .content-for-layout > .shopify-section:has(.banner-section),
  .content-for-layout > .shopify-section:has(.yv-banner-section),
  .content-for-layout > .shopify-section:has(.slideshow-section),
  .content-for-layout > .shopify-section:has(.image-banner-section),
  .content-for-layout > .shopify-section:has(.marquee-section),
  .content-for-layout > .shopify-section:has(.yv-marquee-section),
  .content-for-layout > .shopify-section:has(.collection-banner-section),
  .content-for-layout > .shopify-section:has(.yv-collection-banner),
  .content-for-layout > .shopify-section:has(.video-section),
  .content-for-layout > .shopify-section:has(.yv-video-section),
  .content-for-layout > .shopify-section:has(.fullwidth-container),
  .content-for-layout > .shopify-section:has(.edge-to-edge),
  .content-for-layout > .shopify-section:has(.fullwidth-banner),
  .content-for-layout > .shopify-section:has(.yv-split-image-banner-container),
  .content-for-layout > .shopify-section:has(.footer-section),
  .content-for-layout > .shopify-section:has(.header-section),
  .content-for-layout > .shopify-section:has([data-fullwidth="true"]) {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  product-info.container,
  product-info.main-product-slider-wrapper {
    padding-left: clamp(10px, 1vw, 20px) !important;
    padding-right: clamp(10px, 1vw, 20px) !important;
  }

  .yv-collection-container,
  .main-collection-section {
    padding-left: clamp(10px, 1vw, 20px) !important;
    padding-right: clamp(10px, 1vw, 20px) !important;
  }

  .breadcrumb .container,
  .breadcrumb-nav .container {
    padding-left: clamp(10px, 1vw, 20px) !important;
    padding-right: clamp(10px, 1vw, 20px) !important;
  }

  .product-recommendations-section,
  .recent-product-section,
  .featured-collection-section {
    padding-left: clamp(10px, 1vw, 20px);
    padding-right: clamp(10px, 1vw, 20px);
  }
}

/* --- Tablet (768-1199px) : réduit 30% supp. → 10px --- */
@media screen and (min-width: 768px) and (max-width: 1199px) {
  .content-for-layout > .shopify-section {
    padding-left: 10px;
    padding-right: 10px;
  }

  .content-for-layout > .shopify-section:has(.banner-section),
  .content-for-layout > .shopify-section:has(.yv-banner-section),
  .content-for-layout > .shopify-section:has(.slideshow-section),
  .content-for-layout > .shopify-section:has(.image-banner-section),
  .content-for-layout > .shopify-section:has(.marquee-section),
  .content-for-layout > .shopify-section:has(.yv-marquee-section),
  .content-for-layout > .shopify-section:has(.collection-banner-section),
  .content-for-layout > .shopify-section:has(.yv-collection-banner),
  .content-for-layout > .shopify-section:has(.video-section),
  .content-for-layout > .shopify-section:has(.yv-video-section),
  .content-for-layout > .shopify-section:has(.fullwidth-container),
  .content-for-layout > .shopify-section:has(.edge-to-edge),
  .content-for-layout > .shopify-section:has(.fullwidth-banner),
  .content-for-layout > .shopify-section:has(.yv-split-image-banner-container),
  .content-for-layout > .shopify-section:has(.footer-section),
  .content-for-layout > .shopify-section:has(.header-section),
  .content-for-layout > .shopify-section:has([data-fullwidth="true"]) {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  product-info.container,
  product-info.main-product-slider-wrapper {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .yv-collection-container,
  .main-collection-section {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .breadcrumb .container,
  .breadcrumb-nav .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* --- Mobile (<768px) : réduit 30% supp. → 8px --- */
@media screen and (max-width: 767px) {
  .content-for-layout > .shopify-section {
    padding-left: 8px;
    padding-right: 8px;
  }

  .content-for-layout > .shopify-section:has(.banner-section),
  .content-for-layout > .shopify-section:has(.yv-banner-section),
  .content-for-layout > .shopify-section:has(.slideshow-section),
  .content-for-layout > .shopify-section:has(.image-banner-section),
  .content-for-layout > .shopify-section:has(.marquee-section),
  .content-for-layout > .shopify-section:has(.yv-marquee-section),
  .content-for-layout > .shopify-section:has(.collection-banner-section),
  .content-for-layout > .shopify-section:has(.yv-collection-banner),
  .content-for-layout > .shopify-section:has(.video-section),
  .content-for-layout > .shopify-section:has(.yv-video-section),
  .content-for-layout > .shopify-section:has(.fullwidth-container),
  .content-for-layout > .shopify-section:has(.edge-to-edge),
  .content-for-layout > .shopify-section:has(.fullwidth-banner),
  .content-for-layout > .shopify-section:has(.yv-split-image-banner-container),
  .content-for-layout > .shopify-section:has(.footer-section),
  .content-for-layout > .shopify-section:has(.header-section),
  .content-for-layout > .shopify-section:has([data-fullwidth="true"]) {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  product-info.container,
  product-info.main-product-slider-wrapper {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .yv-collection-container,
  .main-collection-section {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .breadcrumb .container,
  .breadcrumb-nav .container {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}

/* Sections pleine largeur : containers internes sans restriction */
.content-for-layout > .shopify-section .container {
  max-width: 100% !important;
}
.content-for-layout > .shopify-section .container.sm-container,
.content-for-layout > .shopify-section .container.md-container {
  max-width: 100% !important;
}

/* Coherence : box-sizing + overflow pour eviter tout rognage */
.content-for-layout > .shopify-section {
  box-sizing: border-box;
  overflow-x: clip;
}

/* Les enfants directs doivent respecter la largeur du parent */
.content-for-layout > .shopify-section > * {
  max-width: 100%;
  box-sizing: border-box;
}

/* Eviter tout overflow horizontal global */
html, body {
  overflow-x: clip;
}

/* Override du theme qui supprime le padding sur product-section */
.product-section .container {
  padding-left: inherit !important;
  padding-right: inherit !important;
}

/* Coherence : les images/medias ne debordent jamais de leur section */
.content-for-layout > .shopify-section img,
.content-for-layout > .shopify-section video,
.content-for-layout > .shopify-section iframe {
  max-width: 100%;
  height: auto;
}

/* =============================================
   Section rich-text "NKOSI — Votre epicerie..."
   Force pleine largeur ecran
   Demande Antonio 2026-04-14
   ============================================= */
#shopify-section-a27257fc-6e61-48df-b26c-3d986594e009 {
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}
#shopify-section-a27257fc-6e61-48df-b26c-3d986594e009 .container,
#shopify-section-a27257fc-6e61-48df-b26c-3d986594e009 .container.sm-container,
#shopify-section-a27257fc-6e61-48df-b26c-3d986594e009 .container.md-container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: clamp(16px, 2vw, 40px) !important;
  padding-right: clamp(16px, 2vw, 40px) !important;
}
#shopify-section-a27257fc-6e61-48df-b26c-3d986594e009 .rich-text-section,
#shopify-section-a27257fc-6e61-48df-b26c-3d986594e009 .section-wrapper {
  width: 100% !important;
  max-width: 100% !important;
}

/* =============================================
   Featured Collections Carousel + Image-with-text
   Afficher l'image entiere sans rognage
   Demande Antonio 2026-04-14
   ============================================= */

/* Carousel collections : object-fit contain sur l'image uniquement
   (on ne touche PAS au container qui gere l'aspect ratio) */
.collection-list-section .yv-collection-list-image img {
  object-fit: contain !important;
  object-position: center !important;
}

/* Image-with-text : object-fit contain sur l'image uniquement */
.image-with-text-section img,
[class*="image-with-text"] img,
.image-with-text-section .yv-imgbox-container img,
.image-with-text-section .imgbox-container img {
  object-fit: contain !important;
  object-position: center !important;
}


/* =============================================
   Featured Collections Carousel — Aspect natif
   Idem fix image Hero : liberer hauteur fixe 600px
   Image affichee en entier selon son ratio
   Demande Antonio 2026-04-14
   ============================================= */

/* Retirer la hauteur fixe du container */
.yv-collection-list-image,
.yv-collection-wrapper.fullwidth .yv-collection-list-image,
.yv-collection-wrapper.wide_container .yv-collection-list-image {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

/* Image en flux normal (pas absolute) avec ratio natif */
.yv-collection-list-image .yv-collection-item img,
.yv-collection-item img,
.yv-collection-list-image img {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  top: auto !important;
}

/* Alignement coherent des cards dans le carousel */
.yv-collection-slider .yv-collection-item {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

/* =============================================
   SERVICES WIDGET — Police réduite 10% mobile
   Couvre : homepage, produit vedette, pages produit
   ============================================= */
@media screen and (max-width: 767px) {
  .yv-service-item .column-content h2,
  .yv-service-item .column-content h3,
  .yv-service-item .column-content .h5,
  .yv-service-item .column-content .text-large {
    font-size: 0.85em !important;
  }
  .yv-service-item .column-content p {
    font-size: 0.85em !important;
    line-height: 1.3 !important;
  }
}

/* =============================================
   PRODUIT VEDETTE — Image réduite 50% (desktop)
   Section : featured_product_VizcV9
   ============================================= */
@media screen and (min-width: 768px) {
  #shopify-section-template--25519365521742__featured_product_VizcV9 .col-md-6:first-child {
    flex: 0 0 30% !important;
    max-width: 30% !important;
  }
  #shopify-section-template--25519365521742__featured_product_VizcV9 .col-md-6:last-child {
    flex: 0 0 70% !important;
    max-width: 70% !important;
  }
}

/* =============================================
   FIX Vibration boutons achat mobile (2026-04-15)
   Problème : sticky bar + boutons ATC/Buy Now
   vibrent verticalement au scroll mobile (iOS URL bar
   collapse + repaint non-GPU)
   Solution : GPU acceleration + safe-area-inset +
   neutralisation transitions top/bottom
   ============================================= */

/* Tous devices : GPU acceleration sur sticky bar + boutons achat */
#yvProductStickyBar,
.yv-product-viewbar,
.sticky-add-to-cart,
sticky-add-to-cart,
.product-form__buttons,
.product-form__submit,
.shopify-payment-button,
.shopify-payment-button__button {
  transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
}

/* Mobile uniquement : stabilisation complète du sticky bar bas */
@media screen and (max-width: 749px) {
  #yvProductStickyBar,
  .yv-product-viewbar {
    /* Empêche tout recalcul de hauteur lié à la barre URL iOS/Android */
    transition: none !important;
    -webkit-transition: none !important;
    animation: none !important;
    /* Respect du safe-area iOS (notch / home indicator) */
    padding-bottom: env(safe-area-inset-bottom, 0) !important;
    /* Isolation layout pour éviter reflow parent */
    contain: layout style paint;
    /* GPU layer forcé */
    transform: translate3d(0, 0, 0) !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    perspective: 1000px;
    -webkit-perspective: 1000px;
  }

  /* Enfants du sticky bar : pas de transition sur opacity/transform */
  #yvProductStickyBar *,
  .yv-product-viewbar * {
    transition-property: background-color, color, border-color !important;
  }

  /* Boutons ATC principaux de la fiche produit (non sticky) */
  .product-form__buttons,
  .product-form__submit,
  .shopify-payment-button,
  .shopify-payment-button__button,
  .product-form .btn,
  .product-single__form button[type="submit"] {
    transform: translate3d(0, 0, 0) !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }

  /* Neutraliser toute transition top/bottom sur éléments sticky */
  .sticky-item,
  .product-form-sticky,
  .sticky-atc-position-bottom,
  .sticky-atc-position-top {
    transition-property: background-color, opacity, visibility !important;
  }
}



/* =============================================
   FIX v2 : Vibration boutons achat mobile - CSS complement (2026-04-15)
   Containment + isolation layout pour éviter reflow cascade
   ============================================= */
@media screen and (max-width: 749px) {
  /* Isolation complete de la section produit : pas de reflow cascade */
  .main-product-section,
  .main-product-form,
  .product-form,
  .product-single__form,
  .product-form__buttons {
    contain: layout style !important;
    overflow-anchor: none !important;
  }

  /* Figer thumbnails (element hidden mais JS le manipule au scroll) */
  .yv-product-gallery-thumbs-container {
    position: static !important;
    top: auto !important;
    transform: none !important;
    display: none !important;
    visibility: hidden !important;
  }

  /* Boutons ATC + Buy Now : stacking context isolé */
  .product-form__buttons,
  .product-form__submit,
  .shopify-payment-button,
  .shopify-payment-button__button,
  .product-form .btn,
  .product-single__form button[type="submit"],
  form[action*="/cart/add"] button[type="submit"],
  form[action*="/cart/add"] .shopify-payment-button {
    isolation: isolate !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-transform: translate3d(0, 0, 0) !important;
    will-change: auto !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
    contain: layout paint !important;
  }

  /* Empêcher le body d'avoir scroll anchoring qui deplace les elements */
  html, body {
    overflow-anchor: none !important;
  }

  /* Neutraliser toute transition sur les propriétés layout-affectantes */
  .main-product-form *,
  .product-form *,
  .product-single__form * {
    transition-property: background-color, color, border-color, opacity, box-shadow !important;
  }
}


/* =============================================
   FIX Bandeau sticky ATC — Titre tronqué + bouton visible
   Déplace le contenu vers la gauche (titre max-width + ellipsis)
   Date: 2026-04-16
   ============================================= */

/* Titre : max-width + ellipsis pour laisser de la place au bouton */
#yvProductStickyBar .product-view-detail,
.yv-product-viewbar .product-view-detail {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
  max-width: 55% !important;
}
#yvProductStickyBar .product-view-name,
.yv-product-viewbar .product-view-name {
  min-width: 0 !important;
  overflow: hidden !important;
  padding-right: 6px !important;
}
#yvProductStickyBar .product-view-name h5,
#yvProductStickyBar .product-view-name h6,
.yv-product-viewbar .product-view-name h5,
.yv-product-viewbar .product-view-name h6 {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}

/* Bouton ATC : toujours visible, jamais coupé */
#yvProductStickyBar .product-view-link,
.yv-product-viewbar .product-view-link {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
#yvProductStickyBar .product_button,
.yv-product-viewbar .product_button {
  flex-shrink: 0 !important;
}
#yvProductStickyBar .pdp-action-container,
.yv-product-viewbar .pdp-action-container {
  flex-shrink: 0 !important;
}