.table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table {
  width: 100%;
  font-size: var(--text-base);
  color: var(--color-text);
}

.table__head {
  background-color: var(--color-surface);
}

.table__head-cell {
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-heading);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: var(--color-text-muted);
  text-align: left;
  border-bottom: 2px solid var(--color-border-strong);
  white-space: nowrap;
}

.table__row {
  border-bottom: 1px solid var(--color-border);
  transition: background-color var(--transition-fast);
}

.table__row:hover {
  background-color: var(--color-surface);
}

.table__row--link {
  cursor: pointer;
}

.table__link {
  font-weight: var(--weight-semibold);
  color: var(--color-primary);
  text-decoration: none;
}

.table__link:hover {
  text-decoration: underline;
}

.table__cell {
  padding: var(--space-4);
  vertical-align: middle;
  color: var(--color-text);
}

.table__cell--muted {
  color: var(--color-text-muted);
}

.table__cell--action {
  text-align: right;
  white-space: nowrap;
}

/* Specs table (product page) */
.specs-table {
  width: 100%;
}

.specs-table__row {
  display: flex;
  border-bottom: 1px solid var(--color-border);
}

.specs-table__row:nth-child(even) {
  background-color: var(--color-surface);
}

.specs-table__term {
  flex: 0 0 50%;
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-base);
  color: var(--color-text-muted);
}

.specs-table__value {
  flex: 1;
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  color: var(--color-text);
}

@media (max-width: 640px) {
  .specs-table__row {
    flex-direction: column;
  }

  .specs-table__term {
    padding-bottom: var(--space-1);
    flex: none;
  }

  .specs-table__value {
    padding-top: 0;
    flex: none;
  }
}