/* ==========================================================================
   Documente legale (Termeni, Confidențialitate, Cookies).

   Găsit în audit UX (2026-09-25): arătau „ca niște template-uri de bază" —
   paragrafe simple, fără nicio identitate vizuală de document real. Antet cu
   etichetă + cuprins lateral generat automat (vezi legal-toc.js) rezolvă
   exact acea senzație, fără să inventeze conținut nou.
   ========================================================================== */

.jp-legaldoc__head {
	max-width: 68ch;
	margin: 0 auto var(--jp-s7);
	padding-top: var(--jp-s2);
	text-align: center;
}

.jp-legaldoc__eyebrow {
	display: inline-block;
	margin-bottom: var(--jp-s3);
	padding: 4px var(--jp-s3);
	border-radius: var(--jp-r-full);
	background: var(--jp-primary-50);
	color: var(--jp-primary-700);
	font-family: var(--jp-font-heading);
	font-size: var(--jp-fs-caption);
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.jp-legaldoc__title { margin: 0; }

.jp-legaldoc__body {
	display: grid;
	gap: var(--jp-s7);
	max-width: 1000px;
	margin-inline: auto;
}

@media (min-width: 900px) {
	.jp-legaldoc__body {
		grid-template-columns: 220px minmax(0, 1fr);
		align-items: start;
	}
}

/* ---------- Cuprins ---------- */
.jp-legaldoc__toc {
	order: 2;
	padding: var(--jp-s4);
	border: 1px solid var(--jp-ink-100);
	border-radius: var(--jp-r-lg);
	background: var(--jp-ink-50);
}

.jp-legaldoc__toc ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

/*
 * Redesenat (2026-09-11): varianta anterioară marca secțiunea curentă cu un
 * chenar colorat pe muchia stângă — semnalat explicit ca „prea AI", același
 * tipar deja eliminat de pe cardurile din dashboard. Aici starea activă vine
 * dintr-un fundal plin + text îngroșat, fără nicio bordură — un singur
 * dreptunghi, nu un dreptunghi cu o dungă de culoare lipită pe o parte.
 */
.jp-legaldoc__toc-link {
	display: block;
	padding: 6px var(--jp-s3);
	border-radius: var(--jp-r-sm);
	color: var(--jp-ink-500);
	font-size: var(--jp-fs-small);
	text-decoration: none;
	line-height: 1.4;
	transition: color var(--jp-t-fast) var(--jp-ease), background var(--jp-t-fast) var(--jp-ease);
}

.jp-legaldoc__toc-link:hover {
	color: var(--jp-primary-700);
	background: var(--jp-white);
}

.jp-legaldoc__toc-link.is-active {
	background: var(--jp-primary-600);
	color: var(--jp-white);
	font-weight: 600;
}

@media (min-width: 900px) {
	.jp-legaldoc__toc {
		order: 1;
		position: sticky;
		top: calc(var(--jp-header-h) + var(--jp-s4));
		max-height: calc(100vh - var(--jp-header-h) - var(--jp-s7));
		overflow-y: auto;
	}
}

/* ---------- Corpul documentului ---------- */
.jp-legaldoc__body [data-jp-legal-content] {
	order: 3;
	max-width: 68ch;
}

@media (min-width: 900px) {
	.jp-legaldoc__body [data-jp-legal-content] { order: 2; }
}

/* Prima linie a conținutului e mereu „Ultima actualizare: …" (paragraf cu
   <em>) — o transformăm dintr-o linie de text simplă într-o etichetă vizuală,
   ca pe orice document versionat real. */
[data-jp-legal-content] > p:first-child {
	display: inline-block;
	margin-bottom: var(--jp-s6);
	padding: var(--jp-s2) var(--jp-s3);
	border-radius: var(--jp-r-sm);
	background: var(--jp-ink-50);
	color: var(--jp-ink-500);
	font-size: var(--jp-fs-caption);
}

[data-jp-legal-content] > p:first-child em { font-style: normal; }

[data-jp-legal-content] h2 {
	margin-top: var(--jp-s8);
	padding-top: var(--jp-s6);
	border-top: 1px solid var(--jp-ink-100);
	scroll-margin-top: calc(var(--jp-header-h) + var(--jp-s4));
}

[data-jp-legal-content] h2:first-of-type {
	margin-top: var(--jp-s6);
	padding-top: 0;
	border-top: none;
}

/*
 * Casetă evidențiată, pentru clauzele importante.
 * Redesenată (2026-09-11): varianta anterioară avea bordură colorată pe
 * muchia stângă + fundal ușor colorat — semnalat explicit ca tipar „de AI".
 * Acum: card neutru (alb, umbră discretă, fără nicio bordură colorată) +
 * o etichetă mică cu iconiță, care spune EXPLICIT ce e caseta („Clauză
 * importantă") — semnalul vine din conținut, nu dintr-o dungă de culoare.
 */
[data-jp-legal-content] .jp-legal-callout {
	position: relative;
	margin: var(--jp-s5) 0;
	padding: var(--jp-s5);
	padding-top: calc(var(--jp-s5) + var(--jp-s6));
	border-radius: var(--jp-r-lg);
	background: var(--jp-white);
	box-shadow: var(--jp-sh-2);
	max-width: none;
}

/* Punctul e un caracter, nu un al doilea pseudo-element poziționat separat —
   un singur `content`, fără riscul dezalinierii între etichetă și marcaj. */
[data-jp-legal-content] .jp-legal-callout::before {
	content: '● Clauză importantă';
	position: absolute;
	top: var(--jp-s4);
	left: var(--jp-s5);
	padding: 3px var(--jp-s3);
	border-radius: var(--jp-r-full);
	background: var(--jp-primary-50);
	color: var(--jp-primary-700);
	font-family: var(--jp-font-heading);
	font-size: var(--jp-fs-caption);
	font-weight: 700;
	letter-spacing: .01em;
}

[data-jp-legal-content] .jp-legal-callout p {
	margin: 0;
	max-width: none;
	color: var(--jp-ink-700);
}

[data-jp-legal-content] .jp-legal-callout p + p { margin-top: var(--jp-s2); }