/* Ortak ürün galerisi: oklar, sayaç, büyütme, kırpmadan gösterim, sabit galeri. Renkler temadan (--kit-accent vb.) gelir. */
.pg-wrap { position: relative; }
.pg-wrap > img, .pg-wrap img[data-variant-main] { object-fit: contain !important; width: 100%; height: 100%; cursor: zoom-in; }
.pg-nav { position: absolute; top: 50%; z-index: 3; width: 42px; height: 42px; margin-top: -21px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); color: #111; box-shadow: 0 2px 10px rgba(0,0,0,.18); cursor: pointer; opacity: 0; transition: opacity .2s; }
.pg-nav.pg-prev { left: 12px; } .pg-nav.pg-next { right: 12px; }
.pg-wrap:hover .pg-nav, .pg-nav:focus-visible { opacity: 1; }
@media (hover: none) { .pg-nav { opacity: .9; width: 36px; height: 36px; margin-top: -18px; } }
.pg-count { position: absolute; right: 12px; bottom: 12px; z-index: 3; padding: 4px 10px; border-radius: 999px; background: rgba(17,17,17,.72); color: #fff; font: 600 12px/1.4 system-ui, sans-serif; letter-spacing: .06em; }
.pg-zoom { position: absolute; left: 12px; bottom: 12px; z-index: 3; width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); color: #111; cursor: zoom-in; box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.pg-on { outline: 2px solid var(--kit-accent, var(--at-accent, #111)); outline-offset: -2px; }
.pg-on img { opacity: 1; }
.pg-sticky [data-src]:not(.pg-on) img { opacity: .78; } .pg-sticky [data-src]:not(.pg-on):hover img { opacity: 1; }
@media (min-width: 992px) { .pg-sticky { position: sticky; top: var(--pg-top, 96px); align-self: flex-start; } }
.pg-lb { position: fixed; inset: 0; z-index: 99999; display: none; flex-direction: column; background: rgba(10,10,12,.94); color: #fff; user-select: none; }
.pg-lb.open { display: flex; }
.pg-lb-stage { position: relative; flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; touch-action: pan-y; }
.pg-lb-stage img { max-width: 94%; max-height: 100%; object-fit: contain; cursor: zoom-in; transition: transform .2s; }
.pg-lb-stage img.zoomed { transform: scale(2.2); cursor: zoom-out; transition: none; }
.pg-lb button { border: 0; background: rgba(255,255,255,.14); color: #fff; cursor: pointer; border-radius: 50%; width: 46px; height: 46px; display: grid; place-items: center; padding: 0; }
.pg-lb button:hover { background: rgba(255,255,255,.28); }
.pg-lb .pg-x { position: absolute; top: 14px; right: 14px; z-index: 2; }
.pg-lb .pg-prev, .pg-lb .pg-next { position: absolute; top: 50%; margin-top: -23px; z-index: 2; }
.pg-lb .pg-prev { left: 14px; } .pg-lb .pg-next { right: 14px; }
.pg-lb-count { position: absolute; top: 20px; left: 20px; z-index: 2; font: 600 13px system-ui, sans-serif; letter-spacing: .08em; opacity: .85; }
.pg-lb-strip { display: flex; gap: 8px; justify-content: center; padding: 10px 14px 14px; overflow-x: auto; }
.pg-lb-strip button { flex: none; width: 56px; height: 56px; border-radius: 6px; overflow: hidden; opacity: .55; background: #222; }
.pg-lb-strip button.on { opacity: 1; outline: 2px solid #fff; }
.pg-lb-strip img { width: 100%; height: 100%; object-fit: cover; }
body.pg-lock { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .pg-lb-stage img, .pg-nav { transition: none; } }