/* ==========================================================================
   Soul4You – interaktív munkafüzet
   Két különálló felület van ebben a fájlban:
     .s4y-mf    – a leckébe ágyazott, kitölthető munkafüzet (sötét-arany arculat)
     .s4y-mfny  – az önálló nyomtatási nézet (papír-szerű, fehér)
   A .s4y-mfny azért nem örökli a téma stílusait, mert önálló oldalként fut,
   téma nélkül – így kiszámítható marad, amit a nyomtató és a PDF kap.
   ========================================================================== */

.s4y-mf {
	--mf-arany:   #C9A96E;
	--mf-arany-v: #E8C97A;
	--mf-keret:   rgba(201, 169, 110, 0.20);
	--mf-lap:     rgba(255, 255, 255, 0.028);
	--mf-szoveg:  rgba(240, 236, 228, 0.86);
	--mf-halk:    rgba(240, 236, 228, 0.55);

	margin: 2.5rem 0;
	padding: 1.75rem;
	border: 1px solid var(--mf-keret);
	border-radius: 14px;
	background: var(--mf-lap);
	color: var(--mf-szoveg);
	font-family: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	line-height: 1.65;
}

/* ---------- fejléc ---------- */

.s4y-mf__fejlec {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: flex-start;
	justify-content: space-between;
}

.s4y-mf__cimke {
	margin: 0 0 .35rem;
	font-size: .68rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--mf-arany);
}

.s4y-mf__cim {
	margin: 0;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.6rem;
	font-weight: 500;
	color: #F3EFE7;
}

.s4y-mf__alcim {
	margin: .2rem 0 0;
	font-size: .95rem;
	color: var(--mf-halk);
	font-style: italic;
}

.s4y-mf__allapot {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: .3rem;
	font-size: .8rem;
	color: var(--mf-halk);
}

.s4y-mf__szamlalo b { color: var(--mf-arany); }

/* mentés-visszajelzés: alapból láthatatlan, a JS villantja fel */
.s4y-mf__mentes {
	opacity: 0;
	transition: opacity .25s ease;
	font-size: .75rem;
	letter-spacing: .06em;
	color: var(--mf-arany);
}
.s4y-mf__mentes.lathato { opacity: 1; }
.s4y-mf__mentes.hiba    { color: #E5837B; opacity: 1; }

/* ---------- haladás ---------- */

.s4y-mf__sav {
	height: 3px;
	margin: 1rem 0 1.25rem;
	border-radius: 3px;
	background: rgba(255, 255, 255, 0.07);
	overflow: hidden;
}
.s4y-mf__sav i {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, var(--mf-arany-v), var(--mf-arany));
	transition: width .35s ease;
}

.s4y-mf__info {
	margin: 0 0 1.5rem;
	font-size: .85rem;
	color: var(--mf-halk);
}
.s4y-mf__info strong { color: var(--mf-arany); font-weight: 500; }

.s4y-mf__bevezeto {
	margin: 0 0 1.75rem;
	padding-left: 1rem;
	border-left: 2px solid var(--mf-keret);
	font-style: italic;
	color: var(--mf-halk);
}

/* ---------- tartalom ---------- */

.s4y-mf__szakasz {
	margin: 2.25rem 0 .9rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--mf-keret);
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.28rem;
	font-weight: 500;
	color: var(--mf-arany);
}
.s4y-mf__szakasz:first-of-type { border-top: 0; padding-top: 0; }

.s4y-mf__szoveg  { margin: 0 0 1rem; }
.s4y-mf__szoveg--dolt { font-style: italic; color: var(--mf-halk); }

.s4y-mf__kiemeles {
	margin: 0 0 1rem;
	font-weight: 500;
	color: #F0ECE4;
}

/* ---------- kérdés + mező ---------- */

.s4y-mf__kerdes { margin: 0 0 1.6rem; }

.s4y-mf__kerdes-cimke {
	margin: 0 0 .3rem;
	font-size: .68rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--mf-arany);
}

.s4y-mf__kerdes-cim {
	display: block;
	margin: 0 0 .3rem;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.12rem;
	color: #F3EFE7;
}

.s4y-mf__kerdes-sugo {
	margin: 0 0 .55rem;
	font-size: .85rem;
	font-style: italic;
	color: var(--mf-halk);
}

.s4y-mf__doboz,
.s4y-mf__sor {
	display: block;
	width: 100%;
	margin-bottom: .5rem;
	padding: .75rem .9rem;
	border: 1px solid var(--mf-keret);
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.22);
	color: #F3EFE7;
	font-family: inherit;
	font-size: .95rem;
	line-height: 1.6;
	transition: border-color .18s ease, box-shadow .18s ease;
	resize: vertical;
	box-sizing: border-box;
}

.s4y-mf__doboz:focus,
.s4y-mf__sor:focus {
	outline: none;
	border-color: rgba(201, 169, 110, 0.55);
	box-shadow: 0 0 0 3px rgba(201, 169, 110, 0.10);
}

.s4y-mf__doboz::placeholder,
.s4y-mf__sor::placeholder { color: rgba(240, 236, 228, 0.30); }

/* Datummezo: nem kell teljes szelesseg, es a bongeszo sajat naptar-ikonja
   sotet hatteren csak akkor latszik, ha a color-scheme is sotet. */
.s4y-mf__sor--datum {
	width: auto;
	min-width: 11rem;
	max-width: 100%;
	color-scheme: dark;
}

/* ---------- napkártya (Lélekírás Napló) ---------- */

.s4y-mf__nap {
	margin: 1.5rem 0;
	padding: 1.35rem;
	border: 1px solid var(--mf-keret);
	border-radius: 12px;
	background: rgba(0, 0, 0, 0.16);
}

.s4y-mf__nap-fej {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .6rem;
	margin-bottom: 1.15rem;
	padding-bottom: .65rem;
	border-bottom: 1px solid var(--mf-keret);
}

.s4y-mf__nap-szam {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.35rem;
	color: var(--mf-arany);
}

.s4y-mf__nap-tema {
	font-size: .72rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--mf-halk);
}

.s4y-mf__nap .s4y-mf__kerdes:last-child { margin-bottom: 0; }

/* ---------- lábléc ---------- */

.s4y-mf__lab {
	margin-top: 2rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--mf-keret);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem 1rem;
}

.s4y-mf__lab-sugo {
	font-size: .8rem;
	color: var(--mf-halk);
	flex: 1 1 16rem;
}

.s4y-mf__gomb {
	display: inline-block;
	padding: .7rem 1.4rem;
	border: 1px solid var(--mf-arany);
	border-radius: 999px;
	background: transparent;
	color: var(--mf-arany);
	font-size: .85rem;
	letter-spacing: .05em;
	text-decoration: none;
	cursor: pointer;
	transition: background .2s ease, color .2s ease;
}
.s4y-mf__gomb:hover {
	background: var(--mf-arany);
	color: #0C0B09;
}

/* ---------- zárt állapot (nincs belépve / nincs jogosultság) ---------- */

.s4y-mf--zart { text-align: center; }
.s4y-mf__zar-cim {
	margin: 0 0 .75rem;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.3rem;
	color: var(--mf-arany);
}

/* ---------- mobil ---------- */

@media (max-width: 640px) {
	.s4y-mf { padding: 1.2rem; }
	.s4y-mf__allapot { align-items: flex-start; }
	.s4y-mf__nap { padding: 1rem; }
}


/* ==========================================================================
   NYOMTATÁSI NÉZET – önálló oldal, téma nélkül
   ========================================================================== */

body.s4y-mfny {
	margin: 0;
	padding: 2rem 1rem 4rem;
	background: #E9E6E0;
	color: #1B1814;
	font-family: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 15px;
	line-height: 1.7;
}

.s4y-mfny__lap {
	max-width: 46rem;
	margin: 0 auto;
	padding: 3rem 3.25rem 3.5rem;
	background: #FFFDF9;
	box-shadow: 0 2px 24px rgba(0, 0, 0, 0.12);
}

.s4y-mfny__eszkozsor {
	display: flex;
	gap: 1rem;
	align-items: center;
	margin: -1.5rem 0 2rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid #E2DACB;
}

.s4y-mfny__eszkozsor button {
	padding: .6rem 1.3rem;
	border: 1px solid #A6845A;
	border-radius: 999px;
	background: #A6845A;
	color: #fff;
	font: inherit;
	font-size: .85rem;
	cursor: pointer;
}
.s4y-mfny__eszkozsor button:hover { background: #8E6F49; border-color: #8E6F49; }
.s4y-mfny__eszkozsor a { color: #8E6F49; font-size: .85rem; }

.s4y-mfny__fej {
	margin-bottom: 2.5rem;
	padding-bottom: 1.5rem;
	border-bottom: 2px solid #C9A96E;
}

.s4y-mfny__brand {
	margin: 0 0 .5rem;
	font-size: .7rem;
	letter-spacing: .32em;
	color: #A6845A;
}

.s4y-mfny__fej h1 {
	margin: 0;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 2rem;
	font-weight: 500;
}

.s4y-mfny__meta {
	margin: .5rem 0 0;
	font-size: .82rem;
	color: #6B6154;
}

.s4y-mfny__fuzet + .s4y-mfny__fuzet {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid #E2DACB;
	page-break-before: always;
}

.s4y-mfny__fuzet-cim {
	margin: 0 0 1.25rem;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.6rem;
	font-weight: 500;
	color: #8E6F49;
}

.s4y-mfny__bevezeto {
	margin: 0 0 2rem;
	padding-left: 1rem;
	border-left: 2px solid #E2DACB;
	font-style: italic;
	color: #5C5348;
}

.s4y-mfny__szakasz {
	margin: 2.25rem 0 .85rem;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.3rem;
	font-weight: 500;
	color: #8E6F49;
	page-break-after: avoid;
}
.s4y-mfny__szakasz span { font-size: .78rem; color: #857B6C; letter-spacing: .1em; }

.s4y-mfny__szoveg { margin: 0 0 .9rem; color: #3A342C; }

.s4y-mfny__nap {
	margin: 1.5rem 0;
	padding: 1.25rem 1.4rem;
	border: 1px solid #E2DACB;
	page-break-inside: avoid;
}

.s4y-mfny__kerdes { margin: 0 0 1.4rem; page-break-inside: avoid; }

.s4y-mfny__cimke {
	margin: 0 0 .2rem;
	font-size: .66rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #A6845A;
}

.s4y-mfny__kerdes-cim {
	margin: 0 0 .25rem;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-size: 1.1rem;
	color: #241F19;
}

.s4y-mfny__sugo {
	margin: 0 0 .45rem;
	font-size: .84rem;
	font-style: italic;
	color: #6B6154;
}

.s4y-mfny__valasz {
	padding: .7rem .9rem;
	border-left: 3px solid #C9A96E;
	background: #F7F3EA;
	white-space: pre-wrap;
}

/* üresen hagyott mező: vonalak, hogy kinyomtatva kézzel is kitölthető legyen */
.s4y-mfny__ures {
	height: 4.5rem;
	background-image: repeating-linear-gradient(
		to bottom,
		transparent 0,
		transparent 1.44rem,
		#DED6C6 1.44rem,
		#DED6C6 calc(1.44rem + 1px)
	);
}

.s4y-mfny__lab {
	margin-top: 3rem;
	padding-top: 1.25rem;
	border-top: 1px solid #E2DACB;
	text-align: center;
	font-size: .78rem;
	letter-spacing: .12em;
	color: #A6845A;
}

@media print {
	body.s4y-mfny { background: #fff; padding: 0; font-size: 11pt; }
	.s4y-mfny__lap { max-width: none; padding: 0; box-shadow: none; }
	.s4y-mfny__eszkozsor { display: none; }
	.s4y-mfny__valasz { background: transparent; }
	a[href]:after { content: none !important; }
}

@media (max-width: 640px) {
	.s4y-mfny__lap { padding: 1.5rem 1.25rem 2rem; }
}
