:root{
  --xg-primary:#f5a623; --xg-primary-dark:#e0910f;
  --xg-dark:#1f2733; --xg-sidebar:#141b26; --xg-sidebar-active:#f5a623;
  --xg-bg:#f4f6fa; --xg-border:#e5e9f0;
}
*{box-sizing:border-box}
body{margin:0;font-family:'Segoe UI',system-ui,sans-serif;background:var(--xg-bg);color:#2b3442}

/* ===== Login ===== */
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#1f2733,#2c3a4d)}
.login-card{background:#fff;width:100%;max-width:380px;padding:36px 32px;border-radius:16px;
  box-shadow:0 20px 60px rgba(0,0,0,.3)}
.brand-logo{width:64px;height:64px;border-radius:16px;background:var(--xg-primary);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:28px}
.brand-logo.sm{width:36px;height:36px;font-size:18px;border-radius:9px}

/* ===== Layout ===== */
.app-wrapper{display:flex;min-height:100vh}
.sidebar{width:250px;background:var(--xg-sidebar);color:#c7d0dc;flex-shrink:0;
  display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:1030;transition:transform .25s}
.sidebar-brand{display:flex;align-items:center;gap:10px;padding:18px 20px;font-weight:700;font-size:18px;
  color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.sidebar-nav{padding:12px 10px;overflow-y:auto}
.sidebar-nav .nav-link{display:flex;align-items:center;gap:12px;color:#c7d0dc;padding:11px 14px;
  border-radius:9px;margin-bottom:3px;font-size:14.5px;text-decoration:none;transition:.15s}
.sidebar-nav .nav-link i{width:20px;text-align:center;font-size:16px}
.sidebar-nav .nav-link:hover{background:rgba(255,255,255,.06);color:#fff}
.sidebar-nav .nav-link.active{background:var(--xg-primary);color:#fff;font-weight:600}

.app-main{flex:1;margin-left:250px;display:flex;flex-direction:column;min-width:0}
.topbar{background:#fff;border-bottom:1px solid var(--xg-border);padding:12px 22px;
  display:flex;align-items:center;gap:14px;position:sticky;top:0;z-index:1020}
.topbar .page-title{font-weight:600}
#sidebarToggle{display:none}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--xg-primary);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-weight:700}
.content{padding:24px;flex:1}
.app-footer{padding:14px 24px;color:#8a94a6;font-size:13px;border-top:1px solid var(--xg-border);background:#fff}

/* ===== Kartalar ===== */
.stat-card{background:#fff;border-radius:14px;padding:18px 20px;border:1px solid var(--xg-border);
  display:flex;align-items:center;gap:16px;height:100%}
.stat-card .stat-icon{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;
  justify-content:center;font-size:22px;color:#fff;flex-shrink:0}
.stat-card .stat-value{font-size:22px;font-weight:700;line-height:1.1}
.stat-card .stat-label{color:#8a94a6;font-size:13px}
.bg-amber{background:var(--xg-primary)} .bg-blue{background:#3b82f6} .bg-green{background:#22c55e}
.bg-red{background:#ef4444} .bg-purple{background:#8b5cf6} .bg-teal{background:#14b8a6}
.bg-slate{background:#64748b}

.card{border:1px solid var(--xg-border);border-radius:14px}
.card-header{background:#fff;border-bottom:1px solid var(--xg-border);font-weight:600}
.table thead th{background:#f8fafc;color:#64748b;font-size:12.5px;text-transform:uppercase;
  letter-spacing:.3px;border-bottom:2px solid var(--xg-border)}
.table td{vertical-align:middle}
.btn-primary{background:var(--xg-primary);border-color:var(--xg-primary)}
.btn-primary:hover{background:var(--xg-primary-dark);border-color:var(--xg-primary-dark)}
.badge-active{background:#dcfce7;color:#16a34a} .badge-blocked{background:#fee2e2;color:#dc2626}

/* ===== Responsiv ===== */
@media(max-width:992px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.show{transform:translateX(0)}
  .app-main{margin-left:0}
  #sidebarToggle{display:inline-flex}
}