.flag,
.field .intl-tel-input .iti-flag {
    display: flex;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 3px;
    overflow: hidden;
}
.flag.ua,
.field .intl-tel-input .iti-flag.ua {
    background-image: url("/img/redesign/icons/flags/ua.svg");
}
.flag.at,
.field .intl-tel-input .iti-flag.at {
    background-image: url("/img/redesign/icons/flags/at.svg");
}
.flag.au,
.field .intl-tel-input .iti-flag.au {
    background-image: url("/img/redesign/icons/flags/au.svg");
}
.flag.be,
.field .intl-tel-input .iti-flag.be {
    background-image: url("/img/redesign/icons/flags/be.svg");
}
.flag.ca,
.field .intl-tel-input .iti-flag.ca {
    background-image: url("/img/redesign/icons/flags/ca.svg");
}
.flag.ch,
.field .intl-tel-input .iti-flag.ch {
    background-image: url("/img/redesign/icons/flags/ch.svg");
}
.flag.de,
.field .intl-tel-input .iti-flag.de {
    background-image: url("/img/redesign/icons/flags/de.svg");
}
.flag.dk,
.field .intl-tel-input .iti-flag.dk {
    background-image: url("/img/redesign/icons/flags/dk.svg");
}
.flag.ee,
.field .intl-tel-input .iti-flag.ee {
    background-image: url("/img/redesign/icons/flags/ee.svg");
}
.flag.es,
.field .intl-tel-input .iti-flag.es {
    background-image: url("/img/redesign/icons/flags/es.svg");
}
.flag.fi,
.field .intl-tel-input .iti-flag.fi {
    background-image: url("/img/redesign/icons/flags/fi.svg");
}
.flag.fr,
.field .intl-tel-input .iti-flag.fr {
    background-image: url("/img/redesign/icons/flags/fr.svg");
}
.flag.gb,
.field .intl-tel-input .iti-flag.gb {
    background-image: url("/img/redesign/icons/flags/gb.svg");
}
.flag.ie,
.field .intl-tel-input .iti-flag.ie {
    background-image: url("/img/redesign/icons/flags/ie.svg");
}
.flag.it,
.field .intl-tel-input .iti-flag.it {
    background-image: url("/img/redesign/icons/flags/it.svg");
}
.flag.lu,
.field .intl-tel-input .iti-flag.lu {
    background-image: url("/img/redesign/icons/flags/lu.svg");
}
.flag.nl,
.field .intl-tel-input .iti-flag.nl {
    background-image: url("/img/redesign/icons/flags/nl.svg");
}
.flag.no,
.field .intl-tel-input .iti-flag.no {
    background-image: url("/img/redesign/icons/flags/no.svg");
}
.flag.pl,
.field .intl-tel-input .iti-flag.pl {
    background-image: url("/img/redesign/icons/flags/pl.svg");
}
.flag.pt,
.field .intl-tel-input .iti-flag.pt {
    background-image: url("/img/redesign/icons/flags/pt.svg");
}
.flag.ro,
.field .intl-tel-input .iti-flag.ro {
    background-image: url("/img/redesign/icons/flags/ro.svg");
}
.flag.sg,
.field .intl-tel-input .iti-flag.sg {
    background-image: url("/img/redesign/icons/flags/sg.svg");
}
.flag.us,
.field .intl-tel-input .iti-flag.us {
    background-image: url("/img/redesign/icons/flags/us.svg");
}
.flag.bg,
.field .intl-tel-input .iti-flag.bg {
    background-image: url("/img/redesign/icons/flags/bg.svg");
}
.flag.cz,
.field .intl-tel-input .iti-flag.cz {
    background-image: url("/img/redesign/icons/flags/cz.svg");
}
.flag.gr,
.field .intl-tel-input .iti-flag.gr {
    background-image: url("/img/redesign/icons/flags/gr.svg");
}
.flag.hr,
.field .intl-tel-input .iti-flag.hr {
    background-image: url("/img/redesign/icons/flags/hr.svg");
}
.flag.hu,
.field .intl-tel-input .iti-flag.hu {
    background-image: url("/img/redesign/icons/flags/hu.svg");
}
.flag.lt,
.field .intl-tel-input .iti-flag.lt {
    background-image: url("/img/redesign/icons/flags/lt.svg");
}
.flag.lv,
.field .intl-tel-input .iti-flag.lv {
    background-image: url("/img/redesign/icons/flags/lv.svg");
}
.flag.md,
.field .intl-tel-input .iti-flag.md {
    background-image: url("/img/redesign/icons/flags/md.svg");
}
.flag.me,
.field .intl-tel-input .iti-flag.me {
    background-image: url("/img/redesign/icons/flags/me.svg");
}
.flag.rs,
.field .intl-tel-input .iti-flag.rs {
    background-image: url("/img/redesign/icons/flags/rs.svg");
}
.flag.se,
.field .intl-tel-input .iti-flag.se {
    background-image: url("/img/redesign/icons/flags/se.svg");
}
.flag.sk,
.field .intl-tel-input .iti-flag.sk {
    background-image: url("/img/redesign/icons/flags/sk.svg");
}
.flag.si,
.field .intl-tel-input .iti-flag.si {
    background-image: url("/img/redesign/icons/flags/si.svg");
}
.flag.uz,
.field .intl-tel-input .iti-flag.uz {
    background-image: url("/img/redesign/icons/flags/uz.svg");
}
.flag.tr,
.field .intl-tel-input .iti-flag.tr {
    background-image: url("/img/redesign/icons/flags/tr.svg");
}
.flag.tj,
.field .intl-tel-input .iti-flag.tj {
    background-image: url("/img/redesign/icons/flags/tj.svg");
}
.flag.mt,
.field .intl-tel-input .iti-flag.mt {
    background-image: url("/img/redesign/icons/flags/mt.svg");
}
.flag.li,
.field .intl-tel-input .iti-flag.li {
    background-image: url("/img/redesign/icons/flags/li.svg");
}
.flag.kz,
.field .intl-tel-input .iti-flag.kz {
    background-image: url("/img/redesign/icons/flags/kz.svg");
}
.flag.kg,
.field .intl-tel-input .iti-flag.kg {
    background-image: url("/img/redesign/icons/flags/kg.svg");
}
.flag.il,
.field .intl-tel-input .iti-flag.il {
    background-image: url("/img/redesign/icons/flags/il.svg");
}
.flag.ge,
.field .intl-tel-input .iti-flag.ge {
    background-image: url("/img/redesign/icons/flags/ge.svg");
}
.flag.eg,
.field .intl-tel-input .iti-flag.eg {
    background-image: url("/img/redesign/icons/flags/eg.svg");
}
.flag.cy,
.field .intl-tel-input .iti-flag.cy {
    background-image: url("/img/redesign/icons/flags/cy.svg");
}
.flag.ba,
.field .intl-tel-input .iti-flag.ba {
    background-image: url("/img/redesign/icons/flags/ba.svg");
}
.flag.az,
.field .intl-tel-input .iti-flag.az {
    background-image: url("/img/redesign/icons/flags/az.svg");
}
.flag.am,
.field .intl-tel-input .iti-flag.am {
    background-image: url("/img/redesign/icons/flags/am.svg");
}
.flag.al,
.field .intl-tel-input .iti-flag.al {
    background-image: url("/img/redesign/icons/flags/al.svg");
}
.flag.mk,
.field .intl-tel-input .iti-flag.mk {
    background-image: url("/img/redesign/icons/flags/mk.svg");
}
.flag.mx,
.field .intl-tel-input .iti-flag.mx {
    background-image: url("/img/redesign/icons/flags/mx.svg");
}
.flag.br,
.field .intl-tel-input .iti-flag.br {
    background-image: url("/img/redesign/icons/flags/br.svg");
}
.flag.ar,
.field .intl-tel-input .iti-flag.ar {
    background-image: url("/img/redesign/icons/flags/ar.svg");
}
.flag.co,
.field .intl-tel-input .iti-flag.co {
    background-image: url("/img/redesign/icons/flags/co.svg");
}
.flag.cl,
.field .intl-tel-input .iti-flag.cl {
    background-image: url("/img/redesign/icons/flags/cl.svg");
}
.flag.pe,
.field .intl-tel-input .iti-flag.pe {
    background-image: url("/img/redesign/icons/flags/pe.svg");
}
.flag.ec,
.field .intl-tel-input .iti-flag.ec {
    background-image: url("/img/redesign/icons/flags/ec.svg");
}
.flag.uy,
.field .intl-tel-input .iti-flag.uy {
    background-image: url("/img/redesign/icons/flags/uy.svg");
}
.flag.py,
.field .intl-tel-input .iti-flag.py {
    background-image: url("/img/redesign/icons/flags/py.svg");
}
.flag.int,
.field .intl-tel-input .iti-flag.int {
    background-image: url("/img/redesign/icons/flags/int.svg");
}

.field .intl-tel-input {
    display: flex;
    background-color: var(--color-3);
    border: 1px solid;
    transition: border-color 0.2s ease-in-out;
}
.field .intl-tel-input:not(:hover) {
    border-color: var(--color-12);
}
.field .intl-tel-input:hover {
    border-color: var(--color-15);
}
.field.invalid .intl-tel-input {
    border-color: var(--color-16);
}
.field .intl-tel-input .selected-flag .iti-arrow {
    height: 8px;
    width: 12px;
    border: none !important;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
.field .intl-tel-input .selected-flag .iti-arrow:not(.up) {
    background-image: url(/img/redesign/icons/icon-arrow-down.svg);
}
.field .intl-tel-input .selected-flag .iti-arrow.up {
    background-image: url(/img/redesign/icons/icon-arrow-up.svg);
}
.field .intl-tel-input .flag-container {
    position: unset;
}
.field .intl-tel-input .flag-container .selected-flag {
    display: flex;
    align-items: center;
    gap: 12px;
    width: auto;
    padding: 12px 32px 12px 12px;
}
.field .intl-tel-input .flag-container + input {
    height: 50px;
    padding: 10px 16px !important;
    border: none;
}
.field .intl-tel-input .flag-container .country-list {
    width: 107px;
    max-height: 288px;
    margin-top: 5px;
    background-color: var(--color-3);
    border: none;
    border-radius: 2px;
    box-shadow: 0 2px 40px 0 #5E5E5E33;
    scrollbar-width: thin;
    scrollbar-color: #CCD3D9 transparent;
    overflow-x: hidden;
    overflow-y: auto;
}
.field .intl-tel-input .flag-container .country-list::-webkit-scrollbar {
    height: 3px;
    width: 3px;
}
.field .intl-tel-input .flag-container .country-list::-webkit-scrollbar-track,
.field .intl-tel-input .flag-container .country-list::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: #CCD3D9;
}
.field .intl-tel-input .flag-container .country-list .country {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
}
.field .intl-tel-input .flag-container .flag-box {
    margin: 0;
}
.field .intl-tel-input .flag-container .iti-flag {
    position: unset;
    flex: 0 0 auto;
    height: 16px;
    width: 22px;
    margin: 0;
}
.field .intl-tel-input .flag-container .country-name {
    display: none;
}
.field .intl-tel-input .flag-container .selected-flag .dial-code,
.field .intl-tel-input .flag-container .country-list .dial-code {
    color: var(--color-11);
    font-size: 16px;
    line-height: 26px;
}