/*
 * Set the sprite on the flag itself. A relative url() inside a CSS variable
 * is resolved from the widget's injected stylesheet and 404s.
 */
.iti__flag {
    background-image: image-set(
        url("../images/flags-wrp4O2A.webp") 1x,
        url("../images/flags@2x-X7yeyRO.webp") 2x
    ) !important;
}

.iti {
    display: block;
    width: 100%;
}

.iti__tel-input {
    height: 60px;
    padding-right: 22px;
    border: 1px solid #000;
    border-radius: 30px;
    background: #fff;
    font: 18px Jost, sans-serif;
}

.iti__tel-input.is-invalid {
    border-color: #c0392b;
}

.iti__selected-country {
    background: transparent;
    border-radius: 30px 0 0 30px;
}

.iti__country-selector {
    border-radius: 16px;
}

.iti__search-input {
    height: auto;
    border: 0;
    border-radius: 16px 16px 0 0;
    font: 16px Jost, sans-serif;
}

.iti__country-list {
    font: 16px Jost, sans-serif;
}