/* Native form controls retain names, validation, labels and keyboard behavior.
   Desktop browsers supporting base-select also receive a styled options panel.
   Touch devices and other browsers retain their platform's native picker. */
html body select:not([multiple]):is(:not([size]),[size="1"]) {
    -webkit-appearance:none;
    appearance:none;
    box-sizing:border-box;
    min-inline-size:0;
    max-inline-size:100%;
    min-block-size:48px;
    padding:12px 44px 12px 14px;
    border:1px solid var(--select-border,#b7c8c0);
    border-radius:12px;
    background-color:var(--select-surface,#fff);
    background-image:url("../images/select-chevron.svg");
    background-repeat:no-repeat;
    background-size:18px 18px;
    background-position:right 14px center;
    color:var(--select-text,#173c35);
    font-family:inherit;
    font-size:14px;
    font-weight:500;
    line-height:1.45;
    text-overflow:ellipsis;
    cursor:pointer;
    box-shadow:0 1px 2px #102a2a08;
    transition:border-color .16s,box-shadow .16s,background-color .16s;
}
html body select:dir(rtl):not([multiple]):is(:not([size]),[size="1"]) {
    padding-inline:14px 44px;
    background-position:left 14px center;
}
html body select:not(:disabled):hover { border-color:var(--select-accent,#357466); }
html body select:focus-visible {
    border-color:var(--select-accent,#357466);
    outline:3px solid var(--select-focus,#35746633);
    outline-offset:2px;
    box-shadow:0 0 0 1px var(--select-accent,#357466);
}
html body select:disabled {
    cursor:not-allowed;
    opacity:.65;
    box-shadow:none;
}
html body select:is([aria-invalid="true"],.input-validation-error,:user-invalid) {
    border-color:#b54135;
    --select-focus:#b5413533;
    --select-accent:#b54135;
}
html body select[multiple],html body select[size]:not([size="1"]) {
    box-sizing:border-box;
    max-inline-size:100%;
    padding:8px;
    border:1px solid var(--select-border,#b7c8c0);
    border-radius:12px;
    background:var(--select-surface,#fff);
    color:var(--select-text,#173c35);
    font:inherit;
}
/* Respect customer colors on public promotion forms. */
.promo-public select {
    --select-surface:var(--promo-surface,#fff);
    --select-text:var(--promo-text,#173c35);
    --select-border:color-mix(in srgb,var(--promo-text) 40%,transparent);
    --select-accent:var(--promo-primary,#357466);
    --select-focus:color-mix(in srgb,var(--promo-primary) 30%,transparent);
}
/* Keep country calling-code selectors joined to their phone field. */
.international-phone:focus-within { outline:3px solid #35746633; outline-offset:2px; }
@media(hover:hover) and (pointer:fine) {
    @supports (appearance:base-select) {
        html body select:not([multiple]):is(:not([size]),[size="1"]),
        html body select:not([multiple]):is(:not([size]),[size="1"])::picker(select) { appearance:base-select; }
        html body select:not([multiple]):is(:not([size]),[size="1"]) {
            background-image:none;
            padding-inline:14px;
            gap:14px;
        }
        html body select::picker-icon { content:""; inline-size:18px; block-size:18px; flex:0 0 18px; background:url("../images/select-chevron.svg") center/18px no-repeat; margin-inline-start:auto; transition:rotate .16s; }
        html body select:open::picker-icon { rotate:180deg; }
        html body select::picker(select) {
            margin-block:6px;
            padding:6px;
            border:1px solid var(--select-border,#b7c8c0);
            border-radius:14px;
            background:var(--select-surface,#fff);
            color:var(--select-text,#173c35);
            box-shadow:0 12px 36px #102a2a24,0 2px 6px #102a2a0a;
            max-block-size:min(340px,60dvh);
            max-inline-size:calc(100vw - 24px);
            overflow:auto;
            overscroll-behavior:contain;
            scrollbar-width:thin;
            font-family:inherit;
            font-size:14px;
        }
        html body select option { min-block-size:40px; padding:10px 12px; border-radius:8px; gap:12px; white-space:normal; overflow-wrap:anywhere; font-weight:400; }
        html body select option:checked { background:#edf3e5; color:#173c35; font-weight:650; }
        html body select option:not(:disabled):is(:hover,:focus-visible) { background:#dfeccf; color:#173c35; outline:none; }
        html body select option:disabled { color:#6a7872; opacity:.65; }
        html body select option::checkmark { color:#357466; }
        html body select optgroup { padding:6px 2px; font-weight:700; }
    }
}
@media(max-width:620px),(pointer:coarse) {
    html body select:not([multiple]):is(:not([size]),[size="1"]) { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) {
    html body select,html body select::picker-icon { transition:none; }
}
@media(forced-colors:active) {
    html body select:not([multiple]):is(:not([size]),[size="1"]) { appearance:auto; background-image:none; border-color:ButtonText; color:ButtonText; }
    html body select:focus-visible { outline:2px solid Highlight; box-shadow:none; }
}
