npm - @inera/ids-design - Versions diffs - 8.0.1 → 8.2.0 - Mend

@inera/ids-design 8.0.1 → 8.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (168) hide show

package/components/mobile-menu/mobile-menu.css CHANGED Viewed

@@ -23,28 +23,37 @@
   display: block;
 }
-/* VARIATION 1 */
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item {
-  position: relative;
-  min-height: 3rem;
-  min-width: 3rem;
+/* VARIATION 2 */
+.ids-mobile-menu {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+.ids-mobile-menu ul {
+  list-style: none;
+  padding: 0;
+  margin: 0;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner {
   cursor: pointer;
   display: flex;
   font-family: var(--IDS-FONT-FAMILY-BASE);
   font-size: 1rem;
   min-height: 3rem;
+  min-width: 3rem;
   width: 100%;
   position: relative;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover {
+  color: var(--IDS-MOBILE-MENU-ITEM--HOVER__COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner {
+  font-weight: var(--IDS-MOBILE-MENU-ITEM__FONT-WEIGHT);
+  color: var(--IDS-MOBILE-MENU-ITEM__COLOR);
+}
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
   width: 100%;
   flex-grow: 1;
   display: inline-flex;
@@ -56,31 +65,29 @@
   font-weight: inherit !important;
   text-decoration: none !important;
   text-align: start;
-  padding: 0.75rem 0.75rem 0.75rem 1.25rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner {
-  font-weight: var(--IDS-MOBILE-MENU-ITEM__FONT-WEIGHT);
-  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM__BORDER-BOTTOM-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible) {
+  outline: 0.125rem solid;
+  outline-offset: -0.25rem !important;
+  z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--HOVER__BEFORE-BACKGROUND-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+  padding: 0.75rem 0.75rem 0.75rem 1.25rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner {
   background-color: var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
-  color: var(--IDS-MOBILE-MENU-ITEM__COLOR);
+  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM__BORDER-BOTTOM-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -90,33 +97,10 @@
   z-index: 0;
   background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--HOVER__BEFORE-BACKGROUND-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a:focus, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus) {
-  outline: 0.125rem solid;
-  outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
-  z-index: 1;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
   min-width: 1.5rem;
   min-height: 1.5rem;
   background: none;
@@ -143,8 +127,7 @@
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
   font: icon;
   font-family: "Inera-Design-Icons" !important;
   display: block;
@@ -156,38 +139,31 @@
   width: 1rem;
   height: 1rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
   background-color: var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
   outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
   content: "\e939";
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
   padding-right: 3.125rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
   right: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible {
   outline: 0.125rem solid;
   outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
   z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary) > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
   width: 100%;
   justify-content: space-between;
   padding-left: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary).ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary).ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -195,22 +171,17 @@
   width: 0.625rem;
   left: 0;
   z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--HOVER__BEFORE-BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner {
-  cursor: pointer;
-  display: flex;
-  font-family: var(--IDS-FONT-FAMILY-BASE);
-  font-size: 1rem;
-  min-height: 3rem;
-  width: 100%;
-  position: relative;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary).ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item:not(.ids-mobile-menu-item--secondary).ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
+}
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner {
+  font-weight: var(--IDS-MOBILE-MENU-ITEM__FONT-WEIGHT);
+  color: var(--IDS-MOBILE-MENU-ITEM__COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
 .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
   width: 100%;
   flex-grow: 1;
@@ -223,31 +194,29 @@
   font-weight: inherit !important;
   text-decoration: none !important;
   text-align: start;
-  padding: 0.75rem 0.75rem 0.75rem 1.25rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner {
-  font-weight: var(--IDS-MOBILE-MENU-ITEM__FONT-WEIGHT);
-  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM__BORDER-BOTTOM-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible) {
+  outline: 0.125rem solid;
+  outline-offset: -0.25rem !important;
+  z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner:hover::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--HOVER__BEFORE-BACKGROUND-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+  padding: 0.75rem 0.75rem 0.75rem 1.25rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner {
-  color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY__COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner {
   background-color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BACKGROUND-COLOR);
+  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BORDER-BOTTOM-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -257,33 +226,10 @@
   z-index: 0;
   background-color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BEFORE-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner:hover::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY--HOVER__BEFORE-BACKGROUND-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a:focus, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus) {
-  outline: 0.125rem solid;
-  outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
-  z-index: 1;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
   min-width: 1.5rem;
   min-height: 1.5rem;
   background: none;
@@ -310,8 +256,7 @@
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
   font: icon;
   font-family: "Inera-Design-Icons" !important;
   display: block;
@@ -323,38 +268,31 @@
   width: 1rem;
   height: 1rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
   background-color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BACKGROUND-COLOR);
   outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
   content: "\e939";
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
   padding-right: 3.125rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
   right: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible {
   outline: 0.125rem solid;
   outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
   z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
   width: 100%;
   justify-content: space-between;
   padding-left: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -362,26 +300,32 @@
   width: 0.625rem;
   left: 0;
   z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--HOVER__BEFORE-BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 {
-  position: relative;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item.ids-mobile-menu-item--secondary.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item.ids-mobile-menu-item--secondary.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM-SECONDARY__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner {
   cursor: pointer;
   display: flex;
   font-family: var(--IDS-FONT-FAMILY-BASE);
   font-size: 1rem;
   min-height: 3rem;
+  min-width: 3rem;
   width: 100%;
   position: relative;
 }
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover {
+  color: var(--IDS-MOBILE-MENU-ITEM--HOVER__COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner {
+  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
+  color: var(--IDS-MOBILE-MENU-ITEM--L2__COLOR);
+  font-weight: var(--IDS-MOBILE-MENU-ITEM--L2__FONT-WEIGHT);
+  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM--L2__BORDER-BOTTOM-COLOR);
+}
 .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
 .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
   width: 100%;
   flex-grow: 1;
@@ -394,17 +338,25 @@
   font-weight: inherit !important;
   text-decoration: none !important;
   text-align: start;
-  padding: 0.75rem 0.75rem 0.75rem 2.5rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner {
-  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
-  color: var(--IDS-MOBILE-MENU-ITEM--L2__COLOR);
-  font-weight: var(--IDS-MOBILE-MENU-ITEM--L2__FONT-WEIGHT);
-  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM--L2__BORDER-BOTTOM-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible) {
+  outline: 0.125rem solid;
+  outline-offset: -0.25rem !important;
+  z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+  padding: 0.75rem 0.75rem 0.75rem 2.5rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -414,33 +366,10 @@
   z-index: 0;
   background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BEFORE-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a:focus, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus) {
-  outline: 0.125rem solid;
-  outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
-  z-index: 1;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
   min-width: 1.5rem;
   min-height: 1.5rem;
   background: none;
@@ -467,8 +396,7 @@
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
   font: icon;
   font-family: "Inera-Design-Icons" !important;
   display: block;
@@ -480,38 +408,31 @@
   width: 1rem;
   height: 1rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
   content: "\e939";
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
   padding-right: 3.125rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
   right: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible {
   outline: 0.125rem solid;
   outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
   z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
   width: 100%;
   justify-content: space-between;
   padding-left: 2.5rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -519,26 +440,32 @@
   width: 0.625rem;
   left: 0;
   z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 {
-  position: relative;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner {
   cursor: pointer;
   display: flex;
   font-family: var(--IDS-FONT-FAMILY-BASE);
   font-size: 1rem;
   min-height: 3rem;
+  min-width: 3rem;
   width: 100%;
   position: relative;
 }
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover {
+  color: var(--IDS-MOBILE-MENU-ITEM--HOVER__COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner {
+  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
+  color: var(--IDS-MOBILE-MENU-ITEM--L2__COLOR);
+  font-weight: var(--IDS-MOBILE-MENU-ITEM--L2__FONT-WEIGHT);
+  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM--L2__BORDER-BOTTOM-COLOR);
+}
 .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
 .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
   width: 100%;
   flex-grow: 1;
@@ -551,17 +478,25 @@
   font-weight: inherit !important;
   text-decoration: none !important;
   text-align: start;
-  padding: 0.75rem 0.75rem 0.75rem 3.75rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner {
-  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
-  color: var(--IDS-MOBILE-MENU-ITEM--L2__COLOR);
-  font-weight: var(--IDS-MOBILE-MENU-ITEM--L2__FONT-WEIGHT);
-  border-bottom: 0.063rem solid var(--IDS-MOBILE-MENU-ITEM--L2__BORDER-BOTTOM-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible) {
+  outline: 0.125rem solid;
+  outline-offset: -0.25rem !important;
+  z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]), .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+  padding: 0.75rem 0.75rem 0.75rem 3.75rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -571,33 +506,10 @@
   z-index: 0;
   background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BEFORE-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a:focus, .ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus) {
-  outline: 0.125rem solid;
-  outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
-  z-index: 1;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
   min-width: 1.5rem;
   min-height: 1.5rem;
   background: none;
@@ -624,8 +536,7 @@
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn::before {
   font: icon;
   font-family: "Inera-Design-Icons" !important;
   display: block;
@@ -637,38 +548,31 @@
   width: 1rem;
   height: 1rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM--L2__BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
   content: "\e939";
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline {
   padding-right: 3.125rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
   right: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible {
   outline: 0.125rem solid;
   outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
   z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU--FOCUS-OUTLINE-COLOR) !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
   width: 100%;
   justify-content: space-between;
   padding-left: 3.75rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before,
-.ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
   content: "";
   display: block;
   position: absolute;
@@ -676,23 +580,39 @@
   width: 0.625rem;
   left: 0;
   z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-/* VARIATION 2 */
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item {
-  position: relative;
+.ids-mobile-menu.ids-mobile-menu--variation-1 .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before, .ids-mobile-menu:not(.ids-mobile-menu--variation-2) .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner {
-  position: relative;
   cursor: pointer;
   display: flex;
   font-family: var(--IDS-FONT-FAMILY-BASE);
   font-size: 1rem;
   min-height: 3rem;
+  min-width: 3rem;
   width: 100%;
   position: relative;
-  border-bottom: none;
+  border-bottom: 0.063rem solid transparent;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner::after {
+  content: "";
+  display: block;
+  height: 0.063rem;
+  left: 1.25rem;
+  bottom: 0;
+  right: 1.25rem;
+  position: absolute;
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BORDER-BOTTOM-COLOR);
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover {
+  color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner {
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
+  color: var(--IDS-MOBILE-MENU-2-ITEM__COLOR);
+  font-weight: var(--IDS-MOBILE-MENU-2-ITEM__FONT-WEIGHT);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
@@ -707,16 +627,19 @@
   font-weight: inherit !important;
   text-decoration: none !important;
   text-align: start;
-  padding: 0.75rem 0.75rem 0.75rem 1.25rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner::after {
-  content: "";
-  display: block;
-  height: 0.063rem;
-  left: 1.25rem;
-  bottom: 0;
-  right: 1.25rem;
-  position: absolute;
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible) {
+  outline: 0.125rem solid;
+  outline-offset: -0.25rem !important;
+  z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+  padding: 0.75rem 0.75rem 0.75rem 1.25rem !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner::before {
   content: "";
@@ -728,35 +651,8 @@
   z-index: 0;
   background-color: var(--IDS-MOBILE-MENU-2-ITEM__BEFORE-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
-  color: var(--IDS-MOBILE-MENU-2-ITEM__COLOR);
-  font-weight: var(--IDS-MOBILE-MENU-2-ITEM__FONT-WEIGHT);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner::after {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BORDER-BOTTOM-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover {
-  color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__COLOR);
-}
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__BEFORE-BACKGROUND-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > a:focus, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus) {
-  outline: 0.125rem solid;
-  outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
-  z-index: 1;
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
   min-width: 1.5rem;
@@ -798,8 +694,8 @@
   height: 1rem;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
   content: "\e939";
@@ -810,11 +706,11 @@
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
   right: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus {
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible {
   outline: 0.125rem solid;
   outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
   z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
   width: 100%;
@@ -822,8 +718,8 @@
   padding-left: 1.25rem;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
+  /*  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR); */
   right: 1.25rem !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
@@ -834,21 +730,39 @@
   width: 0.625rem;
   left: 0;
   z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__BEFORE-BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 {
-  position: relative;
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BEFORE-HOVER-BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner {
-  position: relative;
   cursor: pointer;
   display: flex;
   font-family: var(--IDS-FONT-FAMILY-BASE);
   font-size: 1rem;
   min-height: 3rem;
+  min-width: 3rem;
   width: 100%;
   position: relative;
-  border-bottom: none;
+  border-bottom: 0.063rem solid transparent;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::after {
+  content: "";
+  display: block;
+  height: 0.063rem;
+  left: 1.25rem;
+  bottom: 0;
+  right: 1.25rem;
+  position: absolute;
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BORDER-BOTTOM-COLOR);
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover {
+  color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner {
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
+  color: var(--IDS-MOBILE-MENU-2-ITEM--L2__COLOR);
+  font-weight: var(--IDS-MOBILE-MENU-2-ITEM--L2__FONT-WEIGHT);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
@@ -863,16 +777,19 @@
   font-weight: inherit !important;
   text-decoration: none !important;
   text-align: start;
-  padding: 0.75rem 0.75rem 0.75rem 2.5rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::after {
-  content: "";
-  display: block;
-  height: 0.063rem;
-  left: 1.25rem;
-  bottom: 0;
-  right: 1.25rem;
-  position: absolute;
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible) {
+  outline: 0.125rem solid;
+  outline-offset: -0.25rem !important;
+  z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+  padding: 0.75rem 0.75rem 0.75rem 2.5rem !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::before {
   content: "";
@@ -884,35 +801,8 @@
   z-index: 0;
   background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
-  color: var(--IDS-MOBILE-MENU-2-ITEM--L2__COLOR);
-  font-weight: var(--IDS-MOBILE-MENU-2-ITEM--L2__FONT-WEIGHT);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner::after {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BORDER-BOTTOM-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover {
-  color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__COLOR);
-}
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > a:focus, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus) {
-  outline: 0.125rem solid;
-  outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
-  z-index: 1;
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
   min-width: 1.5rem;
@@ -954,8 +844,8 @@
   height: 1rem;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
   content: "\e939";
@@ -966,11 +856,11 @@
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
   right: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus {
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible {
   outline: 0.125rem solid;
   outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
   z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
   width: 100%;
@@ -978,8 +868,8 @@
   padding-left: 2.5rem;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-BACKGROUND-COLOR);
   right: 1.25rem !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
@@ -990,21 +880,39 @@
   width: 0.625rem;
   left: 0;
   z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 {
-  position: relative;
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--2.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner {
-  position: relative;
   cursor: pointer;
   display: flex;
   font-family: var(--IDS-FONT-FAMILY-BASE);
   font-size: 1rem;
   min-height: 3rem;
+  min-width: 3rem;
   width: 100%;
   position: relative;
-  border-bottom: none;
+  border-bottom: 0.063rem solid transparent;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::after {
+  content: "";
+  display: block;
+  height: 0.063rem;
+  left: 1.25rem;
+  bottom: 0;
+  right: 1.25rem;
+  position: absolute;
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BORDER-BOTTOM-COLOR);
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover {
+  color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner {
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
+  color: var(--IDS-MOBILE-MENU-2-ITEM--L2__COLOR);
+  font-weight: var(--IDS-MOBILE-MENU-2-ITEM--L2__FONT-WEIGHT);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
@@ -1019,16 +927,19 @@
   font-weight: inherit !important;
   text-decoration: none !important;
   text-align: start;
-  padding: 0.75rem 0.75rem 0.75rem 3.75rem !important;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::after {
-  content: "";
-  display: block;
-  height: 0.063rem;
-  left: 1.25rem;
-  bottom: 0;
-  right: 1.25rem;
-  position: absolute;
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a:focus-visible, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner a:focus-visible,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted(:focus-visible),
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus-visible) {
+  outline: 0.125rem solid;
+  outline-offset: -0.25rem !important;
+  z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
+}
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link,
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]) {
+  padding: 0.75rem 0.75rem 0.75rem 3.75rem !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::before {
   content: "";
@@ -1040,35 +951,8 @@
   z-index: 0;
   background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-BACKGROUND-COLOR);
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
-  color: var(--IDS-MOBILE-MENU-2-ITEM--L2__COLOR);
-  font-weight: var(--IDS-MOBILE-MENU-2-ITEM--L2__FONT-WEIGHT);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner::after {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BORDER-BOTTOM-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover {
-  color: var(--IDS-MOBILE-MENU-2-ITEM--HOVER__COLOR);
-}
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner:hover::before {
-  content: "";
-  display: block;
-  position: absolute;
-  height: 100%;
-  width: 0.625rem;
-  left: 0;
-  z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
-}
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > a:focus, .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item-link:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner a:focus,
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted(:focus),
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner ::slotted([slot=link]:focus) {
-  outline: 0.125rem solid;
-  outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
-  z-index: 1;
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn {
   min-width: 1.5rem;
@@ -1110,8 +994,8 @@
   height: 1rem;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-ITEM__BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM--L2__BACKGROUND-COLOR);
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu__chevron--expanded::before {
   content: "\e939";
@@ -1122,11 +1006,11 @@
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn.ids-mobile-menu-item__expand-btn--headline::before {
   right: 1.25rem;
 }
-.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus {
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:focus-visible {
   outline: 0.125rem solid;
   outline-offset: -0.25rem !important;
-  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
   z-index: 1;
+  outline-color: var(--IDS-MOBILE-MENU-2--FOCUS-OUTLINE-COLOR) !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:only-child {
   width: 100%;
@@ -1134,8 +1018,8 @@
   padding-left: 3.75rem;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3 > .ids-mobile-menu-item__inner > .ids-mobile-menu-item__expand-btn:before {
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
-  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM__BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-BACKGROUND-COLOR);
+  outline: 0.25rem solid var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-BACKGROUND-COLOR);
   right: 1.25rem !important;
 }
 .ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner::before {
@@ -1146,16 +1030,8 @@
   width: 0.625rem;
   left: 0;
   z-index: 0;
-  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2-HOVER__BEFORE-BACKGROUND-COLOR);
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }
-.ids-mobile-menu {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-}
-.ids-mobile-menu ul {
-  list-style: none;
-  padding: 0;
-  margin: 0;
+.ids-mobile-menu.ids-mobile-menu--variation-2 .ids-mobile-menu-item--3.ids-mobile-menu-item--active > .ids-mobile-menu-item__inner:hover::before {
+  background-color: var(--IDS-MOBILE-MENU-2-ITEM--L2__BEFORE-HOVER-BACKGROUND-COLOR);
 }