/* ============================================================
   Hque design tokens
   --------------------------------------------------------------
   GitHub Primer-derived token vocabulary. Defines :root for
   light mode and [data-theme="dark"] for dark. Consumed
   directly by all *.razor.css and hque-overrides.css; mirrored
   verbatim in C# at Theme/HqueTheme.cs for MudBlazor (which
   types palette properties as MudColor and won't accept
   var(--…) strings).

   The legacy alias bridge that PRs 1–3b carried (--text,
   --surface, --accent etc.) is gone — all consumers migrated
   to these direct names by PR `theme/que-ui-sweep`.
   ============================================================ */

:root {
  /* --- Canvas / surfaces --- */
  --canvas-default:   #FFFFFF;
  --canvas-subtle:    #F6F8FA;
  --canvas-inset:     #EFF2F5;
  --canvas-overlay:   #FFFFFF;

  /* --- Borders --- */
  --border-default:   #D0D7DE;
  --border-muted:     #D8DEE4;
  --border-subtle:    rgba(31, 35, 40, 0.10);

  /* --- Foreground / text --- */
  --fg-default:       #1F2328;
  --fg-muted:         #656D76;
  --fg-subtle:        #8C959F;
  --fg-on-emphasis:   #FFFFFF;

  /* --- Accent (Hque blue, same as marketing) --- */
  --accent-fg:        #2563EB;
  --accent-emphasis:  #2563EB;
  --accent-muted:     rgba(37, 99, 235, 0.40);
  --accent-subtle:    #DDEBFE;
  --accent-ring:      rgba(37, 99, 235, 0.30);

  /* --- Semantic: success --- */
  --success-fg:       #1A7F37;
  --success-emphasis: #1F883D;
  --success-muted:    rgba(74, 194, 107, 0.40);
  --success-subtle:   #DAFBE1;

  /* --- Semantic: attention (warning) --- */
  --attention-fg:     #9A6700;
  --attention-emphasis: #BF8700;
  --attention-muted:  rgba(212, 167, 44, 0.40);
  --attention-subtle: #FFF8C5;

  /* --- Semantic: danger --- */
  --danger-fg:        #CF222E;
  --danger-emphasis:  #CF222E;
  --danger-muted:     rgba(255, 129, 130, 0.40);
  --danger-subtle:    #FFEBE9;

  /* --- Semantic: info --- */
  --info-fg:          #0969DA;
  --info-emphasis:    #0969DA;
  --info-muted:       rgba(84, 174, 255, 0.40);
  --info-subtle:      #DDF4FF;

  /* --- Done / closed (record completion, like GitHub closed PRs) --- */
  --done-fg:          #8250DF;
  --done-emphasis:    #8250DF;
  --done-muted:       rgba(194, 151, 255, 0.40);
  --done-subtle:      #FBEFFF;

  /* --- Neutral mute (small variants for chips that aren't semantic) --- */
  --neutral-subtle:   #EFF2F5;
  --neutral-muted:    rgba(175, 184, 193, 0.20);

  /* --- Diff (audit / history views) --- */
  --diff-add-bg:      #DAFBE1;
  --diff-add-fg:      #1A7F37;
  --diff-del-bg:      #FFEBE9;
  --diff-del-fg:      #CF222E;

  /* --- Type --- */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans",
               Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
               "Liberation Mono", monospace;

  /* --- Layout primitives --- */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-pill: 999px;

  --sidebar-width: 360px;
  --topbar-height: 52px;

  --shadow-none: none;
  --shadow-resting: 0 1px 0 rgba(31, 35, 40, 0.04);
  --shadow-floating: 0 8px 24px rgba(140, 149, 159, 0.20);

  --focus-ring: 0 0 0 3px var(--accent-ring);
}

/* ============================================================
   Dark mode tokens.
   ============================================================ */

[data-theme="dark"] {
  --canvas-default:   #0D1117;
  --canvas-subtle:    #161B22;
  --canvas-inset:     #010409;
  --canvas-overlay:   #161B22;

  --border-default:   #30363D;
  --border-muted:     #21262D;
  --border-subtle:    rgba(240, 246, 252, 0.10);

  --fg-default:       #E6EDF3;
  --fg-muted:         #7D8590;
  --fg-subtle:        #6E7681;
  --fg-on-emphasis:   #FFFFFF;

  --accent-fg:        #4493F8;
  --accent-emphasis:  #2563EB;
  --accent-muted:     rgba(56, 139, 253, 0.40);
  --accent-subtle:    rgba(56, 139, 253, 0.15);
  --accent-ring:      rgba(56, 139, 253, 0.30);

  --success-fg:       #3FB950;
  --success-emphasis: #238636;
  --success-muted:    rgba(46, 160, 67, 0.40);
  --success-subtle:   rgba(46, 160, 67, 0.15);

  --attention-fg:     #D29922;
  --attention-emphasis: #9E6A03;
  --attention-muted:  rgba(187, 128, 9, 0.40);
  --attention-subtle: rgba(187, 128, 9, 0.15);

  --danger-fg:        #F85149;
  --danger-emphasis:  #DA3633;
  --danger-muted:     rgba(248, 81, 73, 0.40);
  --danger-subtle:    rgba(248, 81, 73, 0.15);

  --info-fg:          #58A6FF;
  --info-emphasis:    #1F6FEB;
  --info-muted:       rgba(56, 139, 253, 0.40);
  --info-subtle:      rgba(56, 139, 253, 0.15);

  --done-fg:          #A371F7;
  --done-emphasis:    #8957E5;
  --done-muted:       rgba(163, 113, 247, 0.40);
  --done-subtle:      rgba(163, 113, 247, 0.15);

  --neutral-subtle:   #21262D;
  --neutral-muted:    rgba(110, 118, 129, 0.40);

  --diff-add-bg:      rgba(46, 160, 67, 0.15);
  --diff-add-fg:      #3FB950;
  --diff-del-bg:      rgba(248, 81, 73, 0.15);
  --diff-del-fg:      #F85149;

  --shadow-resting: 0 0 0 1px rgba(240, 246, 252, 0.04);
  --shadow-floating: 0 16px 32px rgba(1, 4, 9, 0.85);
}
