/* Theme: Terracotta Grove (terracotta-grove) */
/* A grounded editorial aesthetic with forest ink typography on stone surfaces, punctuated by warm terracotta accents. */

@tailwind base;
@tailwind components;
@tailwind utilities;

@import url("https://fonts.googleapis.com/css2?family=Newsreader:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

@layer base {
  :root {
    /* Warm stone-tinted grey that anchors the editorial backdrop and borders */
    --palette-neutral-100: #FBFAFA;
    --palette-neutral-150: #F9F9F8;
    --palette-neutral-200: #F5F4F2;
    --palette-neutral-250: #EEECE9;
    --palette-neutral-300: #E4E1DC;
    --palette-neutral-350: #D7D3CC;
    --palette-neutral-400: #C7C1B8;
    --palette-neutral-450: #B3ACA1;
    --palette-neutral-500: #9C9487;
    --palette-neutral-550: #827869;
    --palette-neutral-600: #675F52;
    --palette-neutral-650: #514A3F;
    --palette-neutral-700: #3E3830;
    --palette-neutral-750: #2F2B24;
    --palette-neutral-800: #25211C;
    --palette-neutral-850: #1E1C17;
    --palette-neutral-900: #1C1A16;
    /* Terracotta clay accent color used for primary CTAs and focused visual indicators */
    --palette-brand-100: #FEF9F8;
    --palette-brand-150: #FDF7F6;
    --palette-brand-200: #FCF1EE;
    --palette-brand-250: #F9E7E2;
    --palette-brand-300: #F6DAD0;
    --palette-brand-350: #F1C8BA;
    --palette-brand-400: #EBB29F;
    --palette-brand-450: #E39980;
    --palette-brand-500: #DA7B5D;
    --palette-brand-550: #CE542D;
    --palette-brand-600: #A44223;
    --palette-brand-650: #80331A;
    --palette-brand-700: #622714;
    --palette-brand-750: #4B1E0F;
    --palette-brand-800: #3A170B;
    --palette-brand-850: #301309;
    --palette-brand-900: #2D1209;
    --palette-danger-100: #FEF9F9;
    --palette-danger-150: #FEF7F7;
    --palette-danger-200: #FDF1F0;
    --palette-danger-250: #FBE6E5;
    --palette-danger-300: #F9D7D5;
    --palette-danger-350: #F6C4C1;
    --palette-danger-400: #F2ADA9;
    --palette-danger-450: #ED918C;
    --palette-danger-500: #E6726C;
    --palette-danger-550: #DE3C33;
    --palette-danger-600: #BC251D;
    --palette-danger-650: #931C16;
    --palette-danger-700: #721610;
    --palette-danger-750: #58100C;
    --palette-danger-800: #450D09;
    --palette-danger-850: #390A08;
    --palette-danger-900: #360A07;
    --palette-warning-100: #FDFAF6;
    --palette-warning-150: #FDF8F2;
    --palette-warning-200: #FBF3E8;
    --palette-warning-250: #F8EAD6;
    --palette-warning-300: #F4DEBE;
    --palette-warning-350: #EFCE9F;
    --palette-warning-400: #E8BA7A;
    --palette-warning-450: #DFA34D;
    --palette-warning-500: #CB8625;
    --palette-warning-550: #A46C1D;
    --palette-warning-600: #835617;
    --palette-warning-650: #664311;
    --palette-warning-700: #4E330D;
    --palette-warning-750: #3C270A;
    --palette-warning-800: #2E1E07;
    --palette-warning-850: #261906;
    --palette-warning-900: #241706;
    --palette-success-100: #F5FCF9;
    --palette-success-150: #F2FBF8;
    --palette-success-200: #E9F7F2;
    --palette-success-250: #DAF2E9;
    --palette-success-300: #C4EADD;
    --palette-success-350: #A8E0CC;
    --palette-success-400: #86D3B8;
    --palette-success-450: #5FC4A1;
    --palette-success-500: #3DA682;
    --palette-success-550: #318668;
    --palette-success-600: #276B53;
    --palette-success-650: #1E5340;
    --palette-success-700: #173F31;
    --palette-success-750: #113025;
    --palette-success-800: #0D251D;
    --palette-success-850: #0B1F18;
    --palette-success-900: #0A1D16;
    --palette-info-100: #F7FBFC;
    --palette-info-150: #F5FAFA;
    --palette-info-200: #EDF6F7;
    --palette-info-250: #E0EFF1;
    --palette-info-300: #CDE5E8;
    --palette-info-350: #B6D8DE;
    --palette-info-400: #99C9D0;
    --palette-info-450: #77B6C0;
    --palette-info-500: #51A0AC;
    --palette-info-550: #41828B;
    --palette-info-600: #33676E;
    --palette-info-650: #275056;
    --palette-info-700: #1E3D42;
    --palette-info-750: #162E32;
    --palette-info-800: #112427;
    --palette-info-850: #0E1E20;
    --palette-info-900: #0D1C1E;
    --palette-accent-100: #F1FDFA;
    --palette-accent-150: #EDFCF8;
    --palette-accent-200: #E1FAF3;
    --palette-accent-250: #CDF7EB;
    --palette-accent-300: #B1F3DF;
    --palette-accent-350: #8DEDD1;
    --palette-accent-400: #61E6BF;
    --palette-accent-450: #2DDDA9;
    --palette-accent-500: #1CA87F;
    --palette-accent-550: #168867;
    --palette-accent-600: #116C51;
    --palette-accent-650: #0D543F;
    --palette-accent-700: #0A4131;
    --palette-accent-750: #083125;
    --palette-accent-800: #06261D;
    --palette-accent-850: #052018;
    --palette-accent-900: #051E16;
  }

  :root {
    --radius: 0.375rem;
    --radius-sm: calc(var(--radius) - 4px);
    --radius-md: calc(var(--radius) - 2px);
    --radius-lg: var(--radius);
    --radius-xl: calc(var(--radius) + 4px);
    --background: #F4F1EB;
    --foreground: #0A3D2E;
    --card: #FAF9F6;
    --card-foreground: #0A3D2E;
    --popover: #FAF9F6;
    --popover-foreground: #0A3D2E;
    --primary: var(--palette-brand-600);
    --primary-foreground: var(--palette-neutral-100);
    --secondary: var(--palette-neutral-200);
    --secondary-foreground: var(--palette-neutral-800);
    --muted: var(--palette-neutral-150);
    --muted-foreground: var(--palette-neutral-650);
    --accent: var(--palette-brand-150);
    --accent-foreground: var(--palette-brand-800);
    --destructive: var(--palette-danger-600);
    --destructive-foreground: var(--palette-neutral-100);
    --border: var(--palette-neutral-250);
    --input: var(--palette-neutral-300);
    --ring: var(--palette-brand-500);
    --chart-1: var(--palette-brand-500);
    --chart-2: var(--palette-accent-500);
    --chart-3: var(--palette-success-500);
    --chart-4: var(--palette-warning-500);
    --chart-5: var(--palette-info-500);
    --sidebar: #FAF9F6;
    --sidebar-foreground: #0A3D2E;
    --sidebar-primary: var(--palette-brand-600);
    --sidebar-primary-foreground: var(--palette-neutral-100);
    --sidebar-accent: var(--palette-neutral-200);
    --sidebar-accent-foreground: #0A3D2E;
    --sidebar-border: var(--palette-neutral-200);
    --sidebar-ring: var(--palette-brand-500);
    --font-sans: "Newsreader", system-ui, sans-serif;
    --font-display: "Instrument Serif", system-ui, sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, monospace;
    --text-hero: 700 3.5rem/3.75rem var(--font-display);
    --text-hero-tracking: -0.02em;
    --text-title: 700 2.25rem/2.625rem var(--font-display);
    --text-heading: 600 1.5rem/2rem var(--font-display);
    --text-body: 400 1rem/1.5rem var(--font-sans);
    --text-caption: 400 0.75rem/1rem var(--font-sans);
    --text-label: 500 0.875rem/1.25rem var(--font-sans);
    --text-overline: 600 0.75rem/1rem var(--font-sans);
    --text-overline-tracking: 0.08em;
    --text-overline-transform: uppercase;
    --shadow-xs: 0 1px 2px rgba(10, 61, 46, 0.04);
    --shadow-sm: 0 2px 4px rgba(10, 61, 46, 0.06);
    --shadow-md: 0 4px 8px rgba(10, 61, 46, 0.08);
    --shadow-lg: 0 8px 16px rgba(10, 61, 46, 0.1);
    --shadow-xl: 0 16px 24px rgba(10, 61, 46, 0.12);
    --gradient-brand_wash: linear-gradient(135deg, #FAF9F6 0%, #F1C8BA 100%);
  }

  .dark {
    --background: #0A251D;
    --foreground: #F4F1EB;
    --card: #0D2E24;
    --card-foreground: #F4F1EB;
    --popover: #0D2E24;
    --popover-foreground: #F4F1EB;
    --primary: var(--palette-brand-400);
    --primary-foreground: var(--palette-neutral-900);
    --secondary: var(--palette-neutral-800);
    --secondary-foreground: var(--palette-neutral-200);
    --muted: var(--palette-neutral-850);
    --muted-foreground: var(--palette-neutral-400);
    --accent: var(--palette-brand-800);
    --accent-foreground: var(--palette-brand-150);
    --destructive: var(--palette-danger-400);
    --destructive-foreground: var(--palette-neutral-900);
    --border: var(--palette-neutral-750);
    --input: var(--palette-neutral-700);
    --ring: var(--palette-brand-400);
    --chart-1: var(--palette-brand-400);
    --chart-2: var(--palette-accent-400);
    --chart-3: var(--palette-success-400);
    --chart-4: var(--palette-warning-400);
    --chart-5: var(--palette-info-400);
    --sidebar: #0E2A21;
    --sidebar-foreground: #F4F1EB;
    --sidebar-primary: var(--palette-brand-400);
    --sidebar-primary-foreground: var(--palette-neutral-900);
    --sidebar-accent: var(--palette-neutral-800);
    --sidebar-accent-foreground: #F4F1EB;
    --sidebar-border: var(--palette-neutral-800);
    --sidebar-ring: var(--palette-brand-400);
  }
}

@layer base {
  * { border-color: var(--border); }
  body { background-color: var(--background); color: var(--foreground); font-family: var(--font-sans); }
}

@layer components {
  .text-hero {
    font: var(--text-hero);
    letter-spacing: var(--text-hero-tracking);
  }
  .text-title {
    font: var(--text-title);
  }
  .text-heading {
    font: var(--text-heading);
  }
  .text-body {
    font: var(--text-body);
  }
  .text-caption {
    font: var(--text-caption);
  }
  .text-label {
    font: var(--text-label);
  }
  .text-overline {
    font: var(--text-overline);
    letter-spacing: var(--text-overline-tracking);
    text-transform: var(--text-overline-transform);
  }
}