/* ── Layout ───────────────────────────────────────────────────────────────── */
body { font-size: 0.9rem; background: #f5f6fa; }

/* Sidebar active link */
#sidebar .nav-link.active,
#sidebar .nav-link:hover { background: rgba(255,255,255,.12); border-radius: 4px; }
#sidebar .nav-link { padding: 0.4rem 1rem; transition: background .15s; }

/* Content gutter */
#main-content { padding: 0; }
#app { min-height: 100vh; }

/* ── Cards ───────────────────────────────────────────────────────────────── */
.card { border: none; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.card-header { background: #fff; border-bottom: 1px solid #eee; font-weight: 600; }

/* ── Tables ──────────────────────────────────────────────────────────────── */
.table th { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: #888; }
.table td { vertical-align: middle; }
.table-hover tbody tr:hover { background: #eef2ff; cursor: pointer; }

/* ── Badges ──────────────────────────────────────────────────────────────── */
.btn-xs { font-size: .72rem; padding: .1rem .4rem; line-height: 1.3; }

/* ── Forms ───────────────────────────────────────────────────────────────── */
.form-label { font-weight: 500; margin-bottom: .2rem; }
.form-control, .form-select { font-size: .87rem; }

/* ── Modal ───────────────────────────────────────────────────────────────── */
#modal-root .modal { display: block !important; }

/* ── Toast ───────────────────────────────────────────────────────────────── */
#toast-container .toast { min-width: 240px; font-size: .85rem; }

/* ── Spinner ─────────────────────────────────────────────────────────────── */
.spinner-border { width: 2.5rem; height: 2.5rem; }

/* ── Responsive: collapse sidebar on mobile ──────────────────────────────── */
@media (max-width: 767px) {
  #sidebar     { width: 100%; min-height: auto; position: relative; flex-direction: row; flex-wrap: wrap; }
  #main-content{ margin-left: 0; }
}