/* Base styles */
:root {
  --ring: 0 0 0 3px rgba(37, 99, 235, 0.35);
}
body { font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji'; }

.tab-btn { transition: background-color 0.2s ease; }

.tab-view.hidden { display: none; }

.kpi-card { background:#fff; border:1px solid #e5e7eb; border-radius:0.5rem; padding:1rem; }
.kpi-title { font-size:0.95rem; color:#6b7280; }
.kpi-value { font-size:1.5rem; font-weight:700; margin-top:0.25rem; }
.kpi-sub { font-size:0.85rem; color:#6b7280; }

.panel { background:#fff; border:1px solid #e5e7eb; border-radius:0.5rem; padding:1rem; }
.panel-title { font-weight:600; margin-bottom:0.5rem; }

.input { width:100%; border:1px solid #d1d5db; border-radius:0.375rem; padding:0.5rem 0.75rem; outline:none; }
.input:focus { box-shadow: var(--ring); border-color:#2563eb; }
.label { display:block; font-size:0.875rem; color:#374151; margin-bottom:0.25rem; }

.btn-primary { background:#2563eb; color:#fff; border-radius:0.375rem; padding:0.5rem 0.75rem; }
.btn-primary:hover { background:#1d4ed8; }
.btn-secondary { background:#6b7280; color:#fff; border-radius:0.375rem; padding:0.5rem 0.75rem; }
.icon-btn { color:#6b7280; }
.icon-btn:hover { color:#111827; }

.th { text-align:left; padding:0.5rem 0.75rem; font-weight:600; }
.td { padding:0.5rem 0.75rem; border-top:1px solid #e5e7eb; }

.modal { position:fixed; inset:0; background:rgba(0,0,0,0.45); display:flex; align-items:center; justify-content:center; padding:1rem; }
.modal-content { background:#fff; width:100%; max-width:720px; border-radius:0.5rem; padding:1rem; }

#toast { background:#111827; color:#fff; padding:0.75rem 1rem; border-radius:0.375rem; }