@theme {
  /* these colors are specific to THERMS UI */
  /* Background --- */
  --color-background: #05050a;

  /* Border --- */
  --color-border: #28282a;

  /* Surface --- */
  --color-surface-subtle: #0e0e0f;
  --color-surface: #121214;
  --color-surface-strong: #1c1c1f;

  /* Text --- */
  --color-text-subtle: #ffffff73;
  --color-text: #ffffffb3;
  --color-text-strong: #fffffff2;
  --color-text-semantic: #fffffff2;

  /* Semantic */
  --color-main-dark: #123054;
  --color-main: #1f5393;
  --color-main-light: #286cbf;
  --color-main-faded: #1f539380;

  --color-neutral-dark: #393f46;
  --color-neutral: #787e87;
  --color-neutral-light: #94989e;
  --color-neutral-faded: #787e8780;

  --color-positive-dark: #0d5938;
  --color-positive: #1f9361;
  --color-positive-light: #2dd28a;
  --color-positive-faded: #1f93614d;

  --color-caution-dark: #936110;
  --color-caution: #d68f1f;
  --color-caution-light: #f6b955;
  --color-caution-faded: #d68f1f4d;

  --color-critical-dark: #451008;
  --color-critical: #bd3c28;
  --color-critical-light: #e5614c;
  --color-critical-faded: #bd3c284d;

  --color-info-dark: #084545;
  --color-info: #249da8;
  --color-info-light: #4ce5e5;
  --color-info-faded: #249da84d;

  /* Scrollbar */
  --color-scrollbar-track: #2e3133;
  --color-scrollbar-thumb: #5b6166;
  --color-scrollbar-thumb-highlight: #666d73;

  /* Input */
  --color-input-background: #40494f;
  --color-input-background-disabled: #4f535a;
}
