.n-alert
  display flex
  padding 8px 12px
  color #031333
  &-icon
    flex-shrink 0
    display inline-flex
    align-items center
    margin-right 4px
    height 24px
  &-closable
    flex-shrink 0
    display inline-flex
    align-items center
    margin-left 8px
    color #9AA1AD
    height 24px
    cursor pointer
  &-wrapper
    flex 1
  &-title
    line-height 24px
    font-size 16px
    font-weight 500
  &-content
    white-space pre-wrap
    line-height 24px
    font-size 13px

.n-alert-type-info
  background #D7E8FC
  border-color #BBDFFF
  .n-alert-icon
    color #1776F2
  .n-alert-closable:hover
    color #1776F2

.n-alert-type-success
  background #EBFAE8
  border-color #D9F6D5
  .n-alert-icon
    color #23A609
  .n-alert-closable:hover
    color #23A609

.n-alert-type-warning
  background #FFF3E0
  border-color #FFE3B9
  .n-alert-icon
    color #FF6B00
  .n-alert-closable:hover
    color #FF6B00

.n-alert-type-error
  background #FBEAED
  border-color #FFDEE3
  .n-alert-icon
    color #EE2E14
  .n-alert-closable:hover
    color #EE2E14

.n-alert-border-rect
  border-width 1px
  border-style solid
  border-radius 4px

.n-alert-size-small
  padding 2px 6px
  .n-alert-title
    font-size 15px
  .n-alert-content
    font-size 12px
  .n-alert-title + .n-alert-content
    margin-top -4px

.n-alert
  .n-note
    font-size 13px
    line-height 24px