:host {
  display: inline-flex;
  flex-direction: column;
  vertical-align: top;
  --r-input--container--margin-top: 0;
  --r-input--container--margin-bottom: 0;
}
:host slot {
  display: contents;
}
:host ::slotted(r-select) {
  min-width: var(--r-input-phone-number--select--min-width, 7rem);
  width: var(--r-input-phone-number--select--width, fit-content);
}
:host r-input.focused {
  --r-input--container--border-style: solid;
}

:host([full-width]:not([full-width=false])) {
  width: 100%;
}

.r-input-phone-number {
  margin-top: var(--r-input-phone-number--margin-top, var(--r-spacing-025, 0.25rem));
  margin-bottom: var(--r-input-phone-number--margin-bottom, var(--r-spacing-025, 0.25rem));
  width: var(--r-input-phone-number--width, 100%);
  display: var(--r-input-phone-number--display, inline-flex);
  justify-content: var(--r-input-phone-number--justify-content, center);
  align-items: var(--r-input-phone-number--align-items, center);
  gap: var(--r-input-phone-number--gap, 0);
}
.r-input-phone-number--label-container {
  display: var(--r-input-phone-number--label-container--display, flex);
  gap: var(--r-input-phone-number--label-container--gap, var(--r-spacing-100, 1rem));
  align-items: var(--r-input-phone-number--label-container--align-items, center);
  justify-content: var(--r-input-phone-number--label-container--align-items, space-between);
}
.r-input-phone-number--label-container ::slotted([slot=popover]) {
  display: var(--r-input-phone-number--popover--display, inline-flex);
  height: var(--r-input-phone-number--popover--height, var(--r-spacing-150, 1.5));
  align-items: var(--r-input-phone-number--popover--align-items, center);
  justify-content: var(--r-input-phone-number--popover--justify-content, center);
  margin-right: var(--r-input-phone-number--popover--margin-right, -0.25rem);
  --r-popover--trigger--min-width: var(--r-input-phone-number--popover-trigger--min-width, var(--r-spacing-150, 1.5));
  --r-popover--trigger--min-height: var(--r-input-phone-number--popover--trigger--min-height, var(--r-spacing-150, 1.5));
}
.r-input-phone-number r-input {
  margin-left: -1px;
  flex: 1;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
