/* ============================================
   Claude Fixer CSS - Visual & Layout Fixes
   ============================================ */

/* ---- FIX 1: Hide cookie consent banner overlay ---- */
.cmplz-cookiebanner.cmplz-show,
#cmplz-cookiebanner-container,
.cmplz-cookiebanner {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ---- FIX 2: Hide duplicate ElClono cart (theme has built-in WooCommerce cart) ---- */
.elclono-cart-icon-wrap,
.elclono-drawer-overlay,
.elclono-cart-drawer {
  display: none !important;
}

/* ---- FIX 3: Force Elementor lazy-loaded backgrounds to show ---- */
/* The inline CSS removes background-image for non-lazyloaded sections.
   Override to ensure all section backgrounds render in the static clone. */
.e-con.e-parent:not(.e-lazyloaded),
.e-con.e-parent:not(.e-lazyloaded) * {
  background-image: revert !important;
}

/* ---- FIX 4: Fix Flickity testimonial viewport height (0px issue) ---- */
.flickity-viewport {
  height: auto !important;
  min-height: 100px;
}
.flickity-slider {
  position: relative !important;
}
.flickity-slider > .haru-testimonial__list {
  position: relative !important;
  display: flex !important;
  flex-wrap: wrap !important;
}
.haru-testimonial__item-wrap {
  width: 25%;
  padding: 10px;
  box-sizing: border-box;
}
@media (max-width: 991px) {
  .haru-testimonial__item-wrap { width: 50%; }
}
@media (max-width: 767px) {
  .haru-testimonial__item-wrap { width: 100%; }
}

/* ---- FIX 5: Override qa-responsive-fix height:auto on slider images ---- */
/* The qa-responsive-fix.css sets all images to height:auto which breaks
   slider item dimensions. Restore proper sizing for specific contexts. */
.slick-slide img {
  height: auto !important;
  max-height: 300px;
  object-fit: contain;
}
.haru-banner-list__image img {
  width: 100% !important;
  height: auto !important;
  max-height: 250px;
  object-fit: contain;
}
.product-thumbnail img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain;
}

/* ---- FIX 6: Ensure hero banner background image is visible ---- */
.elementor-element-2622d48 {
  background-image: url("../images/PRINTEMPS.webp") !important;
  background-repeat: no-repeat !important;
  background-size: 100% auto !important;
  min-height: 400px;
}

/* ---- FIX 7: Fix cart side panel z-index and positioning ---- */
.cart-side-widget {
  z-index: 9999;
}
.cart-mask-overlay {
  z-index: 9998;
}

/* ---- FIX 8: Ensure header stays on top ---- */
#haru-header {
  position: relative !important;
  z-index: 100 !important;
}
.haru-header--sticky-on {
  position: relative !important;
}

/* ---- FIX 9: Fix slick slider track display ---- */
.slick-track {
  display: flex !important;
  align-items: stretch;
}
.slick-slide {
  height: auto !important;
  float: none !important;
}
.slick-slide > div {
  height: 100%;
}

/* ---- FIX 10: Fix product card layout in ajax order section ---- */
.haru-woo-ajax-order .product-item {
  width: 100%;
}
.haru-woo-ajax-order .product-wrap {
  overflow: hidden;
}
.haru-woo-ajax-order .product-info {
  padding: 10px 15px;
}

/* ---- FIX 11: App download section background ---- */
.section-bg-secondary {
  background-color: #388E3C;
}
.elementor-element-09382d3 {
  border-radius: 16px;
  overflow: hidden;
}
.elementor-element-09382d3 .background-dark h2,
.elementor-element-09382d3 .background-dark {
  color: #fff;
}

/* ---- FIX 12: Fix icon box info bar layout ---- */
.haru-icon-box--style-8 {
  display: flex;
  align-items: flex-start;
  gap: 15px;
}
.haru-icon-box__icon {
  flex-shrink: 0;
}

/* ---- FIX 13: Manage consent floating button visibility ---- */
#cmplz-manage-consent {
  display: none !important;
}

/* ---- FIX 14: Fix AJAX loading overlay ---- */
.haru-ajax-overflow {
  display: none !important;
}

/* ---- FIX 15: Ensure product label badges display correctly ---- */
.product-label {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 5;
}
.product-label__item {
  display: inline-block;
  padding: 2px 8px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 3px;
}
.product-label__item--onsale {
  background-color: #e74c3c;
  color: #fff;
}