/* Product specifications use a compact grid with their own horizontal scroll area. */
.product-details .product-detail-main,
.product-details .tab-panel {
  min-inline-size: 0;
}

.product-details .product-table-scroll {
  max-inline-size: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  margin-block: .75rem 1.375rem;
  border: 1px solid #d8e2eb;
  border-radius: .625rem;
  background: #fff;
  scrollbar-color: #879eb2 #eef3f7;
}

.product-details .product-table-scroll:focus-visible {
  outline: 2px solid #17679e;
  outline-offset: 3px;
}

.product-details .product-table-hint {
  margin: .75rem 0 -.4rem;
  color: #435c70;
  font-size: .75rem;
}

.product-details .product-table-hint[hidden] {
  display: none;
}

.product-details .prose table.product-spec-table {
  width: 100% !important;
  min-inline-size: var(--spec-min-width, 0);
  margin: 0;
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 0;
  color: #183247;
  font-size: .78125rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
}

.product-details .product-spec-table :is(th, td) {
  --spec-row-background: #fff;
  min-width: 0;
  padding: .4375rem .625rem;
  border: 0;
  border-inline-end: 1px solid #e4ebf1;
  border-block-end: 1px solid #e4ebf1;
  background: var(--spec-row-background);
  vertical-align: middle;
  text-align: start;
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
}

.product-details .product-spec-table tr > :last-child {
  border-inline-end: 0;
}

.product-details .product-spec-table tbody:last-child tr:last-child > *,
.product-details .product-spec-table tfoot:last-child tr:last-child > * {
  border-block-end: 0;
}

.product-details .product-spec-table tr:nth-child(even) > * {
  --spec-row-background: #f5f8fb;
}

.product-details .product-spec-table .product-table-heading > * {
  --spec-row-background: #e6eff7;
  border-block-end-color: #c8d7e5;
  color: #153952;
  font-weight: 650;
  text-wrap: pretty;
}

.product-details .product-spec-table .product-table-value {
  text-align: end;
  white-space: nowrap;
}

.product-details .product-spec-table .product-table-model {
  font-weight: 650;
  white-space: nowrap;
}

.product-details .product-table-scroll.is-overflowing .product-spec-table.has-model-column tr > :first-child {
  position: sticky;
  inset-inline-start: 0;
  z-index: 1;
  box-shadow: 1px 0 0 #c8d7e5;
}

.product-details .product-spec-table.is-key-value tr > :first-child {
  width: 38%;
  color: #23465e;
  font-weight: 650;
}

.product-details .product-spec-table.is-key-value :is(th, td) {
  overflow-wrap: anywhere;
}

.product-summary table.specs {
  margin-block: 1.125rem;
  border: 1px solid #d8e2eb;
  border-radius: .625rem;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  color: #183247;
  font-size: .78125rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
}

.product-summary table.specs:not(:has(tr)) {
  display: none;
}

.product-summary .specs :is(th, td) {
  padding: .4375rem .625rem;
  border: 0;
  border-block-end: 1px solid #e4ebf1;
  vertical-align: top;
  text-align: start;
  overflow-wrap: anywhere;
}

.product-summary .specs tr:last-child > * {
  border-block-end: 0;
}

.product-summary .specs tr:nth-child(even) > * {
  background: #f5f8fb;
}

.product-summary .specs tr > th:first-child {
  width: 44%;
  border-inline-end: 1px solid #e4ebf1;
  background: #eaf2f8;
  color: #23465e;
  font-weight: 650;
}

@media (max-width: 600px) {
  .product-details .prose table.product-spec-table,
  .product-summary table.specs {
    font-size: .75rem;
  }

  .product-details .product-spec-table :is(th, td),
  .product-summary .specs :is(th, td) {
    padding: .375rem .5rem;
  }
}
