/* Petit drapeau devant un numéro de téléphone étranger (SVG hébergés dans assets/flags). */
.phone-flag {
    display: inline-block;
    width: 16px;
    height: 12px;
    margin-right: 6px;
    vertical-align: -1px;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
}

/* Numéro révélé au clic sur « N° téléphone » : une seule ligne, drapeau compris. */
.phone-reveal {
    white-space: nowrap;
    font-size: 0.74rem;
}

/* Champ téléphone du profil (MemberPhoneType) : pays étroit collé au numéro, qui prend le reste.
   Sans largeur fixe, la liste prenait la largeur du nom de pays le plus long et écrasait le numéro. */
.phone-row {
    display: flex;
    gap: 6px;
}
.phone-row .phone-country {
    flex: 0 1 11rem;
    min-width: 0;
}
/* Le numéro garde de quoi afficher « 06 38 97 30 32 » : quand la place manque, c'est le pays qui se resserre. */
.phone-row .phone-number {
    flex: 1 0 9.5rem;
    min-width: 0;
}
/* Téléphone étroit : côte à côte, le numéro serait coupé ; pays au-dessus du numéro, toujours collés. */
@media (max-width: 479.98px) {
    .phone-row {
        flex-wrap: wrap;
    }
    .phone-row .phone-country,
    .phone-row .phone-number {
        flex: 1 1 100%;
    }
}