/* Varsayılan (design1) teması — beyaz, sade, uygulama tarzı menü.
   Landing v3 telefon ekranından uyarlandı. Katmanlar ortak ölçeği kullanır:
   sticky 100, floating 200, overlay 1000, sheet 1010, toast 2000 (var(--z-*)). */
@font-face{font-family:'Inter';font-weight:400 700;font-display:swap;src:url('/assets/fonts/inter-normal-400_700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-weight:400 700;font-display:swap;src:url('/assets/fonts/inter-normal-400_700-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Bricolage Grotesque';font-weight:500 800;font-display:swap;src:url('/assets/fonts/bricolage-grotesque-normal-500_800-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Bricolage Grotesque';font-weight:500 800;font-display:swap;src:url('/assets/fonts/bricolage-grotesque-normal-500_800-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --ink:#0f172a;--text:#111827;--soft:#4b5563;--muted:#6b7280;--line:#eef0f3;--fill:#f3f4f6;
  /* Vurgu: "+" düğmesi, sepet çubuğu, seçili kategori. Marka rengi seçilirse
     qrkafe_brand_override_css() --accent/--on-accent'i ezer (onPrimary kontrastlı). */
  --accent:#111827;--on-accent:#fff;--accent-soft:#f3f4f6;
  --ok:#15803d;--bad:#b91c1c;
  /* Üst alan rengi (kapak görseli yokken zemin) — qrkafe_header_override_css() ezer */
  --header-base:#1f2937;--header-deep:#111827;--header-deeper:#0b1120;
  --head:'Bricolage Grotesque','Inter',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --body:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
/* clip (hidden değil): sticky kategori şeridini bozmadan yatay taşmayı keser. */
html,body{overflow-x:clip}
html{scroll-behavior:smooth;scroll-padding-top:var(--category-scroll-offset,76px)}
body.d1{font:400 16px/1.45 var(--body);color:var(--text);background:#fff;min-height:100vh;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.d1 [hidden]{display:none!important}
/* Sıfırlamalar :where() ile sıfır özgüllükte: bileşen sınıfları rahatça ezsin. */
:where(.d1) img{display:block;max-width:100%}
:where(.d1) button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:where(.d1) a{color:inherit}
.d1 :focus-visible{outline:3px solid #2563eb;outline-offset:2px;border-radius:12px}
.d1-skip{position:absolute;left:12px;top:-60px;z-index:var(--z-toast,2000);background:var(--ink);color:#fff;padding:10px 16px;border-radius:12px;text-decoration:none;font-weight:600}
.d1-skip:focus{top:12px}

/* ---------- Kapak + kimlik ---------- */
.d1-head{position:relative}
.d1-cover{position:relative;height:clamp(220px,62vw,320px);overflow:hidden;background:linear-gradient(160deg,var(--header-deeper),var(--header-deep) 55%,var(--header-base))}
.d1-cover img{width:100%;height:100%;object-fit:cover}
.d1-cover::before{content:"";position:absolute;inset:0 0 auto;height:96px;background:linear-gradient(rgba(0,0,0,.38),rgba(0,0,0,0));z-index:1;pointer-events:none}
.d1-cover::after{content:"";position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,.72) 62%,#fff);pointer-events:none}
.d1-topbar{position:absolute;top:max(12px,env(safe-area-inset-top));inset-inline-end:12px;z-index:5;display:flex;gap:8px}
.d1-topbar .qr-lang-btn{min-height:40px;background:rgba(15,23,42,.42);border-color:rgba(255,255,255,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}

.d1-id{position:relative;z-index:2;display:grid;justify-items:center;text-align:center;margin-top:-58px;padding:0 20px}
.d1-logo-ring{display:grid;place-items:center;width:104px;height:104px;padding:4px;background:#fff;border-radius:50%;box-shadow:0 6px 20px rgba(15,23,42,.14)}
.d1-logo-ring.is-square{border-radius:22%}
.d1-logo-ring.is-plain{background:transparent;box-shadow:none;padding:0}
.d1-logo-ring .store-logo{display:block;width:96px;height:96px;border-radius:50%;overflow:hidden;background:#fff}
.d1-logo-ring .store-logo img{width:100%;height:100%;object-fit:cover}
.d1-name{margin-top:12px;font:800 clamp(26px,7.4vw,34px)/1.1 var(--head);letter-spacing:-.025em;color:var(--ink);text-wrap:balance;overflow-wrap:anywhere}
.d1-tag{margin-top:4px;font-size:14px;color:var(--muted);text-wrap:balance}
.d1-status{margin-top:8px;display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:600;color:var(--muted)}
.d1-status svg{width:17px;height:17px;flex:none}
.d1-status.is-open{color:var(--ok)}
.d1-status.is-closed{color:var(--bad)}

/* ---------- Masaya | Eve sipariş ---------- */
.d1-seg{margin:18px 16px 0;display:flex;padding:4px;border-radius:999px;background:#f1f2f5}
.d1-seg a,.d1-seg button{flex:1;display:grid;place-items:center;min-height:44px;border-radius:999px;font-size:15px;font-weight:600;color:var(--soft);text-decoration:none;transition:background-color .2s,color .2s,box-shadow .2s}
.d1-seg .on{background:#fff;color:var(--ink);box-shadow:0 1px 8px rgba(15,23,42,.12)}
.d1-seg a:not(.on):hover,.d1-seg button:hover{color:var(--ink)}

/* ---------- Bilgi çipleri ---------- */
.d1-chips{margin:12px 0 0;padding:0 16px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;scroll-padding-inline:16px}
.d1-chips::-webkit-scrollbar{display:none}
.d1-chip{flex:0 0 auto;display:flex;align-items:center;gap:8px;min-height:48px;padding:0 14px;border-radius:16px;background:var(--fill);font-size:14px;font-weight:600;color:#1f2937;text-decoration:none;white-space:nowrap;scroll-snap-align:start}
.d1-chips.is-even .d1-chip{flex:1 0 auto}
.d1-chip>span{overflow:hidden;text-overflow:ellipsis}
.d1-chip svg{width:18px;height:18px;flex:none;color:var(--muted)}
.d1-chip .chev{width:16px;height:16px;margin-inline-start:auto;color:#9ca3af}
html[dir="rtl"] .d1-chip .chev{transform:scaleX(-1)}
a.d1-chip:hover,button.d1-chip:hover{background:#eceef1}

/* ---------- Aksiyonlar (garson, rezervasyon, yorum) ---------- */
.d1-actions{margin:10px 16px 0;display:flex;flex-wrap:wrap;gap:8px}
.d1-act{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid #e5e7eb;background:#fff;font-size:14px;font-weight:600;color:var(--ink);text-decoration:none;flex:1 1 auto}
.d1-act svg{width:18px;height:18px;flex:none}
.d1-act:hover{background:var(--fill)}

.d1-note{margin:14px 16px 0;display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;background:#f9fafb;border:1px solid var(--line)}
.d1-note-ic{font-size:26px;line-height:1}
.d1-note strong{display:block;font:700 16px/1.25 var(--head);color:var(--ink)}
.d1-note span{display:block;font-size:14px;color:var(--soft);margin-top:2px}

/* ---------- Kategori şeridi + arama ---------- */
.d1-sticky{position:sticky;top:0;z-index:var(--z-sticky,100);margin-top:20px;padding:8px 0;background:rgba(255,255,255,.97);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.d1-sticky.is-stuck{border-bottom-color:var(--line)}
.d1-bar{display:flex;align-items:center;gap:8px;padding:0 16px}
.d1-search-btn,.d1-search-x{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--fill);color:var(--ink)}
.d1-search-btn svg,.d1-search-x svg{width:20px;height:20px}
.d1-tabs{flex:1;min-width:0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;scroll-padding-inline:16px}
.d1-tabs::-webkit-scrollbar{display:none}
.d1-tab{flex:none;display:grid;place-items:center;min-height:44px;padding:0 16px;border-radius:999px;font-size:15px;font-weight:600;color:var(--soft);text-decoration:none;white-space:nowrap;scroll-snap-align:start;transition:background-color .2s,color .2s}
.d1-tab:hover{color:var(--ink)}
.d1-tab.active{background:var(--accent);color:var(--on-accent)}
.d1-search{flex:1;min-width:0;display:flex;align-items:center;gap:8px}
.d1-search-field{flex:1;min-width:0;display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:999px;background:var(--fill)}
.d1-search-field svg{width:18px;height:18px;flex:none;color:var(--muted)}
.d1-search-field input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:500 16px/1.2 var(--body);color:var(--ink)}
.d1-search-field input::placeholder{color:var(--muted)}
.d1-search-field:focus-within{box-shadow:0 0 0 3px #2563eb}
.d1-search-field input::-webkit-search-cancel-button{display:none}

/* ---------- Ürün listesi ---------- */
.d1-menu{padding-bottom:8px}
.d1-sec{padding:22px 16px 0;scroll-margin-top:var(--category-scroll-offset,76px)}
.d1-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;scroll-margin-top:var(--category-scroll-offset,76px)}
.d1-sec-head h2{font:700 22px/1.2 var(--head);letter-spacing:-.015em;color:var(--ink)}
.d1-count{flex:none;font-size:14px;color:var(--muted)}
.d1-sec-desc{margin-top:4px;font-size:14px;color:var(--muted)}
.d1-list{margin-top:6px;display:grid}
.d1-item{position:relative;display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.d1-item.no-img{grid-template-columns:minmax(0,1fr)}
.d1-list .d1-item:last-child{border-bottom:0}
.d1-thumb{width:84px;height:84px;border-radius:18px;overflow:hidden;background:var(--fill);cursor:pointer}
.d1-thumb img{width:100%;height:100%;object-fit:cover}
.d1-thumb.is-ph{display:grid;place-items:center;color:#b9b2a8;background:linear-gradient(135deg,#f6f3ee,#efeae2);cursor:default}
.d1-thumb.is-ph svg{width:34px;height:34px}
.d1-thumb.is-loading{background:linear-gradient(100deg,#f1ede7 30%,#faf8f5 50%,#f1ede7 70%) 0 0/300% 100%;animation:d1-shimmer 1.3s linear infinite}
.d1-thumb.is-loading svg{opacity:.45}
.d1-thumb.is-in img{animation:d1-fadein .5s ease both}
@keyframes d1-shimmer{from{background-position:100% 0}to{background-position:0 0}}
@keyframes d1-fadein{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.d1-thumb.is-loading{animation:none}.d1-thumb.is-in img{animation:none}}
.d1-item-body{display:grid;gap:4px;min-width:0;text-align:start;padding:2px 0;border-radius:12px}
.can-order .d1-item-body{padding-inline-end:56px}
.d1-item-name{font-size:16px;font-weight:600;line-height:1.3;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.d1-badge{display:inline-block;vertical-align:2px;margin-inline-start:4px;padding:2px 8px;border-radius:999px;background:#fef3c7;color:#92400e;font-size:11px;font-weight:700;letter-spacing:.02em;line-height:1.5}
.d1-item-desc{font-size:14px;line-height:1.4;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.d1-item-foot{margin-top:4px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.d1-price{font-size:16px;font-weight:700;color:var(--ink);white-space:nowrap}
.d1-meta{font-size:12px;font-weight:500;color:var(--soft);background:var(--fill);border-radius:999px;padding:2px 8px;white-space:nowrap}
.d1-add{position:absolute;inset-inline-end:-2px;bottom:10px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--accent);color:var(--on-accent);transition:transform .15s}
.d1-add svg{width:20px;height:20px}
.d1-add:active,.d1-add.is-hit{transform:scale(.88)}
.d1-item:hover .d1-item-name{text-decoration:underline;text-decoration-color:#d1d5db;text-underline-offset:3px}
.d1-empty{padding:40px 16px;text-align:center;color:var(--muted);font-size:15px}

/* ---------- Alt bilgi ---------- */
.d1-foot{margin-top:28px;padding:32px 20px calc(40px + env(safe-area-inset-bottom));text-align:center;font-size:14px;color:var(--soft);background:#f9fafb;border-top:1px solid var(--line);display:grid;gap:6px;justify-items:center}
.d1-foot-name{font:700 20px/1.2 var(--head);color:var(--ink);margin-bottom:2px}
.d1-foot a{color:var(--ink);font-weight:600;text-decoration:none}
.d1-foot a:hover{text-decoration:underline}
.d1-social{display:flex;gap:10px;margin-top:10px}
.d1-social a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid #e5e7eb;color:var(--ink)}
.d1-social a svg{width:20px;height:20px}
.d1-social a.s-wa{background:#25D366;border-color:#25D366;color:#0f172a}
.d1-fb{margin-top:12px;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid #e5e7eb;background:#fff;font-size:14px;font-weight:600;color:var(--ink)}
.d1-fb svg{width:18px;height:18px}
.d1-foot .pwa-install-wrap{margin-top:12px}

/* ---------- "Sepeti gör · ₺toplam" ---------- */
/* Ortak sepet FAB'ı bu temada gizli; yerine alttaki çubuk kullanılır. */
.d1 .oc-fab{display:none!important}
.d1-cartbar{position:fixed;z-index:var(--z-fab,200);left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 28px),560px);display:flex;align-items:center;gap:12px;min-height:58px;padding:0 20px 0 12px;border-radius:999px;background:var(--accent);color:var(--on-accent);box-shadow:0 12px 32px rgba(15,23,42,.28);font-size:16px;font-weight:600;animation:d1-up .35s cubic-bezier(.2,.8,.2,1)}
.d1-cartbar-n{display:grid;place-items:center;min-width:32px;height:32px;padding:0 8px;border-radius:999px;background:var(--on-accent);color:var(--accent);font-size:14px;font-weight:800}
.d1-cartbar-t{flex:1;text-align:start}
.d1-cartbar-sum{font-weight:700;white-space:nowrap}
body.has-cartbar .d1-foot{padding-bottom:calc(104px + env(safe-area-inset-bottom))}
@keyframes d1-up{from{transform:translate(-50%,140%)}to{transform:translate(-50%,0)}}

.d1-toast{position:fixed;left:50%;bottom:calc(86px + env(safe-area-inset-bottom));transform:translate(-50%,12px);max-width:calc(100% - 32px);background:var(--ink);color:#fff;padding:12px 18px;border-radius:999px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:var(--z-toast,2000);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d1-toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- Geniş ekran: ortalanmış tek sütun, liste iki sütun ---------- */
@media (min-width:760px){
  html{background:#f5f5f7}
  body.d1{max-width:760px;margin:0 auto;box-shadow:0 0 0 1px var(--line)}
  .d1-cover{height:340px}
  .d1-seg,.d1-chips,.d1-actions,.d1-note{margin-inline:24px}
  .d1-chips{padding:0;margin-inline:24px}
  .d1-bar{padding:0 24px}
  .d1-sec{padding:26px 24px 0}
  .d1-list{grid-template-columns:1fr 1fr;column-gap:28px}
  .d1-list .d1-item:nth-last-child(2):nth-child(odd){border-bottom:0}
  .d1-seg{max-width:420px;margin-inline:auto}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .d1 *{transition:none!important;animation:none!important}
}
