/* School-field autocomplete (gh #23) — shared by the registration form, the
 * parent portal child profile, the consulting form, and Janet's family edit
 * card.
 *
 * Deliberately neutral: these four screens have different palettes (the
 * parent forms use --accent green, the staff screens use a blue admin
 * palette). Colours below fall back to literals when a screen does not
 * define the custom properties, so the dropdown looks native on all four
 * without each one restyling it.
 */

.school-ac-wrap {
  position: relative;
  display: block;
}

.school-ac-list {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--field-line, #767e8b);
  border-top: none;
  border-radius: 0 0 6px 6px;
  max-height: 260px;
  overflow-y: auto;
  z-index: 50;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14);
  text-align: left;
}

.school-ac-row {
  padding: 7px 10px;
  font-size: 13px;
  font-weight: 400;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.school-ac-row:hover,
.school-ac-row.active {
  background: var(--accent-bg, #eaf5ee);
}

.school-ac-district {
  color: var(--muted, #6b7280);
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

/* "15 schools in PAUSD" — shown when a district name turns the dropdown into
   a browsable roster rather than a filtered list. */
.school-ac-scope {
  padding: 7px 10px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  color: var(--accent, #2f6f4f);
  background: var(--accent-bg, #eaf5ee);
  border-bottom: 1px solid var(--line, #e2e5ea);
  cursor: default;
}

.school-ac-note {
  padding: 8px 10px;
  font-size: 12.5px;
  color: var(--muted, #6b7280);
  cursor: default;
}

.school-ac-group {
  padding: 5px 10px 3px;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  color: #9ca3af;
  cursor: default;
}

/* Non-blocking nudge shown under the field when the school is not one we
   recognise. Warning-toned, not error-toned: nothing is blocked, our roster
   is simply incomplete, and the family may well be right. */
.school-ac-nudge {
  font-size: 12px;
  color: var(--warn, #b5791b);
  margin-top: 3px;
}