.critical-comms {
  border-radius: var(--radius-medium);
  overflow: hidden;

  .alert {
    background-color: var(--color-sentiment-background-surface);
    color: var(--color-sentiment-content-primary);
    margin-bottom: 0;

    .np-text-title-body {
      color: var(--color-sentiment-content-primary);
    }
  }

  .status-circle.negative {
    background-color: var(--color-background-screen);

    .status-icon {
      color: var(--color-content-primary);
    }
  }

  .alert__message {
    .alert__action {
      margin-top: var(--size-16);
    }
  }

  .wds-Button {
    --Button-color: var(--color-content-primary);
    --Button-color-hover: var(--color-content-primary);
    --Button-color-active: var(--color-content-primary);

    --Button-background: var(--color-background-screen);
    --Button-background-hover: var(--color-sentiment-interactive-primary-hover);
    --Button-background-active: var(--color-sentiment-interactive-primary-active);

    // Override legacy neptune CSS selector `.np-theme-personal .alert-negative a`
    &[class] {
      color: var(--Button-color);

      &:hover {
        color: var(--Button-color-hover);
      }

      &:active {
        color: var(--Button-color-active);
      }
    }
  }

  .alert-warning .wds-Button {
    --Button-background-hover: var(--color-sentiment-interactive-secondary-neutral-hover);
    --Button-background-active: var(--color-sentiment-interactive-secondary-neutral-active);
  }

  @media (--screen-md) {
    .alert-warning,
    .alert-negative,
    .alert-neutral {
      .alert__message {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        width: 100%;

        .alert__action {
          margin-top: 0;
          margin-left: var(--padding-small);
        }
      }
    }
  }
}