/*
 * Moteur V4 — blocs-v4.css
 *
 * Styles de blocs du socle qui doivent AUSSI servir aux thèmes sans socle (`v4_foundation: false`,
 * ex. modern-luxe-v4) : ceux-ci l'ajoutent à leur `v4_stylesheets`. Chaque règle n'agit que si le
 * bloc la demande (présentation « vitrine », rubriques avec titre, moins de 4 rubriques) — une
 * vitrine existante qui n'emploie rien de cela ne change pas.
 */
/* ─── product_pick, présentation « vitrine » ─────────────────────────────────
   Image pleine, dégradé en bas, nom et prix posés dessus — ni bouton ni favori.
   Pour les emplacements étroits (demi-colonne) où la carte complète s'écrasait.
   Grille fluide : 2 colonnes dans une demi-colonne ou sur mobile, plus en pleine largeur. */
.sws-v4-vitrine {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(170px, 100%), 1fr));
  gap: var(--grid-gap, 16px);
}
.sws-v4-vitrine__item {
  position: relative;
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--radius-md, var(--btn-radius, 6px));
  background: var(--color-surface, #f1ede6);
  color: #fff;
  text-decoration: none;
  isolation: isolate;
}
.sws-v4-vitrine__item:hover,
.sws-v4-vitrine__item:focus-visible { color: #fff; text-decoration: none; }
.sws-v4-vitrine__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease;
}
.sws-v4-vitrine__img--vide { background: var(--color-surface, #f1ede6); }
.sws-v4-vitrine__item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(12, 10, 8, .78) 0%, rgba(12, 10, 8, .38) 34%, rgba(12, 10, 8, 0) 62%);
  pointer-events: none;
}
.sws-v4-vitrine__info {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px 16px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
.sws-v4-vitrine__titre {
  font-family: var(--font-family-heading, inherit);
  font-weight: var(--font-weight-heading, 600);
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sws-v4-vitrine__prix {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
  opacity: .95;
}
.sws-v4-vitrine__prix .originprice { display: none; }
.sws-v4-vitrine__prix .linethrough { margin-left: 6px; font-weight: 400; opacity: .7; text-decoration: line-through; }
.sws-v4-vitrine__item:hover .sws-v4-vitrine__img,
.sws-v4-vitrine__item:focus-visible .sws-v4-vitrine__img { transform: scale(1.04); }
.sws-v4-vitrine__item:focus-visible { outline: 2px solid var(--color-accent, #fff); outline-offset: 3px; }
@media (max-width: 767px) {
  .sws-v4-vitrine { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .sws-v4-vitrine__info { padding: 10px 12px 12px; gap: 2px; }
  .sws-v4-vitrine__titre { font-size: 14px; }
  .sws-v4-vitrine__prix { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { .sws-v4-vitrine__img { transition: none; } }


/* ─── category_grid, présentation « tuiles » ─────────────────────────────────
   Avec un titre : la bande respire (le titre n'est plus collé au bloc précédent).
   Moins de 4 rubriques : tuiles de largeur bornée, CENTRÉES (plus de trou à droite). */
.sws-v4-category-grid--titre.mnx-dept-band,
.sws-v4-category-grid--centre.mnx-dept-band {
  padding-top: calc(var(--section-spacing, 80px) / 2);
  padding-bottom: calc(var(--section-spacing, 80px) / 2);
}
.sws-v4-category-grid--titre .mnx-section__title { margin-bottom: 18px !important; }
.sws-v4-category-grid .sws-v4-category-grid__tiles:not(:has(> :nth-child(4))) {
  grid-template-columns: repeat(auto-fit, minmax(200px, 320px));
  justify-content: center;
}
@media (max-width: 560px) {
  .sws-v4-category-grid .sws-v4-category-grid__tiles:not(:has(> :nth-child(4))) { grid-template-columns: 1fr; }
}


/* ─── feature_grid, présentation « cartes encadrées » ────────────────────────
   Sur mobile, deux cartes par rangée : quatre cartes empilées pleine largeur
   faisaient 1 500 px de haut (recette du parcours, 2026-10-09). La grille est
   posée en ligne par le bloc, d'où `!important`. Ne vise que cette forme. */
/* La carte garde SA surface et son filet. Un thème peut effacer le fond de
   tout élément de grille (`.mc-theme .sws-v4-feature-grid__item{background:
   transparent!important}`, maison-couture) : dans un bandeau sombre, le texte
   de la carte (couleur du thème) se retrouvait sur le noir — 1,16:1 mesuré
   (recette 2026-10-10). Spécificité 0-3-0 pour passer devant le thème. */
.sws-v4-block .sws-v4-feature-grid__item.sws-v4-feature-grid__item--cartes_encadrees {
  background: var(--color-surface, #fff) !important;
  border: 1px solid var(--color-border, rgba(0,0,0,.08)) !important;
  border-radius: var(--border-radius, 8px) !important;
}
@media (max-width: 560px) {
  .sws-v4-feature-grid__items:has(> .sws-v4-feature-grid__item--cartes_encadrees) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .75em !important;
  }
  .sws-v4-feature-grid__item--cartes_encadrees { padding: .75em .75em 1em !important; }
  .sws-v4-feature-grid__item--cartes_encadrees > img { margin-bottom: .75em !important; }
  .sws-v4-feature-grid__item--cartes_encadrees h3 { font-size: .95rem !important; }
  .sws-v4-feature-grid__item--cartes_encadrees p { font-size: .85rem; line-height: 1.45 !important; }
}
