.custom-block
  .custom-block-title
    font-weight 600
    margin-bottom .2rem
  p
    margin 0
  &.tip, &.warning, &.danger, &.note
    padding .5rem 1.5rem
    border-left-width .5rem
    border-left-style solid
    margin 1rem 0
  &.tip
    background-color #f3f5f7
    border-color #42b983
    color darken(#42b983, 50%)
  &.warning
    background-color #FFF7D0
    border-color darken(#ffe564, 35%)
    color darken(#ffe564, 70%)
    .custom-block-title
      color darken(#ffe564, 50%)
    a
      color var(--textColor)
  &.danger
    background-color #ffe6e6
    border-color darken(red, 20%)
    color darken(red, 70%)
    .custom-block-title
      color darken(red, 40%)
    a
      color var(--textColor)
  &.note
    background-color #E8F5FA
    border-color #157BAE
    color darken(#157BAE, 40%)
  &.right
    color var(--textColor)
    font-size 0.9rem
    text-align right
  &.theorem
    margin 1rem 0
    padding .8rem 1.5rem
    border-radius 2px
    background-color var(--customBlockBg)
    .title
      font-weight bold
      margin .5rem 0
  &.details
    display block
    position relative
    border-radius 2px
    margin 1em 0
    padding 1.6em
    background-color var(--customBlockBg)
    p
      margin .8rem 0
    h4
      margin-top 0
    figure, p
      &:last-child
        margin-bottom 0
        padding-bottom 0
    summary
      outline none
      cursor pointer
      &:hover
        color $accentColor

// 深色模式适配
.theme-mode-dark
  .custom-block
    &.warning
      background-color rgba(255, 247, 208, .2)
      color darken(#ffe564, 35%)
      .custom-block-title
        color darken(#ffe564, 15%)
    &.tip
      background-color rgba(243, 245, 247, .2)
      color darken(#42b983, 0%)
    &.danger
      background-color rgba(255, 230, 230, .4)
      color darken(red, 50%)
      a
        color $accentColor
    &.note
      background-color rgba(243, 245, 247, .2)
      color darken(#157BAE, 0%)