@import '../../styles/variables.scss';

$message-cls-name: '#{$css-prefix}message';

.#{$message-cls-name} {
  &.#{$css-prefix}medium {
    padding-left: 16px;
    padding-right: 12px;

    &.#{$css-prefix}inline:not(.#{$message-cls-name}-loading) {
      border: 0;
    }

    .#{$message-cls-name}-symbol {
      line-height: 21px;

      &:before {
        font-size: 14px;
        width: 14px;
        line-height: inherit;
      }
    }

    &.#{$css-prefix}title-content {
      .#{$message-cls-name}-title {
        line-height: 22px;
      }
    }

    .#{$message-cls-name}-content {
      line-height: 20px;
      margin-top: 0;
    }

    &.#{$css-prefix}only-content {
      .#{$message-cls-name}-symbol {
        line-height: 19px;

        &:before {
          font-size: 14px;
          width: 14px;
          line-height: inherit;
        }
      }

      .#{$message-cls-name}-content {
        line-height: 20px;
      }
    }

    .#{$message-cls-name}-close {
      top: 13px;
      right: 12px;

      .#{$css-prefix}icon-close {
        transform: scale(0.8);
      }
    }
  }
}

.#{$message-cls-name}.#{$css-prefix}toast.#{$css-prefix}overlay-inner.#{$message-cls-name}-wrapper {
  // always overlapped on topbar
  // http://gitlab.alibaba-inc.com/wind/wind/issues/55974
  z-index: 1031;
}