.wds-info-prompt {
  --Prompt-border-radius: var(--radius-medium);
  --Prompt-gap: var(--size-8);
  --Prompt-padding-x: var(--size-12);
  --Prompt-padding-y: var(--size-12);

  &__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: calc(var(--size-48) * 10);

    &:has(.wds-info-prompt__title) {
      justify-content: flex-start; /* Top align when title exists */
    }
  }
  &__title,
  &__description {
    display: block;
  }

  &__action {
    align-self: flex-start;
    margin-top: var(--Prompt-gap);
  }

  &__media {
    // To ensure icons are sized correctly, we set a fixed size for SVGs within the media wrapper
    svg {
      width: var(--size-24);
      height: var(--size-24);
    }
  }

  .wds-prompt__media-wrapper {
    padding: 0;

    @media (--screen-400-zoom) {
      padding-top: var(--size-4);
    }

    &:has(.wds-info-prompt__media > .tw-icon) {
      @media (--screen-400-zoom) {
        padding-top: var(--size-8);
      }
    }

    // More padding for when there is a title
    &:has(+ .wds-info-prompt__content .wds-info-prompt__title:first-child) {
      @media (--screen-400-zoom) {
        padding-top: var(--size-8);
      }

      &:has(.wds-info-prompt__media > .tw-icon) {
        @media (--screen-400-zoom) {
          padding-top: var(--size-12);
        }
      }
    }
  }
}
