@postenbring/hedwig-css 0.0.24 → 0.0.25
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.
- package/dist/accordion.css +1 -1
- package/dist/accordion.css.map +1 -1
- package/dist/all-in-one.css +1 -1
- package/dist/all-in-one.css.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/scoped.css +1 -1
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
: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}body{background:var(--hds-ui-colors-white)}h1{font:var(--hds-brand-typography-h1)}h2{font:var(--hds-brand-typography-h2)}h3{font:var(--hds-typography-header-h3)}h4,h5,h6{font:var(--hds-typography-body-title)}.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}.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));min-height:44px}.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));min-height:50px}.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));min-height:58px}.hds-button.hds-button--full{width:100%}.hds-button.hds-button--mobile-full{width:100%}@media (min-width:720px){.hds-button.hds-button--mobile-full{width:unset}}.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)}.hds-button.hds-button--primary:hover{background-color:var(--hds-brand-colors-signature-hover);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--primary:active{background-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--secondary{background-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.hds-button.hds-button--secondary:hover{background-color:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--secondary:active{background-color:var(--hds-brand-colors-darker);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--outline-primary{--hds-component-button-border-width:var(--hds-stroke-default);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}.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)}.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)}.hds-button.hds-button--outline-secondary{--hds-component-button-border-width:var(--hds-stroke-default);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}.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)}.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)}.hds-button.hds-button--outline-white{--hds-component-button-border-width:var(--hds-stroke-default);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}.hds-button.hds-button--outline-white:hover{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.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}.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}.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}.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}.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}.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}.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}.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}.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}.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}.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}.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}.hds-button.hds-button--icon-only{justify-content:center;align-items:center;padding:0;display:inline-flex}.hds-button.hds-button--icon-only.hds-button--small{width:44px;height:44px}.hds-button.hds-button--icon-only.hds-button--small *{width:24px;height:24px}.hds-button.hds-button--icon-only.hds-button--medium{width:50px;height:50px}.hds-button.hds-button--icon-only.hds-button--medium *{width:32px;height:32px}.hds-button.hds-button--icon-only.hds-button--large{width:58px;height:58px}.hds-button.hds-button--icon-only.hds-button--large *{width:32px;height:32px}.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}.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)}.hds-link:hover .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.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)}.hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.hds-link.hds-link--inverted:hover{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.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}.hds-link.hds-link--small{font:var(--hds-typography-body-small)}.hds-link.hds-link--large{font:var(--hds-typography-header-h3)}.hds-link.hds-link--no-underline{color:var(--hds-brand-colors-dark);border-bottom:none;font-weight:500;text-decoration:none}.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);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.hds-link.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-link.hds-link--solid:hover{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-link.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-link:-webkit-any(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.hds-link:-webkit-any(button):not(:-webkit-any(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.hds-link:is(button):not(:is(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.hds-link:is(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.hds-link:-webkit-any(button):not(:-webkit-any(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.hds-link:is(button):not(:is(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.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}.hds-badge{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.hds-badge{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--lighter{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.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)}.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)}.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)}.hds-description-list{font:var(--hds-typography-body);margin:0;padding-left:0;list-style:none}.hds-description-list dt{font:var(--hds-typography-body-title)}.hds-description-list dd{margin-left:0;margin-bottom:var(--hds-spacing-small-3)}.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}.hds-description-list.hds-description-list--horizontal dt:after{content:"\a ";white-space:pre}.hds-description-list.hds-description-list--horizontal dd{display:inline}.hds-description-list.hds-description-list--horizontal dd:after{content:"\a ";white-space:pre}.hds-list{padding-left:var(--hds-spacing-medium-3);flex-direction:column;margin:0;display:flex}.hds-list li{padding-left:var(--hds-spacing-small-2)}.hds-list li::marker{color:var(--hds-brand-colors-dark)}.hds-list:-webkit-any(ol){list-style:decimal}.hds-list:is(ol){list-style:decimal}.hds-list:-webkit-any(ul){list-style:disc}.hds-list:is(ul){list-style:disc}.hds-list.hds-list--no-bullets{padding-left:0;list-style:none}.hds-list.hds-list--no-bullets li{padding-left:0}.hds-list.hds-list--small{font:var(--hds-typography-body-small);gap:var(--hds-spacing-small-1)}.hds-list{gap:var(--hds-spacing-small-2)}.hds-list.hds-list--medium{gap:var(--hds-spacing-small-2)}.hds-list.hds-list--large{font:var(--hds-typography-header-h3);gap:var(--hds-spacing-small-3)}.hds-typography-h1-display{font:var(--hds-brand-typography-h1-display)}.hds-typography-h1-display.hds-typography-h1-display--min{font-size:var(--hds-brand-font-size-h1-display-min);line-height:var(--hds-brand-line-height-h1-display-min)}.hds-typography-h1-display.hds-typography-h1-display--max{font-size:var(--hds-brand-font-size-h1-display-max);line-height:var(--hds-brand-line-height-h1-display-max)}.hds-typography-h1{font:var(--hds-brand-typography-h1)}.hds-typography-h1.hds-typography-h1--min{font-size:var(--hds-brand-font-size-h1-min);line-height:var(--hds-brand-line-height-h1-min)}.hds-typography-h1.hds-typography-h1--max{font-size:var(--hds-brand-font-size-h1-max);line-height:var(--hds-brand-line-height-h1-max)}.hds-typography-h2{font:var(--hds-brand-typography-h2)}.hds-typography-h2.hds-typography-h2--min{font-size:var(--hds-brand-font-size-h2-min);line-height:var(--hds-brand-line-height-h2-min)}.hds-typography-h2.hds-typography-h2--max{font-size:var(--hds-brand-font-size-h2-max);line-height:var(--hds-brand-line-height-h2-max)}.hds-typography-h3{font:var(--hds-typography-header-h3)}.hds-typography-h3.hds-typography-h3--min{font-size:var(--hds-font-size-header-h3-min);line-height:var(--hds-line-height-header-h3-min)}.hds-typography-h3.hds-typography-h3--max{font-size:var(--hds-font-size-header-h3-max);line-height:var(--hds-line-height-header-h3-max)}.hds-typography-h3-title{font:var(--hds-typography-header-h3-title)}.hds-typography-h3-title.hds-typography-h3-title--min{font-size:var(--hds-font-size-header-h3-title-min);line-height:var(--hds-line-height-header-h3-title-min)}.hds-typography-h3-title.hds-typography-h3-title--max{font-size:var(--hds-font-size-header-h3-title-max);line-height:var(--hds-line-height-header-h3-title-max)}.hds-typography-body{font:var(--hds-typography-body)}.hds-typography-body.hds-typography-body--min{font-size:var(--hds-font-size-body-min);line-height:var(--hds-line-height-body-min)}.hds-typography-body.hds-typography-body--max{font-size:var(--hds-font-size-body-max);line-height:var(--hds-line-height-body-max)}.hds-typography-body-title{font:var(--hds-typography-body-title)}.hds-typography-body-title.hds-typography-body-title--min{font-size:var(--hds-font-size-body-title-min);line-height:var(--hds-line-height-body-title-min)}.hds-typography-body-title.hds-typography-body-title--max{font-size:var(--hds-font-size-body-title-max);line-height:var(--hds-line-height-body-title-max)}.hds-typography-body-small{font:var(--hds-typography-body-small)}.hds-typography-body-small.hds-typography-body-small--min{font-size:var(--hds-font-size-body-small-min);line-height:var(--hds-line-height-body-small-min)}.hds-typography-body-small.hds-typography-body-small--max{font-size:var(--hds-font-size-body-small-max);line-height:var(--hds-line-height-body-small-max)}.hds-typography-body-small-title{font:var(--hds-typography-body-small-title)}.hds-typography-body-small-title.hds-typography-body-small-title--min{font-size:var(--hds-font-size-body-small-title-min);line-height:var(--hds-line-height-body-small-title-min)}.hds-typography-body-small-title.hds-typography-body-small-title--max{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max)}.hds-typography-caption{font:var(--hds-typography-caption)}.hds-typography-caption-title{font:var(--hds-typography-caption-title)}.hds-typography-technical{font:var(--hds-typography-technical)}.hds-typography-technical.hds-typography-technical--min{font-size:var(--hds-font-size-technical-min);line-height:var(--hds-line-height-technical-min)}.hds-typography-technical.hds-typography-technical--max{font-size:var(--hds-font-size-technical-max);line-height:var(--hds-line-height-technical-max)}.hds-typography-technical-title{font:var(--hds-typography-technical-title)}.hds-typography-technical-title.hds-typography-technical-title--min{font-size:var(--hds-font-size-technical-title-min);line-height:var(--hds-line-height-technical-title-min)}.hds-typography-technical-title.hds-typography-technical-title--max{font-size:var(--hds-font-size-technical-title-max);line-height:var(--hds-line-height-technical-title-max)}.hds-typography-h1--spacing,.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h1~.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.hds-typography-h3--spacing,.hds-typography-h3-title--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-body--spacing,.hds-typography-body-title--spacing,.hds-typography-body-small--spacing,.hds-typography-body-small-title--spacing,.hds-typography-caption--spacing,.hds-typography-caption-title--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-technical--spacing,.hds-typography-technical-title--spacing{margin-top:var(--hds-spacing-small-1)}.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}.hds-box{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--light-grey{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--lighter{background-color:var(--hds-brand-colors-lighter)}.hds-box.hds-box--white{background-color:var(--hds-ui-colors-white);box-shadow:var(--hds-shadow-default)}.hds-box.hds-box--warning{background-color:var(--hds-ui-colors-warning-yellow)}@media (min-width:720px){.hds-box{--hds-component-box-padding:var(--hds-spacing-medium-3)}}.hds-box.hds-box--closed{display:none}.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}.hds-box .hds-box__close-button:hover{-webkit-filter:invert(40%);filter:invert(40%)}.hds-box .hds-box__close-button:active{box-shadow:0 0 0 2px var(--hds-ui-colors-black-hover);outline:none}.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){.hds-box.hds-message{--hds-component-message-spacing-between:var(--hds-spacing-medium-2)}}.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}.hds-box.hds-message.hds-message--success{background-color:var(--hds-ui-colors-light-grey-fill)}.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>")}.hds-box.hds-message.hds-message--attention{background-color:var(--hds-ui-colors-warning-yellow-light-fill)}.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>")}.hds-box.hds-message.hds-message--warning{background-color:var(--hds-ui-colors-warning-yellow)}.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>")}.hds-box.hds-message.hds-message--neutral{background-color:var(--hds-ui-colors-light-grey-fill)}.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}.hds-box.hds-message .hds-message__title{margin:0}.hds-box.hds-message .hds-message__description{margin:0}.hds-box.hds-message :-webkit-any(.hds-message__title,.hds-message__description):first-of-type{margin-top:2px}.hds-box.hds-message :is(.hds-message__title,.hds-message__description):first-of-type{margin-top:2px}.hds-box.hds-message .hds-message__title{font:var(--hds-typography-body-title)}.hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-3)}@media (min-width:940px){.hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-4)}}.hds-input{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-input.hds-input--error .hds-input__input-wrapper{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:has(.hds-input__input:read-only){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper[data-readonly=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:has(.hds-input__input:read-only):focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:has(.hds-input__input:disabled){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper[data-disabled=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper{background-image:url("data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>");background-repeat:no-repeat;background-position-x:calc(100% - var(--hds-spacing-small-4));padding-right:calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));background-position-y:50%}.hds-input .hds-input__input-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-input.hds-input--default .hds-input__input-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-input.hds-input--white .hds-input__input-wrapper{background-color:var(--hds-ui-colors-white)}.hds-input:focus-within .hds-input__label{color:var(--hds-brand-colors-darker)}.hds-input .hds-input__label{transition:color var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption)}.hds-input:has(.hds-input__input:read-only,.hds-input__input:disabled):not(:focus-within) .hds-input__label{color:var(--hds-ui-colors-dark-grey)}.hds-input .hds-input__input-wrapper{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal),margin var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);box-sizing:border-box;flex-flow:row;width:100%;display:flex}.hds-input .hds-input__input-wrapper:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-input .hds-input__input-wrapper:has(.hds-input__input:read-only):focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-input .hds-input__input-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-input .hds-input__input-wrapper:has(.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)}.hds-input .hds-input__input-wrapper[data-readonly=true]{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)}.hds-input .hds-input__input-wrapper:has(.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)}.hds-input .hds-input__input-wrapper[data-disabled=true]{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)}.hds-input .hds-input__input{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);background:0 0;border:0;width:100%;line-height:normal}.hds-input .hds-input__input::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input:focus{outline:0}.hds-input .hds-input__input:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::-ms-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:read-only:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-input .hds-input__input:read-only:focus::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-input .hds-input__input:read-only:focus::placeholder{color:var(--hds-ui-colors-dark-grey)}.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)}.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){.hds-accordion{--hds-component-accordion-content-spacing:var(--hds-spacing-large-1);--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-medium-2)}}.hds-accordion .hds-accordion-item{overflow:hidden}.hds-accordion .hds-accordion-item.hds-accordion-item__expanded .hds-accordion-item-trigger{color:var(--hds-brand-colors-dark)}.hds-accordion .hds-accordion-item:first-child .hds-accordion-item-trigger{border:0}.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}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger:hover{color:var(--hds-brand-colors-dark);outline:0}.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}.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)}.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)}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon svg{vertical-align:baseline}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger.hds-accordion-item-trigger--open .hds-accordion-item-trigger--icon svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.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)}.hds-accordion .hds-accordion-item .hds-accordion-item-content.hds-accordion-item-content--closed{display:none}.hds-select{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-select label.hds-select__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}.hds-select.hds-select--error .hds-select__select-wrapper{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper:has(.hds-select__select:disabled){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper[data-disabled=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper{background-repeat:no-repeat;background-position-x:calc(100% - var(--hds-spacing-small-4));padding-right:calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));background-position-y:50%}.hds-select.hds-select--error .hds-select__select-wrapper:after{content:url("data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>");padding-top:var(--hds-spacing-small-4)}.hds-select .hds-select__select-wrapper{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);font:var(--hds-typography-body-small);cursor:pointer;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}.hds-select .hds-select__select-wrapper select.hds-select__select{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);-webkit-appearance:none;-ms-appearance:none;appearance:none;background:0 0;border:0;width:100%;line-height:normal}.hds-select .hds-select__select-wrapper select.hds-select__select:focus{outline:0}.hds-select .hds-select__select-wrapper select.hds-select__select:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-select.hds-select--default .hds-select__select-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-select.hds-select--white .hds-select__select-wrapper{background-color:var(--hds-ui-colors-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}.hds-select .hds-select__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)}.hds-modal{border:none;border-radius:0;min-width:100%;max-width:100%}.hds-modal::-webkit-backdrop{background-color:rgba(0,0,0,.4);-webkit-animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in;animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.hds-modal::-ms-backdrop{background-color:rgba(0,0,0,.4);-webkit-animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in;animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.hds-modal::backdrop{background-color:rgba(0,0,0,.4);-webkit-animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in;animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.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){.hds-modal{border-radius:var(--hds-border-radius);min-width:720px;max-width:min(720px,100% - 6px - 2em)}}.hds-modal .hds-modal__header{margin:0}.hds-modal .hds-modal__header{font:var(--hds-typography-body-title);padding-right:16px}@-webkit-keyframes hds-modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes hds-modal-fade-in{0%{opacity:0}to{opacity:1}}.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}.hds-breadcrumbs{font:var(--hds-typography-caption)}.hds-breadcrumbs a{font:var(--hds-typography-caption)}.hds-breadcrumbs li .hds-link{padding-bottom:2px}.hds-breadcrumbs li:first-child:before{display:none}.hds-breadcrumbs li:last-child{color:var(--hds-ui-colors-dark-grey)}.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){.hds-breadcrumbs li:not(:only-child){display:none}.hds-breadcrumbs li:nth-last-of-type(2){display:inherit}.hds-breadcrumbs li:nth-last-of-type(2):before{background-image:var(--hds-breadcrumb-image-left);margin-left:0;display:inline-block}}.hds-tabs{--hds-tabs-border-active-size:var(--hds-stroke-thick);font:var(--hds-typography-body)}.hds-tabs .hds-tabs--list{width:auto;padding-left:0;display:inline-flex}.hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{color:red}@media (min-width:720px){.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}.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}.hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab.hds-tabs--tab-active{border-bottom-color:var(--hds-brand-colors-signature)}.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){.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}.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}.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)}}.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}.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}.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)}.hds-tabs .hds-tabs--list .hds-tabs--tab{cursor:pointer;font:var(--hds-typography-body);text-align:left;background:0 0;border:0}.hds-tabs .hds-tabs--list .hds-tabs--tab:hover{color:var(--hds-brand-colors-dark)}.hds-tabs .hds-tabs--list .hds-tabs--tab.hds-tabs--tab-active{color:var(--hds-brand-colors-dark)}.hds-tabs .hds-tabs--contents{margin-top:var(--hds-spacing-large-2)}.hds-textarea{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper[data-readonly=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only):focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:disabled){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper[data-disabled=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper{background-image:url("data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>");background-repeat:no-repeat;background-position-x:calc(100% - var(--hds-spacing-small-4));padding-right:calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));background-position-y:50%}.hds-textarea .hds-textarea__textarea-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-textarea.hds-textarea--default .hds-textarea__textarea-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-textarea.hds-textarea--white .hds-textarea__textarea-wrapper{background-color:var(--hds-ui-colors-white)}.hds-textarea:focus-within .hds-textarea__label{color:var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__label{transition:color var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption)}.hds-textarea:has(.hds-textarea__textarea:read-only,.hds-textarea__textarea:disabled):not(:focus-within) .hds-textarea__label{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__textarea-wrapper{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal),margin var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);box-sizing:border-box;flex-flow:row;width:100%;display:flex}.hds-textarea .hds-textarea__textarea-wrapper:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only):focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__textarea-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea: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)}.hds-textarea .hds-textarea__textarea-wrapper[data-readonly=true]{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)}.hds-textarea .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea: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)}.hds-textarea .hds-textarea__textarea-wrapper[data-disabled=true]{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)}.hds-textarea .hds-textarea__textarea{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);background:0 0;border:0;width:100%;line-height:normal}.hds-textarea .hds-textarea__textarea::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-textarea .hds-textarea__textarea::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-textarea .hds-textarea__textarea::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-textarea .hds-textarea__textarea:focus{outline:0}.hds-textarea .hds-textarea__textarea:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-textarea .hds-textarea__textarea:focus::-ms-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-textarea .hds-textarea__textarea:focus::placeholder{color:var(--hds-ui-colors-grey)}.hds-textarea .hds-textarea__textarea:read-only:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__textarea:read-only:focus::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__textarea:read-only:focus::placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__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)}
|
|
1
|
+
: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}body{background:var(--hds-ui-colors-white)}h1{font:var(--hds-brand-typography-h1)}h2{font:var(--hds-brand-typography-h2)}h3{font:var(--hds-typography-header-h3)}h4,h5,h6{font:var(--hds-typography-body-title)}.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}.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));min-height:44px}.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));min-height:50px}.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));min-height:58px}.hds-button.hds-button--full{width:100%}.hds-button.hds-button--mobile-full{width:100%}@media (min-width:720px){.hds-button.hds-button--mobile-full{width:unset}}.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)}.hds-button.hds-button--primary:hover{background-color:var(--hds-brand-colors-signature-hover);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--primary:active{background-color:var(--hds-brand-colors-signature);outline:0 solid var(--hds-brand-colors-signature-hover)}.hds-button.hds-button--secondary{background-color:var(--hds-brand-colors-darker);color:var(--hds-ui-colors-white);fill:var(--hds-ui-colors-white)}.hds-button.hds-button--secondary:hover{background-color:var(--hds-ui-colors-black);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--secondary:active{background-color:var(--hds-brand-colors-darker);outline:0 solid var(--hds-ui-colors-black)}.hds-button.hds-button--outline-primary{--hds-component-button-border-width:var(--hds-stroke-default);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}.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)}.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)}.hds-button.hds-button--outline-secondary{--hds-component-button-border-width:var(--hds-stroke-default);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}.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)}.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)}.hds-button.hds-button--outline-white{--hds-component-button-border-width:var(--hds-stroke-default);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}.hds-button.hds-button--outline-white:hover{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.hds-button.hds-button--outline-white:active{color:var(--hds-brand-colors-light);fill:var(--hds-brand-colors-light)}.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}.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}.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}.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}.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}.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}.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}.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}.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}.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}.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}.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}.hds-button.hds-button--icon-only{justify-content:center;align-items:center;padding:0;display:inline-flex}.hds-button.hds-button--icon-only.hds-button--small{width:44px;height:44px}.hds-button.hds-button--icon-only.hds-button--small *{width:24px;height:24px}.hds-button.hds-button--icon-only.hds-button--medium{width:50px;height:50px}.hds-button.hds-button--icon-only.hds-button--medium *{width:32px;height:32px}.hds-button.hds-button--icon-only.hds-button--large{width:58px;height:58px}.hds-button.hds-button--icon-only.hds-button--large *{width:32px;height:32px}.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}.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)}.hds-link:hover .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.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)}.hds-link:active .hds-link__text{border-color:var(--hds-brand-link-colors-underline-hover)}.hds-link.hds-link--inverted{color:var(--hds-ui-colors-white);-webkit-text-decoration-color:var(--hds-brand-colors-signature);text-decoration-color:var(--hds-brand-colors-signature);border-color:currentColor}.hds-link.hds-link--inverted:hover{color:var(--hds-brand-colors-light);border-color:currentColor}.hds-link.hds-link--inverted:active{color:var(--hds-brand-colors-light);border-color:currentColor}.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}.hds-link.hds-link--small{font:var(--hds-typography-body-small)}.hds-link.hds-link--large{font:var(--hds-typography-header-h3)}.hds-link.hds-link--no-underline{color:var(--hds-brand-colors-dark);border-bottom:none;font-weight:500;text-decoration:none}.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);text-decoration-color:var(--hds-brand-colors-dark);border-bottom:none}.hds-link.hds-link--solid{color:var(--hds-ui-colors-black);border-color:var(--hds-ui-colors-black)}.hds-link.hds-link--solid:hover{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-link.hds-link--solid:active{color:var(--hds-ui-colors-black-hover);border-color:var(--hds-ui-colors-black-hover)}.hds-link:-webkit-any(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.hds-link:-webkit-any(button):not(:-webkit-any(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.hds-link:is(button):not(:is(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.hds-link:is(button){background:0 0;border-top:0;border-left:0;border-right:0;padding:0}.hds-link:-webkit-any(button):not(:-webkit-any(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.hds-link:is(button):not(:is(.hds-link--small,.hds-link--large)){font:var(--hds-typography-body)}.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}.hds-badge{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--small{padding:var(--hds-spacing-small-1)var(--hds-spacing-small-2)}.hds-badge.hds-badge--smaller{padding:2px var(--hds-spacing-small-1)}.hds-badge{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.hds-badge.hds-badge--lighter{background-color:var(--hds-brand-colors-lighter);border-color:var(--hds-brand-colors-lighter);color:var(--hds-brand-colors-dark)}.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)}.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)}.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)}.hds-description-list{font:var(--hds-typography-body);margin:0;padding-left:0;list-style:none}.hds-description-list dt{font:var(--hds-typography-body-title)}.hds-description-list dd{margin-left:0;margin-bottom:var(--hds-spacing-small-3)}.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}.hds-description-list.hds-description-list--horizontal dt:after{content:"\a ";white-space:pre}.hds-description-list.hds-description-list--horizontal dd{display:inline}.hds-description-list.hds-description-list--horizontal dd:after{content:"\a ";white-space:pre}.hds-list{padding-left:var(--hds-spacing-medium-3);flex-direction:column;margin:0;display:flex}.hds-list li{padding-left:var(--hds-spacing-small-2)}.hds-list li::marker{color:var(--hds-brand-colors-dark)}.hds-list:-webkit-any(ol){list-style:decimal}.hds-list:is(ol){list-style:decimal}.hds-list:-webkit-any(ul){list-style:disc}.hds-list:is(ul){list-style:disc}.hds-list.hds-list--no-bullets{padding-left:0;list-style:none}.hds-list.hds-list--no-bullets li{padding-left:0}.hds-list.hds-list--small{font:var(--hds-typography-body-small);gap:var(--hds-spacing-small-1)}.hds-list{gap:var(--hds-spacing-small-2)}.hds-list.hds-list--medium{gap:var(--hds-spacing-small-2)}.hds-list.hds-list--large{font:var(--hds-typography-header-h3);gap:var(--hds-spacing-small-3)}.hds-typography-h1-display{font:var(--hds-brand-typography-h1-display)}.hds-typography-h1-display.hds-typography-h1-display--min{font-size:var(--hds-brand-font-size-h1-display-min);line-height:var(--hds-brand-line-height-h1-display-min)}.hds-typography-h1-display.hds-typography-h1-display--max{font-size:var(--hds-brand-font-size-h1-display-max);line-height:var(--hds-brand-line-height-h1-display-max)}.hds-typography-h1{font:var(--hds-brand-typography-h1)}.hds-typography-h1.hds-typography-h1--min{font-size:var(--hds-brand-font-size-h1-min);line-height:var(--hds-brand-line-height-h1-min)}.hds-typography-h1.hds-typography-h1--max{font-size:var(--hds-brand-font-size-h1-max);line-height:var(--hds-brand-line-height-h1-max)}.hds-typography-h2{font:var(--hds-brand-typography-h2)}.hds-typography-h2.hds-typography-h2--min{font-size:var(--hds-brand-font-size-h2-min);line-height:var(--hds-brand-line-height-h2-min)}.hds-typography-h2.hds-typography-h2--max{font-size:var(--hds-brand-font-size-h2-max);line-height:var(--hds-brand-line-height-h2-max)}.hds-typography-h3{font:var(--hds-typography-header-h3)}.hds-typography-h3.hds-typography-h3--min{font-size:var(--hds-font-size-header-h3-min);line-height:var(--hds-line-height-header-h3-min)}.hds-typography-h3.hds-typography-h3--max{font-size:var(--hds-font-size-header-h3-max);line-height:var(--hds-line-height-header-h3-max)}.hds-typography-h3-title{font:var(--hds-typography-header-h3-title)}.hds-typography-h3-title.hds-typography-h3-title--min{font-size:var(--hds-font-size-header-h3-title-min);line-height:var(--hds-line-height-header-h3-title-min)}.hds-typography-h3-title.hds-typography-h3-title--max{font-size:var(--hds-font-size-header-h3-title-max);line-height:var(--hds-line-height-header-h3-title-max)}.hds-typography-body{font:var(--hds-typography-body)}.hds-typography-body.hds-typography-body--min{font-size:var(--hds-font-size-body-min);line-height:var(--hds-line-height-body-min)}.hds-typography-body.hds-typography-body--max{font-size:var(--hds-font-size-body-max);line-height:var(--hds-line-height-body-max)}.hds-typography-body-title{font:var(--hds-typography-body-title)}.hds-typography-body-title.hds-typography-body-title--min{font-size:var(--hds-font-size-body-title-min);line-height:var(--hds-line-height-body-title-min)}.hds-typography-body-title.hds-typography-body-title--max{font-size:var(--hds-font-size-body-title-max);line-height:var(--hds-line-height-body-title-max)}.hds-typography-body-small{font:var(--hds-typography-body-small)}.hds-typography-body-small.hds-typography-body-small--min{font-size:var(--hds-font-size-body-small-min);line-height:var(--hds-line-height-body-small-min)}.hds-typography-body-small.hds-typography-body-small--max{font-size:var(--hds-font-size-body-small-max);line-height:var(--hds-line-height-body-small-max)}.hds-typography-body-small-title{font:var(--hds-typography-body-small-title)}.hds-typography-body-small-title.hds-typography-body-small-title--min{font-size:var(--hds-font-size-body-small-title-min);line-height:var(--hds-line-height-body-small-title-min)}.hds-typography-body-small-title.hds-typography-body-small-title--max{font-size:var(--hds-font-size-body-small-title-max);line-height:var(--hds-line-height-body-small-title-max)}.hds-typography-caption{font:var(--hds-typography-caption)}.hds-typography-caption-title{font:var(--hds-typography-caption-title)}.hds-typography-technical{font:var(--hds-typography-technical)}.hds-typography-technical.hds-typography-technical--min{font-size:var(--hds-font-size-technical-min);line-height:var(--hds-line-height-technical-min)}.hds-typography-technical.hds-typography-technical--max{font-size:var(--hds-font-size-technical-max);line-height:var(--hds-line-height-technical-max)}.hds-typography-technical-title{font:var(--hds-typography-technical-title)}.hds-typography-technical-title.hds-typography-technical-title--min{font-size:var(--hds-font-size-technical-title-min);line-height:var(--hds-line-height-technical-title-min)}.hds-typography-technical-title.hds-typography-technical-title--max{font-size:var(--hds-font-size-technical-title-max);line-height:var(--hds-line-height-technical-title-max)}.hds-typography-h1--spacing,.hds-typography-h2--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-h1~.hds-typography-h2--spacing{margin-top:var(--hds-spacing-medium-3)}.hds-typography-h3--spacing,.hds-typography-h3-title--spacing{margin-top:var(--hds-spacing-large-2)}.hds-typography-body--spacing,.hds-typography-body-title--spacing,.hds-typography-body-small--spacing,.hds-typography-body-small-title--spacing,.hds-typography-caption--spacing,.hds-typography-caption-title--spacing{margin-top:var(--hds-spacing-medium-2)}.hds-typography-technical--spacing,.hds-typography-technical-title--spacing{margin-top:var(--hds-spacing-small-1)}.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}.hds-box{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--light-grey{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-box.hds-box--lighter{background-color:var(--hds-brand-colors-lighter)}.hds-box.hds-box--white{background-color:var(--hds-ui-colors-white);box-shadow:var(--hds-shadow-default)}.hds-box.hds-box--warning{background-color:var(--hds-ui-colors-warning-yellow)}@media (min-width:720px){.hds-box{--hds-component-box-padding:var(--hds-spacing-medium-3)}}.hds-box.hds-box--closed{display:none}.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}.hds-box .hds-box__close-button:hover{-webkit-filter:invert(40%);filter:invert(40%)}.hds-box .hds-box__close-button:active{box-shadow:0 0 0 2px var(--hds-ui-colors-black-hover);outline:none}.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){.hds-box.hds-message{--hds-component-message-spacing-between:var(--hds-spacing-medium-2)}}.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}.hds-box.hds-message.hds-message--success{background-color:var(--hds-ui-colors-light-grey-fill)}.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>")}.hds-box.hds-message.hds-message--attention{background-color:var(--hds-ui-colors-warning-yellow-light-fill)}.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>")}.hds-box.hds-message.hds-message--warning{background-color:var(--hds-ui-colors-warning-yellow)}.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>")}.hds-box.hds-message.hds-message--neutral{background-color:var(--hds-ui-colors-light-grey-fill)}.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}.hds-box.hds-message .hds-message__title{margin:0}.hds-box.hds-message .hds-message__description{margin:0}.hds-box.hds-message :-webkit-any(.hds-message__title,.hds-message__description):first-of-type{margin-top:2px}.hds-box.hds-message :is(.hds-message__title,.hds-message__description):first-of-type{margin-top:2px}.hds-box.hds-message .hds-message__title{font:var(--hds-typography-body-title)}.hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-3)}@media (min-width:940px){.hds-box.hds-message .hds-message__title~.hds-message__description{margin-top:var(--hds-spacing-small-4)}}.hds-input{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-input.hds-input--error .hds-input__input-wrapper{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:has(.hds-input__input:read-only){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper[data-readonly=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:has(.hds-input__input:read-only):focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper:has(.hds-input__input:disabled){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper[data-disabled=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-input.hds-input--error .hds-input__input-wrapper{background-image:url("data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>");background-repeat:no-repeat;background-position-x:calc(100% - var(--hds-spacing-small-4));padding-right:calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));background-position-y:50%}.hds-input .hds-input__input-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-input.hds-input--default .hds-input__input-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-input.hds-input--white .hds-input__input-wrapper{background-color:var(--hds-ui-colors-white)}.hds-input:focus-within .hds-input__label{color:var(--hds-brand-colors-darker)}.hds-input .hds-input__label{transition:color var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption)}.hds-input:has(.hds-input__input:read-only,.hds-input__input:disabled):not(:focus-within) .hds-input__label{color:var(--hds-ui-colors-dark-grey)}.hds-input .hds-input__input-wrapper{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal),margin var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);box-sizing:border-box;flex-flow:row;width:100%;display:flex}.hds-input .hds-input__input-wrapper:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-input .hds-input__input-wrapper:has(.hds-input__input:read-only):focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-input .hds-input__input-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-input .hds-input__input-wrapper:has(.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)}.hds-input .hds-input__input-wrapper[data-readonly=true]{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)}.hds-input .hds-input__input-wrapper:has(.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)}.hds-input .hds-input__input-wrapper[data-disabled=true]{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)}.hds-input .hds-input__input{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);background:0 0;border:0;width:100%;line-height:normal}.hds-input .hds-input__input::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-input .hds-input__input:focus{outline:0}.hds-input .hds-input__input:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::-ms-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:focus::placeholder{color:var(--hds-ui-colors-grey)}.hds-input .hds-input__input:read-only:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-input .hds-input__input:read-only:focus::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-input .hds-input__input:read-only:focus::placeholder{color:var(--hds-ui-colors-dark-grey)}.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)}.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-default)solid var(--hds-ui-colors-light-grey-stroke);font:var(--hds-typography-body);fill:var(--hds-ui-colors-black);color:var(--hds-ui-colors-black);display:block}@media (min-width:720px){.hds-accordion{--hds-component-accordion-content-spacing:var(--hds-spacing-large-1);--hds-component-accordion-trigger-spacing-between:var(--hds-spacing-medium-2)}}.hds-accordion .hds-accordion-item{overflow:hidden}.hds-accordion .hds-accordion-item.hds-accordion-item__expanded .hds-accordion-item-trigger{color:var(--hds-brand-colors-dark)}.hds-accordion .hds-accordion-item:first-child .hds-accordion-item-trigger{border:0}.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}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger:hover{color:var(--hds-brand-colors-dark);outline:0}.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}.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)}.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)}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger .hds-accordion-item-trigger--icon svg{vertical-align:baseline}.hds-accordion .hds-accordion-item .hds-accordion-item-trigger.hds-accordion-item-trigger--open .hds-accordion-item-trigger--icon svg{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.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)}.hds-accordion .hds-accordion-item .hds-accordion-item-content.hds-accordion-item-content--closed{display:none}.hds-select{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-select label.hds-select__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}.hds-select.hds-select--error .hds-select__select-wrapper{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper:has(.hds-select__select:disabled){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper[data-disabled=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-select.hds-select--error .hds-select__select-wrapper{background-repeat:no-repeat;background-position-x:calc(100% - var(--hds-spacing-small-4));padding-right:calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));background-position-y:50%}.hds-select.hds-select--error .hds-select__select-wrapper:after{content:url("data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>");padding-top:var(--hds-spacing-small-4)}.hds-select .hds-select__select-wrapper{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);font:var(--hds-typography-body-small);cursor:pointer;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}.hds-select .hds-select__select-wrapper select.hds-select__select{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);-webkit-appearance:none;-ms-appearance:none;appearance:none;background:0 0;border:0;width:100%;line-height:normal}.hds-select .hds-select__select-wrapper select.hds-select__select:focus{outline:0}.hds-select .hds-select__select-wrapper select.hds-select__select:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-select.hds-select--default .hds-select__select-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-select.hds-select--white .hds-select__select-wrapper{background-color:var(--hds-ui-colors-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}.hds-select .hds-select__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)}.hds-modal{border:none;border-radius:0;min-width:100%;max-width:100%}.hds-modal::-webkit-backdrop{background-color:rgba(0,0,0,.4);-webkit-animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in;animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.hds-modal::-ms-backdrop{background-color:rgba(0,0,0,.4);-webkit-animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in;animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.hds-modal::backdrop{background-color:rgba(0,0,0,.4);-webkit-animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in;animation:.3s cubic-bezier(.45,.1,.65,1) hds-modal-fade-in}.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){.hds-modal{border-radius:var(--hds-border-radius);min-width:720px;max-width:min(720px,100% - 6px - 2em)}}.hds-modal .hds-modal__header{margin:0}.hds-modal .hds-modal__header{font:var(--hds-typography-body-title);padding-right:16px}@-webkit-keyframes hds-modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes hds-modal-fade-in{0%{opacity:0}to{opacity:1}}.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}.hds-breadcrumbs{font:var(--hds-typography-caption)}.hds-breadcrumbs a{font:var(--hds-typography-caption)}.hds-breadcrumbs li .hds-link{padding-bottom:2px}.hds-breadcrumbs li:first-child:before{display:none}.hds-breadcrumbs li:last-child{color:var(--hds-ui-colors-dark-grey)}.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){.hds-breadcrumbs li:not(:only-child){display:none}.hds-breadcrumbs li:nth-last-of-type(2){display:inherit}.hds-breadcrumbs li:nth-last-of-type(2):before{background-image:var(--hds-breadcrumb-image-left);margin-left:0;display:inline-block}}.hds-tabs{--hds-tabs-border-active-size:var(--hds-stroke-thick);font:var(--hds-typography-body)}.hds-tabs .hds-tabs--list{width:auto;padding-left:0;display:inline-flex}.hds-tabs .hds-tabs--list.hds-tabs--list-horizontal{color:red}@media (min-width:720px){.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}.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}.hds-tabs .hds-tabs--list.hds-tabs--list-horizontal .hds-tabs--tab.hds-tabs--tab-active{border-bottom-color:var(--hds-brand-colors-signature)}.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){.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}.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}.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)}}.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}.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}.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)}.hds-tabs .hds-tabs--list .hds-tabs--tab{cursor:pointer;font:var(--hds-typography-body);text-align:left;background:0 0;border:0}.hds-tabs .hds-tabs--list .hds-tabs--tab:hover{color:var(--hds-brand-colors-dark)}.hds-tabs .hds-tabs--list .hds-tabs--tab.hds-tabs--tab-active{color:var(--hds-brand-colors-dark)}.hds-tabs .hds-tabs--contents{margin-top:var(--hds-spacing-large-2)}.hds-textarea{gap:var(--hds-spacing-small-1);flex-flow:column;display:flex}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper[data-readonly=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only):focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:disabled){border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper[data-disabled=true]{border-bottom:var(--hds-stroke-thick)solid var(--hds-ui-colors-warning-yellow);margin-bottom:calc(var(--hds-stroke-thick) - var(--hds-stroke-default))}.hds-textarea.hds-textarea--error .hds-textarea__textarea-wrapper{background-image:url("data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>");background-repeat:no-repeat;background-position-x:calc(100% - var(--hds-spacing-small-4));padding-right:calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));background-position-y:50%}.hds-textarea .hds-textarea__textarea-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-textarea.hds-textarea--default .hds-textarea__textarea-wrapper{background-color:var(--hds-ui-colors-light-grey-fill)}.hds-textarea.hds-textarea--white .hds-textarea__textarea-wrapper{background-color:var(--hds-ui-colors-white)}.hds-textarea:focus-within .hds-textarea__label{color:var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__label{transition:color var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);font:var(--hds-typography-caption)}.hds-textarea:has(.hds-textarea__textarea:read-only,.hds-textarea__textarea:disabled):not(:focus-within) .hds-textarea__label{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__textarea-wrapper{border:var(--hds-stroke-default)solid transparent;border-radius:var(--hds-border-radius);transition:border var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal),margin var(--hds-micro-animation-duration-quick)var(--hds-micro-animation-easing-normal);box-sizing:border-box;flex-flow:row;width:100%;display:flex}.hds-textarea .hds-textarea__textarea-wrapper:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only):focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__textarea-wrapper[data-readonly=true]:focus-within{border-bottom:var(--hds-stroke-default)solid var(--hds-brand-colors-darker)}.hds-textarea .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea: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)}.hds-textarea .hds-textarea__textarea-wrapper[data-readonly=true]{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)}.hds-textarea .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea: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)}.hds-textarea .hds-textarea__textarea-wrapper[data-disabled=true]{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)}.hds-textarea .hds-textarea__textarea{color:var(--hds-ui-colors-black);padding:var(--hds-spacing-small-4);font:var(--hds-typography-body-small);background:0 0;border:0;width:100%;line-height:normal}.hds-textarea .hds-textarea__textarea::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-textarea .hds-textarea__textarea::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-textarea .hds-textarea__textarea::placeholder{color:var(--hds-ui-colors-dark-grey);opacity:1}.hds-textarea .hds-textarea__textarea:focus{outline:0}.hds-textarea .hds-textarea__textarea:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-textarea .hds-textarea__textarea:focus::-ms-input-placeholder{color:var(--hds-ui-colors-grey)}.hds-textarea .hds-textarea__textarea:focus::placeholder{color:var(--hds-ui-colors-grey)}.hds-textarea .hds-textarea__textarea:read-only:focus::-webkit-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__textarea:read-only:focus::-ms-input-placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__textarea:read-only:focus::placeholder{color:var(--hds-ui-colors-dark-grey)}.hds-textarea .hds-textarea__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)}
|
|
2
2
|
/*# sourceMappingURL=./index.css.map */
|
package/dist/index.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"mappings":"ACMA,8NAWA,2CAUA,uCAIA,uCAIA,wCASA,+CC5CA,ygBAsBE,oXAeA,2TAUA,0TAcA,wCAIA,+CAGE,yBAAyB,iDAS3B,sKAKE,uJAKA,kJAMF,mJAKE,+HAKA,oIAMF,sQASE,6JAAA,8JAQF,6QASE,yJAAA,0JAQF,gQASE,mHAAA,oHAcA,6OAAA,+OAWA,6MAAA,+MAXA,8OAAA,gPAWA,8MAAA,gNAXA,qPAAA,uPAWA,qNAAA,uNAeF,0GAaE,2EAIE,6EAMF,4EAIE,8EAMF,2EAIE,6ECjON,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,8FC5CF,uEAGE,sKAKA,sKAMF,uDAGE,sIAKA,sIAMF,uDAGE,sIAKA,sIAMF,wDAGE,wIAKA,wIAMF,oEAGE,gKAKA,gKAMF,qDAGE,kIAKA,kIAMF,iEAGE,0JAKA,0JAMF,iEAGE,0JAKA,0JAMF,6EAGE,kLAKA,kLAMF,2DAIA,uEAIA,+DAGE,sJAKA,sJAMF,2EAGE,8KAKA,8KASF,8FAQA,sFAIA,oGAKA,+PAeA,kHCxMA,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,wEAMI,6MAAA,0NAAA,8OAAA,iOAAA,2PAAA,8OAAA,6OAAA,iOAYA,glCAWA,2FAAA,8GAMA,kGAKF,+EAIA,mKAMA,iJAKA,uXAWE,8HAAA,+JAAA,kJAMA,sNAAA,yMAAA,qNAAA,yMAUF,6LASE,uGAAA,mGAAA,yFAKA,6CAGE,8FAAA,0FAAA,gFAKF,6GAAA,yGAAA,+FAKF,oLE7GF,iZAKE,yBAAyB,mKAYzB,mDAGE,+HAIA,oFAIA,6YAaE,kHAKA,kQAOE,gNAAA,qNAMA,6HAMA,gMAMJ,2LAIE,+GE3EN,yEAKE,0PAWE,iNAAA,8NAAA,mPAAA,qOAQA,2PAME,u7BAOJ,g7CAgDE,8RAUE,kFAIA,2JAMJ,kHAIA,o0BAoCA,sLHjJF,qEAIE,2LAAA,uLAAA,mLAQA,+OAYA,yBAAyB,yGAazB,uCAKA,uFAQF,wHElDA,onCAYE,oDAAA,sDAWE,iDAKE,oDAKF,oEAIA,8JAQA,6BACE,kDAIA,wDAGE,qIErDR,gGAKE,wEAKE,8DAGE,yBAAyB,yJAIvB,yKAIE,8IAIA,8HAMJ,6BAAwB,sJAKtB,2IAIE,uOAQN,oJAKE,yIAIE,oOAOJ,gIAOE,kFAIA,iGAMJ,oECjFF,2EAMI,yNAAA,sOAAA,gQAAA,6OAAA,6QAAA,0PAAA,+PAAA,6OAYA,4lCAWA,oGAAA,0HAMA,8GAKF,qFAIA,yKAMA,mKAKA,gYAWE,uIAAA,8KAAA,2JAMA,qOAAA,kNAAA,oOAAA,kNAUF,sMASE,gHAAA,4GAAA,kGAKA,sDAGE,uGAAA,mGAAA,yFAKF,sHAAA,kHAAA,wGAKF","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/modal/modal.css","../src/accordion/accordion.css","../src/breadcrumb/breadcrumb.css","../src/select/select.css","../src/tabs/tabs.css","../src/textarea/textarea.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(\"select/select.css\");\n@import url(\"modal/modal.css\");\n@import url(\"breadcrumb/breadcrumb.css\");\n@import url(\"tabs/tabs.css\");\n@import url(\"textarea/textarea.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\n /* The height can be more if the text inside the button wraps */\n min-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\n /* The height can be more if the text inside the button wraps */\n min-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\n /* The height can be more if the text inside the button wraps */\n min-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-default);\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-default);\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-default);\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--lighter {\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","/**\n * Font\n */\n.hds-typography-h1-display {\n font: var(--hds-brand-typography-h1-display);\n\n &.hds-typography-h1-display--min {\n font-size: var(--hds-brand-font-size-h1-display-min);\n line-height: var(--hds-brand-line-height-h1-display-min);\n }\n\n &.hds-typography-h1-display--max {\n font-size: var(--hds-brand-font-size-h1-display-max);\n line-height: var(--hds-brand-line-height-h1-display-max);\n }\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--min {\n font-size: var(--hds-brand-font-size-h1-min);\n line-height: var(--hds-brand-line-height-h1-min);\n }\n\n &.hds-typography-h1--max {\n font-size: var(--hds-brand-font-size-h1-max);\n line-height: var(--hds-brand-line-height-h1-max);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--min {\n font-size: var(--hds-brand-font-size-h2-min);\n line-height: var(--hds-brand-line-height-h2-min);\n }\n\n &.hds-typography-h2--max {\n font-size: var(--hds-brand-font-size-h2-max);\n line-height: var(--hds-brand-line-height-h2-max);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--min {\n font-size: var(--hds-font-size-header-h3-min);\n line-height: var(--hds-line-height-header-h3-min);\n }\n\n &.hds-typography-h3--max {\n font-size: var(--hds-font-size-header-h3-max);\n line-height: var(--hds-line-height-header-h3-max);\n }\n}\n\n.hds-typography-h3-title {\n font: var(--hds-typography-header-h3-title);\n\n &.hds-typography-h3-title--min {\n font-size: var(--hds-font-size-header-h3-title-min);\n line-height: var(--hds-line-height-header-h3-title-min);\n }\n\n &.hds-typography-h3-title--max {\n font-size: var(--hds-font-size-header-h3-title-max);\n line-height: var(--hds-line-height-header-h3-title-max);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--min {\n font-size: var(--hds-font-size-body-min);\n line-height: var(--hds-line-height-body-min);\n }\n\n &.hds-typography-body--max {\n font-size: var(--hds-font-size-body-max);\n line-height: var(--hds-line-height-body-max);\n }\n}\n\n.hds-typography-body-title {\n font: var(--hds-typography-body-title);\n\n &.hds-typography-body-title--min {\n font-size: var(--hds-font-size-body-title-min);\n line-height: var(--hds-line-height-body-title-min);\n }\n\n &.hds-typography-body-title--max {\n font-size: var(--hds-font-size-body-title-max);\n line-height: var(--hds-line-height-body-title-max);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--min {\n font-size: var(--hds-font-size-body-small-min);\n line-height: var(--hds-line-height-body-small-min);\n }\n\n &.hds-typography-body-small--max {\n font-size: var(--hds-font-size-body-small-max);\n line-height: var(--hds-line-height-body-small-max);\n }\n}\n\n.hds-typography-body-small-title {\n font: var(--hds-typography-body-small-title);\n\n &.hds-typography-body-small-title--min {\n font-size: var(--hds-font-size-body-small-title-min);\n line-height: var(--hds-line-height-body-small-title-min);\n }\n\n &.hds-typography-body-small-title--max {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n}\n\n.hds-typography-caption-title {\n font: var(--hds-typography-caption-title);\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--min {\n font-size: var(--hds-font-size-technical-min);\n line-height: var(--hds-line-height-technical-min);\n }\n\n &.hds-typography-technical--max {\n font-size: var(--hds-font-size-technical-max);\n line-height: var(--hds-line-height-technical-max);\n }\n}\n\n.hds-typography-technical-title {\n font: var(--hds-typography-technical-title);\n\n &.hds-typography-technical-title--min {\n font-size: var(--hds-font-size-technical-title-min);\n line-height: var(--hds-line-height-technical-title-min);\n }\n\n &.hds-typography-technical-title--max {\n font-size: var(--hds-font-size-technical-title-max);\n line-height: var(--hds-line-height-technical-title-max);\n }\n}\n\n/**\n * Spacing\n */\n.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\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.hds-typography-h3--spacing,\n.hds-typography-h3-title--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-body--spacing,\n.hds-typography-body-title--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-body-small--spacing,\n.hds-typography-body-small-title--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-caption--spacing,\n.hds-typography-caption-title--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-technical--spacing,\n.hds-typography-technical-title--spacing {\n margin-top: var(--hds-spacing-small-1);\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__input-wrapper,\n .hds-input__input-wrapper:focus-within,\n .hds-input__input-wrapper:has(.hds-input__input:read-only),\n .hds-input__input-wrapper[data-readonly=\"true\"] /* Fallback for :has */,\n .hds-input__input-wrapper:has(.hds-input__input:read-only):focus-within,\n .hds-input__input-wrapper[data-readonly=\"true\"]:focus-within /* Fallback for :has */,\n .hds-input__input-wrapper:has(.hds-input__input:disabled),\n .hds-input__input-wrapper[data-disabled=\"true\"] /* Fallback for :has */ {\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 .hds-input__input-wrapper {\n background-image: url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>');\n background-repeat: no-repeat;\n background-position-x: calc(100% - var(--hds-spacing-small-4));\n background-position-y: center;\n padding-right: calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));\n }\n }\n\n &, /* Default */\n &.hds-input--default {\n .hds-input__input-wrapper {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-input--white {\n .hds-input__input-wrapper {\n background-color: var(--hds-ui-colors-white);\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-quick)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n }\n\n &:has(.hds-input__input:read-only, .hds-input__input:disabled):not(:focus-within)\n .hds-input__label {\n color: var(--hds-ui-colors-dark-grey);\n }\n\n & .hds-input__input-wrapper {\n display: flex;\n flex-flow: row nowrap;\n width: 100%;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition:\n border var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal),\n margin var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n\n &:focus-within,\n &:has(.hds-input__input:read-only):focus-within,\n &[data-readonly=\"true\"]:focus-within /* Fallback for :has */ {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n }\n\n &:has(.hds-input__input:read-only),\n &[data-readonly=\"true\"] /* Fallback for :has */,\n &:has(.hds-input__input:disabled),\n &[data-disabled=\"true\"] /* Fallback for :has */ {\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\n & .hds-input__input {\n color: var(--hds-ui-colors-black);\n width: 100%;\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: 0;\n background: transparent;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:read-only:focus::placeholder {\n color: var(--hds-ui-colors-dark-grey);\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 }\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-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-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-select {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n & label.hds-select__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\n &.hds-select--error {\n .hds-select__select-wrapper,\n .hds-select__select-wrapper:focus-within,\n .hds-select__select-wrapper:has(.hds-select__select:disabled),\n .hds-select__select-wrapper[data-disabled=\"true\"] /* Fallback for :has */ {\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 .hds-select__select-wrapper {\n background-repeat: no-repeat;\n background-position-x: calc(100% - var(--hds-spacing-small-4));\n background-position-y: center;\n padding-right: calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));\n\n &::after {\n content: url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>');\n padding-top: var(--hds-spacing-small-4);\n }\n }\n }\n\n & .hds-select__select-wrapper {\n display: flex;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n font: var(--hds-typography-body-small);\n width: 100%;\n height: 58px; /* should this be a token? */\n cursor: pointer;\n transition:\n border-color var(--hds-micro-animation-duration-normal)\n 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 & select.hds-select__select {\n color: var(--hds-ui-colors-black);\n width: 100%;\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: 0;\n background: transparent;\n appearance: none; /* Hide default arrow */\n\n &:focus {\n outline: 0;\n }\n\n &:focus-within {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n }\n }\n }\n\n &.hds-select--default .hds-select__select-wrapper {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n\n &.hds-select--white .hds-select__select-wrapper {\n background-color: var(--hds-ui-colors-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-select__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 }\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\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\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",".hds-textarea {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n &.hds-textarea--error {\n .hds-textarea__textarea-wrapper,\n .hds-textarea__textarea-wrapper:focus-within,\n .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only),\n .hds-textarea__textarea-wrapper[data-readonly=\"true\"] /* Fallback for :has */,\n .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only):focus-within,\n .hds-textarea__textarea-wrapper[data-readonly=\"true\"]:focus-within /* Fallback for :has */,\n .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:disabled),\n .hds-textarea__textarea-wrapper[data-disabled=\"true\"] /* Fallback for :has */ {\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 .hds-textarea__textarea-wrapper {\n background-image: url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>');\n background-repeat: no-repeat;\n background-position-x: calc(100% - var(--hds-spacing-small-4));\n background-position-y: center;\n padding-right: calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));\n }\n }\n\n &, /* Default */\n &.hds-textarea--default {\n .hds-textarea__textarea-wrapper {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-textarea--white {\n .hds-textarea__textarea-wrapper {\n background-color: var(--hds-ui-colors-white);\n }\n }\n\n &:focus-within .hds-textarea__label {\n color: var(--hds-brand-colors-darker);\n }\n\n & .hds-textarea__label {\n transition: color var(--hds-micro-animation-duration-quick)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n }\n\n &:has(.hds-textarea__textarea:read-only, .hds-textarea__textarea:disabled):not(:focus-within)\n .hds-textarea__label {\n color: var(--hds-ui-colors-dark-grey);\n }\n\n & .hds-textarea__textarea-wrapper {\n display: flex;\n flex-flow: row nowrap;\n width: 100%;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition:\n border var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal),\n margin var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n\n &:focus-within,\n &:has(.hds-textarea__textarea:read-only):focus-within,\n &[data-readonly=\"true\"]:focus-within /* Fallback for :has */ {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n }\n\n &:has(.hds-textarea__textarea:read-only),\n &[data-readonly=\"true\"] /* Fallback for :has */,\n &:has(.hds-textarea__textarea:disabled),\n &[data-disabled=\"true\"] /* Fallback for :has */ {\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\n & .hds-textarea__textarea {\n color: var(--hds-ui-colors-black);\n width: 100%;\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: 0;\n background: transparent;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:read-only:focus::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n }\n }\n\n & .hds-textarea__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 }\n}\n"],"names":[]}
|
|
1
|
+
{"version":3,"mappings":"ACMA,8NAWA,2CAUA,uCAIA,uCAIA,wCASA,+CE5CA,ygBAsBE,oXAeA,2TAUA,0TAcA,wCAIA,+CAGE,yBAAyB,iDAS3B,sKAKE,uJAKA,kJAMF,mJAKE,+HAKA,oIAMF,sQASE,6JAAA,8JAQF,6QASE,yJAAA,0JAQF,gQASE,mHAAA,oHAcA,6OAAA,+OAWA,6MAAA,+MAXA,8OAAA,gPAWA,8MAAA,gNAXA,qPAAA,uPAWA,qNAAA,uNAeF,0GAaE,2EAIE,6EAMF,4EAIE,8EAMF,2EAIE,6EEjON,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,8FE5CF,uEAGE,sKAKA,sKAMF,uDAGE,sIAKA,sIAMF,uDAGE,sIAKA,sIAMF,wDAGE,wIAKA,wIAMF,oEAGE,gKAKA,gKAMF,qDAGE,kIAKA,kIAMF,iEAGE,0JAKA,0JAMF,iEAGE,0JAKA,0JAMF,6EAGE,kLAKA,kLAMF,2DAIA,uEAIA,+DAGE,sJAKA,sJAMF,2EAGE,8KAKA,8KASF,8FAQA,sFAIA,oGAKA,+PAeA,kHExMA,mKAIE,+DAAA,mFAKA,2EAIA,yGAKA,+EAOA,yBAAyB,kEAOzB,sCASF,yhCAmBE,oFAKA,0GbjEF,yWAIE,yBAAyB,0FAazB,yOASA,gGAGE,8iBAKF,4GAGE,06BAKF,+FAGE,25BAKF,gGAIE,yNASF,kDAAA,wDAMA,8GAAA,qGAIA,+EAIA,yGAGE,yBAAyB,0GEhF7B,wEAMI,6MAAA,0NAAA,8OAAA,iOAAA,2PAAA,8OAAA,6OAAA,iOAYA,glCAWA,2FAAA,8GAMA,kGAKF,+EAIA,mKAMA,iJAKA,uXAWE,8HAAA,+JAAA,kJAMA,sNAAA,yMAAA,qNAAA,yMAUF,6LASE,uGAAA,mGAAA,yFAKA,6CAGE,8FAAA,0FAAA,gFAKF,6GAAA,yGAAA,+FAKF,oLE7GF,qZAKE,yBAAyB,mKAYzB,mDAGE,+HAIA,oFAIA,6YAaE,kHAKA,kQAOE,gNAAA,qNAMA,6HAMA,gMAMJ,2LAIE,+GE3EN,yEAKE,0PAWE,iNAAA,8NAAA,mPAAA,qOAQA,2PAME,u7BAOJ,g7CAgDE,8RAUE,kFAIA,2JAMJ,kHAIA,o0BAoCA,sLEjJF,qEAIE,2LAAA,uLAAA,mLAQA,+OAYA,yBAAyB,yGAazB,uCAKA,uFAQF,wHElDA,onCAYE,oDAAA,sDAWE,iDAKE,oDAKF,oEAIA,8JAQA,6BACE,kDAIA,wDAGE,qIErDR,gGAKE,wEAKE,8DAGE,yBAAyB,yJAIvB,yKAIE,8IAIA,8HAMJ,6BAAwB,sJAKtB,2IAIE,uOAQN,oJAKE,yIAIE,oOAOJ,gIAOE,kFAIA,iGAMJ,oEEjFF,2EAMI,yNAAA,sOAAA,gQAAA,6OAAA,6QAAA,0PAAA,+PAAA,6OAYA,4lCAWA,oGAAA,0HAMA,8GAKF,qFAIA,yKAMA,mKAKA,gYAWE,uIAAA,8KAAA,2JAMA,qOAAA,kNAAA,oOAAA,kNAUF,sMASE,gHAAA,4GAAA,kGAKA,sDAGE,uGAAA,mGAAA,yFAKF,sHAAA,kHAAA,wGAKF","sources":["../src/index.css","../src/body.css","../src/message/message.css","../src/button/button.css","../src/input/input.css","../src/link/link.css","../src/accordion/accordion.css","../src/badge/badge.css","../src/select/select.css","../src/list/description-list.css","../src/modal/modal.css","../src/list/list.css","../src/breadcrumb/breadcrumb.css","../src/typography/typography.css","../src/tabs/tabs.css","../src/box/box.css","../src/textarea/textarea.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(\"select/select.css\");\n@import url(\"modal/modal.css\");\n@import url(\"breadcrumb/breadcrumb.css\");\n@import url(\"tabs/tabs.css\");\n@import url(\"textarea/textarea.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.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-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\n /* The height can be more if the text inside the button wraps */\n min-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\n /* The height can be more if the text inside the button wraps */\n min-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\n /* The height can be more if the text inside the button wraps */\n min-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-default);\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-default);\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-default);\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-input {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n &.hds-input--error {\n .hds-input__input-wrapper,\n .hds-input__input-wrapper:focus-within,\n .hds-input__input-wrapper:has(.hds-input__input:read-only),\n .hds-input__input-wrapper[data-readonly=\"true\"] /* Fallback for :has */,\n .hds-input__input-wrapper:has(.hds-input__input:read-only):focus-within,\n .hds-input__input-wrapper[data-readonly=\"true\"]:focus-within /* Fallback for :has */,\n .hds-input__input-wrapper:has(.hds-input__input:disabled),\n .hds-input__input-wrapper[data-disabled=\"true\"] /* Fallback for :has */ {\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 .hds-input__input-wrapper {\n background-image: url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>');\n background-repeat: no-repeat;\n background-position-x: calc(100% - var(--hds-spacing-small-4));\n background-position-y: center;\n padding-right: calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));\n }\n }\n\n &, /* Default */\n &.hds-input--default {\n .hds-input__input-wrapper {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-input--white {\n .hds-input__input-wrapper {\n background-color: var(--hds-ui-colors-white);\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-quick)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n }\n\n &:has(.hds-input__input:read-only, .hds-input__input:disabled):not(:focus-within)\n .hds-input__label {\n color: var(--hds-ui-colors-dark-grey);\n }\n\n & .hds-input__input-wrapper {\n display: flex;\n flex-flow: row nowrap;\n width: 100%;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition:\n border var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal),\n margin var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n\n &:focus-within,\n &:has(.hds-input__input:read-only):focus-within,\n &[data-readonly=\"true\"]:focus-within /* Fallback for :has */ {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n }\n\n &:has(.hds-input__input:read-only),\n &[data-readonly=\"true\"] /* Fallback for :has */,\n &:has(.hds-input__input:disabled),\n &[data-disabled=\"true\"] /* Fallback for :has */ {\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\n & .hds-input__input {\n color: var(--hds-ui-colors-black);\n width: 100%;\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: 0;\n background: transparent;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:read-only:focus::placeholder {\n color: var(--hds-ui-colors-dark-grey);\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 }\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-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-default) solid var(--hds-ui-colors-light-grey-stroke);\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","/**\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--lighter {\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-select {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n & label.hds-select__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\n &.hds-select--error {\n .hds-select__select-wrapper,\n .hds-select__select-wrapper:focus-within,\n .hds-select__select-wrapper:has(.hds-select__select:disabled),\n .hds-select__select-wrapper[data-disabled=\"true\"] /* Fallback for :has */ {\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 .hds-select__select-wrapper {\n background-repeat: no-repeat;\n background-position-x: calc(100% - var(--hds-spacing-small-4));\n background-position-y: center;\n padding-right: calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));\n\n &::after {\n content: url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>');\n padding-top: var(--hds-spacing-small-4);\n }\n }\n }\n\n & .hds-select__select-wrapper {\n display: flex;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n font: var(--hds-typography-body-small);\n width: 100%;\n height: 58px; /* should this be a token? */\n cursor: pointer;\n transition:\n border-color var(--hds-micro-animation-duration-normal)\n 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 & select.hds-select__select {\n color: var(--hds-ui-colors-black);\n width: 100%;\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: 0;\n background: transparent;\n appearance: none; /* Hide default arrow */\n\n &:focus {\n outline: 0;\n }\n\n &:focus-within {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n }\n }\n }\n\n &.hds-select--default .hds-select__select-wrapper {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n\n &.hds-select--white .hds-select__select-wrapper {\n background-color: var(--hds-ui-colors-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-select__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 }\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-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-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-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","/**\n * Font\n */\n.hds-typography-h1-display {\n font: var(--hds-brand-typography-h1-display);\n\n &.hds-typography-h1-display--min {\n font-size: var(--hds-brand-font-size-h1-display-min);\n line-height: var(--hds-brand-line-height-h1-display-min);\n }\n\n &.hds-typography-h1-display--max {\n font-size: var(--hds-brand-font-size-h1-display-max);\n line-height: var(--hds-brand-line-height-h1-display-max);\n }\n}\n\n.hds-typography-h1 {\n font: var(--hds-brand-typography-h1);\n\n &.hds-typography-h1--min {\n font-size: var(--hds-brand-font-size-h1-min);\n line-height: var(--hds-brand-line-height-h1-min);\n }\n\n &.hds-typography-h1--max {\n font-size: var(--hds-brand-font-size-h1-max);\n line-height: var(--hds-brand-line-height-h1-max);\n }\n}\n\n.hds-typography-h2 {\n font: var(--hds-brand-typography-h2);\n\n &.hds-typography-h2--min {\n font-size: var(--hds-brand-font-size-h2-min);\n line-height: var(--hds-brand-line-height-h2-min);\n }\n\n &.hds-typography-h2--max {\n font-size: var(--hds-brand-font-size-h2-max);\n line-height: var(--hds-brand-line-height-h2-max);\n }\n}\n\n.hds-typography-h3 {\n font: var(--hds-typography-header-h3);\n\n &.hds-typography-h3--min {\n font-size: var(--hds-font-size-header-h3-min);\n line-height: var(--hds-line-height-header-h3-min);\n }\n\n &.hds-typography-h3--max {\n font-size: var(--hds-font-size-header-h3-max);\n line-height: var(--hds-line-height-header-h3-max);\n }\n}\n\n.hds-typography-h3-title {\n font: var(--hds-typography-header-h3-title);\n\n &.hds-typography-h3-title--min {\n font-size: var(--hds-font-size-header-h3-title-min);\n line-height: var(--hds-line-height-header-h3-title-min);\n }\n\n &.hds-typography-h3-title--max {\n font-size: var(--hds-font-size-header-h3-title-max);\n line-height: var(--hds-line-height-header-h3-title-max);\n }\n}\n\n.hds-typography-body {\n font: var(--hds-typography-body);\n\n &.hds-typography-body--min {\n font-size: var(--hds-font-size-body-min);\n line-height: var(--hds-line-height-body-min);\n }\n\n &.hds-typography-body--max {\n font-size: var(--hds-font-size-body-max);\n line-height: var(--hds-line-height-body-max);\n }\n}\n\n.hds-typography-body-title {\n font: var(--hds-typography-body-title);\n\n &.hds-typography-body-title--min {\n font-size: var(--hds-font-size-body-title-min);\n line-height: var(--hds-line-height-body-title-min);\n }\n\n &.hds-typography-body-title--max {\n font-size: var(--hds-font-size-body-title-max);\n line-height: var(--hds-line-height-body-title-max);\n }\n}\n\n.hds-typography-body-small {\n font: var(--hds-typography-body-small);\n\n &.hds-typography-body-small--min {\n font-size: var(--hds-font-size-body-small-min);\n line-height: var(--hds-line-height-body-small-min);\n }\n\n &.hds-typography-body-small--max {\n font-size: var(--hds-font-size-body-small-max);\n line-height: var(--hds-line-height-body-small-max);\n }\n}\n\n.hds-typography-body-small-title {\n font: var(--hds-typography-body-small-title);\n\n &.hds-typography-body-small-title--min {\n font-size: var(--hds-font-size-body-small-title-min);\n line-height: var(--hds-line-height-body-small-title-min);\n }\n\n &.hds-typography-body-small-title--max {\n font-size: var(--hds-font-size-body-small-title-max);\n line-height: var(--hds-line-height-body-small-title-max);\n }\n}\n\n.hds-typography-caption {\n font: var(--hds-typography-caption);\n}\n\n.hds-typography-caption-title {\n font: var(--hds-typography-caption-title);\n}\n\n.hds-typography-technical {\n font: var(--hds-typography-technical);\n\n &.hds-typography-technical--min {\n font-size: var(--hds-font-size-technical-min);\n line-height: var(--hds-line-height-technical-min);\n }\n\n &.hds-typography-technical--max {\n font-size: var(--hds-font-size-technical-max);\n line-height: var(--hds-line-height-technical-max);\n }\n}\n\n.hds-typography-technical-title {\n font: var(--hds-typography-technical-title);\n\n &.hds-typography-technical-title--min {\n font-size: var(--hds-font-size-technical-title-min);\n line-height: var(--hds-line-height-technical-title-min);\n }\n\n &.hds-typography-technical-title--max {\n font-size: var(--hds-font-size-technical-title-max);\n line-height: var(--hds-line-height-technical-title-max);\n }\n}\n\n/**\n * Spacing\n */\n.hds-typography-h1--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\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.hds-typography-h3--spacing,\n.hds-typography-h3-title--spacing {\n margin-top: var(--hds-spacing-large-2);\n}\n\n.hds-typography-body--spacing,\n.hds-typography-body-title--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-body-small--spacing,\n.hds-typography-body-small-title--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-caption--spacing,\n.hds-typography-caption-title--spacing {\n margin-top: var(--hds-spacing-medium-2);\n}\n\n.hds-typography-technical--spacing,\n.hds-typography-technical-title--spacing {\n margin-top: var(--hds-spacing-small-1);\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\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\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",".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-textarea {\n display: flex;\n flex-flow: column nowrap;\n gap: var(--hds-spacing-small-1);\n\n &.hds-textarea--error {\n .hds-textarea__textarea-wrapper,\n .hds-textarea__textarea-wrapper:focus-within,\n .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only),\n .hds-textarea__textarea-wrapper[data-readonly=\"true\"] /* Fallback for :has */,\n .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:read-only):focus-within,\n .hds-textarea__textarea-wrapper[data-readonly=\"true\"]:focus-within /* Fallback for :has */,\n .hds-textarea__textarea-wrapper:has(.hds-textarea__textarea:disabled),\n .hds-textarea__textarea-wrapper[data-disabled=\"true\"] /* Fallback for :has */ {\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 .hds-textarea__textarea-wrapper {\n background-image: url('data:image/svg+xml,<svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\"><rect fill=\"black\" height=\"12\" rx=\"3\" width=\"6\" x=\"9\" y=\"7\" /><path d=\"M22.3552 18.4687C22.998 19.5938 22.1944 21 20.8685 21H3.7123C2.38641 21 1.58283 19.5938 2.22569 18.4687L10.8239 3.84375C11.4668 2.71875 13.1141 2.71875 13.7971 3.84375L22.3552 18.4687ZM11.3462 8.46429V13.6071C11.3462 14.1696 11.8284 14.5714 12.3105 14.5714C12.8328 14.5714 13.2748 14.1696 13.2748 13.6071V8.46429C13.2748 7.94196 12.8328 7.5 12.3105 7.5C11.748 7.5 11.3462 7.94196 11.3462 8.46429ZM12.3105 18.4286C12.9935 18.4286 13.556 17.8661 13.556 17.183C13.556 16.5 12.9935 15.9375 12.3105 15.9375C11.5873 15.9375 11.0248 16.5 11.0248 17.183C11.0248 17.8661 11.5873 18.4286 12.3105 18.4286Z\" fill=\"%23FDBB2F\" /></svg>');\n background-repeat: no-repeat;\n background-position-x: calc(100% - var(--hds-spacing-small-4));\n background-position-y: center;\n padding-right: calc(var(--hds-spacing-small-4) + var(--hds-spacing-medium-2));\n }\n }\n\n &, /* Default */\n &.hds-textarea--default {\n .hds-textarea__textarea-wrapper {\n background-color: var(--hds-ui-colors-light-grey-fill);\n }\n }\n\n &.hds-textarea--white {\n .hds-textarea__textarea-wrapper {\n background-color: var(--hds-ui-colors-white);\n }\n }\n\n &:focus-within .hds-textarea__label {\n color: var(--hds-brand-colors-darker);\n }\n\n & .hds-textarea__label {\n transition: color var(--hds-micro-animation-duration-quick)\n var(--hds-micro-animation-easing-normal);\n font: var(--hds-typography-caption);\n }\n\n &:has(.hds-textarea__textarea:read-only, .hds-textarea__textarea:disabled):not(:focus-within)\n .hds-textarea__label {\n color: var(--hds-ui-colors-dark-grey);\n }\n\n & .hds-textarea__textarea-wrapper {\n display: flex;\n flex-flow: row nowrap;\n width: 100%;\n border: var(--hds-stroke-default) solid transparent;\n border-radius: var(--hds-border-radius);\n transition:\n border var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal),\n margin var(--hds-micro-animation-duration-quick) var(--hds-micro-animation-easing-normal);\n box-sizing: border-box;\n\n &:focus-within,\n &:has(.hds-textarea__textarea:read-only):focus-within,\n &[data-readonly=\"true\"]:focus-within /* Fallback for :has */ {\n border-bottom: var(--hds-stroke-default) solid var(--hds-brand-colors-darker);\n }\n\n &:has(.hds-textarea__textarea:read-only),\n &[data-readonly=\"true\"] /* Fallback for :has */,\n &:has(.hds-textarea__textarea:disabled),\n &[data-disabled=\"true\"] /* Fallback for :has */ {\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\n & .hds-textarea__textarea {\n color: var(--hds-ui-colors-black);\n width: 100%;\n padding: var(--hds-spacing-small-4);\n font: var(--hds-typography-body-small);\n line-height: normal;\n border: 0;\n background: transparent;\n\n &::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n opacity: 1;\n }\n\n &:focus {\n outline: 0;\n\n &::placeholder {\n color: var(--hds-ui-colors-grey);\n }\n }\n\n &:read-only:focus::placeholder {\n color: var(--hds-ui-colors-dark-grey);\n }\n }\n\n & .hds-textarea__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 }\n}\n"],"names":[]}
|