/*
 * PFERDEHOF RUBE – DESIGN SYSTEM v1.0
 * Themes: v1 Meadow Journal | v2 Forest Bold |
 *         v3 Pastoral Minimal | v4 Wildwiese Modern
 *
 * Wechsel:   document.documentElement.setAttribute('data-theme','v1')
 * Persistenz: localStorage Key 'pferdehof-design'
 * Kunde wählt Design via Switcher → applyDesign() speichert.
 * Nach finaler Wahl: nur noch ein Theme behalten, Switcher entfernen.
 */

/* ==========================================================================
   DEFAULT: v4 (Wildwiese Modern)
   ========================================================================== */
:root, html[data-theme="v4"] {
  --color-primary: #1c2e1c;
  --color-accent: #68b048;
  --color-bg: #fafdf6;
  --color-bg2: #ffffff;
  --color-border: #e6efe1;
  --color-text: #1c2e1c;
  --color-muted: #5c6b5c;
  
  --color-nav-bg: rgba(250, 253, 246, 0.95);
  --color-nav-border: #e6efe1;
  --color-nav-link: #1c2e1c;
  
  --color-hero-bg-start: #f2f8ed;
  --color-hero-bg-end: #fafdf6;
  
  --color-cta-bg-start: #68b048;
  --color-cta-bg-end: #519a32;
  --color-footer-bg: #1c2e1c;
  --color-card-bg: #ffffff;
  
  --color-btn-primary-bg: #68b048;
  --color-btn-primary-text: #ffffff;
  
  --font-headline: 'Playfair Display', serif;
  --font-body: 'Inter', sans-serif;
  --headline-style: italic;
  
  --radius-btn: 999px;
  --radius-card: 14px;
  --radius-nav-btn: 999px;
  
  --shadow-card: 0 10px 40px rgba(28, 46, 28, 0.05);
  --shadow-nav: 0 2px 10px rgba(0, 0, 0, 0.02);

  /* Legacy Mapping for PHP Inline Styles */
  --wild-green: var(--color-primary);
  --meadow: #3d6e3d;
  --spring: var(--color-accent);
  --dew: #c8e8a0;
  --sky: var(--color-hero-bg-start);
  --paper: var(--color-bg);
  --border: var(--color-border);
  --muted: var(--color-muted);
}

/* ==========================================================================
   THEME V1: Meadow Journal (Warmes Papier, botanisch, Editorial)
   ========================================================================== */
html[data-theme="v1"] {
  --color-primary: #3d5c2a;
  --color-accent: #c8a96e;
  --color-bg: #faf7f0;
  --color-bg2: #fcfaf5;
  --color-border: #e6e2d8;
  --color-text: #2d3b25;
  --color-muted: #7a8274;
  
  --color-nav-bg: #ffffff;
  --color-nav-border: #c8a96e; /* Goldene Akzentlinie */
  --color-nav-link: #3d5c2a;
  
  --color-hero-bg-start: #f7f3e9;
  --color-hero-bg-end: #faf7f0;
  
  --color-cta-bg-start: #3d5c2a;
  --color-cta-bg-end: #2d451f;
  --color-footer-bg: #3d5c2a;
  --color-card-bg: #ffffff;
  
  --color-btn-primary-bg: #3d5c2a;
  --color-btn-primary-text: #ffffff;
  
  --font-headline: 'Playfair Display', serif;
  --font-body: 'Plus Jakarta Sans', sans-serif;
  --headline-style: italic;
  
  --radius-btn: 4px;
  --radius-card: 4px;
  --radius-nav-btn: 4px;
  
  --shadow-card: 0 4px 15px rgba(61, 92, 42, 0.06);
  --shadow-nav: 0 2px 5px rgba(0, 0, 0, 0.03);

  /* Legacy Mapping for PHP Inline Styles */
  --wild-green: var(--color-primary);
  --meadow: var(--color-primary);
  --spring: var(--color-accent);
  --dew: var(--color-accent);
  --sky: var(--color-hero-bg-start);
  --paper: var(--color-bg);
  --border: var(--color-border);
  --muted: var(--color-muted);
}

/* ==========================================================================
   THEME V2: Forest Bold (Dunkel, kraftvoll, sportlich modern)
   ========================================================================== */
html[data-theme="v2"] {
  --color-primary: #1a3020;
  --color-accent: #89c46a;
  --color-bg: #f5f8f2;
  --color-bg2: #ffffff;
  --color-border: #d8e1d5;
  --color-text: #1a3020;
  --color-muted: #5a6e5e;
  
  --color-nav-bg: #1a3020;
  --color-nav-border: #89c46a; /* Lime border */
  --color-nav-link: #f5f8f2;
  
  --color-hero-bg-start: #e9f2e4;
  --color-hero-bg-end: #f5f8f2;
  
  --color-cta-bg-start: #89c46a;
  --color-cta-bg-end: #77b059;
  --color-footer-bg: #132418;
  --color-card-bg: #ffffff;
  
  --color-btn-primary-bg: #89c46a;
  --color-btn-primary-text: #1a3020;
  
  --font-headline: 'Inter', sans-serif;
  --font-body: 'Inter', sans-serif;
  --headline-style: normal; /* bold via Font-Weight im CSS */
  
  --radius-btn: 999px;
  --radius-card: 8px;
  --radius-nav-btn: 999px;
  
  --shadow-card: 0 10px 30px rgba(26, 48, 32, 0.08);
  --shadow-nav: 0 4px 12px rgba(0, 0, 0, 0.1);

  /* Legacy Mapping for PHP Inline Styles */
  --wild-green: var(--color-primary);
  --meadow: var(--color-primary);
  --spring: var(--color-accent);
  --dew: #d8e1d5;
  --sky: var(--color-hero-bg-start);
  --paper: var(--color-bg);
  --border: var(--color-border);
  --muted: var(--color-muted);
}

/* ==========================================================================
   THEME V3: Pastoral Minimal (Luftig, Premium, maximaler Weißraum)
   ========================================================================== */
html[data-theme="v3"] {
  --color-primary: #2a3020;
  --color-accent: #b8a060;
  --color-bg: #fdfcf8;
  --color-bg2: #ffffff;
  --color-border: #efede5;
  --color-text: #2a3020;
  --color-muted: #8d9284;
  
  --color-nav-bg: #fdfcf8;
  --color-nav-border: #b8a060; /* Dünne Goldlinie */
  --color-nav-link: #2a3020;
  
  --color-hero-bg-start: #f9f8f4;
  --color-hero-bg-end: #fdfcf8;
  
  --color-cta-bg-start: #b8a060;
  --color-cta-bg-end: #a68f51;
  --color-footer-bg: #1c2e1c;
  --color-card-bg: #ffffff;
  
  --color-btn-primary-bg: #2a3020;
  --color-btn-primary-text: #ffffff;
  
  --font-headline: 'Playfair Display', serif;
  --font-body: 'Inter', sans-serif;
  --headline-style: normal; /* Light via Font-Weight */
  
  --radius-btn: 2px;
  --radius-card: 2px;
  --radius-nav-btn: 2px;
  
  --shadow-card: none; /* Minimalistischer Stil, eher Border nutzen */
  --shadow-nav: none;

  /* Legacy Mapping for PHP Inline Styles */
  --wild-green: var(--color-primary);
  --meadow: var(--color-primary);
  --spring: var(--color-accent);
  --dew: var(--color-border);
  --sky: var(--color-hero-bg-start);
  --paper: var(--color-bg);
  --border: var(--color-border);
  --muted: var(--color-muted);
}