// import base bootstrap - separate from frontend
@import url("bootstrap.min.css");

// Core variables and mixins separate from frontend variables and mixins
@import "dashboard/variables.less"; // Modify this for custom colors, font-sizes, etc
@import "dashboard/mixins.less";

// Components: Icons / Fonts
@import "font-awesome/font-awesome.less"; // Replaced sprites with font-awesome
@import "font-awesome/font-awesome-ie7.less";


// TYPES CHANGES
// -----------
h1, h2, h3, h4, h5, h6 {
  margin-bottom:@baseLineHeight / 2;
  margin-top:0;
  font-weight:normal;
}
h2 {
    font-size: 18px;
}
body {
  font-family: @baseFontFamily;
}
h3.app-ico:before {
    display: none;
}
// BUTTONS
// -----------
.btn {
  text-transform:uppercase;
  font-size:11px;
}
.btn,
.btn-warning,
.btn-danger,
.btn-success,
.btn-info {
  .buttonBackground(#9e9e9e, #656565);
}
.btn-primary {
  .buttonBackground(#86a4ab, #436a77);
}
.btn,
.btn:hover {
  text-shadow: 0 -1px 0 rgba(0,0,0,.25);
  color: @white;
}
.btn + a {
  margin-left:10px;
}
// FORM CHANGES
// -----------
.form-horizontal .control-group {
  margin-bottom:@baseLineHeight / 2;
}
.form-horizontal .control-label {
    text-align: left;
}
.form-inline {
  margin-bottom: 0;
  label {
    margin-right: 5px;
  }
  .control-group {
    margin-right:20px;
  }
}
/* ADDITIONAL ERRORS */
.errorlist {
  margin:0 0 0 20px;
  padding:0 0 10px 0;
  color:#B94A48;
  li {
    padding:0 0 5px 0;
    list-style:none;
  }
}
.form-inline {
  .help-block {
    display:inline-block;
    margin:0 20px 0 10px;
    li {
      list-style:none;
      color:#B94A48;
    }
  }
  input[type=text],
  select {
    width: 140px;
  }
}
// TABLE CHANGES
// -----------
.table-bordered,
.table-bordered th,
.table-bordered td  {
  border-color:#bbb;
}
.table-striped tbody tr:nth-child(odd) td,
.table-striped tbody tr:nth-child(odd) th {
  background-color: #efefef;
}
// OSCAR DASHBOARD UNIQUE STYLES
// -----------
body {
  background:#fff;
}
.container-fluid {
  padding-left: @gridGutterWidth;
  padding-right: @gridGutterWidth;
  max-width:100%;
}
.navbar-fixed-top .navbar-inner {
  padding-left:  20px;
  padding-right: 20px;
}
.navbar .nav > li span {
    display:block;
    padding:10px;
}
.subnav-fixed {
  position: fixed;
  right: 0;
  left: 0;
  z-index: @zindexFixedNavbar;
  top:40px;
  .box-shadow(0 1px 5px rgba(0,0,0,.1));
  border-bottom:1px solid #D5D5D5;
}
.subnav {
  #gradient > .vertical(#f5f5f5, #eee);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
  height:36px;
  width: 100%;
}
.subnav {
  .nav {
    padding-left:  20px;
    padding-right: 20px;
    > li {
      > a {
        margin: 0;
        padding-top: 11px;
        padding-bottom: 11px;
        border-left: 1px solid #f5f5f5;
        border-right: 1px solid #E5E5E5;
        .border-radius(0);
      }
    }
  }
}
.reports .subnav li.Reports > a,
.orders .subnav li.Manage.orders > a,
.users .subnav li.Users > a,
.content-blocks .subnav li.Content.blocks > a,
.catalogue .subnav li.Catalogue > a,
.subnav .nav > .active > a,
.subnav .nav > .active > a:hover {
  padding-left: 13px;
  color: #777;
  background-color: #E9E9E9;
  border-right-color: #DDD;
  border-left: 0;
  .box-shadow(inset 0 3px 5px rgba(0,0,0,.05));
}
.breadcrumb {
  margin-top:100px;
}
.content {
  background:#fff;
}
button {
  background-color:transparent;
}
.page-header {
  background-color: @white;
  padding: 10px 20px 10px 0;
  margin-bottom: 0;
  border-bottom: 0;
}
caption {
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 8px;
}
.search-adv {
  margin:0;
  position:relative;
  ul, li, li > label, > label, input[type=text] {
    display:inline-block;
  }
  > input[type=text] {
    width:80px;
  }
  ul {
    margin:0;
  }
}
.product-new {
  .form-inline.pull-left {
    margin-right:15px;
  }
}
.no-float {
  float:none;
}
.control-group.pull-left.no-float {
  > label {
    width: 140px;
  }
  .controls {
    margin-left: 160px;
  }
}
.pull-left.btn {
  margin-left:20px;
}
.pull-left.no-float.btn {
  margin-left:160px;
}
.controls {
  ul {
    margin-left:0px;
    list-style:none;
  }
}
.alert-message.block-message.file_upload p {
  margin-right:10px;
}
.tabs.product_managment {
  margin-bottom:0px;
  li.active a {
    background-color:#efefef;
  }
}
.tabbable.dashboard {
  .nav {
    padding-left:5px;
  }
  .tab-content {
    display:block;
    width:auto;      
    border-top-width:0;
  }
}
.fields-full {
  input[type=text],
  textarea {
    width:99%;
  }
}
// WELLS
// -----
.well,
.alert,
.table-bordered {
  .border-radius(0);
}
.well {
  .clearfix();
  box-shadow: none;
  background-color: #efefef;
  border-color: #dddbdb;
}
.well-success {
  background-color: @successBackground;
  border-color: @successBorder;
}
.well-danger {
  background-color: @errorBackground;
  border-color: @errorBorder;
}
.well-info {
  background-color: @infoBackground;
  border-color: @infoBorder;
}
.well-blank {
  background-color: @white;
  border-color: rgba(0,0,0,.1);
}
.create-page .well,
.promotions .well-info {
    background-color: @white;
    border-color: rgba(0,0,0,.1);
}
// ALERTS
// -----
.alert {
  background-color: #fff49f;
  border-color: #ede181;
  color: #333;
}
// DASHBOARD GRAPH
// ----------------
#order-graph {
    position: relative;
    margin-bottom: 5em;
    width: 99%;
    height: @graphHeight;
}
.bar-caption{
    position: absolute;
    color: @grayLight;
    text-align: center;
    opacity: 0.4;
    top: 50%;
    left: 50%;
}
.bar-y-axis{
    position: absolute;
    top: 16px;
    width: 5em;
    margin: 0;
    padding: 0;
    float: left;
    display: inline;
}
.bar-y-axis li{
    list-style:none;
    height: @graphSegmentsHeight;
    float: right;
}
.bar-chart, .bar-chart dt, .bar-chart dd{
    margin:0;
    padding:0;
}
.bar-chart{
    position: absolute;
    top: 0;
    left: 0;

    width: 98%;
    height: @barHeight;
    padding-left: 5em;
}
.bar-chart dd{
    position: relative;
    float: left;
    width: @barWidth;
    height: @graphHeight;
    margin-top: 22px;
}
.bar-chart dd em{
    position: absolute;
    bottom: -2em;
    right: 0;
}
.bar-chart span{
    position: absolute;
    display: block;
    width: 90%;
    bottom: 0;
    left: 0;
    z-index: 1;
    color: @gray;
    text-align: center;
    text-decoration: none;
}
.bar-chart span p{
    position: relative;
    top: 1em;
    display: inline;
    padding: 3px;
    color: @grayDark;
    z-index: 2;
    background-color: @white;
    font-weight: bold;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
}
.bar-layer:hover span p {
}
.bar-chart span{
    height: 50%;
    background: #87e0fd; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #87e0fd 0%, #53cbf1 40%, #05abe0 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#87e0fd), color-stop(40%,#53cbf1), color-stop(100%,#05abe0)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(-45deg, #87e0fd 0%,#53cbf1 40%,#05abe0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(-45deg, #87e0fd 0%,#53cbf1 40%,#05abe0 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(-45deg, #87e0fd 0%,#53cbf1 40%,#05abe0 100%); /* IE10+ */
    background: linear-gradient(-45deg, #87e0fd 0%,#53cbf1 40%,#05abe0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#87e0fd', endColorstr='#05abe0',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
}
// ORDER SUMMARY
// ----------------
.order-summary {
  .horiz_col();
    background:#efefef;
    li {
      width: @fifth;
      text-align:center;
    }
    div {
      border-left:1px solid #dcdcdc;
      padding:20px 10px;
      min-height:85px;
    }
    strong {
      display:block;
      margin-top:20px;
    }
    li {
      width: 16%;
    }
    li:first-child div {
      border-left:none;
    }
}

// PRODUCT UPDATE
// ----------------
.orders_search {
  position:absolute;
  top:40px;
  width:100%;
  left:-20px;
  padding:0 20px;
  background:#cfe1e3;
  .clearfix();
  .control-group:first-child {
    margin-top:20px;
  }
  .btn {
    margin-bottom:20px;
  }
}
.orders_search.collapse {
  display:none;
}
.orders_search.in.collapse {
  display:block;
}
.category-select {
  display:block;
  margin:0;
  a {
    color:@grayDarker;
    text-decoration:none;
    padding:3px 10px;
    display:block;
    &:hover {
      background:darken(@grayLighter, 5%);
    }
  }
  a.app-ico {
    color:@linkColor;
  }
  ul {
    margin:0;
    a {
      padding-left:18px;
    }
    ul a {
      padding-left:33px;
      ul a { padding-left:48px; }
    }
  }
  li {
    display:block;
  }
}
.category-select > li ul {
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -o-transition: all .2s linear;
  -ms-transition: all .2s linear;
  transition: all .2s linear;
  overflow: hidden;
}
.ico_expand + ul {
  height:0px;
}
.category-selected {
  margin:0;
  li {
    display:block;
    width:150px;
    .clearfix();
    margin-bottom:@baseLineHeight / 2;
  }
  span {
    float: right;
    display: block;
    background: @grayLight;
    color: white;
    padding: 1px 0 3px;
    .border-radius(15px);
    font-size: 12px;
    line-height: 11px;
    width: 15px;
    font-weight: bold;
    text-align: center;
  }
}
.product-new textarea {
  width: 100%;
  display:block;
  margin:0 auto;
  color:#000;
  font-family:@baseFontFamily;
}
.upload-image {
  .clearfix();
  margin:0;
  li {
    display:block;
    width: 200px;
    margin:0 1% 2%;
    float: left;
    text-align:center;
    > div {
      padding: 4px;
      background: #ccc;
      margin-bottom: 10px;
      + label,
      + label + input {
        display: none;
      }
    }
  }
  div {
    background:#fff;
    position: relative;
    width: 200px;
    height: 200px;
    z-index: 200;
  }
  img {
    position: absolute;
    margin:auto;
    top: 0;
    max-height:200px;
    max-width:200px;
    width: auto;
    height: auto;
    left: 0;
  }
  .image-input {
    z-index: 800;
  }
  .image-input button {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    .border-radius(0);
  }
  .input-field {
    position: relative;
    z-index: 1000;
    opacity: 0;
  }
  .input-field input {
    position: absolute;
    border-width: 0 0 100px 200px;
    filter: alpha(opacity=0);
    -moz-transform: translate(-100px, 0) scale(1);
    direction: ltr;
    cursor: pointer;
    width: 200px;
    height: 200px;
  }
}

.stock-pricing {
    label,
    .control-group div {
      display: inline-block;
    }
    label,
    .control-group div {
      width:100px;
    }
    select {
      width:130px;
    }
    input[type=text] {
       width:120px;
    }
}
.product-details,
.product-details + .well {
    input[type=text],
    select {
        width: 50%;
    }
}
// PLUGINS
// -----
 /* date picker */
 #ui-datepicker-div {background:#FFFFFF;width:218px;box-shadow:2px 2px 2px #AAAAAA;}
 #ui-datepicker-div .ui-datepicker-header {position:relative;padding:5px;text-align:center;background:#dddddd;font-weight:bold;}
 #ui-datepicker-div .ui-datepicker-prev {position:absolute;top:6px;left:6px;cursor:pointer;}
 #ui-datepicker-div .ui-datepicker-next {position:absolute;top:6px;right:6px;cursor:pointer;}
 #ui-datepicker-div table {width:100%;}
 #ui-datepicker-div th,
 #ui-datepicker-div td {padding:0px;text-align:center;}
 #ui-datepicker-div th {padding:4px;}
 #ui-datepicker-div td a {padding:4px;display:block;}
 #ui-datepicker-div td .ui-state-highlight {background:#eeeeee;}
 #ui-datepicker-div td .ui-state-active {color:#FFFFFF;background:#0088CC;}

/* TINY SCROLL BAR */
 .scroll-pane {
	height: 200px;
	overflow: auto;
	background:lighten(@grayLighter, 5%);
	.border-radius(5px);
	border:2px solid lighten(@grayLight, 20%);
 }
 .scroll-pane:focus {
	outline:none;
 }
 .jspContainer{overflow:hidden;position:relative}
 .jspPane{position:absolute}
 .jspVerticalBar{position:absolute;top:0;right:0;width:10px;height:100%;background:red}
 .jspHorizontalBar{position:absolute;bottom:0;left:0;width:100%;height:10px;background:red}
 .jspVerticalBar *,.jspHorizontalBar *{margin:0;padding:0}
 .jspCap{display:none}.jspHorizontalBar .jspCap{float:left}
 .jspTrack{background:#efefef;position:relative}
 .jspDrag{background:#ccc;position:relative;top:0;left:0;cursor:pointer;.border-radius(5px);}
 .jspHorizontalBar .jspTrack,.jspHorizontalBar .jspDrag{float:left;height:100%}
 .jspArrow{background:#50506d;text-indent:-20000px;display:block;cursor:pointer}
 .jspArrow.jspDisabled{cursor:default;background:#80808d}
 .jspVerticalBar .jspArrow{height:10px}
 .jspHorizontalBar .jspArrow{width:10px;float:left;height:100%}
 .jspVerticalBar .jspArrow:focus{outline:0}
 .jspCorner{background:#eeeef4;float:left;height:100%}
 * html .jspCorner{margin:0 -3px 0 0}

/* Changes for wysihtml5 */
textarea {
	width: 500px;
	height: 400px;
}
// MODALS
// -----
.modal {
  > form {
    margin-bottom:0;
  }
}
// WYSIHTML5
// ---------

.wysihtml5-toolbar {
  .clearfix();
}

textarea.plain {
	font-family: monospace;
}
