/*
 * Kinavans / AM Shop — light + dark.
 * Light: design/kinavans-shop.html tokens.
 * Dark: design/brand-spec.md (charcoal wood + brushed gold).
 * THEME_DIR=kinavans. Do not define --color-primary / --color-accent / --color-secondary here.
 */

:root {
  /* Light marketplace (HTML export) */
  --kv-bg: oklch(98% 0.004 240);
  --kv-surface: oklch(100% 0 0);
  --kv-fg: oklch(20% 0.02 240);
  --kv-muted: oklch(50% 0.018 240);
  --kv-border: oklch(90% 0.006 240);
  --kv-accent: oklch(56% 0.12 170);

  --color-background: #f7f8fa;
  --color-surface: #ffffff;
  --color-text: #1a1f2e;
  --color-text-muted: #667085;
  --font-sans: 'Avenir Next', 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-heading: 'Avenir Next', 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;

  --border: 220 14% 90%;
  --background: 220 20% 98%;
  --foreground: 230 25% 14%;
  --card: 0 0% 100%;
  --card-foreground: 230 25% 14%;
  --muted: 220 14% 96%;
  --muted-foreground: 220 10% 42%;
  --accent: 220 14% 94%;
  --accent-foreground: 230 25% 14%;
  --primary: 168 55% 36%;
  --primary-foreground: 0 0% 100%;
  --ring: 168 45% 40%;

  --pf-tools-field-border: #d0d5dd;
  --pf-tools-field-bg: #ffffff;
  --pf-tools-field-fg: #1a1f2e;
  --pf-tools-focus-outline: #2a9d8f;
  --pf-tools-btn-primary-bg: #2a9d8f;
  --pf-tools-btn-primary-fg: #ffffff;
  --pf-tools-btn-primary-hover-bg: #238b7e;
  --pf-tools-btn-secondary-bg: #ffffff;
  --pf-tools-btn-secondary-fg: #1a1f2e;
  --pf-tools-btn-secondary-border: #d0d5dd;
  --pf-tools-btn-secondary-hover-bg: #f2f4f7;
  --pf-tools-dl-bg: #ffffff;
  --pf-tools-dt-fg: #667085;
  --pf-tools-dd-fg: #1a1f2e;
  --pf-tools-nav-fg: #344054;
  --pf-tools-nav-hover-bg: #f2f4f7;
  --pf-tools-nav-active-bg: #2a9d8f;
  --pf-tools-nav-active-fg: #ffffff;
  --pf-tools-border: hsl(var(--border));
  --pf-tools-surface: var(--color-surface);
  --pf-tools-panel-bg: var(--color-background);
}

html.dark {
  /* Dark luxury (brand-spec) */
  --kv-bg: oklch(15.3% 0.004 107);
  --kv-surface: oklch(27.6% 0.004 107);
  --kv-fg: oklch(95.6% 0.014 85);
  --kv-muted: oklch(68.7% 0.021 88);
  --kv-border: oklch(34.4% 0.009 98);
  --kv-accent: oklch(89.6% 0.069 95);

  --color-background: #1a1917;
  --color-surface: #2e2d2a;
  --color-text: #f5f0e6;
  --color-text-muted: #b5ae9c;

  --border: 40 6% 34%;
  --background: 40 6% 10%;
  --foreground: 40 20% 95%;
  --card: 40 5% 18%;
  --card-foreground: 40 20% 95%;
  --muted: 40 5% 16%;
  --muted-foreground: 40 8% 68%;
  --accent: 40 5% 20%;
  --accent-foreground: 40 20% 95%;
  --primary: 48 55% 78%;
  --primary-foreground: 40 10% 12%;
  --ring: 48 40% 70%;

  --pf-tools-field-border: #4a4840;
  --pf-tools-field-bg: #2e2d2a;
  --pf-tools-field-fg: #f5f0e6;
  --pf-tools-focus-outline: #ebdda9;
  --pf-tools-btn-primary-bg: #ebdda9;
  --pf-tools-btn-primary-fg: #1a1917;
  --pf-tools-btn-primary-hover-bg: #f0e5bc;
  --pf-tools-btn-secondary-bg: #2e2d2a;
  --pf-tools-btn-secondary-fg: #f5f0e6;
  --pf-tools-btn-secondary-border: #4a4840;
  --pf-tools-btn-secondary-hover-bg: #3a3934;
  --pf-tools-dl-bg: #2e2d2a;
  --pf-tools-dt-fg: #b5ae9c;
  --pf-tools-dd-fg: #f5f0e6;
  --pf-tools-nav-fg: #d8d0c0;
  --pf-tools-nav-hover-bg: #3a3934;
  --pf-tools-nav-active-bg: #ebdda9;
  --pf-tools-nav-active-fg: #1a1917;
  --pf-tools-border: hsl(var(--border));
  --pf-tools-surface: var(--color-surface);
  --pf-tools-panel-bg: var(--color-background);
}