@dnb/eufemia 9.29.0 → 9.31.0

package/style/themes/theme-eiendom/dnb-theme-eiendom.css

@@ -986,21 +986,42 @@ a.dnb-button {
   color: var(--theme-color-black-80, currentColor); }
   .dnb-dl:not([class*='dnb-space']) {
     margin: 0; }
-  .dnb-dl > dt {
+  .dnb-dl dt {
+    margin-top: 1rem;
     padding: 0;
     font-weight: 500;
     font-weight: var(--font-weight-medium); }
-  .dnb-dl dt {
-    margin-top: 1rem; }
   .dnb-dl dd ~ dt {
     margin-top: 1.5rem; }
-  .dnb-dl > dd {
+  .dnb-dl dd {
     padding: 0;
     margin: 0.5rem 0 1rem; }
   .dnb-dl > dl,
   .dnb-dl:not([class*='dnb-space']) > dl {
     margin-top: 1.5rem;
     margin-left: 2rem; }
+  @media screen and (min-width: 40em) {
+    .dnb-dl__direction--horizontal {
+      display: -webkit-box;
+      display: -ms-flexbox;
+      display: flex;
+      -webkit-box-orient: vertical;
+      -webkit-box-direction: normal;
+          -ms-flex-direction: column;
+              flex-direction: column;
+      grid-gap: 0.5rem;
+      gap: 0.5rem; }
+      .dnb-dl__direction--horizontal dt,
+      .dnb-dl__direction--horizontal dd {
+        margin-top: 0;
+        margin-bottom: 0; }
+      .dnb-dl__direction--horizontal dt {
+        margin-right: 1rem;
+        max-width: 60ch; }
+    .dnb-dl__line {
+      display: -webkit-box;
+      display: -ms-flexbox;
+      display: flex; } }
 
 .dnb-spacing .dnb-ul:not([class*='dnb-space']),
 .dnb-spacing .dnb-ol:not([class*='dnb-space']) {
@@ -1299,18 +1320,21 @@ a.dnb-button {
 */
 .dnb-accordion__header {
   border: none; }
-  .dnb-accordion__header__icon, .dnb-accordion__header__container {
-    color: #14555a;
-    color: var(--color-emerald-green); }
-  .dnb-accordion__header__description {
-    color: #737373;
-    color: var(--color-black-55); }
 
-.dnb-accordion--expanded .dnb-accordion__header__title {
+> .dnb-accordion__header .dnb-accordion__header__icon,
+> .dnb-accordion__header .dnb-accordion__header__container {
+  color: #14555a;
+  color: var(--color-emerald-green); }
+
+> .dnb-accordion__header .dnb-accordion__header__description {
+  color: #737373;
+  color: var(--color-black-55); }
+
+.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header__title {
   font-weight: 500;
   font-weight: var(--font-weight-medium); }
 
-.dnb-accordion__variant--outlined .dnb-accordion__header {
+.dnb-accordion__variant--outlined > .dnb-accordion__header {
   color: #333;
   color: var(--color-black-80);
   background-color: #fff;
@@ -1322,34 +1346,34 @@ a.dnb-button {
   /* Safari fix - because "inset" works not fine with border-radius if the user zooms the page */
   border-color: transparent; }
   @supports (-webkit-touch-callout: none) {
-    .dnb-accordion__variant--outlined .dnb-accordion__header {
+    .dnb-accordion__variant--outlined > .dnb-accordion__header {
       -webkit-box-shadow: 0 0 0 0.0625rem var(--border-color);
               box-shadow: 0 0 0 0.0625rem var(--border-color); } }
   @media not all and (min-resolution: 0.001dpcm) {
     @supports (-webkit-appearance: none) and (stroke-color: transparent) and (not (-webkit-overflow-scrolling: touch)) {
-      .dnb-accordion__variant--outlined .dnb-accordion__header {
+      .dnb-accordion__variant--outlined > .dnb-accordion__header {
         -webkit-box-shadow: 0 0 0 0.0625rem var(--border-color);
                 box-shadow: 0 0 0 0.0625rem var(--border-color); } } }
   @media screen and (-ms-high-contrast: none) {
-    .dnb-accordion__variant--outlined .dnb-accordion__header {
+    .dnb-accordion__variant--outlined > .dnb-accordion__header {
       -webkit-box-shadow: inset 0 0 0 1px #ebebeb;
               box-shadow: inset 0 0 0 1px #ebebeb;
       -webkit-box-shadow: inset 0 0 0 1px var(--color-black-8);
               box-shadow: inset 0 0 0 1px var(--color-black-8); } }
-  .dnb-accordion__variant--outlined .dnb-accordion__header:focus[disabled],
-  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:focus[disabled] {
+  .dnb-accordion__variant--outlined > .dnb-accordion__header:focus[disabled],
+  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:focus[disabled] {
     cursor: not-allowed; }
-  .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]),
-  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]) {
+  .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]),
+  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]) {
     outline: none; }
-    html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
-    html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]) {
+    html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
+    html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]) {
       color: #14555a;
       color: var(--color-emerald-green);
       background-color: #fff;
       background-color: var(--color-white); }
-    html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
-    html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]) {
+    html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
+    html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]) {
       --border-color: var(--color-emerald-green);
       -webkit-box-shadow: inset 0 0 0 0.125rem var(--border-color);
               box-shadow: inset 0 0 0 0.125rem var(--border-color);
@@ -1357,26 +1381,26 @@ a.dnb-button {
       /* Safari fix - because "inset" works not fine with border-radius if the user zooms the page */
       border-color: transparent; }
       @supports (-webkit-touch-callout: none) {
-        html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
-        html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]) {
+        html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
+        html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]) {
           -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
                   box-shadow: 0 0 0 0.125rem var(--border-color); } }
       @media not all and (min-resolution: 0.001dpcm) {
         @supports (-webkit-appearance: none) and (stroke-color: transparent) and (not (-webkit-overflow-scrolling: touch)) {
-          html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
-          html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]) {
+          html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
+          html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]) {
             -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
                     box-shadow: 0 0 0 0.125rem var(--border-color); } } }
       @media screen and (-ms-high-contrast: none) {
-        html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
-        html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:focus:not([disabled]) {
+        html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]), html[data-whatinput='keyboard']
+        html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:focus:not([disabled]) {
           -webkit-box-shadow: inset 0 0 0 0.125rem #14555a;
                   box-shadow: inset 0 0 0 0.125rem #14555a;
           -webkit-box-shadow: inset 0 0 0 0.125rem var(--color-emerald-green);
                   box-shadow: inset 0 0 0 0.125rem var(--color-emerald-green); } }
-  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:hover[disabled] {
+  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:hover[disabled] {
     cursor: not-allowed; }
-  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:hover:not([disabled]) {
+  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:hover:not([disabled]) {
     color: #14555a;
     color: var(--color-emerald-green);
     background-color: #fff;
@@ -1386,19 +1410,19 @@ a.dnb-button {
             box-shadow: 0 0 0 0.125rem var(--border-color);
     border-color: transparent; }
     @media screen and (-ms-high-contrast: none) {
-      html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:hover:not([disabled]) {
+      html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:hover:not([disabled]) {
         -webkit-box-shadow: 0 0 0 0.125rem #14555a;
                 box-shadow: 0 0 0 0.125rem #14555a;
         -webkit-box-shadow: 0 0 0 0.125rem var(--color-emerald-green);
                 box-shadow: 0 0 0 0.125rem var(--color-emerald-green); } }
     @media screen and (-ms-high-contrast: none) {
-      html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:hover:not([disabled]) {
+      html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:hover:not([disabled]) {
         opacity: 1; } }
-  .dnb-accordion__variant--outlined .dnb-accordion__header:active[disabled],
-  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:active[disabled] {
+  .dnb-accordion__variant--outlined > .dnb-accordion__header:active[disabled],
+  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:active[disabled] {
     cursor: not-allowed; }
-  .dnb-accordion__variant--outlined .dnb-accordion__header:active:not([disabled]),
-  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:active:not([disabled]) {
+  .dnb-accordion__variant--outlined > .dnb-accordion__header:active:not([disabled]),
+  html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:active:not([disabled]) {
     color: #14555a;
     color: var(--color-emerald-green);
     background-color: #f2f4ec;
@@ -1408,30 +1432,31 @@ a.dnb-button {
             box-shadow: 0 0 0 0.0625rem var(--border-color);
     border-color: transparent; }
     @media screen and (-ms-high-contrast: none) {
-      .dnb-accordion__variant--outlined .dnb-accordion__header:active:not([disabled]),
-      html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined .dnb-accordion__header:active:not([disabled]) {
+      .dnb-accordion__variant--outlined > .dnb-accordion__header:active:not([disabled]),
+      html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined > .dnb-accordion__header:active:not([disabled]) {
         -webkit-box-shadow: 0 0 0 0.0625rem #14555a;
                 box-shadow: 0 0 0 0.0625rem #14555a;
         -webkit-box-shadow: 0 0 0 0.0625rem var(--color-emerald-green);
                 box-shadow: 0 0 0 0.0625rem var(--color-emerald-green); } }
-  .dnb-accordion__variant--outlined .dnb-accordion__header[disabled] {
-    background-color: #fff;
-    background-color: var(--color-white);
-    --border-color: var(--color-sea-green-30);
-    -webkit-box-shadow: 0 0 0 0.0625rem var(--border-color);
-            box-shadow: 0 0 0 0.0625rem var(--border-color);
-    border-color: transparent; }
-    @media screen and (-ms-high-contrast: none) {
-      .dnb-accordion__variant--outlined .dnb-accordion__header[disabled] {
-        -webkit-box-shadow: 0 0 0 0.0625rem #b3dada;
-                box-shadow: 0 0 0 0.0625rem #b3dada;
-        -webkit-box-shadow: 0 0 0 0.0625rem var(--color-sea-green-30);
-                box-shadow: 0 0 0 0.0625rem var(--color-sea-green-30); } }
-    .dnb-accordion__variant--outlined .dnb-accordion__header[disabled] * {
-      color: #b3dada;
-      color: var(--color-sea-green-30); }
 
-.dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header {
+.dnb-accordion__variant--outlined > .dnb-accordion__header .dnb-accordion__header[disabled] {
+  background-color: #fff;
+  background-color: var(--color-white);
+  --border-color: var(--color-sea-green-30);
+  -webkit-box-shadow: 0 0 0 0.0625rem var(--border-color);
+          box-shadow: 0 0 0 0.0625rem var(--border-color);
+  border-color: transparent; }
+  @media screen and (-ms-high-contrast: none) {
+    .dnb-accordion__variant--outlined > .dnb-accordion__header .dnb-accordion__header[disabled] {
+      -webkit-box-shadow: 0 0 0 0.0625rem #b3dada;
+              box-shadow: 0 0 0 0.0625rem #b3dada;
+      -webkit-box-shadow: 0 0 0 0.0625rem var(--color-sea-green-30);
+              box-shadow: 0 0 0 0.0625rem var(--color-sea-green-30); } }
+  .dnb-accordion__variant--outlined > .dnb-accordion__header .dnb-accordion__header[disabled] * {
+    color: #b3dada;
+    color: var(--color-sea-green-30); }
+
+.dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header {
   color: #fff;
   color: var(--color-white);
   background-color: #007272;
@@ -1441,56 +1466,59 @@ a.dnb-button {
           box-shadow: 0 0 0 0.0625rem var(--border-color);
   border-color: transparent; }
   @media screen and (-ms-high-contrast: none) {
-    .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header {
+    .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header {
       -webkit-box-shadow: 0 0 0 0.0625rem transparent;
               box-shadow: 0 0 0 0.0625rem transparent; } }
-  .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header[disabled] {
-    background-color: #b3dada;
-    background-color: var(--color-sea-green-30); }
-    .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header[disabled] * {
-      color: #fff;
-      color: var(--color-white); }
-  html[data-whatinput='keyboard']
-.dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
-    background-color: #a5e1d2;
-    background-color: var(--color-mint-green); }
-    html[data-whatinput='keyboard']
-.dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus * {
-      color: #14555a;
-      color: var(--color-emerald-green); }
-  .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
-    outline: none; }
-    html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
-      --border-color: var(--color-emerald-green);
-      -webkit-box-shadow: inset 0 0 0 0.125rem var(--border-color);
-              box-shadow: inset 0 0 0 0.125rem var(--border-color);
-      /* iOS fix - because "inset" works not fine with border-radius */
-      /* Safari fix - because "inset" works not fine with border-radius if the user zooms the page */
-      border-color: transparent; }
-      @supports (-webkit-touch-callout: none) {
-        html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
+
+.dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header[disabled] {
+  background-color: #b3dada;
+  background-color: var(--color-sea-green-30); }
+  .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header[disabled] * {
+    color: #fff;
+    color: var(--color-white); }
+
+.dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header html[data-whatinput='keyboard']
+.dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
+  background-color: #a5e1d2;
+  background-color: var(--color-mint-green); }
+  .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header html[data-whatinput='keyboard']
+.dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus * {
+    color: #14555a;
+    color: var(--color-emerald-green); }
+
+.dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
+  outline: none; }
+  html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
+    --border-color: var(--color-emerald-green);
+    -webkit-box-shadow: inset 0 0 0 0.125rem var(--border-color);
+            box-shadow: inset 0 0 0 0.125rem var(--border-color);
+    /* iOS fix - because "inset" works not fine with border-radius */
+    /* Safari fix - because "inset" works not fine with border-radius if the user zooms the page */
+    border-color: transparent; }
+    @supports (-webkit-touch-callout: none) {
+      html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
+        -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
+                box-shadow: 0 0 0 0.125rem var(--border-color); } }
+    @media not all and (min-resolution: 0.001dpcm) {
+      @supports (-webkit-appearance: none) and (stroke-color: transparent) and (not (-webkit-overflow-scrolling: touch)) {
+        html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
           -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
-                  box-shadow: 0 0 0 0.125rem var(--border-color); } }
-      @media not all and (min-resolution: 0.001dpcm) {
-        @supports (-webkit-appearance: none) and (stroke-color: transparent) and (not (-webkit-overflow-scrolling: touch)) {
-          html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
-            -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
-                    box-shadow: 0 0 0 0.125rem var(--border-color); } } }
-      @media screen and (-ms-high-contrast: none) {
-        html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
-          -webkit-box-shadow: inset 0 0 0 0.125rem #14555a;
-                  box-shadow: inset 0 0 0 0.125rem #14555a;
-          -webkit-box-shadow: inset 0 0 0 0.125rem var(--color-emerald-green);
-                  box-shadow: inset 0 0 0 0.125rem var(--color-emerald-green); } }
+                  box-shadow: 0 0 0 0.125rem var(--border-color); } } }
+    @media screen and (-ms-high-contrast: none) {
+      html[data-whatinput='keyboard'] .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header:not([disabled]):not(:active):not(:hover):focus {
+        -webkit-box-shadow: inset 0 0 0 0.125rem #14555a;
+                box-shadow: inset 0 0 0 0.125rem #14555a;
+        -webkit-box-shadow: inset 0 0 0 0.125rem var(--color-emerald-green);
+                box-shadow: inset 0 0 0 0.125rem var(--color-emerald-green); } }
 
-.dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header:not(:hover):not([disabled]) * {
+.dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header:not(:hover):not([disabled]) * {
   color: #fff;
   color: var(--color-white); }
 
-html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header.dnb-accordion--hover:not(:active):hover[disabled] {
+html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header.dnb-accordion--hover:not(:active):hover[disabled] {
   cursor: not-allowed; }
 
-html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header.dnb-accordion--hover:not(:active):hover:not([disabled]) {
+html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header.dnb-accordion--hover:not(:active):hover:not([disabled]) {
   color: #fff;
   color: var(--color-white);
   background-color: #007272;
@@ -1500,13 +1528,13 @@ html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accord
           box-shadow: 0 0 0 0.0625rem var(--border-color);
   border-color: transparent; }
   @media screen and (-ms-high-contrast: none) {
-    html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header.dnb-accordion--hover:not(:active):hover:not([disabled]) {
+    html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header.dnb-accordion--hover:not(:active):hover:not([disabled]) {
       -webkit-box-shadow: 0 0 0 0.0625rem #007272;
               box-shadow: 0 0 0 0.0625rem #007272;
       -webkit-box-shadow: 0 0 0 0.0625rem var(--color-sea-green);
               box-shadow: 0 0 0 0.0625rem var(--color-sea-green); } }
 
-.dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header.dnb-accordion--hover:not(:active) * {
+.dnb-accordion__variant--outlined.dnb-accordion--expanded > .dnb-accordion__header.dnb-accordion--hover:not(:active) * {
   color: #fff;
   color: var(--color-white); }
 
@@ -1607,11 +1635,6 @@ html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accord
 .dnb-avatar {
   color: #f2f4ec;
   color: var(--color-pistachio); }
-  .dnb-avatar svg {
-    color: #f2f4ec;
-    color: var(--color-pistachio);
-    fill: #f2f4ec;
-    fill: var(--color-pistachio); }
   .dnb-avatar--primary {
     background-color: #14555a;
     background-color: var(--color-emerald-green); }
@@ -1623,11 +1646,6 @@ html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accord
     background-color: var(--color-mint-green);
     color: #14555a;
     color: var(--color-emerald-green); }
-    .dnb-avatar--tertiary svg {
-      color: #14555a;
-      color: var(--color-emerald-green);
-      fill: #14555a;
-      fill: var(--color-emerald-green); }
 
 /*
 * Badge theme
@@ -2340,11 +2358,11 @@ html:not([data-whatintent='touch']) .dnb-accordion__variant--outlined.dnb-accord
       color: var(--color-black-20);
       background-color: #feebc1;
       background-color: var(--color-accent-yellow-30); }
-  .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text), .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled]) {
+  .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled]) {
     background-color: transparent;
     -webkit-box-shadow: none;
             box-shadow: none; }
-    .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text)::after, .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled])::after {
+    .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled])::after {
       content: '';
       position: absolute;
       top: 0;
@@ -6508,11 +6526,11 @@ html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled]) {
       color: var(--color-black-20);
       background-color: #feebc1;
       background-color: var(--color-accent-yellow-30); }
-  .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text), .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled]) {
+  .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled]) {
     background-color: transparent;
     -webkit-box-shadow: none;
             box-shadow: none; }
-    .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text)::after, .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled])::after {
+    .dnb-button--input-button.dnb-button--secondary:not(.dnb-button--has-text):not([disabled])::after {
       content: '';
       position: absolute;
       top: 0;
@@ -6659,9 +6677,178 @@ html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled]) {
         -webkit-box-shadow: 0 0 0 0.0625rem var(--color-black-55);
                 box-shadow: 0 0 0 0.0625rem var(--color-black-55); } }
 
+.dnb-button--secondary:not(.dnb-button--has-text):active[disabled],
+html:not([data-whatintent='touch']) .dnb-button--secondary:not(.dnb-button--has-text):active[disabled] {
+  cursor: not-allowed; }
+
+.dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]),
+html:not([data-whatintent='touch']) .dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]) {
+  color: #14555a;
+  color: var(--color-emerald-green);
+  background-color: #f2f4ec;
+  background-color: var(--color-pistachio);
+  --border-color: transparent;
+  -webkit-box-shadow: 0 0 0 0.0625rem var(--border-color);
+          box-shadow: 0 0 0 0.0625rem var(--border-color);
+  border-color: transparent; }
+  @media screen and (-ms-high-contrast: none) {
+    .dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]),
+    html:not([data-whatintent='touch']) .dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]) {
+      -webkit-box-shadow: 0 0 0 0.0625rem transparent;
+              box-shadow: 0 0 0 0.0625rem transparent; } }
+
 .dnb-button--tertiary {
   color: #14555a;
   color: var(--color-emerald-green); }
   .dnb-button--tertiary[disabled] {
     color: #737373;
     color: var(--color-black-55); }
+
+/*
+* Tabs theme
+*
+*/
+/*
+* Tabs theme
+*
+*/
+/**
+ * This file is only used to make themes independent
+ * so that they can get imported individually, without the core styles
+ *
+ */
+/*
+ * Utilities
+ */
+/*
+* Button mixins
+*
+*/
+.dnb-tabs__tabs:not(.dnb-section)::before {
+  background-color: #ebebeb;
+  background-color: var(--color-black-8);
+  -webkit-box-shadow: 100vw 0 0 0 #ebebeb;
+          box-shadow: 100vw 0 0 0 #ebebeb;
+  -webkit-box-shadow: 100vw 0 0 0 var(--color-black-8);
+          box-shadow: 100vw 0 0 0 var(--color-black-8); }
+
+.dnb-tabs__tabs__tablist:focus {
+  border-radius: 0.5rem; }
+
+.dnb-tabs--at-edge .dnb-tabs__scroll-nav-button:first-of-type {
+  border-radius: 0 50% 50% 0; }
+
+.dnb-tabs--at-edge .dnb-tabs__scroll-nav-button:last-of-type {
+  border-radius: 50% 0 0 50%; }
+
+.dnb-tabs--at-edge .dnb-tabs__tabs__tablist:focus {
+  border-radius: 0; }
+
+.dnb-tabs__content:focus {
+  position: relative; }
+  .dnb-tabs__content:focus::after {
+    content: '';
+    position: absolute;
+    z-index: -1;
+    top: 0.125rem;
+    bottom: -0.5rem;
+    left: -0.5rem;
+    right: -0.5rem;
+    max-width: 100vw;
+    border-radius: 0.5rem;
+    outline: none; }
+    html[data-whatinput='keyboard'] .dnb-tabs__content:focus::after {
+      --border-color: var(--color-emerald-green);
+      -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
+              box-shadow: 0 0 0 0.125rem var(--border-color);
+      border-color: transparent; }
+      @media screen and (-ms-high-contrast: none) {
+        html[data-whatinput='keyboard'] .dnb-tabs__content:focus::after {
+          -webkit-box-shadow: 0 0 0 0.125rem #14555a;
+                  box-shadow: 0 0 0 0.125rem #14555a;
+          -webkit-box-shadow: 0 0 0 0.125rem var(--color-emerald-green);
+                  box-shadow: 0 0 0 0.125rem var(--color-emerald-green); } }
+
+.dnb-tabs__button__title {
+  font-weight: normal;
+  font-weight: var(--font-weight-regular);
+  font-size: 1.125rem;
+  font-size: var(--font-size-basis);
+  text-align: center;
+  display: block;
+  color: #007272;
+  color: var(--color-sea-green);
+  padding: 0.5rem 0 0.25rem 0; }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover[disabled] {
+  cursor: not-allowed; }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled]) {
+  background-color: #d2f0e9;
+  background-color: var(--color-mint-green-50); }
+  html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled])::after {
+    height: 2px;
+    border-radius: 2px;
+    background-color: #007272;
+    background-color: var(--color-sea-green); }
+
+.dnb-tabs__button:focus {
+  overflow: visible; }
+  .dnb-tabs__button:focus::before {
+    content: '';
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    left: -0.5rem;
+    bottom: 0;
+    right: -0.5rem;
+    height: inherit;
+    border-radius: inherit;
+    outline: none; }
+    html[data-whatinput='keyboard'] .dnb-tabs__button:focus::before {
+      --border-color: var(--color-emerald-green);
+      -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
+              box-shadow: 0 0 0 0.125rem var(--border-color);
+      border-color: transparent; }
+      @media screen and (-ms-high-contrast: none) {
+        html[data-whatinput='keyboard'] .dnb-tabs__button:focus::before {
+          -webkit-box-shadow: 0 0 0 0.125rem #14555a;
+                  box-shadow: 0 0 0 0.125rem #14555a;
+          -webkit-box-shadow: 0 0 0 0.125rem var(--color-emerald-green);
+                  box-shadow: 0 0 0 0.125rem var(--color-emerald-green); } }
+  .dnb-tabs__button:focus::before {
+    top: 0.5rem;
+    left: -0.375rem;
+    right: -0.375rem;
+    bottom: 0.5rem;
+    border-radius: 1.5rem; }
+
+.dnb-tabs__button[disabled] .dnb-tabs__button__title {
+  color: #b3dada;
+  color: var(--color-sea-green-30); }
+
+.dnb-tabs__button:not([disabled]):active::after, .dnb-tabs__button:not([disabled]).selected::after {
+  height: 2px;
+  border-radius: 2px;
+  background-color: #007272;
+  background-color: var(--color-sea-green); }
+
+.dnb-tabs__button:not([disabled]):active .dnb-tabs__button__title,
+.dnb-tabs__button:not([disabled]).selected .dnb-tabs__button__title {
+  color: #14555a;
+  color: var(--color-emerald-green); }
+
+.dnb-tabs__button:not([disabled]).selected .dnb-tabs__button__title {
+  font-weight: 500;
+  font-weight: var(--font-weight-medium); }
+
+.dnb-tabs__button span[hidden] {
+  font-weight: 500;
+  font-weight: var(--font-weight-medium); }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover[disabled] {
+  cursor: not-allowed; }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled]) {
+  background-color: #f2f4ec;
+  background-color: var(--color-pistachio); }