/** @define FactDataTable */

.FactDataTable {
    &-row, &-headingRow, &-groupHeadingRow {
        display: flex;
    }

    &-row {
      padding: .5em 0;
      align-items: center;
      transition: background-color 100ms, border-color 100ms;
      border: solid 1px @default-bg;

      &:nth-child(even) {
          background-color: @default-no-items-bord;
      }

      &:hover {
        background-color: @default-list-header-bg;
        border-color: @default-border;
      }

      &--flexible {
          max-height: initial;
          align-items: flex-start;
      }

    }

    &-repeat {
        &:nth-child(even) {
            background-color: @default-no-items-bord;
        }
    }

    &-headingRow {
      background-color: @default-list-header-bg;
      border: none;
      padding: 8px 12px;

      .FactDataTable-column.FactDataTableHeading:first-child {
          padding-left: 0;
      }
    }

    &-groupHeadingRow {
        background-color: @default-icon-hov;
        padding: 1em 12px;
        color: @default-interface-txt;
        font-size: 14px;
    }

    &-column {
        padding: 8px;
        flex: 1 0 33%;
        align-self: flex-start;
        padding: 0;
        margin: 0;
        overflow: hidden;
        padding: 8px;
        word-wrap: break-word;
        &--offsetLeft {
            margin-left: 33%;
        }
    }

    &-columnArray {
        display: flex;
        flex-direction: column;
    }

    &-columnMember {
        margin-bottom: 16px;
        &:last-child {
            margin-bottom: inherit;
        }
    }
}

.FactDataError {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 200px;
    border-radius: 5px;
    border: 1px solid @list-no-items-bord;
    background-color: @default-no-items-bord;
    color: @list-no-items-txt;
    text-transform: uppercase;
}

.FactDataGroup {
    &-headings {
        &:hover {
            background-color: @default-bg;
            border-color: transparent;
        }
    }
    &-header {
        padding: 0;
    }
}

.FactDataTableHeading {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    font-size: 14px;
    color: @default-interface-txt;
    text-transform: uppercase;

    &-host {
        margin: 0;
    }
    &-date {
        flex-basis: auto;
    }

    // Override some global styling on h3 tags
    h3 {
        margin: 1em initial;
    }
}

.FactDatum {
    &--divergent {
        //margin-bottom: 0.5rem;
        background-color: @default-err;
        border: none;
        color: @default-bg;

        &:hover {
            background-color: @default-err;
            border: none;
        }
    }
}
