:root {
  color-scheme: dark;

  --wm-bg: #080808;
  --wm-surface: #0e0e0e;
  --wm-surface-2: #151515;
  --wm-surface-3: #1d1d1d;

  --wm-border: #303030;
  --wm-border-strong: #414141;

  --wm-text: #f5f5f5;
  --wm-muted: #a1a1a1;
  --wm-subtle: #737373;

  --wm-accent: #f5f5f5;
  --wm-accent-text: #080808;

  --wm-success: #32c48d;
  --wm-danger: #f87171;

  --wm-sidebar-width: 264px;
  --wm-topbar-height: 76px;
  --wm-footer-height: 57px;

  --wm-radius: 11px;
  --wm-transition: 180ms ease;
}

:root[data-theme="light"] {
  color-scheme: light;

  --wm-bg: #f4f5f7;
  --wm-surface: #ffffff;
  --wm-surface-2: #f5f6f8;
  --wm-surface-3: #e9ebee;

  --wm-border: #d5d8de;
  --wm-border-strong: #bfc4cc;

  --wm-text: #151515;
  --wm-muted: #555b64;
  --wm-subtle: #747b85;

  --wm-accent: #151515;
  --wm-accent-text: #ffffff;

  --wm-success: #16875e;
  --wm-danger: #c03434;
}