.table {
  --table-border: var(--divider-grey);
  --table-header-bg: var(--highlighted);
  --table-stripe-bg: var(--greylight);
  --table-radius: 1rem;
  --table-cell-min: 5.3125rem;
  --table-sortable-active-bg: linear-gradient(#00000014, #00000014), var(--highlighted);
}
.table .table-head {
  max-width: calc(8 * var(--column) + (8 - 1) * var(--gutter));
}
.table .table-heading {
  margin: 0 0 0.5rem;
  font: var(--h3-font);
  color: var(--black);
}
.table .table-description {
  margin: 0 0 1.5rem;
  font: var(--body-font);
  color: var(--subdued);
}
.table .table-search {
  position: relative;
  max-width: 22.1875rem;
  margin-bottom: 1rem;
}
.table .table-search-icon {
  position: absolute;
  top: 50%;
  left: 1rem;
  width: 1.5rem;
  height: 1.5rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: var(--black);
  -webkit-mask-image: url("../../assets/icons/icon-search.svg");
          mask-image: url("../../assets/icons/icon-search.svg");
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  pointer-events: none;
}
.table .table-search-input {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0.625rem 1rem 0.5rem 2.75rem;
  border: 1px solid var(--grey);
  border-radius: 62.4375rem;
  background-color: var(--white);
  color: var(--black);
  font: var(--body-font);
  font-size: 1rem;
  -webkit-transition: border-color var(--bezier), -webkit-box-shadow var(--bezier);
  transition: border-color var(--bezier), -webkit-box-shadow var(--bezier);
  transition: border-color var(--bezier), box-shadow var(--bezier);
  transition: border-color var(--bezier), box-shadow var(--bezier), -webkit-box-shadow var(--bezier);
}
.table .table-search-input::-webkit-input-placeholder {
  color: var(--subdued);
}
.table .table-search-input::-moz-placeholder {
  color: var(--subdued);
}
.table .table-search-input:-ms-input-placeholder {
  color: var(--subdued);
}
.table .table-search-input::-ms-input-placeholder {
  color: var(--subdued);
}
.table .table-search-input::placeholder {
  color: var(--subdued);
}
.table .table-search-input:hover:not(:focus) {
  border-color: var(--black);
}
.table .table-search-input:focus, .table .table-search-input:focus-visible {
  outline: none;
  border-color: var(--black);
  -webkit-box-shadow: 0 0 0 0.125rem var(--white), 0 0 0 0.25rem var(--black);
          box-shadow: 0 0 0 0.125rem var(--white), 0 0 0 0.25rem var(--black);
}
.table .table-scroll {
  width: 100%;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--table-border);
  border-radius: var(--table-radius);
  overflow-x: auto;
}
.table .table-scroll.is-fitted {
  overflow-x: visible;
}
.table .table-scroll.is-scrollable {
  border-right-color: transparent;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.table .table-scroll.is-scrollable .table-table thead th:last-child {
  border-top-right-radius: 0;
}
.table .table-table {
  width: 100%;
  border-collapse: collapse;
  font: var(--body-font);
  font-size: 1rem;
  color: var(--black);
}
.table .table-table th,
.table .table-table td {
  padding: 0.875rem 1rem 0.75rem 1rem;
  min-width: var(--table-cell-min);
  text-align: left;
  vertical-align: top;
}
.table .table-table thead th {
  background-color: var(--highlighted);
  font: var(--h6-font);
  font-size: 1rem;
  color: var(--black);
  white-space: nowrap;
  border-bottom: 1px solid var(--divider-grey);
}
.table .table-table thead th.is-sortable {
  padding: 0;
  background-color: var(--highlighted);
}
.table .table-table thead th.is-sortable:hover, .table .table-table thead th.is-sortable[aria-sort=ascending], .table .table-table thead th.is-sortable[aria-sort=descending] {
  background: var(--table-sortable-active-bg);
}
.table .table-table.is-sorted tbody tr:nth-child(odd) td:first-child {
  background-color: var(--white);
}
.table .table-table.is-sorted tbody tr:nth-child(even) td:first-child {
  background-color: var(--table-stripe-bg);
}
.table .table-table.is-sorted td:first-child::after {
  content: "";
  position: absolute;
  top: 0;
  right: -0.0625rem;
  width: 0.0625rem;
  height: 100%;
  background-color: var(--table-border);
}
.table .table-table thead th:first-child {
  border-top-left-radius: var(--table-radius);
}
.table .table-table thead th:last-child {
  border-top-right-radius: var(--table-radius);
}
.table .table-table tbody tr:nth-child(even) {
  background-color: var(--table-stripe-bg);
}
.table .table-table tbody tr.is-hidden {
  display: none;
}
@container main (min-width: 48rem) {
  .table .table-scroll .table-table {
    width: 100%;
    min-width: 0;
  }
  .table .table-scroll.is-overflowing .table-table {
    min-width: calc(8 * var(--column) + (8 - 1) * var(--gutter));
  }
}
.table .table-sort {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
  width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0.875rem 0.625rem 0.75rem 1rem;
  border: 0;
  background-color: transparent;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: background-color var(--bezier);
  transition: background-color var(--bezier);
}
.table .table-sort-icon {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  background-image: url("../../assets/icons/icon-sort-arrow-down.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition: -webkit-transform var(--bezier);
  transition: -webkit-transform var(--bezier);
  transition: transform var(--bezier);
  transition: transform var(--bezier), -webkit-transform var(--bezier);
  margin-top: -0.125rem;
}
.table th[aria-sort=ascending] .table-sort-icon {
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}
.table th[aria-sort=descending] .table-sort-icon {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.table th[aria-sort=none] .table-sort-icon {
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}
.table .table-empty {
  max-width: calc(8 * var(--column) + (8 - 1) * var(--gutter));
  margin: 1rem 0 0;
  font: var(--body-font);
  color: var(--subdued);
}