@dnb/eufemia 10.30.2 → 10.32.0

package/cjs/style/themes/theme-ui/ui-theme-extensions.css

@@ -245,9 +245,6 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   margin-left: 0;
 }
 
-.dnb-forms-field-block {
-  width: 100%;
-}
 .dnb-forms-field-block__grid {
   display: grid;
 }
@@ -269,6 +266,7 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   grid-template-areas: "label contents" "status status";
 }
 .dnb-forms-field-block--width-stretch {
+  width: 100%;
   flex-grow: 1;
 }
 @media screen and (min-width: 25em) {
@@ -523,7 +521,6 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
 }
 .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing] {
   border-radius: 0.375rem;
-  box-shadow: inset 0 0 0 2px var(--block-outline-color);
 }
 .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small {
   --space: var(--spacing-small);
@@ -534,6 +531,9 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
 .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large {
   --space: var(--spacing-large);
 }
+.dnb-forms-iterate-block--variant-outline .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing] {
+  box-shadow: inset 0 0 0 2px var(--block-outline-color);
+}
 .dnb-forms-iterate-block__inner .dnb-dl .dnb-dd {
   margin-bottom: 0;
 }
@@ -669,7 +669,6 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
   outline: none;
 }
 .dnb-forms-wizard-layout__contents .dnb-card {
-  --border-color: var(--color-pistachio);
   max-width: var(--forms-card-max-width);
 }
 .dnb-forms-wizard-layout__contents .dnb-forms-step > .appear-fx,
@@ -1106,6 +1105,10 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
   font-size: var(--font-size-small);
 }
 
+.dnb-forms-wizard-layout__contents .dnb-card {
+  --border-color: var(--color-pistachio);
+}
+
 /*
 * PaymentCard theme
 *

package/cjs/style/themes/theme-ui/ui-theme-extensions.min.css

@@ -1,5 +1,5 @@
-@charset "UTF-8";.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{row-gap:0}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap;row-gap:var(--spacing-x-small)}@media screen and (min-width:40em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{display:flex}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button{color:var(--color-fire-red)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button:hover{color:var(--color-white)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}@media screen and (max-width:15em){.dnb-forms-field-number .dnb-input__shell,.dnb-forms-field-string .dnb-input__shell{width:90%}}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block{width:100%}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:25em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__status .dnb-form-status__shell{margin-top:.5rem}@media screen and (max-width:15em){.dnb-forms-field-block__status{width:90%}}.dnb-forms-field-block__contents{grid-area:contents;width:100%}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__contents__composition--vertical{display:flex;flex-flow:column;row-gap:var(--spacing-small)}.dnb-forms-field-block__contents__composition--horizontal{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:25em){.dnb-forms-field-block__contents__composition--horizontal{align-items:flex-end}}@media screen and (max-width:25em){.dnb-forms-field-block__contents__composition--horizontal{flex-flow:column;row-gap:var(--spacing-x-small)}}.dnb-forms-button-row{display:flex;flex-flow:row;flex-wrap:wrap;gap:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]),.dnb-card+.dnb-forms-button-row:not([class*=space__top]){margin-top:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]) .dnb-button[class*=space__top],.dnb-card+.dnb-forms-button-row:not([class*=space__top]) .dnb-button[class*=space__top]{margin-top:0}@media screen and (min-width:40em){.dnb-card+.dnb-button--primary:not([class*=space__left]),.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}:root{--forms-card-max-width:36.5rem}.dnb-forms-form .dnb-card{max-width:var(--forms-card-max-width)}.dnb-spacing .dnb-forms-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-forms-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-forms-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-submit-indicator{--padding-left:0.5em;display:inline}.dnb-forms-submit-indicator__content{font-size:0;line-height:1em;transition:font-size .8s var(--easing-default);will-change:font-size}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;font-weight:var(--font-weight-bold)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon{color:var(--color-success-green);padding-left:var(--padding-left)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label{font-size:var(--font-size-small);padding-left:calc(var(--padding-left)*2)}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}.dnb-forms-iterate-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-iterate-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-iterate-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-iterate-block__inner{flex:1;margin-bottom:var(--space);padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-iterate-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem;box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-forms-iterate-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-iterate-block.dnb-height-animation--is-visible .dnb-forms-iterate-block__inner{transform:translateY(-.5rem)}.dnb-forms-iterate-block.dnb-height-animation--parallax .dnb-forms-iterate-block__inner{transform:translateY(0)}.dnb-forms-iterate__element{outline:none}.dnb-forms-iterate>.dnb-forms-iterate__element:has(.dnb-forms-iterate-block){margin-top:0}.dnb-forms-summary-list.dnb-dl .dnb-dt,.dnb-forms-summary-list.dnb-dl:not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-summary-list.dnb-dl.dnb-dl__layout--grid{row-gap:var(--spacing-medium)}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}.dnb-forms-wizard-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-wizard-layout--drawer{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__sidebar{flex:0;margin-bottom:2rem}.dnb-forms-wizard-layout__contents{flex:1}.dnb-forms-wizard-layout__contents .dnb-forms-step{outline:none}.dnb-forms-wizard-layout__contents .dnb-card{--border-color:var(--color-pistachio);max-width:var(--forms-card-max-width)}.dnb-forms-wizard-layout__contents .dnb-forms-button-row>.appear-fx,.dnb-forms-wizard-layout__contents .dnb-forms-step>.appear-fx{--appear-opacity:0;--appear-offset:-0.25rem;animation:appear .6s var(--easing-default) forwards;animation-delay:calc(var(--element-index, 0)*30ms);opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}@keyframes appear{0%{opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}80%{opacity:1}to{opacity:1;transform:translateZ(0)}}@media screen and (min-width:40em){.dnb-forms-wizard-layout+.dnb-form-status+.dnb-form-status:not([class*=space__left]),.dnb-forms-wizard-layout+.dnb-form-status:not([class*=space__left]){margin-left:var(--spacing-medium)}}@media screen and (max-width:60em){.dnb-forms-wizard-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__contents{flex-basis:auto}}.dnb-forms-wizard-layout .dnb-step-indicator__sidebar{margin-right:0}@media screen and (min-width:60em){.dnb-forms-form:has(.dnb-forms-wizard-layout--sidebar) .dnb-forms-status{margin-left:23rem}}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}:root{--sb-font-family-default:"Roboto","Helvetica","Arial",sans-serif;--sb-font-family-headings:"MaisonNeueHeadings","Roboto","Helvetica","Arial",sans-serif;--sb-font-weight-default:normal;--sb-font-weight-basis:normal;--sb-font-weight-regular:normal;--sb-font-weight-medium:500;--sb-font-weight-bold:700;--sb-font-size-x-small:0.75rem;--sb-font-size-small:0.875rem;--sb-font-size-basis:1rem;--sb-font-size-basis--em:1em;--sb-font-size-lead:1.25rem;--sb-font-size-medium:1.625rem;--sb-font-size-large:2rem;--sb-font-size-x-large:2.375rem;--sb-font-size-xx-large:3rem;--sb-line-height-x-small:1.125rem;--sb-line-height-small:1.25rem;--sb-line-height-basis:1.5rem;--sb-line-height-basis--em:1.5em;--sb-line-height-lead:1.75rem;--sb-line-height-medium:2rem;--sb-line-height-large:2.375rem;--sb-line-height-x-large:2.75rem;--sb-line-height-xx-large:3.375rem;--sb-color-black:#000;--sb-color-text:#18172a;--sb-color-gray-dark-3:#3a3a4a;--sb-color-gray-dark-3-neutral:#3e3e4a;--sb-color-gray-dark-2:#4a4a5b;--sb-color-gray-dark-2-neutral:#656472;--sb-color-gray-dark:#666578;--sb-color-gray-dark-neutral:#9494a3;--sb-color-gray:#bbbbce;--sb-color-gray-neutral:#bdbdc6;--sb-color-gray-light:#d9d9e4;--sb-color-gray-light-2:#ebebf2;--sb-color-gray-light-3:#f9f9fd;--sb-color-purple:#1c1b4e;--sb-color-purple-alternative:#222163;--sb-color-green:#92eecd;--sb-color-white:#fff;--sb-color-red:#d8134b;--sb-color-magenta:#ff3c64;--sb-color-orange:#ff5b44;--sb-color-yellow-dark:#f7bf16;--sb-color-yellow:#ffef57;--sb-color-green-dark-3:#00785b;--sb-color-green-dark-2:#1e9f73;--sb-color-violet:#4e08bc;--sb-color-violet-light:#7129e2;--sb-color-blue-dark-2:#044ccc;--sb-color-blue-dark:#005cff;--sb-color-blue:#008eff;--sb-color-orange-light:#ff817b;--sb-color-orange-light-2:#ffd7d5;--sb-color-orange-light-3:#fff0ef;--sb-color-magenta-light:#ffb6d2;--sb-color-magenta-light-2:#ffdbe9;--sb-color-magenta-light-3:#fff5f9;--sb-color-yellow-light:#fff489;--sb-color-yellow-light-2:#fff9c4;--sb-color-yellow-light-3:#fffce5;--sb-color-green-dark:#64d7b4;--sb-color-green-light:#c8f6e5;--sb-color-green-light-2:#e5fff7;--sb-color-violet-light-2:#be99ff;--sb-color-violet-light-3:#e0d0ff;--sb-color-violet-light-4:#f1ebff;--sb-color-blue-light:#61b9ff;--sb-color-blue-light-2:#bfe3ff;--sb-color-blue-light-3:#ebf6ff;--sb-spacing-x-small:0.5rem;--sb-spacing-small:1rem;--sb-spacing-medium:1.5rem;--sb-spacing-large:2rem;--sb-spacing-x-large:3rem;--sb-spacing-xx-large:3.5rem;--sb-layout-small:40em;--sb-layout-medium:60em;--sb-layout-large:72em;--sb-layout-x-large:80em;--sb-layout-xx-large:90em;--sb-shadow-small:0 2px 4px rgba(38,35,66,.12);--sb-shadow-medium:0 5px 20px rgba(38,35,66,.1);--sb-shadow-large:0 5px 20px rgba(38,35,66,.2);--sb-shadow-hover:0 20px 40px rgba(38,35,66,.2);--sb-easing-default:cubic-bezier(0.42,0,0,1)}.dnb-payment-card{--color-dark-cyan:#003b47;--dnb-payment-bg-default:linear-gradient(187.2deg,#008484 6.31%,var(--color-sea-green) 82.66%);--dnb-payment-bg-pluss:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-white:linear-gradient(184.55deg,var(--color-black-background) 4.63%,var(--color-white) 92.04%);--dnb-payment-bg-gold:linear-gradient(184.55deg,#bfa970 4.63%,#d3bd83 84.57%);--dnb-payment-bg-saga:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-private:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-business-no-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-business-with-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);margin:0}.dnb-payment-card__card{border-color:currentcolor;border-color:hsla(0,0%,100%,.1) transparent;border-radius:12px;border-style:solid;border-width:1px;box-shadow:var(--shadow-default);color:var(--color-white);height:216px;padding:16px;position:relative;transition:all 225ms cubic-bezier(0,0,.2,1) 0ms;width:343px}.dnb-payment-card__card--design-default{background:var(--dnb-payment-bg-default);color:var(--color-white)}.dnb-payment-card__card--design-pluss{background:var(--dnb-payment-bg-pluss);color:var(--color-white)}.dnb-payment-card__card--design-my-first,.dnb-payment-card__card--design-ung,.dnb-payment-card__card--design-youth{color:var(--color-black-80)}.dnb-payment-card__card--design-gold{background:var(--dnb-payment-bg-gold);color:var(--color-white)}.dnb-payment-card__card--design-saga{background:var(--dnb-payment-bg-saga);color:var(--color-white)}.dnb-payment-card__card--design-private{background:var(--dnb-payment-bg-private);color:var(--color-white)}.dnb-payment-card__card--design-black{background:var(--color-black);color:var(--color-white)}.dnb-payment-card__card--design-business-no-visa{background:var(--dnb-payment-bg-business-no-visa);color:var(--color-white)}.dnb-payment-card__card--design-business-with-visa{background:var(--dnb-payment-bg-business-with-visa);color:var(--color-white)}.dnb-payment-card__card--design-sbanken-mastercard{background:var(--sb-color-purple);color:var(--color-white)}.dnb-payment-card__card--design-sbanken-visa{background:var(--color-white);color:var(--sb-color-text)}.dnb-payment-card__card:after{background:radial-gradient(52.39% 52.39% at 50% 50%,hsla(56,52%,94%,.122) 0,rgba(6,6,6,0) 100%);border-radius:inherit;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.dnb-payment-card__card--design-sbanken-mastercard:after{background:none}.dnb-payment-card__card__content{display:flex;height:100%;position:relative;width:100%}.dnb-payment-card__card__wrapper{bottom:0;left:0;position:absolute}.dnb-spacing .dnb-payment-card__card .dnb-p{margin-bottom:0!important}.dnb-payment-card__card__holder{font-weight:var(--font-weight-medium);text-align:left;text-transform:uppercase}.dnb-payment-card__card__holder.dnb-p{font-size:.625rem}.dnb-payment-card__card__numbers{font-size:1.5rem!important;font-weight:var(--font-weight-medium)}.dnb-payment-card__card__credit-type{bottom:0;position:absolute;right:0}.dnb-payment-card__card__bank-logo{left:0;position:absolute;top:0}.dnb-payment-card__card__product-type{height:38px;left:70px;position:absolute;top:0}.dnb-payment-card__card__bank-axept{height:45px;position:absolute;right:0;top:0}.dnb-payment-card__card__credit{position:absolute;right:0;top:6px}.dnb-payment-card__blocking__overlay{align-items:center;background:linear-gradient(184.55deg,hsla(0,0%,80%,.5) 4.63%,hsla(0,0%,91%,.5) 84.83%);border-radius:inherit;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.dnb-payment-card__blocking__overlay svg path{stroke:currentcolor}.dnb-payment-card__blocking__center{align-items:center;background:var(--color-black-80);border-radius:4px;color:var(--color-sand-yellow);display:flex;flex-direction:column;justify-content:center;padding:1rem}.dnb-payment-card__blocking svg{shape-rendering:geometricprecision}.dnb-payment-card.dnb-skeleton .dnb-payment-card__card__holder{opacity:1}.dnb-payment-card--compact .dnb-payment-card__card{border-radius:12px 12px 0 0;box-shadow:var(--shadow-default);height:32.8mm;padding:0}.dnb-payment-card--compact .dnb-payment-card__card__top{left:6mm;position:absolute;right:6mm;top:4mm}.dnb-payment-card--compact .dnb-payment-card__card__bottom{background-color:var(--color-white);bottom:0;height:14mm;left:0;position:absolute;right:0}.dnb-payment-card--compact .dnb-payment-card__card__wrapper{color:var(--color-black-80);padding:6px 22px}.dnb-payment-card--compact .dnb-payment-card__card__numbers{font-size:var(--font-size-basis)}.dnb-payment-card--compact .dnb-payment-card__card__credit-type{bottom:auto;right:4px;top:10px}.dnb-payment-card--compact .dnb-payment-card__blocking__center{align-items:center;background:rgba(0,0,0,.739);border-radius:inherit;display:flex;flex-direction:row;gap:var(--spacing-x-small);height:100%;justify-content:center;width:100%}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
+@charset "UTF-8";.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{row-gap:0}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap;row-gap:var(--spacing-x-small)}@media screen and (min-width:40em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{display:flex}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button{color:var(--color-fire-red)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button:hover{color:var(--color-white)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}@media screen and (max-width:15em){.dnb-forms-field-number .dnb-input__shell,.dnb-forms-field-string .dnb-input__shell{width:90%}}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1;width:100%}@media screen and (min-width:25em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__status .dnb-form-status__shell{margin-top:.5rem}@media screen and (max-width:15em){.dnb-forms-field-block__status{width:90%}}.dnb-forms-field-block__contents{grid-area:contents;width:100%}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__contents__composition--vertical{display:flex;flex-flow:column;row-gap:var(--spacing-small)}.dnb-forms-field-block__contents__composition--horizontal{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:25em){.dnb-forms-field-block__contents__composition--horizontal{align-items:flex-end}}@media screen and (max-width:25em){.dnb-forms-field-block__contents__composition--horizontal{flex-flow:column;row-gap:var(--spacing-x-small)}}.dnb-forms-button-row{display:flex;flex-flow:row;flex-wrap:wrap;gap:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]),.dnb-card+.dnb-forms-button-row:not([class*=space__top]){margin-top:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]) .dnb-button[class*=space__top],.dnb-card+.dnb-forms-button-row:not([class*=space__top]) .dnb-button[class*=space__top]{margin-top:0}@media screen and (min-width:40em){.dnb-card+.dnb-button--primary:not([class*=space__left]),.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}:root{--forms-card-max-width:36.5rem}.dnb-forms-form .dnb-card{max-width:var(--forms-card-max-width)}.dnb-spacing .dnb-forms-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-forms-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-forms-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-submit-indicator{--padding-left:0.5em;display:inline}.dnb-forms-submit-indicator__content{font-size:0;line-height:1em;transition:font-size .8s var(--easing-default);will-change:font-size}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;font-weight:var(--font-weight-bold)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon{color:var(--color-success-green);padding-left:var(--padding-left)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label{font-size:var(--font-size-small);padding-left:calc(var(--padding-left)*2)}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}.dnb-forms-iterate-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-iterate-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-iterate-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-iterate-block__inner{flex:1;margin-bottom:var(--space);padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-iterate-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-forms-iterate-block--variant-outline .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing]{box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-forms-iterate-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-iterate-block.dnb-height-animation--is-visible .dnb-forms-iterate-block__inner{transform:translateY(-.5rem)}.dnb-forms-iterate-block.dnb-height-animation--parallax .dnb-forms-iterate-block__inner{transform:translateY(0)}.dnb-forms-iterate__element{outline:none}.dnb-forms-iterate>.dnb-forms-iterate__element:has(.dnb-forms-iterate-block){margin-top:0}.dnb-forms-summary-list.dnb-dl .dnb-dt,.dnb-forms-summary-list.dnb-dl:not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-summary-list.dnb-dl.dnb-dl__layout--grid{row-gap:var(--spacing-medium)}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}.dnb-forms-wizard-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-wizard-layout--drawer{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__sidebar{flex:0;margin-bottom:2rem}.dnb-forms-wizard-layout__contents{flex:1}.dnb-forms-wizard-layout__contents .dnb-forms-step{outline:none}.dnb-forms-wizard-layout__contents .dnb-card{max-width:var(--forms-card-max-width)}.dnb-forms-wizard-layout__contents .dnb-forms-button-row>.appear-fx,.dnb-forms-wizard-layout__contents .dnb-forms-step>.appear-fx{--appear-opacity:0;--appear-offset:-0.25rem;animation:appear .6s var(--easing-default) forwards;animation-delay:calc(var(--element-index, 0)*30ms);opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}@keyframes appear{0%{opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}80%{opacity:1}to{opacity:1;transform:translateZ(0)}}@media screen and (min-width:40em){.dnb-forms-wizard-layout+.dnb-form-status+.dnb-form-status:not([class*=space__left]),.dnb-forms-wizard-layout+.dnb-form-status:not([class*=space__left]){margin-left:var(--spacing-medium)}}@media screen and (max-width:60em){.dnb-forms-wizard-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__contents{flex-basis:auto}}.dnb-forms-wizard-layout .dnb-step-indicator__sidebar{margin-right:0}@media screen and (min-width:60em){.dnb-forms-form:has(.dnb-forms-wizard-layout--sidebar) .dnb-forms-status{margin-left:23rem}}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}:root{--sb-font-family-default:"Roboto","Helvetica","Arial",sans-serif;--sb-font-family-headings:"MaisonNeueHeadings","Roboto","Helvetica","Arial",sans-serif;--sb-font-weight-default:normal;--sb-font-weight-basis:normal;--sb-font-weight-regular:normal;--sb-font-weight-medium:500;--sb-font-weight-bold:700;--sb-font-size-x-small:0.75rem;--sb-font-size-small:0.875rem;--sb-font-size-basis:1rem;--sb-font-size-basis--em:1em;--sb-font-size-lead:1.25rem;--sb-font-size-medium:1.625rem;--sb-font-size-large:2rem;--sb-font-size-x-large:2.375rem;--sb-font-size-xx-large:3rem;--sb-line-height-x-small:1.125rem;--sb-line-height-small:1.25rem;--sb-line-height-basis:1.5rem;--sb-line-height-basis--em:1.5em;--sb-line-height-lead:1.75rem;--sb-line-height-medium:2rem;--sb-line-height-large:2.375rem;--sb-line-height-x-large:2.75rem;--sb-line-height-xx-large:3.375rem;--sb-color-black:#000;--sb-color-text:#18172a;--sb-color-gray-dark-3:#3a3a4a;--sb-color-gray-dark-3-neutral:#3e3e4a;--sb-color-gray-dark-2:#4a4a5b;--sb-color-gray-dark-2-neutral:#656472;--sb-color-gray-dark:#666578;--sb-color-gray-dark-neutral:#9494a3;--sb-color-gray:#bbbbce;--sb-color-gray-neutral:#bdbdc6;--sb-color-gray-light:#d9d9e4;--sb-color-gray-light-2:#ebebf2;--sb-color-gray-light-3:#f9f9fd;--sb-color-purple:#1c1b4e;--sb-color-purple-alternative:#222163;--sb-color-green:#92eecd;--sb-color-white:#fff;--sb-color-red:#d8134b;--sb-color-magenta:#ff3c64;--sb-color-orange:#ff5b44;--sb-color-yellow-dark:#f7bf16;--sb-color-yellow:#ffef57;--sb-color-green-dark-3:#00785b;--sb-color-green-dark-2:#1e9f73;--sb-color-violet:#4e08bc;--sb-color-violet-light:#7129e2;--sb-color-blue-dark-2:#044ccc;--sb-color-blue-dark:#005cff;--sb-color-blue:#008eff;--sb-color-orange-light:#ff817b;--sb-color-orange-light-2:#ffd7d5;--sb-color-orange-light-3:#fff0ef;--sb-color-magenta-light:#ffb6d2;--sb-color-magenta-light-2:#ffdbe9;--sb-color-magenta-light-3:#fff5f9;--sb-color-yellow-light:#fff489;--sb-color-yellow-light-2:#fff9c4;--sb-color-yellow-light-3:#fffce5;--sb-color-green-dark:#64d7b4;--sb-color-green-light:#c8f6e5;--sb-color-green-light-2:#e5fff7;--sb-color-violet-light-2:#be99ff;--sb-color-violet-light-3:#e0d0ff;--sb-color-violet-light-4:#f1ebff;--sb-color-blue-light:#61b9ff;--sb-color-blue-light-2:#bfe3ff;--sb-color-blue-light-3:#ebf6ff;--sb-spacing-x-small:0.5rem;--sb-spacing-small:1rem;--sb-spacing-medium:1.5rem;--sb-spacing-large:2rem;--sb-spacing-x-large:3rem;--sb-spacing-xx-large:3.5rem;--sb-layout-small:40em;--sb-layout-medium:60em;--sb-layout-large:72em;--sb-layout-x-large:80em;--sb-layout-xx-large:90em;--sb-shadow-small:0 2px 4px rgba(38,35,66,.12);--sb-shadow-medium:0 5px 20px rgba(38,35,66,.1);--sb-shadow-large:0 5px 20px rgba(38,35,66,.2);--sb-shadow-hover:0 20px 40px rgba(38,35,66,.2);--sb-easing-default:cubic-bezier(0.42,0,0,1)}.dnb-payment-card{--color-dark-cyan:#003b47;--dnb-payment-bg-default:linear-gradient(187.2deg,#008484 6.31%,var(--color-sea-green) 82.66%);--dnb-payment-bg-pluss:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-white:linear-gradient(184.55deg,var(--color-black-background) 4.63%,var(--color-white) 92.04%);--dnb-payment-bg-gold:linear-gradient(184.55deg,#bfa970 4.63%,#d3bd83 84.57%);--dnb-payment-bg-saga:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-private:linear-gradient(187.2deg,#1c1c1c 6.31%,#000 82.66%);--dnb-payment-bg-business-no-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);--dnb-payment-bg-business-with-visa:linear-gradient(187.2deg,var(--color-dark-cyan) 6.31%,var(--color-ocean-green) 82.66%),var(--color-emerald-green);margin:0}.dnb-payment-card__card{border-color:currentcolor;border-color:hsla(0,0%,100%,.1) transparent;border-radius:12px;border-style:solid;border-width:1px;box-shadow:var(--shadow-default);color:var(--color-white);height:216px;padding:16px;position:relative;transition:all 225ms cubic-bezier(0,0,.2,1) 0ms;width:343px}.dnb-payment-card__card--design-default{background:var(--dnb-payment-bg-default);color:var(--color-white)}.dnb-payment-card__card--design-pluss{background:var(--dnb-payment-bg-pluss);color:var(--color-white)}.dnb-payment-card__card--design-my-first,.dnb-payment-card__card--design-ung,.dnb-payment-card__card--design-youth{color:var(--color-black-80)}.dnb-payment-card__card--design-gold{background:var(--dnb-payment-bg-gold);color:var(--color-white)}.dnb-payment-card__card--design-saga{background:var(--dnb-payment-bg-saga);color:var(--color-white)}.dnb-payment-card__card--design-private{background:var(--dnb-payment-bg-private);color:var(--color-white)}.dnb-payment-card__card--design-black{background:var(--color-black);color:var(--color-white)}.dnb-payment-card__card--design-business-no-visa{background:var(--dnb-payment-bg-business-no-visa);color:var(--color-white)}.dnb-payment-card__card--design-business-with-visa{background:var(--dnb-payment-bg-business-with-visa);color:var(--color-white)}.dnb-payment-card__card--design-sbanken-mastercard{background:var(--sb-color-purple);color:var(--color-white)}.dnb-payment-card__card--design-sbanken-visa{background:var(--color-white);color:var(--sb-color-text)}.dnb-payment-card__card:after{background:radial-gradient(52.39% 52.39% at 50% 50%,hsla(56,52%,94%,.122) 0,rgba(6,6,6,0) 100%);border-radius:inherit;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.dnb-payment-card__card--design-sbanken-mastercard:after{background:none}.dnb-payment-card__card__content{display:flex;height:100%;position:relative;width:100%}.dnb-payment-card__card__wrapper{bottom:0;left:0;position:absolute}.dnb-spacing .dnb-payment-card__card .dnb-p{margin-bottom:0!important}.dnb-payment-card__card__holder{font-weight:var(--font-weight-medium);text-align:left;text-transform:uppercase}.dnb-payment-card__card__holder.dnb-p{font-size:.625rem}.dnb-payment-card__card__numbers{font-size:1.5rem!important;font-weight:var(--font-weight-medium)}.dnb-payment-card__card__credit-type{bottom:0;position:absolute;right:0}.dnb-payment-card__card__bank-logo{left:0;position:absolute;top:0}.dnb-payment-card__card__product-type{height:38px;left:70px;position:absolute;top:0}.dnb-payment-card__card__bank-axept{height:45px;position:absolute;right:0;top:0}.dnb-payment-card__card__credit{position:absolute;right:0;top:6px}.dnb-payment-card__blocking__overlay{align-items:center;background:linear-gradient(184.55deg,hsla(0,0%,80%,.5) 4.63%,hsla(0,0%,91%,.5) 84.83%);border-radius:inherit;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.dnb-payment-card__blocking__overlay svg path{stroke:currentcolor}.dnb-payment-card__blocking__center{align-items:center;background:var(--color-black-80);border-radius:4px;color:var(--color-sand-yellow);display:flex;flex-direction:column;justify-content:center;padding:1rem}.dnb-payment-card__blocking svg{shape-rendering:geometricprecision}.dnb-payment-card.dnb-skeleton .dnb-payment-card__card__holder{opacity:1}.dnb-payment-card--compact .dnb-payment-card__card{border-radius:12px 12px 0 0;box-shadow:var(--shadow-default);height:32.8mm;padding:0}.dnb-payment-card--compact .dnb-payment-card__card__top{left:6mm;position:absolute;right:6mm;top:4mm}.dnb-payment-card--compact .dnb-payment-card__card__bottom{background-color:var(--color-white);bottom:0;height:14mm;left:0;position:absolute;right:0}.dnb-payment-card--compact .dnb-payment-card__card__wrapper{color:var(--color-black-80);padding:6px 22px}.dnb-payment-card--compact .dnb-payment-card__card__numbers{font-size:var(--font-size-basis)}.dnb-payment-card--compact .dnb-payment-card__card__credit-type{bottom:auto;right:4px;top:10px}.dnb-payment-card--compact .dnb-payment-card__blocking__center{align-items:center;background:rgba(0,0,0,.739);border-radius:inherit;display:flex;flex-direction:row;gap:var(--spacing-x-small);height:100%;justify-content:center;width:100%}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
     --color-mint-green-12
   );--number-control-button-color--hover:var(--color-emerald-green);--number-control-button-background-color--active:var(
     --color-mint-green-50
-  );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2rem;--button-width--small:2rem}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}
+  );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2rem;--button-width--small:2rem}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}.dnb-forms-wizard-layout__contents .dnb-card{--border-color:var(--color-pistachio)}

package/cjs/style/themes/theme-ui/ui-theme-extensions.scss

@@ -12,4 +12,5 @@
 
 @import '../../../extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.scss';
 @import '../../../extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss';
+@import '../../../extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.scss';
 @import '../../../extensions/payment-card/style/themes/dnb-payment-card-theme-ui.scss';

package/cjs/style/themes/theme-ui/ui-theme-forms.css

@@ -237,9 +237,6 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   margin-left: 0;
 }
 
-.dnb-forms-field-block {
-  width: 100%;
-}
 .dnb-forms-field-block__grid {
   display: grid;
 }
@@ -261,6 +258,7 @@ fieldset.dnb-forms-field-block:not([class*=space__left]) {
   grid-template-areas: "label contents" "status status";
 }
 .dnb-forms-field-block--width-stretch {
+  width: 100%;
   flex-grow: 1;
 }
 @media screen and (min-width: 25em) {
@@ -515,7 +513,6 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
 }
 .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing] {
   border-radius: 0.375rem;
-  box-shadow: inset 0 0 0 2px var(--block-outline-color);
 }
 .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small {
   --space: var(--spacing-small);
@@ -526,6 +523,9 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
 .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large {
   --space: var(--spacing-large);
 }
+.dnb-forms-iterate-block--variant-outline .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing] {
+  box-shadow: inset 0 0 0 2px var(--block-outline-color);
+}
 .dnb-forms-iterate-block__inner .dnb-dl .dnb-dd {
   margin-bottom: 0;
 }
@@ -661,7 +661,6 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
   outline: none;
 }
 .dnb-forms-wizard-layout__contents .dnb-card {
-  --border-color: var(--color-pistachio);
   max-width: var(--forms-card-max-width);
 }
 .dnb-forms-wizard-layout__contents .dnb-forms-step > .appear-fx,
@@ -744,4 +743,8 @@ html[data-visual-test] .dnb-forms-submit-indicator__content b {
 .dnb-forms-field-block__label-description {
   color: var(--color-black-55);
   font-size: var(--font-size-small);
+}
+
+.dnb-forms-wizard-layout__contents .dnb-card {
+  --border-color: var(--color-pistachio);
 }

package/cjs/style/themes/theme-ui/ui-theme-forms.min.css

@@ -1,5 +1,5 @@
-@charset "UTF-8";.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{row-gap:0}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap;row-gap:var(--spacing-x-small)}@media screen and (min-width:40em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{display:flex}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button{color:var(--color-fire-red)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button:hover{color:var(--color-white)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}@media screen and (max-width:15em){.dnb-forms-field-number .dnb-input__shell,.dnb-forms-field-string .dnb-input__shell{width:90%}}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block{width:100%}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:25em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__status .dnb-form-status__shell{margin-top:.5rem}@media screen and (max-width:15em){.dnb-forms-field-block__status{width:90%}}.dnb-forms-field-block__contents{grid-area:contents;width:100%}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__contents__composition--vertical{display:flex;flex-flow:column;row-gap:var(--spacing-small)}.dnb-forms-field-block__contents__composition--horizontal{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:25em){.dnb-forms-field-block__contents__composition--horizontal{align-items:flex-end}}@media screen and (max-width:25em){.dnb-forms-field-block__contents__composition--horizontal{flex-flow:column;row-gap:var(--spacing-x-small)}}.dnb-forms-button-row{display:flex;flex-flow:row;flex-wrap:wrap;gap:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]),.dnb-card+.dnb-forms-button-row:not([class*=space__top]){margin-top:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]) .dnb-button[class*=space__top],.dnb-card+.dnb-forms-button-row:not([class*=space__top]) .dnb-button[class*=space__top]{margin-top:0}@media screen and (min-width:40em){.dnb-card+.dnb-button--primary:not([class*=space__left]),.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}:root{--forms-card-max-width:36.5rem}.dnb-forms-form .dnb-card{max-width:var(--forms-card-max-width)}.dnb-spacing .dnb-forms-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-forms-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-forms-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-submit-indicator{--padding-left:0.5em;display:inline}.dnb-forms-submit-indicator__content{font-size:0;line-height:1em;transition:font-size .8s var(--easing-default);will-change:font-size}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;font-weight:var(--font-weight-bold)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon{color:var(--color-success-green);padding-left:var(--padding-left)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label{font-size:var(--font-size-small);padding-left:calc(var(--padding-left)*2)}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}.dnb-forms-iterate-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-iterate-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-iterate-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-iterate-block__inner{flex:1;margin-bottom:var(--space);padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-iterate-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem;box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-forms-iterate-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-iterate-block.dnb-height-animation--is-visible .dnb-forms-iterate-block__inner{transform:translateY(-.5rem)}.dnb-forms-iterate-block.dnb-height-animation--parallax .dnb-forms-iterate-block__inner{transform:translateY(0)}.dnb-forms-iterate__element{outline:none}.dnb-forms-iterate>.dnb-forms-iterate__element:has(.dnb-forms-iterate-block){margin-top:0}.dnb-forms-summary-list.dnb-dl .dnb-dt,.dnb-forms-summary-list.dnb-dl:not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-summary-list.dnb-dl.dnb-dl__layout--grid{row-gap:var(--spacing-medium)}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}.dnb-forms-wizard-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-wizard-layout--drawer{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__sidebar{flex:0;margin-bottom:2rem}.dnb-forms-wizard-layout__contents{flex:1}.dnb-forms-wizard-layout__contents .dnb-forms-step{outline:none}.dnb-forms-wizard-layout__contents .dnb-card{--border-color:var(--color-pistachio);max-width:var(--forms-card-max-width)}.dnb-forms-wizard-layout__contents .dnb-forms-button-row>.appear-fx,.dnb-forms-wizard-layout__contents .dnb-forms-step>.appear-fx{--appear-opacity:0;--appear-offset:-0.25rem;animation:appear .6s var(--easing-default) forwards;animation-delay:calc(var(--element-index, 0)*30ms);opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}@keyframes appear{0%{opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}80%{opacity:1}to{opacity:1;transform:translateZ(0)}}@media screen and (min-width:40em){.dnb-forms-wizard-layout+.dnb-form-status+.dnb-form-status:not([class*=space__left]),.dnb-forms-wizard-layout+.dnb-form-status:not([class*=space__left]){margin-left:var(--spacing-medium)}}@media screen and (max-width:60em){.dnb-forms-wizard-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__contents{flex-basis:auto}}.dnb-forms-wizard-layout .dnb-step-indicator__sidebar{margin-right:0}@media screen and (min-width:60em){.dnb-forms-form:has(.dnb-forms-wizard-layout--sidebar) .dnb-forms-status{margin-left:23rem}}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
+@charset "UTF-8";.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-vertical.dnb-forms-field-array-selection--layout-horizontal .dnb-forms-field-array-selection__options{row-gap:0}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap;row-gap:var(--spacing-x-small)}@media screen and (min-width:40em){.dnb-forms-field-array-selection .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem;margin-bottom:0}}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-number{--number-control-button-border-color:#000;--number-control-button-border-color--hover:#a9a9a9;--number-control-button-border-color--focus:#a9a9a9;--number-control-button-border-width--focus:0.125rem;--number-control-button-background-color--hover:grey;--number-control-button-color--hover:#000;--number-control-button-background-color--active:#000;--number-control-button-color--active:#d3d3d3;--number-control-button--error:red;--number-control-button--error-contrast:#fff;--number-control-button-width--small:2rem;--number-control-button-width--medium:2.5rem;--number-control-button-width--large:3rem;--forms-field-block--number-control-buttons-width--small:calc(var(--number-control-button-width--small)*2);--forms-field-block--number-control-buttons-width--medium:calc(var(--number-control-button-width--medium)*2);--forms-field-block--number-control-buttons-width--large:calc(var(--number-control-button-width--large)*2)}.dnb-forms-field-number__contents{display:flex}.dnb-forms-field-number__contents--has-controls .dnb-input__input{align-items:center}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border{border-radius:0}.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within,.dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:hover,html[data-whatinput=keyboard] .dnb-forms-field-number__contents--has-controls .dnb-input .dnb-input__border:focus-within{box-shadow:none}.dnb-forms-field-number__contents--has-controls>.dnb-input__border--root{--input-border-inset: ;--input-border-inset--hover: ;--input-border-inset--active: ;--input-border-inset--focus: ;--input-border-inset--disabled: }html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button-background-color--hover);color:var(--number-control-button-color--hover)}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button-background-color--active);color:var(--number-control-button-color--active)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before{color:var(--number-control-button--error)}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:hover:not([disabled]){background-color:var(--number-control-button--error-contrast);color:var(--number-control-button--error)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active[disabled],html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active[disabled]{cursor:not-allowed}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before:active:not([disabled]){background-color:var(--number-control-button--error);color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input__status--error .dnb-button--control-before[disabled]{color:var(--number-control-button--error-contrast)}.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-after[disabled],.dnb-forms-field-number__contents--has-controls.dnb-input--disabled .dnb-button--control-before[disabled]{background-color:var(--color-black-3);color:var(--color-black-20)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small{width:calc(var(--forms-field-width--small) + var(--forms-field-block--number-control-buttons-width--small))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-small .dnb-button--control-before{width:var(--number-control-button-width--small)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium{width:calc(var(--forms-field-width--medium) + var(--forms-field-block--number-control-buttons-width--medium))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-medium .dnb-button--control-before{width:var(--number-control-button-width--medium)}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large{width:calc(var(--forms-field-width--large) + var(--forms-field-block--number-control-buttons-width--large))}.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-after,.dnb-forms-field-number__contents--has-controls.dnb-forms-field-block__contents--width-large .dnb-button--control-before{width:var(--number-control-button-width--large)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button{color:var(--color-fire-red)}.dnb-forms-field-password .dnb-input__status--error .dnb-input__submit-button__button:hover{color:var(--color-white)}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-phone-number .dnb-form-label{max-width:14ch}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{align-self:center}.dnb-forms-field-selection__options-layout--horizontal .dnb-forms-field-block--layout-horizontal .dnb-form-label,.dnb-forms-field-selection__variant--dropdown .dnb-forms-field-block--layout-horizontal .dnb-form-label{margin-bottom:0}.dnb-forms-field-selection__variant--button .dnb-forms-field-block--layout-horizontal .dnb-form-label{line-height:2.5rem}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}@media screen and (max-width:15em){.dnb-forms-field-number .dnb-input__shell,.dnb-forms-field-string .dnb-input__shell{width:90%}}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}@media screen and (max-width:40em){.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid{flex-wrap:wrap}.dnb-forms-field-block--layout-vertical .dnb-forms-field-block__grid>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:fit-content(100%) auto}.dnb-forms-field-block--width-stretch{flex-grow:1;width:100%}@media screen and (min-width:25em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__status .dnb-form-status__shell{margin-top:.5rem}@media screen and (max-width:15em){.dnb-forms-field-block__status{width:90%}}.dnb-forms-field-block__contents{grid-area:contents;width:100%}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__contents__composition--vertical{display:flex;flex-flow:column;row-gap:var(--spacing-small)}.dnb-forms-field-block__contents__composition--horizontal{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}@media screen and (min-width:25em){.dnb-forms-field-block__contents__composition--horizontal{align-items:flex-end}}@media screen and (max-width:25em){.dnb-forms-field-block__contents__composition--horizontal{flex-flow:column;row-gap:var(--spacing-x-small)}}.dnb-forms-button-row{display:flex;flex-flow:row;flex-wrap:wrap;gap:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]),.dnb-card+.dnb-forms-button-row:not([class*=space__top]){margin-top:var(--spacing-small)}.dnb-card+.dnb-button--primary:not([class*=space__top]) .dnb-button[class*=space__top],.dnb-card+.dnb-forms-button-row:not([class*=space__top]) .dnb-button[class*=space__top]{margin-top:0}@media screen and (min-width:40em){.dnb-card+.dnb-button--primary:not([class*=space__left]),.dnb-card+.dnb-forms-button-row:not([class*=space__left]){margin-left:var(--spacing-medium)}}:root{--forms-card-max-width:36.5rem}.dnb-forms-form .dnb-card{max-width:var(--forms-card-max-width)}.dnb-spacing .dnb-forms-main-heading.dnb-h--large:not([class*=space__]){margin:0}@media screen and (min-width:40em){.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}}.dnb-forms-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-forms-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-forms-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-submit-indicator{--padding-left:0.5em;display:inline}.dnb-forms-submit-indicator__content{font-size:0;line-height:1em;transition:font-size .8s var(--easing-default);will-change:font-size}.dnb-forms-submit-indicator__content b{animation-delay:.2s;animation-duration:1.3s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;color:var(--dots-color,currentColor);opacity:.2;padding-left:.125em}.dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;padding-left:var(--padding-left)}.dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}html[data-visual-test] .dnb-forms-submit-indicator__content b{animation:none}.dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;font-weight:var(--font-weight-bold)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon{color:var(--color-success-green);padding-left:var(--padding-left)}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content .dnb-icon--default{font-size:1em}.dnb-forms-submit-indicator--state-success .dnb-forms-submit-indicator__content__label{font-size:var(--font-size-small);padding-left:calc(var(--padding-left)*2)}.dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}@keyframes submit-indicator-dot{0%{opacity:.2}15%{opacity:1}50%{opacity:1}60%{opacity:.3}to{opacity:.2}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}.dnb-forms-iterate-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-iterate-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-iterate-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-iterate-block__inner{flex:1;margin-bottom:var(--space);padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-iterate-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-forms-iterate-block--variant-outline .dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing]{box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-forms-iterate-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-iterate-block.dnb-height-animation--is-visible .dnb-forms-iterate-block__inner{transform:translateY(-.5rem)}.dnb-forms-iterate-block.dnb-height-animation--parallax .dnb-forms-iterate-block__inner{transform:translateY(0)}.dnb-forms-iterate__element{outline:none}.dnb-forms-iterate>.dnb-forms-iterate__element:has(.dnb-forms-iterate-block){margin-top:0}.dnb-forms-summary-list.dnb-dl .dnb-dt,.dnb-forms-summary-list.dnb-dl:not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-summary-list.dnb-dl.dnb-dl__layout--grid{row-gap:var(--spacing-medium)}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}.dnb-forms-wizard-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}.dnb-forms-wizard-layout--drawer{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__sidebar{flex:0;margin-bottom:2rem}.dnb-forms-wizard-layout__contents{flex:1}.dnb-forms-wizard-layout__contents .dnb-forms-step{outline:none}.dnb-forms-wizard-layout__contents .dnb-card{max-width:var(--forms-card-max-width)}.dnb-forms-wizard-layout__contents .dnb-forms-button-row>.appear-fx,.dnb-forms-wizard-layout__contents .dnb-forms-step>.appear-fx{--appear-opacity:0;--appear-offset:-0.25rem;animation:appear .6s var(--easing-default) forwards;animation-delay:calc(var(--element-index, 0)*30ms);opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}@keyframes appear{0%{opacity:var(--appear-opacity);transform:translate3d(var(--appear-offset),0,0)}80%{opacity:1}to{opacity:1;transform:translateZ(0)}}@media screen and (min-width:40em){.dnb-forms-wizard-layout+.dnb-form-status+.dnb-form-status:not([class*=space__left]),.dnb-forms-wizard-layout+.dnb-form-status:not([class*=space__left]){margin-left:var(--spacing-medium)}}@media screen and (max-width:60em){.dnb-forms-wizard-layout{align-items:stretch;flex-direction:column;justify-content:stretch}.dnb-forms-wizard-layout__contents{flex-basis:auto}}.dnb-forms-wizard-layout .dnb-step-indicator__sidebar{margin-right:0}@media screen and (min-width:60em){.dnb-forms-form:has(.dnb-forms-wizard-layout--sidebar) .dnb-forms-status{margin-left:23rem}}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}.dnb-forms-field-number{--number-control-button-border-color:var(--color-sea-green);--number-control-button-border-color--hover:var(--color-emerald-green);--number-control-button-border-color--focus:var(--color-emerald-green);--number-control-button-background-color--hover:var(
     --color-mint-green-12
   );--number-control-button-color--hover:var(--color-emerald-green);--number-control-button-background-color--active:var(
     --color-mint-green-50
-  );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2rem;--button-width--small:2rem}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}
+  );--number-control-button-color--active:var(--color-sea-green);--number-control-button--error:var(--color-fire-red);--number-control-button--error-contrast:var(--color-fire-red-8)}.dnb-forms-field-number__contents--has-controls .dnb-button.dnb-button--size-small{--button-height--small:2rem;--button-width--small:2rem}.dnb-forms-field-block__label-description{color:var(--color-black-55);font-size:var(--font-size-small)}.dnb-forms-wizard-layout__contents .dnb-card{--border-color:var(--color-pistachio)}

package/cjs/style/themes/theme-ui/ui-theme-forms.scss

@@ -16,3 +16,4 @@ $THEME_FALLBACK: 'ui';
 
 @import '../../../extensions/forms/Field/Number/style/themes/dnb-number-theme-ui.scss';
 @import '../../../extensions/forms/FieldBlock/style/themes/dnb-field-block-theme-ui.scss';
+@import '../../../extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.scss';

package/components/anchor/Anchor.d.ts

@@ -6,8 +6,15 @@ import React from 'react';
 import type { IconIcon } from '../icon/Icon';
 import type { SkeletonShow } from '../skeleton/Skeleton';
 import type { DynamicElement, SpacingProps } from '../../shared/types';
+type ReactRouterLink = Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> & {
+    to: string | {
+        pathname?: string;
+        search?: string;
+        has?: string;
+    };
+};
 export type AnchorProps = {
-    element?: DynamicElement<HTMLAnchorElement | AnchorAllProps>;
+    element?: DynamicElement<HTMLAnchorElement | AnchorAllProps> | React.ForwardRefExoticComponent<ReactRouterLink & React.RefAttributes<HTMLAnchorElement>>;
     href?: string;
     to?: string;
     targetBlankTitle?: string;

package/components/anchor/Anchor.js.map

@@ -1 +1 @@
-{"version":3,"file":"Anchor.js","names":["React","classnames","E","Context","makeUniqueId","extendPropsWithContext","getOffsetTop","IconPrimary","Tooltip","launch","launchIcon","defaultProps","AnchorInstance","localProps","context","useContext","allProps","skeleton","getTranslation","Anchor","inner_ref","innerRef","createRef","id","element","className","children","tooltip","icon","iconPosition","omitClass","targetBlankTitle","rest","_objectWithoutProperties","_excluded","attributes","internalId","as","href","to","_opensNewTab","opensNewTab","target","showLaunchIcon","includes","showTooltip","title","iconNode","getIcon","suffix","_IconPrimary","createElement","prefix","Fragment","_extends","showDelay","targetElement","forwardRef","props","ref","_supportsSpacingProps","scrollToHashHandler","event","_element$pathname","currentTarget","getAttribute","document","isSamePath","startsWith","window","location","pathname","replace","split","reverse","anchorElem","getElementById","HTMLElement","scrollPadding","parseFloat","getComputedStyle","documentElement","scrollPaddingTop","top","scroll","error","console","pickIcon","_icon$props","_icon$props2","_icon$props2$classNam","_icon$props3","cloneElement","key","test"],"sources":["../../../../src/components/anchor/Anchor.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport E, { ElementProps } from '../../elements/Element'\nimport Context from '../../shared/Context'\nimport {\n  makeUniqueId,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { getOffsetTop } from '../../shared/helpers'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport Tooltip from '../tooltip/Tooltip'\nimport { launch as launchIcon } from '../../icons'\nimport type { IconIcon } from '../icon/Icon'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { DynamicElement, SpacingProps } from '../../shared/types'\n\nexport type AnchorProps = {\n  element?: DynamicElement<HTMLAnchorElement | AnchorAllProps>\n  href?: string\n  to?: string\n  targetBlankTitle?: string\n  target?: string\n  tooltip?: React.ReactNode\n  icon?: IconIcon\n  iconPosition?: 'left' | 'right'\n  skeleton?: SkeletonShow\n  omitClass?: boolean\n  innerRef?: React.RefObject<HTMLAnchorElement>\n\n  /** @deprecated use innerRef instead */\n  inner_ref?: React.RefObject<HTMLAnchorElement>\n}\n\nexport type AnchorAllProps = AnchorProps &\n  Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'> &\n  SpacingProps\n\nconst defaultProps = {}\n\nexport function AnchorInstance(localProps: AnchorAllProps) {\n  const context = React.useContext(Context)\n  const allProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    { skeleton: context?.skeleton },\n    context?.getTranslation(localProps as AnchorAllProps).Anchor,\n    context?.Anchor\n  )\n\n  // deprecated: inner_ref is still needed to support Button's usage of Anchor\n  if (typeof allProps.inner_ref !== 'undefined') {\n    allProps.innerRef = allProps.inner_ref\n    delete allProps.inner_ref\n  }\n\n  if (!allProps.innerRef) {\n    allProps.innerRef = React.createRef()\n  }\n\n  const {\n    id,\n    element,\n    className,\n    children,\n    tooltip,\n    icon,\n    iconPosition = 'left',\n    omitClass,\n    innerRef,\n    targetBlankTitle,\n    ...rest\n  } = allProps\n\n  const attributes = rest as ElementProps\n  const internalId = id || 'id' + makeUniqueId()\n  const as = element || 'a'\n\n  const href = allProps.href || allProps.to\n  const _opensNewTab = opensNewTab(allProps.target, href)\n  const showLaunchIcon =\n    _opensNewTab &&\n    !className?.includes('dnb-anchor--no-icon') &&\n    !omitClass\n  const showTooltip = (tooltip || _opensNewTab) && !allProps.title\n\n  const iconNode = icon && getIcon(icon)\n\n  const suffix =\n    (iconPosition === 'right' && iconNode) ||\n    (showLaunchIcon && (\n      <IconPrimary className=\"dnb-anchor__launch-icon\" icon={launchIcon} />\n    ))\n\n  const prefix = iconPosition === 'left' && iconNode\n\n  return (\n    <>\n      <E\n        as={as}\n        id={id}\n        className={classnames(\n          omitClass !== true &&\n            classnames(\n              'dnb-anchor',\n              prefix && 'dnb-anchor--icon-left',\n              suffix && 'dnb-anchor--icon-right',\n              typeof children !== 'string' && 'dnb-anchor--was-node'\n            ),\n          className\n        )}\n        {...attributes}\n        innerRef={innerRef}\n      >\n        {prefix}\n        {children}\n        {suffix}\n      </E>\n\n      {showTooltip && (\n        <Tooltip\n          showDelay={100}\n          id={internalId + '-tooltip'}\n          targetElement={innerRef}\n          tooltip={tooltip}\n        >\n          {allProps.title || targetBlankTitle}\n        </Tooltip>\n      )}\n    </>\n  )\n}\n\nconst Anchor = React.forwardRef(\n  (props: AnchorAllProps, ref: React.RefObject<HTMLAnchorElement>) => {\n    return <AnchorInstance innerRef={ref} {...props} />\n  }\n)\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nAnchor._supportsSpacingProps = true\n\nexport default Anchor\n\nexport function scrollToHashHandler(\n  event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n) {\n  const element = event.currentTarget as HTMLAnchorElement\n  const href = element.getAttribute('href')\n\n  if (typeof document === 'undefined' || !href.includes('#')) {\n    return // stop here\n  }\n\n  /**\n   * What happens here?\n   * When `scroll-behavior: smooth;` in CSS is set,\n   * Blink/Chromium wants the user to click two times in order to actually scroll to the anchor hash.\n   * The first click, sets the hash, the second one, scrolls to it.\n   * We want Chromium browsers to scroll to the element on the first click.\n   */\n  const isSamePath =\n    href.startsWith('#') ||\n    window.location.href.includes(element.pathname?.replace(/\\/$/, ''))\n\n  // Only continue, when we are sure we are on the same page,\n  // because, the same ID may exists occasionally on the current page.\n  if (isSamePath) {\n    const id = href.split(/#/g).reverse()[0]\n    const anchorElem = document.getElementById(id)\n\n    if (anchorElem instanceof HTMLElement) {\n      try {\n        const scrollPadding = parseFloat(\n          window.getComputedStyle(document.documentElement)\n            .scrollPaddingTop\n        )\n        const top = getOffsetTop(anchorElem) - scrollPadding || 0\n\n        window.scroll({ top })\n\n        return { element: anchorElem }\n      } catch (error) {\n        console.error(error)\n      }\n    }\n  }\n}\n\nfunction getIcon(icon) {\n  return pickIcon(icon) || <IconPrimary icon={icon} />\n}\n\nexport function pickIcon(icon, className?: string) {\n  return icon?.props?.icon || icon?.props?.className?.includes('dnb-icon')\n    ? React.cloneElement(icon, {\n        key: 'button-icon-clone',\n        className: classnames(icon.props?.className, className),\n      })\n    : null\n}\n\nexport const opensNewTab = (target: string, href: string): boolean =>\n  target === '_blank' && !/^(mailto|tel|sms)/.test(href)\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,CAAC,MAAwB,wBAAwB;AACxD,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,SACEC,YAAY,EACZC,sBAAsB,QACjB,+BAA+B;AACtC,SAASC,YAAY,QAAQ,sBAAsB;AACnD,OAAOC,WAAW,MAAM,6BAA6B;AACrD,OAAOC,OAAO,MAAM,oBAAoB;AACxC,SAASC,MAAM,IAAIC,UAAU,QAAQ,aAAa;AA0BlD,MAAMC,YAAY,GAAG,CAAC,CAAC;AAEvB,OAAO,SAASC,cAAcA,CAACC,UAA0B,EAAE;EACzD,MAAMC,OAAO,GAAGd,KAAK,CAACe,UAAU,CAACZ,OAAO,CAAC;EACzC,MAAMa,QAAQ,GAAGX,sBAAsB,CACrCQ,UAAU,EACVF,YAAY,EACZ;IAAEM,QAAQ,EAAEH,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEG;EAAS,CAAC,EAC/BH,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEI,cAAc,CAACL,UAA4B,CAAC,CAACM,MAAM,EAC5DL,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEK,MACX,CAAC;EAGD,IAAI,OAAOH,QAAQ,CAACI,SAAS,KAAK,WAAW,EAAE;IAC7CJ,QAAQ,CAACK,QAAQ,GAAGL,QAAQ,CAACI,SAAS;IACtC,OAAOJ,QAAQ,CAACI,SAAS;EAC3B;EAEA,IAAI,CAACJ,QAAQ,CAACK,QAAQ,EAAE;IACtBL,QAAQ,CAACK,QAAQ,GAAGrB,KAAK,CAACsB,SAAS,CAAC,CAAC;EACvC;EAEA,MAAM;MACJC,EAAE;MACFC,OAAO;MACPC,SAAS;MACTC,QAAQ;MACRC,OAAO;MACPC,IAAI;MACJC,YAAY,GAAG,MAAM;MACrBC,SAAS;MACTT,QAAQ;MACRU;IAEF,CAAC,GAAGf,QAAQ;IADPgB,IAAI,GAAAC,wBAAA,CACLjB,QAAQ,EAAAkB,SAAA;EAEZ,MAAMC,UAAU,GAAGH,IAAoB;EACvC,MAAMI,UAAU,GAAGb,EAAE,IAAI,IAAI,GAAGnB,YAAY,CAAC,CAAC;EAC9C,MAAMiC,EAAE,GAAGb,OAAO,IAAI,GAAG;EAEzB,MAAMc,IAAI,GAAGtB,QAAQ,CAACsB,IAAI,IAAItB,QAAQ,CAACuB,EAAE;EACzC,MAAMC,YAAY,GAAGC,WAAW,CAACzB,QAAQ,CAAC0B,MAAM,EAAEJ,IAAI,CAAC;EACvD,MAAMK,cAAc,GAClBH,YAAY,IACZ,EAACf,SAAS,aAATA,SAAS,eAATA,SAAS,CAAEmB,QAAQ,CAAC,qBAAqB,CAAC,KAC3C,CAACd,SAAS;EACZ,MAAMe,WAAW,GAAG,CAAClB,OAAO,IAAIa,YAAY,KAAK,CAACxB,QAAQ,CAAC8B,KAAK;EAEhE,MAAMC,QAAQ,GAAGnB,IAAI,IAAIoB,OAAO,CAACpB,IAAI,CAAC;EAEtC,MAAMqB,MAAM,GACTpB,YAAY,KAAK,OAAO,IAAIkB,QAAQ,IACpCJ,cAAc,KAAAO,YAAA,KAAAA,YAAA,GACblD,KAAA,CAAAmD,aAAA,CAAC5C,WAAW;IAACkB,SAAS,EAAC,yBAAyB;IAACG,IAAI,EAAElB;EAAW,CAAE,CAAC,EACrE;EAEJ,MAAM0C,MAAM,GAAGvB,YAAY,KAAK,MAAM,IAAIkB,QAAQ;EAElD,OACE/C,KAAA,CAAAmD,aAAA,CAAAnD,KAAA,CAAAqD,QAAA,QACErD,KAAA,CAAAmD,aAAA,CAACjD,CAAC,EAAAoD,QAAA;IACAjB,EAAE,EAAEA,EAAG;IACPd,EAAE,EAAEA,EAAG;IACPE,SAAS,EAAExB,UAAU,CAQnBwB,SAAS,EAPTK,SAAS,KAAK,IAAI,IAChB7B,UAAU,CACR,YAAY,EACZmD,MAAM,IAAI,uBAAuB,EACjCH,MAAM,IAAI,wBAAwB,EAClC,OAAOvB,QAAQ,KAAK,QAAQ,IAAI,sBAClC,CAEJ;EAAE,GACES,UAAU;IACdd,QAAQ,EAAEA;EAAS,IAElB+B,MAAM,EACN1B,QAAQ,EACRuB,MACA,CAAC,EAEHJ,WAAW,IACV7C,KAAA,CAAAmD,aAAA,CAAC3C,OAAO;IACN+C,SAAS,EAAE,GAAI;IACfhC,EAAE,EAAEa,UAAU,GAAG,UAAW;IAC5BoB,aAAa,EAAEnC,QAAS;IACxBM,OAAO,EAAEA;EAAQ,GAEhBX,QAAQ,CAAC8B,KAAK,IAAIf,gBACZ,CAEX,CAAC;AAEP;AAEA,MAAMZ,MAAM,GAAGnB,KAAK,CAACyD,UAAU,CAC7B,CAACC,KAAqB,EAAEC,GAAuC,KAAK;EAClE,OAAO3D,KAAA,CAAAmD,aAAA,CAACvC,cAAc,EAAA0C,QAAA;IAACjC,QAAQ,EAAEsC;EAAI,GAAKD,KAAK,CAAG,CAAC;AACrD,CACF,CAAC;AAIDvC,MAAM,CAACyC,qBAAqB,GAAG,IAAI;AAEnC,eAAezC,MAAM;AAErB,OAAO,SAAS0C,mBAAmBA,CACjCC,KAAsD,EACtD;EAAA,IAAAC,iBAAA;EACA,MAAMvC,OAAO,GAAGsC,KAAK,CAACE,aAAkC;EACxD,MAAM1B,IAAI,GAAGd,OAAO,CAACyC,YAAY,CAAC,MAAM,CAAC;EAEzC,IAAI,OAAOC,QAAQ,KAAK,WAAW,IAAI,CAAC5B,IAAI,CAACM,QAAQ,CAAC,GAAG,CAAC,EAAE;IAC1D;EACF;EASA,MAAMuB,UAAU,GACd7B,IAAI,CAAC8B,UAAU,CAAC,GAAG,CAAC,IACpBC,MAAM,CAACC,QAAQ,CAAChC,IAAI,CAACM,QAAQ,EAAAmB,iBAAA,GAACvC,OAAO,CAAC+C,QAAQ,cAAAR,iBAAA,uBAAhBA,iBAAA,CAAkBS,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;EAIrE,IAAIL,UAAU,EAAE;IACd,MAAM5C,EAAE,GAAGe,IAAI,CAACmC,KAAK,CAAC,IAAI,CAAC,CAACC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;IACxC,MAAMC,UAAU,GAAGT,QAAQ,CAACU,cAAc,CAACrD,EAAE,CAAC;IAE9C,IAAIoD,UAAU,YAAYE,WAAW,EAAE;MACrC,IAAI;QACF,MAAMC,aAAa,GAAGC,UAAU,CAC9BV,MAAM,CAACW,gBAAgB,CAACd,QAAQ,CAACe,eAAe,CAAC,CAC9CC,gBACL,CAAC;QACD,MAAMC,GAAG,GAAG7E,YAAY,CAACqE,UAAU,CAAC,GAAGG,aAAa,IAAI,CAAC;QAEzDT,MAAM,CAACe,MAAM,CAAC;UAAED;QAAI,CAAC,CAAC;QAEtB,OAAO;UAAE3D,OAAO,EAAEmD;QAAW,CAAC;MAChC,CAAC,CAAC,OAAOU,KAAK,EAAE;QACdC,OAAO,CAACD,KAAK,CAACA,KAAK,CAAC;MACtB;IACF;EACF;AACF;AAEA,SAASrC,OAAOA,CAACpB,IAAI,EAAE;EACrB,OAAO2D,QAAQ,CAAC3D,IAAI,CAAC,IAAI5B,KAAA,CAAAmD,aAAA,CAAC5C,WAAW;IAACqB,IAAI,EAAEA;EAAK,CAAE,CAAC;AACtD;AAEA,OAAO,SAAS2D,QAAQA,CAAC3D,IAAI,EAAEH,SAAkB,EAAE;EAAA,IAAA+D,WAAA,EAAAC,YAAA,EAAAC,qBAAA,EAAAC,YAAA;EACjD,OAAO/D,IAAI,aAAJA,IAAI,gBAAA4D,WAAA,GAAJ5D,IAAI,CAAE8B,KAAK,cAAA8B,WAAA,eAAXA,WAAA,CAAa5D,IAAI,IAAIA,IAAI,aAAJA,IAAI,gBAAA6D,YAAA,GAAJ7D,IAAI,CAAE8B,KAAK,cAAA+B,YAAA,gBAAAC,qBAAA,GAAXD,YAAA,CAAahE,SAAS,cAAAiE,qBAAA,eAAtBA,qBAAA,CAAwB9C,QAAQ,CAAC,UAAU,CAAC,GACpE5C,KAAK,CAAC4F,YAAY,CAAChE,IAAI,EAAE;IACvBiE,GAAG,EAAE,mBAAmB;IACxBpE,SAAS,EAAExB,UAAU,EAAA0F,YAAA,GAAC/D,IAAI,CAAC8B,KAAK,cAAAiC,YAAA,uBAAVA,YAAA,CAAYlE,SAAS,EAAEA,SAAS;EACxD,CAAC,CAAC,GACF,IAAI;AACV;AAEA,OAAO,MAAMgB,WAAW,GAAGA,CAACC,MAAc,EAAEJ,IAAY,KACtDI,MAAM,KAAK,QAAQ,IAAI,CAAC,mBAAmB,CAACoD,IAAI,CAACxD,IAAI,CAAC"}
+{"version":3,"file":"Anchor.js","names":["React","classnames","E","Context","makeUniqueId","extendPropsWithContext","getOffsetTop","IconPrimary","Tooltip","launch","launchIcon","defaultProps","AnchorInstance","localProps","context","useContext","allProps","skeleton","getTranslation","Anchor","inner_ref","innerRef","createRef","id","element","className","children","tooltip","icon","iconPosition","omitClass","targetBlankTitle","rest","_objectWithoutProperties","_excluded","attributes","internalId","as","href","to","_opensNewTab","opensNewTab","target","showLaunchIcon","includes","showTooltip","title","iconNode","getIcon","suffix","_IconPrimary","createElement","prefix","Fragment","_extends","showDelay","targetElement","forwardRef","props","ref","_supportsSpacingProps","scrollToHashHandler","event","_element$pathname","currentTarget","getAttribute","document","isSamePath","startsWith","window","location","pathname","replace","split","reverse","anchorElem","getElementById","HTMLElement","scrollPadding","parseFloat","getComputedStyle","documentElement","scrollPaddingTop","top","scroll","error","console","pickIcon","_icon$props","_icon$props2","_icon$props2$classNam","_icon$props3","cloneElement","key","test"],"sources":["../../../../src/components/anchor/Anchor.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport E, { ElementProps } from '../../elements/Element'\nimport Context from '../../shared/Context'\nimport {\n  makeUniqueId,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { getOffsetTop } from '../../shared/helpers'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport Tooltip from '../tooltip/Tooltip'\nimport { launch as launchIcon } from '../../icons'\nimport type { IconIcon } from '../icon/Icon'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { DynamicElement, SpacingProps } from '../../shared/types'\n\n// Local type for react-router-dom link with only the necessary props. Done this way to prevent react-router-dom dependency.\ntype ReactRouterLink = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  'href'\n> & {\n  to: string | { pathname?: string; search?: string; has?: string }\n}\n\nexport type AnchorProps = {\n  element?:\n    | DynamicElement<HTMLAnchorElement | AnchorAllProps>\n    | React.ForwardRefExoticComponent<\n        ReactRouterLink & React.RefAttributes<HTMLAnchorElement>\n      >\n  href?: string\n  to?: string\n  targetBlankTitle?: string\n  target?: string\n  tooltip?: React.ReactNode\n  icon?: IconIcon\n  iconPosition?: 'left' | 'right'\n  skeleton?: SkeletonShow\n  omitClass?: boolean\n  innerRef?: React.RefObject<HTMLAnchorElement>\n\n  /** @deprecated use innerRef instead */\n  inner_ref?: React.RefObject<HTMLAnchorElement>\n}\n\nexport type AnchorAllProps = AnchorProps &\n  Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'> &\n  SpacingProps\n\nconst defaultProps = {}\n\nexport function AnchorInstance(localProps: AnchorAllProps) {\n  const context = React.useContext(Context)\n  const allProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    { skeleton: context?.skeleton },\n    context?.getTranslation(localProps as AnchorAllProps).Anchor,\n    context?.Anchor\n  )\n\n  // deprecated: inner_ref is still needed to support Button's usage of Anchor\n  if (typeof allProps.inner_ref !== 'undefined') {\n    allProps.innerRef = allProps.inner_ref\n    delete allProps.inner_ref\n  }\n\n  if (!allProps.innerRef) {\n    allProps.innerRef = React.createRef()\n  }\n\n  const {\n    id,\n    element,\n    className,\n    children,\n    tooltip,\n    icon,\n    iconPosition = 'left',\n    omitClass,\n    innerRef,\n    targetBlankTitle,\n    ...rest\n  } = allProps\n\n  const attributes = rest as ElementProps\n  const internalId = id || 'id' + makeUniqueId()\n  const as = element || 'a'\n\n  const href = allProps.href || allProps.to\n  const _opensNewTab = opensNewTab(allProps.target, href)\n  const showLaunchIcon =\n    _opensNewTab &&\n    !className?.includes('dnb-anchor--no-icon') &&\n    !omitClass\n  const showTooltip = (tooltip || _opensNewTab) && !allProps.title\n\n  const iconNode = icon && getIcon(icon)\n\n  const suffix =\n    (iconPosition === 'right' && iconNode) ||\n    (showLaunchIcon && (\n      <IconPrimary className=\"dnb-anchor__launch-icon\" icon={launchIcon} />\n    ))\n\n  const prefix = iconPosition === 'left' && iconNode\n\n  return (\n    <>\n      <E\n        as={as}\n        id={id}\n        className={classnames(\n          omitClass !== true &&\n            classnames(\n              'dnb-anchor',\n              prefix && 'dnb-anchor--icon-left',\n              suffix && 'dnb-anchor--icon-right',\n              typeof children !== 'string' && 'dnb-anchor--was-node'\n            ),\n          className\n        )}\n        {...attributes}\n        innerRef={innerRef}\n      >\n        {prefix}\n        {children}\n        {suffix}\n      </E>\n\n      {showTooltip && (\n        <Tooltip\n          showDelay={100}\n          id={internalId + '-tooltip'}\n          targetElement={innerRef}\n          tooltip={tooltip}\n        >\n          {allProps.title || targetBlankTitle}\n        </Tooltip>\n      )}\n    </>\n  )\n}\n\nconst Anchor = React.forwardRef(\n  (props: AnchorAllProps, ref: React.RefObject<HTMLAnchorElement>) => {\n    return <AnchorInstance innerRef={ref} {...props} />\n  }\n)\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nAnchor._supportsSpacingProps = true\n\nexport default Anchor\n\nexport function scrollToHashHandler(\n  event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n) {\n  const element = event.currentTarget as HTMLAnchorElement\n  const href = element.getAttribute('href')\n\n  if (typeof document === 'undefined' || !href.includes('#')) {\n    return // stop here\n  }\n\n  /**\n   * What happens here?\n   * When `scroll-behavior: smooth;` in CSS is set,\n   * Blink/Chromium wants the user to click two times in order to actually scroll to the anchor hash.\n   * The first click, sets the hash, the second one, scrolls to it.\n   * We want Chromium browsers to scroll to the element on the first click.\n   */\n  const isSamePath =\n    href.startsWith('#') ||\n    window.location.href.includes(element.pathname?.replace(/\\/$/, ''))\n\n  // Only continue, when we are sure we are on the same page,\n  // because, the same ID may exists occasionally on the current page.\n  if (isSamePath) {\n    const id = href.split(/#/g).reverse()[0]\n    const anchorElem = document.getElementById(id)\n\n    if (anchorElem instanceof HTMLElement) {\n      try {\n        const scrollPadding = parseFloat(\n          window.getComputedStyle(document.documentElement)\n            .scrollPaddingTop\n        )\n        const top = getOffsetTop(anchorElem) - scrollPadding || 0\n\n        window.scroll({ top })\n\n        return { element: anchorElem }\n      } catch (error) {\n        console.error(error)\n      }\n    }\n  }\n}\n\nfunction getIcon(icon) {\n  return pickIcon(icon) || <IconPrimary icon={icon} />\n}\n\nexport function pickIcon(icon, className?: string) {\n  return icon?.props?.icon || icon?.props?.className?.includes('dnb-icon')\n    ? React.cloneElement(icon, {\n        key: 'button-icon-clone',\n        className: classnames(icon.props?.className, className),\n      })\n    : null\n}\n\nexport const opensNewTab = (target: string, href: string): boolean =>\n  target === '_blank' && !/^(mailto|tel|sms)/.test(href)\n"],"mappings":"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"}

package/components/card/Card.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["className", "stack", "direction", "spacing", "innerSpace", "alignSelf", "divider", "rowGap", "responsive", "filled", "title", "children"];
+const _excluded = ["className", "stack", "direction", "gap", "spacing", "innerSpace", "alignSelf", "divider", "rowGap", "responsive", "filled", "title", "children"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
@@ -16,6 +16,7 @@ function Card(props) {
       className,
       stack,
       direction,
+      gap,
       spacing,
       innerSpace,
       alignSelf = 'stretch',
@@ -69,7 +70,7 @@ function Card(props) {
     divider: divider,
     alignSelf: alignSelf,
     wrap: !stack,
-    spacing: stack ? 'medium' : spacing || false,
+    gap: stack ? 'medium' : (gap !== null && gap !== void 0 ? gap : spacing) || false,
     rowGap: rowGap || false
   }, title && React.createElement(Space, {
     id: titleId,

package/components/card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","names":["React","classnames","Flex","SectionParams","combineLabelledBy","useId","Space","Card","props","className","stack","direction","spacing","innerSpace","alignSelf","divider","rowGap","responsive","filled","title","children","rest","_objectWithoutProperties","_excluded","titleId","falseWhenSmall","small","medium","large","trueWhenSmall","basisSpace","top","right","bottom","left","smallSpace","_objectSpread","params","breakout","roundedCorner","outline","createElement","Item","_extends","element","Container","wrap","id","_supportsSpacingProps"],"sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport Flex from '../flex/Flex'\nimport { SectionParams, SectionProps } from '../section/Section'\nimport { combineLabelledBy } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\n\nimport type { BasicProps as FlexContainerProps } from '../flex/Container'\nimport type { BasicProps as FlexItemProps } from '../flex/Item'\nimport type { SpaceTypeMedia } from '../../shared/types'\nimport type { SpaceProps } from '../Space'\nimport Space from '../Space'\n\nexport type Props = {\n  /**\n   * Define a title that appears on top of the Card\n   */\n  title?: React.ReactNode\n\n  /**\n   * Define if the Card should behave responsive. Defaults to `true`\n   */\n  responsive?: boolean\n\n  /**\n   * Define if the Card should get the same background color as the outline border\n   */\n  filled?: boolean\n} & FlexContainerProps &\n  FlexItemProps & {\n    stack?: boolean\n  } & SpaceProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref' | 'wrap' | 'size'>\n\nfunction Card(props: Props) {\n  const {\n    className,\n    stack,\n    direction,\n    spacing,\n    innerSpace,\n    alignSelf = 'stretch',\n    divider = 'space',\n    rowGap,\n    responsive = true,\n    filled,\n    title,\n    children,\n    ...rest\n  } = props\n\n  const titleId = useId()\n  const falseWhenSmall = { small: false, medium: true, large: true }\n  const trueWhenSmall = { small: true, medium: false, large: false }\n  const basisSpace = {\n    top: 'medium',\n    right: 'medium',\n    bottom: 'large',\n    left: 'medium',\n  }\n  const smallSpace = responsive\n    ? {\n        ...basisSpace,\n        right: 0,\n        left: 0,\n      }\n    : basisSpace\n\n  const params = SectionParams({\n    className: classnames(\n      'dnb-card',\n      className,\n      responsive && 'dnb-card--responsive',\n      filled && 'dnb-card--filled'\n    ),\n    breakout: responsive ? trueWhenSmall : false,\n    roundedCorner: responsive ? falseWhenSmall : true,\n    outline: true,\n    innerSpace:\n      innerSpace ??\n      ({\n        small: smallSpace,\n        medium: basisSpace,\n        large: basisSpace,\n      } as SpaceTypeMedia),\n    ...(rest as SectionProps),\n    'aria-labelledby': combineLabelledBy(rest, title && titleId),\n  })\n\n  return (\n    <Flex.Item alignSelf={alignSelf} element=\"section\" {...params}>\n      <Flex.Container\n        direction={direction ?? 'vertical'}\n        divider={divider}\n        alignSelf={alignSelf}\n        wrap={!stack}\n        spacing={stack ? 'medium' : spacing || false}\n        rowGap={rowGap || false}\n      >\n        {title && (\n          <Space id={titleId} className=\"dnb-card__title\">\n            {title}\n          </Space>\n        )}\n        {children}\n      </Flex.Container>\n    </Flex.Item>\n  )\n}\n\nCard._supportsSpacingProps = true\n\nexport default Card\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,IAAI,MAAM,cAAc;AAC/B,SAASC,aAAa,QAAsB,oBAAoB;AAChE,SAASC,iBAAiB,QAAQ,+BAA+B;AACjE,OAAOC,KAAK,MAAM,4BAA4B;AAM9C,OAAOC,KAAK,MAAM,UAAU;AAuB5B,SAASC,IAAIA,CAACC,KAAY,EAAE;EAC1B,MAAM;MACJC,SAAS;MACTC,KAAK;MACLC,SAAS;MACTC,OAAO;MACPC,UAAU;MACVC,SAAS,GAAG,SAAS;MACrBC,OAAO,GAAG,OAAO;MACjBC,MAAM;MACNC,UAAU,GAAG,IAAI;MACjBC,MAAM;MACNC,KAAK;MACLC;IAEF,CAAC,GAAGZ,KAAK;IADJa,IAAI,GAAAC,wBAAA,CACLd,KAAK,EAAAe,SAAA;EAET,MAAMC,OAAO,GAAGnB,KAAK,CAAC,CAAC;EACvB,MAAMoB,cAAc,GAAG;IAAEC,KAAK,EAAE,KAAK;IAAEC,MAAM,EAAE,IAAI;IAAEC,KAAK,EAAE;EAAK,CAAC;EAClE,MAAMC,aAAa,GAAG;IAAEH,KAAK,EAAE,IAAI;IAAEC,MAAM,EAAE,KAAK;IAAEC,KAAK,EAAE;EAAM,CAAC;EAClE,MAAME,UAAU,GAAG;IACjBC,GAAG,EAAE,QAAQ;IACbC,KAAK,EAAE,QAAQ;IACfC,MAAM,EAAE,OAAO;IACfC,IAAI,EAAE;EACR,CAAC;EACD,MAAMC,UAAU,GAAGlB,UAAU,GAAAmB,aAAA,CAAAA,aAAA,KAEpBN,UAAU;IACbE,KAAK,EAAE,CAAC;IACRE,IAAI,EAAE;EAAC,KAETJ,UAAU;EAEd,MAAMO,MAAM,GAAGlC,aAAa,CAAAiC,aAAA,CAAAA,aAAA;IAC1B3B,SAAS,EAAER,UAAU,CACnB,UAAU,EACVQ,SAAS,EACTQ,UAAU,IAAI,sBAAsB,EACpCC,MAAM,IAAI,kBACZ,CAAC;IACDoB,QAAQ,EAAErB,UAAU,GAAGY,aAAa,GAAG,KAAK;IAC5CU,aAAa,EAAEtB,UAAU,GAAGQ,cAAc,GAAG,IAAI;IACjDe,OAAO,EAAE,IAAI;IACb3B,UAAU,EACRA,UAAU,aAAVA,UAAU,cAAVA,UAAU,GACT;MACCa,KAAK,EAAES,UAAU;MACjBR,MAAM,EAAEG,UAAU;MAClBF,KAAK,EAAEE;IACT;EAAoB,GAClBT,IAAI;IACR,iBAAiB,EAAEjB,iBAAiB,CAACiB,IAAI,EAAEF,KAAK,IAAIK,OAAO;EAAC,EAC7D,CAAC;EAEF,OACExB,KAAA,CAAAyC,aAAA,CAACvC,IAAI,CAACwC,IAAI,EAAAC,QAAA;IAAC7B,SAAS,EAAEA,SAAU;IAAC8B,OAAO,EAAC;EAAS,GAAKP,MAAM,GAC3DrC,KAAA,CAAAyC,aAAA,CAACvC,IAAI,CAAC2C,SAAS;IACblC,SAAS,EAAEA,SAAS,aAATA,SAAS,cAATA,SAAS,GAAI,UAAW;IACnCI,OAAO,EAAEA,OAAQ;IACjBD,SAAS,EAAEA,SAAU;IACrBgC,IAAI,EAAE,CAACpC,KAAM;IACbE,OAAO,EAAEF,KAAK,GAAG,QAAQ,GAAGE,OAAO,IAAI,KAAM;IAC7CI,MAAM,EAAEA,MAAM,IAAI;EAAM,GAEvBG,KAAK,IACJnB,KAAA,CAAAyC,aAAA,CAACnC,KAAK;IAACyC,EAAE,EAAEvB,OAAQ;IAACf,SAAS,EAAC;EAAiB,GAC5CU,KACI,CACR,EACAC,QACa,CACP,CAAC;AAEhB;AAEAb,IAAI,CAACyC,qBAAqB,GAAG,IAAI;AAEjC,eAAezC,IAAI"}
+{"version":3,"file":"Card.js","names":["React","classnames","Flex","SectionParams","combineLabelledBy","useId","Space","Card","props","className","stack","direction","gap","spacing","innerSpace","alignSelf","divider","rowGap","responsive","filled","title","children","rest","_objectWithoutProperties","_excluded","titleId","falseWhenSmall","small","medium","large","trueWhenSmall","basisSpace","top","right","bottom","left","smallSpace","_objectSpread","params","breakout","roundedCorner","outline","createElement","Item","_extends","element","Container","wrap","id","_supportsSpacingProps"],"sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport Flex from '../flex/Flex'\nimport { SectionParams, SectionProps } from '../section/Section'\nimport { combineLabelledBy } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\n\nimport type { BasicProps as FlexContainerProps } from '../flex/Container'\nimport type { BasicProps as FlexItemProps } from '../flex/Item'\nimport type { SpaceTypeMedia } from '../../shared/types'\nimport type { SpaceProps } from '../Space'\nimport Space from '../Space'\n\nexport type Props = {\n  /**\n   * Define a title that appears on top of the Card\n   */\n  title?: React.ReactNode\n\n  /**\n   * Define if the Card should behave responsive. Defaults to `true`\n   */\n  responsive?: boolean\n\n  /**\n   * Define if the Card should get the same background color as the outline border\n   */\n  filled?: boolean\n} & FlexContainerProps &\n  FlexItemProps & {\n    stack?: boolean\n  } & SpaceProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref' | 'wrap' | 'size'>\n\nfunction Card(props: Props) {\n  const {\n    className,\n    stack,\n    direction,\n    gap,\n    spacing,\n    innerSpace,\n    alignSelf = 'stretch',\n    divider = 'space',\n    rowGap,\n    responsive = true,\n    filled,\n    title,\n    children,\n    ...rest\n  } = props\n\n  const titleId = useId()\n  const falseWhenSmall = { small: false, medium: true, large: true }\n  const trueWhenSmall = { small: true, medium: false, large: false }\n  const basisSpace = {\n    top: 'medium',\n    right: 'medium',\n    bottom: 'large',\n    left: 'medium',\n  }\n  const smallSpace = responsive\n    ? {\n        ...basisSpace,\n        right: 0,\n        left: 0,\n      }\n    : basisSpace\n\n  const params = SectionParams({\n    className: classnames(\n      'dnb-card',\n      className,\n      responsive && 'dnb-card--responsive',\n      filled && 'dnb-card--filled'\n    ),\n    breakout: responsive ? trueWhenSmall : false,\n    roundedCorner: responsive ? falseWhenSmall : true,\n    outline: true,\n    innerSpace:\n      innerSpace ??\n      ({\n        small: smallSpace,\n        medium: basisSpace,\n        large: basisSpace,\n      } as SpaceTypeMedia),\n    ...(rest as SectionProps),\n    'aria-labelledby': combineLabelledBy(rest, title && titleId),\n  })\n\n  return (\n    <Flex.Item alignSelf={alignSelf} element=\"section\" {...params}>\n      <Flex.Container\n        direction={direction ?? 'vertical'}\n        divider={divider}\n        alignSelf={alignSelf}\n        wrap={!stack}\n        gap={stack ? 'medium' : (gap ?? spacing) || false}\n        rowGap={rowGap || false}\n      >\n        {title && (\n          <Space id={titleId} className=\"dnb-card__title\">\n            {title}\n          </Space>\n        )}\n        {children}\n      </Flex.Container>\n    </Flex.Item>\n  )\n}\n\nCard._supportsSpacingProps = true\n\nexport default Card\n"],"mappings":"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"}

package/components/card/style/dnb-card.css

@@ -59,8 +59,7 @@
   flex-wrap: nowrap;
 }
 .dnb-card--filled .dnb-scroll-view {
-  -webkit-clip-path: inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner));
-          clip-path: inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner));
+  clip-path: inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner));
 }
 .dnb-card > .dnb-flex-container > .dnb-space:has(> .dnb-scroll-view) {
   width: 100%;

package/components/card/style/dnb-card.min.css

@@ -1 +1 @@
-.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card__title{font-size:var(--font-size-small);font-weight:var(--font-weight-medium);padding-bottom:1rem}.dnb-card:not([style*="--space-"]) .dnb-card__title{padding:1rem}.dnb-card.dnb-section{background-color:var(--background-color)}.dnb-card--filled.dnb-card.dnb-section{--background-color:var(--outline-color)}@media screen and (max-width:40em){.dnb-card--responsive.dnb-section:before{--outline:99vw 0 0 0 var(--background-color),198vw 0 0 0 var(--background-color),297vw 0 0 0 var(--background-color),396vw 0 0 0 var(--background-color),0 var(--outline-width) 0 0 var(--outline-color),99vw var(--outline-width) 0 0 var(--outline-color),0 calc(var(--outline-width)*-1) 0 0 var(--outline-color),99vw calc(var(--outline-width)*-1) 0 0 var(--outline-color),198vw var(--outline-width) 0 0 var(--outline-color),198vw calc(var(--outline-width)*-1) 0 0 var(--outline-color);left:var(--left)}.dnb-card+.dnb-card--responsive:not([class*=space__top]){background:linear-gradient(to left,var(--background-color),var(--background-color)) no-repeat 0 var(--outline-width)}.dnb-card+.dnb-card--responsive:not([class*=space__top]):before{top:var(--outline-width)}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive{margin-top:0}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive:before{top:var(--outline-width);z-index:0}}.dnb-card .dnb-flex-container:has(>.dnb-card__title+.dnb-scroll-view){align-items:stretch;flex-wrap:nowrap}.dnb-card--filled .dnb-scroll-view{-webkit-clip-path:inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner));clip-path:inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner))}.dnb-card>.dnb-flex-container>.dnb-space:has(>.dnb-scroll-view){width:100%}
+.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card__title{font-size:var(--font-size-small);font-weight:var(--font-weight-medium);padding-bottom:1rem}.dnb-card:not([style*="--space-"]) .dnb-card__title{padding:1rem}.dnb-card.dnb-section{background-color:var(--background-color)}.dnb-card--filled.dnb-card.dnb-section{--background-color:var(--outline-color)}@media screen and (max-width:40em){.dnb-card--responsive.dnb-section:before{--outline:99vw 0 0 0 var(--background-color),198vw 0 0 0 var(--background-color),297vw 0 0 0 var(--background-color),396vw 0 0 0 var(--background-color),0 var(--outline-width) 0 0 var(--outline-color),99vw var(--outline-width) 0 0 var(--outline-color),0 calc(var(--outline-width)*-1) 0 0 var(--outline-color),99vw calc(var(--outline-width)*-1) 0 0 var(--outline-color),198vw var(--outline-width) 0 0 var(--outline-color),198vw calc(var(--outline-width)*-1) 0 0 var(--outline-color);left:var(--left)}.dnb-card+.dnb-card--responsive:not([class*=space__top]){background:linear-gradient(to left,var(--background-color),var(--background-color)) no-repeat 0 var(--outline-width)}.dnb-card+.dnb-card--responsive:not([class*=space__top]):before{top:var(--outline-width)}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive{margin-top:0}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive:before{top:var(--outline-width);z-index:0}}.dnb-card .dnb-flex-container:has(>.dnb-card__title+.dnb-scroll-view){align-items:stretch;flex-wrap:nowrap}.dnb-card--filled .dnb-scroll-view{clip-path:inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner))}.dnb-card>.dnb-flex-container>.dnb-space:has(>.dnb-scroll-view){width:100%}

package/components/card/style/themes/dnb-card-theme-sbanken.css

@@ -0,0 +1,5 @@
+.dnb-card.dnb-section {
+  --outline-color: var(--border-color, var(--sb-color-gray-light));
+  --outline-width: 0.0625rem;
+  --background-color: var(--sb-color-white);
+}

package/components/card/style/themes/dnb-card-theme-sbanken.min.css

@@ -0,0 +1 @@
+.dnb-card.dnb-section{--outline-color:var(--border-color,var(--sb-color-gray-light));--outline-width:0.0625rem;--background-color:var(--sb-color-white)}

package/components/card/style/themes/dnb-card-theme-sbanken.scss

@@ -0,0 +1,7 @@
+.dnb-card {
+  &.dnb-section {
+    --outline-color: var(--border-color, var(--sb-color-gray-light));
+    --outline-width: 0.0625rem;
+    --background-color: var(--sb-color-white);
+  }
+}

package/components/checkbox/CheckIcon.d.ts

@@ -1,5 +1,5 @@
 export type CheckIconProps = {
     size: string;
 };
-declare function CheckIcon({ size, ...props }: CheckIconProps): import("react/jsx-runtime").JSX.Element;
+declare function CheckIcon({ size }: CheckIconProps): import("react/jsx-runtime").JSX.Element;
 export default CheckIcon;

package/components/checkbox/CheckIcon.js

@@ -1,24 +1,20 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["size"];
 import React from 'react';
 function CheckIcon(_ref) {
   let {
-      size
-    } = _ref,
-    props = _objectWithoutProperties(_ref, _excluded);
+    size
+  } = _ref;
   let vB = 16;
   if (size === 'large') {
     vB = 24;
   }
-  return React.createElement("svg", _extends({
+  return React.createElement("svg", {
     width: vB,
     height: vB,
     viewBox: `0 0 ${vB} ${vB}`,
     fill: "none",
     className: "dnb-checkbox__gfx",
     "aria-hidden": true
-  }, props), React.createElement("path", {
+  }, React.createElement("path", {
     d: size === 'large' ? 'M1.5 15L7.5 21L22.5 3' : 'M1 10L5 14L15 2',
     stroke: "currentColor",
     strokeWidth: "1.5",