/* =============================================================================
   themes/github.css: the "GitHub" theme (default). Primer's own look, blue accent.

   Defines the full --brand-* token set for light and dark. The dark block appears twice:
   once for "Dark" and once inside the prefers-color-scheme media query for "System".
   Keep them identical. This file is one of the only two places raw colours are allowed
   (the other is themes/bento.css). Selectors also match <html> without data-app-theme.
   ============================================================================= */

/* ---------- mode independent ---------- */
html:is([data-app-theme=github], :not([data-app-theme]))[data-color-mode] {
  --brand-name-font: "Mona Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
  --brand-body-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
  --brand-serif-font: Georgia, "Times New Roman", serif;
  --brand-mono-font: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  --brand-radius: 6px;
  --brand-radius-lg: 6px;
  --brand-page-bg: var(--bgColor-default);
  --brand-shadow: none;
  --brand-shadow-hover: none;
  --brand-card-border: var(--borderColor-default);
  --brand-input-border: var(--borderColor-default);
  /* hero / live pill / rail / meters are Bento features; neutral values keep them inert here */
  --brand-hero-bg: transparent;
  --brand-hero-fg: var(--fgColor-default);
  --brand-hero-fg-muted: var(--fgColor-muted);
  --brand-live-bg: transparent;
  --brand-live-fg: var(--fgColor-default);
  --brand-live-dot: var(--fgColor-success);
  --brand-rail-bg: transparent;
  --brand-rail-fg: var(--fgColor-default);
  --brand-rail-hover-bg: var(--bgColor-muted);
  --brand-rail-active-bg: var(--bgColor-muted);
  --brand-rail-active-fg: var(--fgColor-default);
  --brand-meter-track: var(--bgColor-muted);
  --brand-meter-fill: var(--brand-primary);
  --brand-chart-bar-radius: 0;
  --brand-chart-area: 0;
  --brand-chart-line-width: 2;
  --brand-chart-tension: 0.25;
}

/* ---------- LIGHT ---------- */
html:is([data-app-theme=github], :not([data-app-theme]))[data-color-mode=light],
html:is([data-app-theme=github], :not([data-app-theme]))[data-color-mode=auto] {
  --brand-primary: #0969da;          /* main action / accent */
  --brand-primary-hover: #0757b8;
  --brand-primary-active: #064a9c;
  --brand-primary-fg: #ffffff;       /* text on primary */
  --brand-primary-muted: #ddf4ff;    /* subtle accent backgrounds, bars */
  --brand-cta: #0969da;              /* primary call to action (same as accent in this theme) */
  --brand-cta-hover: #0757b8;
  --brand-cta-active: #064a9c;
  --brand-cta-fg: #ffffff;
  --brand-header-bg: #24292f;
  --brand-header-fg: #ffffffb3;
  --brand-header-logo: #ffffff;

  /* data visualisation: series 1..6 (colour-blind friendly order) */
  --brand-series-1: #0969da;
  --brand-series-2: #1a7f37;
  --brand-series-3: #bf8700;
  --brand-series-4: #8250df;
  --brand-series-5: #cf222e;
  --brand-series-6: #1b7c83;
  /* heatmap gradient: cold to hot */
  --brand-heat-0: rgba(9, 105, 218, 0);
  --brand-heat-1: rgba(9, 105, 218, .55);
  --brand-heat-2: rgba(26, 127, 55, .7);
  --brand-heat-3: rgba(191, 135, 0, .8);
  --brand-heat-4: rgba(207, 34, 46, .9);
}

/* ---------- DARK ---------- */
html:is([data-app-theme=github], :not([data-app-theme]))[data-color-mode=dark] {
  --brand-primary: #2f81f7;
  --brand-primary-hover: #4c94f8;
  --brand-primary-active: #1f6feb;
  --brand-primary-fg: #ffffff;
  --brand-primary-muted: #1f6feb26;
  --brand-cta: #2f81f7;
  --brand-cta-hover: #4c94f8;
  --brand-cta-active: #1f6feb;
  --brand-cta-fg: #ffffff;
  --brand-header-bg: #161b22;
  --brand-header-fg: #e6edf3b3;
  --brand-header-logo: #e6edf3;

  --brand-series-1: #4493f8;
  --brand-series-2: #3fb950;
  --brand-series-3: #d29922;
  --brand-series-4: #ab7df8;
  --brand-series-5: #f85149;
  --brand-series-6: #39c5cf;
  --brand-heat-0: rgba(68, 147, 248, 0);
  --brand-heat-1: rgba(68, 147, 248, .55);
  --brand-heat-2: rgba(63, 185, 80, .7);
  --brand-heat-3: rgba(210, 153, 34, .8);
  --brand-heat-4: rgba(248, 81, 73, .9);
}

@media (prefers-color-scheme: dark) {
  html:is([data-app-theme=github], :not([data-app-theme]))[data-color-mode=auto] {
    --brand-primary: #2f81f7;
    --brand-primary-hover: #4c94f8;
    --brand-primary-active: #1f6feb;
    --brand-primary-fg: #ffffff;
    --brand-primary-muted: #1f6feb26;
    --brand-cta: #2f81f7;
    --brand-cta-hover: #4c94f8;
    --brand-cta-active: #1f6feb;
    --brand-cta-fg: #ffffff;
    --brand-header-bg: #161b22;
    --brand-header-fg: #e6edf3b3;
    --brand-header-logo: #e6edf3;

    --brand-series-1: #4493f8;
    --brand-series-2: #3fb950;
    --brand-series-3: #d29922;
    --brand-series-4: #ab7df8;
    --brand-series-5: #f85149;
    --brand-series-6: #39c5cf;
    --brand-heat-0: rgba(68, 147, 248, 0);
    --brand-heat-1: rgba(68, 147, 248, .55);
    --brand-heat-2: rgba(63, 185, 80, .7);
    --brand-heat-3: rgba(210, 153, 34, .8);
    --brand-heat-4: rgba(248, 81, 73, .9);
  }
}