{"version":3,"sources":["../../../../src/moj/components/filter/_filter.scss"],"names":[],"mappings":"AAAA,iCAAiC;AACjC,uCAAuC;;AAEvC;;+EAE+E;;AAE/E;EACE,uCAAuC;EACvC,sEAAsE;;EAEtE;IACE;;oCAEgC;EAClC;AACF;;AAEA;EACE,0CAA0C;EAC1C,4DAA4D;EAC5D,YAAY,EAAE,kCAAkC;EAChD,mBAAmB,EAAE,qCAAqC;;EAE1D;IACE,WAAW;IACX,qBAAqB;IACrB,WAAW;EACb;;EAEA;IACE,gBAAgB;EAClB;AACF;;AAEA,YAAY;AACZ;EACE,WAAW;EACX,iBAAiB,EAAE,oDAAoD;;EAEvE;IACE,gBAAgB;IAChB,sBAAsB;IACtB,cAAc;IACd,kBAAkB;IAClB,WAAW;IACX,SAAS;IACT,UAAU;IACV,cAAc;IACd,gBAAgB;IAChB,6BAA6B;IAC7B,gBAAgB;IAChB,eAAe,EAAE,wBAAwB;IACzC,wBAAwB;IACxB,6CAA6C;;IAE7C,wCAAwC;IACxC;MACE,UAAU;MACV,SAAS;IACX;;IAEA;MACE,WAAW;MACX,cAAc;MACd,kBAAkB;MAClB,QAAQ;MACR,QAAQ;MACR,WAAW;MACX,YAAY;MACZ,gBAAgB,EAAE,6BAA6B;MAC/C,oEAAoE;MACpE,wBAAwB;IAC1B;;IAEA;MACE,8BAA8B;IAChC;EACF;AACF;;AAEA;;EAEE,qBAAqB;EACrB,gBAAgB;EAChB,sBAAsB;AACxB;;AAEA;EACE,SAAS;EACT,UAAU;EACV,YAAY;EACZ,gBAAgB;EAChB,2BAA2B;EAC3B,4BAA4B;EAC5B,6BAA6B;EAC7B,eAAe,EAAE,6BAA6B;EAC9C,wBAAwB;EACxB,gBAAgB;EAChB,uBAAuB;;EAEvB;IACE,aAAa;IACb,0CAA0C;IAC1C,gDAAgD;IAChD;;+CAE2C;EAC7C;;EAEA,wCAAwC;EACxC;IACE,UAAU;IACV,SAAS;EACX;;EAEA;IACE,WAAW;IACX,qBAAqB;IACrB,kBAAkB;IAClB,SAAS,EAAE,iBAAiB;IAC5B,WAAW;IACX,YAAY;IACZ,8BAA8B;IAC9B,oEAAoE;IACpE,sBAAsB;EACxB;AACF;;AAEA;EACE,yBAAyB;EACzB,4DAA4D;EAC5D,sEAAsE;;EAEtE;IACE,gBAAgB,EAAE,OAAO;EAC3B;AACF;;AAEA;EACE,YAAY,EAAE,kCAAkC;EAChD,mBAAmB,EAAE,qCAAqC;;EAE1D;IACE,WAAW;IACX,qBAAqB;IACrB,WAAW;EACb;AACF;;AAEA;;EAEE,qBAAqB;EACrB,gBAAgB;EAChB,sBAAsB;EACtB,uBAAuB;AACzB;;AAEA;EACE,+BAA+B,EAAE,mCAAmC;EACpE,eAAe;EACf,YAAY;;EAEZ;IACE,qBAAqB;IACrB,8BAA8B;EAChC;AACF;;AAEA;EACE,qBAAqB;EACrB,4BAA4B;EAC5B,yBAAyB;EACzB,uCAAuC;EACvC,4BAA4B;EAC5B,uCAAuC;EACvC,qBAAqB;EACrB,uBAAuB;;EAEvB;;IAEE,4BAA4B;EAC9B;;EAEA;IACE,0CAA0C;IAC1C,gDAAgD;EAClD;;EAEA;IACE,4BAA4B;IAC5B,uCAAuC;EACzC;;EAEA;IACE,WAAW;IACX,qBAAqB;IACrB,WAAW;IACX,YAAY;IACZ,6BAA6B;IAC7B,mEAAmE;IACnE,iBAAiB;IACjB,sBAAsB;EACxB;;EAEA;IACE,yEAAyE;EAC3E;AACF;;AAEA;EACE,gBAAgB;EAChB,yBAAyB;EACzB,sEAAsE;;EAEtE;IACE,gBAAgB,EAAE,OAAO;EAC3B;AACF","file":"_filter.scss","sourcesContent":["@use \"../../settings/assets\" as *;\n@use \"../../vendor/govuk-frontend\" as *;\n\n/* ==========================================================================\n   #FILTER\n   ========================================================================== */\n\n.moj-filter {\n  background-color: govuk-colour(\"white\");\n  box-shadow: inset 0 0 0 1px govuk-colour(\"black\", $variant: \"tint-80\");\n\n  &:focus {\n    box-shadow:\n      0 -2px $govuk-focus-colour,\n      0 4px $govuk-focus-text-colour;\n  }\n}\n\n.moj-filter__header {\n  padding: govuk-spacing(2) govuk-spacing(4);\n  background-color: govuk-colour(\"black\", $variant: \"tint-80\");\n  font-size: 0; // Hide whitespace between elements\n  text-align: justify; // Trick to remove the need for floats\n\n  &::after {\n    content: \"\";\n    display: inline-block;\n    width: 100%;\n  }\n\n  [class^=\"govuk-heading-\"] {\n    margin-bottom: 0;\n  }\n}\n\n// JavaScript\n.moj-filter__legend {\n  width: 100%;\n  overflow: visible; // Override govuk to allow for focus style to be seen\n\n  button {\n    appearance: none;\n    box-sizing: border-box;\n    display: block;\n    position: relative;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    border: 0 none;\n    border-radius: 0;\n    background-color: transparent;\n    text-align: left;\n    cursor: pointer; // Adam would not approve\n    -webkit-appearance: none;\n    @include govuk-font($size: 24, $weight: bold);\n\n    // Fix unwanted button padding in Firefox\n    &::-moz-focus-inner {\n      padding: 0;\n      border: 0;\n    }\n\n    &::after {\n      content: \"\";\n      display: block;\n      position: absolute;\n      top: 50%;\n      right: 0;\n      width: 16px;\n      height: 16px;\n      margin-top: -8px; // Half the height of the icon\n      background-image: url(#{$moj-images-path}icon-toggle-plus-minus.svg);\n      background-position: 0 0;\n    }\n\n    &[aria-expanded=\"true\"]::after {\n      background-position: 16px 16px;\n    }\n  }\n}\n\n.moj-filter__header-title,\n.moj-filter__header-action {\n  display: inline-block;\n  text-align: left;\n  vertical-align: middle;\n}\n\n.moj-filter__close {\n  margin: 0;\n  padding: 0;\n  border: none;\n  border-radius: 0;\n  // @include govuk-focusable;\n  color: govuk-colour(\"black\");\n  background-color: transparent;\n  cursor: pointer; // I know Adam won’t like this\n  -webkit-appearance: none;\n  appearance: none;\n  @include govuk-font(19);\n\n  &:focus {\n    outline: none;\n    color: govuk-functional-colour(focus-text);\n    background-color: govuk-functional-colour(focus);\n    box-shadow:\n      0 -2px govuk-functional-colour(focus),\n      0 4px govuk-functional-colour(focus-text);\n  }\n\n  // Fix unwanted button padding in Firefox\n  &::-moz-focus-inner {\n    padding: 0;\n    border: 0;\n  }\n\n  &::before {\n    content: \"\";\n    display: inline-block;\n    position: relative;\n    top: -1px; // Alignment tweak\n    width: 14px;\n    height: 14px;\n    margin-right: govuk-spacing(1);\n    background-image: url(#{$moj-images-path}icon-close-cross-black.svg);\n    vertical-align: middle;\n  }\n}\n\n.moj-filter__selected {\n  padding: govuk-spacing(4);\n  background-color: govuk-colour(\"black\", $variant: \"tint-95\");\n  box-shadow: inset 0 0 0 1px govuk-colour(\"black\", $variant: \"tint-80\");\n\n  ul:last-of-type {\n    margin-bottom: 0; // IE9 +\n  }\n}\n\n.moj-filter__selected-heading {\n  font-size: 0; // Hide whitespace between elements\n  text-align: justify; // Trick to remove the need for floats\n\n  &::after {\n    content: \"\";\n    display: inline-block;\n    width: 100%;\n  }\n}\n\n.moj-filter__heading-title,\n.moj-filter__heading-action {\n  display: inline-block;\n  text-align: left;\n  vertical-align: middle;\n  @include govuk-font(16);\n}\n\n.moj-filter-tags {\n  margin-bottom: govuk-spacing(4); // Needs to adjust to 15px on mobile\n  padding-left: 0;\n  font-size: 0;\n\n  li {\n    display: inline-block;\n    margin-right: govuk-spacing(2);\n  }\n}\n\n.moj-filter__tag {\n  display: inline-block;\n  margin-top: govuk-spacing(1);\n  padding: govuk-spacing(1);\n  border: 1px solid govuk-colour(\"black\");\n  color: govuk-colour(\"black\");\n  background-color: govuk-colour(\"white\");\n  text-decoration: none;\n  @include govuk-font(16);\n\n  &:link,\n  &:visited {\n    color: govuk-colour(\"black\");\n  }\n\n  &:focus {\n    color: govuk-functional-colour(focus-text);\n    background-color: govuk-functional-colour(focus);\n  }\n\n  &:hover {\n    color: govuk-colour(\"white\");\n    background-color: govuk-colour(\"black\");\n  }\n\n  &::after {\n    content: \"\";\n    display: inline-block;\n    width: 10px;\n    height: 10px;\n    margin-left: govuk-spacing(1);\n    background-image: url(#{$moj-images-path}icon-tag-remove-cross.svg);\n    font-weight: bold;\n    vertical-align: middle;\n  }\n\n  &:hover::after {\n    background-image: url(#{$moj-images-path}icon-tag-remove-cross-white.svg);\n  }\n}\n\n.moj-filter__options {\n  margin-top: -1px;\n  padding: govuk-spacing(4);\n  box-shadow: inset 0 0 0 1px govuk-colour(\"black\", $variant: \"tint-80\");\n\n  div:last-of-type {\n    margin-bottom: 0; // IE9 +\n  }\n}\n"]}