.table-container {
  max-width: 100%;
  overflow-x: auto;
}

.v-data-table {
  &.width-auto {
    table {
      width: auto;
    }
  }

  .v-data-table__mobile-row {
    min-height: 32px;

    &:first-child {
      background-color: $color-table-header-bg;
      color: #fff;
    }
  }
}

.v-data-table-header-mobile {
  th {
    background-color: #fff;
  }
}

table {
  margin-bottom: 2rem;
  border-collapse: collapse;

  a {
    text-decoration: none;
  }

  thead {
    font-family: 'Spectral SC', serif;
  }

  tr {

  }

  th, td {
    padding: 6px 12px;
    border-bottom: none !important;
  }
}

.theme--light {
  thead {
    background-color: $color-table-header-bg;
    color: #fff;

    tr {
      th {
        color: #fff !important;
        i {
          color: #fff !important;
        }
      }
    }
  }
  tbody {
    tr {
      &:nth-of-type(even) {
        background-color: $color-light-gray;
      }
      &:nth-of-type(odd):hover {
        background-color: inherit !important;
      }
      td {
      }
    }
  }
}

.theme--dark {
  thead {
    background-color: darken($color-gray, 10);
  }
  tbody {
    tr {
      &:nth-of-type(even) {
        background-color: darken($color-gray, 10);
      }
      &:nth-of-type(odd):hover {
        background-color: inherit !important;
      }
      td {
      }
    }
  }
}