/* Reusable multi-select dropdown (School / Program / Degree / Specialisation
   filters, and any other multi-pick). Checkbox options inside a popover; the
   checkboxes carry the form field name so a GET form submits repeated params.
   Brand accent = ATLAS emerald green. */
.msd { position: relative; display: inline-block; }
.msd .msd-trigger {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  width: 100%; min-height: 38px; padding: 8px 12px; cursor: pointer;
  background: #fff; border: 1px solid #d1d5db; border-radius: 8px;
  font-size: 13px; color: #94a3b8; text-align: left; line-height: 1.2;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.msd .msd-trigger.has-val { color: #0f172a; font-weight: 600; }
.msd .msd-trigger::after {
  content: ''; flex: 0 0 auto; width: 8px; height: 8px; margin-left: 6px;
  border-right: 2px solid #94a3b8; border-bottom: 2px solid #94a3b8;
  transform: rotate(45deg) translateY(-2px); transition: transform .15s;
}
.msd.open .msd-trigger { border-color: #10b981; box-shadow: 0 0 0 2px rgba(16,185,129,.15); }
.msd.open .msd-trigger::after { transform: rotate(-135deg) translateY(0); }
.msd .msd-panel {
  display: none; position: absolute; z-index: 1200; top: calc(100% + 4px); left: 0;
  min-width: 100%; width: max-content; max-width: 340px;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 10px;
  box-shadow: 0 12px 34px rgba(15,23,42,.14); overflow: hidden;
}
.msd.open .msd-panel { display: block; }
.msd .msd-search {
  width: 100%; box-sizing: border-box; border: none; border-bottom: 1px solid #eef1f7;
  padding: 9px 12px; font-size: 13px; outline: none;
}
.msd .msd-options { max-height: 260px; overflow-y: auto; padding: 4px 0; }
.msd .msd-opt {
  display: flex; align-items: center; gap: 9px; padding: 7px 12px; cursor: pointer;
  font-size: 13px; color: #334155;
}
.msd .msd-opt:hover { background: #f0fdf4; }
.msd .msd-opt input[type=checkbox] { width: 15px; height: 15px; accent-color: #10b981; flex: 0 0 auto; }
.msd .msd-opt span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msd .msd-empty { padding: 12px; font-size: 12px; color: #94a3b8; text-align: center; }

:root[data-theme="dark"] .msd .msd-trigger { background: #0f172a; border-color: #334155; color: #64748b; }
:root[data-theme="dark"] .msd .msd-trigger.has-val { color: #e2e8f0; }
:root[data-theme="dark"] .msd .msd-panel { background: #0f172a; border-color: #334155; }
:root[data-theme="dark"] .msd .msd-search { background: #0f172a; color: #e2e8f0; border-bottom-color: #1e293b; }
:root[data-theme="dark"] .msd .msd-opt { color: #cbd5e1; }
:root[data-theme="dark"] .msd .msd-opt:hover { background: #14251c; }