/* theme.css - FindBestKB Lime+Gray v4
 * Light-mode only. No dark mode.
 */

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

:root {
  /* background surfaces */
  --color-bg: #fafafa;
  --color-bg-alt: #f4f4f5;
  --color-bg-card: #ffffff;
  --color-bg-elevated: #ffffff;
  --color-bg-secondary: #f4f4f5;
  --color-bg-hover: #f0fdf4;

  /* hero gradient */
  --gradient-hero: linear-gradient(135deg, #f0fdf4 0%, #fafafa 50%, #f4f4f5 100%);

  /* text */
  --color-text: #27272a;
  --color-text-secondary: #3f3f46;
  --color-text-muted: #71717a;
  --color-text-faint: #a1a1aa;
  --color-text-inverse: #ffffff;

  /* brand - lime */
  --color-primary: #65a30d;
  --color-primary-hover: #4d7c0f;
  --color-primary-muted: #84cc16;
  --color-accent: #65a30d;
  --color-accent-hover: #4d7c0f;
  --color-cta: #65a30d;
  --color-cta-hover: #4d7c0f;
  --color-star: #eab308;

  /* status */
  --color-success: #65a30d;
  --color-success-alt: #4d7c0f;

  /* borders */
  --color-border: #e4e4e7;
  --color-border-standard: #e4e4e7;
  --color-border-solid: #e4e4e7;
  --color-border-solid-2: #d4d4d8;
  --color-border-solid-3: #a1a1aa;

  /* overlay */
  --color-overlay: rgba(0,0,0,0.5);

  /* typography */
  --font-heading: 'Inter', -apple-system, system-ui, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Inter', -apple-system, system-ui, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, 'SF Mono', Menlo, monospace;
  --font-feature: "cv01", "ss03";

  /* spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;

  /* radius - 16px cards, 999px CTAs */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-2xl: 24px;
  --radius-full: 999px;

  /* shadows */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 2px 8px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.04);
  --shadow-lg: 0 4px 16px rgba(0,0,0,0.08);
  --shadow-inset: inset 0 1px 4px rgba(0,0,0,0.06);
  --shadow-dialog: 0 8px 32px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
  --shadow-card: 0 2px 12px rgba(0,0,0,0.06);
}

/* global type */
body {
  font-family: var(--font-body);
  font-feature-settings: var(--font-feature);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.7;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-feature-settings: var(--font-feature);
  color: var(--color-text);
  line-height: 1.3;
}

a {
  color: var(--color-primary);
  text-decoration: none;
  transition: color 0.15s ease;
}
a:hover {
  color: var(--color-primary-hover);
}