/* İsme Özel Masal — Kitap Galerisi (Woodmart ile)
   Kapalı kitap = tek kare kapak; açılınca 2:1'lik çift sayfa yayılımı. Her yaprak sağ yarıda durur,
   sol kenarından (sırt) döner. Renk/yuvarlaklık/yazı tipi Woodmart'ın kendi değişkenlerinden gelir. */

.ioms-book{
  --kg-ink:#1A2B4A;
  --kg-accent:var(--wd-primary-color,#004AAD);
  --kg-radius:var(--wd-brd-radius,12px);
  --kg-line:rgba(26,43,74,.14);
  --kg-ease:cubic-bezier(.16,1,.3,1);
  --kg-font:var(--wd-title-font,inherit);
  --cs:1;--flip:.95s;
  position:relative;color:var(--kg-ink);box-sizing:border-box;
}
.ioms-book *,.ioms-book *::before,.ioms-book *::after{box-sizing:border-box;}
@supports (width:1cqw){.ioms-book{--cs:1.3;}}
/* Üstte tam genişlikte; çok geniş ekranda dev olmasın. Kapalı kapağın boyunu JS ekran yüksekliğine göre ayarlar. */
.ioms-book:not(.is-full){width:100%;max-width:1040px;margin-left:auto;margin-right:auto;}

/* Woodmart tüm <button>'lara padding/yazı tipi/büyük harf gibi kendi stillerini verir. Sıfırlama, düğme
   sınıflarının kendisinde yapılır (özgüllük 0,1,0 > Woodmart'ın 0,0,1'i); her sınıfın kendi kuralları
   bunun ARKASINDAN gelir ve kazanır. */
.ioms-book__nav,.ioms-book__thumb,.ioms-book__open{
  all:unset;box-sizing:border-box;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
:where(.ioms-book) ul{margin:0;padding:0;list-style:none;}
:where(.ioms-book) li{margin:0;padding:0;}

/* ===== Woodmart yerleşimi: kitap üstte, ürün bilgileri altta ===== */
.product-image-summary-inner:has(.ioms-book) > .wd-grid-col{grid-column:1 / -1 !important;}
.product-image-summary-inner:has(.ioms-book) > .summary{justify-self:center;width:100%;max-width:860px;}
/* Woodmart görsel sütununu yapışkan yapar; yığılmış düzende kitap bilgilerin üstünde asılı kalmasın. */
.single-product .product-images:has(.ioms-book){position:static !important;}

/* ===== Sahne ===== */
.ioms-book__frame{container-type:inline-size;width:100%;}
.ioms-book__stage{position:relative;width:100%;aspect-ratio:2/1;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:e-resize;}
@supports (width:1cqw){
  .ioms-book__stage{aspect-ratio:auto;height:50cqw;transition:height var(--flip) var(--kg-ease);}
  .ioms-book[data-state="closed"] .ioms-book__stage,
  .ioms-book[data-state="end"] .ioms-book__stage{height:calc(50cqw * var(--cs));}
}
.ioms-book[data-state="end"] .ioms-book__stage{cursor:w-resize;}
.ioms-book__book{
  position:absolute;left:0;top:50%;width:100%;aspect-ratio:2/1;translate:0 -50%;
  perspective:2600px;transition:transform var(--flip) var(--kg-ease);
}
/* Önce kaydır, sonra ölçekle: kapak (sağ yarı) / son sayfa (sol yarı) ortaya gelir. */
.ioms-book[data-state="closed"] .ioms-book__book{transform:scale(var(--cs)) translateX(-25%);}
.ioms-book[data-state="end"] .ioms-book__book{transform:scale(var(--cs)) translateX(25%);}
.ioms-book__shadow{
  position:absolute;left:6%;right:6%;bottom:-3%;height:7%;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(26,43,74,.38),transparent 72%);filter:blur(7px);
}

/* ===== Yapraklar ===== */
.ioms-book__sheet{
  position:absolute;top:0;left:50%;width:50%;height:100%;
  transform-origin:0 50%;transform-style:preserve-3d;
  transition:transform var(--flip) cubic-bezier(.55,.05,.2,1);will-change:transform;
}
.ioms-book__sheet.is-flipped{transform:rotateY(-180deg);}
.ioms-book__face{
  position:absolute;inset:0;overflow:hidden;background:#fff;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
}
.ioms-book__face--front{border-radius:3px 10px 10px 3px;}
.ioms-book__face--back{transform:rotateY(180deg);border-radius:10px 3px 3px 10px;}
.ioms-book__face img{width:100%;height:100%;max-width:none;object-fit:cover;display:block;margin:0;pointer-events:none;-webkit-user-drag:none;}
.ioms-book__face.is-blank{background:linear-gradient(160deg,#27406B,var(--kg-ink));display:flex;align-items:center;justify-content:center;}
.ioms-book__face.is-blank img.ioms-book__logo{width:62%;height:auto;object-fit:contain;opacity:.92;}
/* Sırt gölgesi + dönerken yüzün kararıp aydınlanması (ışık hissi) */
.ioms-book__face::before,.ioms-book__face::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;}
.ioms-book__face--front::before{background:linear-gradient(90deg,rgba(26,43,74,.30),rgba(26,43,74,0) 9%);}
.ioms-book__face--back::before{background:linear-gradient(270deg,rgba(26,43,74,.30),rgba(26,43,74,0) 9%);}
.ioms-book__face--front::after{background:linear-gradient(270deg,rgba(26,43,74,0),rgba(26,43,74,.42));opacity:0;transition:opacity var(--flip);}
.ioms-book__face--back::after{background:linear-gradient(90deg,rgba(26,43,74,0),rgba(26,43,74,.42));opacity:1;transition:opacity var(--flip);}
.ioms-book__sheet.is-flipped .ioms-book__face--front::after{opacity:1;}
.ioms-book__sheet.is-flipped .ioms-book__face--back::after{opacity:0;}
/* Kapağın cilt oluğu */
.ioms-book__sheet.is-cover .ioms-book__face--front{border-radius:4px 12px 12px 4px;}
.ioms-book__sheet.is-cover .ioms-book__face--front::before{
  background:linear-gradient(90deg,rgba(26,43,74,.38) 0,rgba(26,43,74,.06) 3.6%,rgba(255,255,255,.30) 4%,rgba(26,43,74,.14) 4.8%,rgba(26,43,74,0) 10%);
}

/* Sayfa yığınının kenarı (kalınlık hissi); genişlikleri JS verir */
.ioms-book__edge{
  position:absolute;top:1.6%;bottom:1.6%;pointer-events:none;
  background:repeating-linear-gradient(90deg,#E4E8F0 0 1px,#FFFFFF 1px 3px);transition:width var(--flip);
}
.ioms-book__edge--r{left:100%;width:var(--er,10px);border-radius:0 4px 4px 0;box-shadow:2px 0 4px rgba(26,43,74,.14);}
.ioms-book__edge--l{right:100%;width:var(--el,0px);border-radius:4px 0 0 4px;box-shadow:-2px 0 4px rgba(26,43,74,.14);}

.ioms-book__open{
  position:absolute;left:50%;bottom:7%;translate:-50% 0;z-index:200;
  display:inline-flex;align-items:center;gap:6px;padding:12px 22px;border-radius:999px;
  background:#fff;color:var(--kg-ink);font-family:var(--kg-font);font-weight:700;font-size:15px;line-height:1;
  box-shadow:0 10px 24px -8px rgba(26,43,74,.5);transition:transform .2s var(--kg-ease),opacity .3s;
}
.ioms-book__open svg{width:17px;height:17px;stroke:var(--kg-accent);}
.ioms-book__open:hover{transform:translateY(-2px);background:#fff;color:var(--kg-ink);}
.ioms-book:not([data-state="closed"]) .ioms-book__open{opacity:0;pointer-events:none;}

.ioms-book__swipe{display:none;}

/* ===== Kontroller ===== */
.ioms-book__bar{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:24px;}
.ioms-book__nav{
  width:44px;height:44px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--kg-line);color:var(--kg-ink);
  transition:background .15s,opacity .15s,transform .15s var(--kg-ease);
}
.ioms-book__nav svg{width:20px;height:20px;}
.ioms-book__nav:hover:not(:disabled){background:#F1F4FA;transform:translateY(-1px);}
.ioms-book__nav:disabled{opacity:.35;cursor:default;}
.ioms-book__nav:focus-visible,.ioms-book__thumb:focus-visible,.ioms-book__open:focus-visible{
  outline:3px solid color-mix(in srgb,var(--kg-accent) 45%,transparent);outline-offset:2px;
}
.ioms-book__count{min-width:112px;text-align:center;font-weight:700;font-size:14.5px;line-height:1.2;font-variant-numeric:tabular-nums;}
.ioms-book__full{margin-left:12px;}
.ioms-book__ico-close{display:none;}
.ioms-book.is-full .ioms-book__ico-expand{display:none;}
.ioms-book.is-full .ioms-book__ico-close{display:block;}

.ioms-book__thumbs{
  display:flex;gap:10px;overflow-x:auto;margin:16px auto 0;padding:3px 3px 8px;width:fit-content;max-width:100%;
  scrollbar-width:thin;scrollbar-color:var(--kg-line) transparent;
}
.ioms-book__thumb{
  display:block;flex:0 0 62px;width:62px;height:62px;border-radius:9px;overflow:hidden;background:#fff;
  border:2px solid transparent;transition:border-color .15s,transform .15s var(--kg-ease);
}
.ioms-book__thumb img{width:100%;height:100%;max-width:none;object-fit:cover;display:block;margin:0;pointer-events:none;}
.ioms-book__thumb:hover{transform:translateY(-2px);background:#fff;}
.ioms-book__thumb.is-active{border-color:var(--kg-accent);}

/* ===== Tam ekran okuyucu ===== */
html.ioms-book-lock{overflow:hidden;}
.ioms-book.is-full{
  position:fixed;inset:0;z-index:2147483000;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:20px 16px;background:radial-gradient(900px 600px at 50% 40%,#2A4270,#14213A);overflow:auto;color:#fff;
}
.ioms-book.is-full .ioms-book__frame{width:min(92vw,calc((100svh - 190px) * 2));flex-shrink:0;}
.ioms-book.is-full .ioms-book__nav{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.2);color:#fff;}
.ioms-book.is-full .ioms-book__nav:hover:not(:disabled){background:rgba(255,255,255,.2);}
.ioms-book.is-full .ioms-book__thumbs{max-width:min(92vw,900px);}
.ioms-book.is-full .ioms-book__thumb{background:rgba(255,255,255,.12);}

/* ===== Mobil: sayfalar kaydırmalı şerit (3B çevirme yok). 720px eşiği galeri.js ile aynı olmalı. ===== */
@media (max-width:720px){
  .ioms-book__frame,.ioms-book__bar .ioms-book__nav{display:none;}
  .ioms-book__swipe{display:block;}
  .ioms-book__track{
    position:relative;display:flex;gap:12px;margin:0 calc(var(--wd-container-padding, 15px) * -1);padding:8px 8vw 28px;
    overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .ioms-book__track::-webkit-scrollbar{display:none;}
  .ioms-book__slide{
    position:relative;flex:0 0 84%;scroll-snap-align:center;border-radius:6px 14px 14px 6px;overflow:hidden;
    box-shadow:0 12px 22px -12px rgba(26,43,74,.4);background:#fff;
  }
  .ioms-book__slide::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(90deg,rgba(26,43,74,.28),rgba(26,43,74,0) 8%);
  }
  .ioms-book__slide img{width:100%;max-width:none;aspect-ratio:1/1;object-fit:cover;display:block;margin:0;pointer-events:none;}
  .ioms-book__bar{margin-top:8px;}
}
@media (prefers-reduced-motion:reduce){
  .ioms-book{--flip:.01s;}
}
