*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.55;font-size:15px;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;line-height:1.2;letter-spacing:-.01em}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:16px}
:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.mono{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:.86em}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.65em 1.15em;border-radius:calc(var(--radius) - 3px);border:1.5px solid transparent;font-weight:700;font-size:.9rem;line-height:1;transition:.15s}
.btn svg{width:1.15em;height:1.15em}
.btn--ana{background:var(--brand);color:#fff;border-color:var(--brand)}
.btn--ana:hover{filter:brightness(1.06)}
.btn--hat{background:var(--surface);color:var(--text);border-color:var(--line)}
.btn--hat:hover{border-color:var(--brand);color:var(--brand)}
.btn--sessiz{background:color-mix(in srgb,var(--text) 7%,transparent);color:var(--text)}
.btn--tehlike{background:#d92d20;color:#fff;border-color:#d92d20}
.btn--buyuk{padding:.85em 1.5em;font-size:1rem}
.btn--tam{width:100%}
.btn+.btn{margin-top:.5rem}

.form-alan{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1rem}
.form-alan label{font-size:.82rem;font-weight:600;color:var(--muted)}
.form-alan input,.form-alan textarea,.form-alan select{border:1.5px solid var(--line);border-radius:calc(var(--radius) - 4px);padding:.65rem .8rem;background:var(--bg);color:var(--text);width:100%;transition:border-color .15s}
.form-alan input:focus,.form-alan textarea:focus,.form-alan select:focus{border-color:var(--brand);outline:none}
.form-alan input:disabled{opacity:.6}
.form-ikili{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.switch{display:flex;align-items:center;gap:.6rem;font-size:.92rem;font-weight:600;margin-bottom:1rem;cursor:pointer}
.switch input{width:1.2rem;height:1.2rem;accent-color:var(--brand)}
.ayrac{border:0;border-top:1px solid var(--line);margin:1.3rem 0}
.alt-baslik{font-size:1rem;margin-bottom:.3rem}

.uyari{display:flex;align-items:center;gap:.5rem;padding:.8rem 1rem;border-radius:calc(var(--radius) - 2px);margin-bottom:1.2rem;font-size:.92rem;font-weight:500}
.uyari svg{width:1.2em;height:1.2em;flex-shrink:0}
.uyari--ok{background:color-mix(in srgb,var(--accent) 14%,var(--surface));color:color-mix(in srgb,var(--accent) 70%,var(--text))}
.uyari--hata{background:#fdecea;color:#b3261e}
.uyari--bilgi{background:color-mix(in srgb,var(--brand) 10%,var(--surface));color:color-mix(in srgb,var(--brand) 75%,var(--text))}

/* Giriş */
.giris-body{display:grid;place-items:center;min-height:100vh;padding:1.5rem}
.giris-kart{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:2rem}
.giris-kart .logo{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.2rem;margin-bottom:.4rem}
.giris-kart .logo .mark{display:grid;place-items:center;width:2rem;height:2rem;background:var(--brand);color:#fff;border-radius:calc(var(--radius) - 4px)}
.giris-kart .logo .mark svg{width:1.2rem;height:1.2rem}
.giris-kart h1{font-size:1.35rem;margin-bottom:1.3rem}

/* Kabuk */
.demo-serit{background:var(--brand);color:#fff;text-align:center;font-size:.82rem;font-weight:600;padding:.5rem 1rem;display:flex;align-items:center;justify-content:center;gap:.5rem}
.demo-serit svg{width:1.1em;height:1.1em}
.panel-kabuk{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.ymnu-tik{display:none}
.yan{background:var(--surface);border-right:1px solid var(--line);padding:1.2rem 1rem;display:flex;flex-direction:column;gap:.2rem;position:sticky;top:0;height:100vh;overflow-y:auto}
.yan .logo{display:flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.1rem;padding:.4rem .6rem 1.2rem}
.yan .logo .mark{display:grid;place-items:center;width:2rem;height:2rem;background:var(--brand);color:#fff;border-radius:calc(var(--radius) - 4px);flex-shrink:0}
.yan .logo .mark svg{width:1.15rem;height:1.15rem}
.yan-nav{display:flex;flex-direction:column;gap:.15rem}
.yan-nav a{display:flex;align-items:center;gap:.7rem;padding:.65rem .7rem;border-radius:calc(var(--radius) - 4px);color:var(--muted);font-weight:600;font-size:.92rem;transition:.15s}
.yan-nav a svg{width:1.25rem;height:1.25rem;flex-shrink:0}
.yan-nav a span{flex:1}
.yan-nav a:hover{background:var(--bg);color:var(--text)}
.yan-nav a.aktif{background:var(--brand);color:#fff}
.rozet-say{background:var(--brand);color:#fff;font-size:.72rem;font-weight:800;min-width:20px;height:20px;padding:0 5px;border-radius:99px;display:grid;place-items:center}
.yan-nav a.aktif .rozet-say{background:#fff;color:var(--brand)}
.yan-ayrac{margin-top:.6rem;border-top:1px solid var(--line);padding-top:.9rem!important}
.cikis{color:#c0392b!important}
.ana{min-width:0;display:flex;flex-direction:column}
.panel-ust{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1rem;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding:1rem 1.6rem}
.panel-ust h1{font-size:1.3rem}
.mnu-btn{display:none;place-items:center;width:2.5rem;height:2.5rem;border:1.5px solid var(--line);border-radius:calc(var(--radius) - 4px);background:var(--surface)}
.mnu-btn svg{width:1.3rem;height:1.3rem}
.panel-govde{padding:1.6rem;flex:1}

/* Stat kartları */
.stat-izgara{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-bottom:1.6rem}
.stat-kart{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem}
.stat-ust{display:flex;align-items:center;gap:.5rem;color:var(--muted);font-size:.85rem;font-weight:600;margin-bottom:.6rem}
.stat-ust svg{width:1.2rem;height:1.2rem;color:var(--brand)}
.stat-kart strong{font-size:1.7rem;font-weight:800;display:block;letter-spacing:-.02em}
.stat-kart small{color:var(--muted);font-size:.82rem}

.panel-iki-sutun{display:grid;grid-template-columns:1.5fr 1fr;gap:1.3rem}
.panel-kutu{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem;margin-bottom:1.3rem}
.kutu-bas{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.kutu-bas h2,.kutu-h2{font-size:1.05rem;display:flex;align-items:center;gap:.5rem}
.kutu-h2{margin-bottom:1rem}
.kutu-h2 svg,.kutu-bas h2 svg{width:1.2rem;height:1.2rem;color:var(--brand)}
.kutu-link{color:var(--brand);font-weight:700;font-size:.85rem}
.kutu-not{color:var(--muted);font-size:.85rem;margin-bottom:1rem}
.bos-yazi{color:var(--muted);text-align:center;padding:1.5rem;font-size:.9rem}

/* Tablo */
.tablo-sar{overflow-x:auto;margin:0 -.3rem}
.tablo{width:100%;border-collapse:collapse;font-size:.9rem;min-width:520px}
.tablo th{text-align:left;padding:.6rem .7rem;color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;border-bottom:1.5px solid var(--line);white-space:nowrap}
.tablo td{padding:.7rem .7rem;border-bottom:1px solid var(--line);vertical-align:middle}
.tablo tbody tr:hover,.tablo tbody tr:hover{background:var(--bg)}
.tbl-gorsel{width:46px;height:46px;object-fit:cover;border-radius:calc(var(--radius) - 6px);border:1px solid var(--line)}
.tbl-ad{font-weight:700}
.tbl-ad:hover{color:var(--brand)}
.cizik{text-decoration:line-through;color:var(--muted)}
.tbl-aksiyon{display:flex;gap:.4rem;align-items:center;justify-content:flex-end}
.satir-sil{display:inline}
.btn-mini{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem .7rem;border:1.5px solid var(--line);border-radius:calc(var(--radius) - 6px);font-weight:600;font-size:.82rem;background:var(--surface);color:var(--text)}
.btn-mini:hover{border-color:var(--brand);color:var(--brand)}
.btn-mini svg{width:1rem;height:1rem}
.btn-mini--sil{color:#c0392b;border-color:transparent}
.btn-mini--sil:hover{background:#fdecea;border-color:#f5c6c2;color:#c0392b}

.durum{display:inline-block;padding:.25rem .6rem;border-radius:99px;font-size:.76rem;font-weight:700;white-space:nowrap}
.durum--bekle{background:#fff4e5;color:#b76e00}
.durum--onay{background:color-mix(in srgb,var(--accent) 16%,#fff);color:color-mix(in srgb,var(--accent) 70%,#000)}
.durum--hazir{background:#e8f0fe;color:#1a56db}
.durum--kargo{background:#eef2ff;color:#4338ca}
.durum--tamam{background:#e6f4ea;color:#1e7e34}
.durum--iptal{background:#fdecea;color:#b3261e}
.etiket{display:inline-block;padding:.15rem .5rem;border-radius:99px;font-size:.72rem;font-weight:700}
.etiket--one{background:color-mix(in srgb,var(--brand) 14%,#fff);color:var(--brand)}
.etiket--yeni{background:var(--brand);color:#fff}
.stok-etiket{display:inline-block;padding:.2rem .55rem;border-radius:99px;font-weight:700;font-size:.82rem;background:var(--bg)}
.stok-az{background:#fff4e5;color:#b76e00}
.stok-0{background:#fdecea;color:#b3261e}

.mini-liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.mini-liste li{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--line)}
.mini-liste a:hover{color:var(--brand)}
.hizli-butonlar{display:flex;gap:.6rem;margin-top:1rem;flex-wrap:wrap}
.hizli-butonlar .btn{margin-top:0}

.araç-cubugu,.arac-cubugu{display:flex;gap:.8rem;align-items:center;justify-content:space-between;margin-bottom:1.3rem;flex-wrap:wrap}
.ara-form{display:flex;align-items:center;gap:.5rem;background:var(--surface);border:1.5px solid var(--line);border-radius:calc(var(--radius) - 3px);padding:.15rem .15rem .15rem .7rem;flex:1;min-width:220px}
.ara-form svg{width:1.1rem;height:1.1rem;color:var(--muted)}
.ara-form input{flex:1;border:0;background:transparent;padding:.55rem 0;color:var(--text);outline:none;min-width:0}
.ara-form select{border:0;background:var(--bg);border-radius:calc(var(--radius) - 6px);padding:.5rem;font-weight:600}
.ara-form--tam{margin-bottom:1.3rem}

.filtre-cip{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.2rem}
.filtre-cip a{padding:.5rem .9rem;border:1.5px solid var(--line);border-radius:99px;font-weight:600;font-size:.85rem;color:var(--muted);background:var(--surface)}
.filtre-cip a span{opacity:.7}
.filtre-cip a:hover{border-color:var(--brand);color:var(--brand)}
.filtre-cip a.aktif{background:var(--brand);color:#fff;border-color:var(--brand)}

/* Düzenleme */
.duzen-iki{display:grid;grid-template-columns:1fr 340px;gap:1.3rem;align-items:start}
.duzen-ana,.duzen-yan{min-width:0}
.duzen-kaydet{position:sticky;top:80px}
.duzen-kaydet .btn{margin-top:.5rem}
.mevcut-gorsel img{border-radius:calc(var(--radius) - 4px);border:1px solid var(--line);margin-bottom:.5rem;object-fit:cover}
.galeri-yonetim{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.8rem}
.gy-oge{position:relative}
.gy-oge img{width:80px;height:80px;object-fit:cover;border-radius:calc(var(--radius) - 4px);border:1px solid var(--line)}
.gy-sil{position:absolute;top:-8px;right:-8px;width:24px;height:24px;background:#d92d20;color:#fff;border-radius:50%;display:grid;place-items:center;border:2px solid var(--surface)}
.gy-sil svg{width:.9rem;height:.9rem}
.tbl-ad .etiket{margin-left:.3rem}

/* Sipariş detay */
.link-geri{display:inline-flex;align-items:center;gap:.4rem;color:var(--muted);font-weight:600;font-size:.88rem;margin-bottom:1rem}
.link-geri svg{width:1.1em;height:1.1em}
.link-geri:hover{color:var(--brand)}
.bilgi-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.bilgi-grid>div{display:flex;flex-direction:column;gap:.2rem}
.bilgi-grid span{color:var(--muted);font-size:.8rem}
.bilgi-genis{grid-column:1/-1}
.ozet-panel{margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--line);gap:.5rem;display:flex;flex-direction:column}
.ozet-panel>div{display:flex;justify-content:space-between;font-size:.9rem}
.ozet-panel dt{color:var(--muted)}
.ozet-panel dd{margin:0;font-weight:700}
.ozet-panel-toplam{padding-top:.6rem;border-top:1px solid var(--line);font-size:1.05rem}
.ozet-panel-toplam dd{color:var(--brand);font-size:1.15rem}

/* Mesajlar */
.mesaj-liste{display:flex;flex-direction:column;gap:.9rem}
.mesaj-oge{border:1px solid var(--line);border-radius:var(--radius);padding:1rem}
.mesaj-oge.okunmamis{border-color:color-mix(in srgb,var(--brand) 40%,var(--line));background:color-mix(in srgb,var(--brand) 4%,transparent)}
.mesaj-bas{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.5rem;flex-wrap:wrap}
.mesaj-meta{color:var(--muted);font-size:.82rem;margin-top:.2rem}
.mesaj-aksiyon{display:flex;gap:.4rem;align-items:flex-start}
.mesaj-govde{color:var(--text);font-size:.92rem;white-space:pre-line}

/* Ayarlar */
.ayar-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 1.2rem}
.ayar-grid .form-genis{grid-column:1/-1}
.ayar-grid .switch{grid-column:auto}
.ayar-kaydet{position:sticky;bottom:1rem;display:flex;justify-content:flex-end;margin-top:1rem}

/* Tema düzenleyici */
.hazir-tema-izgara{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.hazir-tema{display:flex;flex-direction:column;gap:.5rem;padding:.8rem;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--bg);text-align:left}
.hazir-tema:hover{border-color:var(--brand)}
.ht-onizle{display:flex;height:2.4rem;border-radius:calc(var(--radius) - 5px);overflow:hidden}
.ht-onizle i{flex:1}
.ht-ad{font-size:.82rem;font-weight:700}
.renk-izgara{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.renk-alan{display:flex;flex-direction:column;gap:.35rem}
.renk-alan label{font-size:.82rem;font-weight:600;color:var(--muted)}
.renk-giris{display:flex;gap:.5rem;align-items:center}
.renk-giris input[type=color]{width:2.6rem;height:2.6rem;padding:0;border:1.5px solid var(--line);border-radius:calc(var(--radius) - 5px);background:none;cursor:pointer}
.renk-giris input[type=text]{flex:1;border:1.5px solid var(--line);border-radius:calc(var(--radius) - 5px);padding:.55rem .6rem;background:var(--bg);color:var(--text);text-transform:uppercase}
.tema-onizle{position:sticky;top:80px}
.onizle-kart{border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;display:flex;flex-direction:column;gap:.5rem}
.onizle-eyebrow{font-size:.72rem;font-weight:800;letter-spacing:.08em}
.onizle-kart h3{font-size:1.1rem}
.onizle-fiyat{font-size:1.3rem;font-weight:800}
.onizle-kart .btn{margin-top:.5rem;border:0}
input[type=range]{accent-color:var(--brand);width:100%}

.dar-panel{max-width:560px}

/* Modal */
.yt-modal{position:fixed;inset:0;background:rgba(10,10,15,.55);display:none;place-items:center;z-index:1000;padding:1rem}
.yt-modal.acik{display:grid}
.yt-modal-ic{background:var(--surface);border-radius:var(--radius);padding:1.6rem;max-width:400px;width:100%;border:1px solid var(--line)}
.yt-modal-mesaj{font-weight:600;margin-bottom:1.3rem}
.yt-modal-btn{display:flex;gap:.6rem;justify-content:flex-end}
.yt-modal-btn .btn{margin-top:0}

.bos-durum{display:flex;flex-direction:column;align-items:center;gap:.9rem;text-align:center;padding:2.5rem 1rem;color:var(--muted)}
.bos-durum svg{width:2.8rem;height:2.8rem;opacity:.4}

@media(max-width:1000px){
  .stat-izgara{grid-template-columns:repeat(2,1fr)}
  .panel-iki-sutun{grid-template-columns:1fr}
  .duzen-iki{grid-template-columns:1fr}
  .duzen-kaydet,.tema-onizle{position:static}
}
@media(max-width:820px){
  .panel-kabuk{grid-template-columns:1fr}
  .yan{position:fixed;left:-260px;top:0;width:250px;z-index:60;transition:left .25s;height:100vh}
  .ymnu-tik:checked~.yan{left:0;box-shadow:0 0 0 100vw rgba(0,0,0,.4)}
  .mnu-btn{display:grid}
  .ayar-grid,.renk-izgara,.bilgi-grid,.form-ikili{grid-template-columns:1fr}
  .hazir-tema-izgara{grid-template-columns:repeat(2,1fr)}
}
*{scrollbar-width:thin;scrollbar-color:var(--line) transparent}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted) 40%,transparent);border-radius:99px}

.varyant-yonetim { margin-top: 14px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.vy-baslik, .vy-satir { display: grid; grid-template-columns: 1.3fr 1fr .65fr .85fr .7fr; gap: 8px; padding: 8px 10px; }
.vy-baslik { background: var(--bg); font-size: 12px; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); font-weight: 600; }
.vy-satir { border-top: 1px solid var(--line); }
.vy-satir input { width: 100%; min-width: 0; font: inherit; font-size: 14px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 4px; background: #fff; }
@media (max-width: 700px) { .vy-baslik { display: none; } .vy-satir { grid-template-columns: 1fr 1fr; } }
.by-hucre { display: flex; flex-direction: column; gap: 5px; border: 1px solid var(--line); border-radius: 8px; padding: 8px; background: var(--bg); }
.by-hucre span { font-size: 12px; font-weight: 700; letter-spacing: .06em; color: var(--muted); text-align: center; }
.by-hucre input { width: 100%; text-align: center; border: 1px solid var(--line); border-radius: 6px; padding: 7px 4px; font: inherit; background: var(--surface); color: inherit; }
.by-hucre input:focus { outline: 2px solid var(--brand); outline-offset: 1px; }