@inera/ids-design 6.0.3 → 6.2.0

package/global/global.css

@@ -2373,11 +2373,20 @@
   font-size: 0.875rem;
 }
 .ids-link.ids-link--small.ids-link--start-icon {
-  padding-left: 1.25rem;
+  padding-left: 1.125rem;
+}
+.ids-link.ids-link--small.ids-link--start-icon:before {
+  font-size: 0.875rem;
 }
 .ids-link.ids-link--small.ids-link--end-icon {
   padding-right: 1.125rem;
 }
+.ids-link.ids-link--small.ids-link--end-icon:before {
+  font-size: 0.875rem;
+}
+.ids-link.ids-link--large {
+  text-decoration: none !important;
+}
 .ids-link.ids-link--large.ids-link--start-icon, .ids-link.ids-link--large.ids-link--end-icon {
   padding-left: 1.75rem;
 }
@@ -2385,6 +2394,9 @@
   font-size: 1.25rem;
   top: 0.0625rem !important;
 }
+.ids-link.ids-link--large:hover {
+  text-decoration: none !important;
+}
 .ids-link.ids-link--block {
   display: flex;
   flex-grow: 1;
@@ -2422,6 +2434,12 @@
 .ids-link.ids-link--underlined:has(.ids-icon), .ids-link.ids-link--underlined.ids-link--start-icon, .ids-link.ids-link--underlined.ids-link--end-icon {
   text-decoration: underline !important;
 }
+.ids-link.ids-link--no-underline {
+  text-decoration: none !important;
+}
+.ids-link.ids-link--no-underline:has(.ids-icon), .ids-link.ids-link--no-underline.ids-link--start-icon, .ids-link.ids-link--no-underline.ids-link--end-icon {
+  text-decoration: none !important;
+}
 .ids-link.ids-link--active-icon {
   text-decoration: none !important;
 }
@@ -2606,10 +2624,21 @@
   -moz-user-select: none;
   -ms-user-select: none;
 }
-.ids .ids-button:hover, .ids .ids-button.ids-button--active,
+.ids .ids-button [class*=" ids-icon-"],
+.ids-button [class*=" ids-icon-"],
+.ids button.ids-button [class*=" ids-icon-"] {
+  font-size: 1.125rem;
+}
+.ids .ids-button:hover,
 .ids-button:hover,
+.ids button.ids-button:hover {
+  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
+  box-shadow: var(--IDS-BUTTON--ACTIVE__BOX-SHADOW);
+}
+.ids .ids-button:active, .ids .ids-button.ids-button--active,
+.ids-button:active,
 .ids-button.ids-button--active,
-.ids button.ids-button:hover,
+.ids button.ids-button:active,
 .ids button.ids-button.ids-button--active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   box-shadow: var(--IDS-BUTTON--ACTIVE__BOX-SHADOW);
@@ -2617,14 +2646,8 @@
 .ids .ids-button:focus,
 .ids-button:focus,
 .ids button.ids-button:focus {
-  outline: var(--IDS-FOCUS__OUTLINE);
-  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
-}
-.ids .ids-button:active,
-.ids-button:active,
-.ids button.ids-button:active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
-  box-shadow: var(--IDS-BUTTON--ACTIVE__BOX-SHADOW);
+  border-radius: var(--IDS-BUTTON__BORDER-RADIUS);
   outline: var(--IDS-FOCUS__OUTLINE);
   outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
 }
@@ -2674,28 +2697,21 @@
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   color: var(--IDS-COLOR-NEUTRAL-100);
   border: 0.063rem solid var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
-  outline: var(--IDS-FOCUS__OUTLINE);
-  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
 }
-.ids .ids-button.ids-button--secondary:hover, .ids .ids-button.ids-button--secondary.ids-button--active,
-.ids-button.ids-button--secondary:hover,
+.ids .ids-button.ids-button--secondary.ids-button--active, .ids .ids-button.ids-button--secondary:active,
 .ids-button.ids-button--secondary.ids-button--active,
-.ids button.ids-button.ids-button--secondary:hover,
-.ids button.ids-button.ids-button--secondary.ids-button--active {
+.ids-button.ids-button--secondary:active,
+.ids button.ids-button.ids-button--secondary.ids-button--active,
+.ids button.ids-button.ids-button--secondary:active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   color: var(--IDS-COLOR-NEUTRAL-100);
 }
 .ids .ids-button.ids-button--secondary:focus,
 .ids-button.ids-button--secondary:focus,
 .ids button.ids-button.ids-button--secondary:focus {
-  outline: var(--IDS-FOCUS__OUTLINE);
-  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
-}
-.ids .ids-button.ids-button--secondary:active,
-.ids-button.ids-button--secondary:active,
-.ids button.ids-button.ids-button--secondary:active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   color: var(--IDS-COLOR-NEUTRAL-100);
+  border-radius: var(--IDS-BUTTON__BORDER-RADIUS);
   outline: var(--IDS-FOCUS__OUTLINE);
   outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
 }
@@ -2709,6 +2725,7 @@
   box-shadow: none;
   font-family: var(--IDS-FONT-FAMILY-HEADING);
   text-decoration: underline;
+  text-underline-offset: 0.125rem;
 }
 .ids .ids-button.ids-button--tertiary.ids-button--s,
 .ids-button.ids-button--tertiary.ids-button--s,
@@ -2722,10 +2739,18 @@
   line-height: var(--IDS-BUTTON--L__LINE-HEIGHT);
   padding: var(--IDS-BUTTON--L__PADDING);
 }
-.ids .ids-button.ids-button--tertiary:hover, .ids .ids-button.ids-button--tertiary.ids-button--active,
+.ids .ids-button.ids-button--tertiary:hover,
 .ids-button.ids-button--tertiary:hover,
+.ids button.ids-button.ids-button--tertiary:hover {
+  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
+  color: var(--IDS-COLOR-NEUTRAL-100);
+  border-radius: var(--IDS-BUTTON__BORDER-RADIUS);
+  border: 0.063rem solid var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
+}
+.ids .ids-button.ids-button--tertiary:active, .ids .ids-button.ids-button--tertiary.ids-button--active,
+.ids-button.ids-button--tertiary:active,
 .ids-button.ids-button--tertiary.ids-button--active,
-.ids button.ids-button.ids-button--tertiary:hover,
+.ids button.ids-button.ids-button--tertiary:active,
 .ids button.ids-button.ids-button--tertiary.ids-button--active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   color: var(--IDS-COLOR-NEUTRAL-100);
@@ -2735,12 +2760,6 @@
 .ids .ids-button.ids-button--tertiary:focus,
 .ids-button.ids-button--tertiary:focus,
 .ids button.ids-button.ids-button--tertiary:focus {
-  outline: var(--IDS-FOCUS__OUTLINE);
-  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
-}
-.ids .ids-button.ids-button--tertiary:active,
-.ids-button.ids-button--tertiary:active,
-.ids button.ids-button.ids-button--tertiary:active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   color: var(--IDS-COLOR-NEUTRAL-100);
   border-radius: var(--IDS-BUTTON__BORDER-RADIUS);
@@ -2758,11 +2777,6 @@
   color: var(--IDS-BUTTON--DISABLED__COLOR);
   text-decoration: none;
 }
-.ids .ids-button [class^=ids-icon-],
-.ids-button [class^=ids-icon-],
-.ids button.ids-button [class^=ids-icon-] {
-  font-size: 1.125rem;
-}
 .ids .ids-button.ids-button--icon, .ids .ids-button.ids-button--fab,
 .ids-button.ids-button--icon,
 .ids-button.ids-button--fab,
@@ -2770,7 +2784,7 @@
 .ids button.ids-button.ids-button--fab {
   width: 2.75rem;
   height: 2.75rem !important;
-  border-radius: 100%;
+  border-radius: 100% !important;
   font-style: normal;
   font-weight: 400;
   line-height: 0 !important;
@@ -2812,10 +2826,16 @@
 .ids button.ids-button.ids-button--icon.ids-button--secondary {
   background-color: var(--IDS-BUTTON--SECONDARY__ICON-BACKGROUND-COLOR);
 }
-.ids .ids-button.ids-button--icon:hover, .ids .ids-button.ids-button--icon.ids-button--active,
+.ids .ids-button.ids-button--icon:hover,
 .ids-button.ids-button--icon:hover,
+.ids button.ids-button.ids-button--icon:hover {
+  background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
+  color: var(--IDS-COLOR-NEUTRAL-100);
+}
+.ids .ids-button.ids-button--icon:active, .ids .ids-button.ids-button--icon.ids-button--active,
+.ids-button.ids-button--icon:active,
 .ids-button.ids-button--icon.ids-button--active,
-.ids button.ids-button.ids-button--icon:hover,
+.ids button.ids-button.ids-button--icon:active,
 .ids button.ids-button.ids-button--icon.ids-button--active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   color: var(--IDS-COLOR-NEUTRAL-100);
@@ -2823,12 +2843,6 @@
 .ids .ids-button.ids-button--icon:focus,
 .ids-button.ids-button--icon:focus,
 .ids button.ids-button.ids-button--icon:focus {
-  outline: var(--IDS-FOCUS__OUTLINE);
-  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET) !important;
-}
-.ids .ids-button.ids-button--icon:active,
-.ids-button.ids-button--icon:active,
-.ids button.ids-button.ids-button--icon:active {
   background-color: var(--IDS-BUTTON--ACTIVE__BACKGROUND-COLOR);
   color: var(--IDS-COLOR-NEUTRAL-100);
   outline: var(--IDS-FOCUS__OUTLINE);
@@ -2870,8 +2884,6 @@
 .ids button.ids-button.ids-button--block {
   display: flex;
   width: 100%;
-  align-items: center;
-  justify-content: center;
 }
 @media (max-width: 1024px) {
   .ids .ids-button.ids-button--m-block,
@@ -2879,8 +2891,6 @@
   .ids button.ids-button.ids-button--m-block {
     display: flex;
     width: 100%;
-    align-items: center;
-    justify-content: center;
   }
 }
 @media (max-width: 640px) {
@@ -2889,8 +2899,6 @@
   .ids button.ids-button.ids-button--s-block {
     display: flex;
     width: 100%;
-    align-items: center;
-    justify-content: center;
   }
 }
 .ids .ids-button.ids-button--disabled, .ids .ids-button[disabled],
@@ -2912,16 +2920,6 @@
   align-items: flex-start;
   gap: 0.5rem;
   margin-bottom: 0.25rem;
-  margin-right: 0.25rem;
-}
-.ids-radio .ids-label-tooltip-wrapper {
-  margin-bottom: -0.25rem;
-}
-.ids-radio .ids-label-tooltip-wrapper label {
-  display: inline;
-  top: -0.188rem;
-  position: relative;
-  margin-right: 0.25rem;
 }
 .ids-radio input,
 .ids-radio input[type=radio] {
@@ -3026,16 +3024,6 @@
   align-items: flex-start;
   gap: 0.5rem;
   margin-bottom: 0.25rem;
-  margin-right: 0.25rem;
-}
-.ids-checkbox .ids-label-tooltip-wrapper {
-  margin-bottom: -0.25rem;
-}
-.ids-checkbox .ids-label-tooltip-wrapper label {
-  display: inline;
-  top: -0.188rem;
-  position: relative;
-  margin-right: 0.25rem;
 }
 .ids-checkbox input[type=checkbox],
 .ids-checkbox input {
@@ -3109,8 +3097,9 @@ input:focus + .ids-checkbox input::before {
 .ids-checkbox input.ids-input--invalid:checked::after {
   color: var(--IDS-ICON--INVALID-COLOR);
 }
-.ids-checkbox input[type=checkbox].ids-input--invalid::before,
-.ids-checkbox input.ids-input--invalid::before {
+.ids-checkbox input[type=checkbox].ids-input--invalid::before, .ids-checkbox input[type=checkbox][aria-invalid=true]::before,
+.ids-checkbox input.ids-input--invalid::before,
+.ids-checkbox input[aria-invalid=true]::before {
   border: var(--IDS-FORM--INVALID__BORDER);
   box-shadow: inset 0 0 0 0.0625rem var(--IDS-FORM--INVALID__BORDER-COLOR);
   background-color: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
@@ -3119,8 +3108,9 @@ input:focus + .ids-checkbox input::before {
 .ids-checkbox.ids-checkbox--light input::before {
   background-color: var(--IDS-COLOR-NEUTRAL-100);
 }
-.ids-checkbox.ids-checkbox--light input[type=checkbox].ids-input--invalid::before,
-.ids-checkbox.ids-checkbox--light input.ids-input--invalid::before {
+.ids-checkbox.ids-checkbox--light input[type=checkbox].ids-input--invalid::before, .ids-checkbox.ids-checkbox--light input[type=checkbox][aria-invalid=true]::before,
+.ids-checkbox.ids-checkbox--light input.ids-input--invalid::before,
+.ids-checkbox.ids-checkbox--light input[aria-invalid=true]::before {
   background-color: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
 }
 .ids-checkbox.ids-checkbox--block {
@@ -3357,63 +3347,6 @@ input:focus + .ids-checkbox input::before {
   font-style: italic;
 }
 
-input.ids-range {
-  appearance: none;
-  width: 100%;
-  height: 0.5rem;
-  background-color: var(--IDS-RANGE__BACKGROUND-COLOR);
-  background-image: linear-gradient(var(--IDS-RANGE__SELECTION-BACKGROUND-COLOR), var(--IDS-RANGE__SELECTION-BACKGROUND-COLOR));
-  background-repeat: no-repeat;
-  border: 0.063rem;
-  cursor: pointer;
-  display: block;
-  padding: 0;
-  border-radius: 1rem;
-  margin: 0;
-}
-input.ids-range::-ms-track {
-  width: 100%;
-  cursor: pointer;
-  background: transparent;
-  border-color: transparent;
-  color: transparent;
-}
-input.ids-range::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  border: 0.125rem solid var(--IDS-COLOR-NEUTRAL-100);
-  height: 1.5rem;
-  width: 1.5rem;
-  border-radius: 100%;
-  background: var(--IDS-RANGE__THUMB-BACKGROUND-COLOR);
-  cursor: pointer;
-}
-input.ids-range::-ms-thumb {
-  border: 0.125rem solid var(--IDS-COLOR-NEUTRAL-100);
-  height: 1.375rem;
-  width: 1.5rem;
-  border-radius: 100%;
-  cursor: pointer;
-}
-input.ids-range:disabled {
-  cursor: default;
-  appearance: none;
-  width: 100%;
-  height: 0.5rem;
-  background-color: var(--IDS-RANGE__BACKGROUND-COLOR);
-  background-image: linear-gradient(var(--IDS-RANGE--DISABLED__SELECTION-BACKGROUND-COLOR), var(--IDS-RANGE--DISABLED__SELECTION-BACKGROUND-COLOR));
-  background-repeat: no-repeat;
-  border: 0.063rem;
-  padding: 0;
-  border-radius: 1rem;
-}
-input.ids-range:disabled::-webkit-slider-thumb {
-  cursor: default;
-  background: var(--IDS-RANGE--DISABLED__SELECTION-BACKGROUND-COLOR);
-}
-input.ids-range:disabled::-ms-thumb {
-  cursor: default;
-}
-
 .ids-select {
   appearance: none !important;
   -webkit-appearance: none !important;
@@ -3461,7 +3394,7 @@ input.ids-range:disabled::-ms-thumb {
 .ids-select.ids-input--light.ids-input--invalid {
   background-color: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
 }
-.ids-select.ids-input--invalid {
+.ids-select.ids-input--invalid, .ids-select[aria-invalid=true] {
   background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
   border: var(--IDS-FORM--INVALID__BORDER);
   box-shadow: inset 0 0 0 0.0625rem var(--IDS-FORM--INVALID__BORDER-COLOR);
@@ -3469,7 +3402,7 @@ input.ids-range:disabled::-ms-thumb {
 .ids-select.ids-input--light {
   background-color: var(--IDS-COLOR-NEUTRAL-100);
 }
-.ids-select.ids-input--light.ids-input--invalid {
+.ids-select.ids-input--light.ids-input--invalid, .ids-select.ids-input--light[aria-invalid=true] {
   background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
   border: var(--IDS-FORM--INVALID__BORDER);
   box-shadow: inset 0 0 0 0.0625rem var(--IDS-FORM--INVALID__BORDER-COLOR);
@@ -3515,7 +3448,7 @@ input.ids-range:disabled::-ms-thumb {
   transform: translateY(-50%);
   right: var(--IDS-INPUT__ICON-RIGHT);
 }
-.ids-select-wrapper:has(.ids-input--invalid)::after {
+.ids-select-wrapper:has(.ids-input--invalid)::after, .ids-select-wrapper:has([aria-invalid=true])::after {
   color: var(--IDS-ICON--INVALID-COLOR);
 }
 .ids-select-wrapper:has(select:disabled)::after, .ids-select-wrapper:has([aria-disabled=true])::after {
@@ -3701,16 +3634,6 @@ input.ids-time__input:disabled {
   align-items: flex-start;
   gap: 0.5rem;
   margin-bottom: 0.25rem;
-  margin-right: 0;
-}
-.ids-toggle .ids-label-tooltip-wrapper {
-  margin-bottom: -0.25rem;
-}
-.ids-toggle .ids-label-tooltip-wrapper label {
-  display: inline;
-  top: -0.188rem;
-  position: relative;
-  margin-right: 0;
 }
 .ids-toggle label {
   position: relative;
@@ -3734,6 +3657,7 @@ input.ids-time__input:disabled {
   border: 0.063rem solid transparent;
   border-radius: 6.25rem;
   appearance: none;
+  flex-shrink: 0;
 }
 .ids-toggle input[type=checkbox]:before,
 .ids-toggle input:before {
@@ -3830,6 +3754,88 @@ input:focus + .ids-toggle input:before {
   }
 }
 
+.ids-range .ids-label {
+  display: inline-block;
+  margin-bottom: 0.75rem !important;
+}
+
+.ids-range__input,
+input[type=range] {
+  cursor: pointer;
+  appearance: none;
+  -webkit-appearance: none;
+  box-sizing: border-box;
+  display: block;
+  padding: 0;
+  margin: 0;
+  width: 100%;
+  height: 0.5rem;
+  border: 0.0625rem solid var(--IDS-RANGE__BORDER-COLOR);
+  border-radius: 1rem;
+  background-size: 98% 100%;
+  background-repeat: no-repeat;
+  background-image: linear-gradient(var(--IDS-RANGE__FILL-BACKGROUND-COLOR), var(--IDS-RANGE__FILL-BACKGROUND-COLOR));
+  touch-action: pan-x;
+  -webkit-tap-highlight-color: transparent;
+  margin-bottom: 0.75rem;
+}
+.ids-range__input::-webkit-slider-thumb,
+input[type=range]::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  height: 1.5rem;
+  width: 1.5rem;
+  outline: 0.1875rem solid var(--IDS-COLOR-NEUTRAL-100);
+  border-radius: 100%;
+  background-color: var(--IDS-RANGE__THUMB-BACKGROUND-COLOR);
+  cursor: pointer;
+  position: relative;
+  z-index: 1;
+}
+.ids-range__input::-moz-range-thumb,
+input[type=range]::-moz-range-thumb {
+  -moz-appearance: none;
+  height: 1.5rem;
+  width: 1.5rem;
+  outline: 0.1875rem solid var(--IDS-COLOR-NEUTRAL-100);
+  border-radius: 100%;
+  background-color: var(--IDS-RANGE__THUMB-BACKGROUND-COLOR);
+  cursor: pointer;
+  position: relative;
+  z-index: 1;
+}
+.ids-range__input::-ms-thumb,
+input[type=range]::-ms-thumb {
+  height: 1.5rem;
+  width: 1.5rem;
+  outline: 0.1875rem solid var(--IDS-COLOR-NEUTRAL-100);
+  border-radius: 100%;
+  background-color: var(--IDS-RANGE__THUMB-BACKGROUND-COLOR);
+  cursor: pointer;
+  position: relative;
+  z-index: 1;
+}
+.ids-range__input:disabled,
+input[type=range]:disabled {
+  cursor: default;
+  border: 0.0625rem dashed var(--IDS-RANGE--DISABLED__BORDER-COLOR);
+  background-image: linear-gradient(var(--IDS-RANGE--DISABLED__FILL-BACKGROUND-COLOR), var(--IDS-RANGE--DISABLED__FILL-BACKGROUND-COLOR));
+}
+.ids-range__input:disabled::-moz-range-thumb,
+input[type=range]:disabled::-moz-range-thumb {
+  cursor: default;
+  background: var(--IDS-RANGE--DISABLED__FILL-BACKGROUND-COLOR);
+}
+.ids-range__input:disabled::-webkit-slider-thumb,
+input[type=range]:disabled::-webkit-slider-thumb {
+  cursor: default;
+  background: var(--IDS-RANGE--DISABLED__FILL-BACKGROUND-COLOR);
+}
+.ids-range__input:disabled::-ms-thumb,
+input[type=range]:disabled::-ms-thumb {
+  cursor: default;
+  background: var(--IDS-RANGE--DISABLED__FILL-BACKGROUND-COLOR);
+}
+
 .ids-form-group__fieldset {
   border: none;
   margin: 0;
@@ -4005,7 +4011,7 @@ input:focus + .ids-toggle input:before {
   }
 }
 .ids .ids-heading-m .ids-anchor {
-  color: var(--IDS-ANCHOR__COLOR);
+  color: var(--IDS-ANCHOR__COLOR) !important;
   text-decoration: none;
   text-underline-offset: 0.125rem;
 }
@@ -4038,7 +4044,7 @@ input:focus + .ids-toggle input:before {
   }
 }
 .ids .ids-heading-s .ids-anchor {
-  color: var(--IDS-ANCHOR__COLOR);
+  color: var(--IDS-ANCHOR__COLOR) !important;
   text-decoration: none;
   text-underline-offset: 0.125rem;
 }
@@ -4064,7 +4070,7 @@ input:focus + .ids-toggle input:before {
   font-weight: var(--IDS-HEADING-XS__FONT-WEIGHT);
 }
 .ids .ids-heading-xs .ids-anchor {
-  color: var(--IDS-ANCHOR__COLOR);
+  color: var(--IDS-ANCHOR__COLOR) !important;
   text-decoration: none;
   text-underline-offset: 0.125rem;
 }
@@ -4096,7 +4102,7 @@ input:focus + .ids-toggle input:before {
   }
 }
 .ids .ids-preamble .ids-anchor {
-  color: var(--IDS-ANCHOR__COLOR);
+  color: var(--IDS-ANCHOR__COLOR) !important;
   text-decoration: none;
   text-underline-offset: 0.125rem;
 }
@@ -4120,7 +4126,7 @@ input:focus + .ids-toggle input:before {
   letter-spacing: 0;
 }
 .ids .ids-body .ids-anchor {
-  color: var(--IDS-ANCHOR__COLOR);
+  color: var(--IDS-ANCHOR__COLOR) !important;
   text-decoration: none;
   text-underline-offset: 0.125rem;
 }
@@ -4148,7 +4154,7 @@ input:focus + .ids-toggle input:before {
   font-family: var(--IDS-FONT-FAMILY-BASE);
 }
 .ids .ids-small .ids-anchor {
-  color: var(--IDS-ANCHOR__COLOR);
+  color: var(--IDS-ANCHOR__COLOR) !important;
   text-decoration: none;
   text-underline-offset: 0.125rem;
 }
@@ -4171,6 +4177,21 @@ input:focus + .ids-toggle input:before {
   font-weight: var(--IDS-PAGE-LIST__FONT-WEIGHT);
   letter-spacing: var(--IDS-PAGE-LIST__LETTER-SPACING);
 }
+.ids .ids-pagelist .ids-anchor {
+  color: var(--IDS-ANCHOR__COLOR) !important;
+  text-decoration: none;
+  text-underline-offset: 0.125rem;
+}
+.ids .ids-pagelist .ids-anchor:visited {
+  color: var(--IDS-ANCHOR__COLOR);
+}
+.ids .ids-pagelist .ids-anchor:link {
+  text-decoration: underline;
+}
+.ids .ids-pagelist .ids-anchor:active, .ids .ids-pagelist .ids-anchor:hover {
+  color: var(--IDS-ANCHOR__HOVER-COLOR);
+  text-decoration: underline;
+}
 .ids ul.ids-bullet-list,
 .ids .ids-bullet-list {
   list-style: disc;
@@ -4270,6 +4291,342 @@ input:focus + .ids-toggle input:before {
   position: absolute;
 }
 
+.ids-icon-download-small:before {
+  content: "\e99a";
+}
+
+.ids-icon-copy-link:before {
+  content: "\e99b";
+}
+
+.ids-icon-activity:before {
+  content: "\e948";
+}
+
+.ids-icon-alarm:before {
+  content: "\e949";
+}
+
+.ids-icon-archive:before {
+  content: "\e94a";
+}
+
+.ids-icon-bookmark:before {
+  content: "\e94b";
+}
+
+.ids-icon-call-ongoing:before {
+  content: "\e94c";
+}
+
+.ids-icon-call:before {
+  content: "\e94d";
+}
+
+.ids-icon-camera-off:before {
+  content: "\e94e";
+}
+
+.ids-icon-camera-on:before {
+  content: "\e94f";
+}
+
+.ids-icon-camera-switch:before {
+  content: "\e950";
+}
+
+.ids-icon-chart-bar:before {
+  content: "\e951";
+}
+
+.ids-icon-chart-line:before {
+  content: "\e952";
+}
+
+.ids-icon-chat:before {
+  content: "\e953";
+}
+
+.ids-icon-clipboard-with-cross:before {
+  content: "\e954";
+}
+
+.ids-icon-clipboard-with-text:before {
+  content: "\e955";
+}
+
+.ids-icon-clipboard:before {
+  content: "\e956";
+}
+
+.ids-icon-copy-file:before {
+  content: "\e957";
+}
+
+.ids-icon-denied-small:before {
+  content: "\e958";
+}
+
+.ids-icon-denied:before {
+  content: "\e959";
+}
+
+.ids-icon-desktop:before {
+  content: "\e95a";
+}
+
+.ids-icon-doctors-bag:before {
+  content: "\e95b";
+}
+
+.ids-icon-document:before {
+  content: "\e95c";
+}
+
+.ids-icon-download:before {
+  content: "\e95d";
+}
+
+.ids-icon-e-mail-sent:before {
+  content: "\e95e";
+}
+
+.ids-icon-e-mail-unread:before {
+  content: "\e95f";
+}
+
+.ids-icon-e-mail:before {
+  content: "\e960";
+}
+
+.ids-icon-edit:before {
+  content: "\e961";
+}
+
+.ids-icon-error-filled:before {
+  content: "\e962";
+}
+
+.ids-icon-error:before {
+  content: "\e963";
+}
+
+.ids-icon-file-csv:before {
+  content: "\e964";
+}
+
+.ids-icon-file-excel:before {
+  content: "\e965";
+}
+
+.ids-icon-file-image:before {
+  content: "\e966";
+}
+
+.ids-icon-file-other:before {
+  content: "\e967";
+}
+
+.ids-icon-file-pdf:before {
+  content: "\e968";
+}
+
+.ids-icon-file-ppt:before {
+  content: "\e969";
+}
+
+.ids-icon-file-word:before {
+  content: "\e96a";
+}
+
+.ids-icon-find-care:before {
+  content: "\e96b";
+}
+
+.ids-icon-flag:before {
+  content: "\e96c";
+}
+
+.ids-icon-folder:before {
+  content: "\e96d";
+}
+
+.ids-icon-form-numbered-reoccurring:before {
+  content: "\e96e";
+}
+
+.ids-icon-form-numbered:before {
+  content: "\e96f";
+}
+
+.ids-icon-functions:before {
+  content: "\e970";
+}
+
+.ids-icon-headphones:before {
+  content: "\e971";
+}
+
+.ids-icon-hourglass-end:before {
+  content: "\e972";
+}
+
+.ids-icon-hourglass-start:before {
+  content: "\e973";
+}
+
+.ids-icon-hourglass:before {
+  content: "\e974";
+}
+
+.ids-icon-house:before {
+  content: "\e975";
+}
+
+.ids-icon-id-card-locked:before {
+  content: "\e976";
+}
+
+.ids-icon-id-card:before {
+  content: "\e977";
+}
+
+.ids-icon-image:before {
+  content: "\e978";
+}
+
+.ids-icon-inactivity:before {
+  content: "\e979";
+}
+
+.ids-icon-lightbulb:before {
+  content: "\e97a";
+}
+
+.ids-icon-list:before {
+  content: "\e97b";
+}
+
+.ids-icon-listen:before {
+  content: "\e97c";
+}
+
+.ids-icon-locked:before {
+  content: "\e97d";
+}
+
+.ids-icon-log-locked:before {
+  content: "\e97e";
+}
+
+.ids-icon-log:before {
+  content: "\e97f";
+}
+
+.ids-icon-mobile:before {
+  content: "\e980";
+}
+
+.ids-icon-moment-start:before {
+  content: "\e981";
+}
+
+.ids-icon-moment-stop:before {
+  content: "\e982";
+}
+
+.ids-icon-office-building:before {
+  content: "\e983";
+}
+
+.ids-icon-organization:before {
+  content: "\e984";
+}
+
+.ids-icon-prescription:before {
+  content: "\e985";
+}
+
+.ids-icon-print:before {
+  content: "\e986";
+}
+
+.ids-icon-settings:before {
+  content: "\e987";
+}
+
+.ids-icon-shield-locked-filled:before {
+  content: "\e988";
+}
+
+.ids-icon-shield-locked-outlined:before {
+  content: "\e989";
+}
+
+.ids-icon-social-facebook:before {
+  content: "\e98a";
+}
+
+.ids-icon-social-linkedin:before {
+  content: "\e98b";
+}
+
+.ids-icon-social-x:before {
+  content: "\e98c";
+}
+
+.ids-icon-switch-person:before {
+  content: "\e98d";
+}
+
+.ids-icon-toggle-card-view:before {
+  content: "\e98e";
+}
+
+.ids-icon-toggle-list-view:before {
+  content: "\e98f";
+}
+
+.ids-icon-trash-can:before {
+  content: "\e990";
+}
+
+.ids-icon-tube-analysis:before {
+  content: "\e991";
+}
+
+.ids-icon-tube-empty:before {
+  content: "\e992";
+}
+
+.ids-icon-tube-filled:before {
+  content: "\e993";
+}
+
+.ids-icon-unlocked:before {
+  content: "\e994";
+}
+
+.ids-icon-video-off:before {
+  content: "\e995";
+}
+
+.ids-icon-video-on:before {
+  content: "\e996";
+}
+
+.ids-icon-video-switch:before {
+  content: "\e997";
+}
+
+.ids-icon-visibility-off:before {
+  content: "\e998";
+}
+
+.ids-icon-visibility:before {
+  content: "\e999";
+}
+
 .ids-icon-arrow-link:before {
   content: "\e947";
 }
@@ -4583,25 +4940,17 @@ input:focus + .ids-toggle input:before {
 [class^=ids-icon-].ids-icon--text-start {
   margin-right: 0.5rem;
   position: relative;
-  bottom: -0.125rem;
+  top: -0.0938rem;
+  vertical-align: middle;
   flex-shrink: 0;
 }
-[class^=ids-icon-].ids-icon--text-start:before {
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
 [class^=ids-icon-].ids-icon--text-end {
   margin-left: 0.5rem;
   position: relative;
-  bottom: -0.125rem;
+  top: -0.0938rem;
+  vertical-align: middle;
   flex-shrink: 0;
 }
-[class^=ids-icon-].ids-icon--text-end:before {
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-}
 [class^=ids-icon-].ids-icon--s {
   width: 1rem;
   height: 1rem;