npm - @inera/ids-design - Versions diffs - 5.5.0 → 6.0.0 - Mend

@inera/ids-design 5.5.0 → 6.0.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 (139) hide show

package/components/header-1177-admin/header-1177-admin-nav-item.css CHANGED Viewed

@@ -1,4 +1,7 @@
 /*******
+* ICONS
+********/
+/*******
 * BUTTONS
 ********/
 /*******
@@ -93,7 +96,7 @@
   background-color: var(--IDS-COLOR-NEUTRAL-100);
   left: 0;
   min-height: 10.813rem;
-  padding: 2.5rem 0 3.125rem;
+  padding: 2.5rem 0.625rem 3.125rem;
   box-sizing: border-box;
   position: absolute;
   width: 100%;
@@ -111,19 +114,19 @@
 }
 .ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content {
   max-width: var(--IDS__MAX-WIDTH);
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr 1fr;
-  padding: 0 0.625rem;
-  margin-left: auto;
-  margin-right: auto;
+  margin: 0 auto;
+  width: 100%;
+  display: flex;
 }
-.ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item a {
-  margin-bottom: 0.625rem !important;
-  display: block !important;
+.ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-1,
+.ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-2,
+.ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-3,
+.ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-4 {
+  flex: 0 25%;
 }
-.ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item,
+.ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items-wrapper,
 .ids-header-1177-admin--unresponsive .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content ::slotted(*) {
-  display: block;
+  display: flex;
   margin-bottom: 0.625rem;
   padding-bottom: 0.625rem;
   margin-right: 2.5rem;
@@ -203,7 +206,7 @@
   background-color: var(--IDS-COLOR-NEUTRAL-100);
   left: 0;
   min-height: 10.813rem;
-  padding: 2.5rem 0 3.125rem;
+  padding: 2.5rem 0.625rem 3.125rem;
   box-sizing: border-box;
   position: absolute;
   width: 100%;
@@ -221,19 +224,19 @@
 }
 .ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content {
   max-width: var(--IDS__MAX-WIDTH);
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr 1fr;
-  padding: 0 0.625rem;
-  margin-left: auto;
-  margin-right: auto;
+  margin: 0 auto;
+  width: 100%;
+  display: flex;
 }
-.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item a {
-  margin-bottom: 0.625rem !important;
-  display: block !important;
+.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-1,
+.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-2,
+.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-3,
+.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-4 {
+  flex: 0 25%;
 }
-.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item,
+.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items-wrapper,
 .ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__nav-item .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content ::slotted(*) {
-  display: block;
+  display: flex;
   margin-bottom: 0.625rem;
   padding-bottom: 0.625rem;
   margin-right: 2.5rem;
@@ -322,7 +325,7 @@
   background-color: var(--IDS-COLOR-NEUTRAL-100);
   left: 0;
   min-height: 10.813rem;
-  padding: 2.5rem 0 3.125rem;
+  padding: 2.5rem 0.625rem 3.125rem;
   box-sizing: border-box;
   position: absolute;
   width: 100%;
@@ -340,19 +343,19 @@
 }
 :host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content {
   max-width: var(--IDS__MAX-WIDTH);
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr 1fr;
-  padding: 0 0.625rem;
-  margin-left: auto;
-  margin-right: auto;
+  margin: 0 auto;
+  width: 100%;
+  display: flex;
 }
-:host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item a {
-  margin-bottom: 0.625rem !important;
-  display: block !important;
+:host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-1,
+:host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-2,
+:host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-3,
+:host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-4 {
+  flex: 0 25%;
 }
-:host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item,
+:host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items-wrapper,
 :host .ids-header-1177-admin__nav-item:not(.ids-header-1177-admin__nav-item--unresponsive) .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content ::slotted(*) {
-  display: block;
+  display: flex;
   margin-bottom: 0.625rem;
   padding-bottom: 0.625rem;
   margin-right: 2.5rem;
@@ -436,7 +439,7 @@
   background-color: var(--IDS-COLOR-NEUTRAL-100);
   left: 0;
   min-height: 10.813rem;
-  padding: 2.5rem 0 3.125rem;
+  padding: 2.5rem 0.625rem 3.125rem;
   box-sizing: border-box;
   position: absolute;
   width: 100%;
@@ -454,19 +457,19 @@
 }
 :host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content {
   max-width: var(--IDS__MAX-WIDTH);
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr 1fr;
-  padding: 0 0.625rem;
-  margin-left: auto;
-  margin-right: auto;
+  margin: 0 auto;
+  width: 100%;
+  display: flex;
 }
-:host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item a {
-  margin-bottom: 0.625rem !important;
-  display: block !important;
+:host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-1,
+:host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-2,
+:host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-3,
+:host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-col-4 {
+  flex: 0 25%;
 }
-:host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items__item-dropdown__content-item,
+:host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content .ids-header-1177-admin__items-wrapper,
 :host .ids-header-1177-admin__nav-item.ids-header-1177-admin__nav-item--unresponsive .ids-header-1177-admin__items__item-dropdown .ids-header-1177-admin__items__item-dropdown__content ::slotted(*) {
-  display: block;
+  display: flex;
   margin-bottom: 0.625rem;
   padding-bottom: 0.625rem;
   margin-right: 2.5rem;

package/components/header-1177-admin/header-1177-admin.css CHANGED Viewed

@@ -1,4 +1,7 @@
 /*******
+* ICONS
+********/
+/*******
 * BUTTONS
 ********/
 /*******
@@ -24,7 +27,6 @@
 .ids-header-1177-admin__mobile-menu {
   display: none;
-  margin-left: 1.25rem;
 }
 @media (max-width: 1024px) {
   .ids-header-1177-admin__mobile-menu {
@@ -46,14 +48,14 @@
   background: none;
   color: inherit;
   border: none;
-  padding: 0;
+  padding: 0.25rem 0.5rem;
   font: inherit;
   cursor: pointer;
   color: var(--IDS-COLOR-ACCENT-40);
   align-items: center;
   justify-content: center;
   height: 1.5rem;
-  width: 1.5rem;
+  width: 2rem;
 }
 .ids-header-1177-admin__mobile-menu .ids-header-1177-admin__mobile-menu__btn:focus {
   outline: var(--IDS-FOCUS__OUTLINE);
@@ -72,7 +74,7 @@
   transition: all 0.2s;
   background-color: var(--IDS-COLOR-ACCENT-40);
   position: relative;
-  height: 0.188rem;
+  height: 0.125rem;
   width: 1.25rem;
 }
 .ids-header-1177-admin__mobile-menu .ids-header-1177-admin__mobile-menu__btn .ids-hamburger__lines:before,
@@ -90,7 +92,7 @@
 }
 .ids-header-1177-admin__mobile-menu .ids-header-1177-admin__mobile-menu__btn .ids-hamburger__lines:before,
 .ids-header-1177-admin__mobile-menu .ids-header-1177-admin__mobile-menu__btn .ids-hamburger__lines:after {
-  height: 0.188rem;
+  height: 0.125rem;
   width: 1.25rem;
 }
 .ids-header-1177-admin__mobile-menu .ids-header-1177-admin__mobile-menu__btn .ids-hamburger__lines:before,
@@ -184,16 +186,40 @@ header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-head
   width: 3.938rem;
   margin-right: 1.25rem;
   margin-left: 1.25rem;
+  display: flex;
+  align-items: center;
 }
-header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a {
+header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo .ids-header-1177-admin__logo-link {
+  position: relative;
+  display: flex;
+  align-items: center;
+  height: 1.5rem;
+  width: 3.938rem;
+  cursor: pointer;
+}
+header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo .ids-header-1177-admin__logo-link:before {
+  font: icon;
+  font-family: "Inera-Design-Icons";
   display: block;
+  position: absolute;
+  pointer-events: none;
+  content: "\e91e";
+  color: var(--IDS-ICON__COLOR);
+  font-size: 4rem;
 }
-header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a:focus {
+header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a,
+header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo ::slotted([slot=logo]) {
+  display: flex;
+  align-items: center;
+  height: 1.5rem;
+  width: 3.938rem;
+}
+header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a:focus,
+header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo ::slotted([slot=logo]):focus {
   outline: var(--IDS-FOCUS__OUTLINE);
   outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
 }
 header.ids-header-1177-admin:not(.ids-header-1177-admin--unresponsive) .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo ::slotted([slot=logo]:focus) {
-  display: block;
   outline: var(--IDS-FOCUS__OUTLINE) !important;
   outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET);
 }
@@ -295,16 +321,40 @@ header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-117
   width: 3.938rem;
   margin-right: 1.25rem;
   margin-left: 1.25rem;
+  display: flex;
+  align-items: center;
+}
+header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo .ids-header-1177-admin__logo-link {
+  position: relative;
+  display: flex;
+  align-items: center;
+  height: 1.5rem;
+  width: 3.938rem;
+  cursor: pointer;
 }
-header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a {
+header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo .ids-header-1177-admin__logo-link:before {
+  font: icon;
+  font-family: "Inera-Design-Icons";
   display: block;
+  position: absolute;
+  pointer-events: none;
+  content: "\e91e";
+  color: var(--IDS-ICON__COLOR);
+  font-size: 4rem;
 }
-header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a:focus {
+header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a,
+header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo ::slotted([slot=logo]) {
+  display: flex;
+  align-items: center;
+  height: 1.5rem;
+  width: 3.938rem;
+}
+header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo a:focus,
+header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo ::slotted([slot=logo]):focus {
   outline: var(--IDS-FOCUS__OUTLINE);
   outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
 }
 header.ids-header-1177-admin.ids-header-1177-admin--unresponsive .ids-header-1177-admin__container .ids-header-1177-admin__inner .ids-header-1177-admin__logo-col .ids-header-1177-admin__logo ::slotted([slot=logo]:focus) {
-  display: block;
   outline: var(--IDS-FOCUS__OUTLINE) !important;
   outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET);
 }

package/components/header-1177-pro/header-1177-pro-avatar-lit.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { css, unsafeCSS } from 'lit';
-var css_248z = "@media (max-width:1023px){.ids-desktop{display:none!important}}@media (min-width:1024px){.ids-mobile{display:none!important}}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit,.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit,:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit,:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--IDS-FONT-FAMILY-BASE);font-size:1rem;max-width:12.5rem;overflow:hidden;position:relative;text-align:start;text-overflow:ellipsis;white-space:nowrap}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar{align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar button{padding:0 .5rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:grid;font:inherit;gap:.75rem;grid-template-columns:auto auto;justify-content:center;outline:inherit;padding:0}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box[aria-expanded=true] .ids-header-1177-pro__avatar-chevron{transform:rotate(180deg)}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;max-height:2.75rem;max-width:2.25rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{grid-column:3;position:relative;width:.75rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron .ids-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded .ids-icon{transform:rotate(180deg)}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar{align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar button{padding:0 .5rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}@media (max-width:1024px){.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar{display:none}}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:grid;font:inherit;gap:.75rem;grid-template-columns:auto auto;justify-content:center;outline:inherit;padding:0}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box[aria-expanded=true] .ids-header-1177-pro__avatar-chevron{transform:rotate(180deg)}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;max-height:2.75rem;max-width:2.25rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{grid-column:3;position:relative;width:.75rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron .ids-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded .ids-icon{transform:rotate(180deg)}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive){align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) button{padding:0 .5rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}@media (max-width:1024px){:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive){display:none}}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:grid;font:inherit;gap:.75rem;grid-template-columns:auto auto;justify-content:center;outline:inherit;padding:0}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box[aria-expanded=true] .ids-header-1177-pro__avatar-chevron{transform:rotate(180deg)}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;max-height:2.75rem;max-width:2.25rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{grid-column:3;position:relative;width:.75rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron .ids-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded .ids-icon{transform:rotate(180deg)}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive).ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive{align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive button{padding:0 .5rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:grid;font:inherit;gap:.75rem;grid-template-columns:auto auto;justify-content:center;outline:inherit;padding:0}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box[aria-expanded=true] .ids-header-1177-pro__avatar-chevron{transform:rotate(180deg)}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;max-height:2.75rem;max-width:2.25rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{grid-column:3;position:relative;width:.75rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron .ids-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded .ids-icon{transform:rotate(180deg)}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive.ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}";
+var css_248z = "@media (max-width:1023px){.ids-desktop{display:none!important}}@media (min-width:1024px){.ids-mobile{display:none!important}}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit,.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit,:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit,:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__name,:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--IDS-FONT-FAMILY-BASE);font-size:1rem;max-width:12.5rem;overflow:hidden;position:relative;text-align:start;text-overflow:ellipsis;white-space:nowrap}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar{align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar button{padding:0 .5rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;gap:.75rem;justify-content:center;margin:0 -.5rem;outline:inherit;padding:0 .5rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;height:1.25rem;width:1.25rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon:before{color:var(--IDS-COLOR-ACCENT-40);content:\"\\e923\";display:block;font:icon;font-family:Inera-Design-Icons;font-size:1.25rem;pointer-events:none;position:absolute}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{height:.75rem;position:relative;width:.75rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron:before{color:var(--IDS-ICON__COLOR);content:\"\\e936\";display:block;font:icon;font-family:Inera-Design-Icons;pointer-events:none;position:absolute}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded:before{content:\"\\e939\"}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}.ids-header-1177-pro--unresponsive .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar{align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar button{padding:0 .5rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}@media (max-width:1024px){.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar{display:none}}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;gap:.75rem;justify-content:center;margin:0 -.5rem;outline:inherit;padding:0 .5rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;height:1.25rem;width:1.25rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon:before{color:var(--IDS-COLOR-ACCENT-40);content:\"\\e923\";display:block;font:icon;font-family:Inera-Design-Icons;font-size:1.25rem;pointer-events:none;position:absolute}@media (min-width:1024px){.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{height:2rem;width:2em}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon:before{font-size:2rem}}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{height:.75rem;position:relative;width:.75rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron:before{color:var(--IDS-ICON__COLOR);content:\"\\e936\";display:block;font:icon;font-family:Inera-Design-Icons;pointer-events:none;position:absolute}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded:before{content:\"\\e939\"}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}.ids-header-1177-pro:not(.ids-header-1177-pro--unresponsive) .ids-header-1177-pro__avatar .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive){align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) button{padding:0 .5rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}@media (max-width:1024px){:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive){display:none}}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;gap:.75rem;justify-content:center;margin:0 -.5rem;outline:inherit;padding:0 .5rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;height:1.25rem;width:1.25rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon:before{color:var(--IDS-COLOR-ACCENT-40);content:\"\\e923\";display:block;font:icon;font-family:Inera-Design-Icons;font-size:1.25rem;pointer-events:none;position:absolute}@media (min-width:1024px){:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{height:2rem;width:2em}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon:before{font-size:2rem}}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{height:.75rem;position:relative;width:.75rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron:before{color:var(--IDS-ICON__COLOR);content:\"\\e936\";display:block;font:icon;font-family:Inera-Design-Icons;pointer-events:none;position:absolute}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded:before{content:\"\\e939\"}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive).ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}:host .ids-header-1177-pro__avatar:not(.ids-header-1177-pro__avatar--unresponsive) .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive{align-items:center;display:flex;justify-self:flex-end;margin-right:1.5rem;padding-left:1.5rem;position:relative}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive button{padding:0 .5rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive button:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:var(--IDS-FOCUS__OUTLINE-OFFSET)!important}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;gap:.75rem;justify-content:center;margin:0 -.5rem;outline:inherit;padding:0 .5rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon{display:flex;height:1.25rem;width:1.25rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-icon:before{color:var(--IDS-COLOR-ACCENT-40);content:\"\\e923\";display:block;font:icon;font-family:Inera-Design-Icons;font-size:1.25rem;pointer-events:none;position:absolute}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron{height:.75rem;position:relative;width:.75rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron:before{color:var(--IDS-ICON__COLOR);content:\"\\e936\";display:block;font:icon;font-family:Inera-Design-Icons;pointer-events:none;position:absolute}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-chevron.ids-header-1177-pro__avatar-chevron--expanded:before{content:\"\\e939\"}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content{display:grid;grid-template-rows:1fr;min-width:6.25rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content:has(.ids-header-1177-pro__avatar-content__unit){grid-template-rows:1fr 1fr}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-box .ids-header-1177-pro__avatar-content .ids-header-1177-pro__avatar-content__unit{font-size:.875rem}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive.ids-header-1177-pro__avatar--expanded .ids-header-1177-pro__avatar-dropdown{display:flex}:host .ids-header-1177-pro__avatar.ids-header-1177-pro__avatar--unresponsive .ids-header-1177-pro__avatar-dropdown{background-color:var(--IDS-COLOR-NEUTRAL-100);box-shadow:0 .125rem .375rem 0 rgba(0,0,0,.3);display:none;flex-direction:column;gap:1.25rem;min-width:17.5rem;padding:2rem 2.5rem;position:absolute;right:0;top:calc(100% + .5rem);z-index:1}";
 var header1177ProAvatarLit = css`${unsafeCSS(css_248z)}`;

package/components/header-1177-pro/header-1177-pro-avatar-mobile-lit.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { css, unsafeCSS } from 'lit';
-var css_248z = ".ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login,:host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__text,:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]){color:var(--IDS-LINK--COLORPRESET-1__COLOR);font-family:var(--IDS-LINK__FONT-FAMILY);font-size:1rem}.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login:focus,.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login:hover,:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]:hover),:host .ids-header-1177-pro__avatar-mobile:focus-within .ids-header-1177-pro__avatar-mobile__text,:host .ids-header-1177-pro__avatar-mobile:hover .ids-header-1177-pro__avatar-mobile__text{color:var(--IDS-LINK--COLORPRESET-1__HOVER-COLOR);text-decoration:underline;text-decoration-color:var(--IDS-LINK--COLORPRESET-1__COLOR)}.ids-header-1177-pro__avatar-mobile{align-items:center;border-bottom:var(--IDS-MOBILE-MENU-ITEM__BORDER-BOTTOM);box-sizing:border-box;display:flex;gap:.5rem;min-height:3rem;padding:.75rem 1.25rem;position:relative}.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login{align-items:center;display:flex;gap:.5rem;height:100%;inset:0;padding-left:1.25rem;position:absolute;text-decoration:none}.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:-.25rem!important}.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user{display:flex;flex:1;flex-direction:column}.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user .ids-header-1177-pro__avatar-mobile__user__username{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--IDS-FONT-FAMILY-BASE);font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem}.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user .ids-header-1177-pro__avatar-mobile__user__unit{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--IDS-FONT-FAMILY-BASE);font-size:.875rem;font-style:normal;font-weight:400;line-height:1.25rem}:host .ids-header-1177-pro__avatar-mobile:not(:has(.ids-header-1177-pro__avatar-mobile__user)):focus-within{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:-.25rem!important}:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=login]){inset:0;opacity:0!important;position:absolute}";
+var css_248z = ".ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link,:host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__login-link,:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]){color:var(--IDS-LINK--COLOR-PRESET-1__COLOR);font-family:var(--IDS-LINK__FONT-FAMILY);font-size:1rem}.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:focus,.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:hover,:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]:hover),:host .ids-header-1177-pro__avatar-mobile:focus-within .ids-header-1177-pro__avatar-mobile__login-link,:host .ids-header-1177-pro__avatar-mobile:hover .ids-header-1177-pro__avatar-mobile__login-link{color:var(--IDS-LINK--COLOR-PRESET-1__HOVER-COLOR);text-decoration:underline;text-decoration-color:var(--IDS-LINK--COLOR-PRESET-1__COLOR)}.ids-header-1177-pro__avatar-mobile{align-items:center;border-bottom:var(--IDS-MOBILE-MENU-ITEM__BORDER-BOTTOM);box-sizing:border-box;display:flex;gap:.5rem;min-height:3rem;padding:.75rem 1.25rem;position:relative}.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link{align-items:center;display:flex;gap:.5rem;height:100%;inset:0;padding-left:1.875rem;position:relative;text-decoration:none}.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:before{content:\"\\e923\";display:block;font:icon;font-family:Inera-Design-Icons;font-size:1.25rem;left:0;pointer-events:none;position:absolute;top:0}.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:focus{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:-.25rem!important}.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in{display:flex;flex:1;flex-direction:column;padding-left:2.5rem;position:relative}.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in:before{color:var(--IDS-COLOR-ACCENT-40);content:\"\\e923\";display:block;font:icon;font-family:Inera-Design-Icons;font-size:1.5rem;left:0;pointer-events:none;position:absolute;top:.625rem}.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in .ids-header-1177-pro__avatar-mobile__username{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--IDS-FONT-FAMILY-BASE);font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem}.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in .ids-header-1177-pro__avatar-mobile__unit{color:var(--IDS-COLOR-NEUTRAL-20);font-family:var(--IDS-FONT-FAMILY-BASE);font-size:.875rem;font-style:normal;font-weight:400;line-height:1.25rem}:host .ids-header-1177-pro__avatar-mobile:not(:has(.ids-header-1177-pro__avatar-mobile__user-logged-in)):focus-within{outline:var(--IDS-FOCUS__OUTLINE);outline-offset:-.25rem!important}:host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__login-link{display:inline-block;padding-left:1.875rem;position:relative}:host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__login-link:before{content:\"\\e923\";display:block;font:icon;font-family:Inera-Design-Icons;font-size:1.25rem;left:0;pointer-events:none;position:absolute;top:0}:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=login]){inset:0;opacity:0!important;position:absolute}";
 var header1177ProAvatarMobileLit = css`${unsafeCSS(css_248z)}`;

package/components/header-1177-pro/header-1177-pro-avatar-mobile.css CHANGED Viewed

@@ -1,4 +1,7 @@
 /*******
+* ICONS
+********/
+/*******
 * BUTTONS
 ********/
 /*******
@@ -10,16 +13,16 @@
 /*******
 * A11Y
 ********/
-:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]), :host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__text, .ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login {
+:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]), :host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__login-link, .ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link {
   font-size: 1rem;
   font-family: var(--IDS-LINK__FONT-FAMILY);
-  color: var(--IDS-LINK--COLORPRESET-1__COLOR);
+  color: var(--IDS-LINK--COLOR-PRESET-1__COLOR);
 }
-:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]:hover), :host .ids-header-1177-pro__avatar-mobile:hover .ids-header-1177-pro__avatar-mobile__text, :host .ids-header-1177-pro__avatar-mobile:focus-within .ids-header-1177-pro__avatar-mobile__text, .ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login:focus, .ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login:hover {
+:host .ids-header-1177-pro__avatar-mobile ::slotted([slot=logout]:hover), :host .ids-header-1177-pro__avatar-mobile:hover .ids-header-1177-pro__avatar-mobile__login-link, :host .ids-header-1177-pro__avatar-mobile:focus-within .ids-header-1177-pro__avatar-mobile__login-link, .ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:focus, .ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:hover {
   text-decoration: underline;
-  text-decoration-color: var(--IDS-LINK--COLORPRESET-1__COLOR);
-  color: var(--IDS-LINK--COLORPRESET-1__HOVER-COLOR);
+  text-decoration-color: var(--IDS-LINK--COLOR-PRESET-1__COLOR);
+  color: var(--IDS-LINK--COLOR-PRESET-1__HOVER-COLOR);
 }
 .ids-header-1177-pro__avatar-mobile {
@@ -32,26 +35,51 @@
   position: relative;
   padding: 0.75rem 1.25rem;
 }
-.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login {
+.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link {
   display: flex;
   gap: 0.5rem;
-  position: absolute;
   inset: 0;
   height: 100%;
   align-items: center;
-  padding-left: 1.25rem;
   text-decoration: none;
+  position: relative;
+  padding-left: 1.875rem;
 }
-.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login:focus {
+.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:before {
+  font: icon;
+  font-family: "Inera-Design-Icons";
+  display: block;
+  position: absolute;
+  pointer-events: none;
+  content: "\e923";
+  font-size: 1.25rem;
+  top: 0;
+  left: 0;
+}
+.ids-header-1177-pro__avatar-mobile a.ids-header-1177-pro__avatar-mobile__login-link:focus {
   outline: var(--IDS-FOCUS__OUTLINE);
   outline-offset: -0.25rem !important;
 }
-.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user {
+.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in {
   display: flex;
   flex-direction: column;
   flex: 1;
+  position: relative;
+  padding-left: 2.5rem;
 }
-.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user .ids-header-1177-pro__avatar-mobile__user__username {
+.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in:before {
+  font: icon;
+  font-family: "Inera-Design-Icons";
+  display: block;
+  position: absolute;
+  pointer-events: none;
+  content: "\e923";
+  font-size: 1.5rem;
+  top: 0.625rem;
+  left: 0;
+  color: var(--IDS-COLOR-ACCENT-40);
+}
+.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in .ids-header-1177-pro__avatar-mobile__username {
   color: var(--IDS-COLOR-NEUTRAL-20);
   font-family: var(--IDS-FONT-FAMILY-BASE);
   font-size: 1rem;
@@ -59,7 +87,7 @@
   font-weight: 400;
   line-height: 1.5rem;
 }
-.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user .ids-header-1177-pro__avatar-mobile__user__unit {
+.ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__user-logged-in .ids-header-1177-pro__avatar-mobile__unit {
   color: var(--IDS-COLOR-NEUTRAL-20);
   font-size: 0.875rem;
   font-family: var(--IDS-FONT-FAMILY-BASE);
@@ -68,10 +96,26 @@
   line-height: 1.25rem;
 }
-:host .ids-header-1177-pro__avatar-mobile:not(:has(.ids-header-1177-pro__avatar-mobile__user)):focus-within {
+:host .ids-header-1177-pro__avatar-mobile:not(:has(.ids-header-1177-pro__avatar-mobile__user-logged-in)):focus-within {
   outline: var(--IDS-FOCUS__OUTLINE);
   outline-offset: -0.25rem !important;
 }
+:host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__login-link {
+  position: relative;
+  display: inline-block;
+  padding-left: 1.875rem;
+}
+:host .ids-header-1177-pro__avatar-mobile .ids-header-1177-pro__avatar-mobile__login-link:before {
+  font: icon;
+  font-family: "Inera-Design-Icons";
+  display: block;
+  position: absolute;
+  pointer-events: none;
+  content: "\e923";
+  font-size: 1.25rem;
+  top: 0;
+  left: 0;
+}
 :host .ids-header-1177-pro__avatar-mobile ::slotted([slot=login]) {
   opacity: 0 !important;
   position: absolute;