/* JELIMO V3.5.1 — compact C-end-style product gallery + color selector */
.jcm-product-media{width:100%;max-width:540px;min-width:0;margin-left:auto;margin-right:auto}
.jcm-product-media-stage{position:relative;overflow:hidden;border-radius:24px;background:#fff;aspect-ratio:4/3;box-shadow:0 16px 48px rgba(13,34,66,.085);touch-action:pan-y;border:1px solid #edf0f3}
.jcm-product-media-main{width:100%;height:100%;object-fit:contain;object-position:center;transition:opacity .18s ease,transform .32s ease;display:block;background:#fff}
.jcm-product-media-main.is-changing{opacity:.35;transform:scale(.992)}
.jcm-product-media-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border:1px solid rgba(15,23,42,.12);border-radius:999px;background:rgba(255,255,255,.94);color:#0b2e5e;font-size:27px;line-height:1;display:grid;place-items:center;cursor:pointer;box-shadow:0 7px 22px rgba(15,23,42,.10);transition:transform .2s ease,box-shadow .2s ease}
.jcm-product-media-arrow:hover{transform:translateY(-50%) scale(1.04);box-shadow:0 10px 28px rgba(15,23,42,.14)}
.jcm-product-media-arrow.is-prev{left:13px}.jcm-product-media-arrow.is-next{right:13px}
.jcm-product-media-thumbs{display:flex;gap:8px;overflow-x:auto;padding:10px 1px 2px;scrollbar-width:thin;scroll-snap-type:x proximity}
.jcm-product-media-thumb{flex:0 0 64px;width:64px;aspect-ratio:1/1;border:2px solid transparent;border-radius:11px;padding:0;background:#fff;overflow:hidden;cursor:pointer;opacity:.72;transition:border-color .2s ease,opacity .2s ease,transform .2s ease;scroll-snap-align:start}
.jcm-product-media-thumb img{width:100%;height:100%;object-fit:cover}.jcm-product-media-thumb:hover{opacity:1;transform:translateY(-1px)}.jcm-product-media-thumb.is-active{border-color:#0b2e5e;opacity:1}
.jcm-product-colors{margin-top:13px;padding-top:13px;border-top:1px solid #e7e8eb}
.jcm-product-colors-head{display:flex;align-items:center;gap:8px;margin-bottom:9px;color:#64748b;font-size:13px}.jcm-product-colors-head strong{color:#111827;font-weight:700}
.jcm-product-color-list{display:flex;flex-wrap:wrap;gap:8px}.jcm-product-color{display:inline-flex;align-items:center;gap:7px;min-height:36px;border:1px solid #dfe3e8;border-radius:999px;background:#fff;padding:4px 11px 4px 5px;cursor:pointer;color:#263449;font-weight:650;font-size:12px;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}.jcm-product-color:hover{border-color:#aeb8c6;transform:translateY(-1px)}.jcm-product-color.is-active{border-color:#0b2e5e;box-shadow:0 0 0 1px #0b2e5e}.jcm-product-color-dot{width:24px;height:24px;border-radius:999px;background:var(--jcm-color);border:1px solid rgba(15,23,42,.13);box-shadow:inset 0 0 0 2px rgba(255,255,255,.45)}
/* Keep the media module compact inside the existing 50/50 product hero. */
.jelimo-ve-home-hero .jcm-product-media,.jelimo-ve-columns .jcm-product-media{max-width:540px}
@media(min-width:1100px){.jcm-product-media{max-width:520px}.jcm-product-media-stage{aspect-ratio:4/3}}
@media(max-width:900px){.jcm-product-media{max-width:620px;margin-inline:auto}.jcm-product-media-stage{aspect-ratio:4/3}}
@media(max-width:700px){.jcm-product-media{max-width:100%}.jcm-product-media-stage{border-radius:18px;aspect-ratio:1/1}.jcm-product-media-arrow{width:36px;height:36px;font-size:23px}.jcm-product-media-thumb{flex-basis:58px;width:58px}.jcm-product-colors{margin-top:11px;padding-top:11px}.jcm-product-color-name{display:none}.jcm-product-color{padding:4px;min-height:34px}.jcm-product-color-dot{width:25px;height:25px}}
@media(prefers-reduced-motion:reduce){.jcm-product-media-main,.jcm-product-media-arrow,.jcm-product-media-thumb,.jcm-product-color{transition:none!important}}

/* V3.7.3 — smooth horizontal product-gallery transitions */
.jcm-product-media-stage{isolation:isolate}
.jcm-product-media-main{position:relative;z-index:1;will-change:transform,opacity}
.jcm-product-media-main.is-transitioning{z-index:2}
.jcm-product-media-transition-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;background:#fff;display:block;z-index:1;pointer-events:none;will-change:transform,opacity}
.jcm-product-media-arrow{z-index:6}
@keyframes jcmSlideInRight{from{transform:translate3d(18%,0,0) scale(.992);opacity:.12}to{transform:translate3d(0,0,0) scale(1);opacity:1}}
@keyframes jcmSlideInLeft{from{transform:translate3d(-18%,0,0) scale(.992);opacity:.12}to{transform:translate3d(0,0,0) scale(1);opacity:1}}
@keyframes jcmSlideOutLeft{from{transform:translate3d(0,0,0);opacity:1}to{transform:translate3d(-18%,0,0) scale(.992);opacity:0}}
@keyframes jcmSlideOutRight{from{transform:translate3d(0,0,0);opacity:1}to{transform:translate3d(18%,0,0) scale(.992);opacity:0}}
.jcm-product-media-main.slide-in-right{animation:jcmSlideInRight .90s cubic-bezier(.22,.61,.36,1) both}
.jcm-product-media-main.slide-in-left{animation:jcmSlideInLeft .90s cubic-bezier(.22,.61,.36,1) both}
.jcm-product-media-transition-image.slide-out-left{animation:jcmSlideOutLeft .90s cubic-bezier(.22,.61,.36,1) both}
.jcm-product-media-transition-image.slide-out-right{animation:jcmSlideOutRight .90s cubic-bezier(.22,.61,.36,1) both}
@media(prefers-reduced-motion:reduce){.jcm-product-media-main.slide-in-right,.jcm-product-media-main.slide-in-left,.jcm-product-media-transition-image.slide-out-left,.jcm-product-media-transition-image.slide-out-right{animation:none!important}}

/* V3.7.7 — keep dynamic product-gallery updates out of viewport scroll anchoring */
.jcm-product-media{overflow-anchor:none}
