/* ============================================================
   DARK MODE THEME — PayDay Portal by Gratuity Solutions
   External stylesheet for all [data-theme="dark"] overrides.
   Include AFTER the page's inline <style> block.
   ============================================================ */

/* ---------- CSS Custom Property Overrides ---------- */
[data-theme="dark"] {
  --text-primary: #f1f5f9;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;
  --text-light: #64748b;
  --bg-white: #1e293b;
  --bg-light: #0f172a;
  --bg-lighter: #1a2332;
  --bg-sky: #0c1424;
  --border-color: #334155;
  --border-light: #475569;
  --card-bg: #1e293b;
  --nav-bg: rgba(15, 23, 42, 0.98);
  --nav-border: rgba(255, 255, 255, 0.08);
  --nav-shadow: rgba(0, 0, 0, 0.4);
  --mega-bg: #1a2332;
  --mega-border: #334155;
  --mega-hover: #0f172a;
  --mega-title-color: #f1f5f9;
  --mega-desc-color: #94a3b8;
  --mega-left-bg: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
  --mega-left-hover: linear-gradient(135deg, #1e40af 0%, #1e3a5f 100%);
  --mega-badge-bg: rgba(34, 197, 94, 0.15);
  --search-results-bg: #1a2332;
  --search-result-border: rgba(255, 255, 255, 0.06);
  --search-result-hover: rgba(255, 255, 255, 0.06);
  --search-result-color: #cbd5e1;
  --calc-results-bg: linear-gradient(135deg, #1e3a5f, #2d1f5e);
  --carousel-bg: #060d1a;
  --carousel-border: rgba(255, 255, 255, 0.04);
  --cta-bg: linear-gradient(180deg, #0f1e3a 0%, #162b52 50%, #0f1e3a 100%);
  --footer-bg: #060d1a;
  --card-shadow-hover: rgba(0, 0, 0, 0.3);
  --card-border-hover: rgba(37, 99, 235, 0.25);
  --video-overlay: rgba(0, 0, 0, 0.9);
  --blue-light: #1e3a5f;
}

/* ---------- Background Helpers ---------- */
[data-theme="dark"] .bg-sky   { background: linear-gradient(180deg, #0c1424 0%, #0e1828 60%, #0b1120 100%); }
[data-theme="dark"] .bg-dark  { background: linear-gradient(135deg, #060d1a 0%, #0b1526 100%); }
[data-theme="dark"] .bg-white { background: var(--bg-white); }
[data-theme="dark"] .bg-light { background: var(--bg-light); }

/* ---------- Navigation & Mega Menus ---------- */
[data-theme="dark"] .mega-menu                          { background: var(--mega-bg); border-color: var(--mega-border); box-shadow: 0 16px 48px rgba(0,0,0,0.4); }
[data-theme="dark"] .mega-menu-img                      { background: #0f1729; border-right-color: var(--mega-border); }
[data-theme="dark"] .mega-menu-card:hover               { background: var(--mega-hover); }
[data-theme="dark"] .mega-menu-card-text .mega-menu-card-title             { color: var(--mega-title-color); }
[data-theme="dark"] .mega-menu-card-text p              { color: var(--mega-desc-color); }
[data-theme="dark"] .mega-menu-featured-left            { background: var(--mega-left-bg); border-right-color: var(--mega-border); }
[data-theme="dark"] .mega-menu-featured-left:hover      { background: var(--mega-left-hover); }
[data-theme="dark"] .mega-menu-featured-left .featured-left-title  { color: var(--mega-title-color); }
[data-theme="dark"] .mega-menu-featured-left .featured-left-pitch  { color: var(--mega-desc-color); }
[data-theme="dark"] .mega-menu-featured-left .featured-left-stat   { color: #cbd5e1; }
[data-theme="dark"] .mega-menu-featured-left .featured-badge       { background: var(--mega-badge-bg); }

/* ---------- Search ---------- */
[data-theme="dark"] .search-results          { background: var(--search-results-bg); border-color: var(--mega-border); }
[data-theme="dark"] .search-result-item      { color: var(--search-result-color); border-bottom-color: var(--search-result-border); }
[data-theme="dark"] .search-result-item:hover { background: var(--search-result-hover); color: #f1f5f9; }

/* ---------- Cards & Components ---------- */
[data-theme="dark"] .feature-card:hover      { box-shadow: 0 12px 32px var(--card-shadow-hover); border-color: var(--card-border-hover); }
[data-theme="dark"] .compare-table           { background: var(--card-bg); }
[data-theme="dark"] .compare-table thead th.them { background: #334155; }
[data-theme="dark"] .compare-table tbody td  { border-bottom-color: var(--border-color); }
[data-theme="dark"] .compare-table tbody td:first-child { background: rgba(37,99,235,0.05); }
[data-theme="dark"] .calc-results            { background: var(--calc-results-bg); }
[data-theme="dark"] .video-modal             { background: var(--video-overlay); }

/* Card-type elements — shared pattern */
[data-theme="dark"] .feature-card,
[data-theme="dark"] .faq-item,
[data-theme="dark"] .pricing-card,
[data-theme="dark"] .blog-card,
[data-theme="dark"] .case-card,
[data-theme="dark"] .step-card,
[data-theme="dark"] .benefit-card,
[data-theme="dark"] .partner-card,
[data-theme="dark"] .solution-card,
[data-theme="dark"] .platform-card,
[data-theme="dark"] .metric-card,
[data-theme="dark"] .timeline-card,
[data-theme="dark"] .contact-card,
[data-theme="dark"] .info-card,
[data-theme="dark"] .accordion-item,
[data-theme="dark"] .guide-card,
[data-theme="dark"] .guide-section,
[data-theme="dark"] .compare-card,
[data-theme="dark"] .problem-card,
[data-theme="dark"] .solution-detail-card { background: var(--card-bg); border-color: var(--border-color); }

[data-theme="dark"] .pricing-card-featured    { border-color: var(--blue-primary); }
[data-theme="dark"] .pricing-card             { border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .pricing-divider          { background: rgba(255,255,255,0.08); }
[data-theme="dark"] .pricing-cta-outline      { border-color: rgba(255,255,255,0.12); color: var(--text-primary); }
[data-theme="dark"] .pricing-cta-outline:hover { border-color: var(--blue-primary); color: var(--blue-primary); background: rgba(37,99,235,0.08); }
[data-theme="dark"] .pricing-included-badge   { background: rgba(37,99,235,0.15); color: #60a5fa; }
[data-theme="dark"] .accordion-header        { color: var(--text-primary); }
[data-theme="dark"] .kickfin-row             { border-color: var(--border-color); }

/* ---------- FAQ ---------- */
[data-theme="dark"] .faq-tab-btn             { background: var(--card-bg); border-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .faq-tab-btn:hover       { background: rgba(37,99,235,0.15); }
[data-theme="dark"] .faq-question            { color: var(--text-primary); }
[data-theme="dark"] .faq-question:hover      { background: rgba(37,99,235,0.1); }
[data-theme="dark"] .faq-question.open       { background: rgba(37,99,235,0.1); }
[data-theme="dark"] .tab-btn                 { background: var(--card-bg); border-color: var(--border-color); color: var(--text-primary); }

/* ---------- Interactive Diagram (RTP) ---------- */
[data-theme="dark"] .rtp-node-inner          { background: var(--card-bg); border-color: var(--border-color); box-shadow: 0 2px 12px rgba(0,0,0,0.2); }
[data-theme="dark"] .rtp-node:hover .rtp-node-inner { border-color: rgba(37,99,235,0.5); box-shadow: 0 6px 28px rgba(37,99,235,0.25); }
[data-theme="dark"] .rtp-node.active .rtp-node-inner { background: rgba(37,99,235,0.1); }
[data-theme="dark"] .rtp-orbit-ring          { border-color: rgba(37,99,235,0.15); }
[data-theme="dark"] .rtp-orbit-ring-3        { border-color: rgba(37,99,235,0.1); }
[data-theme="dark"] .rtp-line                { stroke: rgba(37,99,235,0.2); }
[data-theme="dark"] .rtp-line.active         { stroke: rgba(37,99,235,0.6); }

/* ---------- Support / Contact Pages ---------- */
[data-theme="dark"] .support-right           { background: var(--card-bg); }

/* ---------- Forms ---------- */
[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group select,
[data-theme="dark"] .form-group textarea     { background: var(--card-bg); color: var(--text-primary); border-color: var(--border-light); }
[data-theme="dark"] .form-field input,
[data-theme="dark"] .form-field textarea,
[data-theme="dark"] .form-field select       { background: var(--bg-light); color: var(--text-primary); border-color: var(--border-color); }
[data-theme="dark"] .form-field input:focus,
[data-theme="dark"] .form-field textarea:focus,
[data-theme="dark"] .form-field select:focus { border-color: var(--blue-primary); box-shadow: 0 0 0 3px rgba(37,99,235,0.2); }
[data-theme="dark"] .calc-row input[type="number"] { background: var(--card-bg); color: var(--text-primary); border-color: var(--border-light); }

/* ---------- Hero Banner ---------- */
[data-theme="dark"] .hero-banner             { background: linear-gradient(135deg, #0b1526 0%, #132144 100%); }

/* ---------- Blog Page Dark Mode ---------- */
[data-theme="dark"] .hero                    { background: linear-gradient(180deg, #0b1526 0%, #111c36 60%, var(--bg-light) 100%); }
[data-theme="dark"] .hero::before            { background: radial-gradient(circle, rgba(37,99,235,0.15) 0%, transparent 65%); }
[data-theme="dark"] .hero::after             { background: radial-gradient(circle, rgba(124,58,237,0.12) 0%, transparent 65%); }
[data-theme="dark"] .hero-stat .num          { color: var(--blue-primary) !important; }
[data-theme="dark"] .featured-img            { background: linear-gradient(145deg, #0f1d36 0%, #162040 50%, #1a1545 100%); }
[data-theme="dark"] .fi-stat-card            { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .fi-stat-num             { color: var(--blue-primary) !important; }
[data-theme="dark"] .fi-badge                { background: rgba(37,99,235,0.2); border-color: rgba(37,99,235,0.3); }
[data-theme="dark"] .featured-body           { background: var(--card-bg); }
[data-theme="dark"] .filter-btn              { background: var(--card-bg); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .filter-btn:hover        { border-color: var(--blue-primary); color: var(--blue-primary); background: rgba(37,99,235,0.08); }
[data-theme="dark"] .filter-btn.active       { background: var(--blue-primary); color: #fff; border-color: transparent; }
[data-theme="dark"] .blog-search-input       { background: var(--card-bg); border-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .card                    { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .card-illust svg         { opacity: 0.7; }
[data-theme="dark"] .featured-card           { background: var(--card-bg); border-color: var(--border-color); }

/* ---------- Text Highlights ---------- */
[data-theme="dark"] .highlight-blue { background: linear-gradient(135deg, #3b82f6, #60a5fa); -webkit-background-clip: text; background-clip: text; }
[data-theme="dark"] .highlight-pink { background: linear-gradient(135deg, #f472b6, #a78bfa); -webkit-background-clip: text; background-clip: text; }

/* ---------- Dark-mode utility classes ----------
   Use these on elements with inline light backgrounds
   that need to adapt in dark mode.                    */
.dm-white-card    { background: #fff; }
.dm-gradient-card { background: linear-gradient(135deg, #dbeafe, #ede9fe); }

[data-theme="dark"] .dm-white-card    { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .dm-gradient-card { background: linear-gradient(135deg, #1e3a5f, #2d1f5e); }

/* ---------- Case Study Pages ---------- */
[data-theme="dark"] .challenge-card,
[data-theme="dark"] .solution-feature-card,
[data-theme="dark"] .result-card,
[data-theme="dark"] .why-card              { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .challenge-card:hover,
[data-theme="dark"] .solution-feature-card:hover,
[data-theme="dark"] .why-card:hover        { border-color: var(--card-border-hover); box-shadow: 0 8px 24px var(--card-shadow-hover); }
[data-theme="dark"] .challenge-callout     { background: linear-gradient(135deg, #2d1f5e 0%, #1e1545 100%); border-left-color: #7c3aed; }
[data-theme="dark"] .challenge-callout p,
[data-theme="dark"] .challenge-callout-text { color: #e2d6ff; }
[data-theme="dark"] .challenge-callout .quote-author,
[data-theme="dark"] .challenge-callout-attr { color: #c4b5fd; }
[data-theme="dark"] .section-label-outline { background: rgba(37,99,235,0.15); color: #60a5fa; border-color: rgba(37,99,235,0.3); }
[data-theme="dark"] .section-label-green   { background: rgba(34,197,94,0.15); color: #4ade80; border-color: rgba(34,197,94,0.3); }
[data-theme="dark"] .section-label-purple  { background: rgba(124,58,237,0.15); color: #a78bfa; border-color: rgba(124,58,237,0.3); }
[data-theme="dark"] .section-label-pink    { background: rgba(236,72,153,0.15); color: #f472b6; border-color: rgba(236,72,153,0.3); }
[data-theme="dark"] .result-card-icon      { background: rgba(37,99,235,0.15); }
[data-theme="dark"] .breadcrumb            { background: var(--card-bg); border-bottom-color: var(--border-color); }
[data-theme="dark"] .breadcrumb a          { color: var(--text-muted); }
[data-theme="dark"] .breadcrumb-current    { color: var(--text-primary); }
[data-theme="dark"] .location-card         { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .case-study-card       { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .case-study-card.coming-soon { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .coming-soon-badge     { background: rgba(37,99,235,0.15); color: #60a5fa; }
[data-theme="dark"] .case-study-tag        { background: rgba(255,255,255,0.15); }
[data-theme="dark"] .featured-case-study   { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .featured-right        { background: linear-gradient(135deg, rgba(37,99,235,0.06) 0%, rgba(59,130,246,0.03) 100%); }
[data-theme="dark"] .featured-headline     { color: var(--text-primary); }
[data-theme="dark"] .stat-block h3         { color: var(--blue-accent); }
[data-theme="dark"] .stat-block p          { color: var(--text-muted); }
[data-theme="dark"] .featured-quote        { background: rgba(37,99,235,0.06); border-color: rgba(37,99,235,0.2); }
[data-theme="dark"] .featured-quote-text   { color: var(--text-secondary); }
[data-theme="dark"] .featured-quote-author { color: var(--text-muted); }

/* ---------- Buttons (dark-on-light overrides) ---------- */
[data-theme="dark"] .btn-light               { background: #fff; color: #0f172a; }
[data-theme="dark"] .btn-light:hover         { background: #e2e8f0; color: #0f172a; }

/* ---------- Theme Toggle ---------- */
.theme-toggle      { background: none; border: 1px solid rgba(255,255,255,0.2); border-radius: 50%; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: rgba(255,255,255,0.7); font-size: 15px; transition: all 0.3s ease; margin-right: 12px; flex-shrink: 0; }
.theme-toggle:hover { background: rgba(255,255,255,0.1); color: #fff; border-color: rgba(255,255,255,0.4); }
.theme-toggle .fa-sun,
.pb-theme-toggle .fa-sun  { display: none !important; }
.theme-toggle .fa-moon,
.pb-theme-toggle .fa-moon { display: inline !important; }
[data-theme="dark"] .theme-toggle .fa-sun,
[data-theme="dark"] .pb-theme-toggle .fa-sun  { display: inline !important; }
[data-theme="dark"] .theme-toggle .fa-moon,
[data-theme="dark"] .pb-theme-toggle .fa-moon { display: none !important; }

/* ---------- Problems Page Interactive ---------- */
[data-theme="dark"] .problem-tab            { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .problem-tab span       { color: var(--text-secondary); }
[data-theme="dark"] .problem-tab.active     { border-color: #3b82f6; background: rgba(37,99,235,0.1); }
[data-theme="dark"] .problem-tab.active span { color: #60a5fa; }
[data-theme="dark"] .detail-problem         { background: #1a1020; border-right-color: #3f1f1f; }
[data-theme="dark"] .detail-solution        { background: #0f1f14; }
[data-theme="dark"] .detail-problem h3,
[data-theme="dark"] .detail-solution h3     { color: var(--text-primary); }
[data-theme="dark"] .detail-problem p,
[data-theme="dark"] .detail-solution p      { color: var(--text-secondary); }
[data-theme="dark"] .pain-point             { color: var(--text-secondary); }
[data-theme="dark"] .benefit                { color: var(--text-secondary); }
[data-theme="dark"] .detail-stat-bar        { background: rgba(239,68,68,0.08); border-color: rgba(239,68,68,0.15); }
[data-theme="dark"] .detail-stat span       { color: #64748b; }
[data-theme="dark"] .detail-label-red       { background: rgba(239,68,68,0.15); color: #f87171; }
[data-theme="dark"] .detail-label-green     { background: rgba(34,197,94,0.15); color: #4ade80; }
[data-theme="dark"] .problem-detail-inner   { box-shadow: 0 8px 40px rgba(0,0,0,0.3); }

/* ---------- Demo / Wizard Page ---------- */
[data-theme="dark"] .wizard-container       { background-color: var(--bg-primary); }
[data-theme="dark"] .wizard-progress-sticky  { background: var(--bg-primary); border-bottom-color: var(--border-color); }
[data-theme="dark"] .step-card              { background: var(--card-bg); box-shadow: 0 4px 24px rgba(0,0,0,0.3); }
[data-theme="dark"] .benefits-section       { background: var(--card-bg); }
[data-theme="dark"] .card                   { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .card:hover             { border-color: #3b82f6; box-shadow: 0 4px 16px rgba(0,0,0,0.3); }
[data-theme="dark"] .card.selected          { background: rgba(37,99,235,0.1); border-color: #3b82f6; box-shadow: 0 0 0 4px rgba(37,99,235,0.15); }
[data-theme="dark"] .card-checkbox          { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .grid-option            { background: var(--card-bg); border-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .grid-option:hover      { background: rgba(236,72,153,0.08); border-color: #ec4899; }
[data-theme="dark"] .grid-option.selected   { background: #ec4899; color: #fff; border-color: #ec4899; }
[data-theme="dark"] .grid-option-logo       { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .grid-option-logo:hover { border-color: #ec4899; box-shadow: 0 4px 16px rgba(236,72,153,0.2); }
[data-theme="dark"] .grid-option-logo.selected { background: rgba(236,72,153,0.08); border-color: #ec4899; }
[data-theme="dark"] .grid-option-logo img   { filter: brightness(0.9); }
[data-theme="dark"] .radio-option           { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .radio-option:hover     { border-color: #3b82f6; }
[data-theme="dark"] .radio-dot              { border-color: var(--border-color); background: var(--bg-primary); }
[data-theme="dark"] .btn-small              { background: var(--card-bg); border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .btn-small:hover        { border-color: #3b82f6; color: #60a5fa; }
[data-theme="dark"] .btn-primary.outline    { border-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .btn-primary.outline:hover { background: rgba(255,255,255,0.05); }
[data-theme="dark"] .benefit-icon           { background: rgba(34,197,94,0.15); }
[data-theme="dark"] .progress-circle        { background-color: var(--border-color); color: var(--text-secondary); }
[data-theme="dark"] .progress-step::before  { background-color: var(--border-color); }
[data-theme="dark"] .form-input,
[data-theme="dark"] .form-textarea,
[data-theme="dark"] .form-select            { background: var(--bg-primary); border-color: var(--border-color); color: var(--text-primary); }
[data-theme="dark"] .wizard-summary         { background: var(--card-bg); border-color: var(--border-color); }
[data-theme="dark"] .summary-item           { border-bottom-color: var(--border-color); }
[data-theme="dark"] .step-nav               { border-top-color: var(--border-color); }

/* ---------- PDP Wallet / Payment Partners (index.html) ---------- */
[data-theme="dark"] .rtp-node-inner         { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); box-shadow: 0 2px 12px rgba(0,0,0,0.2); }
[data-theme="dark"] .rtp-node:hover .rtp-node-inner { border-color: rgba(37,99,235,0.5); box-shadow: 0 6px 28px rgba(37,99,235,0.2); }
[data-theme="dark"] .rtp-node.active .rtp-node-inner { border-color: var(--blue-primary); background: rgba(37,99,235,0.08); }
[data-theme="dark"] .rtp-ic-usbank          { background: rgba(239,68,68,0.15); color: #f87171; }
[data-theme="dark"] .rtp-ic-wisely          { background: rgba(96,165,250,0.15); color: #93c5fd; }
[data-theme="dark"] .rtp-ic-visa            { background: rgba(129,140,248,0.15); color: #a5b4fc; }
[data-theme="dark"] .rtp-ic-netspend        { background: rgba(251,146,60,0.15); color: #fb923c; }
[data-theme="dark"] .rtp-ic-instant         { background: rgba(248,113,113,0.15); color: #fca5a5; }
[data-theme="dark"] .rtp-ic-dailypay        { background: rgba(248,113,113,0.15); color: #fca5a5; }
[data-theme="dark"] .rtp-ic-money           { background: rgba(239,68,68,0.15); color: #f87171; }
[data-theme="dark"] .rtp-ic-branch          { background: rgba(74,222,128,0.15); color: #4ade80; }

/* ---------- Products Page: Mockup Visuals Dark Mode ---------- */
[data-theme="dark"] .mockup-browser,
[data-theme="dark"] .mockup-phone,
[data-theme="dark"] .mockup-dash            { background: #1a2744; border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .mockup-toolbar,
[data-theme="dark"] .mockup-phone-notch,
[data-theme="dark"] .mockup-dash-header     { background: rgba(0,0,0,0.3); border-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .mockup-url             { background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.4); }
[data-theme="dark"] .mockup-sidebar-item    { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .mockup-row,
[data-theme="dark"] .mockup-phone-row       { background: rgba(255,255,255,0.06); }
[data-theme="dark"] .mockup-kpi-card,
[data-theme="dark"] .mockup-dash-card       { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .mockup-kpi-num         { color: rgba(255,255,255,0.7); }
[data-theme="dark"] .mockup-kpi-label,
[data-theme="dark"] .mockup-dash-card-title { color: rgba(255,255,255,0.3); }
[data-theme="dark"] .mockup-dash-title      { color: rgba(255,255,255,0.5); }
[data-theme="dark"] .mockup-dash-dot        { background: rgba(255,255,255,0.15); }
[data-theme="dark"] .mockup-qr             { background: rgba(255,255,255,0.03); }
[data-theme="dark"] .mockup-qr-cell.empty  { background: rgba(255,255,255,0.03); }
[data-theme="dark"] .mockup-phone-amount   { color: rgba(34,197,94,0.7); }
[data-theme="dark"] .mockup-dash-card-value.blue   { color: rgba(96,165,250,0.8); }
[data-theme="dark"] .mockup-dash-card-value.green  { color: rgba(74,222,128,0.8); }
[data-theme="dark"] .mockup-dash-card-value.amber  { color: rgba(251,191,36,0.8); }
[data-theme="dark"] .mockup-dash-card-value.purple { color: rgba(167,139,250,0.8); }

/* ---------- Horizontal Flow Diagram ---------- */
[data-theme="dark"] .hflow-box          { background: #1e293b; border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .hflow-box:hover    { box-shadow: 0 8px 24px rgba(0,0,0,0.3); }
[data-theme="dark"] .hflow-box h3       { color: #f1f5f9; }
[data-theme="dark"] .hflow-box p        { color: #94a3b8; }
[data-theme="dark"] .hflow-box-primary  { border-color: #3b82f6; background: linear-gradient(135deg, rgba(37,99,235,0.15) 0%, rgba(37,99,235,0.05) 100%); box-shadow: 0 4px 16px rgba(37,99,235,0.2); }
[data-theme="dark"] .hflow-box-primary h3 { color: #60a5fa; }
[data-theme="dark"] .hflow-connector    { color: rgba(255,255,255,0.2); }
[data-theme="dark"] .hflow-arrow        { background: #1e293b; border-color: rgba(255,255,255,0.1); color: #94a3b8; box-shadow: 0 2px 8px rgba(0,0,0,0.3); }
[data-theme="dark"] .hflow-arrow:hover  { background: #3b82f6; color: #fff; border-color: #3b82f6; }

/* ---------- Robinhood-style Mobile Page ---------- */
[data-theme="dark"] .rh-features { background: var(--bg-white); }
[data-theme="dark"] .rh-showcase { background: var(--bg-light); }
[data-theme="dark"] .rh-mini-phone { background: #0a1628; box-shadow: 0 16px 48px rgba(0,0,0,0.3), 0 0 0 1px rgba(255,255,255,0.06); }