@inera/ids-design 5.0.3 → 5.1.0

package/themes/1177/1177.css

@@ -71,12 +71,36 @@ body.ids {
   }
 }
 
+/* This is generated by tailwind/util-tailwind.scss */
 /* Pre-existing utility classes begin here */
 /* Force elements to be displayed as block elements */
 .ids-block {
   display: block !important;
 }
 
+.ids-bg-1 {
+  background-color: white;
+}
+
+.ids-bg-2 {
+  background-color: var(--IDS-COLOR-SECONDARY-95);
+}
+
+/* Removes native button styling */
+.ids-btn-no-styles {
+  background: none;
+  color: inherit;
+  border: none;
+  padding: 0;
+  font: inherit;
+  cursor: pointer;
+  outline: inherit;
+}
+.ids-btn-no-styles:focus {
+  outline: var(--focus_outline);
+  outline-offset: var(--focus_outline-offset);
+}
+
 /* Makes elements behave as inline-level block containers */
 .ids-inline-block {
   display: inline-block;
@@ -2306,6 +2330,543 @@ body.ids {
   float: none;
 }
 
+/* 1177 Typography - no margins */
+/*******
+* FORM
+********/
+input.ids-time, .ids-textarea, .ids-select, .ids-input {
+  font-family: var(--font-family_1) !important;
+  padding: 0.75rem 1.25rem;
+  background-color: var(--IDS-INPUT_BACKGROUND);
+  border: var(--IDS-INPUT_BORDER);
+  border-bottom: var(--IDS-INPUT_BORDER-BOTTOM);
+  border-radius: var(--IDS-INPUT_BORDER-RADIUS);
+  font-size: 16px;
+  color: var(--IDS-INPUT_COLOR);
+  display: block;
+}
+input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-textarea.ids-textarea--invalid, .ids-input.ids-input--invalid {
+  background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
+  border: none;
+  background-image: var(--IDS-INPUT--INVALID_BACKGROUND-IMAGE);
+}
+
+input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-input:disabled {
+  background: var(--IDS-INPUT--DISABLED_BACKGROUND-COLOR);
+  border: none;
+  background-image: var(--IDS-INPUT--DISABLED_BACKGROUND-IMAGE);
+}
+
+.ids-label-wrapper {
+  display: inline-flex;
+  gap: 10px;
+  align-items: center;
+}
+
+.ids-select-wrapper::after, .ids-select ::after {
+  content: "";
+  width: 12px;
+  height: 100%;
+  display: block;
+  position: absolute;
+  transform: rotate(90deg);
+  right: 25px;
+  top: 0px;
+  bottom: 0px;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-image: var(--IDS-SELECT__CHEVRON-ICON);
+  pointer-events: none;
+}
+
+/*******
+* Accessibility
+********/
+/* headings */
+.ids-link {
+  font-family: var(--IDS-LINK--FONT-FAMILY);
+  color: var(--link-colorpreset-1_color);
+  text-decoration-color: var(--link-colorpreset-1_color);
+  line-height: 1.5rem;
+  cursor: pointer;
+  display: inline-flex;
+  gap: 8px;
+  align-items: flex-start;
+  text-decoration: none;
+  position: relative;
+}
+.ids-link:not(:has(.ids-link__icon)) {
+  text-decoration: underline;
+}
+.ids-link:focus:focus {
+  outline: var(--IDS-FOCUS_OUTLINE);
+  outline-offset: var(--IDS-FOCUS_OUTLINE-OFFSET) !important;
+}
+.ids-link:hover, .ids-link:focus {
+  text-decoration: underline;
+  color: var(--link-colorpreset-1-hover_color);
+}
+.ids-link:hover .ids-link__icon:has(+ .ids-link__icon--hover), .ids-link:focus .ids-link__icon:has(+ .ids-link__icon--hover) {
+  display: none;
+}
+.ids-link:hover .ids-link__icon--hover, .ids-link:focus .ids-link__icon--hover {
+  display: inline-flex;
+}
+.ids-link.ids-link--block {
+  display: flex;
+}
+.ids-link.ids-link--underlined {
+  text-decoration: underline;
+}
+.ids-link.ids-link--active-icon {
+  text-decoration: none !important;
+}
+.ids-link.ids-link--active-icon .ids-link__icon .ids-link__icon__wrap,
+.ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
+  border-radius: 100%;
+  padding: 3px;
+  align-items: center;
+  justify-content: center;
+}
+.ids-link.ids-link--active-icon:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon:focus-within .ids-link__icon .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-1-hover_color);
+}
+.ids-link.ids-link--active-icon.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
+  display: none;
+}
+.ids-link.ids-link--active-icon.ids-link--active .ids-link__icon--hover {
+  display: inline-flex;
+}
+.ids-link.ids-link--active-icon.ids-link--active .ids-link__icon .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-1_color);
+}
+.ids-link.ids-link--active-icon.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-1-hover_color);
+}
+.ids-link.ids-link--active-icon .ids-link__icon--hover .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-1-hover_color);
+}
+.ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon .ids-link__icon__wrap,
+.ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
+  border-radius: 100%;
+  padding: 3px;
+  align-items: center;
+  justify-content: center;
+}
+.ids-link.ids-link--active-icon.ids-link--color-2:hover .ids-link__icon .ids-link__icon__wrap, .ids-link.ids-link--active-icon.ids-link--color-2:focus-within .ids-link__icon .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-2-hover_color);
+}
+.ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon:has(+ .ids-link__icon--hover) {
+  display: none;
+}
+.ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon--hover {
+  display: inline-flex;
+}
+.ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active .ids-link__icon .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-2_color);
+}
+.ids-link.ids-link--active-icon.ids-link--color-2.ids-link--active:hover .ids-link__icon .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-2-hover_color);
+}
+.ids-link.ids-link--active-icon.ids-link--color-2 .ids-link__icon--hover .ids-link__icon__wrap {
+  background-color: var(--link-colorpreset-2-hover_color);
+}
+.ids-link.ids-link--color-2 {
+  color: var(--link-colorpreset-2_color);
+  text-decoration-color: var(--link-colorpreset-2_color);
+}
+.ids-link.ids-link--color-2:hover, .ids-link.ids-link--color-2:focus {
+  color: var(--link-colorpreset-2-hover_color);
+  text-decoration-color: var(--link-colorpreset-2-hover_color);
+}
+.ids-link.ids-link--light {
+  color: white !important;
+  text-decoration-color: white !important;
+}
+.ids-link.ids-link--light:focus {
+  outline-color: white !important;
+}
+.ids-link.ids-link--light:hover {
+  color: white !important;
+}
+.ids-link .ids-link__icon,
+.ids-link .ids-link__icon--hover {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  height: 1.5rem;
+}
+.ids-link .ids-link__text {
+  display: inline-flex;
+  gap: 8px;
+}
+.ids-link .ids-link__icon {
+  display: inline-flex;
+}
+.ids-link .ids-link__icon--hover {
+  display: none;
+}
+
+@media (max-width: 1023px) {
+  .ids-desktop {
+    display: none !important;
+  }
+}
+
+@media (min-width: 1024px) {
+  .ids-mobile {
+    display: none !important;
+  }
+}
+
+/* 1177 Typography - no margins */
+/*******
+* FORM
+********/
+input.ids-time, .ids-textarea, .ids-select, .ids-input {
+  font-family: var(--font-family_1) !important;
+  padding: 0.75rem 1.25rem;
+  background-color: var(--IDS-INPUT_BACKGROUND);
+  border: var(--IDS-INPUT_BORDER);
+  border-bottom: var(--IDS-INPUT_BORDER-BOTTOM);
+  border-radius: var(--IDS-INPUT_BORDER-RADIUS);
+  font-size: 16px;
+  color: var(--IDS-INPUT_COLOR);
+  display: block;
+}
+input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-textarea.ids-textarea--invalid, .ids-input.ids-input--invalid {
+  background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
+  border: none;
+  background-image: var(--IDS-INPUT--INVALID_BACKGROUND-IMAGE);
+}
+
+input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-input:disabled {
+  background: var(--IDS-INPUT--DISABLED_BACKGROUND-COLOR);
+  border: none;
+  background-image: var(--IDS-INPUT--DISABLED_BACKGROUND-IMAGE);
+}
+
+.ids-label-wrapper {
+  display: inline-flex;
+  gap: 10px;
+  align-items: center;
+}
+
+.ids-select-wrapper::after, .ids-select ::after {
+  content: "";
+  width: 12px;
+  height: 100%;
+  display: block;
+  position: absolute;
+  transform: rotate(90deg);
+  right: 25px;
+  top: 0px;
+  bottom: 0px;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-image: var(--IDS-SELECT__CHEVRON-ICON);
+  pointer-events: none;
+}
+
+/*******
+* Accessibility
+********/
+/* headings */
+.ids .ids-button.ids-button--secondary.ids-button--disabled, .ids .ids-button.ids-button--secondary[disabled],
+.ids-button.ids-button--secondary.ids-button--disabled,
+.ids-button.ids-button--secondary[disabled],
+.ids button.ids-button.ids-button--secondary.ids-button--disabled,
+.ids button.ids-button.ids-button--secondary[disabled], .ids .ids-button.ids-button--disabled, .ids .ids-button[disabled],
+.ids-button.ids-button--disabled,
+.ids-button[disabled],
+.ids button.ids-button.ids-button--disabled,
+.ids button.ids-button[disabled] {
+  color: var(--btn-disabled_color) !important;
+  border: var(--btn-disabled_border) !important;
+  background-color: white !important;
+}
+
+.ids button.ids-button {
+  min-width: 24px;
+  min-height: 24px;
+  background: none;
+  color: inherit;
+  border: none;
+  padding: 0;
+  font: inherit;
+  cursor: pointer;
+  outline: inherit;
+  -moz-user-select: -moz-none;
+  -khtml-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+.ids button.ids-button:focus {
+  outline: var(--IDS-FOCUS_OUTLINE);
+  outline-offset: var(--IDS-FOCUS_OUTLINE-OFFSET) !important;
+}
+
+.ids .ids-button,
+.ids-button,
+.ids button.ids-button {
+  text-align: center;
+  background-color: var(--btn_background-color);
+  border: var(--btn_border);
+  border-radius: var(--btn_border-radius);
+  box-sizing: border-box;
+  color: white;
+  cursor: pointer;
+  padding: var(--btn-m_padding);
+  gap: 8px;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  font-family: var(--btn_font-family);
+  font-weight: var(--btn_font-weight);
+  text-transform: uppercase;
+  user-select: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  font-size: 1rem;
+  min-height: var(--btn-m_height);
+  line-height: 22px;
+}
+.ids .ids-button:hover, .ids .ids-button:active, .ids .ids-button:focus, .ids .ids-button.ids-button--active,
+.ids-button:hover,
+.ids-button:active,
+.ids-button:focus,
+.ids-button.ids-button--active,
+.ids button.ids-button:hover,
+.ids button.ids-button:active,
+.ids button.ids-button:focus,
+.ids button.ids-button.ids-button--active {
+  background-color: var(--btn-active_background-color);
+  box-shadow: var(--btn-active_box-shadow);
+}
+.ids .ids-button.ids-button--s,
+.ids-button.ids-button--s,
+.ids button.ids-button.ids-button--s {
+  font-size: 0.875rem;
+  min-height: var(--btn-s_height);
+  padding: var(--btn-s_padding);
+}
+.ids .ids-button.ids-button--l,
+.ids-button.ids-button--l,
+.ids button.ids-button.ids-button--l {
+  font-size: 1.125rem;
+  min-height: var(--btn-l_height);
+  padding: var(--btn-l_padding);
+}
+.ids .ids-button.ids-button--loading,
+.ids-button.ids-button--loading,
+.ids button.ids-button.ids-button--loading {
+  pointer-events: none !important;
+}
+.ids .ids-button.ids-button--secondary,
+.ids-button.ids-button--secondary,
+.ids button.ids-button.ids-button--secondary {
+  background-color: white;
+  border: var(--btn-secondary_border);
+  color: var(--btn-secondary_color);
+  min-height: var(--btn-secondary-m_height);
+  padding: var(--btn-secondary-m_padding);
+}
+.ids .ids-button.ids-button--secondary.ids-button--s,
+.ids-button.ids-button--secondary.ids-button--s,
+.ids button.ids-button.ids-button--secondary.ids-button--s {
+  min-height: var(--btn-secondary-s_height);
+  padding: var(--btn-secondary-s_padding);
+}
+.ids .ids-button.ids-button--secondary.ids-button--l,
+.ids-button.ids-button--secondary.ids-button--l,
+.ids button.ids-button.ids-button--secondary.ids-button--l {
+  min-height: var(--btn-secondary-l_height);
+  padding: var(--btn-secondary-l_padding);
+}
+.ids .ids-button.ids-button--secondary.ids-button--active, .ids .ids-button.ids-button--secondary:hover, .ids .ids-button.ids-button--secondary:focus, .ids .ids-button.ids-button--secondary:active,
+.ids-button.ids-button--secondary.ids-button--active,
+.ids-button.ids-button--secondary:hover,
+.ids-button.ids-button--secondary:focus,
+.ids-button.ids-button--secondary:active,
+.ids button.ids-button.ids-button--secondary.ids-button--active,
+.ids button.ids-button.ids-button--secondary:hover,
+.ids button.ids-button.ids-button--secondary:focus,
+.ids button.ids-button.ids-button--secondary:active {
+  background-color: var(--btn-active_background-color);
+  color: white;
+  border: 1px solid var(--btn-active_background-color);
+}
+.ids .ids-button.ids-button--tertiary,
+.ids-button.ids-button--tertiary,
+.ids button.ids-button.ids-button--tertiary {
+  background: transparent;
+  border-radius: 0px;
+  border: none;
+  color: var(--btn-tertiary_color);
+  box-shadow: none;
+  line-height: 22px;
+  font-family: var(--font-family_2);
+  text-decoration: underline;
+}
+.ids .ids-button.ids-button--tertiary.ids-button--active, .ids .ids-button.ids-button--tertiary:hover, .ids .ids-button.ids-button--tertiary:active, .ids .ids-button.ids-button--tertiary:focus,
+.ids-button.ids-button--tertiary.ids-button--active,
+.ids-button.ids-button--tertiary:hover,
+.ids-button.ids-button--tertiary:active,
+.ids-button.ids-button--tertiary:focus,
+.ids button.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:focus {
+  background-color: var(--btn-active_background-color);
+  color: white;
+  border-radius: var(--btn_border-radius);
+}
+.ids .ids-button.ids-button--tertiary.ids-button--disabled, .ids .ids-button.ids-button--tertiary[disabled],
+.ids-button.ids-button--tertiary.ids-button--disabled,
+.ids-button.ids-button--tertiary[disabled],
+.ids button.ids-button.ids-button--tertiary.ids-button--disabled,
+.ids button.ids-button.ids-button--tertiary[disabled] {
+  border: none !important;
+  text-decoration: underline !important;
+  color: var(--btn-disabled_color);
+  text-decoration: none;
+}
+.ids .ids-button.ids-button--submit,
+.ids-button.ids-button--submit,
+.ids button.ids-button.ids-button--submit {
+  height: 3.75em !important;
+  border-radius: var(--btn-submit_border-radius);
+}
+.ids .ids-button.ids-button--icon, .ids .ids-button.ids-button--fab,
+.ids-button.ids-button--icon,
+.ids-button.ids-button--fab,
+.ids button.ids-button.ids-button--icon,
+.ids button.ids-button.ids-button--fab {
+  width: 44px;
+  height: 44px !important;
+  border-radius: 100%;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 0px !important;
+  font-size: 20px;
+  padding: 0px !important;
+  justify-content: center;
+}
+.ids .ids-button.ids-button--icon.ids-button--s, .ids .ids-button.ids-button--fab.ids-button--s,
+.ids-button.ids-button--icon.ids-button--s,
+.ids-button.ids-button--fab.ids-button--s,
+.ids button.ids-button.ids-button--icon.ids-button--s,
+.ids button.ids-button.ids-button--fab.ids-button--s {
+  width: 30px;
+  height: 30px !important;
+}
+.ids .ids-button.ids-button--icon.ids-button--l, .ids .ids-button.ids-button--fab.ids-button--l,
+.ids-button.ids-button--icon.ids-button--l,
+.ids-button.ids-button--fab.ids-button--l,
+.ids button.ids-button.ids-button--icon.ids-button--l,
+.ids button.ids-button.ids-button--fab.ids-button--l {
+  width: 60px;
+  height: 60px !important;
+}
+.ids .ids-button.ids-button--fab,
+.ids-button.ids-button--fab,
+.ids button.ids-button.ids-button--fab {
+  background-color: white;
+  border: var(--btn-fab_border);
+  filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.3));
+}
+.ids .ids-button.ids-button--icon.ids-button--secondary,
+.ids-button.ids-button--icon.ids-button--secondary,
+.ids button.ids-button.ids-button--icon.ids-button--secondary {
+  background-color: var(--btn-icon-secondary_background-color);
+}
+.ids .ids-button.ids-button--icon.ids-button--active, .ids .ids-button.ids-button--icon:hover, .ids .ids-button.ids-button--icon:active, .ids .ids-button.ids-button--icon:focus,
+.ids-button.ids-button--icon.ids-button--active,
+.ids-button.ids-button--icon:hover,
+.ids-button.ids-button--icon:active,
+.ids-button.ids-button--icon:focus,
+.ids button.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:focus {
+  background-color: var(--btn-icon-secondary--hover_background-color);
+  color: white;
+}
+.ids .ids-button.ids-button--submit,
+.ids-button.ids-button--submit,
+.ids button.ids-button.ids-button--submit {
+  height: var(--btn-submit_height);
+  border-radius: var(--btn-submit_border-radius);
+  line-height: var(--btn-submit_height);
+}
+.ids .ids-button.ids-button--search,
+.ids-button.ids-button--search,
+.ids button.ids-button.ids-button--search {
+  height: var(--btn-search_height);
+  padding: 0px 30px !important;
+  font-size: var(--btn-search_font-size);
+  border-radius: var(--btn-search_border-radius);
+}
+.ids .ids-button.ids-button--search.ids-button--s,
+.ids-button.ids-button--search.ids-button--s,
+.ids button.ids-button.ids-button--search.ids-button--s {
+  height: var(--btn-search-s_height);
+  font-size: var(--btn-search-s_font-size);
+}
+@media (max-width: 1024px) {
+  .ids .ids-button.ids-button--search,
+  .ids-button.ids-button--search,
+  .ids button.ids-button.ids-button--search {
+    font-size: var(--btn-search-mobile_font-size) !important;
+    padding: 0px 14px !important;
+    height: var(--btn-search-mobile_height) !important;
+  }
+}
+.ids .ids-button.ids-button--block,
+.ids-button.ids-button--block,
+.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,
+  .ids-button.ids-button--m-block,
+  .ids button.ids-button.ids-button--m-block {
+    display: flex;
+    width: 100%;
+    align-items: center;
+    justify-content: center;
+  }
+}
+@media (max-width: 640px) {
+  .ids .ids-button.ids-button--s-block,
+  .ids-button.ids-button--s-block,
+  .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],
+.ids-button.ids-button--disabled,
+.ids-button[disabled],
+.ids button.ids-button.ids-button--disabled,
+.ids button.ids-button[disabled] {
+  pointer-events: none;
+}
+.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-label {
   display: inline-block;
   color: var(--IDS-FORM__LABEL__COLOR);
@@ -2325,67 +2886,107 @@ body.ids {
 }
 
 .ids-radio,
-ids-radio input {
-  position: absolute;
-  opacity: 0;
-}
-
-ids-radio *[slot=tooltip] {
-  margin-left: 5px;
-}
-
-.ids-label--radio {
-  display: inline-flex;
-  align-items: flex-start;
+.ids-radio input,
+input[type=radio] {
   cursor: pointer;
+  appearance: none;
+  margin: 0;
+  font: inherit;
+  width: 20px;
+  height: 20px;
+  color: var(--IDS-COLOR-ACCENT-40);
+  border: 1px solid var(--IDS-COLOR-ACCENT-40);
+  background-color: var(--IDS-RADIO__BACKGROUND-COLOR);
+  border-radius: 50%;
+  transform: translateY(4px);
+  position: relative;
+}
+.ids-radio.ids-input--light,
+.ids-radio input.ids-input--light,
+input[type=radio].ids-input--light {
+  background-color: white;
 }
-.ids-label--radio.ids-label--light:before {
+.ids-radio.ids-input--light::before,
+.ids-radio input.ids-input--light::before,
+input[type=radio].ids-input--light::before {
+  border: 2px solid white;
   background-color: white;
 }
-.ids-label--radio:before {
+.ids-radio::before,
+.ids-radio input::before,
+input[type=radio]::before {
   content: "";
-  flex: 0 0 auto;
-  background: var(--IDS-RADIO__BACKGROUND-COLOR);
-  box-sizing: border-box;
-  border-radius: 100%;
-  border: var(--IDS-RADIO__BORDER);
+  position: absolute;
   display: inline-block;
-  width: 1.25rem;
-  height: 1.25rem;
-  margin-top: 1px;
-  position: relative;
   cursor: pointer;
-  text-align: center;
-  margin-right: 0.625rem;
-}
-input[type=radio]:checked + .ids-label--radio:before {
+  width: 18px;
+  height: 18px;
+  border-radius: 50%;
+  top: 0;
+  left: 0;
+  border: 2px solid var(--IDS-RADIO__BACKGROUND-COLOR);
+  background-color: var(--IDS-RADIO__BACKGROUND-COLOR);
+}
+.ids-radio:checked::before,
+.ids-radio input:checked::before,
+input[type=radio]:checked::before {
+  border: 2px solid var(--IDS-RADIO__BACKGROUND-COLOR);
   background-color: var(--IDS-RADIO--CHECKED__BACKGROUND-COLOR);
-  box-shadow: inset 0 0 0 2px white;
 }
-input[type=radio]:disabled + .ids-label--radio:before {
+.ids-radio:disabled,
+.ids-radio input:disabled,
+input[type=radio]:disabled {
+  cursor: default;
+  background-color: var(--IDS-RADIO--DISABLED__BACKGROUND-COLOR);
   background-image: var(--IDS-RADIO--DISABLED_BACKGROUND-IMAGE);
-  background-color: var(--IDS-FORM--DISABLED__BACKGROUND-COLOR);
-  border: none;
+  border: 0;
 }
-input[type=radio][aria-invalid=true]:not(:checked) + .ids-label--radio:before {
-  background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
-  border: none;
+.ids-radio:disabled::before,
+.ids-radio input:disabled::before,
+input[type=radio]:disabled::before {
+  cursor: default;
+  background-color: var(--IDS-RADIO--DISABLED__BACKGROUND-COLOR);
+  border: 2px solid var(--IDS-RADIO--DISABLED__BACKGROUND-COLOR);
+  top: 1px;
+  left: 1px;
+}
+.ids-radio:disabled:checked::before,
+.ids-radio input:disabled:checked::before,
+input[type=radio]:disabled:checked::before {
+  border: 2px solid var(--IDS-RADIO--DISABLED__BACKGROUND-COLOR);
+  background-color: var(--IDS-RADIO--CHECKED-DISABLED__BACKGROUND-COLOR);
+}
+.ids-radio[aria-invalid=true]:not(:checked),
+.ids-radio input[aria-invalid=true]:not(:checked),
+input[type=radio][aria-invalid=true]:not(:checked) {
+  background-color: var(--IDS-RADIO--INVALID__BACKGROUND-COLOR);
   background-image: var(--IDS-RADIO--INVALID_BACKGROUND-IMAGE);
+  border: 0;
 }
-.ids-label--radio.ids-label--disabled {
-  cursor: default;
+.ids-radio[aria-invalid=true]:not(:checked)::before,
+.ids-radio input[aria-invalid=true]:not(:checked)::before,
+input[type=radio][aria-invalid=true]:not(:checked)::before {
+  border: 2px solid var(--IDS-RADIO--INVALID__BACKGROUND-COLOR);
+  background-color: var(--IDS-RADIO--INVALID__BACKGROUND-COLOR);
+  top: 1px;
+  left: 1px;
 }
-.ids-label--radio.ids-label--disabled:before {
-  cursor: default;
+
+.ids-label--radio {
+  cursor: pointer;
+  padding-left: 8px;
+  margin-bottom: 0;
 }
-input:focus + .ids-label--radio::before {
-  outline: var(--focus_outline);
-  outline-offset: var(--focus_outline-offset);
+.ids-label--radio.ids-label--disabled {
+  cursor: default;
 }
 
-.ids-radio:disabled,
-ids-radio input:disabled {
-  cursor: default;
+ids-radio {
+  display: flex;
+  align-items: baseline;
+}
+ids-radio *[slot=tooltip] {
+  margin-left: 5px;
 }
 
 .ids-checkbox-label::before {
@@ -2498,15 +3099,15 @@ input.ids-time, .ids-textarea, .ids-select, .ids-input {
   color: var(--IDS-INPUT_COLOR);
   display: block;
 }
-input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-input.ids-input--invalid {
+input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-textarea.ids-textarea--invalid, .ids-input.ids-input--invalid {
   background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--INVALID_BACKGROUND-IMAGE);
 }
 
 input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-input:disabled {
   background: var(--IDS-INPUT--DISABLED_BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--DISABLED_BACKGROUND-IMAGE);
 }
 
@@ -2535,6 +3136,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
 /*******
 * Accessibility
 ********/
+/* headings */
 .ids-input {
   width: 100%;
 }
@@ -2547,12 +3149,6 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
   font-size: 18px !important;
 }
 
-.ids-input:disabled {
-  background: var(--IDS-INPUT--DISABLED_BACKGROUND-COLOR);
-  border: none;
-  background-image: var(--IDS-INPUT--DISABLED_BACKGROUND-IMAGE);
-}
-
 .ids-input__hint {
   margin-top: 5px;
   font-family: var(--font-family_1);
@@ -2691,15 +3287,15 @@ input.ids-time, .ids-textarea, .ids-select, .ids-input {
   color: var(--IDS-INPUT_COLOR);
   display: block;
 }
-input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-input.ids-input--invalid {
+input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-textarea.ids-textarea--invalid, .ids-input.ids-input--invalid {
   background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--INVALID_BACKGROUND-IMAGE);
 }
 
 input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-input:disabled {
   background: var(--IDS-INPUT--DISABLED_BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--DISABLED_BACKGROUND-IMAGE);
 }
 
@@ -2728,6 +3324,7 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-select:disabled, .ids-inpu
 /*******
 * Accessibility
 ********/
+/* headings */
 .ids-select.ids-input--invalid {
   background-color: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
   background-image: var(--IDS-FORM--INVALID__BACKGROUND-IMAGE);
@@ -2793,15 +3390,15 @@ input.ids-time, .ids-textarea, .ids-input, .ids-select {
   color: var(--IDS-INPUT_COLOR);
   display: block;
 }
-input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-input.ids-input--invalid {
+input.ids-time.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-textarea.ids-textarea--invalid, .ids-input.ids-input--invalid {
   background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--INVALID_BACKGROUND-IMAGE);
 }
 
 input.ids-time:disabled, .ids-textarea:disabled, .ids-input:disabled, .ids-select:disabled {
   background: var(--IDS-INPUT--DISABLED_BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--DISABLED_BACKGROUND-IMAGE);
 }
 
@@ -2830,7 +3427,8 @@ input.ids-time:disabled, .ids-textarea:disabled, .ids-input:disabled, .ids-selec
 /*******
 * Accessibility
 ********/
-.ids-textarea.ids-input--light {
+/* headings */
+.ids-textarea.ids-input--light, .ids-textarea.ids-textarea--light {
   background-color: white;
 }
 .ids-textarea.ids-textarea--autosize {
@@ -2869,15 +3467,15 @@ input.ids-time, .ids-input, .ids-select, .ids-textarea {
   color: var(--IDS-INPUT_COLOR);
   display: block;
 }
-input.ids-time.ids-input--invalid, .ids-input.ids-input--invalid, .ids-textarea.ids-input--invalid {
+input.ids-time.ids-input--invalid, .ids-input.ids-input--invalid, .ids-textarea.ids-input--invalid, .ids-textarea.ids-textarea--invalid {
   background: var(--IDS-FORM--INVALID__BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--INVALID_BACKGROUND-IMAGE);
 }
 
 input.ids-time:disabled, .ids-input:disabled, .ids-select:disabled, .ids-textarea:disabled {
   background: var(--IDS-INPUT--DISABLED_BACKGROUND-COLOR);
-  border: 1px solid transparent;
+  border: none;
   background-image: var(--IDS-INPUT--DISABLED_BACKGROUND-IMAGE);
 }
 
@@ -2906,6 +3504,7 @@ input.ids-time:disabled, .ids-input:disabled, .ids-select:disabled, .ids-textare
 /*******
 * Accessibility
 ********/
+/* headings */
 .ids-time-input-wrapper {
   position: relative;
   display: flex;
@@ -3093,9 +3692,7 @@ select::placeholder {
   --IDS-CHECKBOX-CHECK--DISABLED_BACKGROUND-IMAGE: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="16" height="11" viewBox="0 0 40 32" fill="none"><path xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" d="M39.1772 0.674536C40.2151 1.62733 40.2798 3.23649 39.3218 4.26869L14.343 31.1817C13.8554 31.7071 13.1679 32.0041 12.4489 32C11.73 31.9958 11.046 31.6909 10.5646 31.1598L0.658175 20.2339C-0.287695 19.1907 -0.20415 17.5824 0.844778 16.6417C1.8937 15.7009 3.51081 15.784 4.45668 16.8273L12.4859 25.6828L35.5634 0.818302C36.5214 -0.213896 38.1394 -0.278263 39.1772 0.674536Z" fill="%23808285"></path></svg>');
   /* INPUT */
   --IDS-INPUT--INVALID_BACKGROUND-IMAGE: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='10' ry='10' stroke='%23c12143' stroke-width='1' stroke-dasharray='5' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
-  --IDS-INPUT--DISABLED_BACKGROUND-COLOR: var(
-    --IDS-FORM--DISABLED__BACKGROUND-COLOR
-  );
+  --IDS-INPUT--DISABLED_BACKGROUND-COLOR: var(--IDS-FORM--DISABLED__BACKGROUND-COLOR);
   --IDS-INPUT--DISABLED_BACKGROUND-IMAGE: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='10' ry='10' stroke='%23808285' stroke-width='1' stroke-dasharray='3%2c 3%2c 3%2c 3' stroke-dashoffset='16' stroke-linecap='butt'/%3e%3c/svg%3e");
   --IDS-INPUT_BACKGROUND: var(--IDS-COLOR-ACCENT-95);
   --IDS-INPUT_BORDER: 1px solid var(--IDS-COLOR-ACCENT-40);
@@ -3112,20 +3709,20 @@ select::placeholder {
   --IDS-RADIO__BACKGROUND-COLOR: var(--IDS-COLOR-ACCENT-95);
   --IDS-RADIO__BORDER: 0.0625rem solid var(--IDS-COLOR-ACCENT-40);
   --IDS-RADIO--CHECKED__BACKGROUND-COLOR: var(--IDS-COLOR-ACCENT-40);
-  --IDS-RADIO--CHECKED__BOX-SHADOW: inset 0 0 0 2px
-    var(--IDS-RADIO__BACKGROUND-COLOR);
+  --IDS-RADIO--DISABLED__BACKGROUND-COLOR: var(--IDS-COLOR-NEUTRAL-99);
+  --IDS-RADIO--CHECKED-DISABLED__BACKGROUND-COLOR: var(--IDS-COLOR-NEUTRAL-50);
+  --IDS-RADIO--INVALID__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-90);
   --IDS-RADIO--DISABLED_BACKGROUND-IMAGE: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='10' ry='10' stroke='%23808285' stroke-width='1' stroke-dasharray='3%2c 3%2c 3%2c 3' stroke-dashoffset='16' stroke-linecap='butt'/%3e%3c/svg%3e");
   --IDS-RADIO--INVALID_BACKGROUND-IMAGE: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%23c12143' stroke-width='1' stroke-dasharray='4%2c 4%2c 4%2c 4' stroke-dashoffset='16' stroke-linecap='butt'/%3e%3c/svg%3e");
   /* SELECT */
   --IDS-SELECT__CHEVRON-ICON: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" role="img" fill="none" width="7" height="12" style="" viewBox="0 0 7 12" aria-hidden="true"><!--%3Flit$300635863$--><g><path d="M4.1627 5.57692L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L6.28403 4.86982C6.67456 5.26034 6.67455 5.89351 6.28402 6.28404L1.7071 10.8609C1.31657 11.2514 0.683406 11.2514 0.292886 10.8608C-0.0976345 10.4703 -0.0976276 9.83715 0.292901 9.44663L4.1627 5.57692Z" fill="%23396291"></path></g></svg>');
   --IDS-SELECT--INVALID__CHEVRON-ICON: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" role="img" fill="none" width="7" height="12" style="" viewBox="0 0 7 12" aria-hidden="true"><!--%3Flit$300635863$--><g><path d="M4.1627 5.57692L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L6.28403 4.86982C6.67456 5.26034 6.67455 5.89351 6.28402 6.28404L1.7071 10.8609C1.31657 11.2514 0.683406 11.2514 0.292886 10.8608C-0.0976345 10.4703 -0.0976276 9.83715 0.292901 9.44663L4.1627 5.57692Z" fill="%23c12143"></path></g></svg>');
   --IDS-SELECT--DISABLED__CHEVRON-ICON: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" role="img" fill="none" width="7" height="12" style="" viewBox="0 0 7 12" aria-hidden="true"><!--%3Flit$300635863$--><g><path d="M4.1627 5.57692L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L6.28403 4.86982C6.67456 5.26034 6.67455 5.89351 6.28402 6.28404L1.7071 10.8609C1.31657 11.2514 0.683406 11.2514 0.292886 10.8608C-0.0976345 10.4703 -0.0976276 9.83715 0.292901 9.44663L4.1627 5.57692Z" fill="%23808285"></path></g></svg>');
+  --IDS-SELECT__CHEVRON-ICON--HOVER: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" role="img" fill="none" width="7" height="12" style="" viewBox="0 0 7 12" aria-hidden="true"><!--%3Flit$300635863$--><g><path d="M4.1627 5.57692L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893C0.683418 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L6.28403 4.86982C6.67456 5.26034 6.67455 5.89351 6.28402 6.28404L1.7071 10.8609C1.31657 11.2514 0.683406 11.2514 0.292886 10.8608C-0.0976345 10.4703 -0.0976276 9.83715 0.292901 9.44663L4.1627 5.57692Z" fill="rgb(59,66,102)"></path></g></svg>');
   /* Toggle */
   --IDS-TOGGLE__BACKGROUND-COLOR: var(--IDS-COLOR-NEUTRAL-50);
   --IDS-TOGGLE--ACTIVE__BACKGROUND-COLOR: var(--IDS-COLOR-SUCCESS-40);
-  --IDS-TOGGLE--DISABLED__BACKGROUND-COLOR: var(
-    --IDS-FORM--DISABLED__BACKGROUND-COLOR
-  );
+  --IDS-TOGGLE--DISABLED__BACKGROUND-COLOR: var(--IDS-FORM--DISABLED__BACKGROUND-COLOR);
   --IDS-TOGGLE-ICON__COLOR: var(--IDS-COLOR-NEUTRAL-20);
   --IDS-TOGGLE-ICON--ACTIVE__COLOR: var(--IDS-COLOR-SUCCESS-30);
   --IDS-TOGGLE-ICON--DISABLED__COLOR: var(--IDS-COLOR-NEUTRAL-40);
@@ -3137,63 +3734,66 @@ select::placeholder {
   /* Range */
   --IDS-RANGE__BACKGROUND-COLOR: var(--IDS-COLOR-NEUTRAL-90);
   --IDS-RANGE-SELECTION__BACKGROUND-COLOR: var(--IDS-COLOR-ACCENT-40);
-  --IDS-RANGE-THUMB__BACKGROUND-COLOR: var(
-    --IDS-RANGE-SELECTION__BACKGROUND-COLOR
-  );
+  --IDS-RANGE-THUMB__BACKGROUND-COLOR: var(--IDS-RANGE-SELECTION__BACKGROUND-COLOR);
   --IDS-RANGE-TICK-LINE__COLOR: var(--IDS-COLOR-NEUTRAL-50);
   --IDS-RANGE-TICK__COLOR: var(--IDS-COLOR-NEUTRAL-20);
   --IDS-RANGE-SELECTION--DISABLED__COLOR: var(--IDS-COLOR-NEUTRAL-50);
+  /* Description list*/
+  --IDS-DESCRIPTION-LIST__DISPLAY: flex;
+  --IDS-DESCRIPTION-LIST__BORDER: 0;
+  --IDS-DESCRIPTION-LIST__BORDER-RADIUS: 0;
+  --IDS-DESCRIPTION-LIST-TERM__PADDING: 0;
+  --IDS-DESCRIPTION-LIST-TERM__BACKGROUND-COLOR: transparent;
+  --IDS-DESCRIPTION-LIST-DESCRIPTION__MARGIN-BOTTOM: 12px;
+  --IDS-DESCRIPTION-LIST-DESCRIPTION__PADDING: 0;
+  --IDS-DESCRIPTION-LIST__DISPLAY--COLUMN: grid;
+  --IDS-DESCRIPTION-LIST__BORDER--COLUMN: 1px solid var(--IDS-COLOR-PRIMARY-30);
+  --IDS-DESCRIPTION-LIST__BORDER-RADIUS--COLUMN: 5px;
+  --IDS-DESCRIPTION-LIST-TERM__PADDING--COLUMN: 8px 8px 8px 16px;
+  --IDS-DESCRIPTION-LIST-TERM__BACKGROUND-COLOR--COLUMN: var(--IDS-COLOR-PRIMARY-90);
+  --IDS-DESCRIPTION-LIST-DESCRIPTION__MARGIN-BOTTOM--COLUMN: 0;
+  --IDS-DESCRIPTION-LIST-DESCRIPTION__PADDING--COLUMN: 8px 16px 8px 8px;
   /********************************************************************
   /* Font families */
   --font-family_1: "Open Sans";
   --font-family_2: "Inter";
-  --header-1-font-family: var(--font-family_2);
-  --header-1-font-size: 3rem;
-  --header-1-font-size-small: 2.125rem;
-  --header-1-font-weight: 700;
-  --header-1-letter-spacing: -0.051875rem;
-  --header-1-line-height: 3.25rem;
-  --header-1-line-height-small: 2.5rem;
-  --header-1-small-font-family: var(--font-family_2);
-  --header-1-small-font-size: 2.25rem;
-  --header-1-small-font-size-small: 1.625rem;
-  --header-1-small-font-weight: 700;
-  --header-1-small-letter-spacing: -0.0625rem;
-  --header-1-small-line-height: 2.875rem;
-  --header-1-small-line-height-small: 2.125rem;
-  --header-2-font-family: var(--font-family_2);
-  --header-2-font-size: 1.5rem;
-  --header-2-font-size-small: 1.375rem;
-  --header-2-font-weight: 700;
-  --header-2-letter-spacing: -0.01875rem;
-  --header-2-line-height: 1.875rem;
-  --header-2-line-height-small: 1.75rem;
-  --header-3-font-family: var(--font-family_2);
-  --header-3-font-size: 1.25rem;
-  --header-3-font-weight: 700;
-  --header-3-letter-spacing: -0.025rem;
-  --header-3-line-height: 1.875rem;
-  --header-4-font-family: var(--font-family_2);
-  --header-4-font-size: 1rem;
-  --header-4-font-weight: 700;
-  --header-4-letter-spacing: 0;
-  --header-4-line-height: 1.25rem;
-  --header-5-font-family: var(--font-family_2);
-  --header-5-font-size: 1.25rem;
-  --header-5-font-size-small: 1.5rem;
-  --header-5-font-weight: 400;
-  --header-5-letter-spacing: 0.09375rem;
-  --header-5-line-height: 2.125rem;
-  --header-5-line-height-small: 1.5rem;
-  --header-6-font-family: var(--font-family_2);
-  --header-6-font-size: 0.875rem;
-  --header-6-font-weight: 400;
-  --header-6-letter-spacing: 0.0875rem;
-  --header-6-line-height: 1.25rem;
+  --heading-1-font-family: var(--font-family_2);
+  --heading-1-font-size: 3rem;
+  --heading-1-font-size-small: 2.125rem;
+  --heading-1-font-weight: 700;
+  --heading-1-letter-spacing: -0.051875rem;
+  --heading-1-line-height: 3.25rem;
+  --heading-1-line-height-small: 2.5rem;
+  --heading-1-small-font-family: var(--font-family_2);
+  --heading-1-small-font-size: 2.25rem;
+  --heading-1-small-font-size-small: 1.625rem;
+  --heading-1-small-font-weight: 700;
+  --heading-1-small-letter-spacing: -0.0625rem;
+  --heading-1-small-line-height: 2.875rem;
+  --heading-1-small-line-height-small: 2.125rem;
+  --heading-2-font-family: var(--font-family_2);
+  --heading-2-font-size: 1.5rem;
+  --heading-2-font-size-small: 1.375rem;
+  --heading-2-font-weight: 700;
+  --heading-2-letter-spacing: -0.01875rem;
+  --heading-2-line-height: 1.875rem;
+  --heading-2-line-height-small: 1.75rem;
+  --heading-3-font-family: var(--font-family_2);
+  --heading-3-font-size: 1.25rem;
+  --heading-3-font-weight: 700;
+  --heading-3-letter-spacing: -0.025rem;
+  --heading-3-line-height: 1.875rem;
+  --heading-4-font-family: var(--font-family_2);
+  --heading-4-font-size: 1rem;
+  --heading-4-font-weight: 700;
+  --heading-4-letter-spacing: 0;
+  --heading-4-line-height: 1.25rem;
+  --bullet-list-marker-color: var(--IDS-COLOR-PRIMARY-40);
+  --bullet-list-marker-font-weight: bold;
   /**********************
     * General
     **********************/
-  --IDS_BORDER-RADIUS: 10px;
+  --IDS-BORDER-RADIUS: 10px;
   --IDS-BASE__FONT-COLOR: var(--IDS-COLOR-NEUTRAL-20);
   --IDS-SCROLL_BACKGROUND-COLOR: var(--IDS-COLOR-ACCENT-95);
   --IDS-SCROLL_COLOR: var(--IDS-COLOR-ACCENT-40);
@@ -3300,7 +3900,6 @@ select::placeholder {
   --carousel-slides_background-color: var(--IDS-COLOR-NEUTRAL-99);
   --carousel-description_background-color: white;
   --carousel-description_color: var(--IDS-COLOR-NEUTRAL-40);
-  --carousel-description--mobile_padding: 0px;
   /* Content navigation */
   --content-navigation_border: none;
   --content-navigation_border-radius: 10px;
@@ -3310,7 +3909,6 @@ select::placeholder {
   --content-navigation_font-size: 1.25rem;
   --content-navigation_line-height: 24px;
   --content-navigation_letter-spacing: -0.4px;
-  --content-navigation_text-transform: none;
   --content-navigation-separator_background-color: var(--IDS-COLOR-ACCENT-90);
   --content-navigation_color: var(--IDS-COLOR-NEUTRAL-20);
   /* Card */
@@ -3328,8 +3926,7 @@ select::placeholder {
   --IDS-CARD--HOVER_BOX-SHADOW: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
   --IDS-CARD--FILL__INNER__BACKGROUND: var(--IDS-COLOR-PRIMARY-90);
   --IDS-CARD--FILL__INNER__BORDER: 1px solid var(--IDS-COLOR-PRIMARY-30);
-  --IDS-CARD--FILL__INNER__BORDER-INTERACTIVE: 1px solid
-    var(--IDS-COLOR-ACCENT-30);
+  --IDS-CARD--FILL__INNER__BORDER-INTERACTIVE: 1px solid var(--IDS-COLOR-ACCENT-30);
   --IDS-CARD--FILL-2__INNER__BACKGROUND: var(--IDS-COLOR-ACCENT-95);
   --IDS-CARD--FILL-2__INNER__BORDER: 1px solid var(--IDS-COLOR-ACCENT-30);
   /* Forms */
@@ -3355,6 +3952,9 @@ select::placeholder {
   --dialog_border-radius: 10px;
   --dialog-headline_color: var(--IDS-COLOR-PRIMARY-40);
   --dialog-headline_font-family: var(--font-family_2);
+  /* Dropdown */
+  --IDS-DROPDOWN__BORDER-COLOR: var(--IDS-COLOR-NEUTRAL-50);
+  --IDS-DROPDOWN__LINK__BORDER-RADIUS: 5px;
   /* Error message content */
   /* Expandable */
   --expandable_border-bottom: 1px solid var(--IDS-COLOR-NEUTRAL-90);
@@ -3434,6 +4034,8 @@ select::placeholder {
   --list_color: var(--IDS-COLOR-NEUTRAL-20);
   --list-item-info_color: var(--IDS-COLOR-NEUTRAL-20);
   --list-item-interactive_border-bottom: var(--IDS-COLOR-ACCENT-30) 5px solid;
+  /* List pagniation */
+  --IDS-LIST-PAGINATION-LINK--FONT-FAMILY: var(--font-family_2);
   /* Mobile Menu Remake */
   /* Level 1 */
   --IDS-MOBILE-MENU-ITEM--FONT-FAMILY: var(--font-family_1);
@@ -3444,34 +4046,22 @@ select::placeholder {
   --IDS-MOBILE-MENU-ITEM__ICON__COLOR: white;
   /* Level 1 - ACTIVE */
   --IDS-MOBILE-MENU-ITEM--ACTIVE__INNER__BEFORE__BACKGROUND-COLOR: white;
-  --IDS-MOBILE-MENU-ITEM--ACTIVE__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU-ITEM--ACTIVE__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 1 - HAS-CHILDREN */
-  --IDS-MOBILE-MENU-ITEM--HAS-CHILDREN__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU-ITEM--HAS-CHILDREN__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 1 - EXPANDED */
-  --IDS-MOBILE-MENU-ITEM--EXPANDED__INNER__BEFORE__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU-ITEM--EXPANDED__INNER__BEFORE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 1 - OUTLINE */
   --IDS-MOBILE-MENU-ITEM--FOCUS--OUTLINE-COLOR: white;
   /* Level 1 - SECONDARY */
-  --IDS-MOBILE-MENU-ITEM--SECONDARY--FOCUS--OUTLINE-COLOR: var(
-    --focus-outline_color
-  );
+  --IDS-MOBILE-MENU-ITEM--SECONDARY--FOCUS--OUTLINE-COLOR: var(--focus-outline_color);
   --IDS-MOBILE-MENU-ITEM--SECONDARY__INNER__COLOR: var(--IDS-COLOR-PRIMARY-40);
-  --IDS-MOBILE-MENU-ITEM--SECONDARY__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-90
-  );
+  --IDS-MOBILE-MENU-ITEM--SECONDARY__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-90);
   --IDS-MOBILE-MENU-ITEM--SECONDARY--ACTIVE__INNER__BEFORE__BACKGROUND-COLOR: var(
     --IDS-COLOR-PRIMARY-40
   );
   /* Level 1 - Variation 2 */
-  --IDS-MOBILE-MENU--2-ITEM__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   --IDS-MOBILE-MENU--2-ITEM__INNER__COLOR: white;
   --IDS-MOBILE-MENU--2-ITEM__INNER__BORDER-BOTTOM: 1px solid white;
   --IDS-MOBILE-MENU--2-ITEM__INNER__FONT-WEIGHT: 700;
@@ -3479,46 +4069,31 @@ select::placeholder {
   --IDS-MOBILE-MENU--2-ITEM__INNER__BORDER-BOTTOM-COLOR: white;
   /* Level 1 - ACTIVE */
   --IDS-MOBILE-MENU--2-ITEM--ACTIVE__INNER__BEFORE__BACKGROUND-COLOR: white;
-  --IDS-MOBILE-MENU--2-ITEM--ACTIVE__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM--ACTIVE__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 1 - HAS-CHILDREN */
-  --IDS-MOBILE-MENU--2-ITEM--HAS-CHILDREN__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM--HAS-CHILDREN__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 1 - EXPANDED */
-  --IDS-MOBILE-MENU--2-ITEM--EXPANDED__INNER__BEFORE__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM--EXPANDED__INNER__BEFORE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 1 - OUTLINE */
   --IDS-MOBILE-MENU--2-ITEM--FOCUS--OUTLINE-COLOR: white;
   /* Level 2 */
   --IDS-MOBILE-MENU-ITEM--2__INNER__BACKGROUND-COLOR: white;
   --IDS-MOBILE-MENU-ITEM--2__INNER__COLOR: var(--IDS-COLOR-PRIMARY-40);
-  --IDS-MOBILE-MENU-ITEM--2__INNER__BORDER-BOTTOM: 1px solid
-    var(--IDS-COLOR-PRIMARY-40);
+  --IDS-MOBILE-MENU-ITEM--2__INNER__BORDER-BOTTOM: 1px solid var(--IDS-COLOR-PRIMARY-40);
   --IDS-MOBILE-MENU-ITEM--2__INNER__FONT-WEIGHT: normal;
   --IDS-MOBILE-MENU-ITEM--2__ICON__COLOR: var(--IDS-COLOR-PRIMARY-40);
-  --IDS-MOBILE-MENU-ITEM--2__INNER__BEFORE__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-90
-  );
+  --IDS-MOBILE-MENU-ITEM--2__INNER__BEFORE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-90);
   /* Level 2 - ACTIVE */
-  --IDS-MOBILE-MENU-ITEM--2--ACTIVE__INNER__BEFORE__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU-ITEM--2--ACTIVE__INNER__BEFORE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   --IDS-MOBILE-MENU-ITEM--2--ACTIVE__INNER__FONT-WEIGHT: normal;
   /* Level 2 - HAS CHILDREN */
   --IDS-MOBILE-MENU-ITEM--2--HAS-CHILDREN__INNER__FONT-WEIGHT: normal;
   /* Level 2 - EXPANDED */
-  --IDS-MOBILE-MENU-ITEM--2--EXPANDED__INNER__BEFORE__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU-ITEM--2--EXPANDED__INNER__BEFORE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 2 - OUTLINE */
   --IDS-MOBILE-MENU-ITEM--2--FOCUS--OUTLINE-COLOR: var(--focus-outline_color);
   /* Level 2 - Variation 2 */
-  --IDS-MOBILE-MENU--2-ITEM--2__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM--2__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   --IDS-MOBILE-MENU--2-ITEM--2__INNER__COLOR: white;
   --IDS-MOBILE-MENU--2-ITEM--2__INNER__BORDER-BOTTOM-COLOR: white;
   --IDS-MOBILE-MENU--2-ITEM--2__ICON__COLOR: white;
@@ -3534,15 +4109,11 @@ select::placeholder {
   );
   /* Level 2 - OUTLINE */
   --IDS-MOBILE-MENU--2-ITEM--2--FOCUS--OUTLINE-COLOR: white;
-  --IDS-MOBILE-MENU--2-ITEM--2__INNER__BEFORE__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM--2__INNER__BEFORE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Level 3 - OUTLINE */
   --IDS-MOBILE-MENU-ITEM--3--FOCUS--OUTLINE-COLOR: var(--focus-outline_color);
   /* Level 3 - VARIATION 2 */
-  --IDS-MOBILE-MENU--2-ITEM--3__INNER__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM--3__INNER__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   --IDS-MOBILE-MENU--2-ITEM--3__INNER__COLOR: white;
   --IDS-MOBILE-MENU--2-ITEM--3__INNER__BORDER-BOTTOM-COLOR: white;
   --IDS-MOBILE-MENU--2-ITEM--3__ICON__COLOR: white;
@@ -3559,9 +4130,7 @@ select::placeholder {
   --IDS-MOBILE-MENU--2-ITEM--3--EXPANDED__INNER__BEFORE__BACKGROUND-COLOR: var(
     --IDS-COLOR-PRIMARY-40
   );
-  --IDS-MOBILE-MENU--2-ITEM--3__INNER__BEFORE__BACKGROUND-COLOR: var(
-    --IDS-COLOR-PRIMARY-40
-  );
+  --IDS-MOBILE-MENU--2-ITEM--3__INNER__BEFORE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   /* Progressbar */
   --progressbar_border: 1px solid var(--IDS-COLOR-ACCENT-40);
   --progressbar-fill_background-color: var(--IDS-COLOR-ACCENT-40);
@@ -3576,9 +4145,7 @@ select::placeholder {
   --mobile-MENU-ITEM--2_box-shadow: inset rgb(53 53 53 / 20%) 0px 2px 4px 0px;
   --mobile-MENU-ITEM--2-first_box-shadow: 0 2px 4px 0 rgb(53 53 53 / 20%);
   --mobile-menu-sub-item-2_background-color: var(--IDS-COLOR-NEUTRAL-100);
-  --mobile-menu-sub-item-2-no-children_border-left: var(
-    --IDS-COLOR-NEUTRAL-100
-  );
+  --mobile-menu-sub-item-2-no-children_border-left: var(--IDS-COLOR-NEUTRAL-100);
   --mobile-menu-avatar-link: var(--IDS-COLOR-PRIMARY-35);
   /* Local navigation */
   --navigation-local_border-top: 1px solid rgba(193, 33, 67, 0.3);
@@ -3593,18 +4160,20 @@ select::placeholder {
   --IDS-NOTIFICATION-BADGE__BACKGROUND-COLOR: var(--IDS-COLOR-PRIMARY-40);
   --IDS-NOTIFICATION-BADGE__COLOR: white;
   /* Tag */
-  --IDS-TAG__BACKGROUND-COLOR: var(--IDS-COLOR-ACCENT-95);
+  --IDS-TAG__BACKGROUND-COLOR: transparent;
   --IDS-TAG__FONT-FAMILY: var(--font-family_2);
-  --IDS-TAG__BORDER-COLOR: var(--IDS-COLOR-ACCENT-90);
-  --IDS-TAG__BORDER-RADIUS: 100px;
+  --IDS-TAG__BORDER-COLOR: var(--IDS-COLOR-NEUTRAL-50);
+  --IDS-TAG__BORDER-RADIUS: 5px;
+  --IDS-TAG__PADDING: 7px 15px;
   --IDS-TAG__ICON__COLOR: var(--IDS-COLOR-ACCENT-40);
-  --IDS-TAG__PADDING: 7px 20px;
   --IDS-TAG__COLOR: var(--IDS-COLOR-NEUTRAL-20);
   --IDS-TAG--INTERACTIVE__COLOR: var(--IDS-COLOR-ACCENT-40);
+  --IDS-TAG--INTERACTIVE__COLOR--HOVER: var(--IDS-COLOR-ACCENT-30);
   --IDS-TAG--INTERACTIVE__FONT-WEIGHT: 700;
   --IDS-TAG--INTERACTIVE__BORDER-COLOR: var(--IDS-COLOR-ACCENT-40);
   /* Tooltip */
-  --tooltip_border-color: var(--IDS-COLOR-NEUTRAL-50);
+  --tooltip_color: var(--IDS-COLOR-NEUTRAL-20);
+  --tooltip_border-color: var(--IDS-COLOR-NEUTRAL-40);
   /* Select */
   --select_border: 1px solid var(--IDS-COLOR-ACCENT-40);
   --select_padding-right: 60px;
@@ -3623,26 +4192,22 @@ select::placeholder {
   --stepper-step-indicator_color: var(--IDS-COLOR-ACCENT-40);
   --stepper-step-indicator_font-family: var(--font-family_2);
   --stepper-step-chevron_color: var(--IDS-COLOR-ACCENT-40);
-  --stepper-step-indicator-selected_background-color: var(
-    --IDS-COLOR-ACCENT-40
-  );
+  --stepper-step-indicator-selected_background-color: var(--IDS-COLOR-ACCENT-40);
   --stepper-step-indicator-valid-icon_color: var(--IDS-COLOR-SUCCESS-30);
   --stepper-step-indicator-valid_background-color: var(--IDS-COLOR-SUCCESS-99);
   --stepper-step-indicator-valid_border: 1px solid var(--IDS-COLOR-SUCCESS-40);
   --stepper-step-indicator-invalid-icon_color: var(--IDS-COLOR-PRIMARY-40);
-  --stepper-step-indicator-invalid_background-color: var(
-    --IDS-COLOR-PRIMARY-90
-  );
-  --stepper-step-indicator-invalid_border: 1px dashed
-    var(--IDS-COLOR-PRIMARY-40);
+  --stepper-step-indicator-invalid_background-color: var(--IDS-COLOR-PRIMARY-90);
+  --stepper-step-indicator-invalid_border: 1px dashed var(--IDS-COLOR-PRIMARY-40);
   /* Spinner */
   --spinner_color: var(--IDS-COLOR-ACCENT-40);
   /* Tab */
   --IDS-TABS_BORDER-BOTTOM: 4px solid var(--IDS-COLOR-ACCENT-90);
-  --IDS-TAB_BORDER: 1px solid var(--IDS-COLOR-NEUTRAL-50);
+  --IDS-TAB_BORDER: 1px solid transparent;
+  --IDS-TAB--SELECTED-BORDER: 1px solid var(--IDS-COLOR-NEUTRAL-50);
   --IDS-TAB_BORDER-RADIUS: 10px 10px 0px 0px;
-  --IDS-TAB_COLOR: var(--IDS-COLOR-ACCENT-30);
-  --IDS-TAB--SELECTED_COLOR: var(--IDS-COLOR-NEUTRAL-20);
+  --IDS-TAB_COLOR: var(--IDS-COLOR-ACCENT-40);
+  --IDS-TAB--SELECTED_COLOR: var(--IDS-COLOR-ACCENT-30);
   --IDS-TAB-ICON_COLOR: var(--IDS-COLOR-ACCENT-40);
   --IDS-TAB-ICON_COLOR2: var(--IDS-COLOR-ACCENT-30);
   --IDS-TAB--SELECTED_BOX-SHADOW: 0px 0px 4px rgba(0, 0, 0, 0.3);
@@ -3691,6 +4256,8 @@ select::placeholder {
   --icon-color2-preset3: var(--IDS-COLOR-NEUTRAL-20);
   --icon-color-preset4: white;
   --icon-color2-preset4: white;
+  --IDS-ICON-COLOR: var(--IDS-COLOR-ACCENT-40);
+  --IDS-ICON-ACTIVE-COLOR: var(--IDS-COLOR-ACCENT-30);
 }
 
 /**********************
@@ -3740,48 +4307,48 @@ ids-input input[type=search]::-webkit-search-results-decoration {
 .ids .ids-heading-1 {
   color: var(--IDS-COLOR-PRIMARY-40);
   font-style: normal;
-  font-family: var(--header-1-font-family);
-  font-size: var(--header-1-font-size);
-  font-weight: var(--header-1-font-weight);
-  letter-spacing: var(--header-1-letter-spacing);
-  line-height: var(--header-1-line-height);
+  font-family: var(--heading-1-font-family);
+  font-size: var(--heading-1-font-size);
+  font-weight: var(--heading-1-font-weight);
+  letter-spacing: var(--heading-1-letter-spacing);
+  line-height: var(--heading-1-line-height);
 }
 @media (max-width: 1024px) {
   .ids .ids-heading-1 {
-    font-size: var(--header-1-font-size-small);
-    line-height: var(--header-1-line-height-small);
+    font-size: var(--heading-1-font-size-small);
+    line-height: var(--heading-1-line-height-small);
   }
 }
 
 .ids .ids-heading-1.ids-small {
   color: var(--IDS-COLOR-PRIMARY-40);
   font-style: normal;
-  font-family: var(--header-1-small-font-family);
-  font-size: var(--header-1-small-font-size);
-  font-weight: var(--header-1-small-font-weight);
-  letter-spacing: var(--header-1-small-letter-spacing);
-  line-height: var(--header-1-small-line-height);
+  font-family: var(--heading-1-small-font-family);
+  font-size: var(--heading-1-small-font-size);
+  font-weight: var(--heading-1-small-font-weight);
+  letter-spacing: var(--heading-1-small-letter-spacing);
+  line-height: var(--heading-1-small-line-height);
 }
 @media (max-width: 1024px) {
   .ids .ids-heading-1.ids-small {
-    font-size: var(--header-1-small-font-size-small);
-    line-height: var(--header-1-small-line-height-small);
+    font-size: var(--heading-1-small-font-size-small);
+    line-height: var(--heading-1-small-line-height-small);
   }
 }
 
 .ids .ids-heading-2 {
   color: var(--IDS-COLOR-PRIMARY-40);
   font-style: normal;
-  font-family: var(--header-2-font-family);
-  font-size: var(--header-2-font-size);
-  font-weight: var(--header-2-font-weight);
-  letter-spacing: var(--header-2-letter-spacing);
-  line-height: var(--header-2-line-height);
+  font-family: var(--heading-2-font-family);
+  font-size: var(--heading-2-font-size);
+  font-weight: var(--heading-2-font-weight);
+  letter-spacing: var(--heading-2-letter-spacing);
+  line-height: var(--heading-2-line-height);
 }
 @media (max-width: 1024px) {
   .ids .ids-heading-2 {
-    font-size: var(--header-2-font-size-small);
-    line-height: var(--header-2-line-height-small);
+    font-size: var(--heading-2-font-size-small);
+    line-height: var(--heading-2-line-height-small);
   }
 }
 
@@ -3799,11 +4366,11 @@ ids-input input[type=search]::-webkit-search-results-decoration {
 .ids .ids-heading-3 {
   color: var(--IDS-COLOR-NEUTRAL-20);
   font-style: normal;
-  font-family: var(--header-3-font-family);
-  font-size: var(--header-3-font-size);
-  font-weight: var(--header-3-font-weight);
-  letter-spacing: var(--header-3-letter-spacing);
-  line-height: var(--header-3-line-height);
+  font-family: var(--heading-3-font-family);
+  font-size: var(--heading-3-font-size);
+  font-weight: var(--heading-3-font-weight);
+  letter-spacing: var(--heading-3-letter-spacing);
+  line-height: var(--heading-3-line-height);
 }
 
 .ids .ids-heading-3 .ids-anchor:link,
@@ -3820,11 +4387,11 @@ ids-input input[type=search]::-webkit-search-results-decoration {
 .ids .ids-heading-4 {
   color: var(--IDS-COLOR-NEUTRAL-20);
   font-style: normal;
-  font-family: var(--header-4-font-family);
-  font-size: var(--header-4-font-size);
-  font-weight: var(--header-4-font-weight);
-  letter-spacing: var(--header-4-letter-spacing);
-  line-height: var(--header-4-line-height);
+  font-family: var(--heading-4-font-family);
+  font-size: var(--heading-4-font-size);
+  font-weight: var(--heading-4-font-weight);
+  letter-spacing: var(--heading-4-letter-spacing);
+  line-height: var(--heading-4-line-height);
 }
 
 .ids .ids-heading-4 .ids-anchor:link,
@@ -3839,31 +4406,23 @@ ids-input input[type=search]::-webkit-search-results-decoration {
 }
 
 .ids .ids-heading-5 {
-  color: var(--IDS-COLOR-NEUTRAL-40);
+  color: var(--IDS-COLOR-NEUTRAL-20);
   font-style: normal;
-  text-transform: uppercase;
-  font-family: var(--header-5-font-family);
-  font-size: var(--header-5-font-size);
-  font-weight: var(--header-5-font-weight);
-  letter-spacing: var(--header-5-letter-spacing);
-  line-height: var(--header-5-line-height);
-}
-@media (max-width: 1024px) {
-  .ids .ids-heading-5 {
-    font-size: var(--header-5-font-size-small);
-    line-height: var(--header-5-line-height-small);
-  }
+  font-family: var(--heading-3-font-family);
+  font-size: var(--heading-3-font-size);
+  font-weight: var(--heading-3-font-weight);
+  letter-spacing: var(--heading-3-letter-spacing);
+  line-height: var(--heading-3-line-height);
 }
 
 .ids .ids-heading-6 {
-  color: var(--IDS-COLOR-NEUTRAL-40);
+  color: var(--IDS-COLOR-NEUTRAL-20);
   font-style: normal;
-  text-transform: uppercase;
-  font-family: var(--header-6-font-family);
-  font-size: var(--header-6-font-size);
-  font-weight: var(--header-6-font-weight);
-  letter-spacing: var(--header-6-letter-spacing);
-  line-height: var(--header-6-line-height);
+  font-family: var(--heading-4-font-family);
+  font-size: var(--heading-4-font-size);
+  font-weight: var(--heading-4-font-weight);
+  letter-spacing: var(--heading-4-letter-spacing);
+  line-height: var(--heading-4-line-height);
 }
 
 .ids .ids-preamble {
@@ -3892,6 +4451,52 @@ ids-input input[type=search]::-webkit-search-results-decoration {
   line-height: 1.5rem;
 }
 
+.ids ul.ids-bullet-list,
+.ids .ids-bullet-list {
+  list-style: disc;
+  margin-left: 1.5rem;
+}
+.ids ul.ids-bullet-list li,
+.ids .ids-bullet-list li {
+  margin-bottom: 1rem;
+  padding-left: 0.5rem;
+  display: list-item;
+  color: var(--IDS-COLOR-NEUTRAL-20);
+  font-family: var(--font-family_1);
+  font-size: 1rem;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: 0px;
+  line-height: 1.5rem;
+}
+.ids ul.ids-bullet-list li::marker,
+.ids .ids-bullet-list li::marker {
+  color: var(--bullet-list-marker-color);
+}
+
+.ids ol.ids-numbered-list,
+.ids .ids-numbered-list {
+  list-style-type: decimal;
+  margin-left: 1.5rem;
+}
+.ids ol.ids-numbered-list li,
+.ids .ids-numbered-list li {
+  margin-bottom: 1rem;
+  padding-left: 0.5rem;
+  display: list-item;
+  color: var(--IDS-COLOR-NEUTRAL-20);
+  font-family: var(--font-family_1);
+  font-size: 1rem;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: 0px;
+  line-height: 1.5rem;
+}
+.ids ol.ids-numbered-list li::marker,
+.ids .ids-numbered-list li::marker {
+  font-weight: var(--bullet-list-marker-font-weight);
+}
+
 .ids .ids-body.ids-disabled {
   color: var(--IDS-COLOR-NEUTRAL-20);
   font-style: italic;