/*
 * The Centre Facility Agreement — account document typography.
 *
 * Scoped to the one endpoint. It borrows the Centre token contract
 * (--ink / --paper / --line / --mut / --cobalt), which is already defined on
 * account pages, and carries the same fallbacks so the page is right even if
 * load order changes. No font is imported here.
 */

.grn-ca-page {
	--ca-ink: var(--ink, #131313);
	--ca-paper: var(--paper, #fbfaf6);
	--ca-line: var(--line, #dad7cc);
	--ca-mut: var(--mut, #6b6759);
	--ca-blue: var(--cobalt, #005bff);
	--ca-tint: #eef3ff;
	--ca-measure: 62ch;
	color: var(--ca-ink);
	font-family: var(--sans, "Neue Haas Grotesk Text", Arial, sans-serif);
	text-align: left;
}

/* ---------- head ---------- */

.grn-ca-head {
	max-width: var(--ca-measure);
	margin: 0 0 40px;
}
.grn-ca-kicker {
	font-family: var(--mono, "IBM Plex Mono", monospace);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ca-mut);
	margin: 0 0 10px;
}
.grn-ca-page .grn-ca-title {
	font-family: var(--grot, "Neue Haas Grotesk Display", Arial, sans-serif);
	font-size: clamp(28px, 3.4vw, 40px);
	line-height: 1.12;
	font-weight: 700;
	letter-spacing: -.01em;
	margin: 0 0 16px;
}
.grn-ca-lead {
	font-size: 17px;
	line-height: 1.6;
	margin: 0 0 14px;
}
.grn-ca-lead:last-child { margin-bottom: 0; }

/* ---------- factual status ---------- */

.grn-ca-status {
	margin: 24px 0 0;
	padding: 16px 18px;
	background: var(--ca-paper);
	border: 1px solid var(--ca-line);
	border-left: 3px solid var(--ca-blue);
	font-size: 15px;
	line-height: 1.55;
}
.grn-ca-status p { margin: 0 0 6px; }
.grn-ca-status p:last-child { margin-bottom: 0; }
.grn-ca-status dl {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 4px 16px;
	margin: 10px 0 0;
}
.grn-ca-status dt { color: var(--ca-mut); }
.grn-ca-status dd { margin: 0; }
.grn-ca-status--signed { border-left-color: var(--ca-ink); }

/* ---------- contents ---------- */

.grn-ca-toc {
	max-width: var(--ca-measure);
	margin: 0 0 40px;
	padding: 18px 20px;
	border: 1px solid var(--ca-line);
}
.grn-ca-toc h3 {
	font-family: var(--mono, "IBM Plex Mono", monospace);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ca-mut);
	margin: 0 0 12px;
}
.grn-ca-toc ol {
	columns: 2;
	column-gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	line-height: 1.5;
}
.grn-ca-toc li { break-inside: avoid; margin: 0 0 6px; }
.grn-ca-toc a { color: var(--ca-ink); text-decoration: none; }
.grn-ca-toc a:hover { color: var(--ca-blue); text-decoration: underline; }
.grn-ca-toc .grn-ca-num { color: var(--ca-mut); }

/* ---------- the document ---------- */

.grn-ca-doc {
	max-width: var(--ca-measure);
	font-size: 17px;
	line-height: 1.65;
	overflow-wrap: break-word;
}
.grn-ca-doc p { margin: 0 0 16px; }
.grn-ca-doc > .grn-ca-clause:first-child { border-top: 0; padding-top: 0; }

.grn-ca-clause {
	border-top: 1px solid var(--ca-line);
	padding-top: 28px;
	margin-top: 36px;
}
.grn-ca-page .grn-ca-clause > h3 {
	font-family: var(--grot, "Neue Haas Grotesk Display", Arial, sans-serif);
	font-size: 21px;
	line-height: 1.25;
	font-weight: 700;
	letter-spacing: -.005em;
	margin: 0 0 14px;
	scroll-margin-top: 24px;
}
.grn-ca-clause > h3 .grn-ca-num {
	color: var(--ca-blue);
	font-variant-numeric: tabular-nums;
	margin-right: .4em;
}

/* Lettered sub-items keep their own "(a)" label from the source text. */
.grn-ca-subs {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}
.grn-ca-subs li {
	margin: 0 0 12px;
	padding-left: 2.1em;
	text-indent: -2.1em;
}

/* The two capitalised risk sections. Marked, never re-worded or shrunk. */
.grn-ca-clause--critical {
	background: var(--ca-tint);
	border-top: 0;
	border-left: 3px solid var(--ca-blue);
	padding: 24px 22px 8px;
	margin-top: 36px;
}
.grn-ca-clause--critical > h3 .grn-ca-num { color: var(--ca-blue); }

/* ---------- signing ---------- */

.grn-ca-sign {
	max-width: var(--ca-measure);
	margin: 48px 0 0;
	padding: 28px 26px;
	background: var(--ca-paper);
	border: 1px solid var(--ca-line);
}
.grn-ca-page .grn-ca-sign > h3 {
	font-family: var(--grot, "Neue Haas Grotesk Display", Arial, sans-serif);
	font-size: 22px;
	line-height: 1.2;
	font-weight: 700;
	margin: 0 0 10px;
}
.grn-ca-sign-note {
	font-size: 15px;
	line-height: 1.6;
	color: var(--ca-mut);
	margin: 0 0 24px;
}
.grn-ca-field { margin: 0 0 22px; }
.grn-ca-field label {
	display: block;
	font-size: 15px;
	font-weight: 600;
	margin: 0 0 8px;
}
.grn-ca-page input[type="text"].grn-ca-input {
	width: min(28rem, 100%);
	box-sizing: border-box;
	font-family: inherit;
	font-size: 17px;
	line-height: 1.4;
	padding: 12px 14px;
	color: var(--ca-ink);
	background: #fff;
	border: 1px solid var(--ca-line);
	border-radius: 0;
}
.grn-ca-page input[type="text"].grn-ca-input:focus {
	border-color: var(--ca-blue);
}

/* Grid keeps wrapped consent text aligned under itself, not under the box. */
.grn-ca-consent {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 14px;
	align-items: start;
	margin: 0 0 24px;
	padding: 14px;
	background: #fff;
	border: 1px solid var(--ca-line);
	cursor: pointer;
	font-size: 15px;
	line-height: 1.6;
}
.grn-ca-consent input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 2px 0 0;
	accent-color: var(--ca-blue);
	flex: none;
}
.grn-ca-consent:hover { border-color: var(--ca-blue); }

.grn-ca-page .grn-ca-submit {
	appearance: none;
	display: inline-block;
	min-height: 48px;
	padding: 14px 28px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	color: #fff;
	background: var(--ca-ink);
	border: 1px solid var(--ca-ink);
	border-radius: 0;
	cursor: pointer;
}
.grn-ca-page .grn-ca-submit:hover {
	background: var(--ca-blue);
	border-color: var(--ca-blue);
}

/* One visible focus treatment for every control on the page. */
.grn-ca-page a:focus-visible,
.grn-ca-page input:focus-visible,
.grn-ca-page button:focus-visible,
.grn-ca-consent:focus-within {
	outline: 2px solid var(--ca-blue);
	outline-offset: 2px;
}

/* ---------- notices raised by the signing POST ---------- */

.grn-ca-endpoint .woocommerce-message,
.grn-ca-endpoint .woocommerce-error,
.grn-ca-endpoint .woocommerce-info {
	max-width: var(--ca-measure, 62ch);
	font-size: 15px;
	line-height: 1.6;
}

/* ---------- a pending update ---------- */

.grn-ca-status--update {
	border-left-width: 4px;
	background: var(--ca-tint);
}
.grn-ca-summary-lead { margin: 14px 0 6px; }
.grn-ca-summary {
	margin: 0 0 12px;
	padding-left: 1.2em;
}
.grn-ca-summary li { margin: 0 0 6px; }
.grn-ca-summary-note {
	font-size: 14px;
	color: var(--ca-mut);
}

/* ---------- the retainable copy ---------- */

.grn-ca-page .grn-ca-print {
	appearance: none;
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	padding: 10px 16px;
	min-height: 40px;
	color: var(--ca-ink);
	background: #fff;
	border: 1px solid var(--ca-ink);
	border-radius: 0;
	cursor: pointer;
}
.grn-ca-page .grn-ca-print:hover {
	color: #fff;
	background: var(--ca-ink);
}

.grn-ca-history {
	max-width: var(--ca-measure);
	margin: 44px 0 0;
	padding-top: 28px;
	border-top: 1px solid var(--ca-line);
	font-size: 15px;
	line-height: 1.6;
}
.grn-ca-page .grn-ca-history > h3 {
	font-family: var(--grot, "Neue Haas Grotesk Display", Arial, sans-serif);
	font-size: 19px;
	font-weight: 700;
	margin: 0 0 10px;
}
.grn-ca-history-list {
	list-style: none;
	margin: 12px 0 0;
	padding: 0;
}
.grn-ca-history-list li {
	padding: 8px 0;
	border-bottom: 1px solid var(--ca-line);
}

/* ---------- the compact notice on other account pages ---------- */

.grn-ca-account-flag {
	margin: 0 0 28px;
	padding: 16px 18px;
	background: var(--ca-tint, #eef3ff);
	border: 1px solid var(--line, #dad7cc);
	border-left: 3px solid var(--cobalt, #005bff);
	font-size: 15px;
	line-height: 1.55;
}
.grn-ca-account-flag p { margin: 0 0 8px; }
.grn-ca-account-flag p:last-child { margin-bottom: 0; }
.grn-ca-account-flag-cta {
	display: inline-block;
	min-height: 40px;
	padding: 10px 18px;
	font-weight: 700;
	text-decoration: none;
	color: #fff;
	background: var(--ink, #131313);
}
.grn-ca-account-flag-cta:hover { background: var(--cobalt, #005bff); color: #fff; }
.grn-ca-account-flag-cta:focus-visible {
	outline: 2px solid var(--cobalt, #005bff);
	outline-offset: 2px;
}

/* ---------- printing the accepted document ---------- */

@media print {
	.grn-ca-page {
		--ca-measure: 100%;
		font-size: 11pt;
	}
	.grn-ca-page .grn-ca-print,
	.grn-ca-toc,
	.grn-ca-sign,
	.grn-ca-account-flag { display: none; }
	.grn-ca-clause { break-inside: avoid; }
	.grn-ca-page .grn-ca-clause > h3 { break-after: avoid; }
	.grn-ca-clause--critical {
		background: none;
		border-left: 3px solid #000;
	}
	.grn-ca-status {
		background: none;
		border: 1px solid #000;
	}
}

/* ---------- narrow screens ---------- */

@media (max-width: 782px) {
	.grn-ca-toc ol { columns: 1; }
	.grn-ca-doc { font-size: 16px; }
	.grn-ca-clause { padding-top: 24px; margin-top: 30px; }
	.grn-ca-page .grn-ca-clause > h3 { font-size: 19px; }
	.grn-ca-clause--critical { padding: 20px 16px 4px; }
	.grn-ca-sign { padding: 22px 18px; }
	.grn-ca-status { padding: 14px 16px; }
	.grn-ca-status dl { grid-template-columns: 1fr; gap: 2px; }
	.grn-ca-status dt { margin-top: 6px; }
	.grn-ca-page .grn-ca-submit { width: 100%; }
	.grn-ca-account-flag { padding: 14px 16px; }
	.grn-ca-account-flag-cta { display: block; text-align: center; }
	.grn-ca-history { margin-top: 32px; padding-top: 22px; }
}
