@import "govuk_publishing_components/individual_component_support";
@import "govuk/components/tabs/tabs";

.govuk-frontend-supported {
  .gem-c-tabs__panel--no-border {
    padding-right: 0;
    padding-left: 0;
    border: 0;
  }
}

// We have some styles within GOVUK (.content-block) which can leak into the list styles for this component.
// These styles are defined in Static:
// https://github.com/alphagov/static/blob/a815620cada7ea1c65428c1c3b3ac4dbe28977bf/app/assets/stylesheets/helpers/_text.scss
// This sets more specific selectors so those unwanted styles are overidden
ul.govuk-tabs__list { // stylelint-disable-line selector-no-qualifying-type
  margin: 0;
  padding: 0;
  list-style: none;
  @include govuk-responsive-margin(6, "bottom");
}

li.govuk-tabs__list-item { // stylelint-disable-line selector-no-qualifying-type
  margin-left: govuk-spacing(5);
}

.govuk-frontend-supported { // stylelint-disable-line no-duplicate-selectors
  @include govuk-media-query($from: tablet) {
    ul.govuk-tabs__list { // stylelint-disable-line selector-no-qualifying-type
      margin-bottom: 0;
    }
  }
}

@include govuk-media-query($media-type: print) {
  .govuk-tabs__title {
    display: block !important; // stylelint-disable-line declaration-no-important
  }

  .govuk-tabs__tab.govuk-tabs__tab {
    text-decoration: none;
  }

  .govuk-tabs__list.govuk-tabs__list {
    border: 0;
  }

  .govuk-tabs__list-item.govuk-tabs__list-item {
    all: unset;
    display: block;

    &::before {
      content: "—";
      padding-right: 2mm;
      margin: 0;
    }
  }

  .govuk-tabs__panel.govuk-tabs__panel {
    border: 0;
    padding: 0;
    margin: 0.75cm 0;
    display: block;
  }
}
