// DataDashboard ~~ MIT License
// External libraries -- Styling

@import "static/utility-box";

// Bubble help
@bubbleHelp: crimson;
.bubble-help-hover >.bubble-wrap >.bubble-help { color: white; background-color: @bubbleHelp; }
.bubble-help-hover >.bubble-wrap >.bubble-pointer { color: @bubbleHelp; }

// Simple-DataTables
.dataTable-wrapper {
   .dataTable-top {
      padding: 0px;
      margin-bottom: 5px;
      .dataTable-dropdown {
         label {
            padding-left: 1px;
            select {
               margin-bottom: 4px;
               }
            }
         }
      .dataTable-search {
         }
      }
   .dataTable-container {
      table.dataTable-table {
         border-collapse: collapse;
         thead {
            tr {
               .TableHeaderRow();
               }
            }
         tbody {
            tr {
               .TableBodyRow();
               }
            }
         }
      }
   .dataTable-bottom {
      padding: 0px;
      .dataTable-info {
         }
      .dataTable-pagination {
         li {
            a {
               outline: none;
               }
            }
         }
      }
   &.no-footer {
      .dataTable-container {
         border-bottom: none;
         }
      }
   }
.FixSortArrows() {
   a.dataTable-sorter {
      padding-right: 15px;  //space for sort arrows
      &::before, &::after {
         right: 10px;
         bottom: 10px;
         font-size: 0.6rem;
         border: none;  //remove default triangle
         color: black;
         opacity: 0.3;
         }
      &::before {
         content: @symbolTriangleDown;
         }
      &::after {
         content: @symbolTriangleUp;
         }
      }
   &.asc a.dataTable-sorter::after,
   &.desc a.dataTable-sorter::before {
      opacity: 1;
      }
   }
.TableHeaderRow() {
   th {
      .FixSortArrows();
      font-size: 1.1rem;
      padding: 8px 20px 8px 0px;
      &:last-child {
         padding-right: 0px;
         }
      a.dataTable-sorter {
         .PlainLink();
         }
      }
   }
.TableBodyRow() {
   td {
      text-align: left;
      padding: 8px 20px 8px 0px;
      &:last-child {
         padding-right: 0px;
         }
      &:first-child {
         white-space: nowrap;
         }
      }
   }