/*
 * AltiusOne — Phone widget (HTML natif, style Ki-Admin input-group)
 *
 * Layout : flex row compact, select ~130px + input flex-grow.
 * Aucun JavaScript requis. Le <select> natif supporte la recherche
 * typeahead du navigateur : tape "s-u-i" → saute à Suisse automatiquement.
 */

.phone-widget {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    align-items: stretch;
}

/* Select pays : compact 130px, bords arrondis à gauche uniquement */
.phone-widget > .phone-country-select {
    flex: 0 0 130px;
    width: 130px;
    min-width: 130px;
    max-width: 130px;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-right: 0 !important;
    /* On tronque le texte affiché dans le bouton (le nom du pays est long),
       mais toutes les options restent cherchables via typeahead. */
    text-overflow: ellipsis;
    padding-right: 1.75rem !important; /* laisser la place à la flèche */
    font-variant-numeric: tabular-nums;
}

/* Input numéro : prend tout le reste de la largeur */
.phone-widget > .phone-national-input {
    flex: 1 1 auto;
    min-width: 0; /* permet au flex-item de rétrécir sans overflow */
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}