@use "design-system/palette";
@use "design-system/typography";

@use "sprockets/error-summary";
@use "sprockets/check-answers";
@use "sprockets/error";

@mixin sprockets {
  padding: 0;
  margin: 1rem 0;

  &:first-child /* stylelint-disable-line nesting-selector-no-missing-scoping-root */ {
    margin-top: 0;
  }

  &:last-child /* stylelint-disable-line nesting-selector-no-missing-scoping-root */ {
    margin-bottom: 0;
  }

  line-height: 1.375rem;

  &.error-summary /* stylelint-disable-line nesting-selector-no-missing-scoping-root */ {
    @include error-summary.sprocket-error-summary;
  }

  &.check-answers /* stylelint-disable-line nesting-selector-no-missing-scoping-root */ {
    @include check-answers.sprocket-check-answers;
  }

  &.fieldset /* stylelint-disable-line nesting-selector-no-missing-scoping-root */ {
    legend {
      @include typography.heading-m;

      & /* stylelint-disable-line no-duplicate-selectors */ {
        padding: 0;
        margin-top: 0;
      }
    }

    &.error /* stylelint-disable-line nesting-selector-no-missing-scoping-root */ {
      @include error.sprocket-error;

      padding-left: 1rem;
    }

    .description {
      @include typography.secondary-text;

      & /* stylelint-disable-line no-duplicate-selectors */ {
        display: block;
        padding: 0;
        margin: 0 0 0.25rem 0;
      }
    }

    .error-message {
      @include typography.error-standard;

      & /* stylelint-disable-line no-duplicate-selectors */ {
        display: block;
        padding: 0;
        margin: 0 0 0.25rem 0;
      }
    }
  }

  /**
   *  Descendants
   */
  .sprocket {
    margin-bottom: 0;
  }
}

%sprockets {
  @include sprockets;
}
