﻿/*
    Used to manage styles related to SF's internal scrollbar

*/


// basic scroll styles
.scroll-container {
  clear: both;

  .viewport {
    position: relative;
    overflow: hidden;
  }

  .overview {
    position: absolute;
    top: 0;
    left: 0;
    list-style: none;
  }

  .track {
    position: relative;
    padding: 0;
    background-color: @scroll-track-color;
    border-radius: 4px;
  }

  .thumb {
    position: absolute;
    overflow: hidden;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    background-color: @scroll-thumb-color;
    border-radius: 120px;
    // keeps the thumb from being selectable like text

    -webkit-touch-callout: none;
     -khtml-user-select: none;
  }

  .disable {
    display: none;
  }
}

// styles for verticle scrollers
.scroll-container-vertical {
  width: 520px;

  .viewport {
    width: 500px;
    height: 375px;
  }

  .overview {
    width: 100%;
  }

  .scrollbar {
    position: relative;
    float: right;
    width: 15px;
  }

  .track {
    width: 1px;
    height: 100%;
    border-radius: 4px;
  }

  .thumb {
    top: 0;
    width: 13px;
    height: 20px;
    margin-left: -6px;
  }
}

// styles for horizonal scrollers
.scroll-container-horizontal {
  width: 100%;
  margin: 0;

  .viewport {
    width: 100%;
    min-height: 200px;
  }

  .scrollbar {
    position: relative;
    height: 15px;
    margin: 0 auto;
    clear: both;
  }

  .track {
    width: 13px;
    height: 1px;
    padding: 0 1px;
  }

  .thumb {
    width: 20px;
    height: 13px;
    margin-top: -8px;
    border-radius: 10px;
  }
}

// styles for scrollers in panels
/* needed JME 7/22/2015 
.panel-widget .scroll-container,
.panel-default .scroll-container {
    .track {
        background-color: @axxxxccent-color;
    }

    .thumb {
        background-color: darken(@axxxxxccent-color, 10%);
    }
}*/

.noSelect {
  -webkit-user-select: none;
     -moz-user-select: none;
       -o-user-select: none;
          user-select: none;

   -khtml-user-select: none;
}
