[data-component-name='Card'] {
  margin: 2.5rem 0;
  padding: 2.5rem;
  background: #f8f8f8;
  border: 1px solid #e8e8e8;

  &[data-card-icon='info'] {
    & .content {
      strong {
        color: #5b00b3;
      }
    }
  }

  &[data-card-icon='success'] {
    & .content {
      strong {
        color: #00ad4e;
      }
    }
  }

  &[data-card-icon='warning'] {
    & .content {
      strong {
        color: #e03400;
      }
    }
  }

  & .wrapper {
    padding: 0.62rem 0;
    max-width: 43.375rem;
    margin: 0 auto;

    display: flex;
    gap: 1.25rem;
  }

  & .icon-container {
    width: 4.5rem;
    height: 4.5rem;

    display: flex;
    align-items: center;
    justify-content: center;
  }

  & .content {
    width: 100%;

    a {
      color: #5B00B3;
    }
  }

  @media screen and (max-width: 767px) {
    padding: 1.25rem;

    & .wrapper {
      padding: 0;
      flex-direction: column;
    }
  }
}