/* BEEP masaustu arayuzu - Quartz duzeni, kendi cizimimiz */
:root {
  --shell: #354a5f;
  --bg: #f7f7f7;
  --panel: #ffffff;
  --line: #d9d9d9;
  --line-dark: #89919a;
  --text: #32363a;
  --muted: #6a6d70;
  --accent: #0a6ed1;
  --accent-soft: #e5f0fa;
  --ok: #107e3e;
  --warn: #e9730c;
  --err: #bb0000;
  --info: #0a6ed1;
  --field-ro: #f2f2f2;
  --row-alt: #fafafa;
  --row-sel: #dbe9f6;
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  font-family: "Segoe UI", Arial, sans-serif; font-size: 14px; color: var(--text);
  background: var(--bg); display: flex; flex-direction: column; overflow: hidden;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---- Pencere cercevesi ---- */
.menubar { display: flex; align-items: center; height: 32px; background: #fff; border-bottom: 1px solid var(--line); padding: 0 6px; }
.menubar .brand { font-weight: 700; color: var(--shell); margin-right: 14px; letter-spacing: .5px; }
.menubar .brand { display: inline-flex; align-items: center; gap: 6px; }
.menubar .m { position: relative; padding: 5px 12px; cursor: default; border-radius: 3px; }
.menubar .m:hover, .menubar .m.open { background: var(--accent-soft); }
.menubar .dd { display: none; position: absolute; left: 0; top: 30px; min-width: 250px; background: #fff; border: 1px solid var(--line-dark); box-shadow: 0 3px 10px rgba(0,0,0,.18); z-index: 50; padding: 3px 0; }
.menubar .m.open .dd { display: block; }
.menubar .dd a { display: flex; justify-content: space-between; gap: 20px; padding: 7px 16px; color: var(--text); white-space: nowrap; }
.menubar .dd a:hover { background: var(--accent-soft); text-decoration: none; }
.menubar .dd hr { border: 0; border-top: 1px solid var(--line); margin: 3px 0; }
.menubar .dd kbd { color: var(--muted); font-family: inherit; font-size: 11px; }
.menubar .right { margin-left: auto; color: var(--muted); font-size: 12px; }

.systoolbar { display: flex; align-items: center; gap: 3px; height: 42px; padding: 0 8px; background: #eef3f8; border-bottom: 1px solid var(--line); }
.sep { width: 1px; height: 20px; background: var(--line); margin: 0 5px; }
.ib { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 32px; height: 32px; padding: 0 6px; border: 1px solid transparent; border-radius: 3px; background: transparent; color: var(--text); cursor: pointer; font: inherit; }
.ib:hover:not([disabled]) { background: #dde7f1; border-color: #b8c7d6; text-decoration: none; }
.ib[disabled] { opacity: .35; cursor: default; }
.ib svg { width: 20px; height: 20px; flex: none; }

.titlebar { background: #fff; padding: 10px 16px 8px; font-size: 21px; font-weight: 400; border-bottom: 1px solid var(--line); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.apptoolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; min-height: 40px; padding: 3px 10px; background: #fff; border-bottom: 1px solid var(--line); }
.apptoolbar .ib { padding: 0 10px; }

.workarea { flex: 1; overflow: auto; padding: 10px 14px 16px; }
.workarea svg { width: 18px; height: 18px; vertical-align: middle; flex: none; }

.statusbar { display: flex; align-items: center; height: 30px; background: #eef1f4; border-top: 1px solid var(--line); font-size: 12px; }
.statusbar .msg { flex: 1; display: flex; align-items: center; gap: 6px; padding: 0 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.statusbar .msg svg { width: 17px; height: 17px; flex: none; }
.statusbar .msg.S { color: var(--ok); } .statusbar .msg.W { color: #a35300; } .statusbar .msg.E { color: var(--err); font-weight: 600; } .statusbar .msg.I { color: var(--info); }
.statusbar .cell { padding: 0 10px; border-left: 1px solid var(--line); color: var(--muted); height: 100%; display: flex; align-items: center; }

/* ---- Grup kutusu, alanlar ---- */
.group { background: var(--panel); border: 1px solid var(--line); border-radius: 3px; margin: 0 0 12px; }
.group > .gt { padding: 8px 12px; font-weight: 600; border-bottom: 1px solid var(--line); background: #fbfbfb; }
.group > .gb { padding: 12px 14px; }
.form { display: grid; grid-template-columns: max-content max-content max-content; column-gap: 12px; row-gap: 7px; align-items: center; }
.form.two { grid-template-columns: max-content max-content max-content max-content max-content max-content; }
.lbl { color: var(--text); white-space: nowrap; padding-right: 6px; min-width: 165px; }
.lbl.req::after { content: " *"; color: var(--err); }
.inp, select.inp, textarea.inp { height: 30px; border: 1px solid var(--line-dark); border-radius: 2px; padding: 0 7px; font: inherit; background: #fff; }
textarea.inp { height: auto; padding: 4px 5px; }
.inp:focus { outline: 2px solid var(--accent); outline-offset: -1px; }
.inp[readonly], .inp:disabled { background: var(--field-ro); border-color: #c6c6c6; color: #444; }
.inp.err { border-color: var(--err); background: #fff5f5; }
.inp.num { text-align: right; }
.hint { color: var(--muted); font-size: 13px; }
.range-sep { color: var(--muted); padding: 0 4px; }
.chk { display: inline-flex; align-items: center; gap: 5px; }

/* ---- Sekmeler ---- */
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--line-dark); margin-bottom: 0; }
.tabs button { border: 1px solid var(--line); border-bottom: none; background: #eef1f4; padding: 8px 18px; font: inherit; cursor: pointer; border-radius: 3px 3px 0 0; color: var(--text); }
.tabs button.act { background: #fff; border-color: var(--line-dark); position: relative; top: 1px; font-weight: 600; }
.tabpane { display: none; background: #fff; border: 1px solid var(--line-dark); border-top: none; padding: 14px; margin-bottom: 12px; }
.tabpane.act { display: block; }

/* ---- ALV liste ---- */
.alv-wrap { background: #fff; border: 1px solid var(--line); }
.alv-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; padding: 2px 4px; border-bottom: 1px solid var(--line); background: #fbfbfb; }
.alv-bar .info { margin-left: auto; color: var(--muted); padding: 0 8px; font-size: 13px; }
.alv-scroll { overflow: auto; max-height: calc(100vh - 250px); }
table.alv { border-collapse: collapse; width: max-content; min-width: 100%; }
table.alv th, table.alv td { border: 1px solid #e3e3e3; padding: 6px 10px; white-space: nowrap; }
table.alv th { position: sticky; top: 0; background: #eef1f4; font-weight: 600; text-align: left; cursor: pointer; z-index: 1; }
table.alv th.sorted-asc::after { content: " ▲"; font-size: 9px; } table.alv th.sorted-desc::after { content: " ▼"; font-size: 9px; }
table.alv th.selcol { background: #cfe0f2; }
table.alv tbody tr:nth-child(even) { background: var(--row-alt); }
table.alv tbody tr:hover { background: #eef5fc; }
table.alv tbody tr.sel { background: var(--row-sel); }
table.alv td.n { text-align: right; font-variant-numeric: tabular-nums; }
table.alv tfoot td { background: #fff7d6; font-weight: 600; }
table.alv tr.hidden { display: none; }
table.alv td a { color: var(--accent); }
.row-red td { background: #fde2e2 !important; } .row-yel td { background: #fff4c2 !important; }
.row-gry td { background: #e8e8e8 !important; } .row-blu td { background: #dcebfa !important; }

/* ---- Acilir pencere (modal) ---- */
.modal-bg { position: fixed; inset: 0; background: rgba(40,50,60,.35); display: none; align-items: flex-start; justify-content: center; padding-top: 10vh; z-index: 100; }
.modal-bg.open { display: flex; }
.modal { background: #fff; border: 1px solid var(--line-dark); box-shadow: 0 8px 28px rgba(0,0,0,.3); min-width: 420px; max-width: 90vw; max-height: 78vh; display: flex; flex-direction: column; }
.modal .mh { background: var(--shell); color: #fff; padding: 10px 14px; display: flex; justify-content: space-between; align-items: center; }
.modal .mh button { background: none; border: 0; color: #fff; font-size: 16px; cursor: pointer; }
.modal .mb { padding: 12px; overflow: auto; }
.modal .mf { padding: 8px 12px; border-top: 1px solid var(--line); display: flex; gap: 6px; justify-content: flex-end; }
/* Sistem mesaji (planlanan guncelleme) ve surum yenilikleri */
.modal .sysmsg { display: flex; gap: 10px; align-items: flex-start; max-width: 560px; }
.modal .sysmsg svg { width: 22px; height: 22px; flex: none; }
.modal .sysmsg p { margin: 6px 0 0; }
/* BEAP iletisim penceresi (onay / bilgi / giris): metin satir sonlarini korur; giris kutusu tam genislik */
#beepdlg { z-index: 200; }
#beepdlg .modal { min-width: 380px; max-width: 560px; }
#beepdlg .dlgtx { flex: 1; min-width: 0; }
#beepdlg-x { white-space: pre-line; line-height: 1.5; padding-top: 2px; }
#beepdlg-in { width: 100%; box-sizing: border-box; margin-top: 8px; }
#beepdlg .mf .btn { min-width: 76px; }
.modal.news .mb { max-width: 680px; }
.news .nv { font-weight: bold; margin: 2px 0 4px; }
.news ul + .nv { margin-top: 12px; }
.news ul { margin: 0; padding-left: 20px; }
.news li { margin: 3px 0; }
.btn { height: 32px; padding: 0 16px; border: 1px solid var(--line-dark); background: #fff; border-radius: 3px; font: inherit; cursor: pointer; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn:hover { filter: brightness(.96); }

/* ---- Logon ---- */
body.logon { background: linear-gradient(160deg, #27384a 0%, #3f5a75 60%, #506f8f 100%); align-items: center; justify-content: center; }
.logon-box { width: 420px; background: #fff; border-radius: 4px; box-shadow: 0 12px 40px rgba(0,0,0,.35); overflow: hidden; }
.logon-head { background: var(--shell); color: #fff; padding: 18px 22px; }
.logon-head .t { font-size: 26px; font-weight: 800; letter-spacing: 3px; }
.logon-head .s { opacity: .8; font-size: 12px; margin-top: 2px; }
.logon-body { padding: 20px 22px 8px; display: grid; grid-template-columns: 110px 1fr; row-gap: 10px; align-items: center; }
.logon-body .inp { height: 28px; width: 100%; }
.logon-foot { padding: 10px 22px 18px; display: flex; justify-content: space-between; align-items: center; }
.logon-msg { margin: 0 22px; padding: 7px 10px; border-radius: 3px; background: #fde2e2; color: var(--err); font-size: 12px; }

/* yazdirma: kenar boslugu ve zemin beyaz (Windows yazdirma penceresinde kenarlar program penceresinin gri zeminini aliyordu) */
@page { background: #fff; }
@media print {
  .menubar, .systoolbar, .apptoolbar, .statusbar, .alv-bar { display: none !important; }
  html, body { background: #fff !important; }
  body { overflow: visible; display: block; } .workarea { overflow: visible; }
  .alv-scroll { max-height: none; overflow: visible; }
}

/* mal girisi okutma sonucu */
.scanres { margin-top: 8px; padding: 8px 10px; font-size: 16px; border-left: 6px solid; }
.scanres.good { background: #e7f4e4; border-color: #2b7d2b; }
.scanres.done { background: #dcebfa; border-color: #0a6ed1; font-weight: bold; }
.scanres.dup { background: #fff4c2; border-color: #c48b00; }
.scanres.bad { background: #fde2e2; border-color: #bb0000; font-weight: bold; }

/* ---- Ana ekran: sol menu + gosterge paneli ---- */
.workarea.home { padding: 0; overflow: hidden; }
.ea { display: flex; height: 100%; }
.ea-nav { width: 440px; min-width: 260px; display: flex; flex-direction: column; background: #fff; border-right: 1px solid var(--line); }
.ea-split { width: 6px; cursor: col-resize; background: transparent; flex: none; margin-left: -3px; }
.ea-split:hover { background: var(--accent-soft); }
.ea-search { padding: 10px 12px; border-bottom: 1px solid var(--line); }
.ea-search input { width: 100%; height: 36px; font: inherit; font-size: 15px; padding: 0 14px; border: 1px solid var(--line-dark); border-radius: 18px; background: #f7f9fb; }
.ea-search input:focus { outline: 2px solid var(--accent); outline-offset: -1px; background: #fff; }
.ea-foot { padding: 8px 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.tree { flex: 1; overflow: auto; padding: 8px 6px 12px; font-size: 15px; }
.tree ul { list-style: none; margin: 0; padding-left: 22px; }
.tree > ul { padding-left: 2px; }
.tree li { margin: 1px 0; }
.tree .node { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 4px; cursor: pointer; user-select: none; line-height: 1.25; }
.tree .node:hover { background: var(--accent-soft); }
.tree .node:focus { outline: 2px solid var(--accent); outline-offset: -2px; }
.tree .node.sel { background: var(--row-sel); }
.workarea .tree .node svg { width: 20px; height: 20px; flex: none; }
.tree .node.folder { font-weight: 600; color: #2b3a49; }
.tree .node.folder svg { color: #c98a00; }
.tree .node.tx svg { color: var(--accent); }
.tree .tw { width: 12px; flex: none; color: var(--muted); font-size: 12px; transition: transform .12s; transform: rotate(90deg); }
.tree li.closed > .node .tw { transform: rotate(0); }
.tree li.closed > ul { display: none; }
.tree .code { display: inline-block; min-width: 82px; margin-right: 8px; padding: 1px 6px; border-radius: 3px; background: #eef2f6; color: #4a5866; font-size: 12px; font-weight: 600; font-family: Consolas, "Segoe UI", monospace; }
.tree.searching li.closed > ul { display: block; }
.tree.searching .tw { transform: rotate(90deg); }
.tree li.nohit { display: none; }
.ea-main { flex: 1; overflow: auto; padding: 18px 22px 24px; background: var(--bg); }
.dash-h h1 { margin: 0; font-size: 22px; font-weight: 400; color: #2b3a49; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 12px; margin: 16px 0; }
.card { display: flex; flex-direction: column; gap: 4px; background: #fff; border: 1px solid var(--line); border-top: 4px solid #9aa4ae; border-radius: 6px; padding: 12px 14px; color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.04); transition: box-shadow .12s, transform .12s; }
.card:hover { text-decoration: none; box-shadow: 0 4px 14px rgba(0,0,0,.10); transform: translateY(-1px); }
.card-l { color: var(--muted); font-size: 13px; }
.card-v { font-size: 26px; font-weight: 600; color: #22313f; font-variant-numeric: tabular-nums; }
.card-v small { font-size: 14px; font-weight: 400; color: var(--muted); }
.card-s { font-size: 12px; color: var(--muted); }
.card.tone-ok { border-top-color: var(--ok); } .card.tone-accent { border-top-color: var(--accent); }
.card.tone-warn { border-top-color: #e9b10c; } .card.tone-err { border-top-color: #d04343; } .card.tone-err .card-s { color: var(--err); }
.charts { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 14px; }
.chart { background: #fff; border: 1px solid var(--line); border-radius: 6px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.chart:first-child { grid-column: 1 / -1; }
.chart-h { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-bottom: 1px solid #eee; font-weight: 600; color: #2b3a49; }
.chart-h a { font-weight: 400; font-size: 13px; }
.chart-b { padding: 12px 14px; }
.workarea .chart-svg { width: 100%; height: auto; max-height: 260px; display: block; }
.chart-svg .grid { stroke: #e8ecf0; stroke-width: 1; }
.chart-svg .ax { fill: #6a6d70; font-size: 11px; } .chart-svg .ax2 { fill: #9aa0a6; font-size: 10px; }
.chart-svg .val { fill: #2b3a49; font-size: 10.5px; font-weight: 600; }
.chart-svg .bar rect { fill: #6aa7e6; transition: fill .12s; } .chart-svg .bar:hover rect { fill: var(--accent); }
.chart-svg .bar.today rect { fill: var(--accent); } .chart-svg .bar.today .ax { fill: var(--accent); font-weight: 700; }
.donut-wrap { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.workarea svg.donut { width: 170px; height: 170px; }
.donut-bg { fill: none; stroke: #eef1f4; stroke-width: 22; }
.donut-num { font-size: 30px; font-weight: 600; fill: #22313f; } .donut-unit { font-size: 12px; fill: #6a6d70; }
.legend { list-style: none; margin: 0; padding: 0; flex: 1; min-width: 200px; }
.legend li a { display: flex; align-items: center; gap: 10px; padding: 7px 6px; color: var(--text); border-radius: 4px; }
.legend li a:hover { background: var(--accent-soft); text-decoration: none; }
.legend i { width: 14px; height: 14px; border-radius: 3px; flex: none; }
.legend b { margin-left: auto; font-variant-numeric: tabular-nums; }
.hbars .hb { display: grid; grid-template-columns: 150px 1fr 120px; align-items: center; gap: 10px; padding: 5px 0; }
.hb-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hb-t { height: 14px; background: #f0f3f6; border-radius: 7px; overflow: hidden; }
.hb.total .hb-t { background: transparent; }
.hb-f { display: block; height: 100%; background: linear-gradient(90deg, #5fa0e3, var(--accent)); border-radius: 7px; }
.hb-f.neg { background: #d04343; }
.hb-v { text-align: right; font-variant-numeric: tabular-nums; }
.hb.total { border-top: 1px solid #eee; margin-top: 4px; font-weight: 600; }
table.mini { width: 100%; border-collapse: collapse; }
table.mini th, table.mini td { padding: 6px; border-bottom: 1px solid #f0f0f0; text-align: left; }
table.mini th { color: var(--muted); font-weight: 400; font-size: 13px; }
table.mini .n { text-align: right; } table.mini .neg { color: var(--err); font-weight: 600; }
.logo-mark { font-size: 54px; font-weight: 800; color: #d5dde6; letter-spacing: 4px; margin-top: 40px; }

/* =====================================================================
   Corbu temasi (kendi cizimimiz)
   Orantili yazi tipi: Tahoma 12 punto
   ===================================================================== */
:root {
  --shell: #3a5068;
  --bg: #eef0f2;
  --panel: #ffffff;
  --line: #c4cbd1;
  --line-dark: #9aa3ab;
  --text: #222222;
  --muted: #5f6870;
  --accent: #2d5d8b;
  --accent-soft: #e3ecf5;
  --field-ro: #eceef0;
  --row-alt: #f5f7f9;
  --row-sel: #fce8a6;
  --focus: #f0ab00;
}
body { font-family: Tahoma, Verdana, "Segoe UI", sans-serif; font-size: 12pt; color: var(--text); background: var(--bg); }
.inp, select.inp, textarea.inp, .btn, .ib, .tabs button, input, select, textarea, button { font-family: Tahoma, Verdana, sans-serif; }

/* ust cerceve: menu + sistem araclari, hafif degrade */
.menubar { background: linear-gradient(#ffffff, #f1f3f5); border-bottom: 1px solid #cfd5da; height: 30px; }
.menubar .brand { color: #2b4560; font-size: 11pt; }
.menubar .m:hover, .menubar .m.open { background: #fbe6a3; }
.menubar .dd { border-color: #9aa3ab; box-shadow: 2px 3px 8px rgba(0,0,0,.22); }
.menubar .dd a:hover { background: #fbe6a3; }
.systoolbar { background: linear-gradient(#f7f8f9, #dfe4e8); border-bottom: 1px solid #b9c1c8; height: 40px; }
.inp:focus, .ea-search input:focus { outline: none; border-color: var(--focus); box-shadow: 0 0 0 1px var(--focus), inset 1px 1px 2px rgba(0,0,0,.06); background: #fffdf3; }
.ib:hover:not([disabled]) { background: linear-gradient(#fffaf0, #fbe3a0); border-color: #d9b45a; }
.sep { background: #b9c1c8; }

/* baslik ve uygulama arac cubugu */
.titlebar { background: linear-gradient(#ffffff, #eef1f4); color: #2b4560; font-size: 15pt; padding: 8px 16px 7px; border-bottom: 1px solid #cfd5da; }
.apptoolbar { background: linear-gradient(#f9fafb, #e8ecef); border-bottom: 1px solid #c4cbd1; }

/* calisma alani */
.workarea { background: var(--bg); }
.group { border: 1px solid #b9c1c8; border-radius: 0; box-shadow: none; }
.group > .gt { background: linear-gradient(#fafbfc, #e9edf0); color: #2b4560; font-weight: bold; border-bottom: 1px solid #c4cbd1; }
.lbl { color: #222; }
.inp, select.inp, textarea.inp { border: 1px solid #98a2ab; border-radius: 0; height: 28px; background: #fff; box-shadow: inset 1px 1px 1px rgba(0,0,0,.06); }
.inp[readonly], .inp:disabled { background: var(--field-ro); border-color: #c4cbd1; color: #333; box-shadow: none; }
.inp.err { border-color: var(--err); background: #fff0f0; }
.hint { font-size: 10pt; }
.btn { border: 1px solid #98a2ab; border-radius: 2px; background: linear-gradient(#ffffff, #e4e8ec); height: 30px; }
.btn:hover { background: linear-gradient(#fffaf0, #fbe3a0); border-color: #d9b45a; filter: none; }
.btn.primary { background: linear-gradient(#4f7fae, #2d5d8b); border-color: #244c72; color: #fff; }
.btn.primary:hover { background: linear-gradient(#5b8bbb, #33679a); }

/* sekmeler */
.tabs { border-bottom: 1px solid #9aa3ab; gap: 1px; }
.tabs button { background: linear-gradient(#f8f9fa, #dde2e6); border: 1px solid #b9c1c8; border-bottom: none; border-radius: 4px 4px 0 0; color: #2b4560; padding: 6px 16px; }
.tabs button:hover { background: linear-gradient(#fffaf0, #fbe8b0); }
.tabs button.act { background: #fff; border-color: #9aa3ab; font-weight: bold; }
.tabpane { border-color: #9aa3ab; }

/* ALV */
.alv-wrap { border: 1px solid #b9c1c8; }
.alv-bar { background: linear-gradient(#fafbfc, #e6eaee); border-bottom: 1px solid #c4cbd1; }
table.alv th, table.alv td { border: 1px solid #dde2e6; padding: 4px 8px; }
table.alv th { background: linear-gradient(#f7f8f9, #e1e6ea); color: #2b4560; font-weight: bold; border-color: #c4cbd1; }
table.alv th.selcol { background: #fbe3a0; }
table.alv tbody tr:nth-child(even) { background: var(--row-alt); }
table.alv tbody tr:hover { background: #fff6d6; }
table.alv tbody tr.sel { background: var(--row-sel); }
table.alv tfoot td { background: #fff3c4; }

/* durum cubugu */
.statusbar { background: linear-gradient(#f3f5f7, #d9dee3); border-top: 1px solid #b9c1c8; height: 28px; font-size: 10pt; }
.statusbar .cell { border-left: 1px solid #c4cbd1; color: #3d4852; }

/* acilir pencere */
.modal { border: 1px solid #7f8a94; border-radius: 0; }
.modal .mh { background: linear-gradient(#4a6683, #33506d); }

/* Easy Access menusu */
.ea-nav { background: #fff; border-right: 1px solid #b9c1c8; }
.ea-search { background: linear-gradient(#fafbfc, #eef1f4); }
.ea-search input { border-radius: 0; background: #fff; border-color: #98a2ab; }
.tree { font-size: 12pt; }
.tree .node { border-radius: 0; padding: 4px 6px; }
.tree .node:hover { background: #fff6d6; }
.tree .node.sel { background: var(--row-sel); outline: 1px dotted #8a6d00; }
.tree .node.folder { color: #1f3a55; }
.tree .code { background: transparent; color: #2d5d8b; padding: 0; min-width: 0; font-family: Tahoma, sans-serif; font-size: 11pt; }
.ea-main { background: var(--bg); }
.dash-h h1 { font-size: 16pt; color: #2b4560; }
.card, .chart { border-radius: 0; border-color: #b9c1c8; box-shadow: none; }
.card-v { font-size: 20pt; }
.chart-h { background: linear-gradient(#fafbfc, #e9edf0); border-bottom: 1px solid #c4cbd1; color: #2b4560; }
.chart-svg .bar rect { fill: #6f97bf; } .chart-svg .bar:hover rect, .chart-svg .bar.today rect { fill: #2d5d8b; }

/* oturum ekrani */
body.logon { background: linear-gradient(170deg, #dfe5ea 0%, #c7d1da 55%, #b3c0cc 100%); }
.logon-box { border: 1px solid #9aa3ab; border-radius: 0; box-shadow: 0 6px 24px rgba(40,60,80,.25); }

/* ---- Menu ozellestirme: sag tik menusu, surukle-birak, ad degistirme ---- */
.ctxmenu { position: fixed; display: none; min-width: 250px; background: #fff; border: 1px solid #7f8a94; box-shadow: 2px 3px 10px rgba(0,0,0,.25); z-index: 200; padding: 3px 0; }
.ctxmenu.open { display: block; }
.ctxmenu a { display: flex; justify-content: space-between; gap: 18px; padding: 6px 16px; color: var(--text); }
.ctxmenu a:hover { background: #fbe6a3; text-decoration: none; }
.ctxmenu kbd { color: var(--muted); font-family: inherit; font-size: 10pt; }
.ctxmenu hr { border: 0; border-top: 1px solid var(--line); margin: 3px 0; }
.tree li.dragging > .node { opacity: .45; }
.tree li.drop-before > .node { box-shadow: inset 0 3px 0 #f0ab00; }
.tree li.drop-after > .node { box-shadow: inset 0 -3px 0 #f0ab00; }
.tree .node.renamed .lb { font-style: italic; }
.tree .inp.rn { height: 26px; min-width: 220px; font-size: 12pt; }
.tabs button[draggable=true] { cursor: pointer; }
.tabs button.tab-drag { opacity: .45; }
.tabs button.tab-over { box-shadow: inset 3px 0 0 #f0ab00; }
.learnbox { margin-top: 8px; padding: 10px 12px; background: #fff8e1; border: 1px solid #e9c46a; }
.workarea svg.bc { width: 260px; height: 64px; max-width: 100%; }

/* ---- BEAP dikey form gruplari (musteri karti vb.) ---- */
.beapcols { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; }
.beapcol { flex: 0 1 860px; min-width: 600px; }
.sg { background: #fff; border: 1px solid #c4cbd1; padding: 2px 12px 10px; margin: 0 0 10px; }
.sgt { color: #1f3a55; padding: 6px 0 3px; margin-bottom: 6px; border-bottom: 2px solid #2b7bc0; display: flex; justify-content: space-between; }
.sgx { color: var(--muted); font-size: 10pt; }
.sr { display: flex; align-items: center; gap: 4px; margin: 4px 0; min-height: 30px; flex-wrap: wrap; }
.sl { flex: none; width: 140px; color: #222; }
.sl2 { flex: none; margin-left: 14px; margin-right: 4px; color: #222; }
.sl.req::after, .sl2.req::after { content: " *"; color: var(--err); }
.sgerr { color: var(--err); font-weight: bold; }
.sgsub { border-top: 1px dashed #c4cbd1; margin-top: 6px; padding-top: 4px; }
.sgsubt { font-weight: bold; color: #1f3a55; margin: 2px 0 4px; }
.ib.on { background: linear-gradient(#fffaf0, #fbe3a0); border-color: #d9b45a; }

/* BEAP rapor ust cubugu: tek satirda alanlar ve dugmeler */
.beapbar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; background: #fff; border: 1px solid #c4cbd1; padding: 8px 10px; margin-bottom: 8px; }
.beapbar .btn { display: inline-flex; align-items: center; gap: 4px; }
.sl3 { margin: 0 4px 0 10px; } .sl3:first-child { margin-left: 0; }

/* ---- Satis siparisi (ZSD21000 duzeni) ---- */
.sotop { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 8px; flex-wrap: wrap; }
.sbox { background: #fff; border: 1px solid #b9c1c8; padding: 0 8px 8px; margin-bottom: 6px; }
.sboxt { background: linear-gradient(#fafbfc, #e9edf0); margin: 0 -8px 6px; padding: 4px 8px; border-bottom: 1px solid #c4cbd1; color: #2b4560; font-weight: bold; }
.sohead { flex: 1 1 900px; }
.socol { flex: 0 0 auto; display: flex; flex-direction: column; gap: 0; }
.sogrid { display: grid; grid-template-columns: 26px max-content 26px max-content max-content max-content; column-gap: 6px; row-gap: 4px; align-items: center; }
.sol { white-space: nowrap; padding-right: 8px; }
.sol2 { white-space: nowrap; padding: 0 6px 0 14px; }
.sol3 { margin: 0 6px 0 14px; white-space: nowrap; }
.sol.req::after, .sol2.req::after { content: " *"; color: var(--err); }
.sov { white-space: nowrap; display: flex; align-items: center; gap: 4px; }
.sov2 { white-space: nowrap; display: flex; align-items: center; gap: 2px; }
.sowide { grid-column: 4 / span 3; }
.sicon { display: inline-flex; width: 24px; height: 24px; align-items: center; justify-content: center; border: 1px solid #c9a94a;
         background: linear-gradient(#fffdf2, #f7e7a8); border-radius: 2px; cursor: pointer; padding: 0; color: #5a4a10; }
.sicon:hover { filter: brightness(.95); text-decoration: none; }

span.sicon:empty { visibility: hidden; }
.workarea .sicon svg { width: 15px; height: 15px; }
.sorow { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 3px 0; white-space: nowrap; }
.sopay { min-width: 250px; }
.sobal span:first-child { font-weight: bold; }
.sobal.ok input { color: #107e3e; font-weight: bold; } .sobal.bad input { color: #bb0000; font-weight: bold; }
.tl { display: inline-flex; gap: 2px; padding: 2px 4px; border: 1px solid #9aa3ab; border-radius: 8px; background: #f4f4f4; }
.tl i { width: 10px; height: 10px; border-radius: 50%; background: #d8d8d8; border: 1px solid #aaa; }
.tl-R i:nth-child(1) { background: #e0362c; border-color: #a01c14; }
.tl-Y i:nth-child(2) { background: #f2c500; border-color: #a88a00; }
.tl-G i:nth-child(3) { background: #2fa84f; border-color: #1b6b30; }
.btn.beapyel { background: linear-gradient(#fff6c8, #f6d96a); border-color: #c9a94a; color: #222; margin: 2px 0 8px; }
.btn.beapyel:hover { background: linear-gradient(#fff9da, #f9e389); }
.subtabs { display: flex; flex-wrap: wrap; gap: 1px; border-bottom: 1px solid #9aa3ab; margin: 0 0 8px; }
.subtabs button { border: 1px solid #b9c1c8; border-bottom: none; background: linear-gradient(#f8f9fa, #dde2e6); padding: 4px 12px; font: inherit; font-size: 11pt;
                  border-radius: 4px 4px 0 0; cursor: pointer; color: #2b4560; }
.subtabs button.act { background: #fff; font-weight: bold; position: relative; top: 1px; }
.subtabs small { color: var(--muted); font-weight: normal; }

/* BEAP secim ekrani satiri: etiket | baslangic | son | bitis */
.selrow { min-height: 28px; margin: 2px 0; }
.sll { flex: none; width: 260px; }
.son { margin: 0 10px; color: #222; }
.qd { margin-left: 12px; display: inline-flex; gap: 3px; } .qd .btn { height: 26px; padding: 0 8px; font-size: 10pt; }

/* Gorsel tasarim secenekleri */
html:not([data-noshadow]) .sg, html:not([data-noshadow]) .sbox, html:not([data-noshadow]) .group,
html:not([data-noshadow]) .alv-wrap { box-shadow: 0 1px 3px rgba(0,0,0,.10); }
html:not([data-nofocus]) .inp:focus { transition: box-shadow .15s ease; box-shadow: 0 0 0 2px var(--focus, #f0ab00); }

.opt { display: flex; gap: 12px; align-items: flex-start; }
.opt-nav { flex: none; width: 260px; background: #fff; border: 1px solid var(--line); padding: 6px; }
.opt-nav a { display: block; padding: 5px 8px 5px 22px; color: var(--text); }
.opt-nav a.f { padding-left: 4px; font-weight: bold; }
.opt-nav a.sel { background: var(--row-sel); }
.opt-main { flex: 1; min-width: 560px; }

.fontprev { border: 1px solid var(--line); padding: 10px 12px; background: #fff; margin-top: 8px; }
/* Ana menude uygulama arac cubugu satiri yok */

/* ==== BEAP olculeri (ekran dokumlerinden: satir araligi 34 / sutun 13 fiziksel px, %150 olcekte 22,7 / 8,7 px).
   Yazi boyutu "12" = 12 px; tum yukseklikler buna gore. Temalardan sonra da gecerli olsun diye !important yok,
   tema dosyalari yalnizca renk tanimlar. ==== */
body { font-size: 12px; }
.menubar { height: 22px; padding: 0 4px; }
.menubar .m { padding: 1px 8px; }
.menubar .brand { font-size: 12px; margin-right: 8px; }
.menubar .brand img { width: 14px; height: 14px; }
.menubar .dd { top: 21px; } .menubar .dd a { padding: 4px 14px; }
.menubar .right, .menubar .dd kbd { font-size: 11px; }
.systoolbar { height: 28px; padding: 0 4px; gap: 1px; }
.ib { min-width: 22px; height: 22px; padding: 0 3px; gap: 3px; }
.ib svg { width: 16px; height: 16px; }
.sep { height: 16px; margin: 0 3px; }
.titlebar { font-size: 15px; padding: 3px 10px 3px; }
.apptoolbar { min-height: 26px; padding: 1px 6px; }
.apptoolbar .ib { padding: 0 6px; }
.workarea { padding: 6px 8px 10px; }
.workarea svg { width: 14px; height: 14px; }
.statusbar { height: 21px; font-size: 11px; }
.statusbar .msg svg { width: 14px; height: 14px; }
.statusbar .cell { padding: 0 8px; }
.inp, select.inp { height: 19px; padding: 0 3px; font-size: 12px; }
select.inp { padding: 0 1px; }
textarea.inp { height: auto; }
.lbl { min-width: 140px; }
.hint, .sgx { font-size: 11px; }
.btn { height: 22px; padding: 0 10px; font-size: 12px; }
.form { row-gap: 3px; column-gap: 6px; }
.group > .gt { padding: 3px 8px; } .group > .gb { padding: 6px 8px; }
.tabs button { padding: 3px 12px; }
.tabpane { padding: 8px; margin-bottom: 8px; }
.subtabs button { padding: 2px 10px; font-size: 12px; }
table.alv th, table.alv td { padding: 1px 6px; height: 19px; }
.alv-bar { padding: 1px 3px; } .alv-bar .info { font-size: 11px; }
.alv-scroll { max-height: calc(100vh - 190px); }
.sg { padding: 0 8px 6px; margin: 0 0 6px; }
.sgt { padding: 3px 0 2px; margin-bottom: 3px; }
.sr { min-height: 21px; margin: 1px 0; gap: 3px; }
.selrow { min-height: 21px; margin: 1px 0; }
.sl { width: 140px; }
.sll { width: 277px; }               /* BEAP secim ekrani: alan 33. sutunda */
.son { margin: 0 8px; }
.beapbar { padding: 4px 6px; margin-bottom: 6px; gap: 4px; }
.sbox { padding: 0 6px 5px; margin-bottom: 5px; } .sboxt { padding: 2px 6px; margin: 0 -6px 4px; }
.sicon { width: 19px; height: 19px; } .workarea .sicon svg { width: 13px; height: 13px; }
.qd .btn { height: 19px; font-size: 11px; padding: 0 6px; }
.modal .mh { padding: 5px 10px; } .modal .mb { padding: 8px; } .modal .mf { padding: 5px 8px; }
.ctxmenu a { padding: 4px 14px; } .ctxmenu kbd { font-size: 11px; }
.tree { padding: 4px 4px 8px; }
.tree .node { padding: 2px 5px; gap: 6px; }
.workarea .tree .node svg { width: 16px; height: 16px; }
.tree .code { font-size: 11px; }
.tree .inp.rn { height: 19px; font-size: 12px; }
.ea-foot { padding: 4px 8px; font-size: 11px; }
.ea-main { padding: 10px 14px 16px; }
.dash-h h1 { font-size: 16px; }
.card { padding: 8px 10px; }
.card-l, .card-s { font-size: 11px; }
.card-v { font-size: 20px; }
.card-v small { font-size: 12px; }
.chart-h { padding: 5px 10px; } .chart-h a { font-size: 11px; } .chart-b { padding: 8px 10px; }
.legend li a { padding: 3px 4px; }
table.mini th, table.mini td { padding: 3px 5px; } table.mini th { font-size: 11px; }
.opt-nav a { padding: 3px 8px 3px 22px; }
.tree li.drop-into > .node { background: #fff3cd; outline: 2px solid #f0ab00; outline-offset: -2px; }
table.alv tbody tr.sel td { background: #bcd8f2 !important; box-shadow: inset 0 1px 0 #6a9fd4, inset 0 -1px 0 #6a9fd4; }
.qrbox svg { width: 170px; height: 170px; display: block; background: #fff; }

/* ==== BEAP Corbu (ekran goruntusunden piksel olculeri, %150 olcekte; css px = fiziksel / 1.5) ==== */

/* ALV izgara */

/* liste arac dugmeleri uygulama arac cubugunda (ALV) */
.apptoolbar .alv-tools { display: inline-flex; align-items: center; gap: 1px; margin-right: 6px; }
/* BEAP Corbu ikon boyutlari ve islem kodu kutusu (bos, sagda acilir ok) */

/* BEAP Easy Access agaci (olculmus): beyaz zemin, koyu mavi Tahoma 12 px, 17 px satir, gri > oklari */

/* ==== BEAP Corbu ekran ogeleri (ZSD21000, ZSD11075, MB52, ZMM11031, ZSD11250 ekranlarindan olculdu) ==== */

/* etiket alti ince cizgi (BEAP secim ekrani) */

/* grup kutusu: beyaz zemin, basligin altinda mavi cizgi */


/* dugmeler */

/* sekmeler: etkin mavi zemin beyaz yazi, serit altinda mavi cizgi */

/* secim ekrani: Yurut dugmesi yalnizca ikon */

/* BEAP secim satiri: etiket | dusuk | son | yuksek | coklu secim kolonlari sabit (alan 33., son 52., yuksek 58. sutun) */

/* bos alan ipucu yazilari gosterilmez */

/* secim ekrani arac cubugu: yalnizca ikon */

/* BEAP Easy Access olculeri: agac yazisi 13 px, panel 340 px, basliktan sonra ikonlu arac cubugu */

/* BEAP pencere ici bosluk: baslik, arac cubugu, mavi cizgi ve icerik kenardan 20 px iceride (olculdu: 31 fiziksel px) */

/* Olculen cizgiler (tam cozunurluk): alan kenari #bfbfbf, etiket alt cizgisi #b8babb, onay kutusu #a3a3a3 */

/* agac satirlari tek satir: uzun ad alt satira tasip ustuste binmesin; panel yatay kayar */

/* BEAP ALV zebra (ZSD21820'den olculdu): satirlar #eaedf0 / #d4dfef, yazilabilir hucre beyaz, toplam satiri #fff843 */

/* BEAP siparis ekrani (ZSD21000, kullanici goruntusunden): kutu basligi normal yazi + mavi alt cizgi, zorunlu yildiz yok,
   tutar alanlari sola yasli, sag tutar paneli cercevesiz, satir basi dugmeleri beyaz kutu */

/* BEAP kalem tablosu: bos satirlar, yazilabilir hucre beyaz, diger hucre gri #eaedf0, satir 22px */

/* BEAP Odemeler sekmesi (ZSD21000, kullanici goruntusunden olculdu) */
#t_pay { background: #e5e5e5; padding: 8px 10px 12px; }
#t_pay .paysub { margin: 0 0 0 0; }

#t_pay .payhead { display: flex; align-items: center; gap: 0; margin: 16px 0 3px; min-height: 22px; }
#t_pay .payhead .sll { display: inline-flex; align-items: center; align-self: stretch; border-bottom: 1px solid #b8babb; color: #000; padding-left: 2px; }
#t_pay .payhead.paydist { margin-top: 4px; gap: 6px; flex-wrap: wrap; }
#t_pay .payhead.paydist .sll { width: auto; padding-right: 6px; }
#t_pay .paybtn { width: 103px; height: 22px; display: inline-flex; align-items: center; justify-content: space-between; padding: 0 16px 0 2px;
  background: #e2e2e2; border: 1px solid #c2c2c2; border-radius: 0; margin-left: 10px; font-size: 12px; color: #000; }
#t_pay .paygrid { max-width: 1010px; background: #fff; border: 1px solid #c8c8c8; }
#t_pay .paygrid .alv-scroll { max-height: none; }
#t_pay .paygrid table.alv { table-layout: fixed; width: 1010px; border-collapse: collapse; }
#t_pay .paygrid th { background: #e5e5e5; color: #000; font-weight: normal; height: 22px; text-align: left; padding: 0 2px; border-right: 1px solid #e5e5e5; }
#t_pay .paygrid td { height: 21px; padding: 0 2px; background: #eaedf0; border: 0; border-bottom: 1px solid #fff; border-right: 1px solid #fff;
  font-family: "Courier New", monospace; font-size: 13px; color: #000; white-space: nowrap; overflow: hidden; }
#t_pay .paygrid td.w { background: #fff; border-color: #eaedf0; }
#t_pay .paygrid td.rs, #t_pay .paygrid th.rs { background: #e5e5e5; width: 22px; border-color: #e5e5e5; text-align: center; }
#t_pay .paygrid td.gtl { text-align: left; }
#t_pay .paygrid tr.ro td { font-family: Tahoma, sans-serif; font-size: 12px; }
#t_pay .paygrid tr.newp td:not(.rs) { background: #fffbe6; }
#t_pay .paygrid input.cell { width: 100%; border: 0; background: transparent; height: 19px; padding: 0; margin: 0; outline: none;
  font-family: "Courier New", monospace; font-size: 13px; color: #000; box-sizing: border-box; }
#t_pay .paygrid input.cell:focus { background: #fff; box-shadow: inset 0 0 0 1px #007cc0; }
#t_pay .payavg { margin-top: 10px; color: #000; display: flex; gap: 14px; }
#t_pay .payhead { max-width: 1010px; }
#t_pay .payhead .inp[readonly] { background: #fff; border: 1px solid #bfbfbf; color: #36456a; height: 20px; }
#t_pay .paybtn svg { width: 16px; height: 16px; }
/* BEAP klasik liste (Teslimat Olusturma, kullanici goruntusunden olculdu): Courier, turuncu baslik #fdbb71, satir #f8e5c8, satir arasi koyu cizgi */
table.beaplist { border-collapse: collapse; background: #fff; }
table.beaplist th, table.beaplist td { font-family: "Courier New", monospace !important; font-size: 13px; color: #000; white-space: nowrap;
  padding: 0 5px; height: 24px; border: 0; }
table.beaplist thead tr.h1 th { background: #fdbb71 !important; font-weight: normal; border-bottom: 1px solid #a6e5f4; }
table.beaplist tbody tr td { background: #f8e5c8 !important; border-bottom: 1px solid #5d5d5d; height: 25px; }
table.beaplist tbody tr.nores td { color: #7a7a7a; }
/* Teslimat Ekle: secim / teslimat bilgileri satiri, musteri basliklari, stogu ayrilmamis kalemler soluk */
.dlbar { display: flex; gap: 8px 14px; align-items: center; flex-wrap: wrap; }
.dlbar .lbl { min-width: 0; }
table.alv.dlcreate tr.dlgrp td { background: #e5edf5; border-top: 1px solid #a6b2be; }
table.alv.dlcreate tr.nores td { color: #7a7a7a; }
table.beaplist td.c0, table.beaplist th.c0 { background: #fff !important; width: 18px; padding: 0 3px; text-align: center; }
table.beaplist td.c0 svg { width: 13px; height: 13px; vertical-align: middle; }
table.beaplist input.cell { width: 46px; border: 0; background: #fff; font-family: "Courier New", monospace; font-size: 13px; text-align: right; height: 19px; }
table.beaplist tbody tr:hover td:not(.c0) { background: #f3d6aa !important; }
.dlist { border: 1px solid #5d5d5d; }
.alv-wrap[data-fill] .alv-scroll { overflow: auto; }
.alv-wrap[data-fill] { background: #fff; }
/* BEAP klasik liste satiri: 24px seftali bant + gri bosluk + koyu ayirici (satir 32px) */
table.beaplist tbody tr td { height: 31px; vertical-align: top; padding-top: 4px; border-left: 0; border-right: 0;
  background: linear-gradient(#f8e5c8 0, #f8e5c8 24px, #f2f2f2 24px) !important; }
table.beaplist tbody tr td.c0 { background: linear-gradient(#fff 0, #fff 24px, #f2f2f2 24px) !important; }
table.beaplist tbody tr td input.cell { margin-top: -2px; }
table.beaplist thead tr.h1 th { border-left: 0; border-right: 0; height: 22px; }
table.beaplist thead tr.h1 { box-shadow: inset 0 -5px 0 #a6e5f4; }
table.beaplist thead tr.h1 th { padding-bottom: 5px; background: linear-gradient(#fdbb71 0, #fdbb71 22px, #a6e5f4 22px) !important; height: 27px; }
/* Siparis basligi: kutu icerigi kadar (bos alan yok), Odemeler hemen yaninda; tum degerler cerceveli kutucukta */

/* BEAP kalem tablosu solunda dikey simge seridi (sil / satir ekle) */
.itemsbox { display: flex; align-items: flex-start; gap: 0; }
.itemsbox > .alv-wrap { flex: 1; min-width: 0; }
.itemside { display: flex; flex-direction: column; gap: 2px; padding: 22px 2px 0 0; background: #e5e5e5; align-self: stretch; }
.itemside .ib { width: 24px; height: 24px; padding: 0; justify-content: center; background: #e5e5e5; border: 1px solid #c8c8c8; }
/* BEAP Musteri Durum Raporu (kullanici goruntusunden olculdu): seftali #f8e5c8 bilgi tablosu, siyah cizgiler, kalin etiket */
.csinfo { padding: 6px 0 8px 12px; }
.csinfo .cst { display: inline-block; background: #b7e7ff; color: #000; padding: 0 1px; margin-bottom: 1px; }
table.csgrid { border-collapse: collapse; background: #f8e5c8; border: 2px solid #4f556a; table-layout: fixed; }
table.csgrid th, table.csgrid td { border: 1px solid #000; height: 21px; padding: 0 3px; color: #000; white-space: nowrap; overflow: hidden;
  font-size: 13px; text-align: left; background: #f8e5c8; }
table.csgrid th { font-weight: bold; }
table.csgrid td.csblock { color: #bb0000; font-weight: bold; }
.cslist .alv-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.csviews { display: inline-flex; gap: 0; margin: 0 0 0 6px; }
.csviews label { display: inline-flex; align-items: center; gap: 3px; padding: 0 6px; border: 1px solid #c8c8c8; background: #f2f2f2; height: 20px; cursor: pointer; white-space: nowrap; }
.csviews label.on { background: #e5e5e5; border-color: #8c8c8c; }
.cslist td.rs, .cslist th.rs { background: #e5e5e5 !important; width: 18px; }
.cslist tr.cssub td { background: #fffdbf !important; font-weight: bold; }
.cslist tr.cstot td { background: #fff843 !important; font-weight: bold; }
.cslist tbody td a { color: #000; text-decoration: underline; }
/* Tum programda alan yazilari baskin siyah (kullanici istegi): soluk lacivert/gri yerine #000, Courier biraz kalin */

/* Musteri listesi: zebra (gri #eaedf0 / mavi #d4dfef), bos alanda da desen devam eder */
#cust thead th { height: 20px; box-sizing: border-box; }
#cust tbody tr td { height: 20px; box-sizing: border-box; border-color: #fff; color: #000; }
#cust tbody tr:nth-child(odd) td { background: #d4dfef; }
#cust tbody tr:nth-child(even) td { background: #eaedf0; }
#cust tbody tr.sel td { background: #9fc4ea !important; }
/* BEAP musteri listesi: tablo icerik kadar genis, bos alan duz gri, Cari Kod alti cizili, solda gri satir secici */
.alv-wrap:has(#cust) { background: #f2f2f2; border: 0; box-shadow: none; }
.alv-wrap:has(#cust) .alv-scroll { background: #f2f2f2; }
#cust { width: auto !important; min-width: 0 !important; background: #fff; }
#cust th, #cust td { white-space: nowrap; padding: 0 4px; }
#cust thead th { background: #e5e5e5; border-color: #e5e5e5 #fff #e5e5e5 #e5e5e5; }
#cust tbody td[data-ci="0"] { text-decoration: underline; color: #000; cursor: pointer; }
#cust thead tr::before, #cust tbody tr::before { content: ""; display: table-cell; width: 22px; background: #e5e5e5; border-right: 1px solid #fff; }
/* Siparis basligi hizalamasi: kod+ad bitisik, etiket alti cizgi, gri cerceveli simge dugmeleri, ad kutusu Tahoma */

/* ALV kolon tasima: surukle-birak isareti ve Duzen penceresi satirlari */
table.alv thead th[draggable="true"] { cursor: grab; }
table.alv thead th.dragging { opacity: .45; }
table.alv thead th.dropl { box-shadow: inset 3px 0 0 #007cc0; }
table.alv thead th.dropr { box-shadow: inset -3px 0 0 #007cc0; }
.lyrow { display: flex; align-items: center; gap: 4px; min-width: 320px; padding: 1px 0; border-bottom: 1px solid #eee; }
.lyrow label { flex: 1; }
.lyrow .lymv { width: 24px; height: 20px; padding: 0; font-size: 10px; line-height: 1; }

/* Tarih secici (F4 takvimi) */
.beepcal { position: absolute; z-index: 6000; background: #fff; border: 1px solid #8c8c8c; box-shadow: 0 3px 10px rgba(0,0,0,.28);
  padding: 4px; font-family: Tahoma, Verdana, sans-serif; font-size: 12px; color: #000; user-select: none; }
.beepcal .bc-h { display: flex; align-items: center; gap: 2px; background: #e5e5e5; padding: 2px; }
.beepcal .bc-t { flex: 1; text-align: center; font-weight: bold; min-width: 110px; }
.beepcal .bc-h button { width: 22px; height: 20px; padding: 0; border: 1px solid #c2c2c2; background: #f7f7f7; cursor: pointer; font-size: 12px; }
.beepcal .bc-h button:hover { background: #e5f2f9; }
.beepcal table { border-collapse: collapse; margin-top: 3px; }
.beepcal th { font-weight: normal; color: #555; width: 26px; height: 20px; text-align: center; border-bottom: 1px solid #ddd; }
.beepcal td { width: 26px; height: 22px; text-align: center; cursor: pointer; border: 1px solid transparent; }
.beepcal th.wk, .beepcal td.wk { color: #888; background: #f2f2f2; cursor: default; font-size: 11px; }
.beepcal td.oth { color: #b4b4b4; }
.beepcal td.we:not(.oth) { color: #a33; }
.beepcal td:not(.wk):hover { background: #e5f2f9; }
.beepcal td.tdy { border-color: #007cc0; font-weight: bold; }
.beepcal td.sel { background: #007cc0 !important; color: #fff !important; }
.beepcal .bc-f { display: flex; gap: 4px; justify-content: flex-end; margin-top: 4px; }
.beepcal .bc-f .btn { height: 20px; padding: 0 8px; }
input.hasdate:focus { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='2.5' width='13' height='12' fill='%23fff' stroke='%23556' /%3E%3Crect x='1.5' y='2.5' width='13' height='3' fill='%23007cc0'/%3E%3Cpath d='M4 8h2M7 8h2M10 8h2M4 11h2M7 11h2' stroke='%23556'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 3px center; background-size: 14px 14px; padding-right: 20px; }

/* bos uygulama arac cubugu gizlenir (dugmesiz ekranlarda bu serit yok) */

/* ==== ZMM11031 Bakiye Stok Raporu (ekran goruntusunden olculdu, css px) ==== */
.zmm { padding-top: 4px; }
.zmm-top { display: flex; align-items: stretch; gap: 3px; }
.zmm-sel { display: flex; gap: 0; background: #fff; width: 1080px; flex: 0 0 1080px; box-sizing: border-box; padding: 22px 0 2px 20px; }
.zmm-rows { flex: 0 0 718px; }
.zmm-rows .sr.selrow { min-height: 22px; margin: 0; }
.zmm-rows .inp.zmm-wide { width: 396px; grid-column: 2 / span 4; }
.zmm-rows .inp.zmm-sepet { width: 353px; grid-column: 2 / span 4; }
.zmm-chk { display: flex; flex-direction: column; padding-left: 12px; }
.zmm-chk label.chk { height: 22.6px; display: flex; align-items: center; gap: 2px; white-space: nowrap; color: #000; }
.zmm-chk input[type=checkbox] { margin: 0 3px 0 0; }
.zmm-basket { flex: 1 1 auto; min-width: 360px; background: #f2f2f2; display: flex; }
.zmm-bgrid { flex: 1; overflow: auto; background: #f2f2f2; border: 1px solid #e5e5e5; max-height: 248px; }
.zmm-bgrid table.alv { width: 100%; background: transparent; }
.zmm-bgrid th { background: #e5e5e5 !important; font-weight: normal; text-align: left; height: 20px; }
.zmm-bgrid th.rs, .zmm-bgrid td.rs { width: 18px; background: #e5e5e5 !important; }
.zmm-bgrid td { background: #fff; height: 20px; }
.zmm-bgrid input.cell { width: 48px; border: 0; background: transparent; text-align: right; font-family: "Courier New", monospace; font-size: 13px; }
.zmm-btns { display: flex; justify-content: space-between; margin: 3px 0 8px; }
.zmm-bl { display: flex; gap: 27px; }
.zmm-br { display: flex; gap: 10px; margin-right: 52px; }
.beapbtn { display: inline-flex; align-items: center; height: 22px; min-width: 111px; box-sizing: border-box; padding: 0 6px 0 3px;
  background: linear-gradient(#f9f9f9, #ececec); border: 1px solid #bfbfbf; border-radius: 0; color: #000 !important; text-decoration: none !important;
  font-family: Tahoma, Verdana, sans-serif; font-size: 12px; cursor: pointer; }
.beapbtn:hover { background: linear-gradient(#ffffff, #e2eef8); border-color: #8fb3d6; }
.beapbtn:disabled { opacity: .55; cursor: default; }
.beapbtn svg { width: 16px; height: 16px; flex: 0 0 16px; }
.beapbtn span { flex: 1; text-align: center; padding-left: 6px; }
.beapbtn.wide { min-width: 147px; } .beapbtn.xwide { min-width: 215px; }
.zmm .alv-wrap { margin-top: 2px; }

/* ALV kolon genisligi: baslik sag kenari tutamac, sabit genislik duzeni */
table.alv thead th .colrs { position: absolute; top: 0; right: 0; width: 6px; height: 100%; cursor: col-resize; z-index: 3; }
table.alv thead th .colrs:hover { background: rgba(0,124,192,.35); }
body.colresizing, body.colresizing * { cursor: col-resize !important; user-select: none !important; }
table.alv.fixedcols th, table.alv.fixedcols td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lyrow .lyw { width: 58px; height: 18px; padding: 0 2px; text-align: right; }

/* ==== ZSD21000 siparis ekrani: konum ve olculer ekrandan olculmustur (css px) ==== */
.zsd { position: relative; width: 1660px; height: 340px; margin: 0 0 0 5px; }
.zsd .zbox { position: absolute; background: #fff; box-sizing: border-box; }
.zsd .zbt { position: absolute; left: 2px; right: 2px; top: 0; height: 16px; line-height: 15px; border-bottom: 1px solid #007cc0;
  padding-left: 6px; color: #000; font-size: 12px; white-space: nowrap; overflow: hidden; }
.zsd .zl { position: absolute; height: 21px; line-height: 20px; box-sizing: border-box; border-bottom: 1px solid #b8babb; color: #000;
  white-space: nowrap; overflow: hidden; padding-left: 1px; font-size: 12px; }
.zsd .zf { position: absolute; height: 21px; box-sizing: border-box; margin: 0; padding: 0 3px; }

.zsd .zt { position: absolute; height: 21px; line-height: 21px; padding-left: 3px; font-family: "Courier New", monospace; font-size: 13px; color: #000; }
.zsd .zb { position: absolute; width: 25px; height: 22px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  background: #f6f6f6; border: 1px solid #c9c9c9; border-bottom-color: #a3a3a3; box-shadow: inset 0 0 0 1px #e2e2e2; padding: 0; cursor: pointer; }
.zsd .zb svg { width: 14px; height: 14px; }
.zsd .zr { position: absolute; height: 21px; display: flex; align-items: center; gap: 4px; white-space: nowrap; color: #000; }
.zsd .zc { position: absolute; margin: 0; width: 15px; height: 15px; }
.zsd .zbtn { position: absolute; height: 22px; box-sizing: border-box; background: #e2e2e2; border: 1px solid #c2c2c2; border-radius: 0;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; color: #000; padding: 0 6px; cursor: pointer; }
.zsd .zbtn:hover:not(:disabled) { background: #d6e7f5; border-color: #8fb3d6; }
.zsd .zbtn:disabled { color: #8c8c8c; cursor: default; } .zsd .zbtn svg { width: 14px; height: 14px; }
.zsdtabs { margin-left: 10px !important; }
/* kalem tablosu (tablo kontrolu) */
#t_items { padding: 22px 0 0 9px; box-sizing: border-box; width: 1551px; }
.zitems { align-items: flex-start; }
.zitems .itemside { width: 25px; padding: 0; gap: 1px; background: transparent; }
.zitems .itemside .ib { width: 25px; height: 22px; background: #f6f6f6; border: 1px solid #c9c9c9; border-bottom-color: #a3a3a3; }
.zitems .alv-wrap { border: 0; box-shadow: none; }
.zitems .alv-scroll { width: 1508px; height: 383px; max-height: none; overflow: auto; background: #e5e5e5; }
#items { table-layout: fixed; width: 3978px; border-collapse: collapse; }

#items input.cell, #items select.cell { width: 100%; height: 20px; border: 0; background: transparent; margin: 0; padding: 0 1px; box-sizing: border-box;
  font-family: "Courier New", monospace; font-size: 13px; color: #000; outline: none; text-align: left; }
#items select.cell { font-family: Tahoma, Verdana, sans-serif; font-size: 12px; }
#items input.cell:focus, #items select.cell:focus { box-shadow: inset 0 0 0 1px #007cc0; background: #fff; }

/* oneri listeli (datalist) kod alanlari: tarayici oku gizli */
input[list]::-webkit-calendar-picker-indicator { display: none !important; }
/* kalem tablosundaki secim kutulari oksuz; tiklayinca liste acilir */
#items select.cell { appearance: none; -webkit-appearance: none; background-image: none; cursor: pointer; }
/* kalem satirlari hizali: butun hucreler ayni yazi tipi ve yukseklikte; sayilar (yazilabilir kutulardakiler de) saga yasli */
#items tbody td { height: 22px; padding: 0 4px; box-sizing: border-box; font-family: "Courier New", monospace; font-size: 13px; vertical-align: middle; }
#items tbody td.w, #items tbody td.rs { padding: 0; }
#items tbody td.rs { text-align: center; }
#items input.cell, #items select.cell { height: 21px; padding: 0 4px; font-family: "Courier New", monospace; font-size: 13px; }
#items input.cell.num { text-align: right; }

/* Kaydet: etkinken mavi disket; pasifse ya da son kontrolde hata varsa gri */
.ib[disabled] svg, .ib.err svg { filter: grayscale(1); }
.ib.err svg { opacity: .45; }
/* BEAP penceresi (BEEP.exe --pencere): Windows baslik cubugu yok, menu cubugu pencere cubugudur */
.winctl { display: none; align-self: stretch; margin-left: 12px; }
html.inhost .winctl { display: flex; }
html.inhost .menubar { padding-right: 0; user-select: none; }
.winctl button { width: 42px; border: 0; padding: 0; background: transparent; color: #333; display: inline-flex; align-items: center; justify-content: center; cursor: default; }
.winctl button:hover { background: rgba(0, 0, 0, .08); }
.winctl button.wx:hover { background: #c42b1c; color: #fff; }
.winctl svg { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1; shape-rendering: crispEdges; }
.winctl .wres, html.winmax .winctl .wmax { display: none; }
html.winmax .winctl .wres { display: block; }

/* ===== BEAP gorunumu (tek tema; eskiden secilebilen "Klasik"): yukaridaki temel kurallarin uzerine renk ve cizgiler ===== */
:root { --bg: #d5dbe1; --panel: #e9edf1; --text: #000000; --muted: #3d4a57; --line: #a6b2be; --line-dark: #6e7c8a;
  --accent: #21456b; --accent-soft: #ffffff; --field-ro: #dfe4e9; --row-alt: #eef1f4; --row-sel: #9fb6cf; --focus: #21456b; }
body { background: #d5dbe1; color: #000000; }
a { color: #21456b; }
.menubar { background: linear-gradient(#e3e8ed, #b9c5d1); border-bottom-color: #a6b2be; color: #000000; }
.menubar .brand { color: #000000; }
.menubar .m:hover, .menubar .m.open, .menubar .dd a:hover, .ctxmenu a:hover { background: #d3dbe3; }
.menubar .dd, .ctxmenu { background: #e9edf1; border-color: #6e7c8a; }
.menubar .dd a, .ctxmenu a { color: #000000; }
.systoolbar { background: linear-gradient(#e3e8ed, #b9c5d1); border-bottom-color: #a6b2be; }
.titlebar { background: #e3e8ed; color: #000000; border-bottom-color: #a6b2be; }
.apptoolbar { background: linear-gradient(#e3e8ed, #b9c5d1); border-bottom-color: #a6b2be; }
.workarea, .ea-main { background: #d5dbe1; }
.ib { color: #000000; }
.ib:hover:not([disabled]), .ib.on { background: linear-gradient(#ffffff, #d3dbe3); border-color: #6e7c8a; }
.inp, select.inp, textarea.inp, .ea-search input { background: #ffffff; color: #000000; border-color: #5f6d7b; border-radius: 0; box-shadow: none; }
.inp[readonly], .inp:disabled { background: #dfe4e9; color: #000000; border-color: #a6b2be; }
.inp:focus, .ea-search input:focus { border-color: #21456b; box-shadow: 0 0 0 1px #21456b; background: #ffffff; }
.btn { background: linear-gradient(#f4f6f8, #c3ccd5); border-color: #6e7c8a; color: #000000; border-radius: 0; }
.btn:hover { background: linear-gradient(#ffffff, #d3dbe3); border-color: #6e7c8a; }
.btn.primary { background: #21456b; border-color: #21456b; color: #ffffff; }
.btn.beapyel { background: linear-gradient(#ffffff, #d3dbe3); border-color: #6e7c8a; color: #000000; }
.group, .sg, .sbox, .card, .chart, .alv-wrap, .tabpane, .ea-nav, .beapbar, .tree { background: #e9edf1; border-color: #a6b2be; }
.group > .gt, .sboxt, .chart-h, .alv-bar, .ea-search { background: linear-gradient(#e6ebf0, #c2ccd6); color: #000000; border-color: #a6b2be; }
.sgt { color: #000000; border-bottom-color: #6e7c8a; }
.lbl, .sl, .sl2, .sll, .son, .sol, .sol2 { color: #000000; }
.hint, .card-l, .card-s, .sgx { color: #3d4a57; }
.card-v, .dash-h h1 { color: #000000; }
.tabs { border-bottom-color: #6e7c8a; }
.tabs button, .subtabs button { background: linear-gradient(#e3e8ed, #c2ccd6); border-color: #a6b2be; color: #000000; border-radius: 0 0 0 0; }
.tabs button.act, .subtabs button.act { background: #e9edf1; border-color: #6e7c8a; color: #000000; box-shadow: inset 0 3px 0 #6e7c8a; }
table.alv th { background: linear-gradient(#e6ebf0, #c2ccd6); color: #000000; border-color: #a6b2be; }
table.alv td { border-color: #a6b2be; }
table.alv tbody tr:nth-child(even) { background: #eef1f4; }
table.alv tbody tr:hover { background: #ffffff; }
table.alv tbody tr.sel { background: #9fb6cf; }
.tree .node:hover { background: #ffffff; } .tree .node.sel { background: #9fb6cf; }
.tree .node.folder { color: #000000; } .tree .code { color: #21456b; }
.statusbar { background: linear-gradient(#e3e8ed, #b9c5d1); border-top-color: #a6b2be; color: #000000; }
.statusbar .cell { color: #3d4a57; border-left-color: #a6b2be; }
.modal { background: #e9edf1; color: #000000; border-color: #6e7c8a; }
.modal .mh { background: #3a5068; }
body.logon { background: linear-gradient(170deg, #3a5068 0%, #d5dbe1 100%); }
.logon-box { background: #e9edf1; color: #000000; }
.logon-head { background: #3a5068; }
/* Acilir liste (secim kutulari ve oneri listeleri): tarayicinin acilir penceresi yerine */
.beepdrop { position: absolute; z-index: 6000; background: #fff; border: 1px solid #8c8c8c; box-shadow: 0 3px 10px rgba(0,0,0,.28);
  max-height: 320px; overflow-y: auto; font: inherit; color: #000; user-select: none; box-sizing: border-box; padding: 1px 0; }
.beepdrop .bd-i { padding: 0 8px; white-space: nowrap; cursor: pointer; line-height: 20px; min-height: 20px; }
.beepdrop .bd-i b { display: inline-block; min-width: 56px; margin-right: 10px; font-weight: normal; font-family: "Courier New", monospace; }
.beepdrop .bd-i:hover { background: #e5f2f9; }
.beepdrop .bd-i.cur { background: #007cc0; color: #fff; }
.beepdrop .bd-i.dis { color: #9a9a9a; cursor: default; background: none; }
/* BEAP penceresi: F4 arama yardimi ve siparisten acilan ekranlar ayri tarayici penceresi yerine BEAP icinde */
#beepwin { z-index: 250; padding-top: 3vh; }
.modal.win { max-width: none; max-height: none; min-width: 0; overflow: hidden; }
.modal.win .winframe { flex: 1; width: 100%; border: 0; background: #e9edf1; }
html.inframe .menubar, html.inframe .systoolbar, html.inframe .titlebar { display: none !important; }
/* Buyuk simgeler: ust arac cubuklari, liste dugmeleri ve menu agaci (yukaridaki olculerin yerine) */
.systoolbar { height: 38px; gap: 2px; padding: 0 6px; }
.systoolbar .ib { min-width: 32px; height: 32px; }
.systoolbar .ib svg { width: 24px; height: 24px; }
.systoolbar .sep { height: 24px; margin: 0 5px; }
.apptoolbar { min-height: 36px; padding: 2px 6px; }
.apptoolbar .ib { height: 32px; gap: 6px; padding: 0 8px; }
.apptoolbar .ib svg { width: 22px; height: 22px; }
.alv-bar .ib { min-width: 28px; height: 28px; }
.alv-bar .ib svg, .apptoolbar .alv-tools .ib svg { width: 20px; height: 20px; }
.workarea .tree .node svg { width: 20px; height: 20px; }
.statusbar { height: 26px; }
.statusbar .msg svg { width: 18px; height: 18px; }
/* durum cubugunun sag kosesinde acik ekranin kodu */
.statusbar .sbcode { margin-left: auto; padding: 0 12px; color: #6a6d70; font-size: 11px; white-space: nowrap; }
/* Roller ve yetkiler: menu klasorlerine gore ekranlar, altinda ekranin islemleri */
.rolegrid { display: flex; flex-wrap: wrap; gap: 6px 28px; margin-top: 8px; }
.rolef { min-width: 300px; }
.roleft { font-weight: bold; border-bottom: 1px solid #b8babb; margin: 4px 0 3px; padding-bottom: 2px; }
.rolef label.chk { display: flex; align-items: center; gap: 4px; margin: 2px 0; }
.rolef label.rolesub { margin-left: 22px; color: #333; }
/* ana menu klasor renkleri: Satış mavi, Stok yesil, Ana Veri turuncu, Sistem gri, kullanicinin klasorleri mor */
.tree .node.folder svg { color: #e8a317; }
.tree li.f-sat > .node.folder svg { color: #3b82c4; }
.tree li.f-stk > .node.folder svg { color: #3f9b4f; }
.tree li.f-rap > .node.folder svg { color: #0e9a9a; }
.tree li.f-ana > .node.folder svg { color: #e8890c; }
.tree li.f-sys > .node.folder svg { color: #7b8794; }
.tree li.f-own > .node.folder svg { color: #8b5cc4; }
/* ana menu: buyuk ve belirgin simgeler (kullanici istegi 2026-10-07): islem simgesi beyaz kutuda 26 px, klasor 30 px, yazi 13 pt */
.workarea .tree { font-size: 13pt; }
.workarea .tree .node { padding: 3px 8px; gap: 10px; }
.workarea .tree .node.tx svg { width: 26px; height: 26px; padding: 4px; box-sizing: content-box; background: #ffffff; border: 1px solid #c3ccd6; border-radius: 7px; box-shadow: 0 1px 2px rgba(0, 0, 0, .14); }
.workarea .tree .node.folder svg { width: 30px; height: 30px; }
.workarea .tree .node.folder { font-size: 13.5pt; }
.workarea .tree .tw { font-size: 14px; width: 14px; }
/* durum cubugunun sol kosesinde tarih ve saat */
.statusbar .sbclock { display: flex; align-items: center; align-self: stretch; padding: 0 12px; border-right: 1px solid #c4cbd1; color: #33414e; font-size: 11px; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* dugmelerdeki klasor simgesi (Klasör ekle) sari */
.ib svg[fill="currentColor"] { color: #e8a317; }
/* Malzeme karti: solda urun bilgileri, sagda fiyat ve barkod; ayrintilar sekmelerde */
.matcard { display: flex; gap: 10px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 8px; }
.matcard .group { margin-bottom: 0; }
.matmain { flex: 0 1 auto; min-width: 540px; }
.matside { flex: 0 1 470px; min-width: 420px; display: flex; flex-direction: column; gap: 10px; }
.matcard .lbl { min-width: 150px; }
.matcode { font-weight: bold; }
.matcard input#code { text-transform: uppercase; }
.matauto { display: flex; margin: 0 0 6px; }
.matcodeline { display: inline-flex; align-items: center; gap: 6px; }
.grscan #scan { font-size: 14px; height: 24px; }
.matbcerr { color: #bb0000; margin: 0 0 6px; }
table.alv.matbc { width: auto; min-width: 0; }
table.alv.matbc td.w { padding: 1px 2px; }
.matbcview { margin-top: 8px; width: 230px; background: #fff; padding: 4px 6px; border: 1px solid #c8ced4; }
.matbcview svg { display: block; width: 100%; height: auto; }
.matbcview .bn { font-weight: bold; font-size: 12px; line-height: 1.2; margin-bottom: 2px; overflow-wrap: anywhere; }
/* Barkod ayarlari */
.bcopt { display: flex; margin: 4px 0 10px; }
.bcdemo { margin: 0 0 14px 22px; }
.bcdemo-t { margin-bottom: 6px; }
.bcdemo-l { width: 58mm; background: #fff; border: 1px dashed #9aa5b1; padding: 2mm; box-sizing: border-box; font-family: Arial, Helvetica, sans-serif; font-size: 9pt; }
.bcdemo-l svg { display: block; width: 100%; height: auto; margin-top: 1mm; }
/* Barkod etiketi ekrani: urun listesi + secenekler, altta etiketlerin gercek boyutta onizlemesi */
.lbtop { display: flex; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.lbtop .group { margin-bottom: 6px; }
.lbitems { flex: 1 1 680px; min-width: 520px; }
.lbopts { flex: 0 0 auto; min-width: 320px; }
.lbopts .lbl { min-width: 60px; }
.lbadd { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.lbadd .lbl { min-width: 0; padding-right: 0; }
.lbadd .lbl + .inp { margin-right: 2px; }
table.alv.lbtab { width: 100%; }
table.alv.lbtab td.w { padding: 0 2px; }
.lbtab .lbmiss { color: #bb0000; }
.lbtab .lbnew { font-style: normal; color: #2e6b35; font-size: 11px; margin-left: 6px; }
.lbprev { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; padding: 10px; background: #fff; border: 1px solid #a6b2be; }
.lbprev:empty { display: none; }
.lbprev .label { box-sizing: border-box; background: #fff; border: 1px dashed #9aa5b1; overflow: hidden; display: flex; flex-direction: column;
  color: #000; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; padding: 1.5mm 2mm; break-inside: avoid; }
.lbprev .ln { flex: 0 0 auto; font-weight: bold; line-height: 1.15; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.lbprev .lbc { flex: 1 1 auto; min-height: 0; display: flex; align-items: center; justify-content: center; padding: .6mm 0 .3mm; }
.lbprev .lbc svg { display: block; width: 100%; height: 100%; }
.lbprev .lf { flex: 0 0 auto; display: flex; justify-content: space-between; align-items: flex-end; gap: 2mm; line-height: 1.1; }
.lbprev .lc { color: #222; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.lbprev .lp { font-weight: bold; white-space: nowrap; }
.lbprev.size-S .label { width: 40mm; height: 25mm; padding: 1mm 1.5mm; }
.lbprev.size-S .ln { font-size: 6.5pt; } .lbprev.size-S .lc { font-size: 5.5pt; } .lbprev.size-S .lp { font-size: 9pt; }
.lbprev.size-K .label { width: 50mm; height: 30mm; }
.lbprev.size-K .ln { font-size: 7.5pt; } .lbprev.size-K .lc { font-size: 6pt; } .lbprev.size-K .lp { font-size: 11pt; }
.lbprev.size-M .label { width: 58mm; height: 40mm; }
.lbprev.size-M .ln { font-size: 9pt; } .lbprev.size-M .lc { font-size: 6.5pt; } .lbprev.size-M .lp { font-size: 14pt; }
.lbprev.size-L .label { width: 100mm; height: 50mm; padding: 2.5mm 4mm; }
.lbprev.size-L .ln { font-size: 13pt; } .lbprev.size-L .lc { font-size: 8.5pt; } .lbprev.size-L .lp { font-size: 22pt; }
.lbprev.size-A4 .label { width: 70mm; height: 37mm; padding: 2mm 3mm; }
.lbprev.size-A4 .ln { font-size: 9pt; } .lbprev.size-A4 .lc { font-size: 6.5pt; } .lbprev.size-A4 .lp { font-size: 14pt; }
@media print {
  .noprint, body:has(.lbprev) .titlebar { display: none !important; }
  html:has(.lbprev), body:has(.lbprev), body:has(.lbprev) .workarea { background: #fff !important; overflow: visible !important; height: auto !important; margin: 0 !important; padding: 0 !important; }
  .lbprev { display: block; padding: 0; border: 0; background: none; }
  .lbprev .label { border: 0; margin: 0; break-after: page; page-break-after: always; }
  .lbprev .label:last-child { break-after: auto; page-break-after: auto; }
  .lbprev.size-A4 { display: grid; grid-template-columns: repeat(3, 70mm); justify-content: center; }
  .lbprev.size-A4 .label { break-after: auto; page-break-after: auto; }
}

/* 0.5.9: arama yardimi olan alanin yanindaki dugme (beep.js koyar) ve secim ekranindaki acilir listeler */
.ib.f4b { min-width: 22px; height: 22px; padding: 0 2px; margin-left: 3px; vertical-align: middle; border-color: #b8c7d6; background: #f4f7fa; }
.ib.f4b svg { width: 16px; height: 16px; }
.selrow select.inp { min-width: 220px; }
.colpick { display: flex; flex-wrap: wrap; gap: 6px; max-width: 560px; }
/* 0.5.9: musteri iadesi */
.retcust { margin-left: 10px; padding: 3px 10px; background: #dcebfa; border: 1px solid #9fc3e6; border-radius: 3px; }
.retcode { color: #4a5a6a; font-size: 11px; margin-left: 6px; }
.retmore { padding: 6px 10px; }
.retcols { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-start; }
.retcols > .group { flex: 1 1 420px; }
.retmode { display: flex; margin: 4px 0; font-size: 13px; }
.rettotal { margin-top: 10px; padding: 8px 10px; background: #fff8d6; border: 1px solid #e3cf7a; font-size: 15px; }
table.rett tbody tr { cursor: pointer; }
table.rett tbody tr.sel td { background: #dcf0d8 !important; }
/* 0.6.1: Google ile urun arama sonucu (cevap metni oldugu gibi, kaynaklar, Google arama onerileri) */
/* 0.6.2: siparis Odemeler sekmesi (odeme sekli dugmeleri, kisa formlar, senetli satis onizlemesi, tek odeme listesi) */
.payentry { background: #fff; border: 1px solid #c4cbd1; padding: 8px 10px; margin-bottom: 8px; }
.paykinds { display: flex; gap: 6px; align-items: center; margin-bottom: 8px; flex-wrap: wrap; }
.paykinds button { padding: 6px 16px; border: 1px solid #9fb3c8; background: #eef3f8; border-radius: 3px; cursor: pointer; font: inherit; font-weight: 600; }
.paykinds button.act { background: #21456b; border-color: #21456b; color: #fff; }
.payrest { margin-left: auto; padding: 4px 10px; background: #fff8d6; border: 1px solid #e3cf7a; font-size: 14px; }
.payform { display: flex; gap: 8px 10px; align-items: center; flex-wrap: wrap; }
.payform .lbl { min-width: 0; }
.senetform { flex-direction: column; align-items: flex-start; }
.senetform .senrow { display: flex; gap: 8px 10px; align-items: center; flex-wrap: wrap; }
.sncnts { display: inline-flex; gap: 3px; }
.sncnts .btn { min-width: 34px; padding: 2px 6px; }
table.snprev { min-width: 360px; }
table.paylist { width: 100%; }
table.paylist tr.newp td { background: #eef7e9 !important; }
/* 0.6.3: yedek uyarisi */
.bkwarn { color: #a40000; font-weight: bold; }
/* ===== 0.6.3: BEAP canli bilesenler (Fluent 2 tasarim degerleri: tasarim/tema-kutuphaneleri/fluentui-tokens, webLightTheme) =====
   Yeni ekranlar (senetli satis, senet takibi, odemeler, iadeler, urun arama, yedekleme) bunlari kullanir; eski ekranlarin gorunusu degismez. */
:root {
  --fl-brand: #0f6cbd; --fl-brand-hover: #115ea3; --fl-brand-pressed: #0c3b5e; --fl-brand-bg2: #ebf3fc;
  --fl-n1: #ffffff; --fl-n2: #fafafa; --fl-n3: #f5f5f5; --fl-stroke1: #d1d1d1; --fl-stroke2: #e0e0e0;
  --fl-fg1: #242424; --fl-fg2: #424242; --fl-fg3: #616161;
  --fl-ok-bg: #f1faf1; --fl-ok-fg: #0e700e; --fl-ok-bd: #9fd89f;
  --fl-warn-bg: #fff9f5; --fl-warn-fg: #bc4b09; --fl-warn-bd: #fdcfb4;
  --fl-bad-bg: #fdf3f4; --fl-bad-fg: #b10e1c; --fl-bad-bd: #eeacb2;
  --fl-teal-bg: #e6f4f4; --fl-teal-fg: #02494c; --fl-purple-bg: #f2edf8; --fl-purple-fg: #341a51;
  --fl-shadow2: 0 0 2px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.14);
  --fl-shadow4: 0 0 2px rgba(0,0,0,.12), 0 2px 4px rgba(0,0,0,.14);
  --fl-shadow8: 0 0 2px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.14);
  --fl-r4: 4px; --fl-r6: 6px; --fl-r8: 8px; --fl-ease: cubic-bezier(.33,0,.67,1);
}
.bp-card { background: var(--fl-n1); border: 1px solid var(--fl-stroke2); border-radius: var(--fl-r8); box-shadow: var(--fl-shadow2); padding: 12px 14px; }
.bp-card-h { display: flex; align-items: center; gap: 8px; margin: -2px 0 10px; font-size: 14px; color: var(--fl-fg1); }
.bp-card-h svg { width: 22px; height: 22px; flex: none; }
.bp-card-h > .btn, .bp-card-h > .bp-pill { margin-left: auto; }
.bp-card-h > .bp-pill + .btn { margin-left: 8px; }
.bp-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 16px; border: 1px solid var(--fl-brand); border-radius: var(--fl-r4);
          background: var(--fl-brand); color: #fff; font: inherit; font-weight: 600; cursor: pointer; box-shadow: var(--fl-shadow2);
          transition: background .2s var(--fl-ease), box-shadow .2s var(--fl-ease); }
.bp-btn:hover { background: var(--fl-brand-hover); box-shadow: var(--fl-shadow4); }
.bp-btn:active { background: var(--fl-brand-pressed); }
.bp-btn svg { width: 18px; height: 18px; }
.bp-btn svg path { fill: #fff; }
.bp-chip { min-width: 34px; padding: 3px 10px; border: 1px solid var(--fl-stroke1); border-radius: 999px; background: var(--fl-n1); color: var(--fl-fg2);
           font: inherit; cursor: pointer; transition: all .15s var(--fl-ease); }
.bp-chip:hover { border-color: var(--fl-brand); color: var(--fl-brand); }
.bp-chip.act { background: var(--fl-brand); border-color: var(--fl-brand); color: #fff; }
#beeplock { position: fixed; inset: 0; z-index: 9000; background: #d5dbe1; display: flex; align-items: center; justify-content: center; }
#beeplock[hidden] { display: none; }
#beeplock .lk-card { background: #fff; border: 1px solid #b9c3cd; border-radius: 10px; box-shadow: 0 12px 40px rgba(0, 0, 0, .18); padding: 26px 34px 18px;
  width: 340px; text-align: center; }
#beeplock .lk-t { font-size: 18px; font-weight: 700; color: #0d3159; margin-top: 8px; }
#beeplock .lk-u { color: #44515e; margin: 4px 0 16px; }
#beeplock #lk-form { display: flex; gap: 8px; justify-content: center; }
#beeplock #lk-pw { width: 190px; }
#beeplock .lk-err { min-height: 18px; color: #b00020; margin: 8px 0 4px; }
#beeplock .lk-sw { background: none; border: 0; color: #0f6cbd; cursor: pointer; text-decoration: underline; font: inherit; padding: 4px; }
.bp-pill { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; border: 1px solid transparent; white-space: nowrap; }
.bp-pill.ok { background: var(--fl-ok-bg); color: var(--fl-ok-fg); border-color: var(--fl-ok-bd); }
.bp-pill.bad { background: var(--fl-bad-bg); color: var(--fl-bad-fg); border-color: var(--fl-bad-bd); }
.bp-pill.warn { background: var(--fl-warn-bg); color: var(--fl-warn-fg); border-color: var(--fl-warn-bd); }
.bp-pill.info { background: var(--fl-brand-bg2); color: var(--fl-brand); border-color: #b4d6fa; }
.bp-pill.mute { background: var(--fl-n3); color: var(--fl-fg3); border-color: var(--fl-stroke2); }
.bp-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin-bottom: 10px; }
.bp-kpi { display: flex; gap: 12px; align-items: center; background: var(--fl-n1); border: 1px solid var(--fl-stroke2); border-radius: var(--fl-r8);
          box-shadow: var(--fl-shadow2); padding: 10px 14px; text-decoration: none; color: var(--fl-fg1); border-left: 4px solid var(--fl-brand);
          transition: box-shadow .2s var(--fl-ease), transform .2s var(--fl-ease); }
a.bp-kpi:hover { box-shadow: var(--fl-shadow8); transform: translateY(-1px); text-decoration: none; }
.bp-kpi svg { width: 30px; height: 30px; flex: none; }
.bp-kpi .k { font-size: 12px; color: var(--fl-fg3); }
.bp-kpi .v { font-size: 20px; font-weight: 700; line-height: 1.2; }
.bp-kpi .s { font-size: 12px; color: var(--fl-fg2); overflow-wrap: anywhere; }
.bp-kpi > div { min-width: 0; }
.bp-kpi.bad { border-left-color: #c50f1f; } .bp-kpi.bad .v { color: var(--fl-bad-fg); }
.bp-kpi.warn { border-left-color: #f7630c; } .bp-kpi.ok { border-left-color: #107c10; } .bp-kpi.teal { border-left-color: #038387; }
.bp-kpi.act { background: var(--fl-brand-bg2); }
/* senetli satis paneli */
.snwrap { display: grid; grid-template-columns: minmax(380px, 470px) minmax(420px, 1fr); gap: 12px; width: 100%; align-items: start; }
.snf { display: grid; grid-template-columns: 140px 1fr; align-items: center; gap: 8px; min-height: 30px; }
.snin { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.snsub { color: var(--fl-fg3); font-size: 12px; }
input.snbig { font-size: 16px; font-weight: 700; color: var(--fl-brand); }
.snscroll { max-height: 282px; overflow: auto; border: 1px solid var(--fl-stroke2); border-radius: var(--fl-r4); }
table.snprev { width: 100%; }
table.snprev td.c { text-align: center; color: var(--fl-fg3); }
.snact { display: flex; justify-content: flex-end; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--fl-stroke2); }
.payacts { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.payacts .btn { display: inline-flex; align-items: center; gap: 5px; }
.payacts .btn svg { width: 16px; height: 16px; }
.paykinds button { border-radius: var(--fl-r4); transition: all .15s var(--fl-ease); }
.paykinds button:hover:not(.act) { border-color: var(--fl-brand); color: var(--fl-brand); background: var(--fl-n1); }
.paykinds button.act { background: var(--fl-brand); border-color: var(--fl-brand); box-shadow: var(--fl-shadow2); }
.payentry { border-radius: var(--fl-r8); box-shadow: var(--fl-shadow2); border-color: var(--fl-stroke2); }
.payrest { border-radius: var(--fl-r6); }
/* yeni ekranlarda gruplar kart gibi */
.bp-screen .group { border-radius: var(--fl-r8); box-shadow: var(--fl-shadow2); border-color: var(--fl-stroke2); background: var(--fl-n1); }
.bp-screen .group > .gt { background: linear-gradient(#ffffff, #f3f7fb); color: var(--fl-fg1); border-bottom-color: var(--fl-stroke2);
                          border-radius: var(--fl-r8) var(--fl-r8) 0 0; font-weight: 600; }
.bp-screen .alv-wrap { border-radius: var(--fl-r6); box-shadow: var(--fl-shadow2); }
.bp-screen .btn.primary { background: var(--fl-brand); border-color: var(--fl-brand); border-radius: var(--fl-r4); box-shadow: var(--fl-shadow2); }
.bp-screen .btn.primary:hover { background: var(--fl-brand-hover); }
.bp-row-late td { background: #fff4f4 !important; }
.bp-row-paid td { color: var(--fl-fg3); }
.bp-modal .mb .form { min-width: 420px; }
/* kasa raporu: sayim tablolari ve kapanis formu */
.kscount { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
.kstab { border-collapse: collapse; min-width: 300px; }
.kstab th { text-align: left; font-weight: normal; color: var(--fl-fg2); padding: 4px 14px 4px 0; }
.kstab td { padding: 4px 0; font-variant-numeric: tabular-nums; }
.kstab tr.tot th, .kstab tr.tot td { font-weight: 700; color: var(--fl-fg1); border-top: 1px solid var(--fl-stroke1); padding-top: 6px; }
.ksform { min-width: 420px; border-left: 3px solid var(--fl-brand); padding-left: 14px; }
.ksinfo { display: flex; flex-direction: column; gap: 8px; align-self: center; }
.ksinfo .btn { display: inline-flex; align-items: center; gap: 5px; }
.ksinfo .btn svg { width: 16px; height: 16px; }
.ksrev { display: inline; margin-left: 8px; } .ksrev .btn { height: 20px; padding: 0 8px; }
.ksk { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.snwa { height: 20px; padding: 0 8px; background: #e7f6ec; border-color: #25a244; color: #12702c; }
.snwa:hover { background: #d3f0dc; }
.snrem { color: var(--fl-fg3); font-size: 11px; margin-left: 4px; }
/* sistem durumu */
.sysgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 0 12px; }
.sysrow { padding: 3px 0; border-bottom: 1px solid var(--fl-stroke2); overflow-wrap: anywhere; }
.sysrow:last-child { border-bottom: 0; }
.sysprob > div { padding: 3px 0; }
/* canli ekranlarda secim panelleri de kart */
.bp-screen .sg, .bp-screen .sbox { background: var(--fl-n1); border-color: var(--fl-stroke2); border-radius: var(--fl-r8); box-shadow: var(--fl-shadow2); }
.bp-screen .sbox > .sboxt { border-radius: var(--fl-r8) var(--fl-r8) 0 0; background: linear-gradient(#ffffff, #f3f7fb); }
.bp-screen .sgt { border-bottom-color: var(--fl-brand); }
/* teklif ekrani */
.qtgrid { display: grid; grid-template-columns: minmax(560px, 760px) minmax(280px, 340px); gap: 12px; align-items: start; }
.qttot .kstab { width: 100%; }
.qttot .kstab tr.tot td { color: var(--fl-brand); font-size: 15px; }
table.alv.qtitems { min-width: 980px; margin-top: 4px; }
table.alv.qtitems td { padding: 2px 4px; }
/* satis analizi */
.anchart { max-width: 760px; margin-bottom: 10px; }
.anbar { display: inline-block; width: 60px; height: 8px; margin-right: 6px; vertical-align: middle; background: var(--fl-n3); border-radius: 4px; overflow: hidden; }
.anbar i { display: block; height: 100%; background: linear-gradient(90deg, #2b88d8, #0f6cbd); }
.anbar.wide { display: block; width: 100%; margin: 6px 0 0; }
/* servis kaydi */
.svgrid { display: grid; grid-template-columns: minmax(620px, 800px) minmax(300px, 380px); gap: 12px; align-items: start; }
.svgrid > div > .group + .group { margin-top: 10px; }
.svhist ul { list-style: none; margin: 4px 0 8px; padding: 0; max-height: 460px; overflow: auto; }
.svhist li { position: relative; padding: 2px 0 10px 16px; border-left: 2px solid var(--fl-stroke2); margin-left: 6px; }
.svhist li::before { content: ""; position: absolute; left: -6px; top: 4px; width: 10px; height: 10px; border-radius: 50%; background: #fff; border: 2px solid #8a8886; }
.svhist li.st-A::before { border-color: #0f6cbd; } .svhist li.st-S::before, .svhist li.st-B::before { border-color: #f7630c; }
.svhist li.st-T::before { border-color: #107c10; background: #107c10; } .svhist li.st-I::before { border-color: #8a8886; background: #8a8886; }
.svhist li .t { font-size: 11px; color: var(--fl-fg3); }
.svnote { display: flex; gap: 6px; } .svnote .inp { flex: 1; }
/* teslimat takvimi */
.tk-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 10px; align-items: start; } .tk-wrap.full { grid-template-columns: minmax(0, 1fr); }
.tk-title { font-size: 16px; font-weight: 700; color: var(--fl-fg1); margin: 2px 0 6px; text-transform: capitalize; }
.tk-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.tk-wd { font-size: 11px; font-weight: 700; color: var(--fl-fg3); text-transform: uppercase; letter-spacing: .5px; padding: 0 4px; }
.tk-day { background: #fff; border: 1px solid var(--fl-stroke2); border-radius: 6px; display: flex; flex-direction: column; min-width: 0; }
.tk-grid.week .tk-day { min-height: 430px; } .tk-grid.month .tk-day { min-height: 104px; }
.tk-day.today { border-color: #0f6cbd; box-shadow: inset 0 0 0 1px #0f6cbd; }
.tk-day.past { background: #f6f7f8; } .tk-day.out { opacity: .5; } .tk-day.sun .dd { color: #c42b1c; }
.tk-day.over { background: #eaf3fc; outline: 2px dashed #0f6cbd; outline-offset: -3px; }
.tk-day .dh { display: flex; align-items: center; gap: 6px; padding: 5px 8px; border-bottom: 1px solid var(--fl-stroke2); font-weight: 700; }
.tk-day .dh .bp-pill { margin-left: auto; padding: 0 7px; font-size: 11px; }
.tk-day .dh .dw { display: none; }
.tk-day .dh a.pr svg { width: 16px; height: 16px; vertical-align: middle; }
.tk-day .db { padding: 5px; display: flex; flex-direction: column; gap: 5px; flex: 1; }
.tkc { border: 1px solid var(--fl-stroke2); border-left: 4px solid #8a8886; border-radius: 4px; padding: 4px 6px; background: #fff; cursor: pointer;
       font-size: 12px; line-height: 1.35; overflow: hidden; }
.tkc:hover { box-shadow: 0 2px 6px rgba(0,0,0,.12); }
.tkc[draggable=true] { cursor: grab; } .tkc.dragging { opacity: .45; }
.tkc.k-A { border-left-color: #f7630c; } .tkc.k-C { border-left-color: #107c10; background: #f3faf3; } .tkc.k-P { border-left-color: #0f6cbd; background: #f5f9fe; }
.tkc.late { border-left-color: #c42b1c; }
.tkc .h { display: flex; align-items: center; gap: 6px; } .tkc .h .bp-pill { margin-left: auto; font-size: 10.5px; padding: 0 6px; }
.tkc .c { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tkc .s { color: var(--fl-fg3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tkc .s.tkold { color: var(--fl-warn-fg); font-weight: 600; white-space: normal; }
.tkc .one { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tkc a.tkact { font-size: 11.5px; }
.tk-side { display: flex; flex-direction: column; gap: 6px; max-height: calc(100vh - 260px); overflow: auto; }
.tk-side > .s { color: var(--fl-fg3); }
/* belge ekleri */
.ekcard { margin-top: 10px; }
.ekcard.over { outline: 2px dashed #0f6cbd; outline-offset: -4px; background: #f5f9fe; }
.ekgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.ekitem { border: 1px solid var(--fl-stroke2); border-radius: 6px; padding: 6px; background: #fff; min-width: 0; }
.ekthumb { display: flex; align-items: center; justify-content: center; height: 110px; background: #f3f4f6; border-radius: 4px; overflow: hidden; }
.ekthumb img { max-width: 100%; max-height: 110px; object-fit: contain; }
.ekpdf { font-weight: 700; color: #c42b1c; font-size: 18px; border: 2px solid #c42b1c; border-radius: 4px; padding: 6px 10px; }
.ekname { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 4px; }
.ekmeta { font-size: 11px; color: var(--fl-fg3); display: flex; align-items: center; gap: 4px; }
.ekdel { margin-left: auto; border: 0; background: none; color: #c42b1c; cursor: pointer; font-size: 12px; padding: 0 2px; }
.ekempty { color: var(--fl-fg3); padding: 6px 2px; }
.ekprog { margin-top: 8px; color: var(--fl-brand); font-weight: 600; }
.svfiles { max-width: 1192px; }
/* gorevler */
.grdone { width: 22px; height: 22px; border: 1px solid var(--fl-stroke1); border-radius: 50%; background: #fff; color: #c8c6c4; cursor: pointer; font-weight: 700; line-height: 18px; padding: 0; }
.grdone:hover { border-color: #107c10; color: #107c10; }
.grdone.on { background: #107c10; border-color: #107c10; color: #fff; }
.grnote { font-size: 11px; color: var(--fl-fg3); }
/* toplu fiyat guncelleme */
.fyform { flex-wrap: wrap; row-gap: 6px; }
.fyprev { max-height: calc(100vh - 330px); overflow: auto; }
.fyhist { margin-top: 10px; max-width: 1000px; }
.fyhist form { display: inline; }
/* senet takibi */
.snfl { height: 20px; padding: 0 8px; }
.snflabel { font-weight: 700; margin-bottom: 6px; }
.snfhist { list-style: none; margin: 0 0 10px; padding: 0; max-height: 220px; overflow: auto; border: 1px solid var(--fl-stroke2); border-radius: 4px; min-width: 460px; }
.snfhist li { padding: 5px 8px; border-bottom: 1px solid var(--fl-stroke2); }
.snfhist li:last-child { border-bottom: 0; }
.snfhist li .t { font-size: 11px; color: var(--fl-fg3); }
.snfhist li.empty { color: var(--fl-fg3); }
/* isletme ozeti */
.isgrid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 10px; margin-bottom: 10px; align-items: start; }
/* kalite analizi */
.bp-kpi .v.ksmall { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 240px; }
/* teslimat ekipleri */
.tkcaps { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px 6px 0; }
.tkcaps .bp-pill { font-size: 10.5px; padding: 0 6px; text-decoration: none; }
.tkc select.tkteam { width: 100%; margin-top: 3px; height: 22px; font-size: 11.5px; }
/* iki adimli giris */
.tf-setup { display: flex; gap: 18px; align-items: flex-start; }
.tf-qr svg { width: 180px; height: 180px; display: block; }
.tf-key { margin: 8px 0; }
.tf-key code, .tf-list code { font-size: 14px; letter-spacing: 1px; background: #eef2f6; padding: 2px 6px; border-radius: 4px; }
.tf-codes { background: #fff8e1; border: 1px solid #f0d58c; border-radius: 6px; padding: 8px 10px; margin-bottom: 10px; }
.tf-list { display: grid; grid-template-columns: repeat(4, max-content); gap: 6px 14px; margin-top: 6px; }
.tf-act { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
/* guvenlik bildirimi */
.sysnotify { margin-top: 10px; padding-top: 8px; border-top: 1px solid #e3e8ee; }
/* egitim ortami */
body.egitim .menubar { background: #b45309; }
.egitim-etiket { background: #fff7ed; color: #9a3412; font-weight: 700; border-radius: 4px; padding: 0 8px; margin: 0 10px 0 4px; letter-spacing: .5px; }

/* =====================================================================
   BEAP gorunumu 2 (2026-10-09; kullanici: "guzel anlasilir arayuz: tema, ikonlar, renk butunlugu, kutucuklar, cerceveler, yazi stili").
   Tek renk takimi (logo laciverti, mavi, turuncu vurgu); butun kutular ayni cerceve / kose / golgeyle; butun tablolar ayni baslik,
   satir ve toplam renkleriyle; tek yazi tipi (kullanicinin secimi, Courier yok), sayilar hizali. Yerlesim ve olculer degismez:
   bu katman yalniz renk, cizgi, kose, golge ve yazi tipini degistirir. Yeni ekran bu degiskenleri kullanir.
   ===================================================================== */
:root {
  --b-navy: #0f3a63; --b-blue: #1f5a94; --b-blue-h: #174a7c; --b-blue-soft: #e7eff8; --b-blue-line: #b9cde3; --b-orange: #f0a020;
  --b-bg: #e3e8ee; --b-panel: #ffffff; --b-head: #f2f5f8; --b-line: #c6cfd8; --b-line2: #e1e6ec;
  --b-field-line: #a3afbb; --b-field-ro: #eef2f6; --b-field-ro-line: #cdd5de;
  --b-text: #000000; --b-text2: #33414e; --b-text3: #5f6c79;
  --b-zebra: #f6f8fb; --b-hover: #eaf2fb; --b-sel: #d3e3f4; --b-sum: #fff3c2; --b-sub: #fffae6;
  --b-ok: #107c41; --b-warn: #b25a00; --b-bad: #c42b1c;
  --b-r: 6px; --b-r-s: 4px; --b-shadow: 0 1px 2px rgba(15, 58, 99, .08);
  /* eski katmanlarin degiskenleri ayni renklere */
  --bg: var(--b-bg); --panel: #ffffff; --text: #000000; --muted: var(--b-text2); --line: var(--b-line); --line-dark: var(--b-field-line);
  --accent: var(--b-blue); --accent-soft: var(--b-blue-soft); --field-ro: var(--b-field-ro); --row-alt: var(--b-zebra); --row-sel: var(--b-sel);
  --focus: var(--b-blue); --ok: var(--b-ok); --err: var(--b-bad); --info: var(--b-blue); --shell: var(--b-navy);
  --fl-brand: var(--b-blue); --fl-brand-hover: var(--b-blue-h); --fl-brand-pressed: var(--b-navy); --fl-brand-bg2: var(--b-blue-soft);
  --fl-stroke1: var(--b-line); --fl-stroke2: var(--b-line2);
}
body { background: var(--b-bg); color: var(--b-text); }
a { color: var(--b-blue); }

/* ---- pencere cubuklari: lacivert menu cubugu (giris ve kilit ekraniyla ayni), acik arac cubuklari ---- */
.menubar { background: var(--b-navy); border-bottom-color: #0a2b4a; color: #ffffff; }
.menubar .brand { color: #ffffff; }
.menubar .brand img { filter: drop-shadow(0 0 1px rgba(255, 255, 255, .5)); }
.menubar .m:hover, .menubar .m.open { background: rgba(255, 255, 255, .16); }
.menubar .dd, .ctxmenu { background: #ffffff; border-color: var(--b-line); border-radius: 0 0 var(--b-r-s) var(--b-r-s); box-shadow: 0 6px 18px rgba(15, 58, 99, .2); }
.menubar .dd a, .ctxmenu a { color: var(--b-text); }
.menubar .dd a:hover, .ctxmenu a:hover { background: var(--b-blue-soft); }
.menubar .dd kbd { color: var(--b-text3); }
.winctl button { color: #ffffff; }
.winctl button:hover { background: rgba(255, 255, 255, .16); }
.systoolbar { background: linear-gradient(#ffffff, #eef2f6); border-bottom-color: var(--b-line); }
.titlebar { background: #ffffff; color: var(--b-navy); font-weight: 600; border-bottom-color: var(--b-line2); }
.apptoolbar { background: #f7f9fb; border-bottom-color: var(--b-line); }
.ib { color: var(--b-text); border-radius: var(--b-r-s); }
.ib:hover:not([disabled]), .ib.on { background: var(--b-blue-soft); border-color: var(--b-blue-line); }
.workarea, .ea-main { background: var(--b-bg); }
.statusbar { background: #f2f5f8; border-top-color: var(--b-line); }
.statusbar .cell, .statusbar .sbclock { border-color: var(--b-line2); }
.statusbar .msg.W { color: var(--b-warn); }

/* ---- kutular: beyaz, ayni cerceve, kose ve golge; baslik seridi acik gri, lacivert yazi ---- */
.group, .sg, .sbox, .card, .chart, .alv-wrap, .tabpane, .ea-nav, .beapbar, .tree, .bp-card, .bp-kpi {
  background: var(--b-panel); border: 1px solid var(--b-line); border-radius: var(--b-r); box-shadow: var(--b-shadow); }
.group > .gt, .sboxt, .chart-h, .alv-bar, .ea-search, .bp-screen .group > .gt {
  background: var(--b-head); color: var(--b-navy); border-color: var(--b-line2); font-weight: 600; border-radius: var(--b-r) var(--b-r) 0 0; }
.alv-bar { border-bottom: 1px solid var(--b-line2); font-weight: normal; color: var(--b-text); }
.alv-bar .info { color: var(--b-text3); }
.sgt { color: var(--b-navy); font-weight: 600; border-bottom: 1px solid var(--b-line2); }
.hint, .card-l, .card-s, .sgx, .snsub { color: var(--b-text3); }
.lbl, .sl, .sl2, .sll, .son, .sol, .sol2 { color: var(--b-text); }
/* kartlar (ana sayfa ve ozet kutulari): solda renkli serit, ayni olcu */
.card { border-top: 1px solid var(--b-line); border-left: 4px solid #9aa4ae; border-radius: var(--b-r); }
.card.tone-ok { border-top-color: var(--b-line); border-left-color: var(--b-ok); }
.card.tone-accent { border-top-color: var(--b-line); border-left-color: var(--b-blue); }
.card.tone-warn { border-top-color: var(--b-line); border-left-color: #e0a106; }
.card.tone-err { border-top-color: var(--b-line); border-left-color: var(--b-bad); }
.card-v, .bp-kpi .v { color: var(--b-text); }
.bp-kpi { border-left: 4px solid var(--b-blue); }
.bp-kpi.ok { border-left-color: var(--b-ok); } .bp-kpi.warn { border-left-color: #e0a106; } .bp-kpi.bad { border-left-color: var(--b-bad); }
.bp-kpi.teal { border-left-color: #0f7b7b; }
.chart-svg .bar rect { fill: #7ea6cf; } .chart-svg .bar:hover rect, .chart-svg .bar.today rect { fill: var(--b-blue); }
.chart-svg .bar.today .ax { fill: var(--b-blue); }

/* ---- alanlar ---- */
.inp, select.inp, textarea.inp, .ea-search input { background: #ffffff; color: #000000; border-color: var(--b-field-line); border-radius: 3px; }
.inp[readonly], .inp:disabled { background: var(--b-field-ro); border-color: var(--b-field-ro-line); color: #000000; }
.inp:focus, .ea-search input:focus { border-color: var(--b-blue); box-shadow: 0 0 0 2px rgba(31, 90, 148, .2); background: #ffffff; }
.inp.err { border-color: var(--b-bad); background: #fff5f4; }

/* ---- dugmeler: beyaz cerceveli; ana islem mavi ---- */
.btn, .btn.beapyel { background: #ffffff; border-color: var(--b-field-line); color: var(--b-text); border-radius: var(--b-r-s); }
.btn:hover, .btn.beapyel:hover { background: var(--b-blue-soft); border-color: var(--b-blue); filter: none; }
.btn.primary, .bp-screen .btn.primary, .bp-btn { background: var(--b-blue); border-color: var(--b-blue); color: #ffffff; }
.btn.primary:hover, .bp-screen .btn.primary:hover, .bp-btn:hover { background: var(--b-blue-h); border-color: var(--b-blue-h); }
.btn.snwa, .snwa { background: #edf8f1; border-color: #57b77a; color: #0d6b33; }                  /* WhatsApp: yesil */
.btn.snwa:hover, .snwa:hover { background: #dcf2e4; border-color: #25a244; }
.zsd .zbtn, .zsd .zb, .zitems .itemside .ib, .itemside .ib, #t_pay .paybtn {
  background: #ffffff; border: 1px solid var(--b-field-line); border-radius: 3px; box-shadow: none; color: var(--b-text); }
.zsd .zbtn:hover:not(:disabled), .zsd .zb:hover, .itemside .ib:hover:not([disabled]) { background: var(--b-blue-soft); border-color: var(--b-blue); }

/* ---- sekmeler: etkin sekme beyaz, ustte turuncu cizgi ---- */
.tabs { border-bottom-color: var(--b-line); }
.tabs button, .subtabs button { background: #eef2f6; border-color: var(--b-line); color: var(--b-text2); border-radius: var(--b-r-s) var(--b-r-s) 0 0; }
.tabs button:hover:not(.act), .subtabs button:hover:not(.act) { background: var(--b-blue-soft); }
.tabs button.act, .subtabs button.act { background: #ffffff; border-color: var(--b-line); color: var(--b-navy); box-shadow: inset 0 3px 0 var(--b-orange); font-weight: 600; }

/* ---- tablolar: acik baslik, beyaz / cok acik zebra, mavi secim, yumusak sari toplam ---- */
table.alv th { background: var(--b-head); color: #1b2a39; border-color: var(--b-line2); border-bottom-color: var(--b-line); }
table.alv td { border-color: var(--b-line2); }
table.alv tbody tr:nth-child(even) { background: var(--b-zebra); }
table.alv tbody tr:hover { background: var(--b-hover); }
table.alv tbody tr.sel { background: var(--b-sel); }
table.alv th.selcol { background: #dbe7f4; }
table.alv tfoot td { background: var(--b-sum); }
table.alv td a { color: var(--b-blue); }
table.alv thead th.dropl { box-shadow: inset 3px 0 0 var(--b-blue); } table.alv thead th.dropr { box-shadow: inset -3px 0 0 var(--b-blue); }
#cust tbody tr td { border-color: var(--b-line2); }
#cust tbody tr:nth-child(odd) td { background: #ffffff; }
#cust tbody tr:nth-child(even) td { background: var(--b-zebra); }
#cust tbody tr.sel td { background: var(--b-sel) !important; }
#cust thead th { background: var(--b-head); border-color: var(--b-line2); }
#cust thead tr::before, #cust tbody tr::before { background: var(--b-head); border-right-color: var(--b-line2); }
.alv-wrap:has(#cust), .alv-wrap:has(#cust) .alv-scroll { background: #ffffff; }
.alv-wrap:has(#cust) { border: 1px solid var(--b-line); box-shadow: var(--b-shadow); }
#cust tbody td[data-ci="0"] { color: var(--b-blue); }
/* klasik listeler ve musteri durum raporu: ayni tablo renkleri */
table.beaplist thead tr.h1 { box-shadow: none; }
table.beaplist thead tr.h1 th { background: var(--b-head) !important; border-bottom: 1px solid var(--b-line); font-weight: 600; }
table.beaplist tbody tr td { background: #ffffff !important; border-bottom: 1px solid var(--b-line2); }
table.beaplist tbody tr:nth-child(even) td { background: var(--b-zebra) !important; }
table.csgrid { background: #ffffff; border: 1px solid var(--b-line); }
table.csgrid th, table.csgrid td { border-color: var(--b-line2); background: #ffffff; }
table.csgrid th { background: var(--b-head); color: var(--b-navy); }
.csinfo .cst { background: none; color: var(--b-navy); font-weight: 600; padding: 0; }
.cslist tr.cssub td { background: var(--b-sub) !important; }
.cslist tr.cstot td { background: var(--b-sum) !important; }
.cslist tbody td a { color: var(--b-blue); }
.csviews label { border-color: var(--b-line); background: #ffffff; border-radius: 3px; margin-right: 2px; }
.csviews label.on { background: var(--b-blue-soft); border-color: var(--b-blue); }
.cslist td.rs, .cslist th.rs { background: var(--b-head) !important; }

/* ---- siparis ekrani: kutular ve kalem tablosu ayni renklerde ---- */
.zsd .zbox { border: 1px solid var(--b-line); border-radius: var(--b-r); box-shadow: var(--b-shadow); }
.zsd .zbt { border-bottom-color: var(--b-line2); color: var(--b-navy); font-weight: 600; }
.zsd .zl { border-bottom-color: var(--b-line2); }
#t_pay, .itemside, .zitems .alv-scroll { background: var(--b-bg); }

/* ---- tek yazi tipi: kod ve sayi kutulari da (Courier kalkti), rakamlar ayni genislikte ---- */
.zsd .zt, #items tbody td, #items input.cell, #items select.cell, #t_pay .paygrid td, #t_pay .paygrid input.cell, .zmm-bgrid input.cell,
table.beaplist th, table.beaplist td, table.beaplist input.cell, .beepdrop .bd-i b {
  font-family: inherit !important; font-size: 12px !important; font-variant-numeric: tabular-nums; }
#t_pay .paygrid input.cell:focus, #items input.cell:focus, #items select.cell:focus { box-shadow: inset 0 0 0 1px var(--b-blue); }

/* ---- pencereler, acilir liste, takvim ---- */
.modal { background: #ffffff; border-color: var(--b-line); border-radius: var(--b-r); }
.modal .mh { background: var(--b-navy); border-radius: var(--b-r) var(--b-r) 0 0; }
.modal .mf { background: #f6f8fa; border-top-color: var(--b-line2); border-radius: 0 0 var(--b-r) var(--b-r); }
.beepdrop { border-color: var(--b-line); border-radius: var(--b-r-s); box-shadow: 0 6px 18px rgba(15, 58, 99, .2); }
.beepdrop .bd-i:hover { background: var(--b-blue-soft); }
.beepdrop .bd-i.cur { background: var(--b-blue); }
.beepcal td.tdy { border-color: var(--b-blue); }
.beepcal td.sel { background: var(--b-blue) !important; }

/* ---- ana menu agaci: secili satir mavi, simge kutulari ayni cerceve ---- */
.tree .node:hover { background: var(--b-blue-soft); }
.tree .node.sel { background: var(--b-sel); }
.tree .code { color: var(--b-blue); }
.workarea .tree .node.tx svg { border-color: var(--b-line); box-shadow: var(--b-shadow); }

/* =====================================================================
   BEAP gorunumu 3 (1.5.1, 2026-10-11): ESKI DUZEN AYNEN (menu cubugu Menu / Duzenle / Sistem / Yardim, simge cubugu, baslik, uygulama
   araclari, ana menu agaci ve dugmeleri); yalniz gorunus yenilendi. Kullanici 1.5.0'daki yeni duzeni begenmedi: "eski halini guncelle
   demek istedim". Giris ekraniyla ayni dil: lacivert degrade menu cubugu, beyaz arac cubuklari, yuvarlak koseli beyaz kutular, yumusak
   golge, mavi odak halkasi. Alan ve satir yukseklikleri degismez (siparis ekrani gibi olculu ekranlar bozulmasin).
   ===================================================================== */
:root {
  --b-navy2: #0b2440; --b-blue2: #2378cf; --b-ink: #0d2a4a; --b-mut: #6a7785;
  --b-bg: #eef2f6; --b-head: #f6f8fb; --b-line: #dbe2e9; --b-line2: #e9eef3;
  --b-field-line: #c5cfd9; --b-field-ro: #f3f6f9; --b-field-ro-line: #dde4eb;
  --b-zebra: #fafcfe; --b-hover: #f0f6fd; --b-sel: #dbeafb; --b-sum: #fff4cf; --b-blue-soft: #eaf2fb; --b-blue-line: #bcd3ea;
  --b-r: 12px; --b-r-s: 8px;
  --b-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .06);
  --b-ring: 0 0 0 3px rgba(35, 120, 207, .16);
}
body { background: var(--b-bg); }

/* ---- menu cubugu (eski yerinde): giris ekranindaki lacivert degrade, beyaz yazi; acilir menuler yuvarlak ve golgeli ---- */
.menubar { height: 34px; padding: 0 6px 0 12px; gap: 2px; color: #fff; border-bottom: 0; position: relative; z-index: 60;
  background: linear-gradient(90deg, #0b2440 0%, #0f3a63 58%, #134a7e 100%); }
.menubar .brand { display: inline-flex; align-items: center; gap: 8px; margin-right: 16px; color: #fff; font-size: 14px; font-weight: 800; letter-spacing: 2.5px; }
.menubar .brand:hover { text-decoration: none; }
.menubar .brand img { width: 20px; height: 20px; filter: drop-shadow(0 2px 5px rgba(0, 0, 0, .35)); }
.menubar .brand b { color: var(--b-orange); }
.menubar .m { padding: 5px 12px; border-radius: 7px; color: #f2f6fa; }
.menubar .m:hover, .menubar .m.open { background: rgba(255, 255, 255, .15); }
.menubar .dd { top: 31px; min-width: 260px; padding: 6px; border: 1px solid var(--b-line); border-radius: 10px; background: #fff;
  box-shadow: 0 16px 40px rgba(11, 36, 64, .24); }
.menubar .dd a { padding: 8px 12px; border-radius: 7px; color: var(--b-ink); }
.menubar .dd a:hover { background: var(--b-blue-soft); text-decoration: none; }
.menubar .dd hr { margin: 6px 4px; border-top-color: var(--b-line2); }
.menubar .dd kbd { color: var(--b-mut); }
.menubar .right { color: #c9d8e8; font-size: 12px; padding-right: 8px; }
.menubar .winctl button:hover { background: rgba(255, 255, 255, .15); }

/* ---- simge cubugu: beyaz, yuvarlak dugmeler ---- */
.systoolbar { height: 42px; padding: 0 10px; gap: 4px; background: #fff; border-bottom: 1px solid var(--b-line2); }
.systoolbar .ib { min-width: 34px; height: 34px; border-radius: 8px; }
.systoolbar .ib:hover:not([disabled]) { background: #eef4fa; border-color: #d3e0ec; }
.systoolbar .sep { height: 22px; margin: 0 6px; background: var(--b-line); }

/* ---- baslik ve uygulama araclari (eski iki satir): beyaz, cerceveli yuvarlak dugmeler; ekranin Kaydet'i mavi ---- */
.titlebar { padding: 10px 18px 6px; background: #fff; border-bottom: 0; color: var(--b-ink); font-size: 18px; font-weight: 700; }
.apptoolbar { gap: 6px; min-height: 0; padding: 4px 14px 10px; background: #fff; border-bottom: 1px solid var(--b-line); }
.apptoolbar .sep { display: none; }
.apptoolbar .ib, .apptoolbar .alv-tools .ib { height: 34px; padding: 0 12px; gap: 7px; border: 1px solid var(--b-line); border-radius: 9px; background: #fff;
  color: var(--b-ink); font-size: 13px; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.apptoolbar .ib:hover:not([disabled]), .apptoolbar .ib.on { background: #f3f7fb; border-color: #c4d3e2; }
.apptoolbar .ib svg { width: 18px; height: 18px; }
.apptoolbar .alv-tools { gap: 6px; margin-right: 0; }
.apptoolbar .ib[data-fcode="SAVE"] { background: linear-gradient(180deg, #2a83d8, #1660ad); border-color: #1660ad; color: #fff; font-weight: 700;
  box-shadow: 0 2px 8px rgba(22, 96, 173, .28); }
.apptoolbar .ib[data-fcode="SAVE"]:hover:not([disabled]) { background: linear-gradient(180deg, #3190e6, #1a69bd); border-color: #1a69bd; }
.apptoolbar .ib[data-fcode="SAVE"] svg { filter: brightness(0) invert(1); }

/* ---- calisma alani ve durum cubugu ---- */
.workarea { padding: 18px 20px 18px; background: var(--b-bg); }
.statusbar { height: 30px; background: #fff; border-top: 1px solid var(--b-line); font-size: 12px; }
.statusbar .sbclock { padding: 0 14px; border-right: 1px solid var(--b-line2); color: var(--b-mut); font-size: 11.5px; }
.statusbar .msg { padding: 0 14px; }
.statusbar .sbcode { margin: 0 12px 0 auto; padding: 2px 10px; border-radius: 999px; background: #eef2f6; color: #5f6c79; font-size: 11px; letter-spacing: .4px; }

/* ---- kutular: beyaz, yuvarlak kose, yumusak golge; baslik seridi yerine sade baslik ---- */
.group, .sg, .sbox, .chart, .alv-wrap, .tabpane, .beapbar, .bp-card, .bp-kpi, .zsd .zbox { border-color: var(--b-line); border-radius: var(--b-r); box-shadow: var(--b-shadow); }
.group > .gt, .sboxt, .chart-h, .bp-screen .group > .gt { background: #fff; color: var(--b-ink); font-weight: 700; border-bottom: 1px solid var(--b-line2); border-radius: var(--b-r) var(--b-r) 0 0; }
.sg { padding: 4px 16px 12px; }
.sgt { padding: 10px 0 8px; margin-bottom: 8px; border-bottom: 1px solid var(--b-line2); color: var(--b-ink); font-weight: 700; }
.zsd .zbt { color: var(--b-ink); font-weight: 700; }
.hint, .card-l, .card-s, .sgx, .snsub { color: var(--b-mut); }

/* ---- alanlar: yumusak kose, mavi odak halkasi (yukseklik ayni) ---- */
.inp, select.inp, textarea.inp, .ea-search input { border-color: var(--b-field-line); border-radius: 7px; }
.inp:hover:not([readonly]):not(:disabled):not(:focus) { border-color: #a9b7c5; }
.inp:focus, .ea-search input:focus { border-color: var(--b-blue2); box-shadow: var(--b-ring); }
html:not([data-nofocus]) .inp:focus { box-shadow: var(--b-ring); }                     /* secenekteki odak efekti de yumusak halka */
.inp[readonly], .inp:disabled { background: var(--b-field-ro); border-color: var(--b-field-ro-line); }
#items input.cell, #items select.cell, #t_pay .paygrid input.cell, .zmm-bgrid input.cell { border-radius: 0; }

/* ---- dugmeler: beyaz yuvarlak, ana islem giris ekranindaki mavi ---- */
.btn, .btn.beapyel { border-color: var(--b-field-line); border-radius: 9px; color: var(--b-ink); }
.btn:hover, .btn.beapyel:hover { background: #f3f7fb; border-color: #a9bdd2; }
.btn.primary, .bp-screen .btn.primary, .bp-btn { background: linear-gradient(180deg, #2a83d8, #1660ad); border-color: #1660ad; color: #fff; box-shadow: 0 2px 8px rgba(22, 96, 173, .28); }
.btn.primary:hover, .bp-screen .btn.primary:hover, .bp-btn:hover { background: linear-gradient(180deg, #3190e6, #1a69bd); border-color: #1a69bd; }
.ib { border-radius: 8px; }
.ib:hover:not([disabled]), .ib.on { background: #eef4fa; border-color: #c9d8e7; }

/* ---- sekmeler: alt cizgili, etkin sekme turuncu cizgi ---- */
.tabs { gap: 2px; border-bottom: 1px solid var(--b-line); }
.tabs button, .subtabs button { margin-bottom: -1px; padding: 9px 16px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: transparent; color: #5f6c79; }
.tabs button:hover:not(.act), .subtabs button:hover:not(.act) { background: transparent; color: var(--b-ink); border-bottom-color: #cfd9e3; }
.tabs button.act, .subtabs button.act { background: transparent; color: var(--b-navy); border-bottom-color: var(--b-orange); box-shadow: none; font-weight: 700; }

/* ---- listeler: arama kutusu, sade baslik, tikla sirala ---- */
.alv-wrap { overflow: hidden; }
.alv-bar { gap: 8px; padding: 8px 10px; background: #fff; border-bottom: 1px solid var(--b-line2); border-radius: var(--b-r) var(--b-r) 0 0; }
.alv-bar .grow { flex: 1; }
.alv-bar .info { color: var(--b-mut); font-size: 12px; }
.alv-bar .ib { height: 32px; min-width: 32px; padding: 0 8px; }
table.alv th { background: var(--b-head); color: #3b4a59; font-weight: 700; border-color: var(--b-line2); border-bottom-color: var(--b-line); }
table.alv:not(#items) th { padding: 8px 10px; font-size: .93em; }
table.alv:not(#items) td { padding: 6px 10px; border-left-color: transparent; border-right-color: transparent; border-bottom-color: var(--b-line2); }
table.alv th.sortable:hover { background: #edf2f7; }
table.alv th.sorted-asc, table.alv th.sorted-desc { color: var(--b-blue); }
table.alv th.sorted-asc::after { content: " ▲"; font-size: 9px; }
table.alv th.sorted-desc::after { content: " ▼"; font-size: 9px; }
table.alv th.selcol { background: #e3eefa; }
table.alv tbody tr:nth-child(even) { background: var(--b-zebra); }
table.alv tbody tr:hover { background: var(--b-hover); }
table.alv tbody tr.sel { background: var(--b-sel); }
table.alv tfoot td { background: var(--b-sum); font-weight: 700; }

/* ---- pencereler ve acilir listeler ---- */
.modal-bg { background: rgba(11, 36, 64, .42); backdrop-filter: blur(2px); }
.modal { border: 1px solid var(--b-line); border-radius: 14px; box-shadow: 0 24px 64px rgba(11, 36, 64, .30); overflow: hidden; }
.modal .mh { padding: 13px 16px; background: #fff; color: var(--b-ink); font-size: 15px; font-weight: 700; border-bottom: 1px solid var(--b-line2); border-radius: 0; }
.modal .mh button { width: 30px; height: 30px; border-radius: 50%; color: var(--b-mut); font-size: 14px; }
.modal .mh button:hover { background: #eef2f6; color: var(--b-ink); }
.modal .mb { padding: 14px 16px; }
.modal .mf { padding: 10px 16px; gap: 8px; background: #f8fafc; border-top: 1px solid var(--b-line2); border-radius: 0; }
.beepdrop { border-color: var(--b-line); border-radius: 10px; box-shadow: 0 14px 36px rgba(11, 36, 64, .22); overflow-x: hidden; overflow-y: auto; }   /* uzun liste kayar (overflow: hidden 1.5.0'da 15 satirdan sonrasini kesiyordu) */
.beepdrop .bd-i.cur { background: var(--b-blue2); }
.ctxmenu { border: 1px solid var(--b-line); border-radius: 12px; padding: 6px; box-shadow: 0 18px 44px rgba(11, 36, 64, .24); }
.ctxmenu a { border-radius: 8px; }
.ctxmenu hr { margin: 6px 4px; border-top-color: var(--b-line2); }

/* ---- ana sayfa: menu agaci eski yerinde (solda tam boy panel), ozet kartlari ---- */
.ea-main { padding: 18px 22px 24px; }
.ea-nav { border-radius: 0; border-width: 0 1px 0 0; box-shadow: none; }
.ea-nav .tree { border: 0; border-radius: 0; box-shadow: none; }
.tree .node { padding: 5px 8px; border-radius: 9px; }
.tree .node:hover { background: #f1f6fc; }
.tree .node.sel { background: #e1edfa; outline: 0; }
.tree .node.folder { color: var(--b-ink); font-weight: 700; }
.workarea .tree .node.tx svg, .tree .node.tx svg { border-radius: 9px; border-color: var(--b-line2); }
.dash-h h1 { color: var(--b-ink); font-weight: 700; }
.card { position: relative; overflow: hidden; border: 1px solid var(--b-line); border-radius: var(--b-r); padding: 12px 14px 12px 18px; }
.card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #9aa4ae; }
.card.tone-ok, .card.tone-accent, .card.tone-warn, .card.tone-err { border-left-color: var(--b-line); border-top-color: var(--b-line); }
.card.tone-ok::before { background: var(--b-ok); } .card.tone-accent::before { background: var(--b-blue2); }
.card.tone-warn::before { background: #e0a106; } .card.tone-err::before { background: var(--b-bad); }
a.card:hover { text-decoration: none; border-color: var(--b-blue-line); box-shadow: 0 6px 18px rgba(16, 24, 40, .10); }
.card-v { font-weight: 800; color: var(--b-ink); }
.bp-kpi { border-left-width: 1px; position: relative; overflow: hidden; }
.bp-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--b-blue2); }
.bp-kpi.ok::before { background: var(--b-ok); } .bp-kpi.warn::before { background: #e0a106; } .bp-kpi.bad::before { background: var(--b-bad); } .bp-kpi.teal::before { background: #0f7b7b; }
.chart-svg .bar rect { fill: #8fb5dc; } .chart-svg .bar:hover rect, .chart-svg .bar.today rect { fill: var(--b-blue2); }

/* ---- kilit ekrani ve sistem mesajlari ayni dilde ---- */
.lk-card { border-radius: 16px; box-shadow: 0 30px 80px rgba(0, 0, 0, .45); }

/* ---- ekran gecisi (1.5.2; kullanici: "ekran gecisleri cok hizli, program hissiyatini kaybetmis"): program gibi gecis.
   Menu cubugu ve simge cubugu yerinde durur; ekranin adi, dugmeleri, icerigi ve durum cubugu yumusakca degisir (eski ekran kisa
   surede soner, yeni ekran yerinde belirir; kayma yok). Ekran beklerken (sunucu calisiyor) simge cubugunun altinda ince cizgi akar,
   imlec bekleme imleci olur. Hareket azaltma secili Windows'ta gecis yok. ---- */
@view-transition { navigation: auto; }
.menubar { view-transition-name: beap-menu; }
.systoolbar { view-transition-name: beap-arac; }
::view-transition-group(beap-menu), ::view-transition-group(beap-arac) { animation: none; }
::view-transition-old(beap-menu), ::view-transition-old(beap-arac) { animation: none; opacity: 0; }
::view-transition-new(beap-menu), ::view-transition-new(beap-arac) { animation: none; }
::view-transition-old(root) { animation: 140ms cubic-bezier(.4, 0, 1, 1) both beap-ekran-cik; }
::view-transition-new(root) { animation: 260ms cubic-bezier(0, 0, .2, 1) 40ms both beap-ekran-gel; }
@keyframes beap-ekran-cik { to { opacity: 0; } }
@keyframes beap-ekran-gel { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
.systoolbar { position: relative; }
html.nav-busy, html.nav-busy * { cursor: progress !important; }
html.nav-busy .systoolbar::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; z-index: 5;
  background: linear-gradient(90deg, transparent, #f0a020 30%, #2378cf 70%, transparent) no-repeat; background-size: 35% 100%;
  animation: beap-calisiyor .9s linear infinite; }
@keyframes beap-calisiyor { from { background-position: -40% 0; } to { background-position: 140% 0; } }

/* ---- renk (1.5.3; kullanici: "stok sorgulama vs ekranlar asiri beyaz, renksiz"): zemin bir ton koyu, baslik ve dugme bandi acik
   mavi, kutu ve tablo basliklari mavi tonlu lacivert yazi, satirlar acik mavi zebra, toplam satiri sari ---- */
:root { --b-bg: #dfe6ee; --b-head: #dde8f3; --b-zebra: #f2f6fb; --b-hover: #e6f0fb; --b-sel: #cfe1f6; --b-sum: #fff0bf; }
body, .workarea, .ea-main { background: var(--b-bg); }
.systoolbar { background: linear-gradient(#ffffff, #f0f4f8); border-bottom-color: #d3dde7; }
.titlebar, .apptoolbar { background: #e8eff7; }
.apptoolbar { border-bottom: 1px solid #c6d4e2; }
.group > .gt, .sboxt, .chart-h, .bp-screen .group > .gt { background: #e5edf6; color: #0f3a63; border-bottom-color: #c9d7e5; }
.sgt { color: #0f3a63; border-bottom: 2px solid #2378cf; }
.sg > .sgt:first-child { margin: -4px -16px 10px; padding: 9px 16px 8px; background: #e5edf6; border-bottom: 2px solid #2378cf; border-radius: 11px 11px 0 0; }
.zsd .zbt { color: #0f3a63; }
table.alv th { background: var(--b-head); color: #0f3a63; border-bottom: 2px solid #a7c0da; }
table.alv th.sortable:hover { background: #d0dfef; }
.alv-bar { background: #f3f7fb; }

/* ---- siparis: Odemeler kutusundaki tutarlar (ayirici cizgi, bakiye: sifirsa yesil, kalan varsa kirmizi) ---- */
.zsd { width: 1140px; }                         /* en sagdaki Odemeler kutusu 1134 px'te biter (eskiden 1660: tutarlar disaridaydi, 1366'da tasiyordu) */
.zsd .zsep { position: absolute; height: 0; border-top: 1px solid #c6d4e2; }
/* kalem alani dar ekranda tasmasin: olculu genislik en fazla bu kadar, tablo kendi icinde kayar (1366 px'te 205 px tasiyordu) */
#t_items { width: auto; max-width: 1551px; }
.zitems .alv-scroll { width: auto; max-width: 1508px; }
.zsd .zl.zbal { font-weight: 700; color: #0d2a4a; }
.zsd .zf.balok { color: #107c41; font-weight: 700; }
.zsd .zf.balbad { color: #c42b1c; font-weight: 700; }
/* ---- telefon ve tablet (1.12.0; kullanici: "mobil tarayicidan baglaninca ekranlar calismiyor, mobil ekranlara gore revize et").
   900 pikselden dar ekranda: sayfa ekranla birlikte kayar (masaustundeki gibi kendi icinde degil), menu ve dugme bantlari dokunmaya
   uygun, kutular ve form alanlari alt alta, genis listeler kendi icinde yana kayar, pencereler ekran genisliginde. Siparis ekraninin
   olculu (piksel konumlu) duzeni sirali akisa doner. Masaustu gorunumu degismez. Dokunmatik davranis (tek dokunusla acma) beep.js'te. ---- */
/* ---- Yetkili servis cagrisi (Altus Grundig Is Emri Sistemi): formun bilgileri ve kopyala dugmeleri, cagri ve yer isareti kutulari ---- */
.cgwrap { display: flex; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.cgwrap > .cgdata { flex: 1 1 560px; min-width: 0; margin: 0; }
.cgside { flex: 0 1 430px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.cgside > .group { margin: 0; }
table.cgtab { border-collapse: collapse; width: 100%; }
table.cgtab td, table.cgtab th { padding: 6px 8px; border-bottom: 1px solid var(--b-line2); text-align: left; vertical-align: middle; }
table.cgtab td.l { color: var(--b-text2); white-space: nowrap; width: 150px; }
table.cgtab td.v { font-weight: 600; color: var(--b-ink); overflow-wrap: anywhere; }
table.cgtab td.b { width: 1%; white-space: nowrap; text-align: right; }
table.cgtab tr.cgsec th { background: var(--b-head); color: var(--b-navy); font-weight: 600; }
table.cgtab .cgsub { font-weight: normal; color: var(--b-text2); margin-top: 2px; }
table.cgtab .eksik { color: var(--b-bad); font-weight: normal; }
.cgitems label { display: flex; gap: 6px; align-items: flex-start; padding: 3px 0; }
.cgact { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.cgbm p { margin: 0 0 8px; }
ul.cgnames { margin: 6px 0 0; padding-left: 20px; }
ul.cgnames li { padding: 3px 0; }
.cgtip { display: flex; align-items: center; gap: 8px; margin-top: 4px; font-weight: normal; color: var(--b-text2); flex-wrap: wrap; }
.cgtip select { min-width: 9em; }

/* =====================================================================
   BEAP gorunumu 4 (1.15.0, 2026-10-16; kullanici: "havali giris ekrani, sekmeleri tam profesyonel, ilgi cekici ve premium";
   "rengi daha marjinal sofistike olsun, sikici mavi"). Grafit ve bakir: menu cubugu koyu grafit, ana islem ve vurgu bakir (logonun
   turuncusundan), notr tonlar sicak gri. Basliklar, sekmeler, ana menu ve ozet kartlari Plus Jakarta Sans (programla gelir, internet
   gerekmez; OFL lisansi static/lisanslar'da). Alanlar, tablolar ve dugmeler kullanicinin yazi tipinde kalir: olculu ekranlar bozulmaz.
   DUZEN AYNEN (1.5.0 dersi): satirlar, menuler ve ana sayfa yerinde; yalniz renk, yazi, kose, golge.
   ===================================================================== */
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url(/static/fonts/plus-jakarta-sans-latin-ext-wght-normal.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+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url(/static/fonts/plus-jakarta-sans-latin-wght-normal.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root {
  --b-font-d: "Plus Jakarta Sans", "Segoe UI", Tahoma, sans-serif;
  /* grafit (eski lacivert yerine) ve bakir (eski mavi yerine); turuncu logonun rengi olarak kalir */
  --b-navy: #1c1e23; --b-navy2: #121418; --b-ink: #1d1f24; --b-mut: #6f6a63;
  --b-blue: #b8622a; --b-blue-h: #9e521f; --b-blue2: #c56d2e; --b-blue-soft: #f6ece2; --b-blue-line: #e2c3a3;
  --b-copper: #c56d2e; --b-copper-d: #9e521f; --b-gold: #e2ae5c; --b-orange: #f0a020; --b-teal: #1f7a78;
  --b-bg: #e6e2dc; --b-panel: #ffffff; --b-head: #f3eee8; --b-line: #dbd4ca; --b-line2: #ebe6df;
  --b-field-line: #c2b9ad; --b-field-ro: #f5f2ee; --b-field-ro-line: #e2dbd2;
  --b-text2: #3c3833; --b-text3: #6f6a63;
  --b-zebra: #faf8f5; --b-hover: #f7efe5; --b-sel: #f2dfc9; --b-sum: #fbefcc; --b-sub: #fdf8ec;
  --b-ok: #2c7a52; --b-warn: #b06a08; --b-bad: #b8342a;
  --b-shadow: 0 1px 2px rgba(35, 28, 20, .05), 0 2px 8px rgba(35, 28, 20, .06);
  --b-ring: 0 0 0 3px rgba(197, 109, 46, .20);
  --b-grad: linear-gradient(180deg, #d27a35, #ad5820);
  --b-grad-h: linear-gradient(180deg, #dc8640, #b9622a);
  --info: var(--b-teal);
}
body, .workarea, .ea-main { background: var(--b-bg); }
a { color: var(--b-copper-d); }
input[type=radio], input[type=checkbox], progress { accent-color: var(--b-copper); }

/* ---- menu cubugu: koyu grafit, altta bakir-turuncu ince cizgi; marka ve menuler basligin yazi tipinde ---- */
.menubar { background: linear-gradient(90deg, #111316 0%, #1c1f25 55%, #2b2620 100%); }
.menubar::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, #c56d2e 0%, #f0a020 32%, rgba(240, 160, 32, 0) 78%); opacity: .85; }
.menubar .brand { font-family: var(--b-font-d); font-weight: 800; letter-spacing: 3px; }
.menubar .m { font-family: var(--b-font-d); font-weight: 600; font-size: 13px; color: #ebe5dd; }
.menubar .m:hover, .menubar .m.open { background: rgba(255, 255, 255, .10); color: #fff; }
.menubar .right { color: #cbc2b7; font-family: var(--b-font-d); font-weight: 500; }
.menubar .dd { box-shadow: 0 18px 44px rgba(18, 16, 13, .28); }
.menubar .dd a { color: var(--b-ink); }
.menubar .dd a:hover { background: var(--b-blue-soft); }

/* ---- simge cubugu ve calisiyor cizgisi ---- */
.systoolbar { background: linear-gradient(#fdfcfa, #f3efe9); border-bottom-color: var(--b-line); }
.systoolbar .ib:hover:not([disabled]) { background: var(--b-blue-soft); border-color: #e7cdb3; }
html.nav-busy .systoolbar::after { background: linear-gradient(90deg, transparent, #f0a020 30%, #c56d2e 70%, transparent) no-repeat; background-size: 35% 100%; }

/* ---- baslik ve dugme bandi: sicak acik ton; ekranin adi basligin yazi tipinde ---- */
.titlebar, .apptoolbar { background: #f2eee8; }
.titlebar { font-family: var(--b-font-d); font-weight: 800; font-size: 19px; letter-spacing: -.2px; color: var(--b-ink); }
.apptoolbar { border-bottom: 1px solid var(--b-line); }
.apptoolbar .ib, .apptoolbar .alv-tools .ib { border-color: var(--b-line); color: var(--b-ink); box-shadow: 0 1px 2px rgba(35, 28, 20, .05);
  transition: background .15s, border-color .15s, box-shadow .15s, transform .15s; }
.apptoolbar .ib:hover:not([disabled]), .apptoolbar .ib.on { background: #fff; border-color: #dcbb98; box-shadow: 0 4px 12px rgba(35, 28, 20, .10); transform: translateY(-1px); }
.apptoolbar .ib[data-fcode="SAVE"] { background: var(--b-grad); border-color: #a65420; box-shadow: 0 3px 10px rgba(176, 90, 32, .30); }
.apptoolbar .ib[data-fcode="SAVE"]:hover:not([disabled]) { background: var(--b-grad-h); border-color: #b05a20; }

/* ---- dugmeler ---- */
.ib:hover:not([disabled]), .ib.on { background: var(--b-blue-soft); border-color: #e3c6a8; }
.btn:hover, .btn.beapyel:hover { background: #fbf6f0; border-color: #d9b896; }
.btn.primary, .bp-screen .btn.primary, .bp-btn { background: var(--b-grad); border-color: #a65420; color: #fff; box-shadow: 0 3px 10px rgba(176, 90, 32, .28); }
.btn.primary:hover, .bp-screen .btn.primary:hover, .bp-btn:hover { background: var(--b-grad-h); border-color: #b05a20; }
.bp-chip.act { background: var(--b-copper); border-color: var(--b-copper); }

/* ---- kutular ve basliklari ---- */
.group > .gt, .sboxt, .chart-h, .bp-screen .group > .gt { background: linear-gradient(180deg, #f8f4ef, #f1ebe4); color: var(--b-ink); border-bottom-color: var(--b-line);
  font-family: var(--b-font-d); font-weight: 700; }
.sgt { color: var(--b-ink); border-bottom: 2px solid var(--b-copper); font-family: var(--b-font-d); }
.sg > .sgt:first-child { background: linear-gradient(180deg, #f8f4ef, #f1ebe4); border-bottom: 2px solid var(--b-copper); }
.zsd .zbt { color: var(--b-ink); font-family: var(--b-font-d); }
.zsd .zsep { border-top-color: var(--b-line); }
.zsd .zl.zbal { color: var(--b-ink); }

/* ---- tablolar ---- */
table.alv th { background: var(--b-head); color: #2b2723; border-bottom: 2px solid #dcc6ad; }
table.alv th.sortable:hover { background: #ece4da; }
table.alv th.sorted-asc, table.alv th.sorted-desc { color: var(--b-copper-d); }
table.alv th.selcol { background: #efe3d6; }
table.alv thead th.dropl { box-shadow: inset 3px 0 0 var(--b-copper); } table.alv thead th.dropr { box-shadow: inset -3px 0 0 var(--b-copper); }
.alv-bar { background: #f8f5f1; }
.hb-t { background: #f1ece6; }
.hb-f { background: linear-gradient(90deg, #e3b07e, var(--b-copper)); }

/* ---- pencereler, listeler, durum cubugu ---- */
.modal-bg { background: rgba(20, 18, 15, .45); }
.modal { box-shadow: 0 24px 64px rgba(20, 18, 15, .32); }
.modal .mh { font-family: var(--b-font-d); font-weight: 700; }
.beepdrop { box-shadow: 0 14px 36px rgba(20, 18, 15, .22); }
.ctxmenu { box-shadow: 0 18px 44px rgba(20, 18, 15, .24); }
.statusbar { background: #fbf9f6; }
.statusbar .sbcode { background: #f1ebe3; color: var(--b-mut); }
#beeplock { background: radial-gradient(900px 600px at 15% 110%, rgba(197, 109, 46, .35), transparent 60%), linear-gradient(135deg, #111316, #23262c); }
#beeplock .lk-t { color: var(--b-ink); font-family: var(--b-font-d); }
#beeplock .lk-sw { color: var(--b-copper-d); }

/* ---- ana sayfa: ozet kartlari ve grafik ---- */
.dash-h h1 { font-family: var(--b-font-d); font-weight: 800; letter-spacing: -.3px; }
.card.tone-accent::before, .bp-kpi::before { background: var(--b-copper); }
.bp-kpi.teal::before { background: var(--b-teal); }
.bp-kpi .v, .card-v { font-family: var(--b-font-d); font-weight: 800; letter-spacing: -.3px; }
.bp-kpi, a.card { transition: box-shadow .18s, transform .18s, border-color .18s; }
.bp-kpi:hover, a.card:hover { border-color: #e2c3a3; box-shadow: 0 8px 22px rgba(35, 28, 20, .10); }
.chart-svg .bar rect { fill: #e6bb92; }
.chart-svg .bar:hover rect, .chart-svg .bar.today rect { fill: var(--b-copper); }
.chart-svg .bar.today .ax { fill: var(--b-copper); }

/* ---- sekmeler: yumusak bant uzerinde, etkin sekme beyaz ve golgeli, altinda bakir-turuncu imle ---- */
.tabs { gap: 4px; padding: 4px; width: fit-content; max-width: 100%; overflow-x: auto; background: #ebe5dd; border: 1px solid #e0d8ce;
  border-radius: 12px; box-shadow: inset 0 1px 2px rgba(35, 28, 20, .07); margin-bottom: 10px; }
.tabs button, .subtabs button { position: relative; margin: 0; padding: 7px 16px 8px; border: 0; border-radius: 9px; background: transparent; color: #5d5750;
  font-family: var(--b-font-d); font-size: 13px; font-weight: 600; white-space: nowrap; transition: background .15s, color .15s, box-shadow .15s; }
.tabs button:hover:not(.act), .subtabs button:hover:not(.act) { background: rgba(255, 255, 255, .6); color: var(--b-ink); border-bottom-color: transparent; }
.tabs button.act, .subtabs button.act { background: #fff; color: var(--b-ink); font-weight: 700; border-bottom-color: transparent;
  box-shadow: 0 1px 2px rgba(35, 28, 20, .10), 0 4px 12px rgba(35, 28, 20, .08); }
.tabs button.act::after, .subtabs button.act::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: 18px; height: 3px; margin-left: -9px;
  border-radius: 3px; background: linear-gradient(90deg, #c56d2e, #f0a020); }
.tabs button:focus-visible, .subtabs button:focus-visible { outline: 2px solid var(--b-copper); outline-offset: 1px; }
html .tabs button, html .subtabs button { font-family: var(--b-font-d); }      /* kullanicinin yazi tipi secenegi (sayfada sonradan) sekmeyi ezmesin */

/* ---- ana menu (klasorler ve ekranlar): klasor simgesi kendi renginde yuvarlak kutuda, acik klasorun alti renkli kilavuz cizgisiyle ---- */
.ea-nav { background: linear-gradient(180deg, #fbfaf8, #f3efe9); }
.workarea .tree { font-family: var(--b-font-d); font-size: 15.5px; }
.tree li.f-sat { --fc: #c2652a; } .tree li.f-stk { --fc: #3f7d5c; } .tree li.f-rap { --fc: #1f7a78; }
.tree li.f-ana { --fc: #b08a2a; } .tree li.f-sys { --fc: #5c6068; } .tree li.f-own { --fc: #7a5aa0; }
.tree .node.folder svg, .tree li[class*="f-"] > .node.folder svg { color: var(--fc, #a8892f); }
.tree .node { border-radius: 10px; transition: background .12s, box-shadow .12s; }
.tree .node:hover { background: #f3e9de; }
.tree .node.sel { background: #efdcc8; box-shadow: inset 3px 0 0 var(--b-copper); }
.tree .node.folder { color: var(--b-ink); font-weight: 700; letter-spacing: -.1px; }
.workarea .tree .node.folder { font-size: 16.5px; padding: 5px 8px; }
.workarea .tree .node.folder svg { width: 22px; height: 22px; padding: 7px; box-sizing: content-box; border-radius: 11px;
  background: color-mix(in srgb, var(--fc, #a8892f) 15%, #ffffff); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--fc, #a8892f) 22%, transparent); }
.tree li:not(.closed) > .node.folder { background: color-mix(in srgb, var(--fc, #a8892f) 9%, transparent); }
.tree li:not(.closed) > .node.folder:hover { background: color-mix(in srgb, var(--fc, #a8892f) 14%, transparent); }
.workarea .tree li > ul { margin-left: 26px; padding-left: 12px; border-left: 2px solid color-mix(in srgb, var(--fc, #cfc6bb) 28%, transparent); }
.workarea .tree > ul { margin-left: 0; padding-left: 2px; border-left: 0; }
.tree .tw { color: #9a9188; }
.tree .node.tx { color: #2b2723; font-weight: 500; }
.workarea .tree .node.tx svg, .tree .node.tx svg { width: 22px; height: 22px; padding: 5px; border-radius: 9px; background: #fff; border: 1px solid #e6dfd6;
  box-shadow: 0 1px 2px rgba(35, 28, 20, .08); transition: border-color .12s, box-shadow .12s; }
.tree .node.tx:hover svg { border-color: #e2c3a3; box-shadow: 0 3px 8px rgba(35, 28, 20, .10); }
.tree .code { color: var(--b-copper-d); }
.tree li.drop-before > .node { box-shadow: inset 0 3px 0 var(--b-copper); }
.tree li.drop-after > .node { box-shadow: inset 0 -3px 0 var(--b-copper); }
.tree li.drop-into > .node { background: #fbeedd; outline: 2px solid var(--b-copper); }
@media (prefers-reduced-motion: reduce) {
  .apptoolbar .ib, .tabs button, .subtabs button, .tree .node, .bp-kpi, a.card { transition: none; }
  .apptoolbar .ib:hover:not([disabled]) { transform: none; }
}

/* =====================================================================
   BEAP gorunumu 5 (1.16.0, 2026-10-16; kullanici: "renkler daha baskin olursa goz yorgunlugunu daha aza indirir", "sutun ve satirlara
   da renk katmani ekle, bos kagit gibi duruyor"). Grafit ve bakir ayni; genis beyaz alanlar kalkti: calisma alani koyu sicak gri-bej,
   kutular fildisi, basliklar kum tonunda, bantlar ve durum cubugu bej. Listelerde sutun basliklari kum-bakir bant ve bakir alt cizgi,
   sutunlar ince cizgiyle ayrilir, satirlar belirgin zebra; secili satir bakir tonlu ve solunda bakir isaret. Satir durum renkleri
   (stokta yok kirmizi, hazir sari, baskasina ayrili gri, teslim edildi mavi) belirgin ve solda koyu serit. Yazilabilir alanlar beyaz
   kalir (yazi net okunur). DUZEN AYNEN: yalniz renk.
   ===================================================================== */
:root {
  --b-bg: #cdc1b0; --b-panel: #f9f3ea; --b-head: #e6d7c2; --b-line: #c4b49e; --b-line2: #dfd1bd;
  --b-field-line: #b8a993; --b-field-ro: #f1e9de; --b-field-ro-line: #ddcfbd;
  --b-zebra: #eee2d1; --b-hover: #ecd6ba; --b-sel: #e3c09a; --b-sum: #f3d79e; --b-sub: #f6e7c6;
  --b-band: #e1d6c6; --b-band2: #ebe2d5;
  --panel: var(--b-panel);
  /* canli bilesenlerin (Fluent) zeminleri de fildisi */
  --fl-n1: var(--b-panel); --fl-n2: #f4ecdf; --fl-n3: #ede3d4; --fl-stroke1: #c9b9a3; --fl-stroke2: #ddd0bd;
}
body, .workarea, .ea-main { background: var(--b-bg); }

/* ---- bantlar: simge cubugu, baslik ve dugme bandi, durum cubugu bej (beyaz serit yok) ---- */
.systoolbar { background: linear-gradient(#efe6da, #e0d5c5); border-bottom-color: #cdbea9; }
.titlebar, .apptoolbar { background: var(--b-band); }
.apptoolbar { border-bottom-color: #cdbfac; }
.apptoolbar .ib, .apptoolbar .alv-tools .ib { background: #faf5ed; border-color: #c9b9a3; }
.apptoolbar .ib:hover:not([disabled]), .apptoolbar .ib.on { background: #fffaf3; border-color: #c99b6e; }
.statusbar { background: var(--b-band); border-top-color: #cbbca8; }
.statusbar .sbclock { border-right-color: #d6c8b5; }
.statusbar .sbcode { background: #dccfbe; color: #5a524a; }

/* ---- kutular fildisi, basliklari kum tonunda ---- */
.group, .sg, .sbox, .card, .chart, .alv-wrap, .tabpane, .beapbar, .bp-card, .bp-kpi, .zsd .zbox { background: var(--b-panel); border-color: var(--b-line); }
.group > .gt, .sboxt, .chart-h, .bp-screen .group > .gt, .sg > .sgt:first-child { background: linear-gradient(180deg, #ebdcc6, #dfcbb0); border-bottom-color: #cfb999; }
/* ana sayfa kartlari kendi renginin acik tonunda */
.card { background: linear-gradient(135deg, #faf5ec, #efe4d4); }
.card.tone-accent, .bp-kpi { background: linear-gradient(135deg, #fbf3e8, #f1dcc4); }
.card.tone-ok, .bp-kpi.ok { background: linear-gradient(135deg, #f4f6ee, #dfe9d9); }
.card.tone-warn, .bp-kpi.warn { background: linear-gradient(135deg, #fbf5e6, #f3e1b5); }
.card.tone-err, .bp-kpi.bad { background: linear-gradient(135deg, #fbf1ec, #f2d5cc); }
.bp-kpi.teal { background: linear-gradient(135deg, #f1f5f1, #d8e8e4); }
.modal, .menubar .dd, .ctxmenu, .beepdrop, .beepcal, .tk-day, .tkc, .ekitem, .payentry { background: var(--b-panel); }
.modal .mh { background: linear-gradient(180deg, #f1e6d6, #e8dac6); border-bottom-color: #d8c7b0; }
.modal .mf { background: #efe6da; border-top-color: #ddcfbd; }
.alv-bar { background: #ece1d1; border-bottom-color: #d8c8b2; }

/* ---- sekmeler: bant bej, etkin sekme fildisi ---- */
.tabs { background: #d9cbb8; border-color: #cdbca5; }
.tabs button.act, .subtabs button.act { background: #fbf6ee; }
.tabs button:hover:not(.act), .subtabs button:hover:not(.act) { background: rgba(255, 250, 243, .65); }

/* ---- ana menu paneli: kum degrade (beyaz panel yerine) ---- */
.ea-nav { background: linear-gradient(180deg, #ebe1d2, #dccfbb); border-right-color: #c4b49e; }
.ea-nav .tree { background: transparent; }
.tree .node:hover { background: #e3cfb4; }
.tree .node.sel { background: #dcbb94; }
.workarea .tree .node.tx svg, .tree .node.tx svg { background: #fdfaf5; border-color: #ddd0bf; }

/* ---- listeler: renkli sutun basliklari, sutun cizgileri, belirgin zebra ---- */
.alv-scroll { background: #e9dece; }
table.alv th { background: linear-gradient(180deg, #3b3e45, #2b2e34); color: #f4ede3; border-color: #4a4d55; border-bottom: 2px solid #c56d2e; }
table.alv th.sortable:hover { background: linear-gradient(180deg, #474a52, #363940); }
table.alv th.sorted-asc, table.alv th.sorted-desc { background: linear-gradient(180deg, #4d4237, #3a3129); color: #f6c27a; }
table.alv th.selcol { background: #6b4a2c; }
table.alv th svg { filter: brightness(0) invert(.92); }
table.alv:not(#items) td { border-left-color: #e2d4c1; border-right-color: #e2d4c1; border-bottom-color: #dccdb8; }
table.alv tbody tr { background: #fbf6ee; }
table.alv tbody tr:nth-child(even) { background: var(--b-zebra); }
table.alv tbody tr:hover { background: var(--b-hover); }
table.alv tbody tr.sel { background: var(--b-sel); }
table.alv tbody tr.sel > td:first-child { box-shadow: inset 4px 0 0 var(--b-copper); }
table.alv tfoot td { background: var(--b-sum); border-top: 2px solid #d5b06c; }
#cust tbody tr:nth-child(odd) td { background: #fbf6ee; }
#cust tbody tr td { border-color: #e6d9c8; }
.alv-wrap:has(#cust), .alv-wrap:has(#cust) .alv-scroll { background: #e9dece; }
#cust thead th { background: linear-gradient(180deg, #3b3e45, #2b2e34); border-color: #4a4d55; }
#cust thead tr::before { background: #2b2e34; border-right-color: #4a4d55; }
#cust tbody tr::before { background: #e3d3bd; border-right-color: #d3c1a8; }
table.beaplist thead tr.h1 th { background: linear-gradient(180deg, #3b3e45, #2b2e34) !important; color: #f4ede3; border-bottom: 2px solid #c56d2e; }
table.beaplist tbody tr td { background: #fbf6ee !important; border-bottom-color: #dccdb8; }
table.beaplist tbody tr:nth-child(even) td { background: var(--b-zebra) !important; }
table.csgrid { background: var(--b-panel); }
table.csgrid th, table.csgrid td { background: #fbf6ee; border-color: #dccdb8; }
table.csgrid th { background: #e8d9c4; }
.cslist td.rs, .cslist th.rs { background: #e8d9c4 !important; }

/* ---- satir durum renkleri: belirgin zemin, solda koyu serit (stokta yok, hazir, baskasina ayrili, teslim edildi) ---- */
.row-red td { background: #f5c8c2 !important; } .row-yel td { background: #f9e08f !important; }
.row-gry td { background: #dcd6ce !important; color: #4a443d; } .row-blu td { background: #c9dcf1 !important; }
.row-red > td:first-child { box-shadow: inset 5px 0 0 #c0392b; } .row-yel > td:first-child { box-shadow: inset 5px 0 0 #d39a00; }
.row-gry > td:first-child { box-shadow: inset 5px 0 0 #8a8279; } .row-blu > td:first-child { box-shadow: inset 5px 0 0 #2e6aa8; }
tr.row-red:hover td { background: #f1b8b0 !important; } tr.row-yel:hover td { background: #f6d877 !important; }
tr.row-gry:hover td { background: #d2cbc1 !important; } tr.row-blu:hover td { background: #b9d2ee !important; }
tr.sel.row-red td { background: #eea69d !important; } tr.sel.row-yel td { background: #f2cf62 !important; }
tr.sel.row-gry td { background: #c9c1b6 !important; } tr.sel.row-blu td { background: #a9c8ea !important; }

/* ---- yazdirilan listeler beyaz zeminde (durum renkleri kalir) ---- */
@media print {
  .group, .sg, .sbox, .card, .chart, .alv-wrap, .tabpane, .beapbar, .alv-scroll { background: #fff !important; box-shadow: none !important; }
  table.alv tbody tr, table.alv tbody tr:nth-child(even) { background: #fff !important; }
  table.alv th { background: #eee !important; border-bottom: 1px solid #999 !important; }
}

/* ---- 1.17.0 siparis ekrani (BSD21; kullanici: "bosluklari doldur, stok durumu simgesini toplam tutarin icine al, odemeler kismi cok
   basit kalmis"). Kutular icerik kadar (yukseklik sayfada hesaplanir), Odemeler kutusu 300 px: odeme turleri simgeli, tutarlar saga
   yasli ve kalin, sifir tutarlar soluk, bakiye renkli kutuda; Stok Durumu toplamlarin icinde. Odemeler sekmesi: ustte odeme ozeti
   (siparis tutari, odenen, kalan, doluluk cubugu), simgeli buyuk odeme turu dugmeleri, formlar kutu icinde. ---- */
.zsd { width: 1192px; }
.zsd .zl.zli { display: flex; align-items: center; gap: 7px; }
.zsd .zl.zli svg { width: 16px; height: 16px; flex: none; }
.zsd .zf.amt { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--b-ink); }
.zsd .zf.amt.zero { color: #9a9087; font-weight: 400; }
.zsd .zf.amt.balok { background: #e2f0e4; border-color: #a9d2b3; color: #1e7a3c; }
.zsd .zf.amt.balbad { background: #fae1dc; border-color: #eaa79c; color: #b8342a; }
.zsd .zl.zbal { font-weight: 800; }
.zsd .zbtn.zstock { height: 28px; gap: 8px; border: 1px solid #d0b08a; border-radius: 9px; background: linear-gradient(180deg, #fdf8f1, #f0e2cf);
  color: var(--b-ink); font-family: var(--b-font-d); font-size: 13px; font-weight: 700; box-shadow: 0 1px 2px rgba(35, 28, 20, .08); }
.zsd .zbtn.zstock:hover { background: linear-gradient(180deg, #fffaf4, #f4e5d0); border-color: var(--b-copper); }
.zsd .zbtn.zstock svg { width: 18px; height: 18px; }
.paysum { display: grid; grid-template-columns: repeat(3, minmax(150px, max-content)) minmax(160px, 1fr); align-items: center; gap: 6px 26px;
  margin: 0 0 10px; padding: 10px 16px; background: linear-gradient(135deg, #fbf4ea, #efe0cb); border: 1px solid var(--b-line); border-radius: 12px;
  box-shadow: var(--b-shadow); }
.paysum .ps span { display: block; font-size: 12px; color: var(--b-text3); }
.paysum .ps b { display: block; font-family: var(--b-font-d); font-size: 18px; font-weight: 800; color: var(--b-ink); font-variant-numeric: tabular-nums; }
.paysum .ps b::after { content: " TL"; font-size: 12px; font-weight: 600; color: var(--b-text3); }
.paysum.due .ps.rest b { color: #b8342a; }
.paysum.done .ps.rest b { color: #1e7a3c; }
.paysum .psbar { height: 10px; border-radius: 6px; background: #e3d4c0; overflow: hidden; box-shadow: inset 0 1px 2px rgba(35, 28, 20, .12); }
.paysum .psbar i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, #c56d2e, #f0a020); }
.paysum.done .psbar i { background: linear-gradient(90deg, #2c7a52, #49a56f); }
.payentry { padding: 12px 14px; border: 1px solid var(--b-line); border-radius: 12px; box-shadow: var(--b-shadow); }
.paykinds { gap: 8px; margin-bottom: 12px; }
.paykinds button { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 6px 18px; border: 1px solid var(--b-line); border-radius: 11px;
  background: linear-gradient(180deg, #fdf9f3, #f1e6d7); color: var(--b-ink); font-family: var(--b-font-d); font-size: 13.5px; font-weight: 700;
  box-shadow: 0 1px 2px rgba(35, 28, 20, .06); }
.paykinds button svg { width: 20px; height: 20px; flex: none; }
.paykinds button:hover:not(.act) { border-color: #c99b6e; background: #fffaf3; color: var(--b-ink); }
.paykinds button.act { background: var(--b-grad); border-color: #a65420; color: #fff; box-shadow: 0 3px 10px rgba(176, 90, 32, .28); }
.paykinds button.act svg { filter: brightness(0) invert(1); }
.payform:not(.senetform) { padding: 12px 14px; background: #f5ece0; border: 1px solid #e2d3bf; border-radius: 10px; }
.payform:not(.senetform) .inp { height: 30px; font-size: 14px; }
.payform .btn { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; }
.payform .btn svg { width: 16px; height: 16px; }
table.paylist td.pkn { white-space: nowrap; }
/* ekrana sigdirma (1.18.0): olculu blok (siparis ekrani) pencere genisligine gore beep.js ile olceklenir ve ortalanir */
[data-fit] { margin-left: auto; margin-right: auto; }
.zfit .zsd { margin-left: 0; }
@media print { [data-fit] { zoom: 1 !important; width: auto !important; } }
table.paylist td.pkn svg { width: 16px; height: 16px; vertical-align: -3px; margin-right: 7px; }
/* siteden urun aktarma (1.22.0): marka dugmeleri, urun gorselleri, kaynak siteler ve deneme; Stok Durumu gorsel kutusu (1.22.1: sabit boy,
   secim alani kadar yuksek, ad en cok iki satir; ad uzayip kisalinca kutu buyuyup kuculuyor, liste kayiyor, fare baska satira geciyordu); malzeme gorseli */
.impchips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.impchips .bp-chip { text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.impchips .bp-chip small { opacity: .75; font-size: 11px; }
.impchips .bp-chip.off { opacity: .6; }
.impq { margin-top: 8px; }
.impstate { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
table.alv td.imgc { width: 52px; padding: 2px 4px !important; text-align: center; }
table.alv td.imgc img { width: 44px; height: 44px; object-fit: contain; background: #fff; border-radius: 4px; display: block; margin: auto; }
.stkimg { flex: 0 0 auto; align-self: stretch; width: 190px; margin-left: auto; padding: 8px !important; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.stkimg a, .stkimg-yok { position: relative; flex: 1 1 auto; display: flex; align-items: center; justify-content: center; width: 172px; min-height: 96px; background: #fff; border-radius: 6px; overflow: hidden; }
.stkimg a[hidden], .stkimg-yok[hidden] { display: none; }
.stkimg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.stkimg-yok { flex-direction: column; gap: 6px; color: var(--fl-fg3); }
.stkimg-yok svg { width: 40px; height: 40px; opacity: .45; }
.stkimg-ad { flex: 0 0 auto; width: 172px; height: 2.5em; font-size: 11.5px; text-align: center; line-height: 1.25; overflow: hidden; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.matimg .gb { display: flex; justify-content: center; }
.matimg a { display: flex; align-items: center; justify-content: center; width: 100%; height: 220px; background: #fff; border-radius: 6px; overflow: hidden; }
.matimg img { max-width: 100%; max-height: 220px; object-fit: contain; }
.matimg-yok { display: flex; align-items: center; gap: 8px; color: var(--fl-fg3); padding: 6px 0; }
.matimg-yok svg { width: 22px; height: 22px; opacity: .5; }
.siteform textarea.inp { width: 520px; max-width: 100%; height: 56px; resize: vertical; font-family: inherit; }
.sitetest ul { list-style: none; margin: 0; padding: 0; }
.sitetest li { padding: 3px 0 3px 22px; position: relative; overflow-wrap: anywhere; }
.sitetest li::before { content: ""; position: absolute; left: 5px; top: 9px; width: 9px; height: 9px; border-radius: 50%; background: #8a8f98; }
.sitetest li.S::before { background: #2e8540; }
.sitetest li.W::before { background: #d97706; }
.sitetest li.E::before { background: #c42b1c; }
.sitesample { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; margin-top: 8px; }
.sitesample img { width: 160px; height: 160px; object-fit: contain; background: #fff; border-radius: 6px; border: 1px solid var(--fl-stroke2); }
.sitesample dl { display: grid; grid-template-columns: auto 1fr; gap: 3px 12px; margin: 0; }
.sitesample dt { color: var(--fl-fg3); }
.sitesample dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 900px) { .stkimg { margin-left: 0; } }
@media (max-width: 900px) {
  .zsd .zbtn.zstock { height: 42px; }
  .paysum { grid-template-columns: 1fr 1fr 1fr; gap: 6px 10px; padding: 10px 12px; }
  .paysum .psbar { grid-column: 1 / -1; }
  .paysum .ps b { font-size: 16px; }
  .paykinds button { flex: 1 1 auto; justify-content: center; }
}

/* ---- 1.19.0 Eksik ve Ariza Takibi (BSDSV; kullanici: "islemleri anlasilir hale getir, kullanisli bir sistem yap, erisilebilir olsun").
   Kayit ekraninda ustte durum ve islemler: asama cizgisi (Kayit alindi -> Serviste -> Tamamlandi), siradaki is buyuk dugme, diger adimlar,
   iptal (kirmizi cerceve), not; musteriye bildirme, servis formu, yetkili servis cagrisi. Listede bolum ve durum tek tikla dugmeler,
   satirda siradaki adim dugmesi. ---- */
.svflow { display: grid; gap: 12px; margin: 0 0 12px; padding: 12px 16px; background: var(--b-panel); border: 1px solid var(--b-line);
  border-radius: 12px; box-shadow: var(--b-shadow); }
.svf-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; }
.svsteps { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; margin: 0; padding: 0; list-style: none; }
.svsteps li { display: flex; align-items: center; gap: 9px; }
.svsteps li + li::before { content: ""; width: 46px; height: 3px; margin: 0 12px 0 4px; border-radius: 2px; background: #d8ccbb; }
.svsteps li.done + li::before { background: linear-gradient(90deg, #2c7a52, #49a56f); }
.svsteps .dot { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 50%; border: 2px solid #d8ccbb;
  background: #ece2d4; color: #8a8178; font-family: var(--b-font-d); font-size: 13px; font-weight: 800; }
.svsteps li.done .dot { background: #2c7a52; border-color: #2c7a52; color: #fff; }
.svsteps li.cur .dot { background: var(--b-grad); border-color: #a65420; color: #fff; box-shadow: 0 0 0 4px rgba(197, 109, 46, .18); }
.svsteps li.done.cur .dot { background: #2c7a52; border-color: #2c7a52; box-shadow: 0 0 0 4px rgba(44, 122, 82, .18); }
.svsteps b { display: block; font-family: var(--b-font-d); font-size: 13.5px; font-weight: 700; color: var(--b-ink); }
.svsteps li:not(.done):not(.cur) b { color: #8a8178; }
.svsteps small { display: block; min-height: 14px; font-size: 11.5px; color: var(--b-text3); }
.svflow.iptal .svsteps { opacity: .5; }
.svf-info { display: flex; flex-wrap: wrap; gap: 6px; }
.svf-act, .svf-com { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.svf-act { padding-top: 12px; border-top: 1px solid var(--b-line2); }
.svf-act .btn, .svf-com .btn { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 14px; font-weight: 600; text-decoration: none; }
.svf-act .btn svg, .svf-com .btn svg { width: 18px; height: 18px; flex: none; }
.svf-act .btn.big { min-height: 40px; padding: 0 20px; font-family: var(--b-font-d); font-size: 14px; font-weight: 800; }
.svf-act .btn.primary svg { filter: brightness(0) invert(1); }
.svf-act .btn.danger { border-color: #e2a39b; background: #fdf3f1; color: #b8342a; }
.svf-act .btn.danger:hover { border-color: #b8342a; background: #fae1dc; }
.svf-note { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; }
.svf-note .inp { width: 260px; height: 30px; }
.svf-note .lbl { min-width: 0; width: auto; margin: 0; }
.svchips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; }
.svchips .lbl { min-width: 54px; margin-right: 2px; }
.svchips .bp-chip { text-decoration: none; }
.svchips .bp-chip.act { color: #fff; }
.svfilt { margin-top: 2px; }
td.svact { white-space: nowrap; }
td.svact form { margin: 0; }
td.svact .btn { min-height: 0; padding: 2px 10px; font-size: 12px; font-weight: 700; }
@media (max-width: 900px) {
  .svsteps li + li::before { width: 16px; margin: 0 6px 0 2px; }
  .svf-note { width: 100%; margin-left: 0; }
  .svf-note .inp { flex: 1; width: auto; }
}

/* ---- 1.20.0 olcekleme ve liste duzeni. Olcekleme (kullanici: "olcekleme hala duzgun degil, SAP nasil kullaniyor"): SAP gibi yazi
   buyutulmez, butun ekranlar ayni boyda. Siparis ekraninin ust kutulari pencere genisledikce yaziyi buyutmeden yayilir: etiket sutunu
   yerinde, Baslik bilgileri kutusunun alanlari genislige oranli (--zk: 1192 px'te 1), Odemeler kutusu sagda sabit 300 px; kalemler tam
   genislik. Pencere 1200 px'ten darsa blok kuculur (beep.js beepFit). Liste: kolon basligi surukleyerek tasinir (hayalet baslik, bakir
   yerlestirme cizgisi, tasinan kolon soluk). ---- */
.zsd { width: auto; --zk: calc((100% - 491px) / 701); }      /* 491 = 300 Odemeler + 182 etiket sutunu + 9 bosluk; 701 = 892 - 191 */
.zitems .alv-scroll { max-width: none; }
#t_items { max-width: none; }
.colmenu { position: fixed; z-index: 4100; min-width: 200px; padding: 5px; border-radius: 10px; background: var(--b-panel); border: 1px solid var(--b-line);
  box-shadow: 0 14px 34px rgba(20, 16, 12, .25); }
.colmenu button { display: block; width: 100%; padding: 7px 12px; border: 0; border-radius: 7px; background: none; color: var(--b-ink); text-align: left;
  font: 600 13px var(--b-font-d); cursor: pointer; white-space: nowrap; }
.colmenu button:hover:not(:disabled), .colmenu button:focus-visible { background: var(--b-hover); outline: none; }
.colmenu button:disabled { color: #a39a90; cursor: default; }
.colmenu hr { margin: 4px 6px; border: 0; border-top: 1px solid var(--b-line2); }
table.alv thead th.sortable { cursor: pointer; }
body.coldragging, body.coldragging * { cursor: grabbing !important; user-select: none !important; }
table.alv th.coldrag, table.alv td.coldrag { opacity: .4; }
table.alv thead th.coldrag { opacity: .55; outline: 2px dashed #c56d2e; outline-offset: -3px; }
.colghost { position: fixed; z-index: 4000; pointer-events: none; max-width: 280px; padding: 6px 12px; border-radius: 9px; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; background: linear-gradient(180deg, #3b3e45, #2b2e34); color: #f4ede3; border: 1px solid #c56d2e;
  font: 700 12.5px var(--b-font-d); box-shadow: 0 12px 28px rgba(20, 16, 12, .32); }
.coldrop { position: fixed; z-index: 3999; pointer-events: none; width: 3px; border-radius: 2px; background: #c56d2e; box-shadow: 0 0 0 3px rgba(197, 109, 46, .22); }
.coldrop::before, .coldrop::after { content: ""; position: absolute; left: -4.5px; border: 6px solid transparent; }
.coldrop::before { top: -3px; border-top-color: #c56d2e; }
.coldrop::after { bottom: -3px; border-bottom-color: #c56d2e; }
.coldrop.same { opacity: .3; }

@media (max-width: 900px) {
  html, body { height: auto; }
  html { overflow-x: hidden; }
  body { display: block; overflow: visible; min-height: 100vh; font-size: 15px; -webkit-text-size-adjust: 100%; }
  /* menu bandi ustte durur; acilan menuler ekran genisliginde */
  .menubar { position: sticky; top: 0; z-index: 60; height: auto; min-height: 46px; flex-wrap: wrap; padding: 0 4px; }
  .menubar .brand { margin-right: 4px; padding: 10px 4px; }
  .menubar .m { padding: 13px 9px; }
  .menubar .right { display: none; }
  .menubar .dd { position: fixed; left: 6px; right: 6px; top: 48px; min-width: 0; max-height: 75vh; overflow-y: auto; }
  .menubar .dd a { padding: 13px 16px; font-size: 16px; }
  .menubar .dd kbd { display: none; }
  /* sistem ve uygulama dugmeleri: tek satir, sigmayan yana kayar */
  .systoolbar { height: auto; min-height: 46px; gap: 4px; overflow-x: auto; }
  .systoolbar .ib { flex: none; min-width: 42px; height: 40px; }
  .titlebar { font-size: 17px; white-space: normal; padding: 8px 12px; }
  .apptoolbar { flex-wrap: nowrap; overflow-x: auto; gap: 6px; padding: 6px 8px; scrollbar-width: none; }
  .apptoolbar::-webkit-scrollbar { display: none; }
  .apptoolbar .ib, .apptoolbar .btn { flex: none; min-height: 40px; }
  .apptoolbar .sep { display: none; }
  .workarea, .workarea.home { overflow: visible; padding: 8px 8px 16px; }
  .statusbar { position: sticky; bottom: 0; z-index: 55; height: auto; min-height: 30px; }
  .statusbar .sbclock, .statusbar .sbcode { display: none; }
  .statusbar .msg { white-space: normal; padding: 5px 10px; }
  /* form alanlari: etiket ustte, alan tam genislik; yazi 16 px (iPhone odaklaninca sayfayi buyutmesin) */
  .form, .form.two { grid-template-columns: minmax(0, 1fr); row-gap: 3px; }
  .form > .lbl { padding-top: 8px; }
  .form > span:empty { display: none; }
  .lbl, .sl, .sll, .sl2 { min-width: 0; white-space: normal; }
  .inp, select.inp, textarea.inp, .workarea input, .workarea select, .workarea textarea { font-size: 16px; max-width: 100%; }
  .inp, select.inp { height: 38px; }
  textarea.inp { height: auto; }
  .form .inp, .form select.inp, .form textarea.inp { width: 100%; }
  .btn { min-height: 38px; }
  /* secim kutulari ve satirlari: alt alta */
  .workarea [style*="nowrap"] { flex-wrap: wrap !important; }
  .workarea .sg, .workarea .sbox { flex: 1 1 100% !important; min-width: 0 !important; width: auto !important; max-width: 100%; }
  .sr, .selrow { flex-wrap: wrap; }
  .sr > .sl, .sr > .sll, .selrow > .sll { flex: 1 1 100%; width: auto !important; padding-top: 4px; }
  .sl2 { margin-left: 0; }
  .selrow select.inp { min-width: 0; }
  .group > .gb { padding: 10px; overflow-x: auto; }
  /* listeler: sayfayla kayar; genis tablo kendi icinde yana kayar; satirlar dokunmaya uygun */
  .alv-scroll, .alv-wrap[data-fill] .alv-scroll { max-height: none !important; height: auto !important; overflow-x: auto; overflow-y: visible; }
  table.alv th, table.alv td { padding: 10px 9px; }
  .alv-bar { flex-wrap: wrap; }
  .tabs { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; } .tabs button { flex: none; padding: 10px 14px; }
  .tabpane { padding: 10px; overflow-x: auto; }
  .bp-kpis, .cards { grid-template-columns: 1fr 1fr; gap: 8px; }
  .bp-kpi { padding: 10px; gap: 8px; }
  .charts, .svgrid { grid-template-columns: minmax(0, 1fr); }
  .dlbar { gap: 6px 10px; }
  /* pencereler: onay ve mesaj pencereleri ekran genisliginde, BEAP penceresi (F4, siparisten Stok Durumu, musteri ekle) tam ekran */
  .modal-bg { padding: 10px; align-items: center; }
  .modal, #beepdlg .modal { min-width: 0; width: 100%; max-width: 100%; max-height: 92vh; }
  #beepwin { padding: 0; }
  #beepwin .modal.win { width: 100% !important; height: 100% !important; max-height: 100%; border-radius: 0; }
  /* ana menu: agac ustte, gosterge paneli altta */
  .ea { display: block; height: auto; }
  .ea-nav { width: auto !important; min-width: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .ea-split { display: none; }
  .tree { overflow: visible; font-size: 17px; }
  .tree .node { padding: 11px 8px; }
  .ea-main { padding: 10px 8px; }
  /* siparis ekrani: olculu duzen yerine sirali akis (etiket ustte, alanlar yan yana sigdigi kadar), Odemeler kutusu altta */
  .zsd { position: static; width: auto !important; height: auto !important; margin: 0 0 10px; display: flex; flex-wrap: wrap; align-items: center;
         gap: 4px 6px; padding: 2px 10px 10px; background: #fff; border: 1px solid var(--b-line); border-radius: var(--b-r); }
  .zsd > * { position: static !important; }
  .zsd .zbox { flex: 1 1 100%; width: auto !important; height: auto !important; border: 0; box-shadow: none; background: none; }
  .zsd .zbt { position: static; display: block; height: auto; line-height: 1.3; margin: 10px 0 0; padding-bottom: 5px; font-size: 15px; }
  .zsd .zl { flex: 1 1 100%; width: auto !important; height: auto; line-height: 1.3; border-bottom: 0; margin-top: 6px; font-size: 13px; color: #4a5866; }
  .zsd .zf { flex: 1 1 150px; width: auto !important; min-width: 0; height: 38px; font-size: 16px; }
  .zsd .zb { flex: none; width: 38px; height: 38px; }
  .zsd .zbtn { flex: 1 1 100%; width: auto !important; height: 42px; margin-top: 10px; }
  .zsd .zsep { flex: 1 1 100%; width: auto !important; margin: 6px 0 2px; }
  .zsd .zl:has(+ .zf.amt) { flex: 1 1 50%; margin-top: 0; font-size: 14px; color: var(--text); }
  .zsd .zf.amt { flex: 1 1 40%; height: 32px; }
  .zsdtabs { margin-left: 0 !important; }
  #t_items, .zitems .alv-scroll { width: auto !important; max-width: 100%; }
  .zitems { flex-direction: column; }
  .zitems .itemside { flex-direction: row; width: auto; padding: 0 0 6px; }
  .zitems .itemside .ib { width: 40px; height: 40px; }
  #t_pay .paygrid, #t_pay .payhead { max-width: 100%; overflow-x: auto; }
  /* masaustu kutu genislikleri telefonda gecmez: satir ici en kucuk genislik ve esneklik, yan yana sutunlar alt alta; kutu ekrani asmaz,
     sigmayan icerik (genis tablo) kutunun icinde yana kayar */
  .workarea [style*="min-width:"]:not(table) { min-width: 0 !important; }
  .workarea [style*="flex:0"], .workarea [style*="flex:1"], .workarea [style*="flex:2"] { flex: 1 1 100% !important; max-width: 100%; }
  .beapcol, .opt-main, .matmain, .matside, .lbitems { flex: 1 1 100%; min-width: 0; }
  .snwrap, .sysgrid, .qtgrid { grid-template-columns: minmax(0, 1fr); }
  .workarea [style*="display:flex"] { flex-wrap: wrap; }
  .workarea .group, .workarea .sg, .workarea .sbox, .workarea .bp-card { max-width: 100%; overflow-x: auto; }
  .workarea table.alv:not(.alv-scroll table), .workarea table.csgrid { display: block; max-width: 100%; min-width: 0 !important; overflow-x: auto; }
  /* teslimat takvimi: gunler alt alta (gun adiyla), ay gorunumunde aya ait olmayan gunler yok; bekleyen siparisler altta */
  .tk-wrap, .tk-grid { grid-template-columns: minmax(0, 1fr); }
  .tk-wd, .tk-day.out { display: none; }
  .tk-grid.week .tk-day, .tk-grid.month .tk-day { min-height: 0; }
  .tk-day .dh { padding: 8px 10px; } .tk-day .dh .dd { display: none; } .tk-day .dh .dw { display: inline; text-transform: capitalize; }
  .tkc { font-size: 14px; padding: 8px 10px; }
  .tk-side { max-height: none; }
  /* sistem dugmeleri (Kaydet, Geri) sayfa kayinca da menu bandinin altinda durur (--mbh: menu bandinin yuksekligi, beep.js) */
  .systoolbar { position: sticky; top: var(--mbh, 46px); z-index: 59; }
  /* siparis kalemleri, odeme satirlari, sepet: 16 px yazi (iPhone dokununca sayfayi buyutmesin), dokunmaya uygun yukseklik;
     bos satirlardan ikisi gorunur (Enter'dan sonra yenileri gelir), goruntuleme ekraninda bos satir yok */
  #items input.cell, #items select.cell, #t_pay .paygrid input.cell, .zmm-bgrid input.cell, table.beaplist input.cell { font-size: 16px !important; height: 34px; }
  #items tr.filler ~ tr.filler ~ tr.filler { display: none; }
  #items tr.filler:not(:has(input)) { display: none; }
  #scan { font-size: 16px !important; height: 40px !important; }
  /* kutu icinde yana tasan alanlar: etiket ustte, alan tam genislik, satirlar alta kayar */
  .snf { grid-template-columns: minmax(0, 1fr); gap: 2px 8px; }
  .ksform { min-width: 0; padding-left: 10px; }
  .snfhist, .bp-modal .mb .form { min-width: 0; }
  .csviews { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0 0; }
  .csviews label { height: auto; padding: 7px 10px; }
  .tf-act { flex-wrap: wrap; } .tf-act .inp { flex: 1 1 100%; }
  .workarea [style*="display:flex"] > * { min-width: 0; max-width: 100%; }
  .hbars .hb { grid-template-columns: minmax(0, 38%) minmax(0, 1fr) auto; }
  /* arama yardimi penceresi: arama kutusu Ara dugmesiyle ayni satira sigar */
  .f4q .inp { flex: 1 1 auto; min-width: 0; width: auto; }
  /* yetkili servis cagrisi: bilgiler ve cagri kutusu alt alta */
  .cgwrap > .cgdata, .cgside { flex: 1 1 100%; }
  table.cgtab td.l { width: auto; white-space: normal; }
}
/* dokunmatik ekran: acilir liste satirlari ve takvim gunleri parmakla secilecek buyuklukte */
@media (pointer: coarse) {
  .beepdrop .bd-i { line-height: 22px; min-height: 40px; padding: 9px 12px; font-size: 16px; }
  .beepcal { padding: 6px; font-size: 16px; }
  .beepcal .bc-h button { width: 40px; height: 36px; font-size: 16px; }
  .beepcal th { width: 38px; height: 30px; }
  .beepcal td { width: 38px; height: 40px; }
  .beepcal th.wk, .beepcal td.wk { width: 30px; font-size: 12px; }
  .beepcal .bc-f .btn { height: 38px; padding: 0 16px; }
  /* yetkili servis cagrisi: yer isareti (BEAP'ten Doldur) telefonda kullanilmaz */
  .cgbm { display: none; }
}