/* =============================================================
   EXPERIA — CSS Custom Properties (4 Themes)
   ============================================================= */

/* ---- Design-style defaults (sharp / editorial) ----
   Inherited by Heritage, Modern, Botanical.
   Overridden by Aurora for a rounded, gradient SaaS look. */
:root {
  --radius-btn:    2px;
  --radius-card:   4px;
  --radius-input:  0px;
  --radius-img:    0px;
  --btn-transform: uppercase;
  --btn-tracking:  0.1em;
  --gradient-dark: none;          /* falls back to solid --bg-dark */
  --gradient-accent: none;        /* falls back to solid --accent */
  --shadow-card:   none;
  --shadow-card-hover: 0 12px 32px rgba(0, 0, 0, 0.08);
  /* Primary button tokens (default: dark fill, accent on hover) */
  --btn-primary-bg:         var(--text-primary);
  --btn-primary-text:       var(--bg-primary);
  --btn-primary-bg-hover:   var(--accent);
  --btn-primary-text-hover: var(--text-on-dark);
}

/* ---- Heritage (Warm Editorial) ---- */
[data-theme="heritage"] {
  --bg-primary:      #FAF8F4;
  --bg-warm:         #FFFDF9;
  --bg-dark:         #1C1A17;
  --bg-dark-deeper:  #141210;
  --bg-accent-pale:  #FAF3E6;
  --bg-section-alt:  #EFF2EE;
  --bg-nav:          rgba(250, 248, 244, 0.88);

  --accent:          #B8863C;
  --accent-light:    #E8D5B0;
  --accent-pale:     #FAF3E6;

  --text-primary:    #1C1A17;
  --text-muted:      #5A5750;
  --text-light:      #9A9590;
  --text-on-dark:    #FAF8F4;
  --text-on-dark-muted:  rgba(250, 248, 244, 0.6);
  --text-on-dark-faint:  rgba(250, 248, 244, 0.35);

  --border:          rgba(28, 26, 23, 0.12);
  --border-strong:   rgba(28, 26, 23, 0.22);

  --font-display:    'Cormorant Garamond', serif;
  --font-body:       'DM Sans', sans-serif;
}

/* ---- Modern (Clean Contemporary) ---- */
[data-theme="modern"] {
  --bg-primary:      #FFFFFF;
  --bg-warm:         #FAFAFA;
  --bg-dark:         #0B1A2E;
  --bg-dark-deeper:  #060F1C;
  --bg-accent-pale:  #FEF5F1;
  --bg-section-alt:  #F3F4F6;
  --bg-nav:          rgba(255, 255, 255, 0.88);

  --accent:          #D85A30;
  --accent-light:    #F5C4B3;
  --accent-pale:     #FEF5F1;

  --text-primary:    #111827;
  --text-muted:      #4B5563;
  --text-light:      #9CA3AF;
  --text-on-dark:    #F9FAFB;
  --text-on-dark-muted:  rgba(249, 250, 251, 0.6);
  --text-on-dark-faint:  rgba(249, 250, 251, 0.35);

  --border:          rgba(17, 24, 39, 0.10);
  --border-strong:   rgba(17, 24, 39, 0.20);

  --font-display:    'Playfair Display', serif;
  --font-body:       'Outfit', sans-serif;
}

/* ---- Botanical (Organic & Grounded) ---- */
[data-theme="botanical"] {
  --bg-primary:      #F5F2ED;
  --bg-warm:         #EDE8E1;
  --bg-dark:         #1A2E1A;
  --bg-dark-deeper:  #101E10;
  --bg-accent-pale:  #F2EAE3;
  --bg-section-alt:  #EBE6DE;
  --bg-nav:          rgba(245, 242, 237, 0.88);

  --accent:          #B05E3A;
  --accent-light:    #D4A98A;
  --accent-pale:     #F2EAE3;

  --text-primary:    #2C2C2A;
  --text-muted:      #5C5C56;
  --text-light:      #8A8A82;
  --text-on-dark:    #F5F2ED;
  --text-on-dark-muted:  rgba(245, 242, 237, 0.6);
  --text-on-dark-faint:  rgba(245, 242, 237, 0.35);

  --border:          rgba(44, 44, 42, 0.12);
  --border-strong:   rgba(44, 44, 42, 0.22);

  --font-display:    'Lora', serif;
  --font-body:       'Source Sans 3', sans-serif;
}

/* ---- Aurora (Violet Digital / SaaS) ----
   Inspired by a modern violet digital-agency aesthetic:
   pill buttons, rounded cards, soft gradients, geometric sans type. */
[data-theme="aurora"] {
  --bg-primary:      #FFFFFF;
  --bg-warm:         #F8F6FF;
  --bg-dark:         #1C1638;
  --bg-dark-deeper:  #14102A;
  --bg-accent-pale:  #F4F1FF;
  --bg-section-alt:  #F1ECFF;
  --bg-nav:          rgba(255, 255, 255, 0.85);

  --accent:          #6D4AFF;
  --accent-light:    #C4B5FD;
  --accent-pale:     #F0EBFF;

  --text-primary:    #1A1633;
  --text-muted:      #5B5670;
  --text-light:      #9B96AE;
  --text-on-dark:    #F5F3FF;
  --text-on-dark-muted:  rgba(245, 243, 255, 0.68);
  --text-on-dark-faint:  rgba(245, 243, 255, 0.4);

  --border:          rgba(26, 22, 51, 0.10);
  --border-strong:   rgba(26, 22, 51, 0.18);

  --font-display:    'Plus Jakarta Sans', sans-serif;
  --font-body:       'Figtree', sans-serif;

  /* Design-style overrides — the Aurora "feel" */
  --radius-btn:    100px;          /* pill buttons */
  --radius-card:   18px;           /* rounded cards */
  --radius-input:  10px;
  --radius-img:    18px;
  --btn-transform: none;           /* sentence-case buttons */
  --btn-tracking:  0.01em;
  --gradient-dark:   linear-gradient(140deg, #4C2FBF 0%, #6D4AFF 55%, #9D86FF 100%);
  --gradient-accent: linear-gradient(140deg, #6D4AFF 0%, #9D86FF 100%);
  --shadow-card:   0 12px 40px rgba(99, 67, 214, 0.10);
  --shadow-card-hover: 0 18px 48px rgba(99, 67, 214, 0.18);

  --btn-primary-bg:         var(--accent);
  --btn-primary-text:       #FFFFFF;
  --btn-primary-bg-hover:   #5A3BE0;
  --btn-primary-text-hover: #FFFFFF;
}
