/* Campos de contacto: teléfono internacional (banderita + prefijo),
 * país con banderas y ciudad dependiente. Usa las CSS vars del tema
 * para verse nativo en oscuro y claro. */

.tel-field {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
  width: 100%;
}

.tel-field__pais {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  max-width: 132px;
  padding-right: 1.9rem;
  text-overflow: ellipsis;
  cursor: pointer;
}

.tel-field__numero {
  flex: 1 1 auto;
  min-width: 0;
}

.ciudad-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
}

.ciudad-field__select,
.ciudad-field__texto {
  width: 100%;
}

.tel-field [hidden],
.ciudad-field [hidden] {
  display: none !important;
}

@media (max-width: 390px) {
  .tel-field__pais {
    max-width: 112px;
  }
}