/*
 * BoundaryLogic prose system (B6, Joe 8-11-26): readability styling for
 * long-form post content. Applied via the bl-prose class on theme-post-content
 * widgets (blog, release, glossary, guide, page singles) and automatically to
 * BetterDocs doc bodies (.betterdocs-entry-content). Scale is verbatim from
 * the prototype article surfaces (BlogPost.tsx, Guide.tsx, GlossaryTerm.tsx,
 * DocsBits.tsx, LegalPage.tsx): body 17px/1.7 at 90% ink, h2 24px/1.2,
 * h3 19px/1.3, 32px section rhythm, 13px tables with mono headers.
 * Every color rides the --e-global-color-cadastral-* variables, so the
 * bl-theme.css dark overrides restyle all of it with no extra rules.
 *
 * Specificity notes (learned the hard way, do not "simplify"):
 * - Body text props sit on the ELEMENTS (p, li, td), never only on the
 *   wrapper: Elementor's widget rule (.elementor-N .elementor-element-X,
 *   0-3-0) and BetterDocs' .betterdocs-content wrapper both out-rank a
 *   wrapper-level .bl-prose, but a rule that targets the element directly
 *   always beats styles inherited from any wrapper.
 * - Link rules use the doubled-class scope (.bl-prose.bl-prose a) because
 *   Elementor's frontend.min.css ships `.elementor a{text-decoration:none}`
 *   at equal 0-1-1 specificity and loads later.
 */

.bl-prose,
.betterdocs-entry-content {
	font-family: indivisible, sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 1.7;
	color: color-mix(in oklab, var(--e-global-color-cadastral-ink) 90%, transparent);
}

/* Body text, targeted at the elements themselves. */
.bl-prose p,
.bl-prose li,
.betterdocs-entry-content p,
.betterdocs-entry-content li {
	font-family: indivisible, sans-serif;
	font-size: 17px;
	font-weight: 400;
	line-height: 1.7;
	color: color-mix(in oklab, var(--e-global-color-cadastral-ink) 90%, transparent);
}

/* ------------------------------------------------------------- rhythm ---- */

.bl-prose p,
.betterdocs-entry-content p {
	margin: 0;
}

.bl-prose p + p,
.betterdocs-entry-content p + p {
	margin-top: 16px;
}

.bl-prose > *:first-child,
.betterdocs-entry-content > *:first-child,
.betterdocs-entry-content .betterdocs-content > *:first-child {
	margin-top: 0 !important;
}

.bl-prose > *:last-child,
.betterdocs-entry-content > *:last-child {
	margin-bottom: 0;
}

/* ----------------------------------------------------------- headings ---- */

.bl-prose h2,
.bl-prose h3,
.bl-prose h4,
.bl-prose h5,
.bl-prose h6,
.betterdocs-entry-content h2,
.betterdocs-entry-content h3,
.betterdocs-entry-content h4,
.betterdocs-entry-content h5,
.betterdocs-entry-content h6 {
	font-family: indivisible, sans-serif;
	font-weight: 500;
	color: var(--e-global-color-cadastral-ink);
	margin-bottom: 0;
}

.bl-prose h2,
.betterdocs-entry-content h2 {
	font-size: 24px;
	line-height: 1.2;
	margin-top: 32px;
}

.bl-prose h3,
.betterdocs-entry-content h3 {
	font-size: 19px;
	line-height: 1.3;
	margin-top: 32px;
}

.bl-prose h4,
.bl-prose h5,
.bl-prose h6,
.betterdocs-entry-content h4,
.betterdocs-entry-content h5,
.betterdocs-entry-content h6 {
	font-size: 17px;
	line-height: 1.4;
	margin-top: 24px;
}

/* Text following a heading sits tight to it (prototype mt-3). */
.bl-prose h2 + p,
.bl-prose h3 + p,
.bl-prose h4 + p,
.bl-prose h2 + ul,
.bl-prose h3 + ul,
.bl-prose h4 + ul,
.bl-prose h2 + ol,
.bl-prose h3 + ol,
.bl-prose h4 + ol,
.betterdocs-entry-content h2 + p,
.betterdocs-entry-content h3 + p,
.betterdocs-entry-content h4 + p,
.betterdocs-entry-content h2 + ul,
.betterdocs-entry-content h3 + ul,
.betterdocs-entry-content h4 + ul,
.betterdocs-entry-content h2 + ol,
.betterdocs-entry-content h3 + ol,
.betterdocs-entry-content h4 + ol {
	margin-top: 12px;
}

/* -------------------------------------------------------------- lists ---- */

.bl-prose ul,
.bl-prose ol,
.betterdocs-entry-content ul,
.betterdocs-entry-content ol {
	margin: 16px 0 0;
	padding-left: 26px;
}

.bl-prose ul {
	list-style: disc;
}

.bl-prose ol {
	list-style: decimal;
}

.bl-prose li,
.betterdocs-entry-content li {
	margin-top: 8px;
}

.bl-prose li:first-child,
.betterdocs-entry-content li:first-child {
	margin-top: 0;
}

.bl-prose li > ul,
.bl-prose li > ol,
.betterdocs-entry-content li > ul,
.betterdocs-entry-content li > ol {
	margin-top: 8px;
}

.bl-prose ul li::marker,
.bl-prose ol li::marker,
.betterdocs-entry-content ul li::marker,
.betterdocs-entry-content ol li::marker {
	color: var(--e-global-color-cadastral-graphite);
}

/* Anything after a paragraph block gets the paragraph gap. */
.bl-prose p + ul,
.bl-prose p + ol,
.bl-prose ul + p,
.bl-prose ol + p,
.bl-prose table + p,
.bl-prose blockquote + p,
.bl-prose pre + p,
.betterdocs-entry-content p + ul,
.betterdocs-entry-content p + ol,
.betterdocs-entry-content ul + p,
.betterdocs-entry-content ol + p,
.betterdocs-entry-content table + p,
.betterdocs-entry-content blockquote + p,
.betterdocs-entry-content pre + p {
	margin-top: 16px;
}

/* -------------------------------------------------------------- links ---- */

.bl-prose.bl-prose a,
.betterdocs-entry-content.betterdocs-entry-content a {
	color: var(--e-global-color-cadastral-ink);
	text-decoration: underline;
	text-decoration-color: var(--e-global-color-cadastral-line);
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
	transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

.bl-prose.bl-prose a:hover,
.betterdocs-entry-content.betterdocs-entry-content a:hover {
	color: var(--e-global-color-cadastral-red);
	text-decoration-color: var(--e-global-color-cadastral-red);
}

.bl-prose strong,
.betterdocs-entry-content strong {
	font-weight: 500;
	color: var(--e-global-color-cadastral-ink);
}

/* --------------------------------------------------------- blockquote ---- */

.bl-prose blockquote,
.betterdocs-entry-content blockquote {
	margin: 24px 0 0;
	padding: 0 0 0 20px;
	border-left: 2px solid var(--e-global-color-cadastral-line);
}

.bl-prose blockquote p,
.betterdocs-entry-content blockquote p {
	font-size: 16px;
	line-height: 1.6;
	color: var(--e-global-color-cadastral-graphite);
}

.bl-prose blockquote p + p,
.betterdocs-entry-content blockquote p + p {
	margin-top: 12px;
}

/* -------------------------------------------------------------- tables ---- */

.bl-prose table,
.betterdocs-entry-content table {
	width: 100%;
	margin: 24px 0 0;
	border-collapse: collapse;
	border: 1px solid var(--e-global-color-cadastral-line);
}

.bl-prose th,
.betterdocs-entry-content th {
	font-family: input-mono, monospace;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-align: left;
	color: var(--e-global-color-cadastral-graphite);
	background: var(--e-global-color-cadastral-panel);
}

.bl-prose td,
.betterdocs-entry-content td {
	font-family: indivisible, sans-serif;
	font-size: 13px;
	line-height: 1.5;
	color: color-mix(in oklab, var(--e-global-color-cadastral-ink) 90%, transparent);
}

.bl-prose th,
.bl-prose td,
.betterdocs-entry-content th,
.betterdocs-entry-content td {
	padding: 10px 12px;
	border: 1px solid var(--e-global-color-cadastral-line);
	vertical-align: top;
}

/* Wide matrices scroll inside themselves on small screens. */
@media (max-width: 767px) {
	.bl-prose table,
	.betterdocs-entry-content table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}

/* ---------------------------------------------------------------- code ---- */

.bl-prose code,
.betterdocs-entry-content code {
	font-family: input-mono, monospace;
	font-size: 0.85em;
	background: var(--e-global-color-cadastral-panel);
	border: 1px solid var(--e-global-color-cadastral-line);
	border-radius: 2px;
	padding: 2px 6px;
	color: var(--e-global-color-cadastral-ink);
}

.bl-prose pre,
.betterdocs-entry-content pre {
	margin: 24px 0 0;
	padding: 16px;
	background: var(--e-global-color-cadastral-panel);
	border: 1px solid var(--e-global-color-cadastral-line);
	border-radius: 2px;
	overflow-x: auto;
	font-family: input-mono, monospace;
	font-size: 13px;
	line-height: 1.6;
	color: var(--e-global-color-cadastral-ink);
}

.bl-prose pre code,
.betterdocs-entry-content pre code {
	background: none;
	border: 0;
	padding: 0;
	font-size: inherit;
}

/* -------------------------------------------------------------- media ---- */

.bl-prose img,
.betterdocs-entry-content img {
	max-width: 100%;
	height: auto;
	border: 1px solid var(--e-global-color-cadastral-line);
	border-radius: 2px;
	margin: 24px 0 0;
}

.bl-prose figure,
.betterdocs-entry-content figure {
	margin: 24px 0 0;
}

.bl-prose figure img,
.betterdocs-entry-content figure img {
	margin: 0;
}

.bl-prose figcaption,
.betterdocs-entry-content figcaption {
	margin-top: 8px;
	font-family: input-mono, monospace;
	font-size: 12px;
	line-height: 1.5;
	color: var(--e-global-color-cadastral-graphite);
}

.bl-prose hr,
.betterdocs-entry-content hr {
	border: 0;
	border-top: 1px solid var(--e-global-color-cadastral-line);
	margin: 32px 0 0;
}

/* -------------------------------------------------- content furniture ---- */

/* Breadcrumb trail ([bl_breadcrumbs], prototype Breadcrumbs.tsx: mono 11px
   uppercase, graphite links, ink current crumb, chevron separators). */
.bl-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bl-crumbs li {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0;
}

.bl-crumbs a,
.bl-crumbs span {
	font-family: input-mono, monospace;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--e-global-color-cadastral-graphite);
	transition: color 0.2s ease;
}

.bl-crumbs span[aria-current="page"] {
	color: var(--e-global-color-cadastral-ink);
}

.bl-crumbs a:hover {
	color: var(--e-global-color-cadastral-red);
}

.bl-crumbs .bl-crumbs-sep {
	color: var(--e-global-color-cadastral-graphite);
	text-transform: none;
	letter-spacing: 0;
}

/* Archive filter input (prototype GlossaryHub: h-11, bordered, card bg). */
.bl-filter-input {
	height: 44px;
	width: 100%;
	max-width: 420px;
	border: 1px solid var(--e-global-color-cadastral-line);
	border-radius: 2px;
	background: var(--e-global-color-cadastral-panel);
	padding: 0 12px;
	font-family: indivisible, sans-serif;
	font-size: 15px;
	color: var(--e-global-color-cadastral-ink);
}

.bl-filter-input::placeholder {
	color: var(--e-global-color-cadastral-graphite);
}

.bl-filter-input:focus-visible {
	outline: 2px solid var(--e-global-color-cadastral-red);
	outline-offset: 0;
}

/* Live results search status (Trust Center hub, 8-17-26): the result count for
   a screen reader through aria-live, and the visible empty state for everyone
   else. Empty until the visitor types, so it must not reserve vertical space:
   min-height 0 and margin only when it carries text. */
.bl-doc-search-status {
	margin: 0;
	font-family: input-mono, monospace;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--e-global-color-cadastral-graphite);
}

.bl-doc-search-status:not(:empty) {
	margin-top: 10px;
}

/* Equal-height loop cards: Pro's equal_height control only emits its CSS
   when columns != 1, so single-column card grids carry bl-equal-rows for
   the same rule. The card container then fills its stretched grid cell. */
.bl-equal-rows .elementor-loop-container {
	grid-auto-rows: 1fr;
}

.elementor-widget-loop-grid .e-loop-item > .e-con {
	height: 100%;
}

/* Prototype content measures (max-w-[720px] hero text, max-w-[820px] lists). */
.bl-maxw-720 {
	max-width: 720px;
}

.bl-maxw-820 {
	max-width: 820px;
}

/* Reading progress bar (prototype ScrollProgress: 3px primary fill;
   bl-single.js keeps it under the header, then pinned to the top). */
.bl-progress {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	height: 3px;
	z-index: 1100;
	/* Faint track so the bar is perceivable at 0% (page top). */
	background: color-mix(in oklab, var(--e-global-color-cadastral-line) 55%, transparent);
	pointer-events: none;
}

.bl-progress-fill {
	height: 100%;
	width: 0;
	background: var(--e-global-color-cadastral-red);
}

/* Related tiles ([bl_related_terms], prototype TileRouterSimple narrow). */
.bl-related {
	margin-top: 32px;
	padding-top: 32px;
	border-top: 1px solid var(--e-global-color-cadastral-line);
}

.bl-related-heading {
	font-family: indivisible, sans-serif;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	margin: 0 0 20px;
	color: var(--e-global-color-cadastral-ink);
}

.bl-tiles {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
}

@media (max-width: 560px) {
	.bl-tiles {
		grid-template-columns: 1fr;
	}
}

.bl-tiles a {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 16px;
	border: 1px solid var(--e-global-color-cadastral-line);
	border-radius: 2px;
	background: var(--e-global-color-cadastral-panel);
	text-decoration: none;
	transition: transform 0.2s ease;
}

.bl-tiles a:hover {
	transform: translateY(-2px);
}

.bl-tiles .bl-tile-label {
	font-family: indivisible, sans-serif;
	font-size: 15px;
	font-weight: 500;
	color: var(--e-global-color-cadastral-ink);
	transition: color 0.2s ease;
}

.bl-tiles a:hover .bl-tile-label {
	color: var(--e-global-color-cadastral-red);
}

.bl-tiles .bl-tile-blurb {
	font-family: indivisible, sans-serif;
	font-size: 13px;
	line-height: 1.45;
	color: var(--e-global-color-cadastral-graphite);
}

/* Share cluster: small monochrome share buttons on the theme variables. */
.bl-share .elementor-share-btn {
	background-color: transparent !important;
	height: 28px;
	min-width: 28px;
}

.bl-share .elementor-share-btn__icon {
	width: 28px;
	line-height: 28px;
}

.bl-share .elementor-share-btn__icon svg {
	fill: var(--e-global-color-cadastral-graphite);
	width: 13px;
	height: 28px;
	transition: fill 0.2s ease;
}

.bl-share .elementor-share-btn:hover .elementor-share-btn__icon svg {
	fill: var(--e-global-color-cadastral-red);
}

/* Inline author (byline row): 32px avatar, name beside it, no bio. */
.bl-author-inline .elementor-author-box__avatar img {
	width: 32px;
	height: 32px;
	border-radius: 50%;
}

.bl-author-inline .elementor-author-box__avatar {
	margin-right: 10px;
	margin-bottom: 0;
}

.bl-author-inline .elementor-author-box__name {
	margin: 0;
	white-space: nowrap;
}

/* Byline: share cluster pushed to the far right of the row. */
.bl-byline .bl-share-cluster.bl-share-cluster {
	margin-left: auto;
}

/* CTA band buttons keep their labels on one line. */
.bl-cta-band .elementor-button {
	white-space: nowrap;
}

/* The nowrap label overflows its widget wrapper (widget width computes from
   the wrapped label), so side-by-side buttons visually overlap. Size the
   wrapper to the real button and forbid crushing. */
.bl-cta-band .elementor-widget-button {
	min-width: fit-content;
	flex-shrink: 0;
}

/* Anchored headings land clear of the top edge (TOC jumps). */
.bl-prose h2,
.bl-prose h3 {
	scroll-margin-top: 96px;
}

/* Article TOC (prototype ArticleToc: sticky inked-tick list on desktop,
   jump-to select below the tablet breakpoint; built by bl-single.js). */
@media (min-width: 1025px) {
	.bl-article-toc-wrap.bl-article-toc-wrap {
		position: sticky;
		top: 88px;
		flex: 0 0 240px;
		width: 240px;
	}
}

.bl-article-main.bl-article-main {
	flex: 1 1 0%;
	min-width: 0;
	max-width: 760px;
}

.bl-atoc-label {
	display: block;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--e-global-color-cadastral-line);
	font-family: input-mono, monospace;
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--e-global-color-cadastral-graphite);
}

.bl-article-toc ul {
	list-style: none;
	margin: 16px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.bl-atoc-link {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 9px 12px 9px 0;
	font-family: indivisible, sans-serif;
	font-size: 13px;
	line-height: 1.4;
	text-decoration: none;
	color: var(--e-global-color-cadastral-graphite);
	transition: color 0.2s ease;
}

.bl-atoc-link:hover,
.bl-atoc-link.is-active {
	color: var(--e-global-color-cadastral-ink);
}

.bl-atoc-link.bl-atoc-l3 {
	padding-left: 26px;
}

.bl-atoc-tick {
	flex-shrink: 0;
	margin-top: 8px;
	height: 1px;
	width: 16px;
	background: var(--e-global-color-cadastral-line);
	transition: width 0.2s ease, background 0.2s ease;
}

.bl-atoc-link.is-active .bl-atoc-tick {
	width: 24px;
	background: var(--e-global-color-cadastral-red);
}

.bl-atoc-select {
	display: none;
	width: 100%;
	margin-top: 8px;
	padding: 8px 12px;
	border: 1px solid var(--e-global-color-cadastral-line);
	border-radius: 2px;
	background: var(--e-global-color-cadastral-panel);
	font-family: indivisible, sans-serif;
	font-size: 14px;
	color: var(--e-global-color-cadastral-ink);
}

@media (max-width: 1024px) {
	.bl-article-toc ul,
	.bl-atoc-label {
		display: none;
	}

	.bl-article-toc::before {
		content: 'Jump to section';
		display: block;
		font-family: input-mono, monospace;
		font-size: 10px;
		letter-spacing: 0.16em;
		text-transform: uppercase;
		color: var(--e-global-color-cadastral-graphite);
	}

	.bl-atoc-select {
		display: block;
	}
}

/* Document TOC (legal/trust pages; list built by bl-single.js).
   CSS sticky (not Pro's fixed-position effect) keeps the column in flow.
   Doubled classes out-rank Elementor's later .e-con{position:relative};
   the article column needs min-width:0 or a wide table's min-content
   width crushes the sidebar out of the flex row. */
@media (min-width: 1025px) {
	.bl-legal-toc-wrap.bl-legal-toc-wrap {
		position: sticky;
		top: 88px;
		flex: 0 0 240px;
		width: 240px;
	}
}

.bl-legal-main.bl-legal-main {
	flex: 1 1 0%;
	min-width: 0;
}

.bl-legal-toc ol {
	list-style: none;
	margin: 16px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.bl-legal-toc a {
	display: block;
	padding: 9px 12px 9px 0;
	font-family: indivisible, sans-serif;
	font-size: 13px;
	line-height: 1.4;
	text-decoration: none;
	color: var(--e-global-color-cadastral-graphite);
	transition: color 0.2s ease;
}

.bl-legal-toc a:hover {
	color: var(--e-global-color-cadastral-ink);
}

.bl-legal-toc a.bl-toc-active {
	color: var(--e-global-color-cadastral-red);
}

/* ------------------------------------------------------------- mobile ---- */

@media (max-width: 560px) {
	.bl-prose,
	.bl-prose p,
	.bl-prose li,
	.betterdocs-entry-content,
	.betterdocs-entry-content p,
	.betterdocs-entry-content li {
		font-size: 16px;
	}

	.bl-prose blockquote p,
	.betterdocs-entry-content blockquote p {
		font-size: 15px;
	}

	.bl-prose h2,
	.betterdocs-entry-content h2 {
		font-size: 22px;
	}

	.bl-prose h3,
	.betterdocs-entry-content h3 {
		font-size: 18px;
	}
}