npm - @postenbring/hedwig-css - Versions diffs - 0.0.19 → 0.0.20 - Mend

@postenbring/hedwig-css 0.0.19 → 0.0.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/dist/index.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"ACMA,8NAWA,2CAUA,uCAIA,uCAIA,wCASA,+CE5CA,ufAqBE,gXAaA,uTAQA,sTAYA,wCAIA,+CAGE,yBAAyB,iDAS3B,sKAKE,uJAKA,kJAMF,mJAKE,+HAKA,oIAMF,oQASE,6JAAA,8JAQF,2QASE,yJAAA,0JAQF,8PASE,mHAAA,oHAcA,6OAAA,+OAWA,6MAAA,+MAXA,8OAAA,gPAWA,8MAAA,gNAXA,qPAAA,uPAWA,qNAAA,uNAeF,0GAaE,2EAIE,6EAMF,4EAIE,8EAMF,2EAIE,6EE1NN,kTAQE,2JAME,0FANF,4JAME,2FASF,gNAKE,iGAAA,kGAMA,oLAUF,gEAIA,+DAIA,4HAME,qOAQF,mGAIE,qHAAA,sHAOF,iGAQE,mHAAA,iGARF,wFAQE,mHAAA,iGErFJ,iUAcE,wEAAA,yFAKA,qEAMA,4IAAA,+JAOA,wJAMA,mJAMA,4KEhDF,8FAME,+DAIA,gFAME,gKAKE,8FAMF,yEAGE,8FE9BN,+FAME,qDAGE,wDAKF,6CAAA,oCAIA,0CAAA,iCAOA,8DAIE,iDAQF,+FAKA,yCAAA,0DAKA,8FE/CF,uEAIA,uDAGE,oFAKF,uDAGE,oFAIA,wGAKF,wDAGE,uFAIA,oFAKF,qDAGE,sFAIA,yFAKF,iEAGE,wGAIA,qGAKF,2DAGE,+FAIA,+FAKF,+DAGE,qGAIA,kGAIA,yBACE,mGXpFJ,mKAIE,+DAAA,mFAKA,2EAIA,yGAKA,+EAOA,yBAAyB,kEAOzB,sCASF,yhCAmBE,oFAKA,0GEjEF,yWAIE,yBAAyB,0FAazB,yOASA,gGAGE,8iBAKF,4GAGE,06BAKF,+FAGE,25BAKF,gGAIE,yNASF,kDAAA,wDAMA,8GAAA,qGAIA,+EAIA,yGAGE,yBAAyB,0GEhF7B,wEAOI,uNAAA,6NAAA,wOAAA,8OASA,sGAMA,0FAMA,oPAUF,+EAIA,4KAOA,0ZAgBE,uGAAA,mGAAA,yFAKA,yHAIE,8FAAA,0FAAA,gFAKF,sLAAA,uLASA,gGAKF,4LE7FF,iZAKE,yBAAyB,mKAYzB,mDAGE,+HAIA,oFAIA,6YAaE,kHAKA,kQAOE,gNAAA,qNAMA,6HAMA,gMAMJ,2LAIE,+GE3EN,gPAUA,8iDAoDE,+DAMA,iNAOF,mFAIA,+OAQE,wGAIA,qGAAA,oGAAA,8GAQF,uEAQA,oxBAqCE,0LEhJF,qEAIE,2LAAA,uLAAA,mLAQA,+OAYA,yBAAyB,yGAazB,uCAKA,uFAQF,wHElDA,onCAYE,oDAAA,sDAWE,iDAKE,oDAKF,oEAIA,8JAQA,6BACE,kDAIA,wDAGE,qICrDR,gGAKE,wEAKE,8DAEE,yBAAyB,yJAIvB,yKAIE,8IAIA,8HAKJ,6BAAwB,sJAKtB,2IAIE,uOAQN,oJAKE,yIAIE,oOAOJ,gIAOE,kFAIA,iGAMJ","sources":["../src/index.css","../src/body.css","../src/box/box.css","../src/button/button.css","../src/message/message.css","../src/link/link.css","../src/input/input.css","../src/badge/badge.css","../src/accordion/accordion.css","../src/list/description-list.css","../src/dropdown/dropdown.css","../src/list/list.css","../src/modal/modal.css","../src/typography/typography.css","../src/breadcrumb/breadcrumb.css","../src/tabs/tabs.css"],"sourcesContent":["@import url(\"body.css\");\n@import url(\"button/button.css\");\n@import url(\"link/link.css\");\n@import url(\"badge/badge.css\");\n@import url(\"list/description-list.css\");\n@import url(\"list/list.css\");\n@import url(\"typography/typography.css\");\n@import url(\"box/box.css\");\n@import url(\"message/message.css\");\n@import url(\"input/input.css\");\n@import url(\"accordion/accordion.css\");\n@import url(\"dropdown/dropdown.css\");\n@import url(\"modal/modal.css\");\n@import url(\"breadcrumb/breadcrumb.css\");\n@import url(\"tabs/tabs.css\");\n","/\n All element selector, and general global styles should be defined in this file\n \n Based on hedwig global css\n * https://github.com/bring/hedwig/blob/master/src/shared/base/body.css\n /\n:root {\n box-sizing: border-box;\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n line-height: 1.4;\n cursor: auto;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n}\n\nbody {\n background: var(--hds-ui-colors-white);\n}\n\n/\n Default typography for headings\n \n Since hedwig legacy sets default font-family\n * we need to override it to get the correct `Posten Sans`\n /\nh1 {\n font: var(--hds-brand-typography-h1);\n}\n\nh2 {\n font: var(--hds-brand-typography-h2);\n}\n\nh3 {\n font: var(--hds-typography-header-h3);\n}\n\n/\n * Uncommon to use these levels,\n * but default to body-title.\n * The consumer should override to whatever fit's their need\n /\nh4,\nh5,\nh6 {\n font: var(--hds-typography-body-title);\n}\n",".hds-box {\n position: relative;\n border-radius: var(--hds-border-radius);\n\n &, / Default /\n &.hds-box--light-grey {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n\n &.hds-box--lighter {\n background-color: var(--hds-brand-colors-lighter);\n }\n\n &.hds-box--white {\n background-color: var(--hds-ui-colors-white);\n box-shadow: var(--hds-shadow-default);\n }\n\n &.hds-box--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n }\n\n / Padding /\n --hds-component-box-padding: var(--hds-spacing-medium-2);\n\n @media (width >= 720px) {\n --hds-component-box-padding: var(--hds-spacing-medium-3);\n }\n\n padding: var(--hds-component-box-padding);\n\n / Closed state /\n &.hds-box--closed {\n display: none;\n }\n}\n\n/\n Close button\n * TODO: Styling for the hover and focus effect can be improved upon\n /\n.hds-box .hds-box__close-button {\n / Icon /\n width: 24px;\n height: 24px;\n background: transparent;\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>');\n\n / Positioning /\n position: absolute;\n top: var(--hds-spacing-small-4);\n right: var(--hds-spacing-small-4);\n padding: 0;\n border: none;\n cursor: pointer;\n\n / Hover effect /\n transition: filter var(--hds-micro-animation-duration-quick)\n var(--hds-micro-animation-easing-normal);\n\n &:hover {\n filter: invert(40%);\n }\n\n / Active effect /\n &:active {\n outline: none;\n box-shadow: 0 0 0 2px var(--hds-ui-colors-black-hover);\n }\n}\n",".hds-button {\n --hds-component-button-border-width: 0px;\n\n -webkit-font-smoothing: antialiased;\n appearance: button;\n box-sizing: border-box;\n display: inline-block;\n border-style: solid;\n border-radius: var(--hds-border-radius);\n border-width: var(--hds-component-button-border-width);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n word-break: normal;\n font: var(--hds-typography-body-small-title);\n\n / When used as a link (<a>) /\n text-decoration: none;\n\n /\n Modifiers: sizes\n /\n &.hds-button--small {\n / In figma, the actual padding for the text is 10px /\n --hds-component-button-small-y-padding: 10px;\n\n font-size: var(--hds-font-size-technical-title-max);\n line-height: var(--hds-line-height-technical-title-max);\n padding: calc(\n var(--hds-component-button-small-y-padding) - var(--hds-component-button-border-width)\n )\n calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));\n height: 44px;\n }\n\n &.hds-button--medium {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));\n height: 50px;\n }\n\n &.hds-button--large {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));\n height: 58px;\n }\n\n /\n Modifiers: Width\n /\n\n &.hds-button--full {\n width: 100%;\n }\n\n &.hds-button--mobile-full {\n width: 100%;\n\n @media (width >= 720px) {\n width: unset;\n }\n }\n\n /\n Modifiers: Variants\n /\n\n &.hds-button--primary {\n background-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n\n &:hover {\n background-color: var(--hds-brand-colors-signature-hover);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n }\n\n &.hds-button--secondary {\n background-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n\n &:hover {\n background-color: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-darker);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-primary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border-color: var(--hds-brand-colors-dark);\n }\n }\n\n &.hds-button--outline-secondary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-white {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n }\n }\n\n /\n State: Disabled\n /\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n &.hds-button--primary,\n &.hds-button--secondary {\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border-color: var(--hds-ui-colors-grey);\n outline: 0;\n box-shadow: none;\n cursor: default;\n }\n\n &.hds-button--outline-primary,\n &.hds-button--outline-secondary {\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: transparent;\n cursor: default;\n }\n }\n\n /\n Variant: Icon only\n * TODO: Support text + icon on either left or right side.\n * See button component in digdir/designsystemet and nav/aksel\n /\n &.hds-button--icon-only {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n\n /\n Modifiers: sizes\n \n TODO: Consider/figure out using css variables for these values\n * must make sense, not just choosing a value that matches for the sake of it\n /\n\n &.hds-button--small {\n height: 44px;\n width: 44px;\n\n & {\n height: 24px;\n width: 24px;\n }\n }\n\n &.hds-button--medium {\n height: 50px;\n width: 50px;\n\n & * {\n height: 32px;\n width: 32px;\n }\n }\n\n &.hds-button--large {\n height: 58px;\n width: 58px;\n\n & * {\n height: 32px;\n width: 32px;\n }\n }\n }\n}\n",".hds-box.hds-message {\n --hds-component-message-icon-width: var(--hds-spacing-medium-3);\n --hds-component-message-spacing-between: var(--hds-spacing-small-4);\n\n @media (width >= 720px) {\n --hds-component-message-spacing-between: var(--hds-spacing-medium-2);\n }\n\n /* stylelint-disable-next-line csstools/value-no-unknown-custom-properties -- Comes from `box.css` /\n --hds-component-message-padding: var(--hds-component-box-padding);\n\n padding-left: calc(\n var(--hds-component-message-padding) + var(--hds-component-message-icon-width) +\n var(--hds-component-message-spacing-between)\n );\n\n / Icon placement /\n &::before {\n content: \"\";\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n height: var(--hds-component-message-icon-width);\n }\n\n &.hds-message--success {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>');\n }\n }\n\n &.hds-message--attention {\n background-color: var(--hds-ui-colors-warning-yellow-light-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--neutral {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n / stylelint-disable-next-line selector-class-pattern -- Custom icon is only available for the neutral variant /\n .hds-message--neutral__icon {\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n }\n }\n\n / Reset margin /\n & .hds-message__title,\n & .hds-message__description {\n margin: 0;\n }\n\n / Offset to match the icon /\n & :is(.hds-message__title, .hds-message__description):first-of-type {\n margin-top: 2px;\n }\n\n & .hds-message__title {\n font: var(--hds-typography-body-title);\n }\n\n & .hds-message__title ~ .hds-message__description {\n margin-top: var(--hds-spacing-small-3);\n\n @media (width >= 940px) {\n margin-top: var(--hds-spacing-small-4);\n }\n }\n}\n","/*\n Block\n /\n\n.hds-link {\n text-decoration: none;\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n\n & .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n }\n }\n\n /\n Modifers\n /\n\n &.hds-link--inverted {\n color: var(--hds-ui-colors-white);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentcolor;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n border-color: currentcolor;\n }\n\n &:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentcolor;\n border-color: currentcolor;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n }\n\n &.hds-link--small {\n font: var(--hds-typography-body-small);\n }\n\n &.hds-link--large {\n font: var(--hds-typography-header-h3);\n }\n\n &.hds-link--no-underline {\n font-weight: 500;\n color: var(--hds-brand-colors-dark);\n text-decoration: none;\n border-bottom: none;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n }\n }\n\n &.hds-link--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n }\n }\n\n &:is(button) {\n padding: 0;\n background: none;\n border-top: 0;\n border-left: 0;\n border-right: 0;\n\n / Button inherits the font size from the user agent by default /\n &:not(.hds-link--small, .hds-link--large) {\n font: var(--hds-typography-body);\n }\n }\n}\n",".hds-input {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n &.hds-input--error,\n &.hds-input--lined.hds-input--error {\n .hds-input__input,\n .hds-input__input:focus {\n position: relative;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-warning-yellow);\n margin-bottom: calc(var(--hds-stroke-thick) - var(--hds-stroke-default));\n }\n }\n\n &.hds-input--default {\n .hds-input__input {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-input--white {\n .hds-input__input {\n background-color: var(--hds-ui-colors-white);\n }\n }\n\n &.hds-input--lined {\n .hds-input__input {\n background: transparent;\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n padding-left: 0;\n padding-top: var(--hds-spacing-small-1);\n padding-bottom: var(--hds-spacing-small-3);\n border-radius: 0;\n }\n }\n\n &:focus-within .hds-input__label {\n color: var(--hds-brand-colors-darker);\n }\n\n & .hds-input__label {\n transition: color var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n order: 1;\n }\n\n & .hds-input__input {\n color: var(--hds-ui-colors-black);\n position: relative;\n width: 100%;\n\n / height: var(--hwc-input-field-height); /\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition: border margin var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n order: 2;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:disabled,\n &:read-only {\n color: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n }\n\n / Fiks grå label når readonly, bruk :has /\n\n &:read-only:focus {\n border-bottom-color: var(--hds-brand-colors-darker);\n }\n }\n\n & .hds-input__error-message {\n font: var(--hds-typography-caption-title);\n color: var(--hds-ui-colors-dark-grey);\n padding: var(--hds-spacing-small-1) 0 0 var(--hds-spacing-small-4);\n order: 3;\n }\n}\n","/\n Block\n /\n\n.hds-badge {\n display: inline-block;\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n text-transform: uppercase;\n line-height: 1.1;\n font-size: 12px; / For now, this might be changed later /\n font-weight: 500;\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n\n / Size variations /\n\n &, / Default /\n &.hds-badge--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n }\n\n &.hds-badge--smaller {\n padding: 2px var(--hds-spacing-small-1);\n }\n\n / Color variations /\n\n &, / Default /\n &.hds-badge--primary {\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n }\n\n &.hds-badge--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n }\n}\n",".hds-accordion {\n --hds-accordion-icon-dimension: 24px;\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-small-4);\n --hds-component-accordion-content-spacing: var(--hds-spacing-medium-3);\n\n @media (width >= 720px) {\n --hds-component-accordion-content-spacing: var(--hds-spacing-large-1);\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-medium-2);\n }\n\n display: block;\n border: none;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n\n .hds-accordion-item {\n overflow: hidden;\n\n &.hds-accordion-item__expanded .hds-accordion-item-trigger {\n color: var(--hds-brand-colors-dark);\n }\n\n &:first-child .hds-accordion-item-trigger {\n border: 0 none;\n }\n\n .hds-accordion-item-trigger {\n cursor: pointer;\n display: grid;\n grid-template-columns: 24px auto;\n grid-gap: var(--hds-spacing-small-4);\n width: 100%;\n padding: var(--hds-component-accordion-trigger-spacing-between) 0;\n border: 0;\n border-top: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n text-align: left;\n background-color: transparent;\n font: var(--hds-typography-body);\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n outline: 0;\n }\n\n .hds-accordion-item-trigger--icon {\n transition: all 0.05s ease;\n display: inline-block;\n color: var(--hds-brand-colors-dark);\n width: var(--hds-accordion-icon-dimension);\n height: var(--hds-accordion-icon-dimension);\n\n .hds-accordion-item-trigger--icon-chevron,\n .hds-accordion-item-trigger--icon-chevron-down {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n }\n\n & svg {\n vertical-align: baseline;\n }\n }\n\n &.hds-accordion-item-trigger--open {\n .hds-accordion-item-trigger--icon svg {\n transform: rotate(180deg);\n }\n }\n }\n\n .hds-accordion-item-content {\n padding: 0 0 var(--hds-component-accordion-content-spacing) var(--hds-spacing-medium-4);\n font: var(--hds-typography-body-small);\n\n &.hds-accordion-item-content--closed {\n display: none;\n }\n }\n }\n}\n",".hds-description-list {\n list-style: none;\n margin: 0;\n padding-left: 0;\n font: var(--hds-typography-body);\n\n & dt {\n font: var(--hds-typography-body-title);\n }\n\n & dd {\n margin-left: 0;\n margin-bottom: var(--hds-spacing-small-3);\n }\n\n &.hds-description-list--horizontal {\n & dt {\n display: inline-block;\n margin-right: var(--hds-spacing-small-1);\n margin-bottom: var(--hds-spacing-small-2);\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n\n & dd {\n display: inline;\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n }\n}\n","label.hds-dropdown__label {\n transition: color var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n color: var(--hds-ui-colors-black);\n margin-bottom: 0;\n display: block;\n text-align: left;\n}\n\nselect.hds-dropdown {\n position: relative;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n font: var(--hds-typography-body-small);\n display: flex;\n width: 100%;\n height: 58px; / should this be a token? /\n cursor: pointer;\n color: var(--hds-ui-colors-black);\n appearance: none;\n padding: var(--hds-spacing-small-4);\n transition:\n border-color var(--hds-micro-animation-duration-normal) var(--hds-micro-animation-easing-normal),\n max-height var(--hds-micro-animation-duration-normal) var(--hds-micro-animation-easing-normal),\n transform var(--hds-micro-animation-duration-normal) var(--hds-micro-animation-easing-normal);\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n background-image:\n linear-gradient(45deg, transparent 74%, var(--hds-ui-colors-light-grey-fill) 0%),\n linear-gradient(135deg, var(--hds-ui-colors-light-grey-fill) 26%, transparent 26%),\n / Draw the arrow /\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 72%,\n var(--hds-ui-colors-light-grey-fill) 73%,\n var(--hds-ui-colors-light-grey-fill) 100%\n ),\n linear-gradient(\n 45deg,\n var(--hds-ui-colors-light-grey-fill) 0,\n var(--hds-ui-colors-light-grey-fill) 28%,\n var(--hds-ui-colors-dark-grey) 29%,\n var(--hds-ui-colors-dark-grey) 37%,\n transparent 38%,\n transparent 100%\n ),\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 62%,\n var(--hds-ui-colors-dark-grey) 63%,\n var(--hds-ui-colors-dark-grey) 71%,\n var(--hds-ui-colors-light-grey-fill) 72%,\n var(--hds-ui-colors-light-grey-fill) 100%\n );\n background-size: var(--hds-spacing-small-4) var(--hds-spacing-small-4);\n background-position: calc(100% - var(--hds-spacing-small-4)) 45%;\n background-repeat: no-repeat;\n\n / Clearfix /\n &::after {\n display: table;\n content: \" \";\n clear: both;\n }\n\n &.hds-dropdown--error {\n position: relative;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-warning-yellow);\n margin-bottom: calc(var(--hds-stroke-thick) - var(--hds-stroke-default));\n }\n}\n\nselect.hds-dropdown--default {\n background-color: var(--hds-ui-colors-light-grey-fill);\n}\n\nselect.hds-dropdown--lined {\n background-color: transparent;\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n padding-left: 0;\n padding-top: var(--hds-spacing-small-1);\n padding-bottom: var(--hds-spacing-small-3);\n border-radius: 0;\n\n &:focus {\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n }\n\n &[disabled],\n &:disabled,\n &[disabled=\"disabled\"] {\n background-color: transparent;\n padding: var(--hds-spacing-small-4);\n }\n}\n\nselect.hds-dropdown--white {\n background-color: var(--hds-ui-colors-white);\n\n / Place the arrow, created below /\n\n / background-position: calc(100% - var(--hwc-spacing-small-4)) 45%; /\n}\n\nselect.hds-dropdown--lined,\nselect.hds-dropdown--white {\n background-image:\n / Cut off the sharp ends of the arrow /\n linear-gradient(45deg, transparent 74%, var(--hds-ui-colors-white) 0%),\n linear-gradient(135deg, var(--hds-ui-colors-white) 26%, transparent 26%),\n / Draw the arrow /\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 72%,\n var(--hds-ui-colors-white) 73%,\n var(--hds-ui-colors-white) 100%\n ),\n linear-gradient(\n 45deg,\n var(--hds-ui-colors-white) 0,\n var(--hds-ui-colors-white) 28%,\n var(--hds-ui-colors-dark-grey) 29%,\n var(--hds-ui-colors-dark-grey) 37%,\n transparent 38%,\n transparent 100%\n ),\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 62%,\n var(--hds-ui-colors-dark-grey) 63%,\n var(--hds-ui-colors-dark-grey) 71%,\n var(--hds-ui-colors-white) 72%,\n var(--hds-ui-colors-white) 100%\n );\n background-size: var(--hds-spacing-small-4) var(--hds-spacing-small-4);\n background-repeat: no-repeat;\n}\n\n.hds-dropdown--error {\n .hds-dropdown-message {\n font: var(--hds-typography-caption-title);\n color: var(--hds-ui-colors-dark-grey);\n padding: var(--hds-spacing-small-1) 0 0 var(--hds-spacing-small-4);\n }\n}\n",".hds-list {\n margin: 0;\n display: flex;\n flex-direction: column;\n padding-left: var(--hds-spacing-medium-3);\n\n & li {\n padding-left: var(--hds-spacing-small-2);\n\n &::marker {\n color: var(--hds-brand-colors-dark);\n }\n }\n\n &:is(ol) {\n list-style: decimal;\n }\n\n &:is(ul) {\n list-style: disc;\n }\n\n /\n Modifers: Style\n /\n &.hds-list--no-bullets {\n list-style: none;\n padding-left: 0;\n\n & li {\n padding-left: 0;\n }\n }\n\n /\n Modifers: Sizes\n /\n &.hds-list--small {\n font: var(--hds-typography-body-small);\n gap: var(--hds-spacing-small-1);\n }\n\n &, / Default /\n &.hds-list--medium {\n gap: var(--hds-spacing-small-2);\n }\n\n &.hds-list--large {\n font: var(--hds-typography-header-h3);\n gap: var(--hds-spacing-small-3);\n }\n}\n",".hds-modal {\n / Reset /\n border: none;\n\n &::backdrop {\n / Need to hardcode values in css for now.\n https://stackoverflow.com/questions/58818299/css-variables-not-working-in-dialogbackdrop\n /\n background-color: rgba(0 0 0 / 40%);\n animation: hds-modal-fade-in 0.3s cubic-bezier(0.45, 0.1, 0.65, 1); / --hds-micro-animation-duration-normal /\n }\n\n &[open] {\n animation: hds-modal-fade-in var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-in);\n }\n\n /\n Size\n /\n min-width: 100%;\n max-width: 100%;\n border-radius: 0;\n\n @media (width >= 720px) {\n min-width: 720px;\n max-width: min(720px, calc(100% - 6px - 2em));\n\n / NOTE: Re-adding border radius.\n * We actually get the border radius from .hds-box,\n * but since we are resetting border radius above for small screens\n * we need to re-add it here for larger screens.\n /\n border-radius: var(--hds-border-radius);\n }\n\n / Reset margin /\n & .hds-modal__header {\n margin: 0;\n }\n\n / stylelint-disable-next-line no-duplicate-selectors -- It's ok /\n & .hds-modal__header {\n font: var(--hds-typography-body-title);\n\n / Offset the close button, so text is not overlapping or right next to the button /\n padding-right: 16px;\n }\n}\n\n@keyframes hds-modal-fade-in {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n",".hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n\n .hds-typography-h1 ~ &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n }\n\n &.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n }\n\n &.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n }\n\n &.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n\n &.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n }\n\n &.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n }\n\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n }\n\n @media (width >= 940px) {\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n }\n}\n",".hds-breadcrumbs {\n --hds-breadcrumb-image-left: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"> <path d=\"M11.0404 13.9322L11.3917 13.5887C11.462 13.4983 11.462 13.3537 11.3917 13.2814L8.21212 9.99096L11.3917 6.71864C11.462 6.64633 11.462 6.50169 11.3917 6.4113L11.0404 6.0678C10.9526 5.9774 10.8296 5.9774 10.7418 6.0678L7.0527 9.84633C6.98243 9.93672 6.98243 10.0633 7.0527 10.1537L10.7418 13.9322C10.8296 14.0226 10.9526 14.0226 11.0404 13.9322Z\" fill=\"black\"/></svg>');\n --hds-breadcrumb-image-right: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"><path d=\"M7.9596 6.0678L7.60826 6.4113C7.53799 6.50169 7.53799 6.64633 7.60826 6.71864L10.7879 10.009L7.60826 13.2814C7.53799 13.3537 7.53799 13.4983 7.60826 13.5887L7.9596 13.9322C8.04743 14.0226 8.1704 14.0226 8.25823 13.9322L11.9473 10.1537C12.0176 10.0633 12.0176 9.93672 11.9473 9.84633L8.25823 6.0678C8.1704 5.9774 8.04743 5.9774 7.9596 6.0678Z\" fill=\"%236E6E6E\"/></svg>');\n\n padding: 0;\n list-style-type: none;\n display: flex;\n\n /\n * Ensure the caption typography is used\n * Override general styling for links that sets the font-size\n /\n &,\n & a {\n font: var(--hds-typography-caption);\n }\n\n & li {\n /\n * Design in Figma has an extra 2px distance between\n * the text and underline border on links\n * making the total height 21px\n /\n .hds-link {\n padding-bottom: 2px;\n }\n\n &:first-child {\n &::before {\n display: none;\n }\n }\n\n &:last-child {\n color: var(--hds-ui-colors-dark-grey);\n }\n\n &::before {\n display: inline-block;\n background-image: var(--hds-breadcrumb-image-right);\n width: 20px;\n height: 20px;\n margin: 0 var(--hds-spacing-small-1);\n }\n\n @media (width < 720px) {\n &:not(:only-child) {\n display: none;\n }\n\n &:nth-last-of-type(2) {\n display: inherit;\n\n &::before {\n display: inline-block;\n margin-left: 0;\n background-image: var(--hds-breadcrumb-image-left);\n }\n }\n }\n }\n}\n",".hds-tabs {\n --hds-tabs-border-active-size: var(--hds-stroke-thick);\n\n font: var(--hds-typography-body);\n\n .hds-tabs--list {\n padding-left: 0;\n display: inline-flex;\n width: auto;\n\n &.hds-tabs--list-horizontal {\n color: red;\n @media (width >= 720px) {\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-light-grey-fill);\n flex-direction: row;\n\n .hds-tabs--tab {\n padding: var(--hds-spacing-small-3) 0;\n border-bottom: var(--hds-tabs-border-active-size) solid transparent;\n\n &.hds-tabs--tab-active {\n border-bottom-color: var(--hds-brand-colors-signature);\n }\n\n &:not(:last-child) {\n margin-right: var(--hds-spacing-medium-3);\n }\n }\n }\n @media (width < 720px) {\n border-left: 1px solid var(--hds-ui-colors-light-grey-fill);\n flex-direction: column;\n padding-left: 1px;\n\n .hds-tabs--tab {\n width: auto;\n padding: var(--hds-spacing-small-2) var(--hds-spacing-small-3);\n\n &.hds-tabs--tab-active {\n margin-left: calc(var(--hds-tabs-border-active-size) -1);\n border-left: var(--hds-tabs-border-active-size) solid var(--hds-brand-colors-signature);\n }\n }\n }\n }\n\n &.hds-tabs--list-vertical {\n border-left: 1px solid var(--hds-ui-colors-light-grey-fill);\n flex-direction: column;\n padding-left: 1px;\n\n .hds-tabs--tab {\n width: auto;\n padding: var(--hds-spacing-small-2) var(--hds-spacing-small-3);\n\n &.hds-tabs--tab-active {\n margin-left: calc(var(--hds-tabs-border-active-size) * -1);\n border-left: var(--hds-tabs-border-active-size) solid var(--hds-brand-colors-signature);\n }\n }\n }\n\n .hds-tabs--tab {\n cursor: pointer;\n font: var(--hds-typography-body);\n background: transparent;\n border: 0 none;\n text-align: left;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-tabs--tab-active {\n color: var(--hds-brand-colors-dark);\n }\n }\n }\n\n .hds-tabs--contents {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"ACMA,8NAWA,2CAUA,uCAIA,uCAIA,wCASA,+CC5CA,ygBAsBE,gXAaA,uTAQA,sTAYA,wCAIA,+CAGE,yBAAyB,iDAS3B,sKAKE,uJAKA,kJAMF,mJAKE,+HAKA,oIAMF,oQASE,6JAAA,8JAQF,2QASE,yJAAA,0JAQF,8PASE,mHAAA,oHAcA,6OAAA,+OAWA,6MAAA,+MAXA,8OAAA,gPAWA,8MAAA,gNAXA,qPAAA,uPAWA,qNAAA,uNAeF,0GAaE,2EAIE,6EAMF,4EAIE,8EAMF,2EAIE,6EC3NN,kTAQE,2JAME,0FANF,4JAME,2FASF,gNAKE,iGAAA,kGAMA,oLAUF,gEAIA,+DAIA,4HAME,qOAQF,mGAIE,qHAAA,sHAOF,iGAQE,mHAAA,iGARF,wFAQE,mHAAA,iGCrFJ,iUAcE,wEAAA,yFAKA,qEAMA,4IAAA,+JAOA,wJAMA,mJAMA,4KChDF,8FAME,+DAIA,gFAME,gKAKE,8FAMF,yEAGE,8FC9BN,+FAME,qDAGE,wDAKF,6CAAA,oCAIA,0CAAA,iCAOA,8DAIE,iDAQF,+FAKA,yCAAA,0DAKA,8FC/CF,uEAIA,uDAGE,oFAKF,uDAGE,oFAIA,wGAKF,wDAGE,uFAIA,oFAKF,qDAGE,sFAIA,yFAKF,iEAGE,wGAIA,qGAKF,2DAGE,+FAIA,+FAKF,+DAGE,qGAIA,kGAIA,yBACE,mGCpFJ,mKAIE,+DAAA,mFAKA,2EAIA,yGAKA,+EAOA,yBAAyB,kEAOzB,sCASF,yhCAmBE,oFAKA,0GCjEF,yWAIE,yBAAyB,0FAazB,yOASA,gGAGE,8iBAKF,4GAGE,06BAKF,+FAGE,25BAKF,gGAIE,yNASF,kDAAA,wDAMA,8GAAA,qGAIA,+EAIA,yGAGE,yBAAyB,0GChF7B,wEAOI,uNAAA,6NAAA,wOAAA,8OASA,sGAMA,0FAMA,oPAUF,+EAIA,4KAOA,0ZAgBE,uGAAA,mGAAA,yFAKA,yHAIE,8FAAA,0FAAA,gFAKF,sLAAA,uLASA,gGAKF,4LC7FF,iZAKE,yBAAyB,mKAYzB,mDAGE,+HAIA,oFAIA,6YAaE,kHAKA,kQAOE,gNAAA,qNAMA,6HAMA,gMAMJ,2LAIE,+GC3EN,gPAUA,8iDAoDE,+DAMA,iNAOF,mFAIA,+OAQE,wGAIA,qGAAA,oGAAA,8GAQF,uEAQA,oxBAqCE,0LChJF,qEAIE,2LAAA,uLAAA,mLAQA,+OAYA,yBAAyB,yGAazB,uCAKA,uFAQF,wHClDA,onCAYE,oDAAA,sDAWE,iDAKE,oDAKF,oEAIA,8JAQA,6BACE,kDAIA,wDAGE,qICrDR,gGAKE,wEAKE,8DAEE,yBAAyB,yJAIvB,yKAIE,8IAIA,8HAKJ,6BAAwB,sJAKtB,2IAIE,uOAQN,oJAKE,yIAIE,oOAOJ,gIAOE,kFAIA,iGAMJ","sources":["../src/index.css","../src/body.css","../src/button/button.css","../src/link/link.css","../src/badge/badge.css","../src/list/description-list.css","../src/list/list.css","../src/typography/typography.css","../src/box/box.css","../src/message/message.css","../src/input/input.css","../src/accordion/accordion.css","../src/dropdown/dropdown.css","../src/modal/modal.css","../src/breadcrumb/breadcrumb.css","../src/tabs/tabs.css"],"sourcesContent":["@import url(\"body.css\");\n@import url(\"button/button.css\");\n@import url(\"link/link.css\");\n@import url(\"badge/badge.css\");\n@import url(\"list/description-list.css\");\n@import url(\"list/list.css\");\n@import url(\"typography/typography.css\");\n@import url(\"box/box.css\");\n@import url(\"message/message.css\");\n@import url(\"input/input.css\");\n@import url(\"accordion/accordion.css\");\n@import url(\"dropdown/dropdown.css\");\n@import url(\"modal/modal.css\");\n@import url(\"breadcrumb/breadcrumb.css\");\n@import url(\"tabs/tabs.css\");\n","/\n All element selector, and general global styles should be defined in this file\n \n Based on hedwig global css\n * https://github.com/bring/hedwig/blob/master/src/shared/base/body.css\n /\n:root {\n box-sizing: border-box;\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n line-height: 1.4;\n cursor: auto;\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n}\n\nbody {\n background: var(--hds-ui-colors-white);\n}\n\n/\n Default typography for headings\n \n Since hedwig legacy sets default font-family\n * we need to override it to get the correct `Posten Sans`\n /\nh1 {\n font: var(--hds-brand-typography-h1);\n}\n\nh2 {\n font: var(--hds-brand-typography-h2);\n}\n\nh3 {\n font: var(--hds-typography-header-h3);\n}\n\n/\n * Uncommon to use these levels,\n * but default to body-title.\n * The consumer should override to whatever fit's their need\n /\nh4,\nh5,\nh6 {\n font: var(--hds-typography-body-title);\n}\n",".hds-button {\n --hds-component-button-border-width: 0px;\n\n -webkit-font-smoothing: antialiased;\n appearance: button;\n box-sizing: border-box;\n display: inline-block;\n border-style: solid;\n border-radius: var(--hds-border-radius);\n border-width: var(--hds-component-button-border-width);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n word-break: normal;\n font: var(--hds-typography-body-small-title);\n\n / When used as a link (<a>) /\n text-decoration: none;\n text-align: center;\n\n /\n Modifiers: sizes\n /\n &.hds-button--small {\n / In figma, the actual padding for the text is 10px /\n --hds-component-button-small-y-padding: 10px;\n\n font-size: var(--hds-font-size-technical-title-max);\n line-height: var(--hds-line-height-technical-title-max);\n padding: calc(\n var(--hds-component-button-small-y-padding) - var(--hds-component-button-border-width)\n )\n calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));\n height: 44px;\n }\n\n &.hds-button--medium {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));\n height: 50px;\n }\n\n &.hds-button--large {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n padding: calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))\n calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));\n height: 58px;\n }\n\n /\n Modifiers: Width\n /\n\n &.hds-button--full {\n width: 100%;\n }\n\n &.hds-button--mobile-full {\n width: 100%;\n\n @media (width >= 720px) {\n width: unset;\n }\n }\n\n /\n Modifiers: Variants\n /\n\n &.hds-button--primary {\n background-color: var(--hds-brand-colors-signature);\n color: var(--hds-brand-button-colors-text);\n fill: var(--hds-brand-button-colors-text);\n\n &:hover {\n background-color: var(--hds-brand-colors-signature-hover);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-signature);\n outline: 0 solid var(--hds-brand-colors-signature-hover);\n }\n }\n\n &.hds-button--secondary {\n background-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n\n &:hover {\n background-color: var(--hds-ui-colors-black);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n\n &:active {\n background-color: var(--hds-brand-colors-darker);\n outline: 0 solid var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-primary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-signature);\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n border-color: var(--hds-brand-colors-dark);\n }\n }\n\n &.hds-button--outline-secondary {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-brand-colors-darker);\n fill: var(--hds-brand-colors-darker);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black);\n fill: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n }\n }\n\n &.hds-button--outline-white {\n --hds-component-button-border-width: var(--hds-stroke-thick);\n\n background-color: transparent;\n border-color: var(--hds-brand-colors-light);\n color: var(--hds-ui-colors-white);\n fill: var(--hds-ui-colors-white);\n outline-offset: 3px;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n fill: var(--hds-brand-colors-light);\n }\n }\n\n /\n State: Disabled\n /\n\n &:disabled,\n &[disabled],\n &[disabled]:active {\n &.hds-button--primary,\n &.hds-button--secondary {\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border-color: var(--hds-ui-colors-grey);\n outline: 0;\n box-shadow: none;\n cursor: default;\n }\n\n &.hds-button--outline-primary,\n &.hds-button--outline-secondary {\n border-color: var(--hds-ui-colors-grey);\n color: var(--hds-ui-colors-dark-grey);\n fill: var(--hds-ui-colors-dark-grey);\n background-color: transparent;\n cursor: default;\n }\n }\n\n /\n Variant: Icon only\n * TODO: Support text + icon on either left or right side.\n * See button component in digdir/designsystemet and nav/aksel\n /\n &.hds-button--icon-only {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n\n /\n Modifiers: sizes\n \n TODO: Consider/figure out using css variables for these values\n * must make sense, not just choosing a value that matches for the sake of it\n /\n\n &.hds-button--small {\n height: 44px;\n width: 44px;\n\n & {\n height: 24px;\n width: 24px;\n }\n }\n\n &.hds-button--medium {\n height: 50px;\n width: 50px;\n\n & * {\n height: 32px;\n width: 32px;\n }\n }\n\n &.hds-button--large {\n height: 58px;\n width: 58px;\n\n & * {\n height: 32px;\n width: 32px;\n }\n }\n }\n}\n","/*\n Block\n /\n\n.hds-link {\n text-decoration: none;\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-link-colors-underline);\n fill: var(--hds-brand-link-colors-text);\n color: var(--hds-brand-link-colors-text);\n transition: all var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n cursor: pointer;\n\n &:hover,\n &:active {\n color: var(--hds-brand-link-colors-hover);\n fill: var(--hds-brand-link-colors-hover);\n border-color: var(--hds-brand-link-colors-underline-hover);\n\n & .hds-link__text {\n border-color: var(--hds-brand-link-colors-underline-hover);\n }\n }\n\n /\n Modifers\n /\n\n &.hds-link--inverted {\n color: var(--hds-ui-colors-white);\n text-decoration-color: var(--hds-brand-colors-signature);\n border-color: currentcolor;\n\n &:hover,\n &:active {\n color: var(--hds-brand-colors-light);\n border-color: currentcolor;\n }\n\n &:disabled {\n color: var(--hds-ui-colors-dark-grey);\n fill: currentcolor;\n border-color: currentcolor;\n outline: 0 !important;\n box-shadow: none !important;\n cursor: default;\n }\n }\n\n &.hds-link--small {\n font: var(--hds-typography-body-small);\n }\n\n &.hds-link--large {\n font: var(--hds-typography-header-h3);\n }\n\n &.hds-link--no-underline {\n font-weight: 500;\n color: var(--hds-brand-colors-dark);\n text-decoration: none;\n border-bottom: none;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n text-decoration: underline;\n text-decoration-color: var(--hds-brand-colors-dark);\n border-bottom: none;\n }\n }\n\n &.hds-link--solid {\n color: var(--hds-ui-colors-black);\n border-color: var(--hds-ui-colors-black);\n\n &:hover,\n &:active {\n color: var(--hds-ui-colors-black-hover);\n border-color: var(--hds-ui-colors-black-hover);\n }\n }\n\n &:is(button) {\n padding: 0;\n background: none;\n border-top: 0;\n border-left: 0;\n border-right: 0;\n\n / Button inherits the font size from the user agent by default /\n &:not(.hds-link--small, .hds-link--large) {\n font: var(--hds-typography-body);\n }\n }\n}\n","/\n Block\n /\n\n.hds-badge {\n display: inline-block;\n border: var(--hds-stroke-default) solid var(--hds-brand-colors-lighter);\n border-radius: var(--hds-border-radius);\n text-transform: uppercase;\n line-height: 1.1;\n font-size: 12px; / For now, this might be changed later /\n font-weight: 500;\n -moz-osx-font-smoothing: subpixel-antialiased;\n -webkit-font-smoothing: subpixel-antialiased;\n vertical-align: 10%;\n\n / Size variations /\n\n &, / Default /\n &.hds-badge--small {\n padding: var(--hds-spacing-small-1) var(--hds-spacing-small-2);\n }\n\n &.hds-badge--smaller {\n padding: 2px var(--hds-spacing-small-1);\n }\n\n / Color variations /\n\n &, / Default /\n &.hds-badge--primary {\n background-color: var(--hds-brand-colors-lighter);\n border-color: var(--hds-brand-colors-lighter);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--dark {\n background-color: var(--hds-brand-colors-darker);\n border-color: var(--hds-brand-colors-darker);\n color: var(--hds-ui-colors-white);\n }\n\n &.hds-badge--white {\n background-color: var(--hds-ui-colors-white);\n border-color: var(--hds-ui-colors-white);\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-badge--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n border-color: var(--hds-ui-colors-warning-yellow);\n color: var(--hds-brand-link-colors-text);\n }\n}\n",".hds-description-list {\n list-style: none;\n margin: 0;\n padding-left: 0;\n font: var(--hds-typography-body);\n\n & dt {\n font: var(--hds-typography-body-title);\n }\n\n & dd {\n margin-left: 0;\n margin-bottom: var(--hds-spacing-small-3);\n }\n\n &.hds-description-list--horizontal {\n & dt {\n display: inline-block;\n margin-right: var(--hds-spacing-small-1);\n margin-bottom: var(--hds-spacing-small-2);\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n\n & dd {\n display: inline;\n\n &::after {\n content: \"\\a\";\n white-space: pre;\n }\n }\n }\n}\n",".hds-list {\n margin: 0;\n display: flex;\n flex-direction: column;\n padding-left: var(--hds-spacing-medium-3);\n\n & li {\n padding-left: var(--hds-spacing-small-2);\n\n &::marker {\n color: var(--hds-brand-colors-dark);\n }\n }\n\n &:is(ol) {\n list-style: decimal;\n }\n\n &:is(ul) {\n list-style: disc;\n }\n\n /\n Modifers: Style\n /\n &.hds-list--no-bullets {\n list-style: none;\n padding-left: 0;\n\n & li {\n padding-left: 0;\n }\n }\n\n /\n Modifers: Sizes\n /\n &.hds-list--small {\n font: var(--hds-typography-body-small);\n gap: var(--hds-spacing-small-1);\n }\n\n &, / Default /\n &.hds-list--medium {\n gap: var(--hds-spacing-small-2);\n }\n\n &.hds-list--large {\n font: var(--hds-typography-header-h3);\n gap: var(--hds-spacing-small-3);\n }\n}\n",".hds-typography-h2-display {\n font: var(--hds-brand-typography-h1-display);\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n\n .hds-typography-h1 ~ &.hds-typography-h2--spacing {\n margin-top: var(--hds-spacing-medium-3);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--title {\n font: var(--hds-typography-header-h3-title);\n }\n\n &.hds-typography-h3--spacing {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--title {\n font: var(--hds-typography-body-title);\n }\n\n &.hds-typography-body--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--title {\n font: var(--hds-typography-body-small-title);\n }\n\n &.hds-typography-body-small--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n\n &.hds-typography-caption--title {\n font: var(--hds-typography-caption-title);\n }\n\n &.hds-typography-caption--spacing {\n margin-top: var(--hds-spacing-medium-2);\n }\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--title {\n font: var(--hds-typography-technical-title);\n }\n\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-1);\n }\n\n @media (width >= 940px) {\n &.hds-typography-technical--spacing {\n margin-top: var(--hds-spacing-small-2);\n }\n }\n}\n",".hds-box {\n position: relative;\n border-radius: var(--hds-border-radius);\n\n &, / Default /\n &.hds-box--light-grey {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n\n &.hds-box--lighter {\n background-color: var(--hds-brand-colors-lighter);\n }\n\n &.hds-box--white {\n background-color: var(--hds-ui-colors-white);\n box-shadow: var(--hds-shadow-default);\n }\n\n &.hds-box--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n }\n\n / Padding /\n --hds-component-box-padding: var(--hds-spacing-medium-2);\n\n @media (width >= 720px) {\n --hds-component-box-padding: var(--hds-spacing-medium-3);\n }\n\n padding: var(--hds-component-box-padding);\n\n / Closed state /\n &.hds-box--closed {\n display: none;\n }\n}\n\n/\n Close button\n * TODO: Styling for the hover and focus effect can be improved upon\n /\n.hds-box .hds-box__close-button {\n / Icon /\n width: 24px;\n height: 24px;\n background: transparent;\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>');\n\n / Positioning /\n position: absolute;\n top: var(--hds-spacing-small-4);\n right: var(--hds-spacing-small-4);\n padding: 0;\n border: none;\n cursor: pointer;\n\n / Hover effect /\n transition: filter var(--hds-micro-animation-duration-quick)\n var(--hds-micro-animation-easing-normal);\n\n &:hover {\n filter: invert(40%);\n }\n\n / Active effect /\n &:active {\n outline: none;\n box-shadow: 0 0 0 2px var(--hds-ui-colors-black-hover);\n }\n}\n",".hds-box.hds-message {\n --hds-component-message-icon-width: var(--hds-spacing-medium-3);\n --hds-component-message-spacing-between: var(--hds-spacing-small-4);\n\n @media (width >= 720px) {\n --hds-component-message-spacing-between: var(--hds-spacing-medium-2);\n }\n\n / stylelint-disable-next-line csstools/value-no-unknown-custom-properties -- Comes from `box.css` /\n --hds-component-message-padding: var(--hds-component-box-padding);\n\n padding-left: calc(\n var(--hds-component-message-padding) + var(--hds-component-message-icon-width) +\n var(--hds-component-message-spacing-between)\n );\n\n / Icon placement /\n &::before {\n content: \"\";\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n height: var(--hds-component-message-icon-width);\n }\n\n &.hds-message--success {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>');\n }\n }\n\n &.hds-message--attention {\n background-color: var(--hds-ui-colors-warning-yellow-light-fill);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--warning {\n background-color: var(--hds-ui-colors-warning-yellow);\n\n &::before {\n background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>');\n }\n }\n\n &.hds-message--neutral {\n background-color: var(--hds-ui-colors-light-grey-fill);\n\n / stylelint-disable-next-line selector-class-pattern -- Custom icon is only available for the neutral variant /\n .hds-message--neutral__icon {\n position: absolute;\n top: var(--hds-component-message-padding);\n left: var(--hds-component-message-padding);\n width: var(--hds-component-message-icon-width);\n }\n }\n\n / Reset margin /\n & .hds-message__title,\n & .hds-message__description {\n margin: 0;\n }\n\n / Offset to match the icon /\n & :is(.hds-message__title, .hds-message__description):first-of-type {\n margin-top: 2px;\n }\n\n & .hds-message__title {\n font: var(--hds-typography-body-title);\n }\n\n & .hds-message__title ~ .hds-message__description {\n margin-top: var(--hds-spacing-small-3);\n\n @media (width >= 940px) {\n margin-top: var(--hds-spacing-small-4);\n }\n }\n}\n",".hds-input {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n &.hds-input--error,\n &.hds-input--lined.hds-input--error {\n .hds-input__input,\n .hds-input__input:focus {\n position: relative;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-warning-yellow);\n margin-bottom: calc(var(--hds-stroke-thick) - var(--hds-stroke-default));\n }\n }\n\n &.hds-input--default {\n .hds-input__input {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-input--white {\n .hds-input__input {\n background-color: var(--hds-ui-colors-white);\n }\n }\n\n &.hds-input--lined {\n .hds-input__input {\n background: transparent;\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n padding-left: 0;\n padding-top: var(--hds-spacing-small-1);\n padding-bottom: var(--hds-spacing-small-3);\n border-radius: 0;\n }\n }\n\n &:focus-within .hds-input__label {\n color: var(--hds-brand-colors-darker);\n }\n\n & .hds-input__label {\n transition: color var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n order: 1;\n }\n\n & .hds-input__input {\n color: var(--hds-ui-colors-black);\n position: relative;\n width: 100%;\n\n /* height: var(--hwc-input-field-height); /\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition: border margin var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n order: 2;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:disabled,\n &:read-only {\n color: var(--hds-ui-colors-dark-grey);\n background-color: var(--hds-ui-colors-grey);\n border: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n }\n\n / Fiks grå label når readonly, bruk :has /\n\n &:read-only:focus {\n border-bottom-color: var(--hds-brand-colors-darker);\n }\n }\n\n & .hds-input__error-message {\n font: var(--hds-typography-caption-title);\n color: var(--hds-ui-colors-dark-grey);\n padding: var(--hds-spacing-small-1) 0 0 var(--hds-spacing-small-4);\n order: 3;\n }\n}\n",".hds-accordion {\n --hds-accordion-icon-dimension: 24px;\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-small-4);\n --hds-component-accordion-content-spacing: var(--hds-spacing-medium-3);\n\n @media (width >= 720px) {\n --hds-component-accordion-content-spacing: var(--hds-spacing-large-1);\n --hds-component-accordion-trigger-spacing-between: var(--hds-spacing-medium-2);\n }\n\n display: block;\n border: none;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n font: var(--hds-typography-body);\n fill: var(--hds-ui-colors-black);\n color: var(--hds-ui-colors-black);\n\n .hds-accordion-item {\n overflow: hidden;\n\n &.hds-accordion-item__expanded .hds-accordion-item-trigger {\n color: var(--hds-brand-colors-dark);\n }\n\n &:first-child .hds-accordion-item-trigger {\n border: 0 none;\n }\n\n .hds-accordion-item-trigger {\n cursor: pointer;\n display: grid;\n grid-template-columns: 24px auto;\n grid-gap: var(--hds-spacing-small-4);\n width: 100%;\n padding: var(--hds-component-accordion-trigger-spacing-between) 0;\n border: 0;\n border-top: var(--hds-stroke-thick) solid var(--hds-ui-colors-light-grey-fill);\n text-align: left;\n background-color: transparent;\n font: var(--hds-typography-body);\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n outline: 0;\n }\n\n .hds-accordion-item-trigger--icon {\n transition: all 0.05s ease;\n display: inline-block;\n color: var(--hds-brand-colors-dark);\n width: var(--hds-accordion-icon-dimension);\n height: var(--hds-accordion-icon-dimension);\n\n .hds-accordion-item-trigger--icon-chevron,\n .hds-accordion-item-trigger--icon-chevron-down {\n color: var(--hds-brand-colors-dark);\n fill: var(--hds-brand-colors-dark);\n }\n\n & svg {\n vertical-align: baseline;\n }\n }\n\n &.hds-accordion-item-trigger--open {\n .hds-accordion-item-trigger--icon svg {\n transform: rotate(180deg);\n }\n }\n }\n\n .hds-accordion-item-content {\n padding: 0 0 var(--hds-component-accordion-content-spacing) var(--hds-spacing-medium-4);\n font: var(--hds-typography-body-small);\n\n &.hds-accordion-item-content--closed {\n display: none;\n }\n }\n }\n}\n","label.hds-dropdown__label {\n transition: color var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n color: var(--hds-ui-colors-black);\n margin-bottom: 0;\n display: block;\n text-align: left;\n}\n\nselect.hds-dropdown {\n position: relative;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n font: var(--hds-typography-body-small);\n display: flex;\n width: 100%;\n height: 58px; / should this be a token? /\n cursor: pointer;\n color: var(--hds-ui-colors-black);\n appearance: none;\n padding: var(--hds-spacing-small-4);\n transition:\n border-color var(--hds-micro-animation-duration-normal) var(--hds-micro-animation-easing-normal),\n max-height var(--hds-micro-animation-duration-normal) var(--hds-micro-animation-easing-normal),\n transform var(--hds-micro-animation-duration-normal) var(--hds-micro-animation-easing-normal);\n -moz-osx-font-smoothing: grayscale;\n -webkit-font-smoothing: antialiased;\n background-image:\n linear-gradient(45deg, transparent 74%, var(--hds-ui-colors-light-grey-fill) 0%),\n linear-gradient(135deg, var(--hds-ui-colors-light-grey-fill) 26%, transparent 26%),\n / Draw the arrow /\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 72%,\n var(--hds-ui-colors-light-grey-fill) 73%,\n var(--hds-ui-colors-light-grey-fill) 100%\n ),\n linear-gradient(\n 45deg,\n var(--hds-ui-colors-light-grey-fill) 0,\n var(--hds-ui-colors-light-grey-fill) 28%,\n var(--hds-ui-colors-dark-grey) 29%,\n var(--hds-ui-colors-dark-grey) 37%,\n transparent 38%,\n transparent 100%\n ),\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 62%,\n var(--hds-ui-colors-dark-grey) 63%,\n var(--hds-ui-colors-dark-grey) 71%,\n var(--hds-ui-colors-light-grey-fill) 72%,\n var(--hds-ui-colors-light-grey-fill) 100%\n );\n background-size: var(--hds-spacing-small-4) var(--hds-spacing-small-4);\n background-position: calc(100% - var(--hds-spacing-small-4)) 45%;\n background-repeat: no-repeat;\n\n / Clearfix /\n &::after {\n display: table;\n content: \" \";\n clear: both;\n }\n\n &.hds-dropdown--error {\n position: relative;\n border-bottom: var(--hds-stroke-thick) solid var(--hds-ui-colors-warning-yellow);\n margin-bottom: calc(var(--hds-stroke-thick) - var(--hds-stroke-default));\n }\n}\n\nselect.hds-dropdown--default {\n background-color: var(--hds-ui-colors-light-grey-fill);\n}\n\nselect.hds-dropdown--lined {\n background-color: transparent;\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n padding-left: 0;\n padding-top: var(--hds-spacing-small-1);\n padding-bottom: var(--hds-spacing-small-3);\n border-radius: 0;\n\n &:focus {\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-grey);\n }\n\n &[disabled],\n &:disabled,\n &[disabled=\"disabled\"] {\n background-color: transparent;\n padding: var(--hds-spacing-small-4);\n }\n}\n\nselect.hds-dropdown--white {\n background-color: var(--hds-ui-colors-white);\n\n / Place the arrow, created below /\n\n / background-position: calc(100% - var(--hwc-spacing-small-4)) 45%; /\n}\n\nselect.hds-dropdown--lined,\nselect.hds-dropdown--white {\n background-image:\n / Cut off the sharp ends of the arrow /\n linear-gradient(45deg, transparent 74%, var(--hds-ui-colors-white) 0%),\n linear-gradient(135deg, var(--hds-ui-colors-white) 26%, transparent 26%),\n / Draw the arrow /\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 72%,\n var(--hds-ui-colors-white) 73%,\n var(--hds-ui-colors-white) 100%\n ),\n linear-gradient(\n 45deg,\n var(--hds-ui-colors-white) 0,\n var(--hds-ui-colors-white) 28%,\n var(--hds-ui-colors-dark-grey) 29%,\n var(--hds-ui-colors-dark-grey) 37%,\n transparent 38%,\n transparent 100%\n ),\n linear-gradient(\n 135deg,\n transparent 0,\n transparent 62%,\n var(--hds-ui-colors-dark-grey) 63%,\n var(--hds-ui-colors-dark-grey) 71%,\n var(--hds-ui-colors-white) 72%,\n var(--hds-ui-colors-white) 100%\n );\n background-size: var(--hds-spacing-small-4) var(--hds-spacing-small-4);\n background-repeat: no-repeat;\n}\n\n.hds-dropdown--error {\n .hds-dropdown-message {\n font: var(--hds-typography-caption-title);\n color: var(--hds-ui-colors-dark-grey);\n padding: var(--hds-spacing-small-1) 0 0 var(--hds-spacing-small-4);\n }\n}\n",".hds-modal {\n / Reset /\n border: none;\n\n &::backdrop {\n / Need to hardcode values in css for now.\n https://stackoverflow.com/questions/58818299/css-variables-not-working-in-dialogbackdrop\n /\n background-color: rgba(0 0 0 / 40%);\n animation: hds-modal-fade-in 0.3s cubic-bezier(0.45, 0.1, 0.65, 1); / --hds-micro-animation-duration-normal /\n }\n\n &[open] {\n animation: hds-modal-fade-in var(--hds-micro-animation-duration-normal)\n var(--hds-micro-animation-easing-in);\n }\n\n /\n Size\n /\n min-width: 100%;\n max-width: 100%;\n border-radius: 0;\n\n @media (width >= 720px) {\n min-width: 720px;\n max-width: min(720px, calc(100% - 6px - 2em));\n\n / NOTE: Re-adding border radius.\n * We actually get the border radius from .hds-box,\n * but since we are resetting border radius above for small screens\n * we need to re-add it here for larger screens.\n /\n border-radius: var(--hds-border-radius);\n }\n\n / Reset margin /\n & .hds-modal__header {\n margin: 0;\n }\n\n / stylelint-disable-next-line no-duplicate-selectors -- It's ok /\n & .hds-modal__header {\n font: var(--hds-typography-body-title);\n\n / Offset the close button, so text is not overlapping or right next to the button /\n padding-right: 16px;\n }\n}\n\n@keyframes hds-modal-fade-in {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n",".hds-breadcrumbs {\n --hds-breadcrumb-image-left: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"> <path d=\"M11.0404 13.9322L11.3917 13.5887C11.462 13.4983 11.462 13.3537 11.3917 13.2814L8.21212 9.99096L11.3917 6.71864C11.462 6.64633 11.462 6.50169 11.3917 6.4113L11.0404 6.0678C10.9526 5.9774 10.8296 5.9774 10.7418 6.0678L7.0527 9.84633C6.98243 9.93672 6.98243 10.0633 7.0527 10.1537L10.7418 13.9322C10.8296 14.0226 10.9526 14.0226 11.0404 13.9322Z\" fill=\"black\"/></svg>');\n --hds-breadcrumb-image-right: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"><path d=\"M7.9596 6.0678L7.60826 6.4113C7.53799 6.50169 7.53799 6.64633 7.60826 6.71864L10.7879 10.009L7.60826 13.2814C7.53799 13.3537 7.53799 13.4983 7.60826 13.5887L7.9596 13.9322C8.04743 14.0226 8.1704 14.0226 8.25823 13.9322L11.9473 10.1537C12.0176 10.0633 12.0176 9.93672 11.9473 9.84633L8.25823 6.0678C8.1704 5.9774 8.04743 5.9774 7.9596 6.0678Z\" fill=\"%236E6E6E\"/></svg>');\n\n padding: 0;\n list-style-type: none;\n display: flex;\n\n /\n * Ensure the caption typography is used\n * Override general styling for links that sets the font-size\n /\n &,\n & a {\n font: var(--hds-typography-caption);\n }\n\n & li {\n /\n * Design in Figma has an extra 2px distance between\n * the text and underline border on links\n * making the total height 21px\n /\n .hds-link {\n padding-bottom: 2px;\n }\n\n &:first-child {\n &::before {\n display: none;\n }\n }\n\n &:last-child {\n color: var(--hds-ui-colors-dark-grey);\n }\n\n &::before {\n display: inline-block;\n background-image: var(--hds-breadcrumb-image-right);\n width: 20px;\n height: 20px;\n margin: 0 var(--hds-spacing-small-1);\n }\n\n @media (width < 720px) {\n &:not(:only-child) {\n display: none;\n }\n\n &:nth-last-of-type(2) {\n display: inherit;\n\n &::before {\n display: inline-block;\n margin-left: 0;\n background-image: var(--hds-breadcrumb-image-left);\n }\n }\n }\n }\n}\n",".hds-tabs {\n --hds-tabs-border-active-size: var(--hds-stroke-thick);\n\n font: var(--hds-typography-body);\n\n .hds-tabs--list {\n padding-left: 0;\n display: inline-flex;\n width: auto;\n\n &.hds-tabs--list-horizontal {\n color: red;\n @media (width >= 720px) {\n border-bottom: var(--hds-stroke-default) solid var(--hds-ui-colors-light-grey-fill);\n flex-direction: row;\n\n .hds-tabs--tab {\n padding: var(--hds-spacing-small-3) 0;\n border-bottom: var(--hds-tabs-border-active-size) solid transparent;\n\n &.hds-tabs--tab-active {\n border-bottom-color: var(--hds-brand-colors-signature);\n }\n\n &:not(:last-child) {\n margin-right: var(--hds-spacing-medium-3);\n }\n }\n }\n @media (width < 720px) {\n border-left: 1px solid var(--hds-ui-colors-light-grey-fill);\n flex-direction: column;\n padding-left: 1px;\n\n .hds-tabs--tab {\n width: auto;\n padding: var(--hds-spacing-small-2) var(--hds-spacing-small-3);\n\n &.hds-tabs--tab-active {\n margin-left: calc(var(--hds-tabs-border-active-size) -1);\n border-left: var(--hds-tabs-border-active-size) solid var(--hds-brand-colors-signature);\n }\n }\n }\n }\n\n &.hds-tabs--list-vertical {\n border-left: 1px solid var(--hds-ui-colors-light-grey-fill);\n flex-direction: column;\n padding-left: 1px;\n\n .hds-tabs--tab {\n width: auto;\n padding: var(--hds-spacing-small-2) var(--hds-spacing-small-3);\n\n &.hds-tabs--tab-active {\n margin-left: calc(var(--hds-tabs-border-active-size) * -1);\n border-left: var(--hds-tabs-border-active-size) solid var(--hds-brand-colors-signature);\n }\n }\n }\n\n .hds-tabs--tab {\n cursor: pointer;\n font: var(--hds-typography-body);\n background: transparent;\n border: 0 none;\n text-align: left;\n\n &:hover {\n color: var(--hds-brand-colors-dark);\n }\n\n &.hds-tabs--tab-active {\n color: var(--hds-brand-colors-dark);\n }\n }\n }\n\n .hds-tabs--contents {\n margin-top: var(--hds-spacing-large-2);\n }\n}\n"],"names":[]}

package/dist/scoped.css CHANGED Viewed

	@@ -1 +1 @@
1	- .kp-decorator-header-and-footer :root{box-sizing:border-box;font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);cursor:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:1.4}.kp-decorator-header-and-footer body{background:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer h1{font:var(--hds-brand-typography-h1)}.kp-decorator-header-and-footer h2{font:var(--hds-brand-typography-h2)}.kp-decorator-header-and-footer h3{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer h4{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer h5{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer h6{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-button{--hds-component-button-border-width:0px;-webkit-font-smoothing:antialiased;-webkit-appearance:button;-ms-appearance:button;appearance:button;box-sizing:border-box;border-radius:var(--hds-border-radius);border-style:solid;border-width:var(--hds-component-button-border-width);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;word-break:normal;font:var(--hds-typography-body-small-title);text-decoration:none;display:inline-block}.kp-decorator-header-and-footer .hds-button.hds-button--small{--hds-component-button-small-y-padding:10px;font-size:var(--hds-font-size-technical-title-max);line-height:var(--hds-line-height-technical-title-max);padding:calc(var(--hds-component-button-small-y-padding) - var(--hds-component-button-border-width))calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));height:44px}.kp-decorator-header-and-footer .hds-button.hds-button--medium{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));height:50px}.kp-decorator-header-and-footer .hds-button.hds-button--large{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));height:58px}.kp-decorator-header-and-footer .hds-button.hds-button--full{width:100%}.kp-decorator-header-and-footer .hds-button.hds-button--mobile-full{width:100%}@media (min-width:720px){.kp-decorator-header-and-footer .hds-button.hds-button--mobile-full{width:unset}}.kp-decorator-header-and-footer .hds-button.hds-button--primary{background-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.kp-decorator-header-and-footer .hds-button.hds-button--primary:hover{background-color:var(--hds-brand-colors-signature-hover);outline:0 solid var(--hds-brand-colors-signature-hover)}.kp-decorator-header-and-footer .hds-button.hds-button--primary:active{background-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary{background-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary:hover{background-color:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary:active{background-color:var(--hds-brand-colors-darker);outline:0 solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary:hover{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary:hover{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white:hover{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only{justify-content:center;align-items:center;padding:0;display:inline-flex}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--small{width:44px;height:44px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--small {width:24px;height:24px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--medium{width:50px;height:50px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--medium {width:32px;height:32px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--large{width:58px;height:58px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--large {width:32px;height:32px}.kp-decorator-header-and-footer .hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;text-decoration:none}.kp-decorator-header-and-footer .hds-link:hover{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:hover .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:hover{color:var(--hds-brand-colors-light);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.kp-decorator-header-and-footer .hds-link.hds-link--small{font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-link.hds-link--large{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-link.hds-link--no-underline{color:var(--hds-brand-colors-dark);border-bottom:none;font-weight:500;text-decoration:none}.kp-decorator-header-and-footer .hds-link.hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.kp-decorator-header-and-footer .hds-link.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-link.hds-link--solid:hover{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.kp-decorator-header-and-footer .hds-link.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.kp-decorator-header-and-footer .hds-link:-webkit-any(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.kp-decorator-header-and-footer .hds-link:is(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.kp-decorator-header-and-footer .hds-link:-webkit-any(button):not(:-webkit-any(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-link:is(button):not(:is(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-badge{border:var(--hds-stroke-default)solid var(--hds-brand-colors-lighter);border-radius:var(--hds-border-radius);text-transform:uppercase;-moz-osx-font-smoothing:subpixel-antialiased;-webkit-font-smoothing:subpixel-antialiased;vertical-align:10%;font-size:12px;font-weight:500;line-height:1.1;display:inline-block}.kp-decorator-header-and-footer .hds-badge{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-badge.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-badge.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.kp-decorator-header-and-footer .hds-badge{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--primary{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--dark{background-color:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-badge.hds-badge--white{background-color:var(--hds-ui-colors-white);border-color:var(--hds-ui-colors-white);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--warning{background-color:var(--hds-ui-colors-warning-yellow);border-color:var(--hds-ui-colors-warning-yellow);color:var(--hds-brand-link-colors-text)}.kp-decorator-header-and-footer .hds-description-list{font:var(--hds-typography-body);margin:0;padding-left:0;list-style:none}.kp-decorator-header-and-footer .hds-description-list dt{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-description-list dd{margin-left:0;margin-bottom:var(--hds-spacing-small-3)}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dt{margin-right:var(--hds-spacing-small-1);margin-bottom:var(--hds-spacing-small-2);display:inline-block}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dt:after{content:"\a ";white-space:pre}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dd{display:inline}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dd:after{content:"\a ";white-space:pre}.kp-decorator-header-and-footer .hds-list{padding-left:var(--hds-spacing-medium-3);flex-direction:column;margin:0;display:flex}.kp-decorator-header-and-footer .hds-list li{padding-left:var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-list li::marker{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-list:is(ol){list-style:decimal}.kp-decorator-header-and-footer .hds-list:is(ul){list-style:disc}.kp-decorator-header-and-footer .hds-list.hds-list--no-bullets{padding-left:0;list-style:none}.kp-decorator-header-and-footer .hds-list.hds-list--no-bullets li{padding-left:0}.kp-decorator-header-and-footer .hds-list.hds-list--small{font:var(--hds-typography-body-small);gap:var(--hds-spacing-small-1)}.kp-decorator-header-and-footer .hds-list{gap:var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-list.hds-list--medium{gap:var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-list.hds-list--large{font:var(--hds-typography-header-h3);gap:var(--hds-spacing-small-3)}.kp-decorator-header-and-footer .hds-typography-h2-display{font:var(--hds-brand-typography-h1-display)}.kp-decorator-header-and-footer .hds-typography-h1{font:var(--hds-brand-typography-h1)}.kp-decorator-header-and-footer .hds-typography-h1.hds-typography-h1--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-h2{font:var(--hds-brand-typography-h2)}.kp-decorator-header-and-footer .hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-h1~.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.kp-decorator-header-and-footer .hds-typography-h3{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-typography-h3.hds-typography-h3--title{font:var(--hds-typography-header-h3-title)}.kp-decorator-header-and-footer .hds-typography-h3.hds-typography-h3--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-body{font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-typography-body.hds-typography-body--title{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-typography-body.hds-typography-body--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-body-small{font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-typography-body-small.hds-typography-body-small--title{font:var(--hds-typography-body-small-title)}.kp-decorator-header-and-footer .hds-typography-body-small.hds-typography-body-small--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-caption{font:var(--hds-typography-caption)}.kp-decorator-header-and-footer .hds-typography-caption.hds-typography-caption--title{font:var(--hds-typography-caption-title)}.kp-decorator-header-and-footer .hds-typography-caption.hds-typography-caption--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-technical{font:var(--hds-typography-technical)}.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--title{font:var(--hds-typography-technical-title)}.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-1)}@media (min-width:940px){.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-2)}}.kp-decorator-header-and-footer .hds-box{border-radius:var(--hds-border-radius);--hds-component-box-padding:var(--hds-spacing-medium-2);padding:var(--hds-component-box-padding);position:relative}.kp-decorator-header-and-footer .hds-box{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-box--light-grey{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-box--lighter{background-color:var(--hds-brand-colors-lighter)}.kp-decorator-header-and-footer .hds-box.hds-box--white{background-color:var(--hds-ui-colors-white);box-shadow:var(--hds-shadow-default)}.kp-decorator-header-and-footer .hds-box.hds-box--warning{background-color:var(--hds-ui-colors-warning-yellow)}@media (min-width:720px){.kp-decorator-header-and-footer .hds-box{--hds-component-box-padding:var(--hds-spacing-medium-3)}}.kp-decorator-header-and-footer .hds-box.hds-box--closed{display:none}.kp-decorator-header-and-footer .hds-box .hds-box__close-button{top:var(--hds-spacing-small-4);right:var(--hds-spacing-small-4);cursor:pointer;transition:filter var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);background:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>");border:none;width:24px;height:24px;padding:0;position:absolute}.kp-decorator-header-and-footer .hds-box .hds-box__close-button:hover{filter:invert(40%)}.kp-decorator-header-and-footer .hds-box .hds-box__close-button:active{box-shadow:0 0 0 2px var(--hds-ui-colors-black-hover);outline:none}.kp-decorator-header-and-footer .hds-box.hds-message{--hds-component-message-icon-width:var(--hds-spacing-medium-3);--hds-component-message-spacing-between:var(--hds-spacing-small-4);--hds-component-message-padding:var(--hds-component-box-padding);padding-left:calc(var(--hds-component-message-padding) + var(--hds-component-message-icon-width) + var(--hds-component-message-spacing-between))}@media (min-width:720px){.kp-decorator-header-and-footer .hds-box.hds-message{--hds-component-message-spacing-between:var(--hds-spacing-medium-2)}}.kp-decorator-header-and-footer .hds-box.hds-message:before{content:"";top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);height:var(--hds-component-message-icon-width);position:absolute}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--success{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--success:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--attention{background-color:var(--hds-ui-colors-warning-yellow-light-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--attention:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--warning{background-color:var(--hds-ui-colors-warning-yellow)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--warning:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--neutral{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--neutral .hds-message--neutral__icon{top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);position:absolute}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title{margin:0}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__description{margin:0}.kp-decorator-header-and-footer .hds-box.hds-message :is(.hds-message__title,.hds-message__description):first-of-type{margin-top:2px}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-3)}@media (min-width:940px){.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-4)}}.kp-decorator-header-and-footer .hds-input{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.kp-decorator-header-and-footer .hds-input.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--lined.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--lined.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--default .hds-input__input{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-input.hds-input--white .hds-input__input{background-color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-input.hds-input--lined .hds-input__input{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey);padding-left:0;padding-top:var(--hds-spacing-small-1);padding-bottom:var(--hds-spacing-small-3);background:0 0;border-radius:0}.kp-decorator-header-and-footer .hds-input:focus-within .hds-input__label{color:var(--hds-brand-colors-darker)}.kp-decorator-header-and-footer .hds-input .hds-input__label{transition:color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption);order:1}.kp-decorator-header-and-footer .hds-input .hds-input__input{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border margin var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);box-sizing:border-box;order:2;width:100%;line-height:normal;position:relative}.kp-decorator-header-and-footer .hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.kp-decorator-header-and-footer .hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker);outline:0}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:disabled{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:read-only{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:read-only:focus{border-bottom-color:var(--hds-brand-colors-darker)}.kp-decorator-header-and-footer .hds-input .hds-input__error-message{font:var(--hds-typography-caption-title);color:var(--hds-ui-colors-dark-grey);padding:var(--hds-spacing-small-1)0 0 var(--hds-spacing-small-4);order:3}.kp-decorator-header-and-footer .hds-accordion{--hds-accordion-icon-dimension:24px;--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-small-4);--hds-component-accordion-content-spacing:var(--hds-spacing-medium-3);border:none;border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);display:block}@media (min-width:720px){.kp-decorator-header-and-footer .hds-accordion{--hds-component-accordion-content-spacing:var(--hds-spacing-large-1);--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-medium-2)}}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item{overflow:hidden}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item.hds-accordion-item__expanded .hds-accordion-item-trigger{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item:first-child .hds-accordion-item-trigger{border:0}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger{cursor:pointer;grid-gap:var(--hds-spacing-small-4);padding:var(--hds-component-accordion-trigger-spacing-between)0;border:0;border-top:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);text-align:left;font:var(--hds-typography-body);background-color:transparent;grid-template-columns:24px auto;width:100%;display:grid}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger:hover{color:var(--hds-brand-colors-dark);outline:0}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon{color:var(--hds-brand-colors-dark);width:var(--hds-accordion-icon-dimension);height:var(--hds-accordion-icon-dimension);transition:all 50ms;display:inline-block}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon .hds-accordion-item-trigger--icon-chevron{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon .hds-accordion-item-trigger--icon-chevron-down{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon svg{vertical-align:baseline}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger.hds-accordion-item-trigger--open .hds-accordion-item-trigger--icon svg{transform:rotate(180deg)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-content{padding:0 0 var(--hds-component-accordion-content-spacing)var(--hds-spacing-medium-4);font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-content.hds-accordion-item-content--closed{display:none}.kp-decorator-header-and-footer label.hds-dropdown__label{transition:color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption);color:var(--hds-ui-colors-black);text-align:left;margin-bottom:0;display:block}.kp-decorator-header-and-footer select.hds-dropdown{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);font:var(--hds-typography-body-small);cursor:pointer;color:var(--hds-ui-colors-black);-webkit-appearance:none;-ms-appearance:none;appearance:none;padding:var(--hds-spacing-small-4);transition:border-color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal),max-height var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal),transform var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;background-image:linear-gradient(45deg,transparent 74%,var(--hds-ui-colors-light-grey-fill)0%),linear-gradient(135deg,var(--hds-ui-colors-light-grey-fill)26%,transparent 26%),linear-gradient(135deg,transparent 0,transparent 72%,var(--hds-ui-colors-light-grey-fill)73%,var(--hds-ui-colors-light-grey-fill)100%),linear-gradient(45deg,var(--hds-ui-colors-light-grey-fill)0,var(--hds-ui-colors-light-grey-fill)28%,var(--hds-ui-colors-dark-grey)29%,var(--hds-ui-colors-dark-grey)37%,transparent 38%,transparent 100%),linear-gradient(135deg,transparent 0,transparent 62%,var(--hds-ui-colors-dark-grey)63%,var(--hds-ui-colors-dark-grey)71%,var(--hds-ui-colors-light-grey-fill)72%,var(--hds-ui-colors-light-grey-fill)100%);background-size:var(--hds-spacing-small-4)var(--hds-spacing-small-4);background-position:calc(100% - var(--hds-spacing-small-4))45%;background-repeat:no-repeat;width:100%;height:58px;display:flex;position:relative}.kp-decorator-header-and-footer select.hds-dropdown:after{content:" ";clear:both;display:table}.kp-decorator-header-and-footer select.hds-dropdown.hds-dropdown--error{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer select.hds-dropdown--default{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer select.hds-dropdown--lined{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey);padding-left:0;padding-top:var(--hds-spacing-small-1);padding-bottom:var(--hds-spacing-small-3);background-color:transparent;border-radius:0}.kp-decorator-header-and-footer select.hds-dropdown--lined:focus{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer select.hds-dropdown--lined[disabled]{padding:var(--hds-spacing-small-4);background-color:transparent}.kp-decorator-header-and-footer select.hds-dropdown--lined:disabled{padding:var(--hds-spacing-small-4);background-color:transparent}.kp-decorator-header-and-footer select.hds-dropdown--lined[disabled=disabled]{padding:var(--hds-spacing-small-4);background-color:transparent}.kp-decorator-header-and-footer select.hds-dropdown--white{background-color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer select.hds-dropdown--lined{background-image:linear-gradient(45deg,transparent 74%,var(--hds-ui-colors-white)0%),linear-gradient(135deg,var(--hds-ui-colors-white)26%,transparent 26%),linear-gradient(135deg,transparent 0,transparent 72%,var(--hds-ui-colors-white)73%,var(--hds-ui-colors-white)100%),linear-gradient(45deg,var(--hds-ui-colors-white)0,var(--hds-ui-colors-white)28%,var(--hds-ui-colors-dark-grey)29%,var(--hds-ui-colors-dark-grey)37%,transparent 38%,transparent 100%),linear-gradient(135deg,transparent 0,transparent 62%,var(--hds-ui-colors-dark-grey)63%,var(--hds-ui-colors-dark-grey)71%,var(--hds-ui-colors-white)72%,var(--hds-ui-colors-white)100%);background-size:var(--hds-spacing-small-4)var(--hds-spacing-small-4);background-repeat:no-repeat}.kp-decorator-header-and-footer select.hds-dropdown--white{background-image:linear-gradient(45deg,transparent 74%,var(--hds-ui-colors-white)0%),linear-gradient(135deg,var(--hds-ui-colors-white)26%,transparent 26%),linear-gradient(135deg,transparent 0,transparent 72%,var(--hds-ui-colors-white)73%,var(--hds-ui-colors-white)100%),linear-gradient(45deg,var(--hds-ui-colors-white)0,var(--hds-ui-colors-white)28%,var(--hds-ui-colors-dark-grey)29%,var(--hds-ui-colors-dark-grey)37%,transparent 38%,transparent 100%),linear-gradient(135deg,transparent 0,transparent 62%,var(--hds-ui-colors-dark-grey)63%,var(--hds-ui-colors-dark-grey)71%,var(--hds-ui-colors-white)72%,var(--hds-ui-colors-white)100%);background-size:var(--hds-spacing-small-4)var(--hds-spacing-small-4);background-repeat:no-repeat}.kp-decorator-header-and-footer .hds-dropdown--error .hds-dropdown-message{font:var(--hds-typography-caption-title);color:var(--hds-ui-colors-dark-grey);padding:var(--hds-spacing-small-1)0 0 var(--hds-spacing-small-4)}.kp-decorator-header-and-footer .hds-modal{border:none;border-radius:0;min-width:100%;max-width:100%}.kp-decorator-header-and-footer .hds-modal::-webkit-backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal::-ms-backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal::-ms-backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal::backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal[open]{-webkit-animation:hds-modal-fade-in var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-in);animation:hds-modal-fade-in var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-in)}@media (min-width:720px){.kp-decorator-header-and-footer .hds-modal{border-radius:var(--hds-border-radius);min-width:720px;max-width:min(720px,100% - 6px - 2em)}}.kp-decorator-header-and-footer .hds-modal .hds-modal__header{margin:0}.kp-decorator-header-and-footer .hds-modal .hds-modal__header{font:var(--hds-typography-body-title);padding-right:16px}.kp-decorator-header-and-footer .hds-breadcrumbs{--hds-breadcrumb-image-left:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"> <path d=\"M11.0404 13.9322L11.3917 13.5887C11.462 13.4983 11.462 13.3537 11.3917 13.2814L8.21212 9.99096L11.3917 6.71864C11.462 6.64633 11.462 6.50169 11.3917 6.4113L11.0404 6.0678C10.9526 5.9774 10.8296 5.9774 10.7418 6.0678L7.0527 9.84633C6.98243 9.93672 6.98243 10.0633 7.0527 10.1537L10.7418 13.9322C10.8296 14.0226 10.9526 14.0226 11.0404 13.9322Z\" fill=\"black\"/></svg>");--hds-breadcrumb-image-right:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"><path d=\"M7.9596 6.0678L7.60826 6.4113C7.53799 6.50169 7.53799 6.64633 7.60826 6.71864L10.7879 10.009L7.60826 13.2814C7.53799 13.3537 7.53799 13.4983 7.60826 13.5887L7.9596 13.9322C8.04743 14.0226 8.1704 14.0226 8.25823 13.9322L11.9473 10.1537C12.0176 10.0633 12.0176 9.93672 11.9473 9.84633L8.25823 6.0678C8.1704 5.9774 8.04743 5.9774 7.9596 6.0678Z\" fill=\"%236E6E6E\"/></svg>");padding:0;list-style-type:none;display:flex}.kp-decorator-header-and-footer .hds-breadcrumbs{font:var(--hds-typography-caption)}.kp-decorator-header-and-footer .hds-breadcrumbs a{font:var(--hds-typography-caption)}.kp-decorator-header-and-footer .hds-breadcrumbs li .hds-link{padding-bottom:2px}.kp-decorator-header-and-footer .hds-breadcrumbs li:first-child:before{display:none}.kp-decorator-header-and-footer .hds-breadcrumbs li:last-child{color:var(--hds-ui-colors-dark-grey)}.kp-decorator-header-and-footer .hds-breadcrumbs li:before{background-image:var(--hds-breadcrumb-image-right);margin:0 var(--hds-spacing-small-1);width:20px;height:20px;display:inline-block}@media (max-width:719.999px){.kp-decorator-header-and-footer .hds-breadcrumbs li:not(:only-child){display:none}.kp-decorator-header-and-footer .hds-breadcrumbs li:nth-last-of-type(2){display:inherit}.kp-decorator-header-and-footer .hds-breadcrumbs li:nth-last-of-type(2):before{background-image:var(--hds-breadcrumb-image-left);margin-left:0;display:inline-block}}.kp-decorator-header-and-footer .hds-tabs{--hds-tabs-border-active-size:var(--hds-stroke-thick);font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list{width:auto;padding-left:0;display:inline-flex}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{color:red}@media (min-width:720px){.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-light-grey-fill);flex-direction:row}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab{padding:var(--hds-spacing-small-3)0;border-bottom:var(--hds-tabs-border-active-size)solid transparent}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab.hds-tabs--tab-active{border-bottom-color:var(--hds-brand-colors-signature)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab:not(:last-child){margin-right:var(--hds-spacing-medium-3)}}@media (max-width:719.999px){.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{border-left:1px solid var(--hds-ui-colors-light-grey-fill);flex-direction:column;padding-left:1px}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab{padding:var(--hds-spacing-small-2)var(--hds-spacing-small-3);width:auto}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab.hds-tabs--tab-active{margin-left:calc(var(--hds-tabs-border-active-size)-1);border-left:var(--hds-tabs-border-active-size)solid var(--hds-brand-colors-signature)}}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-vertical{border-left:1px solid var(--hds-ui-colors-light-grey-fill);flex-direction:column;padding-left:1px}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-vertical .hds-tabs--tab{padding:var(--hds-spacing-small-2)var(--hds-spacing-small-3);width:auto}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-vertical .hds-tabs--tab.hds-tabs--tab-active{margin-left:calc(var(--hds-tabs-border-active-size)*-1);border-left:var(--hds-tabs-border-active-size)solid var(--hds-brand-colors-signature)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list .hds-tabs--tab{cursor:pointer;font:var(--hds-typography-body);text-align:left;background:0 0;border:0}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list .hds-tabs--tab:hover{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list .hds-tabs--tab.hds-tabs--tab-active{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--contents{margin-top:var(--hds-spacing-large-2)}@keyframes hds-modal-fade-in{0%{opacity:0}to{opacity:1}}
1	+ .kp-decorator-header-and-footer :root{box-sizing:border-box;font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);cursor:auto;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;line-height:1.4}.kp-decorator-header-and-footer body{background:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer h1{font:var(--hds-brand-typography-h1)}.kp-decorator-header-and-footer h2{font:var(--hds-brand-typography-h2)}.kp-decorator-header-and-footer h3{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer h4{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer h5{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer h6{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-button{--hds-component-button-border-width:0px;-webkit-font-smoothing:antialiased;-webkit-appearance:button;-ms-appearance:button;appearance:button;box-sizing:border-box;border-radius:var(--hds-border-radius);border-style:solid;border-width:var(--hds-component-button-border-width);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;word-break:normal;font:var(--hds-typography-body-small-title);text-align:center;text-decoration:none;display:inline-block}.kp-decorator-header-and-footer .hds-button.hds-button--small{--hds-component-button-small-y-padding:10px;font-size:var(--hds-font-size-technical-title-max);line-height:var(--hds-line-height-technical-title-max);padding:calc(var(--hds-component-button-small-y-padding) - var(--hds-component-button-border-width))calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width));height:44px}.kp-decorator-header-and-footer .hds-button.hds-button--medium{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-3) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-1) - var(--hds-component-button-border-width));height:50px}.kp-decorator-header-and-footer .hds-button.hds-button--large{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max);padding:calc(var(--hds-spacing-small-4) - var(--hds-component-button-border-width))calc(var(--hds-spacing-medium-2) - var(--hds-component-button-border-width));height:58px}.kp-decorator-header-and-footer .hds-button.hds-button--full{width:100%}.kp-decorator-header-and-footer .hds-button.hds-button--mobile-full{width:100%}@media (min-width:720px){.kp-decorator-header-and-footer .hds-button.hds-button--mobile-full{width:unset}}.kp-decorator-header-and-footer .hds-button.hds-button--primary{background-color:var(--hds-brand-colors-signature);color:var(--hds-brand-button-colors-text);fill:var(--hds-brand-button-colors-text)}.kp-decorator-header-and-footer .hds-button.hds-button--primary:hover{background-color:var(--hds-brand-colors-signature-hover);outline:0 solid var(--hds-brand-colors-signature-hover)}.kp-decorator-header-and-footer .hds-button.hds-button--primary:active{background-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary{background-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary:hover{background-color:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--secondary:active{background-color:var(--hds-brand-colors-darker);outline:0 solid var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-signature);color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary:hover{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-primary:active{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark);border-color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-darker);color:var(--hds-brand-colors-darker);fill:var(--hds-brand-colors-darker);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary:hover{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-secondary:active{color:var(--hds-ui-colors-black);fill:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white{--hds-component-button-border-width:var(--hds-stroke-thick);border-color:var(--hds-brand-colors-light);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white);outline-offset:3px;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white:hover{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.kp-decorator-header-and-footer .hds-button.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button:disabled.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled].hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--primary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--secondary{color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border-color:var(--hds-ui-colors-grey);box-shadow:none;cursor:default;outline:0}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--outline-primary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button[disabled]:active.hds-button--outline-secondary{border-color:var(--hds-ui-colors-grey);color:var(--hds-ui-colors-dark-grey);fill:var(--hds-ui-colors-dark-grey);cursor:default;background-color:transparent}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only{justify-content:center;align-items:center;padding:0;display:inline-flex}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--small{width:44px;height:44px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--small {width:24px;height:24px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--medium{width:50px;height:50px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--medium {width:32px;height:32px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--large{width:58px;height:58px}.kp-decorator-header-and-footer .hds-button.hds-button--icon-only.hds-button--large {width:32px;height:32px}.kp-decorator-header-and-footer .hds-link{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-link-colors-underline);fill:var(--hds-brand-link-colors-text);color:var(--hds-brand-link-colors-text);transition:all var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);cursor:pointer;text-decoration:none}.kp-decorator-header-and-footer .hds-link:hover{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:hover .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:active{color:var(--hds-brand-link-colors-hover);fill:var(--hds-brand-link-colors-hover);border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.kp-decorator-header-and-footer .hds-link.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:hover{color:var(--hds-brand-colors-light);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.kp-decorator-header-and-footer .hds-link.hds-link--inverted:disabled{color:var(--hds-ui-colors-dark-grey);fill:currentColor;cursor:default;border-color:currentColor;box-shadow:none!important;outline:0!important}.kp-decorator-header-and-footer .hds-link.hds-link--small{font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-link.hds-link--large{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-link.hds-link--no-underline{color:var(--hds-brand-colors-dark);border-bottom:none;font-weight:500;text-decoration:none}.kp-decorator-header-and-footer .hds-link.hds-link--no-underline:hover{color:var(--hds-brand-colors-dark);text-decoration:underline;-webkit-text-decoration-color:var(--hds-brand-colors-dark);-webkit-text-decoration-color:var(--hds-brand-colors-dark);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.kp-decorator-header-and-footer .hds-link.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.kp-decorator-header-and-footer .hds-link.hds-link--solid:hover{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.kp-decorator-header-and-footer .hds-link.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.kp-decorator-header-and-footer .hds-link:-webkit-any(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.kp-decorator-header-and-footer .hds-link:is(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.kp-decorator-header-and-footer .hds-link:-webkit-any(button):not(:-webkit-any(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-link:is(button):not(:is(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-badge{border:var(--hds-stroke-default)solid var(--hds-brand-colors-lighter);border-radius:var(--hds-border-radius);text-transform:uppercase;-moz-osx-font-smoothing:subpixel-antialiased;-webkit-font-smoothing:subpixel-antialiased;vertical-align:10%;font-size:12px;font-weight:500;line-height:1.1;display:inline-block}.kp-decorator-header-and-footer .hds-badge{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-badge.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-badge.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.kp-decorator-header-and-footer .hds-badge{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--primary{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--dark{background-color:var(--hds-brand-colors-darker);border-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-badge.hds-badge--white{background-color:var(--hds-ui-colors-white);border-color:var(--hds-ui-colors-white);color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-badge.hds-badge--warning{background-color:var(--hds-ui-colors-warning-yellow);border-color:var(--hds-ui-colors-warning-yellow);color:var(--hds-brand-link-colors-text)}.kp-decorator-header-and-footer .hds-description-list{font:var(--hds-typography-body);margin:0;padding-left:0;list-style:none}.kp-decorator-header-and-footer .hds-description-list dt{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-description-list dd{margin-left:0;margin-bottom:var(--hds-spacing-small-3)}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dt{margin-right:var(--hds-spacing-small-1);margin-bottom:var(--hds-spacing-small-2);display:inline-block}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dt:after{content:"\a ";white-space:pre}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dd{display:inline}.kp-decorator-header-and-footer .hds-description-list.hds-description-list--horizontal dd:after{content:"\a ";white-space:pre}.kp-decorator-header-and-footer .hds-list{padding-left:var(--hds-spacing-medium-3);flex-direction:column;margin:0;display:flex}.kp-decorator-header-and-footer .hds-list li{padding-left:var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-list li::marker{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-list:is(ol){list-style:decimal}.kp-decorator-header-and-footer .hds-list:is(ul){list-style:disc}.kp-decorator-header-and-footer .hds-list.hds-list--no-bullets{padding-left:0;list-style:none}.kp-decorator-header-and-footer .hds-list.hds-list--no-bullets li{padding-left:0}.kp-decorator-header-and-footer .hds-list.hds-list--small{font:var(--hds-typography-body-small);gap:var(--hds-spacing-small-1)}.kp-decorator-header-and-footer .hds-list{gap:var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-list.hds-list--medium{gap:var(--hds-spacing-small-2)}.kp-decorator-header-and-footer .hds-list.hds-list--large{font:var(--hds-typography-header-h3);gap:var(--hds-spacing-small-3)}.kp-decorator-header-and-footer .hds-typography-h2-display{font:var(--hds-brand-typography-h1-display)}.kp-decorator-header-and-footer .hds-typography-h1{font:var(--hds-brand-typography-h1)}.kp-decorator-header-and-footer .hds-typography-h1.hds-typography-h1--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-h2{font:var(--hds-brand-typography-h2)}.kp-decorator-header-and-footer .hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-h1~.hds-typography-h2.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.kp-decorator-header-and-footer .hds-typography-h3{font:var(--hds-typography-header-h3)}.kp-decorator-header-and-footer .hds-typography-h3.hds-typography-h3--title{font:var(--hds-typography-header-h3-title)}.kp-decorator-header-and-footer .hds-typography-h3.hds-typography-h3--spacing{margin-top:var(--hds-spacing-large-2)}.kp-decorator-header-and-footer .hds-typography-body{font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-typography-body.hds-typography-body--title{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-typography-body.hds-typography-body--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-body-small{font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-typography-body-small.hds-typography-body-small--title{font:var(--hds-typography-body-small-title)}.kp-decorator-header-and-footer .hds-typography-body-small.hds-typography-body-small--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-caption{font:var(--hds-typography-caption)}.kp-decorator-header-and-footer .hds-typography-caption.hds-typography-caption--title{font:var(--hds-typography-caption-title)}.kp-decorator-header-and-footer .hds-typography-caption.hds-typography-caption--spacing{margin-top:var(--hds-spacing-medium-2)}.kp-decorator-header-and-footer .hds-typography-technical{font:var(--hds-typography-technical)}.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--title{font:var(--hds-typography-technical-title)}.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-1)}@media (min-width:940px){.kp-decorator-header-and-footer .hds-typography-technical.hds-typography-technical--spacing{margin-top:var(--hds-spacing-small-2)}}.kp-decorator-header-and-footer .hds-box{border-radius:var(--hds-border-radius);--hds-component-box-padding:var(--hds-spacing-medium-2);padding:var(--hds-component-box-padding);position:relative}.kp-decorator-header-and-footer .hds-box{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-box--light-grey{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-box--lighter{background-color:var(--hds-brand-colors-lighter)}.kp-decorator-header-and-footer .hds-box.hds-box--white{background-color:var(--hds-ui-colors-white);box-shadow:var(--hds-shadow-default)}.kp-decorator-header-and-footer .hds-box.hds-box--warning{background-color:var(--hds-ui-colors-warning-yellow)}@media (min-width:720px){.kp-decorator-header-and-footer .hds-box{--hds-component-box-padding:var(--hds-spacing-medium-3)}}.kp-decorator-header-and-footer .hds-box.hds-box--closed{display:none}.kp-decorator-header-and-footer .hds-box .hds-box__close-button{top:var(--hds-spacing-small-4);right:var(--hds-spacing-small-4);cursor:pointer;transition:filter var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);background:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M13.1602 12.25L16.7812 8.66406L17.5195 7.92578C17.625 7.82031 17.625 7.64453 17.5195 7.50391L16.7461 6.73047C16.6055 6.625 16.4297 6.625 16.3242 6.73047L12 11.0898L7.64062 6.73047C7.53516 6.625 7.35938 6.625 7.21875 6.73047L6.44531 7.50391C6.33984 7.64453 6.33984 7.82031 6.44531 7.92578L10.8047 12.25L6.44531 16.6094C6.33984 16.7148 6.33984 16.8906 6.44531 17.0312L7.21875 17.8047C7.35938 17.9102 7.53516 17.9102 7.64062 17.8047L12 13.4453L15.5859 17.0664L16.3242 17.8047C16.4297 17.9102 16.6055 17.9102 16.7461 17.8047L17.5195 17.0312C17.625 16.8906 17.625 16.7148 17.5195 16.6094L13.1602 12.25Z\" fill=\"black\"/></svg>");border:none;width:24px;height:24px;padding:0;position:absolute}.kp-decorator-header-and-footer .hds-box .hds-box__close-button:hover{filter:invert(40%)}.kp-decorator-header-and-footer .hds-box .hds-box__close-button:active{box-shadow:0 0 0 2px var(--hds-ui-colors-black-hover);outline:none}.kp-decorator-header-and-footer .hds-box.hds-message{--hds-component-message-icon-width:var(--hds-spacing-medium-3);--hds-component-message-spacing-between:var(--hds-spacing-small-4);--hds-component-message-padding:var(--hds-component-box-padding);padding-left:calc(var(--hds-component-message-padding) + var(--hds-component-message-icon-width) + var(--hds-component-message-spacing-between))}@media (min-width:720px){.kp-decorator-header-and-footer .hds-box.hds-message{--hds-component-message-spacing-between:var(--hds-spacing-medium-2)}}.kp-decorator-header-and-footer .hds-box.hds-message:before{content:"";top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);height:var(--hds-component-message-icon-width);position:absolute}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--success{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--success:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M27.6412 7.54758C28.3713 8.22153 28.3713 9.40094 27.6412 10.0749L13.2636 24.4524C12.5897 25.1825 11.4103 25.1825 10.7363 24.4524L3.54758 17.2637C2.81747 16.5897 2.81747 15.4103 3.54758 14.7363C4.22153 14.0062 5.40094 14.0062 6.07488 14.7363L11.9719 20.6334L25.1139 7.54758C25.7878 6.81747 26.9672 6.81747 27.6412 7.54758Z\" fill=\"%237BC144\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--attention{background-color:var(--hds-ui-colors-warning-yellow-light-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--attention:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><path d=\"M29.0323 23.7656C29.8537 25.2031 28.8269 27 27.1327 27H5.21084C3.51664 27 2.48986 25.2031 3.25994 23.7656L14.2466 5.07812C14.7086 4.35938 15.4274 4 16.1974 4C16.9162 4 17.6349 4.35938 18.097 5.07812L29.0323 23.7656ZM5.72423 24.5357H26.6193L16.1461 6.72098L5.72423 24.5357ZM16.1974 19.7098C17.0702 19.7098 17.789 20.4286 17.789 21.3013C17.789 22.1741 17.0702 22.8929 16.1974 22.8929C15.2733 22.8929 14.5546 22.1741 14.5546 21.3013C14.5546 20.4286 15.2733 19.7098 16.1974 19.7098ZM14.9653 11.8036C14.9653 11.1362 15.4787 10.5714 16.1974 10.5714C16.8649 10.5714 17.4296 11.1362 17.4296 11.8036V16.7321C17.4296 17.4509 16.8649 17.9643 16.1974 17.9643C15.4787 17.9643 14.9653 17.4509 14.9653 16.7321V11.8036Z\" fill=\"black\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--warning{background-color:var(--hds-ui-colors-warning-yellow)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--warning:before{background-image:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\"><rect x=\"12\" y=\"10\" width=\"8\" height=\"14.6667\" rx=\"4\" fill=\"%23FDBB2F\"/><path d=\"M29.0094 24.7656C29.8308 26.2031 28.804 28 27.1098 28H5.18794C3.49374 28 2.46695 26.2031 3.28838 24.7656L14.275 6.07812C15.0964 4.64062 17.2013 4.64062 18.0741 6.07812L29.0094 24.7656ZM14.9424 11.9821V18.5536C14.9424 19.2723 15.5585 19.7857 16.1745 19.7857C16.842 19.7857 17.4067 19.2723 17.4067 18.5536V11.9821C17.4067 11.3147 16.842 10.75 16.1745 10.75C15.4558 10.75 14.9424 11.3147 14.9424 11.9821ZM16.1745 24.7143C17.0473 24.7143 17.7661 23.9955 17.7661 23.1228C17.7661 22.25 17.0473 21.5312 16.1745 21.5312C15.2504 21.5312 14.5317 22.25 14.5317 23.1228C14.5317 23.9955 15.2504 24.7143 16.1745 24.7143Z\" fill=\"black\"/></svg>")}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--neutral{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-box.hds-message.hds-message--neutral .hds-message--neutral__icon{top:var(--hds-component-message-padding);left:var(--hds-component-message-padding);width:var(--hds-component-message-icon-width);position:absolute}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title{margin:0}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__description{margin:0}.kp-decorator-header-and-footer .hds-box.hds-message :is(.hds-message__title,.hds-message__description):first-of-type{margin-top:2px}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title{font:var(--hds-typography-body-title)}.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-3)}@media (min-width:940px){.kp-decorator-header-and-footer .hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-4)}}.kp-decorator-header-and-footer .hds-input{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.kp-decorator-header-and-footer .hds-input.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--lined.hds-input--error .hds-input__input{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--lined.hds-input--error .hds-input__input:focus{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer .hds-input.hds-input--default .hds-input__input{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer .hds-input.hds-input--white .hds-input__input{background-color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer .hds-input.hds-input--lined .hds-input__input{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey);padding-left:0;padding-top:var(--hds-spacing-small-1);padding-bottom:var(--hds-spacing-small-3);background:0 0;border-radius:0}.kp-decorator-header-and-footer .hds-input:focus-within .hds-input__label{color:var(--hds-brand-colors-darker)}.kp-decorator-header-and-footer .hds-input .hds-input__label{transition:color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption);order:1}.kp-decorator-header-and-footer .hds-input .hds-input__input{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border margin var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);box-sizing:border-box;order:2;width:100%;line-height:normal;position:relative}.kp-decorator-header-and-footer .hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.kp-decorator-header-and-footer .hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker);outline:0}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:disabled{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:read-only{color:var(--hds-ui-colors-dark-grey);background-color:var(--hds-ui-colors-grey);border:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer .hds-input .hds-input__input:read-only:focus{border-bottom-color:var(--hds-brand-colors-darker)}.kp-decorator-header-and-footer .hds-input .hds-input__error-message{font:var(--hds-typography-caption-title);color:var(--hds-ui-colors-dark-grey);padding:var(--hds-spacing-small-1)0 0 var(--hds-spacing-small-4);order:3}.kp-decorator-header-and-footer .hds-accordion{--hds-accordion-icon-dimension:24px;--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-small-4);--hds-component-accordion-content-spacing:var(--hds-spacing-medium-3);border:none;border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);display:block}@media (min-width:720px){.kp-decorator-header-and-footer .hds-accordion{--hds-component-accordion-content-spacing:var(--hds-spacing-large-1);--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-medium-2)}}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item{overflow:hidden}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item.hds-accordion-item__expanded .hds-accordion-item-trigger{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item:first-child .hds-accordion-item-trigger{border:0}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger{cursor:pointer;grid-gap:var(--hds-spacing-small-4);padding:var(--hds-component-accordion-trigger-spacing-between)0;border:0;border-top:var(--hds-stroke-thick)solid var(--hds-ui-colors-light-grey-fill);text-align:left;font:var(--hds-typography-body);background-color:transparent;grid-template-columns:24px auto;width:100%;display:grid}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger:hover{color:var(--hds-brand-colors-dark);outline:0}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon{color:var(--hds-brand-colors-dark);width:var(--hds-accordion-icon-dimension);height:var(--hds-accordion-icon-dimension);transition:all 50ms;display:inline-block}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon .hds-accordion-item-trigger--icon-chevron{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon .hds-accordion-item-trigger--icon-chevron-down{color:var(--hds-brand-colors-dark);fill:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon svg{vertical-align:baseline}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-trigger.hds-accordion-item-trigger--open .hds-accordion-item-trigger--icon svg{transform:rotate(180deg)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-content{padding:0 0 var(--hds-component-accordion-content-spacing)var(--hds-spacing-medium-4);font:var(--hds-typography-body-small)}.kp-decorator-header-and-footer .hds-accordion .hds-accordion-item .hds-accordion-item-content.hds-accordion-item-content--closed{display:none}.kp-decorator-header-and-footer label.hds-dropdown__label{transition:color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption);color:var(--hds-ui-colors-black);text-align:left;margin-bottom:0;display:block}.kp-decorator-header-and-footer select.hds-dropdown{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);font:var(--hds-typography-body-small);cursor:pointer;color:var(--hds-ui-colors-black);-webkit-appearance:none;-ms-appearance:none;appearance:none;padding:var(--hds-spacing-small-4);transition:border-color var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal),max-height var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal),transform var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-normal);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;background-image:linear-gradient(45deg,transparent 74%,var(--hds-ui-colors-light-grey-fill)0%),linear-gradient(135deg,var(--hds-ui-colors-light-grey-fill)26%,transparent 26%),linear-gradient(135deg,transparent 0,transparent 72%,var(--hds-ui-colors-light-grey-fill)73%,var(--hds-ui-colors-light-grey-fill)100%),linear-gradient(45deg,var(--hds-ui-colors-light-grey-fill)0,var(--hds-ui-colors-light-grey-fill)28%,var(--hds-ui-colors-dark-grey)29%,var(--hds-ui-colors-dark-grey)37%,transparent 38%,transparent 100%),linear-gradient(135deg,transparent 0,transparent 62%,var(--hds-ui-colors-dark-grey)63%,var(--hds-ui-colors-dark-grey)71%,var(--hds-ui-colors-light-grey-fill)72%,var(--hds-ui-colors-light-grey-fill)100%);background-size:var(--hds-spacing-small-4)var(--hds-spacing-small-4);background-position:calc(100% - var(--hds-spacing-small-4))45%;background-repeat:no-repeat;width:100%;height:58px;display:flex;position:relative}.kp-decorator-header-and-footer select.hds-dropdown:after{content:" ";clear:both;display:table}.kp-decorator-header-and-footer select.hds-dropdown.hds-dropdown--error{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default));position:relative}.kp-decorator-header-and-footer select.hds-dropdown--default{background-color:var(--hds-ui-colors-light-grey-fill)}.kp-decorator-header-and-footer select.hds-dropdown--lined{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey);padding-left:0;padding-top:var(--hds-spacing-small-1);padding-bottom:var(--hds-spacing-small-3);background-color:transparent;border-radius:0}.kp-decorator-header-and-footer select.hds-dropdown--lined:focus{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-grey)}.kp-decorator-header-and-footer select.hds-dropdown--lined[disabled]{padding:var(--hds-spacing-small-4);background-color:transparent}.kp-decorator-header-and-footer select.hds-dropdown--lined:disabled{padding:var(--hds-spacing-small-4);background-color:transparent}.kp-decorator-header-and-footer select.hds-dropdown--lined[disabled=disabled]{padding:var(--hds-spacing-small-4);background-color:transparent}.kp-decorator-header-and-footer select.hds-dropdown--white{background-color:var(--hds-ui-colors-white)}.kp-decorator-header-and-footer select.hds-dropdown--lined{background-image:linear-gradient(45deg,transparent 74%,var(--hds-ui-colors-white)0%),linear-gradient(135deg,var(--hds-ui-colors-white)26%,transparent 26%),linear-gradient(135deg,transparent 0,transparent 72%,var(--hds-ui-colors-white)73%,var(--hds-ui-colors-white)100%),linear-gradient(45deg,var(--hds-ui-colors-white)0,var(--hds-ui-colors-white)28%,var(--hds-ui-colors-dark-grey)29%,var(--hds-ui-colors-dark-grey)37%,transparent 38%,transparent 100%),linear-gradient(135deg,transparent 0,transparent 62%,var(--hds-ui-colors-dark-grey)63%,var(--hds-ui-colors-dark-grey)71%,var(--hds-ui-colors-white)72%,var(--hds-ui-colors-white)100%);background-size:var(--hds-spacing-small-4)var(--hds-spacing-small-4);background-repeat:no-repeat}.kp-decorator-header-and-footer select.hds-dropdown--white{background-image:linear-gradient(45deg,transparent 74%,var(--hds-ui-colors-white)0%),linear-gradient(135deg,var(--hds-ui-colors-white)26%,transparent 26%),linear-gradient(135deg,transparent 0,transparent 72%,var(--hds-ui-colors-white)73%,var(--hds-ui-colors-white)100%),linear-gradient(45deg,var(--hds-ui-colors-white)0,var(--hds-ui-colors-white)28%,var(--hds-ui-colors-dark-grey)29%,var(--hds-ui-colors-dark-grey)37%,transparent 38%,transparent 100%),linear-gradient(135deg,transparent 0,transparent 62%,var(--hds-ui-colors-dark-grey)63%,var(--hds-ui-colors-dark-grey)71%,var(--hds-ui-colors-white)72%,var(--hds-ui-colors-white)100%);background-size:var(--hds-spacing-small-4)var(--hds-spacing-small-4);background-repeat:no-repeat}.kp-decorator-header-and-footer .hds-dropdown--error .hds-dropdown-message{font:var(--hds-typography-caption-title);color:var(--hds-ui-colors-dark-grey);padding:var(--hds-spacing-small-1)0 0 var(--hds-spacing-small-4)}.kp-decorator-header-and-footer .hds-modal{border:none;border-radius:0;min-width:100%;max-width:100%}.kp-decorator-header-and-footer .hds-modal::-webkit-backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal::-ms-backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal::-ms-backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal::backdrop{background-color:rgba(0,0,0,.4);animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.kp-decorator-header-and-footer .hds-modal[open]{-webkit-animation:hds-modal-fade-in var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-in);animation:hds-modal-fade-in var(--hds-micro-animation-duration-normal)var(--hds-micro-animation-easing-in)}@media (min-width:720px){.kp-decorator-header-and-footer .hds-modal{border-radius:var(--hds-border-radius);min-width:720px;max-width:min(720px,100% - 6px - 2em)}}.kp-decorator-header-and-footer .hds-modal .hds-modal__header{margin:0}.kp-decorator-header-and-footer .hds-modal .hds-modal__header{font:var(--hds-typography-body-title);padding-right:16px}.kp-decorator-header-and-footer .hds-breadcrumbs{--hds-breadcrumb-image-left:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"> <path d=\"M11.0404 13.9322L11.3917 13.5887C11.462 13.4983 11.462 13.3537 11.3917 13.2814L8.21212 9.99096L11.3917 6.71864C11.462 6.64633 11.462 6.50169 11.3917 6.4113L11.0404 6.0678C10.9526 5.9774 10.8296 5.9774 10.7418 6.0678L7.0527 9.84633C6.98243 9.93672 6.98243 10.0633 7.0527 10.1537L10.7418 13.9322C10.8296 14.0226 10.9526 14.0226 11.0404 13.9322Z\" fill=\"black\"/></svg>");--hds-breadcrumb-image-right:url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"><path d=\"M7.9596 6.0678L7.60826 6.4113C7.53799 6.50169 7.53799 6.64633 7.60826 6.71864L10.7879 10.009L7.60826 13.2814C7.53799 13.3537 7.53799 13.4983 7.60826 13.5887L7.9596 13.9322C8.04743 14.0226 8.1704 14.0226 8.25823 13.9322L11.9473 10.1537C12.0176 10.0633 12.0176 9.93672 11.9473 9.84633L8.25823 6.0678C8.1704 5.9774 8.04743 5.9774 7.9596 6.0678Z\" fill=\"%236E6E6E\"/></svg>");padding:0;list-style-type:none;display:flex}.kp-decorator-header-and-footer .hds-breadcrumbs{font:var(--hds-typography-caption)}.kp-decorator-header-and-footer .hds-breadcrumbs a{font:var(--hds-typography-caption)}.kp-decorator-header-and-footer .hds-breadcrumbs li .hds-link{padding-bottom:2px}.kp-decorator-header-and-footer .hds-breadcrumbs li:first-child:before{display:none}.kp-decorator-header-and-footer .hds-breadcrumbs li:last-child{color:var(--hds-ui-colors-dark-grey)}.kp-decorator-header-and-footer .hds-breadcrumbs li:before{background-image:var(--hds-breadcrumb-image-right);margin:0 var(--hds-spacing-small-1);width:20px;height:20px;display:inline-block}@media (max-width:719.999px){.kp-decorator-header-and-footer .hds-breadcrumbs li:not(:only-child){display:none}.kp-decorator-header-and-footer .hds-breadcrumbs li:nth-last-of-type(2){display:inherit}.kp-decorator-header-and-footer .hds-breadcrumbs li:nth-last-of-type(2):before{background-image:var(--hds-breadcrumb-image-left);margin-left:0;display:inline-block}}.kp-decorator-header-and-footer .hds-tabs{--hds-tabs-border-active-size:var(--hds-stroke-thick);font:var(--hds-typography-body)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list{width:auto;padding-left:0;display:inline-flex}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{color:red}@media (min-width:720px){.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{border-bottom:var(--hds-stroke-default)solid var(--hds-ui-colors-light-grey-fill);flex-direction:row}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab{padding:var(--hds-spacing-small-3)0;border-bottom:var(--hds-tabs-border-active-size)solid transparent}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab.hds-tabs--tab-active{border-bottom-color:var(--hds-brand-colors-signature)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab:not(:last-child){margin-right:var(--hds-spacing-medium-3)}}@media (max-width:719.999px){.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{border-left:1px solid var(--hds-ui-colors-light-grey-fill);flex-direction:column;padding-left:1px}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab{padding:var(--hds-spacing-small-2)var(--hds-spacing-small-3);width:auto}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab.hds-tabs--tab-active{margin-left:calc(var(--hds-tabs-border-active-size)-1);border-left:var(--hds-tabs-border-active-size)solid var(--hds-brand-colors-signature)}}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-vertical{border-left:1px solid var(--hds-ui-colors-light-grey-fill);flex-direction:column;padding-left:1px}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-vertical .hds-tabs--tab{padding:var(--hds-spacing-small-2)var(--hds-spacing-small-3);width:auto}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list.hds-tabs--list-vertical .hds-tabs--tab.hds-tabs--tab-active{margin-left:calc(var(--hds-tabs-border-active-size)*-1);border-left:var(--hds-tabs-border-active-size)solid var(--hds-brand-colors-signature)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list .hds-tabs--tab{cursor:pointer;font:var(--hds-typography-body);text-align:left;background:0 0;border:0}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list .hds-tabs--tab:hover{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--list .hds-tabs--tab.hds-tabs--tab-active{color:var(--hds-brand-colors-dark)}.kp-decorator-header-and-footer .hds-tabs .hds-tabs--contents{margin-top:var(--hds-spacing-large-2)}@keyframes hds-modal-fade-in{0%{opacity:0}to{opacity:1}}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@postenbring/hedwig-css",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "description": "",
   "files": [
     "dist/**",