/* Main quote buttons and the two service-price grids on the repair page. */
:is(#comp-mocb40ng, #comp-mogh42qu, #comp-mogs8ng3) .standard-button,
#comp-mogh42qu .standard-wrap > .standard-grid > .standard-card,
#comp-mogkhjpf .standard-wrap > .standard-card > .standard-grid > .standard-card {
  position: relative;

  &::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    background: linear-gradient(108deg, transparent 39%, rgb(173 255 251 / 24%) 50%, transparent 61%)
      0 0 / 280% 100% no-repeat;
    box-shadow: inset 0 0 0 1px rgb(119 246 237 / 67%), 0 0 18px rgb(95 231 221 / 20%);
    opacity: 0;
  }

  &:focus-within::after {
    opacity: 1;
  }

  @media (hover: hover) and (pointer: fine) {
    &:hover::after {
      opacity: 1;
    }
  }

  @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    &:hover::after {
      animation: repair-light-sweep 550ms ease-out;
    }
  }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  :is(#comp-mocb40ng, #comp-mogh42qu, #comp-mogs8ng3) .standard-button {
    transition: translate 160ms ease-out;
  }

  :is(#comp-mocb40ng, #comp-mogh42qu, #comp-mogs8ng3) .standard-button:hover {
    translate: 0 -2px;
  }
}

@keyframes repair-light-sweep {
  from { background-position: 100% 0; }
  to { background-position: 0 0; }
}

.repair-quote-breakdown { margin-block: 1rem; }
.repair-quote-breakdown > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .75rem;
  padding: .55rem 0;
  border-bottom: 1px solid #47737c;
}
.repair-quote-breakdown dd { margin: 0; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }