/* =====================================================================
   Faith in God — Light Mode Theme Polish (v4)
   ---------------------------------------------------------------------
   Loaded AFTER style.css and updates-v3.css.

   Goal: in light mode the cards used to share the page's near-white
   background, so they didn't visually separate. This file:
     1. Tints the page bg so white-ish cards now have something to pop on.
     2. Replaces flat-white card backgrounds with subtle, on-brand
        gradients that read clearly without overpowering content.
     3. Strengthens borders and shadows in light mode for crisp edges.
     4. Polishes button & link colours so CTAs stand out cleanly.

   Dark mode is left entirely untouched — every override is scoped to
   [data-theme="light"] (or :not([data-theme="dark"]) for variable
   overrides where light is the default).
   ===================================================================== */

/* ---------- 1. Variable overrides for LIGHT mode -----------------------
   :root has the lowest specificity, so [data-theme="dark"] wins when set.
   We re-declare :root values here so the LIGHT defaults are richer.
----------------------------------------------------------------------- */
:root:not([data-theme="dark"]) {
    /* Page background: very soft, multi-stop violet → cream → blush.
       The body uses `background:` shorthand so a gradient renders fine. */
    --fig-bg:           linear-gradient(180deg, #f5f0ff 0%, #faf5ff 25%, #fef3f9 65%, #fff7ed 100%);
    --fig-bg-alt:       linear-gradient(180deg, #f9f5ff 0%, #fdf2f8 100%);

    /* Card surfaces: subtle white → tint gradient (still essentially "white"
       but with a clear corner-to-corner shift). */
    --fig-surface:      linear-gradient(160deg, #ffffff 0%, #faf5ff 55%, #fdf2f8 100%);
    --fig-bg-elevated:  linear-gradient(160deg, #ffffff 0%, #f5f0ff 100%);

    /* Borders: tinted purple, more visible against white-ish cards */
    --fig-border:        #e2d4f7;
    --fig-border-strong: #c4b0f0;

    /* Shadows: tinted purple, more visible on light bg */
    --fig-shadow-sm: 0 2px 6px rgba(124, 58, 237, 0.06);
    --fig-shadow:    0 8px 28px rgba(124, 58, 237, 0.10), 0 2px 6px rgba(31, 41, 55, 0.04);
    --fig-shadow-lg: 0 22px 60px rgba(124, 58, 237, 0.16), 0 4px 12px rgba(31, 41, 55, 0.05);

    /* Slightly punchier text in light mode for crisp reading on tinted cards */
    --fig-text:       #1a1530;
    --fig-text-soft:  #3d2f6b;
    --fig-text-muted: #6b5b8e;

    /* Form fields stand off the (now gradient) card surface */
    --fig-input-bg:        #ffffff;
    --fig-input-border:    #d4c4f5;
    --fig-input-bg-focus:  #ffffff;
    --fig-input-autofill:  #faf5ff;
}

/* The body's background needs to be fixed so the page-long gradient
   doesn't repeat at every viewport. */
html[data-theme="light"] body,
html:not([data-theme="dark"]) body {
    background-attachment: fixed;
}

/* ---------- 2. Card surfaces: per-section tinted gradients -------------
   Different sections feel different (warmer for prayer wall, parchment
   for scripture, lavender for plans) but all stay light & legible.
----------------------------------------------------------------------- */

/* Generic / admin-style cards used throughout */
[data-theme="light"] .fig-card,
[data-theme="light"] .fig-stat-card,
[data-theme="light"] .fig-ai-card,
[data-theme="light"] .fig-blog-card,
[data-theme="light"] .fig-yt-card,
[data-theme="light"] .fig-bsd-related-card,
[data-theme="light"] .fig-bsd-day,
[data-theme="light"] .fig-prayer-form-box,
[data-theme="light"] .fig-sidebar-box,
[data-theme="light"] .fig-comment {
    background: linear-gradient(155deg, #ffffff 0%, #faf5ff 55%, #fdf2f8 100%);
    border: 1px solid #e2d4f7;
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.07), 0 1px 3px rgba(0, 0, 0, 0.04);
}

/* Blog post teaser cards on home & blog pages — slightly more pink */
[data-theme="light"] .fig-post-card {
    background: linear-gradient(160deg, #ffffff 0%, #fdf4ff 55%, #fdf2f8 100%);
    border: 1px solid #e9d5ff;
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
}
[data-theme="light"] .fig-post-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 44px rgba(124, 58, 237, 0.18), 0 4px 12px rgba(0, 0, 0, 0.06);
    border-color: #c4b5fd;
}

/* Pillars of Faith — richer purple wash, anchored by white top */
[data-theme="light"] .fig-pillar {
    background: linear-gradient(160deg, #ffffff 0%, #f5f0ff 50%, #ede4ff 100%);
    border: 1px solid #d8c5ff;
    box-shadow: 0 8px 26px rgba(124, 58, 237, 0.12), 0 1px 3px rgba(0, 0, 0, 0.04);
}
[data-theme="light"] .fig-pillar:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 48px rgba(124, 58, 237, 0.20);
    border-color: #b89cf5;
}

/* Scripture promise cards — parchment / amber wash for that "stained-glass" feel */
[data-theme="light"] .fig-promise {
    background: linear-gradient(165deg, #ffffff 0%, #fffbeb 55%, #fef3c7 100%);
    border: 1px solid #fde68a;
    box-shadow: 0 8px 26px rgba(245, 158, 11, 0.14), 0 1px 3px rgba(0, 0, 0, 0.04);
}
[data-theme="light"] .fig-promise blockquote {
    color: #4a2f0a;
}
[data-theme="light"] .fig-promise figcaption {
    color: #b45309;
}
[data-theme="light"] .fig-promise:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 44px rgba(245, 158, 11, 0.20);
    border-color: #f59e0b;
}

/* Prayer wall cards — warm candle-glow rose/peach */
[data-theme="light"] .fig-wall-card {
    background: linear-gradient(160deg, #ffffff 0%, #fff5f7 50%, #fef3f2 100%);
    border: 1px solid #fbcfe8;
    box-shadow: 0 8px 24px rgba(236, 72, 153, 0.12), 0 1px 3px rgba(0, 0, 0, 0.04);
}
[data-theme="light"] .fig-wall-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(236, 72, 153, 0.20);
    border-color: #f9a8d4;
}

/* Bible study plan cards — purple/pink wash matching brand */
[data-theme="light"] .fig-plan-card {
    background: linear-gradient(160deg, #ffffff 0%, #faf5ff 50%, #fdf2f8 100%);
    border: 1px solid #e9d5ff;
    box-shadow: 0 6px 20px rgba(124, 58, 237, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
}
[data-theme="light"] .fig-plan-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 44px rgba(124, 58, 237, 0.18);
    border-color: #c4b5fd;
}

/* Bible study detail page — daily entry rows */
[data-theme="light"] .fig-bsd-day {
    background: linear-gradient(160deg, #ffffff 0%, #faf5ff 100%);
    border: 1px solid #e2d4f7;
    box-shadow: 0 4px 14px rgba(124, 58, 237, 0.06), 0 1px 3px rgba(0, 0, 0, 0.03);
}
[data-theme="light"] .fig-bsd-day:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(124, 58, 237, 0.14);
    border-color: #c4b5fd;
}
/* Reading/prayer/reflection blocks inside study days */
[data-theme="light"] .fig-bsd-block            { background: rgba(124, 58, 237, 0.05); }
[data-theme="light"] .fig-bsd-block.prayer     { background: rgba(236, 72, 153, 0.05); }
[data-theme="light"] .fig-bsd-block.reflection { background: rgba(245, 158, 11, 0.06); }
[data-theme="light"] .fig-bsd-anchors {
    background: linear-gradient(160deg, #ffffff 0%, #faf5ff 100%);
    border: 1px dashed #c4b5fd;
}
[data-theme="light"] .fig-bsd-anchors li {
    background: #ffffff;
    border: 1px solid #e2d4f7;
    color: #3d2f6b;
}
[data-theme="light"] .fig-bsd-related-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 38px rgba(124, 58, 237, 0.16);
    border-color: #c4b5fd;
}

/* AI cards (homepage Daily Verse / Prayer / Inspiration) */
[data-theme="light"] .fig-ai-card {
    background: linear-gradient(160deg, #ffffff 0%, #faf5ff 50%, #fef3c7 100%);
    border: 1px solid #ddd6fe;
    box-shadow: 0 8px 26px rgba(124, 58, 237, 0.10), 0 1px 3px rgba(0, 0, 0, 0.04);
}
[data-theme="light"] .fig-ai-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 44px rgba(124, 58, 237, 0.18);
}

/* Stat cards (admin/public stats) */
[data-theme="light"] .fig-stat-card {
    background: linear-gradient(135deg, #ffffff 0%, #f5f0ff 100%);
    border: 1px solid #ddd6fe;
}

/* Generic .fig-card hover for the rest */
[data-theme="light"] .fig-card:hover {
    box-shadow: 0 14px 36px rgba(124, 58, 237, 0.13);
}

/* ---------- 3. Section background washes (alternating sections) -------- */

/* The .fig-bg-alt utility (used as section bg) — soft pink-cream wash */
[data-theme="light"] .fig-bg-alt,
[data-theme="light"] .fig-section-alt,
[data-theme="light"] .fig-bsd-related {
    background: linear-gradient(180deg, #faf5ff 0%, #fdf2f8 50%, #fff7ed 100%);
}

/* AI section: keep its existing gradient but ensure cards inside contrast */
[data-theme="light"] .fig-ai-section {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.06), rgba(236, 72, 153, 0.05) 50%, rgba(245, 158, 11, 0.05));
}

/* ---------- 4. Buttons & links: vivid, readable, on-brand --------------- */

/* Primary CTA — already gradient purple, just stronger shadow */
[data-theme="light"] .fig-btn-primary,
[data-theme="light"] .fig-btn.fig-btn-primary {
    background: linear-gradient(135deg, #7c3aed 0%, #a855f7 50%, #d946ef 100%);
    color: #ffffff;
    border: none;
    box-shadow: 0 8px 20px rgba(124, 58, 237, 0.32), 0 2px 6px rgba(124, 58, 237, 0.18);
}
[data-theme="light"] .fig-btn-primary:hover {
    box-shadow: 0 14px 32px rgba(124, 58, 237, 0.42), 0 3px 10px rgba(124, 58, 237, 0.25);
    transform: translateY(-1px);
}

/* Accent CTA — amber, warm */
[data-theme="light"] .fig-btn-accent,
[data-theme="light"] .fig-btn.fig-btn-accent {
    background: linear-gradient(135deg, #f59e0b 0%, #ef4444 100%);
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.32), 0 2px 6px rgba(245, 158, 11, 0.18);
}
[data-theme="light"] .fig-btn-accent:hover {
    box-shadow: 0 14px 32px rgba(245, 158, 11, 0.42);
    transform: translateY(-1px);
}

/* Outline button — make the border + text a strong purple so it pops on white-ish cards */
[data-theme="light"] .fig-btn-outline,
[data-theme="light"] .fig-btn.fig-btn-outline {
    background: #ffffff;
    color: #6d28d9;
    border: 2px solid #7c3aed;
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.10);
}
[data-theme="light"] .fig-btn-outline:hover {
    background: linear-gradient(135deg, #7c3aed, #a855f7);
    color: #ffffff;
    border-color: #7c3aed;
    box-shadow: 0 10px 26px rgba(124, 58, 237, 0.32);
}

/* Ghost button — subtle tinted bg so it's visible on light cards */
[data-theme="light"] .fig-btn-ghost,
[data-theme="light"] .fig-btn.fig-btn-ghost {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.08), rgba(236, 72, 153, 0.06));
    color: #6d28d9;
    border: 1px solid #c4b5fd;
}
[data-theme="light"] .fig-btn-ghost:hover {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.18), rgba(236, 72, 153, 0.12));
    color: #5b21b6;
    border-color: #7c3aed;
}

/* Read-more / arrow links inside post cards */
[data-theme="light"] .fig-read-more,
[data-theme="light"] .fig-pillar-link,
[data-theme="light"] .fig-jstep-link,
[data-theme="light"] a.fig-read-more {
    color: #6d28d9;
    font-weight: 600;
}
[data-theme="light"] .fig-read-more:hover,
[data-theme="light"] .fig-pillar-link:hover,
[data-theme="light"] .fig-jstep-link:hover {
    color: #5b21b6;
}

/* In-prose links: keep brand purple, ensure underline-readability on light bg */
[data-theme="light"] .fig-post-content a,
[data-theme="light"] .fig-prose a {
    color: #6d28d9;
    text-decoration: underline;
    text-decoration-color: rgba(109, 40, 217, 0.35);
    text-underline-offset: 3px;
}
[data-theme="light"] .fig-post-content a:hover,
[data-theme="light"] .fig-prose a:hover {
    color: #5b21b6;
    text-decoration-color: #5b21b6;
}

/* Pills/chips on cards (study plan meta, prayer status, etc.) */
[data-theme="light"] .fig-plan-pill {
    background: rgba(124, 58, 237, 0.10);
    color: #5b21b6;
    border: 1px solid rgba(124, 58, 237, 0.20);
}
[data-theme="light"] .fig-plan-pill-theme {
    background: rgba(217, 70, 239, 0.12);
    color: #a21caf;
    border: 1px solid rgba(217, 70, 239, 0.25);
}
[data-theme="light"] .fig-bsd-day-scripture { color: #6d28d9; font-weight: 600; }

/* Donation CTA hearts and similar accents — ensure strong colour */
[data-theme="light"] .fig-btn-primary i.fa-heart,
[data-theme="light"] .fig-btn-accent i.fa-heart {
    color: #fecaca;
}

/* ---------- 5. Form fields: clear edges on tinted cards ---------------- */

[data-theme="light"] .fig-form input[type="text"],
[data-theme="light"] .fig-form input[type="email"],
[data-theme="light"] .fig-form input[type="tel"],
[data-theme="light"] .fig-form input[type="url"],
[data-theme="light"] .fig-form input[type="password"],
[data-theme="light"] .fig-form input[type="number"],
[data-theme="light"] .fig-form select,
[data-theme="light"] .fig-form textarea,
[data-theme="light"] .fig-newsletter-form input {
    background: #ffffff;
    border: 1.5px solid #d4c4f5;
    color: #1a1530;
}
[data-theme="light"] .fig-form input:focus,
[data-theme="light"] .fig-form select:focus,
[data-theme="light"] .fig-form textarea:focus {
    border-color: #7c3aed;
    box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.15);
}
[data-theme="light"] .fig-form label {
    color: #3d2f6b;
    font-weight: 600;
}

/* ---------- 6. Misc readability fixes ---------------------------------- */

/* Section heading subtitle — was muted gray, ensure readable on tinted bg */
[data-theme="light"] .fig-section-sub { color: #4b3a73; }
[data-theme="light"] .fig-section-eyebrow { color: #6d28d9; font-weight: 700; }

/* Post titles a touch darker for crisp reading */
[data-theme="light"] .fig-post-title a { color: #1a1530; }
[data-theme="light"] .fig-post-title a:hover { color: #6d28d9; }

/* Post-meta small text */
[data-theme="light"] .fig-post-meta,
[data-theme="light"] .fig-post-meta span,
[data-theme="light"] .fig-stats span { color: #6b5b8e; }

/* Plan-card body text on tinted cards */
[data-theme="light"] .fig-plan-card p,
[data-theme="light"] .fig-bsd-related-card p { color: #4b3a73; }

/* Study-plan inner verse-list panel */
[data-theme="light"] .fig-plan-verses {
    background: rgba(124, 58, 237, 0.06);
    border: 1px dashed rgba(124, 58, 237, 0.30);
}
[data-theme="light"] .fig-plan-verses li {
    background: #ffffff;
    border: 1px solid #e2d4f7;
    color: #3d2f6b;
}

/* Footer is dark on both themes; no changes needed there. */

/* ---------- 7. Prayer Wall pager (v4 added) ---------------------------- */
[data-theme="light"] .fig-pw-pager-btn {
    background: rgba(124, 58, 237, 0.08);
    border-color: rgba(124, 58, 237, 0.25);
    color: #6d28d9;
}
[data-theme="light"] .fig-pw-pager-btn:hover:not(:disabled) {
    background: rgba(124, 58, 237, 0.18);
}
[data-theme="light"] .fig-pw-dot {
    border-color: rgba(124, 58, 237, 0.30);
    color: #6b5b8e;
}
[data-theme="light"] .fig-pw-dot:hover {
    background: rgba(124, 58, 237, 0.10);
    color: #6d28d9;
}
[data-theme="light"] .fig-pw-dot.active {
    background: linear-gradient(135deg, #7c3aed, #a855f7);
    color: #ffffff;
    border-color: #7c3aed;
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.30);
}
