/*
 * ═══════════════════════════════════════════════════════════════════════
 * MAJAARH Landing Page - Light Mode Override
 * Fixes: white-text-on-white-background in light mode
 * ═══════════════════════════════════════════════════════════════════════
 */

/* ── 1. Fix .text-white on white backgrounds in light mode ── */
html.light .text-white,
[data-bs-theme="light"] .text-white {
    color: var(--mj-text, #0f172a) !important;
}

/* ── 2. Exceptions: keep white on dark/colored backgrounds ── */
html.light .btn-main .text-white,
html.light .btn-primary .text-white,
html.light [style*="background: var(--brand-red)"] .text-white,
html.light [style*="background: linear-gradient"] .text-white,
html.light .hero-slider-section .text-white,
html.light .sat-icon .text-white {
    color: #ffffff !important;
}

/* ── 3. Major Sections: force text contrast ── */
html.light .section-premium h1,
html.light .section-premium h2,
html.light .section-premium h3,
html.light .section-premium h4,
html.light .section-premium h5,
html.light .section-premium p {
    color: var(--mj-text) !important;
}

/* ── 4. Glass Cards & Glassmorphism in light mode ── */
html.light .majara-glass-card,
[data-bs-theme="light"] .majara-glass-card {
    background: rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

html.light .majara-glass-card h4,
[data-bs-theme="light"] .majara-glass-card h4 {
    color: var(--mj-text) !important;
}

html.light .majara-glass-card p,
[data-bs-theme="light"] .majara-glass-card p {
    color: var(--mj-text-muted) !important;
}

html.light .card-header-meta,
[data-bs-theme="light"] .card-header-meta {
    color: var(--mj-text-muted) !important;
}

html.light .card-footer-status,
[data-bs-theme="light"] .card-footer-status {
    color: var(--mj-text-muted) !important;
}

/* ── 5. Comparison Table light mode fix ── */
html.light .comparison-grid-v3,
[data-bs-theme="light"] .comparison-grid-v3 {
    background: rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

html.light .comp-cell,
[data-bs-theme="light"] .comp-cell {
    color: var(--mj-text-muted) !important;
}

html.light .feature-label,
[data-bs-theme="light"] .feature-label {
    color: var(--mj-text) !important;
    border-right-color: rgba(0, 0, 0, 0.06) !important;
}

html.light .maj-highlight,
[data-bs-theme="light"] .maj-highlight {
    color: var(--mj-text) !important;
    font-weight: 800 !important;
    background: rgba(0, 152, 178, 0.06) !important;
}

html.light .header-row .comp-cell,
[data-bs-theme="light"] .header-row .comp-cell {
    color: var(--mj-text) !important;
}

html.light .header-row,
[data-bs-theme="light"] .header-row {
    background: rgba(0, 0, 0, 0.04) !important;
}

html.light .comp-row,
[data-bs-theme="light"] .comp-row {
    border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

html.light .others-col,
[data-bs-theme="light"] .others-col {
    border-right-color: rgba(0, 0, 0, 0.06) !important;
}

/* ── 6. Copilot AI / Neon Text Fix in light mode ── */
html.light [style*="text-shadow"],
[data-bs-theme="light"] [style*="text-shadow"] {
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.2) !important;
}

/* Exception: cyan and red brand still keep their neon */
html.light .text-glow-red,
[data-bs-theme="light"] .text-glow-red {
    color: var(--brand-red) !important;
    text-shadow: 0 0 20px rgba(227, 27, 35, 0.4) !important;
}

html.light .text-glow-cyan,
[data-bs-theme="light"] .text-glow-cyan {
    color: var(--brand-cyan) !important;
    text-shadow: 0 0 15px rgba(8, 145, 178, 0.4) !important;
}

/* ── 7. Currency Strength Cards ── */
html.light .glass-card-strength,
[data-bs-theme="light"] .glass-card-strength {
    background: rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

html.light .glass-card-strength h3,
[data-bs-theme="light"] .glass-card-strength h3 {
    color: var(--mj-text) !important;
}

/* ── 8. Heatmap section badges & Container ── */
html.light .badge-glass-cyan,
[data-bs-theme="light"] .badge-glass-cyan {
    background: rgba(0, 152, 178, 0.1) !important;
    border-color: rgba(0, 152, 178, 0.3) !important;
}

html.light .heatmap-glass-container,
[data-bs-theme="light"] .heatmap-glass-container {
    background: rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

/* Ensure heatmap widget iframe maintains its intended TradingView theme background */
html.light .heatmap-widget iframe,
[data-bs-theme="light"] .heatmap-widget iframe {
    /* Removed transparent background to allow TV to draw its light/dark grid */
    border-radius: 12px;
}

/* ── 9. Satellite labels fix ── */
html.light .sat-label,
[data-bs-theme="light"] .sat-label {
    color: var(--mj-text) !important;
}

html.light .sat-inner,
[data-bs-theme="light"] .sat-inner {
    background: rgba(0, 0, 0, 0.05) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* ── 10. Academy Authority light mode ── */
html.light .academy-authority-ultimate,
[data-bs-theme="light"] .academy-authority-ultimate {
    background: var(--bg-main, #f8fafc) !important;
}

html.light .academy-heading-v2,
[data-bs-theme="light"] .academy-heading-v2 {
    color: var(--mj-text) !important;
}

html.light .academy-lead-v2,
[data-bs-theme="light"] .academy-lead-v2 {
    color: var(--mj-text-muted) !important;
}

html.light .path-step-card h5,
[data-bs-theme="light"] .path-step-card h5 {
    color: var(--mj-text) !important;
}

html.light .node-body-v2 h6,
[data-bs-theme="light"] .node-body-v2 h6 {
    color: var(--mj-text) !important;
}

/* ── 11. Sovereign Galactic Core card text ── */
html.light .sovereign-galactic-core,
[data-bs-theme="light"] .sovereign-galactic-core {
    background: var(--bg-main, #f8fafc) !important;
}

html.light .sovereign-galactic-core h2,
[data-bs-theme="light"] .sovereign-galactic-core h2 {
    color: var(--mj-text) !important;
}

/* ── 12. Tech Core section ── */
html.light .orbital-node h4,
[data-bs-theme="light"] .orbital-node h4 {
    color: var(--mj-text) !important;
}

html.light .orbital-node p,
[data-bs-theme="light"] .orbital-node p {
    color: var(--mj-text-muted) !important;
}

html.light .tech-heading-display,
[data-bs-theme="light"] .tech-heading-display {
    color: var(--mj-text) !important;
}

html.light .tech-lead-text,
[data-bs-theme="light"] .tech-lead-text {
    color: var(--mj-text-muted) !important;
}

/* ── 13. Trust Bar ── */
html.light .trust-bar-compact,
[data-bs-theme="light"] .trust-bar-compact {
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

html.light .trust-text,
[data-bs-theme="light"] .trust-text {
    color: var(--mj-text-muted) !important;
}

/* ── 14. Section-level text-slate-400 classes ── */
html.light .text-slate-400,
[data-bs-theme="light"] .text-slate-400 {
    color: var(--mj-text-muted) !important;
}

/* ── 15. Smart Analysis Grid light mode ── */
html.light .comparison-sovereign-outer,
[data-bs-theme="light"] .comparison-sovereign-outer {
    border-top-color: rgba(0, 0, 0, 0.06) !important;
}

/* ────────────────────────────────────────────────────────
   16. Copilot AI Section - white text fix
   ──────────────────────────────────────────────────────── */
html.light .copilot-ai-section,
[data-bs-theme="light"] .copilot-ai-section {
    background: var(--bg-main, #f8fafc) !important;
}

html.light .copilot-ai-section h2,
html.light .copilot-ai-section h4,
html.light .copilot-ai-section p,
html.light .copilot-ai-section span,
html.light .copilot-ai-section li,
[data-bs-theme="light"] .copilot-ai-section span {
    color: var(--mj-text) !important;
}

/* Fix hard-coded rgba(255,255,255,0.9) spans in listings */
html.light [style*="rgba(255,255,255,0.9)"],
[data-bs-theme="light"] [style*="rgba(255,255,255,0.9)"] {
    color: var(--mj-text) !important;
}

html.light [style*="rgba(255,255,255,0.7)"],
[data-bs-theme="light"] [style*="rgba(255,255,255,0.7)"] {
    color: var(--mj-text-muted) !important;
}

html.light [style*="rgba(255,255,255,0.6)"],
[data-bs-theme="light"] [style*="rgba(255,255,255,0.6)"] {
    color: var(--mj-text-muted) !important;
}

/* ────────────────────────────────────────────────────────
   17. CTA Section - text stays white (colored background)
   ──────────────────────────────────────────────────────── */
/* CTA section has gradient background, keep white text */
html.light .cta-section h2,
html.light .cta-section p,
[data-bs-theme="light"] .cta-section h2,
[data-bs-theme="light"] .cta-section p {
    color: #ffffff !important;
}

/* ────────────────────────────────────────────────────────
   18. orbital-master-container / tech core nodes
   ──────────────────────────────────────────────────────── */
html.light .orbital-node,
[data-bs-theme="light"] .orbital-node {
    background: rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

/* ────────────────────────────────────────────────────────
   19. text-theme-secondary catch-all for inline styles
   ──────────────────────────────────────────────────────── */
html.light .text-theme-secondary,
[data-bs-theme="light"] .text-theme-secondary {
    color: var(--mj-text-muted) !important;
}

html.light .text-theme-primary,
[data-bs-theme="light"] .text-theme-primary {
    color: var(--mj-text) !important;
}

/* ────────────────────────────────────────────────────────
   20. Glassmorphism cards with rgba(255,255,255,0.05) bg
   ──────────────────────────────────────────────────────── */
html.light [style*="rgba(255,255,255,0.05)"],
[data-bs-theme="light"] [style*="rgba(255,255,255,0.05)"] {
    background: rgba(0, 0, 0, 0.03) !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

html.light [style*="rgba(255,255,255,0.02)"],
[data-bs-theme="light"] [style*="rgba(255,255,255,0.02)"] {
    background: rgba(0, 0, 0, 0.02) !important;
}

/* ────────────────────────────────────────────────────────
   21. Overflow:hidden sections - allow visibility in child containers
   ──────────────────────────────────────────────────────── */
section.overflow-hidden>.container {
    overflow: visible;
}

/* ────────────────────────────────────────────────────────
   22. sovereign-galactic-core section
   ──────────────────────────────────────────────────────── */
html.light .sovereign-galactic-core,
[data-bs-theme="light"] .sovereign-galactic-core {
    background: var(--bg-main, #f8fafc) !important;
}

html.light .sovereing-header h2,
html.light .sovereign-title,
[data-bs-theme="light"] .sovereign-title {
    color: var(--mj-text) !important;
}

/* ────────────────────────────────────────────────────────
   23. Majara Glass Cards (navacore section)
   ──────────────────────────────────────────────────────── */
html.light .majara-glass-card,
[data-bs-theme="light"] .majara-glass-card {
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

html.light .majara-glass-card h4,
html.light .majara-glass-card p,
[data-bs-theme="light"] .majara-glass-card h4,
[data-bs-theme="light"] .majara-glass-card p {
    color: var(--mj-text) !important;
}

/* ────────────────────────────────────────────────────────
   24. Body Background & Global z-index fixes
   ──────────────────────────────────────────────────────── */
html.light body,
[data-bs-theme="light"] body {
    background-color: var(--bg-main, #f8fafc) !important;
    color: var(--mj-text) !important;
}

/* Fix Portal Canvas from overlaying content */
#portal-canvas {
    z-index: -1 !important;
}

/* Ensure sections have a higher z-index than canvas */
section,
main,
footer,
body>.container,
body>.container-fluid {
    position: relative;
    z-index: 10;
}

/* Hero Slider Section specific fixes */
.hero-slider-section {
    z-index: 5;
    background: #000;
    /* Keep hero dark so images pop */
}


/* ── 5. تحسين وضوح جميع النصوص في الوضع الفاتح ── */
html.light,
[data-bs-theme="light"] {
    color: #0f172a !important;
}

html.light h1,
html.light h2,
html.light h3,
html.light h4,
html.light h5,
html.light h6,
[data-bs-theme="light"] h1,
[data-bs-theme="light"] h2,
[data-bs-theme="light"] h3,
[data-bs-theme="light"] h4,
[data-bs-theme="light"] h5,
[data-bs-theme="light"] h6 {
    color: #0f172a !important;
    font-weight: 700 !important;
}

html.light p,
html.light span:not(.btn):not(.badge),
html.light div:not(.btn):not(.badge),
[data-bs-theme="light"] p,
[data-bs-theme="light"] span:not(.btn):not(.badge),
[data-bs-theme="light"] div:not(.btn):not(.badge) {
    color: #1e293b !important;
}

html.light .lead,
[data-bs-theme="light"] .lead {
    color: #475569 !important;
    font-weight: 500 !important;
}

/* ── 6. تحسين الكروت والبطاقات ── */
html.light .card,
html.light .button-card,
html.light [class*="card"],
[data-bs-theme="light"] .card,
[data-bs-theme="light"] .button-card,
[data-bs-theme="light"] [class*="card"] {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

html.light .card *,
html.light .button-card *,
[data-bs-theme="light"] .card *,
[data-bs-theme="light"] .button-card * {
    color: inherit;
}

html.light .card h1,
html.light .card h2,
html.light .card h3,
html.light .card h4,
html.light .card h5,
html.light .card h6,
[data-bs-theme="light"] .card h1,
[data-bs-theme="light"] .card h2,
[data-bs-theme="light"] .card h3,
[data-bs-theme="light"] .card h4,
[data-bs-theme="light"] .card h5,
[data-bs-theme="light"] .card h6 {
    color: #0f172a !important;
}

html.light .card p,
html.light .card span,
[data-bs-theme="light"] .card p,
[data-bs-theme="light"] .card span {
    color: #475569 !important;
}

/* ── 7. تحسين الخلفيات ── */
html.light body,
[data-bs-theme="light"] body {
    background-color: #f1f5f9 !important;
}

html.light .test-section,
[data-bs-theme="light"] .test-section {
    background-color: #f1f5f9 !important;
}

/* ── 8. تحسين التباين للنصوص الثانوية ── */
html.light .text-muted,
html.light .text-secondary,
[data-bs-theme="light"] .text-muted,
[data-bs-theme="light"] .text-secondary {
    color: #64748b !important;
    font-weight: 500 !important;
}

/* ── 9. إصلاح الأيقونات والرموز ── */
html.light i,
html.light .fa,
html.light .fas,
html.light .far,
[data-bs-theme="light"] i,
[data-bs-theme="light"] .fa,
[data-bs-theme="light"] .fas,
[data-bs-theme="light"] .far {
    color: inherit;
}