/* Align intl-tel-input's flag/dial-code widget with the theme's checkout field style. */
.checkout-wrapper .checkout_form_input_field .iti {
  width: 100%;
}

/* Don't set padding-left here: with separateDialCode the library computes and
   sets it inline (this.telInput.style.paddingLeft) based on the actual pixel
   width of the flag+code box, which varies per country ("+7" vs "+998").
   Overriding it with a fixed value makes the typed digits render underneath
   the flag/code box instead of after it. */

.checkout-wrapper .checkout_form_input_field .iti__flag-container {
  height: 100%;
}

/* The library gives the flag+code a grey badge by default (separate-looking
   from the input). Drop that so code + number read as one continuous field,
   matching the rest of the checkout inputs. */
.checkout-wrapper .checkout_form_input_field .iti--separate-dial-code .iti__selected-flag {
  background-color: transparent;
}

.iti__selected-flag{
  height: 45px!important;
}