/* Theme Toggle Styles */
.theme-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    background: #e2e8f0;
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
}

.theme-toggle:hover {
    transform: scale(1.1);
}

.theme-toggle i {
    font-size: 1.5rem;
    color: #2d3748;
    transition: all 0.3s ease;
}

/* Dark Theme Styles */
body.dark-theme {
    background: #1a202c;
    color: #e2e8f0;
}

.dark-theme .container {
    background: #2d3748;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.dark-theme .card {
    background: #2d3748;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
}

.dark-theme .card:hover {
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
}

.dark-theme h1, 
.dark-theme h2,
.dark-theme h3 {
    color: #90cdf4;
}

.dark-theme h4 {
    color: #e2e8f0;
}

.dark-theme p, 
.dark-theme td,
.dark-theme ul li {
    color: #cbd5e0;
}

.dark-theme .summary-card {
    background: #4a5568;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.dark-theme .tab-btn,
.dark-theme .sub-tab-btn {
    background: #4a5568;
    color: #90cdf4;
}

.dark-theme .tab-btn:hover, 
.dark-theme .tab-btn.active,
.dark-theme .sub-tab-btn:hover, 
.dark-theme .sub-tab-btn.active {
    background: #2b6cb0;
    color: #fff;
}

.dark-theme table {
    background: #4a5568;
}

.dark-theme th {
    background: #2b6cb0;
}

.dark-theme td {
    border-bottom: 1px solid #4a5568;
}

.dark-theme .scenario-section {
    background: #2d3748;
}

.dark-theme .main-nav {
    background: #2d3748;
}

.dark-theme .nav-links ul li a {
    color: #e2e8f0;
}

.dark-theme .nav-links ul li a:hover,
.dark-theme .nav-links ul li a.active {
    color: #90cdf4;
}

.dark-theme .footer {
    color: #cbd5e0;
}

.dark-theme a {
    color: #90cdf4;
}

.dark-theme .chart-container,
.dark-theme .summary-card {
    background: #4a5568;
}

.dark-theme .theme-toggle {
    background: #4a5568;
}

.dark-theme .theme-toggle i {
    color: #e2e8f0;
}

/* Transition for smooth theme switching */
body, .container, .card, h1, h2, h3, h4, p, td, 
.summary-card, .tab-btn, .sub-tab-btn, table, 
th, td, .scenario-section, .main-nav, 
.nav-links ul li a, .footer, a, .chart-container {
    transition: all 0.3s ease;
}

/* Dark mode adjustments */
:root.dark-mode {
    --bg-color: #121212;
    --text-color: #f0f0f0;
    --card-bg: #1e1e1e;
    --border-color: #333;
}

/* General dark mode styles */
.dark-mode body {
    background-color: var(--bg-color);
    color: var(--text-color);
}

.dark-mode .card, 
.dark-mode .data-card,
.dark-mode .summary-card,
.dark-mode .scenario-card,
.dark-mode .tab-content,
.dark-mode .funding-phase,
.dark-mode .bg-white,
.dark-mode .bg-gray-50,
.dark-mode [class*="bg-gradient-to-br from-white"] {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

/* Fix text colors in dark mode */
.dark-mode .text-gray-500,
.dark-mode .text-gray-600,
.dark-mode .text-gray-700,
.dark-mode .text-sm,
.dark-mode p,
.dark-mode h3,
.dark-mode h4,
.dark-mode h5,
.dark-mode .team-member,
.dark-mode .font-semibold,
.dark-mode th,
.dark-mode td,
.dark-mode li {
    color: var(--text-color) !important;
}

/* Keep theme-colored text readable but maintain their hue */
.dark-mode .text-red-500,
.dark-mode .text-red-700,
.dark-mode .text-yellow-500,
.dark-mode .text-yellow-600,
.dark-mode .text-yellow-700,
.dark-mode .text-green-500,
.dark-mode .text-green-600,
.dark-mode .text-green-700,
.dark-mode .text-blue-500,
.dark-mode .text-blue-600,
.dark-mode .text-blue-700 {
    filter: brightness(1.35) !important;
}

/* Fix background colors for scenario items */
.dark-mode .pessimist-bg,
.dark-mode .realist-bg,
.dark-mode .optimist-bg,
.dark-mode .team-core,
.dark-mode .team-design,
.dark-mode .team-product,
.dark-mode .team-gtm,
.dark-mode .risk-item,
.dark-mode .success-item {
    background-color: rgba(50, 50, 50, 0.3) !important;
    color: var(--text-color) !important;
}

/* Improve buttons and interactive elements */
.dark-mode .tab-btn,
.dark-mode .sub-tab-btn {
    background-color: #333 !important;
    color: var(--text-color) !important;
}

.dark-mode .tab-btn.active,
.dark-mode .sub-tab-btn.active {
    background-color: #0066cc !important;
    color: white !important;
}

/* Chart adjustments */
.dark-mode canvas {
    filter: brightness(0.85) contrast(1.1);
}

/* Handle colored backgrounds */
.dark-mode .bg-red-50, 
.dark-mode .bg-red-100,
.dark-mode .bg-yellow-50, 
.dark-mode .bg-yellow-100,
.dark-mode .bg-green-50, 
.dark-mode .bg-green-100,
.dark-mode .bg-blue-50, 
.dark-mode .bg-blue-100 {
    background-color: rgba(50, 50, 50, 0.5) !important;
}

/* Styles for scenario explanation section in dark mode */
.dark-mode .bg-blue-50 {
    background-color: #1e2a3a !important;
}

.dark-mode .bg-blue-50 h2.text-blue-700,
.dark-mode .bg-blue-50 h4.text-blue-700 {
    color: #90caf9 !important;
}

.dark-mode .bg-blue-50 p,
.dark-mode .bg-blue-50 ul,
.dark-mode .bg-blue-50 li {
    color: #e0e0e0 !important;
}

.dark-mode .bg-blue-50 strong {
    color: #fff !important;
}

.dark-mode .bg-white {
    background-color: #2d3748 !important;
}

.dark-mode .border-red-500 {
    border-color: #f56565 !important;
}

.dark-mode .border-yellow-500 {
    border-color: #ecc94b !important;
}

.dark-mode .border-green-500 {
    border-color: #48bb78 !important;
}

.dark-mode .bg-yellow-100 {
    background-color: rgba(236, 201, 75, 0.2) !important;
    color: #fff !important;
}

.dark-mode .text-red-600,
.dark-mode .text-yellow-600,
.dark-mode .text-green-600 {
    filter: brightness(1.4) !important;
}