/* --- affiliation & department suggestions ----------------------------------
 *
 * The field underneath stays an ordinary text input. No registry holds every
 * hospital in the world, and a department is whatever the person's employer
 * calls it, so anything typed must still be accepted — QA asked for a dropdown
 * on these two and a real dropdown would lock out the first author from a
 * hospital nobody has typed yet. These only save typing.
 *
 * Lifted out of signup-steps.css when the submission wizard's author modal
 * needed the same control. The two live on opposite backgrounds — the sign-up
 * form is dark, the modal is white — so the colours are custom properties with
 * the sign-up values as defaults, and the modal restates them. Nothing about
 * sign-up changed in the move.
 */

/* The list hangs off the field's own container rather than a wrapper, so the
   floating label keeps its `input + label` adjacency. */
.has-suggestions {
    position: relative;
}

/* The redesigned author modal sets `.new-modal-styling .form-group-float` to
   position: static, which outranks the rule above. The list then measured
   itself against the modal card instead of the field and opened at the top of
   it, hundreds of pixels from the box being typed into. Stated here at a weight
   that wins, rather than with !important. */
.new-modal-styling .form-group-float.has-suggestions {
    position: relative;
}

.suggest-list {
    position: absolute;
    z-index: 60;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    margin: 0;
    padding: 4px 0;
    list-style: none;
    max-height: 16rem;
    overflow-y: auto;
    background: var(--suggest-bg, #16283d);
    border: 1px solid var(--suggest-border, rgba(240, 234, 214, .22));
    border-radius: 6px;
    box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .75);
}

/* Where there is no room below — the author modal's last row, inside a body
   that scrolls — the list opens upwards instead. placeList() decides. */
.suggest-list.is-above {
    top: auto;
    bottom: calc(100% + 4px);
}

.suggest-item {
    padding: 9px 14px;
    cursor: pointer;
    line-height: 1.35;
}

.suggest-item.is-active { background: var(--suggest-active, rgba(217, 160, 63, .22)); }

.suggest-name {
    color: var(--suggest-text, #f0ead6);
    font-size: 14px;
}

/* The letters that were typed, so it is obvious why a row is being offered. */
.suggest-name mark {
    background: none;
    color: var(--suggest-match, #d9a03f);
    font-weight: 600;
}

.suggest-list::-webkit-scrollbar { width: 8px; }
.suggest-list::-webkit-scrollbar-track { background: transparent; }
.suggest-list::-webkit-scrollbar-button { display: none; height: 0; width: 0; }
.suggest-list::-webkit-scrollbar-thumb {
    background-color: var(--suggest-border, rgba(240, 234, 214, .22));
    border-radius: 99px;
    border: 2px solid transparent;
    background-clip: content-box;
}

/* The author modal is a white card, so the sign-up form's navy list would land
   on it as a hole. Same control, restated for a light background. */
#authorModal {
    --suggest-bg: #ffffff;
    --suggest-border: #d1d5db;
    --suggest-text: #1f2937;
    --suggest-active: #eff6ff;
    --suggest-match: #2563eb;
}

#authorModal .suggest-list {
    box-shadow: 0 12px 28px -12px rgba(15, 23, 42, .35);
}

/* The previous-co-authors list opens on the light Authors step, not the dark
   sign-up form, so it takes the same white theme as the modal instead of the
   navy default — otherwise it lands on the page as a dark hole. */
#author-suggestions {
    --suggest-bg: #ffffff;
    --suggest-border: #d1d5db;
    --suggest-text: #1f2937;
    --suggest-active: #eff6ff;
    --suggest-match: #2563eb;
    box-shadow: 0 12px 28px -12px rgba(15, 23, 42, .35);
}