/*
 * Fixes for the design system's survey block (@sybit/design-system 1.52.1).
 *
 * survey.js disables the next button until an answer is selected and hides the
 * back button on the first question, but the design system styles neither state:
 * `.button` has no disabled look, and its `display: inline-flex` overrides the
 * `hidden` attribute. Can be removed once the design system covers both.
 */
.survey .button[hidden] {
  display: none;
}

.survey .button:disabled {
  --button-default-color: var(--color-background-light-gray);
  --button-active-color: var(--color-background-light-gray);

  color: var(--color-text-gray);
  border-radius: 4px;
  box-shadow:
    inset 0 var(--button-shadow-width) 0 0 var(--button-default-color),
    inset 0 calc(var(--button-shadow-width) * -1) 0 0 var(--button-default-color);
  cursor: not-allowed;
}
