.LinkTable {
  padding: 0;
  width: 100%;

  th,
  td {
    &[data-field-name='getRoleNames'] {
      white-space: pre;
    }

    padding: var(--gap-m) calc(var(--gap-m) / 2);
    vertical-align: top;

    &:first-child {
      padding-left: 0;
    }

    &:last-child {
      padding-right: 0;
    }

    &.date,
    &.time {
      white-space: nowrap;
    }
  }

  > thead > tr {
    border-bottom: 1px solid var(--color-gray3);

    > th {
      .Text.is-s;

      font-weight: bold;
      padding-bottom: var(--gap-s);
      padding-top: var(--gap-s);
    }
  }

  > li > .LinkTable-noLinkText,
  > li > a {
    display: block;
    padding: var(--gap-m) 0;
  }

  > tbody > tr,
  > li {
    border-top: 1px solid var(--color-gray3);

    &:first-child {
      border-color: transparent;
    }
  }
}

.LinkTable.is-compact {
  > thead {
    display: none;
  }

  > tbody > tr {
    display: flex;
    flex-wrap: wrap;
    padding: var(--gap-m) 0;

    > .LinkTable-main {
      order: -1;
      padding: 0;
      width: 100%;
    }

    > td:not(.LinkTable-main) {
      .Text.is-s;

      align-items: center;
      color: var(--color-gray5);
      display: flex;
      padding: 0;

      &:empty {
        display: none;
      }

      &:not(.LinkTable-first)::before {
        background: var(--color-gray6);
        border-radius: 50%;
        content: '';
        display: inline-block;
        height: 2px;
        margin: 0 var(--gap-s);
        width: 2px;
      }
    }
  }
}

.LinkTable.is-scrollable {
  overflow: auto;
}

th.hasComboInput {
  align-content: flex-start;
  display: flex;

  > span {
    margin-right: var(--gap-s);
  }

  > .ComboInput {
    margin-top: calc(-1 * var(--gap-s));
  }
}
