/* yonetimburada — tasarim sistemi */
:root{
  --bg:#F6F7F9; --surface:#FFFFFF; --line:#E4E7EC; --line-soft:#EEF0F4;
  --ink:#1B2432; --ink-2:#4A5566; --muted:#7A8496; --muted-2:#8A94A6; --faint:#98A1B0;
  --nav:#16233A; --nav-2:#1E2C45; --nav-3:#24344F; --nav-line:#22314B;
  --nav-ink:#A7B2C4; --nav-ink-2:#7C8AA1;
  --accent:#35618E; --accent-dark:#26496C; --accent-soft:#F1F5FA; --accent-line:#C9D6E4;
  --gold:#E9B44C;
  --ok:#2C7A5B; --ok-bg:#E8F3EC;
  --warn:#8A6420; --warn-bg:#FBF0DE;
  --bad:#B03A32; --bad-bg:#FBE9E7;
  --r:8px; --r-lg:10px;
  --sh:0 1px 2px rgba(20,30,50,.04);
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink);
  font-family:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:13.5px; line-height:1.45; -webkit-font-smoothing:antialiased;
}
a{color:var(--accent);text-decoration:none} a:hover{color:var(--accent-dark)}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.01em}
table{border-collapse:collapse;width:100%}

/* rakamlar: hizali, esit genislikte */
.num{font-family:'IBM Plex Mono',Menlo,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.right{text-align:right} .muted{color:var(--muted)} .faint{color:var(--faint)}
.pos{color:var(--ok)} .neg{color:var(--bad)} .wrn{color:var(--warn)}
.b{font-weight:600} .nowrap{white-space:nowrap}

/* ---- iskelet ---- */
.app{display:flex;min-height:100vh}
.side{width:248px;flex:none;background:var(--nav);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.side-brand{height:60px;display:flex;align-items:center;gap:9px;padding:0 16px;border-bottom:1px solid var(--nav-line);color:#fff;font-size:14.5px;font-weight:600}
.side-brand em{font-style:normal;color:var(--gold)}
.side-brand:hover{color:#fff;background:var(--nav-2)}
.side-site{margin:14px 12px 6px;background:var(--nav-2);border:1px solid #2A3B58;border-radius:var(--r);padding:9px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.side-site b{display:block;font-size:13px;color:#fff;font-weight:600}
.side-site span{font-size:11px;color:#8593AA}
.side-cap{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#6F7C92;padding:0 16px 7px}
.side-nav{display:flex;flex-direction:column;gap:2px;padding:10px 12px;overflow-y:auto}
.side-nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:7px;color:var(--nav-ink);font-size:13.5px;font-weight:500}
.side-nav a:hover{background:var(--nav-2);color:#DCE3EE}
.side-nav a.on{background:var(--nav-3);color:#fff}
.side-nav svg{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.side-sep{height:1px;background:var(--nav-line);margin:9px 4px}
.side-user{margin-top:auto;padding:12px;border-top:1px solid var(--nav-line);display:flex;align-items:center;gap:10px}
.side-user b{display:block;font-size:12.5px;color:#E7ECF3;font-weight:600}
.side-user span{font-size:11px;color:var(--nav-ink-2)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{height:60px;flex:none;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 22px;position:sticky;top:0;z-index:5}
.top h1{font-size:15.5px} .top .sub{font-size:11.5px;color:var(--muted);margin-top:1px}
.top-acts{display:flex;align-items:center;gap:10px}
.content{padding:22px;display:flex;flex-direction:column;gap:16px}

.avatar{width:34px;height:34px;border-radius:var(--r);background:var(--accent);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;flex:none}
.avatar.dim{background:#2A3B58;color:#D6DEEB;width:32px;height:32px}

/* ---- kartlar ---- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh)}
.card-p{padding:15px 17px}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.card-h h2{font-size:13px}
.card-h .note{font-size:11.5px;color:var(--muted-2)}

.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-main{grid-template-columns:minmax(0,1fr) 432px;align-items:start}
.stack{display:flex;flex-direction:column;gap:16px}
.row{display:flex;align-items:center;gap:9px}
.spacer{margin-left:auto}

.kpi{padding:14px 15px}
.kpi .k{font-size:11.5px;color:var(--muted);font-weight:500}
.kpi .v{font-size:26px;font-weight:600;margin-top:5px}
.kpi .f{font-size:11.5px;color:var(--muted);margin-top:9px}
.bar{height:4px;background:var(--line-soft);border-radius:3px;margin-top:10px;overflow:hidden}
.bar i{display:block;height:4px;background:var(--accent);border-radius:3px}

/* ---- tablo ---- */
.tbl th{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted-2);padding:12px 12px 10px;text-align:left;white-space:nowrap;background:#FBFCFD}
.tbl td{font-size:12.8px;padding:10px 12px;border-top:1px solid var(--line-soft);color:#28313F}
.tbl tbody tr:nth-child(even){background:#FAFBFC}
.tbl tbody tr:hover{background:var(--accent-soft)}
.tbl tfoot td{background:#FBFCFD;border-top:1px solid var(--line);font-weight:600;color:var(--ink-2)}
.tbl th.right,.tbl td.right{text-align:right}
.tbl th.orta,.tbl td.orta{text-align:center}
.tbl td.ayrac{border-left:1px solid var(--line-soft)}
.tbl th.ayrac{border-left:1px solid var(--line)}
.tbl tfoot td.right{text-align:right}
.tbl-wrap{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh);overflow:hidden}
.tbl-flat th{background:transparent;padding:0 0 9px}
.tbl-flat td{padding:9px 0}
.tbl-flat tbody tr:nth-child(even),.tbl-flat tbody tr:hover{background:transparent}
.sub{font-size:11px;color:var(--muted-2);margin-top:1px}

/* ---- rozet, buton, form ---- */
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:#EEF1F5;color:#5C6779;white-space:nowrap}
.chip-ok{background:var(--ok-bg);color:var(--ok)}
.chip-warn{background:var(--warn-bg);color:var(--warn)}
.chip-bad{background:var(--bad-bg);color:var(--bad)}

.btn{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:var(--r);border:1px solid transparent;background:var(--accent);color:#fff;cursor:pointer;font-family:inherit;line-height:1.2}
.btn:hover{background:var(--accent-dark);color:#fff}
.btn-ghost{background:var(--surface);color:var(--accent);border-color:var(--accent-line);font-weight:500}
.btn-ghost:hover{background:var(--accent-soft);color:var(--accent-dark)}
.btn-sm{padding:5px 11px;font-size:11.5px}
.btn-danger{background:var(--bad)} .btn-danger:hover{background:#8E2E27}

.field{display:flex;flex-direction:column;gap:5px}
.label{font-size:11.5px;font-weight:600;color:var(--ink-2)}
.input,.select,.textarea{font-family:inherit;font-size:13px;color:var(--ink);background:var(--surface);border:1px solid #E0E4EA;border-radius:var(--r);padding:8px 11px;width:100%}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(53,97,142,.12)}
.input.num,.input.right{text-align:right}
.hint{font-size:11px;color:var(--muted-2)}
.err{font-size:11.5px;color:var(--bad);margin-top:4px}

.filters{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.filter{display:flex;align-items:center;gap:7px;border:1px solid #E0E4EA;background:var(--surface);border-radius:var(--r);padding:7px 11px;font-size:12.5px;color:var(--ink-2)}
.filter.on{border-color:var(--accent-line);background:var(--accent-soft);color:var(--accent);font-weight:600}

.pager{display:flex;align-items:center;justify-content:space-between}
.pager .pgs{display:flex;align-items:center;gap:6px}
.pager a,.pager span{font-size:12.5px;color:var(--ink-2);border:1px solid #E0E4EA;background:var(--surface);padding:6px 12px;border-radius:7px}
.pager .cur{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}

.alert{border-radius:var(--r);padding:11px 14px;font-size:12.8px;border:1px solid}
.alert-ok{background:var(--ok-bg);border-color:#C6E2D1;color:#1F5C44}
.alert-bad{background:var(--bad-bg);border-color:#F0CBC7;color:#8E2E27}

.empty{padding:44px 20px;text-align:center;color:var(--muted)}
.empty b{display:block;font-size:14px;color:var(--ink);margin-bottom:5px}

/* ---- giris ekrani ---- */
.auth{min-height:100vh;display:flex}
.auth-side{width:44%;background:var(--nav);color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:space-between}
.auth-side h2{font-size:26px;line-height:1.3;font-weight:600;max-width:420px}
.auth-side p{color:#8593AA;font-size:13.5px;max-width:400px}
.auth-form{flex:1;display:flex;align-items:center;justify-content:center;padding:40px}
.auth-box{width:100%;max-width:360px;display:flex;flex-direction:column;gap:16px}

@media (max-width:1180px){ .g-main{grid-template-columns:minmax(0,1fr)} .g4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:900px){ .side{display:none} .auth-side{display:none} .content{padding:16px} }