/* Legal pages (privacy policy, accessibility statement): header, reading column, typography and
   table of contents. Mobile first; 768 tablet, 1024 two-column desktop, content capped at 1140px.
   Tokens match the press section and the consultation banner. */

body.ta-legal-page {
	--ta-legal-surface: #ffffff;
	--ta-legal-card: #f3f6ff;
	--ta-legal-ink: #292566;
	--ta-legal-text: #292b43;
	--ta-legal-muted: #53516c;
	--ta-legal-accent: #0062fe;
	--ta-legal-accent-hover: #0054d9;
	--ta-legal-border: #dedfe6;
	--ta-legal-divider: #e8e8ec;
	--ta-legal-font-head: Alef, sans-serif;
	--ta-legal-font-body: Heebo, sans-serif;

	--ta-legal-max-width: 1140px;
	--ta-legal-gutter: 16px;
	--ta-legal-pad-top: 32px;
	--ta-legal-pad-bottom: 48px;
	--ta-legal-anchor-offset: 120px;
}

/* ---- Page frame and header ---- */

body.ta-legal-page main#content.site-main {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: var(--ta-legal-pad-top) var(--ta-legal-gutter) var(--ta-legal-pad-bottom);
	background: var(--ta-legal-surface);
	direction: rtl;
}

body.ta-legal-page main#content > .page-header,
body.ta-legal-page main#content > .page-content {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--ta-legal-max-width);
	margin-inline: auto;
	padding: 0;
}

body.ta-legal-page main#content > .page-header {
	margin-bottom: 32px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--ta-legal-divider);
}

body.ta-legal-page main#content .page-header .entry-title {
	margin: 0;
	padding: 0;
	color: var(--ta-legal-ink);
	font-family: var(--ta-legal-font-head);
	font-size: 36px;
	font-weight: 700;
	line-height: 45px;
	text-align: start;
}

/* ---- Layout: table of contents above the text on small screens, beside it on desktop ---- */

.ta-legal {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.ta-legal__article {
	min-width: 0;
	max-width: 760px;
	color: var(--ta-legal-text);
	font-family: var(--ta-legal-font-body);
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
	text-align: start;
}

/* ---- Table of contents ---- */

.ta-legal__toc {
	box-sizing: border-box;
	padding: 20px;
	border: 1px solid var(--ta-legal-divider);
	border-radius: 20px;
	background: var(--ta-legal-card);
}

.ta-legal__toc-title {
	margin: 0 0 12px;
	color: var(--ta-legal-ink);
	font-family: var(--ta-legal-font-head);
	font-size: 18px;
	font-weight: 700;
	line-height: 26px;
}

/* button.<class>: the theme's reset.css styles every plain <button> (pink hover/focus, padding,
   radius, font), so each state is stated explicitly with tag + class. */
button.ta-legal__toc-toggle {
	all: unset;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 44px;
	color: var(--ta-legal-ink);
	cursor: pointer;
	font-family: var(--ta-legal-font-head);
	font-size: 18px;
	font-weight: 700;
	line-height: 26px;
}

button.ta-legal__toc-toggle[hidden] {
	display: none;
}

button.ta-legal__toc-toggle:hover,
button.ta-legal__toc-toggle:focus,
button.ta-legal__toc-toggle:active {
	background: transparent;
	color: var(--ta-legal-ink);
}

button.ta-legal__toc-toggle:focus-visible {
	outline: 2px solid var(--ta-legal-accent);
	outline-offset: 4px;
	border-radius: 6px;
}

.ta-legal__toc-toggle svg {
	flex-shrink: 0;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	transition: transform 0.2s ease;
}

.ta-legal__toc-toggle[aria-expanded='true'] svg {
	transform: rotate(180deg);
}

/* With the toggle shown (small screens, script running) the plain title is redundant. */
.ta-legal__toc.is-collapsible .ta-legal__toc-title {
	display: none;
}

.ta-legal__toc.is-collapsible .ta-legal__toc-list {
	margin-top: 12px;
}

.ta-legal__toc-list[hidden] {
	display: none;
}

.ta-legal__toc-list {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ta-legal__toc-item {
	margin: 0;
	padding: 0;
}

/* body.ta-legal-page prefix: the Elementor kit's `a { text-decoration: underline }` ties otherwise. */
body.ta-legal-page .ta-legal__toc-item a,
body.ta-legal-page .ta-legal__toc-item a:hover,
body.ta-legal-page .ta-legal__toc-item a:focus,
body.ta-legal-page .ta-legal__toc-item a:active {
	display: block;
	padding: 8px 12px;
	border-inline-start: 2px solid transparent;
	color: var(--ta-legal-muted);
	font-family: var(--ta-legal-font-body);
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
	text-decoration: none;
}

.ta-legal__toc-item.is-level-3 a {
	padding-inline-start: 28px;
	font-size: 13px;
}

body.ta-legal-page .ta-legal__toc-item a:hover {
	color: var(--ta-legal-ink);
}

body.ta-legal-page .ta-legal__toc-item a[aria-current='location'] {
	border-inline-start-color: var(--ta-legal-accent);
	color: var(--ta-legal-ink);
	font-weight: 500;
}

.ta-legal__toc-item a:focus-visible {
	outline: 2px solid var(--ta-legal-accent);
	outline-offset: 2px;
	border-radius: 4px;
}

/* ---- Article typography ---- */

.ta-legal__article > :first-child {
	margin-top: 0;
}

.ta-legal__article p {
	margin: 0 0 16px;
	padding: 0;
	color: var(--ta-legal-text);
	font-family: var(--ta-legal-font-body);
	font-size: 16px;
	line-height: 28px;
}

/* The opening paragraph is the lead. */
.ta-legal__article > p:first-child {
	color: var(--ta-legal-muted);
	font-size: 18px;
	line-height: 30px;
}

.ta-legal__article h2,
.ta-legal__article h3 {
	scroll-margin-top: var(--ta-legal-anchor-offset);
	color: var(--ta-legal-ink);
	font-family: var(--ta-legal-font-head);
	font-weight: 700;
	text-align: start;
}

.ta-legal__article h2 {
	margin: 40px 0 16px;
	padding: 28px 0 0;
	border-top: 1px solid var(--ta-legal-divider);
	font-size: 24px;
	line-height: 32px;
}

.ta-legal__article h3 {
	margin: 28px 0 8px;
	padding: 0;
	font-size: 18px;
	line-height: 26px;
}

.ta-legal__article h2 + h3 {
	margin-top: 0;
}

.ta-legal__article strong {
	color: var(--ta-legal-ink);
	font-weight: 700;
}

.ta-legal__article ul,
.ta-legal__article ol {
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.ta-legal__article li {
	position: relative;
	margin: 0 0 8px;
	padding-inline-start: 22px;
	color: var(--ta-legal-text);
	font-family: var(--ta-legal-font-body);
	font-size: 16px;
	line-height: 28px;
}

.ta-legal__article ul > li::before {
	content: '';
	position: absolute;
	inset-block-start: 11px;
	inset-inline-start: 4px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--ta-legal-accent);
}

.ta-legal__article ol {
	counter-reset: ta-legal-item;
}

.ta-legal__article ol > li {
	counter-increment: ta-legal-item;
}

.ta-legal__article ol > li::before {
	content: counter(ta-legal-item) '.';
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	color: var(--ta-legal-accent);
	font-family: var(--ta-legal-font-head);
	font-weight: 700;
}

/* Links: the theme's reset.css makes every link pink, so all states are stated. */
.ta-legal__article a,
.ta-legal__article a:active {
	color: var(--ta-legal-accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.ta-legal__article a:hover,
.ta-legal__article a:focus {
	color: var(--ta-legal-accent-hover);
	text-decoration-thickness: 2px;
}

.ta-legal__article a:focus-visible {
	outline: 2px solid var(--ta-legal-accent);
	outline-offset: 2px;
	border-radius: 3px;
}

/* Phone numbers keep their left-to-right digits inside right-to-left text. */
.ta-legal__article a[href^='tel:'] {
	display: inline-block;
	direction: ltr;
	unicode-bidi: isolate;
}

/* ---- Tablet ---- */

@media (min-width: 768px) {
	body.ta-legal-page {
		--ta-legal-gutter: 32px;
		--ta-legal-pad-top: 48px;
		--ta-legal-pad-bottom: 64px;
	}

	body.ta-legal-page main#content > .page-header {
		margin-bottom: 40px;
		padding-bottom: 32px;
	}

	body.ta-legal-page main#content .page-header .entry-title {
		font-size: 48px;
		line-height: 60px;
	}

	.ta-legal__toc {
		padding: 24px;
	}
}

/* ---- Desktop: text on the right edge under the heading, sticky contents on the left ---- */

@media (min-width: 1024px) {
	.ta-legal.has-toc {
		display: grid;
		grid-template-columns: minmax(0, 760px) 300px;
		grid-template-areas: 'article toc';
		justify-content: space-between;
		align-items: start;
		gap: 64px;
	}

	.ta-legal.has-toc .ta-legal__article {
		grid-area: article;
	}

	.ta-legal.has-toc .ta-legal__toc {
		grid-area: toc;
		position: sticky;
		inset-block-start: var(--ta-legal-anchor-offset);
		max-height: calc(100vh - var(--ta-legal-anchor-offset) - 24px);
		overflow-y: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ta-legal__toc-toggle svg {
		transition: none;
	}
}

@media print {
	.ta-legal__toc {
		display: none;
	}

	.ta-legal.has-toc {
		display: block;
	}

	.ta-legal__article {
		max-width: none;
	}
}