/* ===== COMING SOON MODE OVERRIDES ===== */
/* This file contains temporary overrides for coming soon mode */
/* To revert: Simply remove the link to this CSS file from HTML */

/* ===== MATERIAL DESIGN THEME TOGGLE ===== */
.theme-toggle {
    position: fixed !important;
    bottom: 24px !important;
    right: 24px !important;
    z-index: 999 !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow: hidden !important;
}

.theme-toggle:hover {
    box-shadow: 0 5px 11px rgba(0, 0, 0, 0.18), 0 4px 15px rgba(0, 0, 0, 0.15) !important;
}

.theme-toggle:active {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important;
}

/* Icon styling - using existing span element, not ::before */
.theme-toggle .material-icons {
    font-size: 24px !important;
    color: #424242 !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Dark mode styles */
body[data-theme="dark"] .theme-toggle {
    background: #37474F !important;
}

body[data-theme="dark"] .theme-toggle .material-icons {
    color: #FFC107 !important;
}

/* Ripple effect container */
.theme-toggle::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 0 !important;
    height: 0 !important;
    border-radius: 50% !important;
    background: rgba(0, 0, 0, 0.12) !important;
    transform: translate(-50%, -50%) !important;
    transition: width 0.5s, height 0.5s !important;
}

body[data-theme="dark"] .theme-toggle::after {
    background: rgba(255, 193, 7, 0.3) !important;
}

.theme-toggle:active::after {
    width: 100% !important;
    height: 100% !important;
}

/* ===== COMPLETELY HIDE SECTIONS ===== */
/* Hide entire download section */
#download,
.download {
    display: none !important;
}

/* Keep hero buttons visible but modify their behavior */
.hero-cta .btn-primary,
.hero-cta .btn-secondary {
    display: inline-block !important;
    cursor: pointer !important;
}

/* Hide only nav Get Started button */
.nav-menu .btn-primary,
a[href="#download"]:not(.hero-cta a) {
    display: none !important;
}

/* Hide store buttons completely */
.store-button,
.download-buttons {
    display: none !important;
}

/* ===== HIDDEN FOOTER SECTIONS ===== */
/* Hide entire footer except copyright */
.footer-content {
    display: none !important;
}

.footer {
    padding: 40px 0 !important;
    background: #0F172A !important;
}

.footer-bottom {
    margin: 0 !important;
    padding: 0 !important;
}

/* ===== NAVIGATION CLEANUP ===== */
/* Hide Features, Insights, and Security buttons */
.nav-menu a[href="#features"],
.nav-menu a[href="#security"],
.nav-menu a[href="#insights"],
.nav-item[href="#features"],
.nav-item[href="#security"],
.nav-item[href="#insights"] {
    display: none !important;
}

/* Keep Money Moment and Meet Aarohi visible */
.nav-menu a[href="#money-moment"],
.nav-menu a[href="#meet-aarohi"],
.nav-item[href="#money-moment"],
.nav-item[href="#meet-aarohi"] {
    display: inline-block !important;
    cursor: pointer !important;
    pointer-events: auto !important;
}

/* Hide only external/unavailable pages */
.nav-menu a[href="support.html"],
.nav-menu a[href="about.html"],
.nav-menu a[href="faq.html"],
.nav-menu a[href="download.html"],
.nav-menu a[href="#download"] {
    display: none !important;
}

/* Hide language switcher temporarily */
.language-switcher,
.mobile-language-switcher {
    display: none !important;
}

/* ===== STYLE HERO CTA FOR COMING SOON ===== */
/* Add subtle coming soon indicator to hero */
.hero-badges::after {
    content: '🚀 Launching Q1 2024' !important;
    display: inline-block !important;
    margin-left: 12px !important;
    padding: 8px 16px !important;
    background: linear-gradient(135deg, #0EA5E9 0%, #7C3AED 100%) !important;
    color: white !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    animation: pulse 2s infinite !important;
}

/* ===== ADD WAITLIST BUTTON ===== */
/* Create a floating waitlist button */
.waitlist-float-btn {
    position: fixed !important;
    bottom: 100px !important;
    right: 30px !important;
    background: linear-gradient(135deg, #0EA5E9 0%, #7C3AED 100%) !important;
    color: white !important;
    padding: 16px 32px !important;
    border-radius: 50px !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    cursor: pointer !important;
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.3) !important;
    z-index: 998 !important;
    animation: pulse 2s infinite !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

.waitlist-float-btn:hover {
    transform: scale(1.05) !important;
    box-shadow: 0 8px 30px rgba(124, 58, 237, 0.4) !important;
}

/* ===== COMING SOON BADGE ===== */
/* Add badge to navbar */
.nav-bar::after,
.navbar::after {
    content: 'COMING SOON' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    background: linear-gradient(135deg, #0EA5E9 0%, #7C3AED 100%) !important;
    color: white !important;
    padding: 6px 20px !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    letter-spacing: 1px !important;
    pointer-events: none !important;
}

@keyframes pulse {
    0%, 100% {
        transform: translateX(-50%) scale(1);
        box-shadow: 0 4px 20px rgba(124, 58, 237, 0.3);
    }
    50% {
        transform: translateX(-50%) scale(1.05);
        box-shadow: 0 6px 30px rgba(124, 58, 237, 0.4);
    }
}

/* ===== MODIFY CTA BUTTONS ===== */
/* Change primary CTAs to waitlist signup */
.hero-cta .btn-primary:not(.nav-menu .btn-primary) {
    position: relative !important;
}

.hero-cta .btn-primary:not(.nav-menu .btn-primary)::after {
    content: ' (Join Waitlist)' !important;
    font-size: 12px !important;
    opacity: 0.9 !important;
}

/* Update download section */
.download-content h2::after {
    content: ' - Launching Soon!' !important;
    display: block !important;
    font-size: 24px !important;
    color: #7C3AED !important;
    margin-top: 8px !important;
    animation: fadeInUp 1s ease !important;
}

/* ===== WAITLIST MODAL TRIGGER ===== */
/* Convert Get Started buttons to waitlist signup */
.btn-primary:not(.action-btn) {
    cursor: pointer !important;
}

/* Add "notify me" text to download buttons */
.download-buttons::before {
    content: '🔔 Get notified when we launch' !important;
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-bottom: 20px !important;
    font-size: 16px !important;
    color: #64748B !important;
    font-weight: 500 !important;
}

/* ===== COMING SOON BADGE FOR FEATURES ===== */
/* Add coming soon badges to certain features */
.feature-card:nth-child(3)::before,
.feature-card:nth-child(5)::before {
    content: 'Beta' !important;
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    background: #F59E0B !important;
    color: white !important;
    padding: 4px 12px !important;
    border-radius: 20px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* ===== FOOTER MODIFICATIONS ===== */
/* Update footer copyright for coming soon */
.footer-bottom p:first-child::after {
    content: ' | Currently in Development' !important;
    color: #7C3AED !important;
    font-weight: 500 !important;
}

/* ===== HIDDEN BUT PRESERVED SECTIONS ===== */
/* These sections are hidden but code is preserved */

/* Temporarily hide certain advanced features */
.aarohi-features .aarohi-feature-card:nth-child(3),
.aarohi-features .aarohi-feature-card:nth-child(4) {
    opacity: 0.5 !important;
    pointer-events: none !important;
    position: relative !important;
}

.aarohi-features .aarohi-feature-card:nth-child(3)::after,
.aarohi-features .aarohi-feature-card:nth-child(4)::after {
    content: 'Coming in v2.0' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    background: rgba(0, 0, 0, 0.8) !important;
    color: white !important;
    padding: 8px 16px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

/* ===== WAITLIST FORM STYLES ===== */
/* Style for waitlist form when added */
.waitlist-form {
    max-width: 400px !important;
    margin: 40px auto !important;
    padding: 32px !important;
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1) !important;
}

.waitlist-form input[type="email"] {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 2px solid #E2E8F0 !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    margin-bottom: 16px !important;
    transition: all 0.3s ease !important;
}

.waitlist-form input[type="email"]:focus {
    outline: none !important;
    border-color: #0EA5E9 !important;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.1) !important;
}

.waitlist-form button {
    width: 100% !important;
    padding: 14px !important;
    background: linear-gradient(135deg, #0EA5E9 0%, #7C3AED 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.waitlist-form button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(124, 58, 237, 0.3) !important;
}

/* ===== TEMPORARY MESSAGE STYLES ===== */
.coming-soon-message {
    text-align: center !important;
    padding: 20px !important;
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.1) 0%, rgba(124, 58, 237, 0.1) 100%) !important;
    border-radius: 12px !important;
    margin: 20px 0 !important;
}

.coming-soon-message h3 {
    color: #7C3AED !important;
    font-size: 24px !important;
    margin-bottom: 8px !important;
}

.coming-soon-message p {
    color: #64748B !important;
    font-size: 16px !important;
}

/* ===== MOBILE RESPONSIVENESS ===== */
@media (max-width: 768px) {
    .hero::before {
        top: 70px !important;
        font-size: 12px !important;
        padding: 10px 20px !important;
    }
    
    .store-button::after {
        font-size: 10px !important;
        padding: 6px 12px !important;
    }
    
    .footer-links {
        grid-template-columns: 1fr !important;
    }
}

/* ===== REVERT INSTRUCTIONS ===== */
/* 
 * TO REVERT TO FULL LAUNCH MODE:
 * 1. Remove the link to coming-soon-override.css from index.html
 * 2. All hidden sections will automatically reappear
 * 3. All "Coming Soon" badges and messages will be removed
 * 4. Download buttons will be re-enabled
 * 5. Navigation links will be restored
 * 
 * NO CODE DELETION REQUIRED - Everything is preserved!
 */