/* Vitrin — Trendyol düzeni, floopping yeşili. Sadece açık tema.
   Layout: üst link barı · beyaz header (logo | geniş arama | hesap-favori-sepet) · kategori menüsü + mega panel ·
           beyaz içerik, ince gri çerçeveli kartlar · açık footer · mobilde alt tab bar */
:root{
  --sf-cta:#C7FF4A;--sf-cta-2:#B4F02C;--sf-ink:#0B0F14;--sf-price:#3B7A00;--sf-green-bg:#F1FFD6;--sf-green-tx:#2F6200;
  --sf-tx:#333333;--sf-tx2:#666666;--sf-tx3:#999999;--sf-bd:#E6E6E6;--sf-bg2:#F5F5F5;--sf-bg3:#FAFAFA;--sf-white:#FFFFFF;
  --sf-star:#FFB400;--sf-red:#D0021B;--sf-s1:#F1FFD6;--sf-s2:#EAF1FB;--sf-s3:#FDEFF4;--sf-s4:#FFF5E6;
  --sf-font:"Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;
}
.sf{min-height:100%;background:var(--sf-white);color:var(--sf-tx);font:400 14px/1.45 var(--sf-font)}
.sf h1,.sf h2,.sf h3,.sf h4{font-family:var(--sf-font);letter-spacing:0;font-weight:700;color:var(--sf-tx)}
.sf-wrap{max-width:1200px;margin-inline:auto;padding-inline:16px}
.sf button{font-family:inherit}
.sf .pimg{background:linear-gradient(160deg,hsl(var(--hue) 40% 97%),hsl(var(--hue) 35% 91%));color:hsl(var(--hue) 30% 52%)}
.sf .pimg .ic{stroke-width:1}

/* Butonlar */
.sf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:6px;border:1px solid transparent;background:var(--sf-cta);color:var(--sf-ink);font-weight:700;font-size:15px;white-space:nowrap;cursor:pointer;transition:background-color .15s}
.sf-btn:hover{background:var(--sf-cta-2)}
.sf-btn--out{background:var(--sf-white);border-color:var(--sf-bd);color:var(--sf-tx)}
.sf-btn--out:hover{background:var(--sf-bg3);border-color:var(--sf-tx3)}
.sf-btn--ink{background:var(--sf-ink);color:var(--sf-white)}
.sf-btn--ink:hover{background:#222}
.sf-btn--block{width:100%}
.sf-btn--lg{min-height:52px;font-size:16px}
.sf-btn[disabled]{background:var(--sf-bg2);color:var(--sf-tx3);pointer-events:none}
.sf-link{background:none;border:0;padding:0;color:var(--sf-price);font-weight:600;cursor:pointer}
.sf-link:hover{text-decoration:underline}

/* Üst bar */
.sf-top{border-bottom:1px solid var(--sf-bd);font-size:12px;color:var(--sf-tx2)}
.sf-top .sf-wrap{display:flex;justify-content:space-between;align-items:center;min-height:32px;gap:12px}
.sf-top nav{display:flex;gap:18px}
.sf-top button{background:none;border:0;padding:0;color:inherit;font-size:12px;cursor:pointer}
.sf-top button:hover{color:var(--sf-price)}
.sf-top b{color:var(--sf-ink)}
.sf-top__promo{display:inline-flex;align-items:center;gap:6px}

/* Header */
.sf-hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--sf-white);box-shadow:0 1px 0 var(--sf-bd)}
.sf-hdr__bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:32px;align-items:center;min-height:76px}
.sf-logo{display:inline-flex;align-items:flex-end;gap:3px;background:none;border:0;padding:0;font:800 30px/1 var(--sf-font);letter-spacing:-1.5px;color:var(--sf-ink);cursor:pointer}
.sf-logo i{width:9px;height:9px;border-radius:50%;background:var(--sf-cta-2);margin-bottom:5px;box-shadow:0 0 0 2px var(--sf-ink)}
.sf-search{position:relative;max-width:720px;width:100%;justify-self:center}
.sf-search input{width:100%;height:44px;padding:0 48px 0 16px;border-radius:6px;border:2px solid transparent;background:var(--sf-bg2);font-size:14px;color:var(--sf-tx)}
.sf-search input::placeholder{color:var(--sf-tx3)}
.sf-search input:focus{outline:none;border-color:var(--sf-cta-2);background:var(--sf-white)}
.sf-search__btn{position:absolute;right:4px;top:4px;width:36px;height:36px;border:0;background:none;color:var(--sf-price);display:grid;place-items:center;cursor:pointer}
.suggest{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--sf-white);border:1px solid var(--sf-bd);border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:6px;z-index:5;max-height:min(420px,60vh);overflow:auto}
.suggest button{display:flex;align-items:center;gap:12px;width:100%;padding:8px 10px;border:0;border-radius:4px;background:none;text-align:left;color:var(--sf-tx);cursor:pointer}
.suggest button:hover{background:var(--sf-bg2)}
.suggest small{color:var(--sf-tx3)}
.sf-acts{display:flex;align-items:center;gap:6px}
.sf-act{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 10px;border:0;border-radius:6px;background:none;color:var(--sf-tx);font-size:14px;cursor:pointer}
.sf-act:hover{color:var(--sf-price)}
.sf-act .ic{width:22px;height:22px}
.sf-cnt{position:absolute;top:2px;left:22px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--sf-cta);color:var(--sf-ink);font-size:11px;font-weight:700;display:grid;place-items:center;box-shadow:0 0 0 2px var(--sf-white)}

/* Kategori menüsü + mega panel */
.sf-nav{position:relative;border-top:1px solid var(--sf-bd)}
.sf-nav__row{display:flex;align-items:center;gap:2px;min-height:42px}
.sf-nav__item>button,.sf-nav__flash{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 10px;border:0;background:none;font-size:14px;font-weight:600;color:var(--sf-tx);white-space:nowrap;cursor:pointer}
.sf-nav__item>button::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;background:var(--sf-cta-2);transform:scaleX(0);transition:transform .2s}
.sf-nav__item:hover>button,.sf-nav__item>button.is-on{color:var(--sf-price)}
.sf-nav__item:hover>button::after,.sf-nav__item>button.is-on::after{transform:none}
.sf-nav__flash{margin-left:auto;color:var(--sf-price)}
.sf-nav__flash span{padding:1px 6px;border-radius:4px;background:var(--sf-cta);color:var(--sf-ink);font-size:10px;font-weight:800}
.sf-mega{position:absolute;left:0;right:0;top:100%;z-index:30;background:var(--sf-white);border-top:1px solid var(--sf-bd);box-shadow:0 12px 24px rgba(0,0,0,.1);display:none}
.sf-mega__in{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 260px;gap:24px;padding-block:20px}
.sf-mega h4{font-size:14px;color:var(--sf-price);margin-bottom:10px}
.sf-mega ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.sf-mega li button{background:none;border:0;padding:0;color:var(--sf-tx2);font-size:14px;text-align:left;cursor:pointer}
.sf-mega li button:hover{color:var(--sf-price)}
.sf-mega__promo{display:grid;gap:8px;align-content:start;padding:16px;border-radius:8px;background:var(--sf-s1);text-align:left;border:0;cursor:pointer}
.sf-mega__promo b{font-size:18px}
@media (hover:hover) and (min-width:1101px){.sf-nav__item:hover .sf-mega{display:block}}
@media (max-width:1100px){.sf-nav__row{overflow-x:auto;scrollbar-width:none}.sf-nav__row::-webkit-scrollbar{display:none}.sf-nav__flash{margin-left:0}}

/* Sayfa iskeleti */
.sf-main{padding-block:16px 48px;display:grid;gap:28px}
.sf-sec__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.sf-sec__head h2{font-size:20px;display:flex;align-items:center;gap:10px}
.sf-sec__head .sf-link{display:inline-flex;align-items:center;gap:2px;font-size:14px}
.sf-crumbs{display:flex;flex-wrap:wrap;gap:6px;font-size:12px;color:var(--sf-tx3)}
.sf-crumbs button{background:none;border:0;padding:0;color:inherit;font-size:12px;cursor:pointer}
.sf-crumbs button:hover{color:var(--sf-price)}
.sf-crumbs span::before{content:">";margin-right:6px}

/* Story halkaları */
.sf-stories{display:flex;gap:16px;overflow-x:auto;scrollbar-width:none;padding:4px 2px}
.sf-stories::-webkit-scrollbar{display:none}
.sf-story{display:grid;justify-items:center;gap:6px;flex:0 0 auto;width:84px;background:none;border:0;padding:0;font-size:12px;font-weight:600;color:var(--sf-tx);text-align:center;cursor:pointer}
.sf-story__ring{width:76px;height:76px;border-radius:50%;padding:3px;background:conic-gradient(var(--sf-cta-2),var(--sf-price),var(--sf-cta),var(--sf-cta-2))}
.sf-story__ring .pimg{width:100%;height:100%;border-radius:50%;aspect-ratio:1;border:3px solid var(--sf-white)}
.sf-story:hover .sf-story__ring{transform:scale(1.04)}

/* Banner */
.sf-banner{position:relative;border-radius:8px;overflow:hidden;height:clamp(190px,28vw,340px)}
.sf-slide{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;padding:0 clamp(24px,6vw,72px);opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
.sf-slide.is-on{opacity:1;visibility:visible}
.sf-slide__tag{display:inline-block;padding:4px 10px;border-radius:4px;background:var(--sf-ink);color:var(--sf-cta);font-size:12px;font-weight:700;margin-bottom:12px}
.sf-slide h1{font-size:clamp(22px,3.6vw,42px);line-height:1.05;font-weight:800;max-width:13em}
.sf-slide p{color:var(--sf-tx2);margin:10px 0 18px;font-size:clamp(13px,1.4vw,16px);max-width:30em}
.sf-slide__ill{justify-self:center;width:min(260px,70%);aspect-ratio:1;border-radius:50%;background:var(--sf-white);display:grid;place-items:center;box-shadow:0 20px 50px -20px rgba(0,0,0,.25)}
.sf-slide__ill .ic{width:55%;height:55%;stroke-width:1}
.sf-banner__nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:var(--sf-white);box-shadow:0 2px 8px rgba(0,0,0,.15);display:grid;place-items:center;cursor:pointer;color:var(--sf-tx)}
.sf-banner__nav--l{left:12px}.sf-banner__nav--r{right:12px}
.sf-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:6px}
.sf-dots button{width:8px;height:8px;border-radius:999px;border:0;padding:0;background:rgba(0,0,0,.2);cursor:pointer;transition:width .2s}
.sf-dots button.is-on{width:24px;background:var(--sf-ink)}
@media (max-width:640px){.sf-slide{grid-template-columns:1fr 96px;padding:0 20px}.sf-slide__ill{width:96px}.sf-banner__nav{display:none}.sf-slide .sf-btn{min-height:38px;padding:0 14px;font-size:13px}}

/* Kampanya kutuları */
.sf-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.sf-tile{display:flex;align-items:center;gap:12px;padding:16px;border-radius:8px;border:0;text-align:left;cursor:pointer;color:var(--sf-tx)}
.sf-tile .ic{width:34px;height:34px;flex-shrink:0;padding:7px;border-radius:50%;background:var(--sf-white);color:var(--sf-ink)}
.sf-tile b{display:block;font-size:15px}
.sf-tile small{color:var(--sf-tx2);font-size:12px}
@media (max-width:900px){.sf-tiles{grid-template-columns:repeat(4,minmax(220px,1fr));overflow-x:auto;scrollbar-width:none}}

/* Flaş */
.sf-flash{padding:16px;border-radius:8px;border:1px solid var(--sf-bd)}
.sf-flash__title{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:6px;background:var(--sf-cta);color:var(--sf-ink);font-size:16px;font-weight:800}
.sf-timer{display:inline-flex;align-items:center;gap:4px;font-weight:700;font-size:14px;color:var(--sf-tx2)}
.sf-timer span{min-width:30px;height:28px;display:grid;place-items:center;border-radius:4px;background:var(--sf-ink);color:var(--sf-white);font-variant-numeric:tabular-nums}

/* Yatay kaydırmalı ürün sırası */
.sf-rowwrap{position:relative}
.sf-row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/5);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px}
.sf-row::-webkit-scrollbar{display:none}
.sf-row>*{scroll-snap-align:start}
.sf-rowbtn{position:absolute;top:38%;z-index:3;width:40px;height:40px;border-radius:50%;border:1px solid var(--sf-bd);background:var(--sf-white);box-shadow:0 2px 8px rgba(0,0,0,.12);display:grid;place-items:center;cursor:pointer;color:var(--sf-tx)}
.sf-rowbtn--l{left:-14px}.sf-rowbtn--r{right:-14px}
@media (max-width:1100px){.sf-row{grid-auto-columns:calc((100% - 36px)/4)}}
@media (max-width:860px){.sf-row{grid-auto-columns:calc((100% - 12px)/2.3)}.sf-rowbtn{display:none}}

/* Ürün grid + kart */
.sf-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.sf-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.sf-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.sf-grid--4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.sf-grid,.sf-grid--4{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}}
.sf-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--sf-bd);border-radius:8px;background:var(--sf-white);overflow:hidden;cursor:pointer;min-width:0;transition:box-shadow .2s}
.sf-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.12)}
.sf-card__img{position:relative}
.sf-card__img .pimg{aspect-ratio:3/4}
.sf-fav{position:absolute;right:8px;top:8px;z-index:2;width:34px;height:34px;border-radius:50%;border:0;background:var(--sf-white);box-shadow:0 2px 6px rgba(0,0,0,.15);display:grid;place-items:center;color:var(--sf-tx3);cursor:pointer}
.sf-fav .ic{width:18px;height:18px}
.sf-fav.is-on{color:var(--sf-red)}
.sf-fav.is-on .ic{fill:currentColor}
.sf-tag{position:absolute;left:8px;top:8px;z-index:2;padding:3px 8px;border-radius:4px;background:var(--sf-ink);color:var(--sf-cta);font-size:11px;font-weight:700}
.sf-tag--deal{background:var(--sf-cta);color:var(--sf-ink)}
.sf-stamps{position:absolute;left:6px;bottom:6px;right:6px;display:flex;flex-wrap:wrap;gap:4px}
.sf-stamps span{display:inline-flex;align-items:center;gap:3px;padding:2px 6px;border-radius:4px;background:var(--sf-white);border:1px solid var(--sf-bd);font-size:10px;font-weight:700;color:var(--sf-tx)}
.sf-stamps .ic{width:12px;height:12px;stroke-width:2.2}
.sf-stamps .is-ship{color:var(--sf-green-tx)}
.sf-card__body{display:flex;flex-direction:column;gap:4px;padding:8px 10px 12px;flex:1}
.sf-card__name{font-size:14px;line-height:1.35;color:var(--sf-tx2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.sf-card__name b{color:var(--sf-tx);font-weight:700}
.sf-rate{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--sf-tx3)}
.sf-rate b{color:var(--sf-tx);font-weight:600}
.sf-rate .stars__s .ic{width:12px;height:12px}
.sf-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;margin-top:auto;padding-top:2px}
.sf-price s{font-size:12px;color:var(--sf-tx3)}
.sf-price b{font-size:16px;font-weight:700;color:var(--sf-price)}
.sf-deal{display:flex;flex-direction:column;gap:0;padding:4px 8px;border-radius:4px;background:var(--sf-green-bg);color:var(--sf-green-tx);font-size:11px;font-weight:600}
.sf-deal b{font-size:14px}
.sf-low{font-size:11px;font-weight:700;color:var(--sf-red)}
.sf-card__add{position:absolute;left:10px;right:10px;bottom:10px;min-height:38px;border:0;border-radius:6px;background:var(--sf-cta);color:var(--sf-ink);font-weight:700;font-size:14px;cursor:pointer;opacity:0;transform:translateY(6px);transition:opacity .15s,transform .15s}
@media (hover:hover){.sf-card:hover .sf-card__add{opacity:1;transform:none}}
@media (hover:none){.sf-card__add{display:none}}

/* Kupon şeridi */
.sf-coupon{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 24px;border-radius:8px;background:var(--sf-ink);color:var(--sf-white)}
.sf-coupon h2{color:var(--sf-white);font-size:20px}
.sf-coupon p{color:#B9C0C8;margin-top:2px}
.sf-coupon code{padding:2px 8px;border-radius:4px;background:var(--sf-cta);color:var(--sf-ink);font-weight:800;font-family:inherit}
.sf-coupon__cut{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 16px;border:1.5px dashed #5E6773;border-radius:8px;font-weight:800;letter-spacing:1px}

/* Listeleme */
.sf-list{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;align-items:start}
.sf-filter{position:sticky;top:130px;max-height:calc(100vh - 150px);overflow:auto;scrollbar-width:thin}
.sf-filter details{border-bottom:1px solid var(--sf-bd);padding:12px 0}
.sf-filter summary{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:14px;cursor:pointer;list-style:none}
.sf-filter summary::-webkit-details-marker{display:none}
.sf-filter summary .ic{width:16px;height:16px;transition:transform .2s}
.sf-filter details[open] summary .ic{transform:rotate(180deg)}
.sf-fopts{display:grid;gap:8px;margin-top:10px;max-height:220px;overflow:auto}
.sf-fopts label{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--sf-tx2);cursor:pointer}
.sf-fopts label small{margin-left:auto;color:var(--sf-tx3)}
.sf-fopts input{width:16px;height:16px;accent-color:var(--sf-price);margin:0}
.sf-fhead{display:none}
.sf-rhead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.sf-rhead p{font-size:14px;color:var(--sf-tx2)}
.sf-rhead p b{color:var(--sf-tx)}
.sf-select{height:40px;padding:0 34px 0 12px;border:1px solid var(--sf-bd);border-radius:6px;background:var(--sf-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23333' stroke-width='2'%3E%3Cpath d='m2 4 4 4 4-4'/%3E%3C/svg%3E") no-repeat right 12px center;appearance:none;-webkit-appearance:none;font-size:14px;color:var(--sf-tx);cursor:pointer}
.sf-qchips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:14px}
.sf-qchips::-webkit-scrollbar{display:none}
.sf-qchip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--sf-bd);background:var(--sf-white);font-size:13px;font-weight:600;color:var(--sf-tx);cursor:pointer}
.sf-qchip.is-on{background:var(--sf-green-bg);border-color:var(--sf-price);color:var(--sf-green-tx)}
.sf-qchip .ic{width:14px;height:14px}
.sf-mob-only{display:none}
@media (max-width:960px){
  .sf-list{grid-template-columns:1fr}
  .sf-filter{position:fixed;inset:0 auto 0 0;top:0;max-height:none;width:min(340px,88vw);z-index:70;background:var(--sf-white);padding:calc(12px + env(safe-area-inset-top,0px)) 16px 24px;transform:translateX(-102%);transition:transform .3s}
  .sf-filter.is-open{transform:none}
  .sf-fhead{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}
  .sf-mob-only{display:inline-flex}
}

/* Ürün detay */
.sf-pd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start}
.sf-gal{position:sticky;top:130px;display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px}
.sf-gal__thumbs{display:grid;gap:8px;align-content:start}
.sf-gal__thumbs button{padding:0;border:2px solid var(--sf-bd);border-radius:6px;overflow:hidden;background:none;cursor:pointer}
.sf-gal__thumbs button.is-on{border-color:var(--sf-price)}
.sf-gal__thumbs .pimg{aspect-ratio:3/4}
.sf-gal__main{position:relative;border:1px solid var(--sf-bd);border-radius:8px;overflow:hidden}
.sf-gal__main .pimg{aspect-ratio:3/4}
.sf-info{display:grid;gap:14px}
.sf-info h1{font-size:20px;font-weight:400;line-height:1.35;color:var(--sf-tx)}
.sf-info h1 button{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--sf-tx);cursor:pointer}
.sf-info h1 button:hover{color:var(--sf-price)}
.sf-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:var(--sf-tx2)}
.sf-meta b{color:var(--sf-tx)}
.sf-meta .sf-link{font-weight:400;color:var(--sf-tx2);text-decoration:underline}
.sf-seller{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--sf-tx2)}
.sf-seller b{color:var(--sf-tx)}
.sf-score{padding:1px 6px;border-radius:4px;background:var(--sf-price);color:var(--sf-white);font-weight:700;font-size:12px}
.sf-pprice{display:grid;gap:4px}
.sf-pprice s{color:var(--sf-tx3);font-size:14px}
.sf-pprice b{font-size:26px;font-weight:700;color:var(--sf-price);line-height:1}
.sf-pprice small{color:var(--sf-tx2)}
.sf-pdeal{display:inline-flex;align-items:center;gap:8px;justify-self:start;padding:6px 10px;border-radius:6px;background:var(--sf-green-bg);color:var(--sf-green-tx);font-weight:600;font-size:13px}
.sf-pdeal b{font-size:16px}
.sf-optl{font-size:14px;color:var(--sf-tx2);margin-bottom:8px}
.sf-optl b{color:var(--sf-tx)}
.sf-colors{display:flex;gap:8px;flex-wrap:wrap}
.sf-color{display:grid;justify-items:center;gap:4px;width:64px;padding:4px;border-radius:6px;border:1.5px solid var(--sf-bd);background:var(--sf-white);font-size:11px;color:var(--sf-tx2);cursor:pointer}
.sf-color i{display:block;width:100%;aspect-ratio:1;border-radius:4px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.sf-color.is-on{border-color:var(--sf-price);color:var(--sf-tx);font-weight:600}
.sf-sizes{display:flex;gap:8px;flex-wrap:wrap}
.sf-size{min-width:52px;height:40px;padding:0 12px;border-radius:6px;border:1px solid var(--sf-bd);background:var(--sf-white);font-size:14px;color:var(--sf-tx);cursor:pointer}
.sf-size:hover{border-color:var(--sf-tx2)}
.sf-size.is-on{border:2px solid var(--sf-price);color:var(--sf-price);font-weight:700}
.sf-size:disabled{color:var(--sf-tx3);background:var(--sf-bg3);text-decoration:line-through;cursor:not-allowed}
.sf-buy{display:flex;gap:10px}
.sf-buy .sf-btn{flex:1}
.sf-heart{width:52px;height:52px;flex-shrink:0;border-radius:6px;border:1px solid var(--sf-bd);background:var(--sf-white);display:grid;place-items:center;color:var(--sf-tx3);cursor:pointer}
.sf-heart.is-on{color:var(--sf-red)}
.sf-heart.is-on .ic{fill:currentColor}
.sf-box{border:1px solid var(--sf-bd);border-radius:8px;padding:14px 16px;display:grid;gap:10px}
.sf-box__row{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--sf-tx2)}
.sf-box__row .ic{width:18px;height:18px;color:var(--sf-price);margin-top:1px}
.sf-box__row b{color:var(--sf-tx)}
.sf-hl{margin:0;padding-left:18px;display:grid;gap:4px;font-size:13px;color:var(--sf-tx2)}
.sf-qty{display:inline-flex;align-items:center;border:1px solid var(--sf-bd);border-radius:6px}
.sf-qty button{width:34px;height:34px;border:0;background:none;display:grid;place-items:center;color:var(--sf-tx);cursor:pointer}
.sf-qty button .ic{width:16px;height:16px}
.sf-qty span{min-width:28px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.sf-block{border:1px solid var(--sf-bd);border-radius:8px}
.sf-block__h{padding:14px 18px;border-bottom:1px solid var(--sf-bd);font-size:16px;font-weight:700}
.sf-block__b{padding:16px 18px}
.sf-specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.sf-specs div{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:6px;background:var(--sf-bg2);font-size:13px}
.sf-specs dt{color:var(--sf-tx2)}.sf-specs dd{margin:0;font-weight:600;text-align:right}
.sf-rsum{display:flex;gap:24px;align-items:center;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--sf-bd)}
.sf-rsum__big{font-size:40px;font-weight:700;line-height:1}
.sf-bars{display:grid;gap:4px;flex:1;min-width:200px;max-width:360px}
.sf-bars div{display:grid;grid-template-columns:30px 1fr 36px;gap:8px;align-items:center;font-size:12px;color:var(--sf-tx2)}
.sf-bars i{display:block;height:6px;border-radius:6px;background:var(--sf-bg2);overflow:hidden}
.sf-bars i span{display:block;height:100%;background:var(--sf-star)}
.sf-rev{display:grid;gap:4px;padding:14px 0;border-bottom:1px solid var(--sf-bd)}
.sf-rev:last-child{border-bottom:0}
.sf-rev__m{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--sf-tx3)}
.sf-sticky{display:none}
@media (max-width:860px){
  .sf-pd{grid-template-columns:1fr;gap:16px}
  .sf-gal{position:static;grid-template-columns:1fr}
  .sf-gal__thumbs{grid-auto-flow:column;grid-auto-columns:60px;order:2;overflow-x:auto}
  .sf-specs{grid-template-columns:1fr}
  .sf-buy{display:none}
  .sf-sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:55;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:var(--sf-white);border-top:1px solid var(--sf-bd);box-shadow:0 -4px 16px rgba(0,0,0,.08)}
  .sf-sticky .sf-btn{flex:1}
  .sf-sticky b{display:block;font-size:18px;color:var(--sf-price)}
  .sf-sticky s{font-size:12px;color:var(--sf-tx3)}
  .is-pd .sf-tabbar{display:none}
}

/* Sepet & ödeme */
.sf-cart{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}
.sf-sbox{border:1px solid var(--sf-bd);border-radius:8px;overflow:hidden}
.sf-sbox__h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;background:var(--sf-bg3);border-bottom:1px solid var(--sf-bd);font-size:13px}
.sf-sbox__h b{color:var(--sf-tx)}
.sf-free{display:inline-flex;align-items:center;gap:6px;color:var(--sf-green-tx);font-weight:600}
.sf-free .ic{width:16px;height:16px}
.sf-ci{display:grid;grid-template-columns:90px minmax(0,1fr) auto;gap:14px;padding:16px;border-bottom:1px solid var(--sf-bd);align-items:start}
.sf-ci:last-child{border-bottom:0}
.sf-ci .pimg{aspect-ratio:3/4;border-radius:6px;border:1px solid var(--sf-bd)}
.sf-ci__name{font-size:14px;color:var(--sf-tx2)}
.sf-ci__name b{color:var(--sf-tx)}
.sf-ci__var{font-size:12px;color:var(--sf-tx3)}
.sf-ci__ship{font-size:12px;color:var(--sf-green-tx);font-weight:600;display:inline-flex;align-items:center;gap:4px}
.sf-ci__ship .ic{width:14px;height:14px}
.sf-ci__right{display:grid;justify-items:end;gap:10px}
.sf-ci__right b{font-size:16px;color:var(--sf-price)}
.sf-ci__right s{font-size:12px;color:var(--sf-tx3)}
.sf-sum{position:sticky;top:130px;display:grid;gap:12px}
.sf-sum__card{border:1px solid var(--sf-bd);border-radius:8px;padding:16px;display:grid;gap:12px}
.sf-sum__card h3{font-size:18px;font-weight:700}
.sf-sumlist{display:grid;gap:8px;font-size:14px;color:var(--sf-tx2)}
.sf-sumlist div{display:flex;justify-content:space-between;gap:12px}
.sf-sumlist .g{color:var(--sf-green-tx);font-weight:600}
.sf-sumlist .t{padding-top:10px;border-top:1px solid var(--sf-bd);color:var(--sf-tx);font-weight:700;font-size:15px}
.sf-sumlist .t b{font-size:20px;color:var(--sf-price)}
.sf-progress{padding:10px 12px;border-radius:6px;background:var(--sf-green-bg);font-size:13px;color:var(--sf-green-tx)}
.sf-progress i{display:block;height:5px;border-radius:5px;background:var(--sf-white);margin-top:6px;overflow:hidden}
.sf-progress i span{display:block;height:100%;background:var(--sf-price)}
.sf-code summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--sf-price);list-style:none;display:flex;align-items:center;gap:6px}
.sf-code summary::-webkit-details-marker{display:none}
.sf-code form{display:flex;gap:8px;margin-top:10px}
.sf-code .input{min-height:40px;text-transform:uppercase;border-radius:6px}
.sf-cartbar{display:none}
.sf-steps{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--sf-tx3);flex-wrap:wrap}
.sf-steps span{display:inline-flex;align-items:center;gap:6px}
.sf-steps i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;background:var(--sf-bg2);color:var(--sf-tx2)}
.sf-steps .is-on{color:var(--sf-tx);font-weight:600}
.sf-steps .is-on i{background:var(--sf-ink);color:var(--sf-cta)}
.sf-opt{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:8px;border:1px solid var(--sf-bd);cursor:pointer}
.sf-opt:has(input:checked){border:2px solid var(--sf-price);padding:13px 15px;background:var(--sf-bg3)}
.sf-opt input{margin-top:3px;width:18px;height:18px;accent-color:var(--sf-price)}
.sf-opt b{display:flex;align-items:center;gap:6px}
.sf-opt small{color:var(--sf-tx2)}
.sf-opt__p{margin-left:auto;font-weight:700;white-space:nowrap}
.sf .check input{accent-color:var(--sf-price)}
.sf .input,.sf .select,.sf .textarea{border-radius:6px;border-color:var(--sf-bd)}
.sf .input:focus,.sf .select:focus,.sf .textarea:focus{border-color:var(--sf-price);box-shadow:0 0 0 3px rgba(180,240,44,.35)}
@media (max-width:900px){
  .sf-cart{grid-template-columns:1fr}
  .sf-sum{position:static}
  .sf-cart .sf-sum__card>.sf-btn{display:none}
  .sf-cartbar{display:flex;position:fixed;left:0;right:0;bottom:calc(56px + env(safe-area-inset-bottom,0px));z-index:52;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:var(--sf-white);border-top:1px solid var(--sf-bd);box-shadow:0 -4px 16px rgba(0,0,0,.08)}
  .sf-cartbar small{display:block;color:var(--sf-tx2);font-size:12px}
  .sf-cartbar b{font-size:18px;color:var(--sf-price)}
  .sf-cartbar .sf-btn{min-width:160px}
  .sf-main.has-bar{padding-bottom:180px}
}
@media (max-width:520px){.sf-ci{grid-template-columns:76px minmax(0,1fr)}.sf-ci__right{grid-column:1/-1;grid-auto-flow:column;justify-content:space-between;align-items:center}}

.sf-ok{display:grid;justify-items:center;gap:12px;text-align:center;padding:clamp(32px,6vw,64px) 16px;border:1px solid var(--sf-bd);border-radius:8px}
.sf-ok__ic{width:72px;height:72px;border-radius:50%;background:var(--sf-cta);display:grid;place-items:center;color:var(--sf-ink)}
.sf-ok__ic .ic{width:36px;height:36px;stroke-width:2.6}

/* Hesabım */
.sf-acc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:20px;align-items:start}
.sf-accnav{border:1px solid var(--sf-bd);border-radius:8px;overflow:hidden}
.sf-accnav__me{padding:14px 16px;border-bottom:1px solid var(--sf-bd);background:var(--sf-bg3)}
.sf-accnav__me small{display:block;color:var(--sf-tx3);font-size:12px}
.sf-accnav button{display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:0 16px;border:0;border-bottom:1px solid var(--sf-bd);background:none;font-size:14px;color:var(--sf-tx);text-align:left;cursor:pointer}
.sf-accnav button:last-child{border-bottom:0}
.sf-accnav button.is-on{color:var(--sf-price);font-weight:700;background:var(--sf-green-bg)}
.sf-accnav button .ic{width:18px;height:18px}
@media (max-width:860px){.sf-acc{grid-template-columns:1fr}.sf-accnav{display:flex;overflow-x:auto}.sf-accnav__me{display:none}.sf-accnav button{flex-shrink:0;width:auto;border-bottom:0;border-right:1px solid var(--sf-bd)}}
.sf-oc{border:1px solid var(--sf-bd);border-radius:8px;overflow:hidden}
.sf-oc__h{display:flex;flex-wrap:wrap;gap:8px 28px;padding:10px 16px;background:var(--sf-bg3);border-bottom:1px solid var(--sf-bd);font-size:12px;color:var(--sf-tx3)}
.sf-oc__h b{display:block;color:var(--sf-tx);font-size:13px}
.sf-oc__b{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:14px 16px}
.sf-thumbs{display:flex;gap:6px;align-items:center}
.sf-thumbs .pimg{width:48px;height:64px;aspect-ratio:auto;border-radius:4px;border:1px solid var(--sf-bd)}
.sf-thumbs .pimg .ic{width:55%}
.sf-track{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.sf-track div{display:grid;gap:6px;font-size:12px;color:var(--sf-tx3);text-align:center}
.sf-track i{display:block;height:5px;border-radius:5px;background:var(--sf-bg2)}
.sf-track .done{color:var(--sf-tx);font-weight:600}
.sf-track .done i{background:var(--sf-price)}
.sf-empty{display:grid;justify-items:center;gap:10px;text-align:center;padding:56px 16px;border:1px solid var(--sf-bd);border-radius:8px;color:var(--sf-tx2)}
.sf-empty .ic{width:44px;height:44px;color:var(--sf-tx3)}
.sf-empty h3{font-size:18px}

/* Footer */
.sf-foot{border-top:1px solid var(--sf-bd);background:var(--sf-white);margin-top:24px}
.sf-foot__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) 1.3fr;gap:24px;padding-block:36px}
.sf-foot h4{font-size:15px;margin-bottom:12px}
.sf-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sf-foot li button{background:none;border:0;padding:0;font-size:14px;color:var(--sf-tx2);text-align:left;cursor:pointer}
.sf-foot li button:hover{color:var(--sf-price)}
.sf-pays{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.sf-pays span{padding:5px 10px;border:1px solid var(--sf-bd);border-radius:4px;font-size:12px;font-weight:700;color:var(--sf-tx)}
.sf-foot__trust{display:grid;gap:10px;font-size:13px;color:var(--sf-tx2)}
.sf-foot__trust div{display:flex;gap:8px;align-items:center}
.sf-foot__trust .ic{width:18px;height:18px;color:var(--sf-price)}
.sf-foot__bottom{background:var(--sf-bg2);font-size:12px;color:var(--sf-tx2)}
.sf-foot__bottom .sf-wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:14px}
@media (max-width:900px){.sf-foot__grid{grid-template-columns:1fr 1fr}.sf-foot__grid>div:last-child{grid-column:1/-1}.sf-foot{padding-bottom:calc(60px + env(safe-area-inset-bottom,0px))}}

/* Mobil */
.sf-tabbar{display:none}
@media (max-width:860px){
  .sf-top{display:none}
  .sf-hdr__bar{grid-template-columns:auto 1fr;gap:10px;min-height:0;padding-block:10px}
  .sf-logo{font-size:24px}
  .sf-acts{justify-self:end}
  .sf-act span{display:none}
  .sf-act{padding:0 8px}
  .sf-search{grid-column:1/-1;order:3;max-width:none}
  .sf-hide-m{display:none}
  .sf-main{padding-bottom:90px}
  .sf-tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--sf-white);border-top:1px solid var(--sf-bd);padding-bottom:env(safe-area-inset-bottom,0px)}
  .sf-tabbar button{position:relative;display:grid;justify-items:center;gap:2px;padding:8px 0 6px;border:0;background:none;font-size:11px;color:var(--sf-tx2);cursor:pointer}
  .sf-tabbar button.is-on{color:var(--sf-price);font-weight:700}
  .sf-tabbar .sf-cnt{left:calc(50% + 2px);top:3px}
  #toasts{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
}
.sf .backdrop{z-index:65}

/* Bilgi sayfaları, sözleşmeler */
.sf-prose{font-family:var(--sf-font);font-size:14px;line-height:1.65;color:var(--sf-tx);max-width:75ch;display:grid;gap:10px}
.sf-prose h3{font-family:var(--sf-font);font-size:16px;font-weight:700;letter-spacing:0;margin-top:8px}
.sf-prose p{margin:0;color:var(--sf-tx2)}
.sf-prose ol{margin:0;padding-left:20px;display:grid;gap:4px;color:var(--sf-tx2)}
.sf-prose .dl{font-size:13px}
.sf-ctable{width:100%;border-collapse:collapse;font-size:13px}
.sf-ctable th,.sf-ctable td{padding:8px 10px;border-bottom:1px solid var(--sf-bd);text-align:left}
.sf-ctable th{background:var(--sf-bg2);font-weight:600}
.sf-faq{border-bottom:1px solid var(--sf-bd);padding:12px 0}
.sf-faq summary{display:flex;justify-content:space-between;gap:12px;align-items:center;font-weight:700;cursor:pointer;list-style:none}
.sf-faq summary::-webkit-details-marker{display:none}
.sf-faq summary .ic{width:16px;height:16px;flex-shrink:0;transition:transform .2s}
.sf-faq[open] summary .ic{transform:rotate(180deg)}
.sf-faq p{margin-top:8px;color:var(--sf-tx2)}
.sf-cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
@media (max-width:760px){.sf-cgrid{grid-template-columns:1fr}}
.sf-corp{display:none}
form:has(#ad-corp:checked) .sf-corp{display:grid}
.sf-kunye{display:flex;flex-wrap:wrap;gap:4px 16px;padding-block:14px;border-top:1px solid var(--sf-bd);font-size:12px;color:var(--sf-tx2)}
.sf-kunye b{color:var(--sf-tx)}
.sf-etbis{display:flex;gap:8px;align-items:center;padding:8px 10px;border:1px solid var(--sf-bd);border-radius:6px;font-size:12px}

/* WhatsApp */
.sf-wa{position:fixed;right:20px;bottom:24px;z-index:45;width:52px;height:52px;border-radius:50%;background:#25D366;color:#FFFFFF;display:grid;place-items:center;box-shadow:0 8px 20px -6px rgba(0,0,0,.35);transition:transform .2s}
.sf-wa:hover{transform:scale(1.06)}
.sf-wa .ic{width:26px;height:26px}
@media (max-width:860px){.sf-wa{right:14px;bottom:calc(72px + env(safe-area-inset-bottom,0px));width:46px;height:46px}.sf-wa.is-up{bottom:calc(140px + env(safe-area-inset-bottom,0px))}}

/* Çerez bandı */
.sf-cookie{position:fixed;left:0;right:0;bottom:0;z-index:80;padding:0 16px calc(16px + env(safe-area-inset-bottom,0px))}
.sf-cookie__in{max-width:1000px;margin-inline:auto;display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px 20px;border-radius:10px;background:var(--sf-white);border:1px solid var(--sf-bd);box-shadow:0 10px 40px rgba(0,0,0,.18)}
.sf-cookie__in>div:first-child{flex:1 1 360px;min-width:0;display:grid;gap:6px}
.sf-cookie p{font-size:13px;color:var(--sf-tx2)}
.sf-cookie__prefs{display:grid;gap:6px;font-size:13px}
.sf-cookie__btns{display:flex;gap:8px;flex-wrap:wrap}
.sf-cookie__btns .sf-btn{min-height:40px;font-size:14px}
@media (max-width:860px){.sf-cookie{bottom:calc(56px + env(safe-area-inset-bottom,0px));padding-bottom:8px}.sf-cookie__btns{width:100%}.sf-cookie__btns .sf-btn{flex:1}}

/* Gerçek ürün fotoğrafları */
.pimg.has-img{background:#FFFFFF;color:inherit}
.pimg.has-img img{width:100%;height:100%;object-fit:cover;display:block}
.sf .pimg.has-img{background:#FFFFFF}