/* houzzhunt — global intl-tel-input field styling
   Makes the country-code/flag dropdown blend with every form on the site. */

/* intl-tel-input wraps each phone <input> in a .iti element — keep it full
   width so the field never shrinks inside its form column. */
.iti {
    width: 100%;
    display: block;
}

.iti input,
.iti input[type="tel"],
.iti input[type="text"] {
    width: 100%;
}

/* Dropdown list sits above other form chrome. */
.iti__country-list {
    text-align: left;
    z-index: 1100;
}

/* RTL (Arabic): keep the dial code / flag block left-to-right so the flag and
   "+code" stay in the expected order. */
html[dir="rtl"] .iti--separate-dial-code .iti__selected-flag {
    direction: ltr;
}

/* --- Subscribe ("Get in touch") floating-label field ---
   Once the input is wrapped in .iti it is no longer a direct sibling of its
   <label>, so the floating-label rule (input:not(:placeholder-shown) + label)
   can no longer reach it. Keep that label permanently raised and clear of the
   dial code. */
.hhlead-field .iti {
    width: 100%;
}

.hhlead-field .iti + label {
    top: 6px;
    left: 16px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: #09747f;
    z-index: 3;
}

.hhlead-field .iti + label i {
    color: #09747f;
}