/* ============================================================================
   Balance — AI KÉPZÉSI TANÁCSADÓ
   ============================================================================

   ⚠ EZ A FÁJL CSAK A TANÁCSADÓ OLDALÁN TÖLTŐDIK (`balance_tanacsado_assets()`).

   ⚠⚠ SZINKRON A KÉPZÉS-AJÁNLÓVAL (a design most újra van tervezve).
      Ez a fájl SZÁNDÉKOSAN ugyanazokat a MÉRT értékeket használja, amelyeket a
      `balance-ajanlo.css` **2026-10-03 11:18-i, 31 331 bájtos** változata és a
      `landing-page.css` `.bal-top-card` családja. (Ellenőrizve a 11:18-as
      verzióban: a mag-konstansok VÁLTOZATLANOK a 10:56-i állapothoz képest —
      a változás a kártya-változatok színeiben és egy új 480px-es blokkban van.)

        kártya-sugár ......... 26px   (mobil 22px)
        kártya-felület ....... linear-gradient(150deg,#ffffff,#f8fafc 58%,#eef2ff)
        kártya-perem .......... 1px solid #ffffff
        kártya-árnyék ........ 0 34px 74px -38px #0f172a73, inset 0 1px 0 #ffffff
        bal sáv .............. 6px · 24px behúzás · 0 6px 6px 0 · linear-gradient(180deg, szín, #10c98c)
        hover-árnyék ......... 0 18px 34px -18px #0a58ff99
        tiltott gomb ......... filter: saturate(.6); opacity: .85
        márka-gradiens ....... linear-gradient(108deg,#0a58ff,#0092cf 45%,#10c98c)
        pirula-gomb .......... min-height 46px · radius 999px · border #e2e8f0
        szövegek ............. #0f172a / #334155 / #475569 / #64748b / #94a3b8
        töréspont ............ 900px
        csökkentett mozgás ... @media (prefers-reduced-motion: reduce)

      A SZINT-SZÍNEK a csomagoknál a márka-gradiens SAJÁT három stopja
      (belépő #0a58ff · haladó #0092cf · mester #10c98c) — NINCS új paletta.

      ⚠ Ha a fenti értékek bármelyike változik a `balance-ajanlo.css`-ben vagy a
        `.bal-top-card`-ban, EZT A FÁJLT UGYANABBAN A KÖRÖKBEN kell léptetni.
        A közös kártyát (`.bal-top-card`) NEM definiáljuk újra — azt a
        `landing-page.css` adja, és a tanácsadó azt használja.
   ============================================================================ */

.bal-tanacsado {
	max-width: 720px;
	margin: 0 auto;
	padding: 8px 0 32px;
}

/* ---------------------------------------------------------------------------
   Gyors probléma-chipek
   --------------------------------------------------------------------------- */

.bal-tanacsado-chipek {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
}

.bal-tanacsado-chip {
	min-height: 38px;
	padding: 8px 14px;
	border-radius: 999px;
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #334155;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: transform .18s, box-shadow .22s, background .22s, border-color .22s;
}

.bal-tanacsado-chip:hover {
	transform: translateY(-2px);
	border-color: #c7d2fe;
	background: #eef2ff;
	box-shadow: 0 14px 28px -18px #0f172a66;
}

.bal-tanacsado-chip.is-valasztott {
	border-color: #0a58ff;
	background: #eef2ff;
	color: #1e3a8a;
}

/* ---------------------------------------------------------------------------
   Űrlap
   --------------------------------------------------------------------------- */

.bal-tanacsado-urlap {
	padding: 20px;
	border-radius: 26px;
	border: 1px solid #ffffff;
	background: linear-gradient(150deg, #ffffff, #f8fafc 58%, #eef2ff);
	box-shadow: 0 34px 74px -38px #0f172a73, inset 0 1px 0 #ffffff;
}

.bal-tanacsado-urlap textarea {
	display: block;
	width: 100%;
	min-height: 104px;
	resize: vertical;
	padding: 14px 16px;
	border-radius: 16px;
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #0f172a;
	font: inherit;
	font-size: 15.5px;
	line-height: 1.5;
	box-sizing: border-box;
}

.bal-tanacsado-urlap textarea:focus-visible {
	outline: 2px solid #0a58ff;
	outline-offset: 1px;
	border-color: #0a58ff;
}

.bal-tanacsado-urlap-lab {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 12px;
}

.bal-tanacsado-szamlalo {
	font-size: 12px;
	font-variant-numeric: tabular-nums;
	color: #94a3b8;
}

.bal-tanacsado-kuld {
	min-height: 46px;
	padding: 11px 22px;
	border: 0;
	border-radius: 999px;
	background: linear-gradient(108deg, #0a58ff, #0092cf 45%, #10c98c);
	color: #ffffff;
	font-size: 14.5px;
	font-weight: 800;
	cursor: pointer;
	transition: transform .18s, box-shadow .25s, filter .25s;
}

.bal-tanacsado-kuld:hover:not(:disabled) {
	transform: translateY(-2px);
	box-shadow: 0 18px 34px -18px #0a58ff99;
}

.bal-tanacsado-kuld:disabled {
	cursor: default;
	filter: saturate(.6);
	opacity: .85;
}

/* ---------------------------------------------------------------------------
   Váz (töltés közben) — NEM pörgő ikon: a valós állapotot mutatja
   --------------------------------------------------------------------------- */

.bal-tanacsado-vaz {
	margin-top: 22px;
}

.bal-tanacsado-vaz-sor {
	height: 16px;
	margin: 0 0 12px;
	border-radius: 999px;
	background: linear-gradient(90deg, #eef2ff, #f8fafc 40%, #eef2ff);
	background-size: 220% 100%;
	animation: bal-tanacsado-leng .9s linear infinite;
}

.bal-tanacsado-vaz-sor--rovid { width: 42% }
.bal-tanacsado-vaz-sor--kozep { width: 72% }

.bal-tanacsado-vaz-lepes {
	margin: 18px 0 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	color: #94a3b8;
}

@keyframes bal-tanacsado-leng {
	from { background-position: 120% 0 }
	to   { background-position: -20% 0 }
}

/* ---------------------------------------------------------------------------
   Eredmény: elemzés + csomagok
   --------------------------------------------------------------------------- */

.bal-tanacsado-eredmeny {
	margin-top: 26px;
}

.bal-tanacsado-elemzes {
	margin: 0 0 20px;
	padding: 18px 20px;
	border-radius: 22px;
	border: 1px solid #ffffff;
	background: linear-gradient(150deg, #ffffff, #f8fafc 60%, #f0fdfa);
	box-shadow: 0 26px 58px -40px #0f172a66;
	font-size: 15.5px;
	line-height: 1.6;
	color: #334155;
}

.bal-tanacsado-csomag {
	margin: 0 0 18px;
	border-radius: 26px;
	border: 1px solid #ffffff;
	background: linear-gradient(150deg, #ffffff, #f8fafc 62%, #eef2ff);
	box-shadow: 0 30px 66px -40px #0f172a66;
	overflow: hidden;
	position: relative;
}

/* a csomag bal széle a SZINT színét viszi — UGYANAZ az eszköz és UGYANAZ a
   mechanika, mint a pakli kártyáján (`.bal-ajanlo-kartya::before`):
   24px behúzás · 6px · 0 6px 6px 0 · 180deg színátmenet a márka-zöldbe. */
.bal-tanacsado-csomag::before {
	content: "";
	position: absolute;
	left: 0;
	top: 24px;
	bottom: 24px;
	width: 6px;
	border-radius: 0 6px 6px 0;
	background: linear-gradient(180deg, var(--bal-tanacsado-szin, #0a58ff), #10c98c);
}

.bal-tanacsado-csomag--entry    { --bal-tanacsado-szin: #0a58ff }
.bal-tanacsado-csomag--advanced { --bal-tanacsado-szin: #0092cf }
.bal-tanacsado-csomag--master   { --bal-tanacsado-szin: #10c98c }

.bal-tanacsado-csomag-fej {
	padding: 20px 22px 16px 24px;
}

.bal-tanacsado-csomag-szint {
	display: inline-block;
	margin: 0 0 8px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 10.5px;
	font-weight: 900;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #ffffff;
	background: var(--bal-tanacsado-szin, #0a58ff);
}

.bal-tanacsado-csomag-cim {
	margin: 0 0 6px;
	font-size: clamp(18px, 2.3vw, 23px);
	font-weight: 800;
	letter-spacing: -.01em;
	color: #0f172a;
}

.bal-tanacsado-csomag-indok {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.55;
	color: #475569;
}

.bal-tanacsado-csomag-lab {
	margin: 10px 0 0;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .06em;
	color: #94a3b8;
}

/* --- A CSOMAG TÉTELEI: ÁRAJÁNLAT-SOR -------------------------------------
   ⚠ A döntéshez szükséges MINDEN a sorban van (cím, mindkét ár, kedvezmény,
   Részletek, Kosárba, kedvenc) — NEM kell a „+"-ra kattintani. A Tutor kártyája
   „Bővebben" mögé kerül, de az sem kell a vásárláshoz. */

.bal-tanacsado-tetel {
	border-top: 1px solid #e2e8f0;
}

.bal-tanacsado-tetel-sor {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	padding: 13px 20px 13px 24px;
}

.bal-tanacsado-tetel-pont {
	width: 8px;
	height: 8px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: var(--bal-tanacsado-szin, #0a58ff);
}

.bal-tanacsado-tetel-cim {
	flex: 1 1 220px;
	min-width: 0;
	font-size: 14.5px;
	font-weight: 700;
	color: #0f172a;
}

/* ⚠ KÉPZÉSENKÉNTI INDOKLÁS (2026-10-08): a sor ALATT, teljes szélességben.
   A sor `flex-wrap: wrap`, ezért a `100%` biztosan új sorba töri; a bal
   behúzás a cím alá igazít (pont + hézag). */
.bal-tanacsado-tetel-indoklas {
	flex: 1 1 100%;
	margin: 2px 0 0 18px;
	font-size: 13px;
	line-height: 1.5;
	color: #5b6b7f;
}

/* a jobb oldali csoport: ár + gombok együtt, jobbra zárva */
.bal-tanacsado-tetel-jobb {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 8px;
	margin-left: auto;
}

/* A fizetendő ár. Akciónál a márka zöldje (#047857 — a pakli .is-igaz színe),
   mellette az ÁTHÚZOTT listaár és a kedvezmény-badge: így a kettő viszonya
   egy pillantásra világos. */
.bal-tanacsado-tetel-ar {
	font-size: 13.5px;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	color: #0f172a;
	white-space: nowrap;
}

.bal-tanacsado-tetel-ar.is-akcios {
	color: #047857;
}

/* A listaár CSAK akkor látszik, ha EL TÉR a fizetendő ártól (akció). */
.bal-tanacsado-tetel-listaar {
	font-size: 12px;
	font-variant-numeric: tabular-nums;
	color: #94a3b8;
	text-decoration: line-through;
	white-space: nowrap;
}

.bal-tanacsado-tetel-kedvezmeny {
	padding: 2px 7px;
	border-radius: 999px;
	background: #ecfdf5;
	border: 1px solid #a7f3d0;
	color: #047857;
	font-size: 11px;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

/* --- a sor gombjai ------------------------------------------------------- */

.bal-tanacsado-reszletek,
.bal-tanacsado-kosar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 8px 14px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 800;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	transition: transform .18s, box-shadow .22s, border-color .22s, background .22s;
}

.bal-tanacsado-reszletek {
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #334155;
}

.bal-tanacsado-reszletek:hover {
	transform: translateY(-2px);
	border-color: #c7d2fe;
	box-shadow: 0 14px 28px -18px #0f172a66;
}

/* a Tutor saját osztályait használjuk, ezért csak a MÉRETET igazítjuk */
.bal-tanacsado-kosar.tutor-btn {
	min-height: 38px;
	margin: 0;
	padding: 8px 16px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 800;
}

/* „Már a tiéd" — megvásárolt képzésnél nem kínáljuk újra */
.bal-tanacsado-mar {
	padding: 5px 11px;
	border-radius: 999px;
	background: #ecfdf5;
	border: 1px solid #a7f3d0;
	color: #047857;
	font-size: 11.5px;
	font-weight: 800;
	white-space: nowrap;
}

/* Kedvenc (Tutor wishlist) — ugyanaz a mechanizmus, mint a kurzuslistán */
.bal-tanacsado-sziv {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	flex: 0 0 auto;
	border-radius: 999px;
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #94a3b8;
	font-size: 17px;
	line-height: 1;
	text-decoration: none;
	transition: transform .18s, border-color .22s, background .22s, color .22s;
}

/* ⚠⚠ A SZÍV A TUTOR IKON-OSZTÁLYÁBÓL JÖN — MÉRVE 2026-10-06.
   A Tutor kedvenc-JS-e az `<i>` osztályát váltja
   (`tutor-icon-bookmark-line` ↔ `tutor-icon-bookmark-bold`), ezért a markup
   az ő ikonját hordozza. A GLYPH viszont a felhasználó kérése szerint SZÍV,
   nem könyvjelzô — ezt itt cseréljük le.

   ⚠ A `content`-et a Tutor ikon-fontja is állítja (`.tutor-icon-bookmark-line`),
     ezért KELL a hosszabb szelektor (`.bal-tanacsado-sziv i.<ikon-osztaly>`),
     különben a könyvjelzô-glyph gyôzne, és a szív nem látszana. A `font-family`
     visszaállítása ugyanezért kell: a szívet a sima szöveg-font rajzolja. */
.bal-tanacsado-sziv i.tutor-icon-bookmark-line::before,
.bal-tanacsado-sziv i.tutor-icon-bookmark-bold::before {
	font-family: inherit;
	font-size: 17px;
	line-height: 1;
}

.bal-tanacsado-sziv i.tutor-icon-bookmark-line::before {
	content: "♡";
}

.bal-tanacsado-sziv i.tutor-icon-bookmark-bold::before {
	content: "♥";
}

.bal-tanacsado-sziv:hover {
	transform: translateY(-2px);
	border-color: #fecaca;
	background: #fef2f2;
	color: #e11d48;
}

/* A Tutor a mentett állapotban `tutor-icon-bookmark-bold`-ot tesz az ikonra. */
.bal-tanacsado-sziv.is-kedvenc,
.bal-tanacsado-sziv:has(.tutor-icon-bookmark-bold) {
	border-color: #fecaca;
	background: #fef2f2;
	color: #e11d48;
}

/* --- SZINT-KOSÁR: az egész szint egy gombbal ------------------------------ */

.bal-tanacsado-szint-kosar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 12px;
	min-height: 40px;
	padding: 9px 16px;
	border: 0;
	border-radius: 999px;
	background: var(--bal-tanacsado-szin, #0a58ff);
	color: #ffffff;
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
	transition: transform .18s, box-shadow .22s, filter .22s;
}

.bal-tanacsado-szint-kosar:hover:not(:disabled) {
	transform: translateY(-2px);
	box-shadow: 0 16px 30px -18px var(--bal-tanacsado-szin, #0a58ff);
}

.bal-tanacsado-szint-kosar:disabled {
	cursor: default;
	filter: saturate(.6);
	opacity: .85;
}

/* --- a Tutor kártyája: „Bővebben" mögött ---------------------------------- */

.bal-tanacsado-tetel-bovebb {
	border-top: 1px dashed #e2e8f0;
}

.bal-tanacsado-tetel-bovebb > summary {
	padding: 9px 20px 9px 24px;
	cursor: pointer;
	list-style: none;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .04em;
	color: #94a3b8;
}

.bal-tanacsado-tetel-bovebb > summary::-webkit-details-marker { display: none }

.bal-tanacsado-tetel-bovebb > summary::before {
	content: "+";
	display: inline-block;
	width: 14px;
	font-weight: 800;
}

.bal-tanacsado-tetel-bovebb[open] > summary::before {
	content: "–";
}

.bal-tanacsado-tetel-bovebb[open] > summary {
	color: #475569;
}

.bal-tanacsado-tetel-torzs {
	padding: 0 18px 18px;
}

/* ⚠⚠ A KÖZÖS KÁRTYA ÁR-SORA ELREJTVE EBBEN A MODULBAN (mérve 2026-10-03).
   A `balance_ar_felirat()` csak a `tutor_course_price`-t (listaár) olvassa,
   ezért a 3604-es kurzusnál „39 900 Ft"-ot ír, míg az ÉLES kurzrusoldal
   **29 900 Ft**-ot mutat (`tutor_course_sale_price`).
   ⚠ A sor FEJLÉCE viszont MINDKÉT árat mutatja (áthúzott listaár + fizetendő
   ár + kedvezmény) — vagyis ár NEM tűnik el, csak nem kétszer szerepel, és
   nem hiányosan. A közös függvény hibáját KÜLÖN kell javítani (a többi oldal
   kártyáját is érinti). */
.bal-tanacsado-tetel-torzs .bal-top-price {
	display: none;
}

.bal-tanacsado-tetel-torzs .bal-top-card {
	box-shadow: none;
	border: 1px solid #e2e8f0;
	margin: 0;
}

/* ---------------------------------------------------------------------------
   „AJÁNLOTT KÉPZÉSEK" — amit még nem vett meg és nem kedvencelt
   --------------------------------------------------------------------------- */

.bal-tanacsado-ajanlott {
	margin: 8px 0 18px;
	padding: 18px 20px;
	border-radius: 22px;
	border: 1px dashed #c7d2fe;
	background: linear-gradient(150deg, #ffffff, #f8fafc 70%, #eef2ff);
}

.bal-tanacsado-ajanlott-cim {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .02em;
	color: #475569;
}

.bal-tanacsado-ajanlott-sor {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	flex-wrap: wrap;
	padding: 9px 0;
	border-top: 1px solid #e2e8f0;
}

.bal-tanacsado-ajanlott-sor:first-of-type {
	border-top: 0;
}

.bal-tanacsado-ajanlott-nev {
	flex: 1 1 200px;
	min-width: 0;
	font-size: 14px;
	font-weight: 700;
	color: #0f172a;
	text-decoration: none;
}

.bal-tanacsado-ajanlott-nev:hover {
	color: #0a58ff;
}

.bal-tanacsado-forras {
	margin: 4px 0 16px;
	font-size: 12.5px;
	color: #94a3b8;
}

.bal-tanacsado-ujra {
	min-height: 46px;
	padding: 11px 20px;
	border-radius: 999px;
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #334155;
	font-size: 14px;
	font-weight: 800;
	cursor: pointer;
	transition: transform .18s, box-shadow .22s, border-color .22s;
}

.bal-tanacsado-ujra:hover {
	transform: translateY(-2px);
	border-color: #c7d2fe;
	box-shadow: 0 16px 32px -18px #0f172a66;
}

.bal-tanacsado-uzenet {
	margin: 0 0 16px;
	padding: 14px 18px;
	border-radius: 18px;
	border: 1px solid #e2e8f0;
	background: #f8fafc;
	font-size: 14.5px;
	color: #475569;
}

.bal-tanacsado-uzenet--figyelem {
	border-color: #fecaca;
	background: #fef2f2;
	color: #b91c1c;
}

.bal-tanacsado-uzenet--jo {
	border-color: #a7f3d0;
	background: #ecfdf5;
	color: #047857;
}

.bal-tanacsado-uzenet a {
	color: #0a58ff;
	font-weight: 700;
}

/* ---------------------------------------------------------------------------
   Mobil
   --------------------------------------------------------------------------- */

@media (max-width: 900px) {
	.bal-tanacsado-urlap { padding: 16px; border-radius: 22px }
	.bal-tanacsado-csomag { border-radius: 22px }
	.bal-tanacsado-csomag-fej { padding: 18px 16px 14px 20px }
	.bal-tanacsado-tetel-sor { padding: 12px 16px 12px 20px }
	.bal-tanacsado-tetel-cim { flex: 1 1 100% }
	.bal-tanacsado-tetel-jobb { margin-left: 0; width: 100%; justify-content: flex-start }
	.bal-tanacsado-tetel-bovebb > summary { padding: 9px 16px 9px 20px }
	.bal-tanacsado-urlap-lab { flex-wrap: wrap }
	.bal-tanacsado-kuld { flex: 1 1 100% }
}

/* ---------------------------------------------------------------------------
   Csökkentett mozgás — nincs lengés, nincs emelkedés
   --------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.bal-tanacsado-chip,
	.bal-tanacsado-kuld,
	.bal-tanacsado-ujra,
	.bal-tanacsado-tetel > summary::after {
		transition: none;
	}

	.bal-tanacsado-vaz-sor { animation: none }
}