/*
  These variables are a subset copied from github-markdown.css
  to expand the scope to :root instead of just .markdown-body
  so that they can be used throughout all custom css.
*/

/* Spacing scale */
:root {
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  --spacing-xl: 24px;
  --spacing-2xl: 32px;

  /* Avatar sizes */
  --avatar-size-sm: 20px;
  --avatar-size-default: 32px;
  --avatar-size-lg: 80px;

  /* Border radius */
  --border-radius-sm: 2px;
  --border-radius-default: 4px;
  --border-radius-lg: 6px;
  --border-radius-full: 50%;

  /* Button padding shortcuts */
  --button-padding-sm: var(--spacing-xs) var(--spacing-sm);
  --button-padding-default: var(--spacing-sm) var(--spacing-lg);
  --button-padding-lg: var(--spacing-md) var(--spacing-xl);
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --color-fg-default: #c9d1d9;
    --color-fg-muted: #8b949e;
    --color-fg-subtle: #6e7681;
    --color-canvas-default: #0d1117;
    --color-canvas-subtle: #161b22;
    --color-border-default: #30363d;
    --color-border-muted: #21262d;
    --color-neutral-muted: rgba(110,118,129,0.4);
    --color-accent-fg: #58a6ff;
    --color-accent-emphasis: #1f6feb;
    --color-attention-subtle: rgba(187,128,9,0.15);
    --color-danger-fg: #f85149;
    --color-danger-subtle: rgba(248, 81, 73, 0.15);
    --color-success-fg: #3fb950;
    --color-success-emphasis: #238636;
    --color-success-subtle: rgba(46, 160, 67, 0.15);
  }
}

@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --color-fg-default: #24292f;
    --color-fg-muted: #57606a;
    --color-fg-subtle: #6e7781;
    --color-canvas-default: #ffffff;
    --color-canvas-subtle: #f6f8fa;
    --color-border-default: #d0d7de;
    --color-border-muted: hsla(210,18%,87%,1);
    --color-neutral-muted: rgba(175,184,193,0.2);
    --color-accent-fg: #0969da;
    --color-accent-emphasis: #0969da;
    --color-attention-subtle: #fff8c5;
    --color-danger-fg: #cf222e;
    --color-danger-subtle: rgba(207, 34, 46, 0.15);
    --color-success-fg: #1a7f37;
    --color-success-emphasis: #2da44e;
    --color-success-subtle: rgba(46, 160, 67, 0.15);
  }
}
