/* === GAYBORHOOD COLOR SYSTEM === */

/* Base transition for theme switching */
* {
    transition: background-color 0.4s ease, 
                color 0.4s ease, 
                border-color 0.4s ease, 
                box-shadow 0.4s ease;
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
    * {
        transition-duration: 0.01ms !important;
    }
}

/* === DARK THEME: THE VAULT ATMOSPHERE === */

[data-theme="dark"] {
    /* Base colors from your Memberlite theme */
    --bg-color: #0b0b11;
    --accent-bg: #0f0f1a;
    --card-bg: #141420;
    
    /* NOT pure white - warm off-white for comfort */
    --text-color: #e8e4e0;           /* Warm silver */
    --text-muted: #a098a0;           /* Muted mauve */
    --text-heading: #f5f0e8;         /* Soft ivory */
    
    /* Accents: Neochrome (Purple, Pink, Gold) */
    --card-color: #2a2030;
    --link-color: #c9a0dc;           /* Soft lavender */
    --link-hover: #f4a460;           /* Sandy peach */
    --accent-primary: #b8860b;        /* Dark Goldenrod */
    --accent-secondary: #00ced1;
    --accent-tertiary: #8a2be2;
    
    /* Borders */
    --border-color: #2a2a3a;
    --border-accent: #3a3a4a;
    
    /* Shadows */
    --shadow: rgba(0, 0, 0, 0.5);
    --shadow-lg: rgba(138, 43, 226, 0.2);
    
    --pmpro--color--contrast: var(--text-color) !important;
}

/* Deep radial gradient base */
[data-theme="dark"] body {
    background: radial-gradient(circle at 50% 50%, #1a1a2e 0%, #050507 100%);
    background-attachment: fixed;
}

/* The Vault shimmer overlay */
[data-theme="dark"] body::before {
    content: "";
    position: fixed;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    background: linear-gradient(
        45deg,
        rgba(75, 0, 130, 0.15) 0%,      /* Indigo */
        rgba(0, 0, 128, 0.12) 25%,      /* Navy blue */
        rgba(184, 134, 11, 0.1) 50%,    /* Dark goldenrod */
        rgba(75, 0, 130, 0.15) 75%,     /* Back to indigo */
        rgba(0, 0, 0, 0) 100%
    );
    background-size: 400% 400%;
    animation: vaultShimmer 15s ease infinite;
    pointer-events: none;
    z-index: -1;
}

@keyframes vaultShimmer {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Neochrome gradient text for buttons/headings */
[data-theme="dark"] .neochrome,
[data-theme="dark"] .button {
    background: linear-gradient(135deg, #8a2be2 0%, #00ced1 50%, #b8860b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    font-weight: 700;
}

[data-theme="dark"] .neochrome:hover,
[data-theme="dark"] .button:hover {
    filter: drop-shadow(0 0 10px rgba(138, 43, 226, 0.6));
}


/* === LIGHT THEME: PEARLESCENT UNICORN === */

[data-theme="light"] {
    /* Base: Soft pearl whites and blushes */
    --bg-color: #faf8f5;              /* Warm pearl */
    --accent-bg: #f5f0f8;             /* Soft lavender mist */
    --card-bg: #ffffff;               /* Pure white */
    
    /* NOT pure black - soft charcoal */
    --text-color: #3a3040;           /* Warm charcoal */
    --text-muted: #6b6070;           /* Muted purple-gray */
    --text-heading: #2a2030;         /* Deep plum */
    
    /* Accents: Unicorn pastels */
    --link-color: #7b4397;           /* Muted purple */
    --link-hover: #c73e88;           /* Raspberry */
    --accent-primary: #ff6b9d;        /* Rose pink */
    --accent-secondary: #4ecdc4;      /* Mint */
    --accent-tertiary: #ffe66d;       /* Soft gold */
    --accent-quaternary: #a8d8ea;     /* Sky blue */
    
    /* Borders: Soft pearlescent */
    --border-color: #e8e0e8;          /* Lavender gray */
    --border-accent: #d4c8d4;         /* Dusty mauve */
    
    /* Shadows: Soft purple tint */
    --shadow: rgba(61, 43, 79, 0.06);
    --shadow-lg: rgba(157, 78, 221, 0.12);
}

/* Pearlescent base - soft radial glow */
[data-theme="light"] body {
    background: radial-gradient(
        circle at 50% 50%, 
        #ffffff 0%, 
        #faf5f8 50%, 
        #f5f0f5 100%
    );
    background-attachment: fixed;
}

/* === LIGHT THEME: PEARLESCENT UNICORN (Revised) === */

[data-theme="light"] body::before {
    content: "";
    position: fixed;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    background: linear-gradient(
        60deg,
        rgba(255, 182, 193, 0.35) 0%,       /* Pink - 35% opacity */
        rgba(255, 182, 193, 0.35) 15%,     /* Pink band (wide) */
        rgba(173, 216, 230, 0.3) 30%,      /* Sky blue - 30% */
        rgba(173, 216, 230, 0.3) 45%,      /* Blue band (wide) */
        rgba(152, 251, 152, 0.35) 60%,     /* Mint - 35% */
        rgba(152, 251, 152, 0.35) 75%,     /* Mint band (wide) */
        rgba(255, 223, 186, 0.3) 85%,      /* Peach gold - 30% */
        rgba(255, 182, 193, 0.35) 100%     /* Back to pink */
    );
    background-size: 300% 300%;            /* Larger pattern = bigger bands */
    animation: unicornShimmer 25s ease infinite;  /* Slower */
    pointer-events: none;
    z-index: -1;
}

@keyframes unicornShimmer {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Pearlescent text effect - soft iridescent */
[data-theme="light"] .neochrome,
[data-theme="light"] .button {
    background: linear-gradient(
        #135deg, 
        #ff6b9d 0%,      /* Rose */
        #9d4edd 33%,     /* Lavender */
        #4ecdc4 66%,     /* Mint */
        #ffe66d 100%     /* Soft gold */
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    font-weight: 700;
}

[data-theme="light"] .neochrome:hover,
[data-theme="light"] .button:hover {
    filter: drop-shadow(0 0 8px rgba(255, 107, 157, 0.4));
}
/* Force PMPro elements to use your theme's text and background colors */
.pmpro, .pmpro_confirmation, .pmpro_card, .pmpro_card_content, .pmpro_actions_nav, .pmpro_list, .pmpro_list_item {
    color: var(--text-color) !important;
}

.pmpro_card_title, 
.pmpro_card_content, 
.pmpro_list_item, .pmpro_card input {
    color: var(--card-color) !important;
}