/*
 * Vendor-patch overrides for choices.js applied to the staff app
 * (app/views/layouts/application.html.erb). The public flow no longer uses
 * choices.js (free-text + native selects), so this is staff-only.
 *
 * The default choices.min.css ships `.choices__inner` with a 2.5px border
 * radius and a `min-height` that grows when a selected item + remove button
 * is present (making two side-by-side selects render at different heights
 * when only one has a value). Pin both to match the staff form's other
 * inputs.
 */

.choices__inner {
    border-radius: 0.5rem; /* rounded-lg */
    height: 42px;
    min-height: 42px;
    padding: 6px 8px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}

/* Override the select-one bottom-padding default that otherwise asymmetrically
   adds 7.5px to a select with no remove button. */
.choices[data-type*=select-one] .choices__inner {
    padding-bottom: 6px;
}

.choices__list--single {
    padding: 0 16px 0 4px;
    width: 100%;
}

.choices__list--dropdown,
.choices__list[aria-expanded] {
    border-radius: 0.5rem;
}