@import 'colors.scss';
@import 'variables';

:host {
  .content {
    //width: 100%;
    font-weight: 600;
    font-size: 12px;
    line-height: 24px;
    text-transform: uppercase;
    color: $active-grey-color;
  }

  .table-content {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  table {
    border-collapse: collapse;
    margin-bottom: $margin-64;

    th {
      color: $active-grey-color;
    }

    th,
    td {
      border-bottom: 1px solid $latter-grey-color;
      font-size: $font-size-14;
      font-weight: normal;
      padding: $padding-24 $padding-12;
      text-align: left;

      &.center {
        justify-content: center;
        text-align: center;
      }
    }

    .mat-mdc-row {
      position: relative;

      &:hover {
        background-color: $hardly-grey-color;
      }
    }

    .mat-row-link {
      cursor: pointer;
      height: 100%;
      left: 0;
      margin: 0;
      min-height: 100%;
      min-width: 100%;
      position: absolute;
      top: 0;
      width: 100%;
    }

    .item {
      margin-bottom: $margin-4;
    }
  }
}
