/*
 * Layout-Korrekturen für die Rufnummern-Eingabe (intl-tel-input v29).
 *
 * Die Bibliothek liefert den Wrapper .iti als inline-block. In Bootstrap-Formularen
 * sind Labels ebenfalls inline-block — dadurch rutscht das Label neben das Feld und
 * die Eingabe nimmt nicht die volle Breite ein. Beides wird hier geradegezogen.
 */
.iti {
    display: block;
    width: 100%;
}

/* Label gehört über das Feld, nicht daneben */
label[for="telefoninput"] {
    display: block;
    width: 100%;
}

/* Die Länderliste muss über Karten und Tabellen liegen */
.iti__dropdown-content {
    z-index: 1056;
}

/* In zentrierten Formularen (Partnerbereich) links ausrichten */
.iti__country-list,
.iti__dropdown-content {
    text-align: left;
}

/* Nummernseiten: Feld mittig und in angenehmer Breite statt über die volle Zeile */
.phone-field {
    text-align: center;
}

.phone-field .iti {
    max-width: 22rem;
    margin-left: auto;
    margin-right: auto;
}

.phone-field .form-text,
.phone-field .text-danger,
.phone-field .text-success {
    text-align: center;
}