/* LA SÉLECTIONNIST 2.0.32 — Desktop editorial balance
 * Catalogue: shorter, consistent frames WITHOUT cropping product photos.
 * Footer: controlled panther height and copy visibly over image.
 * No product data, category SEO, image uploads or mobile gallery changed.
 */

@media (min-width: 1101px) {
  /* On 4-column lists, a portrait at 3:4.25 takes nearly a whole screen.
     Maintain a single consistent frame but display product names/prices sooner. */
  body.post-type-archive-product .ls-collection-products ul.products li.product .ls-catalogue-image-frame,
  body.tax-product_cat .ls-collection-products ul.products li.product .ls-catalogue-image-frame,
  body.tax-product_tag .ls-collection-products ul.products li.product .ls-catalogue-image-frame {
    display: block;
    width: 100%;
    height: clamp(405px, 27vw, 535px) !important;
    aspect-ratio: auto !important;
    margin-bottom: 14px;
    overflow: hidden;
  }
  /* The catalog framing layer already uses contain; restate it so that
     the hems, shoes and head are never cropped after the shorter frame. */
  body.post-type-archive-product .ls-catalogue-image-frame > img.ls-catalogue-framed-img,
  body.tax-product_cat .ls-catalogue-image-frame > img.ls-catalogue-framed-img,
  body.tax-product_tag .ls-catalogue-image-frame > img.ls-catalogue-framed-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
}

/* Desktop footer: the wide 3:1 image was growing to its full intrinsic
   height after a later generic image declaration. Give it a fixed stage. */
@media (min-width: 901px) {
  .ls-footer-v2 .ls-footer-v2-beast {
    position: relative;
    height: clamp(315px, 21vw, 410px) !important;
    min-height: 0 !important;
    overflow: hidden;
    background: radial-gradient(ellipse at 75% 50%, #170003, #020101 78%);
  }
  .ls-footer-v2 .ls-footer-v2-beast > img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: right center !important;
  }
  .ls-footer-v2 .ls-footer-v2-beast::after {
    z-index: 1;
    background: linear-gradient(90deg, rgba(0,0,0,.7), rgba(0,0,0,.26) 43%, transparent 72%);
    pointer-events: none;
  }
  .ls-footer-v2 .ls-footer-v2-beast > p {
    position: absolute;
    z-index: 2;
    left: clamp(30px,5vw,100px);
    right: 45%;
    bottom: clamp(29px,3vw,50px);
    margin: 0;
    font-size: clamp(24px,2.15vw,38px);
    line-height: 1.12;
    overflow-wrap: normal;
  }
}

/* Tablet/mobile: keep the cinematic close-up, but don't let image aspect
   ratio override the banner height or push text out of the visible section. */
@media (max-width: 900px) {
  .ls-footer-v2 .ls-footer-v2-beast {
    position: relative;
    height: 315px !important;
    min-height: 0 !important;
    overflow: hidden;
  }
  .ls-footer-v2 .ls-footer-v2-beast > img {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    object-fit: cover !important;
    object-position: 69% center !important;
  }
  .ls-footer-v2 .ls-footer-v2-beast > p {
    position: absolute;
    z-index: 2;
    bottom: 28px;
    left: 25px;
    right: 20px;
    font-size: clamp(22px, 5vw, 29px);
  }
}
@media (max-width: 560px) {
  .ls-footer-v2 .ls-footer-v2-beast { height: 265px !important; }
}

/* v2.0.33 — The product-gallery background must NEVER revert to the old
   ivory placeholder (#f4f1ed).  Saskia's portrait has a 2:3 ratio, so
   object-fit: contain legitimately leaves empty lateral space.  Keep that
   space cinematic and dark, rather than cropping the original photograph.
   This runs after every WooCommerce and Room 22 gallery stylesheet. */
body.single-product .ls-room22-gallery,
body.single-product .ls-room22-gallery .woocommerce-product-gallery,
body.single-product .ls-room22-gallery .flex-viewport,
body.single-product .ls-room22-gallery .woocommerce-product-gallery__wrapper,
body.single-product .ls-room22-gallery .woocommerce-product-gallery__image {
  background-color: #10090b !important;
}
body.single-product .ls-room22-gallery .woocommerce-product-gallery__image {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
body.single-product .ls-room22-gallery .woocommerce-product-gallery__image::before {
  background-color: #10090b;
  background-image: var(--ls-gallery-backdrop, none);
  background-size: cover;
  background-position: center;
  filter: blur(29px) brightness(.28) saturate(.68);
}
body.single-product .ls-room22-gallery .woocommerce-product-gallery__image > a,
body.single-product .ls-room22-gallery .woocommerce-product-gallery__image img,
body.single-product .ls-room22-gallery .woocommerce-product-gallery__image img.zoomImg {
  background-color: transparent !important;
}
/* Keep the desktop full-frame layout; preserve the existing mobile sizing. */
@media (min-width: 901px) {
  body.single-product .ls-room22-gallery .woocommerce-product-gallery__image > a > img:not(.zoomImg) {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
}

/* v2.0.34 — Related pieces / « NE PAS DÉRANGER. »
   Previously 4 cards spread across the entire viewport (over 2000px wide).
   Restrict the editor's selection to a centered, compact fashion-gallery width.
   Desktop only: do not alter the main catalogue, product hero or mobile layout. */
@media (min-width: 901px) {
  body.single-product .ls-room22-related {
    width: 100% !important;
    max-width: 1160px !important;
    margin-inline: auto !important;
    padding: 0 clamp(18px, 2.4vw, 32px) clamp(72px, 6vw, 100px) !important;
  }
  body.single-product .ls-room22-related > .ls-room22-kicker {
    padding-top: 53px;
  }
  body.single-product .ls-room22-related .related.products > h2 {
    font-size: clamp(38px, 3.4vw, 56px) !important;
    line-height: .96 !important;
    margin: 13px 0 30px !important;
  }
  body.single-product .ls-room22-related ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(12px, 1.5vw, 20px) !important;
  }
  body.single-product .ls-room22-related ul.products li.product .ls-catalogue-image-frame {
    display: block !important;
    width: 100% !important;
    height: clamp(260px, 25vw, 352px) !important;
    aspect-ratio: auto !important;
    margin-bottom: 12px !important;
    overflow: hidden !important;
    background: #10090b !important;
  }
  body.single-product .ls-room22-related ul.products li.product .ls-catalogue-image-frame > img.ls-catalogue-framed-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
  }
  /* Fallback for any WooCommerce thumbnail without the custom image wrapper. */
  body.single-product .ls-room22-related ul.products li.product a > img:not(.ls-catalogue-framed-img) {
    width: 100% !important;
    height: clamp(260px, 25vw, 352px) !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    background: #10090b !important;
  }
  body.single-product .ls-room22-related ul.products .woocommerce-loop-product__title {
    font-size: clamp(19px, 1.45vw, 22px) !important;
    line-height: 1.05 !important;
    margin-top: 10px !important;
  }
}

/* v2.0.35 — SHOP / « LA SÉLECTION » : true compact desktop catalogue.
   The v2.0.34 fix scoped to .ls-room22-related (product-page selection),
   so the main shop grid still occupied almost 2000px on wide monitors.
   Cap only the shop archive, leaving category SEO grids and mobile untouched. */
@media (min-width: 901px) {
  body.post-type-archive-product .ls-collection {
    width: 100%;
    max-width: 1180px;
    margin-inline: auto;
    padding: 36px 24px 84px;
  }
  body.post-type-archive-product .ls-collection-products ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 32px 15px !important;
  }
  body.post-type-archive-product .ls-collection-products ul.products li.product {
    width: auto !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
  }
  body.post-type-archive-product .ls-collection-products ul.products li.product .ls-catalogue-image-frame {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 4.05 !important;
    margin-bottom: 12px !important;
    background: #10090b !important;
    overflow: hidden !important;
  }
  body.post-type-archive-product .ls-collection-products ul.products li.product .ls-catalogue-image-frame > img.ls-catalogue-framed-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
  }
  /* WooCommerce fallback when a thumbnail has no custom framing wrapper. */
  body.post-type-archive-product .ls-collection-products ul.products li.product a > img:not(.ls-catalogue-framed-img) {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 4.05 !important;
    object-fit: contain !important;
    background: #10090b !important;
  }
  body.post-type-archive-product .ls-collection-products ul.products li.product .woocommerce-loop-product__title {
    font-size: clamp(18px, 1.5vw, 22px) !important;
    line-height: 1.06 !important;
  }
}