@import "../bootstrap-core/tables";

// SEB Specific styles for tables

// tables
.table:not(.table-bordered) thead tr th {
  border-top-color: transparent;
}

.table thead tr th {
  font-weight: $font-weight-medium;
  border-bottom-width: $table-border-width;
  color: $table-head-color;
}

.table {

  &.table-expandable {
    tbody tr:not(.row-expanded) {
      cursor: pointer;
    }
    tbody tr:not(.row-expanded):hover::before {
      cursor: pointer;
      background: escape-svg(url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23fff' d='M443.5 162.6l-7.1-7.1c-4.7-4.7-12.3-4.7-17 0L224 351 28.5 155.5c-4.7-4.7-12.3-4.7-17 0l-7.1 7.1c-4.7 4.7-4.7 12.3 0 17l211 211.1c4.7 4.7 12.3 4.7 17 0l211-211.1c4.8-4.7 4.8-12.3.1-17z'/%3E%3C/svg%3E"));
      background-color: $blue;
      background-repeat: no-repeat;
      background-size: $font-size-base;
      background-position: center;
    }
    tr::before {
      display: table-cell;
      content: '';
      width: $font-size-base;
      height: $font-size-base;
      background: escape-svg(url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%230092e1' d='M443.5 162.6l-7.1-7.1c-4.7-4.7-12.3-4.7-17 0L224 351 28.5 155.5c-4.7-4.7-12.3-4.7-17 0l-7.1 7.1c-4.7 4.7-4.7 12.3 0 17l211 211.1c4.7 4.7 12.3 4.7 17 0l211-211.1c4.8-4.7 4.8-12.3.1-17z'/%3E%3C/svg%3E"));
      background-size: $font-size-base;
      background-repeat: no-repeat;
      padding: 0 1rem;
      background-position: center;
      border-top: solid $table-border-width $table-border-color;
      transition: transform ease-in-out 300ms;
      transform: scaleY(1);

    }
    tr.row-open::before {
      transform: scaleY(-1);
    }
    tr.row-expanded::before {
      background: none;
      border-top: transparent;

    }
    thead {
      tr::before {
        background: none;
        border-top: transparent;
      }
    }
  }

  .row-expanded, .row-open {
    // background: $gray-100;
  }
  .row-expanded {
    // border-bottom: solid $table-border-color 2px;
  }
  border-bottom: solid $table-border-width $table-border-color;

  @include table-sort();
}
