/*
 * Doplňkové úpravy intl-tel-input tak, aby telefonní pole s vlaječkou a předvolbou
 * zapadla do stávajícího rozvržení formulářů (grid, plná šířka pole).
 */

/* Wrapper knihovny musí vyplnit buňku gridu stejně jako běžné pole. */
.iti {
    display: block;
    width: 100%;
}

/* Samotný input uvnitř wrapperu drží plnou šířku. */
.iti > input,
.iti > input[type="tel"],
.iti > input[type="text"],
.iti__tel-input {
    width: 100%;
    box-sizing: border-box;
}

/* Seznam zemí musí být nad ostatními prvky formuláře i nad mapou. */
.iti__dropdown-content {
    z-index: 1000;
}

/* Neplatné telefonní pole (vyplněné, ale ne v platném tvaru):
   jen červený rámeček a lehce červené pozadí. Text chyby je v atributu title. */
.iti-invalid.iti-invalid {
    border-color: #e03131;
    background-color: #fdecec;
}