/**
 * ПРОСТЫЕ СТИЛИ ДЛЯ ТЕЛЕФОНА
 */

/* Контейнер */
.iti {
    width: 100% !important;
}

/* Инпут */
.iti input {
    width: 100% !important;
    padding: 16px 20px !important;
    background: transparent !important;
    border: 2px solid var(--tp-48) !important;
    border-radius: 12px !important;
    color: var(--wizard-text-option) !important;
    font-family: 'Geologica', sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 140% !important;
    transition: border-color 0.3s ease !important;
    text-align: center !important; /* Центрируем текст */
}

.iti input::placeholder {
    color: var(--wizard-gray-6) !important;
    font-family: 'Geologica', sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    /* text-align: center !important; */
}

.iti input:focus {
    outline: none !important;
    border-color: var(--wizard-primary) !important;
    background: transparent !important;
    color: var(--wizard-text-option) !important;
}

/* Код страны */
.iti__selected-dial-code {
    color: var(--wizard-text-option) !important;
    font-family: 'Geologica', sans-serif !important;
    font-weight: 500 !important;
}

/* Выпадающий список - ТЕМНЫЙ */
.iti__country-list {
    background: var(--wizard-bg-primary) !important;
    border: 2px solid var(--wizard-primary) !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important;
    max-height: 200px !important;
}

.iti__country {
    padding: 8px 16px !important;
    color: var(--wizard-text-option) !important;
    font-family: 'Geologica', sans-serif !important;
    font-size: 14px !important;
}

.iti__country:hover {
    background: var(--tp-36) !important;
    color: var(--wizard-text-primary) !important;
}

.iti__dial-code {
    color: var(--wizard-text-secondary) !important;
}

/* Поиск */
.iti__search-input {
    background: var(--wizard-bg-secondary) !important;
    border: 1px solid var(--tp-48) !important;
    color: var(--wizard-text-option) !important;
    font-family: 'Geologica', sans-serif !important;
}

.iti__search-input:focus {
    outline: none !important;
    border-color: var(--wizard-primary) !important;
}

/* Учитываем сдвиг от флага и кода страны */
#userPhone {
    padding-left: 32px !important;
    text-align: center !important;
}

/* Когда инпут в фокусе, текст смещается влево от центра */
#userPhone:focus {
    text-align: left !important;
    padding-left: 100px !important;
}

/* Сдвигаем placeholder влево с помощью text-indent
#userPhone::placeholder {
    text-indent: -25px !important;
    text-align: center !important;
}
*/
/* Мобильные */
@media (max-width: 767px) {
    .iti input {
        font-size: 14px !important;
        height: 48px !important;
        padding: 12px 16px !important;
    }

    #userPhone {
        padding-left: 80px !important;
    }

    /*
    #userPhone::placeholder {
        text-indent: -20px !important;
    }
    */
}