#vcomment
  font-size: 1.1em

  .vbtn
    border: none
    background: var(--btn-bg)
    color: var(--btn-color)

    &:hover
      background: var(--btn-hover-color)

  .vimg
    transition: all .3s

    &:hover
      transform: rotate(360deg)

  .vcards .vcard .vcontent.expand
    &:before,
    &:after
      z-index: 22

#waline-wrap
  --waline-font-size: 1.1em
  --waline-theme-color: $button-bg
  --waline-active-color: $button-hover-color

  .wl-comment-actions > button:not(last-child)
    padding-right: 4px

if hexo-config('valine.bg')
  #vcomment
    textarea
      background: url(hexo-config('valine.bg')) 100% 100% no-repeat

      &:focus
        background-image: none

if hexo-config('waline.bg')
  #waline-wrap
    textarea
      background: url(hexo-config('waline.bg')) 100% 100% no-repeat

      &:focus
        background-image: none

.fireworks
  position: fixed
  top: 0
  left: 0
  z-index: $fireworks-zIndex
  pointer-events: none

.medium-zoom-image--opened
  z-index: 99999 !important
  margin: 0 !important

.medium-zoom-overlay
  z-index: 99999 !important

.mermaid-wrap
  margin: 0 0 20px
  text-align: center

  & > svg
    height: 100%

.utterances,
.fb-comments iframe
  width: 100% !important

#gitalk-container
  .gt-meta
    margin: 0 0 .8em
    padding: 6px 0 16px

.katex-wrap
  overflow: auto

  if hexo-config('katex') && hexo-config('katex.hide_scrollbar')
    &::-webkit-scrollbar
      display: none

// Mathjax
mjx-container
  overflow-x: auto
  overflow-y: hidden
  padding-bottom: 4px
  max-width: 100%

  &[display]
    display: block !important
    min-width: auto !important

  &:not([display])
    display: inline-grid !important

mjx-assistive-mml
  right: 0
  bottom: 0

.aplayer
  color: $font-black

#article-container
  .aplayer
    margin: 0 0 20px

    if hexo-config('beautify.enable')
      ol,
      ul
        margin: 0
        padding: 0

        li
          margin: 0
          padding: 0 15px

          &:before
            content: none

.snackbar-css
  border-radius: 5px !important

.abc-music-sheet
  margin: 0 0 20px
  opacity: 0
  transition: opacity .3s

  &.abcjs-container
    opacity: 1

+maxWidth768()
  .fancybox__toolbar__column.is-middle
    display: none