/* Tiny custom layer on top of Tailwind CDN */
html, body { background: #f5f6fa; color: #1f2937; font-family: Inter, ui-sans-serif, system-ui, sans-serif; }

.card { background: #fff; border-radius: 0.75rem; border: 1px solid #e5e7eb; box-shadow: 0 1px 2px rgba(0,0,0,0.04); }
.btn { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border-radius: 0.5rem; font-size: 0.875rem; font-weight: 500; transition: background-color .15s; text-decoration: none; cursor: pointer; border: none; }
.btn-primary { background: #1e2a78; color: #fff; }
.btn-primary:hover { background: #16205c; }
.btn-ghost { background: #f1f5f9; color: #475569; }
.btn-ghost:hover { background: #e2e8f0; }
.btn-danger { background: #fff1f2; color: #be123c; }
.btn-danger:hover { background: #ffe4e6; }
.input { width: 100%; border: 1px solid #cbd5e1; background: #fff; padding: 0.5rem 0.75rem; border-radius: 0.5rem; font-size: 0.875rem; }
.input:focus { outline: none; box-shadow: 0 0 0 3px rgba(30,42,120,0.18); border-color: #1e2a78; }
.label { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; }

table.data { width: 100%; font-size: 0.875rem; border-collapse: collapse; }
table.data th { text-align: left; font-weight: 600; color: #475569; padding: 0.5rem 0.75rem; border-bottom: 1px solid #e2e8f0; background: #f8fafc; }
table.data td { padding: 0.5rem 0.75rem; border-bottom: 1px solid #f1f5f9; }
table.data tr:hover td { background: #f8fafc; }

/* Horizontal scroll for tables on narrow screens — card clips overflow, so scroll inside */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-scroll table.data { min-width: 640px; }
.table-scroll.wide table.data { min-width: 960px; }

.pager-btn { display: inline-flex; align-items: center; padding: 0.25rem 0.625rem; border-radius: 0.375rem; font-size: 0.8125rem; font-weight: 500; color: #475569; background: #fff; border: 1px solid #e2e8f0; text-decoration: none; }
.pager-btn:hover { background: #f1f5f9; }
.pager-btn.active { background: #1e2a78; color: #fff; border-color: #1e2a78; }

.sidebar-link { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 1.25rem; font-size: 0.875rem; font-weight: 500; color: #475569; text-decoration: none; }
.sidebar-link:hover { background: #f8fafc; }
.sidebar-link.active { background: rgba(30,42,120,0.05); color: #1e2a78; border-right: 2px solid #1e2a78; }

@media print {
  body { background: #fff !important; }
  .no-print, .sidebar, .topbar { display: none !important; }
  main { padding: 0 !important; max-width: none !important; }
  .card { box-shadow: none !important; border: 1px solid #cbd5e1 !important; }
}