@import '../../vendor/carbon-components/scss/globals/scss/vars';
@import 'TableHead/table-head';
@import 'TableFoot/table-foot';
@import 'TableSkeletonWithHeaders/table-skeleton-with-headers';
@import 'TableCellRenderer/table-cell-renderer';
@import 'TableDetailWizard/table-detail-wizard';
@import 'TableMultiSortModal/table-multi-sort-modal';
@import '../../globals/vars';

table.#{$prefix}--side-nav--data-table {
  white-space: nowrap;
}

.#{$iot-prefix}--data-table--row-actions {
  height: 0;
}

.#{$iot-prefix}--data-table--fixed {
  table-layout: fixed;
}

.#{$iot-prefix}--data-table--column-groups {
  border-collapse: separate;
}

.#{$iot-prefix}--table__cell--truncate {
  max-width: 0;
}

td.#{$iot-prefix}--table__cell--sortable {
  padding-right: $spacing-09;
}

.#{$iot-prefix}--data-table--resize td {
  word-break: break-all;
}

.#{$iot-prefix}--table-container {
  min-width: unset;
  padding-top: 0;

  .addons-iot-table-container {
    overflow-x: auto;
  }
}

html[dir='rtl'] {
  .#{$iot-prefix}--expanded-tablerow td:first-of-type:before {
    left: auto;
    right: 0;
  }
  .#{$iot-prefix}--expanded-tablerow > td * {
    text-align: right;
  }

  td.#{$iot-prefix}--table__cell--sortable {
    padding-left: $spacing-08;
  }
}

.#{$iot-prefix}--empty-table--table-row {
  height: calc(100% - #{$spacing-09});
  &:hover td {
    background: inherit;
  }
  .empty-table-cell--default {
    --height-threshold: 500px;
    --is-large-card: Min(1px, Max(var(--card-content-height) - var(--height-threshold), 0px));
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    // 3rem since we can't multiply 1px * 3rem in calc
    // stylelint-disable-next-line declaration-property-unit-blacklist
    padding: Max(calc(48 * var(--is-large-card)), 0px);
    svg {
      margin: $spacing-05;
    }

    & > * {
      margin: $spacing-03;
    }
  }

  td {
    border-bottom: unset;
  }
}

.#{$iot-prefix}--table__advanced-filters-container {
  background-color: $ui-01;
  padding: $spacing-02 $spacing-04;
  border-top: 1px solid $ui-03;

  .#{$prefix}--tag {
    color: $interactive-01;
    background-color: $carbon--blue-20;
  }
}

// needed specificity to override .iot--tooltip-svg-wrapper and allow flyout to align
// properly with button
button.#{$prefix}--btn.#{$iot-prefix}--tooltip-svg-wrapper.#{$prefix}--btn--ghost.#{$iot-prefix}--table-toolbar__advanced-filters-button {
  border: 1px solid transparent;

  &.#{$iot-prefix}--table-toolbar-button-active {
    @include box-shadow;
  }
}

// regression fix for tiny expand chrevron on some expandable table rows
.#{$prefix}--data-table thead th.#{$prefix}--table-expand,
.#{$prefix}--data-table tbody td.#{$prefix}--table-expand {
  height: $spacing-07;
  width: $spacing-08;
}