/* Custom styles complementing Tailwind */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

* { font-family: 'Inter', sans-serif; }

/* Sidebar active */
.nav-link.active { background: rgba(255,255,255,0.15); }

/* Table hover */
tbody tr:hover { background-color: #f9fafb; }

/* Spinner */
.spinner {
  border: 3px solid #e5e7eb;
  border-top-color: #3b82f6;
  border-radius: 50%;
  width: 28px; height: 28px;
  animation: spin .7s linear infinite;
  margin: auto;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Badge */
.badge {
  display: inline-flex; align-items: center;
  padding: 2px 10px; border-radius: 999px;
  font-size: 0.75rem; font-weight: 500;
}
.badge-green  { background:#dcfce7; color:#166534; }
.badge-red    { background:#fee2e2; color:#991b1b; }
.badge-yellow { background:#fef9c3; color:#854d0e; }
.badge-blue   { background:#dbeafe; color:#1e40af; }
.badge-gray   { background:#f3f4f6; color:#374151; }

/* Card */
.stat-card {
  background: white;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}

/* Modal backdrop */
.modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.45);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000;
}
.modal-box {
  background: white;
  border-radius: 16px;
  padding: 2rem;
  width: 100%; max-width: 480px;
  max-height: 90vh; overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
}

/* Sidebar */
#sidebar { transition: transform .25s ease; }
@media (max-width: 768px) {
  #sidebar { transform: translateX(-100%); position: fixed; top:0; left:0; height:100%; z-index:200; }
  #sidebar.open { transform: translateX(0); }
}

/* Print */
@media print {
  #sidebar, #topbar, .no-print { display: none !important; }
  #main { margin: 0 !important; }
}