.message {
  &.is-list {
    margin: $size-10 0;
  }

  &.is-warning {
    .message-body {
      color: $yellow-darkest;
      padding: 0.75rem 1.25rem;
    }
  }

  &.is-highlight {
    background: $yellow-lightest;
    .message-body {
      border: none;
      box-shadow: 0 0 0 1px $yellow;
      color: $yellow-darkest;
    }
    .has-text-highlight,
    .close-button {
      color: $yellow;
    }
    .title,
    code {
      background: none;
      color: inherit;
    }
    .content .button {
      border-color: $yellow;
      color: $yellow-darkest;
    }
  }

  .content {
    margin-bottom: 0;
  }
}
