.root
  height 33px
  width 100%
  position relative
  cursor pointer
  transition 0.15s
  color $nav-inactive-text-color
  &:hover
    background-color $nav-hover-background
    .control
      opacity 1
  &:active, &:hover:active
    background-color $nav-active-background
    color $nav-text-color

.root--active
  @extend .root
  background-color $nav-active-background
  color $nav-text-color
  &:hover
    background-color $nav-active-background
    color $nav-text-color
  .control
    opacity 1

.label
  position absolute
  left 0
  top 0
  bottom 0
  right 48px
  padding-left 20px
  line-height 33px
  overflow-x hidden

.label-name
  margin-left 5px

.control
  opacity 0
  position absolute
  top 0
  bottom 0
  right 5px
  width 24px
  transition opacity 0.15s

.control-button
  width 24px
  height 24px
  margin-top 4.5px
  border none
  border-radius 5px
  background-color transparent
  color $nav-inactive-text-color
  transition color background-color 0.15s
  &:hover
    background-color $nav-hover-background
  &:active
    background-color $nav-active-background
    color $nav-text-color
.root--edit
  @extend .root

.nameInput
  absolute top bottom
  left 10px
  right 10px
  height 33px
  padding 0 10px
  border-radius 5px
  border solid 1px $nav-border-color
  outline none
  &:focus
    border-color $focus-border-color
  &:disabled
    background-color $disabled-input-background

.root--folded
  @extend .root
  width 44px
  &:hover .label-name
    width 100px
  .label
    padding-left 0
    text-align center
    right 0
  .label-icon
    width 44px
  .label-name
    position fixed
    height 34px
    left 44px
    width 0
    box-sizing border-box
    margin-left 0
    overflow ellipsis
    background-color $nav-tooltip-background-color
    color white
    line-height 34px
    border-top-right-radius 5px
    border-bottom-right-radius 5px
    transition width 0.15s
    pointer-events none
  .control
    display none

.root--folded--active
  @extend .root--folded
  background-color $nav-active-background
  color $nav-text-color
  &:hover
    background-color $nav-active-background
    color $nav-text-color

.root--edit--folded
  @extend .root--edit
  .nameInput
    position fixed
    top inherit
    bottom inherit
    width 100px