/*
 * Academic College Screener
 *
 * Every rule is scoped under .acs-screener so nothing leaks into the theme.
 * No JavaScript is registered anywhere in this plugin, so Breeze's inline-JS
 * delay cannot break the layout.
 */

.acs-screener {
	--acs-ink: #0f1b2d;
	--acs-sub: #52617a;
	--acs-border: #e6ebf2;
	--acs-accent: #1f6fd6;
	--acs-accent-dark: #1a5fb8;
	--acs-panel: #f5f8fc;
	--acs-ok: #159a5a;
	--acs-warn: #e8920c;
	--acs-alert: #d23b2e;

	max-width: 1180px;
	margin: 0 auto;
	padding: 24px 18px 56px;
	color: var(--acs-ink);
	font-size: 16px;
	line-height: 1.6;
}

.acs-screener a {
	color: var(--acs-accent);
	text-decoration: none;
}

.acs-screener a:hover,
.acs-screener a:focus {
	color: var(--acs-accent-dark);
	text-decoration: underline;
}

.acs-screener .acs-h1 {
	font-size: 1.75rem;
	line-height: 1.25;
	margin: 0 0 14px;
	color: var(--acs-ink);
}

.acs-screener .acs-lede {
	color: var(--acs-sub);
	max-width: 68ch;
	margin: 0 0 22px;
}

/* ---- counts block: leads the page, because accuracy is the whole point ---- */

.acs-screener .acs-counts {
	background: var(--acs-panel);
	border: 1px solid var(--acs-border);
	border-left: 4px solid var(--acs-accent);
	border-radius: 6px;
	padding: 14px 18px;
	margin: 0 0 24px;
}

.acs-screener .acs-count-main {
	margin: 0;
	font-size: 1.05rem;
}

.acs-screener .acs-count-main strong {
	font-size: 1.5rem;
}

.acs-screener .acs-count-breakdown {
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
	font-size: 0.94rem;
}

.acs-screener .acs-count-breakdown li {
	padding: 3px 0 3px 20px;
	position: relative;
	color: var(--acs-sub);
}

.acs-screener .acs-count-breakdown li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: currentColor;
}

.acs-screener .acs-ok { color: var(--acs-ok); }
.acs-screener .acs-warn { color: var(--acs-warn); }
.acs-screener .acs-alert { color: var(--acs-alert); }
.acs-screener .acs-neutral { color: var(--acs-sub); }

/* ---- filter rail ---- */

.acs-screener .acs-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
	padding: 16px 18px;
	border: 1px solid var(--acs-border);
	border-radius: 6px;
	margin: 0 0 24px;
}

.acs-screener .acs-facet-group {
	flex: 1 1 220px;
	min-width: 200px;
}

.acs-screener .acs-facet-title {
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--acs-sub);
	margin: 0 0 8px;
	font-weight: 600;
}

.acs-screener .acs-facet-group ul {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 260px;
	overflow-y: auto;
}

.acs-screener .acs-facet-group li {
	margin: 0 0 2px;
	font-size: 0.92rem;
}

.acs-screener .acs-current {
	font-weight: 600;
	color: var(--acs-ink);
}

.acs-screener .acs-n {
	color: var(--acs-sub);
	font-size: 0.82rem;
}

.acs-screener .acs-textfilter {
	flex: 1 1 220px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.acs-screener .acs-textfilter label {
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--acs-sub);
	font-weight: 600;
}

.acs-screener .acs-textfilter input {
	padding: 7px 10px;
	border: 1px solid var(--acs-border);
	border-radius: 4px;
	font-size: 0.92rem;
}

.acs-screener .acs-textfilter button {
	padding: 8px 14px;
	background: var(--acs-accent);
	color: #fff;
	border: 0;
	border-radius: 4px;
	cursor: pointer;
	font-size: 0.9rem;
}

.acs-screener .acs-textfilter button:hover {
	background: var(--acs-accent-dark);
}

/* ---- result table ---- */

.acs-screener .acs-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 20px;
	font-size: 0.93rem;
}

.acs-screener .acs-table th,
.acs-screener .acs-table td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid var(--acs-border);
	vertical-align: top;
}

.acs-screener .acs-table thead th {
	background: var(--acs-panel);
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--acs-sub);
	border-bottom: 2px solid var(--acs-border);
}

.acs-screener .acs-name {
	font-weight: 600;
	max-width: 340px;
}

.acs-screener .acs-sub {
	display: block;
	font-weight: 400;
	font-size: 0.82rem;
	color: var(--acs-sub);
	margin-top: 3px;
}

.acs-screener .acs-flag {
	display: inline-block;
	font-size: 0.72rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--acs-warn);
	border: 1px solid currentColor;
	border-radius: 3px;
	padding: 1px 5px;
	margin-left: 4px;
	vertical-align: middle;
}

.acs-screener .acs-course {
	display: inline-block;
	background: var(--acs-panel);
	border: 1px solid var(--acs-border);
	border-radius: 3px;
	padding: 2px 7px;
	margin: 0 4px 4px 0;
	font-size: 0.82rem;
	white-space: nowrap;
}

.acs-screener .acs-course em {
	font-style: normal;
	color: var(--acs-sub);
}

.acs-screener .acs-empty {
	padding: 22px;
	background: var(--acs-panel);
	border: 1px dashed var(--acs-border);
	border-radius: 6px;
	color: var(--acs-sub);
	text-align: center;
}

/* ---- pagination, cross-links, faq, provenance ---- */

.acs-screener .acs-pagination {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 0 0 28px;
	font-size: 0.92rem;
}

.acs-screener .acs-pageinfo {
	color: var(--acs-sub);
}

.acs-screener .acs-crosslinks h2,
.acs-screener .acs-faq h2,
.acs-screener .acs-provenance h2 {
	font-size: 1.05rem;
	margin: 0 0 10px;
}

.acs-screener .acs-crosslinks {
	margin: 0 0 28px;
}

.acs-screener .acs-crosslinks ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
}

.acs-screener .acs-crosslinks li a {
	display: inline-block;
	border: 1px solid var(--acs-border);
	border-radius: 999px;
	padding: 4px 13px;
	font-size: 0.88rem;
}

.acs-screener .acs-faq {
	margin: 0 0 28px;
}

.acs-screener .acs-faq details {
	border-bottom: 1px solid var(--acs-border);
	padding: 10px 0;
}

.acs-screener .acs-faq summary {
	cursor: pointer;
	font-weight: 600;
	font-size: 0.95rem;
	list-style: none;
}

.acs-screener .acs-faq summary::-webkit-details-marker {
	display: none;
}

.acs-screener .acs-faq summary::before {
	content: "+";
	display: inline-block;
	width: 18px;
	color: var(--acs-accent);
	font-weight: 700;
}

.acs-screener .acs-faq details[open] summary::before {
	content: "\2212";
}

.acs-screener .acs-faq p {
	margin: 8px 0 0 18px;
	color: var(--acs-sub);
	font-size: 0.92rem;
}

.acs-screener .acs-provenance {
	border-top: 2px solid var(--acs-border);
	padding-top: 18px;
	font-size: 0.88rem;
}

.acs-screener .acs-provenance ul {
	list-style: none;
	margin: 0 0 12px;
	padding: 0;
}

.acs-screener .acs-provenance li {
	padding: 3px 0;
}

.acs-screener .acs-note {
	color: var(--acs-sub);
	font-style: italic;
	margin: 0;
}

/* ---- hub ---- */

.acs-screener .acs-grid {
	list-style: none;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
}

/* Scoped to .acs-grid. Unscoped, this styled EVERY link inside a result card -
   the college name rendered as a centred bordered box, and the action links
   inherited block layout and 18px padding. .acs-card is used by both the hub
   tiles and the result cards, so the tile styling has to name its container. */
.acs-screener .acs-grid .acs-card a {
	display: block;
	padding: 18px;
	border-radius: 6px;
	font-weight: 600;
	text-align: left;
}

.acs-screener .acs-grid .acs-card {
	border: 1px solid var(--acs-border);
	border-radius: 6px;
	padding: 0;
	background: none;
}

.acs-screener .acs-grid .acs-card:hover {
	border-color: var(--acs-accent);
}

.acs-screener .acs-grid .acs-card a:hover {
	text-decoration: none;
}

/* ---- shortcode embed ---- */

.acs-screener.acs-embed {
	padding: 0;
	max-width: none;
}

.acs-screener .acs-more {
	margin: 4px 0 0;
	font-size: 0.92rem;
}

@media (max-width: 782px) {
	.acs-screener {
		padding: 16px 12px 40px;
		font-size: 15px;
	}

	.acs-screener .acs-h1 {
		font-size: 1.4rem;
	}

	.acs-screener .acs-filters {
		gap: 16px;
	}

	/* Collapse the table into stacked cards rather than forcing a horizontal
	   scroll, since most traffic to district pages is on mobile. */
	.acs-screener .acs-table,
	.acs-screener .acs-table tbody,
	.acs-screener .acs-table tr,
	.acs-screener .acs-table td {
		display: block;
		width: 100%;
	}

	.acs-screener .acs-table thead {
		display: none;
	}

	.acs-screener .acs-table tr {
		border: 1px solid var(--acs-border);
		border-radius: 6px;
		margin-bottom: 12px;
		padding: 6px 4px;
	}

	.acs-screener .acs-table td {
		border-bottom: 0;
		padding: 5px 12px;
	}

	.acs-screener .acs-name {
		max-width: none;
		font-size: 1.02rem;
	}
}

/* ==========================================================================
   Two-column layout: filters left, results right
   ========================================================================== */

.acs-screener .acs-layout {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 28px;
	align-items: start;
	margin: 0 0 28px;
}

.acs-screener .acs-sidebar {
	position: sticky;
	top: 20px;
}

/* The filter rail is a column here, not the horizontal strip it was. */
.acs-screener .acs-sidebar .acs-filters {
	display: block;
	padding: 16px;
	border-radius: 8px;
	background: #fff;
}

.acs-screener .acs-sidebar .acs-facet-group {
	min-width: 0;
	margin: 0 0 20px;
}

.acs-screener .acs-sidebar .acs-textfilter {
	margin: 0;
}

/* ==========================================================================
   Detail page
   ========================================================================== */

.acs-screener.acs-detail {
	max-width: 900px;
}

/* Tabs are hidden radios plus sibling selectors - no JavaScript, so Breeze
   cannot break them and the zero-script rule holds. */
.acs-screener .acs-tabs > input[type="radio"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.acs-screener .acs-tablist {
	display: flex;
	gap: 4px;
	border-bottom: 2px solid var(--acs-border);
	margin: 20px 0 0;
}

.acs-screener .acs-tablist label {
	padding: 10px 18px;
	cursor: pointer;
	font-weight: 600;
	font-size: 0.94rem;
	color: var(--acs-sub);
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
}

.acs-screener .acs-tablist label:hover {
	color: var(--acs-ink);
}

.acs-screener .acs-panel {
	display: none;
	padding: 22px 0 0;
}

#acs-tab-general:checked ~ .acs-tablist label[for="acs-tab-general"],
#acs-tab-courses:checked ~ .acs-tablist label[for="acs-tab-courses"] {
	color: var(--acs-accent);
	border-bottom-color: var(--acs-accent);
}

#acs-tab-general:checked ~ .acs-panel-general,
#acs-tab-courses:checked ~ .acs-panel-courses {
	display: block;
}

/* ---- key/value table ---- */

.acs-screener .acs-kv {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.94rem;
}

.acs-screener .acs-kv th {
	text-align: left;
	width: 190px;
	padding: 9px 14px 9px 0;
	vertical-align: top;
	color: var(--acs-sub);
	font-weight: 600;
	border-bottom: 1px solid var(--acs-border);
}

.acs-screener .acs-kv td {
	padding: 9px 0;
	border-bottom: 1px solid var(--acs-border);
	overflow-wrap: anywhere;
}

/* ---- courses table ---- */

.acs-screener .acs-prog {
	font-size: 1.02rem;
	margin: 22px 0 4px;
}

.acs-screener .acs-level {
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--acs-sub);
	margin: 12px 0 6px;
	font-weight: 600;
}

.acs-screener .acs-courses {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.92rem;
	margin: 0 0 6px;
}

.acs-screener .acs-courses th,
.acs-screener .acs-courses td {
	text-align: left;
	padding: 8px 12px 8px 0;
	border-bottom: 1px solid var(--acs-border);
	vertical-align: top;
}

.acs-screener .acs-courses thead th {
	font-size: 0.74rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--acs-sub);
}

.acs-screener .acs-courses td:nth-child(2) {
	width: 90px;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 860px) {
	.acs-screener .acs-layout {
		grid-template-columns: 1fr;
	}

	.acs-screener .acs-sidebar {
		position: static;
	}

	/* Filters return to a wrapping strip above the results on narrow screens,
	   where a sticky 260px column would eat the viewport. */
	.acs-screener .acs-sidebar .acs-filters {
		display: flex;
		flex-wrap: wrap;
		gap: 18px;
	}

	.acs-screener .acs-sidebar .acs-facet-group {
		flex: 1 1 200px;
	}

	.acs-screener .acs-kv th {
		width: 130px;
	}

	.acs-screener .acs-tablist label {
		padding: 10px 12px;
		font-size: 0.88rem;
	}
}

/* ==========================================================================
   Theme overrides
   ==========================================================================
   Themes commonly style h2/h3 inside post content with a background, border,
   centred text or generous margins. Inside the screener those headings are
   structural (card titles, programme groups), so the decoration is reset
   rather than fought with per-theme tweaks.
   ========================================================================== */

.acs-screener h1,
.acs-screener h2,
.acs-screener h3 {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
	text-align: left;
	text-transform: none;
	box-shadow: none;
}

.acs-screener .acs-card-title {
	background: none;
	padding: 0;
	margin: 0 0 4px;
	text-align: left;
}

.acs-screener .acs-card-title::before,
.acs-screener .acs-card-title::after {
	content: none;
}

/* The results list must not inherit the theme's list bullets or indent. */
.acs-screener .acs-results,
.acs-screener .acs-results > li {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

.acs-screener .acs-results > li::before,
.acs-screener .acs-results > li::marker {
	content: none;
}

/* ==========================================================================
   Top bar: count and search together, above the fold
   ========================================================================== */

.acs-screener .acs-topbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	margin: 0 0 22px;
}

.acs-screener .acs-topbar .acs-counts {
	flex: 1 1 340px;
	margin: 0;
}

.acs-screener .acs-search {
	display: flex;
	gap: 8px;
	width: 100%;
	margin: 0 0 22px;
}

.acs-screener .acs-search input[type="search"] {
	flex: 1;
	padding: 9px 12px;
	border: 1px solid #1a1a2e;
	border-radius: 5px;
	font-size: 0.92rem;
	min-width: 0;
}

.acs-screener .acs-search button {
	padding: 9px 18px;
	background: var(--acs-accent);
	color: #fff;
	border: 0;
	border-radius: 5px;
	cursor: pointer;
	font-size: 0.9rem;
	white-space: nowrap;
}

.acs-screener .acs-search button:hover {
	background: var(--acs-accent-dark);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

@media (max-width: 600px) {
	.acs-screener .acs-search {
		flex: 1 1 100%;
	}

	.acs-screener .acs-num {
		flex-basis: 28px;
		width: 28px;
		height: 28px;
		font-size: 0.76rem;
	}
}

/* ==========================================================================
   Filter rail: collapsible sections
   ==========================================================================
   <details>/<summary> throughout, including the "+N More" overflow, so the
   whole rail opens and closes with no JavaScript at all.
   ========================================================================== */

.acs-screener .acs-facet-group {
	border-bottom: 1px solid var(--acs-border);
	padding: 0 0 12px;
	margin: 0 0 14px;
}

.acs-screener .acs-facet-group:last-child {
	border-bottom: 0;
}

.acs-screener .acs-facet-title {
	list-style: none;
	cursor: pointer;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--acs-ink);
	text-transform: none;
	letter-spacing: 0;
	padding: 8px 0;
	margin: 0 0 4px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.acs-screener .acs-facet-title::-webkit-details-marker {
	display: none;
}

.acs-screener .acs-facet-title::after {
	content: "";
	width: 8px;
	height: 8px;
	border-right: 2px solid var(--acs-sub);
	border-bottom: 2px solid var(--acs-sub);
	transform: rotate(45deg);
	transition: transform .15s ease;
	margin-right: 4px;
}

.acs-screener .acs-facet-group[open] > .acs-facet-title::after {
	transform: rotate(-135deg);
}

.acs-screener .acs-facet-group ul {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: none;
	overflow: visible;
}

.acs-screener .acs-facet-group li {
	margin: 0;
}

.acs-screener .acs-facet-group li a {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	padding: 5px 0;
	font-size: 0.9rem;
	line-height: 1.35;
}

.acs-screener .acs-facet-label {
	flex: 1;
	overflow-wrap: anywhere;
	min-width: 0;
}

.acs-screener .acs-facet-group .acs-n {
	flex: 0 0 auto;
	margin-left: 8px;
	color: var(--acs-sub);
	font-size: 0.82rem;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.acs-screener .acs-facet-more {
	margin: 4px 0 0;
}

.acs-screener .acs-facet-more > summary {
	list-style: none;
	cursor: pointer;
	color: var(--acs-accent);
	font-size: 0.86rem;
	font-weight: 600;
	padding: 4px 0;
}

.acs-screener .acs-facet-more > summary::-webkit-details-marker {
	display: none;
}

.acs-screener .acs-facet-more[open] > summary {
	margin-bottom: 4px;
}

.acs-screener .acs-facet-more[open] > summary::before {
	content: "\2212 ";
}

/* ==========================================================================
   Result cards
   ========================================================================== */

.acs-screener .acs-results {
	list-style: none;
	margin: 0;
	padding: 0;
}

.acs-screener .acs-card {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	border: 1px solid var(--acs-border);
	border-radius: 10px;
	padding: 18px 20px;
	margin: 0 0 14px;
	background: #fff;
	transition: box-shadow .15s ease, border-color .15s ease;
}

.acs-screener .acs-card:hover {
	border-color: #cfdcec;
	box-shadow: 0 2px 10px rgba(15, 27, 45, .06);
}

.acs-screener .acs-num {
	flex: 0 0 32px;
	width: 32px;
	height: 32px;
	/* Nudged down so the circle's centre lines up with the first line of the
	   title rather than sitting above it. */
	margin-top: 1px;
	border-radius: 50%;
	background: var(--acs-panel);
	border: 1px solid var(--acs-border);
	color: var(--acs-sub);
	font-size: 0.82rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	font-variant-numeric: tabular-nums;
}

.acs-screener .acs-card-body {
	flex: 1;
	min-width: 0;
}

.acs-screener .acs-card-title {
	margin: 0 0 6px;
	font-size: 1.05rem;
	line-height: 1.35;
	font-weight: 700;
}

.acs-screener .acs-card-title a {
	color: var(--acs-ink);
}

.acs-screener .acs-card-title a:hover {
	color: var(--acs-accent);
	text-decoration: none;
}

.acs-screener .acs-card-meta {
	margin: 0 0 10px;
	font-size: 0.87rem;
	color: var(--acs-sub);
	display: flex;
	flex-wrap: wrap;
	gap: 6px 22px;
}

.acs-screener .acs-meta-label {
	font-weight: 600;
}

.acs-screener .acs-meta-place::before {
	content: "";
	display: inline-block;
	width: 9px;
	height: 9px;
	margin-right: 6px;
	border-radius: 50% 50% 50% 0;
	transform: rotate(-45deg);
	border: 2px solid var(--acs-sub);
	vertical-align: baseline;
}

.acs-screener .acs-card-foot {
	border-top: 1px solid var(--acs-border);
	padding-top: 10px;
	margin-top: 2px;
}

.acs-screener .acs-card-lead {
	margin: 0 0 4px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--acs-accent);
}

.acs-screener .acs-card-courses {
	margin: 0;
	font-size: 0.87rem;
	color: var(--acs-sub);
}

.acs-screener .acs-card-courses .acs-course {
	display: inline;
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	font-size: inherit;
	white-space: normal;
}

.acs-screener .acs-dot {
	margin: 0 8px;
	color: var(--acs-border);
}

.acs-screener .acs-card-verdict {
	margin: 6px 0 0;
	font-size: 0.86rem;
	font-weight: 600;
}

.acs-screener .acs-card-actions {
	margin: 10px 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 20px;
	font-size: 0.86rem;
}

@media (max-width: 600px) {
	.acs-screener .acs-card {
		padding: 14px;
		gap: 12px;
	}

	.acs-screener .acs-num {
		flex-basis: 30px;
		width: 30px;
		height: 30px;
		font-size: 0.78rem;
	}
}

/* ---- checkbox-styled facet links ----
   Rendered as links, not inputs: each option is a distinct crawlable URL
   (/west-bengal/hooghly/), which checkboxes plus an Apply button would turn
   into an unindexable query string. The control looks like a checkbox and
   behaves like a link. */

/* The box is a flex item, not an absolutely positioned pseudo-element.
   Absolute positioning relied on padding-left holding the text clear, and a
   theme rule resetting that padding slid the label under the box - "West
   Bengal" rendered as "est Bengal". As a flex item it cannot overlap. */
.acs-screener .acs-facet-group li a {
	position: relative;
	padding-left: 0;
}

.acs-screener .acs-facet-group li a::before {
	content: "";
	flex: 0 0 15px;
	width: 15px;
	height: 15px;
	margin-top: 2px;
	border: 1.5px solid #b9c4d2;
	border-radius: 3px;
	background: #fff;
	box-sizing: border-box;
}

.acs-screener .acs-facet-group li a:hover::before {
	border-color: var(--acs-accent);
}

.acs-screener .acs-facet-group li a.acs-current::before {
	background: var(--acs-accent);
	border-color: var(--acs-accent);
}

.acs-screener .acs-facet-group li a.acs-current::after {
	content: "";
	position: absolute;
	left: 5px;
	top: 9px;
	width: 4px;
	height: 8px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.acs-screener .acs-facet-search {
	width: 100%;
	padding: 7px 10px;
	margin: 0 0 8px;
	border: 1px solid var(--acs-border);
	border-radius: 5px;
	font-size: 0.86rem;
}

.acs-screener .acs-facet-group li[hidden] {
	display: none;
}

/* Result-card links must not inherit any tile styling. */
.acs-screener .acs-results .acs-card a {
	display: inline;
	padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
	text-align: left;
}

.acs-screener .acs-results .acs-card .acs-card-title a {
	font-weight: 700;
}

.acs-screener .acs-results .acs-card .acs-card-actions a {
	font-weight: 500;
}

/* ---- active refinement chips ---- */

.acs-screener .acs-active {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 14px;
}

.acs-screener .acs-chip {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--acs-panel);
	border: 1px solid var(--acs-border);
	font-size: 0.84rem;
	color: var(--acs-ink);
}

.acs-screener .acs-chip:hover {
	border-color: var(--acs-accent);
	text-decoration: none;
}

.acs-screener .acs-chip-clear {
	background: none;
	color: var(--acs-sub);
}

/* Intro paragraph: the count sentence and its source line.
   Scoped under .acs-screener like everything else, so a theme's own p/details
   rules cannot reach it and ours cannot leak out. */
/* No max-width. A 68ch measure is easier to read in isolation, but it left
   the right half of the page blank under a full-width count box, which reads
   as unfinished rather than considered. */
.acs-screener .acs-intro {
	margin: 0 0 20px;
}

.acs-screener .acs-intro p {
	margin: 0 0 6px;
	font-size: 0.97rem;
	line-height: 1.6;
	color: var(--acs-ink);
}

.acs-screener .acs-intro .acs-source {
	font-size: 0.82rem;
	color: var(--acs-sub);
	margin: 0;
}

.acs-screener .acs-faq {
	margin: 28px 0 0;
}

.acs-screener .acs-faq h2 {
	font-size: 1.15rem;
	margin: 0 0 10px;
}

.acs-screener .acs-faq details {
	border-bottom: 1px solid var(--acs-border);
	padding: 10px 0;
}

.acs-screener .acs-faq summary {
	cursor: pointer;
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--acs-ink);
}

.acs-screener .acs-faq details p {
	margin: 8px 0 0;
	font-size: 0.92rem;
	line-height: 1.6;
	color: var(--acs-sub);
}

/* ==========================================================================
   Landing hero
   --------------------------------------------------------------------------
   Fonts are declared with fallbacks rather than fetched. Pulling Playfair and
   DM Sans from a CDN would add a render-blocking request to every screener
   page for a headline; where the theme already loads them they apply, and
   Georgia is a perfectly good serif when it does not.
   ========================================================================== */

.acs-screener .acs-hero {
	position: relative;
	margin: 0 0 28px;
	padding: 44px 38px 38px;
	border-radius: 18px;
	overflow: hidden;
	background:
		radial-gradient(circle at 12% 18%, rgba(31, 111, 214, 0.16), transparent 46%),
		radial-gradient(circle at 88% 8%, rgba(21, 154, 90, 0.14), transparent 42%),
		radial-gradient(circle at 62% 96%, rgba(232, 146, 12, 0.12), transparent 48%),
		linear-gradient(160deg, #fbfdff 0%, #f2f7fd 100%);
	border: 1px solid var(--acs-border);
}

.acs-screener .acs-hero-title {
	font-family: "Playfair Display", Georgia, "Times New Roman", serif;
	font-size: clamp(1.9rem, 4vw, 3rem);
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 14px;
	color: var(--acs-ink);
}

.acs-screener .acs-hero-sub {
	font-family: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 1.02rem;
	line-height: 1.65;
	color: var(--acs-sub);
	margin: 0 0 26px;
}

/* ---- stream cards ---- */

.acs-screener .acs-stream-grid {
	list-style: none;
	margin: 0 0 34px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(214px, 1fr));
	gap: 14px;
}

.acs-screener .acs-stream-card a {
	display: flex;
	flex-direction: column;
	gap: 3px;
	height: 100%;
	padding: 18px 18px 16px;
	border-radius: 14px;
	border: 1px solid #1b0d6f;
	background: linear-gradient(264deg, #fff 0%, #ffa10a21 100%);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.acs-screener .acs-stream-card a:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(15, 27, 45, 0.09);
	text-decoration: none;
}

.acs-screener .acs-stream-name {
	font-family: "DM Sans", system-ui, sans-serif;
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--acs-ink);
}

.acs-screener .acs-stream-count {
	font-size: 0.9rem;
	color: var(--acs-sub);
}

.acs-screener .acs-stream-reg {
	margin-top: 6px;
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--acs-accent);
	font-weight: 600;
}


/* ---- source list ---- */

.acs-screener .acs-hero-sources {
	border-top: 1px solid var(--acs-border);
	padding-top: 18px;
}

.acs-screener .acs-hero-sources h2 {
	font-size: 0.95rem;
	margin: 0 0 8px;
	color: var(--acs-ink);
}

.acs-screener .acs-hero-sources ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 26px;
}

.acs-screener .acs-hero-sources li {
	font-size: 0.84rem;
	color: var(--acs-sub);
}

@media (max-width: 600px) {
	.acs-screener .acs-hero {
		padding: 30px 20px 26px;
	}

}

/* Cross-level marker: this college also runs courses at the other level. */
.acs-screener .acs-card-also {
	margin: 4px 0 0;
	font-size: 0.8rem;
	color: var(--acs-sub);
	font-style: italic;
}

/* ==========================================================================
   Charts
   --------------------------------------------------------------------------
   Inline SVG, drawn server-side. The figures also appear as a list in the DOM
   (.acs-chart-data), hidden visually but read by screen readers and by
   anything that does not render SVG - which is why the numbers are never only
   in the drawing.
   ========================================================================== */

.acs-screener .acs-charts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 22px;
	margin: 0 0 26px;
}

.acs-screener .acs-chart {
	margin: 0;
	padding: 16px 18px 14px;
	border: 1px solid #1a1a2e;
	border-radius: 12px;
	background: #fff;
}

.acs-screener .acs-chart-title {
	font-weight: 700;
	font-size: 0.95rem;
	color: var(--acs-ink);
	margin: 0 0 12px;
}

.acs-screener .acs-chart-svg {
	width: 100%;
	height: auto;
	overflow: visible;
}

.acs-screener .acs-chart-bar {
	fill: var(--acs-accent);
	fill-opacity: 0.85;
}

.acs-screener .acs-chart-label {
	font-size: 13.5px;
	fill: var(--acs-ink);
}

.acs-screener .acs-chart-value {
	font-size: 13.5px;
	font-weight: 700;
	fill: var(--acs-ink);
	text-anchor: start;
}

.acs-screener .acs-chart-note {
	margin: 10px 0 0;
	font-size: 0.78rem;
	color: var(--acs-sub);
	line-height: 1.5;
}

/* Present for assistive technology and for crawlers; not shown twice. */
.acs-screener .acs-chart-data {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   Collapsing on small screens
   --------------------------------------------------------------------------
   The charts and the filter panel are CLOSED <details> in the markup, because
   `open` is an HTML attribute and no media query can set it. Above 861px they
   are forced open here.
   
   Two overrides are needed, not one. Older browsers hide a closed details'
   children with display:none; current Chrome hides them with
   content-visibility on the ::details-content pseudo-element, which a display
   rule cannot reach. An earlier version set only the display rule AND hid the
   summary on desktop, so when the override missed, the charts disappeared with
   no control left to open them. The summary is never hidden now - if an
   override ever fails again the content is still one click away.
   ========================================================================== */

.acs-screener .acs-charts-wrap,
.acs-screener .acs-filter-wrap {
	margin: 0 0 22px;
	border: 1px solid var(--acs-border);
	border-radius: 12px;
	background: var(--acs-panel);
}

.acs-screener .acs-charts-toggle,
.acs-screener .acs-filter-toggle {
	cursor: pointer;
	padding: 13px 16px;
	font-weight: 700;
	font-size: 0.95rem;
	color: var(--acs-ink);
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.acs-screener .acs-charts-toggle::-webkit-details-marker,
.acs-screener .acs-filter-toggle::-webkit-details-marker {
	display: none;
}

.acs-screener .acs-charts-toggle::after,
.acs-screener .acs-filter-toggle::after {
	content: "⌄";
	font-size: 1.1rem;
	line-height: 1;
	color: var(--acs-sub);
}

.acs-screener .acs-charts-wrap[open] .acs-charts-toggle::after,
.acs-screener .acs-filter-wrap[open] .acs-filter-toggle::after {
	content: "⌃";
}

.acs-screener .acs-charts-wrap[open] .acs-charts-toggle,
.acs-screener .acs-filter-wrap[open] .acs-filter-toggle {
	border-bottom: 1px solid var(--acs-border);
}

.acs-screener .acs-charts-wrap .acs-charts {
	padding: 16px;
}

.acs-screener .acs-filter-body {
	padding: 4px 14px 14px;
}

@media (min-width: 861px) {
	/* Both mechanisms, so neither browser generation hides the content. */
	.acs-screener .acs-charts-wrap::details-content,
	.acs-screener .acs-filter-wrap::details-content {
		content-visibility: visible !important;
		block-size: auto !important;
	}

	.acs-screener .acs-charts-wrap > *:not(summary),
	.acs-screener .acs-filter-wrap > *:not(summary) {
		display: block !important;
	}

	.acs-screener .acs-charts-wrap > .acs-charts {
		display: grid !important;
		padding: 0;
	}

	/* No panel chrome on desktop, and the toggle collapses to nothing - but it
	   is still in the layout, so a failed override cannot strand the content. */
	.acs-screener .acs-charts-wrap,
	.acs-screener .acs-filter-wrap {
		border: 0;
		background: none;
		margin-bottom: 0;
	}

	.acs-screener .acs-charts-toggle,
	.acs-screener .acs-filter-toggle {
		padding: 0;
		height: 0;
		overflow: hidden;
		border: 0 !important;
	}

	.acs-screener .acs-filter-body {
		padding: 0;
	}
}

/* The earlier year, drawn behind the current one in the paired branch chart. */
.acs-screener .acs-chart-bar-prev {
	fill: var(--acs-sub);
	fill-opacity: 0.32;
}