/**
 * Shared Theme Variables & Base Styles
 * Go Nature - Centralized CSS for all pages
 */

/* Base font */
body {
    font-family: 'Manrope', sans-serif;
}

/* Default Green Theme */
:root {
    --primary-color: #11d462;
    --forest-color: #ffffff;
    --text-color: #ffffff;
    --sage-color: #e8f5ed;
    --cream-color: #11d462;
    --background-light-color: #11d462;
    --background-dark-color: #102218;
    --cream-color-rgb: 17, 212, 98;
}

/* Blue Theme */
.theme-blue {
    --primary-color: #3b82f6;
    --forest-color: #ffffff;
    --text-color: #ffffff;
    --sage-color: #1e3050;
    --cream-color: #1e40af;
    --background-light-color: #1e40af;
    --background-dark-color: #081230;
    --cream-color-rgb: 30, 64, 175;
}

/* White Theme */
.theme-white {
    --primary-color: #059669;
    --forest-color: #000000;
    --text-color: #000000;
    --sage-color: #f0fdf4;
    --cream-color: #ffffff;
    --background-light-color: #ffffff;
    --background-dark-color: #f8fafc;
    --cream-color-rgb: 255, 255, 255;
}

/* Light backgrounds: dark text */
.bg-white,
.bg-white *,
.bg-green-50,
.bg-green-50 *,
.bg-slate-50,
.bg-slate-50 *,
.bg-blue-50,
.bg-blue-50 *,
.bg-yellow-50,
.bg-yellow-50 *,
.bg-orange-50,
.bg-orange-50 *,
.bg-red-50,
.bg-red-50 *,
.bg-pink-50,
.bg-pink-50 *,
.bg-purple-50,
.bg-purple-50 * {
    color: #0d1b13;
}

/* Theme-responsive backgrounds */
.bg-cream,
.bg-cream *,
.bg-sage,
.bg-sage * {
    color: var(--text-color, #0d1b13);
}

/* Blue theme: white text on dark backgrounds */
.theme-blue .bg-cream,
.theme-blue .bg-cream *,
.theme-blue .bg-sage,
.theme-blue .bg-sage * {
    color: #e0eaff;
}

.theme-blue .bg-white,
.theme-blue .bg-white * {
    color: #0c1a35;
}

/* Glass Navigation */
.glass-nav {
    background: rgba(var(--cream-color-rgb), 0.8);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Material Symbols */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}