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

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

/* Light background for static pages - slate gradient */
.about-container,
.contact-container,
.legal-container,
.faq-container,
.terms-container,
.privacy-container {
    background: linear-gradient(180deg, rgba(241, 245, 249, 0.8) 0%, rgba(226, 232, 240, 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.9) !important;
    border-color: #E2E8F0 !important;
}

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

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

.cta-btn-primary:hover,
.cta-btn-secondary:hover,
.submit-button:hover {
    background: linear-gradient(135deg, #334155 0%, #1E293B 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: #64748B !important;
}

.about-nav-link:hover {
    color: #475569 !important;
    background: rgba(241, 245, 249, 0.5) !important;
}

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

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

/* Lead text */
.lead {
    color: #64748B !important;
}

/* Tool tagline */
.tool-tagline {
    color: #64748B !important;
}

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

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

.cta-btn:hover {
    border-color: #475569 !important;
    box-shadow: 0 8px 16px rgba(51, 65, 85, 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: #334155 !important;
}

.auth-button {
    background: linear-gradient(135deg, #475569 0%, #334155 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(51, 65, 85, 0.15) !important;
}

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

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

/* Footer */
.landing-footer {
    color: #64748B !important;
}

.landing-footer p {
    color: #64748B !important;
}