/* ============================================
   PREMIUM DARK THEME - 2025 High-Trust Style
   Reverting forced light mode, fixing toggle duplication,
   and refining tier accents for dark mode cohesion.
   ============================================ */

/* --- 1. Global Page Background Revert --- */
body {
    background-color: #0A2540 !important; /* Original Dark Navy */
    color: #F3F4F6 !important;
}

/* --- 2. Top Content Sections - Cohesive Dark Background --- */
.hero-section {
    background: radial-gradient(circle at top right, rgba(20, 58, 92, 0.7) 0%, rgba(10, 37, 64, 0.9) 100%) !important;
    padding: 120px 0 !important;
    position: relative;
    overflow: hidden;
}

.hero-section::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 60%;
    height: 100%;
    background: radial-gradient(circle, rgba(0, 212, 170, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

.pricing-section,
section:not(.navbar):not(footer):not(.business-section):not(.ready-section):not(.testimonials-section),
main > section,
main > .container {
    background: transparent !important;
}

/* --- 9. Feature Cards - Glassmorphism --- */
.feature-card {
    background: rgba(20, 58, 92, 0.4) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 20px !important;
    padding: 2.5rem !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    height: 100%;
}

.feature-card:hover {
    transform: translateY(-10px) !important;
    border-color: rgba(209, 73, 0, 0.5) !important;
    background: rgba(20, 58, 92, 0.6) !important;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
}

.feature-card i {
    background: linear-gradient(135deg, #f97316 0%, #d14900 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 1.5rem;
    display: inline-block;
}

/* --- 11. Custom Badge Colors --- */
.badge.bg-danger,
.hero-section .badge.bg-danger,
.pricing-section .badge.bg-danger,
.hero-section .badge.bg-warning,
.hero-section .card .card-header .badge.bg-warning,
.badge.bg-warning,
.hero-section .badge[style*="background: linear-gradient"],
.hero-section .badge[style*="background: linear-gradient(135deg, #dc3545 0%, #b02a37 100%)"] {
    background: linear-gradient(135deg, #00D4AA 0%, #00B894 100%) !important; /* Teal */
    background-color: #00B894 !important;
    color: #0A2540 !important; /* Navy text — 7:1 contrast on teal */
    border: none !important;
    box-shadow: 0 0 12px rgba(0, 212, 170, 0.3), 0 2px 4px rgba(0,0,0,0.15) !important;
    text-shadow: none !important;
}

/* Specific highlight badge color - Cyan */
.hero-section .badge[style*="background: linear-gradient(135deg, #dc3545 0%, #b02a37 100%)"] {
    background: linear-gradient(135deg, #00D4AA 0%, #00B894 100%) !important;
    color: #0A2540 !important;
}

/* BEST VALUE and 80% SAVINGS should also use the darker red if they use bg-warning */

/* --- 12. Forced High-Contrast Overrides for Pricing Cards --- */
/* Target EVERYTHING inside the card body to be dark grey with maximum specificity */
html body .card .card-body,
html body .card .card-body *,
html body .card .card-body span,
html body .card .card-body small,
html body .card .card-body p,
html body .card .card-body li,
html body .card .card-body strong,
html body .card .card-body div,
html body .card .card-body i:not(.badge i) {
    color: #1F2937 !important; /* Professional Dark Grey */
    opacity: 1 !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    -webkit-text-fill-color: #1F2937 !important;
}

/* Specific fix for text inside cards that might be forced to white by parent themes */
.card-body, .card-body * {
    color: #1F2937 !important;
}

/* Ensure comparison table also follows high contrast rules in certain cells */
html body .table-danger *, 
html body .table-warning *, 
html body .table-danger, 
html body .table-warning,
html body .table td,
html body .table th {
    color: #1F2937 !important;
    opacity: 1 !important;
}

/* Specific override for muted text classes inside cards */
html body .card .text-muted,
html body .card .text-secondary,
html body .card .opacity-75,
html body .card .opacity-50 {
    color: #1F2937 !important;
    opacity: 1 !important;
}

/* Bullet text color - Forced dark grey across all pricing tiers and containers with ultra-high specificity */
html body .card ul li,
html body .card ul li span,
html body .card ul li strong,
html body .hero-section .card ul li,
html body .hero-section .card ul li span,
html body .hero-section .card ul li strong,
html body .pricing-section .card ul li,
html body .pricing-section .card ul li span,
html body .pricing-section .card ul li strong,
html body section .card ul li,
html body section .card ul li span,
html body section .card ul li strong {
    color: #1F2937 !important;
    font-weight: 800 !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

/* Ensure ONLY bullet icons in pricing cards are cyan to match badges */
.card-body ul li i {
    color: #00D4AA !important; /* Cyan */
    opacity: 1 !important;
}

/* Revert other icons back to dark grey if they are not in a list */
.card-body i.fas:not(li i), 
.card-body i.fab:not(li i),
.card-body i.fa-brain:not(li i),
.card-body i.fa-robot:not(li i) {
    color: #1F2937 !important;
}

/* Protect buttons and badges from the global dark grey override */
/* btn-danger uses dark red bg — white text is fine (~5:1) */
html body .card-body .btn-danger,
html body .card-body .btn-danger *,
html body .btn-danger,
html body .btn-danger * {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    opacity: 1 !important;
}

/* btn-primary uses teal bg — use navy text for readable contrast (~7:1) */
html body .card-body .btn-primary,
html body .card-body .btn-primary *,
html body .btn-primary,
html body .btn-primary * {
    color: #0A2540 !important;
    -webkit-text-fill-color: #0A2540 !important;
    opacity: 1 !important;
}

/* btn-secondary and badges also get navy text on teal */
html body .card-body .btn-secondary,
html body .card-body .btn-secondary * {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    opacity: 1 !important;
}
html body .badge,
html body .badge * {
    color: #0A2540 !important;
    -webkit-text-fill-color: #0A2540 !important;
    opacity: 1 !important;
}

/* Specific button overrides for pricing cards — danger keeps white, primary gets navy */
.hero-section .card .btn-danger:not(.pricing-cta-text),
.pricing-section .card .btn-danger:not(.pricing-cta-text),
.card .card-body .btn-danger:not(.pricing-cta-text) {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}
.hero-section .card .btn-primary:not(.pricing-cta-text),
.pricing-section .card .btn-primary:not(.pricing-cta-text),
.card .card-body .btn-primary:not(.pricing-cta-text) {
    color: #0A2540 !important;
    -webkit-text-fill-color: #0A2540 !important;
}

/* --- 13. Bright Orange Highlight Button --- */
.btn-highlight-orange {
    background-color: #f97316 !important; /* Brighter Orange */
    border-color: #f97316 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    transition: all 0.3s ease !important;
}

.btn-highlight-orange:hover {
    background-color: #ea580c !important; /* Slightly darker on hover */
    border-color: #ea580c !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(249, 115, 22, 0.4) !important;
}

/* Section Spacing */
section {
    padding: 120px 0 !important;
}

.testimonials-section {
    background: radial-gradient(circle at bottom left, #143A5C 0%, #0A2540 100%) !important;
}

/* --- 3. Global Text Contrast (Dark Mode) --- */
h1, h2, h3, h4, .display-4, .display-5 {
    color: #FFFFFF !important;
    font-weight: 800 !important;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0,0,0,0.6) !important;
}

p, .lead, li, span:not(.badge):not(.btn *):not(.navbar *) {
    color: #F3F4F6 !important;
    text-shadow: 0 1px 1px rgba(0,0,0,0.4) !important;
}

small, .text-muted {
    color: #94A3B8 !important;
    text-shadow: none !important;
    opacity: 1 !important;
}

/* --- 4. Pricing Cards - Premium White --- */
.card {
    background: #FFFFFF !important; /* Premium White */
    border: 1px solid #E5E7EB !important;
    border-radius: 12px !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    color: #000000 !important;
    box-shadow: 0 10px 30px -5px rgba(0,0,0,0.2) !important;
    position: relative;
    overflow: hidden;
}

/* Reflection sweep effect removed site-wide for a cleaner, less glossy look.
   Theme, shadows, and hover lift are preserved. */
.card::after,
.card:hover::after {
    display: none !important;
    content: none !important;
}

.no-reflection::after {
    display: none !important;
}

.card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.3), 0 0 20px rgba(255,255,255,0.1) !important;
}

.card .card-body {
    background: #FFFFFF !important;
    color: #000000 !important;
}

/* Base text color for cards */
.card .display-4, .card .display-5,
.card h4, .card h5,
.card p, .card li, .card span:not(.badge),
.card .text-muted, .card small,
.card i:not(.badge i) {
    color: #000000 !important; /* High Contrast Dark Text */
    text-shadow: none !important;
    opacity: 1 !important;
}

/* Hero Section Pricing Cards Overrides */
.hero-section .card .card-header h4,
.hero-section .card .card-header small,
.hero-section .card .card-title,
.hero-section .card .card-header {
    color: #FFFFFF !important;
}

/* --- 5. Tier Specific Accents (Authoritative) --- */

/* Pro Tier - Deep Rich Red */
.card:has(.card-header.bg-danger),
.pricing-card-pro,
.border-danger {
    border: 2px solid #d14900 !important;
}

.card:has(.card-header.bg-danger):hover {
    border-color: #f97316 !important;
}

.card:has(.card-header.bg-danger) .card-header,
.card-header.bg-danger {
    background: #d14900 !important;
    color: #FFFFFF !important;
    border-bottom: none !important;
}

.card:has(.card-header.bg-danger) .display-4,
.card:has(.card-header.bg-danger) .text-danger,
.card:has(.card-header.bg-danger) i.fa-check,
.card:has(.card-header.bg-danger) .display-5,
.savings-highlight {
    color: #d14900 !important;
}

/* Free & Business Tiers - Muted Slate Gray */
.card:has(.card-header.bg-secondary),
.card:has(.card-header.bg-primary),
.border-primary {
    border: 2px solid #4B5563 !important; /* Muted Gray */
}

.card:has(.card-header.bg-primary):hover {
    border-color: #6B7280 !important;
}

.card:has(.card-header.bg-secondary) .card-header,
.card-header.bg-secondary,
.card:has(.card-header.bg-primary) .card-header,
.card-header.bg-primary {
    background: #4B5563 !important;
    color: #FFFFFF !important;
}

.card:has(.card-header.bg-primary) i.fa-check,
.card:has(.card-header.bg-primary) .display-5,
.card:has(.card-header.bg-primary) .text-primary {
    color: #4B5563 !important;
}

/* --- 8. Specific Section Overrides --- */

/* 'Ready to Unlock' Section - Deep Red */
.ready-section, 
section:has(h2:contains("Ready to Unlock")) {
    background: #d14900 !important;
    color: #FFFFFF !important;
}

.ready-section h2, .ready-section h3, .ready-section p,
section:has(h2:contains("Ready to Unlock")) h2,
section:has(h2:contains("Ready to Unlock")) p {
    color: #FFFFFF !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.3) !important;
}

/* 'LawQuery AI for Business' Section - Light Gray */
.business-section,
section:has(h2:contains("LawQuery AI for Business")) {
    background: #FAFAFA !important;
    color: #111827 !important;
}

.business-section h2, .business-section p, .business-section li,
section:has(h2:contains("LawQuery AI for Business")) h2,
section:has(h2:contains("LawQuery AI for Business")) p,
section:has(h2:contains("LawQuery AI for Business")) li {
    color: #111827 !important;
    text-shadow: none !important;
}

/* Templates Section Titles */
.templates-section h2, .templates-section h3, .templates-section h5,
section:has(h2:contains("Templates")) h2,
section:has(h2:contains("Templates")) h5,
#documents h2, #documents h5 {
    color: #111827 !important;
    text-shadow: none !important;
}

/* CTA Buttons - Consistent Deep Red for Free/General, Orange for Pro/Business */
.btn-danger, .btn-primary, .btn-warning,
.hero-section .btn-danger, .hero-section .btn-primary,
.pricing-section .btn {
    background: #d14900 !important;
    border: none !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

/* Specific Orange Override for Pro and Business Buttons */
.card:has(.bg-danger) .btn,
.card:has(.bg-primary) .btn,
.hero-section .card:has(.bg-danger) .btn,
.hero-section .card:has(.bg-primary) .btn,
.pricing-section .card:has(.bg-danger) .btn,
.pricing-section .card:has(.bg-primary) .btn {
    background: #ffa41c !important;
    background-color: #ffa41c !important;
    border-color: #ffa41c !important;
    color: #000000 !important; /* Dark text for readability on orange */
    -webkit-text-fill-color: #000000 !important;
}

.card:has(.bg-danger) .btn:hover,
.card:has(.bg-primary) .btn:hover {
    background: #e69317 !important;
    transform: translateY(-2px);
    box-shadow: 0 0 20px rgba(255, 164, 28, 0.6), 0 4px 12px rgba(255, 164, 28, 0.4) !important;
}

.btn-danger:hover, .btn-primary:hover {
    background: #c2410c !important;
}


/* --- 6. Monthly/Annual Toggle Fix --- */
/* Remove duplication/overlap noise */
.pricing-toggle-wrapper,
#hero-billing-toggle {
    position: relative !important;
    z-index: 5 !important;
    display: inline-flex !important;
    background: transparent !important;
}

#billingToggle, #heroBillingToggle, .form-check-input {
    background-color: #4B5563 !important; /* Gray Track */
    border-color: #4B5563 !important;
    box-shadow: none !important;
    width: 3.5rem !important;
    height: 1.75rem !important;
}

#billingToggle:checked, #heroBillingToggle:checked, .form-check-input:checked {
    background-color: #00D4AA !important; /* Cyan Active Track */
}

/* Active State Label - Cyan Pill */
.fw-bold[id*="Label"] {
    color: #FFFFFF !important;
    background: #00D4AA !important;
    padding: 0.2rem 0.75rem !important;
    border-radius: 999px !important;
    border: none !important;
    text-shadow: none !important;
}

/* --- 7. Comparison Table - Dark Mode Cohesion --- */
.table, table {
    background: #143A5C !important;
    color: #FFFFFF !important;
}

/* Formly AI Brand Logo Styles */
.logo-brain-container {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-right: 14px;
    background: radial-gradient(circle, rgba(0, 212, 170, 0.15) 0%, transparent 70%);
    border-radius: 50%;
}

/* --- 15. Global Cyan Overrides (Replacing all Purple/Indigo) --- */
:root {
    --bs-primary: #00D4AA !important;
    --bs-primary-rgb: 6, 182, 212 !important;
}

.bg-primary {
    background-color: #00D4AA !important;
}

.text-primary {
    color: #00D4AA !important;
}

.btn-primary {
    background-color: #00D4AA !important;
    border-color: #00D4AA !important;
    color: #0A2540 !important; /* Navy — readable on teal */
    font-weight: 700 !important;
}

.btn-primary:hover {
    background-color: #00B894 !important;
    border-color: #00B894 !important;
    color: #0A2540 !important;
}

.btn-outline-primary {
    color: #00D4AA !important;
    border-color: #00D4AA !important;
}

.btn-outline-primary:hover {
    background-color: #00D4AA !important;
    border-color: #00D4AA !important;
    color: #0A2540 !important; /* Navy on teal hover */
}

/* Ensure navbar buttons also follow the cyan theme if they use primary */
.navbar .btn-primary {
    background: #ffa41c !important; /* Keep the premium orange for main CTA */
    color: #000000 !important;
}

.logo-brain-icon {
    font-size: 2.2rem;
    background: linear-gradient(135deg, #4FE3C1 0%, #00D4AA 40%, #00D4AA 70%, #4FE3C1 100%);
    background-size: 300% 300%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 15px rgba(0, 212, 170, 1)) drop-shadow(0 0 30px rgba(34, 211, 238, 0.6));
    animation: brain-pulse 3s infinite ease-in-out, brain-gradient 4s ease-in-out infinite;
    position: relative;
    z-index: 2;
}

@keyframes brain-gradient {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

/* Neural Network Spark Effect - Triple Ring */
.logo-brain-container::before,
.logo-brain-container::after {
    content: '';
    position: absolute;
    width: 110%;
    height: 110%;
    border: 2px solid transparent;
    border-top-color: rgba(0, 212, 170, 0.6);
    border-right-color: rgba(34, 211, 238, 0.4);
    border-radius: 50%;
    z-index: 0;
    animation: neural-orbit 5s infinite linear;
}

.logo-brain-container::after {
    width: 130%;
    height: 130%;
    border-top-color: rgba(0, 212, 170, 0.4);
    border-right-color: rgba(0, 212, 170, 0.3);
    border-left-color: rgba(139, 92, 246, 0.2);
    animation-duration: 7s;
    animation-direction: reverse;
}

.logo-brain-glow {
    position: absolute;
    width: 180%;
    height: 180%;
    background: radial-gradient(circle, rgba(0, 212, 170, 0.35) 0%, rgba(34, 211, 238, 0.15) 30%, transparent 60%);
    border-radius: 50%;
    z-index: 1;
    animation: glow-breath 3s infinite ease-in-out;
}

@keyframes brain-pulse {
    0%, 100% { transform: scale(1); filter: drop-shadow(0 0 15px rgba(0, 212, 170, 1)) drop-shadow(0 0 30px rgba(34, 211, 238, 0.6)); }
    50% { transform: scale(1.08); filter: drop-shadow(0 0 25px rgba(34, 211, 238, 1)) drop-shadow(0 0 40px rgba(0, 212, 170, 0.8)); }
}

@keyframes glow-breath {
    0%, 100% { transform: scale(1); opacity: 0.5; }
    50% { transform: scale(1.2); opacity: 0.8; }
}

@keyframes neural-orbit {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* --- 14. Modern Navbar Enhancement --- */
.navbar {
    background: rgba(10, 37, 64, 0.4) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 0.8rem 0 !important;
    transition: all 0.3s ease;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1) !important;
}

.navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
    font-weight: 500 !important;
    padding: 0.6rem 1.2rem !important;
    transition: all 0.3s ease;
    position: relative;
    border-radius: 8px;
    margin: 0 2px;
}

.navbar-nav .nav-link:hover {
    color: #4FE3C1 !important;
    background: rgba(0, 212, 170, 0.1) !important;
    text-shadow: 0 0 12px rgba(0, 212, 170, 0.5);
}

.navbar-nav .nav-link::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 50%;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, #00D4AA, #4FE3C1);
    transition: all 0.3s ease;
    transform: translateX(-50%);
    border-radius: 2px;
    box-shadow: 0 0 8px rgba(0, 212, 170, 0.6);
}

.navbar-nav .nav-link:hover::after {
    width: 50%;
}

.navbar-brand {
    display: flex;
    align-items: center;
}

.navbar-brand span {
    font-weight: 800;
    font-size: 1.3rem;
    background: linear-gradient(135deg, #FFFFFF 0%, #4FE3C1 50%, #FFFFFF 100%);
    background-size: 200% 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: brand-shimmer 4s ease-in-out infinite;
}

@keyframes brand-shimmer {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

/* Pricing CTA Button Styling */
.pricing-cta-text {
    background-color: #ffd814 !important;
    border-color: #ffd814 !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    text-shadow: none !important;
    border-radius: 50px !important;
    padding: 10px 24px !important;
}

/* High-Tech Metal Title Effect */
.metal-title {
    background: linear-gradient(
        135deg,
        #667eea 0%,
        #a8c0ff 25%,
        #ffffff 50%,
        #a8c0ff 75%,
        #667eea 100%
    );
    background-size: 200% 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: metal-shimmer 3s ease-in-out infinite;
    text-shadow: none;
    filter: drop-shadow(0 2px 4px rgba(102, 126, 234, 0.3));
}

@keyframes metal-shimmer {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* Pro Tier Cyan Color */
.pro-blue {
    color: #00D4AA !important;
}

.bg-pro-blue {
    background: linear-gradient(135deg, #00B894 0%, #007A62 100%) !important; /* Darker teal — readable with white */
}

.bg-pro-blue * {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

.border-pro-blue {
    border-color: #00D4AA !important;
}

.btn-pro-blue {
    background: linear-gradient(135deg, #00D4AA 0%, #00B894 100%) !important;
    border: none !important;
    color: #0A2540 !important; /* Navy on teal — high contrast */
    font-weight: 700 !important;
}

.btn-pro-blue:hover {
    background-color: #00B894 !important;
    border-color: #00B894 !important;
    color: #0A2540 !important;
}

/* Navbar "Get Started" Button styling */
.navbar .btn-primary {
    background: linear-gradient(135deg, #00D4AA 0%, #00B894 100%) !important;
    border: none !important;
    color: #0A2540 !important; /* Navy on teal — high contrast */
    font-weight: 700 !important;
    padding: 0.6rem 1.5rem !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 12px rgba(0, 212, 170, 0.3) !important;
    transition: all 0.3s ease !important;
}

.navbar .btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 212, 170, 0.5) !important;
    color: #0A2540 !important;
}

.table th, .table td, table th, table td {
    border-color: #334155 !important;
    color: #FFFFFF !important;
    background: #143A5C !important;
}

.table thead th {
    background: #0A2540 !important;
    color: #FFFFFF !important;
}

/* Waitlist Form Placeholder Styling */
.waitlist-form .form-control::placeholder,
.waitlist-form input::placeholder,
input[type="email"]::placeholder,
#documents .form-control::placeholder,
section .form-control::placeholder {
    color: #ffffff !important;
    opacity: 0.8 !important;
}

.waitlist-form .form-control::-webkit-input-placeholder,
.waitlist-form input::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder {
    color: #ffffff !important;
    opacity: 0.8 !important;
}

.waitlist-form .form-control::-moz-placeholder,
.waitlist-form input::-moz-placeholder,
input[type="email"]::-moz-placeholder {
    color: #ffffff !important;
    opacity: 0.8 !important;
}

.waitlist-form .form-control:-ms-input-placeholder,
.waitlist-form input:-ms-input-placeholder,
input[type="email"]:-ms-input-placeholder {
    color: #ffffff !important;
    opacity: 0.8 !important;
}

/* ============================================
   ENHANCED BACKGROUND EFFECTS
   To revert: Delete everything from this comment
   to the end of the file
   ============================================ */

/* Enhanced body background with more visible gradient */
body {
    background: 
        radial-gradient(ellipse at 20% 20%, rgba(0, 212, 170, 0.15) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(139, 92, 246, 0.12) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 50%, rgba(0, 212, 170, 0.08) 0%, transparent 60%),
        linear-gradient(180deg, #0a2540 0%, #143a5c 50%, #0a2540 100%) !important;
    background-attachment: fixed !important;
}

/* Animated glow orbs effect */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 30% 20%, rgba(0, 212, 170, 0.2) 0%, transparent 40%),
        radial-gradient(circle at 70% 60%, rgba(139, 92, 246, 0.15) 0%, transparent 40%),
        radial-gradient(circle at 20% 80%, rgba(0, 212, 170, 0.12) 0%, transparent 35%);
    pointer-events: none;
    z-index: -1;
    animation: bg-pulse 8s ease-in-out infinite alternate;
}

@keyframes bg-pulse {
    0% { opacity: 0.6; }
    100% { opacity: 1; }
}

/* Hero section enhanced glow */
.hero-section::before {
    content: '';
    position: absolute;
    top: -20%;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    height: 60%;
    background: radial-gradient(ellipse, rgba(0, 212, 170, 0.25) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

/* Section divider glow lines */
section {
    position: relative;
}

section::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 10%;
    right: 10%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(0, 212, 170, 0.3), rgba(139, 92, 246, 0.3), transparent);
}

/* ============================================
   END ENHANCED BACKGROUND EFFECTS
   ============================================ */

/* ============================================
   PRICING PAGE TEXT VISIBILITY
   ============================================ */

/* Pricing page card backgrounds */
.container .card {
    background: rgba(255, 255, 255, 0.95) !important;
}

.container .card .card-body {
    background: transparent !important;
}

/* Ensure pricing text is dark and readable */
.container .card .card-body span,
.container .card .card-body p,
.container .card .card-body li,
.container .card .card-body .display-4,
.container .card .card-body strong {
    color: #1F2937 !important;
    -webkit-text-fill-color: #1F2937 !important;
    text-shadow: none !important;
}

/* Pricing page headings */
.container .card .card-body .display-4,
.container .card .card-body h4,
.container .card .card-body h5 {
    color: #0a2540 !important;
    -webkit-text-fill-color: #0a2540 !important;
}

/* Keep colored price text */
.container .card .card-body .text-danger {
    color: #dc2626 !important;
    -webkit-text-fill-color: #dc2626 !important;
}

.container .card .card-body .text-primary {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.container .card .card-body .text-dark {
    color: #1F2937 !important;
    -webkit-text-fill-color: #1F2937 !important;
}

/* Muted text stays muted */
.container .card .card-body .text-muted {
    color: #6b7280 !important;
    -webkit-text-fill-color: #6b7280 !important;
}

/* Success text for savings */
.container .card .card-body .text-success {
    color: #059669 !important;
    -webkit-text-fill-color: #059669 !important;
}

/* Page heading and lead text */
.container > .text-center h1,
.container > .text-center .display-4 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.container > .text-center .lead,
.container > .text-center > p {
    color: rgba(255, 255, 255, 0.85) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.85) !important;
}

/* Billing toggle styling */
.bg-light.rounded-pill {
    background: rgba(255, 255, 255, 0.9) !important;
}

.bg-light.rounded-pill span {
    color: #1F2937 !important;
    -webkit-text-fill-color: #1F2937 !important;
}

/* Feature Comparison table - white text */
.table-responsive .table td,
.table-responsive .table th,
.table-responsive .table td strong,
.table-responsive .table tbody tr td {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.table-responsive .table thead th {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Keep colored text for badges and icons */
.table-responsive .table .badge {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
}

.table-responsive .table .text-success.fw-bold,
.table-responsive .table small.text-success {
    color: #10b981 !important;
    -webkit-text-fill-color: #10b981 !important;
}

/* Semi-transparent table backgrounds */
.table-responsive .table {
    background: rgba(20, 58, 92, 0.7) !important;
}

.table-responsive .table tbody tr {
    background: rgba(20, 58, 92, 0.5) !important;
}

.table-responsive .table-warning,
.table-responsive .table-warning td {
    background: rgba(251, 191, 36, 0.2) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.table-responsive .table-danger,
.table-responsive .table tbody .table-danger {
    background: rgba(220, 38, 38, 0.15) !important;
}


/* Legal disclaimer alert - black text */
.alert-warning,
.alert-warning p,
.alert-warning li,
.alert-warning h5,
.alert-warning strong,
.alert-warning a {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

/* ============================================
   PRICING CARDS - PROFESSIONAL COLOR SCHEME
   ============================================ */

/* Pro card - Cyan theme */
.container .card.border-danger {
    border-color: #00D4AA !important;
    box-shadow: 0 8px 32px rgba(0, 212, 170, 0.25) !important;
}

.container .card .card-header.bg-danger {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
}

.container .card .card-body .display-4.text-danger,
.container .card .card-body .text-danger {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.container .card .card-body i.text-danger {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.container .card .btn.btn-danger {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
    border-color: #00D4AA !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.container .card .btn.btn-danger:hover {
    background: linear-gradient(135deg, #00B894 0%, #00D4AA 100%) !important;
    box-shadow: 0 4px 15px rgba(0, 212, 170, 0.4) !important;
}

/* Business card - Slate/Professional theme */
.container .card.border-primary {
    border-color: #475569 !important;
    box-shadow: 0 4px 20px rgba(71, 85, 105, 0.2) !important;
}

.container .card .card-header.bg-primary {
    background: linear-gradient(135deg, #334155 0%, #475569 100%) !important;
}

.container .card .card-body .display-4.text-primary,
.container .card .card-body .text-primary {
    color: #334155 !important;
    -webkit-text-fill-color: #334155 !important;
}

.container .card .card-body i.text-primary {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.container .card .btn.btn-primary {
    background: linear-gradient(135deg, #334155 0%, #475569 100%) !important;
    border-color: #334155 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.container .card .btn.btn-primary:hover {
    background: linear-gradient(135deg, #143a5c 0%, #334155 100%) !important;
    box-shadow: 0 4px 15px rgba(51, 65, 85, 0.4) !important;
}

/* Free card - subtle styling */
.container .card .card-header.bg-light {
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%) !important;
}

/* Most Popular badge - gold/premium look */
.container .card .badge.bg-warning {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%) !important;
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
    font-weight: 600 !important;
}

/* Feature Comparison table - update Pro column */
.table-responsive .table thead th.bg-danger {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
}

.table-responsive .table tbody .table-danger {
    background: rgba(0, 212, 170, 0.1) !important;
}

.table-responsive .table .badge.bg-danger {
    background: #00D4AA !important;
}

/* Compare section - update Pro card */
.container .card.border-danger .card-body h5.text-danger,
.container .card.border-danger .card-body .display-5.text-danger {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

/* ============================================
   END PRICING CARDS COLOR SCHEME
   ============================================ */

/* ============================================
   END PRICING PAGE TEXT VISIBILITY
   ============================================ */

/* ============================================
   LOGIN/SIGNUP INPUT FIELDS - WHITE TEXT
   ============================================ */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
.form-control,
.form-control:focus,
input.form-control,
input.form-control:focus,
textarea.form-control,
textarea.form-control:focus {
    color: #1f2937 !important;
    -webkit-text-fill-color: #1f2937 !important;
    background-color: rgba(241, 245, 249, 0.95) !important;
    border-color: rgba(0, 212, 170, 0.4) !important;
    caret-color: #1f2937 !important;
}

/* Override autofill styles */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-text-fill-color: #1f2937 !important;
    -webkit-box-shadow: 0 0 0 30px rgba(241, 245, 249, 0.95) inset !important;
    box-shadow: 0 0 0 30px rgba(241, 245, 249, 0.95) inset !important;
    caret-color: #1f2937 !important;
}

.form-control::placeholder,
input::placeholder {
    color: rgba(100, 116, 139, 0.7) !important;
    -webkit-text-fill-color: rgba(100, 116, 139, 0.7) !important;
}

/* ============================================
   END LOGIN/SIGNUP INPUT FIELDS
   ============================================ */

/* ============================================
   DASHBOARD STYLING
   ============================================ */

/* Dashboard wrapper - white card backgrounds with readable dark text */
.dashboard-page .card {
    background: #ffffff !important;
    border: 1px solid rgba(0, 212, 170, 0.2) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

.dashboard-page .card .card-body {
    background: #ffffff !important;
}

/* Dashboard headings */
.dashboard-page h1 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.dashboard-page h3 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Card headers - cyan gradient */
.dashboard-page .card .card-header {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
    border-bottom: none !important;
    border-radius: 16px 16px 0 0 !important;
}

.dashboard-page .card .card-header h5,
.dashboard-page .card .card-header h6,
.dashboard-page .card .card-header .card-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Card body text - dark and readable */
.dashboard-page .card .card-body h5,
.dashboard-page .card .card-body h6 {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.dashboard-page .card .card-body p {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

.dashboard-page .card .card-body .text-muted {
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
}

.dashboard-page .card .card-body .small,
.dashboard-page .card .card-body small {
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
}

.dashboard-page .card .card-body .text-dark {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.dashboard-page .card .card-title {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

/* List items in cards */
.dashboard-page .card .card-body li {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

/* Dashboard stats */
.dashboard-page .fs-2.fw-bold.text-primary {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.dashboard-page .fs-2.fw-bold.text-success {
    color: #10b981 !important;
    -webkit-text-fill-color: #10b981 !important;
}

/* Special card headers */
.dashboard-page .card .card-header.bg-warning {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
}

.dashboard-page .card .card-header.bg-warning .card-title,
.dashboard-page .card .card-header.bg-warning h5,
.dashboard-page .card .card-header.bg-warning h6 {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.dashboard-page .card .card-header.bg-info {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
}

.dashboard-page .card .card-header.bg-primary,
.dashboard-page .card .card-header.bg-gradient-primary {
    background: linear-gradient(135deg, #00D4AA 0%, #00B894 100%) !important;
}

.dashboard-page .card .card-header.bg-success {
    background: linear-gradient(135deg, #059669 0%, #10b981 100%) !important;
}

/* Alerts in dashboard */
.dashboard-page .alert {
    border-radius: 12px !important;
}

.dashboard-page .alert-success {
    background: rgba(16, 185, 129, 0.1) !important;
    border-color: rgba(16, 185, 129, 0.3) !important;
    color: #059669 !important;
}

.dashboard-page .alert-warning {
    background: rgba(245, 158, 11, 0.1) !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
    color: #b45309 !important;
}

.dashboard-page .alert-info {
    background: rgba(0, 212, 170, 0.1) !important;
    border-color: rgba(0, 212, 170, 0.3) !important;
    color: #00B894 !important;
}

/* Dashboard buttons */
.dashboard-page .btn-warning {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    border: none !important;
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.dashboard-page .btn-info {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
    border: none !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.dashboard-page .btn-primary {
    background: linear-gradient(135deg, #00D4AA 0%, #00B894 100%) !important;
    border: none !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.dashboard-page .btn-outline-secondary {
    border-color: #94a3b8 !important;
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

.dashboard-page .btn-outline-secondary:hover {
    background: #f1f5f9 !important;
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.dashboard-page .btn-outline-info {
    border-color: #00D4AA !important;
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.dashboard-page .btn-outline-info:hover {
    background: rgba(0, 212, 170, 0.1) !important;
}

/* LawQuery featured card */
.dashboard-page .card.border-warning {
    border: 2px solid #f59e0b !important;
    box-shadow: 0 8px 32px rgba(245, 158, 11, 0.15) !important;
}

/* Quick Actions title */
.dashboard-page .card h6.card-title i {
    color: #00D4AA !important;
}

/* Example query box */
.dashboard-page .bg-light.rounded {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
}

.dashboard-page .bg-light.rounded .text-dark {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.dashboard-page .bg-light.rounded .text-primary {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

/* Text success/primary colors in cards */
.dashboard-page .card .text-success {
    color: #059669 !important;
    -webkit-text-fill-color: #059669 !important;
}

.dashboard-page .card .text-primary {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.dashboard-page .card .text-warning {
    color: #d97706 !important;
    -webkit-text-fill-color: #d97706 !important;
}

.dashboard-page .card .text-info {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.dashboard-page .card .text-danger {
    color: #dc2626 !important;
    -webkit-text-fill-color: #dc2626 !important;
}

/* Pricing display */
.dashboard-page .pricing-display .text-primary {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

/* ============================================
   END DASHBOARD STYLING
   ============================================ */

/* ============================================
   AI ADVISOR PAGE STYLING
   ============================================ */

/* Disclaimer banner - translucent style */
.ai-advisor-page #disclaimer-banner,
#disclaimer-banner.alert-danger {
    background: rgba(20, 58, 92, 0.85) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(0, 212, 170, 0.3) !important;
    color: #ffffff !important;
}

#disclaimer-banner.alert-danger strong,
#disclaimer-banner.alert-danger .alert-link {
    color: #f87171 !important;
    -webkit-text-fill-color: #f87171 !important;
}

#disclaimer-banner.alert-danger .alert-link:hover {
    color: #fca5a5 !important;
    -webkit-text-fill-color: #fca5a5 !important;
}

/* Disclaimer close button - prominent and visible */
.disclaimer-close-btn {
    background: rgba(255, 255, 255, 0.9) !important;
    color: #dc2626 !important;
    -webkit-text-fill-color: #dc2626 !important;
    border: 2px solid #ffffff !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 0.85rem !important;
    padding: 0.4rem 0.8rem !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.2s ease !important;
}

.disclaimer-close-btn:hover {
    background: #ffffff !important;
    color: #b91c1c !important;
    -webkit-text-fill-color: #b91c1c !important;
    transform: scale(1.05) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

.disclaimer-close-btn i {
    color: #dc2626 !important;
    -webkit-text-fill-color: #dc2626 !important;
}

/* First-time disclaimer acknowledgement modal popup */
#disclaimerAcknowledgeModal .modal-body {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

#disclaimerAcknowledgeModal .modal-body p,
#disclaimerAcknowledgeModal .modal-body li,
#disclaimerAcknowledgeModal .modal-body span {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

#disclaimerAcknowledgeModal .modal-body h5,
#disclaimerAcknowledgeModal .modal-body strong,
#disclaimerAcknowledgeModal .modal-body b {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    font-weight: 700 !important;
}

#disclaimerAcknowledgeModal .form-check-label {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

/* Circular checkbox styling */
#disclaimerAcknowledgeModal .form-check-input[type="checkbox"] {
    width: 1.5rem !important;
    height: 1.5rem !important;
    border-radius: 50% !important;
    border: 2px solid #6b7280 !important;
    margin-right: 0.5rem !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-color: #ffffff !important;
}

#disclaimerAcknowledgeModal .form-check-input[type="checkbox"]:checked {
    background-color: #B91C1C !important;
    border-color: #B91C1C !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
    background-size: 70% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

#disclaimerAcknowledgeModal .form-check {
    display: flex !important;
    align-items: flex-start !important;
}

/* Page headings */
.ai-advisor-page h1 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: 1.75rem !important;
}

.ai-advisor-page .text-muted {
    color: #94a3b8 !important;
    -webkit-text-fill-color: #94a3b8 !important;
}

/* Breadcrumb */
.ai-advisor-page .breadcrumb {
    background: transparent !important;
    padding: 0 !important;
}

.ai-advisor-page .breadcrumb-item a {
    color: #00D4AA !important;
}

.ai-advisor-page .breadcrumb-item.active {
    color: #94a3b8 !important;
}

/* Cards - Apple Glass effect (no reflections) */
.ai-advisor-page .card {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 20px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1) !important;
    overflow: visible !important;
}

/* Remove all reflection effects from AI advisor page */
.ai-advisor-page .card::after,
.ai-advisor-page .card::before,
.ai-advisor-page *::after,
.ai-advisor-page *::before {
    background: none !important;
    background-image: none !important;
}

.ai-advisor-page .card:hover {
    transform: none !important;
}

.ai-advisor-page .card:hover::after {
    display: none !important;
}

.ai-advisor-page .card .card-header {
    background: linear-gradient(135deg, rgba(0, 212, 170, 0.85) 0%, rgba(0, 212, 170, 0.85) 100%) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 20px 20px 0 0 !important;
    color: #ffffff !important;
}

.ai-advisor-page .card .card-header.bg-primary {
    background: linear-gradient(135deg, rgba(0, 212, 170, 0.85) 0%, rgba(0, 212, 170, 0.85) 100%) !important;
}

.ai-advisor-page .card .card-header h5,
.ai-advisor-page .card .card-header h6 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

.ai-advisor-page .card .card-body {
    background: transparent !important;
    color: #143a5c !important;
}

.ai-advisor-page .card .card-body h5,
.ai-advisor-page .card .card-body h6 {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.ai-advisor-page .card .card-body p {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

.ai-advisor-page .card .card-title {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

/* Query status card - translucent */
.ai-advisor-page .card.border-info {
    border: 2px solid rgba(0, 212, 170, 0.5) !important;
    background: rgba(0, 212, 170, 0.15) !important;
    backdrop-filter: blur(16px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
}

.ai-advisor-page .card.border-info .card-body {
    background: transparent !important;
}

.ai-advisor-page .card.border-info .card-title,
.ai-advisor-page .card.border-info h6 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.ai-advisor-page .card.border-info p,
.ai-advisor-page .card.border-info .text-success,
.ai-advisor-page .card.border-info .text-primary {
    color: #e2e8f0 !important;
    -webkit-text-fill-color: #e2e8f0 !important;
}

/* Chat messages area */
.ai-advisor-page .chat-messages-card .card-body {
    background: #f8fafc !important;
    resize: vertical !important;
    overflow-y: auto !important;
    min-height: 300px !important;
    max-height: 800px !important;
    cursor: ns-resize;
}

/* Resize handle styling */
.ai-advisor-page .chat-messages-card .card-body::-webkit-resizer {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%);
    border-radius: 4px;
}

/* User messages - cyan theme */
.ai-advisor-page .message-item .bg-primary {
    background: linear-gradient(135deg, #00D4AA 0%, #00B894 100%) !important;
    border-radius: 18px 18px 4px 18px !important;
}

.ai-advisor-page .message-item .bg-primary .text-dark,
.ai-advisor-page .message-item .bg-primary .message-content {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* AI messages */
.ai-advisor-page .message-item .bg-light {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 18px 18px 18px 4px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

.ai-advisor-page .message-item .bg-light .text-dark,
.ai-advisor-page .message-item .bg-light .message-content {
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

/* AI Response Text Formatting - Professional styling */
.ai-advisor-page .message-content {
    line-height: 1.7 !important;
    font-size: 0.95rem !important;
}

.ai-advisor-page .message-content h1,
.ai-advisor-page .message-content h2,
.ai-advisor-page .message-content h3,
.ai-advisor-page .message-content h4,
.ai-advisor-page .message-content h5,
.ai-advisor-page .message-content h6 {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
    margin-top: 1.25rem !important;
    margin-bottom: 0.75rem !important;
    font-weight: 700 !important;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 0.5rem;
}

.ai-advisor-page .message-content h1 { font-size: 1.4rem !important; }
.ai-advisor-page .message-content h2 { font-size: 1.25rem !important; }
.ai-advisor-page .message-content h3 { font-size: 1.1rem !important; }
.ai-advisor-page .message-content h4 { font-size: 1rem !important; }

.ai-advisor-page .message-content p {
    margin-bottom: 1rem !important;
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.ai-advisor-page .message-content ul,
.ai-advisor-page .message-content ol {
    margin-bottom: 1rem !important;
    padding-left: 1.5rem !important;
}

.ai-advisor-page .message-content li {
    margin-bottom: 0.5rem !important;
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.ai-advisor-page .message-content strong,
.ai-advisor-page .message-content b {
    color: #00B894 !important;
    -webkit-text-fill-color: #00B894 !important;
    font-weight: 700 !important;
}

.ai-advisor-page .message-content em,
.ai-advisor-page .message-content i:not(.fas):not(.far):not(.fab) {
    color: #475569 !important;
    font-style: italic !important;
}

.ai-advisor-page .message-content blockquote {
    border-left: 4px solid #00D4AA !important;
    padding-left: 1rem !important;
    margin: 1rem 0 !important;
    background: rgba(0, 212, 170, 0.05) !important;
    padding: 0.75rem 1rem !important;
    border-radius: 0 8px 8px 0 !important;
    font-style: italic !important;
}

.ai-advisor-page .message-content code {
    background: #f1f5f9 !important;
    padding: 0.2rem 0.4rem !important;
    border-radius: 4px !important;
    font-family: monospace !important;
    font-size: 0.9em !important;
    color: #be185d !important;
}

.ai-advisor-page .message-content pre {
    background: #143a5c !important;
    color: #e2e8f0 !important;
    padding: 1rem !important;
    border-radius: 8px !important;
    overflow-x: auto !important;
    margin: 1rem 0 !important;
}

.ai-advisor-page .message-content hr {
    border: none !important;
    border-top: 1px solid #e2e8f0 !important;
    margin: 1.5rem 0 !important;
}

/* Links in AI messages - bright professional blue */
.ai-advisor-page .message-content a {
    color: #3B82F6 !important;
    -webkit-text-fill-color: #3B82F6 !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    transition: color 0.15s ease !important;
}

.ai-advisor-page .message-content a:hover {
    color: #60A5FA !important;
    -webkit-text-fill-color: #60A5FA !important;
    text-decoration: underline !important;
}

/* Legal citations - superscript style for bracketed references [1], [2], etc. */
.ai-advisor-page .message-content .citation,
.ai-advisor-page .message-content a.citation {
    color: #3B82F6 !important;
    -webkit-text-fill-color: #3B82F6 !important;
    font-size: 0.85em !important;
    vertical-align: super !important;
    text-decoration: underline !important;
    cursor: pointer !important;
}

.ai-advisor-page .message-content .citation:hover,
.ai-advisor-page .message-content a.citation:hover {
    color: #60A5FA !important;
    -webkit-text-fill-color: #60A5FA !important;
    text-decoration: underline double !important;
}

/* Legal references - statute and case law links */
.ai-advisor-page .message-content .legal-link,
.ai-advisor-page .message-content a.legal-link {
    color: #3B82F6 !important;
    -webkit-text-fill-color: #3B82F6 !important;
    text-decoration: underline !important;
    font-weight: 500 !important;
}

.ai-advisor-page .message-content .legal-link:hover,
.ai-advisor-page .message-content a.legal-link:hover {
    color: #60A5FA !important;
    -webkit-text-fill-color: #60A5FA !important;
}

/* Chat messages area - resizable on desktop */
.ai-advisor-page #chat-container {
    height: 550px !important;
    min-height: 300px !important;
    max-height: 800px !important;
    resize: vertical !important;
    overflow-y: auto !important;
}

/* Chat messages card - resizable container on desktop */
.ai-advisor-page .chat-messages-card {
    border-radius: 20px 20px 0 0 !important;
    margin-bottom: 0 !important;
    resize: both !important;
    overflow: hidden !important;
    min-width: 400px !important;
    min-height: 400px !important;
    max-width: 100% !important;
    max-height: 85vh !important;
    position: relative !important;
}

/* Resize handle styling */
.ai-advisor-page .chat-messages-card::-webkit-resizer {
    background: linear-gradient(135deg, transparent 50%, rgba(0, 212, 170, 0.3) 50%);
    border-radius: 0 0 8px 0;
}

.ai-advisor-page .col-lg-8 {
    flex: 0 0 75% !important;
    max-width: 75% !important;
}

.ai-advisor-page .col-lg-4 {
    flex: 0 0 25% !important;
    max-width: 25% !important;
}

/* Chat input area - connected to chat box */
.ai-advisor-page .chat-input-container {
    background: rgba(241, 245, 249, 0.85) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-top: none !important;
    border-radius: 0 0 20px 20px !important;
    padding: 1rem 1.25rem !important;
    margin-top: 0 !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08) !important;
}

/* Mobile: disable resizing */
@media (max-width: 768px) {
    .ai-advisor-page .chat-messages-card {
        resize: none !important;
        min-width: unset !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    
    .ai-advisor-page #chat-container {
        resize: none !important;
    }
}

.ai-advisor-page .chat-textarea {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
    flex: 1 !important;
}

.ai-advisor-page .chat-textarea:focus {
    border-color: #00D4AA !important;
    box-shadow: 0 0 0 3px rgba(0, 212, 170, 0.15) !important;
}

/* Chat input wrapper layout */
.ai-advisor-page .chat-input-wrapper {
    display: flex !important;
    gap: 12px !important;
    align-items: flex-end !important;
}

.ai-advisor-page .chat-send-btn {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    color: #ffffff !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    height: fit-content !important;
}

.ai-advisor-page .chat-send-btn:hover {
    background: linear-gradient(135deg, #00B894 0%, #00D4AA 100%) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 212, 170, 0.3) !important;
}

/* Buttons */
.ai-advisor-page .btn-primary {
    background: linear-gradient(135deg, #00D4AA 0%, #00D4AA 100%) !important;
    border: none !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.ai-advisor-page .btn-warning {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    border: none !important;
    color: #143a5c !important;
    -webkit-text-fill-color: #143a5c !important;
}

.ai-advisor-page .btn-outline-info {
    border-color: #00D4AA !important;
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.ai-advisor-page .btn-outline-info:hover {
    background: rgba(0, 212, 170, 0.1) !important;
}

.ai-advisor-page .btn-outline-success {
    border-color: #10b981 !important;
    color: #10b981 !important;
    -webkit-text-fill-color: #10b981 !important;
}

.ai-advisor-page .btn-outline-success:hover {
    background: rgba(16, 185, 129, 0.1) !important;
}

.ai-advisor-page .btn-outline-warning {
    border-color: #f59e0b !important;
    color: #d97706 !important;
    -webkit-text-fill-color: #d97706 !important;
}

/* Badges - Apple Glass effect */
.ai-advisor-page .badge.bg-success {
    background: rgba(16, 185, 129, 0.8) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3) !important;
}

.ai-advisor-page .badge.bg-warning {
    background: rgba(245, 158, 11, 0.8) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3) !important;
}

.ai-advisor-page .badge.bg-secondary {
    background: rgba(100, 116, 139, 0.8) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* Alert styling - Apple Glass effect */
.ai-advisor-page .alert-warning {
    background: rgba(245, 158, 11, 0.2) !important;
    backdrop-filter: blur(16px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(180%) !important;
    border: 1px solid rgba(245, 158, 11, 0.4) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1) !important;
}

.ai-advisor-page .alert-warning small,
.ai-advisor-page .alert-warning strong {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* Sidebar cards - truly translucent glass effect */
.ai-advisor-page .col-lg-4 .card {
    background: rgba(10, 37, 64, 0.25) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.ai-advisor-page .col-lg-4 .card .card-header {
    background: rgba(10, 37, 64, 0.3) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

.ai-advisor-page .col-lg-4 .card .card-body {
    background: transparent !important;
}

.ai-advisor-page .col-lg-4 .card .card-body p,
.ai-advisor-page .col-lg-4 .card .card-body li,
.ai-advisor-page .col-lg-4 .card .card-body small {
    color: #e2e8f0 !important;
    -webkit-text-fill-color: #e2e8f0 !important;
}

.ai-advisor-page .col-lg-4 .card .card-body a {
    color: #67e8f9 !important;
    -webkit-text-fill-color: #67e8f9 !important;
}

/* Remove white background from session items */
.ai-advisor-page .col-lg-4 .card .card-body .bg-light {
    background: rgba(255, 255, 255, 0.1) !important;
}

.ai-advisor-page .col-lg-4 .card .card-body .fw-bold,
.ai-advisor-page .col-lg-4 .card .card-body .text-muted {
    color: #e2e8f0 !important;
    -webkit-text-fill-color: #e2e8f0 !important;
}

/* Text colors */
.ai-advisor-page .text-primary {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
}

.ai-advisor-page .text-success {
    color: #10b981 !important;
    -webkit-text-fill-color: #10b981 !important;
}

.ai-advisor-page .text-warning {
    color: #f59e0b !important;
    -webkit-text-fill-color: #f59e0b !important;
}

/* Welcome message in empty chat */
.ai-advisor-page .text-center.text-muted h5 {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

.ai-advisor-page .text-center.text-muted p {
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
}

/* Character count footer */
.ai-advisor-page .chat-input-footer .text-muted {
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
}

/* ============================================
   END AI ADVISOR PAGE STYLING
   ============================================ */

/* ============================================
   PAYMENT PAGE STYLING
   ============================================ */

/* Payment page text visibility - ensure dark text on light backgrounds */
.payment-container h1,
.payment-container h3,
.payment-container h5,
.payment-container label,
.payment-container p,
.payment-container li,
.payment-container .form-label {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

.payment-container .text-muted {
    color: #4b5563 !important;
    -webkit-text-fill-color: #4b5563 !important;
}

.payment-form h3,
.payment-form label,
.payment-form .form-label,
.payment-form strong {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

/* Pricing card text */
.pricing-card h5,
.pricing-card .fs-3,
.pricing-card li {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

.pricing-card .text-muted {
    color: #6b7280 !important;
    -webkit-text-fill-color: #6b7280 !important;
}

/* Monthly/Annual toggle buttons - selected state blue */
.payment-container .btn-check:checked + .btn-outline-primary,
.payment-container .btn-check:checked + .btn-outline-success {
    background-color: #019fcd !important;
    border-color: #019fcd !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Unselected toggle state */
.payment-container .btn-outline-primary,
.payment-container .btn-outline-success {
    background-color: #f3f4f6 !important;
    border-color: #d1d5db !important;
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
    padding: 0.75rem 1rem !important;
}

.payment-container .btn-outline-primary:hover,
.payment-container .btn-outline-success:hover {
    background-color: #e5e7eb !important;
    border-color: #9ca3af !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

/* Security notice text */
.payment-form .text-center small,
.payment-form .text-center .text-muted {
    color: #4b5563 !important;
    -webkit-text-fill-color: #4b5563 !important;
}

/* Braintree drop-in container text overrides */
#dropin-container label,
#dropin-container .braintree-form__label,
#dropin-container .braintree-form__descriptor,
#dropin-container .braintree-heading {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

/* ============================================
   END PAYMENT PAGE STYLING
   ============================================ */

/* ============================================
   REGISTER/SIGNUP PAGE CHECKBOX STYLING
   ============================================ */

/* Circular checkbox for terms agreement */
#agree_terms.form-check-input {
    width: 1.5rem !important;
    height: 1.5rem !important;
    border-radius: 50% !important;
    border: 2px solid #111827 !important;
    margin-right: 0.5rem !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-color: #ffffff !important;
    margin-top: 0 !important;
}

#agree_terms.form-check-input:checked {
    background-color: #B91C1C !important;
    border-color: #B91C1C !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
    background-size: 70% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

#agree_terms.form-check-input:focus {
    box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.25) !important;
    border-color: #B91C1C !important;
}

/* Flex layout for checkbox alignment */
#agree_terms.form-check-input + .form-check-label,
label[for="agree_terms"] {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

/* Ensure form-check uses flexbox for proper alignment */
.form-check:has(#agree_terms) {
    display: flex !important;
    align-items: flex-start !important;
}

/* Terms checkbox label text - ensure dark color */
label.form-check-label[for="agree_terms"],
.form-check-label[for="agree_terms"] {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

/* Links within the terms label */
.form-check-label[for="agree_terms"] a {
    color: #00D4AA !important;
    -webkit-text-fill-color: #00D4AA !important;
    text-decoration: underline !important;
}

.form-check-label[for="agree_terms"] a:hover {
    color: #00B894 !important;
    -webkit-text-fill-color: #00B894 !important;
}

/* ============================================
   END REGISTER/SIGNUP PAGE CHECKBOX STYLING
   ============================================ */

/* ============================================
   PASSWORD VISIBILITY TOGGLE STYLING
   ============================================ */

/* Container for password input + toggle button */
.password-input-group {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}

.password-input-group .form-control {
    padding-right: 3rem !important;
}

/* Eye toggle button */
.password-toggle-btn {
    position: absolute !important;
    right: 1rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer !important;
    color: #6B7280 !important;
    font-size: 1.25rem !important;
    line-height: 1 !important;
    z-index: 10 !important;
}

.password-toggle-btn:hover {
    color: #111827 !important;
}

.password-toggle-btn:focus {
    outline: none !important;
    color: #111827 !important;
}

.password-toggle-btn i {
    display: block !important;
}

/* ============================================
   END PASSWORD VISIBILITY TOGGLE STYLING
   ============================================ */

/* Forgot password link styling */
.forgot-password-link {
    color: #3B82F6 !important;
    text-decoration: underline !important;
    font-size: 0.875rem !important;
}

.forgot-password-link:hover {
    color: #2563EB !important;
    cursor: pointer !important;
}