/* =========================================================================
   SCORE — site-wide overrides
   Bootstrap 5.3.3 base + Bootstrap Icons 1.11
   ========================================================================= */

/* -- Design tokens -------------------------------------------------------- */
:root {
  --score-primary:    #4361ee;
  --score-primary-dk: #3a0ca3;
  --score-accent:     #7209b7;
  --score-surface:    #f8f9fb;
  --score-card-shadow: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
  --score-card-hover:  0 4px 12px rgba(0,0,0,.10);
  --score-radius:     .5rem;
  --score-transition: .2s ease;
}

/* -- Global --------------------------------------------------------------- */
body {
  background: var(--score-surface);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: #1e293b;
}

/* -- Navbar --------------------------------------------------------------- */
.navbar.score-nav {
  background: linear-gradient(135deg, var(--score-primary) 0%, var(--score-primary-dk) 100%) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
  padding-top: .65rem;
  padding-bottom: .65rem;
}
.navbar.score-nav .navbar-brand {
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: .03em;
}
.navbar.score-nav .nav-link {
  font-weight: 500;
  font-size: .9rem;
  transition: opacity var(--score-transition);
}
.navbar.score-nav .nav-link:hover { opacity: .85; }
.navbar.score-nav .nav-link .bi { margin-right: .3rem; font-size: .95em; }

/* -- Cards ---------------------------------------------------------------- */
.card {
  border: none;
  border-radius: var(--score-radius);
  box-shadow: var(--score-card-shadow);
  transition: box-shadow var(--score-transition), transform var(--score-transition);
}
.card:hover {
  box-shadow: var(--score-card-hover);
  transform: translateY(-2px);
}
.card .card-body { padding: 1.25rem 1.5rem; }
.card .card-title {
  font-weight: 700;
  font-size: 1.05rem;
  margin-bottom: .5rem;
}
.card .card-text {
  font-size: .88rem;
  color: #64748b;
  line-height: 1.55;
}
.card-icon {
  width: 44px; height: 44px;
  border-radius: .625rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  color: #fff;
  margin-bottom: .75rem;
  flex-shrink: 0;
}
.card-icon.bg-blue   { background: var(--score-primary); }
.card-icon.bg-purple { background: var(--score-accent); }
.card-icon.bg-teal   { background: #0d9488; }
.card-icon.bg-amber  { background: #d97706; }
.card-icon.bg-rose   { background: #e11d48; }
.card-icon.bg-green  { background: #16a34a; }

/* -- Page headers --------------------------------------------------------- */
.page-header {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1.25rem;
  width: 100%;
}
.page-header > div:first-child, .page-header > h2:first-child {
  margin-right: auto;
}
.page-header h2 {
  font-weight: 700;
  font-size: 1.5rem;
  margin: 0;
}
.page-header .subtitle {
  font-size: .88rem;
  color: #64748b;
  margin: .1rem 0 0 0;
}

/* -- Tables --------------------------------------------------------------- */
.table { font-size: .875rem; }
.table thead th {
  font-weight: 600;
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #64748b;
  border-bottom-width: 2px;
  white-space: nowrap;
  padding: .6rem .5rem;
}
.table-sm td, .table-sm th { padding: .4rem .5rem; }
.table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-striped-bg: rgba(67,97,238,.03);
}
.table-hover > tbody > tr:hover > * {
  --bs-table-hover-bg: rgba(67,97,238,.06);
}

/* -- Forms ---------------------------------------------------------------- */
label.form-label {
  font-weight: 600;
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #475569;
  margin-bottom: .25rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--score-primary);
  box-shadow: 0 0 0 .2rem rgba(67,97,238,.18);
}

/* -- Buttons -------------------------------------------------------------- */
.btn { font-size: .875rem; font-weight: 500; border-radius: .375rem; }
.btn-primary {
  background: var(--score-primary);
  border-color: var(--score-primary);
}
.btn-primary:hover, .btn-primary:focus {
  background: var(--score-primary-dk);
  border-color: var(--score-primary-dk);
}
.btn-outline-primary {
  color: var(--score-primary);
  border-color: var(--score-primary);
}
.btn-outline-primary:hover {
  background: var(--score-primary);
  border-color: var(--score-primary);
}

/* -- Badges / status ------------------------------------------------------ */
.badge { font-weight: 600; font-size: .75rem; letter-spacing: .02em; }
.badge-active   { background: #dcfce7; color: #166534; }
.badge-inactive { background: #fef2f2; color: #991b1b; }
.badge-admin    { background: #ede9fe; color: #5b21b6; }
.badge-user     { background: #e0f2fe; color: #075985; }
.badge-locked   { background: #fef2f2; color: #991b1b; }

/* Audit log action badges */
.badge-signin    { background: #dcfce7; color: #166534; }
.badge-signout   { background: #f0f9ff; color: #0369a1; }
.badge-fail      { background: #fef2f2; color: #991b1b; }
.badge-change    { background: #fefce8; color: #854d0e; }

/* -- Alerts --------------------------------------------------------------- */
.alert { font-size: .875rem; border-radius: var(--score-radius); }

/* -- Login card ----------------------------------------------------------- */
.login-card {
  max-width: 420px;
  margin: 3rem auto;
}
.login-card .card {
  border-top: 3px solid var(--score-primary);
}
.login-card .card-title {
  font-size: 1.25rem;
  text-align: center;
}
.login-brand {
  text-align: center;
  margin-bottom: 1rem;
}
.login-brand .bi {
  font-size: 2.5rem;
  color: var(--score-primary);
}

/* -- Footer --------------------------------------------------------------- */
.site-footer {
  font-size: .8rem;
  color: #94a3b8;
  border-top: 1px solid #e2e8f0;
  padding: 1rem 0;
  margin-top: 2rem;
}

/* -- Sortable (signature list, semesters) --------------------------------- */
.sortable-ghost { opacity: .4; background: #ffeb99; }
.sortable-chosen { background: #fff3cd; }
.drag-handle { cursor: grab; user-select: none; }
.drag-handle:active { cursor: grabbing; }

/* Signature list */
#sigList { list-style: none; padding-left: 0; }
#sigList li {
  padding: 0.5rem 0.75rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: .375rem;
  margin-bottom: .25rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  transition: box-shadow var(--score-transition);
}
#sigList li:hover { box-shadow: var(--score-card-shadow); }
#sigList li.drag-ghost { opacity: 0.4; }
#sigList .handle { cursor: grab; color: #94a3b8; font-size: 1.25rem; user-select: none; }
#sigList .sig-name { font-weight: 600; }
#sigList .sig-title { color: #64748b; font-size: .88rem; }

/* -- Student header ------------------------------------------------------- */
.student-header {
  background: linear-gradient(135deg, #ede9fe 0%, #e0f2fe 100%);
  padding: .75rem 1rem;
  border-radius: var(--score-radius);
  border: 1px solid #e2e8f0;
}

/* -- Section dividers ----------------------------------------------------- */
.add-section {
  border-top: 1px solid #e2e8f0;
  padding-top: 1.25rem;
  margin-top: 1rem;
}
.add-section h6 {
  font-weight: 700;
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #475569;
  margin-bottom: .75rem;
}

/* -- Responsive tweaks ---------------------------------------------------- */
@media (max-width: 767.98px) {
  .page-header h2 { font-size: 1.25rem; }
  .table { font-size: .8rem; }
  .btn-sm { font-size: .78rem; padding: .2rem .45rem; }
}

/* -- Profile page --------------------------------------------------------- */
.card.border-primary {
  border: 2px solid var(--score-primary) !important;
  box-shadow: 0 2px 8px rgba(67,97,238,.12);
}
.card.border-primary:hover { transform: none; }

/* -- Monospace utility ---------------------------------------------------- */
.font-mono { font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace; font-size: .82em; }
