@import('NoteDetailInfo')
@import('DetailVars')

.root
  absolute top right bottom
  border-width 0 0 1px
  border-style solid
  border-color $ui-borderColor
  background-color $ui-noteDetail-backgroundColor
  box-shadow $note-detail-box-shadow

.lock-button
  padding-bottom 3px

.control-lockButton
  topBarButtonLight()

.control-lockButton-tooltip
  tooltip()
  position fixed
  pointer-events none
  top 50px
  z-index 200
  padding 5px
  line-height normal
  border-radius 2px
  opacity 0
  transition 0.1s

.control-fullScreenButton
  float right
  padding 0 0 2px 0
  topBarButtonLight()

.body
  absolute left right
  left $note-detail-left-margin
  right $note-detail-right-margin
  top $info-height + $info-margin-under-border
  bottom $statusBar-height

.body-noteEditor
  absolute top bottom left right

body[data-theme="dark"]
  .root
    border-color $ui-dark-borderColor
    background-color $ui-dark-noteDetail-backgroundColor
    box-shadow none

  .control-lockButton
    topBarButtonDark()

  .control-lockButton-tooltip
    darkTooltip()

  .control-fullScreenButton
    topBarButtonDark()