@require '{ohif:design}/app'

$timepointButtonHeight = 55px

.studyTimepointBrowser
  theme('background-color', '$primaryBackgroundColor')
  float: left
  height: 100%
  position: relative
  width: 100%

  .timepointButtonContainer
    theme('background-color', '$primaryBackgroundColor')
    theme('border-bottom', '1px solid $uiBorderColor')
    display: none
    height: $timepointButtonHeight
    left: 10px
    position: absolute
    right: 10px
    top: 0
    z-index: 1

  &.viewTypeVisible

    .timepointButtonContainer
      display: block

    .studyTimepointScrollArea
      padding-top: $timepointButtonHeight

  .studyTimepointScrollArea
    height: 100%
    overflow-x: hidden
    overflow-y: auto
    margin-right: -36px
    padding-bottom: 20px
    padding-right: 36px
    -ms-overflow-style: none

    &::-webkit-scrollbar
      display: none