/* Degree to License — supervisor finder  v4 */

#d2l-sup{
  /* inherits the theme's heading face where Kadence exposes it */
  --d2l-display: var(--global-heading-font-family, Georgia, "Times New Roman", serif);
  --ink:#17292B; --ink-soft:#42585A; --muted:#75837F;
  --rule:#E2DED6; --rule-soft:#EDEAE3;
  --panel:#F6F4EF; --field:#FFFFFF;
  --seal:#2D6A5A; --seal-soft:#E7F0EC; --seal-deep:#1F4E42;
  --flag:#A8482A; --flag-soft:#F8EDE8;
  color:var(--ink); line-height:1.55;
  max-width:52rem; margin-inline:auto;
}
#d2l-sup *,#d2l-sup *::before,#d2l-sup *::after{box-sizing:border-box}

/* ---------- lead-in ---------- */
#d2l-sup > p:first-of-type{
  font-size:1.12rem; line-height:1.6; color:var(--ink-soft);
  max-width:38rem; margin:0 0 .6rem;
}
#d2l-sup > p:first-of-type strong{color:var(--ink); font-variant-numeric:tabular-nums}

/* ---------- search panel ---------- */
#d2l-sup .search{
  margin:1.75rem 0 0; padding:1.6rem 1.75rem 1.5rem;
  background:var(--panel); border:1px solid var(--rule);
  border-top:3px solid var(--seal); border-radius:4px;
}
#d2l-sup .row{display:flex; gap:1.1rem; flex-wrap:wrap; align-items:flex-end}
#d2l-sup label{
  display:block; font-size:.72rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted); margin:0 0 .45rem;
}
#d2l-sup input[type=text],
#d2l-sup select{
  font:inherit; color:var(--ink); background:var(--field);
  border:1px solid var(--rule); border-radius:3px;
  padding:.7rem .8rem; height:3rem; line-height:1.2;
}
#d2l-sup input[type=text]{
  font-size:1.35rem; font-weight:600; letter-spacing:.1em;
  font-variant-numeric:tabular-nums; width:7.5rem;
}
#d2l-sup input[type=text]::placeholder{color:#C3C9C4; font-weight:400}
#d2l-sup select{font-size:1rem; min-width:11rem}
#d2l-sup input:focus-visible,
#d2l-sup select:focus-visible,
#d2l-sup button:focus-visible{outline:2px solid var(--seal); outline-offset:2px}

#d2l-sup .d2l-btn{
  font:inherit; font-size:1rem; font-weight:700; height:3rem;
  padding:0 1.6rem; cursor:pointer; color:#fff;
  background:var(--seal); border:1px solid var(--seal); border-radius:3px;
  transition:background .15s ease;
}
#d2l-sup .d2l-btn:hover{background:var(--seal-deep)}
#d2l-sup .d2l-quiet{
  background:none; color:var(--seal); border-color:var(--rule);
  font-weight:600; height:auto; padding:.75rem 1.4rem;
}
#d2l-sup .d2l-quiet:hover{background:var(--seal-soft); color:var(--seal-deep)}

#d2l-sup .hint{
  font-size:.9rem; color:var(--muted); margin:1.1rem 0 0;
  padding-top:1rem; border-top:1px solid var(--rule-soft); max-width:36rem;
}
#d2l-sup .err{font-size:.92rem; font-weight:600; color:var(--flag); margin:1rem 0 0}

/* ---------- results header ---------- */
#d2l-sup .count{
  display:flex; justify-content:space-between; align-items:baseline;
  gap:1rem; flex-wrap:wrap; margin-top:2.5rem;
  padding-bottom:.75rem; border-bottom:2px solid var(--ink);
}
#d2l-sup .count h2{
  font-family:var(--d2l-display); font-size:1.5rem; font-weight:600;
  letter-spacing:-.01em; line-height:1.2; margin:0;
  font-variant-numeric:tabular-nums;
}
#d2l-sup .count p{
  margin:0; font-size:.78rem; font-weight:700; letter-spacing:.07em;
  text-transform:uppercase; color:var(--muted);
}

/* ---------- result rows ---------- */
#d2l-sup ol.results{list-style:none; margin:0; padding:0}
#d2l-sup ol.results li{
  border-bottom:1px solid var(--rule-soft);
  padding:1rem .75rem 1rem 0;
  display:grid; grid-template-columns:4rem 1fr; gap:1.25rem; align-items:start;
}
#d2l-sup ol.results li:hover{background:#FBFAF7}

/* no ZIP entered: no distance column, so don't reserve the gutter */
#d2l-sup ol.no-dist li{grid-template-columns:1fr; gap:0}

#d2l-sup .dist{
  font-variant-numeric:tabular-nums; font-size:1.2rem; font-weight:700;
  color:var(--seal); line-height:1.1; padding-top:.1rem; text-align:right;
}
#d2l-sup .dist small{
  display:block; font-weight:600; font-size:.66rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted); margin-top:.15rem;
}

#d2l-sup .name{
  font-family:var(--d2l-display); font-size:1.22rem; font-weight:600;
  letter-spacing:-.01em; line-height:1.25; margin:0 0 .2rem;
}
#d2l-sup .cred{
  font-family:"Public Sans",system-ui,sans-serif;
  font-size:.68rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:var(--seal-deep); background:var(--seal-soft);
  padding:.2rem .5rem; border-radius:2px; margin-left:.6rem;
  white-space:nowrap; vertical-align:.12em;
}
#d2l-sup .where{font-size:.95rem; color:var(--ink-soft); margin:0 0 .25rem}
#d2l-sup .meta{
  font-size:.82rem; color:var(--muted); margin:0;
  letter-spacing:.01em;
}
#d2l-sup .lic{font-variant-numeric:tabular-nums}
#d2l-sup .flagged{
  display:inline-block; font-size:.78rem; font-weight:700;
  color:var(--flag); background:var(--flag-soft);
  padding:.2rem .55rem; border-radius:2px; margin-top:.35rem;
}
#d2l-sup .contact{
  margin:.35rem 0 0; font-size:.98rem; font-weight:600;
  font-variant-numeric:tabular-nums; color:var(--ink);
}

/* ---------- footer of results ---------- */
#d2l-sup .more{margin:2rem 0 0; text-align:center}
#d2l-sup .empty{padding:2.5rem 0; color:var(--ink-soft); max-width:34rem}

/* ---------- small screens ---------- */
@media (max-width:640px){
  #d2l-sup .search{padding:1.25rem}
  #d2l-sup .row{gap:.85rem}
  #d2l-sup .row > div{width:100%}
  #d2l-sup input[type=text],#d2l-sup select,#d2l-sup .d2l-btn{width:100%}
  #d2l-sup ol.results li{
    grid-template-columns:1fr; gap:0; padding:.95rem 0;
  }
  #d2l-sup .dist{
    text-align:left; font-size:.85rem; margin-bottom:.35rem;
    display:flex; gap:.3rem; align-items:baseline;
  }
  #d2l-sup .dist small{display:inline; margin:0}
  #d2l-sup .name{font-size:1.2rem}
  #d2l-sup .count h2{font-size:1.3rem}
}