/* Restoran Asistanı — uygulama sayfaları (menü, sipariş takibi, panel, yönetim, giriş, örnek restoran) */
:root{
  --bg:#faf7f2;--yuzey:#fff;--ink:#1b1714;--ikinci:#6b6159;--cizgi:#e8e1d8;--yumusak:#f3ede5;
  --vurgu:#b4441b;--vurgu-ink:#fff;--vurgu-acik:#fbe9e1;
  --iyi:#2f7d4f;--iyi-acik:#e3f3e8;--uyari:#9a6212;--uyari-acik:#fbf0d9;--kotu:#b42318;--kotu-acik:#fde7e5;
  --golge:0 1px 2px rgba(40,25,10,.06),0 4px 14px rgba(40,25,10,.06);
  --yaricap:12px;color-scheme:light dark
}
@media (prefers-color-scheme:dark){:root:not([data-tema=acik]){
  --bg:#141210;--yuzey:#1d1a17;--ink:#f1ece6;--ikinci:#b3a89c;--cizgi:#322d28;--yumusak:#24201c;
  --vurgu:#f0895c;--vurgu-ink:#1b0f08;--vurgu-acik:#3a2219;
  --iyi:#6cc58f;--iyi-acik:#16291d;--uyari:#f2c46d;--uyari-acik:#2e2412;--kotu:#f28b82;--kotu-acik:#351a18;
  --golge:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.25)
}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;overflow-wrap:break-word}
a{color:var(--vurgu);text-underline-offset:.18em}
h1,h2,h3{line-height:1.2;letter-spacing:-.01em;margin:0 0 .5rem}
h1{font-size:clamp(1.5rem,4.5vw,2rem)}
h2{font-size:1.2rem}
h3{font-size:1.02rem}
p{margin:0 0 .8rem}
small,.ince{color:var(--ikinci);font-size:.88rem}
.gizli{display:none!important}
.sarici{max-width:1180px;margin:0 auto;padding:0 16px}
.dar{max-width:560px;margin:0 auto;padding:0 16px}

/* düğmeler ve alanlar */
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:44px;padding:.55rem 1rem;border-radius:10px;border:1px solid transparent;background:var(--vurgu);color:var(--vurgu-ink);font:inherit;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap}
.dugme:hover{filter:brightness(1.06)}
.dugme:disabled{opacity:.5;cursor:not-allowed}
.dugme.ikincil{background:var(--yuzey);color:var(--ink);border-color:var(--cizgi)}
.dugme.ikincil:hover{background:var(--yumusak);filter:none}
.dugme.sade{background:transparent;color:var(--ikinci);border-color:transparent;min-height:36px;padding:.35rem .6rem}
.dugme.sade:hover{color:var(--ink);background:var(--yumusak);filter:none}
.dugme.kucuk{min-height:34px;padding:.3rem .7rem;font-size:.9rem;border-radius:8px}
.dugme.tehlike{background:var(--kotu-acik);color:var(--kotu);border-color:transparent}
.dugme.genis{width:100%}
:focus-visible{outline:2px solid var(--vurgu);outline-offset:2px}
label{display:block;font-weight:600;font-size:.92rem;margin:0 0 .3rem}
.alan{margin:0 0 .9rem}
.alan .ince{display:block;font-weight:400;margin-top:.25rem}
input[type=text],input[type=tel],input[type=password],input[type=number],input[type=search],select,textarea{width:100%;min-height:44px;padding:.55rem .7rem;border:1px solid var(--cizgi);border-radius:10px;background:var(--yuzey);color:var(--ink);font:inherit}
textarea{min-height:88px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--vurgu);outline-offset:0;border-color:transparent}
input[type=color]{width:56px;height:44px;padding:2px;border:1px solid var(--cizgi);border-radius:10px;background:var(--yuzey)}
.onay{display:flex;gap:.6rem;align-items:flex-start;font-weight:400;cursor:pointer}
.onay input{width:20px;height:20px;margin:.15rem 0 0;flex:none;accent-color:var(--vurgu)}
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:0 .8rem}
@media (max-width:560px){.ikili{grid-template-columns:1fr}}

/* kart, rozet, uyarı */
.kart{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:1rem 1.1rem;box-shadow:var(--golge)}
.kart+.kart{margin-top:.9rem}
.rozet{display:inline-flex;align-items:center;gap:.25rem;padding:.12rem .5rem;border-radius:999px;font-size:.78rem;font-weight:600;background:var(--yumusak);color:var(--ikinci);white-space:nowrap}
.rozet.masa{background:var(--vurgu-acik);color:var(--vurgu)}
.rozet.paket{background:var(--uyari-acik);color:var(--uyari)}
.rozet.telefon{background:var(--iyi-acik);color:var(--iyi)}
.rozet.whatsapp{background:#dcf5e4;color:#126b35}
@media (prefers-color-scheme:dark){:root:not([data-tema=acik]) .rozet.whatsapp{background:#143322;color:#7fdca0}}
.rozet.yakinda{background:var(--uyari-acik);color:var(--uyari)}
.bant{padding:.7rem 1rem;border-radius:10px;background:var(--uyari-acik);color:var(--ink);font-size:.93rem;margin:0 0 1rem}
.bant.bilgi{background:var(--vurgu-acik)}
.bant.iyi{background:var(--iyi-acik)}
.bant.kotu{background:var(--kotu-acik)}
.hata-kutu{color:var(--kotu);font-size:.92rem;min-height:1.2em;margin:.3rem 0 0}
.bos{padding:2rem 1rem;text-align:center;color:var(--ikinci)}

/* bildirim balonu */
.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(20px);opacity:0;background:var(--ink);color:var(--bg);padding:.65rem 1rem;border-radius:10px;font-size:.93rem;z-index:90;transition:.2s;pointer-events:none;max-width:calc(100% - 32px)}
.toast.acik{opacity:1;transform:translateX(-50%) translateY(0)}

/* ═════════ QR MENÜ ═════════ */
.m-ust{background:var(--yuzey);border-bottom:1px solid var(--cizgi)}
.m-ust .dar{padding-top:1rem;padding-bottom:.9rem}
.m-ust h1{font-size:1.45rem;margin:0}
.m-ust .ince{margin:.2rem 0 0}
.m-masa{display:inline-block;margin-top:.5rem}
.m-kat{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--cizgi)}
.m-kat .dar{display:flex;gap:.4rem;overflow-x:auto;padding-top:.55rem;padding-bottom:.55rem;scrollbar-width:none}
.m-kat .dar::-webkit-scrollbar{display:none}
.m-kat a{flex:none;padding:.35rem .8rem;border-radius:999px;background:var(--yuzey);border:1px solid var(--cizgi);color:var(--ink);text-decoration:none;font-size:.9rem}
.m-kat a.etkin{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.m-govde{padding-bottom:7rem}
.m-bolum{scroll-margin-top:56px;padding-top:1.1rem}
.m-bolum h2{font-size:1.05rem;margin:0 0 .4rem;color:var(--ikinci);text-transform:uppercase;letter-spacing:.04em}
.m-urun{display:flex;gap:.8rem;align-items:center;padding:.8rem 0;border-bottom:1px solid var(--cizgi)}
.m-urun .bilgi{flex:1;min-width:0}
.m-urun h3{margin:0;font-size:1rem}
.m-urun p{margin:.1rem 0 0;color:var(--ikinci);font-size:.88rem}
.m-urun .fiyat{font-weight:700;margin-top:.2rem}
.m-urun.tukendi{opacity:.55}
.etiket{display:inline-block;margin-left:.35rem;font-size:.72rem;font-weight:600;color:var(--ikinci);border:1px solid var(--cizgi);border-radius:999px;padding:0 .4rem;vertical-align:2px}
.adet{display:flex;align-items:center;gap:.25rem;flex:none}
.adet button{width:38px;height:38px;border-radius:50%;border:1px solid var(--cizgi);background:var(--yuzey);color:var(--ink);font-size:1.2rem;line-height:1;cursor:pointer}
.adet button.ekle{background:var(--vurgu);border-color:var(--vurgu);color:var(--vurgu-ink)}
.adet span{min-width:1.6rem;text-align:center;font-weight:700}
.m-cubuk{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--bg) 70%,transparent)}
.m-cubuk .dugme{width:100%;max-width:528px;margin:0 auto;display:flex;justify-content:space-between;min-height:52px;font-size:1.02rem;box-shadow:var(--golge)}
.m-servis{display:flex;gap:.5rem;margin:.8rem 0 0;flex-wrap:wrap}

/* alt çekmece (sepet) */
.perde{position:fixed;inset:0;background:rgba(15,10,5,.45);z-index:40;opacity:0;pointer-events:none;transition:opacity .2s}
.perde.acik{opacity:1;pointer-events:auto}
.cekmece{position:fixed;left:0;right:0;bottom:0;z-index:41;max-height:92vh;overflow:auto;background:var(--yuzey);border-radius:18px 18px 0 0;padding:1rem 16px calc(1rem + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .25s ease}
.cekmece.acik{transform:none}
.cekmece .ic{max-width:528px;margin:0 auto}
.cekmece-bas{display:flex;justify-content:space-between;align-items:center;margin-bottom:.6rem}
.sepet-satir{display:flex;gap:.6rem;align-items:center;padding:.55rem 0;border-bottom:1px solid var(--cizgi)}
.sepet-satir .ad{flex:1}
.toplam{display:flex;justify-content:space-between;font-weight:700;font-size:1.08rem;margin:.9rem 0}
@media (prefers-reduced-motion:reduce){.cekmece,.perde,.toast{transition:none}}

/* ═════════ SİPARİŞ TAKİBİ ═════════ */
.adimlar{list-style:none;padding:0;margin:1.2rem 0;display:grid;gap:.5rem}
.adimlar li{display:flex;gap:.7rem;align-items:center;padding:.65rem .8rem;border-radius:10px;background:var(--yumusak);color:var(--ikinci)}
.adimlar li::before{content:"";width:12px;height:12px;border-radius:50%;border:2px solid currentColor;flex:none}
.adimlar li.tamam{color:var(--iyi);background:var(--iyi-acik)}
.adimlar li.tamam::before{background:currentColor}
.adimlar li.simdi{color:var(--ink);background:var(--vurgu-acik);font-weight:600}
.adimlar li.simdi::before{border-color:var(--vurgu);background:var(--vurgu);animation:nabiz 1.4s infinite}
@keyframes nabiz{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.adimlar li.simdi::before{animation:none}}
.buyuk-kod{font-size:2.2rem;font-weight:800;letter-spacing:.12em}

/* ═════════ PANEL ═════════ */
.p-ust{background:var(--yuzey);border-bottom:1px solid var(--cizgi);position:sticky;top:0;z-index:15}
.p-ust .sarici{display:flex;align-items:center;gap:.8rem;min-height:58px;flex-wrap:wrap;padding-top:.4rem;padding-bottom:.4rem}
.p-marka{font-weight:800;color:var(--ink);text-decoration:none;font-size:1.02rem}
.p-ad{font-weight:600;color:var(--ikinci);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:40vw}
.p-bosluk{flex:1}
.p-sekmeler{display:flex;gap:.25rem;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--cizgi);background:var(--yuzey)}
.p-sekmeler::-webkit-scrollbar{display:none}
.p-sekmeler .sarici{display:flex;gap:.2rem}
.p-sekmeler button{flex:none;border:0;background:none;color:var(--ikinci);font:inherit;font-weight:600;padding:.75rem .8rem;border-bottom:3px solid transparent;cursor:pointer;white-space:nowrap}
.p-sekmeler button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--vurgu)}
.p-sekmeler .sayi{display:inline-block;min-width:1.3rem;padding:0 .35rem;margin-left:.3rem;border-radius:999px;background:var(--vurgu);color:var(--vurgu-ink);font-size:.75rem;line-height:1.3rem;text-align:center}
.p-govde{padding-top:1.2rem;padding-bottom:4rem}
.p-baslik{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}
.p-baslik h1{font-size:1.35rem;margin:0}
.p-baslik .p-bosluk{flex:1}
.istat{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.7rem;margin:0 0 1rem}
.istat div{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:.7rem .9rem}
.istat b{display:block;font-size:1.35rem}
.istat span{color:var(--ikinci);font-size:.86rem}
.cagrilar{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem}
.cagri{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem .5rem .9rem;border-radius:10px;background:var(--kotu-acik);color:var(--ink);font-weight:600}
.kolonlar{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;align-items:start}
@media (max-width:900px){.kolonlar{grid-template-columns:1fr}}
.kolon h2{display:flex;align-items:center;gap:.5rem;font-size:1rem;margin:0 0 .6rem}
.kolon h2 .rozet{font-size:.8rem}
.sip{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:.8rem .9rem;margin:0 0 .7rem;box-shadow:var(--golge)}
.sip.yeni-gelen{animation:parla 1.6s ease 2}
@keyframes parla{50%{box-shadow:0 0 0 3px var(--vurgu)}}
@media (prefers-reduced-motion:reduce){.sip.yeni-gelen{animation:none;outline:3px solid var(--vurgu)}}
.sip-bas{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.sip-kod{font-weight:800;letter-spacing:.06em}
.sip-zaman{margin-left:auto;color:var(--ikinci);font-size:.84rem}
.sip ul{list-style:none;padding:0;margin:.5rem 0}
.sip li{display:flex;justify-content:space-between;gap:.5rem;font-size:.94rem;padding:.12rem 0}
.sip .musteri{font-size:.88rem;color:var(--ikinci);margin:.3rem 0}
.sip .not{font-size:.88rem;background:var(--uyari-acik);border-radius:8px;padding:.35rem .55rem;margin:.4rem 0}
.sip-alt{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-top:.5rem}
.sip-alt .tutar{font-weight:700;margin-right:auto}
.biten summary{cursor:pointer;color:var(--ikinci);font-weight:600;margin:1rem 0 .6rem}
.biten .sip{opacity:.75;box-shadow:none}
.form-izgara{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;align-items:start}
@media (max-width:900px){.form-izgara{grid-template-columns:1fr}}
.secici{max-height:320px;overflow:auto;border:1px solid var(--cizgi);border-radius:10px}
.secici .m-urun{padding:.5rem .7rem}
.menu-kat{margin:0 0 1.2rem}
.menu-kat-bas{display:flex;align-items:center;gap:.5rem;margin:0 0 .4rem}
.menu-kat-bas h2{margin:0;font-size:1.05rem;flex:1}
.u-satir{display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;border:1px solid var(--cizgi);border-radius:10px;background:var(--yuzey);margin:0 0 .4rem}
.u-satir .bilgi{flex:1;min-width:0}
.u-satir .bilgi b{display:block}
.u-satir .bilgi span{color:var(--ikinci);font-size:.86rem}
.u-satir.tukendi .bilgi b{text-decoration:line-through;color:var(--ikinci)}
.anahtar{position:relative;display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;font-weight:400;font-size:.88rem;margin:0}
.anahtar input{appearance:none;width:42px;height:24px;border-radius:999px;background:var(--cizgi);position:relative;cursor:pointer;margin:0;flex:none;transition:background .15s}
.anahtar input::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s}
.anahtar input:checked{background:var(--iyi)}
.anahtar input:checked::after{transform:translateX(18px)}
.anahtar input:disabled{opacity:.55;cursor:not-allowed}
.qr-izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.8rem}
.qr-kart{background:#fff;color:#111;border:1px solid var(--cizgi);border-radius:var(--yaricap);padding:.8rem;text-align:center;break-inside:avoid}
.qr-kart svg{width:100%;height:auto;display:block}
.qr-kart b{display:block;font-size:1.05rem;margin-top:.4rem}
.qr-kart small{color:#555;display:block;font-size:.72rem;word-break:break-all}
.onizleme{background:var(--yumusak);border-radius:var(--yaricap);padding:1rem;font-size:.92rem}
.onizleme pre{white-space:pre-wrap;font:inherit;margin:0}
.balon{max-width:85%;padding:.55rem .75rem;border-radius:14px;margin:0 0 .5rem;font-size:.93rem}
.balon.o{background:var(--yuzey);border:1px solid var(--cizgi);border-bottom-left-radius:4px}
.balon.m{background:var(--vurgu-acik);margin-left:auto;border-bottom-right-radius:4px}
.wa-ekran{background:#e9e1d6;border-radius:var(--yaricap);padding:1rem;display:flex;flex-direction:column}
@media (prefers-color-scheme:dark){:root:not([data-tema=acik]) .wa-ekran{background:#0f1a14}}
.wa-ekran .balon.o{background:#fff;color:#111;border:0}
@media (prefers-color-scheme:dark){:root:not([data-tema=acik]) .wa-ekran .balon.o{background:#1f2c24;color:#e8efe9}}
.sss-satir{display:grid;grid-template-columns:1fr 1.4fr auto;gap:.5rem;margin:0 0 .5rem;align-items:start}
@media (max-width:640px){.sss-satir{grid-template-columns:1fr}}
.tablo-kap{overflow-x:auto;border:1px solid var(--cizgi);border-radius:var(--yaricap);background:var(--yuzey)}
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--cizgi);vertical-align:top}
th{font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--ikinci);background:var(--yumusak)}
tr:last-child td{border-bottom:0}
td .dugme{margin:0 .2rem .2rem 0}
.olaylar{list-style:none;padding:0;margin:0;font-size:.9rem}
.olaylar li{padding:.35rem 0;border-bottom:1px solid var(--cizgi)}
.modal{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;justify-content:center;background:rgba(15,10,5,.45);padding:0}
.modal .kart{width:100%;max-width:720px;max-height:92vh;overflow:auto;border-radius:18px 18px 0 0;padding-bottom:calc(1rem + env(safe-area-inset-bottom))}
@media (min-width:720px){.modal{align-items:center;padding:16px}.modal .kart{border-radius:var(--yaricap)}}

/* ═════════ GİRİŞ ═════════ */
.g-sayfa{min-height:100vh;display:flex;flex-direction:column}
.g-ust{padding:1rem 0}
.g-ust a{color:var(--ink);text-decoration:none;font-weight:800}
.sekme-cubuk{display:grid;grid-template-columns:1fr 1fr;gap:.3rem;background:var(--yumusak);padding:.3rem;border-radius:12px;margin:0 0 1rem}
.sekme-cubuk button{min-height:42px;border:0;border-radius:9px;background:none;font:inherit;font-weight:600;color:var(--ikinci);cursor:pointer}
.sekme-cubuk button[aria-selected=true]{background:var(--yuzey);color:var(--ink);box-shadow:var(--golge)}
.wa-dugme{background:#1f8f4c;color:#fff}
.cihaz-kutu{display:flex;align-items:center;gap:.8rem;padding:.9rem;border:1px solid var(--cizgi);border-radius:var(--yaricap);background:var(--yuzey);margin:0 0 1rem}
.cihaz-kutu .bilgi{flex:1}

/* ═════════ ÖRNEK RESTORAN SİTESİ ═════════ */
.o-ust{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;flex-wrap:wrap}
.o-logo{font-weight:800;font-size:1.25rem;color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.o-menu{display:flex;gap:1rem;flex-wrap:wrap}
.o-menu a{color:var(--ikinci);text-decoration:none}
.o-hero{padding:3rem 0 2.5rem;border-bottom:1px solid var(--cizgi)}
.o-hero h1{font-size:clamp(2rem,6vw,3.2rem);max-width:16ch;margin:0 0 .8rem}
.o-hero p{max-width:52ch;color:var(--ikinci);font-size:1.08rem}
.o-cta{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.2rem}
.o-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin:2rem 0}
.o-bolum{padding:2rem 0;border-bottom:1px solid var(--cizgi)}
.o-bolum h2{font-size:1.4rem;margin-bottom:1rem}
.o-menu-liste{columns:2 300px;column-gap:2rem}
.o-menu-liste .grup{break-inside:avoid;margin:0 0 1.4rem}
.o-menu-liste h3{color:var(--vurgu);text-transform:uppercase;font-size:.85rem;letter-spacing:.06em;margin-bottom:.5rem}
.o-satir{display:flex;gap:.6rem;align-items:baseline;padding:.25rem 0}
.o-satir .ad{flex:1;display:flex;gap:.4rem;align-items:baseline}
.o-satir .ad::after{content:"";flex:1;border-bottom:1px dotted var(--cizgi);transform:translateY(-4px)}
.o-satir small{display:block}
.o-not{background:var(--vurgu-acik);border-radius:var(--yaricap);padding:1rem 1.1rem;margin:1.5rem 0}
.o-alt{padding:2rem 0 3rem;color:var(--ikinci);font-size:.92rem}
.ust-serit{background:var(--ink);color:var(--bg);font-size:.86rem;padding:.45rem 0;text-align:center}
.ust-serit a{color:inherit;font-weight:700}

@media print{
  body{background:#fff;color:#000}
  .p-ust,.p-sekmeler,.p-baslik,.yazdirma-disi,.toast{display:none!important}
  .qr-izgara{grid-template-columns:repeat(3,1fr)}
  .qr-kart{border:1px solid #999;box-shadow:none}
}
.ust-bosluk{margin-top:1rem}
.o-satir.tukendi{opacity:.55}

/* 20.10 düzeltmeler: ızgarada kart kayması, boş adette eksi düğmesi, sekme hizası, dar sayı alanı */
.o-izgara>.kart+.kart{margin-top:0}
.adet.bos button:first-child,.adet.bos span{visibility:hidden}
.p-sekmeler .sarici{width:100%}
input.dar-alan{width:7rem;flex:none}