/**
 * SolveSA course finder styles.
 *
 * Colours come from the theme's palette custom properties wherever possible, so
 * a brand colour change in Appearance > Editor > Styles flows through to the
 * catalogue automatically. Fallbacks are the SolveSA brand values.
 */

.solvesa-finder {
	--sf-teal: var( --wp--preset--color--primary, #1D7991 );
	--sf-sky: var( --wp--preset--color--secondary, #5BC2E7 );
	--sf-navy: var( --wp--preset--color--navy, #1A2E44 );
	--sf-pale: var( --wp--preset--color--base-3, #EAF4F8 );
	--sf-grey: var( --wp--preset--color--base-2, #F5F7F8 );
	--sf-text: var( --wp--preset--color--contrast, #333333 );
	--sf-line: #E4E9ED;
	--sf-radius: 14px;
	color: var( --sf-text );
}

.solvesa-finder__shell {
	display: grid;
	grid-template-columns: minmax(240px, 300px) 1fr;
	gap: 2rem;
	align-items: start;
}

.solvesa-finder__mobile-toggle {
	display: none;
}

/* ------------------------------------------------------------------ filters */

.solvesa-finder__filters {
	position: sticky;
	top: 6rem;
	background: #fff;
	border: 1px solid var( --sf-line );
	border-radius: var( --sf-radius );
	padding: 1.1rem;
	max-height: calc( 100vh - 8rem );
	overflow-y: auto;
}

.sf-filters__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .5rem;
	margin-bottom: .75rem;
}

.sf-filters__head h3 {
	margin: 0;
	font-size: 1rem;
	color: var( --sf-teal );
}

.sf-clear {
	background: none;
	border: 0;
	padding: 0;
	color: var( --sf-teal );
	font: inherit;
	font-size: .8125rem;
	text-decoration: underline;
	cursor: pointer;
}

.sf-group {
	border-top: 1px solid var( --sf-line );
	padding: .85rem 0 0;
	margin: .85rem 0 0;
}

.sf-group:first-of-type {
	border-top: 0;
	margin-top: 0;
	padding-top: 0;
}

.sf-label {
	display: block;
	font-size: .8125rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var( --sf-navy );
	margin-bottom: .5rem;
	cursor: pointer;
}

.sf-details > summary {
	list-style: none;
	position: relative;
	padding-right: 1.25rem;
}

.sf-details > summary::-webkit-details-marker {
	display: none;
}

.sf-details > summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: -2px;
	font-size: 1rem;
	line-height: 1;
	color: var( --sf-teal );
}

.sf-details[open] > summary::after {
	content: "\2013";
}

.sf-search,
.sf-sort select {
	width: 100%;
	padding: .5rem .6rem;
	border: 1px solid var( --sf-line );
	border-radius: 6px;
	font: inherit;
	font-size: .9375rem;
	background: #fff;
	color: inherit;
}

.sf-search:focus-visible,
.sf-sort select:focus-visible,
.sf-option input:focus-visible,
input[type="range"]:focus-visible {
	outline: 3px solid var( --sf-sky );
	outline-offset: 2px;
}

input[type="range"] {
	width: 100%;
	accent-color: var( --sf-teal );
}

.sf-options {
	display: flex;
	flex-direction: column;
	gap: .3rem;
	max-height: 15rem;
	overflow-y: auto;
}

.sf-option {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: .5rem;
	font-size: .9375rem;
	line-height: 1.35;
	cursor: pointer;
	padding: .1rem 0;
}

.sf-option--empty {
	opacity: .42;
	cursor: not-allowed;
}

.sf-count {
	font-size: .75rem;
	color: #6b7c86;
	background: var( --sf-grey );
	border-radius: 10px;
	padding: 1px 7px;
	font-variant-numeric: tabular-nums;
}

/* ------------------------------------------------------------------ results */

.solvesa-finder__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	padding-bottom: .85rem;
	margin-bottom: 1.25rem;
	border-bottom: 2px solid var( --sf-pale );
}

.sf-count-line {
	margin: 0;
	font-size: .9375rem;
}

.sf-bar-right {
	display: flex;
	align-items: center;
	gap: .85rem;
	flex-wrap: wrap;
}

.sf-sort {
	display: flex;
	align-items: center;
	gap: .4rem;
	font-size: .8125rem;
}

.sf-sort span {
	white-space: nowrap;
	color: #6b7c86;
}

.sf-share {
	background: none;
	border: 1px solid var( --sf-line );
	border-radius: 6px;
	padding: .35rem .7rem;
	font: inherit;
	font-size: .8125rem;
	color: var( --sf-teal );
	cursor: pointer;
}

.sf-share:hover {
	border-color: var( --sf-teal );
}

.solvesa-finder__list {
	display: grid;
	gap: 1rem;
}

.sf-card {
	background: #fff;
	border: 1px solid var( --sf-line );
	border-left: 4px solid var( --sf-teal );
	border-radius: var( --sf-radius );
	padding: 1.1rem 1.25rem;
}

.sf-card__title {
	margin: 0 0 .5rem;
	font-size: 1.125rem;
	line-height: 1.3;
}

.sf-card__title a {
	color: var( --sf-teal );
	text-decoration: none;
}

.sf-card__title a:hover {
	text-decoration: underline;
}

.sf-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin: 0 0 .75rem;
}

.sf-pill {
	display: inline-block;
	font-size: .75rem;
	font-weight: 600;
	line-height: 1.4;
	padding: 2px 9px;
	border-radius: 999px;
	background: var( --sf-pale );
	color: var( --sf-navy );
}

.sf-pill--nqf {
	background: var( --sf-teal );
	color: #fff;
}

.sf-pill--soft {
	background: var( --sf-grey );
	color: #55636c;
}

.sf-card__facts {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax(88px, 1fr) );
	gap: .7rem 1.25rem;
	margin: 0;
}

.sf-card__facts div {
	margin: 0;
}

.sf-card__facts dt {
	font-size: .6875rem;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #6b7c86;
	margin: 0;
}

.sf-card__facts dd {
	margin: 0;
	font-size: .9375rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.sf-card__where {
	margin: .75rem 0 0;
	font-size: .8125rem;
	color: #6b7c86;
}

.sf-card__cta {
	margin: .85rem 0 0;
	font-size: .875rem;
	font-weight: 600;
}

.sf-card__cta a {
	color: var( --sf-teal );
	text-decoration: none;
}

.sf-card__cta a:hover {
	text-decoration: underline;
}

.sf-empty {
	background: var( --sf-pale );
	border-radius: var( --sf-radius );
	padding: 1.5rem;
	margin: 0;
	text-align: center;
}

.solvesa-finder__note {
	margin: 1.75rem 0 0;
	padding: .85rem 1rem;
	background: var( --sf-grey );
	border-left: 3px solid var( --sf-sky );
	border-radius: 4px;
	font-size: .8125rem;
	color: #55636c;
}

.solvesa-finder__noscript {
	background: var( --sf-pale );
	padding: 1rem;
	border-radius: var( --sf-radius );
}

/* -------------------------------------------------------------- responsive */

@media ( max-width: 781px ) {
	.solvesa-finder__shell {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.solvesa-finder__mobile-toggle {
		display: block;
		width: 100%;
		padding: .8rem 1rem;
		background: var( --sf-teal );
		color: #fff;
		border: 0;
		border-radius: 6px;
		font: inherit;
		font-weight: 700;
		cursor: pointer;
	}

	.solvesa-finder__filters {
		display: none;
		position: static;
		max-height: none;
	}

	.solvesa-finder__shell.is-filters-open .solvesa-finder__filters {
		display: block;
	}

	.sf-card__facts {
		grid-template-columns: repeat( auto-fit, minmax(76px, 1fr) );
		gap: .6rem 1rem;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.solvesa-finder * {
		transition: none !important;
	}
}

/* ------------------------------------------------- single course page */

.solvesa-course {
	background: var( --sf-pale, #EAF4F8 );
	border-radius: var( --sf-radius, 10px );
	padding: 1.25rem 1.5rem;
	margin: 0 0 1.75rem;
}

.solvesa-course__pills {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
	margin: 0 0 1rem;
}

.solvesa-course__pills .sf-pill {
	background: #fff;
	text-decoration: none;
}

.solvesa-course__pills .sf-pill:hover {
	background: var( --sf-teal, #1D7991 );
	color: #fff;
}

.solvesa-course__facts {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax(130px, 1fr) );
	gap: 1rem 1.5rem;
	margin: 0;
}

.solvesa-course__facts div {
	margin: 0;
}

.solvesa-course__facts dt {
	margin: 0 0 .15rem;
	font-size: .6875rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #55636c;
}

.solvesa-course__facts dd {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.25;
	color: var( --sf-navy, #1A2E44 );
	font-variant-numeric: tabular-nums;
}

.solvesa-course__hint {
	display: block;
	font-size: .75rem;
	font-weight: 400;
	color: #6b7c86;
	font-variant-numeric: normal;
}

.solvesa-course__pricing-note,
.solvesa-course__branch {
	margin: 1rem 0 0;
	padding-top: .85rem;
	border-top: 1px solid rgba( 26, 46, 68, .12 );
	font-size: .8125rem;
	color: #55636c;
}

.solvesa-course__section {
	margin: 0 0 1.75rem;
}

.solvesa-course__section h2 {
	font-size: 1.25rem;
	margin: 0 0 .6rem;
}

.solvesa-course__related ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .5rem;
}

.solvesa-course__related li {
	padding: .6rem .85rem;
	background: var( --sf-grey, #F5F5F5 );
	border-radius: 6px;
	border-left: 3px solid var( --sf-sky, #5BC2E7 );
}

.solvesa-course__related a {
	font-weight: 600;
	text-decoration: none;
	color: var( --sf-teal, #1D7991 );
}

.solvesa-course__related a:hover {
	text-decoration: underline;
}

.solvesa-course__cta {
	background: var( --sf-navy, #1A2E44 );
	color: #fff;
	border-radius: var( --sf-radius, 10px );
	padding: 1.35rem 1.5rem;
	margin: 0 0 1.75rem;
}

.solvesa-course__cta-lead {
	margin: 0 0 .85rem;
	font-size: 1.0625rem;
	font-weight: 600;
}

.solvesa-course__cta-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem;
	margin: 0;
}

.solvesa-course__button {
	display: inline-block;
	padding: .7rem 1.2rem;
	border-radius: 6px;
	background: #fff;
	color: var( --sf-navy, #1A2E44 );
	font-size: .9375rem;
	font-weight: 700;
	text-decoration: none;
	border: 2px solid #fff;
}

.solvesa-course__button:hover {
	background: var( --sf-sky, #5BC2E7 );
	border-color: var( --sf-sky, #5BC2E7 );
	color: var( --sf-navy, #1A2E44 );
}

.solvesa-course__button--ghost {
	background: transparent;
	color: #fff;
}

.solvesa-course__button--ghost:hover {
	background: #fff;
	color: var( --sf-navy, #1A2E44 );
	border-color: #fff;
}

/* Internal-only markers — shown to logged-in staff, never to visitors */

.sf-internal,
.solvesa-course__facts .solvesa-course__hint {
	font-size: .625rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #b3541e;
}

.sf-card__cost dd {
	color: #b3541e;
}

.sf-card__quote {
	margin-left: .85rem;
	font-weight: 600;
}

/* --- 2.0.0: v4 fields ---------------------------------------------------- */

.sf-pill--12h{background:#E8A44A;color:#3a2a10;font-weight:700;cursor:help}

.solvesa-course__badge{background:#EAF4F8;border-left:4px solid #1D7991;
	border-radius:0 8px 8px 0;color:#1A2E44;font-size:.95rem;margin:0 0 18px;
	padding:12px 14px}

.solvesa-course__outcomes{margin:0;padding-left:1.15em}
.solvesa-course__outcomes li{margin-bottom:.45em}