/* Dashboard custom styles — what Tailwind can't (or shouldn't) do inline. */

/* Subtle scrollbars */
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.3);
  border-radius: 9999px;
  border: 2px solid transparent;
  background-clip: content-box;
}
.dark *::-webkit-scrollbar-thumb { background: rgba(71, 85, 105, 0.5); background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, 0.55); background-clip: content-box; }
.dark *::-webkit-scrollbar-thumb:hover { background: rgba(100, 116, 139, 0.7); background-clip: content-box; }

/* HTMX request indicator on filter form */
.htmx-request #filters,
#filters.htmx-request { opacity: 0.7; pointer-events: none; }
.htmx-request #students-table-wrap,
#students-table-wrap.htmx-request { opacity: 0.6; transition: opacity 120ms; }

/* Fade-in for inserted partials */
[hx-swap-oob], .htmx-added { animation: fadein 220ms ease-out; }
@keyframes fadein {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Tabular number alignment for stat counters */
[data-counter] { font-variant-numeric: tabular-nums; }

/* Modal animations */
#modal:not(.hidden) [data-modal-backdrop] { animation: modal-fade 160ms ease-out; }
#modal:not(.hidden) [data-modal-card]     { animation: modal-pop 220ms cubic-bezier(.16,1,.3,1); }
@keyframes modal-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes modal-pop  {
  from { opacity: 0; transform: scale(0.96) translateY(4px); }
  to   { opacity: 1; transform: scale(1)   translateY(0);   }
}