@use 'src/styles/abstracts' as *;

.DataList {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: 100%;
  &__toolbarItems {
    height: 2rem;
    margin-left: $space-md;
    display: flex;
    align-items: center;
  }
  &__textsTable {
    border: $border-grey;
    border-radius: $border-radius-md;
    overflow: hidden;
    width: 100%;
    .BaseTable__body {
      & > div {
        width: 100% !important;
        .BaseTable__row {
          width: 100% !important;
        }
      }
    }
  }
  &__mark {
    background-color: $mark-color;
    color: $pico;
  }
  .VisualizationLoader {
    height: 100% !important;
  }
  .BaseTable {
    &__table-main {
      outline: none;
    }
    &__header {
      &-row {
        background: #ebf0f8;
        border-bottom: none;
      }
      &-cell {
        border-bottom: $border-grey;
        padding: 0 toRem(16px);
        &:last-child {
          border-right: none;
        }
        &-text {
          font-size: $text-md;
        }
      }
    }
    &__row {
      border-bottom: none;
      cursor: initial;
      &--hovered {
        background: #e8f1fc;
      }

      &-cell {
        position: relative;
        min-height: 24px;
        max-height: 300px;
        padding: 0 $space-unit;
        border-right: unset;
        border-bottom: $border-grey;
        display: flex;
        p {
          word-break: break-all;
          white-space: normal;
        }

        &:last-child {
          display: flex;
          border-right: none;
          white-space: normal;
          &:has(> pre) {
            overflow: auto !important;
          }
        }
      }

      &:last-child {
        box-shadow: $cuddle-50 0px 1px 0px 0px;
        .BaseTable__row-cell {
          border-bottom: none;
        }
      }
    }
  }
}
