@dnb/eufemia 9.30.0 → 9.32.0

package/es/components/accordion/Accordion.js

@@ -13,7 +13,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import { warn, isTrue, makeUniqueId, registerElement, findElementInChildren, extendPropsWithContext, validateDOMAttributes, dispatchCustomElementEvent } from '../../shared/component-helper';
+import { warn, isTrue, makeUniqueId, registerElement, findElementInChildren, extendPropsWithContextInClassComponent, validateDOMAttributes, dispatchCustomElementEvent } from '../../shared/component-helper';
 import { createSpacingClasses } from '../space/SpacingHelper';
 import AccordionProvider from './AccordionProvider';
 import AccordionHeader from './AccordionHeader';
@@ -225,7 +225,7 @@ export default class Accordion extends React.PureComponent {
       let {
         expanded
       } = this.state;
-      const props = extendPropsWithContext(this.props, Accordion.defaultProps, this.context, nestedContext, {
+      const props = extendPropsWithContextInClassComponent(this.props, Accordion.defaultProps, this.context, nestedContext, {
         skeleton: globalContext === null || globalContext === void 0 ? void 0 : globalContext.skeleton
       }, globalContext.accordion, globalContext.translation.Accordion);
 
@@ -276,7 +276,7 @@ export default class Accordion extends React.PureComponent {
       }
 
       validateDOMAttributes(this.props, rest);
-      const extendProps = extendPropsWithContext(this.props, Accordion.defaultProps, this.state, this.context);
+      const extendProps = extendPropsWithContextInClassComponent(this.props, Accordion.defaultProps, this.state, this.context);
 
       const context = _objectSpread(_objectSpread({}, extendProps), {}, {
         id,

package/es/components/accordion/AccordionHeader.js

@@ -13,7 +13,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import React from 'react';
 import PropTypes from 'prop-types';
-import { isTrue, validateDOMAttributes, extendPropsWithContext } from '../../shared/component-helper';
+import { isTrue, validateDOMAttributes, extendPropsWithContextInClassComponent } from '../../shared/component-helper';
 import IconPrimary from '../../components/icon-primary/IconPrimary';
 import classnames from 'classnames';
 import keycode from 'keycode';
@@ -163,7 +163,7 @@ export default class AccordionHeader extends React.PureComponent {
   }
 
   render() {
-    const props = extendPropsWithContext(this.props, AccordionHeader.defaultProps, this.context);
+    const props = extendPropsWithContextInClassComponent(this.props, AccordionHeader.defaultProps, this.context);
     const {
       id,
       left_component,

package/es/components/accordion/AccordionProvider.js

@@ -10,9 +10,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import React from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import { isTrue, makeUniqueId, extendPropsWithContext, registerElement, validateDOMAttributes, dispatchCustomElementEvent } from '../../shared/component-helper';
+import { isTrue, makeUniqueId, extendPropsWithContextInClassComponent, registerElement, validateDOMAttributes, dispatchCustomElementEvent } from '../../shared/component-helper';
 import { createSpacingClasses } from '../space/SpacingHelper';
 import { accordionPropTypes, accordionDefaultProps } from './AccordionPropTypes';
+import { includeValidProps } from '../form-row/FormRowHelpers';
 import Context from '../../shared/Context';
 import AccordionGroupContext from './AccordionProviderContext';
 export default class AccordionGroup extends React.PureComponent {
@@ -38,7 +39,7 @@ export default class AccordionGroup extends React.PureComponent {
   }
 
   render() {
-    const props = extendPropsWithContext(this.props, AccordionGroup.defaultProps, this.context.FormRow, this.context.Accordion, this.context.getTranslation(this.props).Accordion);
+    const props = extendPropsWithContextInClassComponent(this.props, AccordionGroup.defaultProps, includeValidProps(this.context.FormRow), this.context.Accordion, this.context.getTranslation(this.props).Accordion);
 
     const {
       expanded,

package/es/components/accordion/style/_accordion.scss

@@ -26,6 +26,9 @@
     cursor: pointer;
     outline: none;
 
+    border: var(--accordion-border-width) solid transparent;
+    border-radius: var(--accordion-border-radius);
+
     &:focus {
       user-select: none;
     }
@@ -40,11 +43,6 @@
       pointer-events: none;
     }
 
-    border: var(--accordion-border-width) solid transparent;
-    border-radius: var(--accordion-border-radius);
-
-    // background-color: var(--color-white);
-
     &__wrapper {
       display: flex;
       flex-direction: column;
@@ -116,12 +114,6 @@
     }
   }
 
-  &--expanded &__header {
-    &__icon {
-      transform: rotate(-180deg);
-    }
-  }
-
   &--no-animation &__header,
   html[data-visual-test] &__header {
     &__icon {
@@ -129,10 +121,15 @@
     }
   }
 
+  &--expanded > &__header &__header__icon {
+    transform: rotate(-180deg);
+  }
+
   &__content {
     display: flex;
     opacity: 1;
     visibility: visible;
+    width: 100%;
 
     will-change: height;
     transition: height 400ms var(--accordion-easing),
@@ -149,6 +146,7 @@
     }
 
     &__inner {
+      width: 100%;
       margin-top: 1rem;
 
       &--remove-content {
@@ -168,10 +166,6 @@
     @media screen and (min-width: 40em) {
       &__header {
         width: 40%; // 40% / 60%
-
-        &__icon {
-          transform: rotate(-90deg);
-        }
       }
 
       // Only to make sure we have a spacing. But would be typcally project spesific
@@ -194,6 +188,11 @@
     //   }
     // }
   }
+  &-group--single-container & > &__header &__header__icon {
+    @media screen and (min-width: 40em) {
+      transform: rotate(-90deg);
+    }
+  }
   &--no-animation &__content,
   html[data-visual-test] &__content {
     transition-duration: 1ms !important;

package/es/components/accordion/style/dnb-accordion.css

@@ -281,19 +281,20 @@
       margin-top: 0.25rem; }
     .dnb-accordion__header__description + .dnb-accordion__header__title {
       margin-top: 0.25rem; }
-  .dnb-accordion--expanded .dnb-accordion__header__icon {
-    -webkit-transform: rotate(-180deg);
-            transform: rotate(-180deg); }
   .dnb-accordion--no-animation .dnb-accordion__header__icon,
   html[data-visual-test] .dnb-accordion__header__icon {
     -webkit-transition-duration: 1ms !important;
             transition-duration: 1ms !important; }
+  .dnb-accordion--expanded > .dnb-accordion__header .dnb-accordion__header__icon {
+    -webkit-transform: rotate(-180deg);
+            transform: rotate(-180deg); }
   .dnb-accordion__content {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     opacity: 1;
     visibility: visible;
+    width: 100%;
     will-change: height;
     -webkit-transition: height 400ms cubic-bezier(0.42, 0, 0, 1), opacity 600ms cubic-bezier(0.42, 0, 0, 1);
     transition: height 400ms cubic-bezier(0.42, 0, 0, 1), opacity 600ms cubic-bezier(0.42, 0, 0, 1);
@@ -306,6 +307,7 @@
     .dnb-accordion__content--is-animating {
       overflow: hidden; }
     .dnb-accordion__content__inner {
+      width: 100%;
       margin-top: 1rem; }
       .dnb-accordion__content__inner--remove-content {
         display: none; }
@@ -320,9 +322,6 @@
     @media screen and (min-width: 40em) {
       .dnb-accordion-group--single-container .dnb-accordion__header {
         width: 40%; }
-        .dnb-accordion-group--single-container .dnb-accordion__header__icon {
-          -webkit-transform: rotate(-90deg);
-                  transform: rotate(-90deg); }
       .dnb-accordion-group--single-container .dnb-accordion__content {
         margin-left: 1rem;
         -webkit-transition: opacity 1s cubic-bezier(0.42, 0, 0, 1);
@@ -331,6 +330,10 @@
         transition: opacity 1s var(--accordion-easing); }
         .dnb-accordion-group--single-container .dnb-accordion__content__inner {
           margin-top: 0; } }
+  @media screen and (min-width: 40em) {
+    .dnb-accordion-group--single-container .dnb-accordion > .dnb-accordion__header .dnb-accordion__header__icon {
+      -webkit-transform: rotate(-90deg);
+              transform: rotate(-90deg); } }
   .dnb-accordion--no-animation .dnb-accordion__content,
   html[data-visual-test] .dnb-accordion__content {
     -webkit-transition-duration: 1ms !important;

package/es/components/accordion/style/dnb-accordion.min.css

@@ -1 +1 @@
-.dnb-icon{color:inherit;display:inline-block;font-size:1rem;height:1em;line-height:1rem;vertical-align:middle;width:1em}.dnb-icon img,.dnb-icon svg{shape-rendering:geometricPrecision;height:inherit;vertical-align:top;width:inherit}.dnb-icon svg[width="100%"]{width:inherit}.dnb-icon svg[height="100%"]{height:inherit}.dnb-icon--inherit-color svg:not([fill]),.dnb-icon--inherit-color svg [fill]{fill:currentColor}.dnb-icon--inherit-color svg [stroke]{stroke:currentColor}.dnb-icon--small{font-size:.75rem}.dnb-icon--default{font-size:1rem}.dnb-icon--medium{font-size:1.5rem}.dnb-icon--large{font-size:2rem}.dnb-icon--x-large{font-size:2.5rem}.dnb-icon--xx-large{font-size:3rem}.dnb-icon--custom-size{height:auto;width:auto}.dnb-icon--auto{font-size:1em}.dnb-icon--auto>.dnb-icon--wrapper{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;justify-content:center}h1 .dnb-icon,h2 .dnb-icon,h3 .dnb-icon,h4 .dnb-icon,h5 .dnb-icon,h6 .dnb-icon{vertical-align:middle}.dnb-icon.dnb-skeleton{color:#ebebeb!important;color:var(--skeleton-color)!important}.dnb-icon.dnb-skeleton:after,.dnb-icon.dnb-skeleton:before{content:none!important}@media screen and (-ms-high-contrast:none){.dnb-icon{-webkit-box-flex:0;-ms-flex:none;flex:none}}.dnb-accordion{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);margin:0;padding:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-accordion *,.dnb-accordion :after,.dnb-accordion :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-accordion :after,.dnb-accordion :before{text-decoration:inherit;vertical-align:inherit}:root{--accordion-border-width:0.0625rem;--accordion-border-radius:0.25rem;--accordion-easing:cubic-bezier(0.42,0,0,1)}.dnb-accordion{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-size:1rem;font-size:var(--font-size-small);line-height:1.5rem;line-height:var(--line-height-basis);position:relative}.dnb-accordion,.dnb-accordion__header{display:-webkit-box;display:-ms-flexbox;display:flex}.dnb-accordion__header{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:.0625rem solid transparent;border:var(--accordion-border-width) solid transparent;border-radius:.25rem;border-radius:var(--accordion-border-radius);cursor:pointer;outline:none}.dnb-accordion__header:focus{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.dnb-accordion__header *{pointer-events:none}.dnb-accordion__header--prevent-click{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.dnb-accordion__header__wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:1.5rem 0 1.5rem 2rem;width:100%}.dnb-accordion__header--description .dnb-accordion__header__wrapper{margin:1rem 0 1rem 2rem}.dnb-accordion__header__icon+.dnb-accordion__header__wrapper{margin-left:0;margin-right:2rem}.dnb-accordion__header__container{margin:0 1rem}.dnb-accordion__header__icon{-ms-flex-item-align:start;align-self:flex-start;font-size:1rem;font-size:var(--font-size-small);line-height:1.25rem;line-height:var(--line-height-small);margin:1.5rem 1rem;-webkit-transition:-webkit-transform .4s cubic-bezier(.42,0,0,1);transition:-webkit-transform .4s cubic-bezier(.42,0,0,1);transition:transform .4s cubic-bezier(.42,0,0,1);transition:transform .4s cubic-bezier(.42,0,0,1),-webkit-transform .4s cubic-bezier(.42,0,0,1);-webkit-transition:-webkit-transform .4s var(--accordion-easing);transition:-webkit-transform .4s var(--accordion-easing);transition:transform .4s var(--accordion-easing);transition:transform .4s var(--accordion-easing),-webkit-transform .4s var(--accordion-easing)}.dnb-accordion__header--description .dnb-accordion__header__icon{margin-top:1rem}.dnb-accordion__header__icon--right{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dnb-accordion__header__icon--right .dnb-accordion__header__icon{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.dnb-accordion__header__icon--right .dnb-accordion__header__container{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.dnb-accordion__header__icon--right .dnb-accordion__header__wrapper{-webkit-box-ordinal-group:3;-ms-flex-order:2;margin-left:1rem;margin-right:1rem;order:2}.dnb-accordion__header__icon--right .dnb-accordion__header__wrapper+.dnb-accordion__header__container{margin-right:0}.dnb-accordion__header__icon--right .dnb-accordion__header__container+.dnb-accordion__header__wrapper{margin-left:0}.dnb-accordion__header__title{font-size:1.125rem;font-size:var(--font-size-basis);line-height:1.5rem;line-height:var(--line-height-basis)}.dnb-accordion__header__description{font-size:1rem;font-size:var(--font-size-small);font-weight:400;font-weight:var(--font-weight-basis);line-height:1.25rem;line-height:var(--line-height-small)}.dnb-accordion__header__description+.dnb-accordion__header__title,.dnb-accordion__header__title+.dnb-accordion__header__description{margin-top:.25rem}.dnb-accordion--expanded .dnb-accordion__header__icon{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.dnb-accordion--no-animation .dnb-accordion__header__icon,html[data-visual-test] .dnb-accordion__header__icon{-webkit-transition-duration:1ms!important;transition-duration:1ms!important}.dnb-accordion__content{display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:height .4s cubic-bezier(.42,0,0,1),opacity .6s cubic-bezier(.42,0,0,1);transition:height .4s cubic-bezier(.42,0,0,1),opacity .6s cubic-bezier(.42,0,0,1);-webkit-transition:height .4s var(--accordion-easing),opacity .6s var(--accordion-easing);transition:height .4s var(--accordion-easing),opacity .6s var(--accordion-easing);visibility:visible;will-change:height}.dnb-accordion__content--hidden{height:0;opacity:0;visibility:hidden}.dnb-accordion__content--is-animating{overflow:hidden}.dnb-accordion__content__inner{margin-top:1rem}.dnb-accordion__content__inner--remove-content{display:none}.dnb-accordion-group--single-container{-webkit-transition:min-height 1s cubic-bezier(.42,0,0,1);transition:min-height 1s cubic-bezier(.42,0,0,1);-webkit-transition:min-height 1s var(--accordion-easing);transition:min-height 1s var(--accordion-easing)}.dnb-accordion-group--single-container .dnb-accordion{max-width:60rem;position:static}@media screen and (min-width:40em){.dnb-accordion-group--single-container .dnb-accordion__header{width:40%}.dnb-accordion-group--single-container .dnb-accordion__header__icon{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.dnb-accordion-group--single-container .dnb-accordion__content{margin-left:1rem;-webkit-transition:opacity 1s cubic-bezier(.42,0,0,1);transition:opacity 1s cubic-bezier(.42,0,0,1);-webkit-transition:opacity 1s var(--accordion-easing);transition:opacity 1s var(--accordion-easing)}.dnb-accordion-group--single-container .dnb-accordion__content__inner{margin-top:0}}.dnb-accordion--no-animation .dnb-accordion__content,html[data-visual-test] .dnb-accordion__content{-webkit-transition-duration:1ms!important;transition-duration:1ms!important}.dnb-accordion-group--single-container .dnb-accordion-group__children{max-width:60rem}@media screen and (min-width:40em){.dnb-accordion-group--single-container .dnb-accordion-group__children{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:relative}.dnb-accordion-group--single-container .dnb-accordion-group__children .dnb-accordion__content{position:absolute;right:0;top:0;width:60%;z-index:10}}
+.dnb-icon{color:inherit;display:inline-block;font-size:1rem;height:1em;line-height:1rem;vertical-align:middle;width:1em}.dnb-icon img,.dnb-icon svg{shape-rendering:geometricPrecision;height:inherit;vertical-align:top;width:inherit}.dnb-icon svg[width="100%"]{width:inherit}.dnb-icon svg[height="100%"]{height:inherit}.dnb-icon--inherit-color svg:not([fill]),.dnb-icon--inherit-color svg [fill]{fill:currentColor}.dnb-icon--inherit-color svg [stroke]{stroke:currentColor}.dnb-icon--small{font-size:.75rem}.dnb-icon--default{font-size:1rem}.dnb-icon--medium{font-size:1.5rem}.dnb-icon--large{font-size:2rem}.dnb-icon--x-large{font-size:2.5rem}.dnb-icon--xx-large{font-size:3rem}.dnb-icon--custom-size{height:auto;width:auto}.dnb-icon--auto{font-size:1em}.dnb-icon--auto>.dnb-icon--wrapper{-webkit-box-align:center;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;justify-content:center}h1 .dnb-icon,h2 .dnb-icon,h3 .dnb-icon,h4 .dnb-icon,h5 .dnb-icon,h6 .dnb-icon{vertical-align:middle}.dnb-icon.dnb-skeleton{color:#ebebeb!important;color:var(--skeleton-color)!important}.dnb-icon.dnb-skeleton:after,.dnb-icon.dnb-skeleton:before{content:none!important}@media screen and (-ms-high-contrast:none){.dnb-icon{-webkit-box-flex:0;-ms-flex:none;flex:none}}.dnb-accordion{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#333;color:var(--color-black-80,#333);font-family:DNB,sans-serif;font-family:var(--font-family-default);font-style:normal;font-weight:400;font-weight:var(--font-weight-basis);margin:0;padding:0;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-break:break-word}.dnb-accordion *,.dnb-accordion :after,.dnb-accordion :before{background-repeat:no-repeat;-webkit-box-sizing:border-box;box-sizing:border-box}.dnb-accordion :after,.dnb-accordion :before{text-decoration:inherit;vertical-align:inherit}:root{--accordion-border-width:0.0625rem;--accordion-border-radius:0.25rem;--accordion-easing:cubic-bezier(0.42,0,0,1)}.dnb-accordion{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-size:1rem;font-size:var(--font-size-small);line-height:1.5rem;line-height:var(--line-height-basis);position:relative}.dnb-accordion,.dnb-accordion__header{display:-webkit-box;display:-ms-flexbox;display:flex}.dnb-accordion__header{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:.0625rem solid transparent;border:var(--accordion-border-width) solid transparent;border-radius:.25rem;border-radius:var(--accordion-border-radius);cursor:pointer;outline:none}.dnb-accordion__header:focus{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.dnb-accordion__header *{pointer-events:none}.dnb-accordion__header--prevent-click{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.dnb-accordion__header__wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:1.5rem 0 1.5rem 2rem;width:100%}.dnb-accordion__header--description .dnb-accordion__header__wrapper{margin:1rem 0 1rem 2rem}.dnb-accordion__header__icon+.dnb-accordion__header__wrapper{margin-left:0;margin-right:2rem}.dnb-accordion__header__container{margin:0 1rem}.dnb-accordion__header__icon{-ms-flex-item-align:start;align-self:flex-start;font-size:1rem;font-size:var(--font-size-small);line-height:1.25rem;line-height:var(--line-height-small);margin:1.5rem 1rem;-webkit-transition:-webkit-transform .4s cubic-bezier(.42,0,0,1);transition:-webkit-transform .4s cubic-bezier(.42,0,0,1);transition:transform .4s cubic-bezier(.42,0,0,1);transition:transform .4s cubic-bezier(.42,0,0,1),-webkit-transform .4s cubic-bezier(.42,0,0,1);-webkit-transition:-webkit-transform .4s var(--accordion-easing);transition:-webkit-transform .4s var(--accordion-easing);transition:transform .4s var(--accordion-easing);transition:transform .4s var(--accordion-easing),-webkit-transform .4s var(--accordion-easing)}.dnb-accordion__header--description .dnb-accordion__header__icon{margin-top:1rem}.dnb-accordion__header__icon--right{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.dnb-accordion__header__icon--right .dnb-accordion__header__icon{-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.dnb-accordion__header__icon--right .dnb-accordion__header__container{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.dnb-accordion__header__icon--right .dnb-accordion__header__wrapper{-webkit-box-ordinal-group:3;-ms-flex-order:2;margin-left:1rem;margin-right:1rem;order:2}.dnb-accordion__header__icon--right .dnb-accordion__header__wrapper+.dnb-accordion__header__container{margin-right:0}.dnb-accordion__header__icon--right .dnb-accordion__header__container+.dnb-accordion__header__wrapper{margin-left:0}.dnb-accordion__header__title{font-size:1.125rem;font-size:var(--font-size-basis);line-height:1.5rem;line-height:var(--line-height-basis)}.dnb-accordion__header__description{font-size:1rem;font-size:var(--font-size-small);font-weight:400;font-weight:var(--font-weight-basis);line-height:1.25rem;line-height:var(--line-height-small)}.dnb-accordion__header__description+.dnb-accordion__header__title,.dnb-accordion__header__title+.dnb-accordion__header__description{margin-top:.25rem}.dnb-accordion--no-animation .dnb-accordion__header__icon,html[data-visual-test] .dnb-accordion__header__icon{-webkit-transition-duration:1ms!important;transition-duration:1ms!important}.dnb-accordion--expanded>.dnb-accordion__header .dnb-accordion__header__icon{-webkit-transform:rotate(-180deg);transform:rotate(-180deg)}.dnb-accordion__content{display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transition:height .4s cubic-bezier(.42,0,0,1),opacity .6s cubic-bezier(.42,0,0,1);transition:height .4s cubic-bezier(.42,0,0,1),opacity .6s cubic-bezier(.42,0,0,1);-webkit-transition:height .4s var(--accordion-easing),opacity .6s var(--accordion-easing);transition:height .4s var(--accordion-easing),opacity .6s var(--accordion-easing);visibility:visible;width:100%;will-change:height}.dnb-accordion__content--hidden{height:0;opacity:0;visibility:hidden}.dnb-accordion__content--is-animating{overflow:hidden}.dnb-accordion__content__inner{margin-top:1rem;width:100%}.dnb-accordion__content__inner--remove-content{display:none}.dnb-accordion-group--single-container{-webkit-transition:min-height 1s cubic-bezier(.42,0,0,1);transition:min-height 1s cubic-bezier(.42,0,0,1);-webkit-transition:min-height 1s var(--accordion-easing);transition:min-height 1s var(--accordion-easing)}.dnb-accordion-group--single-container .dnb-accordion{max-width:60rem;position:static}@media screen and (min-width:40em){.dnb-accordion-group--single-container .dnb-accordion__header{width:40%}.dnb-accordion-group--single-container .dnb-accordion__content{margin-left:1rem;-webkit-transition:opacity 1s cubic-bezier(.42,0,0,1);transition:opacity 1s cubic-bezier(.42,0,0,1);-webkit-transition:opacity 1s var(--accordion-easing);transition:opacity 1s var(--accordion-easing)}.dnb-accordion-group--single-container .dnb-accordion__content__inner{margin-top:0}.dnb-accordion-group--single-container .dnb-accordion>.dnb-accordion__header .dnb-accordion__header__icon{-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}}.dnb-accordion--no-animation .dnb-accordion__content,html[data-visual-test] .dnb-accordion__content{-webkit-transition-duration:1ms!important;transition-duration:1ms!important}.dnb-accordion-group--single-container .dnb-accordion-group__children{max-width:60rem}@media screen and (min-width:40em){.dnb-accordion-group--single-container .dnb-accordion-group__children{-webkit-box-orient:vertical;-webkit-box-direction:normal;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:relative}.dnb-accordion-group--single-container .dnb-accordion-group__children .dnb-accordion__content{position:absolute;right:0;top:0;width:60%;z-index:10}}

package/es/components/accordion/style/themes/dnb-accordion-theme-ui.css

@@ -16,18 +16,20 @@
 */
 .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__icon, .dnb-accordion__header__container {
+  color: #007272;
+  color: var(--color-sea-green); }
+
+.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;
@@ -39,34 +41,34 @@
   /* 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);
@@ -74,26 +76,26 @@
       /* 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;
@@ -103,19 +105,19 @@
             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;
@@ -125,30 +127,31 @@
             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[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 {
   color: #fff;
   color: var(--color-white);
   background-color: #007272;
@@ -158,56 +161,59 @@
           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); }
+
+.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 {
-    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: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 {
+        -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 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: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: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;
@@ -217,12 +223,12 @@ 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); }

package/es/components/accordion/style/themes/dnb-accordion-theme-ui.min.css

@@ -1,3 +1,3 @@
-.dnb-accordion__header{border:none}.dnb-accordion__header__container,.dnb-accordion__header__icon{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{font-weight:500;font-weight:var(--font-weight-medium)}.dnb-accordion__variant--outlined .dnb-accordion__header{--border-color:var(--color-black-8);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .0625rem var(--border-color);box-shadow:inset 0 0 0 .0625rem var(--border-color);color:#333;color:var(--color-black-80)}@supports (-webkit-touch-callout:none){.dnb-accordion__variant--outlined .dnb-accordion__header{-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow: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{-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color)}}}@media screen and (-ms-high-contrast:none){.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]{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]){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]){--border-color:var(--color-emerald-green);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .125rem var(--border-color);box-shadow:inset 0 0 0 .125rem var(--border-color);color:#14555a;color:var(--color-emerald-green)}@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]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow: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]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow: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]){-webkit-box-shadow:inset 0 0 0 .125rem #14555a;box-shadow:inset 0 0 0 .125rem #14555a;-webkit-box-shadow:inset 0 0 0 .125rem var(--color-emerald-green);box-shadow:inset 0 0 0 .125rem var(--color-emerald-green)}}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]){--border-color:var(--color-emerald-green);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color);color:#14555a;color: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]){-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green);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]{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]){--border-color:var(--color-emerald-green);background-color:#f2f4ec;background-color:var(--color-pistachio);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#14555a;color:var(--color-emerald-green)}@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]){-webkit-box-shadow:0 0 0 .0625rem #14555a;box-shadow:0 0 0 .0625rem #14555a;-webkit-box-shadow:0 0 0 .0625rem var(--color-emerald-green);box-shadow:0 0 0 .0625rem var(--color-emerald-green)}}.dnb-accordion__variant--outlined .dnb-accordion__header[disabled]{--border-color:var(--color-sea-green-30);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color)}@media screen and (-ms-high-contrast:none){.dnb-accordion__variant--outlined .dnb-accordion__header[disabled]{-webkit-box-shadow:0 0 0 .0625rem #b3dada;box-shadow:0 0 0 .0625rem #b3dada;-webkit-box-shadow:0 0 0 .0625rem var(--color-sea-green-30);box-shadow: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{--border-color:transparent;background-color:#007272;background-color:var(--color-sea-green);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#fff;color:var(--color-white)}@media screen and (-ms-high-contrast:none){.dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header{-webkit-box-shadow:0 0 0 .0625rem transparent;box-shadow: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);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .125rem var(--border-color);box-shadow:inset 0 0 0 .125rem var(--border-color)}@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{-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow: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 .125rem var(--border-color);box-shadow: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 .125rem #14555a;box-shadow:inset 0 0 0 .125rem #14555a;-webkit-box-shadow:inset 0 0 0 .125rem var(--color-emerald-green);box-shadow:inset 0 0 0 .125rem var(--color-emerald-green)}}.dnb-accordion__variant--outlined.dnb-accordion--expanded .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]{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]){--border-color:var(--color-sea-green);background-color:#007272;background-color:var(--color-sea-green);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#fff;color:var(--color-white)}@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]){-webkit-box-shadow:0 0 0 .0625rem #007272;box-shadow:0 0 0 .0625rem #007272;-webkit-box-shadow:0 0 0 .0625rem var(--color-sea-green);box-shadow:0 0 0 .0625rem var(--color-sea-green)}}.dnb-accordion__variant--outlined.dnb-accordion--expanded .dnb-accordion__header.dnb-accordion--hover:not(:active) *{color:#fff;color:var(--color-white)}
+.dnb-accordion__header{border:none}.dnb-accordion__header__container,.dnb-accordion__header__icon{color:#007272;color:var(--color-sea-green)}.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{--border-color:var(--color-black-8);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .0625rem var(--border-color);box-shadow:inset 0 0 0 .0625rem var(--border-color);color:#333;color:var(--color-black-80)}@supports (-webkit-touch-callout:none){.dnb-accordion__variant--outlined>.dnb-accordion__header{-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow: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{-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color)}}}@media screen and (-ms-high-contrast:none){.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]{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]){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]){--border-color:var(--color-emerald-green);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .125rem var(--border-color);box-shadow:inset 0 0 0 .125rem var(--border-color);color:#14555a;color:var(--color-emerald-green)}@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]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow: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]){-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow: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]){-webkit-box-shadow:inset 0 0 0 .125rem #14555a;box-shadow:inset 0 0 0 .125rem #14555a;-webkit-box-shadow:inset 0 0 0 .125rem var(--color-emerald-green);box-shadow:inset 0 0 0 .125rem var(--color-emerald-green)}}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]){--border-color:var(--color-emerald-green);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow:0 0 0 .125rem var(--border-color);color:#14555a;color: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]){-webkit-box-shadow:0 0 0 .125rem #14555a;box-shadow:0 0 0 .125rem #14555a;-webkit-box-shadow:0 0 0 .125rem var(--color-emerald-green);box-shadow:0 0 0 .125rem var(--color-emerald-green);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]{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]){--border-color:var(--color-emerald-green);background-color:#f2f4ec;background-color:var(--color-pistachio);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#14555a;color:var(--color-emerald-green)}@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]){-webkit-box-shadow:0 0 0 .0625rem #14555a;box-shadow:0 0 0 .0625rem #14555a;-webkit-box-shadow:0 0 0 .0625rem var(--color-emerald-green);box-shadow:0 0 0 .0625rem var(--color-emerald-green)}}.dnb-accordion__variant--outlined>.dnb-accordion__header[disabled]{--border-color:var(--color-sea-green-30);background-color:#fff;background-color:var(--color-white);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color)}@media screen and (-ms-high-contrast:none){.dnb-accordion__variant--outlined>.dnb-accordion__header[disabled]{-webkit-box-shadow:0 0 0 .0625rem #b3dada;box-shadow:0 0 0 .0625rem #b3dada;-webkit-box-shadow:0 0 0 .0625rem var(--color-sea-green-30);box-shadow: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{--border-color:transparent;background-color:#007272;background-color:var(--color-sea-green);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#fff;color:var(--color-white)}@media screen and (-ms-high-contrast:none){.dnb-accordion__variant--outlined.dnb-accordion--expanded>.dnb-accordion__header{-webkit-box-shadow:0 0 0 .0625rem transparent;box-shadow: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);border-color:transparent;-webkit-box-shadow:inset 0 0 0 .125rem var(--border-color);box-shadow:inset 0 0 0 .125rem var(--border-color)}@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{-webkit-box-shadow:0 0 0 .125rem var(--border-color);box-shadow: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 .125rem var(--border-color);box-shadow: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 .125rem #14555a;box-shadow:inset 0 0 0 .125rem #14555a;-webkit-box-shadow:inset 0 0 0 .125rem var(--color-emerald-green);box-shadow:inset 0 0 0 .125rem var(--color-emerald-green)}}.dnb-accordion__variant--outlined.dnb-accordion--expanded>.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]{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]){--border-color:var(--color-sea-green);background-color:#007272;background-color:var(--color-sea-green);border-color:transparent;-webkit-box-shadow:0 0 0 .0625rem var(--border-color);box-shadow:0 0 0 .0625rem var(--border-color);color:#fff;color:var(--color-white)}@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]){-webkit-box-shadow:0 0 0 .0625rem #007272;box-shadow:0 0 0 .0625rem #007272;-webkit-box-shadow:0 0 0 .0625rem var(--color-sea-green);box-shadow:0 0 0 .0625rem var(--color-sea-green)}}.dnb-accordion__variant--outlined.dnb-accordion--expanded>.dnb-accordion__header.dnb-accordion--hover:not(:active) *{color:#fff;color:var(--color-white)}