header.top-menu
  height: 90px
  background-color: transparent
  background-repeat: no-repeat, no-repeat
  background-position: left bottom, right bottom
  background-image: image-url('theme1/button-bar-left.png'), image-url('theme1/button-bar-right.png')
  color: $primary-color
  padding-left: 48px
  padding-right: 52px
  .menu-content
    background-color: white
    background-repeat: repeat-x
    background-position: center bottom
    background-image: image-url('theme1/button-bar-middle.png')
    //min-height: 61px
    height: 100%
    section
      height: 52px
      line-height: 48px
      &.main-buttons
        float: left
        @media #{$medium-up}
          padding-left: 14px
          a
            span.icon
              display: none
        @media #{$large-up}
          a
            span.icon
              display: inline-block
              margin-right: 4px
        a
          padding-left: 16px
          &.active
            text-decoration: underline
            font-weight: bold
            color: $current-color
          @media #{$small-only}
            span
              display: none
              &.icon
                display: inline-block
            &.active
              span.icon
                color: $current-color
        .top-menu-root
          display: inline-block
          line-height: normal
          padding: 4px
          //margin-left: 14px
          border-radius: 4px
          &.active
            background-color: $current-color
          img
            display: inline-block
            margin: 0
            padding: 0
  .supplier-name
    display: inline-block
    float: right
    margin-right: 10px
    line-height: 50px
    font-weight: bold
    color: #555
  .extra-info
    position: absolute
    top: 0
    right: 0
    color: white
    .supplier-info-row
      // float: right
      // clear: right
      // line-height: 27px
      // padding-right: 7px
    .table-number
      display: inline-block
      //text-transform: lowercase
    .supplier-orders-placed-count
      display: inline-block
      // margin-right: 15px
    .supplier-orders-in-process-count
      display: inline-block
.orders-placed-count-icon
  @extend .fa
  @extend .fa-clock-o
  @extend .fa-lg
  margin-left: 3px
.orders-in-process-count-icon
  @extend .fa
  @extend .fa-check
  @extend .fa-lg
  margin-left: 3px
.toggle-side-menu
  position: absolute
  width: 28px
  height: 28px
  color: white
  left: 0
  cursor: pointer
  z-index: 100
  font-size: 1.4em
  &.open
    color: white
  span
    @extend .fa
    @extend .fa-bars
    @extend .fa-lg

// CURRENT EMPOYEE NAV
.current-employee-nav
  float: right
  margin-right: 10px
.dropdown-trigger.gravatar
  display: inline-block
  overflow: hidden
  border-radius: $global-rounded

// SUPPLIER AVAILABILITY
.supplier-availability
  border: 2px solid #555
  border-radius: 4px
  padding: 2px 5px
  font-weight: bold
  font-size: 0.9em
  float: right
  margin-right: 8px
  text-transform: uppercase
  margin-top: 10px
  &.currently-open
    color: #3c3
  &.currently-closed
    color: #f55