// Gives access to the Sass variables used in the GOVUK Frontend typographic styles
// See: https://frontend.design-system.service.gov.uk/sass-api-reference/#govuk-typography-scale
@function get-govuk-typography-style($size, $breakpoint, $property) {
  $size-map: map-get($govuk-typography-scale, $size);
  $breakpoint-map: map-get($size-map, $breakpoint);

  @if not map-has-key($breakpoint-map, $property) {
    @error "Unknown property #{$property} - expected a property from the typography scale for #{$size}.";
  }

  @return map-get($breakpoint-map, $property);
}

// Extends footer column styles to allow 4 columns
@include mq ($from: desktop) {
  .govuk-footer__list--columns-4 {
    // TODO: Move support for legacy properties to something like Post-CSS's auto-prefixer
    -webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
  }
}

// Extends govuk-link to create a class of link that causes a destructive action
// Based on styles of link in:
// https://github.com/alphagov/govuk-frontend/blob/v2.13.0/src/helpers/_links.scss
//
// Note: all destructive actions must have a confirmation step these links navigate to
@mixin govuk-link-style-destructive-no-visited-state {
  &:link,
  &:visited {
    color: $govuk-error-colour;
  }

  &:hover {
    color: govuk-tint($govuk-error-colour, 25%);
  }

  // When focussed, the text colour needs to be darker to ensure that colour
  // contrast is still acceptable against the focus colour
  // Activated links are usually focused so this applies to them as well
  &:active,
  &:focus {
    color: $govuk-focus-text-colour;
  }
}

.govuk-link--destructive {
  @include govuk-link-style-destructive-no-visited-state;
}
$govuk-grid-widths: (
  one-eighth: 12.5%,
  one-sixth: 16.6666%,
  one-quarter: 25%,
  one-third: 33.3333%,
  one-half: 50%,
  five-eighths: 62.5%,
  two-thirds: 66.6666%,
  three-quarters: 75%,
  five-sixths: 83.3333%,
  seven-eighths: 87.5%,
  full: 100%
);

.govuk-input--width-6 {
  max-width: 14ex;
}

// extensions to govuk-input to allow numbering by label
.govuk-input--numbered {
  padding-left: 1.84em;

  @include media(desktop) {
    @include inline-block;
  }
}

.govuk-input--numbered__label {
  float: left;
  width: 1.6em;
  margin: 8px -1.6em 0 0;
  position: relative;
  left: 10px;
  color: $govuk-secondary-text-colour;
  font-weight: bold;
  pointer-events: none;
}

.govuk-input--numbered__label--error {
  position: absolute;
  bottom: 10px;

  @include govuk-media-query(desktop) {
    bottom: 7px;
  }
}