/* ============================================================================
   GEEK PANEL — TEMA KATMANI  (app.css'ten SONRA yüklenir)
   Geri almak için base.html'deki tema.css satırını silmek yeterlidir.

   Fikir: Geek mavisi ve Poppins markaya ait, aynen kalır. Bunun üzerine tek bir
   sıcak vurgu eklenir: "crema" (espresso üstündeki köpük rengi). Crema yalnızca
   üç yerde görünür — kenar çubuğunda açık sayfanın işareti, sayfa başlığının
   önündeki kısa çizgi ve "bugün" ile ilgili küçük vurgular. Geri kalan her şey
   sakin: net bir yazı hiyerarşisi, tutarlı tablo/form/boş ekran dili.
   ============================================================================ */

:root {
  --crema:#F2B544; --crema-700:#B9801A; --crema-050:#FFF6E2;
  --roast:#0B0F2E;
  --surface-2:#F8F9FD;          /* kartın içindeki ikinci zemin (tablo başlığı, hover) */
  --t-hizli:.16s;
  color-scheme: light;
}

/* ---- Yazı hiyerarşisi ------------------------------------------------------ */
body { font-size:15px; font-feature-settings:"tnum" 0; }
h2 { font-size:1.45rem; font-weight:700; letter-spacing:-.02em; line-height:1.2; }
h3 { font-size:1.05rem; font-weight:650; letter-spacing:-.01em; }
.tbl td, .tbl th, table td, table th, .zy-tablo td, .say, .gs-buyuk, .gs-saat-buyuk { font-variant-numeric:tabular-nums; }
:focus-visible { outline:3px solid var(--crema); outline-offset:2px; border-radius:6px; }
.btn:focus-visible, .input:focus-visible { outline-offset:1px; }
::selection { background:var(--brand-100); color:var(--ink); }

/* ---- Sayfa başlığı: crema çizgi ------------------------------------------- */
.plan-head { align-items:center; margin-bottom:1.1rem; }
.plan-head h2 { position:relative; padding-left:.85rem; }
.plan-head h2::before { content:""; position:absolute; left:0; top:.18em; bottom:.18em; width:4px; border-radius:4px; background:var(--crema); }
.plan-aralik { display:inline-block; margin-left:.4rem; font-size:.82rem; color:var(--muted); font-weight:500; }

/* ---- Üst bar ve kenar çubuğu ---------------------------------------------- */
.topbar-user .who b { font-weight:650; }
.topbar-user .role { letter-spacing:.01em; }
.yan-link { font-weight:500; }
.yan-link.akt { background:rgba(255,255,255,.14); }
.yan-link.akt::before { background:var(--crema); width:4px; left:-12px; border-radius:0 4px 4px 0; }
.yan-bolum { text-transform:none; letter-spacing:.01em; font-size:.74rem; font-weight:600; color:rgba(255,255,255,.62); padding-top:14px; }

/* ---- Bildirim izni: tek satırlık şerit, rehber açılır pencere ------------- */
.bildirim-karti { position:relative; margin:0 0 .9rem; padding:.45rem .8rem; border-radius:12px;
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--crema); box-shadow:none; }
.bk-satir { gap:.6rem; flex-wrap:nowrap; }
.bk-ikon { font-size:1.05rem; }
.bk-metin { flex:1 1 auto; flex-direction:row; align-items:baseline; gap:.5rem; overflow:hidden; }
.bk-metin b { font-size:.88rem; white-space:nowrap; font-weight:650; }
.bk-metin span { font-size:.8rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bk-nasil { font-size:.8rem; white-space:nowrap; }
.bildirim-karti .btn-mini { min-height:34px; white-space:nowrap; }
.bk-rehber { position:absolute; z-index:40; left:0; right:0; top:calc(100% + 6px); margin:0; padding:.9rem 1.1rem;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  box-shadow:0 18px 40px -16px rgba(11,16,32,.35); }
.bk-rehber[hidden] { display:none; }
@media (max-width:640px) {
  .bk-metin { flex-direction:column; gap:0; }
  .bk-metin span { display:none; }
  .bk-satir { gap:.5rem; }
}

/* ---- Kartlar ve bölümler --------------------------------------------------- */
body.app .card { border-radius:16px; }
.card h3 { margin-bottom:.35rem; }
.zy-kutu, .gs-form { background:var(--surface); border:1px solid var(--line); border-radius:16px; }
.gs-post { background:var(--surface); border:1px solid var(--line); border-radius:16px; box-shadow:0 1px 2px rgba(11,16,32,.04); }
.gs-post .gs-medya { margin-left:-1.1rem; margin-right:-1.1rem; border-radius:0; }
.gs-post .gs-nokta { padding-bottom:.1rem; }

/* ---- Tablolar: sakin, okunur, üzerine gelince belli ----------------------- */
.tbl, .sube-tbl, .zy-tablo { width:100%; border-collapse:collapse; }
.tbl th, .sube-tbl th, .zy-tablo th { text-align:left; font-size:.78rem; font-weight:600; color:var(--muted);
  text-transform:none; letter-spacing:.01em; padding:.6rem .7rem; border-bottom:1.5px solid var(--line); background:var(--surface-2); }
.tbl td, .sube-tbl td, .zy-tablo td { padding:.65rem .7rem; border-bottom:1px solid var(--line); vertical-align:middle; }
.tbl tbody tr:hover td, .sube-tbl tbody tr:hover td, .zy-tablo tbody tr:hover td { background:var(--surface-2); }
.zy-tablo th { padding:.6rem .7rem; }
.zy-tablo tr.toplam td { background:var(--brand-050); border-top:2px solid var(--brand); }
.sube-tbl { background:var(--surface); border:1px solid var(--line); border-radius:14px; overflow:hidden; }

/* ---- Formlar --------------------------------------------------------------- */
.input, select.input, textarea.input, input[type=date], input[type=text], input[type=number], input[type=search],
input[type=password], input[type=email], select, textarea { font-family:var(--font); }
.input, .zy-sat input, .zy-sat select, .zy-ust input, .zy-ust select { min-height:46px; border-radius:12px; }
input[type=checkbox], input[type=radio] { accent-color:var(--brand); }
.sube-form { display:grid; grid-template-columns:minmax(220px,1.4fr) auto; gap:.7rem 1rem; align-items:end; margin-top:.4rem; }
.sube-form label { display:flex; flex-direction:column; gap:.3rem; font-size:.82rem; font-weight:600; color:var(--text); }
.sube-form input[type=text] { min-height:46px; padding:.6rem .85rem; border:1.5px solid var(--line); border-radius:12px;
  font:inherit; background:var(--surface); color:var(--text); }
.sube-form input[type=text]:focus { outline:none; border-color:var(--brand); box-shadow:var(--ring); }
.sube-form .sube-depo, .sube-depo { flex-direction:row; align-items:center; gap:.5rem; font-weight:500; font-size:.9rem; grid-column:1 / -1; }
.sube-form .btn { justify-self:start; }
.mutfak-form { margin:0; }
@media (max-width:640px) { .sube-form { grid-template-columns:1fr; } }

/* ---- Butonlar -------------------------------------------------------------- */
.btn-primary { background:var(--brand); }
.btn-ghost { border-color:var(--line); }
.btn-ghost:hover { border-color:var(--brand-100); }
@media (pointer:coarse) {
  .btn-mini { min-height:42px; padding:.45rem .9rem; }
  .yan-link { padding:12px 12px; }
  .gs-tepki { padding:.4rem .75rem; }
}

/* ---- Rozetler -------------------------------------------------------------- */
.badge { font-weight:600; letter-spacing:0; }

/* ---- Boş ekranlar: yapılacak işi gösteren sakin kutu ---------------------- */
.egitim-bos, .zy-bos, .gs-bos, .gs-bos-not {
  display:block; text-align:center; color:var(--muted); font-size:.92rem; padding:1.6rem 1rem;
  border:1.5px dashed var(--line); border-radius:14px; background:transparent; margin:.4rem 0; }
.gs-bos { padding:2.2rem 1rem; }

/* ---- Bildirim / uyarı kutuları -------------------------------------------- */
.alert { border-radius:12px; font-weight:500; }

/* ---- Koyu mod anahtarı ----------------------------------------------------- */
.tema-btn { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%;
  border:none; background:transparent; color:var(--brand); cursor:pointer; transition:background var(--t-hizli); }
.tema-btn:hover { background:var(--brand-050); }
.tema-btn .ay { display:none; }
html[data-theme="dark"] .tema-btn .gunes { display:none; }
html[data-theme="dark"] .tema-btn .ay { display:inline; }

/* ============================================================================
   KOYU MOD  (üst bardaki ay/güneş düğmesiyle açılır; seçim cihazda saklanır)
   ============================================================================ */
html[data-theme="dark"] {
  color-scheme: dark;
  --brand:#8798FF; --brand-700:#2B3A9C; --brand-600:#9CAAFF;
  --brand-050:#1A2255; --brand-100:#2B3680;
  --ink:#F3F5FF; --text:#DCE0F5; --muted:#98A1C8;
  --surface:#131939; --surface-2:#192046; --bg:#0A0D26; --line:#262E5C;
  --ok:#3DD598; --ok-bg:#12332A; --wait:#E8B84A; --wait-bg:#3A2F12; --no:#FF7A82; --no-bg:#3D1A20;
  --shadow:0 12px 34px -14px rgba(0,0,0,.7); --shadow-sm:0 2px 10px -3px rgba(0,0,0,.5);
  --ring:0 0 0 4px rgba(135,152,255,.28);
}
html[data-theme="dark"] body { background:var(--bg); color:var(--text); }
html[data-theme="dark"] body.app { background:var(--bg); }
html[data-theme="dark"] .topbar { background:rgba(19,25,57,.78); border-bottom-color:var(--line); }
html[data-theme="dark"] .topbar-logo, html[data-theme="dark"] .yan-marka img { filter:brightness(0) invert(1); }
html[data-theme="dark"] .sidebar { background:linear-gradient(180deg,#121A52 0%,#0B1036 100%); }
html[data-theme="dark"] .btn-primary { background:#3347D6; color:#fff; }
html[data-theme="dark"] .btn-primary:hover { background:#4458E6; }
html[data-theme="dark"] .btn-ghost { color:var(--brand); border-color:var(--line); }
html[data-theme="dark"] .btn-ghost:hover { background:var(--brand-050); }
html[data-theme="dark"] .btn-danger { background:#C93C44; color:#fff; }
html[data-theme="dark"] .card, html[data-theme="dark"] .zy-kutu, html[data-theme="dark"] .gs-post,
html[data-theme="dark"] .gs-form, html[data-theme="dark"] .bildirim-karti, html[data-theme="dark"] .bk-rehber { background:var(--surface); border-color:var(--line); }
html[data-theme="dark"] .card { background:transparent; }
html[data-theme="dark"] .input, html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea,
html[data-theme="dark"] .zy-sat input, html[data-theme="dark"] .zy-sat select, html[data-theme="dark"] .zy-ust input,
html[data-theme="dark"] .zy-ust select, html[data-theme="dark"] .sube-form input[type=text] {
  background:var(--surface-2); color:var(--text); border-color:var(--line); }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color:#6F79A6; }
html[data-theme="dark"] .alert-error { background:var(--no-bg); color:#FFB3B8; border-color:#6A2A32; }
html[data-theme="dark"] .alert-success { background:var(--ok-bg); color:#9BE9C8; border-color:#1E5C47; }
html[data-theme="dark"] .badge-work { background:var(--brand-050); color:var(--brand); }
html[data-theme="dark"] .badge-info { background:#16284F; color:#8EC4FF; }
html[data-theme="dark"] .ust-sube-form, html[data-theme="dark"] .tb-ara { background:var(--brand-050); border-color:var(--brand-100); }
html[data-theme="dark"] .tb-ara kbd { background:var(--surface-2); color:var(--muted); }
html[data-theme="dark"] .topbar-zil, html[data-theme="dark"] .tb-menu, html[data-theme="dark"] .tema-btn { color:var(--brand); }
html[data-theme="dark"] .topbar-zil:hover, html[data-theme="dark"] .topbar-zil.aktif,
html[data-theme="dark"] .tb-menu:hover, html[data-theme="dark"] .tema-btn:hover { background:var(--brand-050); }
html[data-theme="dark"] .plan-head h2, html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3, html[data-theme="dark"] h4 { color:var(--ink); }
html[data-theme="dark"] .zy-sekme a, html[data-theme="dark"] .mn-sek a { background:var(--surface); border-color:var(--line); color:var(--text); }
html[data-theme="dark"] .zy-sekme a.akt, html[data-theme="dark"] .mn-sek a.akt { background:#3347D6; border-color:#3347D6; color:#fff; }
html[data-theme="dark"] .zy-ozet div { background:var(--surface-2); }
html[data-theme="dark"] .zy-ozet b { color:var(--ink); }
html[data-theme="dark"] .zy-uyari { background:#3A2F12; border-color:#6B5520; color:#F0CF82; }
html[data-theme="dark"] .zy-sil { background:transparent; border-color:#6A2A32; color:#FF9AA1; }
html[data-theme="dark"] .zy-satirekle { background:transparent; border-color:var(--line); color:var(--brand); }
html[data-theme="dark"] .zy-sat+.zy-sat { border-top-color:var(--line); }
html[data-theme="dark"] .zy-tablo th, html[data-theme="dark"] .tbl th, html[data-theme="dark"] .sube-tbl th { background:var(--surface-2); color:var(--muted); border-bottom-color:var(--line); }
html[data-theme="dark"] .zy-tablo td, html[data-theme="dark"] .tbl td, html[data-theme="dark"] .sube-tbl td { border-bottom-color:var(--line); color:var(--text); }
html[data-theme="dark"] .zy-lbl, html[data-theme="dark"] .mn-lbl { color:var(--text); }
html[data-theme="dark"] .zy-ipucu, html[data-theme="dark"] .zy-kim { color:var(--muted); }
html[data-theme="dark"] .zy-not { color:var(--muted); }
html[data-theme="dark"] .zy-ozet span { color:var(--muted); }
html[data-theme="dark"] .gs-led-panel { border-color:#2B3A9C; }
html[data-theme="dark"] .gs-medya { background:#05071A; }
html[data-theme="dark"] .gs-kim b, html[data-theme="dark"] .gs-metin-govde { color:var(--ink); }
html[data-theme="dark"] .gs-tepki { background:var(--surface-2); border-color:var(--line); }
html[data-theme="dark"] .gs-tepki.aktif { background:var(--brand-050); border-color:var(--brand); }
html[data-theme="dark"] .gs-avatar-marka { background:#fff; }
html[data-theme="dark"] .gs-kart, html[data-theme="dark"] .gs-saat-kart { background:var(--surface); border-color:var(--line); color:var(--text); }
html[data-theme="dark"] .gs-buyuk { color:var(--ink); }
html[data-theme="dark"] .egitim-bos, html[data-theme="dark"] .zy-bos, html[data-theme="dark"] .gs-bos { border-color:var(--line); }
html[data-theme="dark"] .imza b { color:var(--brand); }
html[data-theme="dark"] a { color:var(--brand); }
html[data-theme="dark"] .yan-link, html[data-theme="dark"] .yan-link:hover, html[data-theme="dark"] .yan-link.akt { color:#fff; }
html[data-theme="dark"] .mn-th, html[data-theme="dark"] .mn-onizleme { background:var(--surface-2); border-color:var(--line); }
html[data-theme="dark"] .mn-sat, html[data-theme="dark"] .mn-kat { border-bottom-color:var(--line); }
html[data-theme="dark"] .mn-csv { background:var(--surface-2); }
html[data-theme="dark"] .mn-sticky { background:linear-gradient(180deg,rgba(10,13,38,0),var(--bg) 35%); }
html[data-theme="dark"] .mn-chip span { background:var(--surface-2); border-color:var(--line); color:var(--text); }
html[data-theme="dark"] .mn-chip input:checked+span { background:#3A2F12; border-color:var(--crema); color:#F6D589; }
html[data-theme="dark"] .mn-chip.vegan input:checked+span { background:#12332A; border-color:#3DD598; color:#9BE9C8; }
html[data-theme="dark"] .mn-ok button.mn-yon { background:var(--surface-2); border-color:var(--line); color:var(--text); }
html[data-theme="dark"] .lb-overlay { background:rgba(2,3,12,.95); }

/* ---- Hareketi azalt tercihine saygı --------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .tema-btn, .btn, .yan-link { transition:none !important; }
}

/* koyu modda toplam satırları */
html[data-theme="dark"] .zy-tablo tr.toplam td { background:var(--surface-2); color:var(--ink); border-top-color:#3347D6; }

/* ---- Stok: hangi ayın sayımı onayı ---- */
.ay-onay { position:fixed; inset:0; z-index:200; background:rgba(11,15,46,.55); display:flex; align-items:center; justify-content:center; padding:1rem; }
.ay-onay[hidden] { display:none; }
.ay-onay-kutu { background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:1.3rem; width:100%; max-width:420px; box-shadow:var(--shadow); text-align:center; }
.ay-onay-kutu h3 { margin:0 0 .3rem; }
.ay-onay-secim { display:flex; flex-direction:column; gap:.6rem; margin:1rem 0 .8rem; }
.ay-onay-btn { display:flex; flex-direction:column; align-items:center; gap:.1rem; min-height:56px; font-size:1.05rem; }
.ay-onay-btn small { font-size:.72rem; font-weight:500; opacity:.85; }

/* ============================================================================
   SEVKİYAT — sade kartlar (satın alma, sevkiyat, çıkış onayı, şef)
   ============================================================================ */
.sv-talep { padding:0; overflow:hidden; }
.sv-talep > summary.sv-head { list-style:none; cursor:pointer; padding:.85rem 1rem; margin:0; align-items:center; min-height:56px; }
.sv-talep > summary.sv-head::-webkit-details-marker { display:none; }
.sv-talep > summary.sv-head::after { content:"\203A"; font-size:1.4rem; color:var(--muted); margin-left:.2rem; transition:transform .15s; line-height:1; }
.sv-talep[open] > summary.sv-head::after { transform:rotate(90deg); }
.sv-talep > summary.sv-head > .badge { margin-left:auto; flex:none; }
.sv-no { color:var(--muted); font-weight:500; font-size:.85rem; }
.sv-bas { min-width:0; }
.sv-govde { padding:.1rem 1rem 1rem; border-top:1px solid var(--line); }
.sv-talep[open] > summary.sv-head { background:var(--surface-2); }

/* kalem satırı: ad üstte, altında "istenen" + miktar + birim */
.sv-kalemler li.sv-kalem-edit { display:grid; grid-template-columns:1fr auto; gap:.15rem .8rem; align-items:center; padding:.6rem 0; }
.sv-kalem-edit .sv-urun-ad { grid-column:1; }
.sv-kalem-edit .sv-adet { grid-column:1; font-size:.78rem; }
.sv-kalem-edit .sv-girdi { grid-column:2; grid-row:1 / span 2; display:flex; gap:.4rem; }
.sv-kalem-edit .sv-miktar { width:84px; min-height:46px; text-align:center; font-weight:600; }
.sv-kalem-edit .sv-birim { min-height:46px; width:auto; min-width:88px; }
.sv-hazir-li { grid-template-columns:auto 1fr auto !important; }
.sv-hazir-li .sv-hazir-kutu { grid-column:1; grid-row:1 / span 2; }
.sv-hazir-li .sv-urun-ad, .sv-hazir-li .sv-adet { grid-column:2; }
.sv-hazir-li .sv-girdi { grid-column:3; }
.sv-hazir-li.hazir .sv-urun-ad { text-decoration:line-through; color:var(--muted); }
.sv-hazir-kutu input { width:26px; height:26px; }
.sv-talep form > .btn-primary, .sv-cikis-btns .btn { min-height:48px; }
.sv-talep form > .btn-primary { width:100%; margin-top:.8rem; }
.sv-cikis-btns { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; }
.sv-cikis-btns .btn { width:100%; margin:0; }
.sv-iptal-form { text-align:center; }
.sv-iptal-form .btn-danger { background:transparent; color:var(--no); border:none; box-shadow:none; text-decoration:underline; font-weight:500; }
.sv-ek { margin-top:.6rem; }
@media (max-width:560px) {
  .sv-cikis-btns { grid-template-columns:1fr; }
  .sv-kalem-edit .sv-miktar { width:72px; }
  .sv-kalem-edit .sv-birim { min-width:78px; padding-left:.5rem; }
}
html[data-theme="dark"] .sv-talep[open] > summary.sv-head { background:var(--surface-2); }


/* dar ekranda kalem satırı: ad + açıklama üstte, miktar/birim altta tam genişlik */
@media (max-width:560px) {
  .sv-kalemler li.sv-kalem-edit { grid-template-columns:1fr; }
  .sv-kalem-edit .sv-girdi { grid-column:1; grid-row:auto; margin-top:.35rem; }
  .sv-kalem-edit .sv-miktar { width:96px; }
  .sv-kalem-edit .sv-birim { flex:1; }
  .sv-hazir-li { grid-template-columns:auto 1fr !important; }
  .sv-hazir-li .sv-girdi { grid-column:1 / -1; }
}

/* dar ekranda sütun asla ekrandan geniş olmasın */
.ekip-grid { grid-template-columns:repeat(auto-fit, minmax(min(380px,100%), 1fr)); }
.sv-kalem-edit .sv-girdi { width:100%; }
@media (min-width:561px) { .sv-kalem-edit .sv-girdi { width:auto; } }

/* taşma güvenlikleri */
select, input, textarea { max-width:100%; }
.sube-sec { max-width:100%; min-width:0; }
.yon-secimler { max-width:100%; flex-wrap:wrap; }
.tarih-aralik { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; max-width:100%; }
.tarih-aralik input[type=date] { flex:1 1 130px; min-width:0; }

/* ============================================================================
   SEVKİYAT — talep analizi (sütun grafiği)
   ============================================================================ */
.an-btns { display:flex; gap:.5rem; flex-wrap:wrap; }
.an-filtre { display:flex; align-items:flex-end; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.an-filtre label, .an-urunsec label { display:flex; flex-direction:column; gap:.3rem; font-size:.8rem; color:var(--muted); font-weight:600; }
.an-ay { display:flex; align-items:center; gap:.7rem; min-height:44px; }
.an-ay b { min-width:110px; text-align:center; }
.an-ozet { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; margin-bottom:1rem; }
.an-ozet div { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:.8rem 1rem; display:flex; flex-direction:column; gap:.1rem; }
.an-ozet b { font-size:1.5rem; color:var(--ink); font-variant-numeric:tabular-nums; }
.an-ozet span { font-size:.78rem; color:var(--muted); }
.an-kart { margin-bottom:1rem; }
.an-kart h3 { margin:0 0 .2rem; font-size:1.05rem; }
.an-not { font-size:.8rem; color:var(--muted); margin:.2rem 0 .6rem; }
.an-bos { text-align:center; color:var(--muted); border-style:dashed; padding:1.4rem 1rem; }
.an-lejant { display:flex; align-items:center; gap:.45rem; font-size:.8rem; color:var(--muted); margin-bottom:.4rem; }
.an-l { width:12px; height:12px; border-radius:3px; display:inline-block; margin-left:.6rem; }
.an-l:first-child { margin-left:0; }
.an-l-t { background:var(--brand); } .an-l-g { background:var(--crema); }
.an-kaydir { overflow-x:auto; padding-bottom:.4rem; -webkit-overflow-scrolling:touch; }
.an-grafik { display:flex; gap:.5rem; align-items:flex-start; min-width:100%; width:max-content; padding-top:1.4rem; }
.an-grup { width:84px; flex:none; display:flex; flex-direction:column; align-items:stretch; }
.an-sutunlar { height:190px; display:flex; align-items:flex-end; justify-content:center; gap:5px; border-bottom:2px solid var(--line); }
.an-sut { width:30px; border-radius:6px 6px 0 0; position:relative; min-height:2px; transition:height .4s ease; }
.an-sut em { position:absolute; bottom:100%; left:50%; transform:translateX(-50%); font-style:normal; font-size:.66rem; font-weight:600; color:var(--ink); white-space:nowrap; padding-bottom:2px; font-variant-numeric:tabular-nums; }
.an-t { background:var(--brand); } .an-g { background:var(--crema); }
.an-et { font-size:.74rem; text-align:center; margin-top:.4rem; line-height:1.2; font-weight:600; word-break:break-word; hyphens:auto; }
.an-et small { display:block; font-weight:400; color:var(--muted); font-size:.68rem; }
.an-urunsec { margin:.5rem 0; }
.an-urunsec select { max-width:100%; }
.an-tablo-kap { overflow-x:auto; }
.an-tablo { width:100%; border-collapse:collapse; font-size:.88rem; }
.an-tablo th { text-align:left; font-size:.74rem; color:var(--muted); font-weight:600; padding:.5rem .5rem; border-bottom:2px solid var(--line); white-space:nowrap; }
.an-tablo td { padding:.55rem .5rem; border-bottom:1px solid var(--line); }
.an-tablo .sag { text-align:right; font-variant-numeric:tabular-nums; }
@media (max-width:560px) { .an-ozet b { font-size:1.25rem; } .an-grup { width:72px; } .an-sut { width:26px; } }
@media (prefers-reduced-motion:reduce) { .an-sut { transition:none; } }

/* ============================================================================
   MOLA — QR ile başla/bitir, günlük toplam
   ============================================================================ */
.alert-info { background:var(--brand-050); color:var(--brand-700); border:1px solid var(--brand-100); }
.mola-ipucu { font-size:.88rem; color:var(--muted); margin:.4rem 0 .8rem; }
.mola-gun { margin-top:1rem; }
.mola-gun-bas { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; margin-bottom:.5rem; }
.mola-gun-top { font-size:1.3rem; font-weight:700; font-variant-numeric:tabular-nums; color:var(--ink); }
.mola-gun-top small { font-size:.75rem; font-weight:500; color:var(--muted); }
.mola-gun-top.asti { color:var(--no); }
.mola-gun-liste { list-style:none; margin:0; padding:0; }
.mola-gun-liste li { display:flex; justify-content:space-between; gap:.8rem; padding:.55rem 0; border-top:1px solid var(--line); font-variant-numeric:tabular-nums; }
.mola-oto { font-style:normal; font-size:.72rem; color:var(--wait); background:var(--wait-bg); border-radius:999px; padding:.05rem .5rem; margin-left:.3rem; }
.mola-asim { color:var(--no); margin:.4rem 0 0; }
.mg-rapor-bar { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; margin-bottom:.7rem; }
.mg-zamanlar { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.4rem; }
.mg-zaman { font-size:.78rem; font-weight:600; background:var(--brand-050); color:var(--brand-700); border-radius:8px; padding:.15rem .5rem; font-variant-numeric:tabular-nums; }
.mg-zaman em { font-style:normal; font-weight:400; color:var(--muted); }
.mg-zaman.oto { background:var(--wait-bg); color:var(--wait); }
html[data-theme="dark"] .mg-zaman { background:#1F2A5C; color:#C9D2FF; }
html[data-theme="dark"] .mg-zaman.oto { background:#3A2F12; color:#F0CF82; }
html[data-theme="dark"] .alert-info { background:#18214F; color:#C9D2FF; border-color:#2A3680; }

/* Takvim: dar ekranda ızgara yerine "gün + şube adları" listesi */
.sv-tkv-liste { display:none; }
@media (max-width:700px) {
  .sv-takvim { display:none; }
  .sv-tkv-liste { display:flex; flex-direction:column; gap:.4rem; }
  .sv-tkv-satir { display:grid; grid-template-columns:52px 1fr auto; gap:.7rem; align-items:center; text-decoration:none; color:var(--text);
    background:var(--brand-050); border:1px solid var(--brand-100); border-radius:12px; padding:.6rem .7rem; min-height:56px; }
  .sv-tkv-satir.secili { background:var(--brand); border-color:var(--brand); color:#fff; }
  .sv-tkv-tarih { display:flex; flex-direction:column; align-items:center; line-height:1.1; }
  .sv-tkv-tarih b { font-size:1.2rem; }
  .sv-tkv-tarih small { font-size:.7rem; opacity:.75; }
  .sv-tkv-adlar { display:flex; flex-wrap:wrap; gap:.3rem; }
  .sv-tkv-ad { font-size:.82rem; font-weight:600; background:var(--brand); color:#fff; border-radius:8px; padding:.15rem .5rem; }
  .sv-tkv-satir.secili .sv-tkv-ad { background:#fff; color:var(--brand); }
  .sv-tkv-adet { font-size:.78rem; color:var(--muted); font-weight:600; }
  .sv-tkv-satir.secili .sv-tkv-adet { color:#fff; }
}
html[data-theme="dark"] .sv-tkv-satir { background:var(--surface-2); border-color:var(--line); }
html[data-theme="dark"] .sv-tkv-ad { background:#3347D6; }

/* Talep analizi: sayılar sütunların üstünde değil altında, ayrı satırlarda (üst üste binmesin) */
.an-sut em { display:none; }
.an-grafik { padding-top:.4rem; }
.an-grup { width:96px; }
.an-sayilar { display:flex; flex-direction:column; gap:.1rem; margin-top:.4rem; font-size:.78rem; font-weight:600; font-variant-numeric:tabular-nums; color:var(--ink); }
.an-sayilar span { display:flex; align-items:center; justify-content:center; gap:.3rem; white-space:nowrap; }
.an-nok { width:9px; height:9px; border-radius:2px; display:inline-block; flex:none; }
.an-nok.an-t { background:var(--brand); } .an-nok.an-g { background:var(--crema); }
@media (max-width:560px) { .an-grup { width:88px; } }


/* ============================================================================
   KURUMSAL KATMAN — sade, buzlu cam, ince çizgi (Apple web sitesi dilinden esinli)
   Geek mavisi ve Poppins aynen kalır. Geri almak için bu bloğu silmek yeterlidir.
   ============================================================================ */
:root {
  --bg:#F5F5F7; --surface:#FFFFFF; --surface-2:#FAFAFC;
  --ink:#1D1D1F; --text:#1D1D1F; --muted:#6E6E73; --line:#E3E3E8;
  --radius:20px; --radius-sm:12px;
  --shadow:0 8px 30px -12px rgba(0,0,0,.16); --shadow-sm:none;
}
body, body.app { background:var(--bg); }
body { letter-spacing:-.003em; }

/* Başlıklar: büyük, hafif, sıkı */
h2 { font-size:1.9rem; font-weight:600; letter-spacing:-.03em; line-height:1.12; }
h3 { font-weight:600; letter-spacing:-.015em; }
.plan-head { margin-bottom:1.4rem; }
.plan-head h2 { padding-left:0; }
.plan-head h2::before { display:none; }
@media (max-width:640px) { h2 { font-size:1.55rem; } }

/* Üst bar: buzlu cam */
body.app .topbar { background:rgba(255,255,255,.72); -webkit-backdrop-filter:saturate(180%) blur(22px); backdrop-filter:saturate(180%) blur(22px);
  border-bottom:1px solid rgba(0,0,0,.08); box-shadow:none; }
.topbar-zil, .tema-btn { color:var(--ink); }
.topbar-zil:hover, .topbar-zil.aktif, .tb-menu:hover, .tema-btn:hover { background:rgba(0,0,0,.06); }
.tb-menu { color:var(--ink); }
.topbar-user .role { font-size:.74rem; }

/* Kenar çubuğu: açık, buzlu; seçili sayfa yumuşak hap */
.sidebar { background:rgba(255,255,255,.62); -webkit-backdrop-filter:saturate(180%) blur(22px); backdrop-filter:saturate(180%) blur(22px);
  border-right:1px solid rgba(0,0,0,.08); padding:12px 10px; }
.yan-link { color:var(--text); font-weight:500; border-radius:10px; padding:9px 12px; }
.yan-link:hover { background:rgba(0,0,0,.05); color:var(--ink); }
.yan-link.akt { background:var(--brand); color:#fff; font-weight:600; }
.yan-link.akt::before { display:none; }
.yan-link .yi { opacity:.78; }
.yan-link.akt .yi { opacity:1; }
.yan-bolum { color:var(--muted); font-size:.72rem; font-weight:600; padding:16px 12px 4px; }
@media (max-width:900px) { .sidebar { background:rgba(255,255,255,.92); } }

/* Kartlar: ince çizgi, gölgesiz */
body.app .card { border:1px solid var(--line); border-radius:var(--radius); box-shadow:none; background:var(--surface); }
.mg-ozet-kart, .mt-canli, .mg-filtre, .bildirim-karti { box-shadow:none; }

/* Düğmeler: hap */
.btn { border-radius:980px; font-weight:600; letter-spacing:-.005em; }
.btn-primary { box-shadow:none; }
.btn-primary:hover { box-shadow:none; filter:brightness(1.08); }
.btn-ghost { background:var(--surface); border-color:var(--line); color:var(--ink); }
.btn-ghost:hover { background:rgba(0,0,0,.04); border-color:var(--line); }
.btn-mini { min-height:36px; padding:.4rem .95rem; font-size:.85rem; }
.badge { border-radius:980px; }

/* Form alanları */
.input, .sube-sec, select, textarea { border-radius:12px; border-color:var(--line); background:var(--surface); }
.input:focus, .sube-sec:focus, select:focus, textarea:focus { border-color:var(--brand); box-shadow:0 0 0 4px rgba(22,42,163,.14); outline:none; }

/* Tablolar */
.tbl th, table th { text-transform:none; letter-spacing:0; font-weight:600; font-size:.78rem; color:var(--muted); }
.tbl td, table td { border-color:var(--line); }

:focus-visible { outline:3px solid rgba(22,42,163,.45); }

/* ---- Mola Takibi: süzgeç ve sayfalama ------------------------------------- */
.mg-ozet-grid { gap:.8rem; }
.mg-ozet-kart { border-radius:var(--radius); padding:1rem .8rem; }
.mg-ozet-sayi { font-weight:600; letter-spacing:-.03em; font-size:1.8rem; color:var(--ink); }
.mg-ozet-kart.uyari .mg-ozet-sayi { color:var(--no); }
.mg-filtre { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:.8rem; margin-bottom:.9rem; }
.mg-f-ust { display:flex; gap:.5rem; align-items:center; }
.mg-ara { flex:1; min-width:0; min-height:42px; border-radius:980px; background:var(--bg); border-color:transparent; padding:.55rem 1.1rem; font-size:.95rem; }
.mg-ara:focus { background:var(--surface); }
.mg-f-ac { display:none; }
.mg-f-sayi { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; border-radius:9px; background:var(--brand); color:#fff; font-size:.7rem; padding:0 5px; margin-left:.25rem; }
.mg-f-detay { display:block; margin-top:.8rem; padding-top:.8rem; border-top:1px solid var(--line); }
.mg-donem { display:inline-flex; flex-wrap:wrap; gap:2px; padding:3px; background:var(--bg); border-radius:980px; max-width:100%; }
.mg-donem label { margin:0; cursor:pointer; }
.mg-donem input { position:absolute; opacity:0; pointer-events:none; }
.mg-donem span { display:block; padding:.38rem .9rem; border-radius:980px; font-size:.82rem; font-weight:500; color:var(--muted); white-space:nowrap; }
.mg-donem input:checked + span { background:var(--surface); color:var(--ink); font-weight:600; box-shadow:0 1px 3px rgba(0,0,0,.14); }
.mg-donem input:focus-visible + span { outline:3px solid rgba(22,42,163,.45); }
.mg-f-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:.7rem; margin-top:.8rem; }
.mg-f-alan { display:flex; flex-direction:column; gap:.25rem; margin:0; min-width:0; }
.mg-f-et { font-size:.74rem; font-weight:600; color:var(--muted); }
.mg-f-alan select, .mg-f-alan .input { width:100%; min-height:40px; }
.mg-f-tarih { grid-column:1 / -1; }
.mg-f-tarih.gizli { display:none; }
.mg-takvim { display:flex; align-items:center; gap:.5rem; }
.mg-tarih { max-width:none; flex:1; min-width:0; min-height:40px; }
.mg-f-alt { display:flex; gap:.5rem; margin-top:.8rem; }
.mg-sonuc-bar { display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap; margin:.2rem .2rem .7rem; }
.mg-sonuc-metin { font-size:.85rem; color:var(--muted); display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.mg-sonuc-metin b { color:var(--ink); font-weight:600; }
.mg-etkin { display:inline-flex; gap:.3rem; flex-wrap:wrap; }
.mg-etkin-chip { background:var(--brand-050); color:var(--brand); border-radius:980px; padding:.1rem .6rem; font-size:.76rem; font-weight:500; }
.mg-rapor-bar { margin:0; }
.mg-sayfa { display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin:1rem 0 .4rem; }
.mg-sayfa-no { display:flex; gap:.2rem; align-items:center; flex-wrap:wrap; justify-content:center; }
.mg-sayfa-n { min-width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border-radius:980px; font-size:.85rem; color:var(--text); text-decoration:none; }
a.mg-sayfa-n:hover { background:rgba(0,0,0,.06); }
.mg-sayfa-n.akt { background:var(--brand); color:#fff; font-weight:600; }
.mg-sayfa-bos { color:var(--muted); padding:0 .2rem; }
.mg-sayfa-ok { font-size:.85rem; font-weight:500; color:var(--brand); text-decoration:none; padding:.4rem .6rem; border-radius:980px; white-space:nowrap; }
a.mg-sayfa-ok:hover { background:var(--brand-050); }
.mg-sayfa-ok.pasif { color:var(--muted); opacity:.5; }
.mg-satir.asti { background:var(--no-bg); }

@media (max-width:900px) {
  .topbar-zil { display:none; }               /* Duyuru ve bildirim altta (mobil bar) zaten var */
}
@media (max-width:640px) {
  .mg-f-ac { display:inline-flex; }
  .mg-f-detay { display:none; }
  .mg-f-detay.acik { display:block; }
  .mg-donem { display:flex; width:100%; }
  .mg-donem label { flex:1 1 auto; }
  .mg-donem span { text-align:center; padding:.38rem .5rem; }
  .mg-f-grid { grid-template-columns:1fr 1fr; }
  .mg-sayfa-ok { padding:.4rem .4rem; }
  .mg-sayfa-n { min-width:30px; height:30px; }
}

/* ---- Koyu mod karşılıkları ------------------------------------------------- */
html[data-theme="dark"] body.app .topbar { background:rgba(10,13,38,.72); border-bottom-color:rgba(255,255,255,.08); }
html[data-theme="dark"] .sidebar { background:rgba(14,18,48,.7); border-right-color:rgba(255,255,255,.08); }
html[data-theme="dark"] .yan-link { color:var(--text); }
html[data-theme="dark"] .yan-link:hover { background:rgba(255,255,255,.07); color:var(--ink); }
html[data-theme="dark"] .yan-link.akt { background:var(--brand-100); color:#fff; }
html[data-theme="dark"] .yan-bolum { color:var(--muted); }
html[data-theme="dark"] .topbar-zil, html[data-theme="dark"] .tema-btn, html[data-theme="dark"] .tb-menu { color:var(--ink); }
html[data-theme="dark"] .topbar-zil:hover, html[data-theme="dark"] .tema-btn:hover, html[data-theme="dark"] .tb-menu:hover { background:rgba(255,255,255,.08); }
html[data-theme="dark"] body.app .card { background:transparent; border-color:var(--line); }
html[data-theme="dark"] .btn-ghost { background:transparent; color:var(--ink); }
html[data-theme="dark"] .btn-ghost:hover { background:rgba(255,255,255,.07); }
html[data-theme="dark"] .mg-ara { background:var(--surface-2); }
html[data-theme="dark"] .mg-donem { background:var(--surface-2); }
html[data-theme="dark"] .mg-donem input:checked + span { background:var(--brand-100); color:#fff; box-shadow:none; }
html[data-theme="dark"] .mg-f-sayi, html[data-theme="dark"] .mg-sayfa-n.akt { background:#3347D6; color:#fff; }
html[data-theme="dark"] a.mg-sayfa-n:hover { background:rgba(255,255,255,.08); }
@media (max-width:900px) { html[data-theme="dark"] .sidebar { background:rgba(14,18,48,.94); } }
.mg-liste { padding:0 .4rem; }
.mg-satir { padding:.8rem .6rem; border-radius:12px; }
.mg-satir.asti { border-bottom-color:transparent; }
.mg-zaman { white-space:nowrap; }
@media (max-width:640px) {
  .mg-satir { align-items:flex-start; }
  .mg-sure-blok { flex-direction:column; align-items:flex-end; gap:.1rem; }
  .mg-avatar { width:30px; height:30px; font-size:.8rem; }
}

/* Mobil çekmece: kapalıyken gölge sızmasın; açık sayfa açık zeminde olduğu için logo ters çevrilmez */
@media (max-width:900px) {
  .sidebar { box-shadow:none; }
  body.yan-acik .sidebar { box-shadow:8px 0 40px rgba(0,0,0,.18); }
  .yan-marka { border-bottom-color:var(--line); }
  .yan-marka img { filter:none; }
  .mobil-bar { background:rgba(255,255,255,.78); -webkit-backdrop-filter:saturate(180%) blur(22px); backdrop-filter:saturate(180%) blur(22px); border-top-color:rgba(0,0,0,.08); }
  html[data-theme="dark"] .mobil-bar { background:rgba(10,13,38,.78); border-top-color:rgba(255,255,255,.08); }
  html[data-theme="dark"] .yan-marka img { filter:brightness(0) invert(1); }
}
.oz-personel-liste { padding:.3rem .9rem; }