/* Elementor Telefone Brasil */

.ebp-phone-wrap.iti {
    position: relative;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    --ebp-prefix-space: 64px;
    --ebp-input-color: inherit;
}

.ebp-phone-wrap.iti input[type="tel"],
.ebp-phone-wrap.iti input.ebp-phone-input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    /* O JS mede bandeira + +55 e deixa apenas uma pequena folga antes do número. */
    padding-left: var(--ebp-prefix-space, 64px) !important;
}

.ebp-phone-wrap .iti__flag-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    height: 100%;
    display: flex;
    align-items: center;
    z-index: 2;
    pointer-events: none;
}

.ebp-phone-wrap .iti__selected-flag {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
    /* Menos espaço à direita para aproximar o número do +55. */
    padding: 0 2px 0 7px;
    background: transparent;
    color: var(--ebp-input-color, inherit);
}

.ebp-phone-wrap .iti__flag {
    display: block;
    width: 20px;
    height: 14px;
    flex: 0 0 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 1px;
}

.ebp-phone-wrap .iti__selected-dial-code {
    color: var(--ebp-input-color, inherit) !important;
    line-height: 1;
    white-space: nowrap;
}

/* Não existe dropdown: a seta fica sempre escondida. */
.ebp-phone-wrap .iti__selected-flag .iti__arrow {
    display: none !important;
}

/* Mensagem discreta de erro no próprio campo. */
.ebp-phone-wrap input.ebp-phone-invalid {
    outline: 1px solid currentColor;
}