/* ===================================================================== */ /* VARU AI · V135 — FUTURISTIC AI THEME (shared design system) */ /* Pure-black, architectural, gold+cyan AI accents. Overrides the */ /* shared CSS variables every page already uses (--bg/--panel/--gold…) */ /* so the whole platform recolors consistently. Loaded LAST in . */ /* ===================================================================== */ @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500;700&display=swap'); :root{ --bg:#000000 !important; --panel:#0e0f14 !important; --panel-2:#14151c !important; --panel2:#14151c !important; --card:#101116 !important; --card2:#0a0b0f !important; --line:rgba(255,255,255,.09) !important; --text:#f1f4f9 !important; --ink:#f1f4f9 !important; --muted:#8a93a6 !important; --gold:#e3b765 !important; --gold-strong:#f6dd9e !important; --gold2:#f6dd9e !important; /* AI accents */ --cyan:#46e6ff; --cyan2:#7af2ff; --violet:#8b7bff; --shadow:0 30px 70px rgba(0,0,0,.6) !important; --vt-disp:"Space Grotesk","Inter",system-ui,-apple-system,"Segoe UI",sans-serif; --vt-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif; --vt-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace; } html,body{ background:#000 !important; color:var(--text); font-family:var(--vt-body) !important; -webkit-font-smoothing:antialiased; letter-spacing:.01em; } /* atmosphere: restrained corner glow + whisper tech-grid behind everything */ body::before{ content:"";position:fixed;inset:0;z-index:-2;pointer-events:none; background: radial-gradient(42vw 34vh at 0% -6%, rgba(227,183,101,.06), transparent 60%), radial-gradient(40vw 34vh at 100% -2%, rgba(70,230,255,.05), transparent 60%), #000; } body::after{ content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.55; background-image: linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px); background-size:54px 54px; -webkit-mask-image:radial-gradient(75% 65% at 50% 22%,#000,transparent 92%); mask-image:radial-gradient(75% 65% at 50% 22%,#000,transparent 92%); } /* ---- Typography ---- */ h1,h2,h3,h4,h5{font-family:var(--vt-disp) !important;letter-spacing:-.01em} .eyebrow,.mini,.label,.stat-label,.energy-title,.cm-head,.kpi-label,.metric-label,.pill, .tag,.chip-label,th{font-family:var(--vt-mono) !important} ::selection{background:rgba(70,230,255,.28);color:#fff} /* ---- Inputs ---- */ input,select,textarea{ background:rgba(255,255,255,.035) !important; border:1px solid var(--line) !important; color:#fff !important;border-radius:13px; font-family:var(--vt-body);transition:border-color .2s,box-shadow .2s; } input::placeholder,textarea::placeholder{color:#6f7889 !important} input:focus,select:focus,textarea:focus{ border-color:rgba(70,230,255,.5) !important; box-shadow:0 0 0 3px rgba(70,230,255,.12) !important;outline:none !important; } /* ---- Buttons (common patterns) ---- */ button{font-family:var(--vt-body)} .primary-btn,.gold-btn,.btn-gold,.send-btn{ background:linear-gradient(90deg,var(--gold),var(--gold2)) !important; color:#160f02 !important;border:none !important;font-weight:700 !important; box-shadow:0 10px 26px rgba(227,183,101,.18); } .primary-btn:hover,.gold-btn:hover,.btn-gold:hover,.send-btn:hover{ box-shadow:0 12px 32px rgba(227,183,101,.34);transform:translateY(-1px); } .ghost-btn,.tool-btn,.btn-ghost,.secondary-btn{ background:rgba(255,255,255,.03) !important;border:1px solid var(--line) !important;color:#e6eefb !important; } .ghost-btn:hover,.tool-btn:hover,.btn-ghost:hover,.secondary-btn:hover{ border-color:rgba(70,230,255,.4) !important;background:rgba(70,230,255,.06) !important; } /* ---- Generic cards / panels — soft glass on black ---- */ .card,.panel,.tile,.box,.metric,.kpi,.section-card,.module,.widget{ border-radius:16px; } /* ---- Tables ---- */ th{background:rgba(10,11,16,.96) !important;color:#fff !important;text-transform:uppercase;font-size:12px;letter-spacing:.04em} tbody tr:hover{background:rgba(70,230,255,.05) !important} /* ---- Live dots / status accents ---- */ .live,.live-chip,.online{box-shadow:0 0 14px rgba(70,230,255,.2)} /* ---- Scrollbars ---- */ *{scrollbar-width:thin;scrollbar-color:rgba(70,230,255,.3) transparent} *::-webkit-scrollbar{width:10px;height:10px} *::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(227,183,101,.5),rgba(70,230,255,.4));border-radius:10px;border:2px solid transparent;background-clip:padding-box} *::-webkit-scrollbar-track{background:transparent} /* ---- Server-injected "← Πίσω στο VARU" button: modernize ---- */ a[href="/varu-platform"][title]{ background:rgba(10,11,16,.92) !important;border:1px solid var(--line) !important; color:var(--gold2) !important;border-radius:12px !important; font-family:var(--vt-body) !important;backdrop-filter:blur(8px); } /* ===== Markdown rendering των απαντήσεων του AI (.response-box) ===== */ .response-box{ line-height:1.55; } .response-box .md-h{ font-weight:800; color:var(--gold2); margin:12px 0 6px; font-size:1.02em; letter-spacing:.01em; } .response-box .md-h:first-child{ margin-top:0; } .response-box p{ margin:7px 0; } .response-box ul,.response-box ol{ margin:7px 0 7px 2px; padding-left:20px; } .response-box ol{ list-style:decimal; } .response-box li{ margin:4px 0; } .response-box ol li::marker{ color:var(--gold2); font-weight:700; } .response-box li::marker{ color:var(--gold2); } .response-box strong{ color:#fff; font-weight:700; } .response-box code{ font-family:var(--vt-mono,monospace); background:rgba(255,255,255,.06); border:1px solid var(--line); border-radius:6px; padding:1px 6px; font-size:.92em; color:var(--cyan2,#46e6ff); } .response-box hr{ border:0; border-top:1px solid var(--line); margin:12px 0; opacity:.6; } .response-box blockquote{ margin:8px 0; padding:8px 12px; border-left:3px solid var(--gold2); background:rgba(227,183,101,.06); border-radius:0 8px 8px 0; color:#e9eef6; } .response-box .md-table{ width:100%; border-collapse:collapse; margin:10px 0; font-size:.93em; } .response-box .md-table th{ text-align:left; padding:7px 10px; background:rgba(227,183,101,.10); color:var(--gold2); border:1px solid var(--line); font-weight:700; } .response-box .md-table td{ padding:7px 10px; border:1px solid var(--line); color:#e9eef6; } .response-box .md-table tr:nth-child(even) td{ background:rgba(255,255,255,.02); } /* ===== Demo killer-question chips ===== */ .quick-question-demo{ position:relative; border-color:rgba(227,183,101,.5) !important; } .quick-question-demo strong{ color:var(--gold2) !important; } .quick-question-demo span{ color:var(--gold2) !important; }