/* Loop semantic colors. Native dark mode activation is a separate product decision. */
:root, [data-theme="light"] {
  --loop-action: #315BE8;
  --loop-action-pressed: #1E3194;
  --loop-action-tint: #EAF0FF;
  --loop-link: #315BE8;
  --loop-canvas: #F6F8FF;
  --loop-surface: #FFFFFF;
  --loop-surface-soft: #EDF2FC;
  --loop-text: #111B36;
  --loop-text-secondary: #5B687E;
  --loop-border: #D6DEED;
  --loop-midnight: #0B153F;
  --loop-on-action: #FFFFFF;
  --loop-success: #067647;
  --loop-success-tint: #E9F8EF;
  --loop-warning: #934B10;
  --loop-warning-tint: #FFF4E5;
  --loop-error: #B42318;
  --loop-error-tint: #FFF0EE;
  --loop-graphic-mint: #CFF7E8;
  --loop-graphic-lilac: #E6D6FF;
  --loop-graphic-peach: #FFDEC2;
}
[data-theme="dark"] {
  --loop-action: #315BE8;
  --loop-action-pressed: #2547C6;
  --loop-action-tint: #18264C;
  --loop-link: #A8BDFF;
  --loop-canvas: #090E1B;
  --loop-surface: #111B2D;
  --loop-surface-soft: #19253B;
  --loop-text: #F0F5FF;
  --loop-text-secondary: #B3BED2;
  --loop-border: #34435D;
  --loop-midnight: #0B153F;
  --loop-on-action: #FFFFFF;
  --loop-success: #75D5AB;
  --loop-success-tint: #12352D;
  --loop-warning: #F4BE7B;
  --loop-warning-tint: #382A1C;
  --loop-error: #FFB4AB;
  --loop-error-tint: #401C22;
  --loop-graphic-mint: #CFF7E8;
  --loop-graphic-lilac: #E6D6FF;
  --loop-graphic-peach: #FFDEC2;
}