/* Static Pages Blue Theme - Based on Clean Blue Color Palette */
/* This provides better contrast for content-heavy pages */

/* Body background for static pages */
body {
    background: #F8FAFC !important;
}

/* Light background for static pages - subtle blue */
.about-container,
.contact-container,
.legal-container,
.faq-container,
.terms-container,
.privacy-container {
    background: linear-gradient(180deg, rgba(239, 246, 255, 0.6) 0%, rgba(248, 250, 252, 0.9) 100%) !important;
}

/* Ensure dark, readable text */
.about-container,
.contact-container,
.legal-container,
.faq-container,
.terms-container,
.privacy-container,
.about-container p,
.contact-container p,
.legal-container p,
.faq-container p,
.terms-container p,
.privacy-container p,
.about-container li,
.contact-container li,
.legal-container li,
.faq-container li,
.terms-container li,
.privacy-container li {
    color: #1E293B !important;
}

/* Headings - keep readable dark text */
.about-container h1,
.about-container h2,
.about-container h3,
.contact-container h1,
.contact-container h2,
.legal-container h1,
.legal-container h2,
.faq-container h1,
.faq-container h2,
.terms-container h1,
.terms-container h2,
.privacy-container h1,
.privacy-container h2 {
    color: #1E293B !important;
}

/* Content boxes - light with good contrast */
.philosophy,
.choosing-tool,
.contact-section,
.tool-overview {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: #E2E8F0 !important;
}

/* Blue accent color for links and important text */
.tool-header h2,
.comparison-item h3,
.about-nav-link.active {
    color: #2563EB !important;
}

/* Buttons - blue gradient */
.cta-btn-primary,
.cta-btn-secondary,
.submit-button {
    background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%) !important;
    color: white !important;
    border-color: transparent !important;
}

.cta-btn-primary:hover,
.cta-btn-secondary:hover,
.submit-button:hover {
    background: linear-gradient(135deg, #1D4ED8 0%, #1E40AF 100%) !important;
}

/* Sticky nav - light background */
.about-sticky-nav {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom-color: #E2E8F0 !important;
}

.about-nav-link {
    color: #8494A7 !important;
}

.about-nav-link:hover {
    color: #2563EB !important;
    background: rgba(239, 246, 255, 0.5) !important;
}

/* Links */
.back-link,
.footer-links a,
.landing-footer a {
    color: #2563EB !important;
}

.back-link:hover,
.footer-links a:hover,
.landing-footer a:hover {
    color: #1D4ED8 !important;
}

/* Lead text */
.lead {
    color: #8494A7 !important;
}

/* Tool tagline */
.tool-tagline {
    color: #8494A7 !important;
}

/* Encouragement box */
.encouragement {
    border-left-color: #2563EB !important;
}

/* CTA buttons with icons */
.cta-btn {
    background: rgba(255, 255, 255, 0.95) !important;
    border: 2px solid #BFDBFE !important;
    color: #1E293B !important;
}

.cta-btn:hover {
    border-color: #2563EB !important;
    box-shadow: 0 8px 16px rgba(37, 99, 235, 0.15) !important;
}

/* Navbar styling for static pages */
.landing-navbar {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid #E2E8F0 !important;
}

.navbar-title {
    color: #1E293B !important;
}

.navbar-link {
    color: #475569 !important;
}

.navbar-link:hover {
    color: #2563EB !important;
}

.auth-button {
    background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%) !important;
    color: white !important;
}

/* Share button and dropdown */
.share-button {
    color: #475569 !important;
}

.share-dropdown {
    background: white !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.12) !important;
}

.share-option {
    color: #1E293B !important;
}

.share-option:hover {
    background: #EFF6FF !important;
}

/* Footer */
.landing-footer {
    color: #8494A7 !important;
}

.landing-footer p {
    color: #8494A7 !important;
}

/* ===== DARK THEME - STATIC PAGES ===== */
[data-theme="dark"] body {
    background: #0F172A !important;
}

[data-theme="dark"] .about-container,
[data-theme="dark"] .contact-container,
[data-theme="dark"] .legal-container,
[data-theme="dark"] .faq-container,
[data-theme="dark"] .terms-container,
[data-theme="dark"] .privacy-container {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.6) 0%, rgba(15, 23, 42, 0.9) 100%) !important;
}

[data-theme="dark"] .about-container,
[data-theme="dark"] .contact-container,
[data-theme="dark"] .legal-container,
[data-theme="dark"] .faq-container,
[data-theme="dark"] .terms-container,
[data-theme="dark"] .privacy-container,
[data-theme="dark"] .about-container p,
[data-theme="dark"] .contact-container p,
[data-theme="dark"] .legal-container p,
[data-theme="dark"] .faq-container p,
[data-theme="dark"] .terms-container p,
[data-theme="dark"] .privacy-container p,
[data-theme="dark"] .about-container li,
[data-theme="dark"] .contact-container li,
[data-theme="dark"] .legal-container li,
[data-theme="dark"] .faq-container li,
[data-theme="dark"] .terms-container li,
[data-theme="dark"] .privacy-container li {
    color: #E2E8F0 !important;
}

[data-theme="dark"] .about-container h1,
[data-theme="dark"] .about-container h2,
[data-theme="dark"] .about-container h3,
[data-theme="dark"] .contact-container h1,
[data-theme="dark"] .contact-container h2,
[data-theme="dark"] .legal-container h1,
[data-theme="dark"] .legal-container h2,
[data-theme="dark"] .faq-container h1,
[data-theme="dark"] .faq-container h2,
[data-theme="dark"] .terms-container h1,
[data-theme="dark"] .terms-container h2,
[data-theme="dark"] .privacy-container h1,
[data-theme="dark"] .privacy-container h2 {
    color: #F1F5F9 !important;
}

[data-theme="dark"] .philosophy,
[data-theme="dark"] .choosing-tool,
[data-theme="dark"] .contact-section,
[data-theme="dark"] .tool-overview {
    background: rgba(30, 41, 59, 0.95) !important;
    border-color: #334155 !important;
}

[data-theme="dark"] .tool-header h2,
[data-theme="dark"] .comparison-item h3,
[data-theme="dark"] .about-nav-link.active {
    color: #60A5FA !important;
}

[data-theme="dark"] .about-sticky-nav {
    background: rgba(15, 23, 42, 0.95) !important;
    border-bottom-color: #334155 !important;
}

[data-theme="dark"] .about-nav-link {
    color: #94A3B8 !important;
}

[data-theme="dark"] .about-nav-link:hover {
    color: #60A5FA !important;
    background: rgba(30, 41, 59, 0.5) !important;
}

[data-theme="dark"] .back-link,
[data-theme="dark"] .footer-links a,
[data-theme="dark"] .landing-footer a {
    color: #60A5FA !important;
}

[data-theme="dark"] .lead {
    color: #94A3B8 !important;
}

[data-theme="dark"] .tool-tagline {
    color: #94A3B8 !important;
}

[data-theme="dark"] .encouragement {
    border-left-color: #3B82F6 !important;
}

[data-theme="dark"] .cta-btn {
    background: rgba(30, 41, 59, 0.95) !important;
    border: 2px solid #334155 !important;
    color: #F1F5F9 !important;
}

[data-theme="dark"] .cta-btn:hover {
    border-color: #3B82F6 !important;
}

[data-theme="dark"] .cta-primary {
    background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%) !important;
    color: #FFFFFF !important;
}

[data-theme="dark"] .cta-primary:hover {
    background: linear-gradient(135deg, #1D4ED8 0%, #1E40AF 100%) !important;
}

[data-theme="dark"] .landing-navbar {
    background: rgba(15, 23, 42, 0.95) !important;
    border-bottom: 1px solid #334155 !important;
}

[data-theme="dark"] .navbar-title {
    color: #F1F5F9 !important;
}

[data-theme="dark"] .navbar-link {
    color: #CBD5E1 !important;
}

[data-theme="dark"] .navbar-link:hover {
    color: #60A5FA !important;
}

[data-theme="dark"] .share-dropdown {
    background: #1E293B !important;
    border: 1px solid #334155 !important;
}

[data-theme="dark"] .share-option {
    color: #F1F5F9 !important;
}

[data-theme="dark"] .share-option:hover {
    background: #0F172A !important;
}

[data-theme="dark"] .landing-footer {
    color: #8494A7 !important;
}

[data-theme="dark"] .landing-footer p {
    color: #8494A7 !important;
}