/* Professional Modern Color Scheme */
:root {
    /* Modern color palette */
    --primary-color: #84B261;       /* Deep Blue */
    --secondary-color: #708F58;     /* Forest Green */
    --accent-color: #6366F1;        /* Indigo */
    --light-color: #FFFFFF;         /* Pure White */
    --dark-color: #1F2937;          /* Deep Charcoal */
    --text-color: #4B5563;          /* Medium Gray */
    --background-color: #FFFFFF;    /* White Background */
    --card-background: #FFFFFF;
    
    /* Simplified gradients */
    --header-gradient: linear-gradient(to bottom, #F8F9FA, #FFFFFF);
    --footer-gradient: linear-gradient(to right, #1F2937, #84B261);
    --nav-gradient: var(--primary-color);  /* Solid color instead of gradient */
    
    --header-text-color: #1F2937;
    --footer-text-color: #ffffff;
    --font-family: 'Nunito', 'Avenir Next', 'Segoe UI', sans-serif;
    --link-color: var(--primary-color);
    
    /* Additional modern variables */
    --border-radius-sm: 8px;
    --border-radius-md: 12px;
    --border-radius-lg: 16px;
    --box-shadow: 0 10px 25px rgba(0, 0, 0, 0.03);
    --box-shadow-hover: 0 15px 35px rgba(0, 0, 0, 0.06);
    --transition: all 0.3s ease;

    --question-toggle-bg: rgba(132, 178, 97, 0.15);
    --question-toggle-bg-hover: rgba(132, 178, 97, 0.28);
    --question-toggle-icon-color: var(--secondary-color);

}

/* Button hover states */
.primary-btn:hover {
    background-color: #56743f; /* Darker blue */
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(45, 95, 139, 0.3);
}

.secondary-btn:hover {
    background-color: #3a4a01; /* Darker green */
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(94, 140, 97, 0.3);
}

.accent-btn:hover {
    background-color: #4F46E5; /* Darker indigo */
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.3);
}

/* Progress bar colors */
.progress-bar[style*="background-color: #93c5fd"] {
    background-color: #bdcab4 !important; /* Lighter blue */
}

.progress-bar[style*="background-color: #60a5fa"] {
    background-color: #b2c8a0 !important; /* Light blue */
}

.progress-bar[style*="background-color: #3b82f6"] {
    background-color: #a5cb86 !important; /* Medium blue */
}

.progress-bar[style*="background-color: #2563eb"] {
    background-color: var(--primary-color) !important; /* Main blue */
}

/* Indigo progress bars */
.progress-bar[style*="background-color: #fdba74"] {
    background-color: rgb(190, 225, 164) !important; /* Lighter indigo */
}

.progress-bar[style*="background-color: #fb923c"] {
    background-color: #9fc481 !important; /* Light indigo */
}

.progress-bar[style*="background-color: #f97316"] {
    background-color: #8aaa70 !important; /* Medium indigo */
}

.progress-bar[style*="background-color: #ea580c"] {
    background-color: #799562 !important; /* Dark indigo */
}

/* Additional crisp theme adjustments */
.abstract, .research-question, .figure-container, .card .pivot-box {
    background-color: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.03);
}

/* Add subtle borders for definition with white background */
.scaling-card, .resources-card, .result-card {
    border: 1px solid rgba(0, 0, 0, 0.04);
}

/* Subtle highlight for figure sections */
.figure-section {
    background-color: #F9FAFB;
    padding: 40px 0;
    margin: 60px 0;
    border-radius: var(--border-radius-lg);
}

/* Add subtle hover effect for buttons */
.btn {
    border: 1px solid transparent;
}

.btn:hover {
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.gradient-figure {
    background: linear-gradient(135deg, #f9fafc, #e9edf3);
    border: 1px solid rgba(0, 0, 0, 0.04);
}