{"version":3,"sources":["../../../../src/nhsuk/components/file-upload/_index.scss"],"names":[],"mappings":"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","file":"_index.scss","sourcesContent":["@use \"sass:color\";\n@use \"sass:math\";\n@use \"../../core/settings\" as *;\n@use \"../../core/tools\" as *;\n@use \"../../core/helpers\" as *;\n@use \"../button\" as *;\n@forward \"../error-message\";\n@forward \"../hint\";\n@forward \"../label\";\n@forward \"../button\";\n\n@include nhsuk-exports(\"nhsuk/components/file-upload\") {\n  $_button-border-colour: nhsuk-colour(\"grey-2\");\n\n  .nhsuk-file-upload__input {\n    max-width: 100%;\n    margin-left: nhsuk-spacing(-1);\n    padding: nhsuk-spacing(1);\n\n    @include nhsuk-text-colour;\n    @include nhsuk-font(19);\n\n    // The default file upload button in Safari does not support setting a\n    // custom font-size. Set `-webkit-appearance` to `button` to drop out of the\n    // native appearance so the font-size is set to 19px\n    // https://webkit.org/b/224746\n    &::-webkit-file-upload-button {\n      -webkit-appearance: button;\n      color: inherit;\n      font: inherit;\n    }\n\n    &:focus {\n      // Adjust padding to account for focus border\n      padding: 2px;\n\n      @include nhsuk-focused-input;\n    }\n\n    // Set \"focus-within\" to fix https://bugzil.la/1430196 so that component\n    // receives focus in Firefox.\n    // This can't be set together with `:focus` as all versions of IE fail\n    // to recognise `focus-within` and don't set any styles from the block\n    // when it's a selector.\n    &:focus-within {\n      @include nhsuk-focused-input;\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n  }\n\n  .nhsuk-file-upload__drop-zone {\n    display: block;\n    position: relative;\n    z-index: 0;\n    background-color: $nhsuk-body-background-colour;\n  }\n\n  // required because disabling pointer events\n  // on the button means that the cursor style\n  // be applied on the button itself\n  .nhsuk-file-upload--disabled .nhsuk-file-upload__drop-zone,\n   // Deprecated, to be removed in a future release\n  .nhsuk-file-upload__drop-zone--disabled {\n    cursor: not-allowed;\n  }\n\n  .nhsuk-file-upload__choose-files-button {\n    flex-shrink: 0;\n    width: auto;\n    margin-right: calc($nhsuk-button-padding-left-right - nhsuk-spacing(1));\n    margin-bottom: $nhsuk-button-shadow-size;\n\n    @media #{nhsuk-from-breakpoint(tablet)} {\n      margin-right: $nhsuk-button-padding-left-right;\n    }\n  }\n\n  .nhsuk-file-upload__drop-instruction {\n    margin-top: nhsuk-spacing(2);\n    margin-bottom: 0;\n    text-align: left;\n  }\n\n  .nhsuk-file-upload__status {\n    display: block;\n\n    margin-bottom: nhsuk-spacing(3);\n    padding: nhsuk-spacing(3);\n\n    color: $nhsuk-reverse-text-colour;\n    background-color: nhsuk-colour(\"grey-1\");\n\n    text-align: left;\n\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      color: HighlightText;\n      background-color: Highlight;\n      forced-color-adjust: none;\n    }\n\n    .nhsuk-file-upload__drop-button--empty & {\n      color: $nhsuk-text-colour;\n      background-color: color.scale(nhsuk-colour(\"grey-4\"), $alpha: -50%);\n\n      @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n        color: CanvasText;\n        background-color: HighlightText;\n      }\n    }\n  }\n\n  // bugs documented with button using flex\n  // https://github.com/philipwalton/flexbugs#flexbug-9\n  // so we need a container here\n  .nhsuk-file-upload__drop-button-group {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: baseline;\n  }\n\n  .nhsuk-file-upload__drop-button {\n    width: 100%;\n    // align the padding to be same as notification banner and error summary accounting for the thicker borders\n    padding: (nhsuk-spacing(3) + $nhsuk-border-width - $nhsuk-border-width-form-element);\n\n    border: $nhsuk-border-width-form-element solid $_button-border-colour;\n\n    color: $nhsuk-text-colour;\n    background-color: nhsuk-colour(\"white\");\n\n    cursor: pointer;\n\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      color: CanvasText;\n      background-color: Canvas;\n    }\n\n    @media #{nhsuk-from-breakpoint(tablet)} {\n      padding: (nhsuk-spacing(4) + $nhsuk-border-width - $nhsuk-border-width-form-element);\n    }\n  }\n\n  .nhsuk-file-upload__drop-button:not(:disabled) {\n    &:hover {\n      background-color: nhsuk-colour(\"white\");\n\n      .nhsuk-button {\n        background-color: $nhsuk-button-hover-colour;\n      }\n\n      .nhsuk-button--secondary,\n      .nhsuk-button--secondary-solid {\n        background-color: $nhsuk-secondary-button-hover-colour;\n      }\n    }\n\n    &:active,\n    &:focus {\n      // Double the border by adding its width again. Use `box-shadow` for this\n      // instead of changing `border-width` - this is for consistency with\n      // components such as textarea where we avoid changing `border-width` as\n      // it will change the element size. Also, `outline` cannot be utilised\n      // here as it is already used for the yellow focus state.\n      border: $nhsuk-border-width-form-element solid nhsuk-colour(\"black\");\n      outline: $nhsuk-focus-width solid $nhsuk-focus-colour;\n      // Ensure outline appears outside of the element\n      outline-offset: 0;\n      box-shadow: inset 0 0 0 $nhsuk-border-width-form-element;\n\n      // Remove the pseudo element shadow when parent button focused or pressed\n      .nhsuk-file-upload__choose-files-button::after {\n        box-shadow: none;\n      }\n    }\n\n    &:active {\n      .nhsuk-file-upload__choose-files-button {\n        top: $nhsuk-border-width;\n        box-shadow: none;\n\n        &::before {\n          bottom: -$nhsuk-border-width-form-element;\n        }\n      }\n\n      .nhsuk-button {\n        background-color: $nhsuk-button-active-colour;\n      }\n\n      .nhsuk-button--secondary,\n      .nhsuk-button--secondary-solid {\n        background-color: $nhsuk-secondary-button-active-colour;\n      }\n    }\n\n    &:focus:not(:active),\n    &:focus:not(:active):hover {\n      .nhsuk-file-upload__choose-files-button {\n        @include nhsuk-focused-button;\n\n        &::before {\n          border-color: transparent;\n        }\n      }\n    }\n  }\n\n  .nhsuk-file-upload__drop-button--empty {\n    border-style: dashed;\n    background-color: $nhsuk-body-background-colour;\n  }\n\n  .nhsuk-file-upload__drop-button--empty:not(:disabled) {\n    &:hover,\n    &:focus,\n    &:active {\n      background-color: nhsuk-colour(\"white\");\n    }\n\n    &:hover {\n      .nhsuk-button {\n        background-color: $nhsuk-button-hover-colour;\n      }\n\n      .nhsuk-button--secondary,\n      .nhsuk-button--secondary-solid {\n        background-color: $nhsuk-secondary-button-hover-colour;\n      }\n    }\n\n    &:active {\n      .nhsuk-file-upload__choose-files-button {\n        top: $nhsuk-border-width;\n        box-shadow: none;\n\n        &::before {\n          bottom: -$nhsuk-border-width-form-element;\n        }\n      }\n\n      .nhsuk-button {\n        background-color: $nhsuk-button-active-colour;\n      }\n\n      .nhsuk-button--secondary,\n      .nhsuk-button--secondary-solid {\n        background-color: $nhsuk-secondary-button-active-colour;\n      }\n    }\n  }\n\n  .nhsuk-file-upload__drop-button:not(:disabled),\n  .nhsuk-file-upload__drop-button--empty:not(:disabled) {\n    @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n      &:hover,\n      &:active {\n        color: CanvasText;\n        background-color: Canvas;\n\n        .nhsuk-button {\n          color: Highlight;\n          background-color: ButtonFace;\n\n          &,\n          &::before {\n            border-color: Highlight;\n          }\n        }\n      }\n    }\n  }\n\n  .nhsuk-file-upload__drop-button--dragging {\n    border-style: solid;\n    background-color: nhsuk-colour(\"white\");\n  }\n\n  .nhsuk-file-upload__drop-button:disabled {\n    pointer-events: none;\n    opacity: 0.5;\n  }\n}\n"]}