:root[theme="light"] {
  /* Content background */
  --color-content-background-primary: #ffffff;
  --color-content-background-secondary: #f7f7f7;
  --color-content-background-tertiary: #faf9f8;
  --color-content-background-featured: #EDEBE9;

  /* State */
  --color-state-hover: #f3f2f1;
  --color-state-selected: #dadada;
  --color-state-selected-hover: #c8c8c8;
  --color-state-disabled: #f3f2f1;

  /* Accent */
  --color-accent: #0078d4;
  --color-accent-hover: #106ebe;
  --color-accent-selected: #005a9e;
  --color-accent-selected-hover: #004578;
  --color-accent-foreground: #ffffff;

  /* Status */
  --color-status-success: #107c10;
  --color-status-success-foreground: #ffffff;
  --color-status-informational: #666666;
  --color-status-informational-foreground: #ffffff;
  --color-status-warning: #d83b01;
  --color-status-warning-foreground: #ffffff;
  --color-status-danger: #a80000;
  --color-status-danger-foreground: #ffffff;

  /* Foreground */
  --color-foreground-default: #323130;
  --color-foreground-complementary: #ffffff;
  --color-foreground-inactive: #666666;
  --color-foreground-disabled: #a6a6a6;
  --color-foreground-primary: #605E5C;
  --color-foreground-secondary: #dadada;
  --color-foreground-tertiary: #f3f2f1;

  /* Shimmer */
  --color-background-shimmer: #dadada;
  --color-foreground-shimmer: #faf9f8;

  /* 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: #f3f2f1;
  --color-main-nav-background-hover: #dadada;
  --color-main-nav-background-selected: #ffffff;
  --color-main-nav-foreground-primary: #323130;
  --color-main-nav-foreground-secondary: #dadada;

  /* 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: #106ebe;
  --color-link-hover: #005a9e;
  --color-link-selected: #004578;
  
  /* IoTC visualizations */  
  --color-azul: #118dff;
  --color-foreground-azul: #ffffff;
  --color-atlantic: #3a4bc6;
  --color-foreground-atlantic: #ffffff;
  --color-mango: #e66c37;
  --color-foreground-mango: #ffffff;
  --color-blush: #c83d95;
  --color-foreground-blush: #ffffff;
  --color-pacific: #009eb3;
  --color-foreground-pacific: #ffffff;
  --color-grape: #750985;
  --color-foreground-grape: #ffffff;
  --color-lilac: #835dd0;
  --color-foreground-lilac: #ffffff;
  --color-scarlet: #e04854;
  --color-foreground-scarlet: #ffffff;
  --color-sahara: #bd8608;
  --color-foreground-sahara: #ffffff;
  --color-leaf: #18a03c;
  --color-foreground-leaf: #ffffff;
  --color-natural-grey: #8A8886;
  --color-foreground-natural-grey: #ffffff;
  
  /* Data */
  --data-color-1: #01b8aa;
  --data-color-2: #99e3dd;
  --data-color-3: #67d4cc;
  --data-color-4: #34c6bb;
  --data-color-5: #018a80;
  --data-color-6: #015c55;
  --data-color-7: #374649;
  --data-color-8: #afb5b6;
  --data-color-9: #879092;
  --data-color-10: #5f6b6d;
  --data-color-11: #293537;
  --data-color-12: #1c2325;
  --data-color-13: #fd625e;
  --data-color-14: #fec0bf;
  --data-color-15: #fea19e;
  --data-color-16: #fd817e;
  --data-color-17: #be4a47;
  --data-color-18: #7f312f;
  --data-color-19: #f2c80f;
  --data-color-20: #fae99f;
  --data-color-21: #f7de6f;
  --data-color-22: #f5d33f;
  --data-color-23: #b6960b;
  --data-color-24: #796408;
  --data-color-25: #8ad4eb;
  --data-color-26: #d0eef7;
  --data-color-27: #b9e5f3;
  --data-color-28: #a1ddef;
  --data-color-29: #689fb0;
  --data-color-30: #456a76;
  --data-color-31: #fe9666;
  --data-color-32: #db220f;
  --data-color-33: #ffd5c2;
  --data-color-34: #fec0a3;
  --data-color-35: #bf714d;
  --data-color-36: #7f4b33;
  --data-color-37: #a66999;
  --data-color-38: #dfc5d9;
  --data-color-39: #caa5c2;
  --data-color-40: #b887ad;
  --data-color-41: #7d4f73;
  --data-color-42: #53354d;

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