/* One light palette for the store, model hub, account pages and dialogs.
   Keep this last so the older dark component sheets cannot repaint a route. */
:root {
  color-scheme: light;
  --bg: #ffffff;
  --bg2: #f6f8fa;
  --panel: #ffffff;
  --panel2: #f6f8fa;
  --panel3: #eaeef2;
  --border: #d1d9e0;
  --border2: #d1d9e0;
  --text: #1f2328;
  --body-text: #1f2328;
  --muted: #59636e;
  --dim: #59636e;
  --accent: #0969da;
  --accent2: #0969da;
  --accent-ink: #ffffff;
  --accent-hover: #0757b5;
  --accent-soft: #ddf4ff;
  --accent-line: #54aeff;
  --ok: #1a7f37;
  --ok-soft: #dafbe1;
  --ok-line: #2da44e;
  --buy: #1a7f37;
  --sell: #cf222e;
  --sell-ink: #ffffff;
  --bad-soft: #ffebe9;
  --bad-line: #cf222e;
  --warn: #9a6700;
  --warn-ink: #ffffff;
  --warn-soft: #fff8c5;
  --warn-line: #bf8700;
  --up: #1a7f37;
  --down: #cf222e;
  --gh-green: #1f883d;
  --gh-green-hover: #1a7f37;
  --gh-btn: #f6f8fa;
  --gh-btn-hover: #eaeef2;
  --gh-btn-border: #d1d9e0;
}
body, body:has(.hub) { background: var(--bg); color: var(--text); }
.nav { background: var(--bg2); }
.nav-links a:hover, .more-btn:hover, .more-menu a:hover, .acct-menu button:hover { background: var(--panel3); }
.more-menu, .acct-menu, .wc { background: var(--panel); box-shadow: 0 8px 24px #1f232826; }
.more-menu a, .acct-menu button { color: var(--text); }
.btn:active, .seg button.on { background: var(--panel3); }
.btn:disabled, .btn[disabled] { background: var(--panel2); color: var(--muted); border-color: var(--border); }
.btn-accent, .btn-primary { background: var(--gh-green); color: #fff; border-color: #1f883d; }
.btn-accent:hover, .btn-primary:hover { background: var(--gh-green-hover); color: #fff; border-color: #1a7f37; }
.btn-accent:disabled { background: #94d3a2; color: #213527; border-color: #94d3a2; }
.btn-sell { background: var(--panel2); color: var(--sell); border-color: var(--border); }
.btn-sell:hover { background: var(--bad-soft); color: var(--sell); border-color: var(--bad-line); }
.seg button.on.buy { color: var(--buy); }
.seg button.on.sell { color: var(--sell); }
.banner { background: var(--warn-soft); color: #633c01; border-color: #d4a72c; }
.banner.info { background: #ddf4ff; color: #0550ae; border-color: #54aeff; }
.banner.bad { background: var(--bad-soft); color: #a40e26; border-color: #ff8182; }
.tag.ok { color: var(--ok); border-color: var(--ok-line); }
.tag.warn { color: var(--warn); border-color: var(--warn-line); }
.tag.bad { color: var(--sell); border-color: var(--bad-line); }
.tag.declared, .gchip { color: #0969da; border-color: #54aeff; background: #ddf4ff; }
.cmd, .cmdbox pre.cmd { color: var(--text); background: var(--bg2); }
.wc-back { background: #1f232866; }
.toast { background: var(--panel); box-shadow: 0 8px 24px #1f232826; }
code { background: #afb8c133; }
input::placeholder { color: var(--muted); }
.foot { background: var(--bg); }
/* The model hub bundles only Primer's dark variables. Override the variables it
   actually consumes, while retaining Primer's layout and component rules. */
.hub[data-color-mode=dark][data-dark-theme=dark] {
  color-scheme: light;
  --fgColor-default: #1f2328;
  --fgColor-muted: #59636e;
  --fgColor-accent: #0969da;
  --fgColor-success: #1a7f37;
  --fgColor-danger: #cf222e;
  --fgColor-onEmphasis: #ffffff;
  --bgColor-default: #ffffff;
  --bgColor-muted: #f6f8fa;
  --bgColor-inset: #f6f8fa;
  --bgColor-emphasis: #59636e;
  --bgColor-neutral-muted: #afb8c133;
  --bgColor-accent-muted: #ddf4ff;
  --bgColor-success-muted: #dafbe1;
  --bgColor-danger-muted: #ffebe9;
  --borderColor-default: #d1d9e0;
  --borderColor-muted: #d8dee4;
  --borderColor-emphasis: #818b98;
  --borderColor-accent-muted: #54aeff;
  --borderColor-accent-emphasis: #0969da;
  --control-bgColor-rest: #f6f8fa;
  --control-bgColor-hover: #eaeef2;
  --control-bgColor-active: #d8dee4;
  --control-fgColor-rest: #1f2328;
  --control-fgColor-placeholder: #59636e;
  --control-borderColor-rest: #d1d9e0;
  --control-borderColor-emphasis: #818b98;
  --button-default-fgColor-rest: #1f2328;
  --button-default-bgColor-rest: #f6f8fa;
  --button-default-bgColor-hover: #eaeef2;
  --button-default-bgColor-active: #d8dee4;
  --button-default-bgColor-selected: #eaeef2;
  --button-default-bgColor-disabled: #f6f8fa;
  --button-default-borderColor-rest: #d1d9e0;
  --button-default-borderColor-hover: #afb8c1;
  --button-default-borderColor-active: #afb8c1;
  --button-default-borderColor-disabled: #d1d9e0;
  --button-primary-bgColor-rest: #1f883d;
  --button-primary-bgColor-hover: #1a7f37;
  --button-primary-bgColor-disabled: #94d3a2;
  --button-primary-fgColor-disabled: #213527;
  --overlay-bgColor: #ffffff;
  --avatar-bgColor: #f6f8fa;
  --avatar-borderColor: #d1d9e0;
  --color-canvas-default: #ffffff;
  --color-canvas-subtle: #f6f8fa;
  --color-fg-default: #1f2328;
  --color-fg-muted: #59636e;
  --color-border-default: #d1d9e0;
}
.hub .hub-dot { border-color: #d1d9e0; }
.hub .dropdown-item:hover { background: #0969da; color: #fff; }
.hub .markdown-body pre, .hub .markdown-body code { color: var(--fgColor-default); }
/* The compact phone comparison previously baked a light-blue-on-dark heading. */
@media(max-width:640px) {
  #linesBox #linesTbl.lines-model-description thead th { color: #59636e !important; }
}
