/* ============================================
   Claude-Inspired Theme for Docmost
   Warm terracotta tones, clean typography
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700&display=swap');

/* =============================================
   LIGHT MODE
   ============================================= */
:root {
  --mantine-font-family: 'Inter', system-ui, -apple-system, sans-serif;
  --mantine-font-family-monospace: 'JetBrains Mono', 'Fira Code', 'SF Mono', monospace;
  --mantine-font-family-headings: 'Inter', system-ui, -apple-system, sans-serif;
  --mantine-h1-font-size: calc(1.75rem * var(--mantine-scale));
  --mantine-h2-font-size: calc(1.375rem * var(--mantine-scale));
  --mantine-h3-font-size: calc(1.125rem * var(--mantine-scale));
  --mantine-h4-font-size: calc(1rem * var(--mantine-scale));
  --mantine-h1-line-height: 1.3;
  --mantine-h2-line-height: 1.35;
  --mantine-h3-line-height: 1.4;
  --mantine-h4-line-height: 1.45;
  --mantine-line-height: 1.65;

  --mantine-color-body: oklch(0.985 0.003 75);
  --mantine-color-text: oklch(0.25 0.015 75);
  --mantine-color-dimmed: oklch(0.55 0.01 75);
  --mantine-color-placeholder: oklch(0.70 0.008 75);
  --mantine-color-white: oklch(0.995 0.002 75);
  --mantine-color-black: oklch(0.12 0.005 75);
  --mantine-color-default-border: oklch(0.88 0.008 75);
  --mantine-color-default-color: oklch(0.30 0.015 75);
  --mantine-color-default-hover: oklch(0.93 0.005 75);

  --mantine-primary-color-0: oklch(0.97 0.015 60);
  --mantine-primary-color-1: oklch(0.94 0.025 55);
  --mantine-primary-color-2: oklch(0.88 0.045 50);
  --mantine-primary-color-3: oklch(0.78 0.075 45);
  --mantine-primary-color-4: oklch(0.70 0.105 42);
  --mantine-primary-color-5: oklch(0.62 0.14 39);
  --mantine-primary-color-6: oklch(0.55 0.15 38);
  --mantine-primary-color-7: oklch(0.48 0.14 36);
  --mantine-primary-color-8: oklch(0.42 0.12 34);
  --mantine-primary-color-9: oklch(0.36 0.10 32);
  --mantine-color-orange-0: oklch(0.97 0.015 60);
  --mantine-color-orange-1: oklch(0.94 0.025 55);
  --mantine-color-orange-2: oklch(0.88 0.045 50);
  --mantine-color-orange-3: oklch(0.78 0.075 45);
  --mantine-color-orange-4: oklch(0.70 0.105 42);
  --mantine-color-orange-5: oklch(0.62 0.14 39);
  --mantine-color-orange-6: oklch(0.55 0.15 38);
  --mantine-color-orange-7: oklch(0.48 0.14 36);
  --mantine-color-orange-8: oklch(0.42 0.12 34);
  --mantine-color-orange-9: oklch(0.36 0.10 32);

  --mantine-color-gray-0: oklch(0.985 0.003 75);
  --mantine-color-gray-1: oklch(0.965 0.004 75);
  --mantine-color-gray-2: oklch(0.92 0.006 75);
  --mantine-color-gray-3: oklch(0.87 0.008 75);
  --mantine-color-gray-4: oklch(0.78 0.008 75);
  --mantine-color-gray-5: oklch(0.68 0.008 75);
  --mantine-color-gray-6: oklch(0.55 0.008 75);
  --mantine-color-gray-7: oklch(0.42 0.008 75);
  --mantine-color-gray-8: oklch(0.30 0.008 75);
  --mantine-color-gray-9: oklch(0.18 0.005 75);

  --mantine-color-dark-0: oklch(0.85 0.008 75);
  --mantine-color-dark-1: oklch(0.78 0.008 75);
  --mantine-color-dark-2: oklch(0.65 0.008 75);
  --mantine-color-dark-3: oklch(0.55 0.008 75);
  --mantine-color-dark-4: oklch(0.45 0.008 75);
  --mantine-color-dark-5: oklch(0.38 0.006 75);
  --mantine-color-dark-6: oklch(0.30 0.005 75);
  --mantine-color-dark-7: oklch(0.24 0.005 75);
  --mantine-color-dark-8: oklch(0.18 0.004 75);
  --mantine-color-dark-9: oklch(0.12 0.003 75);

  --mantine-color-red-0: oklch(0.97 0.015 30);
  --mantine-color-red-5: oklch(0.64 0.21 25);
  --mantine-color-red-6: oklch(0.56 0.18 24);
  --mantine-color-error: oklch(0.64 0.21 25);

  --mantine-radius-default: calc(0.375rem * var(--mantine-scale));
  --mantine-shadow-xs: 0 1px 2px oklch(0 0 0 / 0.04);
  --mantine-shadow-sm: 0 1px 3px oklch(0 0 0 / 0.06);
  --mantine-shadow-md: 0 4px 8px oklch(0 0 0 / 0.06);
  --mantine-shadow-lg: 0 8px 24px oklch(0 0 0 / 0.08);
  --mantine-shadow-xl: 0 12px 40px oklch(0 0 0 / 0.10);
}

[data-mantine-color-scheme="dark"] {
  --mantine-color-body: oklch(0.20 0.004 70);
  --mantine-color-text: oklch(0.88 0.008 70);
  --mantine-color-dimmed: oklch(0.70 0.006 70);
  --mantine-color-placeholder: oklch(0.65 0.006 70);
  --mantine-color-white: oklch(0.95 0.005 70);
  --mantine-color-default-border: oklch(0.32 0.006 70);
  --mantine-color-default-color: oklch(0.88 0.008 70);
  --mantine-color-default-hover: oklch(0.24 0.005 70);

  --mantine-primary-color-0: oklch(0.45 0.12 38);
  --mantine-primary-color-1: oklch(0.50 0.13 38);
  --mantine-primary-color-2: oklch(0.55 0.14 38);
  --mantine-primary-color-3: oklch(0.60 0.14 39);
  --mantine-primary-color-4: oklch(0.65 0.13 39);
  --mantine-primary-color-5: oklch(0.70 0.12 39);
  --mantine-primary-color-6: oklch(0.75 0.10 40);
  --mantine-primary-color-7: oklch(0.80 0.08 42);
  --mantine-primary-color-8: oklch(0.85 0.06 45);
  --mantine-primary-color-9: oklch(0.90 0.04 50);
  --mantine-color-orange-0: oklch(0.45 0.12 38);
  --mantine-color-orange-1: oklch(0.50 0.13 38);
  --mantine-color-orange-2: oklch(0.55 0.14 38);
  --mantine-color-orange-3: oklch(0.60 0.14 39);
  --mantine-color-orange-4: oklch(0.65 0.13 39);
  --mantine-color-orange-5: oklch(0.70 0.12 39);
  --mantine-color-orange-6: oklch(0.75 0.10 40);
  --mantine-color-orange-7: oklch(0.80 0.08 42);
  --mantine-color-orange-8: oklch(0.85 0.06 45);
  --mantine-color-orange-9: oklch(0.90 0.04 50);

  --mantine-color-gray-0: oklch(0.35 0.006 70);
  --mantine-color-gray-1: oklch(0.38 0.006 70);
  --mantine-color-gray-2: oklch(0.42 0.006 70);
  --mantine-color-gray-3: oklch(0.48 0.006 70);
  --mantine-color-gray-4: oklch(0.55 0.006 70);
  --mantine-color-gray-5: oklch(0.62 0.006 70);
  --mantine-color-gray-6: oklch(0.70 0.006 70);
  --mantine-color-gray-7: oklch(0.78 0.006 70);
  --mantine-color-gray-8: oklch(0.85 0.005 70);
  --mantine-color-gray-9: oklch(0.92 0.004 70);
  --mantine-color-dark-0: oklch(0.92 0.004 70);
  --mantine-color-dark-1: oklch(0.85 0.005 70);
  --mantine-color-dark-2: oklch(0.78 0.006 70);
  --mantine-color-dark-3: oklch(0.70 0.006 70);
  --mantine-color-dark-4: oklch(0.62 0.006 70);
  --mantine-color-dark-5: oklch(0.55 0.006 70);
  --mantine-color-dark-6: oklch(0.48 0.006 70);
  --mantine-color-dark-7: oklch(0.42 0.006 70);
  --mantine-color-dark-8: oklch(0.38 0.006 70);
  --mantine-color-dark-9: oklch(0.35 0.006 70);
  --mantine-color-red-0: oklch(0.50 0.15 25);
  --mantine-color-red-5: oklch(0.70 0.18 25);
  --mantine-color-red-6: oklch(0.75 0.16 26);
  --mantine-color-error: oklch(0.70 0.18 25);

  --mantine-shadow-xs: 0 1px 2px oklch(0 0 0 / 0.15);
  --mantine-shadow-sm: 0 1px 3px oklch(0 0 0 / 0.20);
  --mantine-shadow-md: 0 4px 8px oklch(0 0 0 / 0.25);
  --mantine-shadow-lg: 0 8px 24px oklch(0 0 0 / 0.30);
  --mantine-shadow-xl: 0 12px 40px oklch(0 0 0 / 0.35);
}

/* =============================================
   SIDEBAR: Georgia font for nav items
   ============================================= */
.mantine-NavLink-root,
.mantine-AppShell-navbar a,
.mantine-AppShell-navbar button,
[class*="navLink"] {
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.01em !important;
}

.mantine-AppShell-navbar .mantine-Text-root,
.mantine-AppShell-navbar [class*="section"],
.mantine-AppShell-navbar [class*="label"] {
  font-family: Georgia, 'Times New Roman', serif !important;
}

/* =============================================
   LINKS: subtle, not orange
   ============================================= */
a, .mantine-Text-root[data-variant="link"] {
  color: oklch(0.35 0.02 240) !important;
  text-decoration: none !important;
}
a:hover, .mantine-Text-root[data-variant="link"]:hover {
  color: oklch(0.25 0.02 240) !important;
  text-decoration: underline !important;
}
[data-mantine-color-scheme="dark"] a,
[data-mantine-color-scheme="dark"] .mantine-Text-root[data-variant="link"] {
  color: oklch(0.75 0.02 240) !important;
}
[data-mantine-color-scheme="dark"] a:hover {
  color: oklch(0.85 0.02 240) !important;
}

/* =============================================
   COMPONENT-LEVEL TWEAKS
   ============================================= */

/* Sidebar background */
.mantine-AppShell-navbar {
  background: oklch(0.975 0.002 75) !important;
  border-right: 1px solid oklch(0.90 0.006 75) !important;
}
[data-mantine-color-scheme="dark"] .mantine-AppShell-navbar {
  background: oklch(0.22 0.004 70) !important;
  border-right: 1px solid oklch(0.30 0.005 70) !important;
}

/* Editor area clean */
.mantine-AppShell-main {
  background: oklch(0.995 0.001 75) !important;
}
[data-mantine-color-scheme="dark"] .mantine-AppShell-main {
  background: oklch(0.18 0.003 70) !important;
}

/* Cards */
.mantine-Paper-root {
  background: oklch(0.995 0.002 75) !important;
  border: 1px solid oklch(0.90 0.006 75) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Paper-root {
  background: oklch(0.22 0.004 70) !important;
  border: 1px solid oklch(0.30 0.005 70) !important;
}

/* Buttons: orange only in filled variants */
.mantine-Button-filled:not(.mantine-Button-outline):not(.mantine-Button-light) {
  background: oklch(0.62 0.14 39) !important;
  color: white !important;
}
.mantine-Button-filled:hover:not(.mantine-Button-outline):not(.mantine-Button-light) {
  background: oklch(0.55 0.15 38) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Button-filled:not(.mantine-Button-outline):not(.mantine-Button-light) {
  background: oklch(0.65 0.13 39) !important;
}

/* Outline buttons */
.mantine-Button-outline {
  border-color: oklch(0.62 0.14 39) !important;
  color: oklch(0.62 0.14 39) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Button-outline {
  border-color: oklch(0.70 0.12 39) !important;
  color: oklch(0.70 0.12 39) !important;
}

/* Inputs */
.mantine-Input-input, .mantine-TextInput-input, .mantine-Textarea-input {
  border-color: oklch(0.88 0.008 75) !important;
  background: oklch(0.995 0.002 75) !important;
}
.mantine-Input-input:focus {
  border-color: oklch(0.62 0.14 39) !important;
  box-shadow: 0 0 0 1px oklch(0.62 0.14 39 / 0.2) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Input-input,
[data-mantine-color-scheme="dark"] .mantine-TextInput-input,
[data-mantine-color-scheme="dark"] .mantine-Textarea-input {
  border-color: oklch(0.36 0.006 70) !important;
  background: oklch(0.22 0.004 70) !important;
}

/* Selected/hover items */
.mantine-Menu-item:hover,
.mantine-Select-item[data-selected],
.mantine-Autocomplete-item[data-selected] {
  background: oklch(0.94 0.025 55) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Menu-item:hover,
[data-mantine-color-scheme="dark"] .mantine-Select-item[data-selected],
[data-mantine-color-scheme="dark"] .mantine-Autocomplete-item[data-selected] {
  background: oklch(0.30 0.008 70) !important;
}

/* Tabs active */
.mantine-Tabs-tab[data-active] {
  border-color: oklch(0.62 0.14 39) !important;
  color: oklch(0.62 0.14 39) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Tabs-tab[data-active] {
  border-color: oklch(0.70 0.12 39) !important;
  color: oklch(0.70 0.12 39) !important;
}

/* Checkbox & Radio */
.mantine-Checkbox-input:checked,
.mantine-Radio-input:checked {
  background: oklch(0.62 0.14 39) !important;
  border-color: oklch(0.62 0.14 39) !important;
}

/* Pagination */
.mantine-Pagination-item[data-active] {
  background: oklch(0.62 0.14 39) !important;
  border-color: oklch(0.62 0.14 39) !important;
}

/* Badges */
.mantine-Badge-root {
  background: oklch(0.94 0.025 55) !important;
  color: oklch(0.42 0.12 34) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Badge-root {
  background: oklch(0.40 0.08 42) !important;
  color: oklch(0.90 0.04 50) !important;
}

/* Alerts */
.mantine-Alert-root {
  border-left: 4px solid oklch(0.62 0.14 39) !important;
}

/* Progress */
.mantine-Progress-bar {
  background: oklch(0.62 0.14 39) !important;
}

/* Slider */
.mantine-Slider-thumb {
  border-color: oklch(0.62 0.14 39) !important;
}

/* Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: oklch(0.85 0.008 75);
  border-radius: 3px;
}
[data-mantine-color-scheme="dark"] ::-webkit-scrollbar-thumb {
  background: oklch(0.40 0.006 70);
}

/* Dividers */
.mantine-Divider-root {
  border-color: oklch(0.90 0.006 75) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Divider-root {
  border-color: oklch(0.32 0.006 70) !important;
}

/* Code */
pre, code, .mantine-Code-root {
  font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', monospace !important;
}

/* Blockquote */
blockquote {
  border-left: 3px solid oklch(0.62 0.14 39) !important;
  background: oklch(0.97 0.015 60 / 0.3) !important;
  padding: 0.5rem 1rem !important;
  border-radius: 0 0.25rem 0.25rem 0 !important;
}
[data-mantine-color-scheme="dark"] blockquote {
  border-left-color: oklch(0.70 0.12 39) !important;
  background: oklch(0.45 0.12 38 / 0.15) !important;
}

/* Tooltip */
.mantine-Tooltip-tooltip {
  background: oklch(0.25 0.015 75) !important;
  color: oklch(0.985 0.003 75) !important;
  font-size: 0.8rem !important;
}
[data-mantine-color-scheme="dark"] .mantine-Tooltip-tooltip {
  background: oklch(0.85 0.005 70) !important;
  color: oklch(0.20 0.004 70) !important;
}

/* Skeleton */
.mantine-Skeleton-root::before {
  background: oklch(0.92 0.006 75) !important;
}
[data-mantine-color-scheme="dark"] .mantine-Skeleton-root::before {
  background: oklch(0.30 0.005 70) !important;
}