.main-topbar
  position: sticky
  top: 0
  z-index: z-index('main', 'topbar')

  &__theme-switcher,
  &__lang-switcher,
  &__tree-switcher
    margin-right: space-x(1)

  &__tree-switcher
    $fixed-width: 136px

    width: $fixed-width

  // add hovering effect
  &.navbar-dark .navbar-text:hover
    color: $navbar-dark-hover-color

  // remove Bootstrap native rules
  &__hand-button .nav-link,
  &__help-button .nav-link
    padding-left: initial
    padding-right: initial
  &__logo
    margin-right: initial

  @include right-handed
    flex-direction: row

    &__logo
      margin-left: 0
      margin-right: space-x(2)

    &__hand-button
      margin-left: space-x(2)
      margin-right: space-x(1)

    &__help-button
      margin-left: space-x(1)
      margin-right: space-x(2)

  @include left-handed
    flex-direction: row-reverse

    &__logo
      margin-left: space-x(2)
      margin-right: 0

    &__hand-button
      margin-left: space-x(1)
      margin-right: space-x(2)

    &__help-button
      margin-left: space-x(2)
      margin-right: space-x(1)


#corporatop.nav-tabs > li
    padding-left: 1
    padding-right: 1

#corporatop.nav-tabs > li > a
    padding-top: 8
    padding-bottom: 8
    line-height: .85
    margin-bottom: -5px

.spacing-class
  margin-right: 10px

.exportbtn
    /* border: 1px solid #333 */
    margin-top:17px /* valigns with bootstrap h2 */

.btn .glyphicon
    /* glyphicons are always rendered too high within bootstrap buttons */
    vertical-align: middle


/* graph name => editable input => submitName() => minimsg */
.editable
    color: grey

#graphname-edit
    color: white
    background-color: transparent
    border: none
    max-width: 8em

.minimsg
  font-size: .7em
  padding: 7p0x 9px

.minimsg *
  line-height: 100%

.tile-menu

  &__item

    .fa
      margin-right: space-x(1)
