/* ==========================================================================
   NESPL Portal — Institute candidate directory
   Card grid of students, filters, pagination and a full profile view.
   All classes use the .cnd- prefix.
   ========================================================================== */

@keyframes cndRise { from { opacity:0; transform:translateY(16px);} to { opacity:1; transform:none; } }
.cnd-in { animation: cndRise .45s cubic-bezier(.2,.8,.2,1) both; }

/* ---------- filter bar ---------- */
.cnd-filters {
  background:#fff; border:1px solid var(--line); border-radius:20px; padding:1.1rem 1.2rem;
  margin-bottom:1.4rem; box-shadow:var(--shadow-sm);
}
.cnd-frow { display:grid; grid-template-columns:2fr 1fr 1fr 1fr auto; gap:.8rem; align-items:end; }
.cnd-frow > * { min-width:0; }
.cnd-f label {
  display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em;
  color:var(--muted); font-weight:700; margin-bottom:.35rem;
}
.cnd-f .input-x, .cnd-f .form-select { height:46px; border-radius:12px; }
.cnd-search { position:relative; }
.cnd-search .input-x { padding-left:2.5rem; }
.cnd-search i { position:absolute; left:.9rem; top:calc(50% + .55rem); transform:translateY(-50%); color:var(--muted); pointer-events:none; }
.cnd-reset {
  height:46px; border-radius:12px; border:1.5px solid var(--line); background:#fff; color:var(--muted);
  padding:0 1rem; cursor:pointer; font-family:var(--font-display); font-weight:600; font-size:.85rem;
  transition:.18s; white-space:nowrap;
}
.cnd-reset:hover { border-color:var(--blue-400); color:var(--blue-700); background:var(--blue-50); }

.cnd-active { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.9rem; }
.cnd-actchip {
  display:inline-flex; align-items:center; gap:.4rem; padding:.3rem .35rem .3rem .7rem; border-radius:999px;
  background:var(--blue-50); border:1px solid var(--blue-100); color:var(--blue-700);
  font-size:.78rem; font-weight:600; font-family:var(--font-display);
}
.cnd-actchip button {
  border:none; background:transparent; color:var(--blue-700); cursor:pointer; line-height:1;
  width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:.62rem;
}
.cnd-actchip button:hover { background:var(--blue-100); color:var(--red); }

/* ---------- results bar ---------- */
.cnd-bar { display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; margin-bottom:1.1rem; }
.cnd-bar__n { font-family:var(--font-display); font-weight:600; color:var(--ink); font-size:.95rem; }
.cnd-bar__n b { color:var(--blue-700); }

/* ---------- student card grid ---------- */
.cnd-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1.2rem; }

.cnd-card {
  background:#fff; border:1px solid var(--line); border-radius:20px; overflow:hidden; cursor:pointer;
  display:flex; flex-direction:column; box-shadow:var(--shadow-sm);
  transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s, border-color .28s;
}
.cnd-card:hover { transform:translateY(-6px); box-shadow:0 20px 46px rgba(20,42,94,.16); border-color:transparent; }
.cnd-card:focus-visible { box-shadow:var(--ring); }

.cnd-photo { position:relative; aspect-ratio:1/1; overflow:hidden; background:var(--surface-2); }
.cnd-photo svg { display:block; width:100%; height:100%; }
.cnd-photo__score {
  position:absolute; right:.6rem; top:.6rem; z-index:2; padding:.28rem .6rem; border-radius:999px;
  font-family:var(--font-display); font-weight:700; font-size:.76rem; color:#fff;
  backdrop-filter:blur(6px); box-shadow:0 4px 12px rgba(8,18,50,.24);
}
.cnd-photo__score.hi  { background:#15803d; }
.cnd-photo__score.mid { background:#b45309; }
.cnd-photo__score.lo  { background:#b91c1c; }
.cnd-photo__badge {
  position:absolute; left:.6rem; top:.6rem; z-index:2; width:26px; height:26px; border-radius:50%;
  display:grid; place-items:center; font-size:.68rem; color:#fff; background:#1d4ed8;
  box-shadow:0 4px 12px rgba(8,18,50,.24);
}

.cnd-card__b { padding:.95rem 1rem 1.1rem; display:flex; flex-direction:column; flex:1; }
.cnd-card__n { font-family:var(--font-display); font-weight:700; color:var(--ink); font-size:1rem; margin:0 0 .15rem; line-height:1.3; }
.cnd-card__d { display:flex; align-items:center; gap:.35rem; font-size:.81rem; color:var(--blue-600); font-weight:600; font-family:var(--font-display); margin-bottom:.5rem; }
.cnd-card__m { display:flex; flex-wrap:wrap; gap:.3rem .8rem; font-size:.76rem; color:var(--muted); margin-bottom:.7rem; }
.cnd-card__m span { display:inline-flex; align-items:center; gap:.28rem; }
.cnd-chips { display:flex; flex-wrap:wrap; gap:.3rem; margin-top:auto; }
.cnd-chip {
  padding:.22rem .55rem; border-radius:999px; font-size:.71rem; font-weight:600;
  font-family:var(--font-display); background:var(--blue-50); color:var(--blue-700); border:1px solid var(--blue-100);
}
.cnd-chip.more { background:transparent; border-style:dashed; color:var(--muted); }

/* ---------- empty + pagination ---------- */
.cnd-empty { text-align:center; padding:4rem 1rem; grid-column:1/-1; }
.cnd-empty__ico { width:86px; height:86px; border-radius:26px; margin:0 auto 1.1rem; display:grid; place-items:center; background:var(--blue-50); color:var(--blue-400); font-size:2.1rem; }
.cnd-empty p { color:var(--muted); font-size:.92rem; margin:.3rem 0 1.1rem; }

.cnd-page {
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:1.6rem;
  padding:1.05rem 1.3rem; background:#fff; border:1px solid var(--line); border-radius:16px;
}
.cnd-page__per { display:flex; align-items:center; gap:.55rem; font-size:.86rem; color:var(--body); }
.cnd-page__per select { width:auto; min-width:74px; }
.cnd-page__c { flex:1; text-align:center; font-size:.86rem; color:var(--muted); min-width:150px; }
.cnd-pager { display:flex; gap:.3rem; align-items:center; }
.cnd-pager button {
  min-width:38px; height:38px; border-radius:11px; border:1.5px solid var(--line); background:#fff;
  color:var(--body); cursor:pointer; font-family:var(--font-display); font-weight:600; font-size:.85rem;
  transition:.18s; padding:0 .7rem;
}
.cnd-pager button:hover:not(:disabled) { border-color:var(--blue-400); color:var(--blue-700); transform:translateY(-1px); }
.cnd-pager button.on { background:var(--grad-blue); border-color:transparent; color:#fff; box-shadow:0 6px 16px rgba(37,99,235,.3); }
.cnd-pager button:disabled { opacity:.35; cursor:not-allowed; }
.cnd-pager .gap { color:var(--muted); padding:0 .2rem; align-self:center; }

/* ---------- profile view ---------- */
.cnd-back { margin-bottom:1rem; }
.cnd-hero {
  background:linear-gradient(125deg,#1e3a8a,#2563eb 55%,#4f46e5); color:#fff;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0; padding:1.8rem 1.7rem;
  position:relative; overflow:hidden;
}
.cnd-hero::after { content:""; position:absolute; right:-70px; top:-90px; width:250px; height:250px; border-radius:50%; background:rgba(255,255,255,.12); }
.cnd-hero__row { display:flex; gap:1.3rem; align-items:center; position:relative; z-index:2; flex-wrap:wrap; }
.cnd-hero__pic {
  width:104px; height:104px; flex:0 0 104px; border-radius:26px; overflow:hidden;
  border:3px solid rgba(255,255,255,.35); box-shadow:0 10px 28px rgba(8,18,50,.3); background:rgba(255,255,255,.15);
}
.cnd-hero__pic svg { display:block; width:100%; height:100%; }
.cnd-hero__id { flex:1; min-width:220px; }
.cnd-hero__id h2 { color:#fff; margin:0 0 .2rem; font-size:1.55rem; letter-spacing:-.01em; }
.cnd-hero__id .dept { color:rgba(255,255,255,.88); font-size:.98rem; font-weight:600; font-family:var(--font-display); }
.cnd-hero__meta { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:1rem; position:relative; z-index:2; }
.cnd-hchip {
  display:inline-flex; align-items:center; gap:.4rem; padding:.35rem .78rem; border-radius:9px;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.24); color:#fff;
  font-size:.81rem; font-weight:600; font-family:var(--font-display);
}
.cnd-body { background:#fff; border:1px solid var(--line); border-top:none; border-radius:0 0 var(--radius-lg) var(--radius-lg); padding:1.6rem; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) { .cnd-frow { grid-template-columns:1fr 1fr 1fr; } .cnd-frow .cnd-f:first-child { grid-column:1/-1; } }
@media (max-width: 760px) {
  .cnd-frow { grid-template-columns:1fr 1fr; }
  .cnd-frow .cnd-f:first-child, .cnd-frow > :last-child { grid-column:1/-1; }
  .cnd-reset { width:100%; }
  .cnd-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.8rem; }
  .cnd-card__b { padding:.75rem .8rem .9rem; }
  .cnd-card__n { font-size:.9rem; }
  .cnd-page__c { order:3; flex:1 1 100%; text-align:left; }
  .cnd-hero { padding:1.3rem 1.2rem; }
  .cnd-hero__pic { width:78px; height:78px; flex-basis:78px; border-radius:20px; }
  .cnd-body { padding:1.1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .cnd-in { animation:none; }
  .cnd-card, .cnd-pager button, .cnd-reset { transition:none; }
  .cnd-card:hover, .cnd-pager button:hover:not(:disabled) { transform:none; }
}
