@import "tailwindcss";
@import "./animations.css";

@theme {
  --font-headline: "Space Grotesk", system-ui, sans-serif;
  --font-body: "Newsreader", Georgia, serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  --color-cursor-dark: #26251e;
  --color-cursor-cream: #f2f1ed;
  --color-cursor-light: #e6e5e0;
  --color-cursor-orange: #f54e00;
  --color-error-warm: #cf2d56;
  --color-success-muted: #1f8a65;

  --color-surface-100: #f7f7f4;
  --color-surface-200: #f2f1ed;
  --color-surface-300: #ebeae5;
  --color-surface-400: #e6e5e0;
  --color-surface-500: #e1e0db;

  --color-surface-inverted: #26251e;
  --color-text-inverted: rgba(242, 241, 237, 0.85);
  --color-text-inverted-muted: rgba(242, 241, 237, 0.35);

  --color-thinking: #dfa88f;
  --color-grep: #9fc9a2;
  --color-read: #9fbbe0;
  --color-edit: #c0a8dd;
  --color-gold: #c08532;

  --radius-xs: 0.125rem;
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.625rem;
  --radius-xl: 0.75rem;
  --radius-pill: 9999px;
}

:root {
  --background: #f2f1ed;
  --foreground: #26251e;
  --card: #e6e5e0;
  --card-foreground: #26251e;
  --popover: #e6e5e0;
  --popover-foreground: #26251e;
  --primary: #26251e;
  --primary-foreground: #f2f1ed;
  --secondary: #ebeae5;
  --secondary-foreground: #26251e;
  --muted: #e6e5e0;
  --muted-foreground: rgba(38, 37, 30, 0.55);
  --accent: #ebeae5;
  --accent-foreground: #26251e;
  --destructive: #cf2d56;
  --destructive-foreground: #f2f1ed;
  --border: rgba(38, 37, 30, 0.1);
  --input: rgba(38, 37, 30, 0.1);
  --ring: rgba(38, 37, 30, 0.2);
  --radius: 0.5rem;

  --sidebar-background: #ebeae5;
  --sidebar-foreground: #26251e;
  --sidebar-primary: #26251e;
  --sidebar-primary-foreground: #f2f1ed;
  --sidebar-accent: #e6e5e0;
  --sidebar-accent-foreground: #26251e;
  --sidebar-border: rgba(38, 37, 30, 0.1);
  --sidebar-ring: rgba(38, 37, 30, 0.2);

  /* Semantic opacity tokens */
  --fg-base: rgba(38, 37, 30, 1);
  --fg-70: rgba(38, 37, 30, 0.7);
  --fg-65: rgba(38, 37, 30, 0.65);
  --fg-62: rgba(38, 37, 30, 0.62);
  --fg-60: rgba(38, 37, 30, 0.6);
  --fg-55: rgba(38, 37, 30, 0.55);
  --fg-50: rgba(38, 37, 30, 0.5);
  --fg-48: rgba(38, 37, 30, 0.48);
  --fg-45: rgba(38, 37, 30, 0.45);
  --fg-40: rgba(38, 37, 30, 0.4);
  --fg-35: rgba(38, 37, 30, 0.35);
  --fg-30: rgba(38, 37, 30, 0.3);
  --fg-25: rgba(38, 37, 30, 0.25);
  --fg-20: rgba(38, 37, 30, 0.2);
  --fg-15: rgba(38, 37, 30, 0.15);
  --fg-12: rgba(38, 37, 30, 0.12);
  --fg-10: rgba(38, 37, 30, 0.1);
  --fg-08: rgba(38, 37, 30, 0.08);
  --fg-06: rgba(38, 37, 30, 0.06);
  --fg-04: rgba(38, 37, 30, 0.04);
}

/* Dark theme overrides */
[data-theme="dark"] {
  --background: #1a1a1a;
  --foreground: #e8e6e3;
  --card: #242424;
  --card-foreground: #e8e6e3;
  --popover: #242424;
  --popover-foreground: #e8e6e3;
  --primary: #e8e6e3;
  --primary-foreground: #1a1a1a;
  --secondary: #2a2a2a;
  --secondary-foreground: #e8e6e3;
  --muted: #2a2a2a;
  --muted-foreground: rgba(232, 230, 227, 0.55);
  --accent: #2a2a2a;
  --accent-foreground: #e8e6e3;
  --destructive: #e55a7a;
  --destructive-foreground: #e8e6e3;
  --border: rgba(232, 230, 227, 0.1);
  --input: rgba(232, 230, 227, 0.1);
  --ring: rgba(232, 230, 227, 0.2);

  --sidebar-background: #1e1e1e;
  --sidebar-foreground: #e8e6e3;
  --sidebar-primary: #e8e6e3;
  --sidebar-primary-foreground: #1a1a1a;
  --sidebar-accent: #242424;
  --sidebar-accent-foreground: #e8e6e3;
  --sidebar-border: rgba(232, 230, 227, 0.08);
  --sidebar-ring: rgba(232, 230, 227, 0.2);

  /* Semantic opacity tokens for dark */
  --fg-base: rgba(232, 230, 227, 1);
  --fg-70: rgba(232, 230, 227, 0.7);
  --fg-65: rgba(232, 230, 227, 0.65);
  --fg-62: rgba(232, 230, 227, 0.62);
  --fg-60: rgba(232, 230, 227, 0.6);
  --fg-55: rgba(232, 230, 227, 0.55);
  --fg-50: rgba(232, 230, 227, 0.5);
  --fg-48: rgba(232, 230, 227, 0.48);
  --fg-45: rgba(232, 230, 227, 0.45);
  --fg-40: rgba(232, 230, 227, 0.4);
  --fg-35: rgba(232, 230, 227, 0.35);
  --fg-30: rgba(232, 230, 227, 0.3);
  --fg-25: rgba(232, 230, 227, 0.25);
  --fg-20: rgba(232, 230, 227, 0.2);
  --fg-15: rgba(232, 230, 227, 0.15);
  --fg-12: rgba(232, 230, 227, 0.12);
  --fg-10: rgba(232, 230, 227, 0.1);
  --fg-08: rgba(232, 230, 227, 0.08);
  --fg-06: rgba(232, 230, 227, 0.06);
  --fg-04: rgba(232, 230, 227, 0.04);
}

/* Dark @theme variable overrides (auto-adapts bg-cursor-*, text-cursor-*, bg-surface-*) */
[data-theme="dark"] {
  --color-cursor-dark: #e8e6e3;
  --color-cursor-cream: #1a1a1a;
  --color-cursor-light: #242424;
  --color-surface-100: #1a1a1a;
  --color-surface-200: #1e1e1e;
  --color-surface-300: #242424;
  --color-surface-400: #2a2a2a;
  --color-surface-500: #333333;
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Custom scrollbar - warm tone matching design system */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(38, 37, 30, 0.15);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(38, 37, 30, 0.25);
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(38, 37, 30, 0.15) transparent;
}

/* Dark scrollbar */
[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(232, 230, 227, 0.15);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(232, 230, 227, 0.25);
}

[data-theme="dark"] * {
  scrollbar-color: rgba(232, 230, 227, 0.15) transparent;
}

/* ── Sonner Toast 设计系统覆盖 ── */

[data-sonner-toast] {
  --normal-bg: var(--color-surface-400);
  --normal-text: var(--foreground);
  --normal-border: var(--border);
  --success-bg: var(--color-surface-400);
  --success-text: var(--foreground);
  --success-border: var(--border);
  --error-bg: var(--color-surface-400);
  --error-text: var(--foreground);
  --error-border: var(--border);
  --warning-bg: var(--color-surface-400);
  --warning-text: var(--foreground);
  --warning-border: var(--border);
  --info-bg: var(--color-surface-400);
  --info-text: var(--foreground);
  --info-border: var(--border);

  box-shadow:
    rgba(0, 0, 0, 0.14) 0px 28px 70px,
    rgba(0, 0, 0, 0.1) 0px 14px 32px,
    rgba(38, 37, 30, 0.1) 0px 0px 0px 1px !important;
}

[data-sonner-toast][data-type="success"] [data-icon] {
  color: var(--color-success-muted);
}

[data-sonner-toast][data-type="error"] [data-icon] {
  color: var(--destructive);
}

[data-sonner-toast][data-type="warning"] [data-icon] {
  color: var(--color-gold);
}

[data-sonner-toast][data-type="info"] [data-icon] {
  color: var(--color-cursor-orange);
}

/* ── 深色模式覆盖 ── */

[data-theme="dark"] [data-sonner-toast] {
  box-shadow:
    rgba(0, 0, 0, 0.3) 0px 28px 70px,
    rgba(0, 0, 0, 0.2) 0px 14px 32px,
    rgba(232, 230, 227, 0.1) 0px 0px 0px 1px !important;
}
