/*
  product-overview.css — mise en page du haut de fiche produit : galerie + bloc d'achat.
  Gabarit du template single-product (transposable en template WooCommerce).
*/
.product-overview {
  display: grid;
  /* minmax(0, 1fr) : sans ça, le min-width:auto de la colonne laisse l'image
     galerie (width=800) déborder le viewport en mobile. */
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
  padding-block: var(--space-5) var(--space-7);
}

.product-overview__category {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-brown-dark);
  margin-bottom: var(--space-2);
}

.product-overview__category a {
  text-decoration: none;
}

.product-overview__category a:hover {
  text-decoration: underline;
}

.product-overview__info h1 {
  margin-bottom: var(--space-3);
}

.product-overview__rating-link {
  display: inline-block;
  text-decoration: none;
  margin-bottom: var(--space-5);
}

.product-overview__buy {
  margin-top: var(--space-5);
  margin-bottom: var(--space-5);
}

.product-overview__reassurance {
  border-top: 1px solid var(--color-line);
  padding-top: var(--space-2);
}

/* Note « échantillon sur demande » sous le bouton d'échantillon. */
.metrage-selector__sample-note {
  margin: var(--space-2) 0 0;
  font-size: var(--text-sm);
  color: var(--color-ink-soft, #6b6b6b);
  text-align: center;
}

/* Partage réseaux sociaux (fiche produit). */
.product-share {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-line);
}

.product-share__label {
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--color-ink);
}

.product-share__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  transition: filter 0.15s ease, transform 0.15s ease;
}

.product-share__btn svg {
  width: 18px;
  height: 18px;
}

.product-share__btn--facebook {
  background: var(--color-cream-deep);
  color: var(--color-ink);
  border: 1px solid var(--color-line-strong);
}

.product-share__btn--facebook:hover {
  border-color: var(--color-terracotta);
  color: var(--color-terracotta-dark);
  transform: translateY(-1px);
}