/* =====================================================================
   creditcorp.co.uk — glossary.css
   Scoped styling for the /glossary/ page. Loaded per-page via
   $GLOBALS['ccuk_extra_head'] (same pattern as calc.css on tools pages)
   so it never touches the shared style.css. Reuses the site's teal
   design tokens (--teal, --teal-deep, --gray-*). CSP-safe: classes only,
   no inline styles.
   ===================================================================== */

/* A–Z jump bar */
.gloss-az {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 8px;
	padding: 0;
	list-style: none;
}
.gloss-az__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	padding: 8px 10px;
	border: 1px solid var(--gray-200, #e5e7eb);
	border-radius: 10px;
	background: #fff;
	color: var(--teal-deep, #0c5052);
	font-weight: 700;
	font-size: 0.95rem;
	line-height: 1;
	text-decoration: none;
	transition: background .15s ease, border-color .15s ease, color .15s ease, transform .05s ease;
}
.gloss-az__link:hover,
.gloss-az__link:focus-visible {
	background: var(--teal, #11676a);
	border-color: var(--teal, #11676a);
	color: #fff;
}
.gloss-az__link[aria-disabled="true"] {
	opacity: .38;
	pointer-events: none;
}

/* Alphabet group heading */
.gloss-group {
	margin-top: 40px;
}
.gloss-group__letter {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0 0 14px;
	border-radius: 12px;
	background: var(--teal, #11676a);
	color: #fff;
	font-size: 1.35rem;
	font-weight: 800;
	line-height: 1;
	scroll-margin-top: 96px;
}

/* Definition list */
.gloss-list {
	margin: 0;
	padding: 0;
}
.gloss-item {
	padding: 20px 0;
	border-top: 1px solid var(--gray-200, #e5e7eb);
	scroll-margin-top: 96px;
}
.gloss-item:first-child {
	border-top: 0;
}
.gloss-item__term {
	margin: 0 0 8px;
	font-size: 1.14rem;
	font-weight: 800;
	color: var(--ink, #14181b);
	letter-spacing: -0.01em;
}
.gloss-item__def {
	margin: 0;
	color: var(--gray-700, #374151);
	line-height: 1.62;
}
.gloss-item__def a {
	color: var(--teal-deep, #0c5052);
	font-weight: 600;
}
.gloss-item__meta {
	margin: 10px 0 0;
	font-size: 0.9rem;
}
.gloss-item__meta a {
	display: inline-block;
	color: var(--teal-deep, #0c5052);
	font-weight: 700;
	text-decoration: none;
	border-bottom: 2px solid var(--teal-light, #4dd4d8);
	padding-bottom: 1px;
}
.gloss-item__meta a:hover,
.gloss-item__meta a:focus-visible {
	border-bottom-color: var(--teal, #11676a);
}

/* Intro count strip */
.gloss-count {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 6px;
	padding: 7px 14px;
	border-radius: 999px;
	background: var(--teal-wash, #eef7f7);
	color: var(--teal-deep, #0c5052);
	font-weight: 700;
	font-size: 0.92rem;
}
.gloss-count .dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--teal, #11676a);
}

@media (max-width: 480px) {
	.gloss-az__link { min-width: 34px; padding: 7px 8px; font-size: 0.88rem; }
	.gloss-group__letter { width: 38px; height: 38px; font-size: 1.15rem; }
}