// Theme — locked to parchment / standard / signal (the user's chosen defaults
// from the design handoff). The design's tweaks panel was a design-time tool;
// production picks one look and ships.

const PALETTE = {
  bg: '#f7f6f3', card: '#ffffff', border: '#e4e2dd',
  text: '#1a1a1a', text2: '#6b6b6b', text3: '#a0a0a0',
  inputBg: '#fbfaf7', stripBg: '#fbfaf7',
  tabRail: '#ecebe6', tabActive: '#ffffff',
  sleep: '#2e7ab5', hrv: '#7b5ea7', hr: '#c0392b',
  ready: '#9e7c2e', training: '#3a7d5c',
  accent: '#2e6fad', positive: '#2e8b57', warning: '#c0392b', amber: '#9e7c2e',
  bannerBg: '#faf2e0', bannerBorder: '#ead9a8', bannerText: '#7d6325',
  targetLine: '#3a7d5c',
  divider: '#f0eee9',
  rule: 'rgba(0,0,0,0.06)',
  grid: '#eeeeee',
};

const DENSITY = {
  pageGap: 12, cardPad: 18, miniPad: 14, gridGap: 12,
  heroSize: 44, scoreSize: 32, metricSize: 26, sectionPad: 18,
  sparkH: 72, miniSparkH: 32, trainSparkH: 56,
};

// "signal" chart character: trend line + ±1σ band, no raw scatter.
const CHART = {
  showBand: true, showRaw: false,
  lineWidth: 1.6, rawOpacity: 0, bandOpacity: 0.08,
  dotR: 1.8, trendOpacity: 0.9,
};

const THEME = {
  palette: PALETTE,
  density: DENSITY,
  chart: CHART,
  chartKey: 'signal',
};

const ThemeContext = React.createContext(THEME);
function useHCTheme() { return React.useContext(ThemeContext); }

window.HC_THEME = { THEME, ThemeContext, useHCTheme, PALETTE, DENSITY, CHART };