/**
 * SYRO CBD — Layout vertical, centré, cadré (mobile → desktop)
 * Chargé en dernier pour harmoniser boutique, accueil, pages et WooCommerce.
 */

:root {
  --syro-frame-max: 1120px;
  --syro-frame-wide: 1280px;
  --syro-frame-pad: clamp(12px, 3.2vw, 28px);
  --syro-card-gap: clamp(12px, 2vw, 20px);
}

/* Pas de débordement horizontal parasite */
html {
  overflow-x: hidden;
  scroll-behavior: smooth;
}

body {
  overflow-x: clip;
  max-width: 100vw;
}

/* ------------------------------------------------------------------
   Cadre global : contenu centré, colonne unique
   ------------------------------------------------------------------ */
body .site-content > .ast-container,
body .site-content .ast-container {
  width: 100% !important;
  max-width: var(--syro-frame-wide) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--syro-frame-pad) !important;
  padding-right: var(--syro-frame-pad) !important;
  box-sizing: border-box !important;
  overflow-x: visible !important;
}

body .site-content .ast-row {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body #primary,
body #secondary,
body .content-area,
body .site-main {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Gutenberg : colonnes empilées */
.wp-block-columns:not(.is-not-stacked-on-mobile) {
  flex-direction: column !important;
}

.wp-block-column {
  width: 100% !important;
  max-width: 100% !important;
  flex-basis: auto !important;
}

/* Médias fluides */
.site-content img,
.site-content video,
.site-content iframe,
.site-content .wp-block-image img {
  max-width: 100% !important;
  height: auto !important;
}

/* ------------------------------------------------------------------
   En-tête : centré, navigation empilée sur mobile / tablette
   ------------------------------------------------------------------ */
.ast-primary-header-bar .ast-container,
.site-header .ast-container {
  max-width: var(--syro-frame-wide) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 1024px) {
  .ast-primary-header-bar .site-primary-header-wrap,
  .ast-primary-header-bar .ast-builder-grid-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 8px !important;
  }

  .ast-primary-header-bar .site-branding,
  .ast-primary-header-bar .ast-site-identity {
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
}

/* ------------------------------------------------------------------
   Boutique : bloc centré, filtres en colonne, grille lisible
   ------------------------------------------------------------------ */
.syro-shop-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.syro-shop-inner.ast-container,
.syro-shop-wrapper .syro-shop-inner {
  max-width: var(--syro-frame-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--syro-frame-pad) !important;
  padding-right: var(--syro-frame-pad) !important;
  box-sizing: border-box !important;
}

.syro-shop-main,
.syro-shop-filters-bar {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Filtres : toujours empilés verticalement (Produits puis Origine) */
.syro-shop-filters-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
}

.syro-shop-filters-bar .syro-shop-filter {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 auto !important;
}

.syro-shop-toolbar {
  justify-content: center !important;
  text-align: center !important;
}

.woocommerce-products-header,
.woocommerce-products-header__title,
.syro-seo-catalog-intro {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
}

/* Grille catalogue : 1 → 2 → 3 colonnes max, cartes verticales centrées */
.syro-shop-wrapper .woocommerce ul.products,
body.syro-wc-catalog-context:not(.single-product) .woocommerce ul.products:not(.related):not(.upsells):not(.cross-sells),
body.woocommerce:not(.single-product) .syro-shop-wrapper ul.products,
body.woocommerce-page:not(.single-product) .syro-shop-wrapper ul.products {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-content: center !important;
  justify-items: stretch !important;
  align-items: stretch !important;
  gap: var(--syro-card-gap) !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  float: none !important;
  list-style: none !important;
  box-sizing: border-box !important;
}

@media (min-width: 640px) {
  .syro-shop-wrapper .woocommerce ul.products,
  body.syro-wc-catalog-context:not(.single-product) .woocommerce ul.products:not(.related):not(.upsells):not(.cross-sells) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1024px) {
  .syro-shop-wrapper .woocommerce ul.products,
  body.syro-wc-catalog-context:not(.single-product) .woocommerce ul.products:not(.related):not(.upsells):not(.cross-sells) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Carte produit : colonne, contenu centré */
.syro-shop-wrapper .woocommerce ul.products li.product,
body.syro-wc-catalog-context:not(.single-product) .woocommerce ul.products:not(.related):not(.upsells) > li.product,
body.woocommerce:not(.single-product) ul.products:not(.related):not(.upsells) > li.product {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  float: none !important;
  box-sizing: border-box !important;
}

.syro-shop-wrapper .woocommerce ul.products li.product .woocommerce-loop-product__title,
.syro-shop-wrapper .woocommerce ul.products li.product .price,
.syro-shop-wrapper .woocommerce ul.products li.product .star-rating {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.syro-shop-wrapper .woocommerce ul.products li.product img {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ------------------------------------------------------------------
   Accueil / carrousels produits : même logique grille
   ------------------------------------------------------------------ */
.syro-fp-container,
.syro-fp-products,
.syro-best-sellers,
.syro-new-products {
  max-width: var(--syro-frame-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--syro-frame-pad) !important;
  padding-right: var(--syro-frame-pad) !important;
  box-sizing: border-box !important;
}

.syro-fp-products ul.products,
.syro-best-sellers ul.products,
.syro-new-products ul.products,
body.home .woocommerce ul.products:not(.related):not(.upsells) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: var(--syro-card-gap) !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  justify-items: stretch !important;
  list-style: none !important;
}

@media (min-width: 640px) {
  .syro-fp-products ul.products,
  .syro-best-sellers ul.products,
  .syro-new-products ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1024px) {
  .syro-fp-products ul.products,
  .syro-best-sellers ul.products,
  .syro-new-products ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

.syro-fp-products ul.products li.product,
.syro-best-sellers ul.products li.product,
.syro-new-products ul.products li.product {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* ------------------------------------------------------------------
   Fiche produit : colonne centrée
   ------------------------------------------------------------------ */
body.single-product .site-content .ast-container {
  max-width: var(--syro-frame-wide) !important;
}

body.single-product .product,
body.single-product .woocommerce-product-gallery,
body.single-product .summary.entry-summary {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

@media (max-width: 921px) {
  body.single-product .product {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.single-product .woocommerce-product-gallery,
  body.single-product .summary.entry-summary {
    float: none !important;
    width: 100% !important;
  }
}

/* Panier / checkout : blocs empilés */
body.woocommerce-cart .woocommerce,
body.woocommerce-checkout .woocommerce {
  max-width: var(--syro-frame-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.woocommerce-cart form.woocommerce-cart-form,
body.woocommerce-checkout form.checkout {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

/* Pages statiques : contenu centré */
body.page:not(.woocommerce) .entry-content,
body.page:not(.woocommerce) .ast-article-single {
  max-width: var(--syro-frame-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Mobile : annuler flex 50% hors catalogue (style.css legacy) */
@media (max-width: 921px) {
  body:not(.syro-wc-catalog-context) .woocommerce ul.products,
  body:not(.syro-wc-catalog-context) .woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    flex-wrap: unset !important;
    justify-content: center !important;
    gap: var(--syro-card-gap) !important;
  }

  body:not(.syro-wc-catalog-context) .woocommerce ul.products li.product,
  body:not(.syro-wc-catalog-context) .woocommerce-page ul.products li.product {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Verrou final Woo smallscreen (48% float) */
@media (max-width: 782px) {
  body.woocommerce:not(.single-product) ul.products[class*="columns-"]:not(.related):not(.upsells),
  body.woocommerce-page:not(.single-product) ul.products[class*="columns-"]:not(.related):not(.upsells) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    float: none !important;
  }

  body.woocommerce:not(.single-product) ul.products li.product,
  body.woocommerce-page:not(.single-product) ul.products li.product {
    width: 100% !important;
    float: none !important;
  }
}