:root{ /* base (light) */ --bg:#ffffff; --panel:#f7f7fa; --panel-alt:#ececf1; --text:#000000; --accent:#00e0ff; /* bright cyan */ --accent2:#ff46ff; /* hot magenta */ --glow:0 0 6px var(--accent),0 0 12px var(--accent); /* signal pills */ --pill-buy-bg:#008c6e; --pill-sell-bg:#de2a2a; --pill-text:#000; } /* DARK overrides () */ [data-theme="dark"]{ --bg:#1a1a1a; --panel:#1a1a26; --panel-alt:#262626; --text:#e0e0ff; --accent:#00e0ff; --accent2:#ff46ff; --glow:0 0 6px var(--accent),0 0 12px var(--accent); --pill-buy-bg:#00b56a; --pill-sell-bg:#ff5252; } /* ───────────────────────── 2) RESET & BASICS ───────────────────── */ html{transition:background-color .15s,color .15s;} body{background:var(--bg);color:var(--text);font-family:Inter,Helvetica,sans-serif;} a{color:var(--accent)} /* form controls */ input,select{ background:var(--panel); border:1px solid #ffffff24; color:var(--text); padding:10px; border-radius:8px; } /* ─── Password field key-icon colour swap ─── */ input[type="password"]{ background-repeat:no-repeat; /* keep the key visible */ background-position:10px center; background-size:20px; } [data-theme="light"] input[type="password"]{ background-image:none; /* removed missing asset */ } [data-theme="dark"] input[type="password"]{ background-image:none; /* removed missing asset */ } /* Select2 */ .select2-container--default .select2-selection--single{ background:var(--panel);border:1px solid #ffffff24;color:var(--text);height:34px; } .select2-selection--single .select2-selection__rendered{color:var(--accent);line-height:32px;padding-left:8px;} .select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:var(--accent) transparent transparent transparent;} .select2-container--default .select2-dropdown{background:var(--panel);border:1px solid #ffffff24;} .select2-results__option{color:var(--text)} .select2-results__option--highlighted.select2-results__option--selectable{background:var(--accent);color:#000;} .select2-results>.select2-results__options{scrollbar-width:thin} /* squash Tailwind’s dark-only utilities when light is active */ [data-theme="light"] .bg-gray-900,[data-theme="light"] .bg-gray-800,[data-theme="light"] .bg-gray-700, [data-theme="light"] .bg-slate-900,[data-theme="light"] .bg-slate-800,[data-theme="light"] .bg-slate-700, [data-theme="light"] .bg-neutral-900,[data-theme="light"] .bg-neutral-800,[data-theme="light"] .bg-neutral-700{ background:var(--panel)!important;color:var(--text)!important; } [data-theme="light"] .text-white,[data-theme="light"] .text-gray-100,[data-theme="light"] .text-slate-100, [data-theme="light"] .text-neutral-100{color:var(--text)!important;} /* ───────────────────────── 3) BRAND ELEMENTS ───────────────────── */ .logo-brand{font-family:'Orbitron',sans-serif;font-size:1.7rem;font-weight:700;color:var(--accent);text-shadow:0 0 4px var(--accent),0 0 12px var(--accent);} .text-glow{color:var(--accent2);text-shadow:0 0 6px var(--accent2),0 0 18px var(--accent2),0 0 32px var(--accent2);} /* ───────────────────────── 4) COMPONENTS ───────────────────────── */ .glass{background:linear-gradient(135deg,#ffffff0d,#ffffff02);border:1px solid #ffffff1a;backdrop-filter:blur(12px);border-radius:14px;padding:28px 38px;box-shadow:0 4px 12px #000a;} .neon-btn{background:var(--accent2);color:#fff;border:none;padding:10px 28px;border-radius:14px;font-weight:600;letter-spacing:.5px;box-shadow:var(--glow);transition:transform .2s ease,box-shadow .3s ease;} .neon-btn:hover{transform:translateY(-2px);box-shadow:0 0 6px var(--accent2),0 0 14px var(--accent2),0 0 24px var(--accent2);} .neon-btn.neon-dark{ background:#0b0f13; color:#00eaff; border:1px solid #00eaff44; box-shadow:0 0 4px #00eaff55,0 0 12px #00eaff33,0 0 22px #00eaff22; transition:transform .2s ease,box-shadow .3s ease; } [data-theme="light"] .neon-btn.neon-dark{ background:#eaf9ff; color:#007a99; border:1px solid #007a9944; box-shadow:0 0 4px rgba(0,119,153,.25),0 0 12px rgba(0,119,153,.12); } .neon-btn.neon-dark:hover{ transform:translateY(-2px); box-shadow:0 0 6px #00eaffaa,0 0 18px #00eaff66,0 0 30px #00eaff44; } .neon-panel{padding:4px;border-radius:12px;background:var(--panel);box-shadow:0 0 4px rgba(0,255,255,.35),0 0 12px rgba(0,255,255,.25),0 0 24px rgba(0,200,255,.15),inset 0 0 6px rgba(0,255,255,.20);margin-bottom:22px;position:relative;} .chart-canvas{width:100%!important;height:100%;display:block;background:var(--panel);border-radius:.5rem;}@media(min-width:1024px){.chart-canvas{max-height:700px}} .kpi-bar{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 1.5rem} .kpi-pill{background:rgba(0,255,200,.08);border:1px solid rgba(0,255,230,.25);padding:.35rem .75rem;border-radius:9999px;font-size:.85rem;line-height:1.2;color:var(--text);backdrop-filter:blur(4px);} .kpi-good{background:rgba(0,255,120,.15);border-color:#00ff88} .kpi-bad {background:rgba(255,50,50,.15);border-color:#ff4f4f} .kpi-pill em{font-style:normal;color:#00ffc8}@media(min-width:768px){.kpi-pill{font-size:.92rem}} .latest-pill{position:absolute;top:12px;right:12px;padding:0 4px;font-weight:600;font-size:.93rem;background:transparent;color:var(--pill-text);animation:shake 2.2s infinite ease-in-out;} .latest-pill.kpi-good{color:var(--pill-buy-bg)}.latest-pill.kpi-bad{color:var(--pill-sell-bg)} @keyframes shake{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}} table{width:100%;border-collapse:collapse;margin-bottom:1.5rem;color:var(--text);} th,td{border:1px solid #b9b9b9;padding:6px 8px;text-align:left} th{background:var(--panel-alt);font-weight:600} tr:nth-child(even){background:var(--panel-alt)} /* ───────────────────────── 5) THEME TOGGLE – PREMIUM SLIDER ────── */ .theme-switch{position:relative;display:inline-block;width:3.6rem;height:1.8rem;} .theme-switch input{opacity:0;width:0;height:0;} .theme-slider{position:absolute;inset:0;background:var(--panel-alt);border:1px solid var(--accent);border-radius:9999px;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:background .25s;} .theme-slider::before{content:"";position:absolute;left:2px;top:50%;width:1.4rem;height:1.4rem;background:var(--accent2);border-radius:50%;transform:translateY(-50%);transition:transform .25s,background .25s,box-shadow .25s;box-shadow:0 0 6px var(--accent2),0 0 14px var(--accent2);} .theme-switch input:checked + .theme-slider{background:var(--accent2)33;} .theme-switch input:checked + .theme-slider::before{transform:translate(1.6rem,-50%);background:var(--pill-buy-bg);box-shadow:0 0 6px var(--pill-buy-bg),0 0 14px var(--pill-buy-bg);} /* ───────────────────────── 6) DASHBOARD DIM MODE (.chart-page) ── */ .chart-page{--accent:#009ad1;--accent2:#c738c7;--glow:none;} .chart-page .neon-panel{background:var(--panel);box-shadow:0 0 2px rgba(0,0,0,.20),0 2px 8px rgba(0,0,0,.18),inset 0 0 1px rgba(0,0,0,.05);} .chart-page .neon-btn{box-shadow:none;background:var(--accent);} .chart-page .neon-btn:hover{box-shadow:0 1px 3px rgba(0,0,0,.22);transform:translateY(-1px);} .chart-page .kpi-pill,.chart-page .premium-pill{background:var(--panel-alt);border:1px solid rgba(0,0,0,.15);box-shadow:none;} .chart-page .premium-pill:hover{background:rgba(0,0,0,.05);} .chart-page .latest-pill{animation:none;} .chart-page canvas{--buy-dot:#1fa463;--sell-dot:#c7362c;} /* ─── Terms & Consent container colour fix ─── */ .terms-box{ background:#0f0f0f; /* default dark background */ color:var(--text); /* use theme text colour */ } [data-theme="light"] .terms-box{ background:var(--panel); /* light background so black text visible */ } /* ───────────────────────── FOOTER ───────────────────────── */ /* make the whole footer sit in the middle and look bolder */ footer{ width:100%; /* span the viewport */ display:flex; /* flexbox → easy centring */ flex-direction:column; /* each

on its own line */ align-items:center; /* horizontal centring */ gap:.25rem; /* small vertical spacing */ text-align:center; font-weight:600; /* bold text + links */ } footer p{margin:0;width:auto;} /* shrink p’s so flex-centre works */ /* ─────────────────────── CTA BANNER (light mode) ───────── */ /* the “Ready to catch your next signal” strip on the home page */ [data-theme="light"] .home-page .bg-gradient-to-br h2, [data-theme="light"] .home-page .bg-gradient-to-br p{ color:#ffffff !important; /* solid white on the dark band */ opacity:1 !important; /* cancel any Tailwind opacity class */ } .neon-btn, .neon-btn.neon-dark{ cursor:pointer; /* hand cursor on hover */ } /* non-bold copyright + disclaimer, keep menu bold */ footer p:first-child, footer p:nth-child(2){ font-weight:100!important; font-size:0.8125rem !important; } /* ───────────────────────── END ───────────────────────── */