/* CPTSD.ca Pre-Assessment — scoped styles.
   Every rule is namespaced under .cptsda-wrap so this can never bleed into,
   or be overridden by, Divi's own theme CSS. */

.cptsda-wrap {
	--cptsda-cream: #fcf8f7;
	--cptsda-pink-tint: #fee9e9;
	--cptsda-ink: #000000;
	--cptsda-ink-soft: #3a3a3a;
	--cptsda-ink-muted: #a9a9a9;
	--cptsda-accent: #ff8f95;
	--cptsda-accent-deep: #e06a71;
	--cptsda-sage: #9caf88;
	--cptsda-sage-bg: #eaf0e3;
	--cptsda-sage-deep: #3b4a3a;
	--cptsda-line: #f0dcdc;
	--cptsda-font-display: 'Playfair Display', Georgia, serif;
	--cptsda-font-body: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;

	all: initial;
	display: block;
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 48px) clamp(16px, 4vw, 44px) 100px;
	background: var(--cptsda-cream);
	color: var(--cptsda-ink);
	font-family: var(--cptsda-font-body);
	line-height: 1.6;
	box-sizing: border-box;
}
.cptsda-wrap * { box-sizing: border-box; font-family: inherit; }

.cptsda-wrap[data-lowstim="true"] {
	--cptsda-accent: #d99a9d;
	--cptsda-sage: #8ba98d;
	--cptsda-pink-tint: #f6efee;
}
.cptsda-wrap[data-font="dyslexic"], .cptsda-wrap[data-font="dyslexic"] * {
	font-family: 'Comic Sans MS', 'Open Sans', sans-serif !important;
	letter-spacing: 0.2px;
}

.cptsda-topbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; gap: 12px; flex-wrap: wrap; }
.cptsda-brand { font-family: var(--cptsda-font-display); font-style: italic; font-size: 22px; font-weight: 700; color: var(--cptsda-ink); }
.cptsda-brand .cptsda-dot-ca { color: var(--cptsda-accent); }
.cptsda-a11y { display: flex; gap: 6px; flex-wrap: wrap; }
.cptsda-a11y-btn { font-size: 11px; padding: 5px 10px; border-radius: 20px; border: 1px solid var(--cptsda-line); background: #fff; color: var(--cptsda-ink-soft); cursor: pointer; }
.cptsda-a11y-btn.active { background: var(--cptsda-accent); color: #fff; border-color: var(--cptsda-accent); }

.cptsda-progress-track { height: 6px; border-radius: 3px; background: var(--cptsda-pink-tint); margin-bottom: 8px; overflow: hidden; }
.cptsda-progress-fill { height: 100%; background: var(--cptsda-accent); transition: width .3s ease; }
.cptsda-progress-label { font-size: 11px; color: var(--cptsda-ink-muted); margin-bottom: 28px; }

.cptsda-card { background: #fff; border: 1px solid var(--cptsda-line); border-radius: 16px; padding: clamp(28px, 4vw, 52px) clamp(24px, 5vw, 56px); }

.cptsda-card h1 { font-family: var(--cptsda-font-display); font-weight: 700; font-size: clamp(26px, 3vw, 38px); margin: 0 0 12px; color: var(--cptsda-ink); line-height: 1.25; }
.cptsda-card h1 em { font-style: italic; color: var(--cptsda-accent-deep); }
.cptsda-kicker { font-size: 12px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--cptsda-accent-deep); font-weight: 700; margin-bottom: 10px; }
.cptsda-lede { color: var(--cptsda-ink-soft); font-size: clamp(15px, 1.3vw, 17px); margin-bottom: 26px; max-width: 60ch; }

.cptsda-notice { background: var(--cptsda-pink-tint); border-left: 4px solid var(--cptsda-accent); padding: 16px 20px; border-radius: 8px; font-size: 14px; line-height: 1.65; margin-bottom: 22px; }
.cptsda-notice.sage { background: var(--cptsda-sage-bg); border-left-color: var(--cptsda-sage); color: var(--cptsda-sage-deep); }

.cptsda-trauma-list { margin: 0 0 18px; padding-left: 0; list-style: none; font-size: 13.5px; color: var(--cptsda-ink-soft); }
.cptsda-trauma-list li { margin-bottom: 8px; padding-left: 24px; position: relative; }
.cptsda-trauma-list li::before {
	content: "\2713"; position: absolute; left: 0; top: 0;
	color: var(--cptsda-accent-deep); font-weight: 700; font-size: 12px;
	width: 16px; height: 16px; border-radius: 50%; background: var(--cptsda-pink-tint);
	display: flex; align-items: center; justify-content: center;
}

.cptsda-field { margin-bottom: 26px; }
.cptsda-qlabel { font-size: clamp(15px, 1.3vw, 17px); font-weight: 600; color: var(--cptsda-ink); margin-bottom: 12px; }
.cptsda-optional-tag { font-size: 10.5px; color: var(--cptsda-ink-muted); font-weight: 400; text-transform: uppercase; letter-spacing: .4px; margin-left: 6px; }

.cptsda-scale { display: flex; gap: 8px; flex-wrap: wrap; }
.cptsda-scale button { flex: 1; min-width: 110px; padding: 12px 10px; font-size: 12.5px; text-align: center; border: 1px solid var(--cptsda-line); border-radius: 22px; background: #fff; color: var(--cptsda-ink-soft); cursor: pointer; }
.cptsda-scale button.selected { background: var(--cptsda-accent); border-color: var(--cptsda-accent); color: #fff; font-weight: 700; }

.cptsda-check { display: flex; align-items: flex-start; gap: 10px; padding: 8px 0; font-size: 13.5px; color: var(--cptsda-ink-soft); cursor: pointer; }
.cptsda-check input { margin-top: 3px; accent-color: var(--cptsda-accent); }

.cptsda-card textarea { width: 100%; border: 1px solid var(--cptsda-line); border-radius: 8px; padding: 10px 12px; font-size: 13.5px; min-height: 70px; resize: vertical; }

.cptsda-radio-row { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.cptsda-radio-row button { padding: 8px 16px; border-radius: 20px; border: 1px solid var(--cptsda-line); background: #fff; font-size: 13px; cursor: pointer; color: var(--cptsda-ink-soft); }
.cptsda-radio-row button.selected { background: var(--cptsda-sage); border-color: var(--cptsda-sage); color: #fff; font-weight: 700; }

.cptsda-nav { display: flex; justify-content: space-between; margin-top: 32px; gap: 10px; }
.cptsda-btn { padding: 14px 28px; border-radius: 30px; font-size: 14px; font-weight: 700; border: none; cursor: pointer; letter-spacing: .3px; }
.cptsda-btn-primary { background: var(--cptsda-accent); color: #fff; }
.cptsda-btn-primary:hover { background: var(--cptsda-accent-deep); }
.cptsda-btn-ghost { background: transparent; color: var(--cptsda-ink-soft); border: 1px solid var(--cptsda-line); }
.cptsda-btn-skip { background: transparent; color: var(--cptsda-ink-muted); text-decoration: underline; font-weight: 400; font-size: 12.5px; border: none; cursor: pointer; padding: 4px; }

.cptsda-cw { background: var(--cptsda-sage-bg); border-radius: 10px; padding: 14px 16px; font-size: 12.5px; color: var(--cptsda-sage-deep); margin-bottom: 18px; }

.cptsda-domain-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--cptsda-line); font-size: 13.5px; }
.cptsda-domain-tag { font-size: 10.5px; padding: 3px 10px; border-radius: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; }
.cptsda-tag-endorsed { background: var(--cptsda-sage-bg); color: var(--cptsda-sage-deep); }
.cptsda-tag-partial { background: var(--cptsda-pink-tint); color: var(--cptsda-accent-deep); }
.cptsda-tag-low { background: #f2f2f2; color: var(--cptsda-ink-muted); }

.cptsda-letter { background: var(--cptsda-cream); border: 1px dashed var(--cptsda-accent); border-radius: 10px; padding: 20px; font-size: 13.5px; line-height: 1.7; margin: 16px 0; }
.cptsda-letter h3 { font-family: var(--cptsda-font-display); font-size: 15px; color: var(--cptsda-accent-deep); margin: 0 0 10px; }
.cptsda-quote { font-style: italic; background: #fff; padding: 12px 14px; border-radius: 8px; border: 1px solid var(--cptsda-line); margin-top: 8px; font-family: var(--cptsda-font-display); }

.cptsda-links { display: flex; flex-direction: column; gap: 8px; margin-top: 18px; }
.cptsda-links a { display: block; padding: 12px 14px; border-radius: 8px; background: var(--cptsda-pink-tint); color: var(--cptsda-accent-deep); text-decoration: none; font-size: 13.5px; font-weight: 700; }

.cptsda-print-doc { display: none; }

@media print {
	@page { margin: 0.75in; }
	html, body { background: #fff !important; height: auto !important; }

	/* The print document is appended directly to <body> (see cptsda.js),
	   deliberately outside .cptsda-wrap. That means we can hide every other
	   top-level element on the page in one rule, with no leftover hidden
	   elements still reserving layout height (which was the cause of the
	   earlier blank-page bug). */
	body > *:not(.cptsda-print-doc) { display: none !important; }

	.cptsda-print-doc {
		display: block !important;
		background: #fff; color: #000;
		font-family: Georgia, 'Times New Roman', serif;
		font-size: 12pt;
		line-height: 1.5;
	}
	.cptsda-print-doc h1 {
		font-family: Georgia, 'Times New Roman', serif;
		font-style: normal; font-weight: 700; font-size: 20pt;
		color: #000; margin: 0 0 4pt;
	}
	.cptsda-print-doc .cptsda-print-meta {
		font-size: 9.5pt; color: #444; margin-bottom: 18pt;
		border-bottom: 1px solid #000; padding-bottom: 10pt;
	}
	.cptsda-print-doc h2 {
		font-family: Georgia, 'Times New Roman', serif;
		font-size: 12.5pt; text-transform: uppercase; letter-spacing: 0.5pt;
		color: #000; margin: 20pt 0 8pt; border-bottom: 1px solid #999; padding-bottom: 4pt;
	}
	.cptsda-print-doc p { margin: 0 0 10pt; }
	.cptsda-print-doc table { width: 100%; border-collapse: collapse; margin-bottom: 6pt; }
	.cptsda-print-doc td { padding: 5pt 0; border-bottom: 1px solid #ddd; font-size: 11pt; }
	.cptsda-print-doc td.cptsda-print-status { text-align: right; font-weight: 700; width: 140px; }
	.cptsda-print-doc .cptsda-print-subhead {
		font-weight: 700; font-size: 11.5pt; margin: 14pt 0 4pt; color: #000;
	}
	.cptsda-print-doc table.cptsda-print-detail-table td { font-size: 10pt; padding: 4pt 0; }
	.cptsda-print-doc table.cptsda-print-detail-table td.cptsda-print-answer {
		text-align: right; font-weight: 700; color: #333; width: 160px; white-space: nowrap;
	}
	.cptsda-print-doc .cptsda-print-quote {
		font-style: italic; border-left: 3px solid #000; padding-left: 12pt; margin: 10pt 0;
	}
	.cptsda-print-doc .cptsda-print-footer {
		margin-top: 22pt; padding-top: 10pt; border-top: 1px solid #000;
		font-size: 9pt; color: #333;
	}
}

@media (max-width: 480px) {
	.cptsda-scale button { min-width: 84px; }
	.cptsda-nav { flex-direction: column-reverse; }
	.cptsda-nav .cptsda-btn, .cptsda-nav .cptsda-btn-ghost { width: 100%; }
}
