.ids-bg-1 {
  background-color: var(--ids-color-surface-background-default);
}

.ids-bg-2 {
  background-color: var(--ids-color-surface-background-alternative);
}

/* Recommended max-width for content components */
.ids-container-max-width {
  max-width: var(--IDS__CONTAINER-MAX-WIDTH);
}

/* Recommended max-width for body text */
.ids-text-max-width {
  max-width: var(--IDS__TEXT-MAX-WIDTH);
}

.ids--light,
.ids--dark {
  /* Force elements to be displayed as block elements */
}
.ids--light .ids-block,
.ids--dark .ids-block {
  display: block !important;
}
.ids--light .ids-hide-overflow,
.ids--dark .ids-hide-overflow {
  overflow: hidden;
}
.ids--light,
.ids--dark {
  /* Removes native button styling */
}
.ids--light .ids-btn-no-styles,
.ids--dark .ids-btn-no-styles {
  background: none;
  color: inherit;
  border: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit;
  display: flex;
  border-radius: var(--IDS-BUTTON__BORDER-RADIUS);
}
.ids--light .ids-btn-no-styles:focus-visible,
.ids--dark .ids-btn-no-styles:focus-visible {
  outline: var(--IDS-FOCUS__OUTLINE);
  outline-offset: var(--IDS-FOCUS__OUTLINE-OFFSET);
}
.ids--light .ids-btn-plain,
.ids--dark .ids-btn-plain {
  background: none;
  border: none;
  cursor: pointer;
}
.ids--light .ids-link-no-styles,
.ids--dark .ids-link-no-styles {
  color: var(--IDS-LINK--COLOR-PRESET-1__COLOR);
  font-size: inherit;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
}
.ids--light .ids-link-no-styles:hover,
.ids--dark .ids-link-no-styles:hover {
  color: var(--IDS-LINK--COLOR-PRESET-1__HOVER-COLOR);
}
.ids--light .ids-hide,
.ids--dark .ids-hide {
  display: none;
}
.ids--light .ids-inline-block,
.ids--dark .ids-inline-block {
  display: inline-block;
}
.ids--light .ids-block,
.ids--dark .ids-block {
  display: block;
}
.ids--light .ids-inline,
.ids--dark .ids-inline {
  display: inline;
}
.ids--light .ids-flex,
.ids--dark .ids-flex {
  display: flex;
}
.ids--light .ids-inline-flex,
.ids--dark .ids-inline-flex {
  display: inline-flex;
}
.ids--light .ids-table,
.ids--dark .ids-table {
  display: table;
}
.ids--light .ids-inline-table,
.ids--dark .ids-inline-table {
  display: inline-table;
}
.ids--light .ids-table-caption,
.ids--dark .ids-table-caption {
  display: table-caption;
}
.ids--light .ids-table-cell,
.ids--dark .ids-table-cell {
  display: table-cell;
}
.ids--light .ids-table-column,
.ids--dark .ids-table-column {
  display: table-column;
}
.ids--light .ids-table-column-group,
.ids--dark .ids-table-column-group {
  display: table-column-group;
}
.ids--light .ids-table-footer-group,
.ids--dark .ids-table-footer-group {
  display: table-footer-group;
}
.ids--light .ids-table-header-group,
.ids--dark .ids-table-header-group {
  display: table-header-group;
}
.ids--light .ids-table-row-group,
.ids--dark .ids-table-row-group {
  display: table-row-group;
}
.ids--light .ids-table-row,
.ids--dark .ids-table-row {
  display: table-row;
}
.ids--light .ids-flow-root,
.ids--dark .ids-flow-root {
  display: flow-root;
}
.ids--light .ids-grid,
.ids--dark .ids-grid {
  display: grid;
}
.ids--light .ids-inline-grid,
.ids--dark .ids-inline-grid {
  display: inline-grid;
}
.ids--light .ids-contents,
.ids--dark .ids-contents {
  display: contents;
}
.ids--light .ids-hidden,
.ids--dark .ids-hidden {
  display: none;
}
.ids--light .ids-flex-1,
.ids--dark .ids-flex-1 {
  flex: 1 1 0%;
}
.ids--light .ids-flex-auto,
.ids--dark .ids-flex-auto {
  flex: 1 1 auto;
}
.ids--light .ids-flex-initial,
.ids--dark .ids-flex-initial {
  flex: 0 1 auto;
}
.ids--light .ids-flex-none,
.ids--dark .ids-flex-none {
  flex: none;
}
.ids--light .ids-pointer,
.ids--dark .ids-pointer {
  cursor: pointer;
}
.ids--light .ids-leading-10,
.ids--dark .ids-leading-10 {
  line-height: 2.5rem;
}
.ids--light .ids-leading-3,
.ids--dark .ids-leading-3 {
  line-height: 0.75rem;
}
.ids--light .ids-leading-4,
.ids--dark .ids-leading-4 {
  line-height: 1rem;
}
.ids--light .ids-leading-5,
.ids--dark .ids-leading-5 {
  line-height: 1.25rem;
}
.ids--light .ids-leading-6,
.ids--dark .ids-leading-6 {
  line-height: 1.5rem;
}
.ids--light .ids-leading-7,
.ids--dark .ids-leading-7 {
  line-height: 1.75rem;
}
.ids--light .ids-leading-8,
.ids--dark .ids-leading-8 {
  line-height: 2rem;
}
.ids--light .ids-leading-9,
.ids--dark .ids-leading-9 {
  line-height: 2.25rem;
}
.ids--light .ids-leading-loose,
.ids--dark .ids-leading-loose {
  line-height: 2;
}
.ids--light .ids-leading-none,
.ids--dark .ids-leading-none {
  line-height: 1;
}
.ids--light .ids-leading-normal,
.ids--dark .ids-leading-normal {
  line-height: 1.5;
}
.ids--light .ids-leading-relaxed,
.ids--dark .ids-leading-relaxed {
  line-height: 1.625;
}
.ids--light .ids-leading-snug,
.ids--dark .ids-leading-snug {
  line-height: 1.375;
}
.ids--light .ids-leading-tight,
.ids--dark .ids-leading-tight {
  line-height: 1.25;
}
.ids--light .ids-no-margin,
.ids--dark .ids-no-margin {
  margin: 0 !important;
}
.ids--light .ids-mb-auto,
.ids--dark .ids-mb-auto {
  margin-bottom: auto;
}
.ids--light .ids-me-auto,
.ids--dark .ids-me-auto {
  margin-inline-end: auto;
}
.ids--light .ids-ml-auto,
.ids--dark .ids-ml-auto {
  margin-left: auto;
}
.ids--light .ids-ms-auto,
.ids--dark .ids-ms-auto {
  margin-inline-start: auto;
}
.ids--light .ids-mt-auto,
.ids--dark .ids-mt-auto {
  margin-top: auto;
}
@media (max-width: 640px) {
  .ids--light .ids-hide-on-mobile,
  .ids--light .ids-hide-on-s,
  .ids--light .ids-s-hide,
  .ids--dark .ids-hide-on-mobile,
  .ids--dark .ids-hide-on-s,
  .ids--dark .ids-s-hide {
    display: none;
  }
  .ids--light .ids-fs-sm-1,
  .ids--dark .ids-fs-sm-1 {
    font-size: 0.75rem;
  }
  .ids--light .ids-fs-sm-2,
  .ids--dark .ids-fs-sm-2 {
    font-size: 0.875rem;
  }
}
@media (max-width: 1024px) {
  .ids--light .ids-hide-on-tablet,
  .ids--light .ids-hide-on-m,
  .ids--light .ids-m-hide,
  .ids--dark .ids-hide-on-tablet,
  .ids--dark .ids-hide-on-m,
  .ids--dark .ids-m-hide {
    display: none;
  }
}
@media (min-width: 1024px) {
  .ids--light .ids-hide-on-desktop,
  .ids--light .ids-d-hide,
  .ids--dark .ids-hide-on-desktop,
  .ids--dark .ids-d-hide {
    display: none;
  }
}