[data-controller~="common--autocomplete-address"] {
  --flex-gap: 1.5rem; /* Variable for gap */

  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--flex-gap);

  div:has([name$="[address][address]"]) {
    width: 100%;
  }

  div:has([name$="[address][address1]"]),
  div:has([name$="[address][address2]"]) {
    width: calc((100% / 2) - (((2 - 1) / 2) * var(--flex-gap)));
  }

  div:has([name$="[address][city]"]),
  div:has([name$="[address][zipCode]"]),
  div:has([name$="[address][country]"]),
  div:has([name$="[birthplace][birthPlace]"]),
  div:has([name$="[birthplace][bornPlaceCity]"]),
  div:has([name$="[birthplace][bornPlaceZipCode]"]) {
    width: calc((100% / 3) - (((3 - 1) / 3) * var(--flex-gap)));
  }
}