/* ==========================================================================
   Bindery Website Design Tokens
   Warm Parchment & Obsidian Dark Mode Aesthetics
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400;1,6..72,500&display=swap');

:root {
  /* Typography */
  --font-serif: 'Newsreader', Garamond, 'EB Garamond', Georgia, serif;
  --font-sans: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Spacing & Radii */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 9999px;

  /* Layout */
  --container-max: 1180px;
  --container-prose: 760px;
  --nav-height: 72px;

  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 260ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 400ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Elevation Shadows */
  --shadow-sm: 0 2px 8px rgba(35, 25, 15, 0.04);
  --shadow-md: 0 8px 24px rgba(35, 25, 15, 0.07);
  --shadow-lg: 0 16px 48px rgba(35, 25, 15, 0.10);
  --shadow-float: 0 24px 64px -12px rgba(35, 25, 15, 0.14);
}

/* Light / Warm Parchment (Default Theme) */
:root,
[data-theme='light'] {
  --color-scheme: light;
  
  /* Surfaces */
  --bg-page: #f8f5ee;
  --bg-surface: #ffffff;
  --bg-surface-elevated: #faf7f0;
  --bg-surface-subtle: #f1ede3;
  --bg-highlight: #eed9b7;
  --bg-code: #ede8dc;
  
  /* Text */
  --text-main: #1f1b18;
  --text-muted: #5e574f;
  --text-subtle: #8a8277;
  --text-inverse: #fbf9f5;

  /* Accent (Warm Brass / Leather) */
  --accent: #875c2e;
  --accent-hover: #704b23;
  --accent-light: #f7ede0;
  --accent-glow: rgba(135, 92, 46, 0.18);
  --accent-contrast: #ffffff;

  /* Borders */
  --border-subtle: #e6dfd1;
  --border-default: #d8cfbe;
  --border-strong: #9e9381;
  --border-focus: #875c2e;

  /* Announcement Bar */
  --bar-bg: #875c2e;
  --bar-text: #ffffff;
  --bar-badge-bg: #f9d89c;
  --bar-badge-text: #593910;

  /* Comparison highlight */
  --table-highlight-bg: #fffbf4;
  --table-highlight-border: #eed9b7;
}

/* Dark / Obsidian Gold Theme */
[data-theme='dark'] {
  --color-scheme: dark;

  /* Surfaces */
  --bg-page: #12100e;
  --bg-surface: #1a1714;
  --bg-surface-elevated: #24201b;
  --bg-surface-subtle: #2b2621;
  --bg-highlight: #3b3226;
  --bg-code: #221e1a;

  /* Text */
  --text-main: #f0ebe2;
  --text-muted: #aba294;
  --text-subtle: #736b60;
  --text-inverse: #12100e;

  /* Accent (Gilded Warm Amber) */
  --accent: #e5a95d;
  --accent-hover: #f3be79;
  --accent-light: #2e2418;
  --accent-glow: rgba(229, 169, 93, 0.22);
  --accent-contrast: #12100e;

  /* Borders */
  --border-subtle: #2d2720;
  --border-default: #423a31;
  --border-strong: #706456;
  --border-focus: #e5a95d;

  /* Announcement Bar */
  --bar-bg: #221c15;
  --bar-text: #f0ebe2;
  --bar-badge-bg: #e5a95d;
  --bar-badge-text: #171107;

  /* Elevation Shadows in Dark */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.50);
  --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.65);
  --shadow-float: 0 24px 64px -12px rgba(0, 0, 0, 0.85);

  /* Comparison highlight */
  --table-highlight-bg: #231d16;
  --table-highlight-border: #4d3e28;
}