@carbon/charts 1.7.6 → 1.8.0

package/demo/styles.css

@@ -7621,6 +7621,48 @@ fieldset[disabled] .cds--form__helper-text {
   width: 100%;
 }
 
+.cds--contained-list .cds--search {
+  position: sticky;
+  z-index: 1;
+  top: 48px;
+}
+.cds--contained-list .cds--search.cds--search--expandable .cds--search-input {
+  background-color: var(--cds-field);
+}
+
+.cds--contained-list .cds--search .cds--search-input {
+  border-bottom: 1px solid var(--cds-border-subtle);
+  background-color: var(--cds-background, #ffffff);
+}
+
+.cds--contained-list .cds--search .cds--search-close::before {
+  display: none;
+}
+
+.cds--contained-list .cds--search .cds--search-close {
+  border-right: 2px solid transparent;
+  outline: none;
+}
+.cds--contained-list .cds--search .cds--search-close:focus {
+  outline: 2px solid var(--cds-focus, #0f62fe);
+  outline-offset: -2px;
+}
+@media screen and (prefers-contrast) {
+  .cds--contained-list .cds--search .cds--search-close:focus {
+    outline-style: dotted;
+  }
+}
+
+.cds--contained-list .cds--search .cds--search-input ~ .cds--search-close:hover {
+  border-bottom: 1px solid transparent;
+}
+
+.cds--contained-list .cds--search .cds--search-input:focus ~ .cds--search-close:hover {
+  border: 2px solid var(--cds-focus, #0f62fe);
+  border-left: 0;
+  outline: none;
+}
+
 .cds--contained-list--on-page.cds--contained-list--sm .cds--contained-list__header {
   height: 2rem;
 }
@@ -12314,6 +12356,10 @@ button.cds--dropdown-text:focus {
   font-weight: 600;
 }
 
+.cds--number .cds--number__input-wrapper--warning input[type=number] {
+  padding-right: 8rem;
+}
+
 .cds--number input[type=number] {
   font-size: var(--cds-body-compact-01-font-size, 0.875rem);
   font-weight: var(--cds-body-compact-01-font-weight, 400);
@@ -12326,7 +12372,7 @@ button.cds--dropdown-text:focus {
   min-width: 9.375rem;
   height: 2.5rem;
   box-sizing: border-box;
-  padding-right: 8rem;
+  padding-right: 6rem;
   padding-left: 1rem;
   border: 0;
   border-bottom: 0.0625rem solid var(--cds-border-strong);
@@ -12360,12 +12406,27 @@ button.cds--dropdown-text:focus {
 .cds--number input[type=number]::-webkit-inner-spin-button {
   appearance: none;
 }
+.cds--number input[type=number][data-invalid] {
+  padding-right: 8rem;
+}
 
 .cds--number--lg.cds--number input[type=number] {
+  padding-right: 7rem;
+}
+.cds--number--lg.cds--number input[type=number][data-invalid] {
+  padding-right: 9rem;
+}
+.cds--number--lg.cds--number .cds--number__input-wrapper--warning input[type=number] {
   padding-right: 9rem;
 }
 
 .cds--number--sm.cds--number input[type=number] {
+  padding-right: 5rem;
+}
+.cds--number--sm.cds--number input[type=number][data-invalid] {
+  padding-right: 7rem;
+}
+.cds--number--sm.cds--number .cds--number__input-wrapper--warning input[type=number] {
   padding-right: 7rem;
 }
 
@@ -14487,6 +14548,10 @@ optgroup.cds--select-optgroup:disabled,
   box-sizing: inherit;
 }
 
+.cds--list--unordered:not(.cds--list--nested) {
+  margin-left: 1rem;
+}
+
 .cds--list--expressive,
 .cds--list--expressive .cds--list--nested {
   font-size: var(--cds-body-02-font-size, 1rem);
@@ -15373,7 +15438,8 @@ optgroup.cds--select-optgroup:disabled,
   border-color: var(--cds-support-warning, #f1c21b);
 }
 
-.cds--inline-notification--warning .cds--inline-notification__icon path[opacity="0"] {
+.cds--inline-notification--warning .cds--inline-notification__icon path[opacity="0"],
+.cds--inline-notification--warning-alt .cds--inline-notification__icon path:first-of-type {
   fill: #000000;
   opacity: 1;
 }
@@ -15687,7 +15753,8 @@ optgroup.cds--select-optgroup:disabled,
   fill: var(--cds-support-warning, #f1c21b);
 }
 
-.cds--toast-notification--warning .cds--toast-notification__icon path[opacity="0"] {
+.cds--toast-notification--warning .cds--toast-notification__icon path[opacity="0"],
+.cds--toast-notification--warning-alt .cds--toast-notification__icon path:first-of-type {
   fill: #000000;
   opacity: 1;
 }
@@ -16012,7 +16079,8 @@ optgroup.cds--select-optgroup:disabled,
   border-color: var(--cds-support-warning, #f1c21b);
 }
 
-.cds--actionable-notification--warning .cds--toast-notification__icon path[opacity="0"] {
+.cds--actionable-notification--warning .cds--toast-notification__icon path[opacity="0"],
+.cds--actionable-notification--warning-alt .cds--toast-notification__icon path:first-of-type {
   fill: #000000;
   opacity: 1;
 }
@@ -17361,7 +17429,7 @@ span.cds--pagination__text.cds--pagination__items-count {
   pointer-events: auto;
 }
 
-.cds--popover--open .cds--popover-content {
+.cds--popover--open > .cds--popover > .cds--popover-content {
   display: block;
 }
 
@@ -17371,7 +17439,7 @@ span.cds--pagination__text.cds--pagination__items-count {
   content: "";
 }
 
-.cds--popover--open .cds--popover-content::before {
+.cds--popover--open > .cds--popover > .cds--popover-content::before {
   display: block;
 }
 
@@ -17383,10 +17451,14 @@ span.cds--pagination__text.cds--pagination__items-count {
   will-change: transform;
 }
 
-.cds--popover--open.cds--popover--caret .cds--popover-caret {
+.cds--popover--open > .cds--popover > .cds--popover-caret {
   display: block;
 }
 
+.cds--popover--tab-tip .cds--popover .cds--popover-caret {
+  display: none;
+}
+
 .cds--popover--bottom .cds--popover-content {
   bottom: 0;
   left: 50%;
@@ -18520,6 +18592,7 @@ span.cds--pagination__text.cds--pagination__items-count {
 }
 
 .cds--slider-container {
+  position: relative;
   display: flex;
   align-items: center;
   user-select: none;
@@ -18613,7 +18686,6 @@ span.cds--pagination__text.cds--pagination__items-count {
   width: 4rem;
   height: 2.5rem;
   -moz-appearance: textfield;
-  text-align: center;
 }
 .cds--slider-text-input::-webkit-outer-spin-button, .cds--slider-text-input::-webkit-inner-spin-button,
 .cds-slider-text-input::-webkit-outer-spin-button,
@@ -18625,14 +18697,44 @@ span.cds--pagination__text.cds--pagination__items-count {
   display: none;
 }
 
-.cds--slider-text-input.cds--text-input--invalid {
-  padding-right: 1rem;
-}
-
 .cds--slider__thumb:focus ~ .cds--slider__filled-track {
   background-color: var(--cds-interactive, #0f62fe);
 }
 
+.cds--slider-text-input.cds--text-input--invalid,
+.cds--slider-text-input--warn {
+  width: 6rem;
+  padding-right: 3rem;
+}
+
+.cds--slider__invalid-icon {
+  position: absolute;
+  top: 50%;
+  right: 1rem;
+  fill: var(--cds-support-error, #da1e28);
+  transform: translateY(-50%);
+}
+
+.cds--slider__validation-msg.cds--form-requirement {
+  display: block;
+  overflow: visible;
+  max-height: 100%;
+  margin-top: 0;
+}
+
+.cds--slider__validation-msg--invalid {
+  color: var(--cds-text-error, #da1e28);
+}
+
+.cds--slider__invalid-icon.cds--slider__invalid-icon--warning {
+  fill: var(--cds-support-warning, #f1c21b);
+}
+
+.cds--slider__invalid-icon--warning path:first-of-type {
+  fill: #000000;
+  opacity: 1;
+}
+
 .cds--label--disabled ~ .cds--slider-container > .cds--slider__range-label {
   color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
 }
@@ -18997,11 +19099,15 @@ span.cds--pagination__text.cds--pagination__items-count {
   white-space: nowrap;
 }
 
+.cds--structured-list-input + .cds--structured-list-td {
+  text-align: right;
+}
+
 .cds--structured-list-svg {
   display: inline-block;
   fill: transparent;
   transition: all 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
-  vertical-align: middle;
+  vertical-align: top;
 }
 
 .cds--structured-list-input:checked + .cds--structured-list-row .cds--structured-list-svg,
@@ -19262,11 +19368,42 @@ span.cds--pagination__text.cds--pagination__items-count {
 .cds--tabs .cds--tabs__nav-item .cds--tabs__nav-link {
   transition: color 70ms cubic-bezier(0.2, 0, 0.38, 0.9), border-bottom-color 70ms cubic-bezier(0.2, 0, 0.38, 0.9), outline 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
 }
+.cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon {
+  padding: 1rem;
+  margin-top: -0.5rem;
+  margin-right: -1rem;
+  margin-left: -1rem;
+}
+.cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon:hover {
+  background-color: inherit;
+}
+.cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg {
+  width: 24px;
+  height: 24px;
+  padding: 0.25rem;
+  margin: -0.25rem;
+}
+.cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg:hover {
+  background-color: var(--cds-layer-accent-hover);
+}
+.cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled).cds--tabs__nav-item--selected .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg:hover {
+  background-color: var(--cds-layer-hover);
+}
+.cds--tabs .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon:hover {
+  background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
+}
 .cds--tabs .cds--tabs__nav-item--icon {
   display: flex;
   align-items: center;
   padding-left: 0.5rem;
 }
+.cds--tabs .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon {
+  padding: 0.25rem;
+  margin: -0.25rem;
+  cursor: pointer;
+  line-height: 0;
+  pointer-events: auto;
+}
 .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon {
   padding-left: 1rem;
 }
@@ -19353,8 +19490,13 @@ span.cds--pagination__text.cds--pagination__items-count {
 .cds--tabs.cds--tabs__icon--lg {
   --cds-icon-tab-size: 3rem;
 }
-.cds--tabs.cds--tabs--contained .cds--tabs__nav-item:hover {
-  background-color: var(--cds-layer-selected-hover);
+.cds--tabs:not(.cds--tabs--contained) .cds--tabs__nav-item:not(.cds--tabs__nav-item--selected):not(.cds--tabs__nav-item--disabled):hover {
+  border-bottom: 2px solid var(--cds-border-strong);
+  color: var(--cds-text-primary, #161616);
+}
+.cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--selected):not(.cds--tabs__nav-item--disabled):not(.cds--tabs__nav-item--hover-off):hover {
+  background-color: var(--cds-layer-accent-hover);
+  color: var(--cds-text-primary, #161616);
 }
 .cds--tabs .cds--tabs__nav-item--selected {
   border-bottom: 2px solid var(--cds-border-interactive, #0f62fe);
@@ -19390,10 +19532,6 @@ span.cds--pagination__text.cds--pagination__items-count {
 .cds--tabs.cds--tabs--light.cds--tabs--contained .cds--tabs__nav-item--selected, .cds--tabs.cds--tabs--light.cds--tabs--contained .cds--tabs__nav-item--selected:hover {
   background-color: var(--cds-background, #ffffff);
 }
-.cds--tabs .cds--tabs__nav-item:hover .cds--tabs__nav-link {
-  border-bottom: 2px solid var(--cds-border-strong);
-  color: var(--cds-text-primary, #161616);
-}
 .cds--tabs .cds--tabs__nav-item--disabled {
   border-bottom: 2px solid var(--cds-border-disabled, #c6c6c6);
   background-color: transparent;
@@ -19773,6 +19911,26 @@ span.cds--pagination__text.cds--pagination__items-count {
   padding: 1rem;
   background-color: var(--cds-layer);
   color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
+  cursor: not-allowed;
+}
+
+.cds--tile--clickable .cds--tile--icon,
+.cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon {
+  position: absolute;
+  right: 1rem;
+  bottom: 1rem;
+}
+
+.cds--tile--clickable .cds--tile--icon {
+  fill: var(--cds-icon-interactive, #0f62fe);
+}
+
+.cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon {
+  fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
+}
+
+.cds--tile--clickable.cds--link--disabled .cds--tile--icon {
+  display: none;
 }
 
 .cds--tile--selectable {
@@ -20004,7 +20162,7 @@ span.cds--pagination__text.cds--pagination__items-count {
 }
 
 .cds--tile--disabled.cds--tile--is-selected {
-  border-color: var(--cds-button-disabled, #c6c6c6);
+  border-color: var(--cds-border-disabled, #c6c6c6);
 }
 
 .cds--tile--disabled .cds--tile__checkmark svg {
@@ -20373,6 +20531,10 @@ span.cds--pagination__text.cds--pagination__items-count {
   cursor: pointer;
 }
 
+.cds--tree-node--with-icon .cds--tree-node {
+  margin-left: 0.5rem;
+}
+
 .cds--tree-node:focus > .cds--tree-node__label {
   outline: 2px solid var(--cds-focus, #0f62fe);
   outline-offset: -2px;
@@ -20444,6 +20606,10 @@ span.cds--pagination__text.cds--pagination__items-count {
   padding-left: 2rem;
 }
 
+.cds--tree-leaf-node.cds--tree-node--with-icon .cds--tree-leaf-node {
+  padding-left: 1.5rem;
+}
+
 .cds--tree-node__label__details {
   display: flex;
   align-items: center;
@@ -20463,6 +20629,7 @@ span.cds--pagination__text.cds--pagination__items-count {
   border: 0;
   margin-top: 0.25rem;
   margin-right: 0.25rem;
+  margin-left: -0.25rem;
 }
 .cds--tree-parent-node__toggle:hover {
   cursor: pointer;
@@ -20487,9 +20654,14 @@ span.cds--pagination__text.cds--pagination__items-count {
   align-self: flex-start;
   margin-top: 0.0625rem;
   margin-right: 0.5rem;
+  margin-left: 0.5rem;
   fill: var(--cds-icon-secondary, #525252);
 }
 
+.cds--tree-parent-node__toggle + .cds--tree-node__label__details .cds--tree-node__icon {
+  margin-left: 0.25rem;
+}
+
 .cds--tree-node--selected > .cds--tree-node__label {
   background-color: var(--cds-layer-selected-01, #e0e0e0);
   color: var(--cds-text-primary, #161616);
@@ -20776,12 +20948,11 @@ a.cds--header__menu-item[aria-current=page],
 a.cds--header__menu-item[aria-current=page]::after,
 .cds--header__menu-item--current::after {
   position: absolute;
-  top: 0;
-  right: 0;
   bottom: -2px;
-  left: 0;
-  width: 100%;
-  border-bottom: 3px solid var(--cds-border-interactive, #0f62fe);
+  left: -2px;
+  width: calc(100% + 4px);
+  height: 3px;
+  background-color: var(--cds-border-interactive, #0f62fe);
   content: "";
 }
 
@@ -20792,15 +20963,19 @@ a.cds--header__menu-item[aria-current=page]:focus::after,
 
 .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]::after,
 .cds--header__submenu .cds--header__menu .cds--header__menu-item--current::after {
-  bottom: 0;
+  top: -2px;
   left: -2px;
-  border-bottom: none;
-  border-left: 3px solid var(--cds-border-interactive, #0f62fe);
+  width: 3px;
+  height: calc(100% + 4px);
+  background-color: var(--cds-border-interactive, #0f62fe);
 }
 .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]:focus::after,
 .cds--header__submenu .cds--header__menu .cds--header__menu-item--current:focus::after {
-  left: 0;
-  border-left: 3px solid var(--cds-border-interactive, #0f62fe);
+  top: -2px;
+  left: -2px;
+  width: 5px;
+  height: calc(100% + 4px);
+  background-color: var(--cds-border-interactive, #0f62fe);
 }
 
 a.cds--header__menu-item[aria-current=page]:focus,
@@ -20860,6 +21035,13 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
   color: var(--cds-text-primary, #161616);
 }
 
+.cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current {
+  background-color: var(--cds-layer-selected);
+}
+.cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current:hover {
+  background-color: var(--cds-layer-selected-hover);
+}
+
 .cds--header__menu .cds--header__menu-item {
   height: 3rem;
 }
@@ -20978,6 +21160,7 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
 
 @media (max-width: 65.98rem) {
   .cds--side-nav__overlay-active {
+    z-index: 6000;
     width: 100vw;
     height: 100vh;
     background-color: var(--cds-overlay, rgba(22, 22, 22, 0.5));
@@ -21358,6 +21541,15 @@ a.cds--side-nav__link--current::before {
   background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
   color: var(--cds-text-primary, #161616);
 }
+.cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
+  background-color: var(--cds-layer-selected-hover);
+}
+
+.cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
+.cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
+  width: 3px;
+  height: calc(100% + 4px);
+}
 
 .cds--side-nav .cds--header__menu a.cds--header__menu-item {
   height: inherit;
@@ -21688,12 +21880,11 @@ a.cds--header__menu-item[aria-current=page],
 a.cds--header__menu-item[aria-current=page]::after,
 .cds--header__menu-item--current::after {
   position: absolute;
-  top: 0;
-  right: 0;
   bottom: -2px;
-  left: 0;
-  width: 100%;
-  border-bottom: 3px solid var(--cds-border-interactive, #0f62fe);
+  left: -2px;
+  width: calc(100% + 4px);
+  height: 3px;
+  background-color: var(--cds-border-interactive, #0f62fe);
   content: "";
 }
 
@@ -21704,15 +21895,19 @@ a.cds--header__menu-item[aria-current=page]:focus::after,
 
 .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]::after,
 .cds--header__submenu .cds--header__menu .cds--header__menu-item--current::after {
-  bottom: 0;
+  top: -2px;
   left: -2px;
-  border-bottom: none;
-  border-left: 3px solid var(--cds-border-interactive, #0f62fe);
+  width: 3px;
+  height: calc(100% + 4px);
+  background-color: var(--cds-border-interactive, #0f62fe);
 }
 .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]:focus::after,
 .cds--header__submenu .cds--header__menu .cds--header__menu-item--current:focus::after {
-  left: 0;
-  border-left: 3px solid var(--cds-border-interactive, #0f62fe);
+  top: -2px;
+  left: -2px;
+  width: 5px;
+  height: calc(100% + 4px);
+  background-color: var(--cds-border-interactive, #0f62fe);
 }
 
 a.cds--header__menu-item[aria-current=page]:focus,
@@ -21772,6 +21967,13 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
   color: var(--cds-text-primary, #161616);
 }
 
+.cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current {
+  background-color: var(--cds-layer-selected);
+}
+.cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current:hover {
+  background-color: var(--cds-layer-selected-hover);
+}
+
 .cds--header__menu .cds--header__menu-item {
   height: 3rem;
 }
@@ -21890,6 +22092,7 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
 
 @media (max-width: 65.98rem) {
   .cds--side-nav__overlay-active {
+    z-index: 6000;
     width: 100vw;
     height: 100vh;
     background-color: var(--cds-overlay, rgba(22, 22, 22, 0.5));
@@ -22270,6 +22473,15 @@ a.cds--side-nav__link--current::before {
   background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
   color: var(--cds-text-primary, #161616);
 }
+.cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
+  background-color: var(--cds-layer-selected-hover);
+}
+
+.cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
+.cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
+  width: 3px;
+  height: calc(100% + 4px);
+}
 
 .cds--side-nav .cds--header__menu a.cds--header__menu-item {
   height: inherit;
@@ -22779,162 +22991,162 @@ a.cds--side-nav__link--current::before {
   --cds-charts-14-1-13-hovered: #963f00;
   --cds-charts-14-1-14: #d4bbff;
   --cds-charts-14-1-14-hovered: #bd97ff;
-  --cds-charts-mono-1-1: #ffffff;
-  --cds-charts-mono-1-1-hovered: #ededed;
-  --cds-charts-mono-1-2: #f6f2ff;
-  --cds-charts-mono-1-2-hovered: #ddceff;
-  --cds-charts-mono-1-3: #e8daff;
-  --cds-charts-mono-1-3-hovered: #d2b6ff;
-  --cds-charts-mono-1-4: #d4bbff;
-  --cds-charts-mono-1-4-hovered: #bd97ff;
-  --cds-charts-mono-1-5: #be95ff;
-  --cds-charts-mono-1-5-hovered: #a871ff;
+  --cds-charts-mono-1-1: #1c0f30;
+  --cds-charts-mono-1-1-hovered: #0c0715;
+  --cds-charts-mono-1-2: #31135e;
+  --cds-charts-mono-1-2-hovered: #220d40;
+  --cds-charts-mono-1-3: #491d8b;
+  --cds-charts-mono-1-3-hovered: #39176d;
+  --cds-charts-mono-1-4: #6929c4;
+  --cds-charts-mono-1-4-hovered: #5923a6;
+  --cds-charts-mono-1-5: #8a3ffc;
+  --cds-charts-mono-1-5-hovered: #751cfb;
   --cds-charts-mono-1-6: #a56eff;
   --cds-charts-mono-1-6-hovered: #8f4aff;
-  --cds-charts-mono-1-7: #8a3ffc;
-  --cds-charts-mono-1-7-hovered: #751cfb;
-  --cds-charts-mono-1-8: #6929c4;
-  --cds-charts-mono-1-8-hovered: #5923a6;
-  --cds-charts-mono-1-9: #491d8b;
-  --cds-charts-mono-1-9-hovered: #39176d;
-  --cds-charts-mono-1-10: #31135e;
-  --cds-charts-mono-1-10-hovered: #220d40;
-  --cds-charts-mono-1-11: #1c0f30;
-  --cds-charts-mono-1-11-hovered: #0c0715;
-  --cds-charts-mono-2-1: #ffffff;
-  --cds-charts-mono-2-1-hovered: #ededed;
-  --cds-charts-mono-2-2: #edf5ff;
-  --cds-charts-mono-2-2-hovered: #c9e1ff;
-  --cds-charts-mono-2-3: #d0e2ff;
-  --cds-charts-mono-2-3-hovered: #acccff;
-  --cds-charts-mono-2-4: #a6c8ff;
-  --cds-charts-mono-2-4-hovered: #82b2ff;
-  --cds-charts-mono-2-5: #78a9ff;
-  --cds-charts-mono-2-5-hovered: #5492ff;
+  --cds-charts-mono-1-7: #be95ff;
+  --cds-charts-mono-1-7-hovered: #a871ff;
+  --cds-charts-mono-1-8: #d4bbff;
+  --cds-charts-mono-1-8-hovered: #bd97ff;
+  --cds-charts-mono-1-9: #e8daff;
+  --cds-charts-mono-1-9-hovered: #d2b6ff;
+  --cds-charts-mono-1-10: #f6f2ff;
+  --cds-charts-mono-1-10-hovered: #ddceff;
+  --cds-charts-mono-1-11: #ffffff;
+  --cds-charts-mono-1-11-hovered: #ededed;
+  --cds-charts-mono-2-1: #001141;
+  --cds-charts-mono-2-1-hovered: #00081d;
+  --cds-charts-mono-2-2: #001d6c;
+  --cds-charts-mono-2-2-hovered: #001348;
+  --cds-charts-mono-2-3: #002d9c;
+  --cds-charts-mono-2-3-hovered: #002378;
+  --cds-charts-mono-2-4: #0043ce;
+  --cds-charts-mono-2-4-hovered: #0037aa;
+  --cds-charts-mono-2-5: #0f62fe;
+  --cds-charts-mono-2-5-hovered: #0151e8;
   --cds-charts-mono-2-6: #4589ff;
   --cds-charts-mono-2-6-hovered: #2172ff;
-  --cds-charts-mono-2-7: #0f62fe;
-  --cds-charts-mono-2-7-hovered: #0151e8;
-  --cds-charts-mono-2-8: #0043ce;
-  --cds-charts-mono-2-8-hovered: #0037aa;
-  --cds-charts-mono-2-9: #002d9c;
-  --cds-charts-mono-2-9-hovered: #002378;
-  --cds-charts-mono-2-10: #001d6c;
-  --cds-charts-mono-2-10-hovered: #001348;
-  --cds-charts-mono-2-11: #001141;
-  --cds-charts-mono-2-11-hovered: #00081d;
-  --cds-charts-mono-3-1: #ffffff;
-  --cds-charts-mono-3-1-hovered: #ededed;
-  --cds-charts-mono-3-2: #e5f6ff;
-  --cds-charts-mono-3-2-hovered: #c1eaff;
-  --cds-charts-mono-3-3: #bae6ff;
-  --cds-charts-mono-3-3-hovered: #96d9ff;
-  --cds-charts-mono-3-4: #82cfff;
-  --cds-charts-mono-3-4-hovered: #5ec1ff;
-  --cds-charts-mono-3-5: #33b1ff;
-  --cds-charts-mono-3-5-hovered: #0fa3ff;
+  --cds-charts-mono-2-7: #78a9ff;
+  --cds-charts-mono-2-7-hovered: #5492ff;
+  --cds-charts-mono-2-8: #a6c8ff;
+  --cds-charts-mono-2-8-hovered: #82b2ff;
+  --cds-charts-mono-2-9: #d0e2ff;
+  --cds-charts-mono-2-9-hovered: #acccff;
+  --cds-charts-mono-2-10: #edf5ff;
+  --cds-charts-mono-2-10-hovered: #c9e1ff;
+  --cds-charts-mono-2-11: #ffffff;
+  --cds-charts-mono-2-11-hovered: #ededed;
+  --cds-charts-mono-3-1: #061727;
+  --cds-charts-mono-3-1-hovered: #010508;
+  --cds-charts-mono-3-2: #012749;
+  --cds-charts-mono-3-2-hovered: #011426;
+  --cds-charts-mono-3-3: #003a6d;
+  --cds-charts-mono-3-3-hovered: #002749;
+  --cds-charts-mono-3-4: #00539a;
+  --cds-charts-mono-3-4-hovered: #004076;
+  --cds-charts-mono-3-5: #0072c3;
+  --cds-charts-mono-3-5-hovered: #005d9f;
   --cds-charts-mono-3-6: #1192e8;
   --cds-charts-mono-3-6-hovered: #0f7dc7;
-  --cds-charts-mono-3-7: #0072c3;
-  --cds-charts-mono-3-7-hovered: #005d9f;
-  --cds-charts-mono-3-8: #00539a;
-  --cds-charts-mono-3-8-hovered: #004076;
-  --cds-charts-mono-3-9: #003a6d;
-  --cds-charts-mono-3-9-hovered: #002749;
-  --cds-charts-mono-3-10: #012749;
-  --cds-charts-mono-3-10-hovered: #011426;
-  --cds-charts-mono-3-11: #061727;
-  --cds-charts-mono-3-11-hovered: #010508;
-  --cds-charts-mono-4-1: #ffffff;
-  --cds-charts-mono-4-1-hovered: #ededed;
-  --cds-charts-mono-4-2: #d9fbfb;
-  --cds-charts-mono-4-2-hovered: #b9f8f8;
-  --cds-charts-mono-4-3: #9ef0f0;
-  --cds-charts-mono-4-3-hovered: #7febeb;
-  --cds-charts-mono-4-4: #3ddbd9;
-  --cds-charts-mono-4-4-hovered: #26cecc;
-  --cds-charts-mono-4-5: #08bdba;
-  --cds-charts-mono-4-5-hovered: #079b98;
+  --cds-charts-mono-3-7: #33b1ff;
+  --cds-charts-mono-3-7-hovered: #0fa3ff;
+  --cds-charts-mono-3-8: #82cfff;
+  --cds-charts-mono-3-8-hovered: #5ec1ff;
+  --cds-charts-mono-3-9: #bae6ff;
+  --cds-charts-mono-3-9-hovered: #96d9ff;
+  --cds-charts-mono-3-10: #e5f6ff;
+  --cds-charts-mono-3-10-hovered: #c1eaff;
+  --cds-charts-mono-3-11: #ffffff;
+  --cds-charts-mono-3-11-hovered: #ededed;
+  --cds-charts-mono-4-1: #081a1c;
+  --cds-charts-mono-4-1-hovered: black;
+  --cds-charts-mono-4-2: #022b30;
+  --cds-charts-mono-4-2-hovered: #010c0e;
+  --cds-charts-mono-4-3: #004144;
+  --cds-charts-mono-4-3-hovered: #001f20;
+  --cds-charts-mono-4-4: #005d5d;
+  --cds-charts-mono-4-4-hovered: #003939;
+  --cds-charts-mono-4-5: #007d79;
+  --cds-charts-mono-4-5-hovered: #005956;
   --cds-charts-mono-4-6: #009d9a;
   --cds-charts-mono-4-6-hovered: #007977;
-  --cds-charts-mono-4-7: #007d79;
-  --cds-charts-mono-4-7-hovered: #005956;
-  --cds-charts-mono-4-8: #005d5d;
-  --cds-charts-mono-4-8-hovered: #003939;
-  --cds-charts-mono-4-9: #004144;
-  --cds-charts-mono-4-9-hovered: #001f20;
-  --cds-charts-mono-4-10: #022b30;
-  --cds-charts-mono-4-10-hovered: #010c0e;
-  --cds-charts-mono-4-11: #081a1c;
-  --cds-charts-mono-4-11-hovered: black;
-  --cds-charts-diverge-1-1: #750e13;
-  --cds-charts-diverge-1-1-hovered: #550a0e;
-  --cds-charts-diverge-1-2: #a2191f;
-  --cds-charts-diverge-1-2-hovered: #831419;
-  --cds-charts-diverge-1-3: #da1e28;
-  --cds-charts-diverge-1-3-hovered: #bb1a22;
-  --cds-charts-diverge-1-4: #fa4d56;
-  --cds-charts-diverge-1-4-hovered: #f92a35;
-  --cds-charts-diverge-1-5: #ff8389;
-  --cds-charts-diverge-1-5-hovered: #ff5f67;
-  --cds-charts-diverge-1-6: #ffb3b8;
-  --cds-charts-diverge-1-6-hovered: #ff8f97;
-  --cds-charts-diverge-1-7: #ffd7d9;
-  --cds-charts-diverge-1-7-hovered: #ffb3b7;
-  --cds-charts-diverge-1-8: #fff1f1;
-  --cds-charts-diverge-1-8-hovered: #ffcdcd;
+  --cds-charts-mono-4-7: #08bdba;
+  --cds-charts-mono-4-7-hovered: #079b98;
+  --cds-charts-mono-4-8: #3ddbd9;
+  --cds-charts-mono-4-8-hovered: #26cecc;
+  --cds-charts-mono-4-9: #9ef0f0;
+  --cds-charts-mono-4-9-hovered: #7febeb;
+  --cds-charts-mono-4-10: #d9fbfb;
+  --cds-charts-mono-4-10-hovered: #b9f8f8;
+  --cds-charts-mono-4-11: #ffffff;
+  --cds-charts-mono-4-11-hovered: #ededed;
+  --cds-charts-diverge-1-1: #fff1f1;
+  --cds-charts-diverge-1-1-hovered: #ffcdcd;
+  --cds-charts-diverge-1-2: #ffd7d9;
+  --cds-charts-diverge-1-2-hovered: #ffb3b7;
+  --cds-charts-diverge-1-3: #ffb3b8;
+  --cds-charts-diverge-1-3-hovered: #ff8f97;
+  --cds-charts-diverge-1-4: #ff8389;
+  --cds-charts-diverge-1-4-hovered: #ff5f67;
+  --cds-charts-diverge-1-5: #fa4d56;
+  --cds-charts-diverge-1-5-hovered: #f92a35;
+  --cds-charts-diverge-1-6: #da1e28;
+  --cds-charts-diverge-1-6-hovered: #bb1a22;
+  --cds-charts-diverge-1-7: #a2191f;
+  --cds-charts-diverge-1-7-hovered: #831419;
+  --cds-charts-diverge-1-8: #750e13;
+  --cds-charts-diverge-1-8-hovered: #550a0e;
   --cds-charts-diverge-1-9: #ffffff;
   --cds-charts-diverge-1-9-hovered: #ededed;
-  --cds-charts-diverge-1-10: #e5f6ff;
-  --cds-charts-diverge-1-10-hovered: #c1eaff;
-  --cds-charts-diverge-1-11: #bae6ff;
-  --cds-charts-diverge-1-11-hovered: #96d9ff;
-  --cds-charts-diverge-1-12: #82cfff;
-  --cds-charts-diverge-1-12-hovered: #5ec1ff;
-  --cds-charts-diverge-1-13: #33b1ff;
-  --cds-charts-diverge-1-13-hovered: #0fa3ff;
-  --cds-charts-diverge-1-14: #1192e8;
-  --cds-charts-diverge-1-14-hovered: #0f7dc7;
-  --cds-charts-diverge-1-15: #0072c3;
-  --cds-charts-diverge-1-15-hovered: #005d9f;
-  --cds-charts-diverge-1-16: #00539a;
-  --cds-charts-diverge-1-16-hovered: #004076;
-  --cds-charts-diverge-1-17: #003a6d;
-  --cds-charts-diverge-1-17-hovered: #002749;
-  --cds-charts-diverge-2-1: #491d8b;
-  --cds-charts-diverge-2-1-hovered: #39176d;
-  --cds-charts-diverge-2-2: #6929c4;
-  --cds-charts-diverge-2-2-hovered: #5923a6;
-  --cds-charts-diverge-2-3: #8a3ffc;
-  --cds-charts-diverge-2-3-hovered: #751cfb;
-  --cds-charts-diverge-2-4: #a56eff;
-  --cds-charts-diverge-2-4-hovered: #8f4aff;
-  --cds-charts-diverge-2-5: #be95ff;
-  --cds-charts-diverge-2-5-hovered: #a871ff;
-  --cds-charts-diverge-2-6: #d4bbff;
-  --cds-charts-diverge-2-6-hovered: #bd97ff;
-  --cds-charts-diverge-2-7: #e8daff;
-  --cds-charts-diverge-2-7-hovered: #d2b6ff;
-  --cds-charts-diverge-2-8: #f6f2ff;
-  --cds-charts-diverge-2-8-hovered: #ddceff;
+  --cds-charts-diverge-1-10: #003a6d;
+  --cds-charts-diverge-1-10-hovered: #002749;
+  --cds-charts-diverge-1-11: #00539a;
+  --cds-charts-diverge-1-11-hovered: #004076;
+  --cds-charts-diverge-1-12: #0072c3;
+  --cds-charts-diverge-1-12-hovered: #005d9f;
+  --cds-charts-diverge-1-13: #1192e8;
+  --cds-charts-diverge-1-13-hovered: #0f7dc7;
+  --cds-charts-diverge-1-14: #33b1ff;
+  --cds-charts-diverge-1-14-hovered: #0fa3ff;
+  --cds-charts-diverge-1-15: #82cfff;
+  --cds-charts-diverge-1-15-hovered: #5ec1ff;
+  --cds-charts-diverge-1-16: #bae6ff;
+  --cds-charts-diverge-1-16-hovered: #96d9ff;
+  --cds-charts-diverge-1-17: #e5f6ff;
+  --cds-charts-diverge-1-17-hovered: #c1eaff;
+  --cds-charts-diverge-2-1: #f6f2ff;
+  --cds-charts-diverge-2-1-hovered: #ddceff;
+  --cds-charts-diverge-2-2: #e8daff;
+  --cds-charts-diverge-2-2-hovered: #d2b6ff;
+  --cds-charts-diverge-2-3: #d4bbff;
+  --cds-charts-diverge-2-3-hovered: #bd97ff;
+  --cds-charts-diverge-2-4: #be95ff;
+  --cds-charts-diverge-2-4-hovered: #a871ff;
+  --cds-charts-diverge-2-5: #a56eff;
+  --cds-charts-diverge-2-5-hovered: #8f4aff;
+  --cds-charts-diverge-2-6: #8a3ffc;
+  --cds-charts-diverge-2-6-hovered: #751cfb;
+  --cds-charts-diverge-2-7: #6929c4;
+  --cds-charts-diverge-2-7-hovered: #5923a6;
+  --cds-charts-diverge-2-8: #491d8b;
+  --cds-charts-diverge-2-8-hovered: #39176d;
   --cds-charts-diverge-2-9: #ffffff;
   --cds-charts-diverge-2-9-hovered: #ededed;
-  --cds-charts-diverge-2-10: #d9fbfb;
-  --cds-charts-diverge-2-10-hovered: #b9f8f8;
-  --cds-charts-diverge-2-11: #9ef0f0;
-  --cds-charts-diverge-2-11-hovered: #7febeb;
-  --cds-charts-diverge-2-12: #3ddbd9;
-  --cds-charts-diverge-2-12-hovered: #26cecc;
-  --cds-charts-diverge-2-13: #08bdba;
-  --cds-charts-diverge-2-13-hovered: #079b98;
-  --cds-charts-diverge-2-14: #009d9a;
-  --cds-charts-diverge-2-14-hovered: #007977;
-  --cds-charts-diverge-2-15: #007d79;
-  --cds-charts-diverge-2-15-hovered: #005956;
-  --cds-charts-diverge-2-16: #005d5d;
-  --cds-charts-diverge-2-16-hovered: #003939;
-  --cds-charts-diverge-2-17: #004144;
-  --cds-charts-diverge-2-17-hovered: #001f20;
+  --cds-charts-diverge-2-10: #004144;
+  --cds-charts-diverge-2-10-hovered: #001f20;
+  --cds-charts-diverge-2-11: #005d5d;
+  --cds-charts-diverge-2-11-hovered: #003939;
+  --cds-charts-diverge-2-12: #007d79;
+  --cds-charts-diverge-2-12-hovered: #005956;
+  --cds-charts-diverge-2-13: #009d9a;
+  --cds-charts-diverge-2-13-hovered: #007977;
+  --cds-charts-diverge-2-14: #08bdba;
+  --cds-charts-diverge-2-14-hovered: #079b98;
+  --cds-charts-diverge-2-15: #3ddbd9;
+  --cds-charts-diverge-2-15-hovered: #26cecc;
+  --cds-charts-diverge-2-16: #9ef0f0;
+  --cds-charts-diverge-2-16-hovered: #7febeb;
+  --cds-charts-diverge-2-17: #d9fbfb;
+  --cds-charts-diverge-2-17-hovered: #b9f8f8;
 }
 
 .cds--cc--chart-wrapper .fill-1-1-1 {
@@ -27086,6 +27298,18 @@ svg.cds--cc--color-legend g.legend-title text {
   fill: var(--cds-icon-inverse, #ffffff);
 }
 
+.cds--cc--choropleth path.border {
+  stroke: var(--cds-border-subtle-selected-01, #c6c6c6);
+}
+.cds--cc--choropleth g.missing-data path {
+  stroke: var(--cds-border-subtle-selected-01, #c6c6c6);
+  fill: var(--cds-background, #ffffff);
+}
+.cds--cc--choropleth pattern path.pattern-fill {
+  stroke: var(--cds-border-strong-01, #8d8d8d);
+  stroke-width: 0.5px;
+}
+
 .cds--cc--chart-wrapper {
   font-family: 'IBM Plex Sans Condensed', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;
 }
@@ -30627,7 +30851,8 @@ div.container div.v10-banner {
 div.container div.v10-banner b {
   font-weight: 600;
 }
-div.container div#color-palette-picker {
+div.container div#color-palette-picker,
+div.container div#projection-picker {
   max-width: 18rem;
   margin-top: 2rem;
 }