/* ─── THEME TOGGLE ─── */
.theme-toggle { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,0.1); color:#fff; font-size:16px; cursor:pointer; border:none; transition:0.2s; text-decoration:none; }
.theme-toggle:hover { background:#2f89fc; }

/* ─── BASE ─── */
:root {
  --theme-bg: #ffffff;
  --theme-bg-alt: #f5f7fa;
  --theme-bg-card: #ffffff;
  --theme-text: #1e293b;
  --theme-text-secondary: #475569;
  --theme-text-muted: #64748b;
  --theme-border: #e5e7eb;
  --theme-header-bg: #ffffff;
  --theme-footer-bg: #1e293b;
  --theme-footer-text: #cbd5e1;
  --theme-input-bg: #ffffff;
  --theme-input-border: #d1d5db;
  --theme-primary: #2563eb;
  --theme-primary-hover: #1d4ed8;
}

[data-theme="dark"] {
  --theme-bg: #0a1628;
  --theme-bg-alt: #0d1b33;
  --theme-bg-card: #0f1f3d;
  --theme-text: #e2e8f0;
  --theme-text-secondary: #c0d0e8;
  --theme-text-muted: #8899b4;
  --theme-border: #1e3a5f;
  --theme-header-bg: #080f1e;
  --theme-footer-bg: #060c18;
  --theme-footer-text: #8899b4;
  --theme-input-bg: #0f1f3d;
  --theme-input-border: #1e3a5f;
  --theme-primary: #4d9aff;
  --theme-primary-hover: #6db0ff;
}

/* ─── BASE LAYER ─── */
[data-theme="dark"],
[data-theme="dark"] body,
[data-theme="dark"] .page,
[data-theme="dark"] .wrapper,
[data-theme="dark"] #content,
[data-theme="dark"] .account-dashboard,
[data-theme="dark"] .investment-plans-section,
[data-theme="dark"] .services-section,
[data-theme="dark"] .footer,
[data-theme="dark"] section { background:var(--theme-bg-alt) !important; color:var(--theme-text) !important; }

/* ─── HEADER / TOPBAR ─── */
.goog-te-banner-frame { display:none !important; }
body { top:0 !important; position:static !important; }
[data-theme="dark"] .page-header,
[data-theme="dark"] .page-topbar { background:var(--theme-header-bg) !important; }
[data-theme="dark"] .top-bar { background:var(--theme-header-bg) !important; }
[data-theme="dark"] #sidebar { background:var(--theme-header-bg) !important; }
[data-theme="dark"] .navbar .nav__item__trigger { color:var(--theme-text-secondary) !important; }
[data-theme="dark"] .navbar .nav__item__trigger:hover { color:#fff !important; }
[data-theme="dark"] .brand__image--desktop,
[data-theme="dark"] .brand__image--sticky,
[data-theme="dark"] .brand__image--mobile,
[data-theme="dark"] .brand__image--footer { filter:brightness(0) invert(1); }

/* ─── CARDS / PANELS / SURFACES ─── */
[data-theme="dark"] .panel,
[data-theme="dark"] .beautiful-card,
[data-theme="dark"] .gradient-blue,
[data-theme="dark"] .gradient-orange,
[data-theme="dark"] .referral-form-container,
[data-theme="dark"] .tx-item,
[data-theme="dark"] .dash-header,
[data-theme="dark"] .bottom-nav,
[data-theme="dark"] .m-card,
[data-theme="dark"] .investment-card,
[data-theme="dark"] .why-invest,
[data-theme="dark"] .why-badge,
[data-theme="dark"] .service-card-img-overlay,
[data-theme="dark"] .card,
[data-theme="dark"] .box { background:var(--theme-bg-card) !important; color:var(--theme-text) !important; }
[data-theme="dark"] .gradient-blue { background:linear-gradient(135deg,var(--theme-bg-card),var(--theme-bg-alt)) !important; }
[data-theme="dark"] .gradient-orange { background:linear-gradient(135deg,var(--theme-bg-card),var(--theme-bg-alt)) !important; }
[data-theme="dark"] .why-badge { border-color:var(--theme-border) !important; }
[data-theme="dark"] .why-badge.why-green { color:#4ade80 !important; }
[data-theme="dark"] .why-badge.why-blue { color:var(--theme-primary) !important; }
[data-theme="dark"] .panel { border:1px solid var(--theme-border); }

/* ─── TEXT COLORS (account) ─── */
[data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4,
[data-theme="dark"] .welcome-block h1, [data-theme="dark"] .welcome-block p,
[data-theme="dark"] .stat-label, [data-theme="dark"] .stat-value,
[data-theme="dark"] .stat-footer, [data-theme="dark"] .stat-footer span,
[data-theme="dark"] .stat-subitem, [data-theme="dark"] .stat-subitem span,
[data-theme="dark"] .panel-header,
[data-theme="dark"] .activity-list span, [data-theme="dark"] .activity-list strong,
[data-theme="dark"] .empty-state,
[data-theme="dark"] .ref-code, [data-theme="dark"] .referral-guide,
[data-theme="dark"] .tx-info .tx-title, [data-theme="dark"] .tx-info .tx-date,
[data-theme="dark"] .status-list li,
[data-theme="dark"] .m-title, [data-theme="dark"] .m-amount, [data-theme="dark"] .m-sub,
[data-theme="dark"] .plan-title, [data-theme="dark"] .plan-sub, [data-theme="dark"] .plan-details,
[data-theme="dark"] .why-invest h3, [data-theme="dark"] .why-invest ul, [data-theme="dark"] .why-invest li,
[data-theme="dark"] .investment-title, [data-theme="dark"] .investment-desc,
[data-theme="dark"] .dash-greeting, [data-theme="dark"] .dash-name, [data-theme="dark"] .dash-balance,
[data-theme="dark"] .dash-balance-sub, [data-theme="dark"] .dash-balance-sub strong,
[data-theme="dark"] .quick-label, [data-theme="dark"] .sec-title h2,
[data-theme="dark"] .tx-amount, [data-theme="dark"] .nav-item { color:var(--theme-text) !important; }
[data-theme="dark"] .dash-greeting { color:var(--theme-text-muted) !important; }

/* ─── TEXT COLORS (root public) ─── */
[data-theme="dark"] .services-lead-modern,
[data-theme="dark"] .services-desc-modern,
[data-theme="dark"] .investment-why-title,
[data-theme="dark"] .investment-plans-title,
[data-theme="dark"] .services-title,
[data-theme="dark"] .services-lead,
[data-theme="dark"] .services-desc,
[data-theme="dark"] .service-title,
[data-theme="dark"] .service-type,
[data-theme="dark"] .service-desc,
[data-theme="dark"] .investment-why-title { color:var(--theme-text) !important; }
[data-theme="dark"] .investment-plans-title { color:var(--theme-primary) !important; }

/* ─── BUTTONS ─── */
[data-theme="dark"] .primary-btn { background:var(--theme-primary) !important; color:#fff !important; }
[data-theme="dark"] .primary-btn:hover { background:var(--theme-primary-hover) !important; }
[data-theme="dark"] .ghost-btn { background:var(--theme-bg-alt); border-color:var(--theme-border); color:var(--theme-text); }
[data-theme="dark"] .plan-cta .primary-btn { background:linear-gradient(135deg,var(--theme-primary),#3b82f6) !important; }

/* ─── BORDERS / DIVIDERS ─── */
[data-theme="dark"] .stat-subdetails,
[data-theme="dark"] .activity-list li { border-color:var(--theme-border) !important; }
[data-theme="dark"] .bottom-nav { border-color:var(--theme-border) !important; }
[data-theme="dark"] .investment-card,
[data-theme="dark"] .why-invest,
[data-theme="dark"] .referral-form-container { border-color:var(--theme-border) !important; }
[data-theme="dark"] #sidebar ul li a { border-color:rgba(255,255,255,0.05); }

/* ─── INPUTS ─── */
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea,
[data-theme="dark"] .form-control { background:var(--theme-input-bg) !important; border-color:var(--theme-input-border) !important; color:var(--theme-text) !important; caret-color:#fff; }

/* ─── REF CODE ─── */
[data-theme="dark"] .ref-code { background:var(--theme-bg-alt) !important; }
[data-theme="dark"] .ref-copy-btn { background:var(--theme-bg-card) !important; border-color:var(--theme-border) !important; color:var(--theme-text) !important; }

/* ─── MARKET CARDS (deep blue variants) ─── */
[data-theme="dark"] .grad1 { background:linear-gradient(135deg,#1a3a6b,#2d1b8e) !important; }
[data-theme="dark"] .grad2 { background:linear-gradient(135deg,#0f4c3a,#0d6b4a) !important; }
[data-theme="dark"] .grad3 { background:linear-gradient(135deg,#6b4a1a,#8e6b1b) !important; }
[data-theme="dark"] .grad4 { background:linear-gradient(135deg,#6b1a1a,#8e1b1b) !important; }

/* ─── LINKS ─── */
[data-theme="dark"] a:not(.btn):not(.primary-btn):not(.ghost-btn):not(.top-icon):not(.dash-icon-btn):not(.nav-item):not(.quick-item) { color:var(--theme-primary) !important; }

/* ─── NAV ITEMS ─── */
[data-theme="dark"] .nav-item.active { background:rgba(77,154,255,0.12) !important; }
[data-theme="dark"] .dash-icon-btn,
[data-theme="dark"] .top-icon { background:rgba(255,255,255,0.08); }
[data-theme="dark"] .dash-icon-btn:hover,
[data-theme="dark"] .top-icon:hover { background:var(--theme-primary); }

/* ─── ICONS ─── */
[data-theme="dark"] .tx-icon.green { background:rgba(74,222,128,0.15) !important; color:#4ade80 !important; }
[data-theme="dark"] .tx-icon.red { background:rgba(248,113,113,0.15) !important; color:#f87171 !important; }
[data-theme="dark"] .tx-icon.blue { background:rgba(77,154,255,0.15) !important; color:var(--theme-primary) !important; }

/* ─── FOOTER ─── */
[data-theme="dark"] .page-footer { background:var(--theme-footer-bg) !important; color:var(--theme-footer-text) !important; }
[data-theme="dark"] .page-footer a { color:var(--theme-footer-text) !important; }
[data-theme="dark"] .page-footer .tiny { color:var(--theme-text-muted) !important; }

/* ─── INVEST PLANS SECTION BG ─── */
[data-theme="dark"] .investment-plans-section { background:linear-gradient(180deg,var(--theme-bg-alt) 60%,#080f1e 100%) !important; }
[data-theme="dark"] .why-invest { background:var(--theme-bg-card) !important; }

/* ─── SHADOWS ─── */
[data-theme="dark"] .beautiful-card,
[data-theme="dark"] .panel,
[data-theme="dark"] .tx-item { box-shadow:0 2px 8px rgba(0,0,0,0.3); }

/* ─── GOOGLE TRANSLATE FLOATING (root pages) ─── */
/* Floating on the right side center of the screen */
#google_translate_element_root {
    position: fixed;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
    display: block !important;
}
#google_translate_element_root .goog-te-combo {
    appearance: auto !important;
    -webkit-appearance: auto !important;
    display: inline-block !important;
    width: auto !important;
    min-width: 100px;
    padding: 6px 10px !important;
    border-radius: 6px !important;
    border: 1px solid rgba(0,0,0,0.2) !important;
    background: #fff !important;
    color: #1e293b !important;
    font-size: 12px !important;
    cursor: pointer !important;
    outline: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
#google_translate_element_root .goog-te-combo option {
    color: #000 !important;
    background: #fff !important;
}
#google_translate_element_root .goog-te-gadget-simple,
#google_translate_element_root .goog-te-gadget-icon { display: none !important; }

/* Dark theme: floating widget background */
[data-theme="dark"] #google_translate_element_root .goog-te-combo {
    background: #0f1f3d !important;
    color: #e2e8f0 !important;
    border-color: rgba(255,255,255,0.2) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}
[data-theme="dark"] #google_translate_element_root .goog-te-combo option {
    color: #e2e8f0 !important;
    background: #0f1f3d !important;
}

/* ─── GOOGLE TRANSLATE (account pages, inside .top-bar) ─── */
#google_translate_element .goog-te-combo {
    appearance: auto !important;
    -webkit-appearance: auto !important;
    display: inline-block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    border: 1px solid rgba(255,255,255,0.3) !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 12px !important;
    cursor: pointer !important;
    outline: none !important;
}
#google_translate_element .goog-te-combo option {
    color: #000 !important;
    background: #fff !important;
}
#google_translate_element .goog-te-gadget-simple,
#google_translate_element .goog-te-gadget-icon { display: none !important; }

/* Ensure parent containers don't clip elements */
.page-header .navbar.has--magic-line,
.page-header,
body { overflow-x: visible !important; }
.header-tools { z-index: 102; position: relative; }
.handle--menu { z-index: 103; }
.top-bar { overflow: visible !important; }

/* Dark-theme overrides for the top-bar (account) */
[data-theme="dark"] .top-bar .top-translate { color: rgba(255,255,255,0.6) !important; }

/* Mobile: move floating widget down to avoid hamburger overlap */
@media (max-width: 1079px) {
    .header-tools { gap: 4px !important; margin-right: 4px !important; }
    #google_translate_element_root {
        top: auto;
        bottom: 15%;
        right: 8px;
    }
    #google_translate_element_root .goog-te-combo {
        min-width: 80px;
        font-size: 11px !important;
        padding: 4px 6px !important;
    }
}

/* ─── ABOUT PAGE ─── */
[data-theme="dark"] .about-main,
[data-theme="dark"] .about-feature-card,
[data-theme="dark"] .about-values-card,
[data-theme="dark"] .about-mission-card { background:var(--theme-bg-alt) !important; color:var(--theme-text) !important; }
[data-theme="dark"] .about-title,
[data-theme="dark"] .about-subtitle,
[data-theme="dark"] .about-lead,
[data-theme="dark"] .about-feature-card h4,
[data-theme="dark"] .about-feature-card p,
[data-theme="dark"] .about-values-card h4,
[data-theme="dark"] .about-values-card p,
[data-theme="dark"] .about-mission-card h4,
[data-theme="dark"] .about-mission-card p { color:var(--theme-text) !important; }
[data-theme="dark"] .about-feature-card,
[data-theme="dark"] .about-values-card,
[data-theme="dark"] .about-mission-card { background:var(--theme-bg-card) !important; border-color:var(--theme-border) !important; }

/* ─── FAQ PAGE ─── */
[data-theme="dark"] .faq-section,
[data-theme="dark"] .faq-item,
[data-theme="dark"] .faq-question,
[data-theme="dark"] .faq-answer { background:var(--theme-bg-alt) !important; color:var(--theme-text) !important; }
[data-theme="dark"] .faq-item { background:var(--theme-bg-card) !important; border-color:var(--theme-border) !important; }

/* ─── CONTACT PAGE ─── */
[data-theme="dark"] .contact-section,
[data-theme="dark"] .contact-card,
[data-theme="dark"] .contact-info { background:var(--theme-bg-alt) !important; color:var(--theme-text) !important; }
[data-theme="dark"] .contact-card { background:var(--theme-bg-card) !important; border-color:var(--theme-border) !important; }

/* ─── ACCOUNT PAGES (catch white backgrounds across all account CSS files) ─── */
[data-theme="dark"] .deposit-tr-section,
[data-theme="dark"] .deposit-summary-box,
[data-theme="dark"] .withdraw-card,
[data-theme="dark"] .withdraw-box,
[data-theme="dark"] .p2p-card,
[data-theme="dark"] .p2p-page,
[data-theme="dark"] .kyc-page,
[data-theme="dark"] .kyc-col,
[data-theme="dark"] .kyc-card,
[data-theme="dark"] .profile-card,
[data-theme="dark"] .profile-wrapper,
[data-theme="dark"] .commission-box,
[data-theme="dark"] .commission-table,
[data-theme="dark"] .scheme-container,
[data-theme="dark"] .invest-scheme-table,
[data-theme="dark"] .transfer-container,
[data-theme="dark"] .history-table,
[data-theme="dark"] .deposit-history-box,
[data-theme="dark"] .withdraw-history-box,
[data-theme="dark"] .auth-wrapper,
[data-theme="dark"] .auth-card,
[data-theme="dark"] .register-card,
[data-theme="dark"] .plan-details-box,
[data-theme="dark"] .investment-summary-box,
[data-theme="dark"] .wallet-balance-box { background:var(--theme-bg-card) !important; color:var(--theme-text) !important; border-color:var(--theme-border) !important; }

[data-theme="dark"] .deposit-tr-section,
[data-theme="dark"] .deposit-summary-box,
[data-theme="dark"] .withdraw-card,
[data-theme="dark"] .p2p-card { box-shadow:0 2px 12px rgba(0,0,0,0.3); }

[data-theme="dark"] #content .container,
[data-theme="dark"] #content .row,
[data-theme="dark"] #content .col-12,
[data-theme="dark"] #content .col-md-6,
[data-theme="dark"] #content .col-md-4,
[data-theme="dark"] #content .col-md-8,
[data-theme="dark"] #content .col-md-3,
[data-theme="dark"] #content .mb-3,
[data-theme="dark"] #content .mb-4 { background:transparent !important; }

/* ─── OVERRIDE ALL #fff backgrounds in account section ─── */
[data-theme="dark"] .deposit-tr-section,
[data-theme="dark"] .deposit-summary-box,
[data-theme="dark"] [class*="deposit-"],
[data-theme="dark"] [class*="withdraw-"],
[data-theme="dark"] [class*="p2p-"],
[data-theme="dark"] [class*="kyc-"],
[data-theme="dark"] [class*="profile-"],
[data-theme="dark"] [class*="commission-"],
[data-theme="dark"] [class*="scheme-"],
[data-theme="dark"] [class*="transfer-"],
[data-theme="dark"] [class*="history-"],
[data-theme="dark"] [class*="auth-"],
[data-theme="dark"] [class*="register-"],
[data-theme="dark"] [class*="invest-summary"],
[data-theme="dark"] [class*="wallet-"],
[data-theme="dark"] [class*="plan-details"],
[data-theme="dark"] [class*="referral-"] { background:var(--theme-bg-card) !important; color:var(--theme-text) !important; }
[data-theme="dark"] [class*="deposit-"] input,
[data-theme="dark"] [class*="withdraw-"] input,
[data-theme="dark"] [class*="p2p-"] input,
[data-theme="dark"] [class*="kyc-"] input,
[data-theme="dark"] [class*="profile-"] input,
[data-theme="dark"] [class*="auth-"] input { background:var(--theme-input-bg) !important; border-color:var(--theme-input-border) !important; color:var(--theme-text) !important; }

/* ─── TEXT COLORS (account utility) ─── */
[data-theme="dark"] .deposit-tr-label,
[data-theme="dark"] .deposit-tr-hint,
[data-theme="dark"] .deposit-amount-label,
[data-theme="dark"] .p2p-card-title,
[data-theme="dark"] .kyc-title,
[data-theme="dark"] .kyc-label,
[data-theme="dark"] .kyc-hint,
[data-theme="dark"] .profile-title,
[data-theme="dark"] .profile-label,
[data-theme="dark"] .commission-title,
[data-theme="dark"] .scheme-title,
[data-theme="dark"] .history-title,
[data-theme="dark"] .auth-title,
[data-theme="dark"] .register-title { color:var(--theme-text) !important; }

/* ─── TABLES ─── */
[data-theme="dark"] table,
[data-theme="dark"] .table,
[data-theme="dark"] .invest-scheme-table,
[data-theme="dark"] .commission-table,
[data-theme="dark"] .history-table { background:transparent !important; color:var(--theme-text) !important; }
[data-theme="dark"] table td,
[data-theme="dark"] table th,
[data-theme="dark"] .table td,
[data-theme="dark"] .table th { background:transparent !important; color:var(--theme-text) !important; border-color:var(--theme-border) !important; }

/* ─── SERVICE CARDS (root) ─── */
[data-theme="dark"] .service-card-img-overlay { background:var(--theme-bg-card) !important; }
[data-theme="dark"] .service-energy,
[data-theme="dark"] .service-assets,
[data-theme="dark"] .service-trading,
[data-theme="dark"] .service-agriculture,
[data-theme="dark"] .service-construction,
[data-theme="dark"] .service-realestate { background:var(--theme-bg-card) !important; }
[data-theme="dark"] .service-card-img-overlay::before { background:var(--theme-bg-card) !important; }

/* ─── OVERRIDE GENERIC :root VARS from account CSS files ─── */
/* These files (account-dashboard.css, investment-plans.css, etc.) set
   --bg, --card, --text, --border, --primary at :root, which loads after
   theme.css. We must re-declare them under [data-theme="dark"] so they win. */
[data-theme="dark"] {
  --bg: #0a1628;
  --card: #0f1f3d;
  --border: #1e3a5f;
  --text: #e2e8f0;
  --muted: #8899b4;
  --primary: #4d9aff;
  --primary-soft: rgba(77,154,255,0.12);
  --success: #4ade80;
  --warning: #fbbf24;
  --danger: #f87171;
}