/* ============================================================================= TEMA — PROJEKTENKENT EZT CSERELED. Csak szin/szinvilag. Semmi meret vagy layout. A markaszineket es a semleges retegeket allitod at; minden komponens koveti. ============================================================================= */ :root { /* ---------- Marka-paletta (projekt-specifikus) ---------- */ --brand-indigo: #6366f1; --brand-cyan: #22d3ee; --brand-violet: #a855f7; --brand-pink: #e879f9; --brand-green: #22c55e; /* elenk, egyertelmu zold (yes/aktiv szemantika: pipa, elo-statusz) */ --brand-amber: #f59e0b; --color-primary: var(--brand-indigo); --color-primary-rgb: 99, 102, 241; --color-primary-contrast: #ffffff; --accent: var(--color-primary); /* szekcionkent felulirhato: .section--cyan stb. */ /* ---------- Szemantikus ---------- */ --color-success: #16a34a; --color-warning: #d97706; --color-danger: #dc2626; --color-info: #0891b2; /* ---------- VILAGOS tema (belso, uzleti felulet: atlathato, tiszta) ---------- */ --bg: #f5f7fb; --surface: #ffffff; --surface-2: #eef1f6; --border: #e4e7ec; --text: #101828; --text-muted:#5b6472; --heading: #0b1220; /* Marka-szignatura: EGYETLEN, koherens gradiens (indigo -> violet) minden identitas-elemre (hero grad-text, elsodleges CTA-k, CTA-sav, marka-jel). A grad-cool (indigo -> cyan) a masodlagos "adat" mikro-akcent (pl. demo-oszlopok) — igy a szinvilag ertelmes, nem katyvasz. */ --grad-brand: linear-gradient(120deg, var(--brand-indigo), var(--brand-violet)); --grad-cool: linear-gradient(120deg, var(--brand-indigo), var(--brand-cyan)); } /* ---------- SOTET tema (landing: wow, szines, mozgalmas) ---------- A landing ala kerul. Ugyanaz a marka, sotet retegen. A [data-bs-theme="dark"] szelektor is ide kotve: igy a alatt a Tabler-valtozok (:root mapping lent) mar a sotet ertekekre oldodnak fel. */ [data-bs-theme="dark"], .page-dark { --bg: #0a0f1e; --bg-2: #0f1526; --surface: rgba(255, 255, 255, 0.045); --surface-2: rgba(255, 255, 255, 0.02); --border: rgba(255, 255, 255, 0.09); --text: #dfe5f2; --text-muted:#aab4cc; --heading: #f2f5fc; } /* Per-szekcio akcentszin (keret-primitivek). A LANDING ezekbol TUDATOSAN csak a ket szignatura-hangot (indigo, violet) valtogatja -> koherens ritmus, nem szivarvany. A green/ amber a landingen CSAK szemantika (aktiv/fuggoben, pipa/x), nem szekcio-dekoracio. */ .section--indigo { --accent: var(--brand-indigo); } .section--cyan { --accent: var(--brand-cyan); } .section--violet { --accent: var(--brand-violet); } .section--green { --accent: var(--brand-green); } .section--pink { --accent: var(--brand-pink); } .section--amber { --accent: var(--brand-amber); } /* Semleges melyseg-sav: a szekciokat NEM eltero szinnel, hanem finom melyseggel valasztjuk el (vilagos temán sotet, sotet temán vilagos, halvany lift) — hue-semleges, ezert koherens. */ .section--band { background: color-mix(in srgb, var(--text) 3%, transparent); } /* ---------- Tabler valtozok rakotese a temara ---------- */ :root { --tblr-primary: var(--color-primary); --tblr-primary-rgb: var(--color-primary-rgb); --tblr-body-bg: var(--bg); --tblr-body-color: var(--text); --tblr-border-color: var(--border); --tblr-font-sans-serif: var(--font-body); --tblr-body-font-family: var(--font-body); --tblr-body-font-size: 1rem; /* min 16px — Tabler 14px alapot feluliruk */ --tblr-border-radius: var(--radius-md); --tblr-card-border-radius: var(--radius-lg); }