/* public/css/variables.css */
:root {
    /* Remove all bg-primary, bg-secondary, bg-tertiary that might be applied to body */
    --bg-primary: transparent;
    --bg-secondary: #1a1a2e;
    --bg-tertiary: #16213e;
    --bg-gradient-start: #0a0a0a;
    --bg-gradient-mid: #1a1a2e;
    --bg-gradient-end: #16213e;
    --text-primary: #ffffff;
    --text-secondary: #b0b0b0;
    --text-muted: #888;
    --text-gradient-hero-start: #ffffff;
    --text-gradient-hero-mid: #667eea;
    --text-gradient-hero-end: #764ba2;
    --text-gradient-header-start: #ffffff;
    --text-gradient-header-end: #667eea;
    --accent-primary: #667eea;
    --accent-secondary: #764ba2;
    --accent-gradient-start: #667eea;
    --accent-gradient-end: #764ba2;
    --border-color: rgba(255, 255, 255, 0.1);
    --card-bg: rgba(255, 255, 255, 0.05);
    --card-border: rgba(255, 255, 255, 0.1);
    --card-hover-border: rgba(102, 126, 234, 0.3);
    --card-hover-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    --modal-bg: linear-gradient(135deg, rgba(26, 26, 46, 0.95), rgba(22, 33, 62, 0.95));
    --modal-border: rgba(255, 255, 255, 0.2);
    --input-bg: rgba(255, 255, 255, 0.1);
    --input-border: rgba(255, 255, 255, 0.2);
    --input-focus-border: #667eea;
    --input-focus-shadow: rgba(102, 126, 234, 0.3);
    --input-placeholder-color: #888;
    --input-select-bg: #1a1a2e;
    --header-bg: rgba(10, 10, 10, 0.8);
    --header-bg-scrolled: rgba(10, 10, 10, 0.95);
    --footer-bg: rgba(0, 0, 0, 0.5);
    --footer-text: #666;
    --success-bg: rgba(72, 187, 120, 0.2);
    --success-border: rgba(72, 187, 120, 0.5);
    --success-text: #68d391;
    --error-text: #ff6b6b;
    --animated-bg-particle1: rgba(120, 119, 198, 0.3);
    --animated-bg-particle2: rgba(255, 119, 198, 0.3);
    --animated-bg-particle3: rgba(120, 219, 255, 0.2);
    --product-card-bg: linear-gradient(135deg, rgba(102, 126, 234, 0.1), rgba(118, 75, 162, 0.1));
    --cta-section-bg: linear-gradient(135deg, rgba(102, 126, 234, 0.1), rgba(118, 75, 162, 0.1));
    --about-section-bg: rgba(255, 255, 255, 0.02);
    --logo-svg-main-stop1: #667eea;
    --logo-svg-main-stop2: #764ba2;
    --logo-svg-main-stop3: #ff6b9d;
    --logo-svg-accent-stop1: #00d4ff;
    --logo-svg-accent-stop2: #667eea;
    --btn-secondary-border: rgba(255, 255, 255, 0.3);
    --btn-secondary-text: #ffffff;
    --btn-secondary-hover-bg: rgba(255, 255, 255, 0.1);
    --btn-secondary-hover-border: #667eea;
    --stat-item-bg: rgba(255, 255, 255, 0.05);
    --stat-item-border: rgba(255, 255, 255, 0.1);
    --founder-domain-bg: rgba(102, 126, 234, 0.2);
    --founder-domain-text: #667eea;
    --product-icon-bg: #f3f4f6;
    --product-icon-stroke: #667eea;
    --product-icon-fill: #667eea;
    --product-feature-note-text: #888;
    --dynamic-card-hover-bg-start: rgba(102, 126, 234, 0.15);
    --dynamic-card-hover-bg-end: rgba(255, 255, 255, 0.05);
    --theme-button-bg: var(--card-bg);
    --theme-button-color: var(--accent-primary);
    --theme-button-border: var(--border-color);
    --theme-button-hover-bg: var(--accent-primary);
    --theme-button-hover-color: var(--bg-primary);
    --theme-option-bg: var(--bg-secondary);
    --theme-option-active-bg: var(--accent-primary);
    --theme-option-active-color: var(--bg-primary);
    --chat-window-bg: var(--bg-secondary);
    --chat-header-bg: var(--bg-tertiary);
    --chat-messages-bg: var(--bg-secondary);
    --chat-input-area-bg: var(--bg-tertiary);
    --chat-input-field-bg: var(--input-bg);
    --chat-input-field-border: var(--input-border);
    --chat-input-field-focus-border: var(--input-focus-border);
    --chat-input-field-focus-shadow: var(--input-focus-shadow);
    --chat-text-primary: var(--text-primary);
    --chat-text-secondary: var(--text-secondary);
    --chat-user-msg-bg: var(--accent-primary);
    --chat-user-msg-text: #ffffff;
    --chat-bot-msg-bg: var(--card-bg);
    --chat-bot-msg-text: var(--text-primary);
    --chat-icon-bg: var(--accent-primary);
    --chat-icon-color: #ffffff;
    --chat-close-btn-color: var(--text-secondary);
    --chat-close-btn-hover-color: var(--text-primary);
    --chat-send-btn-bg: var(--accent-primary);
    --chat-send-btn-hover-bg: var(--accent-secondary);
    --chat-send-btn-icon-color: #ffffff;
    --chat-send-btn-disabled-bg: var(--text-muted);
    --theme-button-bg: rgba(255, 255, 255, 0.1);
    --theme-button-color: var(--accent-primary);
    --theme-button-border: rgba(255, 255, 255, 0.2);
    --theme-button-hover-bg: var(--accent-primary);
    --theme-button-hover-color: #ffffff;
    --theme-option-bg: rgba(26, 26, 46, 0.9);
    --theme-option-active-bg: var(--accent-primary);
    --theme-option-active-color: #ffffff;
    --mobile-nav-bg: #1a1a2e;
    --mobile-nav-bg: #1a1a2e;
    --mobile-nav-border: rgba(102, 126, 234, 0.2);
    --mobile-nav-shadow: rgba(0, 0, 0, 0.4);
    --mobile-nav-gradient: linear-gradient(135deg, rgba(26, 26, 46, 1) 0%, rgba(22, 33, 62, 0.95) 100%);
    --mobile-nav-link-bg: rgba(255, 255, 255, 0.05);
    --mobile-nav-link-border: rgba(255, 255, 255, 0.1);
    --mobile-nav-link-hover-shadow: rgba(102, 126, 234, 0.3);
    --mobile-nav-overlay: rgba(0, 0, 0, 0.7);
}

[data-theme="light"] {
    --bg-primary: transparent;
    --bg-secondary: #ffffff;
    --bg-tertiary: #e9ecef;
    --bg-gradient-start: #e9ecef;
    --bg-gradient-mid: #f8f9fa;
    --bg-gradient-end: #ffffff;
    --text-primary: #212529;
    --text-secondary: #495057;
    --text-muted: #6c757d;
    --text-gradient-hero-start: #212529;
    --text-gradient-hero-mid: #4A00E0;
    --text-gradient-hero-end: #8E2DE2;
    --text-gradient-header-start: #212529;
    --text-gradient-header-end: #4A00E0;
    --accent-primary: #4A00E0;
    --accent-secondary: #8E2DE2;
    --accent-gradient-start: #4A00E0;
    --accent-gradient-end: #8E2DE2;
    --border-color: rgba(0, 0, 0, 0.1);
    --card-bg: #ffffff;
    --card-border: rgba(0, 0, 0, 0.08);
    --card-hover-border: rgba(74, 0, 224, 0.3);
    --card-hover-shadow: 0 15px 45px rgba(0, 0, 0, 0.1);
    --modal-bg: linear-gradient(135deg, rgba(248, 249, 250, 0.98), rgba(233, 236, 239, 0.98));
    --modal-border: rgba(0, 0, 0, 0.15);
    --input-bg: #ffffff;
    --input-border: rgba(0, 0, 0, 0.2);
    --input-focus-border: #4A00E0;
    --input-focus-shadow: rgba(74, 0, 224, 0.2);
    --input-placeholder-color: #6c757d;
    --input-select-bg: #f8f9fa;
    --header-bg: rgba(248, 249, 250, 0.85);
    --header-bg-scrolled: rgba(248, 249, 250, 0.95);
    --footer-bg: #f1f3f5;
    --footer-text: #555;
    --success-bg: rgba(40, 167, 69, 0.15);
    --success-border: rgba(40, 167, 69, 0.4);
    --success-text: #28a745;
    --error-text: #dc3545;
    --animated-bg-particle1: rgba(74, 0, 224, 0.15);
    --animated-bg-particle2: rgba(142, 45, 226, 0.15);
    --animated-bg-particle3: rgba(0, 123, 255, 0.1);
    --product-card-bg: linear-gradient(135deg, rgba(74, 0, 224, 0.05), rgba(142, 45, 226, 0.05));
    --cta-section-bg: linear-gradient(135deg, rgba(74, 0, 224, 0.05), rgba(142, 45, 226, 0.05));
    --about-section-bg: rgba(0, 0, 0, 0.01);
    --logo-svg-main-stop1: #4A00E0;
    --logo-svg-main-stop2: #8E2DE2;
    --logo-svg-main-stop3: #c966ff;
    --logo-svg-accent-stop1: #007bff;
    --logo-svg-accent-stop2: #4A00E0;
    --btn-secondary-border: rgba(0, 0, 0, 0.2);
    --btn-secondary-text: var(--text-primary);
    --btn-secondary-hover-bg: rgba(0, 0, 0, 0.05);
    --btn-secondary-hover-border: #4A00E0;
    --stat-item-bg: #f8f9fa;
    --stat-item-border: rgba(0, 0, 0, 0.08);
    --founder-domain-bg: rgba(74, 0, 224, 0.1);
    --founder-domain-text: #4A00E0;
    --product-icon-bg: #e9ecef;
    --product-icon-stroke: #4A00E0;
    --product-icon-fill: #4A00E0;
    --product-feature-note-text: #6c757d;
    --dynamic-card-hover-bg-start: rgba(74, 0, 224, 0.08);
    --dynamic-card-hover-bg-end: rgba(0, 0, 0, 0.03);
    --theme-button-bg: var(--card-bg);
    --theme-button-color: var(--accent-primary);
    --theme-button-border: var(--border-color);
    --theme-button-hover-bg: var(--accent-primary);
    --theme-button-hover-color: var(--bg-primary);
    --theme-option-bg: var(--bg-secondary);
    --theme-option-active-bg: var(--accent-primary);
    --theme-option-active-color: var(--bg-secondary);
    --chat-window-bg: #ffffff;
    --chat-header-bg: #f1f3f5;
    --chat-messages-bg: #ffffff;
    --chat-input-area-bg: #f1f3f5;
    --chat-input-field-bg: #f8f9fa;
    --chat-input-field-border: rgba(0, 0, 0, 0.15);
    --chat-bot-msg-bg: #e9ecef;
    --chat-bot-msg-text: var(--text-primary);
    --theme-button-bg: rgba(255, 255, 255, 0.9);
    --theme-button-color: var(--accent-primary);
    --theme-button-border: rgba(0, 0, 0, 0.1);
    --theme-button-hover-bg: var(--accent-primary);
    --theme-button-hover-color: #ffffff;
    --theme-option-bg: rgba(248, 249, 250, 0.95);
    --theme-option-active-bg: var(--accent-primary);
    --theme-option-active-color: #ffffff;
    --mobile-nav-bg: #ffffff;
    --mobile-nav-bg: #ffffff;
    --mobile-nav-border: rgba(74, 0, 224, 0.15);
    --mobile-nav-shadow: rgba(0, 0, 0, 0.15);
    --mobile-nav-gradient: linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(248, 249, 250, 0.98) 100%);
    --mobile-nav-link-bg: rgba(0, 0, 0, 0.02);
    --mobile-nav-link-border: rgba(0, 0, 0, 0.08);
    --mobile-nav-link-hover-shadow: rgba(74, 0, 224, 0.2);
    --mobile-nav-overlay: rgba(0, 0, 0, 0.5);
}