/* Ürün sayfası · Video & görsel vitrini */
.yc-pstory{min-width:0}
.yc-pstory-intro{margin:0 0 18px;max-width:64ch;color:var(--yc-muted);font-size:var(--yc-fs-14,14px);line-height:1.65}
.yc-pstory .yc-hb-collection{display:flex;flex-direction:column;gap:10px;min-width:0}
.yc-pstory .yc-hb-controls{order:0;align-self:flex-end;margin:0;gap:6px}
.yc-pstory .yc-hb-controls button{width:34px;height:34px;border-color:var(--yc-border-soft);background:var(--yc-surface);color:var(--yc-icon-color,var(--yc-text))}
.yc-pstory .yc-hb-controls span{font-size:var(--yc-fs-11,11px)}
.yc-pstory-track{order:1;cursor:grab}
.yc-pstory-track.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.yc-pstory-track img{-webkit-user-drag:none;user-select:none}

.yc-pstory-slide{min-width:0}

.yc-pstory-frame{position:relative;display:block;width:100%;padding:0;border:0;border-radius:14px;background:#e9eaec;overflow:hidden;isolation:isolate;transform:translateZ(0);cursor:pointer;aspect-ratio:var(--yc-story-ratio,9/16);color:inherit;text-align:left;transition:transform .22s ease}
.yc-pstory-frame.is-static{cursor:default}
.yc-pstory-frame[data-story-image]{cursor:zoom-in}
.yc-pstory-frame[data-story-image]::after{content:"⤢ Büyüt";position:absolute;right:10px;bottom:10px;z-index:2;padding:7px 10px;border-radius:999px;background:rgba(17,25,39,.84);color:#fff;font-size:12px;font-weight:700;line-height:1.2;pointer-events:none}
.yc-pstory-frame:has([data-story-play]){cursor:default}
.yc-pstory-frame.is-playing .yc-pstory-play{display:none}
.yc-pstory-frame iframe{position:absolute;inset:0;display:block;width:100%;height:100%;border:0;background:#000}
.yc-pstory-frame video:has(~.yc-pstory-play){object-fit:cover}
.yc-pstory-frame.is-playing video{object-fit:contain;background:#000}
a.yc-pstory-frame{text-decoration:none}
.yc-pstory-frame:hover{transform:translate3d(0,-3px,0)}
.yc-pstory-frame:focus-visible{outline:2px solid var(--yc-primary);outline-offset:3px}

.yc-pstory-img{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;transition:transform .45s ease}
.yc-pstory-frame:hover .yc-pstory-img{transform:scale(1.05)}

.yc-pstory-fallback{position:absolute;inset:0;display:grid;place-items:center;color:var(--yc-muted)}
.yc-pstory-fallback .micon{font-size:34px}



/* Oynat rozeti */
.yc-pstory-play{position:absolute;top:50%;left:50%;z-index:2;display:grid;place-items:center;width:56px;height:56px;padding:0;border:1px solid var(--yc-border-soft);border-radius:50%;background:#fff;color:#16181c;transform:translate(-50%,-50%);cursor:pointer;transition:transform .22s ease}
.yc-pstory-play svg{margin-inline-start:2px}
.yc-pstory-frame:hover .yc-pstory-play{transform:translate(-50%,-50%) scale(1.07)}

/* Tema sheet'i içindeki medya (kendi modalı kullanmıyoruz) */
.yc-sheet-body .yc-pstory-media{display:grid;place-items:center;width:100%;border-radius:12px;overflow:hidden;background:#000}
.yc-sheet-body .yc-pstory-media.is-embed,.yc-sheet-body .yc-pstory-media.is-file{aspect-ratio:16/9}
.yc-sheet-body .yc-pstory-media>:is(iframe,video){display:block;width:100%;height:100%;border:0;background:#000}
.yc-sheet-body .yc-pstory-media.is-image{background:transparent}
.yc-sheet-body .yc-pstory-media>img{display:block;width:100%;height:auto;max-height:72dvh;object-fit:contain}

@media(max-width:900px){
  .yc-pstory-intro{margin:0 0 14px;font-size:var(--yc-fs-13-5,13.5px)}
  .yc-pstory-frame{border-radius:12px}
  .yc-pstory .yc-hb-collection{gap:7px}
  .yc-pstory .yc-hb-controls button{width:30px;height:30px}
  .yc-pstory .yc-hb-controls span{display:inline;min-width:36px}
  .yc-sheet-body .yc-pstory-media.is-embed,.yc-sheet-body .yc-pstory-media.is-file{aspect-ratio:16/9}
  .yc-pstory-play{width:48px;height:48px}
  .yc-pstory-play svg{width:19px;height:19px}
}
html.yc-pstory-lightbox-open{overflow:hidden}
.yc-pstory-lightbox{width:min(1220px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);margin:auto;padding:0;border:0;border-radius:16px;background:#111927;color:#fff;box-shadow:0 25px 90px rgba(0,0,0,.45);overflow:hidden}
.yc-pstory-lightbox::backdrop{background:rgba(2,6,16,.88);backdrop-filter:blur(5px)}
.yc-pstory-lightbox-inner{position:relative;display:grid;place-items:center;min-height:min(620px,calc(100dvh - 24px));padding:52px 64px 26px}
.yc-pstory-lightbox figure{display:grid;place-items:center;gap:12px;width:100%;margin:0;min-width:0}
.yc-pstory-lightbox figure img{display:block;max-width:100%;max-height:calc(100dvh - 130px);width:auto;height:auto;object-fit:contain}
.yc-pstory-lightbox figcaption{display:flex;align-items:center;justify-content:center;gap:20px;min-height:25px;color:#fff;font-size:13px}
.yc-pstory-lightbox figcaption a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.yc-pstory-lightbox :is(.yc-pstory-lightbox-close,.yc-pstory-lightbox-prev,.yc-pstory-lightbox-next){position:absolute;z-index:3;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:rgba(17,25,39,.78);color:#fff;font:inherit;font-size:30px;line-height:1;cursor:pointer}
.yc-pstory-lightbox :is(.yc-pstory-lightbox-close,.yc-pstory-lightbox-prev,.yc-pstory-lightbox-next):hover{background:#38465d}
.yc-pstory-lightbox :is(.yc-pstory-lightbox-close,.yc-pstory-lightbox-prev,.yc-pstory-lightbox-next):focus-visible{outline:3px solid #f6bb42;outline-offset:2px}
.yc-pstory-lightbox-close{right:14px;top:14px}
.yc-pstory-lightbox-prev{left:12px;top:50%;transform:translateY(-50%)}
.yc-pstory-lightbox-next{right:12px;top:50%;transform:translateY(-50%)}
@media(max-width:640px){
  .yc-pstory-lightbox{width:100vw;max-height:100dvh;border-radius:0}
  .yc-pstory-lightbox-inner{min-height:100dvh;padding:58px 44px 24px}
  .yc-pstory-lightbox figure img{max-height:calc(100dvh - 140px)}
  .yc-pstory-lightbox-prev{left:4px}
  .yc-pstory-lightbox-next{right:4px}
  .yc-pstory-frame[data-story-image]::after{right:7px;bottom:7px;padding:6px 8px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .yc-pstory-frame,.yc-pstory-img,.yc-pstory-play{transition:none}
  .yc-pstory-frame:hover{transform:none}
  .yc-pstory-frame:hover .yc-pstory-img{transform:none}
}

/* ── Vitrin modalı · medya lightbox'ı ────────────────────────────────────
   Paylaşılan bilgi sheet'i metin için tasarlandı; medya için kenardan kenara,
   koyu zeminli bir görüntüleyiciye dönüştürülür. Metin gösterilmez. */
.yc-info-sheet:has(.yc-pstory-media){width:min(980px,calc(100vw - 32px));max-height:min(88dvh,860px);background:#0b0c0e;border-radius:16px}
.yc-info-sheet:has(.yc-pstory-media)::backdrop{background:color-mix(in srgb,#000 82%,transparent);backdrop-filter:blur(4px)}

/* Başlık şeridi: yalnızca medyanın üzerinde yüzen kapat butonu kalır */
.yc-info-sheet:has(.yc-pstory-media) .yc-sheet-head{position:absolute;inset-block-start:0;inset-inline:0;z-index:3;justify-content:flex-end;padding:12px;border-bottom:0;background:linear-gradient(180deg,color-mix(in srgb,#000 55%,transparent),transparent)}
.yc-info-sheet:has(.yc-pstory-media) .yc-sheet-head>div{display:none}
.yc-info-sheet:has(.yc-pstory-media) .yc-sheet-close{width:40px;height:40px;flex-basis:40px;background:color-mix(in srgb,#000 55%,transparent);color:#fff;font-size:var(--yc-fs-18,18px);transition:background-color .16s ease}
.yc-info-sheet:has(.yc-pstory-media) .yc-sheet-close:hover{background:var(--yc-primary)}
.yc-info-sheet:has(.yc-pstory-media) .yc-sheet-handle{background:color-mix(in srgb,#fff 40%,transparent)}

/* Gövde: medya kenardan kenara */
.yc-info-sheet:has(.yc-pstory-media) .yc-sheet-body{padding:0;overflow:hidden;display:grid;place-items:center;background:#0b0c0e}
.yc-info-sheet:has(.yc-pstory-media) .yc-sheet-footer{display:none}
.yc-sheet-body .yc-pstory-media{border-radius:0;background:#0b0c0e}
.yc-sheet-body .yc-pstory-media.is-embed,.yc-sheet-body .yc-pstory-media.is-file{width:100%}
.yc-sheet-body .yc-pstory-media>img{max-height:86dvh;width:auto;max-width:100%}

@media(max-width:900px){
  .yc-info-sheet:has(.yc-pstory-media){width:100%;max-height:92dvh;border-radius:18px 18px 0 0}
  .yc-info-sheet:has(.yc-pstory-media) .yc-sheet-head{padding:10px}
  .yc-info-sheet:has(.yc-pstory-media) .yc-sheet-body{align-content:center}
}
