/**
 * SCH Course Blocks — shared front-end stylesheet (approved "v3" design).
 *
 * THIS PLUGIN OWNS the SCH course front-end look. Every block reuses these tokens + components, so a
 * design change happens HERE (and in the PHP render) in ONE place and propagates to every course.
 *
 * COLOUR DISCIPLINE (navy + neutral base; teal & yellow are sparing accents):
 *   - Navy / neutral grey = the base (headings, body, section icons on a neutral chip, pills, checks).
 *   - Teal = accent ONLY on the CPD card (its 3px top bar + the credits number + the count "N") and links.
 *   - Yellow = ONLY the viewer's-own-association highlight (3px left accent + the "Your association" tag).
 * No teal backgrounds; pills/icons/checks are neutral. Scoped under `.schcb`. Rajdhani for headings/
 * labels/numbers; Inter / system sans for body (Rajdhani is loaded by the plugin, with a safe fallback).
 */

.schcb {
	--schcb-navy:      #122B46;
	--schcb-navy-2:    #41546A;
	--schcb-navy-3:    #75839A;
	--schcb-teal:      #227F77;
	--schcb-teal-deep: #0F6E56;
	--schcb-teal-light:#5DCAA5;
	--schcb-yellow:    #F1C40F;
	--schcb-chip:      #ECEFF3;
	--schcb-tint:      #E1F5EE; /* light-teal accent chip (header icons, licence pills) */
	--schcb-band:      #F0F3F6; /* NEUTRAL band — never teal-tinted */
	--schcb-navytint:  #E9EEF4; /* neutral navy-tint panel (promo / speaker backdrop) */
	--schcb-card:      #FFFFFF;
	--schcb-line:      rgba(18, 43, 70, 0.09);
	--schcb-line-soft: rgba(18, 43, 70, 0.06);
	--schcb-cream:     #FBFBF6;
	--schcb-head:      'Rajdhani', 'Segoe UI', system-ui, sans-serif;
	--schcb-body:      'Inter', 'Segoe UI', -apple-system, system-ui, sans-serif;

	font-family: var(--schcb-body);
	color: var(--schcb-navy);
	line-height: 1.65;
	box-sizing: border-box;
}

.schcb *,
.schcb *::before,
.schcb *::after {
	box-sizing: border-box;
}

.schcb [hidden] {
	display: none !important;
}

/* ── Shared atoms ─────────────────────────────────────────────────────── */

/* Credits number — the one place teal numerics appear. */
.schcb-num {
	display: inline-block;
	font-family: var(--schcb-head);
	font-weight: 700;
	font-size: 19px;
	line-height: 1;
	color: var(--schcb-teal);
}

.schcb-unit {
	display: block;
	margin-top: -2px;
	font-size: 11px;
	color: var(--schcb-navy-3);
}

/* Licence pill — light-teal accent: teal-deep text on a light-teal chip. */
.schcb-pill {
	padding: 3px 9px;
	border-radius: 20px;
	background: var(--schcb-tint);
	color: var(--schcb-teal-deep);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
}

/* Round association/logo chip — sized by its parent context (23px wall, 30px rows). */
.schcb-chip {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: 50%;
	border: 1px solid var(--schcb-line);
	background: #fff;
	color: var(--schcb-navy-2);
	font-weight: 700;
	text-transform: uppercase;
}

.schcb-chip img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 2px;
}

/* Visually-hidden (keeps the "other associations" label for screen readers; the mockup shows none). */
.schcb-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ── Shared section header (list + prose): neutral chip icon + Rajdhani h2 ── */
.schcb-list__head,
.schcb-prose__head {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
}

.schcb-list__hicon,
.schcb-prose__hicon {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: var(--schcb-tint); /* light-teal tint chip */
	color: var(--schcb-teal);      /* TEAL icon — the accent */
}

.schcb-list__title,
.schcb-prose__title {
	margin: 0;
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 22px;
	letter-spacing: 0.2px;
	color: var(--schcb-navy);
}

/* List item text fills the row beside the marker and wraps cleanly (colour/size inherit per variant). */
.schcb-list__text {
	flex: 1;
	min-width: 0;
}

/* ── BLOCK 1 — "What you'll learn" (check variant): prominent tinted outcomes band ── */
.schcb-list--check {
	margin: 28px 0;
	padding: 26px 28px;
	background: var(--schcb-band);
	border-radius: 16px;
}

.schcb-list--check .schcb-list__head {
	margin-bottom: 20px;
}

.schcb-list--check .schcb-list__items {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.schcb-list--check .schcb-list__item {
	display: flex;
	gap: 11px;
	align-items: flex-start;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--schcb-navy-2);
}

.schcb-list--check .schcb-list__tk {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	margin-top: 1px;
	border-radius: 50%;
	background: #fff;
	color: var(--schcb-teal); /* TEAL check inside the white circle */
	box-shadow: 0 1px 3px rgba(18, 43, 70, 0.07);
}

/* ── BLOCK 2 — "Requirements" (arrow variant): quiet, compact, secondary ── */
.schcb-list--req {
	margin: 30px 0;
}

.schcb-list--req .schcb-list__head {
	margin-bottom: 14px;
}

.schcb-list--req .schcb-list__title {
	font-size: 18px;
}

.schcb-list--req .schcb-list__hicon {
	width: 28px;
	height: 28px;
	border-radius: 7px;
}

.schcb-list--req .schcb-list__items {
	display: flex;
	flex-direction: column;
	gap: 9px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.schcb-list--req .schcb-list__item {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	max-width: 62ch;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--schcb-navy-3);
}

.schcb-list--req .schcb-list__dot {
	flex: none;
	width: 5px;
	height: 5px;
	margin-top: 8px;
	border-radius: 50%;
	background: var(--schcb-teal-light); /* light-teal dot — a small accent */
}

/* ── BLOCK 3 — "About this course" (rich text): editorial prose ── */
.schcb-prose {
	margin: 30px 0;
}

/* The body wraps saved core blocks (InnerBlocks). The default text colour is set on the CONTAINER so it
   INHERITS — any colour the admin sets on an individual core block (inline style / has-*-color class)
   overrides it. The strong / link COLOUR defaults use :where() (zero specificity) so the admin's own colours
   still win. Text ALIGNMENT is never set here, so core's alignment (incl. justify) is fully preserved.
   ALL paragraphs are normal body weight/size at FULL container width (no lead, no max-width narrowing). */
.schcb-prose__body {
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--schcb-navy-2);
}

.schcb-prose__body > p {
	margin: 0 0 14px;
}

.schcb-prose__body > p:last-child {
	margin-bottom: 0;
}

:where( .schcb-prose__body strong, .schcb-prose__body b ) {
	color: var(--schcb-navy);
	font-weight: 600;
}

:where( .schcb-prose__body a ) {
	color: var(--schcb-teal);
	text-decoration: underline;
	text-decoration-color: var(--schcb-teal-light);
	text-underline-offset: 2px;
}

/* Core lists → small navy diamond markers instead of bullets (full width). */
.schcb-prose__body ul {
	margin: 0 0 14px;
	padding-left: 0;
	list-style: none;
}

.schcb-prose__body ul li {
	position: relative;
	margin-bottom: 8px;
	padding-left: 18px;
	line-height: 1.55;
}

.schcb-prose__body ul li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 9px;
	width: 6px;
	height: 6px;
	background: var(--schcb-navy);
	transform: rotate(45deg);
}

.schcb-prose__body ol {
	margin: 0 0 14px;
	padding-left: 1.3em;
}

.schcb-prose__body ol li {
	margin-bottom: 8px;
	line-height: 1.55;
}

/* Justify support for core paragraphs (the core convention class our editor filter adds). Unscoped so it
   works both in the saved front-end markup and in the block editor. */
.has-text-align-justify {
	text-align: justify;
}

/* ── BLOCK 4 — CPD recognition: subdued white card ── */
.schcb-cpd {
	position: relative;
	margin: 30px 0;
	padding: 20px 22px;
	background: var(--schcb-card);
	border: 1px solid var(--schcb-line);
	border-radius: 14px;
	box-shadow: 0 1px 14px rgba(18, 43, 70, 0.05);
	overflow: hidden;
}

/* The one teal flourish: the 3px top-accent bar. */
.schcb-cpd::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--schcb-teal), var(--schcb-teal-light));
}

.schcb-cpd__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.schcb-cpd__label {
	display: flex;
	align-items: center;
	gap: 8px;
}

.schcb-cpd__medal {
	display: inline-flex;
	flex: none;
	color: var(--schcb-teal); /* teal medal */
}

.schcb-cpd__cpd {
	font-family: var(--schcb-head);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 1.4px;
	color: var(--schcb-navy);
}

.schcb-cpd__count {
	font-size: 12.5px;
	color: var(--schcb-navy-3);
	text-align: right;
}

.schcb-cpd__count-n {
	font-weight: 600;
	color: var(--schcb-teal); /* the recognising "N" — teal accent */
}

.schcb-wall {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin: 12px 0 14px;
}

.schcb-wall .schcb-chip {
	width: 23px;
	height: 23px;
	font-size: 9px;
}

/* Viewer's own association — the ONLY yellow: neutral cream bg + 3px yellow left accent. */
/* Viewer's own row. The tinted box is pulled 12px into the card's side padding (negative margin) and given
   12px inner padding, so its CONTENT origin matches the normal rows (logos/names/credits line up). The yellow
   accent is an INSET bar drawn over the tint — it does not shift content. */
/* Viewer's own row — NO colour fill (looks like the normal rows): just a subtle TEAL inset left accent.
   The negative-margin gutter + matching padding keep logos/credits aligned with the normal rows. */
.schcb-mine {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 -12px 4px;
	padding: 13px 12px;
	box-shadow: inset 3px 0 0 var(--schcb-teal);
}

.schcb-mine .schcb-chip,
.schcb-row .schcb-chip {
	width: 30px;
	height: 30px;
	font-size: 10px;
}

.schcb-mine__mid {
	flex: 1;
	min-width: 0;
}

.schcb-mine__name {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 15px;
	color: var(--schcb-navy);
}

.schcb-mine__tag {
	flex: none;
	padding: 2px 9px;
	border-radius: 20px;
	background: var(--schcb-yellow);   /* yellow #F1C40F — the tag only (row stays fill-free) */
	color: var(--schcb-navy);          /* navy #122B46 text */
	font-size: 10.5px;
	font-weight: 600;
}

.schcb-mine__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 5px;
}

.schcb-mine__credit,
.schcb-row__credit {
	flex: none;
	text-align: right;
}

/* No-viewer nudge — quiet neutral. */
.schcb-note {
	margin-bottom: 4px;
	padding: 11px 14px;
	border-radius: 10px;
	background: var(--schcb-band);
	color: var(--schcb-navy-3);
	font-size: 12.5px;
}

/* Other associations — hairline-separated rows. */
.schcb-row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 0;
	border-top: 1px solid var(--schcb-line-soft);
}

.schcb-table:not(.is-expanded) .schcb-row.is-overflow {
	display: none;
}

.schcb-row__mid {
	flex: 1;
	min-width: 0;
}

.schcb-row__name {
	margin: 0;
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 15px;
	color: var(--schcb-navy);
}

.schcb-row__lics {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px;
	margin-top: 5px;
}

.schcb-row__lics-empty {
	color: var(--schcb-navy-3);
	font-size: 12px;
}

/* Pills wrapper is transparent to layout so the collapse counts the pills directly. */
.schcb-row__pills {
	display: contents;
}

/* Collapsed: only the first 2 pills show; the "+N" toggle reveals the rest. */
.schcb-row:not(.is-open) .schcb-row__pills .schcb-pill:nth-child(n + 3) {
	display: none;
}

/* "+N" more pill — neutral outline + chevron. */
.schcb-row__toggle {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 3px 9px;
	border: 1px solid var(--schcb-line);
	border-radius: 20px;
	background: transparent;
	color: var(--schcb-navy-3);
	font-family: var(--schcb-body);
	font-size: 11px;
	font-weight: 500;
	cursor: pointer;
}

.schcb-row__toggle:hover,
.schcb-row__toggle:focus-visible {
	color: var(--schcb-navy-2);
	border-color: var(--schcb-navy-3);
	outline: none;
}

.schcb-row__toggle svg {
	width: 11px;
	height: 11px;
	transition: transform 0.18s ease;
}

.schcb-row.is-open .schcb-row__toggle svg {
	transform: rotate(180deg);
}

.schcb-row.is-open .schcb-row__toggle-more {
	display: none;
}

.schcb-row__toggle-less {
	display: none;
}

.schcb-row.is-open .schcb-row__toggle-less {
	display: inline;
}

/* "Show all N" overflow control. */
.schcb-more {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	margin-top: 4px;
	padding: 11px 0 0;
	border: 0;
	border-top: 1px solid var(--schcb-line-soft);
	background: transparent;
	color: var(--schcb-navy-2);
	font-family: var(--schcb-body);
	font-size: 12.5px;
	font-weight: 600;
	cursor: pointer;
}

.schcb-more:hover,
.schcb-more:focus-visible {
	color: var(--schcb-navy);
	outline: none;
}

.schcb-more svg {
	width: 14px;
	height: 14px;
	transition: transform 0.18s ease;
}

.schcb-table.is-expanded .schcb-more svg {
	transform: rotate(180deg);
}

/* ── Webinar CPD (manual) — reuses the CPD card shell (.schcb-cpd .schcb-wcpd) ── */
.schcb-wcpd__rows {
	margin-top: 12px;
}

.schcb-wcpd__row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 0;
	border-top: 1px solid var(--schcb-line-soft);
}

.schcb-wcpd__row:first-child {
	border-top: 0;
}

.schcb-wcpd__row .schcb-chip {
	width: 30px;
	height: 30px;
	font-size: 10px;
}

.schcb-wcpd__mid {
	flex: 1;
	min-width: 0;
}

.schcb-wcpd__fa {
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 15px;
	color: var(--schcb-navy);
}

.schcb-wcpd__pills {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 5px;
}

.schcb-wcpd__credit {
	flex: none;
	text-align: right;
}

.schcb-wcpd__note {
	margin: 14px 0 0;
	font-size: 12px;
	line-height: 1.5;
	color: var(--schcb-navy-3);
}

/* ── Divider above "About this course" (rendered as part of the About block) ── */
.schcb-rule {
	height: 0;
	border: 0;
	border-top: 1px solid rgba(18, 43, 70, 0.07);
	margin: 26px 0 22px;
}

.schcb-rule + .schcb-prose {
	margin-top: 0;
}

/* ── Shared CTA buttons ───────────────────────────────────────────────── */
/* The colour rules are scoped under `.schcb` (extra specificity) so a theme's link colour can NEVER make a
   CTA illegible (e.g. teal/green text on the yellow button). Hover/focus colours are stated explicitly. */
.schcb .schcb-cta {
	display: inline-block;
	padding: 13px 28px;
	border: 0;
	border-radius: 9px;
	font-family: var(--schcb-head);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: 0.4px;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.schcb .schcb-cta--yellow {
	background: var(--schcb-yellow);
	color: var(--schcb-navy); /* DARK navy text on yellow — legible, eye-catching */
}

.schcb .schcb-cta--yellow:hover,
.schcb .schcb-cta--yellow:focus {
	background: #E0B40C; /* slightly darker yellow */
	color: var(--schcb-navy);
}

.schcb .schcb-cta--navy {
	background: var(--schcb-navy);
	color: #fff;
}

.schcb .schcb-cta--navy:hover,
.schcb .schcb-cta--navy:focus {
	background: #0c2138;
	color: #fff;
}

.schcb .schcb-cta--outline {
	padding: 11.5px 26.5px;
	background: transparent;
	color: var(--schcb-teal-deep);
	border: 1.5px solid var(--schcb-teal);
}

.schcb .schcb-cta--outline:hover,
.schcb .schcb-cta--outline:focus {
	background: var(--schcb-tint);
	color: var(--schcb-teal-deep);
}

/* ── PROMO card — centred upsell (sales) + member view ────────────────── */
.schcb-promo {
	max-width: 460px;
	margin: 30px auto;
	padding: 30px 32px;
	background: var(--schcb-card);
	border: 1px solid var(--schcb-line);
	border-radius: 16px;
	box-shadow: 0 1px 14px rgba(18, 43, 70, 0.05);
	text-align: center;
}

.schcb-promo__eyebrow {
	margin-bottom: 8px;
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--schcb-teal-deep);
}

.schcb-promo__heading {
	margin: 0 0 16px;
	font-family: var(--schcb-head);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.2;
	color: var(--schcb-navy);
}

.schcb-promo__bens {
	display: flex;
	flex-direction: column;
	gap: 7px;
	margin: 0 0 22px;
}

.schcb-promo__ben {
	font-size: 14px;
	line-height: 1.5;
	color: var(--schcb-navy-2);
}

.schcb-promo__ben strong {
	color: var(--schcb-navy);
	font-weight: 700;
}

/* Member view — heading + stacked action buttons. */
.schcb-promo--member .schcb-promo__heading {
	margin-bottom: 20px;
}

.schcb-promo__links {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.schcb-promo__links .schcb-cta {
	width: 100%;
	max-width: 360px;
}

/* ── SPEAKER card (cut-out PNG, flush to the card's bottom edge) ───────── */
.schcb-speaker {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	margin: 30px 0;
	padding: 22px;
	background: var(--schcb-card);
	border: 1px solid var(--schcb-line);
	border-radius: 14px;
	overflow: hidden; /* clip the figure cleanly at the rounded bottom corners */
}

.schcb-speaker__fig {
	display: flex;
	flex: none;
	align-self: stretch;
	align-items: flex-end; /* the cut-out stands on the card itself */
	justify-content: center;
	width: 150px;
	/* Cancel the card's bottom padding so the figure sits FLUSH on the bottom edge (no gap beneath) —
	   the usually-cropped legs read as the person rising out of the bottom. Top/side spacing is kept. */
	margin-bottom: -22px;
	color: var(--schcb-navy-3);
	/* NO backdrop panel — the transparent PNG sits directly on the white card. */
}

.schcb-speaker__img {
	display: block;
	width: auto;
	max-width: 100%;
	max-height: 240px;
	margin-bottom: 0;
	object-fit: contain; /* full cut-out figure, never cropped to a head */
}

.schcb-speaker__fig svg {
	margin-bottom: 18px;
}

.schcb-speaker__info {
	flex: 1;
	min-width: 0;
}

.schcb-speaker__role {
	margin-bottom: 3px;
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: var(--schcb-teal-deep);
}

.schcb-speaker__name {
	margin: 0 0 8px;
	font-family: var(--schcb-head);
	font-weight: 700;
	font-size: 21px;
	color: var(--schcb-navy);
}

.schcb-speaker__bio {
	margin: 0 0 12px;
	max-width: 54ch;
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--schcb-navy-2);
}

/* Three categorised, colour-coded credential groups. */
.schcb-speaker__cat {
	margin-top: 12px;
}

.schcb-speaker__cat-label {
	margin-bottom: 5px;
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	color: var(--schcb-navy);
}

.schcb-speaker__cat-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.schcb-speaker__pill {
	padding: 4px 10px;
	border-radius: 6px;
	font-size: 11px;
	font-weight: 500;
}

.schcb-speaker__pill--coaching {
	background: #E1F5EE; /* teal tint */
	color: #0F6E56;
}

.schcb-speaker__pill--education {
	background: #FBF1D3; /* amber / gold */
	color: #8A6D1A;
}

.schcb-speaker__pill--playing {
	background: #ECEFF3; /* neutral */
	color: #41546A;
}

/* ── COUNTDOWN / webinar-entry card (styled wrapper around the SCH Live shortcode) ── */
.schcb-live {
	margin: 30px 0;
	padding: 22px;
	background: var(--schcb-card);
	border: 1px solid var(--schcb-line);
	border-radius: 14px;
	text-align: center;
}

.schcb-live__label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	margin-bottom: 14px;
	font-family: var(--schcb-head);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--schcb-teal-deep);
}

.schcb-live__dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--schcb-teal); /* teal live dot */
}

.schcb-live__embed {
	margin-bottom: 16px;
}

.schcb-live__date {
	margin-bottom: 16px;
	font-size: 13px;
	color: var(--schcb-navy-2);
}

/* ── Responsive (new blocks) ──────────────────────────────────────────── */
@media (max-width: 600px) {
	.schcb-promo {
		padding: 26px 22px;
	}

	.schcb-speaker {
		flex-direction: column;
	}

	.schcb-speaker__fig {
		width: 100%;
		align-self: auto;
	}
}

/* ── Association banner — association colour as a TASTEFUL accent on a light card ──
   `--schcb-accent` is set inline (the chosen hex); the rest is here. No flooded colour background. */
.schcb-banner {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 28px 0;
	padding: 18px 20px;
	background: var(--schcb-card);
	border: 1px solid var(--schcb-line);
	border-left: 3px solid var(--schcb-accent, var(--schcb-navy));
	border-radius: 12px;
	box-shadow: 0 1px 14px rgba(18, 43, 70, 0.05);
}

.schcb-banner__logo {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 10px;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--schcb-line);
}

.schcb-banner__logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 3px;
}

.schcb-banner__text {
	min-width: 0;
}

.schcb-banner__heading {
	font-family: var(--schcb-head);
	font-weight: 700;
	font-size: 18px;
	line-height: 1.2;
	color: var(--schcb-accent, var(--schcb-navy)); /* heading in the association colour */
}

.schcb-banner__sub {
	margin-top: 3px;
	font-family: var(--schcb-head);
	font-weight: 500;
	font-size: 13px;
	color: var(--schcb-navy-2); /* muted, readable on any accent */
}

@media (max-width: 480px) {
	.schcb-banner {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ── Editor-only helpers (repeatable list editing + prose box) ─────────── */
.schcb-ed__list {
	display: grid;
	gap: 8px;
	margin: 4px 0 10px;
}

.schcb-ed-item {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.schcb-ed-item .components-base-control {
	flex: 1 1 auto;
}

/* Promo benefit rows: a narrow "bold keyword" field + a wider "rest of line" field. */
.schcb-ed-benfields {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	gap: 6px;
	flex: 1 1 auto;
	min-width: 0;
}

/* Webinar-CPD recognition cards in the editor. */
.schcb-ed-card {
	margin-bottom: 10px;
	padding: 12px;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	background: #fff;
}

.schcb-ed-card__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 6px;
}

.schcb-ed-card__head strong {
	font-size: 12px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #50575e;
}

.schcb-ed-hint {
	margin: 0;
	font-size: 12px;
	font-style: italic;
	color: #757575;
}

.schcb-ed-item__btns {
	display: flex;
	flex: 0 0 auto;
	gap: 2px;
	padding-top: 2px;
}

.schcb-ed-prose {
	min-height: 5em;
	padding: 10px 12px;
	border: 1px solid var(--schcb-line);
	border-radius: 10px;
	background: #fff;
}

/* ── Block-editor placeholder (static preview; real output is server-rendered) ── */
.schcb-editor-placeholder {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	border: 1px dashed var(--schcb-line);
	border-radius: 12px;
	background: var(--schcb-band);
	color: var(--schcb-navy);
	font-family: var(--schcb-body);
}

.schcb-editor-placeholder svg {
	flex: 0 0 auto;
	color: var(--schcb-teal);
}

.schcb-editor-placeholder strong {
	display: block;
	font-family: var(--schcb-head);
	font-weight: 700;
	font-size: 15px;
}

.schcb-editor-placeholder span {
	color: var(--schcb-navy-3);
	font-size: 12.5px;
}

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 560px) {
	.schcb-list--check {
		padding: 22px 20px;
	}

	.schcb-list--check .schcb-list__items {
		grid-template-columns: 1fr;
		gap: 13px;
	}

	.schcb-cpd__top {
		flex-wrap: wrap;
		gap: 6px;
	}

	.schcb-cpd__count {
		text-align: left;
	}
}