@turquoisehealth/pit-viper 2.238.1-dev.0 → 2.240.0

package/_site/assets/css/pit-viper.css

@@ -25,7 +25,7 @@
 :where(*) {
   box-sizing: border-box;
   margin: 0;
-  outline-color: revert;
+  outline-color: var(--color-focus-ring, revert);
 }
 
 :where(input, button, textarea, select) {
@@ -101,7 +101,7 @@
 }
 
 :where(blockquote):not(.pv-blockquote) {
-  border: 0 solid #DCDFE4;
+  border: 0 solid var(--color-border, #DCDFE4);
   border-inline-start-width: 0.25rem;
   padding-inline-start: 1.5rem;
 }
@@ -427,14 +427,14 @@
 }
 [data-list-style=display]::before {
   content: counter(display) ".";
-  color: #176F6F;
+  color: var(--color-text-brand, #176F6F);
   font-family: "Tiempos Headline", serif;
   font-size: var(--display-counter-list-font-size, 1.5rem);
   line-height: var(--display-counter-list-line-height, 1.5);
 }
 
 [data-list-incomplete] {
-  color: #6E7784;
+  color: var(--color-text-subdued, #6E7784);
 }
 [data-list-incomplete]::before {
   color: #6E7784;
@@ -676,11 +676,11 @@
 }
 
 .pv-button-ghost.pv-button-inverse {
-  color: #FFFFFF;
+  color: var(--color-text-inverse, #FFFFFF);
 }
 .pv-button-ghost.pv-button-inverse:not(disabled):hover, .pv-button-ghost.pv-button-inverse:not(disabled):focus-visible {
-  color: #FFFFFF;
-  background-color: #176F6F;
+  color: var(--color-text-inverse, #FFFFFF);
+  background-color: var(--button-primary-background-color, #176F6F);
 }
 
 .pv-button-ghost-destructive {
@@ -785,14 +785,14 @@
   border-radius: 5px;
   display: grid;
   place-items: center;
-  color: currentColor;
-  background-color: transparent;
+  color: var(--button-icon-color, currentColor);
+  background-color: var(--button-icon-background-color, transparent);
 }
 .pv-button-icon:hover, .pv-button-icon:focus-visible {
-  background-color: #E8F2F4;
+  background-color: var(--button-icon-hover-background-color, #E8F2F4);
 }
 .pv-button-icon:active {
-  background-color: #C7D8DB;
+  background-color: var(--button-icon-pressed-background-color, #C7D8DB);
 }
 .pv-button-icon:disabled {
   color: var(--button-icon-disabled-color, #7D898D);
@@ -806,16 +806,16 @@
 }
 
 .pv-button-icon-outline {
-  background-color: #F8F8FA;
-  border: 1px solid #DCDFE4;
+  background-color: var(--color-background-accent, #F8F8FA);
+  border: 1px solid var(--color-border, #DCDFE4);
   box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
-  color: #02363D;
+  color: var(--color-text-body, #02363D);
   font-size: 0.8rem;
   height: 2.5rem;
   padding: 0.5rem 0.7rem;
 }
 .pv-button-icon-outline:hover, .pv-button-icon-outline:focus-visible {
-  background-color: #FFFFFF;
+  background-color: var(--color-background-body, #FFFFFF);
   box-shadow: 0px 12px 16px 0px rgba(0, 0, 0, 0.1), 0px 8px 12px -4px rgba(0, 0, 0, 0.08), 0px 0px 1px 0 rgba(0, 0, 0, 0.3);
   transition-duration: 0.3s;
   transition-property: box-shadow;
@@ -875,7 +875,7 @@
 
 [class*=pv-segmented-control] {
   padding: 0.25rem;
-  background-color: #DCDFE4;
+  background-color: var(--segmented-control-background, #DCDFE4);
   border-radius: 2rem;
   display: inline-flex;
   align-items: center;
@@ -890,14 +890,14 @@
   box-shadow: 0px 1px 5px 0px rgba(12, 12, 12, 0.05), 0px 0px 40px 0px rgba(12, 12, 12, 0.01);
 }
 [class*=pv-segmented-control] button[data-active] {
-  background-color: #FFFFFF;
+  background-color: var(--segmented-control-button-selected-background, #FFFFFF);
 }
 [class*=pv-segmented-control] button:hover:not(:disabled),
 [class*=pv-segmented-control] button:focus-visible:not(:disabled) {
-  background-color: #F3FCFB;
+  background-color: var(--segmented-control-button-hover-background, #F3FCFB);
 }
 [class*=pv-segmented-control] button:active:not(:disabled) {
-  background-color: #F3FCFB;
+  background-color: var(--segmented-control-button-active-background, #F3FCFB);
 }
 [class*=pv-segmented-control] button:has(svg:is(:only-child)) {
   padding: 0.25rem;
@@ -976,8 +976,8 @@
   right: var(--right);
   bottom: var(--bottom);
   z-index: 50;
-  background-color: #176F6F;
-  color: #FFFFFF;
+  background-color: var(--button-floating-background-color, #176F6F);
+  color: var(--color-text-inverse, #FFFFFF);
   width: 3rem;
   aspect-ratio: 1;
   border-radius: 50%;
@@ -985,10 +985,10 @@
   box-shadow: 0px 6px 8px 0px rgba(0, 0, 0, 0.05), 0px 4px 6px -2px rgba(0, 0, 0, 0.04), 0px 0px 0px 0 rgba(0, 0, 0, 0.15);
 }
 [class*=pv-button-floating]:hover:not(:disabled), [class*=pv-button-floating]:focus-visible:not(:disabled) {
-  background-color: #02363D;
+  background-color: var(--button-floating-hover-background-color, #02363D);
 }
 [class*=pv-button-floating]:active:not(:disabled) {
-  background-color: #218C88;
+  background-color: var(--button-floating-active-background-color, #218C88);
 }
 [class*=pv-button-floating]:disabled {
   background-color: var(--button-floating-disabled-background-color, #6E7784);
@@ -999,14 +999,14 @@
 }
 
 .pv-button-floating-on-dark {
-  background-color: #A8E6E1;
-  color: #02363D;
+  background-color: var(--button-floating-on-dark-background-color, #A8E6E1);
+  color: var(--color-text-body, #02363D);
 }
 .pv-button-floating-on-dark:hover:not(:disabled), .pv-button-floating-on-dark:focus-visible:not(:disabled) {
-  background-color: #F3FCFB;
+  background-color: var(--button-floating-on-dark-hover-background-color, #F3FCFB);
 }
 .pv-button-floating-on-dark:active:not(:disabled) {
-  background-color: #6FD6CE;
+  background-color: var(--button-floating-on-dark-active-background-color, #6FD6CE);
 }
 .pv-button-floating-on-dark:disabled {
   background-color: var(--button-floating-on-dark-disabled-background-color, #DCDFE4);
@@ -1015,7 +1015,7 @@
 .pv-alpha-button,
 [data-collapsed] .pv-alpha-button {
   width: min-content;
-  background-color: #FFFFFF;
+  background-color: var(--alpha-button-background-color, #FFFFFF);
   border-radius: 4px;
   border: 0;
   padding: 0.5rem;
@@ -1033,7 +1033,7 @@
 .pv-alpha-button span:last-child,
 [data-collapsed] .pv-alpha-button span:last-child {
   display: inline-block;
-  background-color: #FFEB99;
+  background-color: var(--alpha-button-tag-background-color, #FFEB99);
   border-radius: 4px;
   padding: 0.125rem;
   font-size: 0.6875rem;
@@ -1045,7 +1045,7 @@
 [data-collapsed] .pv-alpha-button:hover,
 [data-collapsed] .pv-alpha-button:focus-visible,
 [data-collapsed] .pv-alpha-button:active {
-  background-color: #176F6F;
+  background-color: var(--alpha-button-hover-background-color, #176F6F);
 }
 .pv-alpha-button:hover span:first-child, .pv-alpha-button:focus-visible span:first-child, .pv-alpha-button:active span:first-child,
 [data-collapsed] .pv-alpha-button:hover span:first-child,
@@ -1055,7 +1055,7 @@
 }
 .pv-alpha-button:active,
 [data-collapsed] .pv-alpha-button:active {
-  background-color: #0D5256;
+  background-color: var(--alpha-button-active-background-color, #0D5256);
 }
 
 @media (width >= 768px) {
@@ -1075,14 +1075,14 @@
 .pv-textarea,
 .pv-select,
 .pv-select-multiple {
-  color: #02363D;
+  color: var(--color-text-body, #02363D);
   padding: var(--text-input-padding, 0.5rem);
   font-size: var(--text-input-font-size, 1rem);
   line-height: var(--text-input-line-height, 1.5);
   border: var(--text-input-border-width, 2px) solid var(--text-input-border-color, #DCDFE4);
   border-radius: var(--text-input-radius, 2px);
   appearance: none;
-  background-color: #fff;
+  background-color: var(--color-background-body, #FFFFFF);
   width: 100%;
   min-width: fit-content;
   transition-duration: 0.125s;
@@ -1163,15 +1163,15 @@
   background-repeat: no-repeat;
   background-size: 1rem 1rem;
   background-position: top 50% left 0.5rem;
-  background-color: transparent;
-  border-radius: 2px;
-  border-color: #DCDFE4;
+  background-color: var(--search-background-color, transparent);
+  border-radius: var(--search-border-radius, 2px);
+  border-color: var(--search-border-color, #DCDFE4);
 }
 .pv-input-search:hover:not(:disabled) {
   box-shadow: none;
 }
 .pv-input-search:focus-visible {
-  border-color: #176F6F;
+  border-color: var(--search-focus-border-color, #176F6F);
 }
 
 .pv-select,
@@ -1190,7 +1190,7 @@
 .pv-select:disabled, .pv-select:disabled > option,
 .pv-select-multiple:disabled,
 .pv-select-multiple:disabled > option {
-  color: #02363D;
+  color: var(--color-text-body, #02363D);
   opacity: 1;
 }
 
@@ -1226,7 +1226,7 @@ label:has(input:not(:disabled)).pv-label-hover:hover {
   appearance: none;
   width: 1rem;
   height: 1rem;
-  background-color: #FFFFFF;
+  background-color: var(--color-background-body, #FFFFFF);
   border: 2px solid var(--checkbox-border, #DCDFE4);
   flex-shrink: 0;
   transition-duration: 0.125s;
@@ -1288,7 +1288,7 @@ label:has(input:not(:disabled)).pv-label-hover:hover {
 }
 .pv-checkbox:disabled + span,
 .pv-radio:disabled + span {
-  color: #6E7784;
+  color: var(--color-text-subdued, #6E7784);
 }
 
 .pv-checkbox {
@@ -1356,7 +1356,7 @@ label:has(input:not(:disabled)).pv-label-hover:hover {
 }
 
 .pv-input-file {
-  background-color: #F8F8FA;
+  background-color: var(--color-background-accent, #F8F8FA);
   padding: 0.75rem;
   border-radius: 5px;
   display: flex;
@@ -1390,7 +1390,7 @@ label:has(input:not(:disabled)).pv-label-hover:hover {
 }
 .pv-switch input[type=checkbox] {
   appearance: none;
-  background-color: #D9DEDE;
+  background-color: var(--switch-off-background-color, #D9DEDE);
   border-color: transparent;
   border-radius: 1rem;
   display: flex;
@@ -1402,39 +1402,39 @@ label:has(input:not(:disabled)).pv-label-hover:hover {
 }
 .pv-switch input[type=checkbox]:not(:disabled):hover,
 .pv-switch input[type=checkbox]:not(:disabled):focus-visible {
-  background-color: #C7D8DB;
+  background-color: var(--switch-off-background-color-hover, #C7D8DB);
   cursor: pointer;
 }
 .pv-switch input[type=checkbox]:not(:disabled):active {
-  background-color: #C7D8DB;
+  background-color: var(--switch-off-background-color-active, #C7D8DB);
 }
 .pv-switch input[type=checkbox]:checked:not(:disabled):hover,
 .pv-switch input[type=checkbox]:checked:not(:disabled):focus-visible {
-  background-color: #0D5256;
+  background-color: var(--switch-background-color-hover, #0D5256);
 }
 .pv-switch input[type=checkbox]:checked:not(:disabled):hover:after,
 .pv-switch input[type=checkbox]:checked:not(:disabled):focus-visible:after {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.293 5.293a1 1 0 0 1 1.414 1.414l-11 11a.999.999 0 0 1-1.414 0l-5-5a1 1 0 0 1 1.414-1.414L9 15.586 19.293 5.293Z' fill='%230D5256'/%3E%3C/svg%3E");
 }
 .pv-switch input[type=checkbox]:checked:not(:disabled):active {
-  background-color: #02363D;
+  background-color: var(--switch-background-color-active, #02363D);
 }
 .pv-switch input[type=checkbox]:checked:not(:disabled):active:after {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.293 5.293a1 1 0 0 1 1.414 1.414l-11 11a.999.999 0 0 1-1.414 0l-5-5a1 1 0 0 1 1.414-1.414L9 15.586 19.293 5.293Z' fill='%2302363D'/%3E%3C/svg%3E");
 }
 .pv-switch input[type=checkbox]:disabled,
 .pv-switch input[type=checkbox]:checked:disabled {
-  background-color: #ECECEC;
+  background-color: var(--switch-background-color-disabled, #ECECEC);
 }
 .pv-switch input[type=checkbox]:disabled:after,
 .pv-switch input[type=checkbox]:checked:disabled:after {
-  background-color: #C9D1D0;
+  background-color: var(--switch-knob-color-disabled, #C9D1D0);
 }
 .pv-switch input[type=checkbox]:checked:disabled:after {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.293 5.293a1 1 0 0 1 1.414 1.414l-11 11a.999.999 0 0 1-1.414 0l-5-5a1 1 0 0 1 1.414-1.414L9 15.586 19.293 5.293Z' fill='%237D898D'/%3E%3C/svg%3E");
 }
 .pv-switch input[type=checkbox]:after {
-  background-color: #FFFFFF;
+  background-color: var(--switch-knob-color, #FFFFFF);
   border-radius: 50%;
   content: "";
   display: block;
@@ -1449,10 +1449,10 @@ label:has(input:not(:disabled)).pv-label-hover:hover {
   background-position: center center;
 }
 .pv-switch input[type=checkbox]:checked {
-  background-color: #176F6F;
+  background-color: var(--button-primary-background-color, #176F6F);
 }
 .pv-switch input[type=checkbox]:checked:after {
-  background-color: #FFFFFF;
+  background-color: var(--color-background-body, #FFFFFF);
   right: 2px;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.293 5.293a1 1 0 0 1 1.414 1.414l-11 11a.999.999 0 0 1-1.414 0l-5-5a1 1 0 0 1 1.414-1.414L9 15.586 19.293 5.293Z' fill='%2316696D'/%3E%3C/svg%3E");
 }
@@ -1591,7 +1591,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
   line-height: 1.3333333;
 }
 .pv-ghost-input input::placeholder, .pv-ghost-input input::-webkit-input-placeholder {
-  color: #B8C1C4;
+  color: var(--color-text-quaternary, #B8C1C4);
 }
 .pv-ghost-input button {
   opacity: 0;
@@ -1603,7 +1603,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
   outline: 0;
 }
 .pv-ghost-input:hover input::placeholder, .pv-ghost-input:hover input::-webkit-input-placeholder, .pv-ghost-input:focus-visible input::placeholder, .pv-ghost-input:focus-visible input::-webkit-input-placeholder, .pv-ghost-input:focus-within input::placeholder, .pv-ghost-input:focus-within input::-webkit-input-placeholder {
-  color: #89989B;
+  color: var(--color-text-tertiary, #89989B);
 }
 .pv-ghost-input[data-style=h1] input {
   font-weight: 600;
@@ -1919,26 +1919,26 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
   display: flex;
   align-items: center;
   gap: 0.25rem;
-  border-inline-start: 1px solid #DCDFE4;
+  border-inline-start: 1px solid var(--toc-border-color, #DCDFE4);
   padding: 0.5rem;
   font-size: 0.75rem;
   line-height: 1.33333333;
   font-weight: 500;
 }
 .pv-toc > li a:hover, .pv-toc > li a:focus-visible {
-  color: #176F6F;
-  background-color: #F3FCFB;
-  border-color: #02363D;
+  color: var(--toc-hover-color, #176F6F);
+  background-color: var(--toc-hover-background-color, #F3FCFB);
+  border-color: var(--toc-active-border-color, #02363D);
   text-decoration: none;
 }
 .pv-toc > li a:active {
-  color: #176F6F;
-  background-color: #F3FCFB;
-  border-color: #02363D;
+  color: var(--toc-pressed-color, #176F6F);
+  background-color: var(--toc-pressed-background-color, #F3FCFB);
+  border-color: var(--toc-active-border-color, #02363D);
 }
 .pv-toc > li[aria-current] a {
-  border-color: #02363D;
-  color: #176F6F;
+  border-color: var(--toc-active-border-color, #02363D);
+  color: var(--toc-active-color, #176F6F);
 }
 
 [class*=pv-container] {
@@ -1966,8 +1966,8 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
   aspect-ratio: 1;
   display: grid;
   place-items: center;
-  color: #FFFFFF;
-  background-color: #C86628;
+  color: var(--color-text-inverse, #FFFFFF);
+  background-color: var(--avatar-background-color, #C86628);
   border-radius: 50%;
   overflow: hidden;
   font-weight: 800;
@@ -2060,15 +2060,15 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 .pv-avatar-group > li, .pv-avatar-group[data-more]:after {
   margin-inline-start: -0.5rem;
-  outline: 2px solid white;
+  outline: 2px solid var(--color-background-body, white);
 }
 .pv-avatar-group[data-more]:after {
   content: "+" attr(data-more);
-  color: #FFFFFF;
-  background-color: #176F6F;
+  color: var(--avatar-group-more-font-color, #FFFFFF);
+  background-color: var(--avatar-group-more-background-color, #176F6F);
   font-size: #176F6F;
   letter-spacing: unset;
-  outline-color: #FFFFFF;
+  outline-color: var(--avatar-group-more-border-color, #FFFFFF);
 }
 .pv-avatar-group :nth-child(2) {
   background-color: #176F6F;
@@ -2090,7 +2090,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 
 [class*=pv-company]:empty {
-  background-color: #F8F8FA;
+  background-color: var(--company-background-color, #F8F8FA);
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 13c0 5.49-3.763 8.302-8.331 9.894l-.008.003a1.997 1.997 0 0 1-1.326-.015C6.759 21.3 3 18.487 3 13V6a2 2 0 0 1 2-2c1.794 0 4.021-1.11 5.582-2.473l.009-.007a2.165 2.165 0 0 1 2.818 0l.009.007C14.988 2.899 17.206 4 19 4a2.008 2.008 0 0 1 1.11.336l.304.25A2 2 0 0 1 21 6v7Zm-2 0V6c-2.206 0-4.966-1.278-6.896-2.965a.171.171 0 0 0-.214.005C9.971 4.713 7.203 6 5 6v7c0 4.51 3.235 6.696 6.996 7.995l.023.008C15.768 19.694 19 17.507 19 13Zm-8-2V9a1 1 0 0 1 2 0v2h2a1 1 0 0 1 0 2h-2v2a1 1 0 0 1-2 0v-2H9a1 1 0 0 1 0-2h2Z' fill='%23B8C1C4'/%3E%3C/svg%3E");
   background-repeat: no-repeat;
   background-position: center center;
@@ -2296,15 +2296,15 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 [data-collapsed] .pv-nav-list-inverse summary {
   max-width: none;
   display: flex;
-  color: #02363D;
+  color: var(--color-text-body, #02363D);
 }
 .pv-nav-list-inverse a:focus-visible:not([aria-current=page]), .pv-nav-list-inverse a:hover:not([aria-current=page]), .pv-nav-list-inverse summary:focus-visible:not([aria-current=page]), .pv-nav-list-inverse summary:hover:not([aria-current=page]),
 [data-collapsed] .pv-nav-list-inverse a:focus-visible:not([aria-current=page]),
 [data-collapsed] .pv-nav-list-inverse a:hover:not([aria-current=page]),
 [data-collapsed] .pv-nav-list-inverse summary:focus-visible:not([aria-current=page]),
 [data-collapsed] .pv-nav-list-inverse summary:hover:not([aria-current=page]) {
-  color: #02363D;
-  background-color: #F8F8FA;
+  color: var(--color-text-body, #02363D);
+  background-color: var(--nav-list-inverse-hover-background-color, #F8F8FA);
 }
 .pv-nav-list-inverse summary,
 [data-collapsed] .pv-nav-list-inverse summary {
@@ -2316,8 +2316,8 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 .pv-nav-list-inverse [aria-current=page],
 [data-collapsed] .pv-nav-list-inverse [aria-current=page] {
-  background-color: #02363D;
-  color: #FFFFFF;
+  background-color: var(--nav-list-active-background-color, #02363D);
+  color: var(--color-text-inverse, #FFFFFF);
 }
 .pv-nav-list-inverse li:not(:last-child),
 [data-collapsed] .pv-nav-list-inverse li:not(:last-child) {
@@ -2427,7 +2427,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
   }
 }
 .pv-notification {
-  --bg-color: white;
+  --bg-color: var(--color-background-body, white);
   position: relative;
 }
 .pv-notification:after {
@@ -2447,7 +2447,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 
 [class*=pv-toast] {
-  color: #FFFFFF;
+  color: var(--toast-text-color, #FFFFFF);
   padding: 1.25rem;
   display: flex;
   align-items: center;
@@ -2459,29 +2459,29 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 
 .pv-toast-info {
-  background-color: #F7F8F8;
+  background-color: var(--toast-info-background-color, #F7F8F8);
 }
 .pv-toast-info svg:not([class*=pv-button] svg) {
   fill: #FFFFFF;
 }
 
 .pv-toast-success {
-  background-color: #02363D;
+  background-color: var(--toast-success-background-color, #02363D);
 }
 .pv-toast-success svg:not([class*=pv-button] svg) {
   fill: var(--toast-success-icon-color, #FFFFFF);
 }
 
 .pv-toast-error {
-  background-color: #A2191F;
+  background-color: var(--toast-error-background-color, #A2191F);
 }
 .pv-toast-error svg:not([class*=pv-button] svg) {
   fill: #FFFFFF;
 }
 
 .pv-toast-dark {
-  background-color: #242626;
-  color: #FFFFFF;
+  background-color: var(--toast-dark-background-color, #242626);
+  color: var(--toast-dark-color, #FFFFFF);
 }
 .pv-toast-dark svg:not([class*=pv-button] svg) {
   background-image: linear-gradient(138deg, #F1E8FF 4.38%, #D7F3F1 99.39%);
@@ -2628,7 +2628,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 .pv-table-compressed {
   width: 100%;
   border-spacing: 0;
-  background-color: #FFFFFF;
+  background-color: var(--color-background-body, #FFFFFF);
   text-align: left;
   font-size: inherit;
   line-height: inherit;
@@ -2636,8 +2636,8 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 .pv-table th,
 .pv-table-compressed th {
   padding: 0.75rem;
-  border-block-end: 1px solid #DCDFE4;
-  background-color: inherit;
+  border-block-end: 1px solid var(--color-border, #DCDFE4);
+  background-color: var(--table-heading-background-color, inherit);
 }
 .pv-table th a,
 .pv-table-compressed th a {
@@ -2679,7 +2679,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
   padding-block: 0.5rem;
 }
 .pv-table-compressed :where(th) {
-  background-color: #F3F4F6;
+  background-color: var(--table-compressed-heading-background-color, #F3F4F6);
   font-size: 1rem;
   line-height: 1.5;
   font-weight: 600;
@@ -2691,11 +2691,11 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 
 .pv-table-bordered,
 .pv-table-compressed {
-  border-block-start: 1px solid #DCDFE4;
+  border-block-start: 1px solid var(--color-border, #DCDFE4);
 }
 .pv-table-bordered td,
 .pv-table-compressed td {
-  border-block-end: 1px solid #DCDFE4;
+  border-block-end: 1px solid var(--color-border, #DCDFE4);
 }
 
 .pv-table.pv-expand th:first-child,
@@ -2730,15 +2730,15 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 
 [class*=pv-table] [data-sort] {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z'/%3E%3C/svg%3E");
+  background-image: var(--table-sort-background-image, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z'/%3E%3C/svg%3E"));
 }
 
 [class*=pv-table] [data-sort=descending] {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z' fill='%2302363D'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z'/%3E%3C/svg%3E");
+  background-image: var(--table-sort-descending-background-image, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z' fill='%2302363D'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z'/%3E%3C/svg%3E"));
 }
 
 [class*=pv-table] [data-sort=ascending] {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z' fill='%2302363D'/%3E%3C/svg%3E");
+  background-image: var(--table-sort-ascending-background-image, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z' fill='%2302363D'/%3E%3C/svg%3E"));
 }
 
 .pv-table-matrix,
@@ -2755,16 +2755,16 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 .pv-table-matrix-compressed :where(thead th) {
   padding: 0.875rem 0.75rem;
   min-height: 69px;
-  background-color: #F8F8FA;
+  background-color: var(--table-matrix-heading-background-color, #F8F8FA);
 }
 .pv-table-matrix :where(thead td),
 .pv-table-matrix-compressed :where(thead td) {
-  background-color: #F8F8FA;
+  background-color: var(--table-matrix-heading-background-color, #F8F8FA);
   text-align: center;
 }
 .pv-table-matrix :where(thead td):not(:last-of-type),
 .pv-table-matrix-compressed :where(thead td):not(:last-of-type) {
-  border-right: 1px solid #DCDFE4;
+  border-right: 1px solid var(--color-border, #DCDFE4);
 }
 .pv-table-matrix thead th:not(:first-of-type),
 .pv-table-matrix-compressed thead th:not(:first-of-type) {
@@ -2774,7 +2774,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 .pv-table-matrix th:first-of-type,
 .pv-table-matrix-compressed th:first-of-type {
   padding-inline: 1.5rem;
-  border-right: 1px solid #DCDFE4;
+  border-right: 1px solid var(--color-border, #DCDFE4);
 }
 .pv-table-matrix th, .pv-table-matrix td,
 .pv-table-matrix-compressed th,
@@ -2784,13 +2784,13 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 .pv-table-matrix tr > *,
 .pv-table-matrix-compressed tr > * {
-  border-bottom: 1px solid #DCDFE4;
+  border-bottom: 1px solid var(--color-border, #DCDFE4);
 }
 .pv-table-matrix tr > *:not(:first-of-type, :last-of-type),
 .pv-table-matrix tbody td:not(:last-of-type),
 .pv-table-matrix-compressed tr > *:not(:first-of-type, :last-of-type),
 .pv-table-matrix-compressed tbody td:not(:last-of-type) {
-  border-right: 1px solid #DCDFE4;
+  border-right: 1px solid var(--color-border, #DCDFE4);
 }
 .pv-table-matrix tbody th,
 .pv-table-matrix thead th:first-of-type,
@@ -2802,7 +2802,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 .pv-table-matrix tbody th,
 .pv-table-matrix-compressed tbody th {
   z-index: 20;
-  background-color: #FFFFFF;
+  background-color: var(--color-background-body, #FFFFFF);
 }
 .pv-table-matrix thead th:first-of-type,
 .pv-table-matrix-compressed thead th:first-of-type {
@@ -2836,7 +2836,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 }
 [class*=pv-table]:has(td .pv-table-button) td:has(.pv-table-button) button:where(:hover, :focus-visible),
 [class*=pv-table]:has(td .pv-table-button) td:has(.pv-table-button) .pv-table-button:where(:hover, :focus-visible) {
-  background-color: #F8F8FA;
+  background-color: var(--table-button-hover-background-color, #F8F8FA);
 }
 [class*=pv-table]:has(td .pv-table-button) td:has(.pv-table-button) button:where(:hover, :focus-visible) > div:last-of-type,
 [class*=pv-table]:has(td .pv-table-button) td:has(.pv-table-button) .pv-table-button:where(:hover, :focus-visible) > div:last-of-type {
@@ -2870,7 +2870,7 @@ div:has(> .pv-input-text[data-suffix="%"]) .pv-input-text {
 
 .pv-table-vertical-borders td:not(:last-child),
 .pv-table-vertical-borders th:not(:last-child) {
-  border-inline-end: 1px solid #DCDFE4;
+  border-inline-end: 1px solid var(--color-border, #DCDFE4);
 }
 
 [class*=pv-table] [data-symbol] {
@@ -2930,11 +2930,12 @@ td:not([rowspan]) > .pv-responsive-cell {
   --offset: 0;
   position: sticky;
   left: var(--offset);
-  background-color: #F8F8FA;
+  background-color: var(--table-sticky-column-background-color, #F8F8FA);
   z-index: 10;
 }
 
 [class*=pv-table] thead [data-sticky-col] {
+  background-color: var(--table-sticky-heading-background-color, var(--table-sticky-column-background-color, #F8F8FA));
   z-index: 60;
 }
 
@@ -2944,7 +2945,7 @@ td:not([rowspan]) > .pv-responsive-cell {
 
 .pv-cell-hover:hover,
 .pv-cell-hover:focus-within {
-  background-color: #F8F8FA;
+  background-color: var(--color-background-accent, #F8F8FA);
 }
 
 .pv-floating-native {
@@ -2974,7 +2975,7 @@ td:not([rowspan]) > .pv-responsive-cell {
   overflow-y: auto;
   overflow-x: hidden;
   position: var(--position);
-  background-color: #FFFFFF;
+  background-color: var(--color-background-body, #FFFFFF);
   box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.3), 0px 8px 12px -4px rgba(0, 0, 0, 0.08), 0px 12px 16px rgba(0, 0, 0, 0.1);
   border-radius: 5px;
   top: 100%;
@@ -3010,7 +3011,7 @@ td:not([rowspan]) > .pv-responsive-cell {
   line-height: var(--popover-list-item-line-height, 1.25);
   font-weight: 400;
   text-decoration: none;
-  color: #02363D;
+  color: var(--color-text-body, #02363D);
   transition-duration: 0.125s;
   transition-property: background-color;
 }
@@ -3131,8 +3132,8 @@ strong[class*=pv-tag] {
 .pv-tag-green-inverse,
 .pv-tag-orange-inverse,
 .pv-tag-turquoise-inverse {
-  border-color: transparent;
-  color: #FFFFFF;
+  border-color: var(--tag-inverse-border-color, transparent);
+  color: var(--tag-inverse-color, #FFFFFF);
 }
 
 .pv-tag-inverse {
@@ -3159,8 +3160,8 @@ strong[class*=pv-tag] {
 }
 
 .pv-tag-yellow-inverse {
-  background-color: #EAB333;
-  color: #02363D;
+  background-color: var(--tag-yellow-inverse-background-color, #EAB333);
+  color: var(--tag-yellow-inverse-color, #02363D);
 }
 
 .pv-tag-green,
@@ -3171,7 +3172,7 @@ strong[class*=pv-tag] {
 }
 
 .pv-tag-green-inverse {
-  background-color: #198038;
+  background-color: var(--tag-green-inverse-background-color, #198038);
 }
 
 .pv-tag-orange,
@@ -3182,7 +3183,7 @@ strong[class*=pv-tag] {
 }
 
 .pv-tag-orange-inverse {
-  background-color: #BA4E01;
+  background-color: var(--tag-orange-inverse-background-color, #BA4E01);
 }
 
 .pv-tag-turquoise {
@@ -3192,7 +3193,7 @@ strong[class*=pv-tag] {
 }
 
 .pv-tag-turquoise-inverse {
-  background-color: #176F6F;
+  background-color: var(--tag-turquoise-inverse-background-color, #176F6F);
 }
 
 .pv-tag-purple {
@@ -3218,10 +3219,10 @@ strong[class*=pv-tag] {
 }
 
 button.pv-tag-primary:hover, button.pv-tag-primary:focus-visible {
-  background-color: #0D5256;
+  background-color: var(--tag-primary-hover-background-color, #0D5256);
 }
 button.pv-tag-primary:active {
-  background-color: #02363D;
+  background-color: var(--tag-primary-pressed-background-color, #02363D);
 }
 
 .pv-tag-secondary {
@@ -3231,11 +3232,11 @@ button.pv-tag-primary:active {
 }
 
 button.pv-tag-secondary:hover, button.pv-tag-secondary:focus-visible {
-  background-color: #E8F2F4;
+  background-color: var(--tag-secondary-hover-background-color, #E8F2F4);
   color: #121313;
 }
 button.pv-tag-secondary:active {
-  background-color: #C7D8DB;
+  background-color: var(--tag-secondary-pressed-background-color, #C7D8DB);
   color: #121313;
 }
 
@@ -3364,8 +3365,8 @@ button.pv-tag-secondary:active {
   display: inline-block;
   width: 1.5rem;
   height: 1.5rem;
-  color: #FFFFFF;
-  background-color: #ADB5C0;
+  color: var(--color-text-inverse, #FFFFFF);
+  background-color: var(--tab-list-counter-background-color, #ADB5C0);
   margin-inline-end: 0.5rem;
   text-align: center;
   border-radius: 50%;
@@ -3373,13 +3374,13 @@ button.pv-tag-secondary:active {
   line-height: 2;
 }
 :where(ol.pv-tab-list) [data-active] > a:before {
-  background-color: #176F6F;
+  background-color: var(--tab-list-indicator-color, #176F6F);
 }
 :where(ol.pv-tab-list) [data-complete] {
   opacity: 1;
 }
 :where(ol.pv-tab-list) [data-complete] > a:before {
-  background-color: #176F6F;
+  background-color: var(--tab-list-indicator-color, #176F6F);
   color: transparent;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.1 4.9c.6.6.6 1.5 0 2.1l-11 11c-.6.6-1.5.6-2.1 0l-5-5c-.6-.6-.6-1.5 0-2.1.6-.6 1.5-.6 2.1 0l3.9 4L18.9 5c.6-.6 1.6-.6 2.2-.1z' fill='%23fff'/%3E%3C/svg%3E");
   background-repeat: no-repeat;
@@ -3394,7 +3395,7 @@ button.pv-tag-secondary:active {
   border: none;
   border-radius: 5px;
   box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.35), 0px 12px 20px rgba(0, 0, 0, 0.25), 0px 16px 28px -8px rgba(0, 0, 0, 0.25);
-  color: #02363D;
+  color: var(--color-text-body, #02363D);
   max-width: min(100% - 2rem, var(--max-width));
   max-height: min(100% - 2rem, var(--max-height));
   margin-inline: auto;
@@ -3444,7 +3445,7 @@ button.pv-tag-secondary:active {
   display: flex;
   gap: 0.5rem;
   align-items: center;
-  color: #6E7784;
+  color: var(--breadcrumbs-color, #6E7784);
 }
 .pv-breadcrumbs li a {
   color: inherit;
@@ -3453,17 +3454,17 @@ button.pv-tag-secondary:active {
 .pv-breadcrumbs li:not(:last-child):after {
   display: block;
   content: "/";
-  color: #6E7784;
+  color: var(--breadcrumbs-separator-color, #6E7784);
   width: auto;
   height: auto;
-  background-image: none;
+  background-image: var(--breadcrumbs-background-image, none);
   background-repeat: no-repeat;
   background-size: 100% 100%;
   background-position: center center;
 }
 .pv-breadcrumbs li:last-child {
   font-weight: 600;
-  color: #02363D;
+  color: var(--breadcrumbs-active-color, #02363D);
 }
 
 .pv-dropdown {
@@ -3776,15 +3777,15 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   top: calc(100% + 0.25rem);
   width: max-content;
   max-width: var(--max-width);
-  background-color: #011214;
-  color: #FFFFFF;
+  background-color: var(--tooltip-background-color, #011214);
+  color: var(--tooltip-color, #FFFFFF);
   padding: 0.5rem 0.75rem;
   border-radius: 0.25rem;
   font-size: 0.875rem;
   line-height: 1.42857143;
   box-shadow: 0px 12px 16px 0px rgba(0, 0, 0, 0.1), 0px 8px 12px -4px rgba(0, 0, 0, 0.08), 0px 0px 1px 0px rgba(0, 0, 0, 0.3);
   z-index: 50;
-  border: 1px solid transparent;
+  border: 1px solid var(--tooltip-border-color, transparent);
 }
 .pv-tooltip[data-position*=top] > [role=tooltip],
 .pv-hover-card[data-position*=top] > [role=tooltip] {
@@ -3852,17 +3853,17 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 }
 .pv-tooltip > [role=tooltip] a,
 .pv-hover-card > [role=tooltip] a {
-  color: #A8E6E1;
+  color: var(--tooltip-link-color, #A8E6E1);
 }
 .pv-tooltip[data-style=white] > [role=tooltip],
 .pv-hover-card[data-style=white] > [role=tooltip] {
-  background-color: white;
-  color: #02363D;
-  border-color: #DCDFE4;
+  background-color: var(--tooltip-white-background-color, white);
+  color: var(--tooltip-white-color, #02363D);
+  border-color: var(--tooltip-white-border-color, #DCDFE4);
 }
 .pv-tooltip[data-style=white] > [role=tooltip] a,
 .pv-hover-card[data-style=white] > [role=tooltip] a {
-  color: #176F6F;
+  color: var(--tooltip-white-link-color, #176F6F);
 }
 .pv-tooltip[data-static]:after,
 .pv-hover-card[data-static]:after {
@@ -3889,9 +3890,9 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 }
 
 .pv-hover-card:hover > [role=tooltip] {
-  background-color: #FFFFFF;
-  border: 1px solid #DCDFE4;
-  color: #02363D;
+  background-color: var(--color-background-body, #FFFFFF);
+  border: 1px solid var(--color-border, #DCDFE4);
+  color: var(--color-text-body, #02363D);
   padding: 1rem;
 }
 
@@ -3900,13 +3901,13 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   max-width: var(--max-width);
   width: max-content;
   padding: 0.5rem 0.75rem;
-  border: 1px solid transparent;
+  border: 1px solid var(--tooltip-border-color, transparent);
   border-radius: 0.25rem;
   font-size: 0.875rem;
   line-height: 1.42857143;
   box-shadow: 0px 12px 16px 0px rgba(0, 0, 0, 0.1), 0px 8px 12px -4px rgba(0, 0, 0, 0.08), 0px 0px 1px 0px rgba(0, 0, 0, 0.3);
-  background-color: #011214;
-  color: #FFFFFF;
+  background-color: var(--tooltip-background-color, #011214);
+  color: var(--tooltip-color, #FFFFFF);
 }
 
 .pv-tooltip-v2-content-small {
@@ -3915,30 +3916,30 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 }
 
 .pv-tooltip[data-style=white] .pv-tooltip-v2-content {
-  background-color: white;
-  color: #02363D;
-  border-color: #DCDFE4;
+  background-color: var(--tooltip-white-background-color, white);
+  color: var(--tooltip-white-color, #02363D);
+  border-color: var(--tooltip-white-border-color, #DCDFE4);
 }
 .pv-tooltip[data-style=white] .pv-tooltip-v2-content a {
-  color: #176F6F;
+  color: var(--tooltip-white-link-color, #176F6F);
 }
 
 .pv-tooltip[data-style=dark] .pv-tooltip-v2-content {
-  background-color: #011214;
-  color: #FFFFFF;
-  border-color: transparent;
+  background-color: var(--tooltip-background-color, #011214);
+  color: var(--tooltip-color, #FFFFFF);
+  border-color: var(--tooltip-border-color, transparent);
 }
 .pv-tooltip[data-style=dark] .pv-tooltip-v2-content a {
-  color: #A8E6E1;
+  color: var(--tooltip-link-color, #A8E6E1);
 }
 
 .pv-tooltip-v2-content[data-variant=white] {
-  background-color: white;
-  color: #02363D;
-  border-color: #DCDFE4;
+  background-color: var(--tooltip-white-background-color, white);
+  color: var(--tooltip-white-color, #02363D);
+  border-color: var(--tooltip-white-border-color, #DCDFE4);
 }
 .pv-tooltip-v2-content[data-variant=white] a {
-  color: #176F6F;
+  color: var(--tooltip-white-link-color, #176F6F);
 }
 
 .pv-tooltip-v2-content[data-variant=dark] .pv-accordion {
@@ -4124,7 +4125,7 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   --max-width: 360px;
   --text-color: #FFFFFF;
   --hover-color: #FFFFFF;
-  background-color: #02363D;
+  background-color: var(--color-background-brand, #02363D);
   box-shadow: 0 8px 32px rgba(2, 54, 61, 0.24);
   color: var(--text-color);
   display: flex;
@@ -4159,8 +4160,8 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   white-space: nowrap;
   justify-content: space-between;
   gap: 0.5rem;
-  background-color: #02363D;
-  color: #FFFFFF;
+  background-color: var(--action-bar-background-color, #02363D);
+  color: var(--action-bar-color, #FFFFFF);
   padding: 0;
   box-shadow: 0 8px 32px rgba(2, 54, 61, 0.24);
   border-radius: 4px;
@@ -4175,8 +4176,8 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   white-space: nowrap;
   justify-content: space-between;
   gap: 0.5rem;
-  background-color: #02363D;
-  color: #FFFFFF;
+  background-color: var(--action-bar-background-color, #02363D);
+  color: var(--action-bar-color, #FFFFFF);
   padding: 0;
   box-shadow: 0 8px 32px rgba(2, 54, 61, 0.24);
   border-radius: 4px;
@@ -4186,13 +4187,13 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 }
 
 .pv-action-bar-container[data-style=white] > div {
-  background-color: #02363D;
-  color: #02363D;
+  background-color: var(--action-bar-white-background-color, #02363D);
+  color: var(--action-bar-white-color, #02363D);
 }
 
 .pv-action-bar-container[data-style=white] > ::slotted(*) {
-  background-color: #02363D;
-  color: #02363D;
+  background-color: var(--action-bar-white-background-color, #02363D);
+  color: var(--action-bar-white-color, #02363D);
 }
 
 .pv-card {
@@ -4269,7 +4270,7 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 
 .pv-card:is(button) {
   text-align: left;
-  background-color: #FFFFFF;
+  background-color: var(--card-background-color, #FFFFFF);
   cursor: pointer;
 }
 
@@ -4303,8 +4304,8 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 .pv-card-select {
   --unselected: "Apply to Table";
   --selected: "Applied";
-  --unselected-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.85 11.151a1.2 1.2 0 0 0-1.698 0l-4.951 4.952V5a1.2 1.2 0 0 0-2.4 0v11.103L5.849 11.15a1.2 1.2 0 1 0-1.697 1.697l7 7a1.2 1.2 0 0 0 1.697 0l7-7a1.2 1.2 0 0 0 0-1.697Z' fill='%23176F6F'/%3E%3C/svg%3E");
-  --selected-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.1 4.9c.6.6.6 1.5 0 2.1l-11 11c-.6.6-1.5.6-2.1 0l-5-5c-.6-.6-.6-1.5 0-2.1.6-.6 1.5-.6 2.1 0l3.9 4L18.9 5c.6-.6 1.6-.6 2.2-.1z' fill='%23176F6F'/%3E%3C/svg%3E");
+  --unselected-icon: var(--card-select-unselected-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.85 11.151a1.2 1.2 0 0 0-1.698 0l-4.951 4.952V5a1.2 1.2 0 0 0-2.4 0v11.103L5.849 11.15a1.2 1.2 0 1 0-1.697 1.697l7 7a1.2 1.2 0 0 0 1.697 0l7-7a1.2 1.2 0 0 0 0-1.697Z' fill='%23176F6F'/%3E%3C/svg%3E"));
+  --selected-icon: var(--card-select-selected-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.1 4.9c.6.6.6 1.5 0 2.1l-11 11c-.6.6-1.5.6-2.1 0l-5-5c-.6-.6-1.5-.6-2.1 0l3.9 4L18.9 5c.6-.6 1.6-.6 2.2-.1z' fill='%23176F6F'/%3E%3C/svg%3E"));
   --gap: 1rem;
   display: flex;
   gap: var(--gap);
@@ -4314,10 +4315,10 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 }
 .pv-card-select > label {
   flex: 1;
-  background-color: #FFFFFF;
-  color: #02363D;
+  background-color: var(--card-background-color, #FFFFFF);
+  color: var(--color-text-body, #02363D);
   font-weight: 400;
-  border: 2px solid #DCDFE4;
+  border: 2px solid var(--card-border-color, #DCDFE4);
   border-radius: 5px;
   display: flex;
   flex-direction: column;
@@ -4327,13 +4328,13 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
 }
 .pv-card-select > label > :first-child {
   flex: 1;
-  border-bottom: 1px solid #DCDFE4;
+  border-bottom: 1px solid var(--card-border-color, #DCDFE4);
   transition-duration: 0.125s;
 }
 .pv-card-select > label > :last-child {
   padding: 1rem 1.5rem;
   font-weight: 600;
-  color: #176F6F;
+  color: var(--color-text-brand, #176F6F);
   background-image: var(--unselected-icon);
   background-repeat: no-repeat;
   background-size: 1.5rem 1.5rem;
@@ -4343,19 +4344,19 @@ pv-dropdown-auto-close.pv-dropdown > [class*=pv-button][data-dropdown] {
   content: var(--unselected);
 }
 .pv-card-select > label:hover {
-  color: #176F6F;
+  color: var(--color-text-brand, #176F6F);
   cursor: pointer;
-  border-color: #176F6F;
+  border-color: var(--color-border-accent, #176F6F);
 }
 .pv-card-select > label:hover > :first-child {
-  border-color: #176F6F;
+  border-color: var(--color-border-accent, #176F6F);
 }
 .pv-card-select > input:checked + label {
-  background-color: #F3FCFB;
-  border-color: #176F6F;
+  background-color: var(--card-hover-background-color, #F3FCFB);
+  border-color: var(--color-border-accent, #176F6F);
 }
 .pv-card-select > input:checked + label > :first-child {
-  border-color: #176F6F;
+  border-color: var(--color-border-accent, #176F6F);
 }
 .pv-card-select > input:checked + label > :last-child {
   background-image: var(--selected-icon);
@@ -4404,10 +4405,10 @@ pv-figure-details details > div {
 pv-figure-details details {
   max-width: 520px;
   margin-inline: auto;
-  border-block-end: 1px solid #DCDFE4;
+  border-block-end: 1px solid var(--color-border, #DCDFE4);
 }
 pv-figure-details details:first-of-type {
-  border-block-start: 1px solid #DCDFE4;
+  border-block-start: 1px solid var(--color-border, #DCDFE4);
 }
 pv-figure-details.pv-text-inverse summary {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23fff' d='M10 2.917c.69 0 1.25.56 1.25 1.25V8.75h4.584a1.25 1.25 0 0 1 0 2.5H11.25v4.583a1.25 1.25 0 0 1-2.5 0V11.25H4.167a1.25 1.25 0 1 1 0-2.5H8.75V4.167c0-.69.56-1.25 1.25-1.25Z'/%3E%3C/svg%3E");
@@ -4416,10 +4417,10 @@ pv-figure-details.pv-text-inverse details[open] summary {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%23fff' d='M2.917 10c0-.69.56-1.25 1.25-1.25h11.667a1.25 1.25 0 0 1 0 2.5H4.167c-.69 0-1.25-.56-1.25-1.25Z'/%3E%3C/svg%3E");
 }
 pv-figure-details.pv-text-inverse details {
-  border-block-end: 1px solid #176F6F;
+  border-block-end: 1px solid var(--color-border-accent, #176F6F);
 }
 pv-figure-details.pv-text-inverse details:first-of-type {
-  border-block-start: 1px solid #176F6F;
+  border-block-start: 1px solid var(--color-border-accent, #176F6F);
 }
 
 div:has(> pv-figure-details) {
@@ -4508,8 +4509,8 @@ div.pv-drawer[open] {
 }
 
 .pv-rating {
-  --background-color: #D9DEDE;
-  --icon-color: #36C5BA;
+  --background-color: var(--rating-background-color, #D9DEDE);
+  --icon-color: var(--rating-icon-color, #36C5BA);
   --height: 40px;
   aspect-ratio: 220/40;
   position: relative;
@@ -4557,8 +4558,8 @@ div.pv-drawer[open] {
 }
 
 .pv-rating[data-rating=bar] {
-  --background-color: #D9DEDE;
-  --icon-color: #176F6F;
+  --background-color: var(--rating-background-color, #D9DEDE);
+  --icon-color: var(--rating-bar-icon-color, #176F6F);
   --height: 10px;
   display: flex;
   align-items: center;
@@ -4583,9 +4584,9 @@ div.pv-drawer[open] {
 }
 
 .pv-rating[data-rating=dot] {
-  --background-color: #D9DEDE;
+  --background-color: var(--rating-background-color, #D9DEDE);
   --mask-color: white;
-  --icon-color: #36C5BA;
+  --icon-color: var(--rating-icon-color, #36C5BA);
   --height: 10px;
   display: flex;
   aspect-ratio: unset;
@@ -4657,8 +4658,8 @@ div.pv-drawer[open] {
   --size: 40px;
   width: var(--size);
   aspect-ratio: 1;
-  background-color: #176F6F;
-  color: #FFFFFF;
+  background-color: var(--counter-background-color, #176F6F);
+  color: var(--counter-color, #FFFFFF);
   display: grid;
   place-items: center;
   font-size: 1.125rem;
@@ -4678,11 +4679,11 @@ div.pv-drawer[open] {
   border: 2px solid transparent;
 }
 .ag-theme-pv .ag-header-cell-filter-button:hover {
-  border: 2px solid #176F6F;
+  border: 2px solid var(--ag-filter-active-color, #176F6F);
 }
 
 .ag-theme-pv .ag-filter-active {
-  border-color: #176F6F;
+  border-color: var(--ag-filter-active-color, #176F6F);
 }
 .ag-theme-pv .ag-filter-active .ag-icon-filter:after {
   background-image: var(--ag-icon-image-filter-active);
@@ -4701,10 +4702,10 @@ div.pv-drawer[open] {
   padding: 0.5rem;
   font-size: 16px;
   line-height: 1.5;
-  border: 2px solid #DCDFE4;
+  border: 2px solid var(--color-border, #DCDFE4);
   border-radius: 2px;
   appearance: none;
-  background-color: #fff;
+  background-color: var(--color-background-body, #fff);
   width: 100%;
   min-width: fit-content;
 }
@@ -4712,7 +4713,7 @@ div.pv-drawer[open] {
   box-shadow: none;
 }
 .ag-theme-pv .ag-ltr input[class^=ag-][type=text]:not(:disabled, [data-invalid]):focus-visible, .ag-theme-pv .ag-ltr input[class^=ag-][type=text]:not(:disabled, [data-invalid]):hover {
-  border-color: #176F6F;
+  border-color: var(--ag-filter-active-color, #176F6F);
   outline: none;
 }
 
@@ -4752,10 +4753,10 @@ pv-data-grid.ag-theme-pv {
   display: block;
   --ag-font-family: HK Grotesk, sans-serif !important;
   --ag-font-size: 0.875rem !important;
-  --ag-foreground-color: #02363D !important;
-  --ag-border-color: #DCDFE4 !important;
-  --ag-background-color: #FFFFFF !important;
-  --ag-odd-row-background-color: #FFFFFF !important;
+  --ag-foreground-color: var(--pv-ag-foreground-color, #02363D) !important;
+  --ag-border-color: var(--pv-ag-border-color, #DCDFE4) !important;
+  --ag-background-color: var(--pv-ag-background-color, #FFFFFF) !important;
+  --ag-odd-row-background-color: var(--pv-ag-odd-row-background-color, #FFFFFF) !important;
   --ag-row-grid-size: 0.25rem !important;
   --ag-header-height: 1.875rem !important;
   --ag-row-height: 1.875rem !important;
@@ -4763,21 +4764,22 @@ pv-data-grid.ag-theme-pv {
   --ag-cell-horizontal-border: solid #DCDFE4 !important;
   --ag-column-border: solid 1px #DCDFE4 !important;
   --ag-active-color: #176F6F !important;
-  --ag-row-hover-color: #F3FCFB !important;
+  --ag-row-hover-color: var(--pv-ag-row-hover-color, #F3FCFB) !important;
   --ag-range-selection-background-color: rgba(0,0,0,0.2) !important;
-  --ag-accent-color: #176F6F !important;
-  --ag-header-cell-hover-background-color: #E2F7F5;
+  --ag-accent-color: var(--pv-ag-accent-color, #176F6F) !important;
+  --ag-header-cell-hover-background-color: var(--pv-ag-header-cell-hover-background-color, #E2F7F5);
   --ag-header-column-separator-height: 100%;
   --ag-popup-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.30), 0px 8px 12px -4px rgba(0, 0, 0, 0.08), 0px 12px 16px 0px rgba(0, 0, 0, 0.10);
   --ag-card-radius: .25rem;
   --ag-borders: 1px solid;
-  --ag-menu-border-color: #DCDFE4;
-  --ag-menu-background-color: #FFFFFF;
+  --ag-menu-border-color: var(--pv-ag-menu-border-color, #DCDFE4);
+  --ag-menu-background-color: var(--pv-ag-menu-background-color, #FFFFFF);
   --ag-list-item-height: 36px;
-  --ag-secondary-foreground-color: #02363D;
+  --ag-secondary-foreground-color: var(--pv-ag-secondary-foreground-color, #02363D);
   --ag-icon-size: 16px;
   --ag-icon-font-display: none;
   --ag-icon-font-color: $color-text-body;
+  --ag-icon-font-color-filter: var(--pv-ag-icon-font-color-filter, #02363D);
   --ag-icon-image-none: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z'/%3E%3C/svg%3E");
   --ag-icon-image-asc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z' fill='%2302363D'/%3E%3C/svg%3E");
   --ag-icon-image-desc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2302363D66'%3E%3Cpath d='M6.2 14.2c.5-.5 1.2-.5 1.7 0l4.2 4.2 4.2-4.2c.5-.5 1.2-.5 1.7 0s.5 1.2 0 1.7l-5 5c-.5.5-1.2.5-1.7 0l-5-5c-.6-.5-.6-1.3-.1-1.7z' fill='%2302363D'/%3E%3Cpath d='M11.2 3.2c.5-.5 1.2-.5 1.7 0l5 5c.5.5.5 1.2 0 1.7s-1.2.5-1.7 0L12 5.7 7.8 9.8c-.5.5-1.2.5-1.7 0s-.5-1.2 0-1.7l5.1-4.9z'/%3E%3C/svg%3E");
@@ -4869,36 +4871,36 @@ pv-data-grid.ag-theme-pv {
   transition-property: background-color, color;
   padding: 0.5rem 1rem;
   color: white !important;
-  background-color: #176F6F;
+  background-color: var(--button-primary-background-color, #176F6F);
 }
 .ag-button:not(:disabled):hover, .ag-button:not(:disabled):focus-visible,
 .ag-filter-apply-panel-button:not(:disabled):hover,
 .ag-filter-apply-panel-button:not(:disabled):focus-visible {
   color: white;
-  background-color: #0D5256;
+  background-color: var(--button-primary-hover-background-color, #0D5256);
 }
 
 .ag-checkbox-input-wrapper {
   appearance: none;
   width: 1rem !important;
   height: 1rem !important;
-  background-color: white;
-  border: 2px solid #DCDFE4;
+  background-color: var(--color-background-body, white);
+  border: 2px solid var(--checkbox-border, #DCDFE4);
   flex-shrink: 0;
   border-radius: 2px !important;
   transition-duration: 0.125s;
   transition-property: background-color, border-color;
 }
 .ag-checkbox-input-wrapper:focus-visible:not(:disabled), .ag-checkbox-input-wrapper:hover:not(:disabled) {
-  border-color: #176F6F;
+  border-color: var(--ag-filter-active-color, #176F6F);
 }
 .ag-checkbox-input-wrapper.ag-checked {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23fff' d='m12 2.256-7.762 8.87L0 6.89l1.466-1.466 2.67 2.67L10.44.892 12 2.256Z'/%3E%3C/svg%3E");
-  background-color: #218C88;
-  border-color: #218C88;
+  background-color: var(--checkbox-checked-background-color, #218C88);
+  border-color: var(--checkbox-checked-border-color, #218C88);
 }
 .ag-checkbox-input-wrapper.ag-checked:focus-visible:not(:disabled), .ag-checkbox-input-wrapper.ag-checked:hover:not(:disabled) {
-  background-color: #176F6F;
+  background-color: var(--checkbox-checked-hover-background-color, #176F6F);
 }
 .ag-checkbox-input-wrapper.ag-checked:before {
   background-image: none !important;
@@ -4926,7 +4928,7 @@ pv-data-grid.ag-theme-pv {
 }
 
 .ag-cell-range-single-cell {
-  border: 1px solid #02363D !important;
+  border: 1px solid var(--ag-cell-range-border-color, #02363D) !important;
 }
 
 .ag-select .ag-picker-field-wrapper {
@@ -4979,11 +4981,11 @@ pv-data-grid.ag-theme-pv {
 }
 
 .ag-theme-pv .data-grid-cell-top-border {
-  border-top: 1px solid #DCDFE4;
+  border-top: 1px solid var(--color-border, #DCDFE4);
 }
 
 .ag-theme-pv .data-grid-cell-bottom-border {
-  border-bottom: 1px solid #DCDFE4;
+  border-bottom: 1px solid var(--color-border, #DCDFE4);
 }
 
 [class*=pv-banner] {
@@ -5130,26 +5132,26 @@ pv-data-grid.ag-theme-pv {
   font-size: 12px;
   line-height: 1rem;
   border: 1px solid transparent;
-  color: #FFFFFF;
+  color: var(--badge-primary-color, #FFFFFF);
   padding: calc(0.125rem - 1px);
   min-width: 20px;
-  background-color: #176F6F;
+  background-color: var(--badge-primary-background-color, #176F6F);
 }
 
 .pv-badge-secondary {
-  border-color: #DCDFE4;
-  background-color: #FFFFFF;
-  color: #02363D;
+  border-color: var(--badge-secondary-border-color, #DCDFE4);
+  background-color: var(--badge-secondary-background-color, #FFFFFF);
+  color: var(--badge-secondary-color, #02363D);
 }
 
 .pv-badge-tertiary {
-  background-color: #E0E5E4;
-  color: #6E7784;
+  background-color: var(--badge-tertiary-background-color, #E0E5E4);
+  color: var(--badge-tertiary-color, #6E7784);
 }
 
 .pv-badge-ghost {
-  background-color: transparent;
-  color: #6E7784;
+  background-color: var(--badge-ghost-background-color, transparent);
+  color: var(--badge-ghost-color, #6E7784);
 }
 
 .pv-badge-sm {
@@ -5300,7 +5302,7 @@ pv-data-grid.ag-theme-pv {
 }
 .pv-layout-primary > [data-grid-area=content] > [data-grid-area=header],
 .pv-layout-primary[data-collapsed] > [data-grid-area=content] > [data-grid-area=header] {
-  background-color: #F8F8FA;
+  background-color: var(--color-background-accent, #F8F8FA);
   padding-inline: 1.5rem;
   border-block-end: 1px solid var(--layout-primary-sidebar-header-border-color, #FFFFFF);
 }
@@ -5364,12 +5366,12 @@ body:has(> .pv-layout-primary) {
 }
 .pv-layout-sidebar > [data-grid-area=main] > :nth-child(2) {
   grid-row: 2/2;
-  background-color: #F8F8FA;
-  border-top: 1px solid #DCDFE4;
+  background-color: var(--color-background-accent, #F8F8FA);
+  border-top: 1px solid var(--color-border, #DCDFE4);
 }
 .pv-layout-sidebar > [data-grid-area=sidebar] {
   grid-area: sidebar;
-  border-left: 1px solid #DCDFE4;
+  border-left: 1px solid var(--color-border, #DCDFE4);
   display: grid;
   grid-template-rows: auto 1fr;
 }
@@ -5389,7 +5391,7 @@ body:has(> .pv-layout-primary) {
 .pv-layout-ama {
   display: grid;
   align-content: start;
-  background-image: linear-gradient(109.07deg, #176F6F 0%, #02363D 100%);
+  background-image: var(--color-background-brand-gradient, linear-gradient(109.07deg, #176F6F 0%, #02363D 100%));
   min-height: 100%;
 }
 
@@ -5416,7 +5418,7 @@ body:has(> .pv-layout-primary) {
   height: 100%;
 }
 .pv-layout-sidebar-left > :first-child {
-  border-right: 1px solid #DCDFE4;
+  border-right: 1px solid var(--color-border, #DCDFE4);
 }
 
 .pv-layout-website > section > div,
@@ -5480,7 +5482,7 @@ body:has(> .pv-layout-primary) {
   --right-size: var(--min-size) !important;
 }
 .pv-layout-two-sidebar [data-layout=left-sidebar] {
-  border-right: 1px solid #DCDFE4;
+  border-right: 1px solid var(--color-border, #DCDFE4);
   min-width: var(--left-size);
 }
 .pv-layout-two-sidebar [data-layout=left-sidebar][data-hidden] {
@@ -5488,7 +5490,7 @@ body:has(> .pv-layout-primary) {
   width: var(--min-size);
 }
 .pv-layout-two-sidebar [data-layout=right-sidebar] {
-  border-left: 1px solid #DCDFE4;
+  border-left: 1px solid var(--color-border, #DCDFE4);
   min-width: var(--right-size);
 }
 .pv-layout-two-sidebar [data-layout=right-sidebar][data-hidden] {
@@ -5510,7 +5512,7 @@ body:has(> .pv-layout-primary) {
 }
 
 .pv-surface {
-  background-color: var(--color-background-white, #FFFFFF);
+  background-color: var(--color-background-white, var(--color-background-body, #FFFFFF));
 }
 
 .pv-surface-brand-inverse {
@@ -5620,7 +5622,7 @@ svg.pv-text-inherit {
 }
 
 .pv-data-text-visualization-2 {
-  color: #16696D;
+  color: var(--data-visualization-2-color, #16696D);
 }
 
 .pv-data-text-visualization-3 {
@@ -5648,7 +5650,7 @@ svg.pv-text-inherit {
 }
 
 .pv-data-surface-visualization-2 {
-  background-color: #16696D;
+  background-color: var(--data-visualization-2-color, #16696D);
 }
 
 .pv-data-surface-visualization-3 {
@@ -6381,8 +6383,8 @@ svg.pv-text-inherit {
 }
 
 .select2-selection {
-  background-color: #fff;
-  border: 2px solid #DCDFE4;
+  background-color: var(--color-background-body, #fff);
+  border: var(--select2-border, 2px solid #DCDFE4);
   border-radius: 2px;
   padding-inline-end: 2rem;
   background-repeat: no-repeat;
@@ -6401,7 +6403,7 @@ svg.pv-text-inherit {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  color: #6E7784;
+  color: var(--color-text-subdued, #6E7784);
   line-height: 24px;
 }
 .select2-selection .select2-selection__clear {
@@ -6411,15 +6413,15 @@ svg.pv-text-inherit {
   font-weight: bold;
 }
 .select2-selection .select2-selection__placeholder {
-  color: #6E7784;
+  color: var(--select2-input-placeholder-color, #6E7784);
 }
 .select2-selection .select2-selection__arrow {
   display: none;
 }
 
 .select2-selection--multiple {
-  background-color: white;
-  border: 2px solid #DCDFE4;
+  background-color: var(--color-background-body, white);
+  border: var(--select2-border, 2px solid #DCDFE4);
   border-radius: 2px;
   cursor: text;
 }
@@ -6449,7 +6451,7 @@ svg.pv-text-inherit {
 }
 
 .select2-dropdown {
-  background-color: white;
+  background-color: var(--color-background-body, white);
   border-radius: 5px;
   padding-block: 0.5rem;
   display: block;
@@ -6468,13 +6470,13 @@ svg.pv-text-inherit {
   padding: 0.5rem 2rem 0.5rem 0.5rem;
   line-height: 24px;
   border-radius: 2px;
-  border: 2px solid #DCDFE4;
+  border: var(--select2-border, 2px solid #DCDFE4);
   height: 42px;
   width: 100%;
   position: absolute;
   top: -44px;
   left: 0;
-  background-color: white;
+  background-color: var(--color-background-body, white);
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.151 15.848a1.2 1.2 0 0 0 1.698 0L12 10.698l5.151 5.15a1.2 1.2 0 1 0 1.698-1.697l-6-6a1.2 1.2 0 0 0-1.697 0l-6 6a1.2 1.2 0 0 0 0 1.697Z' fill='%2302363D'/%3E%3C/svg%3E");
   background-repeat: no-repeat;
   background-size: 1rem 1rem;
@@ -6483,7 +6485,7 @@ svg.pv-text-inherit {
 }
 
 .select2-dropdown--above .select2-search__field {
-  background-color: #fff;
+  background-color: var(--color-background-body, #fff);
 }
 
 .select2-container--open .select2-selection__placeholder,
@@ -6495,7 +6497,7 @@ svg.pv-text-inherit {
 .select2-container--focus .select2-selection,
 .select2-container--focus .select2-selection--multiple,
 .select2-container--focus .select2-selection__rendered {
-  border-color: #176F6F;
+  border-color: var(--color-border-accent, #176F6F);
   outline: 0;
   font-size: 16px;
   line-height: 24px;
@@ -6529,7 +6531,7 @@ svg.pv-text-inherit {
   -webkit-user-select: none;
   font-size: 16px;
   line-height: 24px;
-  color: #02363D;
+  color: var(--select2-menu-item-color, #02363D);
 }
 
 .select2-results__option[aria-selected] {
@@ -6608,7 +6610,7 @@ svg.pv-text-inherit {
 }
 
 .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
-  color: #6E7784;
+  color: var(--select2-input-placeholder-color, #6E7784);
   margin-top: 5px;
   float: left;
 }
@@ -6622,7 +6624,7 @@ svg.pv-text-inherit {
 }
 
 .select2-container--default .select2-selection--multiple .select2-selection__choice {
-  background-color: #F8F8FA;
+  background-color: var(--select2-menu-item-background-color, #F8F8FA);
   border: 1px solid #e3e7ea;
   border-radius: 2px;
   padding: 0.125rem 0.5rem;
@@ -6633,7 +6635,7 @@ svg.pv-text-inherit {
 }
 
 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
-  color: #999;
+  color: var(--select2-menu-item-tag-remove-icon-color, #999);
   cursor: pointer;
   display: inline-block;
   font-weight: bold;
@@ -6641,7 +6643,7 @@ svg.pv-text-inherit {
 }
 
 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
-  color: #999;
+  color: var(--select2-menu-item-tag-remove-icon-color, #999);
 }
 
 .select2-container--default.select2-container--disabled .select2-selection--multiple {
@@ -6674,7 +6676,7 @@ svg.pv-text-inherit {
 }
 
 .select2-container--default .select2-results__option[aria-disabled=true] {
-  color: #6E7784;
+  color: var(--select2-input-placeholder-color, #6E7784);
 }
 
 .select2-results__option {
@@ -6684,7 +6686,7 @@ svg.pv-text-inherit {
 
 .select2-results__option[aria-selected=true],
 .select2-results__option--highlighted {
-  background-color: #F8F8FA;
+  background-color: var(--color-background-accent, #F8F8FA);
 }
 
 .select2-container--default .select2-results__group {
@@ -6700,25 +6702,25 @@ svg.pv-text-inherit {
 }
 
 .select2-selection--single .select2-selection__rendered {
-  color: #6E7784;
+  color: var(--select2-text-color, #6E7784);
   padding: 0.5rem;
   font-weight: 500;
 }
 
 .select2-results__option[aria-selected=true] {
-  background-color: #F8F8FA;
+  background-color: var(--select2-menu-item-selected-background-color, #F8F8FA);
 }
 
 .select2-results__option--highlighted {
-  background-color: #F7F8F8;
+  background-color: var(--select2-menu-item-hover-background-color, #F7F8F8);
 }
 
 input.select2-search__field::placeholder {
-  color: #6E7784 !important;
+  color: var(--select2-input-placeholder-color, #6E7784) !important;
 }
 
 .select2-container--pv-dark .select2-selection {
-  background-color: #353938;
+  background-color: var(--select2-dark-background-color, #353938);
   color: white;
 }
 .select2-container--pv-dark .select2-selection:not([aria-expanded=true]) {
@@ -6733,7 +6735,7 @@ input.select2-search__field::placeholder {
   color: white;
 }
 .select2-container--pv-dark .select2-search__field {
-  background-color: #353938;
+  background-color: var(--select2-dark-background-color, #353938);
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.151 15.848a1.2 1.2 0 0 0 1.698 0L12 10.698l5.151 5.15a1.2 1.2 0 1 0 1.698-1.697l-6-6a1.2 1.2 0 0 0-1.697 0l-6 6a1.2 1.2 0 0 0 0 1.697Z' fill='%23FFFFFF'/%3E%3C/svg%3E");
 }
 .select2-container--pv-dark .select2-results__options {