/* ═══════════════════════════════════════════════════════════
   Skirwith Village Website — Design Tokens (theme.css)
   
   All visual styling flows from these variables.
   To restyle the entire site, edit this file only.
   ═══════════════════════════════════════════════════════════ */

:root {
  /* ── Colours ── */
  --color-primary:        #2E7D32;   /* Main green */
  --color-primary-dark:   #1B5E20;   /* Dark green (headers, footer) */
  --color-primary-light:  #A5D6A7;   /* Light green (highlights, badges) */
  --color-accent:         #FF8F00;   /* Amber accent (CTAs, buttons) */
  --color-background:     #FAFAFA;   /* Page background */
  --color-surface:        #FFFFFF;   /* Card/panel background */
  --color-text:           #212121;   /* Body text */
  --color-text-secondary: #616161;   /* Captions, metadata */
  --color-text-on-primary:#FFFFFF;   /* Text on green backgrounds */
  --color-border:         #E0E0E0;   /* Dividers, card borders */
  --color-error:          #D32F2F;   /* Error messages */
  --color-success:        #388E3C;   /* Success messages */

  /* ── Typography ── */
  --font-family:          -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;
  --font-size-base:       1rem;      /* 16px */
  --font-size-sm:         0.875rem;  /* 14px */
  --font-size-lg:         1.25rem;   /* 20px */
  --font-size-h1:         2.25rem;   /* 36px */
  --font-size-h2:         1.75rem;   /* 28px */
  --font-size-h3:         1.375rem;  /* 22px */
  --line-height:          1.6;

  /* ── Spacing ── */
  --space-xs:   0.25rem;   /* 4px */
  --space-sm:   0.5rem;    /* 8px */
  --space-md:   1rem;      /* 16px */
  --space-lg:   1.5rem;    /* 24px */
  --space-xl:   2rem;      /* 32px */
  --space-2xl:  3rem;      /* 48px */

  /* ── Layout ── */
  --max-width:        1200px;
  --border-radius:    8px;
  --border-radius-sm: 4px;

  /* ── Shadows ── */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.12);
  --shadow-md:  0 4px 6px rgba(0,0,0,0.1);
  --shadow-lg:  0 10px 20px rgba(0,0,0,0.15);
}
