/* Paniez – Product Page Design v0.3.4 */

/* ---- Image principale : radius visible + pas de zoom ---- */
body.single-product .woocommerce-product-gallery,
body.single-product .woocommerce-product-gallery__wrapper,
body.single-product .ct-media-container,
body.single-product .woocommerce-product-gallery__wrapper figure,
body.single-product .ct-media-container figure {
  border-radius: 18px !important;
  overflow: hidden !important;
  margin: 0 !important;
}

body.single-product .woocommerce-product-gallery__wrapper img,
body.single-product .ct-media-container img,
body.single-product .ct-media-container picture,
body.single-product .ct-media-container picture img {
  border-radius: 18px !important;
  transform: none !important;
  transition: none !important;
}

/* ---- Image principale HARMONISÉE : même format 4:3 sur TOUTES les fiches ----
   Scope strict au slider Blocksy (.flexy-items) : on ne touche NI les miniatures
   (.flexy-pills) NI les produits similaires (.related), qui partagent la classe
   .ct-media-container. Résultat : toutes les images principales ont exactement
   les mêmes dimensions, quel que soit le format de la photo source. */
/* Le format 4:3 est imposé nativement via le filtre Blocksy (functions.php du thème).
   Ici on ajoute juste un recadrage propre + un plafond de sécurité sur grand écran. */
@media (min-width: 769px) {
  body.single-product .flexy-items .ct-media-container,
  body.single-product .ct-product-gallery-container > .ct-media-container {
    max-height: 480px !important;
  }
  body.single-product .flexy-items .ct-media-container img,
  body.single-product .flexy-items .ct-media-container picture img,
  body.single-product .ct-product-gallery-container > .ct-media-container img,
  body.single-product .ct-product-gallery-container > .ct-media-container picture img {
    object-fit: cover !important;
  }
}

/* ---- Section compléments ---- */
.paniez-complements {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid rgba(48, 24, 13, 0.08);
}

.paniez-complements__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.paniez-complements__title {
  margin: 0 !important;
  font-family: var(--display, 'Fraunces', Georgia, serif) !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  color: var(--brown, #2A1810) !important;
  letter-spacing: 0.3px !important;
}

.paniez-complements__hint {
  font-size: 13px;
  color: var(--brown-soft, #5A3A2A);
  opacity: 0.75;
}

/* ---- Carousel wrapper ---- */
.paniez-carousel {
  position: relative;
  margin: 0 -8px;
}

.paniez-carousel__nav {
  position: absolute;
  top: 38%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(48, 24, 13, 0.12);
  background: white;
  box-shadow: 0 4px 12px rgba(48, 24, 13, 0.10);
  cursor: pointer;
  z-index: 2;
  font-size: 20px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--brown, #2A1810);
  transition: background 0.2s, color 0.2s;
}

.paniez-carousel__nav:hover {
  background: var(--brown, #2A1810);
  color: white;
}

.paniez-carousel__prev { left: -10px; }
.paniez-carousel__next { right: -10px; }

/* ---- Rail (carrousel horizontal) ---- */
.paniez-rail {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 200px;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding: 4px 8px 12px;
}

.paniez-rail::-webkit-scrollbar { display: none; }

/* ---- Carte verticale (style boutique) ---- */
.paniez-rail__item {
  scroll-snap-align: start;
  background: white;
  border: 1px solid var(--gray-line, rgba(48, 24, 13, 0.08));
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.paniez-rail__item:hover {
  transform: translateY(-5px);
  box-shadow: 0 14px 36px rgba(48, 24, 13, 0.10);
}

/* Image carrée pleine largeur */
.paniez-rail__media {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--cream-warm, #F5F5E1);
  flex-shrink: 0;
}

.paniez-rail__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  margin: 0 !important;
  transition: transform 0.4s ease !important;
}

.paniez-rail__item:hover .paniez-rail__media img {
  transform: scale(1.04) !important;
}

/* Bloc texte */
.paniez-rail__meta {
  padding: 12px 14px 8px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.paniez-rail__name {
  font-family: var(--display, 'Fraunces', Georgia, serif);
  font-size: 15px;
  font-weight: 400;
  color: var(--brown, #2A1810);
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.4em;
}

.paniez-rail__price {
  font-family: var(--display, 'Fraunces', Georgia, serif);
  font-size: 17px;
  color: var(--brown, #2A1810);
}

.paniez-rail__price .woocommerce-Price-amount { color: inherit; }

/* Prix + bouton sur la même ligne */
.paniez-rail__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 6px;
}

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .paniez-rail { grid-auto-columns: 170px; }
}

@media (max-width: 768px) {
  .paniez-carousel__nav { display: none; }
  .paniez-rail { grid-auto-columns: 150px; gap: 10px; }
}
