/* Small additions for behaviour Squarespace's runtime normally handles. */

/* Images placed by /js/site.js (Squarespace ImageLoader replacement). */
img[data-src].sqs-fill { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
img[data-src].sqs-fit { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; }

/* Gallery block slideshow */
.sqs-gallery-block-slideshow .sqs-gallery { position: relative; overflow: hidden; }
.sqs-gallery-block-slideshow .sqs-gallery .slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; }
.sqs-gallery-block-slideshow .sqs-gallery .slide.sqs-active-slide { opacity: 1; z-index: 1; }

/* Product slideshow */
#productSlideshow .slide { display: none; }
#productSlideshow .slide.sqs-active-slide { display: block; }
#productThumbnails .slide { cursor: pointer; }

/* Lightbox */
.mbs-lightbox { position: fixed; inset: 0; z-index: 100000; background: rgba(0,0,0,.9); display: flex; align-items: center; justify-content: center; }
.mbs-lightbox img { max-width: 92vw; max-height: 90vh; object-fit: contain; }
.mbs-lightbox button { position: absolute; background: none; border: 0; color: #fff; font-size: 40px; cursor: pointer; padding: 12px 18px; line-height: 1; }
.mbs-lightbox .lb-close { top: 10px; right: 10px; }
.mbs-lightbox .lb-prev { left: 10px; top: 50%; transform: translateY(-50%); }
.mbs-lightbox .lb-next { right: 10px; top: 50%; transform: translateY(-50%); }

/* Form block rendered by /js/site.js (validation message). */
.mbs-form .form-item.error .mbs-field-error { display: block; }
.mbs-form .mbs-field-error { display: none; color: #b00020; font-size: .85em; margin-top: .3em; }
