:root {
  --iom-font-size: 16px;
  --iom-border-radius: 6px;
  --iom-text-color-a: #34363a;
  --iom-text-color-b: #525457;
  --iom-text-color-c: #7b7c7f;
  --iom-text-color-d: #999a9c;
  --iom-text-color-e: #cccdce;
  --iom-blue-color: rgb(34 102 237);
  --iom-light-blue-color: #e3f0fe;
  --iom-orange-color: #ff8400;
  --iom-light-orange-color: #fdf2e7;
  --iom-green-color: #00b351;
  --iom-red-color: rgb(242 49 49);
  --iom-yellow-color: #fdd157;
  --iom-border-color: #dcdcdc;
  --iom-light-border-color: #e5e6e7;
  --iom-token-background-color: #e6e7e8;
  --iom-conversation-list-border-color: #dcdcdc;
  --iom-conversation-list-background-color: rgb(255 255 255);
  --iom-conversations-separator-opacity: 0.08;
  --iom-background-color: rgb(245 246 247);
  --iom-light-active-color: #fafafa;
  --iom-section-shadow-width: 2px;
  --iom-section-shadow-color: rgba(0 0 0 5%);
  --iom-file-background-color: #f6f3f1;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
  :root {
    --iom-font-size: 16px;
    --iom-border-radius: 6px;
    --iom-text-color-a: #dededd;
    --iom-text-color-b: #c4c4c3;
    --iom-text-color-c: #a0a1a0;
    --iom-text-color-d: #868685;
    --iom-text-color-e: #595a59;
    --iom-blue-color: rgb(58 130 247);
    --iom-light-blue-color: #263240;
    --iom-orange-color: #ff8400;
    --iom-light-orange-color: #443424;
    --iom-green-color: #00b351;
    --iom-red-color: rgb(242 49 49);
    --iom-yellow-color: #fdd157;
    --iom-border-color: #484848;
    --iom-light-border-color: #2d2d2d;
    --iom-token-background-color: rgb(21 22 23);
    --iom-conversation-list-border-color: #000;
    --iom-conversation-list-background-color: rgb(21 22 23);
    --iom-conversations-separator-opacity: 0.2;
    --iom-background-color: rgb(29 30 31);
    --iom-light-active-color: #232425;
    --iom-section-shadow-width: 1px;
    --iom-section-shadow-color: rgba(0 0 0 45%);
    --iom-file-background-color: white;
  }
}

/* Need to disable style lint because selector is coming from Outlook */
/* stylelint-disable */
#newWindowNotificaiton,
#newWindowNotification {
  /* stylelint-enable */
  color: #34363a;
}

@media (prefers-color-scheme: dark) {
  .control-text-color {
    color: var(--iom-text-color-e);
  }

  .iom-button {
    background-color: rgba(21 22 23 85%);
    box-shadow: 0 0 0 1px rgba(222 222 221 5%);
  }
}

@media (prefers-color-scheme: light) {
  .iom-button {
    color: var(--iom-text-color-a);
    background-color: rgba(255 255 255 85%);
    box-shadow: 0 0 0 1px rgba(52 54 58 5%);
  }
}