/* Keep the semantic comparison table scrollable on narrow screens. */
.hrc-service-table {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--e-global-color-hrclborder, #E5E2DE);
  border-radius: 4px;
}
.hrc-service-table table {
  min-width: 540px;
  margin: 0;
  text-align: left;
}
.hrc-service-table :is(th, td) { padding: 12px 16px; }
.hrc-service-table thead th {
  color: var(--e-global-color-secondary, #FAF8F4);
  background: var(--e-global-color-primary, #151617);
}
.hrc-service-table tbody tr:nth-child(odd) { background: var(--e-global-color-hrcwhite, #FFFFFF); }

/* The approved Lucide files have dark strokes and need a light treatment on Carbon. */
:is(.hrc-repair-hero, .hrc-repair-trust) .hrc-repair-line-icon img { filter: invert(1); }
.hrc-repair-trust { border-top: 1px solid var(--e-global-color-hrcdivider, #3B4046); }
:is(#roof-repair-cost .hrc-service-table, .hrc-service-table-two-column) table { min-width: 0; }
:is(#roof-repair-cost, #roof-replacement-cost) .hrc-service-table th:first-child { width: 24%; }
.elementor .hrc-service-review-controls { display: none; }
@media (max-width: 767px) {
  /* Elementor's overlay gradient stops are shared across breakpoints. */
  .elementor .e-con.hrc-repair-hero::before {
    background-image: linear-gradient(180deg, #151617B5, #151617F2);
  }
  :is(#roof-repair-cost .hrc-service-table, .hrc-service-table-two-column) :is(th, td) { padding-inline: 9px; }
  .elementor .hrc-service-reviews .e-con.hrc-review-grid {
    display: grid;
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 100%;
    gap: 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }
  .hrc-service-reviews .hrc-review-grid > .e-con { scroll-snap-align: start; }
  .elementor .hrc-service-review-controls { display: block; }
  .hrc-service-review-controls .hrc-review-controls:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    color: var(--e-global-color-secondary, #FAF8F4);
  }
  .hrc-service-review-controls button {
    min-height: 44px;
    padding: 8px 12px;
    background: transparent;
    color: inherit;
    border: 1px solid var(--e-global-color-hrcdivider, #3B4046);
  }
}
