/*
 * eDetal text pages (templates/page-legal.php): design-v3 Legal. Classes .lg-* on top of the .ed-* components.
 * Loaded on pages that use the legal template only.
 */
.ed-legal,
.ed-legal .site-content {
	background-color: var(--ed-canvas);
}

.ed-legal .site-content {
	margin: 0;
	padding: 0;
}

.ed-legal .site-content > .container {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.lg-page {
	padding-bottom: 64px;
}

.lg-page :is(h1, h2, h3, p, ul, ol, dl) {
	margin: 0;
}

.lg-crumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	padding: 20px 0 4px;
	font-size: 14px;
	color: var(--ed-muted);
}

.lg-crumbs a {
	color: var(--ed-muted);
}

.lg-head {
	display: flex;
	flex-direction: column;
	gap: 8px;
	max-width: 860px;
	padding: 12px 0 24px;
}

.lg-head .ed-eyebrow {
	color: var(--ed-action);
}

.lg-draft {
	max-width: 860px;
	margin-bottom: 24px;
}

.lg {
	display: grid;
	grid-template-columns: 272px minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}

.lg-side {
	position: sticky;
	top: 16px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

.lg-toc__btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	min-height: 52px;
	padding: 0 16px;
	border: 1px solid var(--ed-border-strong);
	border-radius: var(--r-md);
	background: var(--ed-surface);
	color: var(--ed-ink);
	font: inherit;
	font-size: 15px;
	font-weight: 650;
	text-align: left;
	cursor: pointer;
}

.lg-toc__btn[hidden],
.lg-toc__body[hidden] {
	display: none;
}

.lg-toc__btn[aria-expanded="true"] .ed-ic {
	transform: rotate(180deg);
}

.lg-toc__list {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	list-style: none;
	border-left: 2px solid var(--ed-border);
}

.lg-toc__list a {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 4px 14px;
	margin-left: -2px;
	border-left: 2px solid transparent;
	color: var(--ed-muted);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
}

.lg-toc__list a:hover {
	color: var(--ed-ink);
	border-left-color: var(--ed-action);
	background: linear-gradient(90deg, var(--ed-action-soft), rgba(230, 242, 234, 0));
}

.lg-toc__list a:focus-visible,
.lg-toc__btn:focus-visible {
	outline: 2px solid var(--ed-action);
	outline-offset: 2px;
}

.lg-toc__title {
	margin: 16px 0 4px;
}

.lg-toc__list--pages a {
	color: var(--ed-action);
}

.lg-support {
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-items: flex-start;
}

.lg-support__t {
	display: flex;
	align-items: center;
	gap: 8px;
}

.lg-body {
	min-width: 0;
	max-width: 820px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--ed-ink);
}

.lg-body > * + * {
	margin-top: 16px;
}

.lg-body a {
	color: var(--ed-action);
	text-decoration: underline;
	text-underline-offset: 2px;
	overflow-wrap: anywhere;
}

.lg-body code {
	padding: 0 4px;
	border-radius: 4px;
	background: var(--ed-surface-2);
	color: var(--ed-ink);
	font-size: 0.92em;
}

.lg-body .lg-meta {
	color: var(--ed-muted);
	font-size: 14px;
}

.lg-body .lg-short {
	flex-direction: column;
	padding: 20px 22px;
}

.lg-body .lg-short ul {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 8px;
	padding-left: 20px;
	font-size: 15px;
}

.lg-sec {
	padding: 48px 0 0;
	margin-top: 48px;
	border-top: 1px solid var(--ed-border);
	scroll-margin-top: 24px;
}

.lg-body > .lg-short + .lg-sec {
	margin-top: 40px;
}

.lg-sec > * + * {
	margin-top: 14px;
}

.lg-sec h2 {
	scroll-margin-top: 24px;
}

.lg-sec ul,
.lg-sec ol {
	padding-left: 22px;
}

.lg-sec li + li {
	margin-top: 6px;
}

.lg-ph {
	display: inline;
	padding: 1px 6px;
	border: 1.5px dashed var(--ed-border-strong);
	border-radius: 6px;
	background: #fbfcfb;
	color: var(--ed-muted);
	font-size: 0.94em;
}

.lg-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--ed-border);
	border-radius: var(--r-md);
	background: var(--ed-surface);
	font-size: 14.5px;
	overflow: hidden;
}

.lg-table th,
.lg-table td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--ed-border);
	text-align: left;
	vertical-align: top;
}

.lg-table thead th {
	background: #f6f7f5;
	color: var(--ed-muted);
	font-size: 12.5px;
	font-weight: 700;
}

.lg-table tbody th {
	font-weight: 650;
}

.lg-table tr:last-child > * {
	border-bottom: 0;
}

.lg-dl {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--ed-border);
	border-radius: var(--r-md);
	background: var(--ed-surface);
}

.lg-dl > div {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	gap: 12px;
	padding: 12px 16px;
}

.lg-dl > div + div {
	border-top: 1px solid var(--ed-border);
}

.lg-dl dt {
	color: var(--ed-muted);
	font-size: 14px;
}

.lg-dl dd {
	margin: 0;
	overflow-wrap: anywhere;
}

.lg-q {
	border-top: 1px solid var(--ed-border);
}

.lg-q:last-of-type {
	border-bottom: 1px solid var(--ed-border);
}

.lg-q summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 56px;
	padding: 14px 0;
	font-size: 17px;
	font-weight: 650;
	list-style: none;
	cursor: pointer;
}

.lg-q summary::-webkit-details-marker {
	display: none;
}

.lg-q summary::after {
	content: "";
	flex: none;
	width: 10px;
	height: 10px;
	margin-right: 4px;
	border-right: 2px solid currentcolor;
	border-bottom: 2px solid currentcolor;
	transform: rotate(45deg);
	transition: transform var(--dur) var(--ease);
}

.lg-q[open] summary::after {
	transform: rotate(-135deg);
}

.lg-q summary:focus-visible {
	outline: 2px solid var(--ed-action);
	outline-offset: 2px;
}

.lg-q p {
	max-width: 720px;
	padding: 0 0 20px;
	color: var(--ed-muted);
}

.lg-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 16px;
	margin-top: 48px;
	padding: 16px 20px;
	border-radius: 14px;
	background: var(--ed-petrol);
	color: #fff;
}

.lg-body .lg-cta a {
	color: var(--ed-petrol);
	text-decoration: none;
}

@media (max-width: 899px) {
	.lg {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
	}

	.lg-side {
		position: static;
	}
}

@media (max-width: 640px) {
	.lg-page .ed-wrap {
		padding: 0 16px;
	}

	.lg-head .ed-h1 {
		font-size: 30px;
	}

	.lg-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
	}

	.lg-table,
	.lg-table tbody,
	.lg-table tr,
	.lg-table th,
	.lg-table td {
		display: block;
	}

	.lg-table tr {
		padding: 8px 0;
		border-bottom: 1px solid var(--ed-border);
	}

	.lg-table tr:last-child {
		border-bottom: 0;
	}

	.lg-table th,
	.lg-table td {
		padding: 6px 14px;
		border-bottom: 0;
	}

	.lg-table td[data-label]::before {
		content: attr(data-label);
		display: block;
		color: var(--ed-muted);
		font-size: 12.5px;
		font-weight: 700;
	}

	.lg-dl > div {
		grid-template-columns: minmax(0, 1fr);
		gap: 2px;
	}
}