:root {
  --bg: #f6f7fb;
  --card: #ffffff;
  --text: #1f2430;
  --muted: #6b7280;
  --primary: #0d6efd;
  --border: #e5e7eb;
}

[data-theme="dark"] {
  --bg: #0b0e14;
  --card: #121723;
  --text: #e5e7eb;
  --muted: #9aa4b2;
  --primary: #4f8cff;
  --border: #1f2937;
}

html, body { height: 100%; }
body { background: var(--bg); color: var(--text); }

.app-shell { display:flex; min-height: 100vh; }
.sidebar {
  width: 260px; background: var(--card); border-right:1px solid var(--border);
  position: sticky; top:0; height:100vh; padding: 1rem;
}
.brand { font-weight: 800; letter-spacing:.3px; }
.nav-link { color: var(--text); opacity:.8; border-radius: 10px; }
.nav-link.active, .nav-link:hover { background: rgba(13,110,253,.08); opacity:1; }

.main { flex:1; padding: 1.25rem; }
.card {
  background: var(--card); border: 0; border-radius: 16px;
  box-shadow: 0 4px 18px rgba(0,0,0,.06);
}
.table { color: var(--text); }
.badge { border-radius: 999px; }
.kit { display:flex; gap:.5rem; }

.theme-toggle { border-radius:999px; }

/* Login */
.login-wrap { display:flex; align-items:center; justify-content:center; min-height:100vh; }
.login-card { width: 100%; max-width: 440px; }