/**
 * Workshop Ads page (/workshop-ads/) — Advertising Readiness Audit.
 *
 * Loaded only on that page, by Improvement_Workshop_Ads_Page.
 *
 * The audit tool's own <style> block lives inline in the <body> (it is an
 * Elementor HTML widget), so it comes AFTER this file in document order.
 * Every rule below therefore starts with `body` to win on specificity rather
 * than on source order. Where the widget uses !important, so does this.
 *
 * Font stacks match the site's Elementor kit (post 263):
 *   Montserrat  — headings, labels, buttons, anything uppercase/tracked
 *   DM Sans     — body copy and form controls
 * Elementor already loads both on this page, so nothing extra is requested.
 */

:root {
	--ara-site-display: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--ara-site-body: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* --------------------------------------------------------------------------
   1. Clear the page of everything that is not the audit
   --------------------------------------------------------------------------
   This page is used live in a 1-on-1 consultation and printed at the end, so
   the floating site-wide widgets are pure distraction. The reCAPTCHA badge is
   dequeued in PHP; .grecaptcha-badge stays listed here as a safety net in case
   another plugin loads the API independently.

   The chat-agent selectors cover JotForm's AI agent embed shapes. Nothing on
   the live page serves one today, so these are inert unless a tag manager or
   a header/footer snippet injects one later — at which point it stays off this
   page automatically.
   -------------------------------------------------------------------------- */

body .muslim-owned-floating-banner,
body #muslimOwnedBanner,
body .grecaptcha-badge,
body #wpconsent-cookie-banner,
body .wpconsent-cookie-banner,
body .wpconsent-preferences-modal,
body [id^="JotformAgent-"],
body [id^="jotform-agent"],
body .jotform-chat,
body .jf-agent-launcher,
body .embedded-agent-container,
body iframe[src*="jotform"] {
	display: none !important;
}

/* --------------------------------------------------------------------------
   2. Typography — match the rest of the site
   -------------------------------------------------------------------------- */

body #advertising-readiness-audit {
	font-family: var(--ara-site-body);
}

/* Display face: headings, kickers, stat labels, pills, numbers, buttons.
   Several of these are set with the `font:` shorthand in the widget, which
   also sets the family — these rules come later in the cascade and win. */
body #advertising-readiness-audit h1,
body #advertising-readiness-audit h2,
body #advertising-readiness-audit h3,
body #advertising-readiness-audit h4,
body #advertising-readiness-audit .ara-kicker,
body #advertising-readiness-audit .ara-stat,
body #advertising-readiness-audit .ara-stat b,
body #advertising-readiness-audit .ara-saved,
body #advertising-readiness-audit .ara-nav button,
body #advertising-readiness-audit .ara-meta div span,
body #advertising-readiness-audit .ara-meta div b,
body #advertising-readiness-audit .ara-field span,
body #advertising-readiness-audit .ara-note span,
body #advertising-readiness-audit .ara-opt,
body #advertising-readiness-audit .ara-chip span,
body #advertising-readiness-audit .ara-chip b,
body #advertising-readiness-audit .ara-stage,
body #advertising-readiness-audit .ara-thresh,
body #advertising-readiness-audit .ara-scoregrid span,
body #advertising-readiness-audit .ara-scoregrid b,
body #advertising-readiness-audit .ara-result .ara-big,
body #advertising-readiness-audit .ara-result .ara-of,
body #advertising-readiness-audit .ara-move .ara-num,
body #advertising-readiness-audit .ara-funnel b,
body #advertising-readiness-audit .ara-edu h4,
body #advertising-readiness-audit .ara-sum span,
body #advertising-readiness-audit .ara-cpl span,
body #advertising-readiness-audit .ara-cpl b,
body #advertising-readiness-audit .ara-dec button strong,
body #advertising-readiness-audit .ara-btn {
	font-family: var(--ara-site-display);
}

/* Body face: running copy, form controls, choice cards. */
body #advertising-readiness-audit p,
body #advertising-readiness-audit .ara-sub,
body #advertising-readiness-audit .ara-lead,
body #advertising-readiness-audit .ara-hint,
body #advertising-readiness-audit .ara-info,
body #advertising-readiness-audit .ara-alert,
body #advertising-readiness-audit .ara-insights p,
body #advertising-readiness-audit .ara-stext,
body #advertising-readiness-audit .ara-card,
body #advertising-readiness-audit .ara-dec button,
body #advertising-readiness-audit .ara-dec button em,
body #advertising-readiness-audit .ara-sum b,
body #advertising-readiness-audit .ara-close,
body #advertising-readiness-audit input[type="text"],
body #advertising-readiness-audit input[type="number"],
body #advertising-readiness-audit input[type="date"],
body #advertising-readiness-audit select,
body #advertising-readiness-audit textarea {
	font-family: var(--ara-site-body);
}

/* Montserrat runs a touch wider than Arial at the same size, so the tightest
   tracked labels need a hair less letter-spacing to hold their line. */
body #advertising-readiness-audit .ara-kicker {
	letter-spacing: .18em;
}

body #advertising-readiness-audit .ara-nav button,
body #advertising-readiness-audit .ara-btn {
	letter-spacing: .08em;
}

/* Montserrat has no synthesised bold problem, but `font-weight:bold` maps to
   900 in some stacks — pin headings to the kit's 700 so they match the site. */
body #advertising-readiness-audit h1,
body #advertising-readiness-audit h2,
body #advertising-readiness-audit h3,
body #advertising-readiness-audit h4 {
	font-weight: 700;
}

/* --------------------------------------------------------------------------
   3. Print
   --------------------------------------------------------------------------
   Only the report half of the tool prints — the seven scored question sections
   carry .ara-noprint in the widget markup. What reaches paper is: the title
   header, the result/score card, the prescription, the next 3 moves, the
   consultant decision, the notes and the summary.
   -------------------------------------------------------------------------- */

@media print {

	@page {
		size: A4 portrait;
		margin: 16mm 14mm 18mm;
	}

	/* Nothing floating reaches the page. */
	body .muslim-owned-floating-banner,
	body #muslimOwnedBanner,
	body .grecaptcha-badge,
	body .wpconsent-cookie-banner,
	body #wpconsent-cookie-banner {
		display: none !important;
	}

	body,
	body .elementor,
	body .e-con,
	body .e-con-inner {
		background: #fff !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Base document. 11.5pt reads better on paper than the widget's 12px and
	   keeps the report to roughly three A4 pages. */
	body #advertising-readiness-audit {
		font-family: var(--ara-site-body) !important;
		font-size: 11.5pt !important;
		line-height: 1.45 !important;
		color: #111 !important;
		background: #fff !important;
	}

	/* Let bar fills and the stage badge actually appear on paper. */
	body #advertising-readiness-audit,
	body #advertising-readiness-audit * {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	/* --- break behaviour -------------------------------------------------
	   The widget puts `page-break-inside: avoid` on .ara-sec / .ara-result.
	   Those cards are taller than a page once filled in, and an unbreakable
	   box taller than the page makes the browser skip to a fresh page and
	   leave the previous one half empty. Sections are allowed to break; the
	   small units inside them are the ones held together. */

	body #advertising-readiness-audit .ara-sec,
	body #advertising-readiness-audit .ara-result {
		page-break-inside: auto !important;
		break-inside: auto !important;
		border: 0 !important;
		border-top: 1px solid #cfcfcf !important;
		border-radius: 0 !important;
		padding: 16px 0 4px !important;
		margin: 0 0 6px !important;
	}

	body #advertising-readiness-audit .ara-field,
	body #advertising-readiness-audit .ara-move,
	body #advertising-readiness-audit .ara-onething,
	body #advertising-readiness-audit .ara-chip,
	body #advertising-readiness-audit .ara-scoregrid > div,
	body #advertising-readiness-audit .ara-bottle > div,
	body #advertising-readiness-audit .ara-insights p,
	body #advertising-readiness-audit .ara-sum > div,
	body #advertising-readiness-audit .ara-cpl,
	body #advertising-readiness-audit .ara-dec button,
	body #advertising-readiness-audit .ara-sec-head {
		page-break-inside: avoid !important;
		break-inside: avoid !important;
	}

	/* Never strand a heading at the foot of a page. */
	body #advertising-readiness-audit h1,
	body #advertising-readiness-audit h2,
	body #advertising-readiness-audit h3,
	body #advertising-readiness-audit h4,
	body #advertising-readiness-audit .ara-kicker {
		page-break-after: avoid !important;
		break-after: avoid !important;
	}

	body #advertising-readiness-audit p {
		orphans: 3;
		widows: 3;
	}

	/* Page 1 is the cover + score. The prescription opens page 2. */
	body #advertising-readiness-audit #ara-sec-plan {
		page-break-before: always !important;
		break-before: page !important;
		border-top: 0 !important;
		padding-top: 0 !important;
	}

	/* --- title block ------------------------------------------------------ */

	body #advertising-readiness-audit .ara-hero {
		padding: 0 0 6px !important;
	}

	body #advertising-readiness-audit .ara-hero h1 {
		font-family: var(--ara-site-display) !important;
		font-size: 23pt !important;
		line-height: 1.1 !important;
		margin: 6px 0 8px !important;
		color: #111 !important;
	}

	body #advertising-readiness-audit .ara-hero .ara-sub {
		font-size: 11pt !important;
		color: #444 !important;
		max-width: none !important;
	}

	body #advertising-readiness-audit .ara-kicker {
		font-family: var(--ara-site-display) !important;
		font-size: 8pt !important;
		letter-spacing: .2em !important;
		color: #8a6400 !important;
	}

	body #advertising-readiness-audit .ara-rule {
		height: 2px !important;
		background: #8a6400 !important;
		margin: 12px 0 !important;
		opacity: 1 !important;
	}

	/* Participant / business / date row reads as a document header. */
	body #advertising-readiness-audit .ara-meta {
		gap: 10px 34px !important;
		margin-top: 10px !important;
		padding-bottom: 12px !important;
		border-bottom: 1px solid #cfcfcf !important;
	}

	body #advertising-readiness-audit .ara-meta div span {
		font-family: var(--ara-site-display) !important;
		font-size: 7.5pt !important;
		color: #666 !important;
	}

	body #advertising-readiness-audit .ara-meta div b {
		font-size: 11pt !important;
		color: #111 !important;
	}

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

	body #advertising-readiness-audit h2 {
		font-family: var(--ara-site-display) !important;
		font-size: 15pt !important;
		color: #111 !important;
	}

	body #advertising-readiness-audit h3 {
		font-family: var(--ara-site-display) !important;
		font-size: 12.5pt !important;
		color: #111 !important;
	}

	body #advertising-readiness-audit h4 {
		font-family: var(--ara-site-display) !important;
		font-size: 11pt !important;
		color: #111 !important;
	}

	/* --- score card ------------------------------------------------------- */

	body #advertising-readiness-audit .ara-result .ara-big {
		font-family: var(--ara-site-display) !important;
		font-size: 40pt !important;
		color: #111 !important;
	}

	body #advertising-readiness-audit .ara-result .ara-of {
		font-size: 14pt !important;
		color: #666 !important;
	}

	body #advertising-readiness-audit .ara-stage {
		font-family: var(--ara-site-display) !important;
		font-size: 9pt !important;
		padding: 7px 16px !important;
		border: 1.5px solid #111 !important;
		color: #111 !important;
		background: #fff !important;
	}

	body #advertising-readiness-audit .ara-bigtrack {
		height: 9px !important;
		background: #e4e4e4 !important;
		border: 1px solid #bdbdbd !important;
		margin: 14px 0 6px !important;
	}

	body #advertising-readiness-audit .ara-bigtrack div,
	body #advertising-readiness-audit .ara-fill {
		background: #8a6400 !important;
	}

	body #advertising-readiness-audit .ara-track {
		background: #e4e4e4 !important;
		border: 1px solid #bdbdbd !important;
		height: 6px !important;
	}

	body #advertising-readiness-audit .ara-thresh {
		font-family: var(--ara-site-display) !important;
		font-size: 7.5pt !important;
		color: #666 !important;
	}

	/* Seven per-area scores across one row instead of wrapping to three. */
	body #advertising-readiness-audit .ara-scoregrid {
		grid-template-columns: repeat(7, 1fr) !important;
		gap: 6px !important;
		margin-top: 16px !important;
	}

	body #advertising-readiness-audit .ara-scoregrid > div {
		border: 1px solid #cfcfcf !important;
		border-radius: 4px !important;
		padding: 8px 6px !important;
		background: #fff !important;
		text-align: center !important;
	}

	body #advertising-readiness-audit .ara-scoregrid span {
		font-size: 7pt !important;
		letter-spacing: .08em !important;
		color: #666 !important;
	}

	body #advertising-readiness-audit .ara-scoregrid b {
		font-size: 14pt !important;
		color: #111 !important;
	}

	body #advertising-readiness-audit .ara-bottle > div {
		border: 0 !important;
		border-left: 2.5px solid #8a6400 !important;
		border-radius: 0 !important;
		padding: 6px 0 6px 12px !important;
		background: #fff !important;
	}

	body #advertising-readiness-audit .ara-insights p {
		border-left: 2px solid #bdbdbd !important;
		color: #333 !important;
	}

	/* --- prescription / moves / summary ----------------------------------- */

	body #advertising-readiness-audit .ara-grid2 {
		gap: 10px 24px !important;
	}

	body #advertising-readiness-audit .ara-moves {
		grid-template-columns: repeat(3, 1fr) !important;
		gap: 12px !important;
	}

	body #advertising-readiness-audit .ara-move {
		border: 1px solid #cfcfcf !important;
		border-radius: 4px !important;
		padding: 12px !important;
		background: #fff !important;
	}

	body #advertising-readiness-audit .ara-move .ara-num {
		font-size: 18pt !important;
		color: #8a6400 !important;
	}

	body #advertising-readiness-audit .ara-move p {
		font-size: 8.5pt !important;
		color: #666 !important;
		margin-bottom: 6px !important;
	}

	body #advertising-readiness-audit .ara-onething {
		border: 1.5px solid #8a6400 !important;
		border-radius: 4px !important;
		background: #fff !important;
		padding: 14px !important;
		margin-top: 14px !important;
	}

	body #advertising-readiness-audit .ara-dec {
		gap: 8px !important;
	}

	/* Only the option the consultant actually chose is worth the paper. */
	body #advertising-readiness-audit .ara-dec button:not(.on) {
		display: none !important;
	}

	body #advertising-readiness-audit .ara-dec button.on {
		border: 1.5px solid #111 !important;
		border-radius: 4px !important;
		background: #fff !important;
		color: #111 !important;
		padding: 12px 14px !important;
	}

	body #advertising-readiness-audit .ara-dec button.on em {
		color: #444 !important;
	}

	body #advertising-readiness-audit .ara-sum {
		gap: 0 30px !important;
	}

	body #advertising-readiness-audit .ara-sum > div {
		padding: 8px 0 !important;
		border-bottom: 1px solid #dcdcdc !important;
	}

	body #advertising-readiness-audit .ara-sum span {
		font-size: 7.5pt !important;
		color: #666 !important;
	}

	body #advertising-readiness-audit .ara-sum b {
		font-size: 10.5pt !important;
		color: #111 !important;
	}

	body #advertising-readiness-audit .ara-close {
		font-size: 11pt !important;
		color: #8a6400 !important;
		margin-top: 16px !important;
	}

	/* --- form controls ---------------------------------------------------- */

	/* The widget shrinks these to 12px in print, but the autosize JS measured
	   each textarea's height at the on-screen size — shrinking the text after
	   the fact leaves filled answers clipped or floating in dead space. Keep
	   the print size close to the screen size, and workshop-ads.js re-measures
	   every textarea on beforeprint so the height matches what is printed. */
	body #advertising-readiness-audit input[type="text"],
	body #advertising-readiness-audit input[type="number"],
	body #advertising-readiness-audit input[type="date"],
	body #advertising-readiness-audit select,
	body #advertising-readiness-audit textarea {
		font-family: var(--ara-site-body) !important;
		font-size: 10.5pt !important;
		line-height: 1.45 !important;
		color: #111 !important;
		background: #fff !important;
		border: 0 !important;
		border-bottom: 1px solid #c8c8c8 !important;
		border-radius: 0 !important;
		min-height: 0 !important;
		padding: 2px 0 4px !important;
		overflow: visible !important;
		resize: none !important;
	}

	/* Inside the three move cards and the one-thing box the field already sits
	   in a bordered card, so the extra underline just adds clutter. */
	body #advertising-readiness-audit .ara-move textarea,
	body #advertising-readiness-audit .ara-onething textarea {
		border-bottom: 0 !important;
	}

	body #advertising-readiness-audit select {
		background-image: none !important;
		padding-right: 0 !important;
		appearance: none !important;
		-webkit-appearance: none !important;
	}

	body #advertising-readiness-audit .ara-field span,
	body #advertising-readiness-audit .ara-note span {
		font-family: var(--ara-site-display) !important;
		font-size: 7.5pt !important;
		letter-spacing: .12em !important;
		color: #666 !important;
		margin-bottom: 2px !important;
	}

	/* Sections workshop-ads.js flagged as never filled in — the consultant
	   decision with nothing chosen, the final notes left blank — would print
	   as a heading over an empty half page. */
	body #advertising-readiness-audit .improvement-print-empty {
		display: none !important;
	}

	/* --- footer line ------------------------------------------------------ */

	body #advertising-readiness-audit #ara-sec-summary .ara-mut b {
		color: #111 !important;
	}
}
