/* ============================================================ PUBLIKUS CÉGOLDAL · SÖTÉT TÉMA — a /rendeles (portál) megjelenése doc: docs/ceg-publikus-profil/10-…-2026-08-21.md §10 ⭐ 2026-08-21 (user): a sötét téma a portál (`portal-theme.css`, /rendeles) look-ja: navy háttér-glow + kék `#0B5FFF` + üveg-felületek. A token-alapú CSS miatt ez NAGYRÉSZT token-csere; a beégetett (világos-specifikus) színeket alul külön írjuk felül. Aktiválás: `` (a cég alapértelmezettje, vagy a látogató választása localStorage-ból — l. a template fej-scriptjét + theme-toggle.js). ============================================================ */ :root[data-theme="dark"] { --cp-text: rgba(255, 255, 255, .94); --cp-muted: rgba(255, 255, 255, .58); --cp-border: rgba(255, 255, 255, .14); --cp-bg: #070c1b; --cp-card: rgba(255, 255, 255, .06); --cp-primary: #5b93ff; /* világosabb kék → sötéten olvasható szöveg/gomb */ --cp-primary-dark: #0b5fff; /* a portál márka-kékje (hover) */ --cp-success: #34d17f; --cp-star: #f2b134; --cp-glass: rgba(255, 255, 255, .06); --cp-glass-strong: rgba(255, 255, 255, .10); --cp-glass-border: rgba(255, 255, 255, .14); --cp-glass-highlight: inset 0 1px 0 rgba(255, 255, 255, .14); --cp-glass-shadow: 0 20px 50px rgba(0, 0, 0, .5); --cp-blue-tint: rgba(91, 147, 255, .10); --cp-blue-ring: rgba(120, 160, 255, .45); --cp-accent-soft: rgba(11, 95, 255, .20); --cp-accent-border: rgba(120, 160, 255, .35); --cp-accent-bright: #8fbaff; } /* ── Beégetett (világos-specifikus) színek felülírása sötétre ────────── */ /* Háttér: a portál navy backdropja + kék glow. */ :root[data-theme="dark"] body { background: radial-gradient(120% 70% at 50% -8%, rgba(11, 95, 255, .30), transparent 60%), linear-gradient(180deg, #0a1430 0%, #070c1b 55%, #04060d 100%); background-attachment: fixed; background-color: #070c1b; } /* Hero (borítókép nélkül): sötét gradiens. */ :root[data-theme="dark"] .cp-hero { background: linear-gradient(135deg, #0e1e33 0%, #0a1430 100%); border-bottom-color: var(--cp-glass-border); } /* ⭐ 2026-08-26 (user, doc 10 §1c/F7) — FACEBOOK-BANNER: a borítókép önálló, FÁTYOL NÉLKÜLI sáv (cp-cover-banner), így SÖTÉT témában is 100%-ban látszik a kép. Nincs többé sötét ::before-fátyol és nincs szöveg a fotón → a hero-szöveg a tömör (sötét) header-háttéren ül, text-shadow nélkül olvasható. A banner maga téma-független (a kép a kép). */ :root[data-theme="dark"] .cp-tagline { color: rgba(255, 255, 255, .8); } /* Menüsáv: sötét üveg. */ :root[data-theme="dark"] .cp-nav { background: rgba(7, 12, 27, .72); } /* Másodlagos gomb: fehér helyett üveg. */ :root[data-theme="dark"] .cp-btn-secondary { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .35); color: var(--cp-text); box-shadow: none; } :root[data-theme="dark"] .cp-btn-secondary:hover { background: rgba(255, 255, 255, .14); border-color: var(--cp-primary); color: #fff; } /* Szolgáltatás/referencia belső kártyák: halvány üveg. */ :root[data-theme="dark"] .cp-service, :root[data-theme="dark"] .cp-ref { background: rgba(255, 255, 255, .05); } /* Bizalmi/platform blokk: kékes üveg. */ :root[data-theme="dark"] .cp-trust { background: rgba(11, 95, 255, .12); border-color: rgba(120, 160, 255, .28); } /* „Hogyan működik" sáv + sorszám. */ :root[data-theme="dark"] .cp-how { background: rgba(11, 95, 255, .07); } :root[data-theme="dark"] .cp-how-num { color: rgba(255, 255, 255, .22); } /* Lábléc: tömör sötét (nem üveg, hogy elváljon). */ :root[data-theme="dark"] .cp-footer { background: rgba(7, 12, 27, .6); } /* ── Téma-váltó gomb (nap/hold) ──────────────────────────────────────── */ .cp-theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--cp-accent-border); background: var(--cp-accent-soft); color: var(--cp-primary); cursor: pointer; flex-shrink: 0; transition: background .15s ease, transform .1s ease; } .cp-theme-toggle:hover { transform: translateY(-1px); } .cp-theme-toggle svg { width: 19px; height: 19px; } /* Világosban a HOLD látszik (sötétre váltasz), sötétben a NAP. */ .cp-theme-toggle .cp-ic-moon { display: block; } .cp-theme-toggle .cp-ic-sun { display: none; } :root[data-theme="dark"] .cp-theme-toggle .cp-ic-moon { display: none; } :root[data-theme="dark"] .cp-theme-toggle .cp-ic-sun { display: block; } /* ══════════════════════════════════════════════════════════════════════ 2026-08-27 (user): SÖTÉT TÉMA finomítás — gombok / nav-linkek / téma-váltó. Cél: olvashatóbb, kicsit élénkebb, tisztább kontraszt a navy háttéren. ══════════════════════════════════════════════════════════════════════ */ /* Menü-linkek (Bemutatkozás / Szolgáltatások / Referenciák / Kapcsolat): a halvány kék helyett VILÁGOSABB szöveg + kicsit láthatóbb pill → tisztán olvasható. */ :root[data-theme="dark"] .cp-nav-links a { color: #d3e2ff; background: rgba(91, 147, 255, .13); border-color: rgba(120, 160, 255, .32); } :root[data-theme="dark"] .cp-nav-links a:hover { background: var(--cp-primary); border-color: var(--cp-primary); color: #fff; } /* Elsődleges gomb: finom „glow", hogy kiemelkedjen a sötét háttéren (a szín marad a márka-kék). */ :root[data-theme="dark"] .cp-btn-primary { box-shadow: 0 10px 26px -10px rgba(91, 147, 255, .6); } :root[data-theme="dark"] .cp-btn-primary:hover { box-shadow: 0 14px 30px -10px rgba(91, 147, 255, .72); } /* Másodlagos gomb: kicsit erősebb keret, hogy jobban elváljon a háttértől. */ :root[data-theme="dark"] .cp-btn-secondary { border-color: rgba(255, 255, 255, .42); } /* Téma-váltó gomb: LÁTHATÓBB — erősebb keret + világosabb ikon-szín. */ :root[data-theme="dark"] .cp-theme-toggle { background: rgba(91, 147, 255, .16); border-color: rgba(120, 160, 255, .5); color: #cfe0ff; } :root[data-theme="dark"] .cp-theme-toggle:hover { background: rgba(91, 147, 255, .26); }