/**
 * Lazy-loaded IS widget: until it is rendered and styled, keep it hidden, as
 * IS injects its markup before its stylesheet applies.
 */
.atix-is-shell {
  position: relative;
}

.atix-is-shell[aria-busy="true"] > [id^="is-WidgetWrapper"],
.atix-is-shell[aria-busy="true"] > #is-MapWrapper {
  visibility: hidden;
}

/* With a skeleton, the hidden widget leaves it the room. */
.atix-is-shell:has(> .atix-is-skeleton)[aria-busy="true"] > [id^="is-WidgetWrapper"],
.atix-is-shell:has(> .atix-is-skeleton)[aria-busy="true"] > #is-MapWrapper {
  position: absolute;
  inset-inline: 0;
  top: 0;
}

.atix-is-shell[aria-busy="false"] > .atix-is-skeleton {
  display: none;
}

/* Rows mirror the IS journey form, rounded to the closest RDDS tokens. */
.atix-is-skeleton {
  display: flex;
  flex-direction: column;
  animation: atix-is-skeleton-pulse 1.5s ease-in-out infinite;
}

.atix-is-skeleton span {
  display: block;
  border-radius: var(--rd-radius-sm);
  background-color: var(--rd-color-grey-100);
}

.atix-is-skeleton__actions {
  display: flex;
  justify-content: space-between;
  margin-block-end: var(--rd-spacing-20);
}

.atix-is-skeleton__mention {
  align-self: flex-end;
  width: 40%;
  height: var(--rd-spacing-12);
  margin-block: var(--rd-spacing-4) var(--rd-spacing-8);
}

.atix-is-skeleton__field {
  height: var(--rd-spacing-48);
}

.atix-is-skeleton__field + .atix-is-skeleton__field {
  margin-block-end: var(--rd-spacing-20);
}

.atix-is-skeleton__option {
  width: 60%;
  height: var(--rd-spacing-40);
}

.atix-is-skeleton__option--small {
  width: 30%;
}

.atix-is-skeleton__button {
  height: var(--rd-spacing-48);
}

.atix-is-skeleton__map {
  /* IS map height, no matching token. */
  height: 18.75rem;
  margin-block-start: var(--rd-spacing-48);
}

@keyframes atix-is-skeleton-pulse {
  50% {
    opacity: 0.5;
  }
}

@media (prefers-reduced-motion: reduce) {
  .atix-is-skeleton {
    animation: none;
  }
}
