/* ==========================================================================
   Bverr legal pages: Terms of Service, Privacy Policy
   Location: bverr-account/assets/css/legal.css  (loaded by includes/legal.php)
   Markup:   <div class="bv-legal"> … pasted into an HTML widget / Custom HTML block.
   Uses the shared tokens in bverr-tokens.css (fallbacks included).
   ========================================================================== */

.bv-legal {
	--lg-primary: var(--bv-primary, #c20021);
	--lg-primary-soft: var(--bv-primary-soft, #fde8eb);
	--lg-bg: var(--bv-bg, #f3f4f6);
	--lg-surface: var(--bv-surface, #fff);
	--lg-border: var(--bv-border, #e5e7eb);
	--lg-text: var(--bv-text, #111928);
	--lg-body: var(--bv-text-body, #4b5563);
	--lg-muted: var(--bv-text-muted, #6b7280);
	--lg-radius: var(--bv-radius, 10px);
	--lg-shadow: var(--bv-shadow, 0 1px 3px rgba(17, 25, 40, .06), 0 1px 2px rgba(17, 25, 40, .04));
	--lg-offset: 104px;   /* sticky top bar (64px) + 40px breathing room: contents box and section jumps */

	max-width: var(--bv-container, 1200px);
	margin: 0 auto;
	padding: 48px 24px 80px;
	font-family: var(--bv-font, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
	font-size: 16px;
	line-height: 1.7;
	color: var(--lg-body);
	-webkit-font-smoothing: antialiased;
}
.bv-legal *,
.bv-legal *::before,
.bv-legal *::after { box-sizing: border-box; }
.bv-legal :is(h1, h2, h3) {
	font-family: inherit;
	color: var(--lg-text);
	letter-spacing: -0.01em;
	margin: 0;
}
.bv-legal p { margin: 0 0 14px; }
.bv-legal a { color: var(--lg-primary); text-decoration: underline; text-underline-offset: 2px; }
.bv-legal a:hover { text-decoration-thickness: 2px; }
.bv-legal a:focus-visible,
.bv-legal summary:focus-visible { outline: none; box-shadow: var(--bv-focus-ring, 0 0 0 3px rgba(194, 0, 33, .25)); border-radius: 4px; }
.bv-legal strong { color: var(--lg-text); font-weight: 600; }

/* ---- Header ---- */
.bv-legal__hero {
	padding-bottom: 32px;
	margin-bottom: 40px;
	border-bottom: 1px solid var(--lg-border);
}
.bv-legal__tabs {
	display: inline-flex;
	gap: 4px;
	padding: 4px;
	margin-bottom: 28px;
	background: var(--lg-bg);
	border: 1px solid var(--lg-border);
	border-radius: 999px;
}
.bv-legal__tabs a {
	padding: 6px 16px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.5;
	color: var(--lg-muted);
	text-decoration: none;
}
.bv-legal__tabs a:hover { color: var(--lg-text); }
.bv-legal__tabs a[aria-current="page"] {
	background: var(--lg-surface);
	color: var(--lg-text);
	font-weight: 600;
	box-shadow: var(--lg-shadow);
}
.bv-legal__eyebrow {
	margin: 0 0 8px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--lg-primary);
}
.bv-legal h1 {
	font-size: clamp(2rem, 4vw, 2.75rem);
	font-weight: 700;
	line-height: 1.15;
	margin-bottom: 12px;
}
.bv-legal__lead { font-size: 18px; color: var(--lg-body); margin-bottom: 8px; }
.bv-legal__meta { margin: 0; font-size: 14px; color: var(--lg-muted); }

/* ---- Two columns: contents + text ---- */
.bv-legal__layout {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 56px;
	align-items: start;
}

/* Table of contents */
.bv-legal__toc {
	position: sticky;
	top: var(--lg-offset);
	max-height: calc(100vh - var(--lg-offset) - 24px);
	overflow-y: auto;
}
.bv-legal__toc details {
	background: var(--lg-surface);
	border: 1px solid var(--lg-border);
	border-radius: var(--lg-radius);
	box-shadow: var(--lg-shadow);
	padding: 16px 12px;
}
.bv-legal__toc summary {
	list-style: none;
	cursor: pointer;
	padding: 0 8px 10px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--lg-muted);
}
.bv-legal__toc summary::-webkit-details-marker { display: none; }
.bv-legal__toc ol { list-style: none; margin: 0; padding: 0; }
.bv-legal__toc li { margin: 0; }
.bv-legal__toc a {
	display: flex;
	gap: 6px;
	padding: 6px 8px;
	border-left: 2px solid transparent;
	border-radius: 0 6px 6px 0;
	font-size: 14px;
	line-height: 1.4;
	color: var(--lg-body);
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.bv-legal__toc a span { flex: 0 0 auto; min-width: 22px; color: var(--lg-muted); font-variant-numeric: tabular-nums; }
.bv-legal__toc a:hover { background: var(--lg-bg); color: var(--lg-text); }
.bv-legal__toc a.is-active {
	border-left-color: var(--lg-primary);
	background: var(--lg-primary-soft);
	color: var(--lg-primary);
	font-weight: 600;
}
.bv-legal__toc a.is-active span { color: var(--lg-primary); }

/* ---- Body ---- */
.bv-legal__body { max-width: none; }   /* runs to the right edge, in line with the Back button */
.bv-legal__intro { margin-bottom: 8px; }
.bv-legal__note {
	padding: 14px 16px;
	background: var(--lg-bg);
	border-radius: var(--lg-radius);
	font-size: 15px;
}
.bv-legal__section {
	scroll-margin-top: var(--lg-offset);
	padding-top: 36px;
	margin-top: 36px;
	border-top: 1px solid var(--lg-border);
}
.bv-legal__section:first-of-type { border-top: 0; margin-top: 8px; padding-top: 8px; }
.bv-legal h2 {
	display: flex;
	align-items: baseline;
	gap: 12px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: 18px;
}
.bv-legal__h-num {
	flex: 0 0 auto;
	display: inline-grid;
	place-items: center;
	min-width: 32px;
	height: 32px;
	padding: 0 8px;
	border-radius: 8px;
	background: var(--lg-primary-soft);
	color: var(--lg-primary);
	font-size: 15px;
	font-weight: 700;
	transform: translateY(-2px);
}
.bv-legal h3 {
	font-size: 17px;
	font-weight: 600;
	margin: 26px 0 10px;
}

/* "In short" summary */
.bv-legal__short {
	margin: 0 0 22px;
	padding: 16px 18px;
	background: var(--lg-surface);
	border: 1px solid var(--lg-border);
	border-left: 3px solid var(--lg-primary);
	border-radius: var(--lg-radius);
	box-shadow: var(--lg-shadow);
}
.bv-legal__short-label {
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--lg-primary);
}
.bv-legal__short p { margin: 0; color: var(--lg-text); }

/* Numbered clauses: 1.1, 2.4.1 … */
.bv-legal__clause {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 8px;
}
.bv-legal__num {
	font-size: 14px;
	font-weight: 600;
	color: var(--lg-muted);
	font-variant-numeric: tabular-nums;
	padding-top: 2px;
}
.bv-legal ul { margin: 0 0 16px; padding-left: 22px; }
.bv-legal ul.bv-legal__list--indent { padding-left: 78px; }   /* lines up with clause text */
.bv-legal li { margin: 0 0 6px; }
.bv-legal li::marker { color: var(--lg-primary); }

.bv-legal__contact {
	font-style: normal;
	margin: 0 0 16px;
	padding: 18px 20px;
	background: var(--lg-bg);
	border-radius: var(--lg-radius);
	line-height: 1.8;
}
.bv-legal__top { margin-top: 48px; font-size: 14px; }
.bv-legal__top a { color: var(--lg-muted); text-decoration: none; }
.bv-legal__top a::before { content: "\2191\00a0"; }
.bv-legal__top a:hover { color: var(--lg-primary); }

/* ---- Tablet / phone ---- */
@media (max-width: 1023px) {
	.bv-legal { padding: 32px 20px 64px; }
	.bv-legal__layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.bv-legal__toc { position: static; max-height: none; overflow: visible; }
	.bv-legal__toc summary { display: flex; justify-content: space-between; padding-bottom: 0; }
	.bv-legal__toc summary::after { content: "+"; font-size: 18px; line-height: 1; color: var(--lg-muted); }
	.bv-legal__toc details[open] summary { padding-bottom: 10px; }
	.bv-legal__toc details[open] summary::after { content: "\2212"; }
	.bv-legal__body { max-width: none; }
}
@media (max-width: 639px) {
	.bv-legal { padding: 24px 16px 56px; font-size: 15px; }
	.bv-legal__hero { margin-bottom: 24px; padding-bottom: 24px; }
	.bv-legal__tabs a { padding: 6px 12px; font-size: 13px; }
	.bv-legal h2 { font-size: 20px; }
	.bv-legal__clause { display: block; }
	.bv-legal__num { display: inline; padding: 0 6px 0 0; }
	.bv-legal__clause > span:last-child { display: inline; }
	.bv-legal ul.bv-legal__list--indent { padding-left: 22px; }
}

@media (prefers-reduced-motion: no-preference) {
	html:has(.bv-legal) { scroll-behavior: smooth; }
}

@media print {
	.bv-legal__toc, .bv-legal__tabs, .bv-legal__top { display: none; }
	.bv-legal__layout { display: block; }
	.bv-legal__short { box-shadow: none; }
}

/* ---- Page shell: top bar (logo + Back), footer ---- */
body.bv-legal-page {
	margin: 0;
	background: var(--bv-surface, #fff);
	font-family: var(--bv-font, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
}
body.bv-legal-page .page-header { display: none; }   /* if the theme ever prints its own title */
.bv-lg-bar {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(255, 255, 255, .92);
	-webkit-backdrop-filter: saturate(180%) blur(8px);
	backdrop-filter: saturate(180%) blur(8px);
	border-bottom: 1px solid var(--bv-border, #e5e7eb);
}
body.admin-bar .bv-lg-bar { top: 32px; }
body.admin-bar .bv-legal { --lg-offset: 136px; }   /* + WordPress admin bar when logged in */
@media (max-width: 782px) { body.admin-bar .bv-lg-bar { top: 0; } body.admin-bar .bv-legal { --lg-offset: 104px; } }
.bv-lg-bar__in {
	max-width: var(--bv-container, 1200px);
	height: 64px;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.bv-lg-bar__logo { display: inline-flex; flex: 0 0 auto; }
.bv-lg-bar__logo img { display: block; width: 40px; height: 40px; object-fit: contain; }
.bv-lg-back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	border: 1px solid var(--bv-border, #e5e7eb);
	border-radius: var(--bv-radius-sm, 6px);
	background: var(--bv-surface, #fff);
	color: var(--bv-text, #111928);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;
	text-decoration: none;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.bv-lg-back:hover { border-color: var(--bv-primary, #c20021); color: var(--bv-primary, #c20021); background: var(--bv-primary-soft, #fde8eb); }
.bv-lg-back:focus-visible { outline: none; box-shadow: var(--bv-focus-ring, 0 0 0 3px rgba(194, 0, 33, .25)); }
.bv-lg-foot {
	border-top: 1px solid var(--bv-border, #e5e7eb);
	padding: 24px;
	text-align: center;
	font-size: 13px;
	color: var(--bv-text-muted, #6b7280);
}
.bv-lg-foot p { margin: 0; }
@media (max-width: 639px) {
	.bv-lg-bar__in { height: 56px; padding: 0 16px; }
	.bv-lg-bar__logo img { width: 34px; height: 34px; }
	.bv-legal { --lg-offset: 72px; }
}
@media print { .bv-lg-bar, .bv-lg-foot { display: none; } }