/* ==========================================================================
   CEE Upgradation/Transfer Portal — theme
   Built on top of Bootstrap 5.3; only overrides/extends, never fights it.
   ========================================================================== */

:root {
  --brand: #2952e3;
  --brand-dark: #1e3fc4;
  --brand-light: #eef2ff;
  --ink: #1f2430;
  --muted: #6b7280;
  --border: #e5e8f0;
  --surface: #ffffff;
  --radius: 14px;
  --radius-sm: 10px;
  --shadow-sm: 0 1px 2px rgba(20, 24, 40, .06);
  --shadow-md: 0 6px 20px -4px rgba(20, 24, 40, .12);
}

body {
  background: linear-gradient(180deg, #f3f5fb 0%, #eef0f7 100%);
  color: var(--ink);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 { color: var(--ink); font-weight: 700; letter-spacing: -0.01em; }

a { color: var(--brand); }
a:hover { color: var(--brand-dark); }

/* ---- Navbar ---- */
.navbar.bg-dark {
  background: linear-gradient(135deg, #161b2e 0%, #1f2544 100%) !important;
  box-shadow: 0 2px 10px rgba(15, 18, 32, .25);
}
.navbar-brand {
  font-weight: 700;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  gap: .5rem;
}
.navbar-brand::before {
  content: "🎓";
  font-size: 1.1rem;
}
.navbar-dark .navbar-nav .nav-link {
  color: rgba(255,255,255,.78);
  font-weight: 500;
  padding: .5rem .9rem;
  border-radius: var(--radius-sm);
  transition: background-color .15s ease, color .15s ease;
}
.navbar-dark .navbar-nav .nav-link:hover {
  color: #fff;
  background-color: rgba(255,255,255,.08);
}
.navbar-dark .navbar-nav .nav-link.active {
  color: #fff;
  background-color: rgba(255,255,255,.14);
}

/* ---- Cards ---- */
.card {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: box-shadow .15s ease, transform .15s ease;
}
.card:hover { box-shadow: var(--shadow-md); }
.card-title { font-weight: 700; color: var(--ink); }

/* Dashboard stat tiles: any card whose body is just a small label + big number */
.card-body .text-muted.small {
  text-transform: uppercase;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--muted) !important;
}
.card-body .fs-3.fw-bold {
  font-size: 2rem !important;
  letter-spacing: -0.02em;
}

/* ---- Buttons ---- */
.btn {
  border-radius: var(--radius-sm);
  font-weight: 600;
  padding: .5rem 1rem;
  transition: transform .1s ease, box-shadow .15s ease;
}
.btn-sm { border-radius: 8px; }
.btn-primary {
  background: var(--brand);
  border-color: var(--brand);
}
.btn-primary:hover, .btn-primary:focus {
  background: var(--brand-dark);
  border-color: var(--brand-dark);
}
.btn-outline-primary {
  color: var(--brand);
  border-color: var(--brand);
}
.btn-outline-primary:hover {
  background: var(--brand);
  border-color: var(--brand);
}
.btn:active { transform: translateY(1px); }
.btn-link { font-weight: 600; text-decoration: none; }
.btn-link:hover { text-decoration: underline; }

/* ---- Badges ---- */
.badge {
  border-radius: 999px;
  font-weight: 600;
  letter-spacing: .01em;
  padding: .4em .75em;
}

/* ---- Tables ---- */
.table {
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.table thead th {
  background-color: #f7f8fc;
  color: var(--muted);
  text-transform: uppercase;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: #fafbfd;
}
.table-hover > tbody > tr:hover > * {
  background-color: var(--brand-light);
}
.table td, .table th { vertical-align: middle; }

/* ---- Alerts ---- */
.alert {
  border: 1px solid transparent;
  border-left-width: 4px;
  border-radius: var(--radius-sm);
}

/* ---- Forms ---- */
.form-control, .form-select {
  border-radius: 8px;
  border-color: var(--border);
}
.form-control:focus, .form-select:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 .2rem rgba(41, 82, 227, .15);
}
.form-label { font-weight: 600; font-size: .9rem; color: var(--ink); }

/* ---- Misc existing components ---- */
.student-photo {
  width: 120px;
  height: 150px;
  object-fit: cover;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: #eee;
  box-shadow: var(--shadow-sm);
}
.pref-row { cursor: default; }
.pref-order-badge { width: 2rem; display: inline-block; text-align: center; }

/* Login card: give it a little more presence */
.col-md-5 > .card {
  box-shadow: var(--shadow-md);
}