/* Shared semantic theme colors.
   App shells still own raw tokens (--bg-0..4, --fg-0..3, --accent, --line),
   but webview input/output components consume these semantic variables. */

:root {
  --accent-2: var(--cyan-2, #67e8f9);

  --wv-theme-page-bg: var(--bg-0, #0a0d12);
  --wv-theme-layer-bg: var(--bg-2, #141a23);
  --wv-theme-layer-line: var(--line-strong, rgba(255, 255, 255, 0.10));

  --wv-theme-user-bg: color-mix(in oklab, var(--accent, #22d3ee) 10%, var(--bg-1, #0f141b));
  --wv-theme-user-line: var(--accent-line, rgba(34, 211, 238, 0.35));
  --wv-theme-user-chip-bg: color-mix(in oklab, var(--accent, #22d3ee) 14%, transparent);
  --wv-theme-user-chip-fg: var(--accent-2, var(--accent, #22d3ee));

  --wv-theme-assistant-bg: var(--bg-2, #141a23);
  --wv-theme-assistant-line: var(--line, rgba(255, 255, 255, 0.06));
  --wv-theme-assistant-chip-bg: color-mix(in oklab, var(--fg-2, #7d8899) 14%, transparent);
  --wv-theme-assistant-chip-fg: var(--fg-1, #a9b3c1);

  --wv-theme-system-bg: transparent;
  --wv-theme-system-line: var(--line-strong, rgba(255, 255, 255, 0.10));
  --wv-theme-system-fg: var(--fg-1, #a9b3c1);

  --wv-theme-meta-line: var(--line, rgba(255, 255, 255, 0.06));
  --wv-theme-meta-fg: var(--fg-2, #7d8899);
  --wv-theme-code-bg: color-mix(in oklab, var(--accent, #22d3ee) 8%, var(--bg-2, #141a23));
  --wv-theme-code-fg: var(--accent-2, var(--accent, #22d3ee));
  --wv-theme-code-line: color-mix(in oklab, var(--accent, #22d3ee) 14%, transparent);
  --wv-theme-heading-fg: var(--accent-2, var(--accent, #22d3ee));

  --wv-theme-scroll: var(--bg-3, #1a212c);
  --wv-theme-scroll-hover: var(--bg-4, #232b38);

  --wv-status-idle: var(--accent, #22d3ee);
  --wv-status-ok: var(--accent, #22d3ee);
  --wv-status-thinking: var(--status-thinking, var(--violet, var(--accent)));
  --wv-status-writing: var(--status-writing, var(--warn));
  --wv-status-tool: var(--status-tool, var(--ok));
  --wv-status-connect: var(--accent-2, #67e8f9);
  --wv-status-disconnect: var(--fg-2, #7d8899);
  --wv-status-error: var(--err, #f87171);
  --st-c: var(--wv-status-idle);
}

html[data-accent="cyan"] {
  --accent: #22d3ee;
  --accent-2: #67e8f9;
  --accent-soft: rgba(34, 211, 238, 0.14);
  --accent-line: rgba(34, 211, 238, 0.35);
  --accent-contrast: #ffffff;
}

html[data-accent="violet"] {
  --accent: #a78bfa;
  --accent-2: #c4b5fd;
  --accent-soft: rgba(167, 139, 250, 0.14);
  --accent-line: rgba(167, 139, 250, 0.35);
  --accent-contrast: #ffffff;
}

html[data-accent="emerald"] {
  --accent: #10b981;
  --accent-2: #6ee7b7;
  --accent-soft: rgba(16, 185, 129, 0.14);
  --accent-line: rgba(16, 185, 129, 0.35);
  --accent-contrast: #ffffff;
}

html[data-accent="amber"] {
  --accent: #f59e0b;
  --accent-2: #fcd34d;
  --accent-soft: rgba(245, 158, 11, 0.14);
  --accent-line: rgba(245, 158, 11, 0.35);
  --accent-contrast: #ffffff;
}

html[data-accent="slate"] {
  --accent: #94a3b8;
  --accent-2: #cbd5e1;
  --accent-soft: rgba(148, 163, 184, 0.14);
  --accent-line: rgba(148, 163, 184, 0.35);
  --accent-contrast: #ffffff;
}

html[data-accent="parchment"] {
  --parchment: #f5f4ed;
  --ivory: #faf9f5;
  --sand: #e8e6dc;
  --brand: #1B365D;
  --ink-light: #2D5A8A;
  --text-1: #141413;
  --text-2: #3d3d3a;
  --text-3: #6b6a64;
  --border: #e8e6dc;
  --border-soft: #e5e3d8;
  --tag-bg: #E4ECF5;
  --serif: "Nanum Myeongjo", AppleMyungjo, "Noto Serif CJK KR", "Source Han Serif K", Charter, Georgia, serif;
  --sans: var(--serif);
  --font-sans: var(--serif);

  --bg-0: var(--parchment);
  --bg-1: var(--ivory);
  --bg-2: var(--sand);
  --bg-3: #dedbd0;
  --bg-4: #d1cdbf;
  --line: var(--border);
  --line-strong: var(--border-soft);
  --fg-0: var(--text-1);
  --fg-1: var(--text-2);
  --fg-2: var(--text-3);
  --fg-3: #7a786f;
  --accent: var(--brand);
  --accent-2: var(--ink-light);
  --accent-soft: #E4ECF5;
  --accent-line: #b8c7d8;
  --accent-contrast: #ffffff;
  --violet: var(--brand);
  --violet-soft: var(--tag-bg);
  --input-layer-bg: var(--ivory);
  --shadow-1: 0 1px 2px rgba(20, 20, 19, 0.04), 0 0 0 1px rgba(20, 20, 19, 0.04);
  --shadow-card: 0 1px 2px rgba(20, 20, 19, 0.04), 0 0 0 1px rgba(20, 20, 19, 0.04);
  --shadow-drawer: 0 1px 2px rgba(20, 20, 19, 0.04), 0 0 0 1px rgba(20, 20, 19, 0.04);

  --wv-theme-page-bg: var(--parchment);
  --wv-theme-layer-bg: var(--ivory);
  --wv-theme-layer-line: var(--border);
  --wv-theme-user-bg: var(--tag-bg);
  --wv-theme-user-line: var(--accent-line);
  --wv-theme-user-chip-bg: var(--tag-bg);
  --wv-theme-user-chip-fg: var(--brand);
  --wv-theme-assistant-bg: var(--ivory);
  --wv-theme-assistant-line: var(--border);
  --wv-theme-assistant-chip-bg: var(--sand);
  --wv-theme-assistant-chip-fg: var(--text-2);
  --wv-theme-system-bg: transparent;
  --wv-theme-system-line: var(--border-soft);
  --wv-theme-system-fg: var(--text-2);
  --wv-theme-meta-line: var(--border-soft);
  --wv-theme-meta-fg: var(--text-3);
  --wv-theme-code-bg: var(--tag-bg);
  --wv-theme-code-fg: var(--brand);
  --wv-theme-code-line: var(--accent-line);
  --wv-theme-heading-fg: var(--brand);
  --wv-theme-scroll: #d8d5ca;
  --wv-theme-scroll-hover: #c9c5b8;
}

html[data-theme="light"] {
  --wv-status-thinking: var(--status-thinking, var(--violet-d, var(--accent)));
  --wv-status-writing: var(--status-writing, var(--warn));
  --wv-status-tool: var(--status-tool, var(--ok));
}

html[data-theme="light"][data-accent="cyan"] {
  --accent: #0f5f78;
  --accent-2: #164e63;
  --accent-soft: rgba(15, 95, 120, 0.10);
  --accent-line: rgba(15, 95, 120, 0.38);
  --accent-contrast: #ffffff;
}

html[data-theme="light"][data-accent="violet"] {
  --accent: #4c1d95;
  --accent-2: #581c87;
  --accent-soft: rgba(76, 29, 149, 0.10);
  --accent-line: rgba(76, 29, 149, 0.36);
  --accent-contrast: #ffffff;
}

html[data-theme="light"][data-accent="emerald"] {
  --accent: #166534;
  --accent-2: #14532d;
  --accent-soft: rgba(22, 101, 52, 0.10);
  --accent-line: rgba(22, 101, 52, 0.34);
  --accent-contrast: #ffffff;
}

html[data-theme="light"][data-accent="amber"] {
  --accent: #92400e;
  --accent-2: #78350f;
  --accent-soft: rgba(146, 64, 14, 0.10);
  --accent-line: rgba(146, 64, 14, 0.34);
  --accent-contrast: #ffffff;
}

html[data-theme="light"][data-accent="slate"] {
  --accent: #475569;
  --accent-2: #334155;
  --accent-soft: rgba(71, 85, 105, 0.10);
  --accent-line: rgba(71, 85, 105, 0.34);
  --accent-contrast: #ffffff;
}

html[data-theme="light"][data-accent="parchment"] {
  color-scheme: light;
  --parchment: #f5f4ed;
  --ivory: #faf9f5;
  --sand: #e8e6dc;
  --brand: #1B365D;
  --ink-light: #2D5A8A;
  --text-1: #141413;
  --text-2: #3d3d3a;
  --text-3: #6b6a64;
  --border: #e8e6dc;
  --border-soft: #e5e3d8;
  --tag-bg: #E4ECF5;
  --accent: var(--brand);
  --accent-2: var(--ink-light);
  --accent-soft: var(--tag-bg);
  --accent-line: #b8c7d8;
  --accent-contrast: #ffffff;
  --ok: #315b3d;
  --warn: #7b5726;
  --err: #8f2d2d;
}

html[data-accent="parchment"] body {
  font-family: var(--serif);
  letter-spacing: 0;
}

html[data-status="ok"]         { --st-c: var(--wv-status-ok); }
html[data-status="idle"]       { --st-c: var(--wv-status-idle); }
html[data-status="thinking"]   { --st-c: var(--wv-status-thinking); }
html[data-status="writing"]    { --st-c: var(--wv-status-writing); }
html[data-status="tool"]       { --st-c: var(--wv-status-tool); }
html[data-status="connect"]    { --st-c: var(--wv-status-connect); }
html[data-status="disconnect"] { --st-c: var(--wv-status-disconnect); }
html[data-status="error"]      { --st-c: var(--wv-status-error); }