:root[theme="dark"] {
  /* Content background */
  --color-content-background-primary: #292d30;
  --color-content-background-secondary: #25282a;
  --color-content-background-tertiary: #212121;
  --color-content-background-featured: #292929;

  /* State */
  --color-state-hover: #31373e;
  --color-state-selected: #434343;
  --color-state-selected-hover: #4f4f4f;
  --color-state-disabled: #31373e;

  /* Accent */
  --color-accent: #60aaff;
  --color-accent-hover: #136bfb;
  --color-accent-selected: #2f7fbd;
  --color-accent-selected-hover: #8daacb;
  --color-accent-foreground: #ffffff;

  /* Status */
  --color-status-success: #89ff98;
  --color-status-success-foreground: #323130;
  --color-status-informational: #797775;
  --color-status-informational-foreground: #ffffff;
  --color-status-warning: #f2c80f;
  --color-status-warning-foreground: #323130;
  --color-status-danger: #ff2828;
  --color-status-danger-foreground: #ffffff;

  /* Foreground */
  --color-foreground-default: #ffffff;
  --color-foreground-complementary: #323130;
  --color-foreground-inactive: #c4c4c4;
  --color-foreground-disabled: #4f4f4f;
  --color-foreground-primary: #A19F9D;
  --color-foreground-secondary: #434343;
  --color-foreground-tertiary: #31373e;

  /* Shimmer */
  --color-background-shimmer: #434343;
  --color-foreground-shimmer: #292d30;

  /* Masthead */
  --color-masthead-background: #3c3c41;
  --color-masthead-foreground: #ffffff;
  --color-masthead-button-hover: #666666;
  --color-search-background: rgba(255, 255, 255, 0.85);
  --color-search-background-hover: #ffffff;
  --color-search-text: #323130;
  --color-search-text-hover: #605E5C;
  --color-search-text-placeholder: #605E5C;
  --color-search-text-placeholder-selected: #A19F9D;

  /* Main nav */
  --color-main-nav-background: #31373e;
  --color-main-nav-background-hover: #434343;
  --color-main-nav-background-selected: #292d30;
  --color-main-nav-foreground-primary: #ffffff;
  --color-main-nav-foreground-secondary: #434343;

  /* Alert */
  --color-global-background-success: #dff6dd;
  --color-global-foreground-success: #323130;
  --color-global-background-informational: #eff6fc;
  --color-global-foreground-informational: #323130;
  --color-global-background-warning: #fff4ce;
  --color-global-foreground-warning: #323130;
  --color-global-background-severe-warning: #fed9cc;
  --color-global-foreground-severe-warning: #323130;
  --color-global-background-error: #fde7e9;
  --color-global-foreground-error: #323130;

  /* Link */
  --color-link-default: #60aaff;
  --color-link-hover: #136bfb;
  --color-link-selected: #2f7fbd;

  /* IoTC visualizations */  
  --color-azul: #118dff;
  --color-foreground-azul: #ffffff;
  --color-atlantic: #4e4dff;
  --color-foreground-atlantic: #ffffff;
  --color-mango: #ff9254;
  --color-foreground-mango: #323130;
  --color-blush: #c83d95;
  --color-foreground-blush: #ffffff;
  --color-pacific: #00c7e2;
  --color-foreground-pacific: #323130;
  --color-grape: #9911b0;
  --color-foreground-grape: #ffffff;
  --color-lilac: #ffadc1;
  --color-foreground-lilac: #323130;
  --color-scarlet: #e04854;
  --color-foreground-scarlet: #ffffff;
  --color-sahara: #fcd641;
  --color-foreground-sahara: #323130;
  --color-leaf: #1ce099;
  --color-foreground-leaf: #323130;
  --color-natural-grey: #8A8886;
  --color-foreground-natural-grey: #ffffff;

  /* Data */
  --data-color-1: #01b8aa;
  --data-color-2: #6be8dc;
  --data-color-3: #59cec3;
  --data-color-4: #08bca6;
  --data-color-5: #0aa58e;
  --data-color-6: #12937d;
  --data-color-7: #ffffff;
  --data-color-8: #f2f2f2;
  --data-color-9: #e6e6e6;
  --data-color-10: #cccccc;
  --data-color-11: #b3b3b3;
  --data-color-12: #999999;
  --data-color-13: #fd625e;
  --data-color-14: #ff7878;
  --data-color-15: #fc5454;
  --data-color-16: #fc3232;
  --data-color-17: #e81818;
  --data-color-18: #b21f1f;
  --data-color-19: #f2c80f;
  --data-color-20: #fcdf65;
  --data-color-21: #ffd629;
  --data-color-22: #ffce00;
  --data-color-23: #e5bd13;
  --data-color-24: #c9a611;
  --data-color-25: #8ad4eb;
  --data-color-26: #caf8ff;
  --data-color-27: #b0f8ff;
  --data-color-28: #73f8ff;
  --data-color-29: #27e2dd;
  --data-color-30: #1bb2a7;
  --data-color-31: #fe9666;
  --data-color-32: #ffcdbb;
  --data-color-33: #f7a389;
  --data-color-34: #f9724e;
  --data-color-35: #dc5f31;
  --data-color-36: #db220f;
  --data-color-37: #a66999;
  --data-color-38: #efa5e1;
  --data-color-39: #ea78d9;
  --data-color-40: #e247db;
  --data-color-41: #d313d3;
  --data-color-42: #921e9b;

  /* IGNORE-SECTION - CSS setup */
  color-scheme: dark;
  accent-color: var(--color-accent);
}