@dnb/eufemia 10.76.1 → 10.77.0

package/components/drawer/style/dnb-drawer--isolated.css

@@ -0,0 +1,345 @@
+@charset "UTF-8";
+/*
+* Drawer component
+*
+*/
+/*
+ * Utilities
+ */
+/*
+ * Modal component
+ *
+ */
+@keyframes show-modal {
+  from {
+    opacity: 0.1;
+    transform: translate3d(0, -1rem, 0);
+  }
+  to {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+@keyframes hide-modal {
+  from {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+  to {
+    transform: translate3d(0, 1rem, 0);
+    opacity: 0;
+  }
+}
+@keyframes show-drawer {
+  to {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+}
+@keyframes hide-drawer-left {
+  from {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+  to {
+    transform: translate3d(-20rem, 0, 0);
+    opacity: 0;
+  }
+}
+@keyframes hide-drawer-top {
+  from {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+  to {
+    transform: translate3d(0, -20rem, 0);
+    opacity: 0;
+  }
+}
+@keyframes hide-drawer-bottom {
+  from {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+  to {
+    transform: translate3d(0, 20rem, 0);
+    opacity: 0;
+  }
+}
+@keyframes hide-drawer-right {
+  from {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+  to {
+    transform: translate3d(20rem, 0, 0);
+    opacity: 0;
+  }
+}
+@keyframes show-modal-overlay {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes hide-modal-overlay {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer {
+  --drawer-width: 40vw;
+  --drawer-min-width: 384px;
+  --drawer-max-width: 40rem;
+  --drawer-spacing: 2rem;
+  --drawer-spacing-minus: -2rem;
+  position: relative;
+  max-height: 100vh;
+  width: 100%;
+  height: 100vh;
+  max-width: 100%;
+  max-height: 100vh;
+  border-radius: 0;
+  box-shadow: none;
+  width: var(--drawer-width);
+  min-width: var(--drawer-min-width);
+  max-width: var(--drawer-max-width);
+  box-shadow: var(--shadow-default);
+  -webkit-user-select: text;
+          user-select: text;
+  border: none;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer {
+    --drawer-width: 100vw;
+    --drawer-min-width: none;
+    --drawer-max-width: none;
+  }
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--auto-fullscreen {
+    width: 100%;
+    height: 100vh;
+    max-width: 100%;
+    max-height: 100vh;
+    border-radius: 0;
+    box-shadow: none;
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer__inner {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  z-index: 10;
+  /** 
+    NB: Do not use "overflow-x: hidden;" in here,
+    (overflowing one direction, will influence the other – we can't just have one at a time) 
+    To make the Drawer scroll, we use .dnb-scroll-view
+  */
+  width: 100%;
+  height: calc(100% - var(--header-height, 0));
+  /** Sets the color on scroll overflow (at the bottom) */
+  background-color: var(--modal-background-color, transparent);
+}
+.eufemia-scope--10_77_0 .dnb-drawer__align--centered .dnb-drawer__inner {
+  align-items: center;
+  justify-content: center;
+}
+.eufemia-scope--10_77_0 .dnb-drawer__content {
+  position: relative;
+  z-index: 1;
+}
+.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content {
+  padding: 0 var(--drawer-spacing);
+}
+@media screen and (min-width: 80.00625em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content {
+    padding: 0 calc(var(--drawer-spacing) * 1.75);
+  }
+}
+@media screen and (max-width: 60em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content {
+    padding: 0 calc(var(--drawer-spacing) / 1.333333);
+  }
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content {
+    padding: 0 calc(var(--drawer-spacing) / 2);
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer__align--center .dnb-drawer__content {
+  align-items: center;
+  text-align: center;
+}
+.eufemia-scope--10_77_0 .dnb-drawer__align--right .dnb-drawer__content {
+  align-items: flex-end;
+  text-align: right;
+}
+.eufemia-scope--10_77_0 .dnb-drawer--top, .eufemia-scope--10_77_0 .dnb-drawer--bottom {
+  max-width: 100%;
+  width: 100vw;
+  height: 40vh;
+}
+@media screen and (max-height: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--top, .eufemia-scope--10_77_0 .dnb-drawer--bottom {
+    height: 100vw;
+    min-height: auto;
+    max-height: auto;
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer--fullscreen {
+  width: 100%;
+  height: 100vh;
+  max-width: 100%;
+  max-height: 100vh;
+  border-radius: 0;
+  box-shadow: none;
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer {
+  opacity: 0.1;
+  animation: show-drawer var(--modal-animation-duration) ease-out forwards;
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--left {
+  transform: translate3d(-20rem, 0, 0);
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--right {
+  transform: translate3d(20rem, 0, 0);
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--top {
+  transform: translate3d(0, -20rem, 0);
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--bottom {
+  transform: translate3d(0, 20rem, 0);
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--left {
+  animation: hide-drawer-left var(--modal-animation-duration) ease-in-out forwards;
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--right {
+  animation: hide-drawer-right var(--modal-animation-duration) ease-in-out forwards;
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--top {
+  animation: hide-drawer-top var(--modal-animation-duration) ease-in-out forwards;
+}
+html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--bottom {
+  animation: hide-drawer-bottom var(--modal-animation-duration) ease-in-out forwards;
+}
+.eufemia-scope--10_77_0 .dnb-drawer--no-animation {
+  animation-duration: 0ms !important;
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--no-animation-on-mobile {
+    animation-duration: 0ms !important;
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer__root {
+  align-items: flex-start;
+  justify-content: flex-start;
+}
+@media screen and (max-width: 60em) {
+  .eufemia-scope--10_77_0 .dnb-drawer__title {
+    font-size: var(--font-size-large) !important;
+    line-height: var(--line-height-medium) !important;
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer__title ~ .dnb-drawer__content {
+  padding-top: calc(var(--drawer-spacing) / 1.333333);
+}
+.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header [class*=dnb-h--], .eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header .dnb-drawer__title {
+  padding: 0;
+}
+.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header [class*=dnb-h--]:not([class*=__top]), .eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header .dnb-drawer__title:not([class*=__top]) {
+  margin-top: 0;
+}
+.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header [class*=dnb-h--]:not([class*=__bottom]), .eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header .dnb-drawer__title:not([class*=__bottom]) {
+  margin-bottom: 0;
+}
+.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header::after {
+  top: -500%;
+  height: 600%;
+}
+.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header {
+  padding: 0 var(--drawer-spacing);
+}
+@media screen and (min-width: 80.00625em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header {
+    padding: 0 calc(var(--drawer-spacing) * 1.75);
+  }
+}
+@media screen and (max-width: 60em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header {
+    padding: 0 calc(var(--drawer-spacing) / 1.333333);
+  }
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header {
+    padding: 0 calc(var(--drawer-spacing) / 2);
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header .dnb-tabs {
+  margin-top: var(--drawer-spacing);
+}
+.eufemia-scope--10_77_0 .dnb-drawer__body {
+  padding-bottom: calc(var(--drawer-spacing) * 2);
+  margin-bottom: calc(var(--drawer-spacing-minus) * 2);
+}
+@supports (-webkit-touch-callout: none) {
+  .eufemia-scope--10_77_0 .dnb-drawer__body {
+    padding-bottom: calc(var(--drawer-spacing-minus) * 8);
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer__navigation.dnb-section {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section {
+  position: sticky;
+  top: 0;
+  left: 0;
+  z-index: 99;
+  margin: var(--drawer-spacing) 0;
+  padding: 0 var(--drawer-spacing);
+}
+@media screen and (min-width: 80.00625em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section {
+    padding: 0 calc(var(--drawer-spacing) * 1.75);
+  }
+}
+@media screen and (max-width: 60em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section {
+    padding: 0 calc(var(--drawer-spacing) / 1.333333);
+  }
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section {
+    padding: 0 calc(var(--drawer-spacing) / 2);
+  }
+}
+.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section.dnb-drawer__navigation--sticky {
+  z-index: 2999;
+}
+.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__navigation--sticky::before {
+  content: "";
+  position: absolute;
+  z-index: -1;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  height: 300%;
+  box-shadow: var(--shadow-default);
+}
+.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__navigation:not(.dnb-drawer__navigation--sticky)::after {
+  color: transparent;
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-drawer--no-animation-on-mobile {
+    animation-delay: 0ms !important;
+    animation-duration: 0ms !important;
+  }
+}

package/components/drawer/style/dnb-drawer--isolated.min.css

@@ -0,0 +1 @@
+@keyframes show-modal{0%{opacity:.1;transform:translate3d(0,-1rem,0)}to{opacity:1;transform:translateZ(0)}}@keyframes hide-modal{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(0,1rem,0)}}@keyframes show-drawer{to{opacity:1;transform:translateZ(0)}}@keyframes hide-drawer-left{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(-20rem,0,0)}}@keyframes hide-drawer-top{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(0,-20rem,0)}}@keyframes hide-drawer-bottom{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(0,20rem,0)}}@keyframes hide-drawer-right{0%{opacity:1;transform:translateZ(0)}to{opacity:0;transform:translate3d(20rem,0,0)}}@keyframes show-modal-overlay{0%{opacity:0}to{opacity:1}}@keyframes hide-modal-overlay{0%{opacity:1}to{opacity:0}}.eufemia-scope--10_77_0 .dnb-drawer{--drawer-width:40vw;--drawer-min-width:384px;--drawer-max-width:40rem;--drawer-spacing:2rem;--drawer-spacing-minus:-2rem;-webkit-tap-highlight-color:rgba(0,0,0,0);border:none;border-radius:0;box-shadow:none;box-shadow:var(--shadow-default);height:100vh;max-height:100vh;max-width:100%;max-width:var(--drawer-max-width);min-width:var(--drawer-min-width);position:relative;-webkit-user-select:text;user-select:text;width:100%;width:var(--drawer-width)}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-drawer{--drawer-width:100vw;--drawer-min-width:none;--drawer-max-width:none}.eufemia-scope--10_77_0 .dnb-drawer--auto-fullscreen{border-radius:0;box-shadow:none;height:100vh;max-height:100vh;max-width:100%;width:100%}}.eufemia-scope--10_77_0 .dnb-drawer__inner{background-color:var(--modal-background-color,transparent);display:flex;flex-direction:column;height:calc(100% - var(--header-height, 0));position:relative;width:100%;z-index:10}.eufemia-scope--10_77_0 .dnb-drawer__align--centered .dnb-drawer__inner{align-items:center;justify-content:center}.eufemia-scope--10_77_0 .dnb-drawer__content{position:relative;z-index:1}.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content{padding:0 var(--drawer-spacing)}@media screen and (min-width:80.00625em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content{padding:0 calc(var(--drawer-spacing)*1.75)}}@media screen and (max-width:60em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content{padding:0 calc(var(--drawer-spacing)/1.33333)}}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__content{padding:0 calc(var(--drawer-spacing)/2)}}.eufemia-scope--10_77_0 .dnb-drawer__align--center .dnb-drawer__content{align-items:center;text-align:center}.eufemia-scope--10_77_0 .dnb-drawer__align--right .dnb-drawer__content{align-items:flex-end;text-align:right}.eufemia-scope--10_77_0 .dnb-drawer--bottom,.eufemia-scope--10_77_0 .dnb-drawer--top{height:40vh;max-width:100%;width:100vw}@media screen and (max-height:40em){.eufemia-scope--10_77_0 .dnb-drawer--bottom,.eufemia-scope--10_77_0 .dnb-drawer--top{height:100vw;max-height:auto;min-height:auto}}.eufemia-scope--10_77_0 .dnb-drawer--fullscreen{border-radius:0;box-shadow:none;height:100vh;max-height:100vh;max-width:100%;width:100%}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer{animation:show-drawer var(--modal-animation-duration) ease-out forwards;opacity:.1}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--left{transform:translate3d(-20rem,0,0)}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--right{transform:translate3d(20rem,0,0)}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--top{transform:translate3d(0,-20rem,0)}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--bottom{transform:translate3d(0,20rem,0)}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--left{animation:hide-drawer-left var(--modal-animation-duration) ease-in-out forwards}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--right{animation:hide-drawer-right var(--modal-animation-duration) ease-in-out forwards}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--top{animation:hide-drawer-top var(--modal-animation-duration) ease-in-out forwards}html:not([data-visual-test]) .eufemia-scope--10_77_0 .dnb-drawer--hide.dnb-drawer--bottom{animation:hide-drawer-bottom var(--modal-animation-duration) ease-in-out forwards}.eufemia-scope--10_77_0 .dnb-drawer--no-animation{animation-duration:0ms!important}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-drawer--no-animation-on-mobile{animation-duration:0ms!important}}.eufemia-scope--10_77_0 .dnb-drawer__root{align-items:flex-start;justify-content:flex-start}@media screen and (max-width:60em){.eufemia-scope--10_77_0 .dnb-drawer__title{font-size:var(--font-size-large)!important;line-height:var(--line-height-medium)!important}}.eufemia-scope--10_77_0 .dnb-drawer__title~.dnb-drawer__content{padding-top:calc(var(--drawer-spacing)/1.33333)}.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header .dnb-drawer__title,.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header [class*=dnb-h--]{padding:0}.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header .dnb-drawer__title:not([class*=__top]),.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header [class*=dnb-h--]:not([class*=__top]){margin-top:0}.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header .dnb-drawer__title:not([class*=__bottom]),.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header [class*=dnb-h--]:not([class*=__bottom]){margin-bottom:0}.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__header:after{height:600%;top:-500%}.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header{padding:0 var(--drawer-spacing)}@media screen and (min-width:80.00625em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header{padding:0 calc(var(--drawer-spacing)*1.75)}}@media screen and (max-width:60em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header{padding:0 calc(var(--drawer-spacing)/1.33333)}}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header{padding:0 calc(var(--drawer-spacing)/2)}}.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__header .dnb-tabs{margin-top:var(--drawer-spacing)}.eufemia-scope--10_77_0 .dnb-drawer__body{margin-bottom:calc(var(--drawer-spacing-minus)*2);padding-bottom:calc(var(--drawer-spacing)*2)}@supports (-webkit-touch-callout:none){.eufemia-scope--10_77_0 .dnb-drawer__body{padding-bottom:calc(var(--drawer-spacing-minus)*8)}}.eufemia-scope--10_77_0 .dnb-drawer__navigation.dnb-section{display:flex;flex-direction:row;justify-content:space-between}.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section{left:0;margin:var(--drawer-spacing) 0;padding:0 var(--drawer-spacing);position:sticky;top:0;z-index:99}@media screen and (min-width:80.00625em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section{padding:0 calc(var(--drawer-spacing)*1.75)}}@media screen and (max-width:60em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section{padding:0 calc(var(--drawer-spacing)/1.33333)}}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section{padding:0 calc(var(--drawer-spacing)/2)}}.eufemia-scope--10_77_0 .dnb-drawer--spacing .dnb-drawer__navigation.dnb-section.dnb-drawer__navigation--sticky{z-index:2999}.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__navigation--sticky:before{bottom:0;box-shadow:var(--shadow-default);content:"";height:300%;left:0;position:absolute;right:0;z-index:-1}.eufemia-scope--10_77_0 .dnb-drawer .dnb-drawer__navigation:not(.dnb-drawer__navigation--sticky):after{color:transparent}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-drawer--no-animation-on-mobile{animation-delay:0ms!important;animation-duration:0ms!important}}

package/components/drawer/style/themes/dnb-drawer-theme-ui--isolated.css

@@ -0,0 +1,10 @@
+/*
+* Modal theme
+*
+*/
+/*
+ * Utilities
+ */
+.eufemia-scope--10_77_0 .dnb-drawer {
+  background: var(--color-white);
+}

package/components/drawer/style/themes/dnb-drawer-theme-ui--isolated.min.css

@@ -0,0 +1 @@
+.eufemia-scope--10_77_0 .dnb-drawer{background:var(--color-white)}

package/components/dropdown/style/dnb-dropdown--isolated.css

@@ -0,0 +1,295 @@
+/*
+* Dropdown component
+*
+*/
+/*
+ * Utilities
+ */
+.eufemia-scope--10_77_0 .dnb-dropdown {
+  --dropdown-width: 16rem;
+  --dropdown-height: 2rem;
+  --dropdown-height--small: 1.5rem;
+  --dropdown-height--medium: 2.5rem;
+  --dropdown-height--large: 3rem;
+  --dropdown-padding-horizontal: 1rem;
+  --dropdown-focus-border-width: 0.125rem;
+  --dropdown-error-border-width: 0.125rem;
+  --dropdown-text-padding: 0.5rem;
+  --dropdown-button-padding: 0 1rem;
+  --dropdown-border-radius: 0.25rem;
+  --dropdown-foreground-color-primary: var(--color-black-55);
+  --dropdown-foreground-color-error: var(--color-fire-red);
+  --dropdown-background-color-disabled: var(--color-black-3);
+  --dropdown-background-color-error-active: var(--color-fire-red-8);
+  display: inline-flex;
+  align-items: center;
+  font-size: var(--font-size-small);
+  line-height: var(--dropdown-height);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__inner {
+  display: inline-flex;
+  flex-direction: column;
+  margin: 0;
+  padding: 0;
+  width: auto;
+  color: inherit;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__shell {
+  position: relative;
+  width: var(--dropdown-width);
+  height: var(--dropdown-height);
+  margin: 0;
+  padding: 0;
+  color: inherit;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__row {
+  display: inline-flex;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__icon {
+  position: relative;
+  order: 2;
+  display: inline-flex;
+  justify-content: center;
+  pointer-events: none;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__trigger {
+  position: relative;
+  z-index: 1;
+  -webkit-user-select: none;
+          user-select: none;
+  width: 100%;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__trigger.dnb-button {
+  padding: var(--dropdown-button-padding);
+  border-radius: var(--dropdown-border-radius);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-dropdown__trigger.dnb-button {
+  padding: 0;
+  border-radius: 50%;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__text {
+  order: 1;
+  position: relative;
+  z-index: 4;
+  display: inline-block;
+  width: 100%;
+  overflow: hidden;
+  color: inherit;
+  text-align: left;
+  text-overflow: ellipsis;
+  line-height: inherit;
+  font-size: var(--font-size-basis);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__text__inner {
+  display: inherit;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: inherit;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger {
+  --border-color: var(--dropdown-foreground-color-error);
+  --border-width: 0.0625rem;
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:hover[disabled] {
+  cursor: not-allowed;
+}
+html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:hover:not([disabled]) {
+  color: var(--dropdown-foreground-color-error);
+  --border-color: var(--dropdown-foreground-color-error);
+  --border-width: var(--dropdown-error-border-width);
+  box-shadow: 0 0 0 var(--border-width) var(--border-color);
+  border-color: transparent;
+}
+html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:hover:not([disabled]) .dnb-dropdown__icon .dnb-icon {
+  color: var(--dropdown-foreground-color-error);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active[disabled], html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active[disabled] {
+  cursor: not-allowed;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active:not([disabled]), html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active:not([disabled]) {
+  color: var(--dropdown-foreground-color-error);
+  background-color: var(--dropdown-background-color-error-active);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger, .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__icon {
+  color: var(--dropdown-foreground-color-error);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown > .dnb-form-status {
+  transform: translateY(-0.4375rem);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-dropdown__text {
+  order: 2;
+  padding-right: 0;
+  padding-left: var(--dropdown-text-padding);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-dropdown__icon {
+  order: 1;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-right .dnb-dropdown__text {
+  padding-right: var(--dropdown-text-padding);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--independent-width .dnb-dropdown__shell {
+  width: auto;
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-dropdown--action-menu .dnb-dropdown__trigger.dnb-button {
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+    border-radius: 50%;
+  }
+}
+@media screen and (min-width: 40.00625em) {
+  .eufemia-scope--10_77_0 .dnb-dropdown--action-menu .dnb-dropdown__shell .dnb-dropdown__text {
+    padding: 0 0.5rem;
+  }
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-dropdown--action-menu .dnb-dropdown__shell .dnb-dropdown__text {
+    width: 0;
+    padding: 0;
+  }
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-button--tertiary ~ .dnb-drawer-list__root--portal {
+  left: -0.5rem;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-right .dnb-button--tertiary ~ .dnb-drawer-list__root--portal {
+  left: 0.5rem;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary.dnb-button--active {
+  box-shadow: none;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary .dnb-button__text {
+  margin: 0 0.5rem;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary .dnb-button__text::after {
+  bottom: 0;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-button--tertiary .dnb-dropdown__text, .eufemia-scope--10_77_0 .dnb-dropdown--icon-position-right .dnb-button--tertiary .dnb-dropdown__text {
+  padding: 0;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary {
+  padding: 0;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary:focus::before {
+  left: 0 !important;
+  right: 0 !important;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--default.dnb-dropdown--is-popup .dnb-dropdown__shell, .eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-dropdown__trigger {
+  padding: 0;
+  width: var(--dropdown-height);
+  height: var(--dropdown-height);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-dropdown__icon {
+  width: 100%;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--is-popup.dnb-dropdown--scroll .dnb-dropdown__options {
+  min-height: 1rem;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-drawer-list__root {
+  width: var(--dropdown-width);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--small.dnb-dropdown--is-popup .dnb-dropdown__shell, .eufemia-scope--10_77_0 .dnb-dropdown--small.dnb-dropdown--is-popup .dnb-dropdown__trigger {
+  width: var(--dropdown-height--small);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--medium.dnb-dropdown--is-popup .dnb-dropdown__shell, .eufemia-scope--10_77_0 .dnb-dropdown--medium.dnb-dropdown--is-popup .dnb-dropdown__trigger {
+  width: var(--dropdown-height--medium);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--large.dnb-dropdown--is-popup .dnb-dropdown__shell, .eufemia-scope--10_77_0 .dnb-dropdown--large.dnb-dropdown--is-popup .dnb-dropdown__trigger {
+  width: var(--dropdown-height--large);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--small .dnb-dropdown__shell, .eufemia-scope--10_77_0 .dnb-dropdown--small .dnb-dropdown__trigger {
+  height: var(--dropdown-height--small);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--small, .eufemia-scope--10_77_0 .dnb-dropdown--small .dnb-dropdown__trigger.dnb-button {
+  line-height: var(--dropdown-height--small);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--medium .dnb-dropdown__shell, .eufemia-scope--10_77_0 .dnb-dropdown--medium .dnb-dropdown__trigger {
+  height: var(--dropdown-height--medium);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--medium, .eufemia-scope--10_77_0 .dnb-dropdown--medium .dnb-dropdown__trigger.dnb-button {
+  line-height: var(--dropdown-height--medium);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__shell, .eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__trigger {
+  height: var(--dropdown-height--large);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--large, .eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__trigger.dnb-button {
+  line-height: var(--dropdown-height--large);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__trigger.dnb-button .dnb-dropdown__text {
+  line-height: var(--line-height-basis);
+}
+.eufemia-scope--10_77_0 .dnb-dropdown > .dnb-form-label {
+  margin-right: 1rem;
+  line-height: var(--line-height-basis);
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-dropdown {
+    flex-wrap: wrap;
+  }
+  .eufemia-scope--10_77_0 .dnb-dropdown > .dnb-form-label {
+    margin-bottom: 0.5rem;
+    margin-top: 0.5rem;
+  }
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--stretch {
+  display: flex;
+  flex-grow: 1;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__inner {
+  flex-grow: 1;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__row, .eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__inner, .eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__shell {
+  width: 100%;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-form-label + .dnb-dropdown__inner {
+  width: auto;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--vertical.dnb-dropdown--stretch .dnb-dropdown__inner {
+  width: 100%;
+}
+.eufemia-scope--10_77_0 .dnb-form-row--horizontal .dnb-dropdown--stretch {
+  width: 100%;
+}
+.eufemia-scope--10_77_0 label + .dnb-dropdown[class*=__form-status] {
+  vertical-align: top;
+}
+.eufemia-scope--10_77_0 label + .dnb-dropdown[class*=__form-status] .dnb-dropdown__shell {
+  top: -0.375rem;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown__inner > .dnb-form-status {
+  order: 2;
+  margin-top: 0.5rem;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown--vertical {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown:not(.dnb-dropdown--vertical)[class*=__status] {
+  align-items: flex-start;
+}
+.eufemia-scope--10_77_0 .dnb-dropdown:not(.dnb-dropdown--vertical)[class*=__status] > .dnb-form-label {
+  margin-top: 0.25rem;
+}
+@media screen and (max-width: 40em) {
+  .eufemia-scope--10_77_0 .dnb-responsive-component .dnb-dropdown {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    margin-bottom: 0.5rem;
+  }
+  .eufemia-scope--10_77_0 .dnb-responsive-component .dnb-dropdown > .dnb-form-label {
+    margin-bottom: 0.5rem;
+  }
+  .eufemia-scope--10_77_0 .dnb-responsive-component .dnb-dropdown__helper {
+    display: none;
+  }
+}
+
+.eufemia-scope--10_77_0 .dnb-drawer-list--triangle-position-left .dnb-dropdown__list--tertiary .dnb-drawer-list__triangle {
+  margin-left: 0.5rem;
+}
+.eufemia-scope--10_77_0 .dnb-drawer-list--triangle-position-right .dnb-dropdown__list--tertiary .dnb-drawer-list__triangle {
+  margin-right: 0.5rem;
+}

package/components/dropdown/style/dnb-dropdown--isolated.min.css

@@ -0,0 +1 @@
+.eufemia-scope--10_77_0 .dnb-dropdown{--dropdown-width:16rem;--dropdown-height:2rem;--dropdown-height--small:1.5rem;--dropdown-height--medium:2.5rem;--dropdown-height--large:3rem;--dropdown-padding-horizontal:1rem;--dropdown-focus-border-width:0.125rem;--dropdown-error-border-width:0.125rem;--dropdown-text-padding:0.5rem;--dropdown-button-padding:0 1rem;--dropdown-border-radius:0.25rem;--dropdown-foreground-color-primary:var(--color-black-55);--dropdown-foreground-color-error:var(--color-fire-red);--dropdown-background-color-disabled:var(--color-black-3);--dropdown-background-color-error-active:var(--color-fire-red-8);align-items:center;display:inline-flex;font-size:var(--font-size-small);line-height:var(--dropdown-height)}.eufemia-scope--10_77_0 .dnb-dropdown__inner{color:inherit;display:inline-flex;flex-direction:column;margin:0;padding:0;width:auto}.eufemia-scope--10_77_0 .dnb-dropdown__shell{color:inherit;height:var(--dropdown-height);margin:0;padding:0;position:relative;width:var(--dropdown-width)}.eufemia-scope--10_77_0 .dnb-dropdown__row{display:inline-flex}.eufemia-scope--10_77_0 .dnb-dropdown__icon{display:inline-flex;justify-content:center;order:2;pointer-events:none;position:relative}.eufemia-scope--10_77_0 .dnb-dropdown__trigger{position:relative;-webkit-user-select:none;user-select:none;width:100%;z-index:1}.eufemia-scope--10_77_0 .dnb-dropdown__trigger.dnb-button{border-radius:var(--dropdown-border-radius);padding:var(--dropdown-button-padding)}.eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-dropdown__trigger.dnb-button{border-radius:50%;padding:0}.eufemia-scope--10_77_0 .dnb-dropdown__text{color:inherit;display:inline-block;font-size:var(--font-size-basis);line-height:inherit;order:1;overflow:hidden;position:relative;text-align:left;text-overflow:ellipsis;width:100%;z-index:4}.eufemia-scope--10_77_0 .dnb-dropdown__text__inner{display:inherit;overflow:hidden;text-overflow:inherit;white-space:nowrap}.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger{--border-color:var(--dropdown-foreground-color-error);--border-width:0.0625rem;border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:hover:not([disabled]){--border-color:var(--dropdown-foreground-color-error);--border-width:var(--dropdown-error-border-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color);color:var(--dropdown-foreground-color-error)}html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:hover:not([disabled]) .dnb-dropdown__icon .dnb-icon{color:var(--dropdown-foreground-color-error)}.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active[disabled],html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active[disabled]{cursor:not-allowed}.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active:not([disabled]),html:not([data-whatintent=touch]) .eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger:active:not([disabled]){background-color:var(--dropdown-background-color-error-active);color:var(--dropdown-foreground-color-error)}.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__icon,.eufemia-scope--10_77_0 .dnb-dropdown__status--error:not(.dnb-dropdown--opened) .dnb-dropdown__trigger{color:var(--dropdown-foreground-color-error)}.eufemia-scope--10_77_0 .dnb-dropdown>.dnb-form-status{transform:translateY(-.4375rem)}.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-dropdown__text{order:2;padding-left:var(--dropdown-text-padding);padding-right:0}.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-dropdown__icon{order:1}.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-right .dnb-dropdown__text{padding-right:var(--dropdown-text-padding)}.eufemia-scope--10_77_0 .dnb-dropdown--independent-width .dnb-dropdown__shell{width:auto}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-dropdown--action-menu .dnb-dropdown__trigger.dnb-button{border-radius:50%;padding-left:.5rem;padding-right:.5rem}}@media screen and (min-width:40.00625em){.eufemia-scope--10_77_0 .dnb-dropdown--action-menu .dnb-dropdown__shell .dnb-dropdown__text{padding:0 .5rem}}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-dropdown--action-menu .dnb-dropdown__shell .dnb-dropdown__text{padding:0;width:0}}.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-button--tertiary~.dnb-drawer-list__root--portal{left:-.5rem}.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-right .dnb-button--tertiary~.dnb-drawer-list__root--portal{left:.5rem}.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary.dnb-button--active{box-shadow:none}.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary .dnb-button__text{margin:0 .5rem}.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary .dnb-button__text:after{bottom:0}.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary,.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-left .dnb-button--tertiary .dnb-dropdown__text,.eufemia-scope--10_77_0 .dnb-dropdown--icon-position-right .dnb-button--tertiary .dnb-dropdown__text{padding:0}.eufemia-scope--10_77_0 .dnb-dropdown .dnb-button--tertiary:focus:before{left:0!important;right:0!important}.eufemia-scope--10_77_0 .dnb-dropdown--default.dnb-dropdown--is-popup .dnb-dropdown__shell,.eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-dropdown__trigger{height:var(--dropdown-height);padding:0;width:var(--dropdown-height)}.eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-dropdown__icon{width:100%}.eufemia-scope--10_77_0 .dnb-dropdown--is-popup.dnb-dropdown--scroll .dnb-dropdown__options{min-height:1rem}.eufemia-scope--10_77_0 .dnb-dropdown--is-popup .dnb-drawer-list__root{width:var(--dropdown-width)}.eufemia-scope--10_77_0 .dnb-dropdown--small.dnb-dropdown--is-popup .dnb-dropdown__shell,.eufemia-scope--10_77_0 .dnb-dropdown--small.dnb-dropdown--is-popup .dnb-dropdown__trigger{width:var(--dropdown-height--small)}.eufemia-scope--10_77_0 .dnb-dropdown--medium.dnb-dropdown--is-popup .dnb-dropdown__shell,.eufemia-scope--10_77_0 .dnb-dropdown--medium.dnb-dropdown--is-popup .dnb-dropdown__trigger{width:var(--dropdown-height--medium)}.eufemia-scope--10_77_0 .dnb-dropdown--large.dnb-dropdown--is-popup .dnb-dropdown__shell,.eufemia-scope--10_77_0 .dnb-dropdown--large.dnb-dropdown--is-popup .dnb-dropdown__trigger{width:var(--dropdown-height--large)}.eufemia-scope--10_77_0 .dnb-dropdown--small .dnb-dropdown__shell,.eufemia-scope--10_77_0 .dnb-dropdown--small .dnb-dropdown__trigger{height:var(--dropdown-height--small)}.eufemia-scope--10_77_0 .dnb-dropdown--small,.eufemia-scope--10_77_0 .dnb-dropdown--small .dnb-dropdown__trigger.dnb-button{line-height:var(--dropdown-height--small)}.eufemia-scope--10_77_0 .dnb-dropdown--medium .dnb-dropdown__shell,.eufemia-scope--10_77_0 .dnb-dropdown--medium .dnb-dropdown__trigger{height:var(--dropdown-height--medium)}.eufemia-scope--10_77_0 .dnb-dropdown--medium,.eufemia-scope--10_77_0 .dnb-dropdown--medium .dnb-dropdown__trigger.dnb-button{line-height:var(--dropdown-height--medium)}.eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__shell,.eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__trigger{height:var(--dropdown-height--large)}.eufemia-scope--10_77_0 .dnb-dropdown--large,.eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__trigger.dnb-button{line-height:var(--dropdown-height--large)}.eufemia-scope--10_77_0 .dnb-dropdown--large .dnb-dropdown__trigger.dnb-button .dnb-dropdown__text{line-height:var(--line-height-basis)}.eufemia-scope--10_77_0 .dnb-dropdown>.dnb-form-label{line-height:var(--line-height-basis);margin-right:1rem}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-dropdown{flex-wrap:wrap}.eufemia-scope--10_77_0 .dnb-dropdown>.dnb-form-label{margin-bottom:.5rem;margin-top:.5rem}}.eufemia-scope--10_77_0 .dnb-dropdown--stretch{display:flex;flex-grow:1}.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__inner{flex-grow:1}.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__inner,.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__row,.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-dropdown__shell{width:100%}.eufemia-scope--10_77_0 .dnb-dropdown--stretch .dnb-form-label+.dnb-dropdown__inner{width:auto}.eufemia-scope--10_77_0 .dnb-dropdown--vertical.dnb-dropdown--stretch .dnb-dropdown__inner,.eufemia-scope--10_77_0 .dnb-form-row--horizontal .dnb-dropdown--stretch{width:100%}.eufemia-scope--10_77_0 label+.dnb-dropdown[class*=__form-status]{vertical-align:top}.eufemia-scope--10_77_0 label+.dnb-dropdown[class*=__form-status] .dnb-dropdown__shell{top:-.375rem}.eufemia-scope--10_77_0 .dnb-dropdown__inner>.dnb-form-status{margin-top:.5rem;order:2}.eufemia-scope--10_77_0 .dnb-dropdown--vertical{align-items:flex-start;display:flex;flex-direction:column}.eufemia-scope--10_77_0 .dnb-dropdown:not(.dnb-dropdown--vertical)[class*=__status]{align-items:flex-start}.eufemia-scope--10_77_0 .dnb-dropdown:not(.dnb-dropdown--vertical)[class*=__status]>.dnb-form-label{margin-top:.25rem}@media screen and (max-width:40em){.eufemia-scope--10_77_0 .dnb-responsive-component .dnb-dropdown{align-items:flex-start;display:flex;flex-direction:column;margin-bottom:.5rem}.eufemia-scope--10_77_0 .dnb-responsive-component .dnb-dropdown>.dnb-form-label{margin-bottom:.5rem}.eufemia-scope--10_77_0 .dnb-responsive-component .dnb-dropdown__helper{display:none}}.eufemia-scope--10_77_0 .dnb-drawer-list--triangle-position-left .dnb-dropdown__list--tertiary .dnb-drawer-list__triangle{margin-left:.5rem}.eufemia-scope--10_77_0 .dnb-drawer-list--triangle-position-right .dnb-dropdown__list--tertiary .dnb-drawer-list__triangle{margin-right:.5rem}