@import "./base.less";

.@{css-prefix}.message {
  .padding;
  font-size: 1em;
  color: #333;
  background-color: #f8f8f9;
  .border;
  border-radius: @border-radius;
  margin: 1em 0;

  &:last-child {
    margin-bottom: 0;
  }

  &.attached {
    margin: 0;
    border-radius: 0;
    border-bottom-width: 0;
    
    &.top {
      border-radius: @border-radius @border-radius 0 0;
    }

    &.bottom {
      border-bottom-width: 1px;
      margin-bottom: 1em;
      border-radius: 0 0 @border-radius @border-radius;
    }
  }

  &.warning {
    background: @warning-background-color;
    color: @warning-font-color;
  }

  &.error {
    background: @error-background-color;
    color: @error-font-color;
  }

  &.success {
    background: @success-background-color;
    color: @success-font-color;
  }

  &.info {
    background: @info-background-color;
    color: @info-font-color;
  }
}


.@{css-prefix}.card > .content,
.@{css-prefix}.tabs > .content .pane {
  > .message.attached {
    border-radius: 0;
    border-left: none;
    border-right: none;
    &:first-child {
      border-top: 0;
    }
    &:last-child {
      border-bottom: 0;
    }
    &.top {
      border-bottom-width: 1px;
      border-top: none;
    }
    &.bottom {
      border-bottom: none;
      margin-bottom: 0;
    }
  }
}