npm - @inera/ids-design - Versions diffs - 7.2.2 → 8.0.0 - Mend

@inera/ids-design 7.2.2 → 8.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 (200) hide show

package/components/footer-inera-admin/footer-inera-admin.css CHANGED Viewed

@@ -17,7 +17,7 @@
 * BUTTONS
 ********/
 /*******
-* SCROLLBARS
+* SCROLLBAR
 ********/
 /*******
 * FORM
@@ -25,35 +25,187 @@
 /*******
 * A11Y
 ********/
+:root {
+  --IDS-FONT-FAMILY-BASE: "Open Sans";
+  --IDS-FONT-FAMILY-HEADING: "Inter";
+  --IDS-FONT-COLOR: var(--ids-color-surface-text-on-default);
+  --IDS-HEADING-XXL__COLOR: var(--ids-color-heading-text-xxl);
+  --IDS-HEADING-XXL__FONT-FAMILY: var(--IDS-FONT-FAMILY-HEADING);
+  --IDS-HEADING-XXL__FONT-SIZE: 2rem;
+  --IDS-HEADING-XXL__LINE-HEIGHT: 2.5rem;
+  --IDS-HEADING-XXL__FONT-SIZE-DESKTOP: 3rem;
+  --IDS-HEADING-XXL__LINE-HEIGHT-DESKTOP: 3.25rem;
+  --IDS-HEADING-XXL__FONT-WEIGHT: 700;
+  --IDS-HEADING-XXL__LETTER-SPACING: -0.052rem;
+  --IDS-HEADING-XXL__LETTER-SPACING-DESKTOP: -0.078rem;
+  --IDS-HEADING-XXL__MARGIN-BOTTOM: 1.875rem;
+  --IDS-HEADING-XL__COLOR: var(--ids-color-heading-text-xl);
+  --IDS-HEADING-XL__FONT-FAMILY: var(--IDS-FONT-FAMILY-HEADING);
+  --IDS-HEADING-XL__FONT-SIZE: 1.625rem;
+  --IDS-HEADING-XL__LINE-HEIGHT: 2.125rem;
+  --IDS-HEADING-XL__FONT-SIZE-DESKTOP: 2.25rem;
+  --IDS-HEADING-XL__LINE-HEIGHT-DESKTOP: 2.625rem;
+  --IDS-HEADING-XL__FONT-WEIGHT: 700;
+  --IDS-HEADING-XL__LETTER-SPACING: -0.031rem;
+  --IDS-HEADING-XL__LETTER-SPACING-DESKTOP: -0.063rem;
+  --IDS-HEADING-XL__MARGIN-BOTTOM: 1.875rem;
+  --IDS-HEADING-L__COLOR: var(--ids-color-heading-text-l);
+  --IDS-HEADING-L__FONT-FAMILY: var(--IDS-FONT-FAMILY-HEADING);
+  --IDS-HEADING-L__FONT-SIZE-DESKTOP: 1.75rem;
+  --IDS-HEADING-L__LINE-HEIGHT-DESKTOP: 2.25rem;
+  --IDS-HEADING-L__FONT-SIZE: 1.5rem;
+  --IDS-HEADING-L__LINE-HEIGHT: 1.875rem;
+  --IDS-HEADING-L__FONT-WEIGHT: 700;
+  --IDS-HEADING-L__LETTER-SPACING: -0.025rem;
+  --IDS-HEADING-L__LETTER-SPACING-DESKTOP: -0.044rem;
+  --IDS-HEADING-L__MARGIN-BOTTOM: 1.875rem;
+  --IDS-HEADING-M__COLOR: var(--ids-color-heading-text-m);
+  --IDS-HEADING-M__FONT-FAMILY: var(--IDS-FONT-FAMILY-HEADING);
+  --IDS-HEADING-M__FONT-SIZE: 1.375rem;
+  --IDS-HEADING-M__LINE-HEIGHT: 1.75rem;
+  --IDS-HEADING-M__FONT-SIZE-DESKTOP: 1.5rem;
+  --IDS-HEADING-M__LINE-HEIGHT-DESKTOP: 1.875rem;
+  --IDS-HEADING-M__FONT-WEIGHT: 700;
+  --IDS-HEADING-M__LETTER-SPACING: -0.019rem;
+  --IDS-HEADING-M__LETTER-SPACING-DESKTOP: -0.031rem;
+  --IDS-HEADING-S__COLOR: var(--ids-color-heading-text-s);
+  --IDS-HEADING-S__FONT-FAMILY: var(--IDS-FONT-FAMILY-HEADING);
+  --IDS-HEADING-S__FONT-SIZE: 1.25rem;
+  --IDS-HEADING-S__LINE-HEIGHT: 1.5rem;
+  --IDS-HEADING-S__FONT-SIZE-DESKTOP: 1.25rem;
+  --IDS-HEADING-S__LINE-HEIGHT-DESKTOP: 1.5rem;
+  --IDS-HEADING-S__FONT-WEIGHT: 700;
+  --IDS-HEADING-S__LETTER-SPACING: -0.013rem;
+  --IDS-HEADING-S__LETTER-SPACING-DESKTOP: -0.025rem;
+  --IDS-HEADING-XS__COLOR: var(--ids-color-heading-text-xs);
+  --IDS-HEADING-XS__FONT-FAMILY: var(--IDS-FONT-FAMILY-HEADING);
+  --IDS-HEADING-XS__FONT-SIZE: 1rem;
+  --IDS-HEADING-XS__LINE-HEIGHT: 1.25rem;
+  --IDS-HEADING-XS__FONT-WEIGHT: 700;
+  --IDS-HEADING-XS__LETTER-SPACING: 0;
+  --IDS-ANCHOR__COLOR: var(--ids-color-interactive-text-default);
+  --IDS-ANCHOR__HOVER-COLOR: var(--ids-color-interactive-text-hover);
+  --IDS-PREAMBLE__FONT-FAMILY: var(--IDS-FONT-FAMILY-BASE);
+  --IDS-PREAMBLE__FONT-SIZE: 1.125rem;
+  --IDS-PREAMBLE__LINE-HEIGHT: 1.75rem;
+  --IDS-PREAMBLE__FONT-SIZE-DESKTOP: 1.375rem;
+  --IDS-PREAMBLE__LINE-HEIGHT-DESKTOP: 2.25rem;
+  --IDS-BODY__FONT-FAMILY: var(--IDS-FONT-FAMILY-BASE);
+  --IDS-BODY__FONT-SIZE: 1rem;
+  --IDS-BODY__LINE-HEIGHT: 1.5rem;
+  --IDS-BODY--DISABLED__COLOR: var(--ids-color-interactive-text-disabled);
+  --IDS-PAGE-LIST__COLOR: var(--ids-color-brand-text-primary);
+  --IDS-PAGE-LIST__FONT-FAMILY: var(--IDS-FONT-FAMILY-HEADING);
+  --IDS-PAGE-LIST__FONT-SIZE: 1.25rem;
+  --IDS-PAGE-LIST__LINE-HEIGHT: 1.5rem;
+  --IDS-PAGE-LIST__FONT-WEIGHT: 700;
+  --IDS-PAGE-LIST__LETTER-SPACING: -0.025rem;
+  --IDS-BULLET-LIST__MARKER-COLOR: var(--ids-color-brand-text-primary);
+  --IDS-BULLET-LIST__MARKER-FONT-WEIGHT: bold;
+  --IDS-BULLET-LIST__LINE-HEIGHT: 1.5rem;
+  --IDS-DIVIDER__COLOR: var(--ids-color-surface-border-default);
+}
+:root.ids--1177-pro, :root.ids--1177-admin {
+  --IDS-PAGE-LIST__COLOR: var(--ids-color-interactive-text-default);
+}
+:root.ids--inera, :root.ids--inera-admin {
+  --IDS-FONT-FAMILY-BASE: "Open Sans";
+  --IDS-FONT-FAMILY-HEADING: "Poppins";
+  --IDS-HEADING-XXL__FONT-SIZE: 1.875rem;
+  --IDS-HEADING-XXL__LINE-HEIGHT: 2.375rem;
+  --IDS-HEADING-XXL__FONT-SIZE-DESKTOP: 2.5rem;
+  --IDS-HEADING-XXL__LINE-HEIGHT-DESKTOP: 3.125rem;
+  --IDS-HEADING-XXL__FONT-WEIGHT: 600;
+  --IDS-HEADING-XXL__LETTER-SPACING: inherit;
+  --IDS-HEADING-XXL__LETTER-SPACING-DESKTOP: inherit;
+  --IDS-HEADING-XXL__MARGIN-BOTTOM: 1.25rem;
+  --IDS-HEADING-XL__FONT-SIZE: 1.625rem;
+  --IDS-HEADING-XL__LINE-HEIGHT: 2rem;
+  --IDS-HEADING-XL__FONT-SIZE-DESKTOP: 2rem;
+  --IDS-HEADING-XL__LINE-HEIGHT-DESKTOP: 2.5rem;
+  --IDS-HEADING-XL__FONT-WEIGHT: 600;
+  --IDS-HEADING-XL__LETTER-SPACING: inherit;
+  --IDS-HEADING-XL__LETTER-SPACING-DESKTOP: inherit;
+  --IDS-HEADING-XL__MARGIN-BOTTOM: 1.25rem;
+  --IDS-HEADING-L__FONT-SIZE: 1.5rem;
+  --IDS-HEADING-L__LINE-HEIGHT: 1.875rem;
+  --IDS-HEADING-L__FONT-SIZE-DESKTOP: 1.75rem;
+  --IDS-HEADING-L__LINE-HEIGHT-DESKTOP: 2.25rem;
+  --IDS-HEADING-L__FONT-WEIGHT: 600;
+  --IDS-HEADING-L__LETTER-SPACING: inherit;
+  --IDS-HEADING-L__LETTER-SPACING-DESKTOP: inherit;
+  --IDS-HEADING-L__MARGIN-BOTTOM: 1.25rem;
+  --IDS-HEADING-M__FONT-SIZE: 1.375rem;
+  --IDS-HEADING-M__LINE-HEIGHT: 1.75rem;
+  --IDS-HEADING-M__FONT-SIZE-DESKTOP: 1.5rem;
+  --IDS-HEADING-M__LINE-HEIGHT-DESKTOP: 2rem;
+  --IDS-HEADING-M__FONT-WEIGHT: 600;
+  --IDS-HEADING-M__LETTER-SPACING: inherit;
+  --IDS-HEADING-M__LETTER-SPACING-DESKTOP: inherit;
+  --IDS-HEADING-S__FONT-SIZE: 1.25rem;
+  --IDS-HEADING-S__LINE-HEIGHT: 1.5rem;
+  --IDS-HEADING-S__FONT-SIZE-DESKTOP: 1.25rem;
+  --IDS-HEADING-S__LINE-HEIGHT-DESKTOP: 1.625rem;
+  --IDS-HEADING-S__FONT-WEIGHT: 600;
+  --IDS-HEADING-S__LETTER-SPACING: inherit;
+  --IDS-HEADING-S__LETTER-SPACING-DESKTOP: inherit;
+  --IDS-HEADING-XS__FONT-SIZE: 1rem;
+  --IDS-HEADING-XS__LINE-HEIGHT: 1.25rem;
+  --IDS-HEADING-XS__FONT-WEIGHT: 600;
+  --IDS-HEADING-XS__LETTER-SPACING: inherit;
+  --IDS-BODY__LINE-HEIGHT: 1.625rem;
+  --IDS-BODY--DISABLED__COLOR: var(--ids-color-interactive-text-disabled);
+  --IDS-PAGE-LIST__FONT-WEIGHT: 600;
+  --IDS-PAGE-LIST__LETTER-SPACING: 0;
+  --IDS-BULLET-LIST__MARKER-FONT-WEIGHT: normal;
+  --IDS-BULLET-LIST__LINE-HEIGHT: 1.625rem;
+  --IDS-DESCRIPTION-LIST__TERM-FONT-WEIGHT: 600;
+}
+:root.ids--dark {
+  --IDS-PAGE-LIST__COLOR: var(--ids-color-navigation-text-default);
+}
+:root.ids--dark.ids--1177-pro, :root.ids--dark.ids--1177-admin, :root.ids--dark.ids--inera, :root.ids--dark.ids--inera-admin {
+  --IDS-PAGE-LIST__COLOR: var(--ids-color-interactive-text-default);
+}
 .ids-footer-inera-admin {
-  background-color: var(--IDS-COLOR-SECONDARY-90);
+  background-color: var(--IDS-FOOTER-INERA-ADMIN__BACKGROUND-COLOR);
   position: relative;
 }
+.ids-footer-inera-admin .ids-footer-inera-admin__inner-wrapper {
+  background-image: var(--IDS-FOOTER-INERA-ADMIN-INNER__AFTER);
+  background-position-x: calc(50% - 14.063rem);
+  background-repeat: no-repeat;
+}
+@media (max-width: 1024px) {
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner-wrapper {
+    background-position-x: calc(100% - 1.25rem);
+  }
+}
 .ids-footer-inera-admin .ids-footer-inera-admin__inner {
   max-width: var(--IDS__MAX-WIDTH);
-  margin-left: auto;
-  margin-right: auto;
-  padding-left: 1.25rem;
-  padding-right: 1.25rem;
-  padding-bottom: 3.125rem;
-  padding-top: 4.375rem;
+  padding: var(--IDS__CONTAINER-PADDING);
+  padding-top: 1.875rem;
+  padding-bottom: 6.25rem;
+  margin: 0 auto;
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__headline-row {
+@media (max-width: 1024px) {
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner {
+    padding-bottom: 2.5rem;
+  }
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__headline-wrapper {
   padding-bottom: 1.25rem;
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__headline-row .ids-footer-inera-admin__headline {
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__headline-wrapper .ids-footer-inera-admin__headline {
   display: inline;
-  font-size: 1.625rem;
-  line-height: 2rem;
+  font-size: 1.75rem;
+  line-height: 2.25rem;
   font-weight: bold;
   font-family: var(--IDS-FONT-FAMILY-HEADING);
-  letter-spacing: -0.031rem;
-  color: var(--IDS-COLOR-PRIMARY-40);
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__headline-row .ids-footer-inera-admin__headline .ids-footer-inera-admin__headline--sub {
-  color: var(--IDS-COLOR-PRIMARY-40);
+  color: var(--IDS-FOOTER-INERA-ADMIN-HEADLINE__COLOR);
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__headline-row .ids-footer-inera-admin__headline--sr {
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__headline-wrapper .ids-footer-inera-admin__headline--sr {
   position: absolute;
   width: 0.063rem;
   height: 0.063rem;
@@ -66,20 +218,18 @@
 }
 .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content {
   display: flex;
-  flex-wrap: wrap;
-  gap: 0.5rem;
+  gap: 6.5rem;
 }
 .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__text {
   font-style: normal;
-  color: var(--IDS-COLOR-NEUTRAL-20);
+  color: var(--IDS-FOOTER-INERA-ADMIN__COLOR);
   font-family: var(--IDS-BODY__FONT-FAMILY);
   font-size: var(--IDS-BODY__FONT-SIZE);
   line-height: var(--IDS-BODY__LINE-HEIGHT);
   font-weight: 400;
   letter-spacing: 0;
-  flex: 0 0 38%;
-  max-width: 38%;
-  margin-right: 8.3%;
+  flex: 0 0 40%;
+  max-width: 40%;
 }
 @media (max-width: 1024px) {
   .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__text {
@@ -88,25 +238,40 @@
     margin-right: 0;
   }
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content ::slotted([slot=link-col-1]),
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content ::slotted([slot=link-col-2]),
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content ::slotted([slot=link-col-3]) {
-  display: block;
-  margin-bottom: 0.625rem !important;
-  color: var(--IDS-COLOR-NEUTRAL-20) !important;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col {
-  flex: 0 0 16%;
-  max-width: 16%;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ul {
-  margin: 0;
-  list-style: none;
-  padding: 0;
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__cols {
+  display: flex;
+  flex-grow: 1;
+  gap: 3.5rem;
+  justify-content: space-between;
 }
 .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col .ids-link {
   margin-bottom: 0.625rem !important;
-  color: var(--IDS-COLOR-NEUTRAL-20) !important;
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col h2,
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col h3,
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col h4,
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted(h2),
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted(h3),
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted(h4) {
+  font-style: normal;
+  color: var(--IDS-FOOTER-INERA-ADMIN__COLOR);
+  font-family: var(--IDS-HEADING-S__FONT-FAMILY);
+  font-size: var(--IDS-HEADING-S__FONT-SIZE);
+  line-height: var(--IDS-HEADING-S__LINE-HEIGHT);
+  letter-spacing: var(--IDS-HEADING-S__LETTER-SPACING);
+  font-weight: var(--IDS-HEADING-S__FONT-WEIGHT);
+}
+@media (min-width: 1024px) {
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col h2,
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col h3,
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col h4,
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted(h2),
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted(h3),
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted(h4) {
+    font-size: var(--IDS-HEADING-S__FONT-SIZE-DESKTOP);
+    line-height: var(--IDS-HEADING-S__LINE-HEIGHT-DESKTOP);
+    letter-spacing: var(--IDS-HEADING-S__LETTER-SPACING-DESKTOP);
+  }
 }
 .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted([slot=link-col-1]),
 .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col ::slotted([slot=link-col-2]),
@@ -114,41 +279,14 @@
   display: block;
   margin-bottom: 0.625rem !important;
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__link-col--1 {
-  flex: 0 0 50%;
-  max-width: 50%;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__link-col--2 {
-  flex: 0 0 25%;
-  max-width: 25%;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__col-size-auto {
-  flex: 0 0 auto;
-  width: auto;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__col-size-1 {
-  flex: 0 0 8.3%;
-  max-width: 8.3%;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__col-size-2 {
-  flex: 0 0 16%;
-  max-width: 16%;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__col-size-3 {
-  flex: 0 0 25%;
-  max-width: 25%;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__col-size-4 {
-  flex: 0 0 33.3%;
-  max-width: 33.3%;
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__link-col--100 {
+  width: 100%;
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__col-size-5 {
-  flex: 0 0 41.6%;
-  max-width: 41.6%;
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__link-col--50 {
+  width: 50%;
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__col-size-6 {
-  flex: 0 0 50%;
-  max-width: 50%;
+.ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col.ids-footer-inera-admin__link-col--33 {
+  width: 33%;
 }
 @media (max-width: 1024px) {
   .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content .ids-footer-inera-admin__link-col {
@@ -156,100 +294,125 @@
   }
 }
 @media (max-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__inner {
-    padding-bottom: 5.313rem;
+  .ids-footer-inera-admin .ids-footer-inera-admin__inner .ids-footer-inera-admin__content {
+    gap: 0;
+  }
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__mobile-menu {
+  display: none;
+  position: relative;
+}
+@media (max-width: 1024px) {
+  .ids-footer-inera-admin .ids-footer-inera-admin__mobile-menu {
+    display: block;
+    padding-bottom: 6.25rem;
+  }
+  .ids-footer-inera-admin .ids-footer-inera-admin__mobile-menu::after {
+    content: "";
+    display: block;
+    position: absolute;
+    width: 9.625rem;
+    height: 4.813rem;
+    left: 1.25rem;
+    bottom: 0;
+    background-repeat: no-repeat;
+    background-image: var(--IDS-FOOTER-INERA-ADMIN-MOBILE__AFTER);
   }
 }
 .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer {
   position: relative;
-  background-color: var(--IDS-COLOR-PRIMARY-30);
+  background-color: var(--IDS-FOOTER-INERA-ADMIN-SUB__BACKGROUND-COLOR);
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__mobile-menu {
-  display: none;
+@media (max-width: 1024px) {
+  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer {
+    border-top: none;
+  }
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer::after {
+  content: "";
+  display: block;
+  position: absolute;
+  width: 15.625rem;
+  height: 6.25rem;
+  left: calc(50% - 15.625rem);
+  top: -5.125rem;
+  background-repeat: no-repeat;
+  background-image: var(--IDS-FOOTER-INERA-ADMIN-SUB__AFTER);
 }
 @media (max-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__mobile-menu {
-    display: block;
+  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer::after {
+    content: none;
   }
 }
 .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container {
   max-width: var(--IDS__MAX-WIDTH);
-  margin-left: auto;
-  margin-right: auto;
-  padding-left: 1.25rem;
-  padding-right: 1.25rem;
+  padding: var(--IDS__CONTAINER-PADDING);
+  padding-top: 1.25rem;
+  padding-bottom: 1.25rem;
+  margin: 0 auto;
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin_sub-footer-mobile-text {
-  color: var(--IDS-COLOR-NEUTRAL-100);
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-INERA_sub-footer-mobile-text {
+  color: var(--IDS-FOOTER-INERA-ADMIN-SUB__COLOR);
   padding: 1.875rem 2.5rem 0.625rem;
   font-size: 0.875rem;
   text-align: center;
   line-height: 1.25rem;
   display: inline-block;
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row {
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  gap: 1rem;
 }
 @media (max-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row {
+  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner {
     align-items: unset;
     flex-direction: column;
   }
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row .ids-footer-inera-admin__sub-footer-left {
-  flex: 50%;
-  font-size: 0.875rem !important;
-  line-height: 1.125rem !important;
-  color: var(--IDS-COLOR-NEUTRAL-100) !important;
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-left {
+  flex: 60%;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.25rem 3rem;
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-left ::slotted(*),
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-left .ids-link {
+  display: block !important;
+  white-space: nowrap;
 }
 @media (max-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row .ids-footer-inera-admin__sub-footer-left {
+  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-left {
     display: none;
   }
 }
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row .ids-footer-inera-admin__sub-footer-right {
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-right,
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-right p {
   flex: auto;
-  flex-wrap: wrap;
-  display: flex;
-  gap: 0.25rem 1rem;
-  justify-content: end;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row .ids-footer-inera-admin__sub-footer-right ::slotted(*),
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row .ids-footer-inera-admin__sub-footer-right a {
+  text-align: end;
   font-size: 0.875rem !important;
-  color: var(--IDS-COLOR-NEUTRAL-100);
-  display: block !important;
-  white-space: nowrap;
+  line-height: 1.125rem !important;
+  color: var(--IDS-FOOTER-INERA-ADMIN-SUB__COLOR) !important;
 }
 @media (max-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-row .ids-footer-inera-admin__sub-footer-right {
+  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-right,
+  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container .ids-footer-inera-admin__sub-footer-inner .ids-footer-inera-admin__sub-footer-right p {
     display: none;
   }
 }
 @media (max-width: 1024px) {
   .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer-container {
     height: auto;
-    padding-left: 0;
-    padding-right: 0;
+    padding: 0;
   }
 }
-@media (min-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer {
-    background-color: var(--IDS-COLOR-PRIMARY-40);
-    padding-bottom: 0.625rem;
-    padding-top: 0.625rem;
-  }
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__content-row {
-  z-index: 1;
-}
 .ids-footer-inera-admin .ids-footer-inera-admin__mobile-links {
+  background-color: var(--IDS-FOOTER-INERA-ADMIN-SUB__BACKGROUND-COLOR);
   display: none;
   font-size: 0.875rem;
-  padding: 2rem 1.25rem;
+  padding-top: 2rem;
+  padding-left: 1.25rem;
+  padding-right: 1.25rem;
   gap: 2rem;
   flex-direction: column;
 }
@@ -264,7 +427,57 @@
   }
 }
 .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile {
+  background-color: var(--IDS-FOOTER-INERA-ADMIN-SUB__BACKGROUND-COLOR);
   display: none;
+  padding-bottom: 1.25rem;
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile .ids-footer-inera-admin__sub-footer-mobile-headline-wrapper {
+  display: flex;
+  width: 100%;
+  align-content: center;
+  justify-content: center;
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile .ids-footer-inera-admin__sub-footer-mobile-logo {
+  position: relative;
+  display: flex;
+  width: 112px;
+  height: 2.125rem;
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile .ids-footer-inera-admin__sub-footer-mobile-logo:before {
+  font: icon;
+  font-family: "Inera-Design-Icons" !important;
+  display: block;
+  position: absolute;
+  pointer-events: none;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  content: "\e91e";
+  color: var(--IDS-FOOTER-INERA-ADMIN-SUB__COLOR);
+  font-size: 5.625rem;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  left: 0;
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile .ids-footer-inera-admin__sub-footer-mobile-logo:after {
+  content: "";
+  position: absolute;
+  z-index: 1;
+  right: 0.75rem;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 0.0313rem;
+  min-height: 2rem;
+  background-color: var(--IDS-FOOTER-INERA-ADMIN-SUB__COLOR);
+}
+.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile .ids-footer-inera-admin__sub-footer-mobile-headline {
+  display: flex;
+  font-size: 1rem;
+  font-style: normal;
+  font-weight: 700;
+  line-height: normal;
+  letter-spacing: -0.0159rem;
+  align-self: center;
 }
 @media (max-width: 1024px) {
   .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile {
@@ -272,78 +485,16 @@
     justify-content: center;
     align-items: center;
     flex-direction: column;
-    padding-bottom: 1rem;
-    padding-top: 1rem;
-    color: var(--IDS-COLOR-NEUTRAL-100);
+    padding-left: 1.5rem;
+    padding-right: 1.5rem;
+    padding-bottom: 2.5rem;
+    padding-top: 2rem;
+    color: var(--IDS-FOOTER-INERA-ADMIN-SUB__COLOR);
     font-size: 0.875rem;
     text-align: center;
     line-height: 1.25rem;
-    padding-left: 2.5rem;
-    padding-right: 2.5rem;
   }
   .ids-footer-inera-admin .ids-footer-inera-admin__sub-footer-mobile .ids-footer-inera-admin__sub-footer-mobile-text {
-    margin-top: 1.875rem;
-  }
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner-wrapper {
-  position: relative;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='69' viewBox='0 0 140 69' fill='none'%3E%3Cpath d='M0 0C0 37.6907 31.34 68.2449 70 68.2449C108.66 68.2449 140 37.6907 140 0H95.9677C95.9677 13.9821 84.3417 25.3166 70 25.3166C55.6583 25.3166 44.0323 13.9821 44.0323 0H0Z' fill='white'/%3E%3C/svg%3E");
-  background-position-x: calc(100% - 1.25rem);
-  background-repeat: no-repeat;
-}
-@media (min-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__inner-wrapper {
-    background-position-x: calc(50% - 14.063rem);
-  }
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__inner-wrapper::before {
-  content: "";
-  display: block;
-  position: absolute;
-  width: 11.25rem;
-  height: 5.125rem;
-  left: calc(50% - 11.25rem);
-  top: calc(100% - 5.125rem);
-  background-repeat: no-repeat;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='82' viewBox='0 0 180 82' fill='none'%3E%3Cpath d='M0 81.6913C0.209931 36.677 40.4238 0.244873 90 0.244873C139.576 0.244873 179.79 36.677 180 81.6913H123.385C123.176 65.0951 108.309 51.7001 90 51.7001C71.6905 51.7001 56.8235 65.0951 56.6148 81.6913H0Z' fill='white'/%3E%3C/svg%3E");
-}
-@media (max-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__inner-wrapper::before {
-    content: none;
-  }
-}
-.ids-footer-inera-admin .sub-footer-container::after {
-  content: none;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer {
-  background-color: var(--IDS-COLOR-PRIMARY-40);
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .sub-footer-container {
-  min-height: 2.5rem;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__sub-footer .ids-footer-inera-admin__sub-footer__mobile-text {
-  color: var(--IDS-COLOR-NEUTRAL-100);
-  padding: 1.875rem 2.5rem 0.625rem 2.5rem;
-  font-size: 0.875rem;
-  text-align: center;
-  line-height: 1.25rem;
-  display: inline-block;
-}
-.ids-footer-inera-admin .ids-footer-inera-admin__mobile-menu {
-  padding-bottom: 6.25rem;
-  background-color: var(--IDS-COLOR-SECONDARY-90);
-  position: relative;
-}
-@media (max-width: 1024px) {
-  .ids-footer-inera-admin .ids-footer-inera-admin__mobile-menu::after {
-    content: "";
-    display: block;
-    position: absolute;
-    width: 9.625rem;
-    height: 4.875rem;
-    left: 1.5rem;
-    bottom: 0;
-    background-repeat: no-repeat;
-    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='154' height='78' viewBox='0 0 154 78' fill='none'%3E%3Cpath d='M154 77.7737C154 77.7522 154 77.7307 154 77.7092C154 35.2188 119.526 0.773669 77 0.773673C34.474 0.773677 -3.72026e-06 35.2188 -5.63531e-09 77.7092C-3.7567e-09 77.7307 1.52569e-05 77.7522 3.05176e-05 77.7737L48.4356 77.7737C48.4355 77.7522 48.4355 77.7307 48.4355 77.7092C48.4355 61.9466 61.2241 49.1686 77 49.1686C92.7758 49.1686 105.565 61.9466 105.565 77.7092C105.565 77.7307 105.564 77.7522 105.564 77.7737L154 77.7737Z' fill='%23fff'/%3E%3C/svg%3E");
+    margin-top: 2rem;
   }
 }

package/components/form/error-message/error-message-lit.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { css, unsafeCSS } from 'lit';
-var css_248z = ".ids-error-message{align-items:center;background-color:var(--IDS-ERROR-MESSAGE__BACKGROUND-COLOR);border:var(--IDS-ERROR-MESSAGE__BORDER);border-radius:var(--IDS-BORDER-RADIUS);color:var(--IDS-ERROR-MESSAGE__COLOR);display:none;gap:.5rem;margin-bottom:.25rem;margin-top:.75rem;padding:var(--IDS-ERROR-MESSAGE__PADDING);position:relative}.ids-error-message.ids-error-message--show{display:inline-flex;width:fit-content}.ids-error-message:after,.ids-error-message:before{content:\"\";display:block;height:.75rem;left:2.563rem;position:absolute;transform:rotate(45deg);width:.75rem;z-index:9}.ids-error-message:after{background-color:var(--IDS-COLOR-NEUTRAL-100);top:-.375rem}.ids-error-message:before{background-color:var(--IDS-ERROR-MESSAGE__BORDER-COLOR);top:-.438rem}.ids-error-message .ids-error-message__text{padding-left:1.75rem;position:relative}.ids-error-message .ids-error-message__text:before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--IDS-ICON--INVALID-COLOR);content:\"\\e913\";display:block;font:icon;font-family:Inera-Design-Icons!important;font-size:1.25rem;left:0;pointer-events:none;position:absolute;top:0}";
+var css_248z = ".ids-error-message{align-items:center;background-color:var(--IDS-ERROR-MESSAGE__BACKGROUND-COLOR);border:var(--IDS-ERROR-MESSAGE__BORDER-THICKNESS) solid var(--IDS-ERROR-MESSAGE__BORDER-COLOR);border-radius:var(--IDS-BORDER-RADIUS);color:var(--IDS-ERROR-MESSAGE__COLOR);display:none;gap:.5rem;margin-bottom:.25rem;margin-top:.75rem;padding:var(--IDS-ERROR-MESSAGE__PADDING);position:relative}.ids-error-message.ids-error-message--show{display:inline-flex;width:fit-content}.ids-error-message:after,.ids-error-message:before{content:\"\";display:block;height:.75rem;left:2.563rem;position:absolute;transform:rotate(45deg);width:.75rem;z-index:9}.ids-error-message:after{background-color:var(--IDS-ERROR-MESSAGE__BACKGROUND-COLOR);top:-.3rem}.ids-error-message:before{background-color:var(--IDS-ERROR-MESSAGE__BORDER-COLOR);top:var(--IDS-ERROR-MESSAGE__BEFORE-TOP)}.ids-error-message .ids-error-message__text{font-family:var(--IDS-FONT-FAMILY-BASE);font-size:1rem;line-height:1.5rem;min-height:1.5rem;padding-left:1.75rem;position:relative}.ids-error-message .ids-error-message__text:before{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--IDS-ERROR-MESSAGE__COLOR);content:\"\\e913\";display:block;font:icon;font-family:Inera-Design-Icons!important;font-size:1.25rem;left:0;pointer-events:none;position:absolute;top:0}";
 var errorMessageLit = css`${unsafeCSS(css_248z)}`;