/*
 * Native select controls need explicit dimensions on Chrome/Windows.
 * Keep selected labels vertically centered and give long project/workspace names room.
 */
select {
    box-sizing: border-box !important;
    min-height: 44px !important;
    height: 44px !important;
    line-height: 22px !important;
    font-size: 14px !important;
    padding: 10px 44px 10px 12px !important;
    max-width: 100% !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

select option {
    font-size: 14px !important;
    line-height: normal !important;
    white-space: normal !important;
    padding: 7px 10px !important;
}

/* Task forms: fill the full grid column so labels such as "Working on it" fit. */
.form-grid,
.form-grid .form-section,
.form-section {
    min-width: 0 !important;
}

.form-section select,
.form-grid select,
.task-form-card select,
.filterbar select {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
}

/* Django management screens: relationship dropdowns need more room for names. */
#content select,
.form-row select,
.related-widget-wrapper select,
.inline-group select,
.change-form select {
    width: min(420px, 100%) !important;
    min-width: 300px !important;
}

/* Django filter/action selects can remain compact. */
#changelist-filter select,
.actions select {
    width: auto !important;
    min-width: 210px !important;
    min-height: 40px !important;
    height: 40px !important;
}

/* Multi-selects are list boxes, so don't force a single-row height. */
select[multiple],
#content .selector select {
    width: min(520px, 100%) !important;
    min-width: 340px !important;
    min-height: 150px !important;
    height: auto !important;
    padding: 8px 10px !important;
    white-space: normal !important;
}

@media (max-width: 700px) {
    select,
    #content select,
    .form-row select,
    .related-widget-wrapper select,
    .inline-group select,
    .change-form select,
    #changelist-filter select,
    .actions select,
    select[multiple] {
        width: 100% !important;
        min-width: 0 !important;
    }
}