/* Dükkanım — Müşteri Pazaryeri — FULL GLASSMORPHISM (mesh gradyan + cam paneller) */
/* Apple kurul — iOS yatay dönüşte otomatik metin büyütmeyi kapat (düzen kaymasın) */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
:root{
  /* ===== CAM (glass) — gradyan-dolgulu, ışıklı, yüzen 3D ===== */
  
  
  
  /* İçerik camı — daha yoğun buzlu, koyu yazı okunur */
  
  
  
  /* Blur + doygunluk: saturate arkadaki rengi büyütür = gerçek lens hissi */
  
  /* eski adlar (JS inline stilleri) */
     
   
    
   
     
  
     
   
  /* ===== 3D DERİNLİK — çok katmanlı yüzme gölgesi =====
     temas (sıkı) + ortam (geniş yumuşak) + üst inset ışık (specular) + alt inset gölge (kavis) */
  
  
  
  
  
      
       
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
/* MESH GRADYAN — şeftali, coral, tozlu pembe, lavanta, yumuşak mor (parlak ama zengin) */
body{
  color:var(--metin); font-size:16px; line-height:1.45;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  padding-bottom:calc(124px + env(safe-area-inset-bottom));
  min-height:100vh;
  background:
    radial-gradient(85% 55% at 60% -2%, #D6884B 0%, rgba(214,136,75,0) 52%),
    radial-gradient(92% 82% at 14% 106%, #2A1410 0%, rgba(42,20,16,0) 60%),
    radial-gradient(82% 72% at 96% 100%, #3E1C14 0%, rgba(62,28,20,0) 56%),
    linear-gradient(165deg, #834326 0%, #4C261B 50%, #22120E 100%);
  background-attachment:fixed;
}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:transparent;color:inherit}
input,textarea,select{font-family:inherit}
.gizli{display:none !important}
/* TİP: çıplak <b>/<strong> tarayıcı bolder→900 kaçağını kes → ölçek ağırlığı 800 (yalnız stillenmemiş vurguları etkiler) */
b,strong{font-weight:800}

/* ===== ÜST BAR (içerik ekranları) — cam ===== */
.ust{position:sticky;top:0;z-index:20;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border-bottom:1px solid var(--cam-kenar);padding:11px 16px;display:flex;align-items:center;gap:10px;color:var(--ak)}
.ust .geri{font-size:24px;width:42px;height:42px;color:var(--ak);border-radius:13px;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);box-shadow:var(--sh1);border:1px solid var(--cam-kenar);display:grid;place-items:center;flex:0 0 auto;transition:transform .08s}
.ust .geri:active{transform:scale(.92)}
.ust .baslik{font-weight:800;font-size:15px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:-.2px;text-shadow:0 1px 8px rgba(55,16,8,.3)}
.ust .sehir{font-size:13px;color:var(--ak);font-weight:700;background:var(--cam);border:1px solid var(--cam-kenar);padding:5px 12px;border-radius:var(--r-pill)}

.sar{max-width:680px;margin:0 auto;padding:16px}

/* ===== KEŞİF EKRANI (mockup) ===== */
.kesfet-bas{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px;color:var(--ak)}
.konum{display:flex;align-items:center;gap:9px;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);border-radius:var(--r-md);padding:9px 13px;box-shadow:var(--sh1)}
.konum .kik{font-size:15px}
.konum .ktxt{line-height:1.15}.konum .ktxt small{display:block;font-size:14px;color:var(--ak-soluk);font-weight:600}
.konum .ktxt b{font-size:15px;color:var(--ak);font-weight:700}
.konum .kchev{color:var(--ak-soluk);font-size:15px;margin-left:2px}
.bildirim{width:46px;height:46px;flex:0 0 auto;border-radius:50%;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);display:grid;place-items:center;font-size:24px;box-shadow:var(--sh1);position:relative;color:var(--ak)}
/* statik nokta kaldırıldı — gerçek okunmamış sayısı .bildirim-badge ile data-driven gösterilir */
.selam{color:var(--ak);margin:4px 2px 2px}
.selam h1{font-size:24px;font-weight:800;letter-spacing:-.6px;margin:0;text-shadow:0 2px 14px rgba(55,16,8,.28)}
.selam p{font-size:15px;color:var(--ak-soluk);margin:4px 0 0;line-height:1.35}

/* arama + filtre */
.ara-satir{display:flex;gap:10px;margin:16px 0 14px}
.ara-kutu{position:relative;flex:1}
.ara-kutu input{width:100%;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);border:1px solid var(--cam-kenar);border-radius:var(--r-md);
  padding:15px 16px 15px 48px;color:var(--ak);font-size:16px;box-shadow:var(--sh1);transition:border-color .15s,box-shadow .15s}
.ara-kutu input::placeholder{color:var(--ak-soluk)}
.ara-kutu input:focus{outline:none;border-color:rgba(255,255,255,.7);box-shadow:0 0 0 4px rgba(255,255,255,.14),var(--sh1)}
.ara-kutu .ara-ik{position:absolute;left:17px;top:50%;transform:translateY(-50%);font-size:15px;color:var(--ak-soluk);pointer-events:none}
.filtre-btn{width:54px;flex:0 0 auto;border-radius:var(--r-md);background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);display:grid;place-items:center;box-shadow:var(--sh1);color:var(--ak)}
.filtre-btn svg{width:22px;height:22px}

/* kategori çipleri — cam + ince çizgi ikon */
.chip-sira{display:flex;gap:11px;overflow-x:auto;padding:2px 2px 4px;margin:0 -2px 18px;scrollbar-width:none}
.chip-sira::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;width:78px;height:84px;border-radius:20px;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  color:var(--ak);font-size:13px;font-weight:600;box-shadow:var(--sh1);transition:transform .12s,box-shadow .15s,border-color .15s}
.chip svg{width:26px;height:26px;stroke:var(--ak);stroke-width:1.6;fill:none}
.chip:active{transform:scale(.95)}
.chip.aktif{background:linear-gradient(180deg,var(--acc),var(--acc-koyu));border-color:transparent;box-shadow:var(--sh-cta)}
.chip.aktif svg{stroke:#fff}
.chip.aktif span{color:#fff}

/* promo banner — cam + foto */
.promo{position:relative;display:flex;align-items:stretch;overflow:hidden;border-radius:var(--r-lg);
  background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);border:1px solid var(--cam-kenar);
  box-shadow:var(--sh2);margin-bottom:22px;min-height:150px}
.promo-ic{position:relative;flex:1;max-width:63%;padding:18px 16px;display:flex;flex-direction:column;justify-content:center;color:var(--ak);z-index:2}
.promo-ust{font-size:13px;font-weight:700;color:var(--ak);background:rgba(255,255,255,.18);border:1px solid var(--cam-kenar);
  align-self:flex-start;padding:4px 11px;border-radius:var(--r-pill);margin-bottom:9px}
.promo-bas{font-size:24px;font-weight:800;letter-spacing:-.4px;text-shadow:0 2px 10px rgba(55,16,8,.3)}
.promo-alt{font-size:15px;color:var(--ak-soluk);margin:3px 0 13px}
.promo-cta{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);
  border:1px solid var(--cam-kenar);color:var(--ak);font-weight:700;font-size:15px;padding:11px 16px;border-radius:var(--r-pill)}
.promo-foto{position:absolute;right:0;top:0;bottom:0;width:44%;z-index:1}
.promo-foto img{width:100%;height:100%;object-fit:cover;filter:saturate(1.1);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 28%);mask-image:linear-gradient(90deg,transparent,#000 28%)}

/* bölüm başlığı + sırala */
.bolum-bas{display:flex;align-items:center;justify-content:space-between;margin:0 2px 14px;color:var(--ak)}
.bolum-bas h2{font-size:24px;font-weight:800;letter-spacing:-.3px;display:flex;align-items:center;gap:8px;text-shadow:0 1px 8px rgba(55,16,8,.25)}
.sirala{display:inline-flex;align-items:center;gap:6px;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);color:var(--ak);font-weight:700;font-size:15px;padding:9px 13px;border-radius:var(--r-pill);box-shadow:var(--sh1)}

/* ===== RESTORAN KARTI (mockup yatay: foto sol, bilgi sağ) ===== */
.r-kart{display:flex;width:100%;font:inherit;color:var(--ak);text-align:left;cursor:pointer;gap:13px;align-items:stretch;
  background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);border-radius:var(--r-lg);overflow:hidden;margin-bottom:16px;padding:11px;
  box-shadow:var(--sh2);transition:transform .14s,box-shadow .14s}
.r-kart:active{transform:scale(.985);box-shadow:var(--sh1)}
.r-foto{position:relative;width:108px;flex:0 0 auto;border-radius:16px;overflow:hidden;background:linear-gradient(135deg,#E9C7B0,#D7A98C);align-self:stretch;min-height:108px}
.r-foto img{width:100%;height:100%;object-fit:cover;filter:saturate(1.08);position:absolute;inset:0}
.r-kalp{position:absolute;top:7px;left:7px;z-index:2;width:30px;height:30px;border-radius:50%;background:rgba(50,24,14,.32);backdrop-filter:blur(6px);
  display:grid;place-items:center;font-size:15px;border:1px solid rgba(255,255,255,.3)}
.r-kalp.dolu{color:var(--acc,#E8312A)} /* v232 K9 — soluk #FF6B6B yerine tema kırmızısı: dolu-favori okunur */
.r-logo{position:absolute;bottom:6px;right:6px;z-index:3;width:32px;height:32px;border-radius:9px;overflow:hidden;background:#fff;border:2px solid #fff;box-shadow:0 2px 8px rgba(40,14,8,.4)}
.r-logo img{width:100%;height:100%;object-fit:cover}
.m-logo{position:absolute;top:12px;left:12px;z-index:3;width:54px;height:54px;border-radius:14px;overflow:hidden;background:#fff;border:2.5px solid #fff;box-shadow:0 4px 14px rgba(40,14,8,.45)}
.m-logo img{width:100%;height:100%;object-fit:cover}
.r-sag{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:3px}
.r-ust{display:flex;align-items:center;gap:8px}
.r-puan{display:inline-flex;align-items:center;gap:4px;background:rgba(255,200,80,.95);border:1px solid rgba(255,200,80,.6);
  border-radius:var(--r-pill);padding:2.5px 9px;font-size:13px;font-weight:800;color:#3A2410;box-shadow:0 2px 6px rgba(120,80,10,.22)}
.r-puan .yld,.r-puan svg{color:#7A5410;fill:#7A5410}
.r-durum{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:800;padding:3px 10px;border-radius:var(--r-pill);
  background:var(--yesil-bg);color:#063;border:1px solid rgba(255,255,255,.4)}
.r-durum.kapali{background:rgba(120,120,120,.3);color:#fff}
.r-durum::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.r-ad{font-weight:800;font-size:15px;color:var(--ak);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.3px}
.r-alt{color:var(--ak-soluk);font-size:15px}
.r-rozetler{display:flex;gap:7px;flex-wrap:wrap;margin-top:5px}
.r-rozet{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.14);border:1px solid var(--cam-kenar);
  color:var(--ak);font-size:13px;font-weight:600;padding:4px 9px;border-radius:10px}
.r-kart .chev{position:absolute;top:14px;right:14px;font-size:24px;color:var(--ak-soluk)}
.r-kart{position:relative}
.r-kapali-kart .r-foto img,.r-kapali-kart .r-foto{filter:grayscale(.6) opacity(.85)}
.dahafazla{width:100%;text-align:center;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);color:var(--ak);font-weight:700;font-size:15px;padding:15px;border-radius:var(--r-md);box-shadow:var(--sh1);margin-bottom:4px}

/* ===== YÜZEN ALT MENÜ (cam) ===== */
.botnav{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:0 14px calc(12px + env(safe-area-inset-bottom));pointer-events:none}
.botnav-ic{max-width:680px;margin:0 auto;pointer-events:auto;display:flex;justify-content:space-around;align-items:stretch;gap:6px;
  background:linear-gradient(180deg, rgba(62,34,23,.80) 0%, rgba(36,19,14,.86) 100%);
  backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);border-radius:24px;box-shadow:var(--sh3);padding:8px 8px}
.botnav-ic button{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  color:rgba(255,255,255,.72);font-size:13px;font-weight:600;padding:8px 6px;border-radius:16px;transition:transform .12s, background .18s, color .18s}
.botnav-ic button svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.7;fill:none;transition:stroke .18s}
.botnav-ic button:active{transform:scale(.9)}
.botnav-ic button.aktif{color:#fff;
  background:linear-gradient(180deg, #FF6B47 0%, #E03C18 100%);
  box-shadow:0 6px 16px rgba(232,49,42,.55), inset 0 1px 0 rgba(255,255,255,.4), inset 0 -6px 12px -6px rgba(120,20,0,.5)}
.botnav-ic button.aktif svg{stroke:#fff;filter:drop-shadow(0 1px 3px rgba(120,20,0,.5))}

/* ===== İSKELET ===== */
.iskelet{display:flex;gap:13px;padding:11px;background:var(--cam);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);border:1px solid var(--cam-kenar);border-radius:var(--r-lg);margin-bottom:16px;box-shadow:var(--sh1)}
/* v232 — eski çift .shim (background-position animasyonu) kaldırıldı: ölü GPU işi + görünmez parıltı.
   Tek yetkili .shim bloğu aşağıda (transform-tabanlı ::after parıltı). */
.isk-foto{width:108px;height:108px;border-radius:16px;flex:0 0 auto}
.isk-l{height:14px;border-radius:7px}

/* ===== MENÜ EKRANI (içerik — yoğun buzlu cam, koyu yazı) ===== */
.m-kapak{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;margin-bottom:-26px;background:linear-gradient(135deg,#E9C7B0,#D7A98C);box-shadow:var(--sh2)}
.m-kapak img{width:100%;height:100%;object-fit:cover;filter:saturate(1.07)}
.m-kapak::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(50,24,14,.45))}
.m-rest{position:relative;z-index:2;background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);border:1px solid var(--cam-kenar2);border-radius:var(--r-lg);padding:16px;margin-bottom:14px;box-shadow:var(--sh2);color:var(--metin)}
.m-rest .m-rest-ad{font-weight:800;font-size:24px;letter-spacing:-.3px}
.m-rest .m-rest-slogan{color:var(--soluk);font-size:15px;margin-top:4px;line-height:1.35}
.m-rest .m-rest-alt{color:var(--soluk);font-size:15px;margin-top:3px}
.m-rest .m-rest-adres{margin-top:6px}
.m-rest .m-rest-adres a{color:var(--soluk);font-size:13px;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.m-rest .m-rest-adres a:hover{text-decoration:underline}
.m-rest .m-rest-aksiyon{display:flex;gap:10px;margin-top:13px}
.kat-bas{font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:.7px;margin:24px 4px 12px;color:var(--ak);text-shadow:0 1px 6px rgba(55,16,8,.3)}
.m-kart{position:relative;background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);border:1px solid var(--cam-kenar2);border-radius:var(--r-md);padding:13px;margin-bottom:11px;display:flex;gap:13px;align-items:center;box-shadow:var(--sh1);color:var(--metin);transition:box-shadow .12s}
.m-kart:active{box-shadow:var(--sh2)}
.m-ic{flex:1;min-width:0;order:0}
.m-gorsel{position:relative;width:104px;height:104px;border-radius:16px;background:linear-gradient(135deg,#F0DAC8,#E2C0A2);display:grid;place-items:center;font-size:24px;flex:0 0 auto;overflow:hidden;order:1;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05), 0 4px 14px rgba(90,40,22,.14)}
.m-gorsel::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(to top,rgba(60,28,14,.20),transparent 55%)}
.m-gorsel img{width:100%;height:100%;object-fit:cover;filter:saturate(1.12) contrast(1.04);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.m-kart:active .m-gorsel img,.m-kart:hover .m-gorsel img{transform:scale(1.07)}
.m-ad{font-weight:700;font-size:15px}
.m-ack{color:var(--soluk);font-size:15px;margin-top:3px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.4}
.m-fiyat{font-weight:800;color:var(--acc-koyu);margin-top:6px;font-size:15px}
.m-tuk{color:var(--acc-koyu);font-size:15px;font-weight:700;margin-top:6px}
/* v299 — TEK premium ekle butonu: temiz beyaz daire + kırmızı "+" (Wolt/Uber deseni).
   Her genişlikte AYNI dil; "Ekle" metin-pill'i tamamen kaldırıldı (tutarsızlık kökü). */
.ekle{position:absolute;right:14px;bottom:14px;z-index:4;background:#fff;color:var(--acc-koyu,#C01E18);font-weight:400;border-radius:50%;
  width:40px;height:40px;font-size:26px;line-height:1;display:grid;place-items:center;box-shadow:0 2px 8px rgba(20,12,10,.16);border:1px solid var(--cizgi2,#ECE8E2);transition:transform .14s,background .14s,color .14s,box-shadow .14s}
.ekle:active{transform:scale(.85)}
@keyframes pop{0%{transform:scale(.9)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
.ekle.pop{animation:pop .22s cubic-bezier(.34,1.56,.64,1)}
.adet{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;background:#fff;border:1px solid var(--cizgi2);border-radius:var(--r-pill);box-shadow:var(--sh1);padding:3px}
.adet button{position:relative;width:40px;height:40px;border-radius:var(--r-pill);background:var(--acc-100);color:var(--acc-koyu);font-size:24px;font-weight:800;display:grid;place-items:center;transition:transform .1s}
.adet button::after{content:'';position:absolute;inset:-3px} /* v232 — menü stepper görünmez dokunma tamponu (40→46; .s-satir daha spesifik inset:-5 ile ezilir) */
.adet button:active{transform:scale(.86)}
.adet .n{font-weight:800;min-width:20px;text-align:center;font-size:15px;color:var(--metin)}
.m-kart > .adet{position:absolute;right:14px;bottom:14px;z-index:4}

/* sepet bar */
.sepet-bar{position:fixed;left:0;right:0;bottom:0;z-index:35;padding:12px 16px calc(12px + env(safe-area-inset-bottom))}
.sepet-btn{max-width:680px;margin:0 auto;width:100%;background:var(--acc);color:#fff;border-radius:var(--r-md);padding:16px 18px;
  display:flex;align-items:center;justify-content:space-between;font-weight:800;font-size:15px;box-shadow:var(--sh-cta);transition:transform .1s}
.sepet-btn:active{transform:scale(.985)}
.sepet-btn .adet-bal{background:rgba(255,255,255,.28);color:#fff;border-radius:8px;padding:2px 10px;font-size:15px;margin-right:7px}

/* sepet/form/takip — içerik (koyu yazı, yoğun cam) */
.sepet-rest{font-weight:800;color:var(--ak);margin-bottom:6px;font-size:15px;letter-spacing:-.2px;text-shadow:0 1px 6px rgba(55,16,8,.3)}
.s-satir{display:flex;align-items:center;gap:12px;padding:11px 12px;margin-bottom:10px;border-radius:var(--r-md);
  background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);border:1px solid var(--cam-kenar2);box-shadow:var(--sh1);color:var(--metin)}
.s-foto-sar{position:relative;flex:0 0 auto;width:56px;height:56px;border-radius:14px;overflow:hidden;
  background:linear-gradient(135deg,#F0C9A8,#D89B6E);box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.s-foto-sar .s-foto-ph{position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.85)}
.s-foto-sar .s-foto-ph svg{width:26px;height:26px;stroke:currentColor;stroke-width:1.6;fill:none}
.s-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.s-satir .s-orta{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.s-satir .s-ad{font-weight:700;font-size:15px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s-satir .s-fiyat{font-weight:800;color:var(--acc-koyu);font-size:15px}
.s-satir .adet{flex:0 0 auto}
.s-sil{flex:0 0 auto;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:rgba(232,49,42,.10);color:var(--acc-koyu);border:1px solid rgba(232,49,42,.22);transition:transform .1s,background .15s}
.s-sil svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.7;fill:none}
.s-sil:active{transform:scale(.86);background:rgba(232,49,42,.2)}
.toplam{display:flex;justify-content:space-between;font-weight:800;font-size:15px;margin:18px 4px;padding-top:6px;color:var(--ak);text-shadow:0 1px 6px rgba(55,16,8,.3)}
.ara-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);color:var(--metin);font-weight:700;font-size:15px;
  border:1px solid var(--cam-kenar2);box-shadow:var(--sh1);border-radius:var(--r-sm);padding:12px 16px;text-decoration:none;min-height:48px;transition:transform .08s}
.ara-btn:active{transform:scale(.96)}
.btn-buyuk{width:100%;background:var(--acc);color:#fff;font-weight:800;font-size:15px;border-radius:var(--r-md);padding:17px;margin-top:8px;min-height:54px;box-shadow:var(--sh-cta);transition:transform .1s}
.btn-buyuk:active{transform:scale(.985)}
.btn-buyuk:disabled{opacity:.5;box-shadow:none}
.btn-sade{background:var(--cam-yogun) !important;backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);color:var(--metin) !important;border:1px solid var(--cam-kenar2);box-shadow:var(--sh1) !important}
/* ===== CHECKOUT (yeniden tasarım: özet kartı + iOS-tarzı gruplu form) ===== */
.ode-ozet{background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2);border-radius:var(--r-lg);box-shadow:var(--sh2);padding:15px 16px 13px;margin-bottom:20px;color:var(--metin)}
.ode-ozet .oz-bas{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:11px}
.ode-ozet .oz-rest{font-weight:800;font-size:15px;letter-spacing:-.2px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ode-ozet .oz-adet{font-size:13px;color:#fff;background:var(--acc);border-radius:var(--r-pill);padding:3px 10px;font-weight:700;flex:0 0 auto;box-shadow:0 2px 8px rgba(232,49,42,.3)}
.ode-ozet .oz-list{display:flex;flex-direction:column;gap:8px}
.ode-ozet .oz-sat{display:flex;justify-content:space-between;gap:12px;font-size:15px}
.ode-ozet .oz-ad{color:var(--soluk);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ode-ozet .oz-ad b{color:var(--acc-koyu);font-weight:800;margin-right:3px}
.ode-ozet .oz-fi{font-weight:600;flex:0 0 auto;color:var(--soluk)}
.ode-ozet .oz-teslimat{margin-top:4px}
.ode-ozet .oz-ucretsiz{color:var(--yesil);font-weight:800}
.ode-ozet .oz-top{display:flex;justify-content:space-between;font-weight:800;font-size:24px;margin-top:12px;padding-top:13px;border-top:1.5px dashed rgba(90,40,22,.22);color:var(--metin)}
.ode-ozet .oz-top span:last-child{color:var(--acc-koyu)}

.ode-baslik{font-size:13px;font-weight:800;color:var(--ak);text-transform:uppercase;letter-spacing:.6px;margin:0 4px 9px;text-shadow:0 1px 5px rgba(55,16,8,.3)}
.ode-grup{background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2);border-radius:var(--r-md);box-shadow:var(--sh1);overflow:hidden;margin-bottom:20px}
.ode-satir{display:flex;align-items:center;gap:13px;padding:13px 15px;position:relative}
.ode-satir + .ode-satir::before{content:'';position:absolute;top:0;left:64px;right:0;height:1px;background:rgba(90,40,22,.13)}
.ode-satir.os-col{align-items:flex-start}
.os-ik{flex:0 0 auto;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;
  background:rgba(232,49,42,.14);color:var(--acc-koyu);margin-top:1px;transition:background .15s,color .15s}
.os-ik svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.8;fill:none}
.os-ic{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.os-ic label{font-size:14px;font-weight:700;color:var(--soluk);letter-spacing:.1px}
.os-ic label .ops{font-weight:500;color:var(--soluk)}
.os-ic input,.os-ic textarea{width:100%;border:none;background:transparent;padding:0;margin:0;color:var(--metin);
  font-size:16px;font-family:inherit;box-shadow:none;-webkit-appearance:none;appearance:none}
.os-ic textarea{min-height:52px;resize:none;line-height:1.45}
.os-ic input:focus,.os-ic textarea:focus{outline:none}
.os-ic input::placeholder,.os-ic textarea::placeholder{color:var(--soluk2)}
.ode-satir:focus-within .os-ik{background:var(--acc);color:#fff;box-shadow:0 3px 10px rgba(232,49,42,.35)}

.kvkk{font-size:14px;color:var(--soluk);line-height:1.55;margin:0 0 16px;padding:11px 13px;text-shadow:none;
  background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2);border-radius:var(--r-md);box-shadow:var(--sh1)}
.kvkk b{color:var(--metin)}
/* para üstü: seçili "Kapıda Nakit"e görsel olarak bağlı */
.os-paraustu{margin-top:14px;border-color:var(--acc);box-shadow:0 0 0 3px rgba(232,49,42,.10),var(--sh1)}

.odeme-secim{ display:flex; flex-direction:column; gap:13px; margin-bottom:6px; padding-top:6px }
.odeme-opt{ display:flex; align-items:center; gap:12px; padding:15px; border:1.5px solid var(--cam-kenar2);
  border-radius:var(--r-md); background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); cursor:pointer; min-height:60px; box-shadow:var(--sh1); color:var(--metin);
  transform:translateY(0) scale(1); transform-origin:center; will-change:transform;
  transition:transform .26s cubic-bezier(.34,1.5,.5,1), box-shadow .26s ease, background .18s, border-color .18s }
.odeme-opt:not(.opt-disabled):active{ transform:scale(.985) }
.odeme-opt input{ position:absolute; opacity:0; width:0; height:0; pointer-events:none }
.odeme-opt .oik{ flex:0 0 auto; width:40px; height:40px; border-radius:11px; display:grid; place-items:center; background:rgba(232,49,42,.14); color:var(--acc-koyu) }
.odeme-opt .oik svg{ width:22px; height:22px; stroke:currentColor; stroke-width:1.8; fill:none }
.odeme-opt .ometin{ display:flex; flex-direction:column; line-height:1.3; flex:1; min-width:0 }
.odeme-opt .ometin b{ font-size:15px } .odeme-opt .ometin small{ color:var(--soluk); font-size:14px }
.odeme-opt .otik{ flex:0 0 auto; width:26px; height:26px; border-radius:50%; display:grid; place-items:center;
  background:var(--acc); color:#fff; opacity:0; transform:scale(.5); transition:opacity .15s, transform .15s; box-shadow:0 3px 9px rgba(232,49,42,.4) }
.odeme-opt .otik svg{ width:16px; height:16px; stroke:#fff; stroke-width:2.6; fill:none }
.odeme-opt .oyakinda{ flex:0 0 auto; font-size:13px; font-weight:800; color:var(--acc-koyu); background:rgba(232,49,42,.12);
  border:1px solid rgba(232,49,42,.25); border-radius:var(--r-pill); padding:3px 9px }
.odeme-opt.secili,.odeme-opt:has(input:checked){ border-color:var(--acc);
  background:linear-gradient(180deg, rgba(255,241,234,.96) 0%, rgba(255,227,216,.92) 100%);
  transform:translateY(-5px) scale(1.03); z-index:3; position:relative;
  box-shadow:0 16px 32px -8px rgba(232,49,42,.5), 0 5px 12px rgba(232,49,42,.26), inset 3px 0 0 var(--acc), inset 0 1px 0 rgba(255,255,255,.75);
  animation:odemePop .32s cubic-bezier(.34,1.6,.5,1) }
.odeme-opt.secili .oik,.odeme-opt:has(input:checked) .oik{ background:var(--acc); color:#fff; transform:scale(1.06); box-shadow:0 5px 14px rgba(232,49,42,.45) }
@keyframes odemePop{ 0%{transform:translateY(0) scale(1)} 55%{transform:translateY(-8px) scale(1.045)} 100%{transform:translateY(-5px) scale(1.03)} }
.odeme-opt.secili .otik,.odeme-opt:has(input:checked) .otik{ opacity:1; transform:scale(1) }
.odeme-opt:has(input:focus-visible){ outline:2px solid var(--acc); outline-offset:2px }
.odeme-opt.opt-disabled{ opacity:.7; cursor:not-allowed; box-shadow:none }

.takip{background:var(--cam-yogun);backdrop-filter:var(--cam-blur);-webkit-backdrop-filter:var(--cam-blur);border:1px solid var(--cam-kenar2);border-radius:var(--r-lg);padding:24px 18px;text-align:center;box-shadow:var(--sh2);color:var(--metin)}
.takip .no{font-size:15px;color:var(--soluk);font-weight:600}
.takip .durum{font-size:24px;font-weight:800;margin:8px 0;letter-spacing:-.3px}
.takip .durum .em{font-size:24px;display:block;margin-bottom:4px}
/* v279 gece-kurul O5 — sipariş-onay peak: ölçülü tek-sefer kutlama (KIT-KIRMIZI). Emoji-sallanma YOK. */
.takip-kutlama{ position:relative; height:0; }
.takip-kutlama .tk-hale{ position:absolute; left:50%; top:-52px; width:120px; height:120px;
  transform:translate(-50%,-50%); border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, rgba(244,76,78,.20) 0%, rgba(244,76,78,0) 62%); }
@media (prefers-reduced-motion:no-preference){
  .takip-kutlama .tk-hale{ animation:tkHale 1400ms ease-out 1 both; }
  .takip .durum{ animation:tkYuksel 520ms cubic-bezier(.2,.7,.2,1) 1 both; }
}
@keyframes tkHale{ 0%{ transform:translate(-50%,-50%) scale(.4); opacity:0; } 30%{ opacity:1; } 100%{ transform:translate(-50%,-50%) scale(1.5); opacity:0; } }
@keyframes tkYuksel{ 0%{ transform:translateY(8px); opacity:.2; } 100%{ transform:translateY(0); opacity:1; } }
/* v279 gece-kurul O5 — 'yeni' ön-ETA bandı: süre boşluğunu kapat (güven). */
.takip-oneta{ display:inline-flex; align-items:center; gap:8px; margin-top:12px; padding:9px 15px;
  border-radius:999px; background:var(--terra-tint,#FFF1F1); color:var(--acc-koyu,#B3261E); font-weight:700; font-size:15px; }
.takip-oneta b{ font-variant-numeric:tabular-nums; }
.takip-oneta svg{ width:16px; height:16px; }
.adimlar{display:flex;justify-content:space-between;margin:24px 0 6px;position:relative}
.adimlar::before{content:'';position:absolute;top:18px;left:10%;right:10%;height:3px;background:rgba(90,40,22,.18);border-radius:3px}
.adimlar::after{content:'';position:absolute;top:18px;left:10%;height:3px;background:var(--yesil);border-radius:3px;width:var(--ilerleme,0%);transition:width .5s ease}
.adim{position:relative;z-index:1;text-align:center;flex:1;font-size:13px;color:var(--soluk2);font-weight:600}
.adim .dot{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.7);border:2px solid rgba(90,40,22,.2);display:grid;place-items:center;margin:0 auto 6px;font-size:15px;transition:.3s}
.adim.tamam .dot{background:var(--yesil);border-color:var(--yesil);color:#fff}
.adim.aktif .dot{background:var(--acc);border-color:var(--acc);color:#fff;animation:nabiz 1.6s ease-in-out infinite}
@keyframes nabiz{0%,100%{box-shadow:0 0 0 4px var(--acc-100)}50%{box-shadow:0 0 0 10px rgba(232,49,42,.08)}}
.adim.tamam, .adim.aktif{color:var(--metin);font-weight:700}
.eta-buyuk{margin-top:14px;font-weight:800;font-size:15px;color:var(--acc-koyu)}
/* v231 (P0 K1) — 'beklemede' ödeme-onayı çipi: adım şeridinin üstünde, "sipariş neyi bekliyor" görünür olur */
.takip-odeme-cip{display:inline-flex;align-items:center;gap:7px;margin:8px auto 0;padding:8px 14px;
  background:rgba(201,138,18,.10);border:1px solid rgba(201,138,18,.28);color:#B0790F;
  border-radius:var(--r-pill);font-size:13px;font-weight:700}
.takip-odeme-cip svg{width:16px;height:16px;stroke:currentColor;fill:none}
@media (prefers-reduced-motion:no-preference){.takip-odeme-cip{animation:nabizCip 1.8s ease-in-out infinite}}
@keyframes nabizCip{0%,100%{box-shadow:0 0 0 0 rgba(201,138,18,.20)}50%{box-shadow:0 0 0 6px rgba(201,138,18,0)}}

.bos{text-align:center;padding:54px 22px;color:var(--ak)}
/* v232 — boş-durum bileşeni dikey ORTALI (ödeme mahalle .ode-mahalle.bos butonu hariç) */
.bos:not(.ode-mahalle){ display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:60vh; gap:2px; }
.bos b{color:var(--ak);font-size:15px}
.bos div{color:var(--ak-soluk)}
.yukleniyor{text-align:center;padding:40px;color:var(--ak-soluk)}
.toast{position:fixed;left:50%;bottom:calc(102px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(8px);
  background:rgba(58,28,18,.94);backdrop-filter:blur(10px);color:#fff;
  padding:13px 22px;border-radius:var(--r-pill);font-weight:700;font-size:15px;z-index:60;box-shadow:var(--sh3);max-width:90%;opacity:0;transition:opacity .22s,transform .22s;pointer-events:none}
.toast.gor{opacity:1;transform:translateX(-50%) translateY(0)}

@media (prefers-reduced-motion: reduce){ *{animation:none !important;transition:none !important} }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
}

/* ===== IŞIKLI CAM KENARI (3D rim-light) — üst/sol kenar en parlak (ışık yukarıdan) ===== */
.konum,.bildirim,.chip,.promo,.r-kart,.botnav-ic,.dahafazla,.sirala,
.ara-kutu input,.filtre-btn,.m-rest,.m-kart,.s-satir,.takip,.odeme-opt{
  border:1px solid var(--cam-kenar);
  border-top-color:rgba(255,255,255,.9);
  border-left-color:rgba(255,255,255,.72);
}
/* Köşegen specular parıltı — büyük cam paneller */
.promo::before,.r-kart::before{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;
  background:linear-gradient(135deg, rgba(255,255,255,.20) 0%, rgba(255,255,255,0) 36%);
}
/* içerik specular parıltının ÜSTÜNDE kalsın (okunabilirlik), foto/chev kendi konumunu korur */
.promo-ic{z-index:4}
.r-kart .r-foto,.r-kart .r-sag{position:relative;z-index:4}
.r-kart .chev{z-index:4}

/* ===== 3D BASMA / HOVER TEPKİSİ — kart fiziksel obje gibi ===== */
.chip{transition:transform .14s cubic-bezier(.34,1.4,.5,1), box-shadow .14s}
.chip:active{transform:translateY(-1px) scale(.97); box-shadow:var(--sh2)}
.r-kart{transition:transform .16s cubic-bezier(.34,1.3,.5,1), box-shadow .16s}
.r-kart:active{transform:translateY(1px) scale(.99); box-shadow:var(--sh1)}
.promo{transition:transform .18s ease, box-shadow .18s}
.promo:active{transform:scale(.992); box-shadow:var(--sh3)}
@media (hover:hover){
  .r-kart:hover,.chip:hover,.promo:hover{transform:translateY(-3px); box-shadow:var(--sh3)}
}

/* ===== YAZI OKUNABİLİRLİĞİ (cam üstünde beyaz yazı — yaşlı kullanıcı) ===== */
.selam h1,.selam p,.konum .ktxt b,.r-ad,.promo-bas,.bolum-bas h2,
.chip span,.botnav-ic button,.sirala,.r-puan,.dahafazla{
  text-shadow:0 1px 2px rgba(40,14,8,.45), 0 0 1px rgba(40,14,8,.35);
}
.chip{font-weight:700}
.r-alt,.promo-alt{ color:rgba(255,255,255,.93) }
/* promo yazısı için sol koyu scrim — foto üstüne binmesin */
.promo-ic::before{
  content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;
  background:linear-gradient(90deg, rgba(35,12,7,.40), rgba(35,12,7,0) 72%);
}

/* =====================================================================
   MÜŞTERİ — MAHALLE SEÇİCİ + KONUM + MESAFE — FROSTED-GLASS REFACTOR
   Kazanan [2] temel alındı; jüri graftNotes harmanlandı.
   Drop-in: markup DEĞİŞMEZ, yalnız mevcut sınıflara yapışır.
   Yalnız :root tokenları (--cam,--cam-duz,--cam-yogun,--acc,--sh*,--r-*) kullanıldı.
   NOT: global reduced-motion (*{...none}) ve @supports backdrop token-swap
   musteri.css'te ZATEN var (sat.334-337) → burada TEKRARLANMADI.
   DENETİM YAMASI: (a) .mhs-grup-bas kontrast --soluk2→--soluk (AA),
   (b) .mhs-liste overflow-x:hidden (full-bleed sticky başlık yatay taşması),
   (c) dokunma hedefleri >=40px (.mhs-kapat/.mhs-chip/.ode-mahalle).
   ===================================================================== */

/* ---------- 1) ÜST KONUM BUTONU (.konum) — cam disk + rim-light tepki ----------
   Header mesh-gradyan üstünde durur → metin --ak (beyaz) bağlamı korunur. */
.konum{
  position:relative;
  transition:transform .14s cubic-bezier(.34,1.4,.5,1), box-shadow .16s, border-color .15s;
}
.konum:active{ transform:translateY(1px) scale(.98); box-shadow:var(--sh1); }
@media (hover:hover){ .konum:hover{ transform:translateY(-1px); box-shadow:var(--sh2); } }
/* GRAFT [3]: ikona acc-tonlu sıcak drop-shadow */
.konum .kik{ font-size:15px; filter:drop-shadow(0 1px 4px rgba(232,49,42,.5)); }
.konum .kchev{ transition:transform .15s; }
.konum:active .kchev{ transform:translateX(1px); }

/* ---------- 2) "MAHALLENİ SEÇ" NUDGE ŞERİDİ (.mh-uyari) — cam + sol acc aksan ---------- */
.mh-uyari{
  position:relative; overflow:hidden;
  background:var(--cam-yogun);
  backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2);
  border-top-color:rgba(255,255,255,.92);
  border-left-color:rgba(255,255,255,.78);
  box-shadow:var(--sh2);
  transition:transform .16s cubic-bezier(.34,1.3,.5,1), box-shadow .16s;
}
/* sol terrakota aksan şeridi — "buraya bas" eylem-daveti sıcaklığı */
.mh-uyari::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:linear-gradient(180deg, var(--acc), var(--acc-koyu));
  box-shadow:0 0 12px rgba(232,49,42,.5);
}
.mh-uyari:active{ transform:scale(.99); box-shadow:var(--sh1); }
@media (hover:hover){ .mh-uyari:hover{ transform:translateY(-2px); box-shadow:var(--sh3); } }
/* GRAFT [3]: ikona acc-tonlu drop-shadow (NOT: sonsuz mhuPin animasyonu ALINMADI) */
.mh-uyari .mhu-ik{ filter:drop-shadow(0 1px 5px rgba(232,49,42,.4)); }
.mh-uyari .mhu-ok{ transition:transform .16s ease; }
.mh-uyari:active .mhu-ok{ transform:translateX(3px); }
@media (hover:hover){ .mh-uyari:hover .mhu-ok{ transform:translateX(3px); } }

/* ---------- 3) CHECKOUT MAHALLE BUTONU (.ode-mahalle) — cam pill ----------
   Checkout .os-ic akışında durur; kompakt pill (satır-yüksekliğini bozmaz).
   YAMA: min-height:40px → dokunma hedefi AA. */
.ode-mahalle{
  display:inline-flex; align-items:center; gap:4px; min-height:40px;
  font:inherit; font-size:15px; font-weight:700; color:var(--metin);
  padding:5px 12px; border-radius:var(--r-pill); cursor:pointer; text-align:left;
  background:var(--cam);
  backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar);
  border-top-color:var(--cam-kenar2);
  box-shadow:var(--sh1);
  transition:transform .12s, box-shadow .15s, color .15s, border-color .15s;
}
.ode-mahalle:active{ transform:scale(.97); box-shadow:none; color:var(--acc-koyu); }
/* GRAFT [0]+[3]: boş durum acc-100 rim-halo → "buraya bas" sinyali güçlenir */
.ode-mahalle.bos{
  color:var(--acc-koyu); font-weight:800;
  border-color:rgba(232,49,42,.45);
  box-shadow:0 0 0 3px var(--acc-100), var(--sh1);
}
@media (hover:hover){ .ode-mahalle:hover{ border-color:var(--cam-kenar2); box-shadow:var(--sh2); } }

/* =====================================================================
   4) MAHALLE SEÇİCİ BOTTOM-SHEET
   ===================================================================== */

/* ---------- OVERLAY SCRIM (.mh-overlay) — sıcak ton korunur, GRAFT [3] saturate ---------- */
.mh-overlay{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:flex-end; justify-content:center;
  background:rgba(20,8,4,.46);
  backdrop-filter:saturate(120%) blur(7px);
  -webkit-backdrop-filter:saturate(120%) blur(7px);
  animation:mhScrim .22s ease both;
}
.mh-overlay.gizli{ display:none; }
@keyframes mhScrim{ from{opacity:0} to{opacity:1} }

/* ---------- SHEET KARTI (.mhs-kart) — DÜZ BEYAZ → YOĞUN BUZLU CAM ---------- */
/* ===== MAHALLE SEÇİCİ — bottom-sheet + SABİT-yükseklik typeahead satır listesi (yeniden tasarım) =====
   Konsensüs: serpiştirme yok (148 dökülmez), yazdıkça ZIPLAMAZ (.mh-results sabit clamp), emoji yok (SVG). */
.ico{ width:20px; height:20px; flex:0 0 auto; display:inline-block; vertical-align:middle; stroke:currentColor; }

.mh-sheet{
  width:100%; max-width:560px; display:flex; flex-direction:column; position:relative; max-height:88vh; overflow:hidden;
  background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); border-top-color:rgba(255,255,255,.92); border-left-color:rgba(255,255,255,.78); border-bottom:none;
  border-radius:22px 22px 0 0; padding:0 0 calc(10px + env(safe-area-inset-bottom));
  box-shadow:var(--sh3), 0 -12px 44px rgba(40,14,8,.34); color:var(--metin);
  animation:mhsUp .22s cubic-bezier(.2,.9,.3,1);
}
@keyframes mhsUp{ from{transform:translateY(40px);opacity:.6} to{transform:translateY(0);opacity:1} }

.mh-head{ position:sticky; top:0; z-index:3; flex:0 0 auto; padding:8px 16px 12px;
  background:linear-gradient(180deg, rgba(255,255,255,.30), rgba(255,255,255,0)); }
.mh-handle{ display:block; width:38px; height:5px; border-radius:999px; margin:0 auto 12px;
  background:rgba(255,255,255,.6); box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 1px 2px rgba(40,14,8,.18); }
.mh-head-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.mh-title{ font-size:15px; font-weight:800; color:var(--metin); letter-spacing:-.2px; }
.mh-kapat{ width:40px; height:40px; flex:0 0 auto; border-radius:50%; display:grid; place-items:center;
  background:var(--cam); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar); border-top-color:rgba(255,255,255,.9); color:var(--soluk); cursor:pointer;
  box-shadow:var(--sh1); transition:transform .12s, color .15s; }
.mh-kapat:active{ transform:scale(.9); color:var(--acc-koyu); }
.mh-kapat .ico{ width:18px; height:18px; }

.mh-gps{ width:100%; display:flex; align-items:center; justify-content:center; gap:8px;
  padding:13px; border-radius:var(--r-md); border:none; cursor:pointer;
  background:linear-gradient(180deg, var(--acc), var(--acc-koyu)); color:#fff; font-weight:800; font-size:15px;
  box-shadow:var(--sh-cta); text-shadow:0 1px 4px rgba(120,20,0,.4);
  transition:transform .1s, box-shadow .18s, filter .15s; }
.mh-gps .ico{ width:19px; height:19px; }
.mh-gps:active{ transform:scale(.985); }
.mh-gps:disabled{ opacity:.72; cursor:default; }
@media (hover:hover){ .mh-gps:hover{ filter:brightness(1.04); } }

.mh-search{ position:sticky; top:0; z-index:2; flex:0 0 auto; display:flex; align-items:center; gap:9px;
  margin:0 16px 10px; padding:11px 13px; border-radius:var(--r-md);
  background:var(--cam-duz); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); border-top-color:rgba(255,255,255,.9);
  box-shadow:var(--sh1); transition:border-color .15s, box-shadow .15s, color .15s; color:var(--soluk); }
/* v257 — odak halkası yumuşatıldı: kalın kırmızı çerçeve+4px glow → ince yumuşak 2px tint (premium). */
.mh-search:focus-within{ border-color:rgba(232,49,42,.45); box-shadow:0 0 0 2px var(--acc-100), var(--sh1); color:var(--metin); }
.mh-search input{ flex:1; border:none; background:none; font-size:16px; color:var(--metin); outline:none; min-width:0; }
.mh-search input::placeholder{ color:var(--soluk); }
.mh-clear{ border:none; background:none; color:var(--soluk2); cursor:pointer; display:grid; place-items:center; padding:2px; }
.mh-clear[hidden]{ display:none; }
.mh-clear .ico{ width:18px; height:18px; }
/* type=search native temizle butonunu gizle (kendi ikonumuz var) */
.mh-search input::-webkit-search-cancel-button{ -webkit-appearance:none; appearance:none; }

.mh-results{ list-style:none; margin:0; padding:0 8px; height:clamp(240px, 46vh, 420px);
  overflow-y:auto; overscroll-behavior:contain; contain:layout; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.mh-results::-webkit-scrollbar{ width:0; display:none; }
.mh-grup-bas{ list-style:none; font-size:13px; font-weight:800; color:var(--soluk2);
  text-transform:uppercase; letter-spacing:.05em; padding:12px 8px 5px; }
.mh-row{ display:flex; align-items:center; gap:11px; min-height:48px; box-sizing:border-box;
  padding:7px 10px; border-radius:14px; cursor:pointer; color:var(--metin);
  transition:background .14s; -webkit-tap-highlight-color:transparent; }
.mh-row .mh-row-ik{ color:var(--soluk2); display:grid; place-items:center; }
.mh-row .mh-row-ik .ico{ width:18px; height:18px; }
.mh-row-ad{ flex:1; font-size:15px; font-weight:600; }
.mh-row-tip{ font-size:14px; color:var(--soluk); font-weight:600; white-space:nowrap; }
.mh-row-go{ color:var(--soluk2); display:grid; place-items:center; }
.mh-row-go .ico{ width:18px; height:18px; }
.mh-row.vurgu, .mh-row:active{ background:rgba(232,49,42,.10); }
@media (hover:hover){ .mh-row:hover{ background:rgba(232,49,42,.08); } }
.mh-row.secili{ background:rgba(232,49,42,.12); }
.mh-row.secili .mh-row-ik, .mh-row.secili .mh-row-go{ color:var(--acc-koyu); }
.mh-row.secili .mh-row-ad{ color:var(--acc-koyu); font-weight:800; }
.mh-bos{ display:flex; align-items:center; justify-content:center; min-height:120px; color:var(--soluk2); font-weight:600; }

/* tetik/diğer butonlardaki emoji→SVG ikon boyutları */
.konum .kik .ico{ width:19px; height:19px; }
.konum .kchev .ico{ width:16px; height:16px; }
.mh-uyari .mhu-ik .ico{ width:22px; height:22px; color:var(--acc); }
.mh-uyari .mhu-ok .ico{ width:20px; height:20px; }
.ara-kutu .ara-ik .ico{ width:18px; height:18px; }
/* .bos .emoji .ico → tek yetkili kurala taşındı (v232, dosya-sonu boş-durum bloğu) */

/* =====================================================================
   5) MESAFE ROZETİ (.r-km) — kalın dolgu → ince cam + acc PIN mikro-rozet
   r-kart koyu cam üstünde durur → metin --ak (beyaz) bağlamı.
   ===================================================================== */
.r-rozet.r-km{
  background:rgba(255,255,255,.14);
  border:1px solid rgba(232,49,42,.4);
  border-top-color:rgba(255,255,255,.4);
  color:var(--ak); font-weight:700; font-size:13px;
  padding:3px 8px; gap:4px; letter-spacing:.1px;
  text-shadow:0 1px 2px rgba(40,14,8,.4);
}
/* GRAFT [2]+[3]: damla/pin metaforu — konum rozetine yakışır */
.r-rozet.r-km::before{
  content:''; flex:0 0 auto; width:7px; height:7px;
  border-radius:50% 50% 50% 0; transform:rotate(-45deg);
  background:linear-gradient(180deg, var(--acc), var(--acc-koyu));
  box-shadow:0 0 5px rgba(232,49,42,.55);
}

/* =====================================================================
   6) HEDEFLİ FALLBACK — backdrop-filter çökünce sıcak-açık OPAK tona düş (beyaz DEĞİL)
   NOT: :root token-swap (--cam→--cam-duz, --cam-yogun→--cam-yogun-duz) sat.336'da
   zaten var; aşağıdaki yalnız token-DIŞI yarı-saydam zeminleri opak yapar.
   ===================================================================== */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .mh-sheet{ background:var(--cam-yogun-duz); }
  .mh-search{ background:rgba(255,250,247,.92); }
  .mh-kapat{ background:rgba(255,250,247,.92); }
}

/* ===== Emoji→SVG ikon boyutlandırma (müşteri geneli) ===== */
.serit .ico{ width:17px; height:17px; vertical-align:-3px; }
.bildirim .ico{ width:21px; height:21px; }
.r-foto .ico{ width:40px; height:40px; color:var(--soluk2); opacity:.7; }
.m-gorsel .ico{ width:42px; height:42px; color:var(--soluk2); opacity:.7; }
.r-rozet .ico{ width:13px; height:13px; vertical-align:-2px; margin-right:1px; }
.yesil-dot .ico{ width:9px; height:9px; color:var(--yesil); vertical-align:0; }
.ara-btn .ico{ width:16px; height:16px; vertical-align:-3px; margin-right:3px; }
.r-kalp .ico{ width:17px; height:17px; }
.r-kalp.dolu .ico{ fill:currentColor; }
.adim .dot .ico{ width:15px; height:15px; }
.eta-buyuk .ico{ width:16px; height:16px; vertical-align:-3px; margin-right:2px; }

/* ===== Sipariş operasyonu (açık/kapalı/meşgul rozeti, min sepet uyarısı, sıralama çubuğu) ===== */
.r-durum.mesgul{ color:#fff; background:var(--amber); }
.r-durum.kapali{ color:#fff; background:rgba(120,60,40,.72); }
.r-puan{ background:rgba(255,200,80,.95); border-color:rgba(255,200,80,.6); color:#3A2410; font-weight:800; box-shadow:0 2px 6px rgba(120,80,10,.22); }
.r-puan .ico{ width:12px; height:12px; vertical-align:-2px; color:#7A5410; fill:#7A5410; }
.r-kart.kart-kapali{ opacity:.62; }
.r-kart.kart-kapali .r-foto{ filter:grayscale(.5); }
.ode-uyari{ margin:0 0 12px; padding:12px 14px; border-radius:var(--r-md); font-size:15px; font-weight:600;
  background:var(--acc-100); border:1px solid rgba(232,49,42,.4); color:var(--acc-koyu); }
.ode-uyari.kapali{ background:rgba(120,60,40,.14); border-color:rgba(120,60,40,.4); color:var(--metin); }
.btn-buyuk[disabled]{ opacity:.5; pointer-events:none; }
.sira-bar{ display:flex; gap:8px; overflow-x:auto; padding:2px 2px 10px; margin:0 -2px; scrollbar-width:none; }
.sira-bar::-webkit-scrollbar{ display:none; }
.sira-chip{ flex:0 0 auto; padding:8px 14px; border-radius:var(--r-pill); font-size:15px; font-weight:700; cursor:pointer;
  background:var(--cam); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar); color:var(--ak); box-shadow:var(--sh1); white-space:nowrap; }
.sira-chip.sec{ background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; border-color:transparent; box-shadow:var(--sh-cta); }
.sira-chip .ico{ width:14px; height:14px; vertical-align:-3px; }

/* ===== Puan & yorum (takip ekranı) ===== */
.puan-kutu{ margin-top:16px; padding:16px; border-radius:var(--r-lg); background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); }
.puan-bas{ font-weight:800; font-size:15px; margin-bottom:10px; color:var(--metin); }
.puan-yildizlar{ display:flex; gap:6px; justify-content:center; margin-bottom:12px; }
.puan-yildiz{ width:44px; height:44px; display:grid; place-items:center; color:var(--soluk2); transition:transform .1s; }
.puan-yildiz .ico{ width:34px; height:34px; }
.puan-yildiz:active{ transform:scale(.9); }
.puan-yildiz.dolu{ color:#FFB020; }
.puan-yildiz.dolu .ico{ fill:#FFC850; stroke:#FFB020; }
.puan-kutu textarea{ width:100%; background:var(--cam-duz); border:1px solid var(--cam-kenar); border-radius:var(--r-md); padding:11px 13px; color:var(--metin); font-size:16px; resize:none; margin-bottom:12px; }
.puan-kutu textarea::placeholder{ color:var(--soluk2); }
.puan-tamam{ margin-top:16px; padding:14px 16px; border-radius:var(--r-md); background:var(--yesil-bg); color:var(--metin); font-weight:700; font-size:15px; display:flex; align-items:center; gap:8px; }
.puan-tamam .ico{ width:18px; height:18px; color:var(--yesil); }

/* yorum fotoğrafı ekle alanı (puan kutusu) */
.puan-foto{ margin-bottom:12px; }
.puan-foto-btn{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; background:var(--cam-duz); border:1px dashed var(--cam-kenar); border-radius:var(--r-md); padding:10px 14px; color:var(--metin); font-size:15px; font-weight:600; }
.puan-foto-btn .ico{ width:18px; height:18px; }
.puan-foto-btn.gizli{ display:none; }
.puan-foto-onizle{ position:relative; display:inline-block; }
.puan-foto-onizle.gizli{ display:none; }
.puan-foto-onizle img{ max-width:140px; max-height:140px; border-radius:var(--r-md); display:block; object-fit:cover; }
.puan-foto-sil{ position:absolute; top:-8px; right:-8px; width:26px; height:26px; border-radius:50%; background:var(--kirmizi); color:#fff; display:grid; place-items:center; box-shadow:var(--sh1); }
.puan-foto-sil .ico{ width:14px; height:14px; }

/* yorum kartındaki fotoğraf + tam-ekran büyük gör */
.yorum-foto{ margin:8px 0; }
.yorum-foto-btn{ display:block; cursor:zoom-in; padding:0; border-radius:var(--r-md); overflow:hidden; }
.yorum-foto-img{ max-width:180px; max-height:180px; width:100%; object-fit:cover; border-radius:var(--r-md); display:block; }
.yfoto-buyuk{ position:fixed; inset:0; z-index:60; background:rgba(0,0,0,.88); display:grid; place-items:center; padding:24px; }
.yfoto-buyuk-img{ max-width:96vw; max-height:88vh; border-radius:10px; box-shadow:0 12px 40px rgba(0,0,0,.5); }
.yfoto-kapat{ position:absolute; top:16px; right:16px; width:44px; height:44px; border-radius:50%; background:rgba(255,255,255,.16); color:#fff; display:grid; place-items:center; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.yfoto-kapat .ico{ width:22px; height:22px; }

/* ===== Geçmiş sipariş (tekrar-sipariş) ===== */
.gecmis-aktif{ display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:14px 16px; margin-bottom:14px; border-radius:var(--r-lg); background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); color:var(--metin); }
.gecmis-aktif .ico{ width:22px; height:22px; color:var(--acc); flex:0 0 auto; }
.gecmis-aktif span{ display:flex; flex-direction:column; flex:1; }
.gecmis-aktif small{ color:var(--soluk); font-size:14px; font-weight:500; }
.gecmis-aktif .mhu-ok{ flex:0 0 auto; color:var(--soluk2); }
/* v219 (B1) — ANA SAYFA AKTİF-SİPARİŞ AFİŞİ: boot takip-tuzağı kaldırıldı; devam eden sipariş
   ana sayfada canlı-aksan şeritle erişilir. .gecmis-aktif iskeletini paylaşır, aksan-tonlu. */
.ana-takip-afis{ display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:13px 15px; margin:2px 0 14px; border-radius:var(--r-lg); background:var(--primary-tint,rgba(232,49,42,.08)); border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); color:var(--metin); cursor:pointer; -webkit-tap-highlight-color:transparent; }
.ana-takip-afis .ata-ik{ flex:0 0 auto; display:flex; }
.ana-takip-afis .ata-ik .ico{ width:24px; height:24px; color:var(--acc); }
.ana-takip-afis .ata-yazi{ display:flex; flex-direction:column; flex:1; min-width:0; }
.ana-takip-afis .ata-yazi b{ font-size:15px; font-weight:700; }
.ana-takip-afis .ata-yazi small{ color:var(--soluk); font-size:14px; font-weight:500; margin-top:1px; }
.ana-takip-afis .ata-canli{ flex:0 0 auto; width:9px; height:9px; border-radius:50%; background:var(--acc); box-shadow:0 0 0 0 rgba(232,49,42,.5); animation:ataNabiz 1.8s ease-out infinite; }
.ana-takip-afis .ata-ok{ flex:0 0 auto; display:flex; color:var(--soluk2); transition:transform .16s ease; }
.ana-takip-afis .ata-ok .ico{ width:20px; height:20px; }
.ana-takip-afis:active{ transform:scale(.99); }
@media (hover:hover){ .ana-takip-afis:hover{ box-shadow:var(--sh3); } .ana-takip-afis:hover .ata-ok{ transform:translateX(3px); } }
@keyframes ataNabiz{ 0%{ box-shadow:0 0 0 0 rgba(232,49,42,.45); } 70%{ box-shadow:0 0 0 7px rgba(232,49,42,0); } 100%{ box-shadow:0 0 0 0 rgba(232,49,42,0); } }
@media (prefers-reduced-motion:reduce){ .ana-takip-afis .ata-canli{ animation:none; } }
.gecmis-liste{ display:flex; flex-direction:column; gap:12px; }
.gecmis-kart{ padding:14px 16px; border-radius:var(--r-lg); background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); }
.gecmis-ust{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:6px; }
.gecmis-ust b{ font-size:15px; color:var(--metin); }
.gecmis-ust span{ font-size:13px; color:var(--soluk); white-space:nowrap; }
.gecmis-kalem{ font-size:15px; color:var(--soluk); line-height:1.4; margin-bottom:11px; }
.gecmis-alt{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.gecmis-tutar{ font-weight:800; font-size:15px; color:var(--metin); }
.btn-tekrar{ display:inline-flex; align-items:center; gap:6px; padding:9px 15px; border-radius:var(--r-pill); font-weight:700; font-size:15px; color:#fff; background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); box-shadow:var(--sh-cta); }
.btn-tekrar .ico{ width:15px; height:15px; }

/* ===== Ürün seçenekleri (varyant/ekstra) ===== */
.m-fiyat .m-art{ font-size:13px; font-weight:700; color:var(--brand-700); margin-left:5px; }
.ekle.sec-dolu{ background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; }
.s-sec{ font-size:14px; color:var(--soluk); line-height:1.35; margin:1px 0 3px; }
.kalem-sec{ color:var(--soluk2); font-weight:500; font-size:.92em; }
.sec-sheet{ max-height:86vh; display:flex; flex-direction:column; }
.sec-govde{ overflow-y:auto; padding:4px 18px 8px; -webkit-overflow-scrolling:touch; }
.sec-grup{ margin:14px 0; }
.sec-grup-bas{ font-weight:800; font-size:15px; color:var(--metin); margin-bottom:8px; display:flex; align-items:baseline; gap:8px; }
.sec-grup-not{ font-size:13px; font-weight:600; color:var(--soluk2); text-transform:uppercase; letter-spacing:.3px; }
.sec-opt{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px; margin-bottom:8px; border-radius:var(--r-md); background:var(--cam-duz); border:1px solid var(--cam-kenar); cursor:pointer; }
.sec-opt:has(input:checked){ border-color:var(--acc); background:var(--acc-100); }
.sec-opt-ad{ font-size:15px; color:var(--metin); font-weight:600; }
.sec-opt-f{ color:var(--brand-700); font-weight:700; font-size:15px; margin-left:4px; }
.sec-opt input{ width:22px; height:22px; flex:0 0 auto; accent-color:var(--acc); }
.sec-alt{ padding:12px 18px calc(14px + env(safe-area-inset-bottom)); border-top:1px solid var(--cizgi2); background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); }

/* ===== Kayıtlı adres + indirim kodu + zamanlı teslimat (ödeme ekranı) ===== */
.adres-cipler{ display:flex; gap:8px; flex-wrap:wrap; margin:0 0 8px; }
.adres-cip{ padding:7px 13px; border-radius:var(--r-pill); font-size:15px; font-weight:700; background:var(--cam-duz); border:1px solid var(--cam-kenar); color:var(--ak); }
.adres-cip.sec{ background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; border-color:transparent; }
.adres-cip.yeni{ color:var(--brand-700); }
.adres-kaydet{ display:flex; align-items:center; gap:7px; font-size:15px; color:var(--soluk); margin-top:8px; cursor:pointer; }
.adres-kaydet input{ width:auto; }
.kod-grup{ padding:12px !important; }
.kod-satir{ display:flex; gap:8px; }
/* v231 (P0 tasma-K2) — input'a min-width:0 yoktu → intrinsic min-content genişliğinin altına inemiyor,
   360px'de "Uygula" butonu flex satırından 33px taşıp kırpılıyordu. min-width:0 + buton shrink kilidi. */
.kod-satir input{ flex:1; min-width:0; background:var(--cam-duz); border:1px solid var(--cam-kenar); border-radius:var(--r-md); padding:12px 14px; color:var(--metin); font-size:16px; text-transform:uppercase; }
.kod-satir button{ flex:0 0 auto; white-space:nowrap; }
.kod-hata{ color:var(--kirmizi); font-size:15px; margin-top:8px; font-weight:600; }
.kod-ok{ color:var(--yesil); font-size:15px; margin-top:8px; font-weight:700; }
.oz-indirim{ color:var(--yesil); font-weight:700; }
.oz-indirim .oz-fi{ color:var(--yesil); }
.zaman-seg{ display:flex; gap:8px; }
.zaman-seg button{ flex:1; padding:11px; border-radius:var(--r-md); font-weight:700; font-size:15px; background:var(--cam-duz); border:1px solid var(--cam-kenar); color:var(--ak); }
.zaman-seg button.sec{ background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; border-color:transparent; }
.zaman-sel{ width:100%; margin-top:10px; background:var(--cam-duz); border:1px solid var(--cam-kenar); border-radius:var(--r-md); padding:12px 14px; color:var(--metin); font-size:16px; }
.takip-ek{ display:flex; gap:14px; flex-wrap:wrap; margin-top:8px; font-size:15px; color:var(--soluk); font-weight:600; }
.takip-ek .ico{ width:14px; height:14px; vertical-align:-2px; }
.adres-kayit{ display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:var(--r-md); background:var(--cam-yogun); border:1px solid var(--cam-kenar2); margin-bottom:8px; }
.adres-kayit .adres-ic{ flex:1; display:flex; flex-direction:column; }
.adres-kayit small{ color:var(--soluk); font-size:14px; }
.adres-kayit-sil{ width:34px; height:34px; display:grid; place-items:center; border-radius:9px; color:var(--kirmizi); background:var(--cam-duz); border:1px solid var(--cam-kenar); }

/* ===== Menü içi arama + müşteri yorumları (restoran sayfası) ===== */
.menu-ara{ position:relative; margin:4px 0 14px; }
.menu-ara input{ width:100%; background:var(--cam-duz); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); border:1px solid var(--cam-kenar); border-radius:var(--r-md); padding:13px 14px 13px 44px; color:var(--metin); font-size:16px; }
.menu-ara .ara-ik{ position:absolute; left:15px; top:50%; transform:translateY(-50%); color:var(--soluk2); pointer-events:none; }
.menu-ara .ara-ik .ico{ width:18px; height:18px; }
.yorum-ozet{ display:flex; align-items:center; gap:12px; margin:6px 0 14px; }
.yo-puan{ font-size:24px; font-weight:800; color:var(--metin); display:inline-flex; align-items:center; gap:6px; }
.yo-puan .ico{ width:20px; height:20px; color:#FFC850; }
.yo-say{ font-size:15px; color:var(--soluk); font-weight:600; }
.yorum-kart{ background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); border:1px solid var(--cam-kenar2); border-radius:var(--r-lg); padding:13px 15px; margin-bottom:10px; box-shadow:var(--sh1); }
.yorum-bas{ display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.yorum-yildiz{ font-weight:800; color:var(--metin); display:inline-flex; align-items:center; gap:5px; }
.yorum-yildiz .ico{ width:15px; height:15px; color:#FFC850; }
.yorum-tarih{ font-size:13px; color:var(--soluk2); }
.yorum-metin{ font-size:15px; color:var(--metin); line-height:1.4; }
.yorum-yanit{ font-size:15px; color:var(--soluk); background:var(--cam-duz); border-left:3px solid var(--acc); border-radius:8px; padding:8px 11px; margin-top:9px; line-height:1.4; }

/* ===== FAZ 1: Kampanya rozeti (kart) + Çalışma saatleri (restoran sayfası) ===== */
.r-foto{ position:relative; }
.r-kampanya{
  position:absolute; top:7px; left:7px; z-index:4;
  display:inline-flex; align-items:center; gap:4px;
  background:linear-gradient(135deg,#FF6B47 0%, var(--acc) 55%, var(--acc-koyu) 100%);
  color:#fff; font-weight:800; font-size:13px; letter-spacing:-.2px;
  padding:4px 9px; border-radius:var(--r-pill);
  border:1px solid rgba(255,255,255,.45); box-shadow:var(--sh-cta);
  text-shadow:0 1px 4px rgba(120,20,0,.4); max-width:78%;
}
.r-kampanya .ico{ width:12px; height:12px; stroke:#fff; stroke-width:2; fill:none; flex:0 0 auto; }
/* Çalışma saatleri — açılır panel (premium cam) */
.cs-panel{ margin-top:12px; background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); border-radius:var(--r-md); box-shadow:var(--sh1); color:var(--metin); overflow:hidden; }
.cs-ozet{ display:flex; align-items:center; gap:8px; padding:14px 16px; font-weight:800; font-size:15px; cursor:pointer; list-style:none; }
.cs-ozet::-webkit-details-marker{ display:none; }
.cs-ozet .ico{ width:17px; height:17px; }
.cs-ozet .cs-chev{ margin-left:auto; transition:transform .2s; }
.cs-ozet .cs-chev .ico{ width:16px; height:16px; transform:rotate(90deg); }
.cs-panel[open] .cs-chev{ transform:rotate(180deg); }
.cs-liste{ padding:0 16px 8px; }
.cs-satir{ display:flex; align-items:center; justify-content:space-between; padding:11px 4px; border-bottom:1px solid var(--cizgi2); font-size:15px; }
.cs-satir:last-child{ border-bottom:none; }
.cs-satir .cs-gun{ color:var(--soluk); font-weight:600; }
.cs-satir .cs-saat{ font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:.2px; }
.cs-satir.bugun{ background:var(--acc-100); margin:0 -16px; padding:11px 20px; border-bottom:none; border-radius:8px; }
.cs-satir.bugun .cs-gun{ color:var(--acc-koyu); font-weight:800; }

/* ===== FAZ 2: ETA geri sayım + Bahşiş + Temassız + Ücretsiz teslimat ===== */
/* Canlı ETA geri sayım */
.eta{ position:relative; display:flex; flex-direction:column; align-items:center; gap:2px; margin-top:14px;
  background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); border-radius:var(--r-lg); padding:24px 20px; box-shadow:var(--sh2); color:var(--metin); }
.eta::before{ content:''; position:absolute; inset:0; border-radius:inherit; border:2px solid var(--acc); opacity:0; animation:eta-nabiz 2.4s ease-out infinite; pointer-events:none; }
.eta.acil::before{ animation-duration:1.1s; }
@keyframes eta-nabiz{ 0%{ transform:scale(1); opacity:.5 } 100%{ transform:scale(1.04); opacity:0 } }
.eta .dk{ font-size:48px; font-weight:800; line-height:1; letter-spacing:-2px; font-variant-numeric:tabular-nums; color:var(--acc-koyu); }
.eta.acil .dk{ color:var(--acc); }
.eta .birim{ font-size:15px; font-weight:700; color:var(--soluk); text-transform:uppercase; letter-spacing:1px; }
.eta .etiket{ margin-top:8px; font-size:15px; color:var(--soluk); }
/* Bahşiş çipleri */
.bahsis{ display:flex; gap:9px; }
.bahsis-cip{ flex:1; background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); border-radius:var(--r-md); padding:14px 6px; text-align:center; font-weight:800; font-size:15px; color:var(--metin); box-shadow:var(--sh1); transition:transform .1s; }
.bahsis-cip:active{ transform:scale(.94); }
.bahsis-cip.sec{ color:#fff; border-color:rgba(255,255,255,.5); background:linear-gradient(180deg,#FF6B47 0%,var(--acc-koyu) 100%); box-shadow:var(--sh-cta); }
.bahsis-cip.ozel{ font-size:15px; display:flex; align-items:center; justify-content:center; gap:5px; }
.bahsis-cip.ozel .ico{ width:15px; height:15px; }
/* Temassız teslimat switch */
.tts{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:15px; background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); border:1px solid var(--cam-kenar2); border-radius:var(--r-md); box-shadow:var(--sh1); color:var(--metin); }
.tts .tts-met{ font-weight:700; font-size:15px; }
.tts .tts-alt{ color:var(--soluk); font-size:15px; margin-top:2px; }
.switch{ position:relative; width:52px; height:31px; flex:0 0 auto; border-radius:var(--r-pill); background:rgba(90,38,22,.22); box-shadow:inset 0 1px 3px rgba(40,14,8,.3); transition:background .2s; cursor:pointer; }
.switch::after{ content:''; position:absolute; top:3px; left:3px; width:25px; height:25px; border-radius:50%; background:#fff; box-shadow:0 2px 6px rgba(40,14,8,.4),inset 0 1px 0 rgba(255,255,255,.8); transition:transform .2s; }
.switch.acik{ background:var(--yesil); }
.switch.acik::after{ transform:translateX(21px); }
/* Ücretsiz teslimat ilerleme */
.ucret-ilerle{ margin:12px 0 4px; background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur); border:1px solid var(--cam-kenar2); border-radius:var(--r-md); padding:14px 16px; box-shadow:var(--sh1); color:var(--metin); }
.ucret-ust{ display:flex; align-items:center; gap:7px; font-size:15px; font-weight:700; margin-bottom:10px; }
.ucret-ust b{ color:var(--acc-koyu); }
.ucret-ust .ico{ width:16px; height:16px; flex:0 0 auto; }
.ucret-cubuk{ height:10px; border-radius:var(--r-pill); background:rgba(90,38,22,.16); overflow:hidden; box-shadow:inset 0 1px 2px rgba(40,14,8,.2); }
.ucret-dolu{ height:100%; border-radius:var(--r-pill); background:linear-gradient(90deg,#FF6B47,var(--acc)); box-shadow:0 0 10px rgba(232,49,42,.5); transition:width .5s cubic-bezier(.34,1.2,.64,1); }

/* ===== FAZ 3: Kırılımlı puan (lezzet/servis/paketleme) ===== */
.puan-grup{ background:var(--cam-duz); border:1px solid var(--cam-kenar); border-radius:var(--r-md); padding:4px 14px; margin-bottom:12px; }
.puan-satir{ display:flex; align-items:center; justify-content:space-between; padding:11px 0; border-bottom:1px solid var(--cizgi2); }
.puan-satir:last-child{ border-bottom:none; }
.puan-satir .et{ font-weight:700; font-size:15px; color:var(--metin); }
.yildizlar{ display:inline-flex; gap:5px; }
.yld{ width:30px; height:30px; display:grid; place-items:center; color:var(--soluk2); transition:transform .1s; }
.yld .ico{ width:26px; height:26px; }
.yld:active{ transform:scale(1.2); }
.yld.dolu{ color:#FFB020; }
.yld.dolu .ico{ fill:#FFC850; stroke:#FFB020; }
/* Müşteri yorum kırılım rozetleri + sıralama çipleri */
.yorum-kirilim{ display:flex; gap:10px; flex-wrap:wrap; margin-top:6px; font-size:13px; color:var(--soluk); }
.yorum-kirilim span{ font-weight:600; }
.yorum-sira{ display:flex; gap:8px; margin:0 0 12px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }   /* v284 fit-motor — dar ekranda (320) sıra çipleri sayfayı taşırmasın; yorum-filtre gibi yatay-kaydırılır */
.yorum-sira::-webkit-scrollbar{ display:none; }   /* v284 fit-motor */
.yorum-sira .ys-chip{ flex:0 0 auto; padding:6px 13px; border-radius:var(--r-pill); font-size:13px; font-weight:700; background:var(--cam-duz); border:1px solid var(--cam-kenar); color:var(--ak); }   /* v284 fit-motor — flex:0 0 auto (kaydırılabilir) */
.yorum-sira .ys-chip.sec{ background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; border-color:transparent; }
/* Menü ürünü diyet/alerjen etiketleri */
.m-etiketler{ display:flex; gap:6px; flex-wrap:wrap; margin-top:5px; }
.m-etiket{ font-size:13px; font-weight:700; padding:2px 8px; border-radius:var(--r-pill); background:var(--yesil-bg); color:var(--yesil); border:1px solid rgba(20,200,118,.3); }
.m-etiket.aci{ background:rgba(226,59,46,.14); color:var(--brand-700); border-color:rgba(226,59,46,.3); }

/* ===== FAZ 4: Sepet nabzı + Onboarding ===== */
.adet-bal{ position:relative; display:inline-grid; place-items:center; }
.adet-bal.artti{ animation:bal-pop .28s cubic-bezier(.34,1.56,.64,1); }
@keyframes bal-pop{ 0%{ transform:scale(1) } 45%{ transform:scale(1.35) } 100%{ transform:scale(1) } }
.adet-bal::before{ content:''; position:absolute; inset:-3px; border-radius:10px; border:2px solid rgba(255,255,255,.55); opacity:0; animation:bal-nabiz 2.6s ease-out infinite; pointer-events:none; }
@keyframes bal-nabiz{ 0%{ transform:scale(1); opacity:.55 } 100%{ transform:scale(1.5); opacity:0 } }
/* Onboarding alttan-açılır */
.ob-sheet{ padding-bottom:env(safe-area-inset-bottom); }
.ob-govde{ padding:8px 20px 4px; display:flex; flex-direction:column; gap:14px; }
.ob-adim{ display:flex; align-items:center; gap:14px; }
.ob-adim .ob-ik{ width:48px; height:48px; flex:0 0 auto; display:grid; place-items:center; border-radius:14px; background:var(--acc-100); color:var(--acc-koyu); }
.ob-adim .ob-ik .ico{ width:24px; height:24px; }
.ob-adim b{ display:block; font-size:15px; color:var(--metin); }
.ob-adim small{ color:var(--soluk); font-size:15px; }

/* ===== FAZ 5: Keşif filtre sheet (diyet + fiyat) ===== */
.filtre-btn{ position:relative; }
.filtre-say{ position:absolute; top:-6px; right:-6px; min-width:20px; height:20px; padding:0 6px; border-radius:var(--r-pill);
  background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; font-size:13px; font-weight:800;
  display:grid; place-items:center; border:1.5px solid rgba(255,255,255,.5); box-shadow:0 2px 8px rgba(232,49,42,.5); }
.fs-govde{ padding:6px 18px 10px; overflow-y:auto; }
.fs-bolum{ font-size:13px; font-weight:800; color:var(--soluk2); text-transform:uppercase; letter-spacing:.05em; margin:10px 2px 10px; }
.fs-cipler{ display:flex; flex-wrap:wrap; gap:9px; }
.fs-cip{ padding:9px 15px; border-radius:var(--r-pill); font-size:15px; font-weight:700; color:var(--metin);
  min-height:44px; display:inline-flex; align-items:center; /* v278 gece-kurul U9 */
  background:var(--cam-duz); border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); transition:transform .1s; }
.fs-cip:active{ transform:scale(.95); }
.fs-cip.sec{ color:#fff; border-color:transparent; background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); box-shadow:var(--sh-cta); }
.fs-alt{ display:flex; gap:10px; padding:12px 18px calc(14px + env(safe-area-inset-bottom)); position:sticky; bottom:0;
  background:linear-gradient(0deg,var(--cam-yogun-duz) 65%,transparent); border-top:1px solid var(--cizgi2); }
.fs-temizle{ flex:0 0 auto; padding:14px 20px; border-radius:var(--r-md); font-weight:800; font-size:15px; color:var(--soluk);
  background:var(--cam-duz); border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); }
.fs-uygula{ flex:1; }
.fs-temizle:active,.fs-uygula:active{ transform:scale(.985); }

/* ===== FAZ 6: Menü kategori çipleri + Çok satan + Faydalı-oy ===== */
.menu-kat-bar{ display:flex; gap:8px; overflow-x:auto; padding:2px 2px 12px; margin:0 -2px; scrollbar-width:none; }
.menu-kat-bar::-webkit-scrollbar{ display:none; }
.menu-kat-cip{ flex:0 0 auto; padding:8px 15px; border-radius:var(--r-pill); font-size:15px; font-weight:700; white-space:nowrap;
  color:var(--ak); background:var(--cam); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar); box-shadow:var(--sh1); }
.menu-kat-cip.sec{ color:#fff; border-color:transparent; background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); box-shadow:var(--sh-cta); }
/* Çok satan rozeti (menü görseli köşesi) */
.m-gorsel{ position:relative; }
.cs-rozet{ position:absolute; top:7px; left:7px; z-index:4; display:inline-flex; align-items:center; gap:5px;
  font-size:13px; font-weight:800; letter-spacing:.2px; padding:3px 9px 3px 7px; border-radius:var(--r-pill); color:#fff;
  background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); border:1px solid rgba(255,255,255,.35);
  box-shadow:0 3px 10px rgba(232,49,42,.4),inset 0 1px 0 rgba(255,255,255,.4); text-shadow:0 1px 3px rgba(120,20,0,.4); }
.cs-rozet .ico{ width:13px; height:13px; stroke:#fff; stroke-width:2; fill:none; flex:0 0 auto; }
/* Faydalı-oy butonu (yorum kartı) */
.fyd-btn{ display:inline-flex; align-items:center; gap:7px; margin-top:10px; padding:7px 13px; border-radius:var(--r-pill);
  font-size:15px; font-weight:700; color:var(--soluk); background:var(--cam-duz); border:1px solid var(--cam-kenar2);
  box-shadow:var(--sh1); transition:transform .12s,background .18s,color .18s,border-color .18s; }
.fyd-btn .ico{ width:16px; height:16px; stroke:currentColor; stroke-width:1.8; fill:none; transition:fill .18s; }
.fyd-btn:active{ transform:scale(.94); }
.fyd-btn .fyd-n{ font-variant-numeric:tabular-nums; }
.fyd-btn.secili{ color:var(--yesil); background:var(--yesil-bg); border-color:rgba(20,200,118,.4); }
.fyd-btn.secili .ico{ fill:var(--yesil); stroke:var(--yesil); }
/* UGC 1.2 (Apple kurul) — Yorum "Bildir" butonu: fyd-btn ikizi, daha sessiz/küçük */
.yrm-bildir{ margin-left:8px; padding:7px 11px !important; font-size:13px; opacity:.72; }
.yrm-bildir:active{ opacity:1; }

/* ===== FAZ 7: Flash kampanya rozeti + Bildirim/Görünüm tercih merkezi ===== */
.flash-rozet{ position:absolute; left:7px; bottom:7px; z-index:3; display:inline-flex; align-items:center; gap:6px;
  padding:5px 11px 5px 9px; border-radius:var(--r-pill); font-size:13px; font-weight:800; color:#fff; letter-spacing:.1px; max-width:84%;
  background:linear-gradient(105deg,var(--acc) 0%,var(--acc-koyu) 100%); border:1px solid rgba(255,255,255,.3);
  box-shadow:0 4px 14px rgba(232,49,42,.45),inset 0 1px 0 rgba(255,255,255,.4); text-shadow:0 1px 3px rgba(120,20,0,.45); }
.flash-rozet .ico{ width:14px; height:14px; stroke:#fff; stroke-width:2; fill:none; flex:0 0 auto; animation:flash-tik 2s steps(1) infinite; }
.flash-rozet b{ font-weight:800; }
@keyframes flash-tik{ 0%,100%{ opacity:1 } 50%{ opacity:.55 } }
.bt-bolum{ background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); border-radius:var(--r-lg); padding:4px 16px; box-shadow:var(--sh1); color:var(--metin); }
.bt-satir{ display:flex; align-items:center; gap:14px; padding:14px 0; border-bottom:1px solid rgba(90,38,22,.12); }
.bt-satir:last-child{ border-bottom:none; }
.bt-orta{ flex:1; min-width:0; }
.bt-ad{ font-weight:700; font-size:15px; color:var(--metin); }
.bt-ack{ font-size:14px; color:var(--soluk); margin-top:2px; line-height:1.35; }

/* ===== FAZ 8: Açık tema (token-swap; bileşen CSS'i değişmez) ===== */
:root[data-tema="acik"] body{
  background:
    radial-gradient(85% 55% at 60% -2%, #FFE2CC 0%, rgba(255,226,204,0) 52%),
    radial-gradient(92% 82% at 14% 106%, #FFF3E8 0%, rgba(255,243,232,0) 60%),
    linear-gradient(165deg, #FFF6EE 0%, #FBE9DC 50%, #F6DFD0 100%);
  background-attachment:fixed;
}

/* Faz 8: favori kalp pop animasyonu + esnaf kampanya flash satırı */
.r-kalp.kalp-pop{ animation:kalp-pop .4s cubic-bezier(.34,1.56,.64,1); }
@keyframes kalp-pop{ 0%{ transform:scale(1) } 35%{ transform:scale(1.4) } 60%{ transform:scale(.9) } 100%{ transform:scale(1) } }

/* ===================================================================== */
/*  FAZ 9 — Bildirim Merkezi (in-app)                                     */
/* ===================================================================== */
.bildirim{ position:relative; }
.bildirim-badge{
  position:absolute; top:-2px; right:-2px;
  min-width:17px; height:17px; padding:0 4px;
  display:grid; place-items:center;
  font-size:13px; font-weight:800; line-height:1; color:#fff;
  background:var(--kirmizi); border-radius:999px;
  box-shadow:0 0 0 2px var(--cam-yogun-duz), var(--sh1);
  animation:bm-badge-pop .22s ease; pointer-events:none;
}
@keyframes bm-badge-pop{ from{ transform:scale(0) } to{ transform:scale(1) } }

.bm-sheet{ padding-bottom:max(14px, env(safe-area-inset-bottom)); }
.bm-tumoku{
  margin-left:auto; margin-right:6px; padding:7px 11px;
  font-size:13px; font-weight:700; color:var(--acc);
  background:rgba(232,49,42,.10); border:none; border-radius:999px; cursor:pointer;
  transition:background .18s ease;
}
.bm-tumoku:active{ background:rgba(232,49,42,.18); }
.bm-liste{ max-height:64vh; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:2px 0 6px; }
.bm-item{
  position:relative; display:grid; grid-template-columns:40px 1fr auto;
  align-items:start; gap:12px; width:100%; min-height:44px; padding:13px 16px;
  text-align:left; background:transparent; border:none;
  border-bottom:1px solid var(--cizgi2); cursor:pointer; transition:background .18s ease;
}
.bm-item:last-child{ border-bottom:none; }
.bm-item:active{ background:rgba(232,49,42,.06); }
.bm-ik{
  display:grid; place-items:center; width:40px; height:40px; border-radius:12px;
  background:var(--cam); box-shadow:var(--sh1); color:var(--acc);
}
.bm-ik svg, .bm-ik .ico{ width:20px; height:20px; }
.bm-govde{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.bm-bas{ font-size:15px; font-weight:700; color:var(--metin); line-height:1.3; }
.bm-aciklama{
  font-size:15px; color:var(--soluk); line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.bm-zaman{ flex-shrink:0; font-size:13px; font-weight:600; color:var(--soluk); white-space:nowrap; padding-top:2px; }
.bm-okunmamis{ background:rgba(232,49,42,.06); }
.bm-okunmamis:active{ background:rgba(232,49,42,.11); }
.bm-okunmamis::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:3px; height:58%; border-radius:0 3px 3px 0; background:var(--acc);
}
.bm-okunmamis .bm-bas::after{
  content:""; display:inline-block; width:7px; height:7px; margin-left:7px;
  vertical-align:middle; border-radius:50%; background:var(--acc);
  box-shadow:0 0 0 3px rgba(232,49,42,.18);
}
.bm-bos{ display:flex; flex-direction:column; align-items:center; text-align:center; padding:54px 24px 60px; }
.bm-bos-ik{
  display:grid; place-items:center; width:64px; height:64px; margin-bottom:14px;
  border-radius:50%; background:var(--cam); box-shadow:var(--sh2); color:var(--soluk);
}
.bm-bos-ik svg, .bm-bos-ik .ico{ width:28px; height:28px; opacity:.55; }
.bm-bos-bas{ margin:0 0 4px; font-size:15px; font-weight:800; color:var(--metin); }
.bm-bos-alt{ margin:0; font-size:15px; color:var(--soluk); }

/* ===================================================================== */
/*  FAZ 13 — Kampanya carousel (kayan banner şeridi)                      */
/* ===================================================================== */
.kmp-carousel{ margin:14px 0 4px; }
.kmp-track{
  display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; scroll-behavior:smooth; padding:2px 16px 4px;
  scrollbar-width:none;
}
.kmp-track::-webkit-scrollbar{ display:none; }
.kmp-banner{
  flex:0 0 86%; max-width:430px; scroll-snap-align:center;
  display:flex; align-items:center; gap:12px; min-height:84px; padding:13px 15px;
  border:1px solid var(--cam-kenar); border-radius:18px;
  background:var(--cam); backdrop-filter:blur(var(--cam-blur)); -webkit-backdrop-filter:blur(var(--cam-blur));
  box-shadow:var(--sh2); color:var(--metin); text-align:left; cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease;
}
.kmp-banner:active{ transform:scale(.985); }
.kmp-ic{
  flex:0 0 auto; width:42px; height:42px; display:grid; place-items:center;
  border-radius:12px; background:var(--cam-yogun); color:var(--acc);
}
.kmp-ic svg, .kmp-ic .ico{ width:22px; height:22px; }
.kmp-ad{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:6px; }
.kmp-isim{ font-weight:800; font-size:15px; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kmp-etiket{
  align-self:flex-start; font-size:13px; font-weight:700; line-height:1; padding:5px 10px;
  border-radius:999px; background:var(--cam-yogun); color:var(--metin); white-space:nowrap;
}
.kmp-foto{ flex:0 0 auto; width:56px; height:56px; border-radius:14px; overflow:hidden; box-shadow:var(--sh1); background:var(--cam-yogun); }
.kmp-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.kmp-flash{ border-color:transparent; background:linear-gradient(135deg, var(--acc), var(--acc-koyu)); color:#fff; box-shadow:var(--sh-cta); }
.kmp-flash .kmp-ic{ background:rgba(255,255,255,.18); color:#fff; }
.kmp-flash .kmp-etiket{ background:rgba(255,255,255,.22); color:#fff; font-weight:800; }
.kmp-flash .kmp-foto{ box-shadow:0 0 0 2px rgba(255,255,255,.35); }
.kmp-dots{ display:flex; justify-content:center; gap:7px; margin-top:10px; }
.kmp-dot{ width:7px; height:7px; border-radius:50%; background:var(--soluk); opacity:.5; transition:width .2s ease, background .2s ease, opacity .2s ease; }
.kmp-dot--aktif{ width:18px; border-radius:4px; background:var(--acc); opacity:1; }
@media (prefers-reduced-motion:reduce){ .kmp-track{ scroll-behavior:auto; } .kmp-banner{ transition:none; } }

/* ===================================================================== */
/*  FAZ 10 — Kırılım puan özeti (lezzet/servis/paketleme barları)         */
/* ===================================================================== */
.kir-ozet{ display:flex; flex-direction:column; gap:9px; margin:2px 2px 14px; padding:14px 14px; background:var(--cam); border:1px solid var(--cam-kenar2); border-radius:16px; box-shadow:var(--sh1); }
.kir-row{ display:grid; grid-template-columns:74px 1fr 30px; align-items:center; gap:10px; }
.kir-et{ font-size:15px; font-weight:700; color:var(--soluk); }
.kir-bar{ height:8px; border-radius:999px; background:rgba(255,255,255,.10); overflow:hidden; box-shadow:inset 0 0 0 1px var(--cizgi2); }
.kir-bar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg, var(--amber), #FFC24B); }
.kir-val{ font-size:15px; font-weight:800; color:var(--metin); text-align:right; font-variant-numeric:tabular-nums; }

/* ===================================================================== */
/*  FAZ 16 — Erişilebilirlik (skip-link + focus-visible)                  */
/* ===================================================================== */
.skip-link{
  position:fixed; top:-60px; left:12px; z-index:2000;
  padding:10px 16px; border-radius:0 0 12px 12px;
  background:var(--acc); color:#fff; font-weight:800; font-size:15px;
  text-decoration:none; box-shadow:none; transition:top .18s ease;
  /* v225 (a11y P1) — visibility:hidden ODAKLANMAYI imkansız kılıyordu (özellik ölüydü).
     Hayalet-gölge sorunu gölgeyi yalnız focus'ta vererek çözüldü; link artık Tab ile erişilir. */
}
.skip-link:focus{ top:0; outline:none; box-shadow:var(--sh2); }
:focus-visible{ outline:2.5px solid var(--acc); outline-offset:2px; border-radius:6px; }
/* v190 — ekran-okuyucu görünmez canlı bölge (sepet adet duyurusu) */
.gorunmez-sr{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
/* v190 — arama modunda kategori ızgarası/carousel/"Tümünü göster" gizli → sonuçlar arama kutusunun hemen altında */
.wlt-head.ara-acik ~ .kat-grid,
.wlt-head.ara-acik ~ .tumunu-goster,
.wlt-head.ara-acik ~ .kat-bolum-bas,
.wlt-head.ara-acik ~ .kat-carousel{ display:none !important; }
/* v190 — arama kutusu focus halkası (klavye erişilebilirliği; önceki !important'lar input'a dokunduğundan kutuya veriyoruz) */
.ara-kutu:focus-within{ box-shadow:0 0 0 3px var(--acc-100); border-color:var(--acc); }
/* v190 — kontrast düzeltmesi (WCAG AA): açık gri yardımcı metinler beyaz üstünde 2.6–3.2 → 4.5+ */
.m-rest-info .mri-say{ color:#6B7080; }
.wf-meta{ color:#5F6470; }
/* v190 — küçük fiyat/link metinleri için koyu marka tonu (beyaz üstünde ~5:1) */
.wl-enc-fiyat, .up-fi, .ud-fiyat, .mri-detay, .m-art{ color:#C62828; }
/* v190 — dokunma hedefi ≥44px: görsel boyut korunur, isabet alanı ::after ile genişler */
.mri-detay{ position:relative; }
.mri-detay::after{ content:''; position:absolute; inset:-12px -8px; }
.wl-enc-ekle, .ekle, .m-kalp{ position:relative; }
.wl-enc-ekle::after, .ekle::after, .m-kalp::after{ content:''; position:absolute; inset:-6px; }
/* v190 — puanlama yıldızları isabet alanı */
.yld{ position:relative; }
.yld::after{ content:''; position:absolute; inset:-7px; }
/* v190 — sepette ürün adı 68px'e sıkışıyordu: stepper butonlarını 40→34, çöpü küçült → ada yer aç */
@media (max-width:520px){
  .s-satir .adet button{ width:34px; height:34px; font-size:20px; }
  .s-satir .adet .n{ min-width:16px; }
  .s-sil{ width:36px; height:36px; }
}
/* v190 — MASAÜSTÜ (≥1024px): huni ekranları mobil tek-kolon yerine ortalı içerik tavanı (Wolt deseni) */
@media (min-width:1024px){
  body[data-ekran="sepet"] #ekran > *,
  body[data-ekran="odeme"] #ekran > *,
  body[data-ekran="takip"] #ekran > *,
  body[data-ekran="gecmis"] #ekran > *,
  body[data-ekran="favoriler"] #ekran > *,
  body[data-ekran="profil"] #ekran > *{ max-width:760px; margin-inline:auto; }
  /* alt sekme çubuğu masaüstünde içeriğin son satırını örtmesin */
  .sar{ padding-bottom:120px; }
  /* favori kartları dev tek kolon yerine ızgara */
  body[data-ekran="favoriler"] #rListe,
  body[data-ekran="favoriler"] .wf-feed{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:18px; }
  /* yan sepet paneli kolonu tam doldursun (flex çocuk büzülmesi) */
  .menu-yan.wlt-deskonly{ display:block; }
  .menu-yan .myan-kart{ width:100%; box-sizing:border-box; }
}
/* v190 — MASAÜSTÜ hover geri bildirimi: tıklanabilir öğeler "ölü" hissettirmesin (yalnız imleçli cihaz) */
@media (hover:hover){
  .wf-bas:hover, .wl-enc-kart:hover, .wf-kart:hover, .gecmis-kart:hover, .up-kart:hover,
  .s-satir:hover{ background:rgba(0,0,0,.02); }
  .ud-ekle:hover, #devamBtn:hover, #siparisVerBtn:hover, .btn-buyuk:hover, .myan-git:hover{ filter:brightness(.94); }
  .wlt-pill:hover, .ud-opt:hover, .odeme-opt:hover, .bahsis-cip:hover, .adres-cip:hover, .zaman-seg button:hover{ background:#F2F0EC; }
  .s-sil:hover, .wl-enc-ekle:hover, .ekle:hover, .ud-kapat:hover, .mh-kapat:hover, .adet button:hover{ filter:brightness(.95); }
  .profil-link:hover, .ara-btn:hover, .btn-tekrar:hover{ background:rgba(0,0,0,.03); }
}
/* v190 — kalp (role=button) imleci pointer olmalıydı */
.r-kalp, .m-kalp{ cursor:pointer; }
.r-kart:focus-visible, .kmp-banner:focus-visible, .m-kart:focus-visible{ outline-offset:-2px; }
#ekran:focus{ outline:none; }
@media (prefers-reduced-motion:reduce){ .skip-link{ transition:none; } }

/* ===================================================================== */
/*  FAZ 17 — Güven katmanı: doğrulanmış rozet + puan histogramı + filtre  */
/* ===================================================================== */
.yorum-dogrulanmis{ display:inline-flex; align-items:center; gap:3px; font-size:13px; font-weight:700; color:var(--yesil); background:rgba(40,180,99,.12); border-radius:999px; padding:3px 8px; }
.yorum-dogrulanmis svg, .yorum-dogrulanmis .ico{ width:12px; height:12px; }
.pd-ozet{ display:flex; flex-direction:column; gap:6px; margin:2px 2px 12px; padding:13px 14px; background:var(--cam); border:1px solid var(--cam-kenar2); border-radius:16px; box-shadow:var(--sh1); }
.pd-row{ display:grid; grid-template-columns:34px 1fr 24px; align-items:center; gap:9px; }
.pd-yild{ display:inline-flex; align-items:center; gap:1px; font-size:13px; font-weight:800; color:var(--soluk); }
.pd-yild svg, .pd-yild .ico{ width:11px; height:11px; }
.pd-bar{ height:8px; border-radius:999px; background:rgba(255,255,255,.10); overflow:hidden; box-shadow:inset 0 0 0 1px var(--cizgi2); }
.pd-bar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg, var(--amber), #FFC24B); }
.pd-n{ font-size:13px; font-weight:700; color:var(--soluk); text-align:right; font-variant-numeric:tabular-nums; }
.yorum-filtre{ display:flex; gap:7px; overflow-x:auto; padding:2px 0 8px; scrollbar-width:none; }
.yorum-filtre::-webkit-scrollbar{ display:none; }
.yf-chip{ flex:0 0 auto; font-size:13px; font-weight:700; color:var(--soluk); background:var(--cam); border:1px solid var(--cam-kenar); border-radius:999px; padding:6px 13px; cursor:pointer; transition:all .15s ease; }
.yf-chip.sec{ color:#fff; background:var(--acc); border-color:transparent; }

/* ===================================================================== */
/*  FAZ 18 — Keşif: ücretsiz teslimat rozeti + "yine ister misin" satırı  */
/* ===================================================================== */
.r-rozet.r-bedava{ color:var(--yesil); background:rgba(40,180,99,.12); }
.r-rozet.r-bedava svg, .r-rozet.r-bedava .ico{ color:var(--yesil); }
.ts-sira{ display:flex; gap:10px; overflow-x:auto; padding:2px 2px 10px; scrollbar-width:none; }
.ts-sira::-webkit-scrollbar{ display:none; }
.ts-kart{ flex:0 0 auto; max-width:75%; display:flex; align-items:center; gap:10px; padding:11px 14px; background:var(--cam); border:1px solid var(--cam-kenar); border-radius:14px; box-shadow:var(--sh1); cursor:pointer; text-align:left; transition:transform .12s ease; }
.ts-kart:active{ transform:scale(.97); }
.ts-ik{ flex:0 0 auto; width:36px; height:36px; display:grid; place-items:center; border-radius:10px; background:rgba(232,49,42,.12); color:var(--acc); }
.ts-ik svg, .ts-ik .ico{ width:18px; height:18px; }
.ts-ic{ display:flex; flex-direction:column; min-width:0; }
.ts-ad{ font-size:15px; font-weight:800; color:var(--metin); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ts-alt{ font-size:14px; color:var(--soluk); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ===================================================================== */
/*  FAZ 19 — Ürün detay modal + menü kartı ürün-favori kalbi             */
/* ===================================================================== */
.m-gorsel{ position:relative; }
.m-kalp{ position:absolute; top:6px; right:6px; width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:rgba(0,0,0,.32); color:#fff; cursor:pointer; -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.m-kalp svg, .m-kalp .ico{ width:16px; height:16px; }
.m-kalp.dolu{ color:var(--kirmizi); }
.m-kalp.dolu svg, .m-kalp.dolu .ico{ fill:var(--kirmizi); }
.m-ic[data-urundetay], .m-gorsel[data-urundetay]{ cursor:pointer; }

.ud-sheet{ display:flex; flex-direction:column; max-height:92vh; padding:0; overflow:hidden; }
.ud-head{ position:relative; z-index:3; padding:8px 16px 6px; }
.ud-kapat{ position:absolute; top:8px; right:14px; }
.ud-scroll{ flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.ud-foto{ position:relative; width:100%; aspect-ratio:16/9; background:var(--cizgi2); overflow:hidden; }
.ud-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.ud-foto-rozet{ position:absolute; left:14px; top:14px; display:flex; gap:6px; }
.ud-kalp{ position:absolute; top:12px; right:12px; width:38px; height:38px; }
.ud-govde{ padding:16px 18px 8px; }
/* v189 — Wolt ürün modalı deseni: fiyat BAŞLIĞIN ALTINDA (yan yana değil), başlık 700 24/1.21,
   fiyat 600 16 marka, açıklama 400 16/1.375 metin renginde (gri değil) + geniş üst boşluk. */
.ud-bas{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; }
.ud-ad{ margin:0; font-size:24px; font-weight:700; line-height:1.21; color:var(--metin); }
.ud-fiyat{ font-size:15px; font-weight:600; color:var(--brand-700); white-space:nowrap; }
.ud-ack{ margin:22px 0 0; font-size:15px; line-height:1.375; color:var(--metin); white-space:pre-wrap; }
.ud-govde .m-etiketler{ margin-top:14px; }
.ud-gruplar{ margin-top:6px; }
.ud-grup{ margin-top:18px; }
.ud-grup-bas{ display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.ud-grup-ad{ font-size:15px; font-weight:800; color:var(--metin); }
.ud-zorunlu, .ud-opsiyonel{ font-size:13px; font-weight:700; padding:3px 8px; border-radius:999px; }
.ud-zorunlu{ color:var(--acc); background:rgba(232,49,42,.12); }
.ud-opsiyonel{ color:var(--soluk); background:var(--cizgi2); }
.ud-opt{ position:relative; display:flex; align-items:center; gap:10px; min-height:48px; padding:0 14px; margin-bottom:8px; border:1px solid var(--cam-kenar); border-radius:14px; background:var(--cam); cursor:pointer; transition:border-color .15s, background .15s, transform .08s; }
.ud-opt:active{ transform:scale(.99); }
.ud-opt input{ position:absolute; opacity:0; pointer-events:none; }
.ud-opt-ad{ flex:1; font-size:15px; font-weight:600; color:var(--metin); }
.ud-opt-f{ font-size:15px; font-weight:700; color:var(--brand-700); }
.ud-tik{ width:22px; height:22px; border-radius:50%; border:2px solid var(--cizgi2); flex:0 0 auto; position:relative; transition:.15s; }
.ud-tik[data-tip="cok"]{ border-radius:7px; }
.ud-opt input:checked ~ .ud-tik{ border-color:var(--acc); background:var(--acc); }
.ud-opt input:checked ~ .ud-tik::after{ content:""; position:absolute; left:6px; top:2px; width:5px; height:10px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.ud-altbar{ flex:0 0 auto; display:flex; align-items:center; gap:12px; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:var(--cam-yogun); -webkit-backdrop-filter:blur(var(--cam-blur)); backdrop-filter:blur(var(--cam-blur)); border-top:1px solid var(--cam-kenar); box-shadow:var(--sh3); }
/* v189 — Wolt ürün modalı adet kutusu: 56px yükseklik, radius 20, marka-tonlu DÜZ zemin (beyaz kutu+kenar değil),
   − / + marka renginde, gölgesiz. Ölçüler gerçek Wolt'tan (56px grid, corner-radius-xlarge 20, bg-surface-brand). */
.ud-altbar .ud-adet{ flex:0 0 auto; height:56px; gap:0; padding:0; border:none; box-shadow:none; border-radius:20px; background:rgba(232,49,42,.09); }
.ud-altbar .ud-adet button{ width:52px; height:56px; border-radius:20px; background:transparent; color:var(--acc); font-size:26px; font-weight:600; }
.ud-altbar .ud-adet .n{ min-width:28px; font-size:15px; font-weight:600; color:var(--acc-koyu); }
.ud-ekle{ flex:1; display:flex; align-items:center; justify-content:center; gap:8px; min-height:56px; padding:0 16px; border:0; border-radius:14px; background:var(--acc); color:#fff; font-size:15px; font-weight:600; box-shadow:var(--sh-cta); cursor:pointer; transition:transform .08s; }
.ud-ekle:active{ transform:scale(.98); }
.ud-ekle svg, .ud-ekle .ico{ width:18px; height:18px; }
.ud-ekle-fiyat{ font-variant-numeric:tabular-nums; }
@media (prefers-reduced-motion:reduce){ .ud-opt, .ud-ekle{ transition:none; } }

.m-kalp.kalp-pop, .ud-kalp.kalp-pop{ animation:kalp-pop .4s cubic-bezier(.34,1.56,.64,1); }

/* ===================================================================== */
/*  FAZ 20 — Gel-al + kupon önerisi + upsell                             */
/* ===================================================================== */
.gelal-not{ font-size:15px; color:var(--soluk); line-height:1.4; margin-top:2px; }
/* v233 mobil-fix: display:flex idi → her kelime/<b> ayrı flex-item oluyor, dar mobilde
   "75" ile "₺" ayrı satıra düşüyordu. Düz metin akışı + inline ikon + fiyat nowrap. */
.kupon-oneri{ display:block; margin-top:8px; padding:9px 12px; font-size:15px; font-weight:600; color:var(--brand-700); background:rgba(232,49,42,.08); border:1px dashed rgba(232,49,42,.35); border-radius:12px; line-height:1.45; }
.kupon-oneri svg, .kupon-oneri .ico{ width:15px; height:15px; display:inline-block; vertical-align:-2px; margin-right:5px; }
.kupon-oneri b{ white-space:nowrap; }
.up-bas{ font-size:15px; font-weight:800; color:var(--metin); margin:18px 2px 10px; }
.up-sira{ display:flex; gap:10px; overflow-x:auto; padding:2px 2px 8px; scrollbar-width:none; }
.up-sira::-webkit-scrollbar{ display:none; }
.up-kart{ flex:0 0 auto; width:130px; position:relative; display:flex; flex-direction:column; gap:6px; padding:8px; background:var(--cam); border:1px solid var(--cam-kenar); border-radius:14px; box-shadow:var(--sh1); cursor:pointer; text-align:left; transition:transform .12s ease; }
.up-kart:active{ transform:scale(.97); }
.up-foto{ width:100%; aspect-ratio:1/1; border-radius:10px; overflow:hidden; background:var(--cam-yogun); }
.up-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.up-ad{ font-size:13px; font-weight:700; color:var(--metin); line-height:1.25; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.up-fi{ font-size:15px; font-weight:800; color:var(--brand-700); }
.up-art{ position:absolute; right:8px; bottom:8px; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:var(--acc); color:#fff; box-shadow:var(--sh-cta); }
.up-art svg, .up-art .ico{ width:15px; height:15px; }

/* ===================================================================== */
/*  FAZ 21 — Retention: müşteri seviye kartı + doğum günü                 */
/* ===================================================================== */
.seviye-kart{ margin:8px 2px 16px; padding:15px 16px; background:linear-gradient(135deg, rgba(232,49,42,.14), rgba(232,49,42,.05)); border:1px solid var(--cam-kenar); border-radius:18px; box-shadow:var(--sh1); }
.sv-ust{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.sv-rozet{ display:inline-flex; align-items:center; gap:6px; font-size:15px; font-weight:800; color:var(--metin); }
.sv-rozet svg, .sv-rozet .ico{ width:18px; height:18px; color:var(--amber); }
.sv-say{ font-size:15px; font-weight:700; color:var(--soluk); }
.sv-bar{ height:8px; border-radius:999px; background:rgba(255,255,255,.12); overflow:hidden; box-shadow:inset 0 0 0 1px var(--cizgi2); }
.sv-bar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg, var(--acc), var(--acc-koyu)); }
.sv-not{ font-size:14px; color:var(--soluk); margin-top:8px; }
.dg-satir{ display:flex; align-items:center; gap:12px; padding:4px 2px; }
.dg-satir input{ width:120px; padding:10px 12px; border:1px solid var(--cam-kenar); border-radius:12px; background:var(--cam-yogun-duz); color:var(--metin); font-size:16px; font-weight:700; text-align:center; }
.dg-not{ font-size:14px; color:var(--soluk); }

/* ===================================================================== */
/*  FAZ 23 — UX cila: toast geri-al + route animasyon + tamlık + veri     */
/* ===================================================================== */
.toast-msg{ margin-right:4px; }
.toast-geri{ margin-left:12px; padding:5px 12px; font-size:15px; font-weight:800; color:#fff; background:rgba(255,255,255,.18); border:0; border-radius:999px; cursor:pointer; }
.toast-geri:active{ background:rgba(255,255,255,.30); }
@keyframes ekranGir{ from{ opacity:.35; transform:translateY(7px) } to{ opacity:1; transform:none } }
.sar.ekran-gir{ animation:ekranGir .22s cubic-bezier(.22,.61,.36,1); }
@media (prefers-reduced-motion:reduce){ .sar.ekran-gir{ animation:none } }
.tamlik-kart{ margin:0 2px 16px; padding:13px 15px; background:var(--cam); border:1px solid var(--cam-kenar2); border-radius:16px; box-shadow:var(--sh1); }
.tk-ust{ display:flex; align-items:center; justify-content:space-between; font-size:15px; font-weight:700; color:var(--soluk); margin-bottom:8px; }
.tk-ust b{ color:var(--brand-700); }
.tk-bar{ height:8px; border-radius:999px; background:rgba(255,255,255,.10); overflow:hidden; box-shadow:inset 0 0 0 1px var(--cizgi2); }
.tk-bar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg, var(--yesil), #5fd08a); }
.tk-not{ font-size:14px; color:var(--soluk); margin-top:8px; }
.veri-btn{ flex:1; display:flex; align-items:center; justify-content:center; gap:6px; font-size:15px; font-weight:700; padding:11px 8px; }
.veri-btn svg, .veri-btn .ico{ width:15px; height:15px; }
.veri-sil{ color:var(--kirmizi); }

.pd-not{ font-size:14px; color:var(--soluk); text-align:center; margin-top:4px; }

/* ===================================================================== */
/*  FAZ 25 — Gerçek görsel cilası (ürün detay sinematik overlay)         */
/* ===================================================================== */
.ud-foto::after{ content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(to bottom, rgba(20,10,6,.26) 0%, transparent 26%, transparent 60%, rgba(20,10,6,.30) 100%); }
.ud-foto img{ filter:saturate(1.1) contrast(1.03); }

/* ===================================================================== */
/*  FAZ 26 — Bileşen cilası: dokunma hedefi + sepet CTA tutarı           */
/* ===================================================================== */
.r-kalp::before,.m-kalp::before{ content:''; position:absolute; inset:-8px; border-radius:50%; }   /* görünmez dokunma tamponu (44px+) */
.yf-chip,.ys-chip{ min-height:44px; }
.devam-tutar{ margin-left:auto; font-variant-numeric:tabular-nums; }
#devamBtn{ display:flex; align-items:center; justify-content:center; gap:8px; }

/* ===================================================================== */
/*  v102 — 20-AJAN UI TARAMASI: premium cila (override katmanı)          */
/* ===================================================================== */

/* --- Kategori çipleri: kompakt + snap + aktif scale --- */
.chip{width:66px;height:74px;border-radius:20px}
.chip svg{width:24px;height:24px}
.chip-sira{gap:9px;scroll-snap-type:x proximity;-webkit-mask:linear-gradient(90deg,#0000,#000 14px,#000 calc(100% - 16px),#0000)}
.chip{scroll-snap-align:start}
.chip.aktif{transform:scale(1.04)}
.chip.aktif svg{fill:rgba(255,255,255,.18)}

/* --- Restoran kartı: foto gradient + fotodaki puan + chevron ortala + press --- */
.r-foto{position:relative}
.r-foto::after{content:'';position:absolute;inset:auto 0 0 0;height:44%;background:linear-gradient(transparent,rgba(20,8,4,.30));pointer-events:none}
.r-foto .r-puan{position:absolute;left:6px;bottom:6px;z-index:3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.r-kart .chev{top:50%;transform:translateY(-50%);opacity:.5}
.r-kart:active{transform:scale(.985);transition:transform .09s}
.r-kalp{width:36px;height:36px;display:grid;place-items:center}
.r-kalp::before,.m-kalp::before{content:'';position:absolute;inset:-7px;border-radius:50%}

/* --- Menü kartı: sticky kategori + tipografi ritmi + press + adet koyu-tema + kısa rozet --- */
.kat-bas{position:sticky;top:0;z-index:6;background:var(--cam-yogun-duz);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);margin:18px 0 10px;padding:8px 4px}
.m-ad{line-height:1.25;letter-spacing:-.2px}
.m-ack{margin-top:5px}
.m-kart{transition:box-shadow .14s,transform .12s}
.m-kart:active{transform:scale(.985)}
.adet{background:var(--cam-yogun)}
.cs-rozet{padding:3px 8px;font-size:13px}

/* --- Ürün detay: CTA tutar pill + seçili satır tint + kilit + daha yüksek foto --- */
.ud-foto{aspect-ratio:4/3}
.ud-ekle{justify-content:space-between;padding:0 18px}
.ud-ekle>span:nth-of-type(1){margin-right:auto}
.ud-ekle-fiyat{padding:0}   /* v189 — Wolt: fiyat düz metin, chip zemin yok */
.ud-ekle.kilit{background:var(--cizgi2);color:var(--soluk);box-shadow:none;pointer-events:none}
.ud-opt.secili{border-color:var(--acc);background:var(--acc-100)}
.ud-opt.secili .ud-opt-ad{font-weight:700;color:var(--metin)}

/* --- Sepet: ara-toplam + foto büyüt + press --- */
.ara-toplam{display:flex;justify-content:space-between;align-items:center;color:var(--soluk);font-weight:600;font-size:15px;margin:16px 4px 0}
.ara-toplam.s-indirim,.ara-toplam.s-indirim span{color:var(--yesil);font-weight:700}
.toplam{margin-top:6px}
.s-foto-sar{width:62px;height:62px;border-radius:15px}
.s-satir{transition:transform .1s}.s-satir:active{transform:scale(.99)}
#devamBtn .devam-tutar{background:rgba(255,255,255,.2);padding:5px 12px;border-radius:var(--r-pill)}

/* --- Ödeme: tabular rakam + odak satırı + segment/bahşiş marka + disabled netliği --- */
.ode-ozet .oz-fi,.oz-top span,.devam-tutar,.ud-ekle-fiyat{font-variant-numeric:tabular-nums}
.ode-satir:focus-within{background:rgba(232,49,42,.05);border-radius:12px}
.zaman-seg button.sec{box-shadow:var(--sh-cta)}
.bahsis-cip.sec{background:linear-gradient(180deg,var(--acc),var(--acc-koyu));border-color:transparent;color:#fff}
.odeme-opt.opt-disabled{opacity:.5}
.btn-buyuk:disabled{opacity:.45;filter:grayscale(.25)}
.tts{transition:transform .1s,border-color .2s}.tts:active{transform:scale(.99)}

/* --- Takip: ilerleme glow + aktif dot nabız + yıldız pop --- */
.adimlar::after{box-shadow:0 0 8px rgba(40,180,99,.5)}
.adim.aktif .dot{position:relative}
.adim.aktif .dot::after{content:'';position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--acc);animation:dotRing 1.7s ease-out infinite;pointer-events:none}
@keyframes dotRing{0%{transform:scale(1);opacity:.55}100%{transform:scale(1.5);opacity:0}}
.yld.dolu{animation:yldPop .25s cubic-bezier(.34,1.6,.64,1)}
@keyframes yldPop{0%{transform:scale(.6)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.eta.acil .dk{animation:acilVur 1s ease-in-out infinite}
@keyframes acilVur{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}

/* --- Değerlendirme: tıklanabilir histogram + kırılım marka rengi + /5 --- */
.pd-row{width:100%;border:0;background:none;cursor:pointer;text-align:left;padding:0}
.pd-row:active{opacity:.65}.pd-bar i{min-width:3px}
.kir-bar i{background:linear-gradient(90deg,var(--amber),#FFC24B)}
.yo-puan::after{content:' /5';font-size:15px;font-weight:600;color:var(--soluk2)}

/* --- Profil: switch yay + seviye glow + tamlık aksanı + KVKK yıkıcı --- */
.switch::after{transition:transform .28s cubic-bezier(.34,1.56,.64,1),width .2s}
.sv-bar i,.tk-bar i{transition:width .6s cubic-bezier(.22,.61,.36,1)}
.sv-rozet svg{filter:drop-shadow(0 0 6px rgba(245,180,40,.5))}
.tamlik-kart{border-left:3px solid var(--yesil)}
.adres-kayit{transition:transform .12s,background .2s}.adres-kayit:active{transform:scale(.985)}
.veri-sil{background:rgba(232,49,42,.08);border-color:rgba(232,49,42,.28)}

/* --- Nav + sepet bar: aktif pop + gösterge + sepet slide-up + geri 44px --- */
.botnav-ic button.aktif{animation:navPop .3s cubic-bezier(.34,1.56,.64,1)}
@keyframes navPop{0%{transform:scale(.85)}60%{transform:scale(1.06)}100%{transform:scale(1)}}
.botnav-ic button.aktif::after{content:'';width:18px;height:3px;border-radius:3px;background:var(--acc);margin-top:3px}
.sepet-bar:not(.gizli){animation:barUp .32s cubic-bezier(.16,1,.3,1)}
@keyframes barUp{from{transform:translateY(120%)}to{transform:translateY(0)}}
.ust .geri{width:44px;height:44px}

/* --- Boş durum: daire ikon kabı → tek kurala indirildi (v232), aşağıda tek yetkili blok --- */

/* --- Çip ailesi tutarlılığı: yf-chip seçili gradyan + gölge --- */
.yf-chip{box-shadow:var(--sh1)}
.yf-chip.sec{background:linear-gradient(180deg,var(--acc),var(--acc-koyu));box-shadow:var(--sh-cta)}

/* --- Bottom-sheet: tabandan tam giriş + tutamaç dokunma alanı --- */
.mh-sheet{animation:mhsUp .3s cubic-bezier(.16,1,.3,1)}
@keyframes mhsUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.mh-handle{padding:9px 0;background-clip:content-box;box-sizing:content-box}

/* --- Toast: pop giriş + ömür çizgisi + sepet barı çakışması + marka geri-al --- */
.toast{transition:opacity .2s,transform .26s cubic-bezier(.34,1.56,.64,1)}
body.sepet-acik .toast{bottom:calc(168px + env(safe-area-inset-bottom))}
.toast-geri{border:1px solid rgba(255,255,255,.4)}
.toast.gor.has-action::after{content:'';position:absolute;left:0;bottom:0;height:2px;background:var(--acc);width:100%;animation:toastOmur 4.5s linear forwards;border-radius:0 0 12px 12px}
@keyframes toastOmur{to{width:0}}

/* --- Carousel: başlık + stagger giriş --- */
.kmp-carousel{margin:18px 0 6px}
.kmp-carousel::before{content:'Sana özel kampanyalar';display:block;font-size:15px;font-weight:800;letter-spacing:-.3px;color:var(--metin);padding:0 16px;margin-bottom:11px}
@keyframes seritGir{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){.ts-sira{animation:seritGir .4s ease both}.kmp-carousel{animation:seritGir .4s .05s ease both}.sira-bar{animation:seritGir .4s .1s ease both}}
.acik-chip.sec{background:linear-gradient(180deg,var(--yesil),#1f9e54);box-shadow:0 4px 14px rgba(40,180,99,.4)}

/* ===================================================================== */
/*  FAZ 32 — Hero restoran kartı (dikey: büyük foto + alt bilgi)          */
/* ===================================================================== */
.rh-sira{ display:flex; flex-direction:column; }
.r-kart--hero{ flex-direction:column; gap:0; padding:0; align-items:stretch; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh3); margin-bottom:16px; }
.r-kart--hero:active{ transform:scale(.98); transition:transform .09s; }
.rh-foto{ position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; background:linear-gradient(135deg,#E9C7B0,#D7A98C); }
.rh-foto img{ width:100%; height:100%; object-fit:cover; filter:saturate(1.08); position:absolute; inset:0; }
.rh-foto-bos{ display:grid; place-items:center; height:100%; font-size:48px; color:rgba(255,255,255,.85); }
.rh-grad{ position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(180deg,rgba(20,8,4,.34) 0%,rgba(20,8,4,0) 26%,rgba(20,8,4,0) 60%,rgba(20,8,4,.46) 100%); }
.rh-ust-sol{ position:absolute; top:11px; left:11px; z-index:3; }
.rh-ust-sol .r-durum{ box-shadow:0 2px 8px rgba(20,8,4,.30); }
.rh-ust-sag{ position:absolute; top:11px; right:54px; z-index:3; display:flex; justify-content:flex-end; }
.rh-kamp{ position:static; left:auto; right:auto; top:auto; bottom:auto; box-shadow:0 3px 10px rgba(20,8,4,.34); }
.rh-kalp{ top:10px; right:10px; left:auto; width:38px; height:38px; z-index:4; background:rgba(30,14,8,.40); box-shadow:0 3px 10px rgba(20,8,4,.34); }
.rh-puan-sar{ position:absolute; left:11px; bottom:11px; z-index:3; }
.rh-puan-sar .r-puan{ font-size:15px; padding:4px 11px; box-shadow:0 3px 10px rgba(120,80,10,.34); }
.rh-logo{ bottom:11px; right:11px; left:auto; top:auto; width:42px; height:42px; border-radius:12px; z-index:3; }
.rh-bilgi{ display:flex; flex-direction:column; gap:4px; padding:13px 15px 15px; background:var(--cam); -webkit-backdrop-filter:blur(var(--cam-blur)); backdrop-filter:blur(var(--cam-blur)); border-top:1px solid var(--cam-kenar); }
.rh-ad{ font-size:24px; letter-spacing:-.4px; white-space:normal; line-height:1.15; }
.rh-bilgi .r-rozetler{ margin-top:7px; }
@media (hover:hover){ .r-kart--hero:hover{ transform:translateY(-3px); box-shadow:var(--sh3); } }
.r-kart--hero.kart-kapali .rh-foto{ filter:grayscale(.55); }

/* ===================================================================== */
/*  FAZ 29 — Adres yapısal alanlar + konum pin                            */
/* ===================================================================== */
.adres-ek{ display:flex; gap:8px; margin-top:8px; }
.adres-ek input{ flex:1; min-width:0; padding:11px 12px; border:1px solid var(--cam-kenar); border-radius:12px; background:var(--cam-yogun-duz); color:var(--metin); font-size:16px; }
.konum-pin{ display:flex; align-items:center; justify-content:center; gap:7px; width:100%; margin-top:9px; padding:11px; font-size:15px; font-weight:700; color:var(--brand-700); background:rgba(232,49,42,.07); border:1px dashed rgba(232,49,42,.4); border-radius:12px; cursor:pointer; }
.konum-pin svg, .konum-pin .ico{ width:16px; height:16px; }
.konum-pin.var{ color:var(--yesil); background:rgba(40,180,99,.10); border-style:solid; border-color:rgba(40,180,99,.35); }
.konum-pin:active{ transform:scale(.99); }

/* FAZ 30 — pull-to-refresh görsel ipucu */
.sar.ptr-hazir{ box-shadow:inset 0 4px 0 -1px var(--acc); }

/* ===== Canlı kurye haritası (Leaflet) — takip ekranı 'yolda' iken ===== */
.takip-harita-sar{ margin:16px 0; border-radius:18px; overflow:hidden; background:var(--kart); border:1px solid var(--cizgi2); box-shadow:var(--sh1); }
.takip-harita-bas{ display:flex; align-items:center; gap:8px; padding:12px 14px; font-weight:700; font-size:15px; color:var(--metin); }
.takip-harita-bas svg{ width:18px; height:18px; }
/* Leaflet konteyneri sabit yükseklik almalı (yoksa 0px → harita görünmez) */
.takip-harita{ width:100%; height:260px; background:#e8e2dc; }
.takip-harita-not{ padding:9px 14px; font-size:13px; color:var(--soluk); border-top:1px solid var(--cizgi2); }
/* divIcon pin — ayrı görsel dosyasız (CDN marker-icon.png bağımlılığı yok) */
.kh-pin-wrap{ background:transparent; border:none; }
.kh-pin{
  width:34px; height:34px; border-radius:50% 50% 50% 0; transform:rotate(-45deg);
  background:var(--kh,#4C261B); display:flex; align-items:center; justify-content:center;
  box-shadow:0 3px 8px rgba(0,0,0,.35); border:2px solid #fff;
}
.kh-pin svg{ width:16px; height:16px; transform:rotate(45deg); color:#fff; }
/* Leaflet popup metni tema rengiyle uyumlu */
.leaflet-popup-content{ font-size:15px; font-weight:600; color:#241712; }
/* Leaflet kontrol/atıf z-index'i overlay'lerin ALTINDA kalsın (sheet açılınca çakışmasın) */
.takip-harita .leaflet-top, .takip-harita .leaflet-bottom{ z-index:400; }

/* ====== Online ödeme (PayTR güvenli iframe overlay) — Faz 34 ====== */
.paytr-overlay{
  position:fixed; inset:0; z-index:2000; display:flex; align-items:flex-end; justify-content:center;
  background:rgba(10,7,6,.62); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  opacity:0; pointer-events:none; transition:opacity .22s ease;
}
.paytr-overlay.acik{ opacity:1; pointer-events:auto; }
@media (min-width:560px){ .paytr-overlay{ align-items:center; } }
.paytr-modal{
  position:relative; width:100%; max-width:480px; max-height:92vh; display:flex; flex-direction:column;
  background:#fff; border-radius:20px 20px 0 0; overflow:hidden;
  box-shadow:0 -10px 40px rgba(0,0,0,.32); transform:translateY(16px); transition:transform .24s cubic-bezier(.22,1,.36,1);
}
.paytr-overlay.acik .paytr-modal{ transform:translateY(0); }
@media (min-width:560px){ .paytr-modal{ border-radius:20px; } }
.paytr-bar{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:14px 16px; border-bottom:1px solid #eee; font-size:15px; color:#241712; flex:0 0 auto;
}
.paytr-bar b{ font-weight:800; }
.paytr-kapat{
  border:0; background:#f4f0ee; color:#241712; width:34px; height:34px; border-radius:50%;
  font-size:24px; line-height:1; cursor:pointer; display:grid; place-items:center;
}
.paytr-kapat:active{ transform:scale(.94); }
.paytr-yuk{ padding:32px 16px; text-align:center; color:#7a6a63; font-size:15px; font-weight:600; }
#paytrIframe{ width:100%; min-height:480px; border:0; background:#fff; flex:1 1 auto; }

/* ============================================================================
   v105 — "AYDINLIK PREMIUM" tema (20-ajan ortak kararı)
   Açık · ferah · premium · yumuşak. Koyu-cam temayı token-remap ile çevirir:
   --cam (yüzey)→beyaz, --ak (yazı)→koyu mürekkep, --cam-kenar→hairline,
   --sh* gölgeler→tüy, --acc→sıcak mercan-kil. Beyaz-üstü-vurgu yazılar (#fff)
   olduğu gibi kalır (vurgu zeminin üstünde). Bu blok DOSYANIN SONUNDA → cascade kazanır.
   ============================================================================ */
:root{
  /* — yüzeyler: cam → katı/yarı beyaz — */
     
   
  
                   /* yapışkan başlık buzlu */
    
   
  /* — mürekkep — */
   
    
  
  /* — tek vurgu: sıcak mercan-kil — */
    
    
  /* — durum renkleri (az doygun) — */
   
   
    
  /* — tüy gölgeler: TEK ipucu, sıcak/inset YOK — */
  
  
  
  
  
  /* — köşe: daha net/premium — */
      
  /* — yumuşak hareket eğrileri — */
  
  
}
/* zemin: koyu mesh → aydınlık nötr */
body{
  background:#F7F8FA !important; background-attachment:initial !important;
  color:var(--metin);
}
/* yapışkan üst bar → buzlu beyaz, koyu yazı */
.ust{ background:var(--glass); -webkit-backdrop-filter:saturate(120%) blur(20px); backdrop-filter:saturate(120%) blur(20px);
  border-bottom:1px solid var(--cam-kenar); color:var(--metin); box-shadow:none; }
.ust .geri{ background:var(--surface,#fff); border:1px solid var(--cam-kenar); box-shadow:var(--sh1); color:var(--metin); }
.ust .sehir{ background:#fff; border:1px solid var(--cam-kenar); color:var(--metin); }

/* TÜM metin-gölgelerini öldür (koyu zemin kalıntısı; açık temada artefakt) */
.ust .baslik,.selam h1,.selam p,.konum .ktxt b,.r-ad,.rh-ad,.promo-bas,.promo-alt,
.bolum-bas h2,.chip span,.botnav-ic button,.sirala,.r-puan,.dahafazla,.kat-bas,
.sepet-rest,.toplam,.ode-baslik,.kvkk,.sira-chip,.r-rozet,.r-durum{ text-shadow:none !important; }

/* koyu-zemin için beyaz yapılmış ikincil yazılar → soluk mürekkep */
.r-alt,.promo-alt{ color:var(--ak-soluk) !important; }

/* gölge-veya-hairline disiplini: kartlar tek ipucu (gölge), kenar yok */
.r-kart,.r-kart--hero,.konum,.bildirim,.chip,.promo,.sirala,.dahafazla,.botnav-ic{
  border-color:var(--cam-kenar);
}
.r-kart{ box-shadow:var(--sh1); transition:transform .2s var(--ease-soft), box-shadow .2s var(--ease-soft); }
.r-kart:active{ transform:scale(.985); box-shadow:var(--sh2); }
.r-kart--hero{ box-shadow:var(--sh2); }

/* kategori çipleri: aktif = YUMUŞAK vurgu tonu (bağıran kırmızı dolgu DEĞİL) */
.chip{ box-shadow:var(--sh1); transition:transform .2s var(--ease-out), background .22s var(--ease-out), border-color .22s var(--ease-out); }
.chip:active{ transform:scale(.97); }
.chip.aktif{ background:var(--acc-soft); border-color:transparent; box-shadow:none; }
.chip.aktif svg{ stroke:var(--acc); }
.chip.aktif span{ color:var(--acc-ink); }

/* sırala/filtre çipleri: aktif = yumuşak ton, sıfır zıplama */
.sira-chip{ transition:background .22s var(--ease-out), color .22s var(--ease-out); }
.sira-chip.sec{ background:var(--acc-soft); color:var(--acc-ink); border-color:transparent; box-shadow:none; }
.adres-cip.sec,.zaman-seg button.sec{ background:var(--acc-soft); color:var(--acc-ink); border-color:transparent; }

/* puan rozeti: temiz beyaz pill + altın yıldız (doygun amber dolgu yerine) */
.r-puan{ background:#fff; border:1px solid var(--cam-kenar); color:#1B1D21; box-shadow:var(--sh1); }
.r-puan .yld,.r-puan svg,.r-puan .ico{ color:var(--star); fill:var(--star); }

/* kapalı/meşgul rozet: nötr gri (kahve/kırmızı değil) */
.r-durum.kapali{ background:#EEF0F3; color:#6B7079; }
.r-durum.mesgul{ background:#FBF1E2; color:#9A6B1E; }

/* alt-nav: beyaz buzlu kapsül, aktif = vurgu ikonu (dolu pill değil) */
.botnav-ic{ background:rgba(255,255,255,.92) !important; -webkit-backdrop-filter:saturate(120%) blur(20px); backdrop-filter:saturate(120%) blur(20px); box-shadow:var(--sh3); border:1px solid var(--cam-kenar); }
.botnav-ic button{ color:var(--soluk2); transition:color .22s var(--ease-out); }
.botnav-ic button.aktif{ color:var(--acc); background:transparent; box-shadow:none; animation:none; }
.botnav-ic button.aktif svg{ stroke:var(--acc); filter:none; }
.botnav-ic button.aktif::after{ background:var(--acc); }

/* birincil CTA'lar: yeni mercan + tüy gölge (sert kırmızı bar yumuşar) */
.sepet-btn,.btn-buyuk,.btn-tekrar{ background:var(--acc); box-shadow:var(--sh-cta); border-radius:var(--r-md); transition:transform .16s var(--ease-out), box-shadow .2s var(--ease-out); }
.sepet-btn:active,.btn-buyuk:active{ transform:scale(.98); }
.btn-tekrar,.adres-cip.sec,.zaman-seg button.sec,.ekle.sec-dolu,.sira-chip.sec{ background:var(--acc) !important; }
.sira-chip.sec,.adres-cip.sec,.zaman-seg button.sec{ background:var(--acc-soft) !important; color:var(--acc-ink) !important; }

/* OVERSHOOT/NABIZ yasak — sakin geçişlere indir */
.adim.aktif .dot{ animation:none; box-shadow:0 0 0 4px var(--acc-100); }
.odeme-opt.secili,.odeme-opt:has(input:checked){ animation:none !important; transform:none !important; }
.odeme-opt.secili .oik,.odeme-opt:has(input:checked) .oik{ transform:none; box-shadow:var(--sh1); }
.botnav-ic button.aktif{ animation:none !important; }
.ekle{ box-shadow:var(--sh1); }

/* arama kutusu: nötr dolgu + odakta yumuşak halka */
.ara-kutu input{ background:var(--kart2); border:1px solid var(--cam-kenar); color:var(--metin); box-shadow:none; }
.ara-kutu input::placeholder{ color:var(--soluk2); }
.ara-kutu input:focus{ border-color:var(--acc); box-shadow:0 0 0 3px var(--acc-soft); }
.filtre-btn{ background:#fff; border:1px solid var(--cam-kenar); box-shadow:var(--sh1); color:var(--metin); }

/* promo banner: cam yerine temiz beyaz kart */
.promo{ background:#fff; border:1px solid var(--cam-kenar); box-shadow:var(--sh2); }
.promo-ust{ background:var(--acc-soft); border-color:transparent; color:var(--acc-ink); }
.promo-cta{ background:var(--acc); border-color:transparent; color:#fff; }

/* hero kart alt bilgi paneli: temiz beyaz (foto üstü rozetler korunur) */
.rh-bilgi{ background:#fff; border-top:1px solid var(--cam-kenar); -webkit-backdrop-filter:none; backdrop-filter:none; }

/* mürekkep ağırlıklarını biraz inceltip premium yap */
.selam h1{ font-weight:700; letter-spacing:-.5px; }
.r-ad,.rh-ad{ font-weight:600; }
.bolum-bas h2{ font-weight:600; }

/* v105: HANGİ tema seçili olursa olsun (eski koyu base + Faz-8 cream "acik")
   aydınlık-premium tokenları uygula. Attribute-specificity eşit + kaynak sonra → kazanır. */
:root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:#F7F8FA !important; background-attachment:initial !important;
}

/* ============================================================================
   v106 — "VIVID GOURMET" (derin redesign: 17-ajan + web araştırması)
   Sıcak iştah açıcı palet (domates+mango, beyaz DEĞİL sıcak krem), foto-öncelikli
   kartlar, gerçek-yemek-fotoğraflı kategori çipleri, hızlı-erişim grid, yumuşak hareket.
   v105'in token-remap'ini SICAK+CANLI değerlere günceller + yeni bileşenler.
   ============================================================================ */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  /* yeni isimli tokenlar (yeni bileşenler) */
   
    
  
       
     
  /* ESKİ tokenları SICAK+CANLI değerlere remap (mevcut bileşenler korunur) */
      
      
   
       
       
     
   
    
  
   
}
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:#FAF6EF !important; background-attachment:initial !important;
}

/* ===== KATEGORİ ÇİPLERİ — fotoğraflı kare (chip-foto) ===== */
.chip-sira{ display:flex; gap:12px; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:4px 2px 6px; margin:0 -2px 20px; scrollbar-width:none; }
.chip-sira::-webkit-scrollbar{ display:none; }
.chip{ flex:0 0 auto; width:auto; height:auto; display:flex; flex-direction:column; align-items:center; gap:7px;
  background:none !important; border:0 !important; box-shadow:none !important; padding:0; }
.chip-foto{ width:66px; height:66px; border-radius:20px; overflow:hidden; display:grid; place-items:center;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06), var(--golge); background:var(--kart3);
  transition:box-shadow var(--t-temel) var(--ez), transform var(--t-bas) var(--ez); }
.chip-foto img{ width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity var(--t-temel) var(--ez); }
.chip-foto img[src]{ opacity:1; }
.chip-foto--ik{ background:var(--sicak); }
.chip-foto--ik svg{ stroke:#fff; fill:none; width:30px; height:30px; }
.chip>span{ font-size:15px; font-weight:600; color:var(--metin2); }
.chip.aktif{ background:none !important; box-shadow:none !important; }
.chip.aktif .chip-foto{ box-shadow:0 0 0 2.5px var(--c), var(--golge); transform:scale(1.05); }
.chip.aktif svg{ stroke:#fff; }
.chip.aktif>span{ color:var(--metin); font-weight:700; }
.chip:active .chip-foto{ transform:scale(.96); }

/* ===== HIZLI ERİŞİM GRID ===== */
.qa-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:4px 0 22px; }
.qa-tile{ display:flex; flex-direction:column; align-items:center; gap:8px; background:var(--yuzey); border:0;
  border-radius:18px; padding:15px 6px; box-shadow:var(--golge); transition:transform var(--t-bas) var(--ez); }
.qa-tile:active{ transform:scale(.96); }
.qa-ik{ width:44px; height:44px; border-radius:14px; display:grid; place-items:center;
  background:#f3ece9;   /* v395 fallback (Kurul-A P3) — Chrome <111 color-mix desteklemez → düz warm ton; destekleyen tarayıcı alttaki satırı kullanır */
  background:color-mix(in srgb, var(--c) 15%, #fff); }
.qa-ik svg{ stroke:var(--c); fill:none; width:23px; height:23px; }
.qa-ad{ font-size:13px; font-weight:600; color:var(--metin2); }

/* ===== RESTORAN KARTI — DİKEY foto-öncelikli (.r-dikey) ===== */
.r-dikey{ display:flex; flex-direction:column; width:100%; text-align:left; gap:0; align-items:stretch;
  background:var(--yuzey); border:0; border-radius:18px; overflow:hidden; padding:0; margin-bottom:16px;
  box-shadow:var(--golge); transition:transform var(--t-bas) var(--ez), box-shadow var(--t-temel) var(--ez); }
.r-dikey:active{ transform:scale(.985); box-shadow:var(--golge-yumusak); }
.r-dikey .r-foto{ position:relative; width:100%; height:auto; aspect-ratio:16/9; flex:0 0 auto; border-radius:0; overflow:hidden;
  background:linear-gradient(135deg,#F0E2D2,#E4CDB8); min-height:0; }
.r-dikey .r-foto img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0;
  transition:opacity var(--t-temel) var(--ez); filter:saturate(1.05); }
.r-dikey .r-foto img[src]{ opacity:1; }
.r-foto-bos{ display:grid; place-items:center; height:100%; font-size:48px; color:#fff; }
.r-grad{ position:absolute; inset:auto 0 0 0; height:48%; z-index:1; pointer-events:none;
  background:linear-gradient(to top, rgba(42,26,18,.46), transparent); }
.r-dikey .flash-rozet, .r-dikey .r-kampanya{ position:absolute; top:11px; left:11px; z-index:3;
  background:var(--sicak); color:#fff; font-weight:700; font-size:13px; padding:6px 10px; border-radius:11px;
  box-shadow:0 3px 10px rgba(120,40,10,.28); text-shadow:none; }
.r-dikey .r-kalp{ position:absolute; top:11px; right:11px; left:auto; bottom:auto; z-index:4; width:36px; height:36px;
  display:grid; place-items:center; background:rgba(255,255,255,.86); border-radius:50%;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); box-shadow:0 2px 8px rgba(40,24,16,.18); }
.r-dikey .r-kalp svg{ width:20px; height:20px; stroke:var(--metin); fill:none; transition:transform var(--t-temel) var(--ez); }
.r-dikey .r-kalp.dolu svg{ fill:var(--ana); stroke:var(--ana); }
.r-puan-sar{ position:absolute; left:11px; bottom:11px; z-index:3; }
.r-puan-sar .r-puan{ background:rgba(20,12,8,.42); border:0; color:#fff; font-weight:700; box-shadow:none;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.r-puan-sar .r-puan svg, .r-puan-sar .r-puan .ico{ color:var(--altin); fill:var(--altin); stroke:var(--altin); }
.r-dikey .r-logo{ position:absolute; right:12px; bottom:-20px; top:auto; left:auto; z-index:3; width:50px; height:50px;
  border-radius:14px; overflow:hidden; border:2.5px solid var(--yuzey); box-shadow:var(--golge); background:#fff; }
.r-dikey .r-sag{ padding:14px 15px 14px; flex:1 1 auto; min-width:0; }
.r-dikey .r-ad{ font-size:15px; font-weight:700; color:var(--metin); letter-spacing:-.01em; white-space:normal;
  display:flex; align-items:center; gap:8px; text-shadow:none; }
.r-dikey .r-alt{ font-size:15px; color:var(--metin2); margin-top:3px; }
.r-dikey .r-rozetler{ display:flex; flex-wrap:wrap; gap:7px; margin-top:10px; font-variant-numeric:tabular-nums; }
.r-dikey .r-durum{ font-size:13px; font-weight:600; color:var(--yesil); background:none; padding:0; }
.r-dikey .r-durum.kapali{ color:var(--metin2); } .r-dikey .r-durum.mesgul{ color:var(--ikincil); }
.r-dikey.kart-kapali .r-foto img{ filter:grayscale(.5) saturate(.9); }

/* ===== HERO kart re-skin (yapı değişmez, sadece sıcak palet) ===== */
.rh-foto{ background:linear-gradient(135deg,#F0E2D2,#E4CDB8); }
.rh-grad{ background:linear-gradient(180deg,rgba(20,8,4,.30) 0%,rgba(20,8,4,0) 28%,rgba(20,8,4,0) 58%,rgba(20,8,4,.46) 100%); }
.rh-kamp{ background:var(--sicak) !important; color:#fff; }
.rh-puan-sar .r-puan svg{ color:var(--altin); fill:var(--altin); }

/* ===== promo banner — sıcak gradyan CTA ===== */
.promo-cta{ background:var(--sicak) !important; border-color:transparent; color:#fff; }
.promo-ust{ background:var(--acc-soft); color:var(--acc-ink); border-color:transparent; }

/* ===== motion: favori bounce-free, foto fade, press ===== */
.sepet-btn:active, .btn-buyuk:active, .sira-chip:active{ transform:scale(.97); }

/* ============================================================================
   v107 — "WARM GALLERY" editöryel kimlik (24-ajan + web araştırması)
   Fildişi kâğıt + CEVİZ (walnut) CTA + SAFRAN vurgu (%10) + Fraunces serif +
   PHOSPHOR ikon seti. Gradyan/parlama/turuncu YOK. v106 yapısı korunur, İŞÇİLİK+KİMLİK yükselir.
   ============================================================================ */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  /* yeni isimli editöryel tokenlar */
    
    
   
     
   
   
   
  /* ESKİ tokenları Warm-Gallery'ye remap (mevcut bileşenler korunur) */
      
       
   
        
  /* --acc = SAFRAN (yalnız fiyat/aktif/vurgu) — CTA'lar ayrıca walnut'a override edilir */
       
       /* "Tümü" karesi + rozet zemini = ceviz */
      
   
    
  
   
}
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:#FAF6EE !important; background-attachment:initial !important;
  font-family:var(--body); color:var(--ink);
}

/* ===== KRİTİK: Phosphor ikonları fill-tabanlı; eski svg fill:none/stroke kurallarını EZ ===== */
.ico{ width:24px; height:24px; display:inline-block; vertical-align:-.18em; flex:0 0 auto; }
svg.ico{ fill:currentColor !important; stroke:none !important; }
svg.ico [stroke="currentColor"]{ stroke:currentColor !important; fill:none !important; }  /* outline heart korunur */

/* ===== TİPOGRAFİ — Fraunces serif başlıklar, Inter gövde ===== */
.selam h1{ font-family:var(--display); font-weight:600; letter-spacing:-.02em; color:var(--ink); }
.selam p{ font-family:var(--body); color:var(--muted); }
.bolum-bas h2{ font-family:var(--display); font-weight:600; letter-spacing:-.01em; color:var(--ink); }
.r-dikey .r-ad, .rh-ad, .r-ad{ font-family:var(--display); font-weight:600; letter-spacing:-.01em; color:var(--ink); }
.ust .baslik{ font-family:var(--display); font-weight:600; }
.kat-bas{ font-family:var(--body); color:var(--muted); }

/* ===== BUTON SİSTEMİ — CTA = CEVİZ (turuncu/gradyan değil) ===== */
.sepet-btn, .btn-buyuk{ background:var(--cta-fill) !important; color:#fff !important; box-shadow:var(--sh-cta) !important; border-radius:14px; }
.sepet-btn:active, .btn-buyuk:active{ background:var(--walnut-press) !important; transform:scale(.98); }
.sepet-btn .adet-bal{ background:rgba(255,255,255,.22); color:#fff; }
.btn-tekrar{ background:var(--card) !important; color:var(--ink) !important; box-shadow:inset 0 0 0 1px var(--hairline) !important; }
/* promo CTA: yumuşak safran-ton, ink yazı (gradyan/parlama YOK) */
.promo-cta{ background:var(--accent-tint) !important; color:var(--accent-ink) !important; border:none !important;
  box-shadow:inset 0 0 0 1px rgba(200,134,44,.25) !important; font-weight:700; }
.promo-ust{ background:var(--accent-tint); color:var(--accent-ink); }
.btn-sade{ background:var(--card); color:var(--ink); box-shadow:inset 0 0 0 1px var(--hairline); }

/* "Tümü" kategori karesi + hero kampanya = ceviz (sıcak gradyan değil) */
.chip-foto--ik{ background:var(--walnut) !important; }
.rh-kamp{ background:var(--cta-fill) !important; color:#fff; }
.r-dikey .flash-rozet, .r-dikey .r-kampanya{ background:var(--cta-fill) !important; color:#fff; box-shadow:0 3px 10px rgba(28,25,22,.22) !important; }

/* aktif çip/sıra = mürekkep dolgu (editöryel), safran sadece vurgu */
.sira-chip.sec, .sira-chip.aktif{ background:var(--ink) !important; color:var(--card) !important; box-shadow:none !important; }
.chip.aktif .chip-foto{ box-shadow:0 0 0 2.5px var(--accent), var(--golge); }

/* puan = altın yıldız; rozetler editöryel */
.r-puan-sar .r-puan svg, .r-puan-sar .r-puan .ico{ color:var(--gold); fill:var(--gold); }
.r-rozet.r-bedava{ color:var(--yesil); }

/* alt-nav: aktif = safran ikon */
.botnav-ic button.aktif{ color:var(--accent); }
.botnav-ic button.aktif svg{ stroke:none; }
.botnav-ic button.aktif::after{ background:var(--accent); }

/* ödeme/zaman/adres seçili = ceviz veya safran-kenar */
.zaman-seg button.sec, .adres-cip.sec{ background:var(--cta-fill) !important; color:#fff !important; border-color:transparent !important; }
.odeme-opt.secili .oik, .odeme-opt:has(input:checked) .oik{ background:var(--cta-fill); color:#fff; }

/* fiyat vurgusu safran */
.menu-fiyat, .fiyat, .s-fiyat, .urun-fiyat{ color:var(--accent); }

/* ============================================================================
   v109 — "MİLAS LEZZET" (referans tasarım birebir uyarlama)
   Sıcak krem zemin + TERRACOTTA (Ege kiremidi) ana renk + ZEYTİN YEŞİLİ vurgu.
   Yuvarlak yemek-fotoğraflı kategoriler. v107 yapısı korunur; palet referansa çekilir.
   Ref: warm Aegean/Milas — krem #FBF6EB, terracotta #C0552E, zeytin #5E6E3A.
   ============================================================================ */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  /* yeni isimli Milas-Lezzet tokenları */
    
    
     
    
  /* CTA = TERRACOTTA: v107'nin walnut CTA'larını referans kiremidine çek */
   
     
  
  /* ESKİ tokenları Milas-Lezzet'e remap */
      
       
   
       
    
     
   
  
}
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:#FBF6EB !important; background-attachment:initial !important; color:var(--ink);
}

/* ===== YUVARLAK kategori daireleri (referans: foto + altında etiket, kutu yok) ===== */
.chip{ width:74px; height:auto; background:transparent !important; backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important; border:none !important; box-shadow:none !important;
  border-radius:0 !important; gap:7px; padding:2px 0; }
.chip-foto{ width:64px; height:64px; border-radius:50% !important; box-shadow:0 4px 12px rgba(42,32,24,.12);
  border:2px solid #FFFFFF; }
.chip-foto img{ border-radius:50%; }
.chip span:last-child{ font-size:13px; font-weight:600; color:var(--ink); }
.chip.aktif span:last-child{ color:var(--terra); font-weight:700; }
.chip.aktif .chip-foto{ box-shadow:0 0 0 2.5px var(--terra), 0 4px 12px rgba(192,85,46,.25); }
.chip-foto--ik{ background:var(--terra) !important; }

/* ===== CTA / rozet / vurgu = terracotta (otomatik token ile geliyor; pekiştir) ===== */
.sepet-btn, .btn-buyuk{ background:var(--terra) !important; }
.sepet-btn:active, .btn-buyuk:active{ background:var(--terra-press) !important; }
.rh-kamp, .r-dikey .flash-rozet, .r-dikey .r-kampanya{ background:var(--terra) !important; color:#fff !important; }
.botnav-ic button.aktif, .botnav-ic button.aktif::after{ color:var(--terra); background:var(--terra); }
.botnav-ic button.aktif::after{ color:unset; }
.menu-fiyat, .fiyat, .s-fiyat, .urun-fiyat{ color:var(--terra); }

/* ===== ZEYTİN YEŞİLİ: "Açık" rozeti + bedava/taze vurgular (iştah + Ege hissi) ===== */
.r-durum:not(.mesgul){ color:var(--olive) !important; background:var(--olive-bg) !important; }
.r-rozet.r-bedava{ color:var(--olive) !important; }
.adim.tamam .dot, .adimlar::after{ background:var(--olive) !important; border-color:var(--olive) !important; }

/* promo: terracotta-tint yumuşak kart */
.promo-cta{ background:var(--terra) !important; color:#fff !important; box-shadow:none !important; }
.promo-ust{ background:var(--terra-tint); color:var(--terra-ink); }

/* ============================================================================
   v110 — "MİLAS LEZZET" ANA SAYFA TAM YENİDEN KURGU (referans birebir)
   Marka başlığı (logo + wordmark + slogan) · konum · selam · arama · yuvarlak
   kategoriler · TERRACOTTA hero promo (carousel) · "Öne Çıkan" YATAY kartlar ·
   5'li alt menü. Palet v109'dan gelir (krem/terracotta/zeytin).
   ============================================================================ */

/* ===== MARKA BAŞLIĞI ===== */
.ml-marka{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:4px 2px 2px; }
.ml-marka-sol{ display:flex; align-items:center; gap:10px; min-width:0; }
.ml-mark{ width:44px; height:44px; flex:0 0 auto; filter:drop-shadow(0 2px 5px rgba(94,110,58,.18)); }
.ml-wordmark{ min-width:0; }
.ml-ad{ font-family:var(--display); font-weight:600; font-size:24px; line-height:1.05; letter-spacing:-.01em; }
.ml-ad1{ color:var(--olive); } .ml-ad2{ color:var(--terra); }
.ml-slogan{ font-size:14px; color:var(--muted); font-weight:500; margin-top:1px; }
.ml-marka-sag{ display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.ml-ust-btn{ width:44px; height:44px; border-radius:50%; background:#fff; border:1px solid var(--hairline);
  display:grid; place-items:center; color:var(--ink); box-shadow:0 2px 8px rgba(42,32,24,.06); position:relative; }
.ml-ust-btn svg{ width:22px; height:22px; }
.ml-avatar{ border-radius:14px; }
.ml-rozet-nokta{ position:absolute; top:9px; right:10px; width:9px; height:9px; border-radius:50%;
  background:var(--terra); border:2px solid #fff; }

/* ===== KONUM SATIRI ===== */
.ml-konum{ display:inline-flex; align-items:center; gap:6px; background:transparent !important; border:none !important;
  box-shadow:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  padding:8px 2px 2px; color:var(--ink); font-weight:600; }
.ml-konum .kik{ color:var(--terra); display:inline-flex; } .ml-konum .kik svg{ width:20px; height:20px; }
.ml-konum b{ font-size:15px; } .ml-konum .kchev{ color:var(--muted); display:inline-flex; }
.ml-konum .kchev svg{ width:16px; height:16px; }

/* ===== SELAM ===== */
.selam{ margin:8px 2px 12px; } .selam h1{ font-size:24px; margin:0 0 2px; }
.selam .ml-wave{ font-family:initial; -webkit-text-fill-color:initial; }
.selam p{ font-size:15px; margin:0; }

/* ===== PROMO v2 (.pr2) — SIFIRDAN, tek kaynak, katman yok, sıfır !important =====
   Eski .ml-promo* (7 !important katmanı) tamamen kaldırıldı. Bkz. redesign/promo-serit.md. */
.pr2-sar{ margin:var(--sp-2) 0 var(--sp-3); }
/* Mobilde full-bleed: kartlar kapsayıcı iç boşluğunu (16px) aşar → banner genişliği
   21:9'u tutar (334→~302×132, kare değil), peek korunur. Desktop grid'de nötr. */
@media (max-width:1023px){ .pr2-sar{ margin-inline:calc(var(--sp-4) * -1); } }
.pr2-track{ display:flex; gap:var(--sp-3); overflow-x:auto;
  scroll-snap-type:x mandatory; scroll-padding-inline:var(--sp-4);
  padding:2px var(--sp-4) var(--sp-2); scrollbar-width:none; }
.pr2-track::-webkit-scrollbar{ display:none; }

.pr2-kart{ position:relative; flex:0 0 calc(100% - 56px);   /* PEEK: sonraki karttan ~44px görünür */
  scroll-snap-align:start; aspect-ratio:21/9;                /* 390→334×143: BANNER, kare değil */
  min-height:132px; max-height:176px; border-radius:var(--r-lg);
  overflow:hidden; isolation:isolate; background:linear-gradient(135deg,#3A1D16,#1E0F0B); /* sabit sıcak koyu zemin = son fallback */
  box-shadow:var(--sh2); color:#fff; cursor:pointer;
  transition:transform var(--t-temel) var(--ez), box-shadow var(--t-temel) var(--ez); }
@media (hover:hover){ .pr2-kart:hover{ transform:translateY(-2px); box-shadow:var(--sh3); } }
.pr2-kart:active{ transform:scale(.98); transition-duration:var(--t-bas); }

/* Görsel: full-bleed + TEK scrim (kartın kendi ::after'ı → foto gelmese bile ek-yeri OLUŞMAZ) */
.pr2-foto{ position:absolute; inset:0; z-index:-1; }        /* -6px taşma hilesi YOK */
.pr2-foto img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.pr2-kart::after{ content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(90deg, rgba(16,8,5,.86) 0%, rgba(16,8,5,.62) 42%, rgba(16,8,5,.12) 72%, rgba(16,8,5,0) 100%); }
/* görsel yok/hata → metin alanı genişler, boşluk hissi kalmaz */
.pr2-kart.fotosuz .pr2-ic{ max-width:88%; }

/* İçerik ızgarası — tek satır başlık (kırılma yok) */
.pr2-ic{ position:relative; z-index:1; height:100%; max-width:62%;
  padding:var(--sp-3) var(--sp-4); display:flex; flex-direction:column; gap:2px; }
/* flex-shrink:0 → sabit-yükseklikli kartta metin 0'a çökmesin (aksi halde başlık/alt kaybolur);
   margin:0 → h3/p taban-margin'i kartı taşırıp CTA'yı kırpıyordu. */
.pr2-ust,.pr2-bas,.pr2-alt{ flex:0 0 auto; margin:0; }
.pr2-ust{ font-size:var(--fs-sm); font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color:rgba(255,255,255,.85); }
.pr2-bas{ font-family:var(--display); font-weight:700; font-size:var(--fs-xl); /* 20px */
  line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pr2-alt{ font-size:var(--fs-md); line-height:1.35; color:rgba(255,255,255,.92);
  display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.pr2-cta{ margin-top:auto; align-self:flex-start; min-height:40px; padding:9px 18px;
  background:#fff; color:var(--brand-700); font-weight:800; font-size:var(--fs-base);
  border-radius:var(--r-pill); border:0; cursor:pointer;
  transition:background var(--t-temel) var(--ez), color var(--t-temel) var(--ez); }
@media (hover:hover){ .pr2-cta:hover{ background:var(--brand-100); color:var(--brand-800); } }
/* Rozet: DAİMA metinli chip (ikon-tek yok), sağ-üst */
.pr2-rozet{ position:absolute; top:var(--sp-3); right:var(--sp-3); z-index:1;
  padding:4px 10px; border-radius:var(--r-pill); background:rgba(255,255,255,.92);
  color:var(--ink); font-size:var(--fs-sm); font-weight:800; }

/* Peek + dots (gerçek <button>) */
.pr2-dots{ display:flex; gap:0; justify-content:center; margin-top:2px; }
.pr2-dot{ position:relative; appearance:none; border:0; background:none; padding:10px 5px; cursor:pointer; } /* hedef ≥28×27 + bitişik alan */
.pr2-dot::before{ content:''; position:absolute; top:50%; left:50%; width:44px; height:44px; transform:translate(-50%,-50%); } /* v232 — görünmez ≥44px dokunma tamponu (glif 6px kalır) */
.pr2-dot i{ display:block; width:6px; height:6px; border-radius:var(--r-pill);
  background:var(--cizgi); transition:width var(--t-temel) var(--ez), background var(--t-temel) var(--ez); }
.pr2-dot[aria-current="true"] i{ width:18px; background:var(--brand-600); }

@media (prefers-reduced-motion:reduce){
  .pr2-kart,.pr2-cta,.pr2-dot i{ transition:none; }
  .pr2-track{ scroll-behavior:auto; }
}

/* Desktop grid (≥1024): 4 kart = 2×2 statik grid; mega-banner ve görünmez ray biter */
@media (min-width:1024px){
  .pr2-track{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-4);
    overflow:visible; padding:2px 0 var(--sp-2); }
  .pr2-kart{ flex:none; max-height:220px; }
  .pr2-ic{ padding:var(--sp-4); }
  .pr2-bas{ font-size:24px; }
  .pr2-alt{ -webkit-line-clamp:2; }      /* daha yüksek grid hücresinde 2 satır sığar */
  .pr2-dots{ display:none; }             /* hepsi görünür — dots gereksiz */
}

/* ===== BÖLÜM BAŞLIĞI + "Tümünü Gör" ===== */
.bolum-bas.ml-bolum{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:14px 2px 10px; }
.bolum-bas.ml-bolum h2{ font-size:15px; }
.ml-tumu{ display:inline-flex; align-items:center; gap:2px; color:var(--muted); font-size:15px; font-weight:600; flex:0 0 auto; }
.ml-tumu svg{ width:15px; height:15px; }

/* ===== ÖNE ÇIKAN — YATAY kartlar ===== */
.ry-sira{ display:flex; gap:14px; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none;
  padding:2px 2px 8px; scroll-snap-type:x proximity; }
.ry-sira::-webkit-scrollbar{ display:none; }
.ry-kart{ flex:0 0 188px; width:188px; scroll-snap-align:start; background:#fff; border:1px solid var(--hairline);
  border-radius:20px; overflow:hidden; text-align:left; box-shadow:0 6px 18px rgba(42,32,24,.08);
  display:flex; flex-direction:column; transition:transform .12s, box-shadow .12s; }
.ry-kart:active{ transform:scale(.985); }
.ry-kart.kart-kapali{ opacity:.62; }
.ry-foto{ position:relative; width:100%; height:118px; background:#F4ECDD; }
.ry-foto img{ width:100%; height:100%; object-fit:cover; }
.ry-foto-bos{ position:absolute; inset:0; display:grid; place-items:center; color:var(--terra); opacity:.5; }
.ry-foto-bos svg{ width:40px; height:40px; }
.ry-kalp{ position:absolute; top:9px; right:9px; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92);
  display:grid; place-items:center; color:#C0492F; box-shadow:0 2px 8px rgba(0,0,0,.14); }
.ry-kalp svg{ width:18px; height:18px; }
.ry-kalp.dolu{ color:#C0492F; } .ry-kalp.dolu svg{ fill:#C0492F !important; }
.ry-indirim{ position:absolute; left:9px; bottom:9px; background:var(--terra); color:#fff; font-weight:700;
  font-size:13px; padding:4px 9px; border-radius:9px; box-shadow:0 3px 9px rgba(168,69,31,.32);
  max-width:78%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ry-govde{ padding:11px 12px 13px; display:flex; flex-direction:column; gap:3px; }
.ry-ad{ font-family:var(--display); font-weight:600; font-size:15px; color:var(--ink); line-height:1.2;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ry-puan{ display:flex; align-items:center; gap:4px; font-size:15px; color:var(--ink); }
.ry-puan svg{ width:15px; height:15px; color:var(--gold); fill:var(--gold); }
.ry-puan-say{ color:var(--muted); font-weight:500; }
.ry-sure{ font-size:13px; color:var(--muted); }
.ry-alt{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:2px; }
.ry-mutfak{ font-size:13px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ry-min{ font-size:13px; color:var(--faint); font-weight:600; flex:0 0 auto; }

/* ===== 5'Lİ ALT MENÜ — terracotta aktif (referans) ===== */
.botnav-ic{ display:flex; }
.botnav-ic button{ flex:1 1 0; min-width:0; padding:8px 2px; }
/* v109'da yanlışlıkla TÜM aktif butona terracotta ZEMİN gelmişti (kocaman blok) → düzelt: yalnız ikon+etiket renk. */
.botnav-ic button.aktif{ color:var(--terra) !important; background:transparent !important; box-shadow:none !important; }
.botnav-ic button.aktif svg{ fill:var(--terra) !important; stroke:var(--terra) !important; filter:none !important; }
.botnav-ic button span{ font-size:13px; font-weight:600; }
.botnav-ic button.aktif::after{ display:none !important; }

/* ============================================================================
   v111 — "MİLAS LEZZET" CİLA (7-ajan fidelity denetimi sonrası)
   Daha sıcak krem zemin · yumuşak-gölgeli arama · terracotta filtre · 2-satır
   kart adı · güçlü beyaz kategori halkası · zeytin aksanı · yumuşak hero geçişi.
   ============================================================================ */
/* 1) Daha sıcak krem zemin (saf beyaz hissini kır; kartlar beyaz kalır = katman) */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{ background:#F7F1E4 !important; }

/* 2) Arama kutusu — kenarlıksız, yumuşak sıcak gölge, sıcak placeholder */
.ara-kutu input{ border:none !important; background:#fff !important; box-shadow:0 4px 16px rgba(120,80,40,.10) !important;
  border-radius:16px !important; padding-top:15px; padding-bottom:15px; }
.ara-kutu input::placeholder{ color:#9A8F82; }
.ara-ik{ color:var(--muted); }
/* 3) Filtre butonu — terracotta ikon, yumuşak beyaz kart */
.filtre-btn{ background:#fff !important; border:none !important; box-shadow:0 4px 16px rgba(120,80,40,.10) !important;
  border-radius:16px !important; color:var(--terra) !important; }
.filtre-btn svg{ stroke:var(--terra) !important; color:var(--terra) !important; }

/* 4) Kategori daireleri — belirgin beyaz halka + sıcak gölge; etiket tam sığsın */
.chip{ width:78px !important; }
.chip-foto{ border:2.5px solid #fff !important; box-shadow:0 0 0 1px rgba(192,85,46,.10), 0 5px 14px rgba(42,32,24,.14) !important; }
.chip span:last-child{ white-space:nowrap; }

/* 5) Selam alt metni — zeytin tonu (sadece terracotta monotonluğunu kır) */
.selam p{ color:#6E7A4E; }

/* 6) "Tümünü Gör" — zeytin aksanı */
.ml-tumu{ color:var(--olive); } .ml-tumu svg{ color:var(--olive); }

/* 7) Öne çıkan kart adı — 2 satıra izin (kırpma yok) */
.ry-ad{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; line-height:1.2; min-height:2.4em; }
/* kalp dairesi net beyaz + indirim rozeti tam terracotta + biraz daha yuvarlak */
.ry-kalp{ background:#fff !important; box-shadow:0 2px 8px rgba(0,0,0,.16) !important; }
.ry-indirim{ background:var(--terra) !important; border-radius:11px; }
/* kart gölgesini yumuşat/birleştir */
.ry-kart{ box-shadow:0 8px 22px rgba(70,40,20,.08) !important; }

/* 9) marka logo ile wordmark arası nefes + alt menü üst ince çizgi */
.ml-wordmark{ margin-left:2px; }
.botnav-ic{ border-top:1px solid rgba(120,80,40,.07); }

/* ============================================================================
   v112 — "MİLAS LEZZET" NOKTASINA-AYNI PASI (20-ajan referans kıyas raporu)
   Renk düzeltme · 6 kategori sığar · tek-pill arama · sağ-alt indirim rozeti ·
   yumuşak rounded başlık (Baloo 2) · gri pasif nav · daha sıcak krem · outline üst ikon.
   ============================================================================ */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{ background:#F4EDE1 !important; }

/* ===== YUMUŞAK ROUNDED BAŞLIK (Baloo 2) — wordmark Fraunces serif kalır ===== */
.selam h1, .bolum-bas h2, .ry-ad, .r-dikey .r-ad, .rh-ad, .r-ad{
  font-family:var(--display), system-ui, -apple-system, sans-serif !important; letter-spacing:0 !important; }
.selam h1{ font-weight:700; } .bolum-bas h2{ font-weight:700; }
.ry-ad{ font-weight:600; } .r-dikey .r-ad, .rh-ad, .r-ad{ font-weight:600; }
.ml-ad{ font-family:'Fraunces','Georgia',serif !important; }
.ml-ad1{ color:#46552F; } .ml-ad2{ color:var(--terra); }

/* ===== ÜST İKONLAR — dolu beyaz daire YOK; düz/outline, profil yuvarlak-kare ===== */
.ml-ust-btn{ background:transparent !important; border:none !important; box-shadow:none !important; color:#4A463F; width:42px; height:42px; }
.ml-ust-btn svg{ width:25px; height:25px; }
.ml-avatar{ border:1.6px solid #D6CBB7 !important; border-radius:12px !important; background:transparent !important; }
.ml-rozet-nokta{ top:6px; right:7px; }

/* ===== KONUM + SELAM ===== */
.ml-konum .kik{ background:#F4E4DC; width:30px; height:30px; border-radius:50%; display:grid; place-items:center; }
.ml-konum .kik svg{ width:17px; height:17px; }
.selam{ margin-top:14px; } .selam p{ color:#5A554E !important; font-weight:500; }

/* ===== ARAMA — tek beyaz pill; filtre İÇERİDE, ince ayraçla; terracotta sliders ===== */
.ara-satir{ background:#fff; border-radius:16px; box-shadow:0 4px 16px rgba(120,80,40,.10); display:flex; align-items:center; gap:0; padding:0; }
.ara-kutu{ flex:1; min-width:0; }
.ara-kutu input{ background:transparent !important; box-shadow:none !important; border:none !important; border-radius:16px !important; }
.filtre-btn{ background:transparent !important; box-shadow:none !important; border:none !important; border-left:1px solid #ECE3D3 !important;
  border-radius:0 !important; width:52px !important; height:34px; color:var(--terra) !important; }
.filtre-btn svg{ stroke:var(--terra) !important; color:var(--terra) !important; width:22px; height:22px; }

/* ===== KATEGORİLER — 6'sı da SIĞAR; halka/karartma yok; gri etiket ===== */
.chip-sira{ display:flex !important; justify-content:space-between !important; gap:2px !important; overflow:visible !important; padding:2px 0 4px; }
.chip{ width:auto !important; flex:1 1 0 !important; min-width:0 !important; padding:0 !important; }
.chip-foto{ width:54px !important; height:54px !important; margin:0 auto 6px; border:2px solid #fff !important;
  box-shadow:0 2px 8px rgba(42,32,24,.12) !important; }
.chip span:last-child{ font-size:13px !important; color:#7A7268 !important; font-weight:500 !important; white-space:nowrap; }
.chip.aktif span:last-child{ color:var(--terra) !important; font-weight:700 !important; }
.chip.aktif .chip-foto{ box-shadow:0 0 0 2px var(--terra), 0 2px 8px rgba(0,0,0,.12) !important; }

/* ===== BÖLÜM — "Tümünü Gör" GRİ (zeytin değil) ===== */
.ml-tumu{ color:#9A8F82 !important; font-weight:500; } .ml-tumu svg{ color:#9A8F82 !important; }

/* ===== ÖNE ÇIKAN KART — indirim SAĞ-ALT; daha dar (3. kart peek); yumuşak gölge ===== */
.ry-kart{ flex:0 0 164px !important; width:164px !important; box-shadow:0 6px 18px rgba(70,40,20,.07) !important; }
.ry-indirim{ left:auto !important; right:10px !important; bottom:10px !important; }
.ry-kalp{ top:9px; right:9px; left:auto; }
.ry-puan svg{ color:var(--gold); fill:var(--gold); }

/* ===== ALT MENÜ — pasif ikon/etiket NÖTR GRİ; yalnız aktif terracotta ===== */
.botnav-ic button{ color:#6B7079; }   /* v193 — AA kontrast (eski #9B958C 2.9:1 kalıyordu) */
.botnav-ic button svg{ fill:#6B7079; }
.botnav-ic button.aktif{ color:var(--terra) !important; }
.botnav-ic button.aktif svg{ fill:var(--terra) !important; }

/* v112b — bölüm başlığı tek satır (Baloo 2'de 19px sarıyordu) + indirim rozeti küçült */
.bolum-bas.ml-bolum{ flex-wrap:nowrap; align-items:center; }
.bolum-bas.ml-bolum h2{ font-size:15px !important; white-space:nowrap; line-height:1.2; }
.ml-tumu{ flex:0 0 auto; white-space:nowrap; }
.ry-indirim{ font-size:13px; padding:3px 8px; }

/* v112c — pasif nav GRİ (svg.ico !important'i yen) · kategori foto parlaklık · logo biraz büyük · üst ikon outline */
.botnav-ic button:not(.aktif){ color:#6B7079 !important; }
.botnav-ic button:not(.aktif) svg.ico{ fill:#6B7079 !important; stroke:none !important; }
.botnav-ic button.aktif svg.ico{ fill:var(--terra) !important; }
.chip-foto img{ filter:brightness(1.06) saturate(1.05); }
.ml-mark{ width:46px; height:46px; }
/* üst ikonlar gerçek outline (stroke) — fill yok */
.ml-ust-btn svg.ico{ fill:none !important; stroke:currentColor !important; stroke-width:1.8 !important; }

/* ============================================================================
   v113 — MARKA = DÜKKANIM (referans düzen aynı; yalnız ad+logo bizim markamız)
   Dükkanım D-amblemi (mor-mavi) + "Dükkanım" wordmark (Baloo 2, lacivert) + slogan.
   Filtre ikonu referanstaki SLIDERS'a çevrildi (huni değil).
   ============================================================================ */
img.ml-mark{ width:46px; height:46px; object-fit:contain; filter:none; border-radius:0; }
.ml-ad-duk{ font-family:'Baloo 2', system-ui, -apple-system, sans-serif !important;
  font-weight:800 !important; font-size:24px; line-height:1.0; letter-spacing:-.01em; color:#15143F; }

/* v113b — konum pin SOLİD terracotta (referans: dolu kırmızı pin) */
.ml-konum .kik{ color:var(--terra) !important; }
.ml-konum .kik svg.ico{ fill:var(--terra) !important; stroke:none !important; }

/* ============================================================================
   v114 — ALT KISIM referans birebir: "Tümünü Gör" YEŞİL · sıralama-çubuğu + ayrı
   "Tüm Restoranlar" listesi KALDIRILDI · az işletmede kart boşluğu giderildi.
   ============================================================================ */
/* "Tümünü Gör" referansta ZEYTİN YEŞİLİ (gri değil) */
.ml-tumu{ color:var(--olive) !important; font-weight:600; } .ml-tumu svg{ color:var(--olive) !important; }

/* Az işletme: yatay boşluk yerine tam-genişlik / iki-sütun (kart referans stilinde kalır) */
.ry-sira--tek{ overflow:visible; }
.ry-sira--tek .ry-kart{ flex:1 1 auto !important; width:100% !important; }
.ry-sira--tek .ry-foto{ height:172px; }
.ry-sira--ikili{ overflow:visible; }
.ry-sira--ikili .ry-kart{ flex:1 1 calc(50% - 7px) !important; width:auto !important; }

/* v114b — öne-çıkan kart referans cilası: kompakt 2-satır köşe rozeti · Min ayrı satır ·
   kart biraz geniş · solid beyaz alt-bar · promo dots ortada/biraz yüksek. */
/* İndirim rozeti: kompakt köşe (referans: "%20" / "indirim" 2 satır, sağ-alt) */
.ry-indirim{ left:auto !important; right:8px !important; bottom:8px !important; max-width:62px; white-space:normal !important;
  text-align:center; line-height:1.04; padding:4px 7px; font-size:13px; }
/* Kart gövdesi: mutfak ve "Min. TL" AYRI satır (referans), kart biraz geniş */
.ry-kart{ flex:0 0 172px !important; width:172px !important; }
.ry-sira--tek .ry-kart, .ry-sira--ikili .ry-kart{ flex-basis:auto !important; }
.ry-alt{ flex-direction:column !important; align-items:stretch !important; gap:1px !important; }
.ry-mutfak{ max-width:100%; }
.ry-min{ text-align:right; align-self:flex-end; }
/* Alt menü: SOLİD beyaz bar (krem sızıntısı yok) */
.botnav-ic{ background:#FFFFFF !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }

/* ============================================================================
   v115 — UYGULAMA ARKA PLANI: yumuşak pembe-bej (blush) — referans isteği
   Kartlar/yüzeyler beyaz kalır (kontrast); yalnız sayfa zemini değişir.
   ============================================================================ */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{ background:#FADFDC !important; }

/* ============================================================================
   v116 — Referans (Ulan) uyumu: ARKA PLAN pembe→beyaz GRADYAN (yukarıdan pembe,
   aşağı beyazlaşır) + VURGU/İKON rengi terracotta-kahve → CANLI KIRMIZI.
   ============================================================================ */
/* 1) Arka plan: üstte pembe, ~ekranı geçince beyaz (sayfa aşağı indikçe beyaz) */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:linear-gradient(180deg,#F7CFCC 0%,#F9DAD7 16%,#FCE8E6 38%,#FFFFFF 62%) #FFFFFF no-repeat !important;
  background-size:100% 1500px !important; background-attachment:scroll !important;
}

/* 2) VURGU = CANLI KIRMIZI (ikon çizgileri, pin, filtre, nav-aktif, CTA, rozet) */
/* Konum pini + filtre + alt-nav aktif zaten --terra/currentColor → otomatik kırmızı.
   Sepet/CTA butonları --terra üzerinden kırmızı olur. */
.ry-puan svg{ color:var(--star); fill:var(--star); }   /* yıldız altın kalır */

/* ============================================================================
   v117 — 10-ajan kıyas cilası: arka plan DAHA GÜL PEMBE + pembe kartlara kadar
   sürer (erken beyazlamaz); kırmızı daha CANLI/crimson; arama büyüteci de kırmızı.
   ============================================================================ */
/* Arka plan: gül pembesi (turuncu/somon değil), ~kartlara kadar pembe sonra beyaz */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:linear-gradient(180deg,#F6CECE 0%,#F8D4D4 30%,#FBE3E3 58%,#FFFFFF 88%) #FFFFFF no-repeat !important;
  background-size:100% 1480px !important;
}
/* Arama büyüteci de KIRMIZI (referans: magnifier kırmızı) */
.ara-ik{ color:var(--terra) !important; }
.ara-ik svg{ stroke:var(--terra) !important; color:var(--terra) !important; }

/* ============================================================================
   v118 — Referans renkleri BİREBİR (PIL ile örneklendi):
   Kırmızı DAHA AÇIK/canlı coral (#F44C4E; promo #ED3A3D) · zemin yumuşak gül
   pembe (#FBD3D3) ~orta sayfada beyazlar, AŞAĞISI BEMBEYAZ.
   ============================================================================ */
/* Zemin: gül pembe (üst) → ~%55'te beyaz → altı bembeyaz */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:linear-gradient(180deg,#FBD3D3 0%,#FAD8D8 24%,#FDEEEE 46%,#FFFFFF 62%) #FFFFFF no-repeat !important;
  background-size:100% 1280px !important;
}
.ara-ik, .ara-ik svg{ color:var(--terra) !important; stroke:var(--terra) !important; }

/* ============================================================================
   v119 — Yeni Dükkanım amblemi (cloche) + SİYAH wordmark + arka plan daha SICAK
   (iştah-açan kırmızı/coral → beyaz; fazla pembe değil).
   ============================================================================ */
svg.ml-mark{ width:46px; height:46px; flex:0 0 auto; }
.ml-ad-duk{ color:#1A1A1A !important; }   /* yeni logodaki gibi siyah wordmark */
/* Arka plan: üstte iştah-açan SICAK coral (daha az pembe) → ~%55 beyaz → altı bembeyaz */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:linear-gradient(180deg,#FAC4BB 0%,#FBD3CC 24%,#FDEDEA 48%,#FFFFFF 64%) #FFFFFF no-repeat !important;
  background-size:100% 1280px !important;
}

/* ============================================================================
   v120 — Arka plan kırmızılığı ÇOK AZALTILDI: yalnız header'da hafif sıcak ton,
   ~250px'te solup biter, gerisi bembeyaz. (Kullanıcı: "çok fazla, kısalım".)
   ============================================================================ */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:linear-gradient(180deg,#FAD6CF 0%,#FCE8E3 30%,#FFFFFF 56%) #FFFFFF no-repeat !important;
  background-size:100% 470px !important;
}

/* v121 — Header'da GERÇEK Dükkanım logosu (kullanıcı dosyası, dış zemin şeffaf) + slogan */
.ml-brand{ display:flex; flex-direction:column; gap:1px; min-width:0; }
img.ml-logo{ height:34px; width:auto; max-width:200px; display:block; object-fit:contain; }
.ml-brand .ml-slogan{ font-size:13px; color:var(--muted); font-weight:500; margin-left:2px; }

/* ============================================================================
   v122 — HEADER = iştah-açan KIRMIZI bant (çilek/coca tonu #DE1E2B) → KISA geçiş
   → beyaz gövde. Kırmızıda okunsun diye header içeriği BEYAZ (logo dahil).
   ============================================================================ */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:linear-gradient(180deg,#DE1E2B 0%,#DE1E2B 42%,#EC5A57 58%,#FFFFFF 72%) #FFFFFF no-repeat !important;
  background-size:100% 430px !important;
}
/* header içeriği BEYAZ */
.ml-ust-btn{ color:#FFFFFF !important; }
.ml-ust-btn svg.ico{ stroke:#FFFFFF !important; }
.ml-avatar{ border-color:rgba(255,255,255,.65) !important; }
.ml-rozet-nokta{ background:#FFFFFF !important; }
.ml-brand .ml-slogan{ color:rgba(255,255,255,.88) !important; }
.ml-konum{ color:#FFFFFF !important; }
.ml-konum .kik{ background:rgba(255,255,255,.22) !important; color:#FFFFFF !important; }
.ml-konum .kik svg.ico{ fill:#FFFFFF !important; }
.ml-konum b{ color:#FFFFFF !important; }
.ml-konum .kchev{ color:rgba(255,255,255,.9) !important; }
.selam h1{ color:#FFFFFF !important; }
.selam p{ color:rgba(255,255,255,.92) !important; }

/* ============================================================================
   v126 — 12-ajan A'dan-Z denetim düzeltmeleri (premium + tutarlılık):
   terracotta artığı→kırmızı · profil çubukları beyaz kart+kontrast · "Tümünü Gör"
   →kırmızı · Min.TL nötr · tükenen ürün soluk · kart gölge cilası.
   ============================================================================ */
/* 1) TERRACOTTA ARTIĞI → KIRMIZI (ödeme seçili segment/adres/zaman + walnut tüm kullanımlar) */
.zaman-seg button.sec, .adres-cip.sec{ background:var(--terra) !important; color:#fff !important; }
.odeme-opt.secili .oik, .odeme-opt:has(input:checked) .oik{ background:var(--terra) !important; color:#fff !important; }
.ode-ozet .oz-adet{ background:var(--terra) !important; }

/* 2) "Tümünü Gör" YEŞİL → KIRMIZI (tema uyumu) */
.ml-tumu{ color:var(--terra) !important; } .ml-tumu svg{ color:var(--terra) !important; }

/* 3) "Min. TL" amber → NÖTR gri (sarı yalnız yıldıza kalsın) */
.ry-min{ color:#8A8A8A !important; }

/* 4) PROFİL: kartlar BEYAZ + ilerleme çubukları yüksek kontrast (kırmızı dolgu / gri track) */
.seviye-kart, .tamlik-kart{ background:#FFFFFF !important; border:1px solid #ECECEC !important; border-left:1px solid #ECECEC !important; box-shadow:0 4px 14px rgba(0,0,0,.05) !important; }
.sv-bar, .tk-bar{ background:#EDEDED !important; box-shadow:none !important; }
.sv-bar i, .tk-bar i{ background:linear-gradient(90deg,var(--terra),var(--terra-press)) !important; }
.sv-rozet{ color:var(--terra) !important; }

/* 5) Tükenen ürün GÖRSELİ + satırı soluk (alınamaz hissi) */
.m-kart:has(.m-tuk){ opacity:.62; }
.m-kart:has(.m-tuk) .m-foto, .m-kart:has(.m-tuk) img{ filter:grayscale(.4) brightness(.92); }
.m-tuk{ color:#fff !important; background:var(--soluk) !important; }

/* 6) Öne çıkan kart gölge/köşe cilası (premium) */
.ry-kart{ box-shadow:0 6px 20px rgba(0,0,0,.07) !important; border:1px solid #F0F0F0 !important; }
/* 7) Switch (toggle) AÇIK durumu kırmızı (tek vurgu tutarlılığı) */
.switch.acik{ background:var(--terra) !important; }

/* ============================================================================
   v127 — 4 premium iş (ajan denetimli): sticky sepet CTA · parlak kategori
   görselleri · düzenlenebilir profil alanları · kayan-thumb ödeme segmenti.
   ============================================================================ */
/* 1) SEPET "Devam Et" — alta YAPIŞIK (sticky), beyaz fade ile içerik altından geçer */
.sepet-cta-bar{ position:sticky; bottom:0; z-index:6; margin:14px -4px 0; padding:12px 4px calc(14px + env(safe-area-inset-bottom));
  background:linear-gradient(to top, #FFFFFF 62%, rgba(255,255,255,0)); }
.sepet-cta-bar .btn-buyuk{ margin-top:0; }
/* v231 (P0 sepet-K2) — fiyat dökümü upsell altında ilk ekranda görünmüyordu → fixed CTA'da mini-özet */
.cta-mini-ozet{ text-align:center; font-size:14px; color:var(--soluk); font-weight:600; margin:0 0 8px; font-variant-numeric:tabular-nums; }
.cta-mini-ozet b{ color:var(--metin); font-weight:800; }

/* 2) KATEGORİ daireleri — tutarlı parlaklık (karanlık görseller düzelir) */
.chip-foto img{ filter:brightness(1.14) contrast(1.04) saturate(1.08) !important; }

/* 3) PROFİL "Bilgilerim" — düzenlenebilir alanlar (placeholder davet; "—" yok) */
.p-bilgiler{ padding:6px 14px 12px !important; }
.p-alan{ display:flex; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid #F0F0F0; }
.p-alan:last-child{ border-bottom:none; }
.p-alan--col{ flex-direction:column; align-items:stretch; gap:6px; }
.p-alan label{ font-size:15px; color:#6B6B6B; font-weight:600; flex:0 0 84px; }
.p-alan--col label{ flex:none; }
.p-inp{ flex:1; border:none; background:transparent; font-size:16px; color:var(--ink); text-align:right; font-weight:600; }
.p-alan--col .p-inp{ text-align:left; }
.p-area{ width:100%; min-height:58px; resize:none; background:#F7F7F7; border-radius:12px; padding:10px 12px; font-weight:500; }
.p-inp::placeholder{ color:#B5B5B5; font-weight:500; }
.p-inp:focus{ outline:none; }
.p-alan:focus-within label{ color:var(--terra); }

/* 4) ÖDEME segment kontrolü — gri track + kayan KIRMIZI thumb (modern segmented) */
.zaman-seg{ background:#F1F1F1 !important; border-radius:13px !important; padding:4px !important; gap:0 !important; }
.zaman-seg button{ flex:1; padding:10px 8px !important; border-radius:10px !important; border:none !important; background:transparent !important;
  color:#5B5B5B !important; font-weight:700 !important; transition:color .2s, background .25s, box-shadow .25s !important; }
.zaman-seg button.sec{ background:var(--terra) !important; color:#fff !important; box-shadow:0 3px 10px rgba(244,76,78,.34) !important; }
.zaman-seg button svg, .zaman-seg button .ico{ vertical-align:-.2em; }

/* v127b — ajan denetimi düzeltmeleri: mahalle "hata" görünümü giderildi, sepet CTA
   gerçekten alta sabit (fixed), kategori filtresi yumuşatıldı (iyi görseller bozulmasın). */
/* 1) "Mahalleni seç" → HATA değil, DAVET: kırmızı halka/kenar kaldırıldı, hafif tint */
.ode-mahalle.bos{ border-color:transparent !important; box-shadow:none !important;
  background:rgba(244,76,78,.08) !important; color:var(--terra) !important; }
.ode-mahalle.bos:active{ background:rgba(244,76,78,.14) !important; }
/* 2) Sepet "Devam Et" → her durumda EKRAN ALTINA sabit (kısa listede ortada asılı kalmaz) */
.sepet-cta-bar{ position:fixed !important; left:0; right:0; bottom:0; z-index:30; max-width:680px; margin:0 auto !important;
  padding:12px 16px calc(14px + env(safe-area-inset-bottom)) !important; background:#FFFFFF !important;
  box-shadow:0 -6px 20px rgba(0,0,0,.09) !important; }
/* v279 gece-kurul O6 — checkout final CTA thumb-zone sabit bar (sepet-cta-bar deseni). Consent form içinde görünür kalır. */
.ode-cta-bar{ position:fixed; left:0; right:0; bottom:0; z-index:30; max-width:680px; margin:0 auto;
  padding:10px 16px calc(12px + env(safe-area-inset-bottom));
  background:var(--kart,#fff); box-shadow:0 -6px 20px rgba(0,0,0,.10);
  display:flex; flex-direction:column; gap:8px; }
.ode-cta-bar .btn-buyuk{ margin:0; }
/* v396 — KRİTİK REGRESYON FIX: v393'te eklenen "klavye açıkken CTA'yı display:none yap" kuralı
   KALDIRILDI. iOS "Done"/re-render'da body.klavye-acik sınıfı takılı kalıp "Siparişi Ver" butonunu
   KALICI gizliyordu (kullanıcı bir daha sipariş veremiyordu). Sabit bar zaten position:fixed+bottom:0
   ile görsel-viewport tabanına sabit; klavyenin barı hafif örtmesi, butonun kaybolmasından iyidir.
   (JS focusin/focusout klavye-acik toggle'ı da işlevsiz kaldı; başka tüketici yok.) */
/* v279 gece-kurul O6 — sabit bar son form öğelerini (KVKK/consent + Teslimat Şekli) örtmesin.
   v396 — 120px ölçülen bar yüksekliğinden (güvence metni + 54px buton + safe-area ~ 150px+) küçüktü
   ve env(safe-area-inset-bottom) içermiyordu → home-indicator'lı cihazda alt içerik örtülüyordu. */
.dk-duzen--odeme{ padding-bottom: calc(160px + env(safe-area-inset-bottom)); }
/* v279 gece-kurul O6 — desktop (≥1024): özet sağ-yapışkan kolonlu düzende bar akışa dönsün (içerik örtme yok) */
@media (min-width:1024px){
  .ode-cta-bar{ position:static; max-width:none; box-shadow:none; background:transparent; padding:16px 0 0; }
  .dk-duzen--odeme{ padding-bottom:0; }
}
/* v279 gece-kurul U6 — butona-bitişik koşullu güvence mikro-metni */
.ode-cta-guvence{ display:flex; align-items:center; gap:7px; font-size:14px; color:var(--muted,#6b6b6b); line-height:1.35; }
.ode-cta-guvence svg, .ode-cta-guvence .ico{ width:15px; height:15px; flex:0 0 auto; color:var(--success,#2e7d32); }
/* 3) Kategori filtresi YUMUŞAK (1.14 fazlaydı → iyi görseller doygunlaşmasın) */
.chip-foto img{ filter:brightness(1.06) contrast(1.03) saturate(1.04) !important; }

/* ============================================================================
   v128 — Yemeksepeti kıyas kazanımları (backend'siz, mevcut veriyle):
   sepet ilerleme/min-kapı · para üstü çipleri · değerlendirme etiketleri ·
   ana sayfa hızlı filtre çubuğu.
   ============================================================================ */
/* SEPET nudge (ücretsiz teslimat ilerleme + min-sepet uyarı) */
.sepet-nudge{ display:flex; flex-direction:column; gap:7px; background:#FFF4F4; border:1px solid #FAD9D9; border-radius:14px;
  padding:11px 13px; margin:12px 0; font-size:15px; color:var(--ink); }
.sepet-nudge .sn-txt{ display:flex; align-items:center; gap:7px; } .sepet-nudge .sn-txt b{ color:var(--brand-700); }
.sepet-nudge .sn-ik{ color:var(--terra); display:inline-flex; } .sepet-nudge .sn-ik svg{ width:18px; height:18px; }
.sepet-nudge .sn-bar{ height:7px; border-radius:999px; background:#F1DADA; overflow:hidden; }
.sepet-nudge .sn-bar i{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,var(--terra),var(--terra-press)); transition:width .5s var(--ease,ease); }
.sepet-nudge.ok{ background:#EEF7EE; border-color:#CFE8CF; } .sepet-nudge.ok .sn-txt b, .sepet-nudge.ok .sn-ik{ color:var(--success-text); }
.sepet-nudge.uyari{ background:#FFF7E8; border-color:#F2E2BF; margin:0 0 10px; } .sepet-nudge.uyari .sn-txt b, .sepet-nudge.uyari .sn-ik{ color:var(--ds-warning); }
.btn-buyuk[disabled]{ opacity:.55; filter:grayscale(.2); }

/* PARA ÜSTÜ çipleri */
.paraustu-cip{ display:flex; flex-wrap:wrap; gap:8px; margin-top:9px; }
.pu-cip{ padding:8px 14px; border-radius:999px; background:#F2F2F2; color:#444; font-weight:700; font-size:15px; border:1px solid transparent; }
.pu-cip.pu-tam{ background:var(--terra-tint); color:var(--terra-ink, var(--terra)); }
.pu-cip.sec{ background:var(--terra); color:#fff; }

/* DEĞERLENDİRME hızlı etiketleri */
.puan-etiket{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 4px; }
.pe-cip{ padding:8px 13px; border-radius:999px; background:#F4F4F4; color:#555; font-weight:600; font-size:15px; border:1px solid #ECECEC; transition:all .15s; }
.pe-cip.sec{ background:var(--terra); color:#fff; border-color:transparent; box-shadow:0 3px 9px rgba(244,76,78,.3); }

/* ANA SAYFA hızlı filtre çubuğu */
.hizli-filtre{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; padding:10px 2px 2px; margin-top:2px; }
.hizli-filtre::-webkit-scrollbar{ display:none; }
.hf-cip{ flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; padding:8px 13px; border-radius:999px;
  background:#fff; border:1px solid var(--hairline,#ECE3D3); color:#555; font-weight:600; font-size:15px; box-shadow:0 2px 6px rgba(0,0,0,.04); }
.hf-cip svg, .hf-cip .ico{ width:15px; height:15px; color:#999; }
.hf-cip.sec{ background:var(--terra); border-color:transparent; color:#fff; box-shadow:0 3px 10px rgba(244,76,78,.3); }
.hf-cip.sec svg, .hf-cip.sec .ico{ color:#fff; fill:#fff; }

/* v128b — ajan denetimi: para üstü mikro-metin + hızlı filtre nefes alanı/affordance */
.pu-hint{ margin-top:7px; font-size:13px; color:var(--brand-700); font-weight:600; }
.hizli-filtre{ margin-top:14px !important; padding-top:13px !important; border-top:1px solid #F2EFE9; position:relative; }
.hf-cip svg, .hf-cip .ico{ color:var(--terra) !important; }   /* ikonlar hafif kırmızı → tıklanabilir hissi */
.hf-cip.sec svg, .hf-cip.sec .ico{ color:#fff !important; fill:#fff !important; }

/* ============================================================================
   v129 — Yemeksepeti kıyas: kalan backend'siz kazanımlar
   ürün notu · restoran-detay bilgi çipleri + favori · sepeti boşalt · kalem notu.
   ============================================================================ */
/* Ürün modalı NOT alanı */
.ud-not-sar{ margin-top:16px; }
.ud-not-lbl{ display:flex; align-items:center; gap:6px; font-size:15px; font-weight:700; color:var(--ink); margin-bottom:7px; }
.ud-not-lbl .ops{ font-weight:500; color:var(--muted); }
.ud-not-lbl svg{ width:16px; height:16px; color:var(--terra); }
.ud-not{ width:100%; background:#F7F7F7; border:1px solid #ECECEC; border-radius:12px; padding:11px 13px; font-size:15px;
  color:var(--ink); resize:none; font-family:inherit; }
.ud-not:focus{ outline:none; border-color:var(--terra); background:#fff; }
/* Sepet satırı NOT */
.s-not{ display:flex; align-items:center; gap:5px; font-size:13px; color:#8A6D2F; background:#FFF7E8; border-radius:8px;
  padding:3px 8px; margin:3px 0; width:fit-content; }
.s-not svg{ width:13px; height:13px; }
/* Restoran detay bilgi çipleri */
/* Wolt venue bilgi satırı: düz, nokta-ayraçlı (puan · süre · teslimat · min) — pill değil */
.m-rest-info{ display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:9px; font-size:15px; color:#6B7080; }
.m-rest-info .mri-puan{ display:inline-flex; align-items:center; gap:4px; color:var(--ink,var(--ink-900)); font-weight:700; }
.m-rest-info .mri-puan svg, .m-rest-info .mri-puan .ico{ width:15px; height:15px; color:var(--gold,#F5A623); fill:var(--gold,#F5A623); }
.m-rest-info .mri-say{ color:var(--soluk); font-weight:600; }
.m-rest-info .mri-ayrac{ color:var(--soluk); font-weight:700; }
/* v188 — Wolt: bilgi satırı sonunda "İşletme detayları" linki */
.mri-detay{ display:inline-flex; align-items:center; gap:2px; border:none; background:none; padding:0; cursor:pointer; font:inherit; font-weight:600; color:var(--brand-700); }
.mri-detay svg{ width:13px; height:13px; }
.mri-detay:hover{ text-decoration:underline; }

/* ===== v188 — Wolt venue "Fırsatlar ve avantajlar" (gerçek Wolt ölçüleri: radius 16, pad 16/20, ikon 56, başlık 600 14, link 600 12) ===== */
.wf-h2{ font-size:20px; font-weight:600; line-height:1.2; margin:0; color:var(--metin,#241712); }
.wf-bolum{ margin:18px 0 4px; }
.wf-track{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x proximity; padding:12px 0 6px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.wf-track::-webkit-scrollbar{ display:none; }
.wf-kart{ flex:0 0 auto; width:min(86%,340px); scroll-snap-align:start; display:flex; align-items:center; gap:14px; border:none; cursor:pointer; text-align:start; border-radius:16px; padding:16px 20px; background:rgba(232,49,42,.075); font:inherit; transition:transform .15s cubic-bezier(.45,0,.55,1); }
.wf-kart:active{ transform:scale(.985); }
/* menü kolonu (yanda sepet paneli) Wolt'tan dar → masaüstünde 2'li dizilim (3'lüde başlık sıkışıyor) */
@media(min-width:640px){ .wf-kart{ width:calc((100% - 12px)/2); } }
.wf-ik{ flex:0 0 56px; height:56px; display:flex; align-items:center; justify-content:center; border-radius:14px; background:rgba(232,49,42,.12); color:var(--acc,#E8312A); }
.wf-ik svg{ width:28px; height:28px; }
.wf-metin{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.wf-bas{ font-size:15px; font-weight:600; line-height:1.43; color:var(--metin,#241712); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.wf-link{ display:inline-flex; align-items:center; gap:2px; font-size:13px; font-weight:600; line-height:1.4; color:var(--brand-700); }
.wf-link svg{ width:12px; height:12px; }

/* ===== v188 — Wolt "En çok sipariş edilen" yatay şeridi (kart min-h 140, radius 12, pad 12, görsel 116) ===== */
.wl-enc{ margin:18px 0 4px; }
.wl-enc-bas{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.wl-enc-oklar{ display:flex; gap:8px; }
.wl-enc-ok{ width:36px; height:36px; border-radius:50%; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; background:rgba(232,49,42,.09); color:var(--acc,#E8312A); transition:background .15s; }
.wl-enc-ok:hover{ background:rgba(232,49,42,.18); }
.wl-enc-ok svg{ width:16px; height:16px; }
.wl-enc-ok .wl-ok-sol{ display:flex; transform:scaleX(-1); }
.wl-enc-track{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x proximity; padding:12px 0 8px; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.wl-enc-track::-webkit-scrollbar{ display:none; }
.wl-enc-kart{ position:relative; flex:0 0 auto; width:min(80%,330px); scroll-snap-align:start; display:flex; justify-content:space-between; min-height:140px; background:var(--kart,#fff); border-radius:12px; box-shadow:0 1px 3px rgba(40,14,8,.14); padding:12px; }
@media(min-width:640px){ .wl-enc-kart{ width:calc((100% - 12px)/2); } }
@media(min-width:1100px){ .wl-enc-kart{ width:calc((100% - 24px)/3); } }
.wl-enc-ic{ display:flex; flex-direction:column; gap:4px; min-width:0; flex:1; padding-right:12px; cursor:pointer; }
.wl-enc-ad{ font-size:15px; font-weight:600; line-height:1.45; color:var(--metin,#241712); white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.wl-enc-ack{ font-size:13px; line-height:1.45; color:var(--soluk,#7A5347); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.wl-enc-alt{ margin-top:auto; display:flex; align-items:center; gap:8px; padding-top:4px; }
.wl-enc-fiyat{ font-size:13px; font-weight:600; color:var(--brand-700); }
.wl-enc-fiyat .m-art{ font-size:11px; font-weight:600; color:var(--soluk,#7A5347); margin-left:5px; }
.wl-enc-gorsel{ position:relative; flex:0 0 116px; width:116px; border-radius:8px; overflow:hidden; background:rgba(0,0,0,.05); cursor:pointer; }
.wl-enc-gorsel img{ width:100%; height:100%; object-fit:cover; display:block; }
.wl-enc-ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-size:34px; color:var(--soluk,#7A5347); }
.wl-enc-ekle{ position:absolute; right:18px; bottom:18px; width:34px; height:34px; border-radius:50%; border:none; cursor:pointer; background:#fff; color:var(--acc,#E8312A); font-size:20px; font-weight:600; line-height:1; box-shadow:0 1px 5px rgba(40,14,8,.28); display:flex; align-items:center; justify-content:center; transition:transform .12s; }
.wl-enc-ekle:active{ transform:scale(.9); }
.wl-enc-ekle.dolu{ background:var(--acc,#E8312A); color:#fff; font-size:15px; }

/* ===== v188 — "İşletme detayları" + kampanya detay sheet gövdesi ===== */
.id-govde{ padding:4px 18px 26px; overflow-y:auto; }
.id-bas{ margin:4px 0 2px; font-size:20px; font-weight:700; color:var(--metin,#241712); }
.id-slogan{ font-size:14px; color:var(--soluk,#7A5347); margin-bottom:6px; }
.id-durum{ font-size:15px; margin:6px 0 2px; }
.id-alt-bas{ display:flex; align-items:center; gap:7px; margin:16px 0 6px; font-size:13px; font-weight:700; color:var(--metin,#241712); }
.id-alt-bas svg{ width:16px; height:16px; color:var(--acc,#E8312A); }
.id-saat{ margin:0; }
.id-adres{ display:block; font-size:15px; color:var(--metin,#241712); text-decoration:underline; text-underline-offset:3px; }
.fd-ik{ width:56px; height:56px; margin-top:4px; display:flex; align-items:center; justify-content:center; border-radius:14px; background:rgba(232,49,42,.1); color:var(--acc,#E8312A); }
.fd-ik svg{ width:28px; height:28px; }
.fd-kosul{ margin:10px 0 4px; padding-left:20px; font-size:15px; line-height:1.7; color:var(--metin,#241712); }
.fd-kod-kutu{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; padding:12px 14px; border:1.5px dashed var(--acc,#E8312A); border-radius:12px; background:rgba(232,49,42,.05); }
.fd-kod{ font-size:17px; font-weight:800; letter-spacing:1px; color:var(--metin,#241712); }
.fd-kopyala{ border:none; cursor:pointer; border-radius:999px; padding:9px 16px; font-size:13px; font-weight:700; background:var(--acc,#E8312A); color:#fff; }
.m-rest-cip{ display:flex; flex-wrap:wrap; gap:7px; margin-top:9px; }
.mrc-cip{ display:inline-flex; align-items:center; gap:5px; font-size:13px; font-weight:600; color:#555;
  background:#F4F4F4; border-radius:999px; padding:6px 11px; }
.mrc-cip svg, .mrc-cip .ico{ width:14px; height:14px; color:#888; }
.mrc-cip.mrc-puan{ background:var(--terra-tint); color:var(--terra-ink, var(--terra)); }
.mrc-cip.mrc-puan b{ color:var(--ink); } .mrc-cip.mrc-puan svg{ color:var(--gold); fill:var(--gold); }
/* Restoran favori kalbi (kapak üstü) */
.m-kalp-rest{ position:absolute; top:12px; right:12px; z-index:4; width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.94); display:grid; place-items:center; color:#C0492F; box-shadow:0 3px 10px rgba(0,0,0,.16); }
.m-kalp-rest svg{ width:21px; height:21px; } .m-kalp-rest.dolu svg{ fill:#C0492F !important; }
.m-kapak{ position:relative; }
/* Sepeti boşalt */
.sepet-rest-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.sepet-bosalt{ display:inline-flex; align-items:center; gap:5px; font-size:13px; font-weight:600; color:var(--soluk); flex:0 0 auto; }
.sepet-bosalt svg{ width:15px; height:15px; }
.sepet-bosalt:active{ color:var(--kirmizi,#C0492F); }

/* v129b — ajan denetimi: favori kalbi kapak ALT-SAĞ (sticky başlık örtmesin) + not pili tam-genişlik/kontrast */
.m-kalp-rest{ top:auto !important; bottom:12px !important; right:12px !important; }
.s-not{ width:auto !important; white-space:normal; color:#7A5A12 !important; background:#FCEFCF !important; line-height:1.3; }
.mrc-cip svg{ flex:0 0 auto; }
/* v129c — sepet not pili TAM SATIR alta (ürün adını kırpmasın) */
.s-satir{ flex-wrap:wrap; }
.s-not{ flex-basis:100%; order:9; margin:6px 0 0 !important; }

/* ============================================================
   v130 — SADAKAT PUANI · DAVET · ÜRÜN-PUAN · OTO ÇOK-SATAN
   ============================================================ */
/* Puan kartı (profil) */
.puan-kart{ margin:8px 2px 16px; padding:15px 16px; border-radius:18px;
  background:linear-gradient(135deg, rgba(232,49,42,.16), rgba(232,49,42,.04));
  border:1px solid var(--cam-kenar); box-shadow:var(--sh1); color:var(--metin); }
.pk-ust{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.pk-etik{ display:inline-flex; align-items:center; gap:6px; font-weight:800; font-size:15px; color:var(--acc-koyu); text-transform:uppercase; letter-spacing:.3px; }
.pk-etik svg, .pk-etik .ico{ width:15px; height:15px; }
.pk-bakiye{ margin-top:7px; line-height:1; }
.pk-bakiye b{ font-size:24px; font-weight:800; color:var(--metin); }
.pk-birim{ font-size:15px; color:var(--soluk); font-weight:600; }
.pk-tl{ margin-top:6px; font-size:15px; color:var(--soluk); line-height:1.4; }
.pk-gecmis-btn{ flex:0 0 auto; width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
  background:var(--cam-yogun); border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); color:var(--acc-koyu); }
.pk-gecmis-btn svg, .pk-gecmis-btn .ico{ width:18px; height:18px; }
.pk-anon{ margin-top:11px; padding:9px 11px; border-radius:12px; background:rgba(232,49,42,.07);
  font-size:13px; color:var(--soluk2); line-height:1.4; display:flex; align-items:center; gap:7px; }
.pk-anon svg, .pk-anon .ico{ width:15px; height:15px; flex:0 0 auto; }
.pk-gecmis{ margin-top:12px; border-top:1px solid var(--cam-kenar2); padding-top:10px; }
.pk-gecmis.gizli{ display:none; }
.pk-h{ display:flex; justify-content:space-between; align-items:center; padding:6px 0; font-size:15px; color:var(--metin); border-bottom:1px dashed rgba(0,0,0,.06); }
.pk-h:last-child{ border-bottom:0; }
.pk-h-sag{ font-weight:800; color:var(--acc-koyu); white-space:nowrap; }
.pk-h-sag small{ color:var(--soluk); font-weight:500; margin-left:5px; }
.pk-bos, .pk-yuk{ font-size:15px; color:var(--soluk); padding:8px 2px; text-align:center; }

/* Davet kartı (profil) */
.davet-kart{ margin:6px 2px 4px; padding:15px 16px; border-radius:18px; background:var(--cam-yogun);
  border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); color:var(--metin); }
.dv-aciklama{ font-size:15px; line-height:1.5; color:var(--soluk); }
.dv-aciklama b{ color:var(--metin); }
.dv-link-row{ display:flex; gap:8px; margin-top:13px; }
.dv-link{ flex:1; min-width:0; padding:11px 12px; border-radius:12px; border:1px solid var(--cizgi2);
  background:#fff; font-size:13px; color:var(--soluk2); }
.dv-kopya{ flex:0 0 auto; padding:0 14px; border-radius:12px; background:var(--acc-100); color:var(--acc-koyu);
  font-weight:700; font-size:15px; display:inline-flex; align-items:center; gap:5px; }
.dv-kopya svg, .dv-kopya .ico{ width:15px; height:15px; }
.dv-paylas{ width:100%; margin-top:10px; padding:12px; border-radius:13px; font-weight:800; font-size:15px;
  background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; box-shadow:var(--sh-cta);
  display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.dv-paylas svg, .dv-paylas .ico{ width:18px; height:18px; }
.dv-kodgir{ display:flex; gap:8px; margin-top:11px; }
.dv-kod-inp{ flex:1; min-width:0; padding:11px 12px; border-radius:12px; border:1px solid var(--cizgi2); background:#fff; font-size:15px; color:var(--metin); }
.dv-kod-btn{ flex:0 0 auto; padding:0 16px; border-radius:12px; background:var(--cam-yogun); border:1px solid var(--cam-kenar2); font-weight:700; font-size:15px; color:var(--metin); }
.dv-eden{ margin-top:11px; font-size:15px; color:var(--acc-koyu); font-weight:600; display:flex; align-items:center; gap:7px; }
.dv-eden svg, .dv-eden .ico{ width:16px; height:16px; flex:0 0 auto; }

/* Ürün-bazlı puanlama (takip ekranı) */
.urun-puan-blok{ margin:12px 0 4px; padding-top:10px; border-top:1px solid var(--cam-kenar2); }
.up-bas{ font-size:15px; font-weight:700; color:var(--metin); margin-bottom:6px; }
.up-bas .ops{ font-weight:500; color:var(--soluk); text-transform:none; }
.up-satir{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:5px 0; }
.up-ad{ font-size:15px; color:var(--metin); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.up-yild{ flex:0 0 auto; }
.up-yild .yld{ width:30px; height:30px; }

/* Menüde ürün-puan pili */
.m-urunpuan{ display:inline-flex; align-items:center; gap:3px; margin-left:7px; font-size:13px; font-weight:700;
  color:#9A6A00; background:rgba(245,179,0,.16); border-radius:8px; padding:1px 6px; vertical-align:middle; }
.m-urunpuan svg, .m-urunpuan .ico{ width:12px; height:12px; fill:#F5B300; }
.m-urunpuan small{ font-weight:500; color:var(--soluk); margin-left:1px; }

/* ============================================================
   v132 — KÖŞE GİRİŞ (anasayfa=sipariş; sağ-üst "İşletme Girişi")
   ============================================================ */
.kose-isletme{ display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 13px;
  border-radius:13px; font-size:15px; font-weight:700; text-decoration:none; white-space:nowrap;
  color:#fff; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.34);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); transition:background .15s, transform .1s; }
.kose-isletme:hover{ background:rgba(255,255,255,.26); }
.kose-isletme:active{ transform:scale(.96); }
.kose-isletme svg, .kose-isletme .ico{ width:17px; height:17px; flex:0 0 auto; }
.kose-isletme .et{ line-height:1; }
/* Dar ekran: etiketi gizle, ikon kalsın (44px touch hedefi korunur) */
@media (max-width:374px){ .kose-isletme .et{ display:none; } .kose-isletme{ width:40px; padding:0; justify-content:center; } }
/* ml-marka-sag: 3 öğe sığsın (pill + zil + avatar) */
.ml-marka-sag{ gap:8px; }
.ml-marka-sol{ min-width:0; }

/* v132 — müşteri köşesi: anonimken avatar "Giriş" etiketli pill (R1: müşteri girişi köşede görünür) */
.ml-avatar{ display:inline-flex; align-items:center; justify-content:center; }
.ml-avatar .et{ display:none; }
.ml-avatar.ml-giris{ width:auto; padding:0 13px; gap:6px; border-radius:13px; }
.ml-avatar.ml-giris .et{ display:inline; font-size:15px; font-weight:700; line-height:1; }
@media (max-width:374px){ .ml-avatar.ml-giris{ width:40px; padding:0; } .ml-avatar.ml-giris .et{ display:none; } }

/* ============================================================
   v133 — DÜKKAN GİRİŞİ MODALI (kare, ortalı; #mhOverlay backdrop'u)
   ============================================================ */
.dg-modal{ position:relative; margin:auto; width:min(92vw,360px); background:#fff; border-radius:22px;
  padding:26px 22px 20px; box-shadow:0 30px 70px rgba(20,8,4,.42); color:#241712;
  animation:dgIn .28s cubic-bezier(.16,1,.3,1) both; }
@keyframes dgIn{ from{opacity:0; transform:translateY(10px) scale(.97)} to{opacity:1; transform:none} }
.dg-kapat{ position:absolute; top:12px; right:12px; width:34px; height:34px; border-radius:50%;
  display:grid; place-items:center; background:#f3f0ee; color:#6b5a52; }
.dg-kapat svg,.dg-kapat .ico{ width:16px; height:16px; }
.dg-bas{ text-align:center; margin-bottom:14px; }
.dg-logo{ width:46px; height:46px; object-fit:contain; margin:0 auto 8px; display:block; }
.dg-bas h2{ font-size:24px; font-weight:800; margin:0 0 3px; color:#1f2333; }
.dg-bas p{ font-size:15px; color:#7a7f8e; margin:0; }
.dg-form{ display:flex; flex-direction:column; }
.dg-lbl{ font-size:13px; font-weight:600; color:#6b6f80; margin:8px 2px 4px; }
.dg-input{ width:100%; padding:12px 13px; border-radius:12px; border:1px solid #e2dcd8;
  background:#faf9f8; font-size:16px; color:#241712; }
.dg-input:focus{ outline:none; border-color:var(--acc); background:#fff; }
.dg-hata{ color:#D32F2F; font-size:15px; margin:10px 2px 0; font-weight:600; }
.dg-hata.gizli{ display:none; }
.dg-giris-btn{ margin-top:14px; width:100%; padding:13px; border-radius:13px; font-weight:800; font-size:15px;
  background:linear-gradient(180deg,var(--acc),var(--acc-koyu)); color:#fff; box-shadow:var(--sh-cta); }
.dg-giris-btn:disabled{ opacity:.6; }
.dg-ayrac{ display:flex; align-items:center; gap:10px; margin:16px 2px; color:#9aa0ad; font-size:13px; }
.dg-ayrac::before,.dg-ayrac::after{ content:''; flex:1; height:1px; background:#ece7e3; }
.dg-google{ width:100%; padding:12px; border-radius:13px; font-weight:700; font-size:15px;
  background:#fff; border:1px solid #e2dcd8; color:#241712; display:inline-flex; align-items:center; justify-content:center; gap:9px; }
.dg-google .g-ikon{ width:22px; height:22px; border-radius:50%; background:#fff; border:1px solid #e2dcd8;
  display:grid; place-items:center; font-weight:800; color:#4285F4; font-size:15px; }
.dg-not{ text-align:center; font-size:13px; color:var(--soluk); margin-top:14px; line-height:1.5; }
.dg-not b{ color:var(--acc-koyu); }

/* ============================================================================
   v135 — WOLT-TIER PASTEL RE-TEMA (Faz 1) — Dükkanım kendi markası, pastel zemin
   Wolt yalnız desen/ilham; hiçbir Wolt varlığı (logo/maskot/illüstrasyon/renk) kullanılmadı.
   Kırmızı (#E8312A) artık ZEMİN değil AKSİYON rengi; zeminler yumuşak-pastel + bol beyaz.
   ============================================================================ */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  /* pastel sistem */
                   /* sayfa zemini — sıcak pastel beyaz (saf beyaz değil) */
                /* kart/panel yüzeyi */
          /* aktif hap/rozet pastel-kırmızı zemini */
    
   
     /* spring "şak" */
         /* yumuşak çıkış */
  
  
  /* 8 pastel kategori tonu (deterministik index%8) */
     
     
  /* mevcut glass token'larını PASTEL/SOLİD'e çek (tüm ekranlar tutarlı) */
    
    
   
    
  /* yumuşak gölgeler (kırmızıya hafif boyalı, sert kahve-gölge yerine) */
  
  
  
  
   
}
/* sayfa zemini: koyu mesh → yumuşak pastel beyaz */
body{
  background:
    radial-gradient(120% 60% at 50% -8%, #FFF1EE 0%, rgba(255,241,238,0) 60%),
    #FFF8F6 !important;
  background-attachment:fixed;
  color:var(--ink);
}
/* cam blur'u sadeleştir (artık opak yüzeyler → blur gereksiz, daha temiz/hızlı) */
.m-rest, .m-kart, .mh-sheet, .mhs-kart, .bt-bolum, .seviye-kart, .ml-konum, .ara-kutu{
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
/* restoran/menü kartları: temiz beyaz + yumuşak gölge + daha yuvarlak + hover-lift */
.m-rest, .m-kart{
  background:#fff !important; border:1px solid var(--line2) !important;
  box-shadow:var(--psh-rest) !important; border-radius:var(--r-lg) !important;
  transition:transform .2s var(--ease-o), box-shadow .2s var(--ease-o);
}
@media (hover:hover){
  .m-kart:hover{ transform:translateY(-4px); box-shadow:var(--psh-hover) !important; }
}
/* hızlı-filtre çipleri → pill + pastel-dolu aktif (saf kırmızı yanmaz) */
.hizli-filtre .hf-cip{
  background:#fff; border:1px solid var(--line2); color:var(--ink);
  border-radius:999px; font-weight:600; transition:all .12s var(--ease-o);
}
.hizli-filtre .hf-cip.sec{
  background:var(--brand-soft); border-color:var(--acc); color:var(--acc-koyu);
}
.hizli-filtre .hf-cip:active{ transform:scale(.97); }
/* kategori yuvarlak çipleri: spring hover + aktif kırmızı ring */
.chip{ transition:transform .22s var(--ease-s); }
@media (hover:hover){ .chip:hover{ transform:scale(1.06); } }
.chip:active{ transform:scale(.94); }
/* indirim/ücret rozetleri pastel: saf kırmızı blok yerine brand-soft */
.kampanya-rozet, .indirim-rozet, .mrc-puan{ border-radius:999px; }
/* erişilebilirlik: hareket azaltma */
@media (prefers-reduced-motion: reduce){
  .m-kart, .chip, .hf-cip{ transition:none !important; }
  .m-kart:hover, .chip:hover{ transform:none !important; }
}

/* ============================================================================
   v136 — ANASAYFA HEADER = WOLT-DÜZENİ AYDINLIK (kırmızı hero → pastel-beyaz)
   Logo renkli, metin koyu, arama belirgin; kırmızı yalnız aksiyon (Giriş/aktif).
   ============================================================================ */
/* body kırmızı→beyaz gradyanını (v122) PASTEL-BEYAZ ile ez (eşit specificity, sonra geldi) */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:
    radial-gradient(125% 42% at 50% 0%, #FFF1EE 0%, rgba(255,241,238,0) 70%),
    #FFF8F6 !important;
  background-size:auto !important; background-attachment:fixed !important;
}
/* header içeriği KOYU (aydınlık zemin) */
.ml-ust-btn{ color:var(--ink) !important; }
.ml-ust-btn svg.ico{ stroke:var(--ink) !important; }
.ml-brand .ml-slogan{ color:var(--ink2) !important; }
.ml-konum{ color:var(--ink) !important; }
.ml-konum .kik{ background:var(--brand-soft) !important; }
.ml-konum .kik svg.ico{ fill:var(--acc-koyu) !important; }
.ml-konum b{ color:var(--ink) !important; }
.ml-konum .kchev{ color:var(--ink2) !important; }
.selam h1{ color:var(--ink) !important; text-shadow:none !important; }
.selam p{ color:var(--ink2) !important; }
img.ml-logo{ height:30px; }
/* Arama kutusu: belirgin beyaz kart (Wolt deseni) */
.ara-kutu{
  background:#fff !important; border:1px solid var(--line2) !important;
  box-shadow:var(--psh-rest) !important; border-radius:14px !important; backdrop-filter:none !important;
}
.ara-kutu input{ color:var(--ink) !important; }
.ara-kutu input::placeholder{ color:var(--ink2) !important; }
.ara-ik svg.ico, .ara-ik{ color:var(--ink2) !important; }
/* Giriş butonları aydınlık header'a uyum: Dükkan Girişi outline, Giriş kırmızı-aksan */
.kose-isletme{
  background:#fff !important; border:1px solid var(--line2) !important; color:var(--ink) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.kose-isletme:hover{ background:var(--brand-soft) !important; }
.ml-avatar{ border:1px solid var(--line2) !important; }
.ml-avatar.ml-giris{ background:var(--brand-soft) !important; border-color:var(--acc) !important; color:var(--acc-koyu) !important; }
.ml-avatar.ml-giris svg.ico{ stroke:var(--acc-koyu) !important; }
.bildirim svg.ico{ stroke:var(--ink) !important; }
.ml-rozet-nokta{ background:var(--acc) !important; }
/* "Tümünü Gör" linki kırmızı aksan */
.bolum-bas .tumu, .tumu-gor{ color:var(--acc-koyu) !important; }

/* ============================================================================
   v137 — MASAÜSTÜ DÜZENİ (≥1024px): geniş Wolt yerleşimi (dar mobil kolon DEĞİL)
   Geniş kapsayıcı + çok-sütunlu restoran IZGARASI + geniş üst-bar + büyük kartlar.
   Mobilde (≤1023px) hiçbir şey değişmez (mevcut mobil düzen korunur).
   ============================================================================ */
@media (min-width:1024px){
  /* geniş kapsayıcı */
  .sar{ max-width:1200px !important; padding:24px 32px 56px !important; }
  /* üst-bar: logo sol — arama geniş orta — giriş sağ (tek satır, Wolt deseni) */
  .ml-marka{ padding:6px 0 4px !important; }
  img.ml-logo{ height:36px !important; }
  .ml-konum{ font-size:16px !important; }
  /* arama: geniş, ortalanmış belirgin kart */
  .ara-satir{ margin:18px 0 22px !important; }
  .ara-kutu{ height:52px !important; border-radius:16px !important; }
  .ara-kutu input{ font-size:16px !important; }
  .selam h1{ font-size:24px !important; }
  /* kategori şeridi: daha büyük daireler, geniş aralık */
  .chip-sira{ gap:18px !important; margin-bottom:26px !important; }
  /* RESTORAN IZGARASI: yatay tek-sıra → çok-sütun grid (auto-fill) */
  .ry-sira{
    display:grid !important;
    grid-template-columns:repeat(auto-fill, minmax(248px, 1fr)) !important;
    gap:24px !important; overflow:visible !important; padding:2px 0 !important;
    -webkit-mask:none !important; mask:none !important;
  }
  .ry-kart{ flex:initial !important; width:auto !important; scroll-snap-align:none !important; }
  .ry-foto{ aspect-ratio:16/10 !important; height:auto !important; }
  .ry-ad{ font-size:16px !important; }
  /* "Yine ister misin" satırı da grid */
  .ts-sira{ display:grid !important; grid-template-columns:repeat(auto-fill, minmax(248px, 1fr)) !important; gap:24px !important; overflow:visible !important; }
  /* promo kampanya: geniş banner ama aşırı uzamasın */
  .promo{ max-height:280px !important; }
  /* bölüm başlıkları daha iri */
  .bolum-bas h2, .ml-bolum h2{ font-size:24px !important; }
  /* hızlı-filtre çubuğu: tek satır, sarmalı */
  .hizli-filtre{ flex-wrap:wrap !important; }
  /* alt-nav masaüstünde ortada yüzen ince bar (mobil hissi azalır) */
  .botnav-ic{ max-width:540px !important; }
}
/* çok-geniş ekran: kartlar 4 sütun civarı sabitlensin */
@media (min-width:1440px){
  .sar{ max-width:1320px !important; }
  .ry-sira, .ts-sira{ grid-template-columns:repeat(4, 1fr) !important; }
}
/* v171 — ÇOK-geniş ekran (≥1680): Wolt içerik genişliği 1600px (canlı çıkarım).
   Feed sayfasında daha çok ürün kartı yan yana görünür → Wolt yoğunluğu. */
@media (min-width:1680px){
  .sar{ max-width:1600px !important; }
  .ry-sira, .ts-sira{ grid-template-columns:repeat(5, 1fr) !important; }
}

/* ============================================================================
   v138 — HEADER YAPISI (Wolt düzeni): mobil SARMALI / masaüstü TEK-SATIR
   Mobil: [logo ··· aksiyon] / [konum] / [arama]   |   Masaüstü: logo·konum·arama(orta)·aksiyon
   ============================================================================ */
.wlt-head{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 12px; padding:6px 0 2px; }
.wlt-logo{ order:1; display:flex; align-items:center; min-width:0; background:none; border:0; padding:0; margin:0; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.wlt-logo:active{ opacity:.75; }
.wlt-logo .ml-logo{ height:30px; width:auto; }
.wlt-r{ order:2; margin-left:auto; display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.wlt-konum{ order:3; flex:0 0 100%; }
.wlt-ara-wrap{ order:4; flex:0 0 100%; display:flex; gap:10px; }
.wlt-ara-wrap .ara-kutu{ flex:1; min-width:0; }
/* mobil: aksiyon butonları kompakt (etiketsiz ikon) → taşma olmaz */
@media (max-width:1023px){
  .wlt-r .kose-isletme .et{ display:none; }
  .wlt-r .kose-isletme{ width:40px; padding:0; justify-content:center; }
}
/* masaüstü: tek satır — logo | konum | ARAMA(geniş orta) | aksiyon */
@media (min-width:1024px){
  .wlt-head{ flex-wrap:nowrap; gap:16px; padding:10px 0; }
  .wlt-logo .ml-logo{ height:36px; }
  .wlt-konum{ order:2; flex:0 0 auto; }
  .wlt-ara-wrap{ order:3; flex:1 1 auto; max-width:580px; margin:0 auto; }
  .wlt-ara-wrap .ara-kutu{ height:52px; }
  .wlt-r{ order:4; margin-left:0; }
}

/* ============================================================================
   v139 — TEPE/HEADER = WOLT MOBİL DESENİ BİREBİR
   Yapı: [logo ····· ⊙ ⊙ ⊙]  /  [📍 Konum ▾]  /  ──ayraç──  /  "Restoranlar"
   Aksiyonlar = yuvarlak ikon butonlar; konum = yuvarlak pin'li hap; arama mobilde
   GİZLİ (ikon dokununca açılır), masaüstünde her zaman görünür.
   ============================================================================ */
/* --- yuvarlak ikon aksiyon butonları (Dükkan / Ara / Hesabım) --- */
.wlt-r{ gap:10px !important; }
.wlt-ic-btn{
  -webkit-appearance:none; appearance:none; cursor:pointer; position:relative;
  width:44px; height:44px; flex:0 0 44px; padding:0; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid var(--line2); color:var(--ink);
  box-shadow:var(--psh-rest);
  transition:transform .16s var(--ease-o), background .16s var(--ease-o), box-shadow .16s var(--ease-o);
}
.wlt-ic-btn .ico{ width:23px; height:23px; }
.wlt-ic-btn:hover{ background:var(--brand-soft); box-shadow:var(--psh-hover); transform:translateY(-1px); }
.wlt-ic-btn:active{ transform:scale(.92); }
/* Hesabım — giriş yapılmamışsa kırmızı-aksan dolgu (dikkat çek) */
.wlt-ic-btn.ml-avatar.ml-giris{ background:var(--brand-soft); border-color:var(--acc); color:var(--acc-koyu); }
.wlt-ic-btn.ml-avatar.ml-giris .ico{ stroke:var(--acc-koyu); }
.wlt-ic-btn .ml-rozet-nokta{ position:absolute; top:8px; right:8px; width:9px; height:9px; border-radius:50%; background:var(--acc); border:2px solid #fff; }

/* --- konum hapı: yuvarlak pin + kalın metin + chevron --- */
.wlt-konum{
  -webkit-appearance:none; appearance:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:9px; padding:6px 14px 6px 6px;
  background:transparent; border:none; color:var(--ink); border-radius:999px;
  transition:background .16s var(--ease-o);
}
.wlt-konum:hover{ background:var(--brand-soft); }
.wlt-konum .kik{
  width:34px; height:34px; flex:0 0 34px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--brand-soft); color:var(--acc-koyu);
}
.wlt-konum .kik svg{ width:18px; height:18px; fill:var(--acc-koyu); }
.wlt-konum b{ font-size:15px; font-weight:800; letter-spacing:-.3px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:62vw; }
.wlt-konum .kchev{ display:inline-flex; color:var(--ink2); }
.wlt-konum .kchev svg{ width:18px; height:18px; }

/* --- ayraç: tam-genişlik ince çizgi --- */
.wlt-ayrac{ height:1px; background:var(--line2); margin:10px 0 14px; border:0; }

/* --- büyük "Restoranlar" başlığı --- */
.selam h1{ font-size:24px !important; font-weight:800 !important; letter-spacing:-.7px !important; }

/* --- arama: mobilde gizli; ikon dokununca açılır (ara-acik) --- */
.wlt-ara-wrap{ display:none !important; }
.wlt-head.ara-acik .wlt-ara-wrap{ display:flex !important; }
.wlt-head.ara-acik .wlt-ara-ac{ display:none; }   /* arama açıkken arama-ikonu gizle */

/* --- masaüstü: arama her zaman açık; arama-aç ikonu gizli --- */
@media (min-width:1024px){
  .wlt-ara-wrap{ display:flex !important; }
  .wlt-ara-ac{ display:none !important; }
  .wlt-konum b{ max-width:none; }
  .wlt-ayrac{ display:none; }   /* masaüstü tek-satır header'da ayraç gereksiz */
}

/* ============================================================================
   v140 — WOLT BİREBİR: BEMBEYAZ zemin + filtre çubuğu + yuvarlak kategori
   ızgarası + "Tümünü göster" + Kategoriler/Göre-sırala modalları.
   (Wolt'un teal aksanı yerine marka KIRMIZI; zemin pembe DEĞİL, saf beyaz.)
   ============================================================================ */
/* 1) ZEMİN BEMBEYAZ — v136 pembe radial gradyanı ez */
body, :root[data-tema="acik"] body, :root[data-tema="koyu"] body{
  background:#FFFFFF !important; background-image:none !important;
  background-color:#FFFFFF !important;
}
.sar, .kesfet, .ekran{ background:transparent !important; }

/* 2) KÖŞE: Wolt gibi nötr — avatar gri (kırmızı dolgu YOK), ikon butonları açık-gri */
.wlt-ic-btn{ background:#F2F1EC; border-color:transparent; color:var(--ink-900); }
.wlt-ic-btn:hover{ background:#EAE8E2; box-shadow:none; }
.wlt-ic-btn.ml-avatar.ml-giris{ background:#F2F1EC !important; border-color:transparent !important; color:var(--ink-900) !important; }
.wlt-ic-btn.ml-avatar.ml-giris .ico{ stroke:#9A9A93 !important; }
.wlt-ic-btn .ico{ stroke:var(--ink-900); }

/* 3) FİLTRE ÇUBUĞU: yatay kaydırılır hap dizisi */
.wlt-fbar{ display:flex; gap:10px; align-items:center; overflow-x:auto; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; padding:2px 0 8px; margin:4px 0 4px; }
.wlt-fbar::-webkit-scrollbar{ display:none; }
.wlt-fbtn-ic{ flex:0 0 auto; width:46px; height:46px; border-radius:50%; background:#F2F1EC; border:none;
  color:var(--ink-900); display:grid; place-items:center; position:relative; cursor:pointer; transition:background .15s; }
.wlt-fbtn-ic:active{ transform:scale(.93); }
.wlt-fbtn-ic.aktif{ background:var(--brand-soft); color:var(--acc-koyu); }
.wlt-fsay{ position:absolute; top:-2px; right:-3px; min-width:18px; height:18px; padding:0 4px; border-radius:999px;
  background:var(--acc); color:#fff; font-size:13px; font-weight:800; display:grid; place-items:center; border:2px solid #fff; }
.wlt-pill{ flex:0 0 auto; height:46px; padding:0 18px; border-radius:999px; background:#fff;
  border:1.5px solid #E3E2DD; color:var(--ink-900); font-weight:600; font-size:15px; cursor:pointer;
  display:inline-flex; align-items:center; gap:5px; white-space:nowrap; transition:background .15s,border-color .15s,color .15s; }
.wlt-pill:active{ transform:scale(.97); }
.wlt-pill .pchev{ display:inline-flex; }
.wlt-pill .pchev svg, .wlt-pill .pchev .ico{ width:16px; height:16px; }
.wlt-pill.sec{ background:var(--brand-soft); border-color:var(--acc); color:var(--acc-koyu); }

/* 4) YUVARLAK KATEGORİ IZGARASI (2×4) — Wolt dairesel foto + alt etiket */
.kat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px 8px; margin:10px 0 16px; padding:0; }
.kat-hucre{ background:none; border:none; padding:0; cursor:pointer; display:flex; flex-direction:column;
  align-items:center; gap:9px; -webkit-tap-highlight-color:transparent; }
.kat-hucre .chip-foto{ width:74px; height:74px; border-radius:50% !important; overflow:hidden; display:block;
  background:#F2F1EC; box-shadow:none; border:none !important; margin:0 0 2px !important; transition:transform .15s; }
.kat-hucre .chip-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.kat-hucre span{ font-size:15px; font-weight:700; color:var(--ink-900); text-align:center; line-height:1.2; letter-spacing:-.1px; }
.kat-hucre:active .chip-foto{ transform:scale(.94); }
.kat-hucre.aktif .chip-foto{ box-shadow:0 0 0 3px var(--acc); }

/* 5) "TÜMÜNÜ GÖSTER" hap butonu (krem zemin, ortada metin + chevron) */
.tumunu-goster{ width:100%; height:54px; border-radius:999px; background:#F5F4EF; border:none; color:var(--ink-900);
  font-weight:700; font-size:15px; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  cursor:pointer; margin:2px 0 20px; transition:background .15s; }
.tumunu-goster:hover{ background:#EFEDE6; }
.tumunu-goster:active{ transform:scale(.99); }
.tumunu-goster .tg-chev{ display:inline-flex; }
.tumunu-goster .tg-chev svg, .tumunu-goster .tg-chev .ico{ width:18px; height:18px; }

/* 6) MODAL KABUĞU — Kategoriler / Göre sırala (beyaz, üst köşeler yuvarlak) */
.kat-sheet, .sirala-sheet{ background:#FFFFFF !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:none !important; border-radius:22px 22px 0 0 !important; max-width:560px; box-shadow:0 -12px 44px rgba(20,16,14,.22) !important; }
.kat-sheet-bas{ position:sticky; top:0; z-index:3; background:#fff; display:flex; align-items:center; gap:12px;
  padding:20px 18px 12px; }
.kat-sheet-baslik{ font-size:24px; font-weight:800; color:var(--ink-900); margin:0; flex:1; letter-spacing:-.6px; }
.kat-toggle{ display:inline-flex; background:#F5EFE9; border-radius:999px; padding:4px; gap:2px; flex:0 0 auto; }
.kt-btn{ width:42px; height:36px; border:none; background:none; border-radius:999px; color:#6E6F7B;
  display:grid; place-items:center; cursor:pointer; transition:background .15s,color .15s; }
.kt-btn.sec{ background:#fff; color:var(--ink-900); box-shadow:0 1px 4px rgba(0,0,0,.14); }
.kat-kapat{ background:#F2F1EC !important; color:var(--ink-900) !important; border:none !important; flex:0 0 auto; }
.kat-kapat .ico{ width:18px; height:18px; }
.kat-sheet-govde{ flex:1; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:6px 18px 22px; }
.kat-grid--modal{ grid-template-columns:repeat(4,1fr); gap:22px 8px; margin:6px 0 0; }

/* liste görünümü: yuvarlak foto + ad + ince ayraç */
.kat-liste{ display:flex; flex-direction:column; }
.kat-satir{ display:flex; align-items:center; gap:16px; padding:13px 0; border:none; border-bottom:1px solid #ECEAE5;
  background:none; cursor:pointer; text-align:left; width:100%; }
.kat-satir:last-child{ border-bottom:none; }
.kat-satir .chip-foto{ width:56px; height:56px; flex:0 0 56px; border-radius:50% !important; overflow:hidden;
  background:#F2F1EC; box-shadow:none; border:none !important; margin:0 !important; }
.kat-satir .chip-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.kat-satir b{ font-size:15px; font-weight:700; color:var(--ink-900); }
.kat-satir.aktif b{ color:var(--acc-koyu); }
.kat-satir:active{ background:#FAF9F6; }

/* Göre sırala: seçilebilir haplar + sticky Uygula */
.wlt-pill-wrap{ display:flex; flex-wrap:wrap; gap:12px; padding:8px 18px 6px; }
.wlt-secpill{ height:48px; padding:0 22px; border-radius:999px; background:#F5EFE9; border:2px solid transparent;
  color:var(--ink-900); font-weight:600; font-size:15px; cursor:pointer; transition:background .15s,border-color .15s,color .15s; }
.wlt-secpill:active{ transform:scale(.97); }
.wlt-secpill.sec{ background:#fff; border-color:var(--acc); color:var(--acc-koyu); box-shadow:0 4px 12px rgba(0,0,0,.08); }
.kat-sheet-alt{ position:sticky; bottom:0; background:#fff; padding:14px 18px calc(16px + env(safe-area-inset-bottom)); }
.wlt-uygula{ width:100%; height:56px; border-radius:16px; background:var(--brand-soft); border:none;
  color:var(--acc-koyu); font-weight:800; font-size:15px; cursor:pointer; transition:background .15s; }
.wlt-uygula:hover{ background:#FBDAD8; }
.wlt-uygula:active{ transform:scale(.99); }

/* masaüstü: kategori ızgarası 6-8 sütun, daha geniş */
@media (min-width:1024px){
  .kat-grid{ grid-template-columns:repeat(8,1fr); gap:18px 10px; }
  .kat-hucre .chip-foto{ width:92px; height:92px; }
  .tumunu-goster{ max-width:420px; }
  .kat-grid--modal{ grid-template-columns:repeat(6,1fr); }
}

/* ============================================================================
   v141 — MASAÜSTÜ Wolt başlığı (Giriş yapmak / Üye olmak) + KAYDIRMALI kategori
   karuseli ("Kategoriye göre göz atın" + ← → oklar). Mobilde 2×4 grid korunur.
   ============================================================================ */
/* responsive görünürlük anahtarları */
.wlt-deskonly{ display:none; }
/* masaüstü giriş grubu (mobilde gizli) */
.wlt-auth{ display:none; align-items:center; gap:18px; flex:0 0 auto; }
.wlt-girislink{ background:none; border:none; color:var(--ink-900); font-weight:700; font-size:15px; cursor:pointer; white-space:nowrap; padding:8px 4px; transition:color .15s; }
.wlt-girislink:hover{ color:var(--acc-koyu); }
.wlt-uyeol{ background:var(--brand-soft); color:var(--acc-koyu); border:none; border-radius:999px; padding:12px 26px; font-weight:800; font-size:15px; cursor:pointer; white-space:nowrap; transition:background .15s; }
.wlt-uyeol:hover{ background:#FBDAD8; }

/* kategori bölüm başlığı + oklar (masaüstü) */
.kat-bolum-bas{ align-items:center; justify-content:space-between; margin:14px 0 4px; }
.kat-bolum-bas h2{ font-size:24px; font-weight:800; color:var(--ink-900); margin:0; letter-spacing:-.5px; }
.kat-oklar{ display:flex; gap:10px; }
.kat-ok{ width:44px; height:44px; border-radius:50%; background:var(--brand-soft); border:none; color:var(--acc-koyu);
  display:grid; place-items:center; cursor:pointer; transition:background .15s,transform .12s; }
.kat-ok:hover{ background:#FBDAD8; }
.kat-ok:active{ transform:scale(.92); }

/* kategori karuseli — tek sıra yatay kaydırma */
.kat-carousel{ gap:22px; overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; padding:8px 2px 12px; margin:0 0 8px; }
.kat-carousel::-webkit-scrollbar{ display:none; }
.kat-carousel .kat-hucre{ flex:0 0 auto; }
.kat-carousel .kat-hucre .chip-foto{ width:104px !important; height:104px !important; }
.kat-carousel .kat-hucre span{ font-size:15px; }

@media (min-width:1024px){
  .wlt-deskonly{ display:flex; }
  .wlt-mobonly{ display:none !important; }
  .wlt-r{ display:none; }              /* masaüstünde ikon-daireler yerine metin giriş */
  .wlt-auth{ display:flex; order:5; }
  .kat-bolum-bas{ display:flex; }
  .kat-carousel{ display:flex; }
}

/* ============================================================================
   v142 — PNG TABAK görseller (Wolt deseni) + YUMUŞAK yazı (Baloo 2) + masaüstü
   hover "yukarı kalkma" animasyonu.
   ============================================================================ */
/* PNG tabak: beyaz zeminde yüzen tabak (kırpma yok, yumuşak gölge) */
.kat-hucre .chip-foto, .kat-carousel .chip-foto, .kat-satir .chip-foto{ background:#FFFFFF !important; }
.chip-foto.chip-foto--png{ background:#FFFFFF !important; box-shadow:0 4px 14px rgba(20,16,14,.10) !important; }
.chip-foto.chip-foto--png img{ opacity:1 !important; filter:none !important; object-fit:cover; }

/* YUMUŞAK TİPOGRAFİ — Wolt'un yuvarlak hissi (Baloo 2), sivri/sert değil */
.selam h1, .kat-sheet-baslik, .kat-bolum-bas h2{
  font-family:var(--display), system-ui, -apple-system, sans-serif !important;
  font-weight:700 !important; letter-spacing:0 !important; }
.kat-hucre span, .kat-satir b, .wlt-pill, .wlt-secpill, .tumunu-goster, .wlt-uygula,
.wlt-girislink, .wlt-uyeol, .wlt-konum b, .kt-btn{
  font-family:'Baloo 2', system-ui, -apple-system, sans-serif !important; }
.kat-hucre span{ font-weight:600 !important; letter-spacing:0 !important; }
.kat-satir b{ font-weight:600 !important; }
.wlt-pill, .wlt-secpill{ font-weight:600 !important; }
.wlt-konum b{ font-weight:700 !important; }
.selam h1{ font-size:24px !important; }

/* MASAÜSTÜ: kategori üzerine gelince hafif yukarı kalkma (oynama) */
@media (min-width:1024px){
  .kat-hucre{ transition:transform .22s cubic-bezier(.2,.9,.3,1); }
  .kat-hucre:hover{ transform:translateY(-4px); } /* v232 K2 — çift-kaldırma tekleşti: hücre -4, chip ek transform yok (tabak-etiket birlikte kalkar) */
  .kat-hucre:hover .chip-foto{ box-shadow:0 14px 26px rgba(20,16,14,.16) !important; }
  .kat-hucre:hover .chip-foto.chip-foto--png{ box-shadow:0 16px 28px rgba(20,16,14,.18) !important; }
}

/* ============================================================================
   v143 — KATEGORİ ETİKETLERİ Wolt birebir: koyu lacivert var(--ink-900), yumuşak-yuvarlak
   (Baloo 2), kalınlık 700, biraz daha büyük. (Sert/ince değil — Wolt'taki gibi.)
   ============================================================================ */
.kat-hucre span, .kat-satir b{
  font-family:var(--body), system-ui, -apple-system, sans-serif !important;
  color:var(--ink-900) !important; font-weight:700 !important; letter-spacing:.1px !important;
}
.kat-hucre span{ font-size:15px !important; line-height:1.25 !important; margin-top:2px; }
.kat-carousel .kat-hucre span{ font-size:15px !important; }
.kat-satir b{ font-size:15px !important; }

/* ============================================================================
   v144 — YAZI DÜZELTME: Baloo 2 (şişman/baloncuk = "çivi yazısı") YERİNE Nunito
   (temiz-yumuşak humanist, Wolt'un Omnes'ine yakın). Etiketler İNCE (600) +
   Wolt ile aynı boyut (16px). Başlıklar 800.
   ============================================================================ */
.selam h1, .kat-sheet-baslik, .kat-bolum-bas h2,
.kat-hucre span, .kat-satir b, .wlt-pill, .wlt-secpill, .tumunu-goster, .wlt-uygula,
.wlt-girislink, .wlt-uyeol, .wlt-konum b, .kt-btn{
  font-family:'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
/* kategori etiketi: İNCE değil kalın değil — Wolt gibi 600 semibold, 16px */
.kat-hucre span{ font-weight:600 !important; font-size:15px !important; letter-spacing:0 !important; line-height:1.25 !important; }
.kat-carousel .kat-hucre span{ font-weight:600 !important; font-size:15px !important; }
.kat-satir b{ font-weight:700 !important; font-size:15px !important; }
/* başlıklar Nunito ağır */
.selam h1, .kat-sheet-baslik, .kat-bolum-bas h2{ font-weight:800 !important; letter-spacing:-.3px !important; }
.wlt-pill, .wlt-secpill{ font-weight:600 !important; }
.wlt-konum b{ font-weight:700 !important; }

/* ============================================================================
   v145 — YAZI = INTER (Wolt analizi: Inter %90). Kategori etiketleri Inter 600
   15px #2E3148; başlıklar Inter 800; filtre/pill Inter 600. (Nunito/Baloo iptal.)
   ============================================================================ */
.selam h1, .kat-sheet-baslik, .kat-bolum-bas h2,
.kat-hucre span, .kat-satir b, .wlt-pill, .wlt-secpill, .tumunu-goster, .wlt-uygula,
.wlt-girislink, .wlt-uyeol, .wlt-konum b, .kt-btn{
  font-family:'Inter', system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
/* kategori etiketleri: Inter SemiBold 600, 15px / 20px, #2E3148 */
.kat-hucre span{ font-weight:600 !important; font-size:15px !important; line-height:20px !important; color:#2E3148 !important; letter-spacing:0 !important; }
.kat-carousel .kat-hucre span{ font-weight:600 !important; font-size:15px !important; color:#2E3148 !important; }
.kat-satir b{ font-weight:600 !important; font-size:15px !important; color:#2E3148 !important; }
/* başlıklar: Inter ExtraBold 800 */
.kat-sheet-baslik{ font-weight:800 !important; font-size:24px !important; letter-spacing:-.4px !important; color:var(--ink-900) !important; }
.selam h1{ font-weight:800 !important; font-size:24px !important; letter-spacing:-.5px !important; color:var(--ink-900) !important; }
.kat-bolum-bas h2{ font-weight:800 !important; font-size:24px !important; letter-spacing:-.3px !important; color:var(--ink-900) !important; }
/* filtre/pil/Uygula: Inter 600 */
.wlt-pill, .wlt-secpill{ font-weight:600 !important; font-size:15px !important; }
.wlt-uygula{ font-weight:700 !important; }
.wlt-konum b{ font-weight:700 !important; }
/* göre-sırala/filtre modal başlığı (mh-title de Inter olsun) */
.mh-title{ font-family:'Inter', system-ui, sans-serif !important; font-weight:700 !important; }

/* ============================================================================
   v146 — TABAK BOYUTU Wolt seviyesine: daireler büyük (hücreyi doldurur) +
   PNG tabak görseli daireyi DOLDURUR (kenar boşluğu kırpılır, küçük kalmaz).
   ============================================================================ */
/* mobil 4'lü ızgara: daireler büyük, aralar dar (Wolt gibi neredeyse değiyor) */
.kat-grid{ gap:16px 6px !important; }
.kat-hucre .chip-foto{ width:90px !important; height:90px !important; }
.kat-grid--modal .chip-foto, .kat-grid--modal .kat-hucre .chip-foto{ width:90px !important; height:90px !important; }
/* PNG tabak: görseli büyüt → beyaz kenar boşluğu daire dışına taşsın (kırpılır), tabak daireyi doldursun */
.chip-foto.chip-foto--png{ overflow:hidden !important; }
.chip-foto.chip-foto--png img{ transform:scale(1.16); transform-origin:center; }
/* karusel (masaüstü) daha da büyük */
.kat-carousel .kat-hucre .chip-foto{ width:118px !important; height:118px !important; }

@media (min-width:1024px){
  .kat-hucre .chip-foto{ width:104px !important; height:104px !important; }
  .kat-carousel .kat-hucre .chip-foto{ width:124px !important; height:124px !important; }
}

/* ============================================================================
   v147 — RESPONSIVE tabak ızgarası (her cihaza otomatik sığar, sağ sütun
   KESİLMEZ) + temiz WebP tabak (satranç deseni temizlendi, beyaz zemin = sayfa).
   Sabit px YOK → hücre 1fr, tabak hücreyi doldurur, 4'lü her ekranda oturur.
   ============================================================================ */
.kat-grid, .kat-grid--modal{ grid-template-columns:repeat(4,1fr) !important; gap:16px 10px !important; }
.kat-hucre{ min-width:0 !important; }
.kat-grid .kat-hucre .chip-foto, .kat-grid--modal .kat-hucre .chip-foto{
  width:100% !important; height:auto !important; aspect-ratio:1/1 !important; max-width:120px !important; margin:0 auto !important;
}
/* temiz tabak: beyaz zemin (sayfa beyazı), gölge/daire YOK → tabak yüzer (Wolt) */
.chip-foto.chip-foto--png{ background:#fff !important; box-shadow:none !important; overflow:visible !important; border-radius:0 !important; }
.chip-foto.chip-foto--png img{ object-fit:contain !important; transform:none !important; width:100% !important; height:100% !important; opacity:1 !important; }
.kat-satir .chip-foto{ border-radius:0 !important; box-shadow:none !important; background:#fff !important; }
.kat-carousel .kat-hucre .chip-foto{ width:120px !important; height:120px !important; }
@media (min-width:1024px){
  .kat-grid .kat-hucre .chip-foto, .kat-grid--modal .kat-hucre .chip-foto{ max-width:124px !important; }
  .kat-carousel .kat-hucre .chip-foto{ width:132px !important; height:132px !important; }
}

/* ============================================================================
   v148 — TABAKLAR EŞİT (görseller normalize edildi: hepsi %88) + ARALAR SIKI
   (Wolt gibi yakın). Yatay boşluk dar, dikey boşluk etiket için biraz açık.
   ============================================================================ */
.kat-grid, .kat-grid--modal{ gap:20px 6px !important; }
.kat-grid .kat-hucre .chip-foto, .kat-grid--modal .kat-hucre .chip-foto{ max-width:130px !important; }
.kat-hucre{ gap:7px !important; }

/* ============================================================================
   v149 — HEADER STICKY (Wolt deseni: üst bar yukarıda sabit kalır; konum + altı
   yukarı kaydıkça header'ın ALTINA girip kaybolur) + MODAL SCROLL KİLİDİ
   (kategoriler/sıralama/filtre açıkken arka plan kaymaz).
   ============================================================================ */
/* modal açıkken arka plan sayfası kilitli */
html.mh-acik, body.mh-acik{ overflow:hidden !important; }
html.mh-acik{ height:100% !important; }
.mh-overlay{ overscroll-behavior:contain; }

/* üst bar (logo + ikonlar / masaüstü arama+giriş) yapışkan */
.wlt-head{ position:sticky; top:0; z-index:30; background:#FFFFFF; padding-top:8px !important; padding-bottom:10px !important; }
.wlt-head::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--line2); }
/* konum artık header'ın dışında, kendi satırında (scroll'da header altına kayar) */
.wlt-konum{ margin:10px 0 4px !important; }

/* ============================================================================
   v150 — TABAKLAR DAHA BÜYÜK (Wolt seviyesi): görseller %95 dolu + hücreler
   geniş (max-width ↑), yatay aralar dar (neredeyse değiyor), modal kenar boşluğu az.
   ============================================================================ */
.kat-grid, .kat-grid--modal{ gap:14px 4px !important; }
.kat-grid .kat-hucre .chip-foto, .kat-grid--modal .kat-hucre .chip-foto{ max-width:160px !important; }
.kat-sheet-govde{ padding-left:12px !important; padding-right:12px !important; }
.sar .kat-grid{ margin-left:-2px; margin-right:-2px; }   /* anasayfa ızgarası kenara yakın */
@media (min-width:1024px){
  .kat-grid .kat-hucre .chip-foto, .kat-grid--modal .kat-hucre .chip-foto{ max-width:150px !important; }
}

/* ============================================================================
   v151 — FİLTRE ÇUBUĞU da STICKY (Wolt: kategorilere gelince filtre üst barın
   ALTINA yapışır, kategoriler altından kayar). Header yüksekliği JS'ten --head-h.
   ============================================================================ */
.wlt-fbar{
  position:sticky; top:calc(var(--head-h, 60px) - 1px); z-index:25; background:#FFFFFF;
  padding-top:10px !important; padding-bottom:10px !important;
}
.wlt-fbar::after{ content:''; position:absolute; left:-4px; right:-4px; bottom:0; height:1px; background:var(--line2); }

/* ============================================================================
   v152 — Wolt KÖŞE (2 buton: bej Ara + gri dolu-kişi Hesabım) + SCROLL ÜST AÇIKLIK
   FIX (header'ı .sar üst boşluğuna kadar çek → yapışınca üstte boşluk kalmaz).
   ============================================================================ */
/* (v152 margin/padding hack KALDIRILDI — logonun üstünde boşluk açıyordu;
   sızma artık z-index:60 ile çözülüyor.) */

/* köşe butonları Wolt rengi */
.wlt-ic-btn.wlt-ara-ac{ background:#F2EFEA; border:none; color:var(--ink-900); }
.wlt-ic-btn.wlt-ara-ac:hover{ background:#EAE7E1; }
.wlt-ic-btn.ml-avatar, .wlt-ic-btn.ml-avatar.ml-giris{ background:#E7E6E1 !important; border:none !important; }
.wlt-ic-btn.ml-avatar .ico, .wlt-ic-btn.ml-avatar.ml-giris .ico{ fill:#9A9A93 !important; stroke:none !important; width:26px; height:26px; }
.wlt-ic-btn.ml-avatar:hover, .wlt-ic-btn.ml-avatar.ml-giris:hover{ background:#DEDDD7 !important; }

/* ============================================================================
   v153 — KÖŞE GİRİŞ: Hesabım ikonu → seçenek sheet (Müşteri + Dükkan Girişi) +
   ARAMA sola-açılan animasyon (logo solda kalır) + HEADER SIZMA FIX (z-index 60).
   ============================================================================ */
/* sızma/açıklık fix: header + filtre çubuğu HER ŞEYİN ÜSTÜNDE, tam opak */
.wlt-head{ z-index:60 !important; background:#FFFFFF !important; }
.wlt-fbar{ z-index:55 !important; background:#FFFFFF !important; }

/* giriş seçenekleri sheet */
.giris-sheet{ background:#FFFFFF !important; }
.giris-secenekler{ padding:8px 16px calc(20px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; gap:12px; }
.giris-opt{ display:flex; align-items:center; gap:14px; width:100%; padding:15px 16px; border-radius:16px;
  background:#F7F6F2; border:1.5px solid var(--line2); cursor:pointer; text-align:left; transition:background .15s, transform .1s; }
.giris-opt:active{ transform:scale(.99); }
.giris-opt:hover{ background:#F1EFE9; }
.giris-opt--dukkan{ background:var(--brand-soft); border-color:transparent; }
.giris-opt--dukkan:hover{ background:#FBDAD8; }
.gso-ik{ width:46px; height:46px; flex:0 0 46px; border-radius:50%; display:grid; place-items:center; background:#fff; color:var(--ink-900); border:1px solid var(--line2); }
.gso-ik--dukkan{ background:#fff; color:var(--acc-koyu); border-color:transparent; }
.gso-txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.gso-txt b{ font-family:'Inter',system-ui,sans-serif; font-size:15px; font-weight:700; color:var(--ink-900); }
.gso-txt small{ font-family:'Inter',system-ui,sans-serif; font-size:13px; color:var(--ink2); line-height:1.35; }
.gso-go{ color:var(--ink2); display:inline-flex; transform:rotate(-90deg); }
.gso-go svg, .gso-go .ico{ width:18px; height:18px; }

/* (v153 absolute arama-animasyonu KALDIRILDI — bar ortada beliriyordu. Arama
   basit toggle'a döndü: mobilde gizli, merceğe basınca alt satırda görünür.) */
.wlt-ara-kapat{ display:none; }   /* kapat butonu basit toggle'da gerekmiyor */

/* ============================================================================
   v154 — AJAN PANELİ SENTEZİ: temiz + sağlam header (gap YOK, sızma YOK).
   Tek dikiş kuralı: her boşluğu tek eleman sahiplenir (çift margin yok).
   ============================================================================ */
.sar{ overflow:visible !important; }                       /* position:sticky şart */
.wlt-head{ z-index:120 !important; background:#FFFFFF !important; padding:12px 0 8px !important; }
.wlt-head::after{ background:var(--line2); }               /* opak ince çizgi */
.wlt-konum{ margin:14px 0 0 !important; }                  /* logo-satırı → konum: 14 */
.wlt-fbar{ z-index:110 !important; background:#FFFFFF !important; margin:12px 0 0 !important; padding:4px 0 6px !important; }
.kat-grid, .kat-bolum-bas{ margin-top:16px !important; }   /* filtre → ızgara: 16 */

/* ============================================================================
   v157 — STICKY GERİ (v151+v152 geri alındı): header tepede sabit kalır.
   Tüm box-shadow/::before/clip karmaşası TEMİZLENDİ. Yatay taşma sticky-GÜVENLİ
   yöntemle kesildi: clip YALNIZ html'de (scroll kökü) → sticky bozulmaz.
   Body scroll kilidi overflow:hidden ile (position:fixen YOK → sayfa kaymaz).
   ============================================================================ */
/* header + filtre çubuğu STICKY (geri) — opak beyaz, gölgesiz */
.wlt-head{ position:sticky !important; top:0 !important; z-index:120 !important; background:#FFFFFF !important; box-shadow:none !important; }
/* v195 — eski `.wlt-head::before{display:none!important}` KALDIRILDI: dosya sonundaki
   "üstten sızıntı kapağı" ::before'unu eziyordu (mobil sızıntı bununla geri gelirdi). */
.wlt-fbar{ position:sticky !important; top:calc(var(--head-h, 60px) - 1px) !important; z-index:110 !important; background:#FFFFFF !important; box-shadow:none !important; }
.sar{ overflow:visible !important; }            /* sticky için ŞART (clip/hidden YOK) */
/* yatay kaydırmayı SADECE html'de kes (sticky'yi bozmaz; body/.sar visible kalır) */
html{ overflow-x:hidden !important; }

/* ============================================================================
   v158 — KONUM PILL header İÇİNE alındı (Wolt deseni: logo | 📍konum | arama | giriş)
   konum artık .wlt-head'in flex-child'ı (markup'ta logodan sonra). Mobilde
   flex:0 0 100% ile yine tam-genişlik alt satır; masaüstünde order:2 ile inline.
   + arama merceği koyulaştırıldı (soluk gri → okunur orta gri).
   ============================================================================ */
/* mobil: konum logo-satırının ALTINDA tam-genişlik (görsel olarak öncekiyle aynı) */
.wlt-konum{ margin:12px 0 2px !important; }
/* masaüstü: konum logonun YANINDA, dikey ortalı (üst-margin YOK → logoyla hizalı) */
@media (min-width:1024px){
  .wlt-konum{ order:2 !important; flex:0 0 auto !important; margin:0 !important; align-self:center;
              gap:6px !important; padding:5px 10px 5px 5px !important; }
  .wlt-head{ align-items:center !important; }
  /* Wolt gibi kompakt: küçük pin + 15px yarı-kalın yazı (büyük 18px/800 DEĞİL) */
  .wlt-konum .kik{ width:28px !important; height:28px !important; flex:0 0 28px !important; }
  .wlt-konum .kik svg{ width:15px !important; height:15px !important; }
  .wlt-konum b{ font-size:16px !important; font-weight:700 !important; letter-spacing:-.2px !important; }
  .wlt-konum .kchev svg{ width:15px !important; height:15px !important; }
}
/* arama merceği: Wolt gibi okunur orta-gri (soluk açık gri DEĞİL) */
.wlt-ara-wrap .ara-ik, .wlt-ara-wrap .ara-ik svg,
.wlt-ara-wrap .ara-ik svg.ico, .wlt-ara-wrap .ara-ik svg path{
  color:#6B7080 !important; fill:#6B7080 !important; opacity:1 !important;
}

/* ============================================================================
   v159 — ADRES MODALI = WOLT DESENİ (mahalle listesi KORUNDU, teslimat çalışır)
   Wolt imzası: temiz beyaz ferah sheet + konum (crosshair) ikonu ARAMA INPUT'u
   İÇİNDE (ayrı kırmızı buton DEĞİL). İşlev birebir aynı; yalnız görünüm Wolt'a.
   ============================================================================ */
/* temiz beyaz sheet (cam/blur kaldırıldı) */
.mh-sheet{
  background:#FFFFFF !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:none !important; border-radius:26px 26px 0 0 !important;
  box-shadow:0 -10px 40px rgba(20,14,12,.20) !important;
  padding-bottom:calc(14px + env(safe-area-inset-bottom)) !important;
}
.mh-head{ background:#FFFFFF !important; padding:10px 20px 6px !important; }
.mh-handle{ background:#E2DED8 !important; box-shadow:none !important; }
.mh-head-row{ margin-bottom:6px !important; }
.mh-title{ font-family:'Inter',system-ui,sans-serif !important; font-size:24px !important; font-weight:800 !important;
  letter-spacing:-.4px !important; color:var(--ink-900) !important; }
.mh-alt{ margin:0 0 2px !important; font-family:'Inter',system-ui,sans-serif !important; font-size:15px !important;
  line-height:1.4 !important; color:var(--ink2,#6B7080) !important; font-weight:500 !important; }
.mh-kapat{ background:#F1EFEA !important; border:none !important; box-shadow:none !important; color:#5A5E70 !important; }
/* eski tam-genişlik kırmızı GPS butonu artık YOK (input içine alındı) */
.mh-gps{ display:none !important; }

/* arama kutusu: Wolt gibi ferah, açık zemin, yuvarlak */
.mh-search{ background:#F4F2EE !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:1.5px solid #ECE8E2 !important; box-shadow:none !important; border-radius:16px !important;
  margin:8px 20px 12px !important; padding:12px 12px 12px 15px !important; gap:10px !important; color:var(--soluk) !important; }
.mh-search:focus-within{ border-color:var(--acc,#E8312A) !important; box-shadow:0 0 0 4px rgba(232,49,42,.10) !important; background:#FFFFFF !important; }
.mh-search > .ico{ color:var(--soluk) !important; width:19px !important; height:19px !important; }
.mh-search input{ font-size:16px !important; color:var(--ink-900) !important; }
.mh-search input::placeholder{ color:var(--soluk) !important; }
/* v279 gece-kurul O8 — 13× dead-fallback var(--acc-koyu,#C81E17)→#C01E18 (bu bölümden 5047'ye kadar). --acc-koyu daima tanımlı → sıfır-görsel. */
/* input İÇİ konum (crosshair) butonu — Wolt deseni */
.mh-gps-ic{ flex:0 0 auto; width:38px; height:38px; border-radius:50%; border:none; cursor:pointer;
  display:grid; place-items:center; background:var(--brand-soft,#FDE7E6); color:var(--acc-koyu,#C01E18);
  transition:transform .12s, filter .15s, background .15s; }
.mh-gps-ic .ico{ width:20px !important; height:20px !important; color:inherit !important; fill:currentColor !important; }
.mh-gps-ic:active{ transform:scale(.92); }
@media (hover:hover){ .mh-gps-ic:hover{ filter:brightness(.97); } }
.mh-gps-ic.yukleniyor{ animation:mhGpsSpin .8s linear infinite; opacity:.85; }
@keyframes mhGpsSpin{ to{ transform:rotate(360deg); } }
/* liste başlıkları biraz daha yumuşak */
.mh-grup-bas{ color:var(--soluk) !important; }
.mh-results{ padding:0 12px !important; }
.mh-row-ad{ color:#2E3148 !important; }

/* v159b — adres modalı boş-durum: aranana kadar mahalle listesi GİZLİ (kalabalık yok) */
.mh-bosdurum{ list-style:none; display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:8px; padding:38px 26px 30px; color:var(--ink2,#6B7080); }
.mh-bosdurum .mh-bos-ik{ display:grid; place-items:center; width:64px; height:64px; border-radius:50%;
  background:var(--brand-soft,#FDE7E6); color:var(--acc-koyu,#C01E18); margin-bottom:4px; }
.mh-bosdurum .mh-bos-ik .ico{ width:30px; height:30px; fill:currentColor; }
.mh-bosdurum b{ font-family:'Inter',system-ui,sans-serif; font-size:15px; font-weight:800; color:var(--ink-900); letter-spacing:-.2px; }
.mh-bosdurum small{ font-family:'Inter',system-ui,sans-serif; font-size:15px; line-height:1.45; max-width:280px; color:var(--ink2,#6B7080); }

/* v160 — kategori seçili sonuç başlığı (Wolt: "{Kategori} · N dükkan" + Temizle) */
.kat-sonuc-bas h2{ display:inline-flex; align-items:baseline; gap:10px; }
.kat-sonuc-bas .kat-sayi{ font-family:'Inter',system-ui,sans-serif; font-size:15px; font-weight:600; color:var(--ink2,#6B7080); letter-spacing:0; }
.ml-tumu.kat-temizle{ color:var(--acc-koyu,#C01E18); font-weight:700; display:inline-flex; align-items:center; gap:4px; }
.ml-tumu.kat-temizle .ico{ width:15px; height:15px; }

/* ============================================================================
   v161 — MEKAN DETAY = WOLT DESENİ. Yapı/HTML korunur; yalnız görünüm Wolt'a:
   düz beyaz menü SATIRLARI (kartsız + ince ayraç), tam-genişlik kapak + sol-alt
   logo, sade büyük başlık, sticky pill kategori çipleri, beyaz daire + butonu.
   ============================================================================ */
/* kapak: tam-genişlik hero (.sar padding'ini negatif margin ile aş) */
.m-kapak{ width:calc(100% + 32px) !important; margin:-2px -16px 0 !important; border-radius:0 !important;
  aspect-ratio:16/10 !important; box-shadow:none !important; }
.m-kapak::after{ background:linear-gradient(transparent 58%, rgba(18,11,9,.30)) !important; }
/* logo: sol-alt bindirme, beyaz çerçeve */
.m-logo{ top:auto !important; bottom:-24px !important; left:16px !important; width:62px !important; height:62px !important;
  border-radius:18px !important; z-index:5 !important; box-shadow:0 6px 18px rgba(20,12,10,.30) !important; }
/* kalp: kapağın sağ-altına */
.m-kapak .m-kalp-rest{ top:auto !important; bottom:12px !important; right:12px !important; left:auto !important; }
/* başlık: düz beyaz (cam/blur YOK), büyük ad */
.m-rest{ background:#fff !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:none !important; border-radius:0 !important; box-shadow:none !important; padding:20px 2px 6px !important; margin-bottom:8px !important; }
.m-rest .m-rest-ad{ font-family:'Inter',system-ui,sans-serif !important; font-size:24px !important; font-weight:800 !important;
  letter-spacing:-.6px !important; color:var(--ink-900) !important; line-height:1.1 !important; }
/* açıklama/slogan: 2 satıra kadar nefesli, gövde grisi (premium venue alt-başlık) */
.m-rest .m-rest-slogan{ color:#5E6473 !important; font-size:15px !important; line-height:1.45 !important; margin-top:7px !important;
  display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; }
.m-rest .m-rest-alt{ color:#6B7080 !important; font-size:15px !important; margin-top:9px !important; }
.m-rest .m-rest-adres{ margin-top:8px !important; }
.m-rest .m-rest-adres a{ color:#7A808C !important; font-size:13px !important; }
/* meta satırı (puan · süre · teslimat · min · detay): nefesli, tutarlı */
.m-rest .m-rest-info{ margin-top:12px !important; gap:8px !important; font-size:15px !important; line-height:1.5 !important; }
.m-rest .m-rest-info .mri-ayrac{ color:#C7CBD4 !important; }
/* Ara / Paylaş: premium açık-gri hap, 48px dokunma, net ikon */
.m-rest-aksiyon{ gap:11px !important; margin-top:16px !important; }
.m-rest-aksiyon .ara-btn{ flex:1 !important; min-height:48px !important; border-radius:15px !important;
  background:#F4F2EE !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:1px solid #EAE6DF !important; color:var(--ink-900) !important; font-size:15px !important; font-weight:700 !important;
  box-shadow:none !important; letter-spacing:-.1px !important; }
.m-rest-aksiyon .ara-btn:active{ background:#ECE8E1 !important; transform:scale(.98) !important; }
.m-rest-aksiyon .ara-btn .ico{ width:17px !important; height:17px !important; color:var(--acc-koyu,#C01E18) !important; }
/* menü-içi arama: Wolt düz açık-gri */
.menu-ara input{ background:#F4F2EE !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:1.5px solid #EAE6DF !important; border-radius:15px !important; color:var(--ink-900) !important; font-size:15px !important; }
.menu-ara input:focus{ border-color:var(--acc,#E8312A) !important; background:#fff !important; outline:none !important; }
.menu-ara .ara-ik{ color:var(--soluk) !important; }
/* MOBİL premium ince rötuşlar (masaüstü venue desenine dokunmadan): pinlenen üst blok
   ayracı + ürün satırı üst-hizası. ≥1024 masaüstü DEĞİŞMEZ. */
@media (max-width:1023px){
  /* menü üst bloğu (arama+sekmeler) pinlenince listeden ince hairline + yumuşak gölge ile ayrılsın */
  .menu-ust{ border-bottom:1px solid #EFEBE6 !important; box-shadow:0 8px 14px -12px rgba(20,12,10,.18) !important; }
  /* ürün satırı: metin bloğu görselle dikey ortalı kalsın (uzun açıklamada bile) */
  .m-kart{ align-items:flex-start !important; }
  .m-kart .m-ic{ align-self:center !important; }
  /* kategori sekmesi: ≥40px dokunma + belirgin aktif (800), pasif okunur gri */
  .menu-kat-cip{ color:#5E6473 !important; font-weight:700 !important; padding:10px 15px !important; border-radius:999px !important; }
  .menu-kat-cip.sec{ color:var(--acc-koyu,#C01E18) !important; font-weight:800 !important; }
  /* premium görsel köşe + arama yüksekliği yalnız mobilde */
  .m-gorsel{ width:100px !important; height:100px !important; border-radius:16px !important; }
  .menu-ara input{ min-height:48px !important; }
}
/* kategori çipleri: sticky + Wolt pill */
.menu-kat-bar{ position:sticky !important; top:0 !important; z-index:9 !important; background:#fff !important;
  padding:8px 2px 10px !important; margin:0 -2px !important; }
/* v177 — Wolt kategori sekmesi: PASİF = şeffaf zemin + düz koyu yazı; AKTİF = soft tint + vurgu yazı. */
.menu-kat-cip{ background:transparent !important; border:none !important; color:var(--ink-900) !important;
  box-shadow:none !important; font-weight:600 !important; font-size:15px !important; padding:8px 12px !important; border-radius:20px !important; }
.menu-kat-cip:hover{ background:#F4F2EE !important; }
.menu-kat-cip.sec{ background:var(--brand-soft,#FDE7E6) !important; border:none !important; color:var(--acc-koyu,#C01E18) !important; box-shadow:none !important; }
/* bölüm başlığı: normal-case büyük bold, sticky DEĞİL (çip barı sticky) */
.kat-bas{ position:static !important; font-family:'Inter',system-ui,sans-serif !important; text-transform:none !important;
  letter-spacing:-.4px !important; font-size:18px !important; font-weight:800 !important; color:var(--ink-900) !important;
  text-shadow:none !important; background:transparent !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  margin:26px 2px 6px !important; padding:2px 2px !important; }
/* ÜRÜN SATIRI: kartsız düz satır + alt ayraç (Wolt) */
.m-kart{ background:transparent !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  border:none !important; border-bottom:1px solid #EFEBE6 !important; border-radius:0 !important; box-shadow:none !important;
  padding:16px 2px !important; margin:0 !important; gap:14px !important; align-items:center !important; }
.m-kart:active{ box-shadow:none !important; transform:none !important; background:#FAF8F5 !important; }
.m-ad{ font-size:15px !important; font-weight:700 !important; color:var(--ink-900) !important; letter-spacing:-.2px !important; line-height:1.25 !important; }
.m-ack{ font-size:15px !important; color:#6B7080 !important; line-height:1.4 !important; margin-top:4px !important; }
.m-fiyat{ color:var(--ink-900) !important; font-weight:800 !important; font-size:15px !important; margin-top:9px !important; }
.m-fiyat .m-art{ color:var(--brand-700) !important; }
/* görsel: sağda kare, sade */
.m-gorsel{ width:98px !important; height:98px !important; border-radius:14px !important; box-shadow:none !important; }
.m-gorsel::after{ display:none !important; }
/* + butonu: beyaz daire + kırmızı +, görselin sağ-alt köşesinde (Wolt) */
.ekle{ right:4px !important; bottom:6px !important; width:40px !important; height:40px !important; min-width:40px !important;   /* BATCH 4 — 34→40 (WCAG dokunma hedefi; ::after ile 48px) */
  padding:0 !important; background:#fff !important; color:var(--acc-koyu,#C01E18) !important; border:1px solid #ECE8E2 !important;
  box-shadow:0 2px 8px rgba(20,12,10,.18) !important; font-size:24px !important; line-height:1 !important; }
.ekle.sec-dolu{ background:var(--acc,#E8312A) !important; color:#fff !important; border-color:transparent !important; }
.m-kart .adet{ background:#fff !important; }   /* v284 fit-motor — adet artık .m-alt footer içinde (descendant); konum reset base'te */
/* ürün favori kalbi: küçük/soluk (Wolt'ta yok ama özelliği koru) */
.m-kalp{ opacity:.55 !important; }

/* ═══ v284 fit-motor — KART ALT FOOTER (fiyat + ekle/adet TEK normal-akış satır) ═══
   Eski: ekle/adet position:absolute → fiyatı ÖRTÜYORDU (d-bindirmesi, her genişlik).
   Yeni: .m-alt flex footer (fiyat sol, aksiyon sağ, space-between). Aksiyon m-ic içinde
   olduğundan absolute reset ŞART (satır 4748 `.m-kart .ekle{position:absolute}` KÖK). */
.m-alt{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
.m-alt .m-fiyat{ margin-top:0 !important; flex:0 1 auto; min-width:0; }   /* satırda dikey kaymayı önle */
.m-kart .m-alt .ekle, .m-kart .m-alt .adet{ position:static !important; inset:auto !important;
  right:auto !important; bottom:auto !important; left:auto !important; top:auto !important; flex:0 0 auto; }

/* ============================================================================
   v162 — WOLT "Tüm Restoranlar" feed: dükkan satırı + yatay ürün şeridi.
   Şerit deseni Wolt birebir: 1 BÜYÜK kart (ad·fiyat) + 2 KÜÇÜK kart (fiyat) istif.
   ============================================================================ */
.wf-bolum h2{ font-family:'Inter',system-ui,sans-serif; font-weight:800; font-size:24px; letter-spacing:-.5px; color:var(--ink-900); }
.wf-feed{ display:flex; flex-direction:column; }
.wf-satir{ padding:4px 0 16px; border-bottom:1px solid #F0ECE6; }
/* v248 — kapak hero YALNIZ mobil (≤1023) kart kabuğunda; masaüstü feed satırı DEĞİŞMEZ → gizli. */
.wf-kapak{ display:none; }
.wf-satir:last-child{ border-bottom:none; }
.wf-satir.wf-kapali{ opacity:.6; }
.wf-bas{ display:flex; align-items:center; gap:13px; width:100%; background:none; border:none; padding:12px 2px; cursor:pointer; text-align:left; }
.wf-logo{ flex:0 0 auto; width:60px; height:60px; border-radius:16px; overflow:hidden; background:#F1EDE7; display:grid; place-items:center; box-shadow:0 1px 5px rgba(20,12,10,.10); }
.wf-logo img{ width:100%; height:100%; object-fit:cover; }
.wf-logo-bos .ico{ width:28px; height:28px; color:#9A8F82; }
.wf-bilgi{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.wf-ad{ font-family:'Inter',system-ui,sans-serif; font-weight:800; font-size:15px; letter-spacing:-.3px; color:var(--ink-900); display:flex; align-items:center; gap:8px; min-width:0; }
/* v190 — kampanya rozeti ekran dışına taşıyordu (flex'te text-overflow çalışmaz): başlık kendi span'ında kısalır, rozet küçülmez */
.wf-ad .wf-ad-txt{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wf-indirim{ font-size:13px; font-weight:800; color:#fff; background:var(--cta-fill); border-radius:999px; padding:2px 8px; flex:0 0 auto; white-space:nowrap; }
.wf-ack{ font-size:15px; color:#6B7080; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wf-meta{ font-size:13px; color:var(--soluk); display:flex; align-items:center; gap:5px; white-space:nowrap; overflow:hidden; }
.wf-meta .ico{ width:14px; height:14px; vertical-align:-2px; color:#A8AEBC; }
.wf-meta .ico.star, .wf-meta svg{ }
.wf-ok{ flex:0 0 auto; color:#C2C6D2; display:grid; place-items:center; }
.wf-ok .ico{ width:22px; height:22px; }
/* yatay ürün şeridi */
.wf-urunler{ display:flex; gap:10px; overflow-x:auto; padding:4px 2px 2px; margin:0 -2px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.wf-urunler::-webkit-scrollbar{ display:none; }
.wf-urun{ position:relative; flex:0 0 auto; border-radius:16px; overflow:hidden; cursor:pointer; background:#F4F2EE; box-shadow:0 1px 4px rgba(20,12,10,.07); }
.wf-urun:active{ transform:scale(.985); }
.wf-urun-foto{ width:100%; height:100%; }
.wf-urun-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.wf-urun-bos{ width:100%; height:100%; display:grid; place-items:center; color:#C8BCAE; }
.wf-urun-bos .ico{ width:34px; height:34px; }
.wf-buyuk{ width:282px; height:208px; }
.wf-kucol{ flex:0 0 auto; display:flex; flex-direction:column; gap:10px; }
.wf-kucuk{ width:150px; height:99px; }
/* etiket pill (büyük: ad·fiyat sol-üst; küçük: yalnız fiyat sol-üst) */
.wf-et{ position:absolute; left:10px; top:10px; max-width:calc(100% - 20px); background:rgba(255,255,255,.93);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); border-radius:999px; padding:6px 12px;
  font-family:'Inter',system-ui,sans-serif; font-size:15px; font-weight:600; color:var(--ink-900);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-shadow:0 1px 5px rgba(20,12,10,.14); }
.wf-et-b b{ font-weight:800; }
.wf-et-k{ font-weight:800; font-size:13px; }

/* v163 — sepette TÜKENEN ürün (esnaf canlı "Tükendi" yaptı): gri + uyarı, adet gizli */
.s-satir.s-tukendi{ opacity:.66; }
.s-satir.s-tukendi .s-foto-sar img{ filter:grayscale(.6) brightness(.96); }
.s-tuk-rozet{ display:inline-block; margin-left:8px; font-size:13px; font-weight:800; color:#fff; background:var(--soluk); border-radius:999px; padding:2px 8px; vertical-align:1px; }
.s-tuk-not{ margin-top:4px; font-size:13px; color:var(--acc-koyu,#C01E18); font-weight:600; line-height:1.35; }

/* v164 — profil "Favorilerim" kısayolu (favori listesine UI erişimi eklendi) */
.profil-link{ display:flex; align-items:center; gap:12px; width:100%; background:#fff; border:1px solid var(--line2,#ECE8E2); border-radius:16px; padding:14px 16px; cursor:pointer; text-align:left; box-shadow:var(--sh1,0 1px 4px rgba(20,12,10,.06)); transition:background .14s; }
.profil-link:active{ background:#FAF8F5; }
.profil-link .pl-ik{ display:grid; place-items:center; width:38px; height:38px; flex:0 0 38px; border-radius:50%; background:var(--brand-soft,#FDE7E6); color:var(--acc-koyu,#C01E18); }
.profil-link .pl-ik .ico{ width:20px; height:20px; }
.profil-link .pl-ad{ flex:1; font-family:'Inter',system-ui,sans-serif; font-size:15px; font-weight:700; color:var(--ink-900); }
.profil-link .pl-say{ font-size:15px; font-weight:800; color:#fff; background:var(--acc,#E8312A); border-radius:999px; padding:2px 9px; }
.profil-link .pl-ok{ color:#C2C6D2; display:grid; place-items:center; }
.profil-link .pl-ok .ico{ width:20px; height:20px; }

/* Profil ROL KARTI — işletme/panel girişi (premium, ölçülü kırmızı vurgu). Esnaf oturumluysa dolu vurgu. */
.profil-isletme-kart{ display:flex; align-items:center; gap:12px; width:100%; margin:14px 0 0; background:#fff; border:1px solid var(--line2,#ECE8E2); border-radius:16px; padding:14px 16px; cursor:pointer; text-align:left; box-shadow:var(--sh1,0 1px 4px rgba(20,12,10,.06)); transition:background .14s, box-shadow .14s; }
.profil-isletme-kart:active{ background:#FAF8F5; }
.profil-isletme-kart .pik-ik{ display:grid; place-items:center; width:38px; height:38px; flex:0 0 38px; border-radius:50%; background:var(--brand-soft,#FDE7E6); color:var(--acc-koyu,#C01E18); }
.profil-isletme-kart .pik-ik svg{ width:22px; height:22px; }
.profil-isletme-kart .pik-txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.profil-isletme-kart .pik-txt b{ font-family:'Inter',system-ui,sans-serif; font-size:15px; font-weight:800; color:var(--ink-900); line-height:1.2; }
.profil-isletme-kart .pik-txt small{ font-size:12.5px; font-weight:600; color:var(--soluk,#8A8F9C); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.profil-isletme-kart .pik-ok{ color:#C2C6D2; display:grid; place-items:center; flex:0 0 auto; }
.profil-isletme-kart .pik-ok .ico{ width:20px; height:20px; }
/* Esnaf oturumu açık: kart kırmızıya döner (panel kısayolu belirginleşsin). */
.profil-isletme-kart--acik{ background:var(--acc,#E8312A); border-color:var(--acc,#E8312A); box-shadow:0 6px 18px rgba(232,49,42,.24); }
.profil-isletme-kart--acik:active{ background:var(--acc-koyu,#C01E18); }
.profil-isletme-kart--acik .pik-ik{ background:rgba(255,255,255,.18); color:#fff; }
.profil-isletme-kart--acik .pik-txt b, .profil-isletme-kart--acik .pik-txt small{ color:#fff; }
.profil-isletme-kart--acik .pik-txt small{ opacity:.9; }
.profil-isletme-kart--acik .pik-ok{ color:rgba(255,255,255,.75); }

/* ============================================================================
   v165 — FEED MASAÜSTÜ/MOBİL AYRIMI (Wolt deseni):
   • MOBİL (taban): büyük kart "Ad·fiyat" + 2 küçük kart (yalnız fiyat) dikey istif.
   • MASAÜSTÜ (≥1024px): TÜM kartlar EŞİT-BOY büyük landscape, "Ad·fiyat", yatay
     kaydırma + ◀▶ oklar (Wolt masaüstü "All Restaurants").
   Mobil davranış DEĞİŞMEDİ — yalnız ≥1024px override eklendi.
   ============================================================================ */
.wf-et-fy{ font-weight:800; }
.wf-kucuk .wf-et-ad{ display:none; }          /* mobil: küçük kartlar yalnız fiyat */
.wf-satir{ position:relative; }
.wf-oklar{ gap:8px; }                          /* .wlt-deskonly zaten mobilde gizler */

@media (min-width:1024px){
  /* v171 — GERÇEK Wolt masaüstü ölçüleri (canlı getComputedStyle çıkarımı, 1920px):
     ürün kartı 330×186 · köşe 12px · yumuşak 3-kat gölge · şerit gap 8px ·
     dükkan başlığı 64px · sağ aksiyon butonları 40×40 yuvarlak. */
  .wf-buyuk, .wf-kucuk{ width:330px !important; height:186px !important; }   /* Wolt: 330×185.6 */
  .wf-urun{ border-radius:12px !important;                                   /* Wolt: 12px */
    box-shadow:0 1px 2px rgba(0,0,0,.07), 0 2px 3px rgba(0,0,0,.07), 0 4px 6px rgba(0,0,0,.07) !important; }
  .wf-kucol{ flex-direction:row !important; gap:8px !important; }            /* Wolt şerit gap 8px */
  .wf-kucuk .wf-et-ad{ display:inline !important; }                          /* masaüstü: tüm kartlarda ad·fiyat */
  .wf-urunler{ gap:8px !important; scroll-behavior:smooth; padding-bottom:8px; }  /* Wolt: 8px */
  .wf-et{ font-size:14px; padding:7px 13px; }
  /* dükkan başlık satırı — Wolt 64px, dikey ortalı */
  .wf-bas{ min-height:64px; padding:8px 96px 8px 2px; }   /* sağ: oklarla çakışma olmasın */
  /* satır başlığı sağında ◀▶ oklar — Wolt sağ-üst 40×40 yuvarlak (gap 4px) */
  .wf-oklar{ position:absolute; top:14px; right:2px; display:flex; gap:4px !important; z-index:3; }
  .wf-ok-btn{ width:40px; height:40px; border-radius:9999px; border:none; background:var(--brand-soft,#FDE7E6); color:var(--acc-koyu,#C01E18); display:grid; place-items:center; cursor:pointer; transition:filter .14s; }
  .wf-ok-btn:hover{ filter:brightness(.95); }
  /* v174 — Wolt bölüm başlığı 24px/700 (canlı çıkarım: "All Restaurants" 24px/600).
     Satır ~2014 `.bolum-bas.ml-bolum h2{17px!important}` eziyordu → daha spesifik + !important. */
  .bolum-bas.ml-bolum.wf-bolum h2{ font-size:24px !important; font-weight:700 !important; }
}

/* ============================================================================
   v167 — MEKAN DETAY MASAÜSTÜ = WOLT (mobil v161 KORUNUR, yalnız ≥1024px override):
   • Hero üzerine bindirme logo+ad+slogan (beyaz, koyu gradyan).
   • Ürünler ÇOK-SÜTUN IZGARA + kartlı (mobilde tek-sütun düz satır).
   • Kategori sekmeleri SOL + mekan-içi arama SAĞ tek satır.
   ============================================================================ */
.m-urunler{ }                                  /* mobil: normal akış (düz satırlar, v161) */
/* v181 FIX — mobilde sekme+arama çubuğu HİÇ yapışmıyordu: .menu-kat-bar kendisi position:sticky
   olsa da, sticky bir elemanın "yapışık kalma" aralığı KENDİ EBEVEYNİNİN kutusuyla sınırlıdır
   (CSS spec). Ebeveyn .menu-ust mobilde sticky DEĞİLDİ ve içeriği kadar kısaydı (~search+çipler) →
   o küçük kutu ekrandan çıkar çıkmaz sticky çocuğun tutunacak yeri kalmıyor, tamamen kayıp gidiyordu
   (masaüstünde .menu-ust zaten sticky olduğu için sorun yoktu). Şimdi mobilde de .menu-ust'un
   KENDİSİ sticky — başlığın (.ust, 67px) hemen altına yapışıyor, Wolt'taki gibi. */
.menu-ust{ position:sticky; top:calc(67px + env(safe-area-inset-top)); z-index:9; background:#fff; }

/* ============================================================================
   WOLT ŞEFFAF BAŞLIK (venue/menu ekranı) — kapak fotoğrafı EN ÜSTE kadar tam
   kaplar; .ust başlık çubuğu kapağın ÜZERİNDE şeffaf durur (yalnız yüzen geri
   butonu + hafif üst karartma). Aşağı kaydırınca opaklaşır ve dükkan adı belirir
   (Wolt deseni: başlık scroll ile "beliren" sticky bar). Yalnız menu ekranında.
   ============================================================================ */
body[data-ekran="menu"] .ust{
  position:fixed; left:0; right:0; top:0; z-index:30;
  background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none;
  border-bottom:1px solid transparent;
  transition:background .25s ease, backdrop-filter .25s ease, border-color .25s ease;
}
/* okunurluk için kapak üzerinde hafif üstten karartma (scroll'da kaybolur) */
body[data-ekran="menu"] .ust::before{
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(rgba(0,0,0,.38), rgba(0,0,0,0));
  opacity:1; transition:opacity .25s ease;
}
body[data-ekran="menu"] .ust .baslik{ opacity:0; transform:translateY(4px); color:#fff;
  text-shadow:0 1px 6px rgba(0,0,0,.55); transition:opacity .2s ease, transform .2s ease; }
body[data-ekran="menu"] .ust .geri{ color:#fff; background:rgba(0,0,0,.34); border-color:transparent;
  box-shadow:0 2px 10px rgba(0,0,0,.28); }
body[data-ekran="menu"] .ust .sehir{ display:none; }   /* kapak üzerinde şehir çipi gereksiz (adres kartta var) */
/* kaydırınca: solid başlık + görünür ad */
body[data-ekran="menu"] .ust.ust-solid{
  /* v220 (madde 6 / K11): --glass %78 opaktı → scroll'da "Teslimat 15₺"/butonlar başlığın İÇİNDEN sızıyordu.
     Tam opak yüzey (blur/cam hissi korunur) → sızma biter. */
  background:var(--surface,#FFFFFF); -webkit-backdrop-filter:saturate(120%) blur(20px); backdrop-filter:saturate(120%) blur(20px);
  border-bottom-color:var(--cam-kenar);
  box-shadow:0 4px 16px -8px rgba(20,12,10,.14);   /* premium derinlik: altına geçen içerik "kesik" değil "altında" okunur */
}
body[data-ekran="menu"] .ust.ust-solid::before{ opacity:0; }
body[data-ekran="menu"] .ust.ust-solid .baslik{ opacity:1; transform:none; color:var(--metin); text-shadow:none; }
body[data-ekran="menu"] .ust.ust-solid .geri{ color:var(--metin); background:var(--surface,#fff); border-color:var(--cam-kenar); box-shadow:var(--sh1); }
/* hero'yu en üste çek: .ust artık fixed (yer kaplamıyor) → kapak top:0'dan başlasın */
body[data-ekran="menu"] .sar{ padding-top:0 !important; }
body[data-ekran="menu"] .m-kapak{ margin-top:0 !important; }

@media (min-width:1024px){
  /* --- HERO: geniş + bindirme ad/slogan --- */
  .m-kapak{ aspect-ratio:auto !important; height:268px !important; }   /* v280 Faz 2 — referans: kapağı küçült (330→268), boş dev alan bitsin */
  .m-kapak::after{ background:linear-gradient(transparent 30%, rgba(10,6,5,.66)) !important; }
  .m-logo{ top:auto !important; bottom:34px !important; left:36px !important; width:96px !important; height:96px !important; border-radius:20px !important; }
  .m-kapak .m-kalp-rest{ top:20px !important; bottom:auto !important; right:24px !important; }
  /* DİKKAT: .wlt-deskonly{display:flex} (satır ~2907) bunu flex-row yapıp ad+slogan'ı YAN YANA
     yapıştırıyordu → flex-direction:column ile DÜZELT (isim üstte, slogan altında). */
  .m-kapak-bilgi{ position:absolute; left:152px; bottom:44px; z-index:4; max-width:64%;
    display:flex !important; flex-direction:column !important; align-items:flex-start !important; }
  .mkb-ad{ font-family:'Inter',system-ui,sans-serif; font-weight:800; font-size:48px; line-height:1.04; letter-spacing:-1px; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.55); }
  .mkb-alt{ font-size:16px; color:rgba(255,255,255,.94); margin-top:10px; max-width:620px; text-shadow:0 1px 8px rgba(0,0,0,.5); }
  /* başlık altı: ad/durum gizli (hero'da var), yalnız bilgi çipleri + aksiyon kalsın */
  .m-rest{ padding-top:16px !important; }
  .m-rest .m-rest-ad, .m-rest .m-rest-alt{ display:none !important; }
  /* --- kategori sekmeleri SOL + arama SAĞ --- */
  /* v178 — satır KENDİSİ sticky (.ust global başlığın altına, top:84px — .menu-yan ile aynı ofset):
     önceden yalnız .menu-kat-bar sticky idi ama bu satırda position:static !important ile EZİLİYORDU
     → kaydırınca sekmeler sabit .ust başlığının (z-index20) ALTINDA KALIP KAYBOLUYORDU (Wolt'ta sekme+arama
     satırı başlığın hemen altına yapışık kalır). Artık satırın TAMAMI yapışkan, kat-bar'ın kendi sticky'sine
     gerek yok (ezilmiş duruyor, zararsız). */
  .menu-ust{ display:flex !important; flex-direction:row-reverse; align-items:center; gap:18px; margin:6px 0 8px;
    position:sticky; top:84px; z-index:9; background:#fff; padding:10px 2px; }
  .menu-ust .menu-kat-bar{ flex:1 1 auto; min-width:0; margin:0 !important; padding:8px 0 !important; position:static !important; }
  .menu-ust .menu-ara{ flex:0 0 320px; margin:0 !important; }
  /* --- ürün IZGARASI (kartlı) --- */
  /* v176/v177 — Wolt menü kartı (canlı çıkarım: 503×140, köşe 12px, beyaz, sol metin+sağ görsel):
     2 SÜTUN geniş landscape. FLEX-WRAP + sabit-geniş kart → kategori 1 ürünlü olsa bile
     kart TAM GENİŞ (~503px) kalır, yarım/dar görünmez (seyrek-veri Wolt deseni). */
  .m-urunler{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; align-items:stretch; min-width:0; }   /* v284 fit-motor — auto-fill: alan daralınca 3→2→1 sütun; kart hücreden ASLA taşmaz */
  .m-kart{ min-width:0; max-width:none; width:auto; flex:initial;   /* v284 fit-motor — grid hücresini zorlayan sabit genişlik/min-width KALKTI (kart-kart + sepet bindirmesi kökü) */
    border:1px solid #EFEBE6 !important; border-bottom:1px solid #EFEBE6 !important; border-radius:12px !important;
    background:#fff !important; box-shadow:0 1px 4px rgba(20,12,10,.06) !important; padding:12px !important; margin:0 !important; }
  .m-kart:active{ background:#fff !important; }
  .kat-bas{ margin-top:26px !important; font-size:24px !important; }
}
/* Wolt mekan menüsü ≥1320'de de 2 SÜTUN kalır (kartlar ~503px geniş, Wolt deseni). */

/* ============================================================================
   v172 — MEKAN MASAÜSTÜ İKİ-SÜTUN (Wolt canlı çıkarım: menü 1236 + sağ 280, gap24):
   solda menü gövdesi, sağda YAPIŞKAN "Siparişin" özet paneli. Mobilde tek sütun
   (yan panel .wlt-deskonly ile gizli; orada alt yüzen #sepetBar var).
   ============================================================================ */
.menu-iki{ }                                   /* mobil: blok (taban) */
.menu-govde{ }                                 /* mobil: normal akış */
@media (min-width:1024px){
  .menu-iki{ display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,360px); gap:24px; align-items:start; }   /* v284 fit-motor — sepet kolonu esner (300–360); govde minmax(0,1fr) → grid kolonları ASLA çakışmaz */
  .menu-govde{ min-width:0; overflow-x:clip; overflow-y:visible; }   /* v285 ref-r3 K2 — overflow:hidden govde'yi STICKY SCROLL-CONTAINER yapıyordu → sticky .menu-ust her zaman "govde.top+72" konumuna kayıp (rest'te +72) fırsat kartını/kategoriyi YUKARDAN kesiyordu. overflow-x:clip yatay taşma guard'ını korur AMA scroll-container YARATMAZ → .menu-ust artık viewport'a göre yapışır (rest'te akış konumu, scroll'da nav altı 72px). /* eski: v284 fit-motor — grid child taşmasın (yatay taşma + sepet bindirmesi guard) */
  .menu-yan{ position:sticky; top:84px; align-self:start; }
  .myan-kart{ background:#fff; border:1px solid #EFEBE6; border-radius:20px; padding:18px; box-shadow:0 1px 5px rgba(20,12,10,.07); }
  .myan-bas{ font-family:'Inter',system-ui,sans-serif; font-weight:800; font-size:16px; letter-spacing:-.3px; color:var(--ink-900); margin-bottom:14px; }
  .myan-liste{ display:flex; flex-direction:column; gap:11px; max-height:44vh; overflow:auto; scrollbar-width:thin; }
  .myan-satir{ display:flex; align-items:baseline; gap:8px; font-size:14px; color:#3A3D4A; }
  .myan-adet{ flex:0 0 auto; color:var(--acc-koyu,#C01E18); font-weight:800; }
  .myan-ad{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .myan-fy{ flex:0 0 auto; font-weight:700; color:var(--ink-900); }
  .myan-toplam{ display:flex; justify-content:space-between; align-items:center; font-weight:800; font-size:16px; color:var(--ink-900); margin:16px 0 14px; padding-top:14px; border-top:1px solid #F0ECE6; }
  .myan-git{ width:100%; height:50px; border:none; border-radius:14px; background:var(--acc,#E8312A); color:#fff; font-family:'Inter',system-ui,sans-serif; font-weight:800; font-size:16px; cursor:pointer; transition:filter .14s; }
  .myan-git:hover{ filter:brightness(.95); }
  .myan-bos{ text-align:center; }
  .myan-bos .myan-ik{ display:inline-grid; place-items:center; width:52px; height:52px; border-radius:50%; background:var(--brand-soft,#FDE7E6); color:var(--acc-koyu,#C01E18); margin-bottom:10px; }
  .myan-bos .myan-ik .ico{ width:26px; height:26px; }
  .myan-bos-bas{ font-weight:800; font-size:16px; color:var(--ink-900); }
  .myan-bos-alt{ font-size:14px; color:var(--soluk); margin-top:5px; line-height:1.4; }
  /* bölüm başlığı 24px (Wolt "MEZE" / "En çok sipariş edilen") */
  .menu-govde .kat-bas{ font-size:24px !important; font-weight:800 !important; }
  /* masaüstü menüde alt yüzen sepet barı gereksiz → yan panel var */
  body[data-ekran="menu"] .sepet-bar{ display:none !important; }
  body[data-ekran="menu"] .botnav{ display:block !important; }   /* alt-nav geri görünür (bar gizlenince); v198 — flex'ti: .botnav-ic flex-item olarak içeriğe büzülüp (243px) etiketleri kırpıyor, ortalamayı bozuyordu */
}

/* v168 — bildirim merkezi: hedefi olan bildirim tıklanır (siparişe/dükkana götürür) */
.bm-item.bm-tiklanir{ cursor:pointer; }
.bm-item .bm-ok{ color:#C2C6D2; display:grid; place-items:center; flex:0 0 auto; align-self:center; }
.bm-item .bm-ok .ico{ width:18px; height:18px; }
@media (hover:hover){ .bm-item.bm-tiklanir:hover{ background:#FAF8F5; } }

/* ============================================================================
   v169 — ÜRÜN DETAY MODALI MASAÜSTÜ = WOLT (ortada dialog). Mobil bottom-sheet AYNI.
   Yalnız ürün modalı (.ud-sheet) hedeflenir (:has) → diğer sheet'ler etkilenmez.
   ============================================================================ */
@keyframes udPop{ from{ opacity:0; transform:scale(.965); } to{ opacity:1; transform:scale(1); } }
@media (min-width:1024px){
  .mh-overlay:has(.ud-sheet){ align-items:center; }            /* alttan → ortaya */
  .ud-sheet{ width:540px !important; max-width:540px !important; max-height:86vh !important;
    border-radius:20px !important; box-shadow:0 24px 70px rgba(20,12,10,.42) !important;
    animation:udPop .18s cubic-bezier(.2,.9,.3,1) !important; }
  .ud-sheet .mh-handle{ display:none !important; }             /* sürükle-tutamacı masaüstünde yok */
  /* kapat (X) görselin sağ-üstüne (Wolt) */
  .ud-sheet .ud-head{ position:absolute !important; top:0; left:0; right:0; z-index:6;
    background:transparent !important; padding:12px !important; display:flex; justify-content:flex-end; }
  .ud-sheet .ud-kapat{ background:rgba(255,255,255,.94) !important; color:var(--ink-900) !important;
    box-shadow:0 2px 10px rgba(20,12,10,.22) !important; border:none !important; }
  .ud-foto{ aspect-ratio:16/10 !important; border-radius:20px 20px 0 0 !important; }
  .ud-govde{ padding-left:22px !important; padding-right:22px !important; }
  .ud-altbar{ border-radius:0 0 20px 20px; }
  /* seçenek satırları masaüstünde biraz ferah */
  .ud-opt{ min-height:50px; }
}

/* ============================================================================
   v170 — MEKAN HERO MASAÜSTÜ = WOLT TAM-GENİŞLİK (edge-to-edge). Mobil v161 AYNI.
   Hero 100vw; logo+ad+slogan içerik koluyla hizalı (.m-kapak-ic). İri Ara/Paylaş
   butonları (Wolt'ta yok) masaüstünde gizli; bilgi çipleri Wolt info-line yerine geçer.
   ============================================================================ */
.m-kapak-ic{ display:contents; }   /* mobil: passthrough → logo .m-kapak'a göre (eski davranış) */

@media (min-width:1024px){
  .m-kapak{ width:100vw !important; margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important;
    border-radius:0 !important; height:360px !important; }
  .m-kapak::after{ background:linear-gradient(transparent 28%, rgba(8,5,4,.70)) !important; }
  /* içerik-hizalı sarmal */
  .m-kapak-ic{ display:block !important; position:absolute; inset:0; max-width:1200px; margin:0 auto;
    padding:0 32px; pointer-events:none; z-index:3; box-sizing:border-box; }
  .m-kapak-ic .m-logo{ position:absolute !important; left:32px !important; bottom:32px !important; top:auto !important;
    width:104px !important; height:104px !important; border-radius:22px !important; }
  .m-kapak-ic .m-kapak-bilgi{ left:156px; bottom:46px; }
  .mkb-ad{ font-size:48px !important; }
  .mkb-alt{ font-size:16px !important; }
  /* favori kalp: içerik sağ-üstü */
  .m-kapak .m-kalp-rest{ top:24px !important; bottom:auto !important; left:auto !important;
    right:max(20px, calc((100vw - 1200px)/2 + 32px)) !important; z-index:4; }
  /* iri Ara/Paylaş butonları gizli (Wolt'ta yok; bilgi çipleri info-line görevi görür) */
  .m-rest-aksiyon{ display:none !important; }
}
@media (min-width:1440px){
  .m-kapak-ic{ max-width:1320px; }
  .m-kapak .m-kalp-rest{ right:max(20px, calc((100vw - 1320px)/2 + 32px)) !important; }
}

/* ============================================================================
   v179 — WOLT-GRADE TUTARLILIK (6-ajan denetimi sentezi): tüm müşteri ekranları
   (sepet/ödeme/takip/profil/favoriler/geçmiş) Wolt tasarım sistemine hizalanır.
   Kart köşe 12, buton 20, küçük ikon 8, hero/harita 16; yumuşak 3-kat gölge;
   8-grid boşluk; marka renk-rolleri. Yalnız müşteri; esnaf paneli dokunulmadı.
   ============================================================================ */
/* kart köşe 12 */
.r-dikey, .s-satir, .sepet-nudge, .up-kart, .adres-kayit, .gecmis-kart, .gecmis-aktif{ border-radius:12px !important; }
.s-foto-sar{ border-radius:12px !important; }
/* küçük ikon/iç görsel köşe 8 */
.up-foto, .adres-kayit-sil{ border-radius:8px !important; }
/* buton köşe 20 */
.btn-buyuk, .veri-btn{ border-radius:20px !important; }
/* hero/vurgu/harita köşe 16 */
.takip-harita-sar, .seviye-kart{ border-radius:16px !important; }
/* yumuşak 3-kat gölge */
.s-satir, .ode-ozet, .bt-bolum, .profil-link, .seviye-kart, .tamlik-kart{ box-shadow:var(--wolt-golge) !important; }
/* 8-grid dolgu/boşluk */
.gecmis-kart, .gecmis-aktif{ padding:16px !important; }
.s-satir{ margin-bottom:12px !important; }
/* marka renk-rolü: sepet nudge = soft-tint */
.sepet-nudge{ background:var(--brand-soft,#FDE7E6) !important; border-color:#FBD0CE !important; }
/* pasif çipler: şeffaf zemin + koyu yazı + ince çizgi (sabit gri yerine) */
.pe-cip{ background:transparent !important; color:var(--ink-900) !important; border:1px solid #ECE8E2 !important; }
.pu-cip{ background:var(--yuzey,#FAF8F5) !important; color:var(--ink-900) !important; }
/* bölüm başlığı: düz (gölgesiz) 700 — Wolt */
.bolum-bas h2{ text-shadow:none !important; }

/* ============================================================================
   v192 — STICKY BAR "SIZINTI" DÜZELTMESİ (kullanıcı bulgusu: üstten/yandan sızma).
   Yapışkan üst bar (.wlt-head) ve filtre şeridi (.wlt-fbar) beyaz zemini yalnız
   İÇERİK KOLONU genişliğindeydi → sayfa kaydırılınca kartlar barların YANINDAKİ
   boşluklardan (mobil 16px, masaüstü 72-126px) akarak görünüyordu; filtre hapları
   da kolon kenarında havada kesiliyordu. Çözüm: barlar full-bleed — negatif yan
   margin ile viewport'a taşar, eş padding ile içerik hizası korunur.
   (html{overflow-x:hidden} mevcut → 100vw scrollbar taşması güvenli.)
   ============================================================================ */
.wlt-head{
  margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important;
  padding-left:calc(50vw - 50%) !important; padding-right:calc(50vw - 50%) !important;
}
.wlt-fbar{
  margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important;
  padding-left:calc(50vw - 50%) !important; padding-right:calc(50vw - 50%) !important;
}
/* barlar arasında margin kaynaklı şeffaf çatlak kalmasın: fbar üst kenarını başlığa bitiştir */
.wlt-fbar{ margin-top:0 !important; padding-top:12px !important; }

/* ============================================================================
   v193 — BOTNAV KANONİK (Wolt ölçüleri) — eski 8 katman override'ın hepsini ezer
   (dosya SONUNDA + !important: pill/cam/terra kalıntıları etkisiz). Nav artık
   index.html'de kalıcı; içerik botNavGuncelle() ile dolar. 4 sekme + rozetler.
   ============================================================================ */
.botnav{ position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; top:auto !important;
  z-index:40 !important; height:var(--botnav-h) !important; padding:0 0 env(safe-area-inset-bottom) !important; margin:0 !important;
  background:#FFFFFF !important; border:none !important; border-top:1px solid #EDEAE4 !important; border-radius:0 !important;
  box-shadow:0 -2px 12px rgba(40,24,12,.05) !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  display:block !important; }
.botnav.gizli{ display:none !important; }
.botnav-ic{ max-width:680px; margin:0 auto !important; height:56px !important; padding:0 !important;
  display:flex !important; align-items:stretch !important; background:none !important; border:none !important; box-shadow:none !important; border-radius:0 !important; }
.botnav-ic button{ flex:1 1 0 !important; min-width:0 !important; width:auto !important; display:flex !important; flex-direction:column !important;
  align-items:center !important; justify-content:center !important; gap:3px !important; padding:6px 2px !important; margin:0 !important;
  background:none !important; border:none !important; border-radius:0 !important; box-shadow:none !important;
  color:#6B7079 !important; transition:color .15s !important; cursor:pointer; }
.botnav-ic button::after, .botnav-ic button::before{ content:none !important; }
.botnav-ic button:active{ transform:scale(.94); }
.bn-ik{ position:relative; display:grid; place-items:center; width:26px; height:26px; }
.bn-ik svg{ width:24px !important; height:24px !important; fill:currentColor; }
.bn-et{ font-size:11px !important; font-weight:600 !important; letter-spacing:.1px; line-height:1 !important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.botnav-ic button.aktif{ color:var(--acc,#E8312A) !important; background:none !important; }
.botnav-ic button.aktif .bn-et{ color:var(--acc-koyu,#C01E18); }
.bn-rozet{ position:absolute; top:-4px; right:-8px; min-width:16px; height:16px; padding:0 4px;
  border-radius:8px; background:var(--cta-fill); color:#FFF; font-size:10px; font-weight:800;
  line-height:16px; text-align:center; box-shadow:0 0 0 2px #FFF; }
.bn-nokta{ position:absolute; top:-2px; right:-2px; width:8px; height:8px; border-radius:50%;
  background:var(--acc,#E8312A); box-shadow:0 0 0 2px #FFF; }
/* sepet barı navigasyonu ÖLDÜRMEZ: nav görünür ekranlarda navın üstünde yüzer */
.sepet-bar--nav-ustu{ bottom:calc(var(--botnav-h) + 8px) !important; }
/* içerik nav altında kalmasın */
.sar{ padding-bottom:calc(var(--botnav-h) + 18px) !important; }
body.sepet-acik .sar{ padding-bottom:calc(var(--botnav-h) + 92px) !important; }

/* ============================================================================
   v193 — PROFİL YENİDEN (Wolt/Getir profil deseni)
   ============================================================================ */
.profil-giris-cta{ margin-top:14px; width:100%; }
.profil-giris-not{ color:var(--soluk,#7A5347); font-size:14px; margin:8px 4px 0; text-align:center; }
/* kompakt puan banner'ı */
.puan-banner{ position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px;
  width:100%; text-align:left; margin:16px 0 0; padding:14px 16px; border-radius:16px; border:1px solid rgba(232,49,42,.18);
  background:linear-gradient(135deg, rgba(232,49,42,.10), rgba(232,49,42,.04)); font:inherit; }
button.puan-banner{ cursor:pointer; }
.puan-banner .pk-etik{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:800;
  letter-spacing:.4px; text-transform:uppercase; color:var(--acc-koyu,#C01E18); }
.puan-banner .pk-etik svg{ width:15px; height:15px; }
.puan-banner--anon .pb-cta{ flex-basis:100%; display:flex; align-items:center; gap:4px;
  font-size:15px; font-weight:700; color:var(--metin,#241712); }
.puan-banner--anon .pb-cta svg{ width:14px; height:14px; color:var(--acc,#E8312A); }
.pb-sag{ margin-left:auto; font-size:21px; font-weight:800; color:var(--metin,#241712); }
.pb-sag .pk-birim{ font-size:13px; font-weight:600; color:var(--soluk,#7A5347); }
.puan-banner .pk-tl{ flex-basis:100%; font-size:13px; color:var(--soluk,#7A5347); }
.puan-banner .pk-gecmis-btn{ position:absolute; top:10px; right:10px; }
.pk-yukleniyor{ animation:pkPulse 1.1s ease-in-out infinite; }
@keyframes pkPulse{ 50%{ opacity:.35; } }
/* kompakt seviye satırı (yalnız >=1 siparişte) */
.seviye-satir{ display:flex; align-items:center; gap:6px; margin:10px 4px 0; font-size:13px; color:var(--soluk,#7A5347); }
.seviye-satir svg{ width:15px; height:15px; color:var(--amber,#FFC850); fill:var(--amber,#FFC850); }
/* kısayol grubu: satırları tek karta topla */
.profil-grup{ margin-top:16px; border-radius:16px; overflow:hidden; border:1px solid var(--cizgi2,#ECE8E2); box-shadow:var(--sh1); background:#fff; }
.profil-grup .profil-link{ border:none !important; border-radius:0 !important; box-shadow:none !important; margin:0 !important; width:100%; border-bottom:1px solid #F0EDE8 !important; }
.profil-grup .profil-link:last-of-type{ border-bottom:none !important; }
.profil-grup .profil-link.pl-acik .pl-ok{ transform:rotate(90deg); }
.pl-ok{ transition:transform .18s; }
.pl-alt{ background:#FBFAF8; border-bottom:1px solid #F0EDE8; padding:10px 14px; }
.pl-alt.gizli{ display:none; }
.pl-alt .davet-kart{ margin:0; box-shadow:none; border:none; background:transparent; padding:4px 0 8px; }
.pl-alt-bos{ color:var(--soluk,#7A5347); font-size:14px; padding:8px 2px; line-height:1.5; }
/* Bilgilerim: tamlık başlıkta */
.bolum-bas--tamlik{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.bolum-bas--tamlik .bb-tam{ font-size:15px; font-weight:800; color:var(--brand-700); display:inline-flex; align-items:center; gap:4px; }
.bolum-bas--tamlik .bb-tam.tam{ color:var(--yesil,#15B36B); }
.bolum-bas--tamlik .bb-tam svg{ width:15px; height:15px; }
.bb-bar{ height:6px; border-radius:999px; background:#EDEDED; overflow:hidden; margin:2px 2px 6px; }
.bb-bar i{ display:block; height:100%; background:linear-gradient(90deg,var(--acc,#E8312A),var(--acc-koyu,#C01E18)); transition:width .6s cubic-bezier(.22,.61,.36,1); }
.bb-not{ color:var(--soluk,#7A5347); font-size:14px; margin:0 4px 10px; }
/* mahalle satırı: buton, input görünümünde */
.p-mahalle{ display:flex; align-items:center; justify-content:space-between; gap:8px; text-align:left; cursor:pointer; font:inherit; }
.p-mahalle svg{ width:14px; height:14px; color:var(--soluk,#7A5347); flex:0 0 auto; }
.p-mahalle-bos{ color:var(--soluk); }
/* doğum günü satırı — taşma düzeltmesi */
.dg-satir{ display:flex; align-items:center; gap:12px; padding:12px 14px; }
.dg-lbl{ flex:1; min-width:0; font-size:15px; font-weight:600; }
.dg-lbl small{ display:block; font-weight:500; color:var(--soluk,#7A5347); font-size:13px; margin-top:2px; }
.dg-satir input{ flex:0 0 92px; text-align:center; padding:10px; border:1px solid var(--cizgi2,#ECE8E2); border-radius:10px; font:inherit; }
/* veri butonları alt alta (iki satıra kırılma biter) */
.veri-bolum{ display:flex; flex-direction:column; gap:10px; padding:14px; }
.veri-bolum .veri-btn{ width:100%; }
.veri-sil{ color:var(--kirmizi,#D32F2F) !important; border-color:rgba(232,49,42,.3) !important; }
.kvkk-not{ color:var(--soluk,#7A5347); font-size:14px; margin:8px 4px; line-height:1.5; }
/* çıkış: listenin dibinde soluk satır (Wolt) */
.profil-cikis{ display:block; width:100%; margin:18px 0 2px; padding:13px; background:none; border:none;
  color:var(--kirmizi,#D32F2F); font-size:15px; font-weight:700; cursor:pointer; font-family:inherit; }
.profil-dip{ color:var(--ak-soluk,rgba(255,255,255,.86)); font-size:14px; margin:10px 4px 14px; text-align:center; line-height:1.5; }

/* ============================================================================
   v194 — YEMEKSEPETİ'NDEN 5 ÖZELLİK (yalnız YENİ sınıflar — üstteki v192 full-bleed
   ve v193 botnav kanonik bloklarını EZMEZ): yoğun rozeti, son-X-adet rozeti,
   "Her zamanki" tek-tık kartı, Yardım & SSS ekranı, platform duyuru banner'ı.
   ============================================================================ */
/* 1) Yoğun rozeti — turuncu hap (liste kartı meta satırı + venue bilgi satırı) */
.yogun-rozet{ display:inline-flex; align-items:center; padding:1px 8px; border-radius:999px;
  background:rgba(232,134,26,.14); color:#E8861A; font-size:11px; font-weight:800;
  letter-spacing:.2px; white-space:nowrap; vertical-align:middle; }
.wf-meta .yogun-rozet{ margin-left:6px; }
.r-rozetler .yogun-rozet{ align-self:center; }

/* 2) "Son X adet!" — kırmızı küçük kıtlık rozeti (menü kartı + ürün detay modalı) */
.stok-rozet{ display:inline-block; margin-top:5px; padding:2px 8px; border-radius:999px;
  background:rgba(211,47,47,.10); color:var(--kirmizi,#D32F2F); font-size:11px; font-weight:800;
  letter-spacing:.2px; white-space:nowrap; }
.ud-govde .stok-rozet{ margin-top:10px; font-size:13px; }

/* 3) "Her zamanki" tek-tık kartı — mh-uyari/gecmis-aktif satır deseni (cam + sol aksan) */
.hz-kart{ position:relative; overflow:hidden; display:flex; align-items:center; gap:12px;
  width:100%; text-align:left; margin:0 0 14px; padding:13px 14px; border-radius:var(--r-lg,16px);
  background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); box-shadow:var(--sh1); color:var(--metin); font:inherit; cursor:pointer;
  transition:transform .16s cubic-bezier(.34,1.3,.5,1), box-shadow .16s; }
.hz-kart::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:linear-gradient(180deg, var(--amber,#FFC850), var(--acc,#E8312A)); }
.hz-kart:active{ transform:scale(.99); }
@media (hover:hover){ .hz-kart:hover{ transform:translateY(-1px); box-shadow:var(--sh2); } }
.hz-kart.gizli{ display:none; }
.hz-ik{ font-size:20px; flex:0 0 auto; filter:drop-shadow(0 1px 4px rgba(255,200,80,.5)); }
.hz-ic{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.hz-bas{ font-weight:800; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hz-alt{ color:var(--soluk,#7A5347); font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hz-btn{ flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; padding:8px 13px; border-radius:999px;
  background:var(--acc,#E8312A); color:#FFF; font-size:13px; font-weight:800; white-space:nowrap;
  box-shadow:0 2px 8px rgba(232,49,42,.3); }
.hz-btn svg, .hz-btn .ico{ width:14px; height:14px; stroke:#FFF; }

/* 4) Yardım & SSS — details listesi (cs-panel cam deseni) */
.sss-liste{ margin-top:14px; display:flex; flex-direction:column; gap:10px; }
.sss-madde{ background:var(--cam-yogun); backdrop-filter:var(--cam-blur); -webkit-backdrop-filter:var(--cam-blur);
  border:1px solid var(--cam-kenar2); border-radius:var(--r-md,14px); box-shadow:var(--sh1); color:var(--metin); overflow:hidden; }
.sss-soru{ display:flex; align-items:center; gap:8px; padding:14px 16px; font-weight:800; font-size:15px;
  cursor:pointer; list-style:none; }
.sss-soru::-webkit-details-marker{ display:none; }
.sss-chev{ margin-left:auto; transition:transform .2s; display:inline-flex; }
.sss-chev svg, .sss-chev .ico{ width:16px; height:16px; transform:rotate(90deg); }
.sss-madde[open] .sss-chev{ transform:rotate(180deg); }
.sss-cevap{ padding:0 16px 14px; font-size:15px; line-height:1.55; color:var(--soluk,#7A5347); }

/* 5) Platform duyurusu — kapatılabilir ince banner (header altı) */
.duyuru-banner{ display:flex; align-items:flex-start; gap:9px; margin:10px 0 12px; padding:11px 12px;
  border-radius:var(--r-md,14px); background:rgba(232,49,42,.07); border:1px solid rgba(232,49,42,.18);
  color:var(--metin); font-size:13px; line-height:1.45; }
.duyuru-ik{ flex:0 0 auto; font-size:15px; }
.duyuru-ic{ flex:1; min-width:0; }
.duyuru-ic b{ font-weight:800; }
.duyuru-kapat{ flex:0 0 auto; display:grid; place-items:center; width:26px; height:26px; margin:-3px -3px 0 0;
  padding:0; border:none; border-radius:50%; background:none; color:var(--soluk,#7A5347); cursor:pointer; }
.duyuru-kapat svg, .duyuru-kapat .ico{ width:14px; height:14px; }
.duyuru-kapat:active{ background:rgba(0,0,0,.06); }

/* ============================================================================
   v195 — MOBİL "ÜSTTEN SIZINTI" KESİN KAPAĞI (kullanıcı gerçek cihazda yakaladı):
   bazı Android Chrome sürümlerinde negatif-margin'li sticky, viewport tepesine
   tam oturmayıp üstünde açık bölge bırakabiliyor → kartlar oradan görünüyordu.
   Çözüm: başlık NEREYE pinlenirse pinlensin üstünü örten beyaz kapak (::before,
   yukarı doğru 40vh). Doğru pinlenen cihazlarda kapak ekran dışında, zararsız.
   ============================================================================ */
.wlt-head::before{
  content:''; position:absolute; pointer-events:none;
  left:calc(50% - 50vw); right:calc(50% - 50vw);
  bottom:100%; height:40vh; background:#FFFFFF;
}

/* v195 — UI robotu bulguları (3 kök neden, tek satırlık düzeltmeler): */
/* 1) "Yoğun · +X dk" rozeti uzun teslimat metninin arkasında kırpılıp KAYBOLUYORDU → başa al */
.wf-meta .yogun-rozet{ order:-1; flex:none; }
/* 2) .wf-meta harf ortasından sert kesiliyordu (flex'te ellipsis çalışmaz) → sağda yumuşak solma */
.wf-meta{ -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent); }
/* 3) masaüstünde huni CTA'ları (Siparişi Ver / Yeni Sipariş / Giriş) ortalanmış kolonun soluna kayıyordu:
      inline-block butonda margin-inline:auto çalışmaz → block yap */
@media (min-width:1024px){
  body[data-ekran] #ekran > .btn-buyuk{ display:block; }
}

/* ============ v196 — KANONİK MARKA (tüm eski re-tema bloklarını kaskadla ezer) ============ */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
    
    
     
     
   
    
                 /* tek sarı */
  
}

/* ============ v196 — PREMIUM MİKRO-DETAYLAR (konsey Bölüm 3; mevcut kurallar silinmedi) ============ */
/* 1) Menü/mekan iskeleti — shimmer (iskeletListe .shim'leri de aynı dili alır) */
.shim{position:relative;overflow:hidden;background:#E9E5E1;border-radius:12px} /* v232 K5 — #F0EAE8→#E9E5E1: beyaz kart üstünde görünür jel-gri */
.shim::after{content:'';position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);animation:shimKay 1.2s infinite} /* v232 K5 — parıltı .6→.85 (net hareket) */
@keyframes shimKay{to{transform:translateX(100%)}}

/* 2) Birleşik "basınç" dili — dokunma geribildirimi tek eğri/ölçekte */
.ekle,.btn-buyuk,.sepet-btn,.chip,.hz-kart,.wf-kart,.odeme-opt,.r-kart,.botnav-ic button{
  transition:transform .12s cubic-bezier(.34,1.4,.64,1), box-shadow .15s, filter .15s; }
.ekle:active,.btn-buyuk:active,.sepet-btn:active,.chip:active,.hz-kart:active,.wf-kart:active,.r-kart:active{ transform:scale(.965); }

/* 3) Yön-duyarlı ekran geçişi — geri = soldan hafif dönüş (ileri mevcut ekranGir) */
@keyframes ekranGeri{ from{opacity:.35;transform:translateX(-10px)} to{opacity:1;transform:none} }
.sar.ekran-geri{ animation:ekranGeri .22s cubic-bezier(.22,.61,.36,1); }
@media (prefers-reduced-motion:reduce){ .sar.ekran-geri{ animation:none } }

/* 4) Toast tür ikonu — başarı/hata renk-kodlu mikro-ikon */
.toast{ display:flex; align-items:center; gap:9px; }
.toast .ico{ width:17px; height:17px; flex:0 0 auto; }
.toast.t-ok .ico{ color:#4ADE80 } .toast.t-hata .ico{ color:#FCA5A5 }

/* 5) Fiyat tipografisi — zıplamayan rakamlar (tabular-nums) */
.m-fiyat,.s-fiyat,.wl-enc-fiyat,.ud-ekle-fiyat,.oz-fi,.oz-top,.eta-buyuk,.sepet-btn b,.wf-meta{ font-variant-numeric:tabular-nums; }
.m-fiyat .tl,.s-fiyat .tl{ font-size:.8em; font-weight:600; opacity:.8; margin-left:1px; }

/* 6) Boş-durum grameri — tintli daire zemin + CTA (emoji tek kurala indirildi → v232, bkz. dosya-sonu) */
.bos-cta{ margin-top:14px; display:inline-flex; align-items:center; gap:6px; padding:11px 20px;
  border-radius:999px; background:var(--acc); color:#fff; font-weight:800; font-size:15px; }

/* 7) Botnav sepet rozeti pop — mevcut .adet-bal.artti deseninin nav karşılığı */
@keyframes rozetPop{ 0%{transform:scale(1)} 45%{transform:scale(1.28)} 100%{transform:scale(1)} }
.botnav .bn-rozet.pop{ animation:rozetPop .3s cubic-bezier(.34,1.56,.64,1); }

/* 8) Görsel fade-in — lazy img yüklenince yumuşak beliriş (JS .yuklendi ekler) */
img[loading="lazy"]{ opacity:0; transition:opacity .25s ease-out; }
img[loading="lazy"].yuklendi{ opacity:1; }

/* 9) Sticky başlık scroll gölgesi — yalnız solid/normal hallerde; venue şeffaf başlıkta gölge YOK */
.ust{ transition:box-shadow .2s; }
.ust.kaydi{ box-shadow:0 1px 0 rgba(0,0,0,.06), 0 6px 16px rgba(0,0,0,.08); }
body[data-ekran="menu"] .ust.kaydi:not(.ust-solid){ box-shadow:none; }

/* 10) "Sipariş Ver" yükleniyor→onay morph'u */
.btn-buyuk.yolluyor{ pointer-events:none; filter:saturate(.85); }
.btn-buyuk .spin{ width:18px;height:18px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;display:inline-block;vertical-align:-4px;margin-right:8px;animation:dn .7s linear infinite }
@keyframes dn{to{transform:rotate(360deg)}}
.btn-buyuk.tamam{ background:var(--yesil,#15B36B) !important; transition:background .25s; }

/* v196 — SVG'ye dönen emoji noktalarının ikon boyutları (1C) */
.hz-ik .ico{ width:20px; height:20px; }
.duyuru-ik .ico{ width:18px; height:18px; }
.sn-txt .ico{ width:16px; height:16px; vertical-align:-3px; }
.btn-buyuk.tamam .ico{ width:18px; height:18px; vertical-align:-3px; margin-right:6px; }

/* ============ v197 — açık denetim bulguları (yalnız YENİ sınıflar; v192/93/95/96 kanonik blokları EZMEZ) ============ */
/* PWA "ana ekrana ekle" nudge'ı — takip ekranında ince banner */
.pwa-nudge{ display:flex; align-items:center; gap:10px; margin:14px 0 2px; padding:11px 12px;
  background:var(--acc-soft,#FCE9E8); border:1px solid rgba(232,49,42,.16); border-radius:12px;
  font-size:13px; line-height:1.35; text-align:left; }
.pwa-nudge .pwa-ik{ flex:0 0 auto; display:grid; place-items:center; }
.pwa-nudge .pwa-ik .ico{ width:18px; height:18px; color:var(--acc); }
.pwa-nudge .pwa-ic{ flex:1; min-width:0; color:var(--metin,#1C1C1E); }
.pwa-nudge .pwa-ekle{ flex:0 0 auto; padding:8px 16px; border-radius:999px; background:var(--acc);
  color:#fff; font-weight:800; font-size:13px; }
.pwa-nudge .pwa-ekle:active{ transform:scale(.96); }
.pwa-nudge .pwa-kapat{ flex:0 0 auto; width:30px; height:30px; display:grid; place-items:center;
  color:var(--soluk); border-radius:50%; }
.pwa-nudge .pwa-kapat .ico{ width:13px; height:13px; }
/* Kapalı dükkan kartında açılış zamanı — wf-meta içinde vurgulu kısa metin */
.wf-acilis{ color:var(--brand-700); font-weight:700; white-space:nowrap; }
.wf-kapali .wf-acilis{ opacity:1; }

/* ============================================================================
   v198 — UI TARAMA DÜZELTMELERİ (6-ajan denetim bulguları; dosya SONU = en yüksek
   öncelik). Üstteki v192/v193/v195/v196/v197 kanonik bloklar EZİLMEDİ — buradaki
   kurallar yalnız bulgu noktalarını hedefler.
   ============================================================================ */

/* (A2#1 KRİTİK) Sepet "Devam Et" CTA barı botnav'ın ARKASINDAydı (cta z:30 < nav z:40,
   bottom:0 çakışık) → tıklama nav'a yutuluyor, ödemeye geçilemiyordu. Bar navın ÜSTÜNE
   kalkar (.sepet-bar--nav-ustu deseni), nav görünür kalır (sekme kaybolmaz). */
body[data-ekran="sepet"] .sepet-cta-bar{ bottom:var(--botnav-h) !important; }
/* içerik alt boşluğu iki barın toplamını karşılasın (bar nudge'larla ~200px'e büyüyebilir) */
body[data-ekran="sepet"] .sar{ padding-bottom:calc(var(--botnav-h) + 210px) !important; }

/* (A1#1 + A3#13 KRİTİK) Kampanya rozeti restoran adını 1-8 karaktere eziyordu:
   rozet artık küçülebilir (maks. %48) ve kendi içinde ellipsis'lenir; ada ≥9ch garanti. */
.wf-indirim{ flex:0 1 auto; min-width:0; max-width:48%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wf-ad .wf-ad-txt{ min-width:9ch; }

/* (A3#2 KRİTİK) Profildeki "Bildirimler" satırı (#bildirimBtn) sayıyı .pl-say ile gösterir;
   bildirimBadgeGuncelle'nin eklediği mutlak-konumlu .bildirim-badge satırda ÇİFT rozet olmasın. */
.profil-link .bildirim-badge{ display:none; }

/* (A1#4 ORTA) Venue dokunma hedefleri: favori kalbi 30→40px (ikon aynı, merkezli);
   .ekle/.wl-enc-ekle/.mri-detay ::after isabet telafileri v190'dan beri VAR (inset:-6 / -12 -8).
   Kategori çipleri ≥40px; kategori "Temizle" butonuna isabet telafisi. */
.m-kalp{ width:40px; height:40px; }
.menu-kat-cip{ min-height:44px; }
#katTemizleBtn{ position:relative; }
#katTemizleBtn::after{ content:''; position:absolute; inset:-11px -8px; }

/* (A2#2 KRİTİK-yakını) Sepette ürün adı 60px'e eziliyordu ("Ada…"): dar ekranda ad+fiyat
   foto yanında TAM genişlik alır, stepper+çöp ikinci sıraya sarar (.s-satir flex-wrap zaten var). */
@media (max-width:520px){
  /* v220 (madde 4 / K18): eski min-width:calc(100%-68px) foto(gerçekte 62px)+taban toplamı satırı aşınca
     ad bloğunu fotoğrafın ALTINA sarıyordu (kart 3 kat). Çözüm: flex-grow:1 (kalan alanı doldur) +
     flex-shrink:0 (stepper'ı 1. satıra çekecek kadar KÜÇÜLME → temiz 2 satır garantisi) + basis 100%-74. */
  /* v231 (P0 sepet-K1) — eski flex:1 0 calc(100%-74px) (shrink:0 + basis~%100) stepper+çöp'ü
     ZORLA 2. satıra sarıyordu → her kalem 156-196px (endüstri ~76px). flex:1 1 auto ile foto+içerik
     +stepper+çöp TEK satır; yalnız .s-not kendi flex-basis:100% ile alta düşer. Satır ~yarıya iner. */
  /* flex-basis:0 → s-orta'nın hipotetik boyutu 0; foto+stepper+çöp ÖNCE tek satıra yerleşir,
     sonra kalan alan s-orta'ya büyür (basis:auto iken içerik boyutu satırı taşırıp çöpü 2. satıra atıyordu). */
  .s-satir .s-orta{ flex:1 1 0; min-width:0; }
  .s-satir .s-ad{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .s-satir .adet{ margin-left:auto; }   /* stepper+çöp sağa yaslı */
  /* kompakt: foto+içerik+stepper+çöp 360-412px'e sığsın (çöp 2. satıra kaçmasın) */
  .s-satir{ gap:9px; }
  .s-satir .s-foto-sar{ width:52px; height:52px; }
  .s-satir .adet{ padding:2px; gap:4px; }
  .s-satir .adet button{ width:32px; height:32px; }
  .s-satir .s-sil{ width:44px; height:44px; }   /* v236 iOS-fix (Küme D): yıkıcı-eylem hedefi ≥44px (ikon 17px görsel kalır) */
  .s-satir .s-sil svg{ width:17px; height:17px; }
}
.s-satir .s-fiyat{ white-space:nowrap; }   /* "585,5 ₺" iki satıra bölünmesin */

/* (A2#5 ORTA) Sepet adet +/− 34px görsel kalır, isabet alanı ::after ile ≥44px */
.s-satir .adet button{ position:relative; }
.s-satir .adet button::after{ content:''; position:absolute; inset:-5px; }

/* (A2#3 ORTA) "Bu adresi kaydet" checkbox'ı 0×0 görünmezdi (.os-ic input appearance:none) →
   native çizim + marka accent geri (yalnız bu checkbox; global os-ic kuralı bozulmaz) */
.adres-kaydet input[type="checkbox"]{ -webkit-appearance:auto; appearance:auto; width:18px; height:18px;
  accent-color:var(--acc,#E8312A); flex:0 0 auto; margin:0; }

/* (A2#4 ORTA) 360'ta ücretsiz-teslimat nudge metni flex kolonlarına parçalanıyordu → doğal akış */
.sepet-nudge .sn-txt{ display:inline; }

/* (A2#8 KÜÇÜK) Ödeme adres textarea'sı 2 satırda kırpılıyordu → 3+ satır görünür */
.os-ic #f_adres{ min-height:72px; }

/* (A3#4 ORTA) Uzun toast dar dikey "balon"a dönüşüyordu (shrink-to-fit yarı-viewport) */
.toast{ width:max-content; max-width:min(90vw,420px); }

/* (A3#3 ORTA) Puan kartındaki saat (geçmiş) butonu "1.250 puan" metnine biniyordu */
.puan-banner{ padding-right:58px; }

/* (A3#5 ORTA) Tıklanır bildirim satırında chevron 2. satıra düşüyordu (3 kolonluk grid'e 4 çocuk) */
.bm-item.bm-tiklanir{ grid-template-columns:40px 1fr auto auto; }

/* (A3#6 ORTA) 360'ta Bilgilerim inputları satırdan 24px taşıyordu (input min-content'i) */
.p-alan .p-inp{ min-width:0; flex:1 1 auto; max-width:100%; }

/* (A1#5 KÜÇÜK) 360'ta ürün modal CTA'sı ("Siparişe ekle · 260 ₺") iki satıra sarıyordu */
.ud-ekle > span{ white-space:nowrap; }
@media (max-width:374px){ .ud-ekle{ font-size:15px; padding:0 12px; gap:6px; } }

/* (A1#7 KÜÇÜK) Glass başlık blur fallback'i: backdrop-filter yoksa solid beyaz (içerik sızmaz) */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body[data-ekran="menu"] .ust.ust-solid{ background:#fff; }
}

/* (A2#6 / A3#7 / A3#8 / A3#9 KÜÇÜK) dokunma hedefleri + puan geçmişi aralığı */
.btn-tekrar{ min-height:40px; }          /* "Tekrar Söyle" 34→40 */
.dv-kopya{ min-height:44px; }            /* Davet "Kopyala" ana eylem ≥44 */
.duyuru-kapat{ position:relative; }      /* × görsel 26px kalır, isabet ≥40 */
.duyuru-kapat::after{ content:''; position:absolute; inset:-8px; }
.pk-h{ gap:10px; }                       /* "Davet bonusu+100" yapışması */

/* (A6#4 KÜÇÜK) PC'de .wf-urun ürün kartlarına hover geri bildirimi (v190 hover diline uygun) */
@media (hover:hover){ .wf-urun:hover{ filter:brightness(.96); } }

/* ===== v203 dokunma hedefi ===== */
/* Robot ORTA/KÜÇÜK bulguları: görsel boyut KORUNUR, isabet alanı ::after ile ≥44px.
   NOT: .mri-detay (::after inset:-12px -8px, satır ~1060), favori kalpleri (.r-kalp/.m-kalp ::before)
   ve sepet .adet button (::after inset:-5px, satır ~4073) ZATEN ≥44 isabet aldı → burada TEKRAR eklenmez. */
/* venue işletme adres linki (a ~24px) → dikey isabet ~46px (metin/ikon boyutu değişmez) */
.m-rest .m-rest-adres a{ position:relative; }
.m-rest .m-rest-adres a::after{ content:''; position:absolute; inset:-11px -6px; }
/* sepet "Boşalt" (#sepetBosaltBtn ~17px) → isabet ~45px */
.sepet-bosalt{ position:relative; }
.sepet-bosalt::after{ content:''; position:absolute; inset:-14px -8px; }
/* sepet "Ürünü sil" (.s-sil 36-42px) → isabet ≥46px (ikon/kutu görünümü değişmez) */
.s-sil{ position:relative; }
.s-sil::after{ content:''; position:absolute; inset:-5px; }

/* ===== v203-cihaz (gerçek-cihaz bulguları) ===== */

/* B04 — "Adresini seç" nudge kartı DÜZENİ: base .mh-uyari layout tanımlamıyordu (b/small satır-içi
   akıyor, yazı üst üste biniyordu). flex + dikey yazı bloğu + ikon hizası + okunur satır yüksekliği.
   (Kanonik cam/aksan bloğunu EZMEZ — yalnız eksik yerleşim kurallarını ekler.) */
.mh-uyari{
  display:flex; align-items:center; gap:12px; width:100%;
  padding:14px 16px; border-radius:var(--r-lg); min-height:66px;
  text-align:left; margin-bottom:14px; box-sizing:border-box;
}
.mh-uyari > .mhu-ik{ flex:0 0 auto; display:grid; place-items:center; }
.mh-uyari > .mhu-yazi{ display:flex; flex-direction:column; flex:1 1 auto; min-width:0; gap:3px; }
.mh-uyari .mhu-yazi b{ font-size:15px; font-weight:800; color:var(--metin); line-height:1.25; letter-spacing:-.1px; }
.mh-uyari .mhu-yazi small{ font-size:13px; font-weight:500; color:var(--soluk); line-height:1.35; }
.mh-uyari > .mhu-ok{ flex:0 0 auto; display:grid; place-items:center; color:var(--soluk2); align-self:center; }

/* B03 — Konum/mahalle seçici sheet klavye-uyumlu: 100dvh (dinamik viewport) → klavye açılınca
   sheet kırpılmaz/yükseğe kaçmaz. visualViewport destekleyen cihazda JS ayrıca sheet'i klavyenin
   üstüne kaldırır; desteklemeyende dvh clamp'i güvenli düşüş sağlar. Başlık üstten kırpılmasın. */
.mh-sheet{ max-height:min(88dvh, 88vh); }
.mh-results{ height:clamp(200px, 42dvh, 420px); }
@supports (height: 100dvh){
  .mh-sheet{ max-height:88dvh; }
}

/* ===================================================================
   BATCH 1 — KANONİK TASARIM TOKEN SİSTEMİ (tek kaynak).
   Üstteki 20 dağınık :root bloğu temizlendi; tüm token değerleri buraya toplandı
   (efektif kazanan değerler — getComputedStyle ile birebir doğrulandı). Yeni token
   EKLEMEDEN bu değerleri değiştirme; yeni :root bloğu AÇMA.
   =================================================================== */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  /* --- mevcut token evreni (113, efektif değer) --- */
  --cam: #FFFFFF;
  --cam-duz: #FFFFFF;
  --cam-kenar: #ECE3D3;
  --cam-yogun: #FFFFFF;
  --cam-yogun-duz: #FFFFFF;
  --cam-kenar2: #F0E7E4;
  --cam-blur: saturate(120%) blur(20px);
  --bg: #FFFFFF;
  --kart: #FFFFFF;
  --kart2: #FFFFFF;
  --kart3: #FBF4F2;
  --cizgi: #ECE3D3;
  --cizgi2: #F0E7E4;
  --metin: #1C1A1A;
  --soluk: #6B6360;
  --soluk2: #7A726E;
  --ak: #1C1916;
  --ak-soluk: #7A7268;
  --acc: #E8312A;
  --acc-koyu: #C01E18;
  --acc2: #C01E18;
  --acc-100: rgba(232,49,42,.12);
  --secondary: #1C1916;
  --yesil: #5C6B38;
  --yesil-bg: rgba(92,107,56,.14);
  --mavi: #3B82F6;
  --amber: #F0A500;
  --kirmizi: #C0492F;
  --kirmizi-bg: rgba(192,73,47,.12);
  --sh1: 0 1px 2px rgba(28,26,26,.05), 0 4px 12px rgba(232,49,42,.05);
  --sh2: 0 4px 10px rgba(28,26,26,.07), 0 10px 24px rgba(232,49,42,.08);
  --sh3: 0 8px 20px rgba(28,26,26,.10), 0 18px 40px rgba(232,49,42,.10);
  --sh-cta: 0 8px 22px rgba(232,49,42,.30);
  --golge: 0 8px 24px rgba(28,25,22,.08);
  --r-xs: 10px;
  --r-sm: 12px;
  --r-md: 18px;
  --r-lg: 22px;
  --r-pill: 999px;
  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs-md: 13px;
  --fs-base: 15px;
  --fs-lg: 17px;
  --fs-xl: 20px;
  --glass: rgba(247,248,250,.78);
  --acc-soft: #FCE9E8;
  --acc-ink: #B4231F;
  --star: #DE9B53;
  --ease-soft: cubic-bezier(.25,.8,.25,1);
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --yuzey: #FFFFFF;
  --metin2: #7A7268;
  --ana: #E8312A;
  --ikincil: #E8312A;
  --sicak: #E8312A;
  --altin: #D9A441;
  --kat-hepsi: #6B5A4F;
  --kat-burger: #C54734;
  --kat-pizza: #EB1700;
  --kat-doner: #FB8C2A;
  --kat-tatli: #E0A33C;
  --kat-kahvalti: #27B765;
  --ez: cubic-bezier(.2,.8,.2,1);
  --t-bas: 120ms;
  --t-temel: 200ms;
  --t-yumusak: 240ms;
  --golge-yumusak: 0 12px 32px rgba(28,25,22,.14);
  --paper: #FFFFFF;
  --card: #FFFFFF;
  --hairline: #ECE3D3;
  --ink: #1C1A1A;
  --muted: #7C6F60;
  --faint: #7A6E5E;
  --walnut: #E8312A;
  --walnut-press: #C01E18;
  --accent: #E8312A;
  --accent-press: #C01E18;
  --accent-ink: #B4231F;
  --accent-tint: #FCE9E8;
  --gold: #DE9B53;
  --scrim: rgba(28,25,22,.72);
  --display: "Fraunces","Georgia",serif;
  --body: "Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ease: cubic-bezier(.2,.8,.2,1);
  --t-press: 120ms;
  --terra: #E8312A;
  --terra-press: #C01E18;
  --terra-tint: #FCE9E8;
  --terra-ink: #B4231F;
  --olive: #5C6B38;
  --olive-press: #4C5A2E;
  --olive-bg: rgba(92,107,56,.12);
  --pg: #FFF8F6;
  --brand-soft: #FCE9E8;
  --ink2: #6B6360;
  --line2: #F0E7E4;
  --ok2: #1FA463;
  --rating: #F0A500;
  --ease-s: cubic-bezier(.34,1.4,.64,1);
  --ease-o: cubic-bezier(.2,.7,.3,1);
  --psh-rest: 0 1px 2px rgba(28,26,26,.04), 0 4px 12px rgba(232,49,42,.05);
  --psh-hover: 0 6px 16px rgba(28,26,26,.08), 0 12px 28px rgba(232,49,42,.10);
  --pastel-0: #FCE4E2;
  --pastel-1: #FFE8D6;
  --pastel-2: #FBF0CE;
  --pastel-3: #DDF1E4;
  --pastel-4: #DCEBFB;
  --pastel-5: #EAE2F8;
  --pastel-6: #E6EFDD;
  --pastel-7: #F3E6DD;
  --wolt-golge: 0 1px 2px rgba(0,0,0,.07), 0 2px 3px rgba(0,0,0,.07), 0 4px 6px rgba(0,0,0,.07);
  --botnav-h: calc(56px + env(safe-area-inset-bottom));
  /* --- YENİ: semantik takma adlar (mevcut token'lara var() ile bağlı → sıfır görsel risk) --- */
  --primary: var(--acc);
  --primary-press: var(--acc-koyu);
  --primary-tint: var(--acc-soft);
  --primary-ink: var(--acc-ink);
  --danger: var(--kirmizi);
  --success: var(--yesil);
  --warning: var(--amber);
  --surface: var(--kart);
  --border: var(--cizgi);
  /* --- YENİ: spacing ölçeği (4-tabanlı; önceden HİÇ yoktu) --- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  /* --- YENİ: z-index ölçeği (bileşenler sonraki batch'te adapte olacak) --- */
  --z-base: 1;
  --z-sticky: 30;
  --z-nav: 40;
  --z-overlay: 50;
  --z-modal: 60;
  --z-toast: 70;
  /* v279 gece-kurul O7 — M3 motion tokenları (RESEARCH_04 §6/§7). Sıfır-görsel:
     yalnız yeni/dokunulan kod referanslar; mevcut --ease-* ve --t-* dokunulmadi. */
  --dur-hizli:  150ms;
  --dur-orta:   300ms;
  --dur-yavas:  400ms;
  --ease-standart: cubic-bezier(.2,0,0,1);
  --ease-giris:    cubic-bezier(0,0,0,1);
  --ease-cikis:    cubic-bezier(.3,0,1,1);
}

/* ===================================================================
   BATCH 1 — PREMIUM MODAL (native confirm/prompt/alert yerine).
   Kendi overlay'inde; mobilde alttan sheet, ≥560px ortalı. Yeni token'ları kullanır.
   =================================================================== */
.mhm-ov{ position:fixed; inset:0; z-index:2100; background:rgba(20,18,18,.42);
  display:flex; align-items:flex-end; justify-content:center; padding:0;
  animation:mhmFade .18s ease; }
/* v236 iOS-fix (Küme B) — z-merdiveni: premium confirm/alert scrim'i (.mhm-ov) TÜM sheet'lerin
   (.mh-overlay z:200) ve paytr (z:2000) ÜSTÜNE çıktı (80→2100). Bir sheet açıkken onay diyaloğu
   artık scrim ARKASINDA kalmıyor → tıklanabilir. #toast (z:300 !important) ayrı katman. */
/* v236 iOS-fix (Küme B) — overscroll-behavior:contain: sheet iç-scroll'u uca gelince
   zincirleme arka plan sayfayı İTMESİN (iOS rubber-band scroll-chaining). İç scroll ÇALIŞIR. */
.ud-scroll, .sec-govde, .kat-sheet-govde, .bm-liste, .fs-govde{ overscroll-behavior:contain; }
@media (min-width:560px){ .mhm-ov{ align-items:center; padding:20px; } }
@keyframes mhmFade{ from{opacity:0} to{opacity:1} }
.mhm-box{ background:var(--surface); width:100%; max-width:440px;
  border-radius:var(--r-lg) var(--r-lg) 0 0; padding:var(--sp-5) var(--sp-4) calc(var(--sp-4) + env(safe-area-inset-bottom));
  box-shadow:var(--sh-modal); animation:mhmUp .28s cubic-bezier(.16,1,.3,1); }
@media (min-width:560px){ .mhm-box{ border-radius:var(--r-lg); } }
@keyframes mhmUp{ from{transform:translateY(22px); opacity:.5} to{transform:none; opacity:1} }
.mhm-title{ font-size:var(--fs-lg); font-weight:800; color:var(--ink); line-height:1.3; }
.mhm-msg{ font-size:var(--fs-base); color:var(--muted); margin-top:var(--sp-2); line-height:1.5; }
.mhm-girdi{ width:100%; min-height:44px; margin-top:var(--sp-3); box-sizing:border-box;
  border:1px solid var(--border); border-radius:var(--r-md); padding:0 var(--sp-3);
  font-size:16px; color:var(--ink); background:var(--surface); }
.mhm-girdi:focus{ outline:none; border-color:var(--primary); }
.mhm-btns{ display:flex; gap:var(--sp-2); margin-top:var(--sp-5); }
.mhm-btn{ flex:1; min-height:48px; border-radius:var(--r-md); font-weight:800;
  font-size:var(--fs-base); border:0; cursor:pointer; -webkit-tap-highlight-color:transparent; transition:filter .12s ease; }
.mhm-btn:active{ filter:brightness(.94); }
.mhm-btn--iptal{ background:var(--primary-tint); color:var(--primary-ink); }
.mhm-btn--tamam{ background:var(--primary); color:#fff; }
.mhm-btn--yikici{ background:var(--danger); color:#fff; }

/* BATCH 1 — 44px dokunma hedefi yardımcı sınıfı (sonraki batch'lerde küçük hedeflere uygulanır). */
.hit44{ position:relative; }
.hit44::before{ content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  min-width:44px; min-height:44px; width:100%; height:100%; }

/* ===================================================================
   BATCH 2 — dokunma hedefleri (44px) · toast/CTA çakışması · floating sepet occlusion · sepet çelişki.
   !important YOK: geç-pozisyon + yüksek-specificity ile kazanır (BATCH 2 hedefi gereksiz !important eklememek).
   =================================================================== */
/* 4 — Dokunma hedefleri ≥44px (sepet kritik: adet ±, sil, boşalt; ödeme çipleri; adres input; modal kapat). */
.s-satir .adet button{ width:44px; height:44px; }
.s-sil{ width:44px; height:44px; }
.sepet-bosalt{ min-height:44px; padding:4px 10px; }
.mh-kapat{ width:44px; height:44px; }
.pu-cip{ min-height:44px; }
.p-inp, .p-mahalle{ min-height:44px; box-sizing:border-box; }
/* 5 — Toast, alt CTA çubuğunu ÖRTMEZ: CTA taşıyan ekranlarda toast CTA'nın üstüne çıkar. */
body[data-ekran="sepet"] .toast,
body[data-ekran="odeme"] .toast{ bottom:calc(var(--botnav-h) + 96px); }
/* 2 — Floating sepet barı görünürken içerik alt boşluğu artar → Keşfet/kampanya banner örtülmez. */
body.has-sepet-bar{ padding-bottom:calc(196px + env(safe-area-inset-bottom)); }
/* 3 — Sepet çelişki paneli: "başka işletme sepetin var" durumu (myan-baska) hafif vurgulu. */
.myan-kart.myan-baska{ border:1px solid var(--primary-tint); background:var(--primary-tint); }
.myan-kart.myan-baska .myan-bos-bas{ color:var(--primary-ink); }

/* ===================================================================
   BATCH 3 — DESKTOP NAV + LAYOUT.
   Sarmalayıcı deseni: .dk-duzen/.dk-sol/.dk-ozet mobil+tablette display:contents
   (kutu üretmez → SIFIR görsel değişim, pixel-diff ile kanıtlanır); ≥1024'te grid'e dönüşür.
   Buradaki !important'lar YALNIZ v193 botnav-kanonik ve v127 sepet-cta-bar bloklarındaki
   mevcut !important'ları ezmek için (yeni keyfî !important değil — raporda sayılır).
   =================================================================== */
.dk-duzen, .dk-sol, .dk-ozet{ display:contents; }

@media (min-width:1024px){
  /* --- 1. BOTNAV: alt bar DEĞİL → SOL RAY (dikey dock). CSS-only: rozet/aktif-state JS aynen çalışır. --- */
  /* BATCH 7.5 — ray dikey-ORTA yerine ÜST'e sabitlendi (header hizası) → kısa sayfalarda beyaz-void
     ortasında "yetim ada" durmaz, her sayfada ilk içeriğin yanında tutarlı. */
  .botnav{ left:16px !important; right:auto !important; bottom:auto !important; top:76px !important;
    transform:none; width:104px; height:auto !important; max-height:calc(100vh - 96px); overflow:auto;
    padding:10px 8px !important; border:1px solid var(--border) !important; border-top:1px solid var(--border) !important;
    border-radius:20px !important; box-shadow:var(--sh-floating) !important; pointer-events:auto; }
  .botnav .bn-et{ font-size:10.5px !important; }   /* "Siparişler" kırpılmasın */
  .botnav-ic{ flex-direction:column !important; height:auto !important; max-width:none; gap:4px; }
  .botnav-ic button{ flex:0 0 auto !important; padding:10px 4px !important; border-radius:14px !important; }
  .botnav-ic button:hover{ color:var(--ink) !important; background:var(--kart3) !important; }
  .botnav-ic button.aktif{ background:var(--primary-tint) !important; }
  /* --- içerik alt boşluğu: nav artık altta değil --- */
  .sar{ padding-bottom:48px !important; }
  body.has-sepet-bar{ padding-bottom:140px; }
  /* --- liste floating sepet barı: tam-genişlik mobil bar DEĞİL → sağ-alt kompakt kart --- */
  .sepet-bar{ left:auto !important; right:24px !important; width:400px; max-width:calc(100vw - 140px); padding:0 0 20px !important; }
  .sepet-bar--nav-ustu{ bottom:0 !important; }
  /* --- 2. İKİ KOLON DÜZEN: sepet / ödeme / profil (sol içerik + sağ yapışkan özet) --- */
  body[data-ekran="sepet"] #ekran > .dk-duzen,
  body[data-ekran="odeme"] #ekran > .dk-duzen,
  body[data-ekran="profil"] #ekran > .dk-duzen{
    display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:28px;
    max-width:1160px; margin-inline:auto; align-items:start; }
  .dk-sol{ display:block; min-width:0; grid-column:1; grid-row:1; }
  .dk-ozet{ display:block; grid-column:2; grid-row:1; position:sticky; top:24px; }
  /* özet kartı görünümü (sepet + ödeme) — Anayasa tokenları */
  .dk-duzen--sepet .dk-ozet, .dk-duzen--odeme .dk-ozet{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
    padding:var(--sp-4); box-shadow:var(--sh-card); }
  /* sepet CTA: mobilde fixed alt bar; desktop'ta özet kartının İÇİNDE statik (v127 fixed !important ezilir) */
  .dk-ozet .sepet-cta-bar{ position:static !important; left:auto; right:auto; bottom:auto;
    margin:12px 0 0 !important; padding:0 !important; max-width:none; box-shadow:none; background:none; border:none; }
  body[data-ekran="sepet"] .sar{ padding-bottom:48px !important; }   /* CTA artık akışta → dev dip boşluk gereksiz */
  /* ödeme özeti zaten .ode-ozet kartı — dk-ozet kartına sarılınca çift çerçeve olmasın */
  .dk-duzen--odeme .dk-ozet .ode-ozet{ border:none; box-shadow:none; margin:0; padding:0; background:none; }
  /* profil sağ kolonu: form blokları — kart çerçevesi YOK (hafif), üst hizadan başlar */
  .dk-duzen--profil .dk-ozet > .bolum-bas:first-child{ margin-top:4px !important; }
  body[data-ekran="profil"] .profil-dip{ max-width:1160px; margin-inline:auto; }

  /* v219 FAZ2 (B2) — İÇERİK RAY-CLEARANCE artık TÜM ekranlara (liste/menü DAHİL) uygulanır.
     Eski davranış liste/menü'yü "full-bleed hero taşıyor" varsayımıyla hariç tutuyordu; gerçek
     cihazda ray (fixed, z:40) kategori ızgarasının/hero'nun ÜSTÜNE biniyordu (robot 1024–1440'ta
     kanıtladı). Çözüm: 132px sol gutter her ekranda + full-bleed header/fbar/hero desktop'ta
     içerik kolonuna hapsedilir (aşağıda) → ray artık kendi sütununda, hiçbir şeyin üstüne binmez. */
  body[data-ekran="liste"] #ekran, body[data-ekran="menu"] #ekran,
  body[data-ekran="sepet"] #ekran, body[data-ekran="odeme"] #ekran,
  body[data-ekran="profil"] #ekran, body[data-ekran="gecmis"] #ekran,
  body[data-ekran="takip"] #ekran, body[data-ekran="favoriler"] #ekran{
    padding-left:132px !important; padding-right:24px !important; box-sizing:border-box; }
  /* full-bleed İPTAL (desktop): .wlt-head/.wlt-fbar 50vw taşması ray sütununa girmesin (Ç3). Beyaz
     bant yalnız içerik kolonu genişliğinde → ray'in ilk ikonunu ("Ana Sayfa") artık örtmez. */
  .wlt-head, .wlt-fbar{
    margin-left:0 !important; margin-right:0 !important;
    padding-left:0 !important; padding-right:0 !important; }
  /* header overscroll-cover ::before (üstteki beyaz perde) da 50vw ile taşıyordu → yatay-taşma. İçerik koluna hapset. */
  .wlt-head::before{ left:0 !important; right:0 !important; }
  /* menü hero kapağı: içerik kolonuna hizala (ray'in sağında başlasın) — eski -16px bleed ray'e değiyordu. */
  .m-kapak{ width:100% !important; margin-left:0 !important; margin-right:0 !important; }
  /* ray üst konumu: header artık içeriğe hapsedildiğinden ray'i biraz yukarı al (kısa, dengeli dock). */
  .botnav{ top:24px !important; }
  /* v220 (madde 3 / K19) — RAY-HEADER REGRESYONU: .ust barı (sepet/ödeme/geçmiş/takip/menü) z:20 ile
     ray'in (z:40) ALTINDA; ray "Sepetim/Siparişlerim/Sipariş Takibi" başlığını ve geri butonunu örtüyordu.
     Çözüm: .ust İÇERİĞİNE (geri + başlık) sol ray-gutter'ı ver → içerik ray'in sağında başlar, örtüşme biter. */
  .ust{ padding-left:132px !important; }
  /* kısa-sayfa dikey-void yumuşatma: 2-kolon grid en az viewport-yüksekliği kadar → ray/özet yalnız
     minik bir içerik bandının yanında "yarım bırakılmış" durmaz (içerik üst banda oturur, dip nefes alır). */
  body[data-ekran="sepet"] #ekran > .dk-duzen,
  body[data-ekran="odeme"] #ekran > .dk-duzen,
  body[data-ekran="profil"] #ekran > .dk-duzen{ min-height:calc(100vh - 140px); align-content:start; }
}

/* ===================================================================
   BATCH 7.5 — FINAL MINI-FIX (kurulun kaldığı P1/P2; UI-only, cerrahi).
   =================================================================== */
/* 3 — MOBİL SİPARİŞ TAKİP: son içerik (harita/CTA/puanlama) bottom-nav altında kalmasın. */
body[data-ekran="takip"] .sar{ padding-bottom:calc(var(--botnav-h) + 40px); }
.takip-harita-sar{ margin-bottom:18px; }
/* 4 — PUANLAMA YILDIZLARI: görsel boyut aynı, dokunma hedefi 44px (::before görünmez tampon). */
.yld{ position:relative; }
.yld::before{ content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:44px; height:44px; }
.puan-satir .yildizlar, .up-yild{ gap:2px; }
/* 5 — SEPET MOBİL: özet (Teslimat/Toplam) fixed-CTA arkasında kalmasın; aşırı boşluk da olmasın. */
@media (max-width:1023px){
  body[data-ekran="sepet"] .sar{ padding-bottom:calc(var(--botnav-h) + 150px) !important; }
}

/* ===================================================================
   BATCH 4 — RESTORAN DETAY + ÜRÜN KARTLARI cilası (cerrahi; görsel/slug logic'e dokunulmadı).
   =================================================================== */
/* 1 — "En çok sipariş edilen" rayındaki ekle butonu 34→40px (ana .ekle zaten 40; tutarlılık + WCAG).
       ::after hit-area -4px → 48px dokunma alanı. */
.wl-enc-ekle{ width:40px; height:40px; }
.wl-enc-ekle::after{ content:''; position:absolute; inset:-4px; }
/* 2 — Uzun ürün adı kartı şişirmesin: 2 satır clamp (açıklama zaten clamp'li). */
.m-ad{ overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.wl-enc-ad{ overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
/* 3 — Kategori tab şeridi: sağ kenarda sert kesilme yerine solma (kaydırılabilirlik ipucu).
       scroll-sonunda hafif solma kabul edilebilir maliyet; padding fazlası son çipi korur. */
.menu-kat-bar{ -webkit-mask-image:linear-gradient(90deg, #000 calc(100% - 32px), transparent);
  mask-image:linear-gradient(90deg, #000 calc(100% - 32px), transparent); padding-right:32px; }

/* ===================================================================
   BATCH 5 — SEPET + CHECKOUT FINAL PREMIUM (para ekranı; logic DEĞİŞMEDİ, yalnız UI/geri bildirim).
   =================================================================== */
/* 1 — INLINE ALAN HATASI: hangi alan eksik → kırmızı halka + sarsıntı; yazınca kalkar (JS alanHata). */
@keyframes alanSars{ 0%,100%{transform:none} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }
.alan-hata{ animation:alanSars .3s ease; }
.ode-satir.alan-hata input, .ode-satir.alan-hata textarea{
  border-color:var(--danger); box-shadow:0 0 0 3px rgba(211,47,47,.14); border-radius:12px; }
label.alan-hata{ background:rgba(211,47,47,.07); border-radius:12px; outline:2px solid rgba(211,47,47,.35); outline-offset:2px; }
/* v279 gece-kurul O4 — kalıcı inline alan hatası (alana-bitişik, spesifik). Placeholder-etiket DEĞİL. */
.alan-hata-mesaj{ display:none; margin-top:6px; font-size:14px; line-height:1.4; color:var(--danger); font-weight:600; }
.alan-hata-mesaj.gor{ display:block; }
.ode-satir.alan-hata .alan-hata-mesaj{ display:block; }
/* 2 — YASAL ONAY: 18px kutu → 22px + satır min 44px (dokunma hedefi); label zaten tam-tıklanır. */
label[for="f_sozlesme"]{ min-height:44px; align-items:center; padding:6px 4px; }
#f_sozlesme{ width:22px; height:22px; accent-color:var(--primary); }
/* 3 — PARA ÜSTÜ çipleri: dağınık sarma yerine düzenli esnek grid. */
.paraustu-cip{ display:flex; flex-wrap:wrap; gap:var(--sp-2); }
.paraustu-cip .pu-cip{ flex:0 0 auto; min-width:0; text-align:center; }  /* v233 mobil-fix: 1 1 auto çipleri genişletip yazıyı sola yapıştırıyordu → içeriğe göre boyut, bahşiş çipleri gibi derli */
/* 4 — BAHŞİŞ çipleri: 44px dokunma + seçili durum netliği (mevcut .sec stili korunur). */
.bahsis-cip{ min-height:44px; }
/* 5 — ÖZET GÜVEN SATIRI (desktop sağ kart + mobil özet): kapıda ödeme gerçeği, sade. */
.oz-guven{ display:flex; align-items:center; gap:8px; margin-top:var(--sp-3); padding-top:var(--sp-3);
  border-top:1px dashed var(--border); font-size:var(--fs-sm); color:var(--muted); }
.oz-guven .ico, .oz-guven svg{ width:15px; height:15px; flex:0 0 auto; color:var(--success); }
/* 6 — BOŞ-DURUM İKON DAİRESİ — TEK YETKİLİ KURAL (v232: 4 çelişen tanım tek kurala indi) */
.bos .emoji{ display:grid; place-items:center; width:88px; height:88px; margin:0 auto 14px;
  border-radius:50%; background:var(--acc-soft,#FCE9E8); box-shadow:0 8px 24px rgba(232,49,42,.10);
  font-size:0; }
.bos .emoji .ico, .bos .emoji svg{ width:40px; height:40px; color:var(--acc); opacity:1; } /* v232 K5 — %60 soluk kalktı */
.bos-cta{ min-height:48px; }
.bos-cta.ikincil{ background:transparent; color:var(--acc); box-shadow:none; } /* arama-boş "Aramayı temizle" */
/* 7 — SİPARİŞİ VER: disabled durumu premium (soluk ama okunur), loading zaten spinner'lı (v196). */
#siparisVerBtn:disabled{ opacity:.55; filter:saturate(.6); cursor:not-allowed; }
#siparisVerBtn.tamam{ background:var(--success); }

/* ===================================================================
   BATCH 6 — SİPARİŞ TAKİP + SİPARİŞLERİM cilası (logic dokunulmadı).
   =================================================================== */
/* A — Siparişlerim kart: durum rozeti (yalnız veride durum varsa render edilir). */
.gecmis-alt{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; }
.gecmis-durum{ font-size:var(--fs-xs); font-weight:800; padding:3px 9px; border-radius:var(--r-pill); }
.gecmis-durum.gd-teslim{ background:rgba(21,179,107,.14); color:#15803d; }
.gecmis-durum.gd-iptal{ background:rgba(211,47,47,.12); color:var(--danger); }
.gecmis-durum.gd-aktif{ background:var(--primary-tint); color:var(--primary-ink); }
.gecmis-alt .btn-tekrar{ margin-left:auto; min-height:44px; }
/* B — Takip yükleme durumu: premium spinner. */
.yukleniyor--spin{ display:flex; flex-direction:column; align-items:center; gap:var(--sp-3); }
.yuk-spin{ width:34px; height:34px; border-radius:50%; border:3px solid var(--border); border-top-color:var(--primary); animation:yukSpin .8s linear infinite; }
@keyframes yukSpin{ to{ transform:rotate(360deg); } }
/* v232 — markalı ilk paint kabuğu (index.html .ilk-acil) */
.ilk-acil{ min-height:70vh; display:grid; place-content:center; gap:20px; justify-items:center; }
.ilk-logo{ width:72px; height:72px; object-fit:contain; animation:pulseSk 1.6s ease-in-out infinite; }
@keyframes pulseSk{ 0%,100%{ opacity:1 } 50%{ opacity:.55 } }

@media (min-width:1024px){
  /* C — DESKTOP: Siparişlerim listesi 2 kolon (geniş ekranda tek-şerit boşluğu değerlenir). */
  body[data-ekran="gecmis"] .gecmis-liste{ display:grid; grid-template-columns:1fr 1fr; gap:16px; max-width:1000px; margin-inline:auto; }
  body[data-ekran="gecmis"] .gecmis-aktif{ max-width:1000px; margin-inline:auto; }
  /* D — DESKTOP: Sipariş takip içeriği ortalı + biraz daha ferah (harita/adım için). Tracking linear → tek kolon KORUNUR (Wolt/Getir deseni), yalnız genişlik dengelenir. */
  body[data-ekran="takip"] #ekran > *{ max-width:820px !important; }
}

/* ============================================================================
   v219 FAZ4 (B3) — KATEGORİ --png BEYAZ-KUTU FIX (dosya SONU = son söz).
   Kök neden: 4 çelişen katman (3019/3107/3128) son kuralı bırakıyordu:
   border-radius:0 + overflow:visible + background:#fff + object-fit:contain →
   hover'da tabak translateY ile kalkınca ARKADA BEYAZ KARE görünüyordu (kullanıcı
   bulgusu: "PNG bile olmamış"). Asset'ler opak beyaz-zeminli fotoğraf (şeffaf değil).
   Tek yetkili kural: DAİRE + taşma-gizli + cover + hafif sıcak zemin → beyaz kare yok,
   her durumda (rest/hover/aktif) temiz yuvarlak tabak. Görsel-regresyon robotu ile doğrulandı.
   ============================================================================ */
.chip-foto.chip-foto--png{
  border-radius:50% !important; overflow:hidden !important;
  background:#FAF6EE !important; box-shadow:0 4px 14px rgba(20,16,14,.10) !important; }
.chip-foto.chip-foto--png img{
  object-fit:cover !important; transform:none !important;
  width:100% !important; height:100% !important; opacity:1 !important; }
.kat-hucre:hover .chip-foto.chip-foto--png{ box-shadow:0 14px 26px rgba(20,16,14,.16) !important; }
/* kat-satir (liste modal sırası) da aynı daire dilini alsın (3130 kare bırakıyordu). */
.kat-satir .chip-foto.chip-foto--png{ border-radius:50% !important; overflow:hidden !important; background:#FAF6EE !important; }

/* ============================================================================
   v220 (madde 7 / K22) — .btn-secondary TANIMI: checkout "Uygula" (#kodUygulaBtn) bu sınıfı
   kullanıyordu ama CSS'te HİÇ tanımlı değildi → global reset'le şeffaf/köşesiz/13px çıplak buton.
   İndirim kodu inputuyla (.kod-satir input: --r-md, 44px) HİZALI ikincil buton. (Tam buton sistemi v221.)
   ============================================================================ */
.btn-secondary{
  flex:0 0 auto; min-height:44px; padding:0 18px; border-radius:var(--r-md);
  background:var(--primary-tint, #FCE9E8); color:var(--primary-ink, #B3261E);
  border:1px solid var(--cam-kenar); font-weight:800; font-size:15px; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; white-space:nowrap;
  transition:background .16s ease, transform .08s ease;
}
.btn-secondary:hover{ background:var(--primary, #E8312A); color:#fff; border-color:transparent; }
.btn-secondary:active{ transform:scale(.97); }
.btn-secondary:disabled{ opacity:.5; cursor:default; }

/* ════════════════════════════════════════════════════════════════════════════
   v221 — DESIGN SYSTEM REFOUNDATION (RAPOR_PREMIUM_GORSEL_DIL SPEC v1)
   Tek kaynak: bu katman SON söz. Amaç: 13 buton stili → 3 varyant, 6 radius dili
   → 3 token, tek hover sistemi, gerçek .btn/.card, focus ring, Manrope display.
   ════════════════════════════════════════════════════════════════════════════ */

/* ── 1) SPEC TOKEN'LARI (mevcut kanonik isimlere KÖPRÜLÜ — kırmadan geçiş) ──
   Selector kanonik blokla AYNI spesifiklikte ([data-tema] dahil) — yoksa 4131'deki blok --display'i ezer. */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  /* marka rampası (spec) */
  --brand-600:#E8312A; --brand-700:#C9241E; --brand-800:#A81B16;
  --brand-100:#FDE7E5; --brand-50:#FEF4F3;
  /* sıcak nötr rampa (spec) */
  --ink-900:#1A1817; --ink-700:#4A4543; --ink-500:#7A736F;
  --ink-300:#C9C3BF; --ink-200:#E5E1DE; --ink-100:#F3F1EF;
  /* semantic (markadan ayrık) */
  --ds-success:#05944F; --ds-warning:#B45309; --ds-error:#B3261E; --ds-info:#276EF1;
  /* a11y AA (v231 token omurgası) — metin-rolü kırmızı=var(--brand-700) #C9241E (5.59:1);
     gri=var(--soluk) #6B6360 (5.87:1); aşağıdaki ikisi eklendi */
  --cta-fill:#D62822;        /* CTA/rozet DOLGUSU beyaz metin taşırken (beyaz 5.02:1) */
  --success-text:#057A43;    /* açık yeşil-tint üstünde başarı metni (4.95:1) */
  /* mevcut sistemin ana değişkenleri spec'e bağlanır */
  /* NOT (v227 council): --primary-press #C01E18→#C9241E ve --primary-tint #FCE9E8→#FDE7E5 ton kayması
     KASITLIDIR — RAPOR_PREMIUM_GORSEL_DIL SPEC v1 rampası (eski ad-hoc değerlerin spec'e oturtulması). */
  --primary: var(--brand-600);
  --primary-press: var(--brand-700);
  --primary-tint: var(--brand-100);
  --display: "Manrope","Fraunces","Georgia",sans-serif;   /* v221: display artık Manrope */
}

/* ── 2) GERÇEK .btn SİSTEMİ (3 varyant × 2 boy) ───────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:48px; padding:0 22px; border-radius:var(--r-md); border:1px solid transparent;
  font-family:var(--body); font-weight:800; font-size:15px; line-height:1.2;
  cursor:pointer; white-space:nowrap; user-select:none; -webkit-tap-highlight-color:transparent;
  transition:background .16s ease, color .16s ease, box-shadow .16s ease, transform .08s ease;
}
.btn--primary{ background:var(--cta-fill); color:#fff; box-shadow:var(--sh-cta); }
.btn--primary:hover{ background:var(--brand-700); }
.btn--primary:active{ transform:scale(.97); background:var(--brand-800); }
.btn--secondary{ background:var(--brand-100); color:var(--brand-700); }
.btn--secondary:hover{ background:var(--brand-600); color:#fff; }
.btn--secondary:active{ transform:scale(.97); }
.btn--ghost{ background:transparent; color:var(--ink-700); border-color:var(--ink-200); }
.btn--ghost:hover{ background:var(--ink-100); color:var(--ink-900); }
.btn--ghost:active{ transform:scale(.97); }
.btn--sm{ min-height:40px; padding:0 16px; font-size:15px; border-radius:var(--r-sm); }
.btn:disabled,.btn[aria-disabled="true"]{ opacity:.5; cursor:default; transform:none; }
.btn:focus-visible{ outline:none; box-shadow:0 0 0 3px var(--brand-100), 0 0 0 5px var(--brand-600); }

/* ── 3) GERÇEK .card SİSTEMİ ──────────────────────────────────────────────── */
.card{
  background:var(--surface,#fff); border:1px solid var(--ink-200);
  border-radius:var(--r-lg); box-shadow:var(--sh1); padding:16px;
}
.card--hover{ transition:transform .2s ease, box-shadow .2s ease; }
.card--hover:hover{ transform:translateY(-4px); box-shadow:var(--sh2); }

/* ── 4) MEVCUT BUTONLARIN SİSTEME HİZALANMASI (radius savaşı biter) ───────── */
/* .btn-buyuk: 18/14/20px çatışması → tek token. Davranış aynı, dil tek. */
.btn-buyuk{ border-radius:var(--r-md) !important; font-weight:800; }
.btn-buyuk:not(.btn-sade):not(:disabled):hover{ filter:none; background:var(--brand-700); }
.btn-buyuk:not(:disabled):active{ transform:scale(.98); }
.btn-buyuk.btn-sade:hover{ background:var(--ink-100); }
/* ikincil aile: v220'de doğan .btn-secondary spec'e bağlanır */
.btn-secondary{ border-radius:var(--r-md); }

/* ── 5) TEK HOVER SİSTEMİ — ölü .r-kart hover'larının yerine CANLI bileşenler ─ */
@media (hover:hover){
  .wf-urun{ transition:transform .2s ease, box-shadow .2s ease; }
  .wf-urun:hover{ transform:translateY(-4px); box-shadow:var(--sh2); }
  .promo-cta{ transition:background .16s ease, color .16s ease, transform .16s ease; }
  .promo-cta:hover{ background:var(--brand-100) !important; color:var(--brand-800) !important; }
  .sepet-bosalt:hover,[data-bosalt]:hover{ color:var(--brand-700); }
  .btn-tekrar:hover{ background:var(--brand-600); color:#fff; }
  /* kategori hover: -8px başlığa biniyordu (K8) → -4px, gölge korunur */
  .kat-hucre:hover .chip-foto,.kat-hucre:hover .chip-foto--png{ transform:none !important; } /* v232 K2 — ek chip lift kaldırıldı (hücre -4 tek kaldırma); gölge korunur */
  .wf-ok-btn{ opacity:.35; transition:opacity .18s ease, transform .18s ease; }
  .wf-bolum:hover .wf-ok-btn,.wf-ok-btn:hover{ opacity:1; }
}

/* ── 6) INPUT: tek dil + görünür klavye odağı (a11y P1) + placeholder fix ──── */
#ekran input[type="text"],#ekran input[type="tel"],#ekran input[type="number"],
#ekran input:not([type]),#ekran textarea,#ekran select{
  border-radius:var(--r-sm); font-family:var(--body);
}
#ekran input:focus-visible,#ekran textarea:focus-visible,#ekran select:focus-visible{
  outline:none; border-color:var(--brand-600) !important;
  box-shadow:0 0 0 3px var(--brand-100) !important;
}
.kod-satir input::placeholder{ text-transform:none; }   /* "KODUN VARSA YAZ" bağırması biter */

/* ── 7) SEGMENT/ÇİP YÜKSEKLİK TUTARLILIĞI (36 vs 44 karmaşası) ────────────── */
.sec,.pu-cip,.bahsis-cip{ min-height:44px; }

/* ════════════════════════════════════════════════════════════════════════════
   v223 — MÜŞTERİ REBUILD KATMANI (benchmark omurgası + kart/kategori kusurları)
   ════════════════════════════════════════════════════════════════════════════ */

/* K2 — kategori tabakları "yamuk": webp'ler daire kenarına taşacak kadar zoom'luydu (pizza %100 değme).
   img %90'a küçülür → her tabağın kenarında eşit nefes payı, kesilme hissi biter. Zemin tutarlı sıcak ton. */
.chip-foto.chip-foto--png{ background:#FDF4EC !important; }
.chip-foto.chip-foto--png img{ scale:.9 !important; transform-origin:center !important; }   /* modern 'scale' özelliği: transform animasyonları/none'ları onu EZEMEZ (3132 + giriş animasyonlarından bağımsız) */

/* K4+K34 — fotoğrafsız ürün mini kartı: bej-üstü-bej görünmezlik + ritim kopması.
   v233 mobil-fix: min-height:196px KALDIRILDI — küçük kartların (99px) hepsini 196'ya
   şişiriyordu → küçük istif 402px, büyük kart 208px → altında dev beyaz boşluk (kullanıcı
   mobilde gördü). Kartların açık yükseklikleri (büyük 208 / küçük 99 / desktop 186) zaten
   çökmeyi önler; placeholder zemin korundu. */
.wf-urun{ background:#EFE9DF; }
.wf-kucuk{ min-height:0; }   /* güvence: eski 196 blanket kalıntısı küçük kartı şişirmesin */
.wf-urun svg{ opacity:.9; }

/* K5 — restoran adı erken kırpılıyordu ("Milas Kebap Sara…"): 2 satıra sarabilir */
.wf-ad .wf-ad-txt{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.25; }

/* K12 — ürün kartının tamamı tıklanır hissi */
.m-kart{ cursor:pointer; }

/* K13 — "+" ekle butonu kart ortasında yüzüyordu: foto sağdayken butonu fotonun köşesine sabitle */
.m-kart{ position:relative; }
.m-kart .ekle{ position:absolute !important; right:14px !important; bottom:14px !important; left:auto !important; top:auto !important; }   /* KÖK: bir katman position:relative yapmıştı → buton akışta kalıp KART ORTASINDA yüzüyordu */

/* K14 — menü kategori çipleri sert kırpılıyordu: sağ kenar fade maskesi (kaydırılabilirlik ipucu) */
.menu-kat-bar{ -webkit-mask-image:linear-gradient(90deg,#000 90%,transparent); mask-image:linear-gradient(90deg,#000 90%,transparent); }
.kat-carousel{ -webkit-mask-image:linear-gradient(90deg,#000 94%,transparent); mask-image:linear-gradient(90deg,#000 94%,transparent); }   /* K3 desktop son daire sert kesilmesin */

/* K16 — "Popüler" rozeti 2010-parlak dilden nötr cam pill'e */
.cs-rozet{ background:rgba(255,255,255,.92) !important; color:var(--ink-900,#1A1817) !important;
  border:0 !important; box-shadow:0 1px 5px rgba(20,12,10,.16) !important; text-shadow:none !important;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); font-weight:700; }
.cs-rozet svg{ stroke:var(--brand-700,#C9241E); }

/* K20 — sepet kalem kontrolleri tek dil: çöp de daire ailesinden */
.s-satir .s-sil{ border-radius:999px !important; }

/* K21 — ödeme özeti hizası */
.oz-sat{ align-items:baseline; }

/* K24 — para üstü grubu: kırmızı-alarm çerçevesi yerine nötr grup */
.os-paraustu{ border-color:var(--ink-200,#E5E1DE) !important; box-shadow:none !important; }

/* TEKRAR-SİPARİŞ RAFI (benchmark: promo altı, liste üstü) */
.reorder-serit{ display:flex; gap:12px; overflow-x:auto; padding:2px 2px 12px; scrollbar-width:none; scroll-snap-type:x proximity; }
.reorder-serit::-webkit-scrollbar{ display:none; }
.reorder-kart{
  flex:0 0 auto; min-width:210px; max-width:260px; text-align:left; scroll-snap-align:start;
  background:var(--surface,#fff); border:1px solid var(--ink-200,#E5E1DE); border-radius:var(--r-lg);
  box-shadow:var(--sh1); padding:14px 16px; display:flex; flex-direction:column; gap:4px; cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease;
}
.reorder-kart:hover{ transform:translateY(-3px); box-shadow:var(--sh2); }
.reorder-kart b{ font-size:15px; color:var(--ink-900,#1A1817); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.reorder-kart .rk-ozet{ font-size:13px; color:var(--ink-500,#7A736F); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.reorder-kart .rk-cta{ margin-top:6px; font-size:13px; font-weight:800; color:var(--brand-700,#C9241E); display:inline-flex; align-items:center; gap:6px; }

/* ═══════════════════════════════════════════════════════════════════════════
   v229 — APP-SHELL DESKTOP (header-nav-desktop spec · Küme 2)
   Kullanıcı şikayeti: "PC navigasyon menü header çakışması, üst üste binen yerler".
   TEK dosya-sonu katman: 132px ekran-bazlı gutter'ları + %78 cam header'ları +
   --head-h(0px) bug'lı fbar ofsetini + z-index kaosunu (20/30/40/55/110/120) EZER.
   Legacy satır SİLİNMEZ; son söz burada. Yalnız ≥1024px (mobil dokunulmaz).
   ═══════════════════════════════════════════════════════════════════════════ */
@media (min-width:1024px){
  :root{
    --shell-head-h: 64px;
    --shell-fbar-h: 56px;
    --rail-w: 104px;
    --rail-gap: 28px;
    --shell-content: 1044px;
    --shell-w: calc(var(--rail-w) + var(--rail-gap) + var(--shell-content));
    --shell-x: max(24px, calc((100vw - var(--shell-w)) / 2));
    --shell-left: calc(var(--shell-x) + var(--rail-w) + var(--rail-gap));
    --z-rail: 30;
    --z-substick: 40;
    --z-head: 50;
    --z-cta: 60;
  }
}
@media (min-width:1440px){ :root{ --shell-content: 1200px; } }
@media (min-width:1680px){ :root{ --shell-content: 1440px; } }

@media (min-width:1024px){
  /* 2) Shell iskeleti — gutter TEK yerden (P1-6, P1-7) */
  .sar{
    max-width: none !important;
    margin: 0 !important;
    padding-left: var(--shell-left) !important;
    padding-right: var(--shell-x) !important;
  }
  body[data-ekran="liste"] #ekran, body[data-ekran="menu"] #ekran,
  body[data-ekran="sepet"] #ekran, body[data-ekran="odeme"] #ekran,
  body[data-ekran="profil"] #ekran, body[data-ekran="gecmis"] #ekran,
  body[data-ekran="takip"] #ekran, body[data-ekran="favoriler"] #ekran{
    padding-left: var(--shell-left) !important;
    padding-right: var(--shell-x) !important;
  }

  /* 3) Sol ray — header'ın ALTINDA, içeriğe çapalı (P0-2, P0-3) */
  .botnav{
    left: var(--shell-x) !important; right: auto !important;
    top: calc(var(--shell-head-h) + 20px) !important; bottom: auto !important;
    width: var(--rail-w) !important;
    max-height: calc(100vh - var(--shell-head-h) - 44px) !important;
    z-index: var(--z-rail) !important;
  }
  /* app-shell tutarlılığı: ray tüm müşteri ekranlarında görünür (JS NAV_GIZLI'ya dokunmadan
     css:3616 ↔ css:3736 çelişkisini çift-sınıf spesifiklikle tek kurala indirir) */
  .botnav.botnav.gizli{ display: block !important; }

  /* 4a) Liste header (.wlt-head + .wlt-fbar) — TEK 64px opak bant, içerik hizalı */
  .wlt-head{
    position: sticky !important; top: 0 !important; z-index: var(--z-head) !important;
    height: var(--shell-head-h) !important; box-sizing: border-box !important;
    margin-left: calc(-1 * var(--shell-left)) !important;
    margin-right: calc(-1 * var(--shell-x)) !important;
    padding: 0 var(--shell-x) !important;
    align-items: center !important; flex-wrap: nowrap !important;
    background: #FFFFFF !important; box-shadow: none !important;
  }
  .wlt-head::after{ left: 0 !important; right: 0 !important; }
  .wlt-ara-wrap .ara-kutu{ height: 44px !important; }
  body[data-ekran="liste"] .sar{ padding-top: 0 !important; }
  body[data-ekran="liste"] .wlt-konum{ margin-top: 0 !important; }

  .wlt-fbar{
    position: sticky !important;
    top: calc(var(--shell-head-h) - 1px) !important;   /* 63px LİTERAL — var(--head-h) bağımlılığı bitti (P0-1) */
    z-index: var(--z-substick) !important;
    min-height: var(--shell-fbar-h) !important; box-sizing: border-box !important;
    padding: 8px 0 !important; background: #FFFFFF !important;
  }
  .wlt-fbar::after{ left: 0 !important; right: 0 !important; }

  /* 4b) Diğer ekranlar (.ust — sepet/ödeme/geçmiş/takip/profil) */
  .ust{
    position: sticky !important; top: 0 !important; z-index: var(--z-head) !important;
    height: var(--shell-head-h) !important; box-sizing: border-box !important;
    padding-left: var(--shell-left) !important;
    padding-right: var(--shell-x) !important;
    background: #FFFFFF !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
    border-bottom: 1px solid var(--ink-200, #E5E1DE) !important;
  }

  /* 4c) Menü (Wolt venue deseni KORUNUR — şeffaf başlar, scroll'da opaklaşır; hiza+z düzelir) */
  body[data-ekran="menu"] .ust{
    position: fixed !important; height: var(--shell-head-h) !important;
    padding-left: var(--shell-left) !important; padding-right: var(--shell-x) !important;
    z-index: var(--z-head) !important;
    background: transparent !important; border-bottom-color: transparent !important;
  }
  body[data-ekran="menu"] .ust.ust-solid{
    background: #FFFFFF !important;
    border-bottom-color: var(--cam-kenar) !important;
  }
  .menu-ust{
    top: calc(var(--shell-head-h) - 1px) !important;
    margin-top: 0 !important; padding-top: 12px !important;
    z-index: var(--z-substick) !important; background: #fff !important;
    width: 100% !important;
  }

  /* 5) Yapışkan özet + CTA katmanı (P1-8) */
  .dk-ozet{ top: calc(var(--shell-head-h) + 20px) !important; }
  .sepet-bar{ z-index: var(--z-cta) !important; }
}
/* ═══ /v229 APP-SHELL DESKTOP ═══ */

/* ═══════════════════════════════════════════════════════════════════════════
   v230 — ÖLÜ ETKİLEŞİM DÜZELTMESİ (hover/pointer-events/z-katman)
   Spec: v220-operasyon/redesign/{motion-hover,modal-sheet-toast,urun-modal}.md
   Tek dosya-sonu katman + legacy pointer-events:none override'ları.
   Cetvel: mevcut --t-bas(120ms), --t-temel(200ms), --ez + --ink-NN, --brand-NNN, --sh1..3.
   v229 APP-SHELL ve .pr2 promo bloklarina DOKUNULMADI.
   ═══════════════════════════════════════════════════════════════════════════ */

/* P0-1) TOAST aksiyon butonu (Geri Al/Yenile) TIKLANABILIR + z-katman.
   toast govdesi pointer-events:none KALIR; aksiyon butonu re-enable edilir.
   z-index kurali dosya SONUNDA (#toast). */
.toast .toast-geri{
  pointer-events:auto !important;
  min-height:36px; padding:9px 16px; margin-left:14px; cursor:pointer;
  transition:background var(--t-temel) var(--ez), transform var(--t-bas) var(--ez);
}
@media (hover:hover) and (pointer:fine){
  .toast .toast-geri:hover{ background:rgba(255,255,255,.32); }
}
.toast .toast-geri:active{ background:rgba(255,255,255,.44); transform:scale(.96); }

/* ── P0-2) ÜRÜN MODALI favori kalbi ↔ X kapat AYRI köşelerde (çakışma = 0 px²) ──
   Masaüstünde .ud-head absolute olup X'i sağ-üste alıyordu; .ud-kalp de sağ-üstteydi → üst üste
   → masaüstünde favorileme imkânsızdı. Kalp SOL-üste, "Popüler" rozeti SOL-ALT'a alınır;
   head bandı tıklamayı GEÇİRİR (yalnız X yakalar) → kalp erişilebilir + üstte. */
@media (min-width:1024px){
  .ud-sheet .ud-head{ pointer-events:none !important; }
  .ud-sheet .ud-kapat{ pointer-events:auto !important; }
  .ud-sheet .ud-kalp{
    left:12px !important; right:auto !important;
    z-index:7 !important; pointer-events:auto !important;
  }
  .ud-sheet .ud-foto-rozet{ top:auto !important; bottom:14px !important; }
}

/* ── P0-3) KİLİTLİ CTA: pointer-events:none KALDIRILIR → görünür disabled + sebep metni ──
   Legacy .ud-ekle.kilit{pointer-events:none} (sat.~1297) tıklamayı yutuyordu → JS guard/toast
   HİÇ çalışmıyordu (ölü buton). Artık tıklanabilir; görünüm nötr koyu "bekleme" (bozuk-gri değil);
   metin JS'te "Zorunlu seçim yapın / N zorunlu seçim kaldı" olur; tık → eksik gruba kaydır+flaş. */
.ud-ekle.kilit{
  pointer-events:auto !important;
  cursor:pointer;
  background:#3A3F4B !important;
  color:#fff !important;
  box-shadow:none !important;
}
@media (hover:hover) and (pointer:fine){
  .ud-ekle.kilit:hover{ background:#2E323C !important; }
}
.ud-ekle.kilit:active{ transform:scale(.98); }
@keyframes udGrupFlash{ 0%,100%{ background:transparent; } 30%,65%{ background:rgba(232,49,42,.13); } }
.ud-grup-flash{ animation:udGrupFlash .6s var(--ez); border-radius:12px; }
.ud-grup-flash .ud-zorunlu{ background:rgba(232,49,42,.24); color:var(--acc-koyu); }
@media (prefers-reduced-motion:reduce){
  .ud-grup-flash{ animation:none; background:rgba(232,49,42,.12); }
}

/* ── P1) GÖREV-KRİTİK & ÖLÜ HOVER/PRESS MOTION (tek cetvel) ──────────────────
   Hover yalnız imleçli cihaz; dokunmatikte yalnız press. Görev-kritik ölüler:
   Kodu Gönder, Telefonla giriş, Takip Et, kalp, yıldız, switch, checkbox. */
@media (hover:hover) and (pointer:fine){
  /* Birincil butonlar (Kodu Gönder / Telefonla giriş / Devam / Sepete ekle / Takip Et):
     algı-altı brightness YERİNE token rengi + gölge → net geri bildirim. */
  .btn-buyuk:not([disabled]):not(.kilit):not(.btn-sade):hover,
  .ud-ekle:not(.kilit):hover,
  .btn-tekrar:hover{
    background:var(--brand-700) !important; color:#fff !important;
    filter:none !important; box-shadow:var(--sh2);
  }
  /* Sade birincil (Yeni Sipariş / Verilerimi indir): nötr tint (kırmızıya dönmez) */
  .btn-buyuk.btn-sade:hover, .btn-sade.veri-btn:hover{
    background:var(--ink-100) !important; border-color:var(--ink-300) !important;
  }
  /* Toggle ikonlar: kalp + yıldız → boyut nefes alır (dolgu rengi değişmez) */
  .r-kalp:hover, .m-kalp:hover, .ud-kalp:hover, .yld:hover{ transform:scale(1.15); }
  /* Switch: M3 state-layer halkası (knob konumunu BOZMADAN — yalnız box-shadow) */
  .switch:hover::after{
    box-shadow:0 2px 6px rgba(40,14,8,.4), inset 0 1px 0 rgba(255,255,255,.8),
               0 0 0 6px rgba(232,49,42,.12);
  }
  /* Checkbox / radio: görünür hover halkası (ödeme onay/adres-kaydet kutuları) */
  input[type=checkbox]:hover, input[type=radio]:hover{
    outline:5px solid var(--ink-100); outline-offset:0; border-radius:4px;
  }
  /* Seçili çipler ÖLÜ kalmasın (.sec de nefes alır) + ölü-altı çip aileleri */
  .wlt-pill.sec:hover, .menu-kat-cip.sec:hover, .bahsis-cip.sec:hover,
  .fs-cip:hover, .pu-cip:hover, .pe-cip:hover{
    background:var(--brand-50) !important;
  }
}
/* Press (tüm cihazlar) — tutarlı dokunma tepkisi */
.btn-buyuk:not([disabled]):active, .ud-ekle:not(.kilit):active, .btn-tekrar:active{ transform:scale(.96); }
.r-kalp:active, .m-kalp:active, .ud-kalp:active{ transform:scale(.85); }
@media (prefers-reduced-motion:reduce){
  .toast .toast-geri, .ud-ekle.kilit, .r-kalp, .m-kalp, .ud-kalp, .yld,
  .btn-buyuk, .btn-tekrar{ transition:none; }
}
/* ═══ /v230 ÖLÜ ETKİLEŞİM ═══ */

/* P0-1 (devam) — Toast HER overlay ustunde: z 60 to 300 (sheet 200, modal 80 altta kalir). */
#toast{ z-index:300 !important; }

/* ════════════════════════════════════════════════════════════════════════════
   v232 — CİLA KATMANI (kategori seçili-halka: dosya-sonu !important savaşını ezer)
   K1 — .chip-foto.chip-foto--png{box-shadow:… !important} (3014/3123/4508) aktif ringi
   siliyordu → seçili chip'te görünür beyaz-offset'li kırmızı halka.
   ════════════════════════════════════════════════════════════════════════════ */
.kat-hucre.aktif .chip-foto,
.kat-hucre.aktif .chip-foto.chip-foto--png{
  box-shadow:0 0 0 2px #fff, 0 0 0 4.5px var(--acc), 0 4px 14px rgba(20,16,14,.14) !important;
}

/* ═══ v234 HEADER — iOS/Android platform uyumu (dünya + denetim ajanları) ═══
   K2: iOS çentik/Dynamic Island + Android status bar → sticky header içeriği safe-area kadar
   aşağı. env(safe-area-inset-top)=0 (çentiksiz cihaz/masaüstü) → GÖRÜNÜM DEĞİŞMEZ; yalnız
   çentikli cihazda içerik status bar altından kurtulur. K4: logo dokunma hedefi 30→44px. */
@media (max-width:1023px){
  .wlt-head{ padding-top: calc(12px + env(safe-area-inset-top)) !important; }
  .ust{ padding-top: calc(11px + env(safe-area-inset-top)) !important; }
  .wlt-logo{ min-height:44px; }   /* görsel logo 30px kalır; tıklama alanı 44px (iOS 44pt / Android'e yakın) */
}

/* ═══ v236 iOS-fix (Küme A) — Profil & Favoriler safe-area ÜST ═══
   Bu ekranlar KEŞİF-tipi olup .ust/.wlt-head çizmiyor; kendi .selam h1 bloğunu çiziyor →
   v234 header safe-area kuralı (yukarı) bunlara ULAŞMIYORDU, içerik 22px'te başlayıp çentik
   altına giriyordu. .selam'a safe-area üst dolgusu ver. env(top)=0 cihazda GÖRÜNÜM DEĞİŞMEZ. */
@media (max-width:1023px){
  body[data-ekran="profil"] .selam,
  body[data-ekran="favoriler"] .selam{ padding-top: env(safe-area-inset-top); }
}

/* ═══ v233 mobil-fix — KONUM SHEET klavye-güvenli ═══
   Sorun (kullanıcı mobilde gördü): mahalle seç sheet'i açılıp arama kutusuna dokununca
   klavye açılıyor, viewport küçülüyor ama sheet 88vh (vh klavyeyle küçülmez) + sonuç
   listesi SABİT yükseklik olduğu için sheet taşıp ARAMA KUTUSU ekran dışına kayıyordu →
   yalnız boş-durum + bulanık zemin kalıyordu. Çözüm: dvh (klavyeyle küçülür) + sonuç
   listesi esnek (kalan alanı doldurur, klavyede küçülür) → arama + başlık DAİMA görünür. */
@media (max-width:1023px){
  /* v257 — SABİT 86dvh yalnız MAHALLE sheet'inde (results listesi olan). Giriş/telefon/filtre/
     sırala sheet'leri KISA içerik → içeriğe göre yükseklik (86dvh tavan); yoksa çoğu beyaz kalıp
     klavyeyle bozuluyordu. :has() modern Android/iOS'ta desteklenir; fallback: max-height korunur. */
  .mh-sheet{ max-height:86dvh !important; }
  .mh-sheet:has(.mh-results){ height:86dvh !important; }
  .mh-results{ flex:1 1 auto !important; min-height:0 !important; height:auto !important; }
}

/* ════════════════════════════════════════════════════════════════════════════
   v234 — MOBİL FOLD + KART KABUĞU (yalnız ≤1023; masaüstü DOKUNULMAZ)
   İŞ1: Kategori 4×2 grid çok yer kaplayıp (≈319px) ilk restoranı fold dışına itiyordu.
        DAİRE KALIR (spec kararı) — yalnız kompaktlaştırıldı: chip 74→66, satır boşlukları
        20→10, margin küçültüldü, "Tümünü göster" 54→46. Aktif-halka (v232) + ≥44px dokunma
        (hücre ~88px yüksek) korunur. → ilk .wf-satir fold içine çekilir.
   İŞ2: .wf-satir düz liste satırıydı (şeffaf, gölgesiz) → gerçek KART kabuğu: beyaz zemin,
        18px radius, yumuşak gölge, bölücü çizgi kalkar. Kapalı restoran gri-tint belirgin.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* — İŞ1: kompakt kategori bloğu (yalnız ANASAYFA grid'i .wlt-mobonly; MODAL grid'e
     dokunulmaz). Chip akışkan (max-width:160!important) + gap 14px!important eski katmanlardan
     geliyordu → daha yüksek özgüllük + !important ile kap: chip 64px, satır boşluğu 10px. */
  .kat-grid.wlt-mobonly{ gap:10px 8px !important; margin-top:8px !important; margin-bottom:6px !important; }
  .kat-grid.wlt-mobonly .kat-hucre .chip-foto{ max-width:64px !important; }
  .kat-grid.wlt-mobonly .kat-hucre{ gap:6px; }
  .kat-grid.wlt-mobonly .kat-hucre span{ font-size:13px; }
  .tumunu-goster{ height:46px; font-size:15px; margin:2px 0 8px; }

  /* — İŞ2: .wf-satir gerçek kart kabuğu — */
  .wf-feed{ gap:0; }
  .wf-satir{
    background:var(--yuzey,#fff);
    border:0;
    border-radius:18px;
    box-shadow:inset 0 0 0 1px rgba(20,12,10,.04),
               0 1px 3px rgba(20,12,10,.05),
               0 6px 18px rgba(20,12,10,.07);
    padding:2px 8px 12px;
    margin-bottom:14px;
    overflow:hidden;
    transition:transform .16s var(--ez,cubic-bezier(.2,.8,.2,1)), box-shadow .16s var(--ez,cubic-bezier(.2,.8,.2,1));
  }
  .wf-satir:last-child{ border-bottom:0; }   /* base last-child none ile tutarlı */
  .wf-satir:active{ transform:scale(.994); box-shadow:inset 0 0 0 1px rgba(20,12,10,.05), 0 1px 3px rgba(20,12,10,.06); }
  .wf-satir .wf-bas{ padding:12px 6px 8px; }
  .wf-satir .wf-urunler{ padding:2px 6px 4px; margin:0; }
  /* v248 — KAPAK HERO (16:9, foto-önce): kart padding'ini (2px üst / 8px yan) negatif margin ile
     taşır → tam kenar. Kart overflow:hidden + 18px radius zaten üst köşeleri kırpar. Yalnız yüklenmiş
     kapağı olan dükkanlarda basılır (musteri.js x.kapak koşulu). Foto varken wf-bas üst boşluğu kısılır. */
  .wf-satir .wf-kapak{ display:block; position:relative; margin:-2px -8px 4px; aspect-ratio:16/9;
    overflow:hidden; background:#F1EDE7; cursor:pointer; }
  .wf-satir .wf-kapak img{ width:100%; height:100%; object-fit:cover; display:block; }
  .wf-satir .wf-kapak + .wf-bas{ padding-top:8px; }
  .wf-satir.wf-kapali .wf-kapak img{ filter:grayscale(.6) brightness(.98); }
  /* kapalı restoran: gri-tint + kapak/logo desatüre + açılış pili belirgin */
  .wf-satir.wf-kapali{ opacity:1; background:#F7F5F2; }
  .wf-satir.wf-kapali .wf-bas{ opacity:.82; }
  .wf-satir.wf-kapali .wf-logo img{ filter:grayscale(.6) brightness(.98); }
  .wf-satir.wf-kapali .wf-urunler{ filter:grayscale(.35); opacity:.9; }
  .wf-acilis{ font-weight:700; color:var(--acc-koyu,#C01E18); }
}

/* rating yıldızı altın (her viewport) — meta hiyerarşisi: puan öne çıkar */
.wf-meta .wf-puan{ font-weight:700; color:var(--ink-700,#4A4543); }
.wf-meta .wf-puan .ico{ color:var(--altin,#D9A441); }

/* ════════════════════════════════════════════════════════════════════════════
   v237 — KOMPAKT ÜST + TEK-SIRA KATEGORİ ŞERİDİ + SCROLL-COLLAPSE HEADER
   (Yemeksepeti mobil deseni · yalnız ≤1023px anasayfa; masaüstü DOKUNULMAZ.)
   İŞ1: 4×2 kategori GRID (~250px, foldu yiyor) → TEK-SIRA yatay kaydırılan yuvarlak
        şerit (~100px). Daireler kalır (aktif-halka v232 korunur), yana kayar, snap,
        scrollbar gizli. Şerit sonunda "Tümü" çipi modalı açar; alttaki büyük
        "Tümünü göster" hap butonu mobilde gizlenir (dikey yer kazanılır).
   İŞ2: Aşağı scroll'da marka satırı (logo + ikon köşe) toparlanıp gizlenir; konum +
        filtre şeridi ince sticky bar kalır (--head-h ResizeObserver ile küçülür →
        .wlt-fbar takip eder). Yukarı scroll'da geri gelir. JS: body.hdr-min.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* — İŞ1: anasayfa mobil kategori ŞERİDİ (tek sıra, yatay kaydırma) — */
  .kat-grid.wlt-mobonly{
    display:flex !important; flex-wrap:nowrap !important;
    grid-template-columns:none !important;
    gap:14px !important; overflow-x:auto !important; overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity; scroll-padding-left:2px;
    scrollbar-width:none;
    margin:6px -2px 8px !important; padding:4px 2px 6px !important;
    scroll-behavior:smooth;
  }
  .kat-grid.wlt-mobonly::-webkit-scrollbar{ display:none; }
  .kat-grid.wlt-mobonly .kat-hucre{
    flex:0 0 auto !important; width:64px; min-width:64px !important; gap:6px !important;
    scroll-snap-align:start;
  }
  .kat-grid.wlt-mobonly .kat-hucre .chip-foto{
    width:58px !important; max-width:58px !important; height:58px !important;
    aspect-ratio:1/1 !important; margin:0 auto !important;
  }
  .kat-grid.wlt-mobonly .kat-hucre span{
    font-size:12.5px !important; line-height:1.2 !important;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:64px; text-align:center;
  }
  /* şerit sonundaki "Tümü" çipi: bej yuvarlak + chevron */
  .kat-grid.wlt-mobonly .kat-tum-hucre .chip-foto--tum{
    width:58px !important; height:58px !important; border-radius:50% !important;
    background:#F2F1EC !important; box-shadow:none !important; overflow:hidden !important;
    display:grid !important; place-items:center; color:var(--ink-900);
  }
  .kat-grid.wlt-mobonly .kat-tum-hucre .chip-foto--tum svg,
  .kat-grid.wlt-mobonly .kat-tum-hucre .chip-foto--tum .ico{ width:24px; height:24px; fill:var(--ink-900); }
  /* alttaki büyük "Tümünü göster" hap butonu mobilde GİZLİ (çip devraldı) */
  .tumunu-goster.wlt-mobonly{ display:none !important; }

  /* — İŞ2 (v238): SCROLL-COLLAPSE — KONUM pill toparlanır; LOGO + arama/profil + FİLTRE KALIR —
     v237 TERS ÇEVRİLDİ. Gerekçe (kullanıcı + araştırma): konumu insanlar oturuma başlarken
     BİR KEZ seçer → aşağı kaydırırken erişimi kritik değil; marka=logo ise kimlik-çıpası,
     her an görünmeli (Uber Eats/Wolt: kaydırınca ikincil bilgi toparlanır, marka+arama kalır).
     AKICI GEÇİŞ FIX: eski blok max-height'i `none`→0 geçiriyordu (auto max-height ANİME ETMEZ →
     "şak diye" sertlik). Artık SAYISAL başlangıç (max-height:64px) + translateY + opacity →
     premium ease-out (cubic-bezier(.4,0,.2,1), ~280ms). Konum satırı yumuşak yukarı toplanır,
     wlt-head kısalır → --head-h ResizeObserver ile .wlt-fbar akıcı yukarı iner. */
  .wlt-konum{
    max-height:64px; overflow:hidden;
    transition:max-height .28s cubic-bezier(.4,0,.2,1),
               opacity .2s cubic-bezier(.4,0,.2,1),
               margin .28s cubic-bezier(.4,0,.2,1),
               padding .28s cubic-bezier(.4,0,.2,1),
               transform .28s cubic-bezier(.4,0,.2,1);
  }
  body.hdr-min .wlt-konum{
    max-height:0 !important; min-height:0 !important; opacity:0 !important;
    margin:0 !important; padding-top:0 !important; padding-bottom:0 !important;
    transform:translateY(-8px); pointer-events:none;
  }
  /* logo collapsed'ta hafif küçülür (premium shrink); marka + arama/profil erişimi KALIR */
  .wlt-logo .ml-logo{ transition:height .28s cubic-bezier(.4,0,.2,1); }
  body.hdr-min .wlt-logo .ml-logo{ height:26px; }
  /* collapsed bar: ince premium his — yumuşak gölge + hafif yuvarlak alt köşe ("ovalimsilik",
     abartısız). fbar sticky-yığının en altı; hairline yerine gölgeye devreder (temiz köşe). */
  .wlt-fbar{
    transition:box-shadow .28s cubic-bezier(.4,0,.2,1),
               border-radius .28s cubic-bezier(.4,0,.2,1);
  }
  .wlt-fbar::after{ transition:opacity .2s ease; }
  body.hdr-min .wlt-fbar{
    box-shadow:0 8px 18px -12px rgba(0,0,0,.18) !important;
    border-bottom-left-radius:14px !important; border-bottom-right-radius:14px !important;
  }
  body.hdr-min .wlt-fbar::after{ opacity:0; }
  @media (prefers-reduced-motion:reduce){
    .wlt-konum, .wlt-logo .ml-logo, .wlt-fbar{ transition:none; }
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   v240 — ANASAYFA RESTORAN KARTI: ÜRÜN GÖRSELİ PREMIUM KENAR + SEPET-BAR ÖRTME
   (yalnız ≤1023 mobil anasayfa/liste; masaüstü ≥1024 DOKUNULMAZ. wf-kucuk/wf-buyuk
   BOYUTLARI değişmez → v233 hizası korunur. Yalnız iç DOLGU/örtme düzeltilir.)
   İŞ1: ürün şeridi "kutu içinde" duruyordu — kart iç dolgusu (8px) + şerit dolgusu
        (6px) = görsel kart kenarından 14px içeride, ekran kenarından 30px. Yemeksepeti/
        Wolt deseni: medya şeridi metinden DAHA GENİŞ, kart iç kenarına yakın (full-bleed
        his). Görsel insetini 14→6px'e indir; başlık metni okunur dolguda (~14px) kalır.
        Kart ekran-kenarı marjı 16px KORUNUR (Yemeksepeti ~12-16). wf-urun köşe/oran/boy
        değişmez → v233 wf-kucuk 99px hizası bozulmaz.
   İŞ2: sepet-bar görünürken .sar (148px) + body.has-sepet-bar (196px) = 344px ÇİFT
        yığın → son kartın altında dev boşluk; .sar tek başına ~5px sınırda. Liste'de
        tek kaynak: içerik bar+nav+~24px nefes kadar dolgu → örtülmez AMA aşırı void yok.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* İŞ1 — ürün görseli kart iç kenarına yaslanır (premium full-bleed his) */
  .wf-satir{ padding-left:6px !important; padding-right:6px !important; }
  .wf-satir .wf-urunler{ padding:2px 2px 6px !important; margin:0 -2px !important; }
  /* başlık metni rahat dolguda kalsın (şeritten hafif içeride = medya-rail genişçe) */
  .wf-satir .wf-bas{ padding-left:8px !important; padding-right:8px !important; }

  /* İŞ2 — liste sepet-bar örtmesi: tek kaynaklı, dengeli alt boşluk (örtme yok, void yok) */
  body[data-ekran="liste"].has-sepet-bar{ padding-bottom:0 !important; }
  body[data-ekran="liste"].sepet-acik .sar{
    padding-bottom:calc(var(--botnav-h) + 112px) !important;  /* nav + bar(79) + gap(8) + ~24 nefes */
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   v241 — FAZ 1: RENK NÖTRALİZE ("KIT KIRMIZI") — MASTER_PREMIUM_UI §1.2/§1.3
   10-rakip oybirliği: kırmızıyı YALNIZ 6 role sınırla (birincil CTA, aktif tab/
   kategori, indirim rozeti, fiyat, ★puan ikonu, aktif alt-nav). Ana sayfada
   DEKORATİF kırmızıyı (gereksiz zemin/kenar/aksan) nötre çek.
   KAPSAM: yalnız ≤1023 mobil → masaüstü ≥1024 DOKUNULMAZ.
   KORUNAN 6 ROL: .wf-indirim/.sl-rozet (indirim), .hz-btn/.rk-cta/.ekle/.sepet-btn
   (CTA), .kat-hucre aktif + .sira-chip.sec (aktif), .m-fiyat/.s-fiyat (fiyat),
   ★ puan ikonu, .botnav .aktif (alt-nav) → HEPSİ KIRMIZI KALIR.
   KİLİTLİ bloklara (pr2-*, v229/v234/v237/v240 header+kart, token 4540) GİRİLMEZ.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* §1.3 — Duyuru banner'ı: dekoratif kırmızı-tint zemin + kırmızı kenar → nötr yüzey.
     (Bilgi notu; 6 rolden değil. Megafon ikonu zaten nötr koyu → kırmızı tamamen kalkar.) */
  .duyuru-banner{
    background:var(--cam-yogun,#fff);
    border-color:var(--ink-200,#E5E1DE);
  }

  /* §1.3 — "Her zamanki" kartı: TEK accent = kırmızı BUTON (.hz-btn, CTA rolü KALIR).
     Sol dekoratif aksan şeridini kırmızıdan çıkar → sıcak amber→altın (ikinci kırmızı vurgu YOK). */
  .hz-kart::before{
    background:linear-gradient(180deg, var(--amber,#F0A500), var(--star,#DE9B53));
  }

  /* §1.3 (sat.569 atıf) — Mesafe rozeti (.r-km, Favoriler kartı): kalın kırmızı kenar +
     kırmızı PIN → nötr hairline + gri pin. Meta gri kalır; kırmızı yalnız ★/rozet/CTA'da. */
  .r-rozet.r-km{
    border-color:var(--ink-200,#E5E1DE);
  }
  .r-rozet.r-km::before{
    background:var(--ink-500,#7A736F);
    box-shadow:none;
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   v242 — FAZ 2: KART PREMIUM RAFİNE — MASTER_PREMIUM_UI §3.2/§3.3
   (A) Tek-satır ikon-meta ⭐·⏱·💶 (moped ücret · clock süre · star puan) — JS'te clock
       ikonu eklendi. Hiyerarşi RENKLE değil AĞIRLIKLA: ad 800 > puan 700 > meta 500 gri.
   (B) Swiggy imza deseni: ürün görseli ALTINA koyu→şeffaf gradient-overlay + üstüne
       beyaz fiyat/teklif metni (üst beyaz-cam pill → gömülü beyaz metin). AA: gradient
       koyuluğu (.74) + text-shadow → beyaz metin okunur.
   (C) TEK kırmızı rozet: kart başındaki .wf-indirim (kampanya, DOLGU+beyaz metin) korunur;
       görsele ikinci kırmızı EKLENMEZ (v241 kıt-kırmızı disiplini).
   KAPSAM: yalnız ≤1023 mobil. v240 görsel-kenar (inset) + v233 boyut (wf-buyuk 282×208 /
   wf-kucuk 99px) DEĞİŞMEZ — bu blok yalnız gradient+etiket-tipografi+meta rafine eder.
   Masaüstü ≥1024 (330×186 + beyaz-cam pill .wf-et) DOKUNULMAZ.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* (B) Swiggy gömülü-fırsat gradient — foto::after (wf-et'in ALTINA boyar, DOM sırası) */
  .wf-satir .wf-urun-foto{ position:relative; }
  .wf-satir .wf-urun-foto::after{ content:''; position:absolute; inset:auto 0 0 0; height:60%;
    background:linear-gradient(0deg, rgba(18,11,9,.74), rgba(18,11,9,.30) 45%, transparent);
    pointer-events:none; }
  /* etiket: beyaz-cam pill → gradient üstünde gömülü beyaz metin (fiyat/teklif) */
  .wf-satir .wf-et{ top:auto; bottom:9px; left:12px; right:12px; max-width:calc(100% - 24px);
    background:none; -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:none;
    padding:0; color:#fff; font-weight:700; letter-spacing:-.1px;
    text-shadow:0 1px 3px rgba(0,0,0,.72), 0 1px 8px rgba(0,0,0,.45); }
  .wf-satir .wf-et-fy{ font-weight:800; color:#fff; }
  .wf-satir .wf-kucuk .wf-et{ bottom:7px; left:10px; right:10px; }

  /* (A) tek-satır ikon-meta — ağırlıkla hiyerarşi (renk yerine) */
  .wf-satir .wf-meta{ font-weight:500; color:var(--ink-500,#7A736F); }
  .wf-satir .wf-meta .wf-puan{ font-weight:700; }
}


/* ════════════════════════════════════════════════════════════════════════════
   v243 — FAZ 3: KÜRATÖRLÜ YATAY ŞERİTLER (swimlane) — MASTER_PREMIUM_UI §2.2/§2.3/§3.2
   10-rakip oybirliği: amaç-etiketli yatay şeritler keşif + tekrar-sipariş dönüşümü.
   Foto-önce .sl-kart (Faz 2 gradient-overlay kart dili); scroll-snap yatay şerit.
   Şerit sayısı JS'te 2-3 ile sınırlı; <2 kart üreten şerit hiç çizilmez (boş-carousel yasağı).
   KAPSAM: YALNIZ ≤1023 mobil ana sayfa. Masaüstü ≥1024 → şerit GİZLİ, DEĞİŞMEZ.
   KİLİTLİ (v229/v234/v237/v240 header+kategori+kart, .pr2-*, token 4540 AA) selectorlarına
   GİRİLMEZ; .sl-* AYRI additive selector. Kırmızı yalnız DOLGU .sl-rozet (indirim, AA beyaz).
   ════════════════════════════════════════════════════════════════════════════ */
@media (min-width:1024px){ .sl-raf{ display:none !important; } }   /* masaüstü: şerit yok — desktop DOKUNULMAZ */
@media (max-width:1023px){
  .sl-raf{ margin:2px 0 4px; }
  .sl-serit{ display:flex; gap:12px; overflow-x:auto; padding:2px 2px 12px;
    scrollbar-width:none; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
    scroll-padding-left:2px; scroll-behavior:smooth; }
  .sl-serit::-webkit-scrollbar{ display:none; }
  .sl-kart{ flex:0 0 auto; width:256px; scroll-snap-align:start; text-align:left; cursor:pointer;
    background:var(--yuzey,#fff); border:1px solid var(--ink-100,#F3F1EF); border-radius:16px;
    overflow:hidden; padding:0; display:block; -webkit-appearance:none; appearance:none;
    box-shadow:0 1px 4px rgba(20,12,10,.07), 0 4px 14px rgba(20,12,10,.06);
    transition:transform .12s ease, box-shadow .2s ease; }
  .sl-kart:active{ transform:scale(.985); }
  .sl-medya{ position:relative; display:grid; place-items:center; aspect-ratio:16/9; background:#EFE9DF; }
  .sl-medya img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
  .sl-medya-bos{ font-size:34px; line-height:0; color:var(--ink-300,#C9C3BF); opacity:.7; }
  .sl-medya-bos svg,.sl-medya-bos .ico{ width:34px; height:34px; }
  /* Swiggy gömülü-fırsat gradient (ayrı badge değil) */
  .sl-medya::after{ content:''; position:absolute; inset:auto 0 0 0; height:52%;
    background:linear-gradient(0deg, rgba(20,12,10,.62), transparent); pointer-events:none; z-index:1; }
  .sl-firsat{ position:absolute; left:10px; bottom:8px; z-index:2; color:#fff; font-weight:800;
    font-size:13px; text-shadow:0 1px 3px rgba(0,0,0,.5); }
  /* TEK küçük kırmızı DOLGU rozet (sol-üst) — beyaz metin (v232 AA güvenli) */
  .sl-rozet{ position:absolute; left:8px; top:8px; z-index:2; background:var(--acc,#E8312A);
    color:#fff; font-weight:800; font-size:11.5px; padding:3px 8px; border-radius:var(--r-pill,999px);
    box-shadow:0 2px 8px rgba(232,49,42,.3); max-width:calc(100% - 16px);
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .sl-govde{ padding:10px 12px 12px; display:block; }
  .sl-ust{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
  /* Ağırlıkla hiyerarşi (renkle değil): ad 800 > puan 700 > meta 500 gri */
  .sl-ad{ font-size:15.5px; font-weight:800; color:var(--ink-900,#1A1817); line-height:1.25;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1 1 auto; }
  .sl-puan{ flex:0 0 auto; font-size:13px; font-weight:700; color:var(--ink-900,#1A1817);
    display:inline-flex; align-items:center; gap:3px; }
  .sl-puan svg,.sl-puan .ico{ width:13px; height:13px; color:#F0A500; }   /* ★ ikonu vurgu; sayı nötr */
  .sl-meta{ margin-top:5px; font-size:12.5px; font-weight:500; color:var(--ink-500,#7A736F);
    display:flex; align-items:center; gap:5px; white-space:nowrap; overflow:hidden; }
  .sl-meta svg,.sl-meta .ico{ width:13px; height:13px; flex:0 0 auto; }
  @media (prefers-reduced-motion:reduce){ .sl-kart{ transition:none; } .sl-kart:active{ transform:none; } }
}


/* ════════════════════════════════════════════════════════════════════════════
   v244 — FAZ 4: MİKRO-ETKİLEŞİMLER ("şak" hissi) — MASTER_PREMIUM_UI §4
   10-rakip oybirliği: mikro-etkileşim = premium algının son katmanı. HEPSİ ADDITIVE,
   düşük risk, davranış DEĞİŞTİRMEZ (yalnız görsel/geçiş cila). Sepet/ekle-çıkar mantığı
   DOKUNULMAZ — §4.1 morph yalnız yeniden-render'lı sayaca giriş animasyonu ekler.
   KAPSAM: YALNIZ ≤1023 mobil. Masaüstü ≥1024 DEĞİŞMEZ. Global reduced-motion killer
   (sat.350 *{animation:none;transition:none}) zaten hepsini kapatır; ayrıca her blokta
   açık @media (prefers-reduced-motion:reduce) guard tekrarlanır (belt-and-suspenders).
   KİLİTLİ (v229/v234/v237/v239/v240, .pr2-*, token 4540 AA) selectorları yeniden yazılmaz.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* §4.1 — Yerinde "+" → adet sayacı morph (Getir imzası).
     urunEkle() re-render'ından SONRA JS .adet'e .morph-in ekler → sayaç yaylanarak açılır.
     Sepet mantığı aynı; class yoksa (fallback) mevcut anlık geçiş devreye girer. */
  .m-kart .adet.morph-in{ animation:adetMorph .24s cubic-bezier(.34,1.56,.64,1); transform-origin:right center; }   /* v284 fit-motor — descendant (footer) */

  /* §4.2 — tap-scale (basış geri bildirimi). Eksik kartlara eklenir; mevcutlar korunur.
     .sl-kart:active (v243), .wf-satir:active (sat.3957), .kat-hucre:active .chip-foto (sat.2915),
     .ekle:active (sat.206) ZATEN var → burada yalnız .reorder-kart eklenir (yalnız :hover'ı vardı). */
  .reorder-kart{ transition:transform .12s ease, box-shadow .2s ease; }
  .reorder-kart:active{ transform:scale(.985); }

  /* §4.3 — Shimmer skeleton (v233 iskelet krem ailesi #EFE9DF ile ton uyumlu).
     .sl-kart.iskelet → boş beyaz yerine parıltı. Additive; JS iskelet emit ederse hazır. */
  .sl-kart.iskelet{ pointer-events:none; }
  .sl-kart.iskelet .sl-medya,
  .sl-kart.iskelet .sl-ad,
  .sl-kart.iskelet .sl-puan,
  .sl-kart.iskelet .sl-meta{
    background:linear-gradient(100deg,#EFE9DF 30%,#F7F3EC 50%,#EFE9DF 70%);
    background-size:200% 100%; animation:slShimmer 1.3s infinite linear; color:transparent !important;
    border-radius:8px; }
  .sl-kart.iskelet .sl-medya{ border-radius:0; }
  .sl-kart.iskelet .sl-medya img,
  .sl-kart.iskelet .sl-rozet,
  .sl-kart.iskelet .sl-firsat,
  .sl-kart.iskelet .sl-medya::after{ display:none !important; }
  .sl-kart.iskelet .sl-ad{ height:15px; width:70%; }
  .sl-kart.iskelet .sl-puan{ height:15px; width:34px; }
  .sl-kart.iskelet .sl-meta{ height:13px; width:82%; margin-top:7px; }

  /* §4.4 — Carousel/şerit snap yumuşatma (proximity + smooth). .sl-serit zaten smooth (v243);
     .reorder-serit'e mobilde ekle (desktop dokunma → yalnız ≤1023 kapsamında). */
  .reorder-serit{ scroll-behavior:smooth; scroll-padding-left:2px; -webkit-overflow-scrolling:touch; }

  @media (prefers-reduced-motion:reduce){
    .m-kart .adet.morph-in{ animation:none; }   /* v284 fit-motor */
    .reorder-kart{ transition:none; }
    .reorder-kart:active{ transform:none; }
    .sl-kart.iskelet .sl-medya,
    .sl-kart.iskelet .sl-ad,
    .sl-kart.iskelet .sl-puan,
    .sl-kart.iskelet .sl-meta{ animation:none; }
    .reorder-serit,.sl-serit{ scroll-behavior:auto; }
  }
}
/* keyframes (global — yalnız ≤1023 kurallarınca referanslanır) */
@keyframes adetMorph{ from{ transform:scale(.7); opacity:0 } to{ transform:scale(1); opacity:1 } }
@keyframes slShimmer{ from{ background-position:200% 0 } to{ background-position:-200% 0 } }

/* ════════════════════════════════════════════════════════════════════════════
   v245 — FAZ 5: SEPET + CHECKOUT + PROFİL premium rafine (kıt-kırmızı taşıma)
   MASTER_PREMIUM_UI §1.2/§1.3 dilini ana sayfadan bu 3 ekrana taşır. Yalnız GÖRSEL
   dil — sepet/ödeme/ekle-çıkar MANTIĞI DEĞİŞMEZ (davranış selectorlarına dokunulmaz).
   İLKE: kırmızı YALNIZ fiyat / CTA / aktif-seçim / indirim / adet-vurgu rollerinde.
   Dekoratif kırmızıyı (form-alan ikon diskleri, çöp butonu, profil ikon diskleri,
   "Yakında" etiketi, tekrar-eden adet çarpanı) NÖTRE çeker; hiyerarşi RENKLE değil
   AĞIRLIKLA kurulur. Aktif/odak/seçili durumda kırmızı GERİ gelir (sinyal korunur).
   KAPSAM: YALNIZ ≤1023 mobil → masaüstü ≥1024 HİÇ görmez (kilitli). AA korunur
   (nötr disk + ink-500 ikon, kırmızı metin yalnız --acc-koyu #C01E18 ≥4.5:1).
   KİLİTLİ (v229/v234/v236 iOS/v240/v241-244, .pr2-*, token 4540 AA) selectorları
   yeniden yazılmaz; hepsi mevcut kurala eşit/az-üstün spesifiklikle SON-kaynak override.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* ── SEPET ── */
  /* Çöp/sil butonu: kırmızı rol DEĞİL → nötr disk + gri ikon (hairline). Kırmızı yalnız
     :active'te (yıkıcı geri bildirim) döner. Dokunma 42px korunur. */
  .s-sil{ background:var(--ink-100,#F3F1EF); color:var(--ink-500,#7A736F);
    border-color:var(--ink-200,#E5E1DE); }
  .s-sil:active{ background:rgba(232,49,42,.14); color:var(--acc-koyu,#C01E18); transform:scale(.86); }
  /* Ürün adı near-black (ağırlıkla hiyerarşi); fiyat kırmızı KALIR (fiyat rolü). */
  .s-satir .s-ad{ color:var(--ink-900,#1A1817); }

  /* ── CHECKOUT (Sipariş Bilgileri) ── */
  /* Form-alan ikon diskleri: resting NÖTR (dekoratif kırmızı yığını kalkar). Odaklanınca
     kırmızı döner (mevcut .ode-satir:focus-within .os-ik, spesifiklik 0,3,0 → korunur). */
  .os-ik{ background:var(--ink-100,#F3F1EF); color:var(--ink-500,#7A736F); }
  /* Ödeme yöntemi ikonu: SEÇİLİ değilse nötr; .secili/.checked .oik (0,3,0) kırmızı KALIR. */
  .odeme-opt .oik{ background:var(--ink-100,#F3F1EF); color:var(--ink-500,#7A736F); }
  /* "Yakında" etiketi: devre-dışı seçeneği kırmızıyla vurgulamak yanlış → nötr gri pill. */
  .odeme-opt .oyakinda{ color:var(--ink-500,#7A736F); background:var(--ink-100,#F3F1EF);
    border-color:var(--ink-200,#E5E1DE); }
  /* Özet adet çarpanı ("2×"): kırmızı→bold near-black (ağırlıkla hiyerarşi). "4 ürün"
     rozeti + Toplam fiyatı kırmızı KALIR (adet-rozet + fiyat rolleri). */
  .ode-ozet .oz-ad b{ color:var(--ink-900,#1A1817); }

  /* ── PROFİL ── */
  /* Kısayol satır ikon diskleri (6 sıralı): nav ikonu kırmızı rol DEĞİL → nötr disk + gri
     ikon. Sayaç rozeti (.pl-say, adet) kırmızı KALIR. Kart dili tutarlı + tap-scale. */
  .profil-link .pl-ik{ background:var(--ink-100,#F3F1EF); color:var(--ink-700,#4A4543); }
  .profil-link{ transition:background .14s, transform .12s ease; }
  .profil-link:active{ transform:scale(.985); }
  /* selam başlık hiyerarşisi zaten 800 near-black (v-önceki); dokunulmaz. */

  @media (prefers-reduced-motion:reduce){
    .profil-link:active{ transform:none; }
    .s-sil:active{ transform:none; }
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   v246 iOS-fix (KÜME D-P2 + KÜME G) — CİLA: <44pt dokunma hedefleri görünmez-tampon
   ile ≥44px'e çıkar (GÖRSEL boyut değişmez), checkout ölü alt-boşluk, boş-durum
   dikey-ortalama. KAPSAM: yalnız ≤1023 mobil → masaüstü ≥1024 DOKUNULMAZ.
   Görünmez-tampon deseni v232/v233 referans (.pr2-dot::before, .yld::before).
   KİLİTLİ bloklar (v229/v234/v236/v237-238/v239/v240/v241-245, .pr2-* görsel,
   token 4540 AA) değer-değiştirilmez; yalnız dokunma isabet-alanı eklenir. AA korunur.
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width:1023px){
  /* 1a — ÖDEME FORM GİRDİLERİ (#f_ad/#f_tel/#f_paraustu/#f_not): görünür ~19px satır →
     input'un KENDİ isabet kutusu dolgu ile büyür, negatif margin ile layout aynen korunur
     (metin konumu, satır yüksekliği DEĞİŞMEZ; input arka planı şeffaf → görünüm birebir).
     textarea (#f_adres/#f_not-uzun) 52px+ zaten uygun → yalnız input hedeflenir. */
  /* v396 — ETİKET BİNDİRME FIX: eski negatif-margin (margin-top:-13px) hit-area hilesi input
     kutusunu etiketin üstüne çekip odaklıyken "Ad Soyad" etiketini "Recep Aşık" değerinin ÜSTÜNE
     bindiriyordu. Negatif margin kaldırıldı; dokunma hedefi zaten .ode-satir padding'i + <label>
     ile sağlanıyor. Etiket-değer arası 8px açıldı → bindirme biter, layout aşağı ~7px uzar. */
  .os-ic{ gap:8px; }
  .os-ic input{ padding-top:10px; padding-bottom:10px; margin-top:0; margin-bottom:0; }

  /* 1b — TEMASSIZ + PROFİL SWITCH'leri (#temassizBtn / .switch, görsel 52×31): görünmez
     ::before tampon dikey +14px → 45px isabet; knob (::after) ve görünüm dokunulmaz. */
  .switch{ position:relative; }
  .switch::before{ content:''; position:absolute; inset:-7px 0; }

  /* 1c — MAHALLE GPS butonu (#mhsGps/.mh-gps-ic, görsel 38px daire): ::before tampon
     -4px → 46px isabet; daire görseli 38px kalır. */
  .mh-gps-ic{ position:relative; }
  .mh-gps-ic::before{ content:''; position:absolute; inset:-4px; border-radius:50%; }

  /* 1d — HEADER "Milas" pill (#ustSehir, role=button, görsel 61×29): ::before tampon
     dikey +18px → 47px isabet. v234 header GÖRSELİNE dokunulmaz, yalnız dokunma alanı. */
  #ustSehir{ position:relative; }
  #ustSehir::before{ content:''; position:absolute; inset:-9px -2px; }

  /* 1e — PROMO "Keşfet" CTA (.pr2-cta, görsel min-height:40px): ::before tampon dikey +6px
     → 46px isabet. .pr2 GÖRSELİ (renk/dolgu/konum) DEĞİŞMEZ (kilitli .pr2-* değeri korunur).
     Tampon .pr2-ic dolgusu içinde kalır → .pr2-kart overflow:hidden onu kırpmaz. */
  .pr2-cta{ position:relative; }
  .pr2-cta::before{ content:''; position:absolute; inset:-3px 0; }

  /* 2 — CHECKOUT ÖLÜ ALT-BOŞLUK: botnav ödemede GİZLİ (NAV_GIZLI={menu,odeme}) → global
     body padding-bottom:124px ödemede ~124px ölü void bırakıyor. Home-indicator için
     ~28px yeter; "Siparişi Ver" CTA inline + erişilebilir kalır, gereksiz void gider. */
  body[data-ekran="odeme"]{ padding-bottom:calc(28px + env(safe-area-inset-bottom)); }

  /* 3 — BOŞ DURUM (Favoriler / Siparişlerim / Profil) DİKEY-ORTALAMA: .bos içerik zaten
     flex-center (v232) ama min-height:60vh header'ın hemen ALTINA çapalı → içerik üst-yarıda,
     altta dev void (contentCenter 346 vs vpCenter 422). İki adım:
     (a) BOŞ durumda (yalnız .bos var, liste YOK → :has ile ayırt) global 124px alt-dolguyu
         28px'e indir: botnav fixed olduğundan boş ekranda geniş pay gereksiz, bu pay ortalamayı
         yiyordu. Liste DOLU iken (.bos yok) :has FALSE → 124px korunur, son kart botnav altına girmez.
     (b) .bos min-height'i gerçek boşluğa çıkar → içerik viewport ortasına oturur (offCenter ~±15px),
         serbest kalan dikey pay (a ile) sayesinde dikey scroll OLUŞMAZ.
     Sepet (fixed CTA-bar'lı) boş durumu KAPSAM DIŞI (farklı yerleşim). */
  body[data-ekran="favoriler"]:has(.bos:not(.ode-mahalle)),
  body[data-ekran="gecmis"]:has(.bos:not(.ode-mahalle)),
  body[data-ekran="profil"]:has(.bos:not(.ode-mahalle)){
    padding-bottom:calc(28px + env(safe-area-inset-bottom));
  }
  body[data-ekran="favoriler"] .bos:not(.ode-mahalle),
  body[data-ekran="gecmis"] .bos:not(.ode-mahalle),
  body[data-ekran="profil"] .bos:not(.ode-mahalle){
    min-height:calc(100dvh - 196px - env(safe-area-inset-bottom));
  }
}

/* ===================================================================== */
/*  v251 — AÇILIŞ KARŞILAMA "Canlı Köz Sahnesi" (3B derinlik + canvas)    */
/*  Tam-ekran sinematik sahne: koyu köz zemini + hareketli mesh blob +    */
/*  canvas köz parçacıkları (derinlik/bokeh) + buğu + kabarık logo rozeti.*/
/*  Logo krem rozet üzerinde → kırmızı-üstü-kırmızı karışması ÇÖZÜLDÜ.    */
/*  Global prefers-reduced-motion guard (* {animation:none}) hareketi     */
/*  kapatır; .ob3-rise için altta ayrıca opacity:1 zorlanır (görünürlük). */
/* ===================================================================== */
.mh-overlay.ob-tam{ background:transparent; -webkit-backdrop-filter:none; backdrop-filter:none; align-items:stretch; }
.ob-v3{ position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center;
  background:#140503; color:#fff; overflow:hidden;
  font-family:'Manrope','Inter',-apple-system,BlinkMacSystemFont,sans-serif; }
.ob-v3.ob3-cikis{ animation:ob3Cikis .28s cubic-bezier(.4,0,1,1) both; }
@keyframes ob3Cikis{ from{opacity:1} to{opacity:0} }

.ob3-stage{ position:relative; width:100%; height:100%; overflow:hidden; isolation:isolate; }

/* Katman 0 — derin fırın zemini */
.ob3-base{ position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(80% 55% at 22% 46%, rgba(255,120,70,.28), rgba(255,120,70,0) 60%),
    radial-gradient(120% 80% at 50% 118%, #FF6A3D 0%, #E8312A 16%, #9d1610 38%, #3c0a07 66%, #140503 100%); }
/* Katman 1 — hareketli köz mesh blob'ları (arka parallax) */
.ob3-mesh{ position:absolute; inset:-20%; z-index:1; filter:blur(42px); opacity:.85; pointer-events:none; }
.ob3-blob{ position:absolute; border-radius:50%; mix-blend-mode:screen; will-change:transform; }
.ob3-blob.b1{ width:60%; height:40%; left:-6%; top:8%; background:radial-gradient(circle,#F04A3F,rgba(240,74,63,0)); animation:ob3Drift1 15s ease-in-out infinite; }
.ob3-blob.b2{ width:70%; height:46%; right:-14%; top:30%; background:radial-gradient(circle,#FF6A3D,rgba(255,106,61,0)); animation:ob3Drift2 19s ease-in-out infinite; }
.ob3-blob.b3{ width:80%; height:52%; left:-8%; bottom:-6%; background:radial-gradient(circle,#C21E17,rgba(194,30,23,0)); animation:ob3Drift3 17s ease-in-out infinite; }
@keyframes ob3Drift1{ 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(7%,5%) scale(1.12)} }
@keyframes ob3Drift2{ 0%,100%{transform:translate(0,0) scale(1)} 50%{transform:translate(-8%,-4%) scale(1.15)} }
@keyframes ob3Drift3{ 0%,100%{transform:translate(0,0) scale(1.05)} 50%{transform:translate(5%,-6%) scale(1)} }
/* Katman 2 — canvas köz parçacık uzayı */
.ob3-spark{ position:absolute; inset:0; z-index:2; width:100%; height:100%; display:block; pointer-events:none; }
/* Katman 3 — yemek buğusu (ön parallax) */
.ob3-steam{ position:absolute; inset:0; z-index:3; pointer-events:none; overflow:hidden; }
.ob3-sm{ position:absolute; bottom:-30%; border-radius:50%;
  background:radial-gradient(circle at 50% 40%, rgba(255,228,205,.28), rgba(255,180,140,.09) 45%, rgba(255,180,140,0) 70%);
  filter:blur(18px); will-change:transform,opacity; }
.ob3-sm.s1{ width:200px; height:260px; left:8%;  animation:ob3Rise 11s ease-in infinite; }
.ob3-sm.s2{ width:260px; height:340px; left:44%; animation:ob3Rise 14s ease-in infinite 3s; }
.ob3-sm.s3{ width:170px; height:230px; left:70%; animation:ob3Rise 12.5s ease-in infinite 6s; }
@keyframes ob3Rise{ 0%{transform:translateY(0) scale(.7);opacity:0} 18%{opacity:.9} 100%{transform:translateY(-118vh) scale(1.5);opacity:0} }
/* Sinema vinyeti */
.ob3-vig{ position:absolute; inset:0; z-index:4; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(10,3,2,.55) 0%, rgba(10,3,2,0) 26%),
    linear-gradient(0deg, rgba(8,2,1,.78) 0%, rgba(8,2,1,0) 40%),
    radial-gradient(130% 90% at 50% 40%, rgba(0,0,0,0) 55%, rgba(0,0,0,.5) 100%); }

/* Kapat (X) */
.ob3-x{ position:absolute; top:calc(env(safe-area-inset-top) + 12px); right:14px; z-index:7;
  width:38px; height:38px; border-radius:50%; display:grid; place-items:center; cursor:pointer;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); color:#fff;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.ob3-x .ico{ width:19px; height:19px; }
.ob3-x:active{ transform:scale(.92); }

/* İçerik */
.ob3-content{ position:absolute; inset:0; z-index:5; display:flex; flex-direction:column; align-items:center;
  padding:calc(env(safe-area-inset-top) + 6vh) 26px calc(env(safe-area-inset-bottom) + 24px);
  text-align:center; overflow-y:auto; -webkit-overflow-scrolling:touch; }

.ob3-badge-wrap{ position:relative; width:126px; height:126px; margin-bottom:18px; flex:0 0 auto;
  animation:ob3Breathe 5.2s ease-in-out infinite; will-change:transform; }
@keyframes ob3Breathe{ 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-5px) scale(1.035)} }
.ob3-halo{ position:absolute; inset:-30%; border-radius:50%; z-index:-1;
  background:conic-gradient(from 0deg, rgba(255,180,120,0), rgba(255,150,90,.85), rgba(255,90,60,.15), rgba(255,180,120,0) 70%);
  filter:blur(16px); animation:ob3Spin 7s linear infinite; }
@keyframes ob3Spin{ to{transform:rotate(360deg)} }
.ob3-halo2{ position:absolute; inset:-10%; border-radius:50%; z-index:-1;
  background:radial-gradient(circle, rgba(255,200,150,.5), rgba(255,120,80,0) 68%); animation:ob3Pulse 5.2s ease-in-out infinite; }
@keyframes ob3Pulse{ 0%,100%{opacity:.55;transform:scale(1)} 50%{opacity:.95;transform:scale(1.1)} }
.ob3-badge{ position:absolute; inset:0; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 38% 30%, #FFFFFF 0%, #FFF6EC 42%, #FCE7CF 74%, #F4CFA6 100%);
  box-shadow:inset 0 4px 8px rgba(255,255,255,.95), inset 0 -12px 22px rgba(150,70,30,.42), inset 0 0 0 3px rgba(255,255,255,.55), 0 18px 34px rgba(70,10,4,.6), 0 4px 10px rgba(120,20,10,.55); }
.ob3-badge::after{ content:""; position:absolute; left:14%; top:8%; width:60%; height:38%; border-radius:50%;
  background:radial-gradient(circle at 50% 20%, rgba(255,255,255,.9), rgba(255,255,255,0) 70%); filter:blur(2px); pointer-events:none; }
.ob3-badge img{ width:63%; height:63%; object-fit:contain; filter:drop-shadow(0 4px 6px rgba(120,30,10,.4)); }

.ob3-brand{ font-size:31px; font-weight:800; letter-spacing:-.5px; margin-top:2px; flex:0 0 auto;
  text-shadow:0 2px 14px rgba(0,0,0,.5), 0 1px 0 rgba(255,190,150,.35); }
.ob3-loc{ display:inline-flex; align-items:center; gap:5px; margin-top:7px; flex:0 0 auto;
  font-size:13px; font-weight:700; color:#FFE3D2;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.22); padding:4px 13px 4px 10px; border-radius:999px;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.ob3-loc .ico{ width:14px; height:14px; }

.ob3-spacer{ flex:0 0 auto; height:clamp(20px, 3.5vh, 40px); }   /* v437 Tur 4 İŞ-1: flex:1 1 auto artan TÜM alanı tek noktaya döküyordu (390x844'te rozet altında 104px delik). Artan alan artık .ob3-content'te eşit dağılıyor. */

.ob3-headline{ font-size:26px; line-height:1.18; font-weight:800; letter-spacing:-.3px; flex:0 0 auto;
  text-shadow:0 3px 18px rgba(0,0,0,.55); }
.ob3-headline b{ color:#FFD7A8; }
.ob3-slogan{ margin-top:10px; font-size:14px; line-height:1.5; color:#FCE0D3; max-width:300px; flex:0 0 auto; }

.ob3-feats{ list-style:none; margin:19px 0 2px; padding:0; width:100%; max-width:320px; display:flex; flex-direction:column; gap:10px; flex:0 0 auto; }
.ob3-feat{ display:flex; align-items:center; gap:13px; text-align:left;
  background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.18); border-radius:16px; padding:11px 14px;
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 8px 22px rgba(60,8,4,.35); }
.ob3-ic{ flex:0 0 40px; width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center; color:#fff;
  background:radial-gradient(circle at 35% 25%, #FF7E4E, #E8312A 75%, #B01810);
  box-shadow:inset 0 2px 3px rgba(255,255,255,.5), 0 5px 12px rgba(150,20,10,.5); }
.ob3-ic .ico{ width:21px; height:21px; }
.ob3-tx{ font-size:14px; font-weight:700; color:#fff; }
.ob3-tx small{ display:block; font-weight:500; font-size:12px; color:#FBD6C6; margin-top:1px; }

.ob3-cta{ width:100%; max-width:320px; margin:20px 0 0; border:0; cursor:pointer; color:#fff;
  font-size:16px; font-weight:800; padding:16px 20px; border-radius:16px; flex:0 0 auto; position:relative; overflow:hidden;
  background:linear-gradient(160deg,#F04A3F,#E8312A 46%,#C21E17);
  box-shadow:0 12px 26px rgba(200,25,15,.5), inset 0 1px 0 rgba(255,255,255,.4), inset 0 -3px 8px rgba(120,10,5,.55); }
/* v437 Tur 4 İŞ-5 — İKİ ANİMASYON KALDIRILDI (ölçülebilir maliyet, ölçülemez çıktı):
   • ob3CtaGlow `box-shadow` animasyonluyordu → HER KAREDE PAINT. Üstelik ölçülen gölge
     sayısını tek başına şişiriyordu (iki farklı computed shadow).
   • ob3Sheen `left` animasyonluyordu → HER KAREDE LAYOUT. Ders kitabı jank.
   Hedef kitle orta-alt segment Android; ilk kare bütçesi bunlara harcanamaz.
   SAHNE ÖLMEDİ: mesh blob (ob3Drift1/2/3), buğu (ob3Rise), rozet nefesi (ob3Breathe),
   halo (ob3Spin/ob3Pulse) DURUYOR — hepsi transform/opacity, yani compositor'da.
   Canlı Köz canvas motoru da DURUYOR (v251 kullanıcı onaylı; sormadan kaldırılmaz). */
.ob3-cta:active{ transform:translateY(1px) scale(.99); }
.ob3-skip{ margin-top:12px; background:none; border:0; cursor:pointer; color:#FBD6C6; font-size:13px; font-weight:600; opacity:.85; letter-spacing:.2px; flex:0 0 auto; }
.ob3-skip:active{ opacity:1; }

/* Kademeli giriş */
.ob3-rise{ opacity:0; transform:translateY(16px); animation:ob3RiseIn .8s cubic-bezier(.22,.9,.3,1) forwards; }
.ob3-rise.d1{ animation-delay:.15s } .ob3-rise.d2{ animation-delay:.3s } .ob3-rise.d3{ animation-delay:.42s }
.ob3-rise.d4{ animation-delay:.54s } .ob3-rise.d5{ animation-delay:.66s } .ob3-rise.d6{ animation-delay:.78s } .ob3-rise.d7{ animation-delay:.9s }
@keyframes ob3RiseIn{ to{opacity:1; transform:translateY(0)} }

/* Hareket azalt — global guard animasyonu keser; ob3-rise görünür kalsın */
@media (prefers-reduced-motion:reduce){ .ob3-rise{ opacity:1 !important; transform:none !important; } }

/* MASAÜSTÜ — sahne ortalanmış sinematik kart (kenarlar koyu letterbox) */
@media (min-width:768px){
  .ob3-stage{ width:min(430px, 96vw); height:min(880px, 94vh); border-radius:28px;
    box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.06); }
}
/* Açılış logosu optik ortalama: mark PNG'nin "d" ağırlığı sağ-altta → hafif sola+yukarı nudge + biraz küçült */
.ob3-badge img{ width:58%; height:58%; transform:translate(-1.5%, -2%); }

/* ===================================================================== */
/*  v252 — FAVORİ KALP DOLGU DÜZELTMESİ (gerçek bug)                      */
/*  'heart' ikonunun <path fill="none"> presentation-attribute'u, svg'ye  */
/*  verilen CSS fill'ini eziyordu → kalp ASLA dolmuyordu. CSS path'i      */
/*  doğrudan hedefleyince presentation-attribute'u yener → dolgu çalışır. */
/* ===================================================================== */
.r-kalp.dolu .ico path, .rh-kalp.dolu .ico path, .m-kalp.dolu .ico path,
.m-kalp-rest.dolu .ico path, .ud-kalp.dolu .ico path{
  fill:var(--kirmizi,#E8312A) !important; stroke:var(--kirmizi,#E8312A) !important;
}
.m-kalp-rest.dolu{ color:var(--kirmizi,#E8312A); }
/* Dolma anı: kalp içi kırmızıyla "dolar" hissi (pop ile birlikte) */
@keyframes kalpDoldu{ 0%{transform:scale(1)} 40%{transform:scale(1.35)} 70%{transform:scale(.92)} 100%{transform:scale(1)} }
.r-kalp.dolu.kalp-pop .ico, .m-kalp-rest.dolu.kalp-pop .ico, .m-kalp.dolu.kalp-pop .ico{ animation:kalpDoldu .42s cubic-bezier(.34,1.56,.64,1); }

/* ===================================================================== */
/*  v253 — Teslimat-yok ekranı: iki kırmızı buton yerine ince öneri satırı */
/* ===================================================================== */
.ty-oneri{ display:flex; align-items:center; gap:8px; width:100%; margin-top:14px; padding:11px 13px;
  border:1px solid var(--border,#E7E0D6); border-radius:12px; background:var(--kart,#fff); color:var(--metin);
  font-size:14px; text-align:left; cursor:pointer; }
.ty-oneri .ico{ width:18px; height:18px; flex:0 0 auto; color:var(--kirmizi); }
.ty-oneri-ic{ flex:1 1 auto; }
.ty-oneri b{ font-weight:700; }
.ty-oneri-git{ margin-left:auto; display:inline-flex; align-items:center; gap:2px; color:var(--kirmizi); font-weight:600; white-space:nowrap; }
.ty-oneri-git .ico{ width:16px; height:16px; color:currentColor; }
.ty-oneri:active{ transform:scale(.99); }

/* ===================================================================== */
/*  v254 — KAPAK ↔ LOGO ayrımı + logosuz/kapaksız premium boş hâl        */
/*  Logo yoksa → monogram rozet; kapak yoksa → marka gradyan (stok       */
/*  ürün fotosu ARTIK basılmaz). Logo kırpılması: cover → contain.       */
/* ===================================================================== */
.m-logo img{ width:100%; height:100%; object-fit:contain; background:#fff; }
.m-logo-mono{ display:grid; place-items:center; background:var(--mono,#8a5a3a);
  color:#fff; font-weight:800; font-size:22px; letter-spacing:.5px; }
.m-logo-mono img{ display:none; }
/* Kapaksız marka banner — gradyan + soluk sektör ikonu (stok foto yerine) */
.m-kapak-marka{ position:absolute; inset:0; display:grid; place-items:center;
  background:linear-gradient(135deg, var(--mono,#8a5a3a), rgba(0,0,0,.35)); }
.m-kapak-marka .ico, .m-kapak-marka svg{ width:96px; height:96px; opacity:.22; color:#fff; }
/* Liste monogram avatarı (.wf-logo içinde) */
.mono{ display:grid; place-items:center; width:100%; height:100%;
  background:var(--mono,#8a5a3a); color:#fff; font-weight:800; font-size:22px; }
.wf-logo .mono, .wf-mono{ border-radius:16px; }

/* ===================================================================== */
/*  v256 — checkout form girdileri MASAÜSTÜNDE de rahat tıklanır         */
/*  (.os-ic input hit-area fix'i eskiden yalnız ≤1023px'teydi → masaüstü  */
/*  1366/1920'de #f_ad/#f_tel 19px kalıyordu; test bunu yakaladı.)        */
/* ===================================================================== */
@media (min-width:1024px){
  /* v396 — etiket bindirme fix (mobil ile aynı): negatif margin kaldırıldı, boşluk açıldı. */
  .os-ic{ gap:8px; }
  .os-ic input{ padding-top:10px; padding-bottom:10px; margin-top:0; margin-bottom:0; }
}

/* ===================================================================== */
/*  v256 — dokunma hedefi tamponları (çok-cihaz test bulguları)          */
/*  Görünmez ::before ile ≥44px isabet; görsel/layout DEĞİŞMEZ.          */
/* ===================================================================== */
.ob3-x{ } .ob3-x::before{ content:''; position:absolute; inset:-4px; border-radius:50%; }   /* 38→46 */
.kt-btn{ position:relative; } .kt-btn::before{ content:''; position:absolute; inset:-4px 0; }  /* 42×36→50×44 */

/* ===================================================================== */
/*  v259 — AÇILIŞ karşılama KISA-EKRAN sığdırma                          */
/*  Telefon nav çubuğu yer kaplayınca (kullanılabilir ~800px) alt        */
/*  "Şimdilik geç" nav çubuğunun arkasında kalıyordu. İçeriği vh-ölçekli */
/*  sıkılaştır (uzun ekranda ~aynı, kısa ekranda küçülür) + spacer 0'a   */
/*  inebilsin + alt güvenli boşluk. → CTA + geç DAİMA görünür.           */
/* ===================================================================== */
.ob3-content{ padding-top:calc(env(safe-area-inset-top) + 3.5vh); padding-bottom:calc(env(safe-area-inset-bottom) + 18px); }
.ob3-badge-wrap{ width:clamp(92px, 15vh, 122px); height:clamp(92px, 15vh, 122px); margin-bottom:clamp(8px, 1.6vh, 16px); }
.ob3-brand{ font-size:clamp(24px, 3.4vh, 30px); }
.ob3-headline{ font-size:clamp(21px, 3vh, 25px); }
.ob3-slogan{ margin-top:7px; }
.ob3-feats{ gap:clamp(7px, 1.2vh, 10px); margin:clamp(10px, 1.8vh, 18px) 0 2px; }
.ob3-feat{ padding:clamp(8px, 1.3vh, 11px) 14px; }
.ob3-cta{ margin-top:clamp(12px, 1.8vh, 18px); }
.ob3-skip{ margin-top:9px; }
.ob3-spacer{ min-height:0; }

/* v259.1 — ÇOK KISA ekran (iPhone SE 667px vb.): açılış "Şimdilik geç" 4px kesiliyordu → ekstra sıkıştır */
@media (max-height:700px){
  .ob3-content{ padding-top:calc(env(safe-area-inset-top) + 2vh); padding-bottom:calc(env(safe-area-inset-bottom) + 12px); }
  .ob3-badge-wrap{ width:86px; height:86px; margin-bottom:7px; }
  .ob3-brand{ font-size:23px; }
  .ob3-slogan{ margin-top:5px; }
  .ob3-feats{ gap:7px; margin:9px 0 2px; }
  .ob3-feat{ padding:8px 13px; }
  .ob3-cta{ margin-top:11px; }
}
/* v259.2 — çok kısa ekranda (SE 667) dekoratif slogan gizlenir → alt CTA+geç garanti sığar */
@media (max-height:700px){ .ob3-slogan{ display:none; } .ob3-spacer{ display:none; } }

/* ===================================================================== */
/*  v261 — SİPARİŞLERİM (geçmiş) kartı premium yeniden tasarım           */
/*  Restoran monogram avatarı + net başlık/tarih + ayraçlı kalemler +    */
/*  belirgin tutar + aksiyon. Düz metin-yığını → hiyerarşili kart.        */
/* ===================================================================== */
.gecmis-kart{ padding:14px 15px !important; border-radius:16px !important;
  background:var(--kart) !important; border:1px solid var(--border,#ECE4D8);
  box-shadow:0 2px 12px rgba(45,22,10,.05) !important; display:flex; flex-direction:column; gap:11px; }
.gk-bas{ display:flex; align-items:center; gap:11px; }
.gk-avatar{ width:44px; height:44px; flex:0 0 auto; border-radius:13px; overflow:hidden;
  box-shadow:0 3px 8px rgba(45,22,10,.16); }
.gk-avatar .mono{ width:100%; height:100%; font-size:17px; letter-spacing:.3px; }
.gk-basyazi{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; }
.gk-ad{ font-size:15.5px; font-weight:800; color:var(--metin); letter-spacing:-.2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gk-tarih{ font-size:12.5px; color:var(--soluk); }
.gk-bas .gecmis-durum{ flex:0 0 auto; align-self:center; }
.gk-kalemler{ display:flex; flex-wrap:wrap; gap:5px 12px; padding:11px 0;
  border-top:1px solid var(--border,#F1EBE1); border-bottom:1px solid var(--border,#F1EBE1); }
.gk-kalem{ font-size:13.5px; color:var(--soluk); line-height:1.35; }
.gk-kalem b{ color:var(--acc-koyu); font-weight:700; margin-right:1px; }
.gk-kalem i{ font-style:normal; opacity:.75; }
.gecmis-kart .gecmis-alt{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0; }
.gecmis-kart .gecmis-tutar{ font-size:17px; font-weight:800; color:var(--metin); }
.gecmis-kart .gecmis-alt .btn-tekrar{ margin-left:0; }

/* ===================================================================== */
/*  v261 — BOŞ SEPET premium + animasyonlu (yalnız .sepet-bos)           */
/*  Nabız atan hale + süzülen rozet + kademeli giriş. Diğer boş-durumlar  */
/*  etkilenmez. prefers-reduced-motion'da tüm hareket durur, görünür kalır.*/
/* ===================================================================== */
.sb-ikon{ position:relative; width:118px; height:118px; margin:0 auto 20px; display:grid; place-items:center; }
.sb-halo{ position:absolute; inset:0; border-radius:50%;
  background:radial-gradient(circle, rgba(232,49,42,.16), rgba(232,49,42,0) 66%);
  animation:sbHalo 2.8s ease-in-out infinite; }
@keyframes sbHalo{ 0%,100%{ transform:scale(1); opacity:.65 } 50%{ transform:scale(1.14); opacity:1 } }
.sb-badge{ position:relative; width:88px; height:88px; border-radius:50%; display:grid; place-items:center;
  background:linear-gradient(160deg,#FFEAE7 0%,#FFD4CF 100%);
  box-shadow:0 12px 28px rgba(232,49,42,.22), inset 0 2px 5px rgba(255,255,255,.85);
  animation:sbFloat 3.4s ease-in-out infinite; }
.sb-badge .ico, .sb-badge svg{ width:42px; height:42px; color:var(--acc); }
@keyframes sbFloat{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-8px) } }
/* Kademeli giriş */
.sepet-bos .sb-ikon, .sepet-bos .sb-in1, .sepet-bos .sb-in2, .sepet-bos .sb-in3{
  opacity:0; animation:sbRise .5s cubic-bezier(.16,1,.3,1) both; }
.sepet-bos .sb-ikon{ animation-delay:.02s }
.sepet-bos .sb-in1{ animation-delay:.12s }
.sepet-bos .sb-in2{ animation-delay:.2s }
.sepet-bos .sb-in3{ animation-delay:.3s }
@keyframes sbRise{ from{ opacity:0; transform:translateY(14px) } to{ opacity:1; transform:none } }
@media (prefers-reduced-motion:reduce){
  .sepet-bos .sb-ikon, .sepet-bos .sb-in1, .sepet-bos .sb-in2, .sepet-bos .sb-in3{ opacity:1 !important; transform:none !important; }
  .sb-halo, .sb-badge{ animation:none !important; }
}

/* v262 — boş sepet: düz çizgi-ikon yerine premium çizilmiş çanta illüstrasyonu */
.sb-badge{ background:linear-gradient(160deg,#FFF4F0 0%,#FFE6E0 100%) !important; }
.sb-illo{ width:60px; height:60px; display:block; filter:drop-shadow(0 4px 8px rgba(200,25,15,.28)); }
@media (prefers-reduced-motion:reduce){ .sb-illo{ filter:none; } }

/* ============================================================================
   v265 — PREMIUM HEADER  (3-ajan sentezi: sıcak-marka tabanı + hareket fiziği
   + sessiz-lüks disiplini). Sıcak KREM aksiyon butonları · iki-satır premium
   konum etiketi · yaylı (asimetrik) basış · logo giriş reveal (oturumda bir kez)
   · bildirim nabzı · akışkan arama açılışı · KIT-KIRMIZI (kırmızı yalnız: pin +
   bildirim + giriş-daveti). Mevcut id'ler ve hdr-min scroll-collapse KORUNUR.
   ============================================================================ */
:root{
  --hdr-krem:#FFF6F1; --hdr-krem-2:#FBEFE9; --hdr-krem-ciz:#F3E3DB;
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
}
/* header dikey ritim */
.wlt-head{ gap:8px 12px; padding:8px 0 4px; }

/* --- LOGO: giriş reveal (oturumda bir kez) + yaylı basış --- */
.wlt-logo{ transition:transform .34s var(--ease-spring); will-change:transform; }
.wlt-logo:active{ transform:scale(.93); transition:transform .09s ease-out; }
body:not(.hdr-giris) .wlt-head .ml-logo{ animation:hdrLogoGel .62s var(--ease-o) both; }
@keyframes hdrLogoGel{ 0%{opacity:0; transform:translateY(6px) scale(.965)} 100%{opacity:1; transform:none} }

/* --- SAĞ KÜME: sıcak krem yuvarlak-kare butonlar (asimetrik yay basışı) --- */
.wlt-r{ gap:9px !important; }
.wlt-ic-btn{
  width:44px; height:44px; flex:0 0 44px; border-radius:14px;
  background:var(--hdr-krem); border:1px solid var(--hdr-krem-ciz);
  color:var(--ink); box-shadow:0 1px 2px rgba(28,26,26,.03);
  transition:transform .34s var(--ease-spring), background .18s var(--ease-o), box-shadow .18s var(--ease-o);
}
.wlt-ic-btn:hover{ background:var(--hdr-krem-2); box-shadow:0 4px 12px rgba(232,49,42,.07); transform:none; }
.wlt-ic-btn:active{ transform:scale(.9); transition:transform .09s ease-out; background:var(--brand-soft); }
.wlt-ic-btn .ico{ width:22px; height:22px; }
/* iki-sınıf eski override'ları (v140 #F2EFEA arama, v-eski #E7E6E1 avatar) EŞLE + KREM'e çek */
.wlt-ic-btn.wlt-ara-ac{ background:var(--hdr-krem); border:1px solid var(--hdr-krem-ciz); color:var(--ink); }
.wlt-ic-btn.wlt-ara-ac:hover{ background:var(--hdr-krem-2); }
.wlt-ic-btn.ml-avatar{ background:var(--hdr-krem) !important; border:1px solid var(--hdr-krem-ciz) !important; color:var(--ink) !important; }
.wlt-ic-btn.ml-avatar:hover{ background:var(--hdr-krem-2) !important; }
.wlt-ic-btn.ml-avatar .ico{ fill:var(--ink) !important; }
/* Hesabım (giriş yapılmamış) — hafif kırmızı davet, krem tabanlı */
.wlt-ic-btn.ml-avatar.ml-giris{ background:var(--brand-soft) !important; border-color:rgba(232,49,42,.24) !important; color:var(--acc-koyu) !important; }
.wlt-ic-btn.ml-avatar.ml-giris .ico{ fill:var(--acc-koyu) !important; stroke:none !important; }
/* Bildirim noktası — TEK kırmızı sinyal + çok yumuşak nabız */
.wlt-ic-btn .ml-rozet-nokta{ top:7px; right:7px; width:10px; height:10px; background:var(--acc); border:2px solid #fff; box-shadow:none; }
@media (prefers-reduced-motion:no-preference){
  .wlt-ic-btn .ml-rozet-nokta{ animation:hdrRozetNabiz 2.4s var(--ease-o) infinite; }
}
@keyframes hdrRozetNabiz{ 0%,72%,100%{transform:scale(1)} 80%{transform:scale(1.3)} 88%{transform:scale(.92)} 96%{transform:scale(1.06)} }

/* --- KONUM: iki-satır premium etiket-hap (krem zemin, kırmızı pin çipi) --- */
.wlt-konum{
  gap:10px; padding:7px 14px 7px 8px; border-radius:16px;
  background:var(--hdr-krem-2); border:1px solid var(--hdr-krem-ciz);
  transition:transform .26s var(--ease-o), background .18s var(--ease-o),
             max-height .26s var(--ease-o), opacity .2s var(--ease-o), padding .26s var(--ease-o);
}
.wlt-konum:hover{ background:#F8E7DF; }
.wlt-konum:active{ transform:scale(.99); }
.wlt-konum .kik{
  width:32px !important; height:32px !important; flex:0 0 32px; border-radius:10px !important;
  background:#fff !important; box-shadow:0 1px 3px rgba(232,49,42,.14);
  display:inline-flex; align-items:center; justify-content:center;
}
.wlt-konum .kik .ico{ width:18px !important; height:18px !important; fill:var(--acc) !important; }
.wlt-konum-txt{ display:flex; flex-direction:column; align-items:flex-start; gap:1px; min-width:0; line-height:1.05; }
.wlt-konum-lbl{ font:700 10.5px/1 Manrope,Inter,sans-serif; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); }
.wlt-konum b{ font:800 15px/1.15 Manrope,Inter,sans-serif; letter-spacing:-.2px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:58vw; }
.wlt-konum .kchev{ color:var(--ink2); margin-left:2px; transition:transform .2s var(--ease-o); }
.wlt-konum .kchev .ico{ width:16px; height:16px; fill:var(--ink2); }
.wlt-konum:active .kchev{ transform:translateY(1px); }

/* --- Scroll-collapse: konum akışkan toparlanma (hdr-min mantığı KORUNUR) --- */
body.hdr-min .wlt-konum{
  max-height:0; opacity:0; margin:0; padding-top:0; padding-bottom:0;
  transform:translateY(-6px); overflow:hidden; pointer-events:none; border-width:0;
}

/* --- Arama: akışkan açılış (translateY + fade) --- */
.wlt-head.ara-acik .wlt-ara-wrap{ animation:hdrAraGel .24s var(--ease-o) both; }
@keyframes hdrAraGel{ 0%{opacity:0; transform:translateY(-8px)} 100%{opacity:1; transform:none} }

/* ============================================================================
   v267 — RESTORAN DETAY ÜST BLOK · "MİLAS'A YAKIŞIR PREMIUM"
   3-ajan sentezi (dünya-referans anatomi + Milas yerel kimlik + editoryal tipo):
   • KAPAK: sıcak terracotta + Ada-Milas baklava-kafes dokusu + tek hayalet monogram
     + köşe zeytin usta-damgası (tek-jest disiplini, curcuna yok).
   • LOGO: dikişe BASAN katmanlı gölge + bronz zanaat teli + krem harf (KESİLMEZ).
   • PANEL: yuvarlak-tepe "rising sheet" kapağın üstüne yükselir.
   • BİLGİ: iki-katman meta (güven üstte / lojistik altta) + koçboynuzu imza + altın puan.
   • Ara = dolu sıcak primary · Paylaş = ghost. KIT-KIRMIZI. color-mix YOK (webview güvenli).
   ============================================================================ */
:root{ --milas-govde:#F8F2E9; --milas-hat:#E7DAC6; --milas-bronz:#B07D2B; --milas-toprak:#2A211C; }

/* ---- KAPAK: yükseklik + overflow (logo KESİLMEZ) ---- */
@media (max-width:1023px){
  .m-kapak{ aspect-ratio:auto !important; height:clamp(172px,46vw,214px) !important;
    background:#EAD7C9 !important; overflow:visible !important; }
  .m-kapak::after{ border-radius:inherit; }
  .m-kapak-ic{ z-index:6 !important; }
  .m-logo{ z-index:6 !important; }
}
/* boş kapak: terracotta gövde + halı baklava dokusu (tek-jest) */
.m-kapak-marka{
  position:absolute !important; inset:0 !important; overflow:hidden !important;
  display:grid !important; place-items:center !important;
  background:
    radial-gradient(130% 96% at 50% -22%, rgba(255,244,231,.24), transparent 60%),
    linear-gradient(160deg, rgba(255,255,255,.10) 0%, rgba(0,0,0,0) 34%, rgba(24,12,8,.44) 100%),
    var(--mono,#B65C3A) !important;
}
.m-kapak-marka::before{  /* Ada-Milas baklava kafes — çok sessiz halı-tarlası */
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='19'%3E%3Cpath d='M0 9.5 L17 0 L34 9.5 L17 19 Z' fill='none' stroke='%23FFFFFF' stroke-width='0.9'/%3E%3C/svg%3E");
  background-size:34px 19px;
}
/* v281 — KAPAK TEMİZ: dev hayalet "MM" monogramı KALDIRILDI (kullanıcı: "kapakta sıfır olsun").
   Kapak artık temiz sıcak gradyan; marka harfi zaten köşedeki logo kutusunda. */
.m-kapak-marka .mkm-mono{ display:none !important; }
.m-kapak-marka .mkm-ik{  /* köşe zeytin usta-damgası */
  position:absolute; right:15px; bottom:13px; width:34px; height:34px; color:#fff; opacity:.5; pointer-events:none;
}
.m-kapak-marka .mkm-ik svg{ width:100% !important; height:100% !important; display:block; opacity:1 !important; }
.m-kapak > img{ transition:opacity .3s var(--ease-o); }

/* ---- LOGO: dikişe basan katmanlı gölge + bronz tel + krem harf ---- */
.m-logo{
  border-radius:18px !important; padding:3px !important; background:#fff !important;
  box-shadow:0 0 0 3px #fff, 0 10px 22px -8px rgba(120,50,30,.42), 0 3px 7px -3px rgba(120,50,30,.34) !important;
}
.m-logo-mono{
  border-radius:15px !important; letter-spacing:.4px !important;
  font:800 22px/1 'Baloo 2','Manrope',system-ui,sans-serif !important;
  color:#FFF6EC !important; text-shadow:0 1px 2px rgba(60,22,10,.4);
  background:linear-gradient(155deg, rgba(255,255,255,.20), rgba(0,0,0,.14)), var(--mono,#B65C3A) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.28), inset 0 0 0 3px rgba(176,125,43,.42) !important;
}

/* ---- RISING SHEET + BİLGİ (mobil) ---- */
@media (max-width:1023px){
  .m-rest{ position:relative !important; z-index:3 !important; margin-top:-16px !important;
    border-radius:22px 22px 0 0 !important; padding:46px 6px 6px !important; background:#fff !important; }
  .m-rest .m-rest-ad{ font-family:'Baloo 2','Manrope',system-ui,sans-serif !important; font-weight:800 !important;
    font-size:23px !important; line-height:1.15 !important; letter-spacing:-.4px !important; color:var(--milas-toprak) !important; }
  .m-rest .m-rest-ad::after{  /* koçboynuzu usta-imzası (isim altı ince bordür) */
    content:""; display:block; width:30px; height:8px; margin-top:8px; opacity:.85;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='8'%3E%3Cg fill='none' stroke='%23C0492F' stroke-width='1.1' stroke-linecap='round'%3E%3Cpath d='M2 4 L7 1 L12 4 L7 7 Z'/%3E%3Cpath d='M14 4 q3 -3 6 0 M28 4 q-3 -3 -6 0'/%3E%3C/g%3E%3Ccircle cx='7' cy='4' r='1' fill='%23C0492F'/%3E%3C/svg%3E") left center/contain no-repeat; }
  .m-rest .m-rest-slogan{ color:#6B7080 !important; font-size:13.5px !important; margin-top:9px !important; }
  .m-rest .m-rest-alt{ font-size:13px !important; font-weight:600 !important; color:#5E6473 !important;
    margin-top:11px !important; display:flex !important; align-items:center !important; gap:7px !important; }
  .m-rest .m-rest-alt .yesil-dot .ico, .m-rest .m-rest-alt .yesil-dot svg{ width:9px !important; height:9px !important; filter:drop-shadow(0 0 3px currentColor); }
  .m-rest .m-rest-adres{ margin-top:9px !important; }
  .m-rest .m-rest-adres a{ color:#6B7080 !important; font-size:13px !important; }
  .m-rest .m-rest-adres a .ico{ fill:var(--kirmizi,#C0492F) !important; opacity:.95; }
}
/* ---- İKİ-KATMAN META ---- */
.m-rest-info{ display:flex !important; flex-direction:column !important; gap:9px !important; margin-top:13px !important;
  font-family:'Manrope',system-ui,sans-serif; font-feature-settings:"tnum" 1; }
.m-rest-info .mri-ust{ display:flex; align-items:center; gap:10px; }
.m-rest-info .mri-alt{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:13px; font-weight:500; color:#5E6473; }
.m-rest-info .mri-puan{ display:inline-flex; align-items:center; gap:5px; padding:4px 10px; border-radius:999px;
  background:rgba(245,166,35,.15) !important; color:var(--milas-toprak) !important; font-weight:800 !important; font-size:13px !important; }
.m-rest-info .mri-puan .ico, .m-rest-info .mri-puan svg{ color:var(--gold,#F5A623) !important; fill:var(--gold,#F5A623) !important; width:14px !important; height:14px !important; }
.m-rest-info .mri-puan .mri-say{ color:#8A7A66 !important; font-weight:600 !important; font-size:12px !important; }
.m-rest-info .mri-detay{ margin-left:auto !important; color:var(--acc-koyu,#C01E18) !important; font-weight:700 !important;
  font-size:13px !important; min-height:34px; display:inline-flex; align-items:center; }
.m-rest-info .mri-alt .mri-ayrac{ color:#CDBFAE; }

/* ---- ARA (dolu sıcak primary) / PAYLAŞ (ghost) ---- */
.m-rest-aksiyon{ gap:11px !important; margin-top:16px !important; }
.m-rest-aksiyon .ara-btn{ flex:1 !important; min-height:47px !important; border-radius:14px !important;
  font-family:'Manrope',system-ui,sans-serif !important; font-weight:700 !important; font-size:15px !important;
  transition:transform .12s var(--ease-o) !important; }
.m-rest-aksiyon .ara-btn:active{ transform:scale(.97) !important; }
.m-rest-aksiyon a.ara-btn{ background:linear-gradient(180deg,#C0492F,#A5361F) !important; color:#fff !important;
  border:0 !important; box-shadow:0 8px 18px -8px rgba(165,54,31,.55) !important; }
.m-rest-aksiyon a.ara-btn .ico{ color:#fff !important; fill:#fff !important; }
.m-rest-aksiyon #paylasBtn.ara-btn{ background:#fff !important; border:1.5px solid var(--milas-hat) !important;
  color:var(--milas-toprak) !important; box-shadow:none !important; }
.m-rest-aksiyon #paylasBtn.ara-btn:active{ background:var(--milas-govde) !important; }
.m-rest-aksiyon #paylasBtn.ara-btn .ico{ color:#6B7080 !important; fill:#6B7080 !important; }

/* ---- FIRSATLAR: koçboynuzu mührü + sıcak krem kartlar ---- */
.wf-h2{ font-family:'Baloo 2','Manrope',system-ui,sans-serif !important; font-weight:800 !important; font-size:18px !important;
  letter-spacing:-.3px !important; color:var(--milas-toprak) !important; display:flex; align-items:center; gap:8px; }
.wf-h2::before{ content:""; width:18px; height:9px; flex:none; opacity:.9;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='9'%3E%3Cg fill='none' stroke='%23C0492F' stroke-width='1.1' stroke-linecap='round'%3E%3Cpath d='M2 4.5 L6 1.5 L10 4.5 L6 7.5 Z'/%3E%3Cpath d='M12 4.5 q2.5 -2.5 5 0'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat; }
.wf-kart{ background:linear-gradient(180deg,#fff,var(--milas-govde)) !important; border:1px solid var(--milas-hat) !important;
  border-radius:16px !important; box-shadow:0 6px 16px -12px rgba(140,58,40,.4) !important;
  transition:transform .13s var(--ease-o) !important; }
.wf-kart:active{ transform:scale(.98) !important; }
.wf-ik{ background:var(--brand-soft,#FCE9E8) !important; color:var(--kirmizi,#C0492F) !important; border-radius:12px !important; }
.wf-ik svg, .wf-ik .ico{ color:var(--kirmizi,#C0492F) !important; fill:var(--kirmizi,#C0492F) !important; }
.wf-bas{ color:var(--milas-toprak) !important; font-weight:700 !important; }
.wf-link{ color:var(--kirmizi,#C0492F) !important; font-weight:700 !important; }

/* ---- reduced motion ---- */
@media (prefers-reduced-motion:reduce){
  .m-rest-aksiyon .ara-btn, .wf-kart, .m-kapak > img{ animation:none !important; transition:none !important; transform:none !important; }
}

/* ============================================================================
   v268 — DEĞERLENDİRME GÖRSEL FAZ 1 (5-uzman kurul sentezi).
   Metalik dövülmüş-altın yıldız (fill:url(#mriGold)) + madalyon puan rozeti +
   premium yorum kartı (doğrulanmış-kalkan / İşletme yanıtı / faydalı).
   KURAL: ALTIN = yalnız DEĞERLENDİRME değeri. Sadakat (.pk-etik/.seviye-satir)
   ve composer (Faz 1b) DIŞARIDA — onlara dokunma.
   ============================================================================ */
/* --- Metalik altın yıldız: yalnız değerlendirme yıldızları --- */
.r-puan svg.ico path, .r-puan svg.ico,
.wf-puan svg.ico path, .wf-puan svg.ico,
.sl-puan svg.ico path, .sl-puan svg.ico,
.mri-puan svg.ico path, .mri-puan svg.ico,
.yorum-yildiz svg.ico path, .yorum-yildiz svg.ico,
.pd-yild svg.ico path, .pd-yild svg.ico,
.yo-puan svg.ico path, .yo-puan svg.ico{
  fill:url(#mriGold) !important; color:transparent !important; stroke:none !important;
}
.r-puan svg.ico, .wf-puan svg.ico, .sl-puan svg.ico,
.mri-puan svg.ico, .yorum-yildiz svg.ico{
  filter:drop-shadow(0 1px .5px rgba(138,85,16,.30));
}

/* --- Puan rozeti: altın madalyon (liste/hero/harita) --- */
.r-puan, .wf-puan, .sl-puan{
  background:linear-gradient(180deg,#FFF7E8,#FDEFD3) !important;
  border:1px solid rgba(229,150,15,.42) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 1px 2px rgba(138,85,16,.16) !important;
  color:var(--ink-900) !important;
}
.r-puan b, .wf-puan b, .sl-puan b,
.r-puan, .wf-puan, .sl-puan{ font-variant-numeric:tabular-nums; }
/* venue hero .mri-puan zaten altın-tint hap (v266); yalnız yıldızı metalikleştirdik */

/* --- PREMIUM YORUM KARTI --- */
.yorum-kart{ background:#fff !important; border:1px solid #EFEAE1 !important; border-radius:16px !important;
  padding:15px 16px !important; box-shadow:0 1px 2px rgba(26,24,23,.05) !important; margin-bottom:12px !important; }
.yorum-bas{ display:flex !important; align-items:center !important; flex-wrap:wrap !important; gap:8px !important; }
.yorum-yildiz{ display:inline-flex !important; align-items:center; gap:4px; font:800 15px/1 Manrope,system-ui,sans-serif !important;
  color:var(--ink-900) !important; font-variant-numeric:tabular-nums; }
.yorum-yildiz svg.ico{ width:17px; height:17px; }
.yorum-dogrulanmis{ display:inline-flex !important; align-items:center; gap:3px; padding:2px 8px 2px 6px; border-radius:999px;
  background:var(--brand-soft,#FCE9E8) !important; color:var(--acc-koyu,#C01E18) !important; font:700 11px/1 Inter,system-ui,sans-serif !important; }
.yorum-dogrulanmis svg.ico, .yorum-dogrulanmis .ico{ width:13px !important; height:13px !important; fill:var(--acc,#E8312A) !important; color:var(--acc) !important; }
.yorum-tarih{ margin-left:auto !important; font:500 12px Inter,system-ui,sans-serif !important; color:#7A808C !important; }
.yorum-metin{ margin-top:9px !important; font:400 14px/1.5 Inter,system-ui,sans-serif !important; color:#33302E !important; }
.yorum-kirilim{ display:flex !important; flex-wrap:wrap; gap:6px; margin-top:10px !important; }
.yorum-kirilim span{ font:600 11.5px/1 Inter,system-ui,sans-serif !important; color:#6B7080 !important;
  background:#F5F2EC !important; border-radius:8px; padding:4px 9px; }
.yorum-foto{ margin-top:10px !important; }
.yorum-foto-img{ border-radius:12px !important; }
/* İşletme yanıtı — resmi cevap bloğu (brand-soft + sol kenar) */
.yorum-yanit{ margin-top:11px !important; padding:11px 13px !important; border-radius:12px !important;
  background:var(--brand-soft,#FCE9E8) !important; border-left:3px solid var(--acc,#E8312A) !important;
  font:400 13px/1.5 Inter,system-ui,sans-serif !important; color:#3A2A28 !important; }
.yorum-yanit b{ display:block !important; color:var(--acc-koyu,#C01E18) !important; font:800 12px/1 Inter,system-ui,sans-serif !important; margin-bottom:4px !important; }
/* Faydalı — hap (aksiyon = kırmızı) */
.fyd-btn{ margin-top:11px !important; min-height:44px; /* v278 gece-kurul U9 */ display:inline-flex !important; align-items:center; gap:6px;
  padding:7px 14px !important; border-radius:999px !important; border:1.5px solid #E4DED3 !important; background:#fff !important;
  font:700 13px Inter,system-ui,sans-serif !important; color:var(--ink-900) !important; cursor:pointer;
  transition:transform .15s var(--ease-spring,cubic-bezier(.34,1.56,.64,1)), border-color .15s, background .15s; }
.fyd-btn svg.ico, .fyd-btn .ico{ width:16px !important; height:16px !important; fill:#6B7080 !important; color:#6B7080 !important; }
.fyd-btn:active{ transform:scale(.94); }
.fyd-btn.secili{ border-color:var(--acc,#E8312A) !important; background:var(--brand-soft,#FCE9E8) !important; color:var(--acc-koyu,#C01E18) !important; }
.fyd-btn.secili svg.ico, .fyd-btn.secili .ico{ fill:var(--acc,#E8312A) !important; color:var(--acc) !important; }
.fyd-n{ color:#6B7080 !important; }
.fyd-btn.secili .fyd-n{ color:var(--acc-koyu,#C01E18) !important; }
@media (prefers-reduced-motion:reduce){ .fyd-btn{ transition:border-color .15s, background .15s; } .fyd-btn:active{ transform:none; } }

/* --- v269 (Faz 1b) — COMPOSER yıldız etkileşimi: metalik altın dolum + yaylı pop + kıvılcım --- */
.yld{ position:relative; -webkit-tap-highlight-color:transparent; }
.yld .ico{ fill:var(--mri-track,#E9E2D6) !important; color:transparent !important; transition:transform .16s cubic-bezier(.2,.7,.3,1); }
.puan-satir .yld .ico{ width:30px !important; height:30px !important; }
.up-yild .yld .ico{ width:22px !important; height:22px !important; }
.yld.dolu .ico{ fill:url(#mriGold) !important; filter:drop-shadow(0 1px 1px rgba(138,85,16,.35)); }
.yld:active .ico{ transform:scale(1.22); }
@keyframes yldPop{ 0%{transform:scale(1)} 42%{transform:scale(1.34)} 100%{transform:scale(1)} }
.yld.yld-pop .ico{ animation:yldPop .42s cubic-bezier(.34,1.56,.64,1); }
/* kıvılcım: tek eleman box-shadow ile 6 ışın */
.yld.yld-pop::after{ content:""; position:absolute; left:50%; top:45%; width:3px; height:3px; border-radius:2px;
  background:var(--gold,#F5A623); pointer-events:none;
  box-shadow:14px -8px 0 #FFD873,-14px -8px 0 var(--gold,#F5A623),16px 6px 0 var(--gold,#F5A623),-16px 6px 0 #FFD873,0 -18px 0 var(--gold,#F5A623),0 15px 0 #FFD873;
  animation:yldSpark .5s cubic-bezier(.22,1,.36,1) forwards; }
@keyframes yldSpark{ 0%{transform:translate(-50%,-50%) scale(.2);opacity:.95} 100%{transform:translate(-50%,-50%) scale(1.6);opacity:0} }
/* Gönder sonrası teşekkür (mevcut .puan-tamam bloğu premiumlaşır) */
.puan-tamam{ display:flex; align-items:center; gap:8px; justify-content:center; padding:16px; border-radius:14px;
  background:radial-gradient(120% 90% at 50% 0%,#FFF9F0,var(--krem,#F8F2E9)); border:1px solid #ECE0CC;
  font:800 15px/1.3 'Baloo 2',Manrope,system-ui,sans-serif; color:var(--ink-900,#1A1817); }
.puan-tamam svg.ico, .puan-tamam .ico{ width:22px; height:22px; fill:var(--acc,#E8312A); animation:tamamPop .5s cubic-bezier(.34,1.56,.64,1); }
@keyframes tamamPop{ 0%{transform:scale(.3);opacity:0} 60%{transform:scale(1.2)} 100%{transform:scale(1);opacity:1} }
@media (prefers-reduced-motion:reduce){
  .yld .ico, .yld.yld-pop .ico, .puan-tamam .ico{ animation:none !important; transition:none !important; transform:none !important; }
  .yld.yld-pop::after{ display:none; }
}

/* --- v269 (Faz 1b) — histogram altın dolma animasyonu + "Yeni" rozeti --- */
.pd-bar{ overflow:hidden; }
.pd-bar i{ display:block; height:100%; background:linear-gradient(90deg,#F5A623,#DE8B0C) !important; border-radius:6px;
  box-shadow:0 0 6px -1px rgba(222,139,12,.5); transform-origin:left center; animation:pdFill .85s cubic-bezier(.22,1,.36,1) both; }
@keyframes pdFill{ from{transform:scaleX(0)} to{transform:scaleX(1)} }
.yo-yeni{ display:inline-flex; align-items:center; padding:4px 12px; border-radius:999px;
  background:#E9F6EC; color:#1E8E4A; font:800 14px/1 Manrope,system-ui,sans-serif; letter-spacing:.2px; }
@media (prefers-reduced-motion:reduce){ .pd-bar i{ animation:none !important; transform:none !important; } }


/* ============================================================
   v272 — SIFIR-PUAN GÖRÜNÜRLÜĞÜ (yeni işletmede yıldız/yorum bölümü asla görünmez kalmasın)
   ============================================================ */
/* Hero "Yeni" rozeti — puan hapıyla aynı iskelet, altın yıldız + sıcak zemin (dünya "Yeni" deseni) */
.mri-puan.mri-yeni{ background:#FBEFD9; color:#9A6A12; border:1px solid #F3D8A2; }
.mri-puan.mri-yeni svg.ico{ fill:url(#mriGold); }
/* Menü altı boş-durum — soluk yıldızlar + davet metni */
.yorum-bos{ display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center;
  padding:22px 16px; margin-top:10px; border:1px dashed #E4DFD6; border-radius:16px; background:#FBFAF7; }
.yorum-bos-yild{ display:inline-flex; gap:3px; margin-bottom:2px; }
.yorum-bos-yild svg.ico{ width:22px; height:22px; fill:#D9D2C6; }
.yorum-bos b{ font:800 16px/1.2 Manrope,system-ui,sans-serif; color:#2B2B2B; }
.yorum-bos span{ font:500 13.5px/1.5 Manrope,system-ui,sans-serif; color:#8A8479; max-width:320px; }

/* v278 gece-kurul U11 — tap gecikmesini (300ms) kaldır, çift-tık-zoom kapat; pinch-zoom etkilenmez */
button, a, [role="button"], input, textarea, select { touch-action: manipulation; }

/* v279 gece-kurul O12a — görsel blur-up/fade-in (RM-03). Konteyner sabit-boyut → CLS yok. */
/* v279 gece-kurul O12a — KURŞUN-GEÇMEZ fade: onload'a bağımlı DEĞİL (cache'li/lazy görselde onload
   kaçsa bile görsel ASLA görünmez kalmaz). Animasyon 'both' ile daima opacity:1'de biter; global
   reduced-motion guard süreyi ~0'a indirince anında görünür. */
.im-fade{ animation: imFadeIn .35s var(--ease-soft, ease) both; }
@keyframes imFadeIn{ from{ opacity:0 } to{ opacity:1 } }
/* Reduced-motion: global *{transition:none} zaten devrede → onload opacity:1'i ANINDA uygular (takılı-görünmez kalmaz). */

/* v279 gece-kurul O12b — yorum yükleme skeleton (RM-04). Mevcut slShimmer + krem gradient ailesi. */
.yorum-kart.iskelet{ pointer-events:none; }
.yorum-kart.iskelet .yorum-bas{ display:flex; gap:10px; margin-bottom:10px; }
.yorum-kart.iskelet .yi-bar{ display:block; border-radius:8px;
  background:linear-gradient(100deg,#EFE9DF 30%,#F7F3EC 50%,#EFE9DF 70%);
  background-size:200% 100%; animation:slShimmer 1.3s infinite linear; }
.yorum-kart.iskelet .yi-yildiz{ height:16px; width:70px; }
.yorum-kart.iskelet .yi-rozet{ height:16px; width:130px; }
.yorum-kart.iskelet .yi-metin{ height:13px; width:100%; margin-top:8px; }
.yorum-kart.iskelet .yi-metin.kisa{ width:60%; }
@media (prefers-reduced-motion:reduce){ .yorum-kart.iskelet .yi-bar{ animation:none; } }

/* v279 gece-kurul O2 — filtre sıfır-sonuçta primary CTA'yı nötr göster (yanıltıcı kırmızı "uygula" olmasın; tıklanabilir kalır) */
.fs-uygula.fs-sifir{ background:#F1EFEA !important; color:#8A8479 !important; box-shadow:none !important; }

/* ============================================================
   v280 — RESTORAN DETAY yeniden tasarım Faz 1: REFERANS özet-kart şeridi (.rd-ozet)
   Tüm işletme bilgisi tek yatay kartta; masaüstü yatay+ayraç, mobil 2-satır sarma.
   ============================================================ */
.rd-ozet{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  background:var(--surface,#fff); border:1px solid var(--cizgi,#ece6df); border-radius:16px;
  padding:14px 18px; box-shadow:0 8px 30px rgba(48,37,29,.06); margin:14px 0 4px; }
.rd-hucreler{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; min-width:0; }
.rd-hucre{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
  font:600 14px/1.2 Manrope,system-ui,sans-serif; color:var(--ink-800,#2b2b2b); }
.rd-hucre svg.ico{ width:16px; height:16px; opacity:.72; }
.rd-sep{ width:1px; height:18px; background:var(--cizgi,#e6e0d8); flex:0 0 auto; }
.rd-durum{ font-weight:800; }
.rd-durum i{ width:8px; height:8px; border-radius:50%; background:var(--drenk,#28A745); display:inline-block; box-shadow:0 0 0 3px color-mix(in srgb, var(--drenk,#28A745) 18%, transparent); }
.rd-puan svg.ico{ fill:url(#mriGold); opacity:1; }
.rd-puan b{ font-weight:800; }
.rd-puan small{ color:var(--ink-500,#8a8479); font-weight:600; }
.rd-yeni{ color:#9A6A12; }
.rd-adres{ color:var(--ink-500,#8a8479); font-weight:500; max-width:280px; overflow:hidden; text-overflow:ellipsis; }
.rd-detay{ flex:0 0 auto; display:inline-flex; align-items:center; gap:4px; white-space:nowrap;
  color:var(--kirmizi,#E8312A); font:800 13px/1 Manrope,system-ui,sans-serif; background:none; border:0; cursor:pointer; min-height:44px; padding:0 4px; }
.rd-detay svg.ico{ width:14px; height:14px; }
@media (max-width:767px){
  .rd-ozet{ flex-direction:column; align-items:stretch; gap:10px; padding:12px 14px; margin:12px 0 4px; }
  .rd-hucreler{ gap:10px 12px; }
  .rd-adres{ display:none; }
  .rd-detay{ align-self:flex-start; min-height:36px; }
}

/* v280 Faz 1 — masaüstünde slogan ÇİFT görünmesin: kapakta mkb-alt zaten var; .m-rest-slogan v233'te
   daha spesifik !important ile wlt-mobonly'yi eziyordu → aynı breakpoint + eşit-spesifik son kural ile gizle. */
@media (min-width:1024px){ .m-rest .m-rest-slogan{ display:none !important; } }

/* v284 fit-motor — geniş masaüstünde kart biraz büyür ama SABİT sütun-sayısı YOK (auto-fill);
   eski repeat(3,...) + kart min-width:300 → 1280'de kartlar 31px üst üste biniyordu (KÖK). */
@media (min-width:1280px){
  .m-urunler{ grid-template-columns:repeat(auto-fill,minmax(280px,1fr)) !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v280 Faz 5 — RESTORAN DETAY (menu) MASAÜSTÜ ÜST YATAY NAV + SOL RAY KALDIR.
   Referans deseni: full-bleed beyaz sticky üst bar (logo+marka · teslimat adresi ·
   geniş arama · Siparişlerim/Favoriler/Sepetim/Profil). YALNIZ menu ekranı + ≥1024px.
   Mobil/<1024 ve diğer ekranlar AYNEN (sol ray + eski nav) korunur.
   ═══════════════════════════════════════════════════════════════════════════ */
/* v280 Faz 5 — varsayılan: mobil + <1024'te üst nav GİZLİ (yalnız desktop menüde açılır) */
.rd-topnav{ display:none; }

@media (min-width:1024px){
  :root{ --rd-topnav-h: 72px; }

  /* v280 Faz 5 — SOL RAY (.botnav) YALNIZ menu ekranında masaüstünde gizli. Çift-sınıf
     spesifiklik v229 `.botnav.botnav.gizli{display:block}` kuralını da ezer. Diğer ekranlar
     (liste/sepet/profil…) rayı AYNEN gösterir → ana sayfa navı bozulmaz. */
  body[data-ekran="menu"] .botnav,
  body[data-ekran="menu"] .botnav.botnav.gizli{ display:none !important; }

  /* v280 Faz 5 — ray gittiği için menü içeriğinin sol ray-gutter'ı kalkar: yalnız yan boşluk */
  body[data-ekran="menu"] #ekran{
    padding-left: var(--shell-x) !important;
    padding-right: var(--shell-x) !important;
  }
  /* v280 Faz 5 — eski .ust geri-barı menüde gizli: üst nav logosu ana-sayfa görevini üstlenir,
     72px sticky nav ile fixed geri-bar çakışması olmaz (yalnız menu; diğer ekranlarda .ust AYNEN) */
  body[data-ekran="menu"] .ust{ display:none !important; }

  /* v280 Faz 5 — ÜST YATAY NAV: .sar yan padding'ini negatif margin ile kır → tam-genişlik
     beyaz bant; iç içerik max-width:1440 ortalı. Sticky top:0, akışta yer kaplar → kapak ALTINDA başlar. */
  .rd-topnav{
    display:block;
    position:sticky; top:0; z-index:55;
    margin-left: calc(-1 * var(--shell-x));
    margin-right: calc(-1 * var(--shell-x));
    background:#fff;
    border-bottom:1px solid rgba(120,80,40,.09);
    box-shadow:0 4px 18px rgba(60,30,15,.06);
  }
  .rd-topnav-ic{
    max-width:1440px; margin:0 auto; height:var(--rd-topnav-h);
    display:flex; align-items:center; gap:18px;
    padding:0 24px; box-sizing:border-box;
  }
  /* sol: logo + marka */
  .rd-tn-logo{ display:inline-flex; align-items:center; gap:9px; background:none; border:none; cursor:pointer; padding:4px 4px; flex:0 0 auto; }
  .rd-tn-logoimg{ height:34px; width:auto; display:block; }
  .rd-tn-marka{ font-family:var(--display,inherit); font-weight:800; font-size:19px; color:var(--terra,#E8312A); letter-spacing:-.01em; white-space:nowrap; }
  /* teslimat adresi seçici */
  .rd-tn-konum{ display:inline-flex; align-items:center; gap:8px; background:#F7F1E4; border:1px solid rgba(120,80,40,.10);
    border-radius:14px; cursor:pointer; padding:7px 12px; flex:0 0 auto; max-width:230px; transition:background .15s, border-color .15s; }
  .rd-tn-konum:hover{ background:#F1E8D6; border-color:rgba(120,80,40,.20); }
  .rd-tn-pin{ display:inline-grid; place-items:center; color:var(--terra,#E8312A); flex:0 0 auto; }
  .rd-tn-pin svg{ width:18px; height:18px; }
  .rd-tn-konum-txt{ display:flex; flex-direction:column; line-height:1.15; min-width:0; text-align:left; }
  .rd-tn-konum-lbl{ font-size:10.5px; color:#9A8F82; font-weight:600; }
  .rd-tn-konum-txt b{ font-size:13.5px; color:#2A2018; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .rd-tn-chev{ display:inline-grid; place-items:center; color:#9A8F82; flex:0 0 auto; }
  .rd-tn-chev svg{ width:14px; height:14px; }
  /* orta: geniş arama */
  .rd-tn-ara{ flex:1 1 auto; min-width:120px; display:flex; align-items:center; gap:10px;
    height:46px; padding:0 16px; background:#fff; border:1px solid rgba(120,80,40,.16);
    border-radius:16px; cursor:pointer; box-shadow:0 2px 10px rgba(120,80,40,.06); transition:border-color .15s, box-shadow .15s; }
  .rd-tn-ara:hover{ border-color:var(--terra,#E8312A); box-shadow:0 4px 16px rgba(120,80,40,.10); }
  .rd-tn-ara-ik{ display:inline-grid; place-items:center; color:#9A8F82; flex:0 0 auto; }
  .rd-tn-ara-ik svg{ width:20px; height:20px; }
  .rd-tn-ara-ph{ color:#9A8F82; font-size:15px; }
  /* sağ: aksiyon linkleri */
  .rd-tn-sag{ display:inline-flex; align-items:center; gap:6px; flex:0 0 auto; }
  .rd-tn-link{ display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    background:none; border:none; cursor:pointer; padding:6px 10px; border-radius:12px; color:#6B7079;
    transition:color .15s, background .15s; min-width:62px; }
  .rd-tn-link:hover{ color:var(--terra,#E8312A); background:#F7F1E4; }
  .rd-tn-lik{ position:relative; display:inline-grid; place-items:center; }
  .rd-tn-lik svg{ width:23px; height:23px; fill:currentColor; }
  .rd-tn-let{ font-size:11.5px; font-weight:600; white-space:nowrap; }
  .rd-tn-rozet{ position:absolute; top:-6px; right:-9px; min-width:17px; height:17px; padding:0 4px;
    border-radius:9px; background:var(--terra,#E8312A); color:#fff; font-size:10.5px; font-weight:800;
    display:grid; place-items:center; box-shadow:0 1px 4px rgba(168,40,20,.4); }

  /* v280 Faz 5 — menü-içi sticky arama/çip barı üst nav (72px) ALTINA yapışsın (eski 63px .ust ofseti yerine) */
  body[data-ekran="menu"] .menu-ust{ top: var(--rd-topnav-h) !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v281 referans-oturt — RESTORAN DETAY sayfasını referans mockup'a (MilasHızır)
   OTURTMA. 3 fark: (F1) masaüstü ürün kartı DİKEY görsel-üstte, (F2) özet kart
   kapağa biner + iki-satır etiketli hücreler, (F3) zengin boş yan-sepet.
   TÜMÜ ≥1024px; mobil (<1024) mevcut yatay kart + kompakt özet + gizli yan-panel AYNEN.
   ═══════════════════════════════════════════════════════════════════════════ */
/* F1/F2 — hücre etiketi + "Ekle" label VARSAYILAN GİZLİ → mobil kompakt/+ korunur */
.rd-l{ display:none; }
.ekle-lbl{ display:none; }

@media (min-width:1024px){
  /* ---- v281 referans-oturt F1: ürün kartı DİKEY (görsel üstte, tam genişlik 16:10) ---- */
  .m-kart{ flex-direction:column !important; align-items:stretch !important; padding:0 !important;
    gap:0 !important; position:relative; overflow:hidden; }
  .m-kart .m-gorsel{ order:0 !important; width:100% !important; height:auto !important;
    aspect-ratio:16/10 !important; border-radius:12px 12px 0 0 !important; box-shadow:none !important; }
  .m-kart .m-gorsel::after{ display:block !important; }
  .m-kart .m-ic{ order:1 !important; display:flex !important; flex-direction:column; flex:1 1 auto;
    align-self:stretch !important; padding:12px 14px 14px !important; }
  .m-kart .m-fiyat{ margin-top:0 !important; padding-top:0 !important; }   /* v284 fit-motor — dikey itmeyi .m-alt (margin-top:auto) yapıyor; fiyat footer satırında hizalı */
  /* v299 — masaüstü grid: footer aksiyonu da MOBİLLE AYNI premium beyaz "+" dairesi.
     Eski "Ekle" pill'i (font-size:0 + .ekle-lbl) kaldırıldı → seçenekli/seçeneksiz TEK dil. */
  .m-alt{ margin-top:auto !important; }   /* footer m-ic'in DİBİNE otursun (m-ic flex-column) */
  .m-kart .m-alt .ekle{ position:static !important; inset:auto !important; flex:0 0 auto;
    width:40px !important; min-width:40px !important; height:40px !important; padding:0 !important;
    border-radius:50% !important; font-size:26px !important; line-height:1 !important; font-weight:400 !important;
    background:#fff !important; color:var(--acc-koyu,#C01E18) !important; border:1px solid var(--cizgi2,#ECE8E2) !important;
    box-shadow:0 2px 8px rgba(20,12,10,.16) !important; }
  /* dolu durum (seçenekli ürün sepette → adet gösterir): kırmızı dolu aktif rozet */
  .m-alt .ekle.sec-dolu{ background:var(--acc,#E8312A) !important; color:#fff !important; border-color:transparent !important; font-weight:800 !important; }
  /* kalp: geniş görselin sağ-ÜST köşesinde (referans); popüler rozet sol-üstte */
  .m-kart .m-kalp{ top:10px !important; right:10px !important; opacity:1 !important;
    background:rgba(255,255,255,.92) !important; color:#2b2b2b !important; box-shadow:0 2px 8px rgba(20,12,10,.2); }
  .m-kart .m-kalp.dolu{ color:var(--kirmizi,#C0492F) !important; }
  .m-kart .m-kalp.dolu svg, .m-kart .m-kalp.dolu .ico{ fill:var(--kirmizi,#C0492F) !important; }
  .m-kart .cs-rozet{ top:10px !important; left:10px !important; }

  /* ---- v281 referans-oturt F2: özet kart KAPAĞA BİNER + iki-satır etiketli hücreler ---- */
  .m-rest{ background:transparent !important; box-shadow:none !important; border:none !important;
    padding:0 !important; margin-bottom:16px !important; }
  .rd-ozet{ margin-top:-30px !important; position:relative; z-index:6; padding:18px 24px !important;
    align-items:stretch; box-shadow:0 14px 38px rgba(48,37,29,.14) !important; }
  .rd-hucreler{ gap:0 !important; }
  .rd-hucre{ flex-direction:column; align-items:flex-start; gap:3px; padding:0 20px; }
  .rd-hucre:first-child{ padding-left:0; }
  .rd-v{ font:800 17px/1.15 'Inter',system-ui,sans-serif; color:var(--ink-900,#1c1c1c);
    display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
  .rd-l{ display:block; font:600 12px/1.2 Manrope,system-ui,sans-serif; color:var(--ink-500,#8a8479); white-space:nowrap; }
  .rd-durum .rd-v i{ width:9px; height:9px; }
  .rd-sep{ height:40px !important; align-self:center; }

  /* ---- v281 referans-oturt F3: zengin boş yan-sepet (başlık + illüstrasyon + ilerleme + devre-dışı onay) ---- */
  .myan-bos{ text-align:center !important; }
  .myan-bos .myan-bas{ text-align:left; margin-bottom:4px; }
  .myan-illo{ display:grid; place-items:center; margin:8px 0 12px; }
  .myan-illo-svg{ width:80px; height:80px; }
  .myan-min{ margin:16px 0 4px; }
  .myan-min-bar{ height:8px; border-radius:999px; background:#F0ECE6; overflow:hidden; }
  .myan-min-bar span{ display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#FF7A6E,#E1281F); }
  .myan-min-lbls{ display:flex; justify-content:space-between; font-size:12px; font-weight:700; color:var(--ink-500,#8a8479); margin-top:6px; }
  .myan-min-txt{ font-size:14px; color:var(--soluk,#6B7080); margin-top:10px; }
  .myan-min-txt b{ color:var(--ink-900,#1c1c1c); }
  .myan-onay{ width:100%; height:50px; margin-top:16px; border:none; border-radius:14px; background:#E7E3DD;
    color:#A19C93; font-family:'Inter',system-ui,sans-serif; font-weight:800; font-size:16px; cursor:not-allowed; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v283 referans-r2 — RESTORAN DETAY sayfasını referansa DAHA DA yaklaştırma.
   M2: en-çok carousel okları masaüstünde gizli (grid deseninde gereksiz).
   M3: yan sepet zenginleşti ([− adet +] · sil · satır toplamı + Ara/Teslimat/Toplam dökümü).
   M5: menü sayfası sıcak kırık-beyaz zemin + beyaz yüzeyler ayrışsın; kategori çip güçlü aktif.
   TÜMÜ ≥1024px masaüstü; mobil (<1024) AYNEN.
   ═══════════════════════════════════════════════════════════════════════════ */
@media (min-width:1024px){
  /* ---- v283 M2: "En çok sipariş edilen" pembe sağ-sol okları masaüstünde gizli ---- */
  .wl-enc-oklar{ display:none !important; }

  /* ---- v283 M3: zengin yan sepet ---- */
  .myan-bas-dolu{ display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
  .myan-bas-adet{ font-size:13px; font-weight:600; color:var(--soluk,#6B7080); letter-spacing:0; }
  .menu-yan .myan-liste{ gap:0; }
  .myan-satir{ display:flex; flex-direction:column; gap:8px; padding:12px 0; align-items:stretch;
    border-bottom:1px solid #F0ECE6; }
  .myan-satir:first-child{ padding-top:0; }
  .myan-satir-ust{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
  .myan-satir-bilgi{ min-width:0; }
  .myan-satir-bilgi .myan-ad{ display:block; font-size:14px; font-weight:700; color:var(--ink-900,#1c1c1c);
    line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .myan-sec{ font-size:13px; color:var(--soluk,#6B7080); margin-top:2px; line-height:1.3;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .myan-sil{ flex:0 0 auto; width:28px; height:28px; display:grid; place-items:center; background:none;
    border:none; border-radius:8px; color:#B9736B; cursor:pointer; transition:background .14s, color .14s; }
  .myan-sil:hover{ background:#FBEDEB; color:var(--acc,#E8312A); }
  .myan-sil svg{ width:17px; height:17px; }
  .myan-satir-alt{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
  .myan-adet-ctrl{ padding:2px; }
  .myan-adet-ctrl button{ width:30px; height:30px; font-size:19px; }
  .myan-adet-ctrl .n{ min-width:18px; font-size:14px; }
  .myan-satir-fy{ font-weight:800; font-size:14px; color:var(--ink-900,#1c1c1c); }
  .myan-dokum{ margin:14px 0 4px; padding-top:14px; border-top:1px solid #F0ECE6; }
  .myan-dk-sat{ display:flex; justify-content:space-between; align-items:center; font-size:14px;
    color:#4A4D58; padding:4px 0; }
  .myan-dk-ucretsiz{ color:#2E8B57; font-weight:700; }
  .myan-dk-ayrac{ height:1px; background:#F0ECE6; margin:8px 0; }
  .myan-dk-top{ display:flex; justify-content:space-between; align-items:center; font-weight:800;
    font-size:17px; color:var(--ink-900,#1c1c1c); padding:4px 0 2px; }
  .myan-git{ margin-top:12px; }

  /* ---- v283 M5(a): menü sayfası sıcak kırık-beyaz zemin; nav/kart/sepet beyaz yüzey ayrışır ---- */
  body[data-ekran="menu"]{ background:#FAF5EF !important; background-image:none !important; }
  body[data-ekran="menu"] .m-kart{ background:#fff !important; border:1px solid #EFE8DF !important;
    border-radius:14px !important; box-shadow:0 2px 10px rgba(60,40,20,.05) !important; overflow:hidden; }
  body[data-ekran="menu"] .myan-kart{ box-shadow:0 4px 18px rgba(60,40,20,.08); }

  /* ---- v283 M5(b): kategori çubuğu aktif çip ANA RENKLİ (soft-pembe zayıftı → belirgin) ---- */
  body[data-ekran="menu"] .menu-kat-cip.sec{ background:var(--acc,#E8312A) !important; color:#fff !important;
    box-shadow:0 3px 10px rgba(224,40,31,.24) !important; }
}


/* v283 referans-r2 M1 — kısa adres hücresi (+ önündeki ayraç) YALNIZ masaüstü (≥1024).
   Mobilde adres "İşletme bilgileri" sheet'inde; şeritte kompakt tek-satır korunur. */
.rd-adres{ display:none !important; }
@media (min-width:1024px){ .rd-adres{ display:inline-flex !important; } .rd-sep.rd-adres{ display:block !important; } }

/* ═══════════════════════════════════════════════════════════════════════════
   v285 ref-r3 — RESTORAN DETAY masaüstü referansa (MilasHızır) YAKINLAŞTIRMA.
   K1 kapak full-bleed (nav'a bitişik, yan beyaz boşluk sıfır) · K3 kapak alçaldı +
   logo/ad/slogan içerik koluna hizalı + özet kart zarif biniyor · K2 boşluk düzeni.
   YALNIZ ≥1024px + body[data-ekran="menu"]; mobil (<1024) AYNEN korunur.
   ═══════════════════════════════════════════════════════════════════════════ */
@media (min-width:1024px){
  /* --- K1: KAPAK FULL-BLEED — viewport kenarına yaslan (üst nav ile aynı genişlik),
     sağ/sol/üst beyaz boşluk KALMASIN. Menüde sol ray gizli olduğundan bleed güvenli;
     margin:-shell-x nav ile birebir aynı hizada (scroll-safe: 100vw yerine #ekran kenarı). --- */
  body[data-ekran="menu"] .m-kapak{
    width:auto !important;
    margin-left:calc(-1 * var(--shell-x)) !important;
    margin-right:calc(-1 * var(--shell-x)) !important;
    border-radius:0 !important;                 /* üstte köşe yok */
    height:240px !important;                     /* K3 — 360→240, gereksiz boş turuncu bitti */
  }
  /* K1 — üst nav iç kolonu içerik koluyla HİZALI (logo/arama/aksiyon; kartlarla aynı sol/sağ
     kenar). Eski max-width:1440+24px pad, #ekran içeriğinden (shell-x) kayıktı → kapak/kart
     nav'a göre "omuzlu" görünüyordu. Artık nav içeriği de shell-x kolonunda. */
  .rd-topnav-ic{ max-width:none !important; padding-left:var(--shell-x) !important; padding-right:var(--shell-x) !important; }

  /* --- K3: logo + ad + slogan içerik koluna (shell-x) hizalı, alt-sol; kartlarla aynı sol kenar --- */
  body[data-ekran="menu"] .m-kapak-ic{ max-width:none !important; padding:0 !important; }
  body[data-ekran="menu"] .m-kapak-ic .m-logo{ left:var(--shell-x) !important; bottom:52px !important; top:auto !important; width:84px !important; height:84px !important; }
  body[data-ekran="menu"] .m-kapak-ic .m-kapak-bilgi{ left:calc(var(--shell-x) + 102px) !important; bottom:54px !important; }
  body[data-ekran="menu"] .mkb-ad{ font-size:36px !important; line-height:1.05 !important; }
  body[data-ekran="menu"] .mkb-alt{ font-size:15px !important; margin-top:5px !important; }
  /* favori kalp: içerik SAĞ-üst köşesi (kartlarla aynı sağ kenar) */
  body[data-ekran="menu"] .m-kapak .m-kalp-rest{ right:var(--shell-x) !important; top:16px !important; bottom:auto !important; left:auto !important; }

  /* --- K3: özet kart alt kenara ZARİF binsin (logo ile ≥12px pay) + K2: alttan NET 24px --- */
  body[data-ekran="menu"] .rd-ozet{ margin-top:-24px !important; margin-bottom:24px !important; }
  body[data-ekran="menu"] .m-rest{ margin-bottom:0 !important; }

  /* --- K2: sticky kategori/arama barı doğru ofset (nav altı 72px); bölüm başlıkları örtülmesin.
     ASIL kök-neden .menu-govde overflow-x:clip ile giderildi (yukarıda); burası cila. --- */
  body[data-ekran="menu"] .menu-ust{ top:var(--rd-topnav-h) !important; }
  body[data-ekran="menu"] .menu-govde .kat-bas,
  body[data-ekran="menu"] .wf-bolum,
  body[data-ekran="menu"] .wl-enc{ scroll-margin-top:calc(var(--rd-topnav-h) + 84px) !important; }

  /* --- K4: boş sepet kartı cilası (yüzey/gölge/başlık hizası) + başka-işletme uyarısı --- */
  body[data-ekran="menu"] .myan-kart.myan-bos{ box-shadow:0 6px 22px rgba(60,40,20,.10) !important; }
  body[data-ekran="menu"] .myan-bos .myan-bas{ font-size:17px !important; letter-spacing:-.3px !important; }
  body[data-ekran="menu"] .myan-baska{ text-align:center; border-color:#F1D9A6 !important; background:#FFF8EC !important; }
  body[data-ekran="menu"] .myan-baska .myan-ik{ background:#FCEBC8 !important; color:#B26B10 !important; }
  body[data-ekran="menu"] .myan-baska .myan-bos-bas{ margin-top:2px; }
}


/* ════════════════════════════════════════════════════════════════════════════
   v286 az-fix — A-Z gece-kurul MÜŞTERİ denetim düzeltmeleri (SADECE hit-area +
   taşma + sıkışma; görsel boyut/tasarım DEĞİŞMEZ, v272/KIT-KIRMIZI/sıcak palet korunur).
   Kaynak: GECE_KURUL_RAPORU/UI_AZ_00_SENTEZ.md (MÜŞTERİ) + UI_AZ_01/02/03.
   ════════════════════════════════════════════════════════════════════════════ */

/* 1 — P0: SİPARİŞLERİM @1024-1199 111px yatay taşma. Desktop sol ray-pad(132)+2-sütun
   grid(max-width:1000, merkezli) → 1024'te sağ kart kesik + yatay scroll. Bu aralıkta
   TEK-sütun + fit'li max-width; ≥1200'de 2-sütun KORUNUR (1440 temiz). 768 tek-sütun (temiz). */
@media (min-width:1024px) and (max-width:1199px){
  body[data-ekran="gecmis"] .gecmis-liste{ grid-template-columns:minmax(0,1fr); max-width:min(100%,640px); } /* v286 az-fix */
  body[data-ekran="gecmis"] .gecmis-aktif{ max-width:min(100%,640px); } /* v286 az-fix */
}
/* 2-sütun kaldığı ≥1200'de min-content taşmasına karşı sütunları da 0'a küçülebilir yap (kesim/scroll yok). */
@media (min-width:1200px){
  body[data-ekran="gecmis"] .gecmis-liste{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); } /* v286 az-fix */
}

/* 2 — DOKUNMA HEDEFİ ≥44px (görsel boyut korunur; ::before/::after görünmez tampon VEYA
   min-height ile TIKLAMA alanı büyür — ikon/pill küçük kalır). Tümü tüm genişliklerde geçerli. */

/* 2a — Kategori "Temizle" (#katTemizleBtn): mevcut ::after inset:-11px → 42px; +2 → 46px. */
#katTemizleBtn::after{ inset:-13px -8px; } /* v286 az-fix (20→46 hit) */

/* 2b — Restoran kartı favori kalbi (.r-kalp, görsel 30-36px daire): görünmez ::before tampon
   → 44px isabet (glif/daire boyutu DEĞİŞMEZ). .m-kalp/.ud-kalp zaten ::after inset:-6 ile ≥44. */
.r-kalp{ } /* position:absolute zaten var */
.r-kalp::before{ content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:44px; height:44px; border-radius:50%; } /* v286 az-fix (→44 hit) */

/* 2c — PROMO "Keşfet" CTA (.pr2-cta, görsel min-height:40): ::before dikey +6 → 46 isabet
   (tampon .pr2-ic dolgusunda kalır). Mobil zaten vardı → GLOBAL yapıldı (masaüstü de ≥44). */
.pr2-cta{ position:relative; } /* v286 az-fix */
.pr2-cta::before{ content:''; position:absolute; inset:-3px 0; } /* v286 az-fix (40→46 hit) */

/* 2d — TEMASSIZ + PROFİL SWITCH'leri (.switch, görsel 52×31; knob=::after → ::before kullan):
   dikey +14 → 45 isabet. Mobil-only idi → GLOBAL (masaüstü de ≥44). */
.switch::before{ content:''; position:absolute; inset:-7px 0; } /* v286 az-fix (31→45 hit) */

/* 2e — ÖDEME "Bu adresi kaydet" onay satırı (.adres-kaydet, tıklanabilir satır 19px):
   min-height:44 → satır 44px isabet (metin/checkbox görseli aynı). Sözleşme satırı zaten 44. */
.adres-kaydet{ min-height:44px; } /* v286 az-fix (19→44 hit) */

/* 2f — ÖDEME "Konumumu işaretle" (.konum-pin, 42px → sınır altı): min-height:44. */
.konum-pin{ min-height:44px; box-sizing:border-box; } /* v286 az-fix (42→44 hit) */

/* 2g — TAKİP hızlı-etiket çipleri (.pe-cip, görsel 36px): ::before dikey +8 → 44 isabet
   (chip görseli 36px kalır; yatay genişlemez → komşu çip çakışmaz). */
.pe-cip{ position:relative; } /* v286 az-fix */
.pe-cip::before{ content:''; position:absolute; inset:-5px 0; } /* v286 az-fix (36→46 hit) */

/* 2h — KONUM-SHEET GPS ikonu (.mh-gps-ic, 38px daire): mobil-only idi → GLOBAL (46 isabet). */
.mh-gps-ic{ position:relative; } /* v286 az-fix */
.mh-gps-ic::before{ content:''; position:absolute; inset:-4px; border-radius:50%; } /* v286 az-fix (38→46 hit) */

/* 2i — Tüm sheet kapat butonu (.mh-kapat, 40×40): ::before inset:-2 → 44 daire isabet. */
.mh-kapat{ position:relative; } /* v286 az-fix */
.mh-kapat::before{ content:''; position:absolute; inset:-2px; border-radius:50%; } /* v286 az-fix (40→44 hit) */

/* 2j — BİLDİRİM "Tümünü okundu işaretle" (.bm-tumoku, 29px): ::before dikey +16 → 45 isabet
   (yatay genişlemez → başlık/kapat ile çakışmaz). */
.bm-tumoku{ position:relative; } /* v286 az-fix */
.bm-tumoku::before{ content:''; position:absolute; inset:-8px 0; } /* v286 az-fix (29→45 hit) */

/* 2k — İŞLETME-DETAY adres/telefon linkleri (a.id-adres, metin satırı 22px): min-height:44 +
   flex-ortala → 44px isabet (aralarında id-alt-bas etiketi var → çakışma yok; metin/altçizgi aynı). */
.id-adres{ min-height:44px; display:flex; align-items:center; } /* v286 az-fix (22→44 hit) */

/* 3 — SEPET/360 ürün-adı sıkışması: foto+stepper+çöp ile yarışan .s-ad normal adları
   ("Sucuklu Tost") 2-satıra/ellipsis'e itiyordu. Dar ekranda foto küçült + gap daralt +
   satır dolgusu azalt → ad sütununa daha çok yer → normal ad TEK satır sığar (uzun ad hâlâ
   2-satır clamp). Görsel foto boyutu yalnız ≤400px'de küçülür (premium tasarım korunur). */
@media (max-width:400px){
  .s-satir{ gap:8px; padding-left:10px; padding-right:10px; } /* v286 az-fix */
  .s-satir .s-foto-sar{ width:44px; height:44px; } /* v286 az-fix — ad'a yer */
  .s-satir .adet{ gap:3px; padding:2px; } /* v286 az-fix — stepper kompakt */
  .s-satir .adet .n{ min-width:14px; } /* v286 az-fix */
}
/* ≤384px (360/375 vb.): foto(44)+stepper(~114)+cop(44) ad sutununu ~80px'e sikistiriyor →
   "Sucuklu Tost"(107px) 2-satira kirilir. Bu cok-dar bantta thumbnail gizle (item 3 izinli:
   "foto kucult/gizle") → ad tam genislik alir, normal ad TEK satir. 390+ fotoyu KORUR. */
@media (max-width:384px){
  .s-satir .s-foto-sar{ display:none; } /* v286 az-fix — cok dar: ad'a tam yer */
}

/* ═══ v300 — PUAN ROZETİ TUTARLILIĞI (denetim M1+M2) ═══
   Tüm yüzeyler puanRozetIc() → tek eşik (>=5, altı "Yeni") + tek "★ 4.8 (N)" formatı.
   .puan-say = ortak sayaç stili (over-photo/mri/wf hepsinde aynı). "Yeni" amber değil nötr
   → puanla karışmaz; over-photo badge zaten beyaz-metin, ek override gereksiz. */
.puan-say{ font-weight:600; opacity:.78; font-size:.92em; margin-left:1px; }
.m-rest-info .mri-puan .puan-say{ color:#8A7A66; opacity:1; font-weight:600; font-size:12px; }
.wf-puan.wf-yeni{ color:var(--ink-700,#4A4543); font-weight:700; }

/* v300 — inline boş-durum (denetim M6/M7): yorum listesi + menü-arama gibi sayfa-içi boşlarda
   .bos'un 60vh min-height'ı fazla → kompakt varyant. Zengin .bos grameri (ikon+başlık+açıklama) korunur. */
.bos.bos-kompakt{ min-height:0; padding:26px 12px; }
.bos.bos-kompakt .emoji{ width:60px; height:60px; }
.bos.bos-kompakt .emoji svg, .bos.bos-kompakt .emoji .ico{ width:28px; height:28px; }

/* ═══════════════════════════════════════════════════════════════════════════
   v315 — MOBİL RESTORAN-DETAY: TEK PARÇA COLLAPSED HEADER (≤1023)
   Sorun: scroll'da üst bölge 3 ayrı beyaz şerit gibi yığılıyordu (.ust çizgi+gölge,
   .menu-ust kendi çizgi+gölgesi, .menu-kat-bar beyaz bant) → dikişli, sıkışık görüntü.
   Desen (Wolt venue): .ust + .menu-ust TEK beyaz yüzeye kenetlenir; iç ayraçların
   hepsi kalkar, TEK hairline + TEK yumuşak gölge grubun EN ALTINA taşınır.
   Bu blok dosya SONUNDA kalmalı (3422/3434/4782 !important kurallarını kaskadla yener).
   Kırmızı çizgiler korunur: #menuAraInput / data-menukat / .sec / ust-solid / kaydi
   isimleri değişmez; .menu-ust sticky KALIR (v181); desktop ≥1024 dokunulmaz. */
@media (max-width:1023px){

  /* 0) Yükseklik tek kaynak: .ust içi = 11px pad + 44px .geri + 11px pad = 66px.
        (js venueUstScroll ust.offsetHeight okur → literal 67px zinciri kalkar.) */
  body[data-ekran="menu"]{ --rdet-ust-h: calc(66px + env(safe-area-inset-top)); }
  body[data-ekran="menu"] .ust{ height:var(--rdet-ust-h); box-sizing:border-box; }

  /* 1) .ust solid halde ALT AYRACI YOK — ayraç .menu-ust'un altına taşındı.
        (ust-solid'e hairline GERİ EKLEME: kenetli .menu-ust'un üstüne çizilir, dikiş döner.) */
  body[data-ekran="menu"] .ust.ust-solid{
    background:#fff !important;
    border-bottom-color:transparent !important;
    box-shadow:none !important;
  }
  body[data-ekran="menu"] .ust.kaydi{ box-shadow:none !important; }

  /* 2) .menu-ust — TEK YÜZEY: kenardan kenara, .ust'un 1px altına kenetli.
        z-index:9 KORUNUR (.ust z:30 altında kalmalı — geri butonu + geçiş katmanı). */
  body[data-ekran="menu"] .menu-ust{
    top:calc(var(--rdet-ust-h) - 1px) !important;
    margin:0 -16px !important;
    padding:8px 16px 0 !important;
    background:#fff !important;
    border-bottom:0 !important;
    box-shadow:0 1px 0 rgba(28,26,26,.07),
               0 12px 20px -16px rgba(28,26,26,.18) !important;
  }

  /* 3) Arama — kompakt 44px pill (ayrı beyaz bant görüntüsü biter; iOS zoom durumu
        değişmez: font 15px aynı; focus'ta var(--acc) çerçevesi 3416'dan aynen çalışır). */
  body[data-ekran="menu"] .menu-ara{ margin:0 0 4px !important; }
  body[data-ekran="menu"] .menu-ara input{
    min-height:44px !important;
    padding:10px 14px 10px 42px !important;
    border-radius:999px !important;
    border-color:transparent !important;
  }
  body[data-ekran="menu"] .menu-ara .ara-ik{ left:16px !important; }

  /* 4) Kategori barı — yüzeyin bir SATIRI: kendi bandı + ölü sticky'si (3434) iptal.
        Full-bleed; fade maskeleri padding kenarlarıyla HİZALI (16px) → scroll sonunda
        son çip solmaz, kenarı taşan çip doğal fade alır. */
  body[data-ekran="menu"] .menu-kat-bar{
    position:static !important;
    background:transparent !important;
    margin:0 -16px !important;
    padding:2px 16px 10px !important;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%) !important;
    mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%) !important;
  }
  body[data-ekran="menu"] .menu-kat-cip{
    min-height:40px;                    /* a11y dokunma hedefi (4116) korunur */
    padding:8px 14px !important;
    font-size:14px !important; font-weight:700 !important;
    color:#5E6473 !important;
  }
  /* Seçili çip: SOLID kırmızı — desktop v283 M5(b) (6417) ile aynı dil, mobilde de belirgin. */
  body[data-ekran="menu"] .menu-kat-cip.sec{
    background:var(--acc,#E8312A) !important;
    color:#fff !important;
    font-weight:800 !important;
    box-shadow:0 3px 10px rgba(224,40,31,.24) !important;
  }
}

/* ============================================================================
   ERİŞİLEBİLİRLİK — kapat/sil butonları dokunma hedefi ≥44px (WCAG 2.5.5).
   Görsel boyut KORUNUR (34/30px daire), isabet alanı görünmez ::after ile büyür
   (v190 deseniyle aynı). Yaşlı-müşteri taraması bulgusu.
   ============================================================================ */
.paytr-kapat, .pwa-nudge .pwa-kapat, .adres-kayit-sil{ position:relative; }
/* .dg-kapat zaten position:absolute — override ETME (top/right konumu bozulur);
   absolute buton kendi ::after'ı icin containing block'tur, tampon yine calisir. */
.dg-kapat::after, .paytr-kapat::after, .adres-kayit-sil::after{
  content:''; position:absolute; inset:-6px; border-radius:inherit;
}
.pwa-nudge .pwa-kapat::after{
  content:''; position:absolute; inset:-7px; border-radius:50%;
}

/* ============================================================================
   v432 — OTP / numara-onay sayfası düzeltmeleri (A-Z UX denetimi)
   ========================================================================== */

/* F4 (P0): invisible reCAPTCHA rozeti position:fixed + z-index:2000000000 ile render olur;
   .mh-overlay z-index'i 200 → rozet HER ZAMAN sheet'in üstünde, sağ-altta "Kodu Gönder"
   butonunun üzerinde duruyordu. Google şartları rozeti gizlemeye İZİN VERİR, ancak yerine
   reCAPTCHA bilgilendirme metni gösterilmesi gerekir → .tg-recaptcha-not (musteri.js modal
   gövdesinde) o metni taşır. Metni KALDIRIRSAN rozeti de geri aç. */
.grecaptcha-badge{ visibility:hidden !important; }

/* F12 (P1): .mh-sheet overflow:hidden + klavye açıkken maxHeight kısıtlaması → küçük telefonda
   kod adımının alt butonları ("Numarayı değiştir", hata satırı) kırpılıyor ve KAYDIRILAMIYORDU.
   Gövde kendi içinde kaydırılabilir. */
.tel-sheet .tg-govde{ overflow-y:auto; -webkit-overflow-scrolling:touch; }

/* F19: kapatma düğmesi 40x40 idi — dokunma hedefi alt sınırı 44px. */
.tel-sheet .mh-kapat{ min-width:44px; min-height:44px; }

.tg-recaptcha-not{ font-size:11px; color:var(--soluk); margin-top:14px; line-height:1.5; }
.tg-recaptcha-not a{ color:var(--soluk); text-decoration:underline; }
.tg-yardim summary::-webkit-details-marker{ display:none; }
.tg-yardim summary::marker{ content:''; }
.tg-yardim summary::after{ content:' ▾'; }
.tg-yardim[open] summary::after{ content:' ▴'; }

/* ═══════════════════════════════════════════════════════════════════════════════
   v437 — TASARIM STÜDYOSU TUR 1 (hakem onaylı iş listesi)
   Kaynak: tasarim/denetim/HAKEM-TUR-0.md · ölçümler: tasarim/goruntuler/RAPOR.json
   Bu blok DOSYA SONUNDA: mevcut kuralları silmeden, yalnız kaynak sırasıyla geçersiz
   kılarak çalışır — geri alması tek blok silmek kadar kolay olsun diye.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ── İŞ-2 · Yasal onay satırı ────────────────────────────────────────────────
   Eskiden üç yasal link onay kutusunun <label>'ı İÇİNDEYDİ → sözleşmeyi okumak için
   linke basan müşteri onayı açıp kapatıyordu. Ayrıca linkler 13-15px yükseklikteydi.
   Artık: onay satırı SADECE metin (her yeri güvenle basılır), linkler altında kendi
   44px'lik satırlarında. 44px gerçek yükseklikle sağlanıyor — görünmez tampon hilesi
   YOK, çünkü ölçüm aracının göremediği bir tamponla "düzelttik" demek kendimizi
   kandırmak olurdu. */
.soz-onay{ display:flex; gap:12px; align-items:center; min-height:44px;
  margin:2px 0 6px; padding:6px 4px; line-height:1.45; cursor:pointer; }
.soz-onay input[type="checkbox"]{ -webkit-appearance:auto; appearance:auto;
  width:24px; height:24px; flex:0 0 auto; accent-color:var(--cta-fill,#D62822); }   /* 22→24 = WCAG 2.2 AA 2.5.8 eşiği */
.soz-onay span{ font-size:13.5px; color:var(--metin2,#4A4442); }

.soz-linkler{ display:flex; flex-direction:column; margin:0 0 14px; }
.soz-linkler a{ display:flex; align-items:center; min-height:44px; padding:0 4px;
  font-size:13.5px; font-weight:600; color:var(--acc-ink,#B4231F);
  text-decoration:underline; text-underline-offset:3px; }
.soz-linkler a + a{ border-top:1px solid var(--cizgi2,#ECE8E2); }
.soz-linkler a::after{ content:'↗'; margin-left:auto; opacity:.5; font-weight:400; }

/* "Bu adresi kaydet" kutusu da AA eşiğine çıkar (18 → 24). */
.adres-kaydet input[type="checkbox"]{ width:24px; height:24px; }

/* ── İŞ-3 · Sözleşme hatası artık yalnız renkle bildirilmiyor ────────────────
   Hata kutusunun tek kalıcı işareti 1.74:1 kontrastlı soluk bir çerçeveydi ve tek
   metin 2,2 saniyelik bir toast'taydı — üstelik o toast 360px'te tam da açıkladığı
   satırın üstünü örtüyordu. Artık kalıcı metin var (#f_sozlesme_hata, role="alert").
   Çerçeve #B3261E: beyaza karşı 6.54:1 (arayüz bileşeni için gereken 3:1'in üstünde). */
label.alan-hata{ background:rgba(179,38,30,.07); outline-color:#B3261E; }
.soz-onay.alan-hata + .soz-linkler + #f_sozlesme_hata,
#f_sozlesme_hata.gor{ display:block; }
#f_sozlesme_hata{ margin:-8px 0 14px; padding:0 4px; }

/* ── İŞ-4 · OTP kriz ekranı: kaçış kapısı hata metninin altında ──────────────
   v434'te bu blok yardım <details>'inin içindeydi → 390px'te ekranın son %2'sinde,
   360px'te HİÇ görünmüyordu. SMS arızasında kaybettiğimiz sipariş tam orada kayboluyordu. */
.tg-kacis{ margin-top:12px; padding:12px; border-radius:14px;
  background:var(--acc-50,#FDF2F1); border:1px solid var(--acc-100,#F7D9D6); }
.tg-kacis[hidden]{ display:none; }
.tg-kacis-btn{ display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%; min-height:48px; text-decoration:none; }
.tg-kacis-not{ font-size:12px; color:var(--soluk); margin-top:8px; line-height:1.5; text-align:center; }

/* ODAK HALKASI — hakemin "360px'teki kırmızı hata çerçevesini kaldır" maddesi
   UYGULANMADI, çünkü o çerçeve bir HATA çerçevesi değil, `:focus-visible` odak halkası
   (musteri.css:1085). Kaldırmak WCAG 2.4.7 ihlali ve düpedüz regresyon olurdu.
   Şikâyetin özü doğru: kırmızı halka "hata senin" diye okunuyor, oysa metin "bu bizden
   kaynaklanıyor" diyor. Çözüm halkayı SİLMEK değil, RENGİNİ ayırmak — görünürlük
   korunuyor, yanlış anlam kalkıyor. #1B5E9E beyaza karşı 6.15:1. */
.tel-sheet input:focus-visible,
.tel-sheet button:focus-visible,
.tel-sheet a:focus-visible{ outline-color:#1B5E9E; }

/* ── İŞ-5 · Tek bekleme yüzeyi ───────────────────────────────────────────────
   Kodda beş ayrı "devre dışı" solukluğu vardı (.45/.5/.55/.6/.72) → beyaz üstünde
   1.99 / 2.15 / 2.33 / 2.53 / 3.03:1; en iyisi bile okunamıyordu. Artık tek kural:
   yüzey #F2EDEB, metin #6B6360 → 5.29:1. Ve `disabled` yerine `aria-disabled`
   kullanıldığı için buton sekme sırasında KALIYOR; tıklama burada durduruluyor. */
.btn-buyuk[aria-disabled="true"], .btn-sade[aria-disabled="true"],
.btn-buyuk:disabled, .btn-sade:disabled, .btn-secondary:disabled{
  background:#F2EDEB !important; color:#6B6360 !important;
  border-color:var(--cizgi2,#ECE8E2) !important; box-shadow:none !important;
  opacity:1 !important; cursor:not-allowed; }
[aria-disabled="true"]{ pointer-events:none; }
[aria-disabled="true"]:focus-visible{ pointer-events:auto; }   /* klavye odağı görünsün */

/* ── İŞ-6 · Kapı/Kat alanlarına kalıcı etiket ───────────────────────────────
   Placeholder-etiket deseni: alan dolunca açıklama KAYBOLUYOR. Dolu formda ekranda
   yalnız "4" ve "2" kalıyordu. Aynı formdaki f_ad/f_tel/f_adres'te etiket vardı,
   bu ikisi atlanmıştı. */
.adres-ek-alan{ flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.adres-ek-alan label{ font-size:12.5px; color:var(--soluk); }
.adres-ek-alan input{ width:100%; }

/* ── İŞ-7 · Beyaz yazı taşıyan kırmızı YÜZEYLER kontrast eşiğine çekiliyor ───
   Marka kırmızısı #E8312A beyaza karşı 4.28:1 — WCAG AA metin eşiği 4.5. Bu tek değer
   aynı anda ana CTA'da, aktif segmentte, "5 ürün" rozetinde ve "zorunlu" etiketinde.
   Kural: DOLGU (üstünde beyaz yazı) → #D62822 (5.02:1). Kırmızı METİN → #B4231F.
   #E8312A marka/kimlik rengi olarak KALIYOR (logo, ikon, dekor) — kimliği bozmuyoruz,
   yalnız yazı taşıyan yüzeyleri okunur yapıyoruz. */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  --acc-yazi-zemin:#D62822;   /* beyaz metin taşıyan dolgular */
  --acc-yazi:#B4231F;         /* beyaz üstünde kırmızı metin */
}
/* TUR 2 DÜZELTMESİ — bu blok Tur 1'de UYDURMA sınıf adlarıyla yazılmıştı
   (`seg-btn`, `tesl-seg`, `sepet-rozet`, `rozet-adet`, `zorunlu-et`, `ops-zorunlu` —
   altısı da bu kod tabanında YOK) ve dört hedeften yalnız biri düzeldi. Hakem yakaladı.
   Bu kez seçiciler TAHMİN EDİLMEDİ: hasatçı her karede `#E8312A`'yı gerçekten kullanan
   öğeleri gerçek seçicileriyle raporluyor (`olcum.kirmiziKullanim`) ve liste oradan alındı.
   Ölçülen gerçek kullanıcılar: a.skip-link · span.oz-adet · .zaman-seg button.sec ·
   .menu-kat-cip.sec · (satır-içi "· zorunlu" → .ode-zorunlu sınıfına çevrildi). */
.btn-buyuk:not(.btn-sade):not([aria-disabled="true"]):not(:disabled),
.btn-acc, .skip-link,
.zaman-seg button.sec, .menu-kat-cip.sec, .wlt-fsay{
  background-color:var(--acc-yazi-zemin) !important; }
/* `.oz-adet` tek sınıfla yazınca tutmadı: `.ode-ozet .oz-adet` (0,2,0) onu yeniyor —
   bu dosyada ÜÇÜNCÜ kez aynı ders. Ayrıca oradaki gölge de marka kırmızısıydı
   (rgba(232,49,42,.3)) → İŞ-8 gereği nötr mürekkebe çevriliyor. */
.ode-ozet .oz-adet{ background:var(--acc-yazi-zemin) !important;
  box-shadow:0 2px 8px rgba(26,24,23,.18) !important; }
.ode-zorunlu, .kvkk a, .tg-yardim summary, .s-indirim{
  color:var(--acc-yazi) !important; }
.ode-zorunlu{ text-transform:none; font-weight:600; }   /* satır-içi stilin taşıdığı görünüm korunur */

/* ── İŞ-8 · Tanımsız gölge token'ları + kırmızı gölge ────────────────────────
   --sh-modal / --sh-floating / --sh-card: her biri 1 kez KULLANILIYOR, 0 kez tanımlı.
   Tarayıcıda doğrulandı (tasarim/tema-probu.cjs): üçü de "(yok)" → modal, yüzen sepet
   ve o kart sessizce GÖLGESİZ çiziliyordu. Ayrıca gölgelerdeki marka kırmızısı
   (rgba(232,49,42,…)) tüm sayfayı pembeye boyuyordu; nötr mürekkebe çevrildi. */
:root, :root[data-tema="acik"], :root[data-tema="koyu"]{
  --sh-card:    0 1px 2px rgba(26,24,23,.06), 0 2px 8px rgba(26,24,23,.05);
  --sh-floating:0 4px 10px rgba(26,24,23,.10), 0 12px 28px rgba(26,24,23,.10);
  --sh-modal:   0 8px 20px rgba(26,24,23,.14), 0 24px 56px rgba(26,24,23,.16);
}

/* ── İŞ-9 · takip: sabit çubuk içeriği örtmesin + ağırlık takası ─────────────
   Ölçüldü: birincil CTA'nın %63'ü alt sekme çubuğunun ALTINDA kalıyordu; ekranda
   etiketsiz kırmızı bir dilim görünüyordu ("yarım yüklenmiş" izlenimi).
   Sebep: :3867'deki genel `.sar{padding-bottom:calc(var(--botnav-h)+18px)!important}`
   takip'e özel :4546 kuralını (+40px) `!important` ile eziyor. Burada takip'e özel
   ve `!important`'lı bir kuralla kapatıyoruz — 18px, 56px'lik çubuğun altında kalan
   bir buton için yetmiyor. */
body[data-ekran="takip"] .sar{ padding-bottom:calc(var(--botnav-h) + 96px) !important; }

/* Ağırlık takası: güven ekranının değerli eylemi işletmeyi aramak. "Dükkanım'a dön"
   alt sekme çubuğundaki "Ana Sayfa" ile birebir aynı işi yapıyordu → metin butonu. */
.ara-btn--birincil{ background:var(--acc-yazi-zemin) !important; color:#fff !important;
  border-color:transparent !important; font-weight:700; }
.ara-btn--birincil svg{ stroke:#fff; }
.takip-don{ background:transparent !important; box-shadow:none !important;
  border:1px solid var(--cizgi2,#ECE8E2) !important; color:var(--soluk) !important; font-weight:600; }

/* ── İŞ-11 · menü başlığındaki eylem satırı ikincilleştirildi ────────────────
   Ölçüldü/görüldü: ekrandaki EN BASKIN öğe `Ara` (dolu sıcak degrade, yarım genişlik)
   iken ilk yemek adı y≈827/844'teydi. Menü ekranının işi telefon ettirmek değil, ürün
   seçtirmek. Butonlar silinmedi — 47px tam-genişlik çiftinden 44px'lik kompakt ikon
   çiftine indirildi (dokunma hedefi AA ve AAA eşiğinin ikisini de geçiyor). */
.m-rest-aksiyon{ justify-content:flex-end; gap:8px !important; margin-top:10px !important; }
.m-rest-aksiyon .ara-btn{ flex:0 0 auto !important; width:auto !important; min-width:44px !important;
  min-height:44px !important; padding:0 14px !important; font-size:14px !important; border-radius:12px !important; }
.m-rest-aksiyon a.ara-btn{ background:var(--acc-yazi-zemin) !important; box-shadow:none !important; }

/* ── İŞ-12 · zanaat paketi ──────────────────────────────────────────────────
   (e) Para üstü seçenekleri: hemen altındaki BAHŞİŞ hapları düzgün çerçeveliyken bunlar
       çerçevesiz kalın metindi — aynı ekranda aynı iş, biri bileşen biri ham metin. */
.paraustu-cip .pu-cip{ min-height:44px; padding:0 14px; border-radius:999px;
  background:var(--cam-yogun,#F7F5F2); border:1px solid var(--cam-kenar,#E6E1DA);
  color:var(--metin); font-weight:600; font-size:14px;
  display:inline-flex; align-items:center; justify-content:center; }
.paraustu-cip .pu-cip:active{ transform:scale(.94); }
.paraustu-cip .pu-cip.pu-tam{ font-weight:700; }

/* (b) Favori butonunun beyaz maske çıkıntısı: kalp dairesi ile içerik yaprağının
       kesiştiği yerde hardal zemine keskin kesikli beyaz bir dil taşıyordu. */
.m-kalp-rest{ overflow:hidden; isolation:isolate; }

/* (c) Dükkan adı ile altyazısı arasındaki kilim motifi ikisini birbirinden koparıyordu.
       Kaynağı `.m-rest .m-rest-ad::after` (musteri.css:5988, "koçboynuzu usta-imzası").
       Bölüm başlıklarındaki motif (`.wf-h2::before`) BİLİNÇLİ bir işaret — o KALIYOR;
       kaldırılan yalnız ad ile alt satırın arasına giren, okuma akışını kesen kopya. */
.m-rest .m-rest-ad::after{ display:none !important; }

/* ── Tur 1 ikinci geçiş: kalan 4 AA ihlali ──────────────────────────────────
   İlk geçişte `.soz-onay input[type="checkbox"]` yazmıştım ama :4586'daki
   `#f_sozlesme{width:22px}` ID kuralı onu yeniyor (0,1,1 < 1,0,0). Ölçüm bunu
   yakaladı: kutu 22×22 kalmıştı. Ders: bu dosyada ID ile yazılmış bir kuralı
   sınıfla geçersiz kılmaya çalışma. */
#f_sozlesme{ width:24px !important; height:24px !important; accent-color:var(--cta-fill,#D62822); }
#f_adresKaydet{ width:24px !important; height:24px !important; }

/* reCAPTCHA bildirimindeki iki link (Google'ın METNİ ZORUNLU kıldığı bölüm — metin
   kaldırılamaz, ama dokunma hedefi büyütülebilir): 13px yükseklikteydiler. */
.tg-recaptcha-not{ line-height:1.9; }
.tg-recaptcha-not a{ display:inline-block; min-height:24px; line-height:24px; padding:0 2px; }

/* Onboarding "Şimdilik geç": 93×17 — kullanıcının ilk temasta basacağı çıkış. */
.ob3-skip{ min-height:44px; padding:0 16px; display:inline-flex; align-items:center; justify-content:center; }

/* (b) Favori kalbi kapak ile içerik yaprağının DİKİŞİNDE duruyordu: beyaz daire ile
       beyaz yaprak birleşince hardal zemine keskin kesikli beyaz bir dil taşıyordu.
       Çözüm maskeyle uğraşmak değil — butonu dikişten yukarı, tamamen fotoğrafın
       üstüne almak (Wolt/Uber deseni de bu). */
/* Özgüllük notu: :3403'teki `.m-kapak .m-kalp-rest` (0,2,0) tek sınıflı bir kuralı (0,1,0)
   yener — ilk denemem tam bu yüzden tutmadı, ölçüm yakaladı (kalp y=127'de kaldı).
   Kapak 179px, içerik yaprağı ~39px BİNDİRİYOR → dikiş y≈140. `bottom:12px` kalbi
   (y 127-167) tam o dikişe oturtuyordu: dairenin alt yarısı beyaz yaprağın üstüne
   düşünce iki beyaz birleşiyor ve hardal zemine keskin kesikli bir dil taşıyordu.
   `bottom:52px` kalbi dikişin ÜSTÜNDE tutar; yukarı almak da olmaz — v129b notunda
   yazdığı gibi yapışkan başlık onu örter. */
.m-kapak .m-kalp-rest{ bottom:52px !important; top:auto !important; }

/* ═══ v437 TUR 2 — hakemin Tur 1 şartları ═══════════════════════════════════ */

/* İŞ-12(a) · SEPET ÖDÜL BANDI — başarı mesajı UYARI zeminindeydi.
   "Teslimat ücretsiz — kazandın!" bir kazanım; ama zemin #FFF4F4 (kırmızı tint),
   kenarlık #FAD9D9 ve ✓ ikonu `--terra` (kırmızı) idi. Renk semantiği tersine dönmüş:
   kullanıcı ödül bandını uyarı sanıyor. Yeşile çevriliyor ve ✓ metinle AYNI satıra
   giriyor (`flex-direction:column` onu ayrı satıra atıyordu).
   Kontrast: #1E7A4B / #E8F5EC = 5.34:1 (AA ✔). İlerleme çubuğu (eşiğe kalan tutar)
   hâlâ kırmızı kalır — o bir HEDEF göstergesi, ödül değil; yalnız `.ok` durumu yeşil. */
.sepet-nudge.ok{ flex-direction:row; align-items:center; gap:10px;
  background:#E8F5EC !important; border-color:#BFE3CD !important; }
.sepet-nudge.ok .sn-ik{ color:#1E7A4B !important; flex:0 0 auto; }
.sepet-nudge.ok .sn-txt{ color:#1E7A4B; }
.sepet-nudge.ok .sn-txt b{ color:#1E7A4B !important; }

/* menu kapağı: kalp yukarı alınınca ALTINDAKİ koçboynuzu motifi ortaya çıktı ve
   içerik yaprağının köşesi tarafından çapraz kesiliyor (hakem Tur 1'de yakaladı).
   Motif dekoratif; kapakta kırpılmaktansa görünmemesi doğru. */
.m-kapak-marka .mkm-ik{ opacity:0; }

/* İŞ-7 · KALAN ÜÇ METİN TAŞIYAN KIRMIZI DOLGU.
   Yöntem notu: bu üçü hasatçının `olcum.kirmiziKullanim` ölçümünden geldi — yine
   TAHMİNLE değil, DOM'un kendi bildirdiği seçicilerle. Dekoratif kırmızı dolgular
   (ikon çipleri, svg, nokta göstergeleri) BİLEREK dokunulmadan bırakıldı: onlar
   metin taşımıyor, WCAG 1.4.11 eşiği 3:1 ve #E8312A zaten 4.28:1 ile geçiyor.
   "Hepsini değiştirelim" demek markayı gereksiz yere soldururdu. */
span.sl-rozet{ background:var(--acc-yazi-zemin) !important; }
button#mhDegistirBtn{ background:var(--acc-yazi-zemin) !important; color:#fff !important;
  border-color:transparent !important; }
/* :908 gradyanı `var(--acc)` ile başlıyor; :3453 onu `!important` ile ezdiği için
   ölçümde hâlâ #E8312A çıkıyordu — kaynak sırasıyla ve aynı özgüllükle kapatılır. */
/* :6437 `body[data-ekran="menu"] .menu-kat-cip.sec` (0,3,1) tek-sınıf kuralımı yeniyor —
   bu dosyada DÖRDÜNCÜ özgüllük dersi. Bu yüzden ölçüm zinciri var: her turda gerçekten
   hangi öğenin hangi rengi kullandığı raporlanıyor, "yazdım demek düzeldi demek değil". */
body[data-ekran="menu"] .menu-kat-cip.sec,
.menu-kat-cip.sec{ background:var(--acc-yazi-zemin) !important; color:#fff !important; }

/* ═══ v437 TUR 3 — hakemin Tur 2 şartları ═══════════════════════════════════
   Bu bloktaki üç düzeltmenin ÜÇÜ DE ölçümün kör noktalarındaydı: hasatçı Tur 2'ye
   kadar ne degradeleri ne de kırmızı METNİ tarıyordu. Yani "temizledik" dediğimiz
   yüzeyden DAHA KÖTÜ kontrastlar (3.97:1) ölçülmeden duruyordu. Ölçüm düzeltildi,
   sonra bunlar bulundu — sıra bu olmalıydı. */

/* İŞ · ALT GEZİNME AKTİF SEKMESİ.
   Aktif sekme #E8312A METİN taşıyordu (beyaza karşı 4.28:1, AA altı) ve durum
   YALNIZ RENKLE veriliyordu — pasif #6B7079 ile aktif #E8312A arasındaki fark
   1.16:1, yani renk körlüğünde ya da güneş altında ayırt edilemez.
   İki düzeltme birden: kontrast AA'ya çıkar + renk DIŞI bir işaret (kalınlık +
   üst gösterge çubuğu) eklenir. */
.botnav-ic button{ color:var(--soluk,#6B7079); font-weight:600; }
.botnav-ic button.aktif{ color:var(--acc-yazi,#B4231F) !important; font-weight:800; position:relative; }
/* :3851 `.botnav-ic button::after, .botnav-ic button::before{ content:none !important }`
   göstergeyi öldürüyordu — CSS'i yazdım diye çizildiğini varsaymamak lazım. Ölçümle
   yakalandı (`::before` content = "none"): genişlik/yükseklik/zemin hesaplanıyor ama
   `content:none` kutuyu HİÇ üretmiyor, yani renk-dışı işaret ekranda yoktu.
   Aynı özgüllük + `!important` ile geri açılır — YALNIZ aktif sekme için. */
.botnav-ic button.aktif::before{ content:'' !important; position:absolute; top:0; left:50%;
  transform:translateX(-50%); width:26px; height:3px; border-radius:0 0 3px 3px;
  background:var(--acc-yazi-zemin,#D62822); }
.botnav-ic button.aktif svg{ stroke:var(--acc-yazi,#B4231F); }

/* İŞ · DEGRADE CTA'LAR. Beyaz metin taşıyan degradelerin açık ucu #FF6B47 gibi
   çok açık tonlarla başlıyor → ölçülen 3.97-4.13:1. Açık uç koyulaştırılır;
   degradenin kendisi (derinlik hissi) korunur. */
/* v437 HOTFIX Ş1 — `.puan-banner` BU LİSTEDEN ÇIKARILDI (hakem Tur 3, CANLI regresyon).
   Hatam: listeyi "kırmızı degrade taşıyan yüzeyler" diye kurdum, oysa `.puan-banner`
   BEYAZ METİNLİ BİR DEGRADE DEĞİL — `rgba(232,49,42,.10→.04)` açık bir sis ve üstündeki
   metin KOYU. Zemini koyu kırmızıya çevirince metin okunmaz oldu; ataya yazdığım
   `color:#fff !important` ise KENDİ `color`'ı olan çocuklara İNMEZ.
   Ölçülen sonuç: "★ DÜKKANIM PUAN" 1.13:1 (görünmüyor), gövde 2.83:1.
   DERS: bir yüzeyin zeminini değiştirmeden önce üstündeki metnin rengini de oku. */
.ob3-cta, .bahsis-cip.sec{
  background-image:linear-gradient(180deg, #D62822 0%, #A81C17 100%) !important; }
.bahsis-cip.sec{ color:#fff !important; }
.botnav-ic button.aktif{ background-image:none !important; background-color:transparent !important;
  box-shadow:none !important; }   /* aktif sekme artık dolgu değil, metin+gösterge */



/* v437 Tur 3 — 5 adet `@media (prefers-color-scheme:dark)` ADASI KALDIRILDI.
   Gerekçe (hakem Tur 2 ölçümü): uygulamanın GERÇEK bir koyu teması yok — `[data-tema="koyu"]`'nun
   24 geçişinin 24'ü de seçici listesinde `:root`/`acik` taşıyor, yani aynı değeri zorluyor.
   Bu beş ada ise işletim sistemi koyu modunda sayfanın YALNIZ birkaç parçasını koyulaştırıyordu:
   sonuç bütün değil, yamalı bir kutu — ve biri ÖLÇÜLMÜŞ bir AA ihlali taşıyordu
   (#C0492F / #1B1B1D = 3.43:1, gereken 4.5).
   Karar: yarım koyu tema, hiç koyu temadan KÖTÜDÜR. Uygulama koyu modda tutarlı biçimde
   açık kalır; gerçek koyu tema kendi turunda (Tur 4) token tabanıyla kurulacak.
   Silinen bloklar git geçmişinde ve tasarim/denetim/HAKEM-TUR-2.md'de kayıtlı. */

/* v437 Tur 4 İŞ-6 — Açılıştaki X kaldırıldı. `#obKapat` ve `#obGec` BİREBİR aynı kapat()'ı
   çağırıyordu; iki özdeş çıkış yerine tek, dürüst, niyetini söyleyen bir bağlantı kalır:
   "Şimdilik geç" (44px hedefli, alt-orta, başparmakla erişilebilir). Giden X 38px'lik
   daireydi, sağ üstte — tek elle en zor köşe — ve "kapat" ne olacağını söylemiyordu.
   ŞART: `role="dialog" aria-modal="true"` bir çıkış vaat ediyor → ESC dinleyicisi
   musteri.js'te EKLENDİ (bu kural onsuz uygulanmamalıydı). */
.ob-v3 .ob3-x, #obKapat{ display:none !important; }

/* v437 Tur 4 İŞ-7 — açılışta DÖRT ayrı gölge reçetesi vardı, hiçbiri paylaşılmıyordu.
   `body[data-ekran="acilis"]` kapsamında iki yerel değişkene indirildi. GLOBAL TOKEN'A
   DOKUNULMADI — bu ekranın dışına sızmaz.
   Rozetin 5 katmanı 3'e indi: çıkarılanlar (a) `inset 0 0 0 3px rgba(255,255,255,.55)`
   — bu bir gölge değil, kenarlık; gerçek `border` olarak yazıldı, (b) `0 4px 10px` —
   üstündeki 18px'lik büyük gölgenin altında zaten görünmüyordu.
   Rozetin "kabarık/3B" hissi bu ekranın en beğenilen zanaat parçası; katman azaltılırken
   ÖNCE/SONRA kareleri yan yana karşılaştırıldı. */
.ob-v3{
  --ob-golge-yuzey:    0 8px 22px rgba(60,8,4,.35);
  --ob-golge-yukselti: 0 12px 26px rgba(200,25,15,.5);
}
.ob-v3 .ob3-feat{ box-shadow:var(--ob-golge-yuzey); }
.ob-v3 .ob3-ic{ box-shadow:inset 0 2px 3px rgba(255,255,255,.5), var(--ob-golge-yuzey); }
.ob-v3 .ob3-cta{ box-shadow:var(--ob-golge-yukselti), inset 0 1px 0 rgba(255,255,255,.4), inset 0 -3px 8px rgba(120,10,5,.55); }
.ob-v3 .ob3-badge{
  border:3px solid rgba(255,255,255,.55);   /* eskiden inset box-shadow'du — gölge değil, kenarlık */
  box-shadow:inset 0 4px 8px rgba(255,255,255,.95), inset 0 -12px 22px rgba(150,70,30,.42), 0 18px 34px rgba(70,10,4,.6); }


/* v437 HOTFIX — alt gezinme İŞ-3'ün eksik kalan iki parçası.
   Hakem ölçtü: gösterge çubuğu çizildi ama metin rengi/kalınlığı DEĞİŞMEDİ, çünkü etiket
   `.bn-et` içinde ve onun kendi bildirimleri var (`font-weight:600 !important`, `color:#C01E18`).
   Aynı ders: ataya yazmak yetmez, çocuğa yazılmalı.
   NOT: `#C01E18` zaten 6.10:1 ile AA geçiyordu — bu bir ihlal düzeltmesi DEĞİL, renk-dışı
   ayrımı güçlendirme. Kalınlık 360px'te "Siparişler"i kırpabileceği için 700'de bırakıldı. */
.botnav-ic button.aktif .bn-et{ color:var(--acc-yazi,#B4231F) !important; font-weight:700 !important; }


/* ═══════════════════════════════════════════════════════════════════════════
   v455 — DEĞERLENDİRME YOLU (Siparişlerim → puanlama modalı)
   ───────────────────────────────────────────────────────────────────────────
   HATA: puanlama formu YALNIZ takip ekranındaydı; sipariş teslim olunca o ekran
   kapanıyor ve müşteri siparişine bir daha ulaşamıyordu → puan/yorum veremiyordu.
   Artık "Siparişlerim" kartında "Değerlendir" butonu var ve form bir modalda açılıyor
   (takip ekranına GİTMİYOR — v448 hayalet-rozet hatası dirilmesin diye).
   =========================================================================== */

/* Kart aksiyonları: "Değerlendir" birincil vurgu, "Tekrar Söyle" sağda kalmaya devam.
   .gecmis-alt .btn-tekrar{margin-left:auto} kuralı ilk butonu sağa itiyordu; iki buton
   varken boşluk ARADA kalsın diye ilkinin margin'i sıfırlanır. */
.gecmis-alt .btn-degerlendir{ margin-left:auto; }
.gecmis-alt .btn-degerlendir ~ .btn-tekrar{ margin-left:0; }
.btn-degerlendir{ background:var(--primary-tint) !important; color:var(--primary-ink) !important;
  box-shadow:inset 0 0 0 1px var(--border) !important; }
.btn-degerlendir .ico{ color:#F5A524; }
/* Puanlanmış sipariş: tıklanamaz bilgi işareti (buton DEĞİL — yapacak iş yok). */
.gk-puanlandi{ margin-left:auto; display:inline-flex; align-items:center; gap:6px;
  font-size:var(--fs-xs); font-weight:800; padding:6px 11px; border-radius:var(--r-pill);
  background:rgba(21,179,107,.14); color:#15803d; }
.gk-puanlandi .ico{ width:14px; height:14px; }
.gk-puanlandi ~ .btn-tekrar{ margin-left:0; }

/* Modal kutusu: form uzun (3 kırılım + etiketler + ürün yıldızları + foto + yorum) →
   kendi içinde kayar, arka sayfayı İTMEZ (overscroll-behavior:contain — v236 dersi). */
.mhm-box--puan{ max-height:88vh; overflow-y:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch; }
.puan-modal-bas{ display:flex; align-items:flex-start; gap:var(--sp-3); }
.puan-modal-bas .mhm-title{ flex:1; min-width:0; }
.puan-modal-kapat{ flex:0 0 auto; width:36px; height:36px; border:0; border-radius:50%;
  background:var(--primary-tint); color:var(--primary-ink); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent; }
.puan-modal-kapat .ico{ width:18px; height:18px; }
/* Modal içinde form kutusu zaten kart üstünde → ikinci cam katman gereksiz. */
.mhm-box--puan .puan-kutu{ margin-top:var(--sp-3); padding:0; background:none;
  border:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }