/************************
Mods to the default theme
*************************/

.jquery-tablesorter tr[data-absolute-url] {
  cursor: pointer;
}

.tablesorter-pager li > span.p-btn {
  cursor: pointer;
}

.search {
  float: right;
}

table.tablesorter .tablesorter-processing {
  background-image: none !important;
}

.pagination li span {
  color: #000;
}

.p-pagedisplay:hover {
  background: none !important;
  cursor: default;
  color: #000 !important;
}

.pr-pl-0 {
  padding-right: 0px;
  padding-left: 0px;
}

/* css needed to get compare selector */

.date-select {
  display: flex;
  border: none;
  margin: 0;
}

.compare-select, .compare-select-wrapper input {
  margin-right: 5px;
  /* this is the bootstrap class form-control, since we can't add it to the select, we just give it the whole css */
  /* TODO: find a prettier way to do that */
  display: block;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.compare-select {
  width: 50%;
  float: left;
}

.compare-select-wrapper {
  width: 45%;
  float: right;
}

.compare-select-wrapper input {
  width: 100%;
}

/***
 * Nicer processing icon from the fiddle linked from https://mottie.github.io/tablesorter/docs/example-option-show-processing.html
 */

/* "tablesorter-processing" is added to both the table and header cells;
 only target the cells for when specific columns are "busy" */
table .tablesorter-processing .tablesorter-header-inner {
  color: rgba(0, 0, 0, .1);
}

table .tablesorter-processing .tablesorter-header-inner:before {
  content: ' ';
  position: relative;
  overflow: hidden;
  color: transparent;
  left: calc(50% + 14px);
  /* 14px = 1/2 of 18px padding for sort arrows + 1/2 of 10px width of this block */
  display: inline-block;
  margin-left: -10px;
  /* using :before bumps inner div by the width */
  border-radius: 50%;
  border-width: 2px;
  border-style: solid;
  border-color: transparent transparent #000 #000;
  width: 10px;
  height: 10px;
  animation: tsloading .5s infinite linear;
}
@keyframes tsloading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
