{"version":3,"sources":["../../../../../../src/moj/components/domain-specific/probation/header/_header.scss"],"names":[],"mappings":"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","file":"_header.scss","sourcesContent":["/* stylelint-disable max-nesting-depth, selector-no-qualifying-type */\n@use \"../../../../vendor/govuk-frontend\" as *;\n\n/* ==========================================================================\n   PROBATION#HEADER\n   ========================================================================== */\n\n@mixin probationmenuitem($colour) {\n  color: $colour;\n\n  &::after {\n    content: \"\";\n    background: $colour;\n  }\n\n  > span {\n    &::before {\n      border-right-color: $colour;\n      border-bottom-color: $colour;\n    }\n\n    &::after {\n      background-color: $colour;\n    }\n\n    &:hover {\n      &::before {\n        border-right-color: $colour;\n        border-bottom-color: $colour;\n      }\n\n      &::after {\n        background-color: $colour;\n      }\n    }\n  }\n}\n\n.probation-common-header {\n  [hidden] {\n    display: none;\n  }\n\n  color: govuk-colour(\"white\");\n\n  background-color: govuk-colour(\"black\");\n\n  &__logo {\n    @include govuk-responsive-margin(3, \"right\");\n    position: relative;\n    top: -2px;\n    padding: 15px 0;\n    fill: govuk-colour(\"white\");\n  }\n\n  &__title {\n    display: flex;\n\n    &__organisation-name {\n      @include govuk-responsive-margin(2, \"right\");\n      @include govuk-font($size: 24, $weight: \"bold\");\n      display: flex;\n      align-items: center;\n    }\n\n    .govuk-tag {\n      margin: auto 0;\n\n      @include govuk-media-query($until: 985px) {\n        display: none;\n      }\n    }\n  }\n\n  &__submenu-link {\n    @include govuk-link-common;\n    @include govuk-link-style-no-visited-state;\n  }\n\n  &__link {\n    @include govuk-link-common;\n    @include govuk-link-style-default;\n\n    &:link,\n    &:visited,\n    &:active {\n      color: govuk-colour(\"white\");\n      font-weight: normal;\n      text-decoration: none;\n    }\n\n    &:focus {\n      color: govuk-colour(\"black\");\n      box-shadow: none;\n\n      &::after {\n        content: \"\";\n        position: absolute;\n        top: auto;\n        right: 15px;\n        bottom: 0;\n        left: 15px;\n        height: 3px;\n        background: govuk-colour(\"black\");\n      }\n\n      svg {\n        fill: govuk-colour(\"black\");\n      }\n    }\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n\n  &__button-width-container {\n    position: relative;\n  }\n\n  &__button-container {\n    @include govuk-media-query(925px) {\n      position: absolute;\n      top: -70px;\n      right: 0;\n      background-color: govuk-colour(\"black\");\n    }\n  }\n\n  &__navigation {\n    display: flex;\n    height: 70px;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    flex-direction: row;\n    align-items: center;\n\n    &__item {\n      position: relative;\n      height: 100%;\n\n      > button,\n      > a {\n        display: flex;\n        height: 100%;\n        padding: 0;\n        overflow: hidden;\n        border: none;\n        color: govuk-colour(\"white\");\n        background: govuk-colour(\"black\");\n        cursor: pointer;\n        align-items: center;\n        justify-content: center;\n        @include govuk-font(16);\n\n        &:hover {\n          color: govuk-colour(\"black\", $variant: \"tint-80\");\n\n          &::after {\n            content: \"\";\n            position: absolute;\n            top: auto;\n            right: 15px;\n            bottom: 0;\n            left: 15px;\n            height: 3px;\n            background: govuk-colour(\"black\", $variant: \"tint-80\");\n          }\n        }\n\n        &.probation-common-header__menu-toggle {\n          padding: 10px 0;\n\n          > span {\n            display: flex;\n            height: 100%;\n            padding: 0 15px;\n            border-left: 1px solid govuk-colour(\"white\");\n            align-items: center;\n\n            &::before {\n              content: \"\";\n              display: inline-block;\n              width: 8px;\n              height: 8px;\n              margin: 3px 15px 0 3px;\n              -ms-transform: translateY(-35%) rotate(45deg) scale(1);\n              -webkit-transform: translateY(-35%) rotate(45deg) scale(1);\n              transform: translateY(-35%) rotate(45deg) scale(1);\n              border-right: 2px solid govuk-colour(\"white\");\n              border-bottom: 2px solid govuk-colour(\"white\");\n              vertical-align: middle;\n            }\n          }\n\n          svg {\n            margin: 0 15px 0 0;\n          }\n\n          &:hover {\n            > span {\n              &::before {\n                border-right: 2px solid;\n                border-bottom: 2px solid;\n              }\n            }\n          }\n        }\n\n        &.probation-common-header__toggle-open {\n          color: govuk-colour(\"blue\");\n          background: govuk-colour(\"black\", $variant: \"tint-95\");\n\n          > span {\n            &::before {\n              -ms-transform: translateY(-0%) rotate(225deg) scale(1);\n              -webkit-transform: translateY(-0%) rotate(225deg) scale(1);\n              transform: translateY(-0%) rotate(225deg) scale(1);\n              border-right: 2px solid govuk-colour(\"blue\");\n              border-bottom: 2px solid govuk-colour(\"blue\");\n            }\n\n            &::after {\n              content: \"\";\n              position: absolute;\n              top: auto;\n              right: 15px;\n              bottom: 0;\n              left: 15px;\n              height: 3px;\n              background: govuk-colour(\"blue\");\n            }\n          }\n\n          &:hover {\n            @include probationmenuitem(govuk-functional-colour(\"link-hover\"));\n          }\n        }\n\n        &:focus-visible {\n          outline: 3px solid transparent;\n          background-color: govuk-colour(\"yellow\");\n          box-shadow: none;\n          text-decoration: none;\n          @include probationmenuitem(govuk-colour(\"black\"));\n        }\n      }\n\n      &.item-open {\n        + div {\n          > button,\n          > a {\n            > span {\n              border-left: 1px solid transparent;\n            }\n          }\n        }\n      }\n    }\n  }\n\n  .probation-common-header__user-menu {\n    position: relative;\n    z-index: 10000000;\n    padding: 15px;\n    background: govuk-colour(\"black\", $variant: \"tint-95\");\n\n    a {\n      display: block;\n      margin-bottom: 15px;\n      font-weight: 700;\n    }\n  }\n\n  &__pushdown-menu {\n    padding: 30px 0 60px;\n    background: govuk-colour(\"black\", $variant: \"tint-95\");\n  }\n\n  &__icon-link-wrapper {\n    display: flex;\n    position: relative;\n    height: 100%;\n\n    img,\n    svg {\n      margin: 0 15px 0 0;\n    }\n\n    a {\n      box-sizing: border-box;\n      display: block;\n      width: 100%;\n      padding: 10px 0;\n\n      > span {\n        display: flex;\n        height: 100%;\n        padding: 0 15px;\n        border-left: 1px solid govuk-colour(\"white\");\n        align-items: center;\n        justify-content: center;\n      }\n\n      &:hover {\n        color: govuk-colour(\"black\", $variant: \"tint-80\");\n        text-decoration: none;\n\n        &::after {\n          content: \"\";\n          position: absolute;\n          top: auto;\n          right: 15px;\n          bottom: 0;\n          left: 15px;\n          height: 3px;\n          background: govuk-colour(\"black\", $variant: \"tint-80\");\n        }\n      }\n    }\n  }\n\n  &__services-menu {\n    ul {\n      display: grid;\n      width: 100%;\n      margin-bottom: 0;\n      font-weight: bold;\n      grid-template-rows: 1fr 1fr 1fr 1fr;\n      grid-auto-flow: column;\n      gap: 15px;\n      justify-items: start;\n    }\n  }\n\n  &__user-menu-link {\n    width: 181px;\n  }\n\n  &__services-menu-link {\n    width: 107px;\n  }\n\n  &__menu-toggle-label {\n    display: block;\n    text-align: left;\n  }\n\n  @media print {\n    display: none;\n  }\n}\n"]}