/* WCPA — base styles & mobile-first helpers */
* { -webkit-tap-highlight-color: transparent; }
body { font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }

/* Smooth fade for view transitions */
.view-enter { animation: fadein .2s ease; }
@keyframes fadein { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* Sidebar transition (mobile drawer) */
#sidebar { transition: transform .25s ease; }
@media (max-width: 768px) {
  #sidebar.closed { transform: translateX(-100%); }
}

/* Inputs */
.inp {
  width: 100%; padding: .55rem .75rem; border: 1px solid #cbd5e1; border-radius: .5rem;
  background: #fff; outline: none; font-size: .95rem;
}
.inp:focus { border-color: #2d5783; box-shadow: 0 0 0 3px rgba(45,87,131,.15); }
.label { display:block; font-size:.8rem; font-weight:600; color:#475569; margin-bottom:.25rem; }

.btn { display:inline-flex; align-items:center; gap:.4rem; padding:.55rem .9rem; border-radius:.5rem; font-weight:600; font-size:.9rem; cursor:pointer; transition:.15s; }
.btn-primary { background:#1e3a5f; color:#fff; }
.btn-primary:hover { background:#142840; }
.btn-ghost { background:#e2e8f0; color:#334155; }
.btn-ghost:hover { background:#cbd5e1; }
.btn-danger { background:#dc2626; color:#fff; }
.btn-danger:hover { background:#b91c1c; }

.card { background:#fff; border:1px solid #e2e8f0; border-radius:.75rem; }

/* Scrollbar */
::-webkit-scrollbar { width:8px; height:8px; }
::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:4px; }