/* LYA Period Underwear carousel: three-photo storefront gallery and Admin crop controls. */
.category-product-media.lya-carousel-media { position: relative !important; }
.lya-carousel-controls { position: absolute; inset: auto 8px 8px; z-index: 8; display: flex; align-items: center; justify-content: space-between; gap: 6px; pointer-events: none; }
.lya-carousel-arrow, .lya-carousel-dot { pointer-events: auto; cursor: pointer; color: #fff !important; background: #431c2acc !important; border: 1px solid rgba(255,255,255,.95) !important; box-shadow: 0 2px 8px #24101866; }
.lya-carousel-arrow { width: 28px; height: 28px; border-radius: 50%; padding: 0 !important; font-size: 24px; line-height: 20px; display: grid; place-items: center; }
.lya-carousel-dots { display: flex; align-items: center; justify-content: center; gap: 4px; }
.lya-carousel-dot { width: 8px; height: 8px; min-width: 8px; padding: 0 !important; border-radius: 50%; opacity: .72; }
.lya-carousel-dot.is-active { opacity: 1; background: #fff !important; box-shadow: 0 0 0 1px #431c2a; }
.lya-carousel-lightbox { position: fixed; inset: 0; z-index: 10000; display: none; align-items: center; justify-content: center; padding: 20px; background: #160b0ddd; }
.lya-carousel-lightbox.is-open { display: flex; }
.lya-carousel-lightbox-panel { position: relative; width: min(92vw, 720px); height: min(88vh, 860px); display: grid; place-items: center; padding: 46px 52px 42px; background: #f7eee8; border: 1px solid rgba(255,255,255,.9); border-radius: 18px; box-shadow: 0 24px 80px #0008; }
.lya-carousel-lightbox-image { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; border-radius: 12px; }
.lya-carousel-lightbox-close, .lya-carousel-lightbox-prev, .lya-carousel-lightbox-next { position: absolute; z-index: 2; color: #fff !important; background: #431c2a !important; border: 1px solid rgba(255,255,255,.95) !important; border-radius: 50%; cursor: pointer; }
.lya-carousel-lightbox-close { top: 12px; right: 14px; width: 34px; height: 34px; font-size: 24px; line-height: 20px; }
.lya-carousel-lightbox-prev, .lya-carousel-lightbox-next { top: 50%; width: 38px; height: 38px; transform: translateY(-50%); font-size: 30px; line-height: 24px; }
.lya-carousel-lightbox-prev { left: 10px; }
.lya-carousel-lightbox-next { right: 10px; }
.lya-carousel-lightbox-caption { position: absolute; left: 0; right: 0; bottom: 12px; text-align: center; color: #431c2a; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.lya-carousel-admin { margin-top: 14px; padding: 14px; color: #431c2a; background: #f7eee8; border: 1px solid #431c2733; border-radius: 8px; }
.lya-carousel-admin > strong, .lya-carousel-admin > small { display: block; }
.lya-carousel-admin > strong { margin-bottom: 4px; font-size: 13px; }
.lya-carousel-admin > small { color: #806f6a; line-height: 1.45; }
.lya-carousel-admin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 10px 0; }
.lya-carousel-admin-slot { min-width: 0; }
.lya-carousel-admin-thumb { display: grid; place-items: center; aspect-ratio: 4 / 5; overflow: hidden; margin-bottom: 6px; color: #806f6a; background: #fffaf6; border: 1px solid #431c2733; border-radius: 6px; font-size: 10px; text-align: center; }
.lya-carousel-admin-thumb img { width: 100%; height: 100%; object-fit: contain; }
.lya-carousel-upload { display: flex !important; min-height: 34px; align-items: center; justify-content: center; width: 100%; padding: 6px 5px !important; color: #431c2a !important; background: #fffaf6 !important; border: 1px solid #431c274d !important; border-radius: 4px; font-size: 9px; text-align: center; cursor: pointer; }
.lya-carousel-admin-status { min-height: 16px; }
.lya-cropper-shade { position: fixed; inset: 0; z-index: 10001; display: grid; place-items: center; padding: 16px; background: #160b0ddd; }
.lya-cropper { width: min(94vw, 520px); max-height: 94vh; overflow: auto; padding: 18px; color: #431c2a; background: #f7eee8; border: 1px solid rgba(255,255,255,.9); border-radius: 12px; box-shadow: 0 24px 80px #0008; }
.lya-cropper-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.lya-cropper-head strong, .lya-cropper-head small { display: block; }
.lya-cropper-head small { margin-top: 4px; color: #806f6a; }
.lya-cropper-close { width: 30px; height: 30px; color: #fff; background: #431c2a; border: 1px solid rgba(255,255,255,.95); border-radius: 50%; cursor: pointer; }
.lya-cropper-canvas { display: block; width: min(100%, 320px); height: auto; margin: 0 auto 14px; background: #fffaf6; border: 1px solid #431c2733; border-radius: 8px; }
.lya-cropper-controls { display: grid; gap: 8px; }
.lya-cropper-controls label { display: grid; gap: 4px; font-size: 11px; }
.lya-cropper-controls input { width: 100%; accent-color: #7d2945; }
.lya-cropper-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
@media (width <= 520px) {
  .lya-carousel-lightbox-panel { width: 94vw; height: 78vh; padding-left: 42px; padding-right: 42px; }
  .lya-carousel-admin-grid { gap: 6px; }
  .lya-carousel-upload { font-size: 8px; }
}
