/* ── GitHub Dark design tokens ────────────────────────────────── */
:root {
  /* Canvas layers */
  --gh-bg:              #0d1117;
  --gh-canvas:          #161b22;
  --gh-canvas-subtle:   #21262d;

  /* Borders */
  --gh-border:          #30363d;
  --gh-border-muted:    #21262d;

  /* Foreground */
  --gh-fg:              #e6edf3;
  --gh-fg-muted:        #8b949e;
  --gh-fg-subtle:       #6e7681;

  /* Semantic colors */
  --gh-accent:          #58a6ff;
  --gh-accent-subtle:   rgba(56,139,253,.15);
  --gh-success:         #3fb950;
  --gh-success-subtle:  rgba(46,160,67,.15);
  --gh-danger:          #f85149;
  --gh-danger-subtle:   rgba(248,81,73,.15);
  --gh-warn:            #d29922;
  --gh-warn-subtle:     rgba(210,153,34,.15);
  --gh-done:            #a371f7;
  --gh-done-subtle:     rgba(163,113,247,.15);
  --gh-mustang:         #2dd4bf;
  --gh-mustang-subtle:  rgba(45,212,191,.15);

  /* Legacy aliases – keep for JS inline styles and existing patterns */
  --bg:      var(--gh-bg);
  --surface: var(--gh-canvas);
  --s2:      var(--gh-canvas-subtle);
  --border:  var(--gh-border);
  --accent:  var(--gh-accent);
  --a2:      var(--gh-accent);
  --warn:    var(--gh-warn);
  --error:   var(--gh-danger);
  --text:    var(--gh-fg);
  --muted:   var(--gh-fg-muted);
  --valid:   var(--gh-success);
  --kosit:   var(--gh-done);
  --mustang: var(--gh-mustang);

  /* Bootstrap 5 CSS variable overrides */
  --bs-body-bg:           var(--gh-bg);
  --bs-body-color:        var(--gh-fg);
  --bs-border-color:      var(--gh-border);
  --bs-secondary-bg:      var(--gh-canvas);
  --bs-tertiary-bg:       var(--gh-canvas-subtle);
  --bs-body-font-family:  system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --bs-body-font-size:    .875rem;
  --bs-body-line-height:  1.5;
  --bs-link-color:        var(--gh-accent);
  --bs-link-hover-color:  #79c0ff;
  --bs-emphasis-color:    var(--gh-fg);
  --bs-heading-color:     var(--gh-fg);
  --bs-code-color:        var(--gh-success);

  /* Bootstrap card */
  --bs-card-bg:           var(--gh-canvas);
  --bs-card-border-color: var(--gh-border);
  --bs-card-cap-bg:       var(--gh-canvas-subtle);
  --bs-card-color:        var(--gh-fg);

  /* Bootstrap table */
  --bs-table-color:        var(--gh-fg);
  --bs-table-bg:           transparent;
  --bs-table-border-color: var(--gh-border);
  --bs-table-hover-bg:     rgba(255,255,255,.04);
  --bs-table-striped-bg:   rgba(255,255,255,.02);
  --bs-table-active-bg:    rgba(255,255,255,.06);

  /* Bootstrap form */
  --bs-input-bg:           var(--gh-canvas-subtle);
  --bs-input-border-color: var(--gh-border);
  --bs-input-color:        var(--gh-fg);
  --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%238b949e' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

/* ── Light theme ──────────────────────────────────────────────── */
:root.light {
  --gh-bg:             #ffffff;
  --gh-canvas:         #f6f8fa;
  --gh-canvas-subtle:  #eaeef2;
  --gh-border:         #d0d7de;
  --gh-border-muted:   #d8dee4;
  --gh-fg:             #1f2328;
  --gh-fg-muted:       #636c76;
  --gh-fg-subtle:      #6e7781;
  --gh-accent:         #0969da;
  --gh-accent-subtle:  rgba(9,105,218,.12);
  --gh-success:        #1a7f37;
  --gh-success-subtle: rgba(26,127,55,.12);
  --gh-danger:         #d1242f;
  --gh-danger-subtle:  rgba(209,36,47,.12);
  --gh-warn:           #9a6700;
  --gh-warn-subtle:    rgba(154,103,0,.12);
  --gh-done:           #8250df;
  --gh-done-subtle:    rgba(130,80,223,.12);
  --gh-mustang:        #0e7490;
  --gh-mustang-subtle: rgba(14,116,144,.12);
}