@use '../base/typography';

table.mat-mdc-table {
  .mdc-data-table__header-cell {
    @extend .gl-title-sm;
    padding: 8px 16px;
    &.mx-table__th--checkbox,
    &.mx-table__th--radio,
    &.mx-table__th--accordion {
      padding: 8px;
    }
  }

  .mat-mdc-table-sticky {
    &::before {
      content: '';
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
    }
  }

  .mdc-data-table__cell {
    @extend .gl-body-md;
    padding: 0 16px;

    &.mx-table__td--checkbox,
    &.mx-table__td--radio,
    &.mx-table__td--accordion {
      padding: 0 8px;
    }
  }

  .mx-table__tr--group {
    .mdc-data-table__cell {
      @extend .gl-title-sm;
    }
  }

  .mx-expandable-row {
    .mdc-data-table__cell {
      padding: 0;
      border-bottom-width: 0;
    }
  }
}

tr.mx-expandable-row {
  height: 0;
}

.mx-table {
  &__tr {
    &--collopsed {
      display: none;
    }

    &--child {
      &:not(:has(+ .mx-table__tr--group)) {
        .mx-table__td--indentation {
          border-bottom: 0px;
        }
      }
    }
  }

  &__th {
    &--checkbox,
    &--radio,
    &--accordion {
      width: 56px;
    }

    &--action {
      width: 72px;
    }
  }

  &__title {
    @extend .gl-title-md;
  }
  &__summary {
    @extend .gl-body-sm;
  }
}

.mx-table {
  &__toolbar {
    &--left {
      display: flex;
      align-items: center;
    }

    &-selection {
      display: flex;
      align-items: center;
      gap: 8px;

      &::after {
        content: '';
        display: block;
        width: 1px;
        height: auto;
        min-height: 36px;
        margin-right: 12px;
        margin-left: 4px;
      }
    }
  }
}