@dnb/eufemia/extensions/forms/FieldBlock/style/dnb-field-block--isolated.min.css

DNB Eufemia Design System UI Library

@charset "UTF-8";.eufemia-scope--10_104_0{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem;--forms-field-label-max-width--large:var(--prose-max-width)}.eufemia-scope--10_104_0 fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}.eufemia-scope--10_104_0 fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}.eufemia-scope--10_104_0 fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.eufemia-scope--10_104_0 fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}.eufemia-scope--10_104_0 fieldset.dnb-forms-field-block{border:none;padding:0}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid{display:grid;grid-template-areas:"label" "help" "contents" "indicator" "status";grid-template-columns:minmax(-webkit-min-content,var(--block-content-width,auto));grid-template-columns:minmax(min-content,var(--block-content-width,auto))}.eufemia-scope--10_104_0 .dnb-forms-field-block{--label-margin:0.25rem}.eufemia-scope--10_104_0 .dnb-forms-field-block--label-height-small{--label-margin:0}.eufemia-scope--10_104_0 .dnb-forms-field-block--label-height-medium{--label-margin:0.5rem}.eufemia-scope--10_104_0 .dnb-forms-field-block--label-height-large{--label-margin:0.7rem}.eufemia-scope--10_104_0 .dnb-forms-field-block--width-stretch{flex-grow:1}.eufemia-scope--10_104_0 .dnb-forms-field-block--width-stretch label.dnb-form-label{max-width:none}@media screen and (min-width:25.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block--width-custom{width:calc(var(--dnb-forms-field-block-width))}.eufemia-scope--10_104_0 .dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.eufemia-scope--10_104_0 .dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.eufemia-scope--10_104_0 .dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.eufemia-scope--10_104_0 .dnb-forms-field-block:not([class*="--content-width"]){--max-width:var(--forms-field-label-max-width--large)}.eufemia-scope--10_104_0 .dnb-forms-field-block__label,.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label{align-items:center;display:flex;grid-area:label;margin-right:0;max-width:var(--forms-field-label-max-width--large)}.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label__description,.eufemia-scope--10_104_0 .dnb-forms-field-block__label__description{vertical-align:top}.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label__content:has(+.dnb-help-button),.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label__description:has(+.dnb-help-button),.eufemia-scope--10_104_0 .dnb-forms-field-block__label__content:has(+.dnb-help-button),.eufemia-scope--10_104_0 .dnb-forms-field-block__label__description:has(+.dnb-help-button){margin-right:.5rem}.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label:has(.dnb-forms-field-block__label__description,.dnb-forms-field-block__label.dnb-form-label__description) .dnb-help-button,.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label:has(.dnb-forms-field-block__label__description,.dnb-forms-field-block__label.dnb-form-label__description):not(.dnb-forms-field-block__label:has(+.dnb-help-button),.dnb-forms-field-block__label.dnb-form-label:has(+.dnb-help-button)) .dnb-forms-field-block__label.dnb-form-label__content,.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label:has(.dnb-forms-field-block__label__description,.dnb-forms-field-block__label.dnb-form-label__description):not(.dnb-forms-field-block__label:has(+.dnb-help-button),.dnb-forms-field-block__label.dnb-form-label:has(+.dnb-help-button)) .dnb-forms-field-block__label__content,.eufemia-scope--10_104_0 .dnb-forms-field-block__label:has(.dnb-forms-field-block__label__description,.dnb-forms-field-block__label.dnb-form-label__description) .dnb-help-button,.eufemia-scope--10_104_0 .dnb-forms-field-block__label:has(.dnb-forms-field-block__label__description,.dnb-forms-field-block__label.dnb-form-label__description):not(.dnb-forms-field-block__label:has(+.dnb-help-button),.dnb-forms-field-block__label.dnb-form-label:has(+.dnb-help-button)) .dnb-forms-field-block__label.dnb-form-label__content,.eufemia-scope--10_104_0 .dnb-forms-field-block__label:has(.dnb-forms-field-block__label__description,.dnb-forms-field-block__label.dnb-form-label__description):not(.dnb-forms-field-block__label:has(+.dnb-help-button),.dnb-forms-field-block__label.dnb-form-label:has(+.dnb-help-button)) .dnb-forms-field-block__label__content{margin-right:.3em}.eufemia-scope--10_104_0 .dnb-forms-field-block__label .dnb-help-button__word-joiner,.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label .dnb-help-button__word-joiner{margin-left:.45em;white-space:nowrap}.eufemia-scope--10_104_0 .dnb-forms-field-block__label .dnb-help-button__word-joiner:before,.eufemia-scope--10_104_0 .dnb-forms-field-block__label.dnb-form-label .dnb-help-button__word-joiner:before{content:"⁠"}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-vertical{flex-wrap:wrap}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-vertical>.dnb-form-label{margin-bottom:.5rem}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal .dnb-forms-field-block__label{margin-right:1rem}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal>.dnb-form-label{margin-bottom:var(--label-margin);margin-top:var(--label-margin)}@media screen and (max-width:40em){.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal>.dnb-form-label{margin-bottom:calc(var(--label-margin) + .5rem)}}@media screen and (min-width:40.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" ". help" ". indicator" ". status";grid-template-columns:minmax(var(--dnb-forms-field-block-layout-width-min,-webkit-min-content),var(--dnb-forms-field-block-layout-width-max,-webkit-max-content)) auto;grid-template-columns:minmax(var(--dnb-forms-field-block-layout-width-min,min-content),var(--dnb-forms-field-block-layout-width-max,max-content)) auto}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal .dnb-help-button__content{--help-button-indent-width:0}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal .dnb-help-button__content .dnb-section{--rounded-corner:0.25rem;align-self:flex-start}.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal .dnb-forms-field-block__contents{align-self:end}}.eufemia-scope--10_104_0 .dnb-forms-field-block__indicator{grid-area:indicator;position:relative}.eufemia-scope--10_104_0 .dnb-forms-field-block__indicator .dnb-forms-submit-indicator__content{position:absolute}.eufemia-scope--10_104_0 .dnb-forms-field-block__help{display:flex;flex-flow:column;grid-area:help}.eufemia-scope--10_104_0 .dnb-forms-field-block__help .dnb-section{margin-bottom:1rem}.eufemia-scope--10_104_0 .dnb-forms-field-block__help .dnb-section>.dnb-p--lead{margin-bottom:.5rem}@media screen and (min-width:40.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal .dnb-forms-field-block__help .dnb-section{margin-bottom:0;margin-top:.5rem}}.eufemia-scope--10_104_0 .dnb-forms-field-block__status{grid-area:status}.eufemia-scope--10_104_0 .dnb-forms-field-block__status .dnb-form-status__shell{margin-bottom:var(--field-block-status-margin-bottom,0);margin-top:var(--field-block-status-margin-top,.5rem);max-width:var(--prose-max-width)}@media screen and (max-width:15em){.eufemia-scope--10_104_0 .dnb-forms-field-block__status{width:90%}}.eufemia-scope--10_104_0 .dnb-forms-field-block--status-position-above .dnb-forms-field-block__grid{grid-template-areas:"label" "help" "status" "contents" "indicator"}.eufemia-scope--10_104_0 .dnb-forms-field-block--status-position-above{--field-block-status-margin-top:0;--field-block-status-margin-bottom:0.5rem}@media screen and (min-width:40.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block--status-position-above .dnb-forms-field-block__grid.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label status" ". contents" ". help" ". indicator"}}.eufemia-scope--10_104_0 .dnb-forms-field-block__contents{display:flex;grid-area:contents;width:100%}.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-stretch{width:100%}.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-custom{--field-block-content-width:calc(var(--dnb-forms-field-block-content-width))}.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-small{--field-block-content-width:var(--forms-field-width--small)}.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-medium{--field-block-content-width:var(--forms-field-width--medium)}.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-large{--field-block-content-width:var(--forms-field-width--large)}@media screen and (min-width:25.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-custom,.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-large,.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-medium,.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-small{max-width:var(--field-block-content-width,none)}}@media screen and (min-width:40.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-custom,.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-large,.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-medium,.eufemia-scope--10_104_0 .dnb-forms-field-block__contents--width-small{width:var(--field-block-content-width,-webkit-max-content);width:var(--field-block-content-width,max-content)}}.eufemia-scope--10_104_0 .dnb-forms-field-block__composition--vertical .dnb-forms-field-block__contents{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.eufemia-scope--10_104_0 .dnb-forms-field-block__composition--horizontal .dnb-forms-field-block__contents{column-gap:var(--spacing-small);display:flex;flex-flow:row;flex-wrap:wrap;row-gap:var(--spacing-small)}.eufemia-scope--10_104_0 .dnb-forms-field-block__composition--horizontal .dnb-forms-field-block__contents>.dnb-forms-field-block--width-stretch{flex:1}@media screen and (min-width:25.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block__composition--horizontal .dnb-forms-field-block__contents{align-items:flex-end}.eufemia-scope--10_104_0 .dnb-forms-field-block__composition--horizontal .dnb-forms-field-block__contents[class*=align-center]{align-items:center}}@media screen and (max-width:25em){.eufemia-scope--10_104_0 .dnb-forms-field-block__composition--horizontal .dnb-forms-field-block__contents{flex-flow:column;row-gap:var(--spacing-x-small)}.eufemia-scope--10_104_0 .dnb-forms-field-block__composition>.dnb-forms-field-block__grid>.dnb-forms-submit-indicator{display:none}}@media screen and (min-width:25.00625em){.eufemia-scope--10_104_0 .dnb-forms-field-block__composition>.dnb-forms-field-block__grid>.dnb-forms-field-block__contents .dnb-forms-submit-indicator{display:none}}