/* Shared native select theme for the public site and all workspaces.
   Preserve native form values, validation, labels and keyboard interaction. */
select {
    font: inherit;
    color: #252033;
    background-color: #fff;
    border: 1px solid #eadedb;
    border-radius: 10px;
    transition: border-color .15s, box-shadow .15s;
}
select:hover:not(:disabled) { border-color: #e5ac9f; }
select:focus-visible { border-color: #f86a50; outline: 2px solid #f86a50; outline-offset: -2px; }
select:disabled { color: #a69aa4; background-color: #f7f1eb; cursor: not-allowed; }
select option { font: inherit; background-color: #fff; color: #252033; }
select option:disabled { color: #aaa0a6; }

@supports (appearance: base-select) {
    select:not([multiple]):not([size]),
    select:not([multiple]):not([size])::picker(select) { appearance: base-select; }

    select:not([multiple]):not([size]) {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-width: 0;
        text-align: start;
        cursor: pointer;
    }
    select:not([multiple]):not([size])::picker-icon {
        color: #9f8177;
        font-size: 12px;
        flex-shrink: 0;
        transition: rotate .15s;
    }
    select:not([multiple]):not([size]):open { border-color: #f86a50; }
    select:not([multiple]):not([size]):open::picker-icon { rotate: 180deg; color: #dc644d; }
    select:not([multiple]):not([size])::picker(select) {
        box-sizing: border-box;
        font: inherit;
        color: #252033;
        background: #fffaf7;
        border: 1px solid #eadedb;
        border-radius: 14px;
        padding: 6px;
        margin-block: 6px;
        min-width: anchor-size(width);
        max-width: calc(100vw - 24px);
        max-height: min(340px, 55dvh);
        overflow: auto;
        box-shadow: 0 16px 40px #382c331f;
        scrollbar-width: thin;
        scrollbar-color: #d77863 #fbf2ec;
    }
    select:not([multiple]):not([size]) option {
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 42px;
        padding: 10px 12px;
        border: 0;
        border-radius: 9px;
        background: transparent;
        color: #746c76;
        font: inherit;
        line-height: 1.6;
        white-space: normal;
        overflow-wrap: anywhere;
        cursor: pointer;
    }
    select:not([multiple]):not([size]) option:checked {
        background: #ffede5;
        color: #b94c37;
        font-weight: 700;
    }
    select:not([multiple]):not([size]) option:hover:not(:disabled),
    select:not([multiple]):not([size]) option:focus-visible {
        background: #f7e7df;
        color: #a34131;
        outline: 2px solid #f86a50;
        outline-offset: -2px;
    }
    select:not([multiple]):not([size]) option::checkmark {
        order: 1;
        margin-inline-start: auto;
        color: #dc644d;
        font-weight: 700;
    }
    select:not([multiple]):not([size]) option:disabled { opacity: .5; cursor: not-allowed; }
    select:not([multiple]):not([size]) optgroup { color: #9f8177; padding: 6px; }
}
@media (prefers-reduced-motion: reduce) {
    select, select::picker-icon { transition: none; }
}
@media (forced-colors: active) {
    select, select::picker(select), select option:checked { border-color: ButtonText; }
    select option:checked { color: HighlightText; background: Highlight; }
}