@use "../../base";

/// @access private
@mixin styles {
  .govuk-language-navigation {
    @include base.govuk-font($size: 19);

    @include base.govuk-responsive-margin(6, "bottom");
    color: base.govuk-functional-colour(text);
  }

  .govuk-language-navigation__list {
    display: inline-flex;
    flex-wrap: wrap;
    row-gap: base.govuk-spacing(2);
    margin: 0;
    padding: 0;
    list-style-type: none;
  }

  .govuk-language-navigation__list-item {
    display: flex;
    align-items: center;

    &:not(:last-child) {
      &::after {
        content: "";
        display: block;
        height: 1em;
        margin-right: base.govuk-spacing(2);
        margin-left: base.govuk-spacing(2);
        border-right: 1px solid;
        border-right-color: base.govuk-functional-colour(border);
      }
    }
  }

  .govuk-language-navigation__link {
    @include base.govuk-link-common;
    @include base.govuk-link-style-default;
  }

  .govuk-language-navigation--inverse {
    color: base.govuk-functional-colour(inverse-text);

    .govuk-language-navigation__link {
      @include base.govuk-link-style-inverse;
    }

    .govuk-language-navigation__list-item::after {
      border-right-color: currentcolor;
    }
  }

  // Ensure the Language navigation has enough
  // spacing with the rest of the Service Navigation
  .govuk-service-navigation .govuk-language-navigation {
    // Slightly smaller margin because the Service Navigation's menu toggle
    // has a little margin underneath it already.
    margin-top: base.govuk-spacing(1);
    margin-bottom: base.govuk-spacing(3);

    @media #{base.govuk-from-breakpoint(tablet)} {
      margin-top: base.govuk-spacing(3);
    }
  }
}