/* =========================================================
   Galeri — "a A a" coverflow karusel.
   Konumlandırma (transform/opacity/filter) assets/js/gallery.js
   tarafından satır-içi stil olarak hesaplanır; burada yalnızca
   kutu boyutları, geçiş süresi ve kontrol görünümü tanımlanır.
========================================================= */
.gallery-carousel{position:relative;width:100%;max-width:1140px;margin-inline:auto;}
/* Ok butonları sayacı değil yalnızca stage'i referans alsın diye stage +
   butonlar ayrı bir "viewport" içinde gruplanır. Sayaç bu grubun DIŞINDA,
   altta; böylece butonların dikey ortalaması sayacın yüksekliğinden
   etkilenmez ve her zaman görselin tam ortasına denk gelir. */
.gallery-carousel__viewport{
  position:relative;
  /* Oklar görsellerin üzerine değil, görselden uzakta bu boşluğa oturur. */
  padding-inline:clamp(46px,7.5vw,96px);
}
.gallery-carousel__stage{
  position:relative;
  height:clamp(220px,42vw,460px);
  perspective:1400px;
  overflow:hidden;
  /* Kenarlardaki bulanık önceki/sonraki görseller sert bir çizgiyle
     kesilmek yerine yumuşak bir geçişle kaybolur. */
  -webkit-mask-image:linear-gradient(to right, transparent 0%, #000 18%, #000 82%, transparent 100%);
  mask-image:linear-gradient(to right, transparent 0%, #000 18%, #000 82%, transparent 100%);
}
.gallery-carousel__slide{
  position:absolute;top:50%;left:50%;
  width:63%;
  aspect-ratio:16/9;
  border-radius:clamp(1.2rem,3.4vw,2.4rem);
  overflow:hidden;
  background:var(--bg-secondary);
  box-shadow:var(--shadow-lift);
  cursor:pointer;
  transition:transform .7s var(--ease-premium), opacity .6s ease, filter .6s ease;
}
.gallery-carousel__slide.is-active{cursor:zoom-in;}
.gallery-carousel__slide img{width:100%;height:100%;object-fit:cover;display:block;}

.gallery-carousel__btn{
  position:absolute;top:50%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;flex:none;
  display:grid;place-items:center;
  background:var(--color-paper);color:var(--color-anthracite);
  box-shadow:var(--shadow-soft);
  border:none;cursor:pointer;z-index:6;
  transition:background var(--dur-fast),color var(--dur-fast),transform var(--dur-fast) var(--ease-premium);
}
.gallery-carousel__btn:active{transform:translateY(-50%) scale(.94);}
.gallery-carousel__btn .icon{width:1.3em;height:1.3em;}
.gallery-carousel__btn--prev{left:0;}
.gallery-carousel__btn--prev .icon{transform:rotate(180deg);}
.gallery-carousel__btn--next{right:0;}

.gallery-carousel__counter{
  text-align:center;margin-top:1.6rem;
  font-family:var(--font-accent);font-size:.74rem;letter-spacing:.18em;
  color:var(--color-anthracite);opacity:.65;
}

@media (prefers-reduced-motion:reduce){
  .gallery-carousel__slide{transition:opacity .4s ease;}
}

@media (max-width:640px){
  .gallery-carousel__viewport{padding-inline:clamp(24px,8vw,40px);}
  .gallery-carousel__stage{height:clamp(200px,58vw,320px);}
  .gallery-carousel__slide{width:74%;}
  .gallery-carousel__btn{width:36px;height:36px;}
  .gallery-carousel__btn .icon{width:1.05em;height:1.05em;}
  .gallery-carousel__btn--prev{left:-2px;}
  .gallery-carousel__btn--next{right:-2px;}
}

/* Küçük görsel şeridi — karuselin altında tüm fotoğraflara doğrudan geçiş */
.gallery-thumbs{
  display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;
  margin-top:clamp(1.4rem,3vw,2.2rem);
}
.gallery-thumb{
  width:84px;height:56px;border-radius:10px;overflow:hidden;padding:0;
  border:1.5px solid transparent;opacity:.55;
  transition:opacity var(--dur-fast), border-color var(--dur-fast), transform var(--dur-fast);
}
.gallery-thumb img{width:100%;height:100%;object-fit:cover;}
.gallery-thumb.is-active{opacity:1;border-color:var(--color-taupe);}
@media (hover:hover){.gallery-thumb:hover{opacity:1;transform:translateY(-2px);}}
@media (max-width:560px){.gallery-thumb{width:62px;height:42px;}}

/* =========================================================
   Büyük fotoğraf görünümü (lightbox) — tam ekran değil, koyu bir
   arka plan üzerinde odağı yalnızca fotoğrafta tutan, belirgin
   biçimde büyütülmüş bir görünüm. Sayfadaki HER ŞEYin üzerinde
   durur; header/yüzen butonlar açıkken ayrıca gizlenir.
========================================================= */
[data-lightbox-open] .site-header,
[data-lightbox-open] .floating-whatsapp,
[data-lightbox-open] .floating-stack,
[data-lightbox-open] .floating-quicknav,
[data-lightbox-open] .scroll-decor{
  visibility:hidden;
}
.photo-lightbox{
  position:fixed;inset:0;z-index:var(--z-lightbox);
  display:flex;align-items:center;justify-content:center;
  padding:clamp(1.5rem,6vw,4rem);
  background:rgba(22,18,15,.97);
  opacity:0;visibility:hidden;
  transition:opacity .35s var(--ease-premium), visibility 0s linear .35s;
}
.photo-lightbox.is-open{
  opacity:1;visibility:visible;
  transition:opacity .35s var(--ease-premium), visibility 0s linear 0s;
}
.photo-lightbox__frame{
  position:relative;margin:0;max-width:min(1100px,80vw);max-height:84vh;
  transform:scale(.92);
  transition:transform .35s var(--ease-premium);
}
.photo-lightbox.is-open .photo-lightbox__frame{transform:scale(1);}
.photo-lightbox__image{
  display:block;max-width:min(1100px,80vw);max-height:84vh;
  width:auto;height:auto;
  border-radius:1.25rem;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.55);
}
.photo-lightbox__caption{
  position:absolute;left:50%;transform:translateX(-50%);bottom:-4.4rem;
  width:max-content;max-width:90vw;text-align:center;
  color:var(--bg-primary);font-size:.92rem;
}
.photo-lightbox__close{
  position:fixed;top:clamp(1rem,3vw,1.75rem);right:clamp(1rem,3vw,1.75rem);
  width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--color-paper);color:var(--color-anthracite);
  box-shadow:0 8px 24px -6px rgba(0,0,0,.5);
  border:none;cursor:pointer;z-index:1;
  transition:background var(--dur-fast),color var(--dur-fast),transform var(--dur-fast);
}
.photo-lightbox__close .icon{width:1.3em;height:1.3em;}

/* İleri/geri butonları fotoğrafın İÇİNDE değil, ona yakın ama DIŞINDA
   durur — görselin boyutu ne olursa olsun kenarına göre konumlanır.
   Masaüstünde bu sarmalayıcı düzene karışmaz (display:contents); mobilde
   ise görselin ALTINDA, sayaçla aynı sırada yer alır. */
.photo-lightbox__controls{display:contents;}
.photo-lightbox__nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(251,248,245,.16);color:var(--bg-primary);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  border:none;cursor:pointer;z-index:1;
  transition:background var(--dur-fast),transform var(--dur-fast) var(--ease-premium);
}
.photo-lightbox__nav:active{transform:translateY(-50%) scale(.94);}
.photo-lightbox__nav .icon{width:1.3em;height:1.3em;}
.photo-lightbox__nav--prev{left:-88px;}
.photo-lightbox__nav--prev .icon{transform:rotate(180deg);}
.photo-lightbox__nav--next{right:-88px;}
.photo-lightbox__counter{
  position:absolute;left:50%;bottom:-2.4rem;transform:translateX(-50%);
  color:var(--bg-primary);opacity:.75;
  font-family:var(--font-accent);font-size:.74rem;letter-spacing:.16em;
  white-space:nowrap;
}
/* Tek fotoğraflı ürünlerde oklar ve sayaç anlamsız olur; JS bu sınıfı
   ekleyerek yalnızca fotoğraf + kapat butonunu bırakır. */
.photo-lightbox.is-single .photo-lightbox__nav,
.photo-lightbox.is-single .photo-lightbox__counter{display:none;}
.photo-lightbox.is-single .photo-lightbox__caption{bottom:-3rem;}

@media (hover:hover){
  .gallery-carousel__btn:hover{background:var(--color-taupe-dark);color:var(--color-paper);transform:translateY(-50%) scale(1.06);}
  .photo-lightbox__close:hover{background:var(--color-taupe-dark);color:var(--color-paper);transform:scale(1.08);}
  .photo-lightbox__nav:hover{background:rgba(251,248,245,.3);transform:translateY(-50%) scale(1.06);}
}

@media (max-width:640px){
  .photo-lightbox__close{width:44px;height:44px;}
  .photo-lightbox__frame{max-width:min(1100px,88vw);}
  .photo-lightbox__image{max-width:min(1100px,88vw);max-height:66vh;}
  .photo-lightbox__controls{
    display:flex;align-items:center;justify-content:center;gap:1rem;
    margin-top:1.1rem;
  }
  .photo-lightbox__nav{
    position:static;transform:none;
    width:42px;height:42px;
    background:rgba(251,248,245,.14);-webkit-backdrop-filter:none;backdrop-filter:none;
  }
  /* Masaüstü kuralı butonu position:absolute iken translateY(-50%) ile
     ortalıyordu; burada buton normal akışta olduğu için aynı transform
     basılınca buton yerinden zıplıyordu. */
  .photo-lightbox__nav:active{transform:scale(.94);}
  .photo-lightbox__nav .icon{width:1.05em;height:1.05em;}
  .photo-lightbox__counter{position:static;transform:none;order:0;}
  .photo-lightbox__caption{position:static;transform:none;margin-top:.9rem;width:auto;font-size:.85rem;}
  @media (hover:hover){
    .photo-lightbox__nav:hover{transform:scale(1.06);}
  }
}
