table {
  border-spacing: 0;
  font-size: var(--font-size-small);

  thead {
    th {
      @apply font-medium text-left uppercase text-slate-900 dark:text-slate-200;
    }
  }

  tbody {
    tr {
      @apply border-b border-slate-50 dark:border-slate-700;
    }

    td {
      padding: var(--space-small);
    }
  }
}

.woot-table {
  tr {
    .show-if-hover {
      opacity: 0;
      transition: opacity 0.2s $swift-ease-out-function;
    }

    &:hover {
      .show-if-hover {
        opacity: 1;
      }
    }
  }

  .agent-name {
    display: block;
    font-weight: var(--font-weight-medium);
    text-transform: capitalize;
  }

  .woot-thumbnail {
    border-radius: 50%;
    height: 3.125rem;
    width: 3.125rem;
  }

  .button-wrapper {
    @include flex-align(left, null);
    @include flex;
    flex-direction: row;
    min-width: 12.5rem;
  }

  .button {
    margin: 0;
  }
}