/**
 * 页面背景色：OMS 与官网首页共用 localStorage
 */

export const PAGE_BACKGROUND_STORAGE_KEY = 'app-page-background-color';

export const DEFAULT_PAGE_BACKGROUND = '#f5f4f1';

export const PAGE_BACKGROUND_PRESETS = [
  { color: '#f0f3f4', labelKey: 'settings.pageBg.default' },
  { color: '#f6f1e7', labelKey: 'settings.pageBg.ningzhi' },
  { color: '#f4f6f9', labelKey: 'settings.pageBg.mist' },
  { color: '#f5f4f1', labelKey: 'settings.pageBg.stone' },
  { color: '#f1f4f2', labelKey: 'settings.pageBg.sage' },
  { color: '#f5f2f7', labelKey: 'settings.pageBg.lilac' },
  { color: '#f0f2f6', labelKey: 'settings.pageBg.slate' },
  { color: '#faf9f7', labelKey: 'settings.pageBg.pearl' },
  { color: '#ffffff', labelKey: 'settings.pageBg.white' },
] as const;

function hexToRgb(hex: string): { r: number; g: number; b: number } | null {
  const m = hex.replace(/^#/, '').match(/^([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i);
  if (!m) return null;
  return {
    r: parseInt(m[1], 16),
    g: parseInt(m[2], 16),
    b: parseInt(m[3], 16),
  };
}

function rgbToHex(r: number, g: number, b: number): string {
  return (
    '#' +
    [r, g, b]
      .map((x) => Math.round(Math.max(0, Math.min(255, x))).toString(16).padStart(2, '0'))
      .join('')
  );
}

/** 生成略浅一档的背景色（用于官网辅助层） */
function softenHex(hex: string, mixWhite = 0.55): string {
  const rgb = hexToRgb(hex);
  if (!rgb) return hex;
  const r = Math.round(rgb.r * (1 - mixWhite) + 255 * mixWhite);
  const g = Math.round(rgb.g * (1 - mixWhite) + 255 * mixWhite);
  const b = Math.round(rgb.b * (1 - mixWhite) + 255 * mixWhite);
  return rgbToHex(r, g, b);
}

export function getStoredPageBackground(): string | null {
  try {
    return localStorage.getItem(PAGE_BACKGROUND_STORAGE_KEY);
  } catch {
    return null;
  }
}

export function setStoredPageBackground(hex: string): void {
  try {
    localStorage.setItem(PAGE_BACKGROUND_STORAGE_KEY, hex);
  } catch {
    // ignore
  }
}

/** 写入 OMS + 官网首页共用的背景 CSS 变量 */
export function applyPageBackgroundColor(hex: string): void {
  const color = hex.startsWith('#') ? hex : `#${hex}`;
  const root = document.documentElement;
  const warmPageBgs = new Set(['#f6f1e7', '#f5f4f1', '#faf9f7']);
  const soft = softenHex(color, warmPageBgs.has(color.toLowerCase()) ? 0.42 : 0.55);

  root.style.setProperty('--app-page-bg', color);
  root.style.setProperty('--kc-page-bg', color);
  root.style.setProperty('--kc-neutral', soft);
  root.style.setProperty('--ai-bg', color);
  root.style.setProperty('--ai-canvas', color);
  root.style.setProperty('--ai-bg-soft', soft);
  root.style.setProperty('--ai-header-bg', `color-mix(in srgb, ${color} 94%, transparent)`);
}