/* One outer frame for the phone: inner controls never own or mask its corners. */
.bbr-phone-field { display: grid; gap: var(--bbr-space-2); min-width: 0; }
.bbr-phone-field > label { margin: 0; font-size: var(--bbr-text-sm); font-weight: 600; line-height: 1.4; }
.bbr-phone { --bbr-phone-border: var(--bbr-control-border); position: relative; display: flex; align-items: stretch; width: 100%; height: 48px; min-width: 0; border-radius: var(--bbr-radius-sm); overflow: hidden; color: var(--bbr-text); background: var(--bbr-input); }
.bbr-phone::after { content: ""; position: absolute; inset: 0; z-index: 3; border: 1px solid var(--bbr-phone-border); border-radius: inherit; pointer-events: none; }
.bbr-phone__country { position: relative; flex: 0 0 8rem; min-width: 0; height: 48px; background: var(--bbr-surface-raised); box-shadow: inset -1px 0 var(--bbr-phone-border); }
.bbr-phone__country::after { content: ""; position: absolute; width: 16px; height: 16px; right: 12px; top: 16px; background: url('../images/form-caret-down.svg') center / contain no-repeat; pointer-events: none; z-index: 2; }
:is(.bbr-checkout .bbr-checkout__form,.bbr-account .account-form,.bbr-auth-form,.bbr-phone-field) .bbr-phone .bbr-phone__country select.bbr-phone__select[name]:not(.select2-hidden-accessible) { position: static; appearance: none; width: 100%; height: 48px; min-height: 0; margin: 0; padding: 12px 40px 12px 12px; border: 0; border-radius: 0; box-shadow: none; background: transparent; background-image: none; color: var(--bbr-text); font: inherit; font-size: 16px; line-height: 24px; cursor: pointer; }
.bbr-phone__value { position: absolute; inset: 0 40px 0 0; display: flex; align-items: center; padding-left: 12px; pointer-events: none; background: var(--bbr-surface-raised); color: var(--bbr-text); font-size: 16px; line-height: 24px; white-space: nowrap; }
.bbr-phone .bbr-phone__select option { color: var(--bbr-text); background: var(--bbr-surface); }
:is(.bbr-checkout .bbr-checkout__form,.bbr-account .account-form,.bbr-auth-form,.bbr-phone-field) .bbr-phone input.bbr-phone__input[type="tel"][data-bbr-phone] { flex: 1 1 0%; width: 0; min-width: 0; height: 48px; min-height: 0; margin: 0; padding: 12px; border: 0; border-radius: 0; box-shadow: none; background: transparent; color: var(--bbr-text); font: inherit; font-size: 16px; line-height: 24px; direction: ltr; text-align: start; }
.bbr-phone :is(input,select,button):focus-visible { outline: none; }
.bbr-checkout .bbr-phone :is(input,select,button):focus-visible { outline: none !important; }
.bbr-phone.is-invalid { --bbr-phone-border: var(--bbr-danger); }
.bbr-checkout .form-row.woocommerce-validated .bbr-phone { --bbr-phone-border: var(--bbr-success); }
.bbr-checkout .form-row.woocommerce-invalid .bbr-phone { --bbr-phone-border: var(--bbr-danger); }
.bbr-checkout .form-row .bbr-phone.is-invalid { --bbr-phone-border: var(--bbr-danger); }
.bbr-phone.is-readonly :is(.bbr-phone__value,.bbr-phone__input) { color: var(--bbr-muted); }
.bbr-phone input.bbr-phone__input[readonly] { pointer-events: auto !important; cursor: text; }
.bbr-phone-error { display: block; margin-top: .375rem; color: var(--bbr-danger); font-size: var(--bbr-text-sm); line-height: 1.4; }
.bbr-phone-error[hidden] { display: none; }
/* SelectWoo uses the same compact prefix, frame and caret as the other selects. */
.bbr-phone__value[hidden] { display: none; }
.bbr-phone__country.is-select2::after { display: none; }
.bbr-phone__country .select2-container { display: block; width: 100% !important; margin: 0 !important; }
:is(.bbr-checkout .bbr-checkout__form,.bbr-account .account-form,.bbr-auth-form,.bbr-phone-field) .bbr-phone .select2-container .select2-selection--single {
    display: flex; align-items: center; position: relative; height: 48px; min-height: 48px;
    margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
.bbr-phone .select2-container .select2-selection--single .select2-selection__rendered {
    width: 100%; margin: 0; padding: 12px 40px 12px 12px; color: var(--bbr-text); font-size: 16px; line-height: 24px;
}
.bbr-phone .select2-container .select2-selection--single .select2-selection__arrow {
    display: flex; align-items: center; justify-content: center; top: 0; right: 12px; width: 16px; height: 48px;
}
.bbr-phone .select2-container .select2-selection--single .select2-selection__arrow b {
    position: static; width: 16px; height: 16px; margin: 0; border: 0; mask: none;
    background: url('../images/form-caret-down.svg') center / contain no-repeat;
}
.bbr-phone .select2-selection:focus { outline: none !important; }
.bbr-phone.is-readonly .select2-selection__rendered { color: var(--bbr-muted) !important; }
.bbr-phone-dropdown.select2-dropdown { background: var(--bbr-surface); color: var(--bbr-text); border: 1px solid var(--bbr-control-border); border-radius: var(--bbr-radius-sm); box-sizing: border-box; }
.bbr-phone-dropdown .select2-search--dropdown { padding: 8px; }
.bbr-phone-dropdown.select2-dropdown .select2-search--dropdown .select2-search__field { width: 100%; min-height: 48px; padding: 12px; border: 1px solid var(--bbr-control-border); border-radius: var(--bbr-radius-sm); background: var(--bbr-input); color: var(--bbr-text); font-size: 16px; line-height: 24px; }
.bbr-phone-dropdown .select2-results > .select2-results__options { max-height: min(240px, 35dvh); overscroll-behavior: contain; }
.bbr-phone-dropdown .select2-results__option { min-height: 48px; padding: 12px; font-size: 16px; line-height: 24px; overflow-wrap: anywhere; }
.bbr-phone-dropdown .select2-results__option[data-selected=true],
.bbr-phone-dropdown .select2-results__option--highlighted[aria-selected] { background: var(--bbr-brand); color: var(--bbr-on-light); }
