/* ============================================================
   NEW CHAPTER CARE — THEME DEFINITIONS
   5 Premium Auto-Cycling Color Themes
   ============================================================ */

/* ── Theme 1: Warm Gold & Cream (DEFAULT) ─────────────────── */
:root,
[data-theme="gold"] {
    --color-primary:       #B8860B;   /* Dark Goldenrod       */
    --color-primary-light: #D4A017;   /* Warm Gold            */
    --color-primary-pale:  #FFF8E7;   /* Cream                */
    --color-accent:        #8B4513;   /* Saddle Brown         */
    --color-accent-soft:   #D2A679;   /* Warm Tan             */
    --color-bg:            #FFFDF7;   /* Off White Cream      */
    --color-bg-alt:        #FDF3DC;   /* Light Honey          */
    --color-surface:       #FFFFFF;
    --color-text:          #2C1810;   /* Deep Warm Brown      */
    --color-text-muted:    #7A5C4A;   /* Medium Brown         */
    --color-text-light:    #A67C52;   /* Light Brown          */
    --color-border:        #E8D5B0;   /* Warm Border          */
    --color-hero-overlay:  rgba(10, 6, 2, 0.18);
    --color-nav-bg:        rgba(255, 253, 247, 0.96);
    --color-cta:           #B8860B;
    --color-cta-hover:     #8B6508;
    --gradient-hero:       linear-gradient(135deg, rgba(184,134,11,0.15) 0%, rgba(139,69,19,0.10) 100%);
    --gradient-section:    linear-gradient(180deg, #FFFDF7 0%, #FDF3DC 100%);
    --shadow-card:         0 8px 40px rgba(184, 134, 11, 0.12);
    --shadow-hover:        0 16px 60px rgba(184, 134, 11, 0.22);
    --theme-name:          "Warm Gold";
}

/* ── Theme 2: Deep Teal & Pearl ───────────────────────────── */
[data-theme="teal"] {
    --color-primary:       #1B6B6B;   /* Deep Teal            */
    --color-primary-light: #2A9090;   /* Medium Teal          */
    --color-primary-pale:  #EBF7F7;   /* Pale Teal            */
    --color-accent:        #C17F3A;   /* Warm Amber           */
    --color-accent-soft:   #E8C48A;   /* Light Amber          */
    --color-bg:            #F8FEFE;   /* Near White Teal Tint */
    --color-bg-alt:        #E6F3F3;   /* Light Teal           */
    --color-surface:       #FFFFFF;
    --color-text:          #0D3535;   /* Deep Teal Text       */
    --color-text-muted:    #3D6B6B;   /* Medium Teal          */
    --color-text-light:    #6A9E9E;   /* Light Teal           */
    --color-border:        #B8DEDE;   /* Teal Border          */
    --color-hero-overlay:  rgba(2, 10, 10, 0.18);
    --color-nav-bg:        rgba(248, 254, 254, 0.96);
    --color-cta:           #1B6B6B;
    --color-cta-hover:     #124848;
    --gradient-hero:       linear-gradient(135deg, rgba(27,107,107,0.15) 0%, rgba(193,127,58,0.10) 100%);
    --gradient-section:    linear-gradient(180deg, #F8FEFE 0%, #E6F3F3 100%);
    --shadow-card:         0 8px 40px rgba(27, 107, 107, 0.12);
    --shadow-hover:        0 16px 60px rgba(27, 107, 107, 0.22);
    --theme-name:          "Serene Teal";
}

/* ── Theme 3: Soft Rose & Ivory ───────────────────────────── */
[data-theme="rose"] {
    --color-primary:       #A0435A;   /* Deep Rose            */
    --color-primary-light: #C4617A;   /* Medium Rose          */
    --color-primary-pale:  #FFF0F3;   /* Blush                */
    --color-accent:        #7B5EA0;   /* Soft Mauve           */
    --color-accent-soft:   #C4B0D8;   /* Light Mauve          */
    --color-bg:            #FFFBFC;   /* Ivory                */
    --color-bg-alt:        #FDE8EE;   /* Light Blush          */
    --color-surface:       #FFFFFF;
    --color-text:          #2D0F18;   /* Deep Rose Text       */
    --color-text-muted:    #7A3A4A;   /* Medium Rose          */
    --color-text-light:    #A07080;   /* Light Rose           */
    --color-border:        #F0C8D0;   /* Rose Border          */
    --color-hero-overlay:  rgba(12, 2, 5, 0.18);
    --color-nav-bg:        rgba(255, 251, 252, 0.96);
    --color-cta:           #A0435A;
    --color-cta-hover:     #7A2E40;
    --gradient-hero:       linear-gradient(135deg, rgba(160,67,90,0.15) 0%, rgba(123,94,160,0.10) 100%);
    --gradient-section:    linear-gradient(180deg, #FFFBFC 0%, #FDE8EE 100%);
    --shadow-card:         0 8px 40px rgba(160, 67, 90, 0.12);
    --shadow-hover:        0 16px 60px rgba(160, 67, 90, 0.22);
    --theme-name:          "Soft Rose";
}

/* ── Theme 4: Navy & Silver ───────────────────────────────── */
[data-theme="navy"] {
    --color-primary:       #1A2E5C;   /* Deep Navy            */
    --color-primary-light: #2A4A8C;   /* Medium Navy          */
    --color-primary-pale:  #EEF2FA;   /* Pale Blue            */
    --color-accent:        #C0922A;   /* Antique Gold         */
    --color-accent-soft:   #E8D08A;   /* Light Gold           */
    --color-bg:            #F8F9FC;   /* Near White Blue      */
    --color-bg-alt:        #E8EDFA;   /* Light Lavender Blue  */
    --color-surface:       #FFFFFF;
    --color-text:          #0A1628;   /* Deep Navy Text       */
    --color-text-muted:    #3A5080;   /* Medium Navy          */
    --color-text-light:    #6A85B8;   /* Light Navy           */
    --color-border:        #C0CCE8;   /* Navy Border          */
    --color-hero-overlay:  rgba(2, 4, 12, 0.20);
    --color-nav-bg:        rgba(248, 249, 252, 0.96);
    --color-cta:           #1A2E5C;
    --color-cta-hover:     #0E1C3C;
    --gradient-hero:       linear-gradient(135deg, rgba(26,46,92,0.15) 0%, rgba(192,146,42,0.10) 100%);
    --gradient-section:    linear-gradient(180deg, #F8F9FC 0%, #E8EDFA 100%);
    --shadow-card:         0 8px 40px rgba(26, 46, 92, 0.12);
    --shadow-hover:        0 16px 60px rgba(26, 46, 92, 0.22);
    --theme-name:          "Royal Navy";
}

/* ── Theme 5: Sage & Linen ────────────────────────────────── */
[data-theme="sage"] {
    --color-primary:       #4A7A5C;   /* Deep Sage            */
    --color-primary-light: #6A9E7A;   /* Medium Sage          */
    --color-primary-pale:  #EDF5EF;   /* Pale Sage            */
    --color-accent:        #8B6A3E;   /* Warm Earth           */
    --color-accent-soft:   #C4A87A;   /* Light Earth          */
    --color-bg:            #FAFDF9;   /* Linen White          */
    --color-bg-alt:        #E8F2EB;   /* Light Sage           */
    --color-surface:       #FFFFFF;
    --color-text:          #152215;   /* Deep Forest          */
    --color-text-muted:    #3D6A4A;   /* Medium Forest        */
    --color-text-light:    #7A9E80;   /* Light Sage           */
    --color-border:        #B8D8C0;   /* Sage Border          */
    --color-hero-overlay:  rgba(3, 9, 3, 0.18);
    --color-nav-bg:        rgba(250, 253, 249, 0.96);
    --color-cta:           #4A7A5C;
    --color-cta-hover:     #305040;
    --gradient-hero:       linear-gradient(135deg, rgba(74,122,92,0.15) 0%, rgba(139,106,62,0.10) 100%);
    --gradient-section:    linear-gradient(180deg, #FAFDF9 0%, #E8F2EB 100%);
    --shadow-card:         0 8px 40px rgba(74, 122, 92, 0.12);
    --shadow-hover:        0 16px 60px rgba(74, 122, 92, 0.22);
    --theme-name:          "Sage & Linen";
}