:root{
  --brand:#0F766E; --brand-dark:#115E59; --brand-soft:#F0FDFA; --accent:#F59E0B;
  --ink:#0F172A; --muted:#64748B; --line:#E2E8F0; --bg:#F1F5F9; --card:#FFFFFF;
  --danger:#DC2626; --ok:#059669; --warn:#D97706;
  --radius:14px; --shadow:0 1px 2px rgba(15,23,42,.06),0 8px 24px -12px rgba(15,23,42,.18);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background:var(--bg); color:var(--ink); font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0;font-weight:650;letter-spacing:-.01em}

/* ---------------------------------------------------------------- layout */
.layout{display:flex;min-height:100vh}
.sidebar{
  width:250px;flex:0 0 250px;background:#0B1220;color:#CBD5E1;
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto;
}
.sidebar .brand{padding:17px 18px;border-bottom:1px solid rgba(255,255,255,.07);
  display:flex;align-items:center;gap:11px}
.sidebar .brand .brand-mark{flex:0 0 38px}
.sidebar .brand .brand-copy{min-width:0}
.sidebar .brand b{color:#fff;font-size:18px;display:block;letter-spacing:-.02em}
.sidebar .brand .brand-copy span{display:block;font-size:10px;color:#64748B;
  text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.sidebar .tenant{
  padding:12px 18px;border-bottom:1px solid rgba(255,255,255,.07);
  font-size:13px;color:#94A3B8
}
.sidebar .tenant b{display:block;color:#E2E8F0;font-size:14px}
.nav{padding:10px 10px 24px;flex:1}
.nav-group{margin-top:14px;padding:0 8px 6px;font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:#475569}
.nav a{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;
  color:#CBD5E1;font-size:13.5px;margin-bottom:2px
}
.nav a:hover{background:rgba(255,255,255,.06);color:#fff;text-decoration:none}
.nav a.active{background:var(--brand);color:#fff;font-weight:600}
.nav a .ic{width:18px;text-align:center;opacity:.9}
.nav a .badge{margin-left:auto;background:rgba(255,255,255,.14);border-radius:20px;
  padding:1px 8px;font-size:11px}
.nav a.danger{color:#FCA5A5}
.nav a.danger:hover{background:rgba(220,38,38,.18)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  background:#fff;border-bottom:1px solid var(--line);padding:14px 26px;
  display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:20
}
.topbar h1{font-size:19px;white-space:nowrap}
.topbar .spacer{flex:1}
.topbar select,.topbar input{max-width:210px}
.topbar .who{white-space:nowrap}
.topbar .who{font-size:13px;color:var(--muted);text-align:right;line-height:1.25}
.topbar .who b{display:block;color:var(--ink)}
.content{padding:22px 26px 60px}

/* ---------------------------------------------------------------- bileşen */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow)}
.card-head{padding:14px 18px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:12px}
.card-head h3{font-size:15px}
.card-head .spacer{flex:1}
.card-body{padding:18px}
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
@media(max-width:1200px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.g4,.g3,.g2{grid-template-columns:1fr}.sidebar{display:none}}

.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;
  box-shadow:var(--shadow);position:relative;overflow:hidden}
.stat .label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.stat .value{font-size:34px;font-weight:700;letter-spacing:-.03em;margin-top:6px}
.stat .foot{font-size:12px;color:var(--muted);margin-top:4px}
.stat.brand{background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;border:0}
.stat.brand .label,.stat.brand .foot{color:rgba(255,255,255,.8)}
.stat.alert{background:linear-gradient(135deg,#DC2626,#991B1B);color:#fff;border:0}
.stat.alert .label,.stat.alert .foot{color:rgba(255,255,255,.85)}

table{width:100%;border-collapse:collapse;font-size:13.5px}
th{
  text-align:left;padding:10px 14px;background:#F8FAFC;color:var(--muted);
  font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;
  border-bottom:1px solid var(--line);white-space:nowrap
}
td{padding:11px 14px;border-bottom:1px solid #F1F5F9;vertical-align:middle}
tbody tr:hover{background:#FAFCFE}
.table-wrap{overflow-x:auto}

.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;
  font-size:11.5px;font-weight:600;white-space:nowrap}
.pill.in{background:#DCFCE7;color:#166534}
.pill.out{background:#F1F5F9;color:#475569}
.pill.warn{background:#FEF3C7;color:#92400E}
.pill.red{background:#FEE2E2;color:#991B1B}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block}

.btn{
  display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:9px;
  border:1px solid var(--line);background:#fff;color:var(--ink);font-size:13px;
  font-weight:600;cursor:pointer;font-family:inherit;transition:.12s
}
.btn:hover{background:#F8FAFC;text-decoration:none}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-dark)}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn.sm{padding:5px 10px;font-size:12px;border-radius:7px}
.btn.block{width:100%;justify-content:center}

label{display:block;font-size:12.5px;font-weight:600;color:#334155;margin-bottom:5px}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],
input[type=datetime-local],input[type=search],input[type=tel],select,textarea{
  width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;
  font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink)
}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(15,118,110,.25);
  border-color:var(--brand)}
textarea{min-height:90px;resize:vertical}
.field{margin-bottom:14px}
.row{display:grid;gap:12px}
.row.c2{grid-template-columns:1fr 1fr}
.row.c3{grid-template-columns:1fr 1fr 1fr}
.row.c4{grid-template-columns:repeat(4,1fr)}
@media(max-width:760px){.row.c2,.row.c3,.row.c4{grid-template-columns:1fr}}
.check{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:#334155;
  margin-bottom:8px;cursor:pointer}
.check input{width:17px;height:17px;accent-color:var(--brand)}
.hint{font-size:12px;color:var(--muted);margin-top:4px}

.flash{padding:11px 16px;border-radius:10px;background:#ECFDF5;color:#065F46;
  border:1px solid #A7F3D0;margin-bottom:16px;font-size:13.5px}
.flash.err{background:#FEF2F2;color:#991B1B;border-color:#FECACA}

.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.filters .field{margin:0;min-width:150px}

/* modal */
.modal{position:fixed;inset:0;background:rgba(15,23,42,.55);display:none;z-index:100;
  align-items:flex-start;justify-content:center;padding:40px 16px;overflow-y:auto}
.modal.open{display:flex}
.modal .box{background:#fff;border-radius:16px;width:100%;max-width:720px;
  box-shadow:0 30px 60px -12px rgba(0,0,0,.35)}
.modal .box header{padding:16px 20px;border-bottom:1px solid var(--line);
  display:flex;align-items:center}
.modal .box header h3{font-size:16px;flex:1}
.modal .box .body{padding:20px;max-height:70vh;overflow-y:auto}
.modal .box footer{padding:14px 20px;border-top:1px solid var(--line);
  display:flex;gap:10px;justify-content:flex-end;background:#F8FAFC;
  border-radius:0 0 16px 16px}

/* grafik */
.chart{display:flex;align-items:flex-end;gap:10px;height:170px;padding-top:10px}
.chart .col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%}
.chart .bar{width:100%;background:linear-gradient(180deg,var(--brand),#14B8A6);
  border-radius:7px 7px 3px 3px;min-height:3px;position:relative;transition:.3s;margin-top:auto}
.chart .bar span{position:absolute;top:-19px;left:0;right:0;text-align:center;
  font-size:11px;font-weight:700;color:var(--ink)}
.chart .lbl{font-size:11px;color:var(--muted);white-space:nowrap}

.emptystate{padding:44px 20px;text-align:center;color:var(--muted)}
.emptystate .ico{font-size:34px;opacity:.35}

/* login */
.login-wrap{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr}
@media(max-width:900px){.login-wrap{grid-template-columns:1fr}.login-art{display:none}}
.login-art{background:linear-gradient(150deg,#0B1220,#0F766E 130%);color:#fff;
  padding:56px;display:flex;flex-direction:column;justify-content:center}
.login-art h2{font-size:34px;line-height:1.2;letter-spacing:-.03em;max-width:440px}
.login-art p{color:#94A3B8;max-width:420px;margin-top:14px;font-size:15px}
.login-art ul{margin-top:28px;padding:0;list-style:none;color:#CBD5E1;font-size:14px}
.login-art li{padding:7px 0 7px 26px;position:relative}
.login-art li:before{content:"✓";position:absolute;left:0;color:#2DD4BF;font-weight:700}
.login-form{display:flex;align-items:center;justify-content:center;padding:40px;background:#fff}
.login-form .inner{width:100%;max-width:360px}
.login-form .logo{font-size:26px;font-weight:700;letter-spacing:-.03em;color:var(--brand)}
.login-brand{display:flex;align-items:center;gap:12px}
.login-brand img{flex:0 0 48px}

.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}
.code-chip{display:inline-block;background:#0B1220;color:#5EEAD4;padding:5px 12px;
  border-radius:8px;letter-spacing:.18em;font-weight:700;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.muted{color:var(--muted)}
.small{font-size:12px}
.right{text-align:right}
.center{text-align:center}
.nowrap{white-space:nowrap}
.mt{margin-top:16px}
.mb{margin-bottom:16px}

@media print{
  .sidebar,.topbar,.no-print{display:none!important}
  body{background:#fff}
  .content{padding:0}
  .card{border:0;box-shadow:none}
}


/* Sürüm bilgisi */
.yan-surum{margin-top:auto;padding:14px 18px;font-size:11px;line-height:1.5;
  color:rgba(255,255,255,.45);letter-spacing:.02em}
.yan-surum span{display:block;color:rgba(255,255,255,.3)}
p.surum{margin-top:26px;font-size:11px;letter-spacing:.02em;opacity:.7}

/* Parola göster/gizle */
.parola-sarmal{position:relative;display:block}
.parola-sarmal input{width:100%;padding-right:44px}
.parola-goz{
  position:absolute;top:50%;right:6px;transform:translateY(-50%);
  width:34px;height:34px;display:grid;place-items:center;
  background:none;border:0;border-radius:8px;cursor:pointer;
  color:var(--muted);padding:0;
}
.parola-goz:hover{background:var(--bg);color:var(--ink)}
.parola-goz:focus-visible{outline:2px solid var(--brand);outline-offset:1px}


/* Panel dil seçici — kenar çubuğunun altında, çıkıştan sonra. */
.panel-diller { display: flex; gap: 6px; padding: 4px 14px 10px; }
.panel-diller .dil {
  flex: 1; text-align: center; padding: 6px 4px; border-radius: 8px;
  font-size: 12px; font-weight: 600; letter-spacing: .3px;
  color: var(--yan-metin, #94a3b8); background: rgba(255,255,255,.06);
  text-decoration: none; transition: background .15s, color .15s;
}
.panel-diller .dil:hover { background: rgba(255,255,255,.12); color: #fff; }
.panel-diller .dil.secili { background: var(--ana, #0F766E); color: #fff; }