/* Searchable configuration tables with native no-JavaScript disclosures. */
.configuration-section [hidden] {
  display: none !important;
}

.configuration-section {
  padding-block: clamp(2.75rem, 7vw, 5.5rem);
}

.configuration-section__intro {
  max-width: 46rem;
  margin-bottom: 1.5rem;
}

.configuration-section__intro > :last-child {
  color: var(--muted, #5f6e69);
}

.configuration-list {
  display: grid;
  gap: 0.8rem;
}

.configuration-compare {
  margin-block: 1.5rem;
  padding: 1rem;
  border: 1px solid var(--line, rgba(16, 33, 30, 0.16));
  border-radius: var(--radius-sm, 0.55rem);
  background: var(--white, #fffef8);
}

.configuration-compare h3 {
  margin-top: 0;
  text-transform: none;
}

.configuration-compare [data-compare-status] {
  color: var(--muted, #5f6e69);
}

.configuration-compare [data-compare-selected] {
  display: grid;
  gap: 0.4rem;
  margin-block: 1rem;
  padding-left: 1.25rem;
}

.configuration-compare [data-compare-selected] li {
  padding-block: 0.25rem;
}

.configuration-compare [data-compare-selected] button {
  margin-inline-start: 0.5rem;
  min-block-size: 2.75rem;
}

.configuration-compare [data-compare-table] {
  max-inline-size: 100%;
  overflow-x: auto;
  margin-block: 1rem;
}

.configuration-compare__table {
  width: 100%;
  min-width: 50rem;
  border-collapse: collapse;
}

.configuration-compare__table th,
.configuration-compare__table td {
  min-width: 13.125rem;
  padding: 0.7rem;
  border: 1px solid var(--line, rgba(16, 33, 30, 0.16));
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.configuration-compare__table th:first-child,
.configuration-compare__table td:first-child {
  min-width: 10.625rem;
  width: 10.625rem;
  background: var(--paper, #f4f1e7);
}

.configuration-compare__actions,
.configuration-compare__choice {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

.configuration-compare__choice {
  margin-block: 1rem;
}

.configuration-compare__actions .button,
.configuration-compare__choice .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-block-size: 2.75rem;
}

.configuration-card {
  border: 1px solid var(--line, rgba(16, 33, 30, 0.16));
  border-radius: var(--radius-sm, 0.55rem);
  background: var(--white, #fffef8);
  overflow: hidden;
}

.configuration-card > summary {
  display: list-item;
  padding: 1rem;
  cursor: pointer;
}

/* Keep the browser's native disclosure marker: it signals the no-JS control. */
.configuration-card > summary::marker {
  color: var(--teal, #19756d);
}

.configuration-card__model {
  margin-right: 0.75rem;
}

.configuration-card__variant {
  color: var(--muted, #5f6e69);
}

.configuration-card__body {
  padding: 0 1rem 1rem;
}

.configuration-card__summary {
  margin-top: 0;
}

.configuration-gallery {
  display: grid;
  gap: 1rem;
  margin-block: 1rem;
}

.configuration-gallery__figure {
  margin: 0;
}

.configuration-gallery__figure picture,
.configuration-gallery__figure img {
  display: block;
  max-inline-size: 100%;
}

.configuration-gallery__figure img {
  inline-size: 100%;
  block-size: auto;
  max-block-size: min(24rem, 70vh);
  object-fit: contain;
}

.configuration-gallery__figure figcaption {
  margin-top: 0.5rem;
  color: var(--muted, #5f6e69);
}

@media (min-width: 48rem) {
  .configuration-gallery:has(> :nth-child(2)) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.configuration-table-wrap {
  overflow-x: auto;
  margin-block: 1rem;
}

.configuration-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
}

.configuration-table th,
.configuration-table td {
  padding: 0.6rem 0;
  border-top: 1px solid var(--line, rgba(16, 33, 30, 0.16));
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.configuration-table th {
  width: 42%;
  padding-right: 1rem;
}

.configuration-card__enquiry {
  display: inline-block;
  margin-top: 0.25rem;
  color: var(--teal, #19756d);
  font-weight: 700;
}

@media (max-width: 24rem) {
  .configuration-compare {
    padding: 0.8rem;
  }
}

.configuration-compare__sharing [data-compare-provenance] {
  overflow-wrap: anywhere;
}

.configuration-compare__sharing input {
  display: block;
  width: 100%;
  min-width: 0;
  font-size: 1rem;
}

.configuration-compare__sharing textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  resize: vertical;
  font-size: 1rem;
}

[data-compare-print-brief] {
  display: none;
}

@media print {
  html:has(body.print-configuration-brief),
  body.print-configuration-brief {
    background: #fff !important;
    color: #000;
  }

  body.print-configuration-brief > :not([data-compare-print-brief]) {
    display: none !important;
  }

  body.print-configuration-brief [data-compare-print-brief] {
    display: block;
    color: #000;
    background: #fff;
    font-size: 10pt;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  [data-compare-print-brief] h1 {
    font-size: 18pt;
  }

  [data-compare-print-brief] .configuration-compare__table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
  }

  [data-compare-print-brief] .configuration-compare__table th,
  [data-compare-print-brief] .configuration-compare__table td {
    min-width: 0;
    width: auto;
    padding: 0.3rem;
    font-size: 9pt;
    color: #000;
    border-color: #777;
  }

  [data-compare-print-brief] thead {
    display: table-header-group;
  }

  [data-compare-print-brief] tr {
    break-inside: avoid;
  }
}