/* Gallery-only compatibility layer. No product layout / typography / pricing changes. */
.mpc-variation-gallery-root { position: relative !important; }
.mpc-variation-photo-overlay {
  position: absolute; inset: 0; z-index: 4; background: #fff;
  box-sizing: border-box; display: grid; grid-template-columns: 48px minmax(0,1fr);
  gap: 12px; width: 100%; height: 100%; padding: 0; overflow: hidden;
}
.mpc-variation-photo-overlay[hidden] { display: none !important; }
.mpc-variation-photo-thumbs { display: flex; flex-direction: column; gap: 7px; overflow-y: auto; overflow-x: hidden; align-items: stretch; scrollbar-width: thin; }
.mpc-variation-photo-thumb { border: 1px solid #d6dce3; background: #fff; border-radius: 6px; padding: 2px; cursor: pointer; display: block; width: 46px; height: 54px; flex: 0 0 auto; }
.mpc-variation-photo-thumb[aria-current="true"] { border: 2px solid #ffb500; }
.mpc-variation-photo-thumb img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mpc-variation-photo-main { min-width: 0; height: 100%; display: flex; justify-content: center; align-items: center; background: #fff; overflow: hidden; }
.mpc-variation-photo-main button { all: unset; cursor: zoom-in; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
.mpc-variation-photo-main img { max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: contain; }
.mpc-variation-photo-lightbox { border: none; padding: 12px; max-width: 95vw; max-height: 95vh; background: #fff; border-radius: 6px; }
.mpc-variation-photo-lightbox::backdrop { background: rgba(0,0,0,.88); }
.mpc-variation-photo-lightbox img { max-width: 88vw; max-height: 84vh; object-fit: contain; display: block; }
.mpc-variation-photo-lightbox button { float: right; margin-bottom: 8px; padding: 4px 12px; cursor: pointer; }
@media(max-width:600px){.mpc-variation-photo-overlay{grid-template-columns:42px minmax(0,1fr);gap:7px}.mpc-variation-photo-thumb{width:40px;height:47px}}
