/*
 * The English Lab — site footer
 *
 * Unlike tokens.css/components.css, this is NOT scoped to
 * body.tutor-frontend — footer.php is Tutor Starter's own native
 * template and renders on every page, including the Elementor-built
 * marketing pages, so it needs its own always-on token scope.
 *
 * Deliberately always-dark regardless of page light/dark mode (a fixed
 * dark footer band is a common, tasteful anchor across mixed-brightness
 * pages) — reconsider if that reads wrong once live.
 *
 * Real structure verified live: two template parts render back-to-back —
 * <section class="footer-widgets"> (logo/blurb + 3 nav-menu widget
 * columns) followed by <footer id="colophon"> (social icons, secondary
 * menu, copyright bar). views/partials/footer/footer_four.php +
 * footer.php in the parent theme.
 */

footer#colophon,
body .footer-widgets {
	--tel-cobalt: #4a90e2;
	--tel-accent: #8b86f0;
	--tel-bg: #1a202c;
	--tel-ink: #f5f7fa;
	--tel-ink-soft: rgb(245 247 250 / 66%);
	--tel-ink-faint: rgb(245 247 250 / 32%);
	--tel-rule: rgb(245 247 250 / 14%);
	--tel-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--tel-font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

	background-color: var(--tel-bg);
	font-family: var(--tel-font-body);
}

/* Even at higher specificity than Tutor Starter's own footer rules,
   plain (non-!important) declarations here haven't reliably landed on
   this site in practice — same empirically-observed pattern as the
   footer background, SVG icon sizing, back button, and dashboard stat
   titles elsewhere in this theme. !important throughout this file
   rather than re-diagnosing the exact cascade quirk each time. */
body .footer-widgets {
	padding-block: 56px !important;
	margin-top: 48px !important;
}

/* body-prefixed: the parent theme's own footer CSS (style.min.css,
   customizer-driven --widget-title-* / --footer-widget-* vars) ties our
   plain-class selectors on specificity, and its stylesheet ends up
   positioned after ours in the cascade regardless of our enqueue order
   (Tutor Starter defers/async-loads its own stylesheet — see
   Enqueue.php's load_styles_deferred). */
body .footer-widgets .widget-title {
	font-family: var(--tel-font-mono) !important;
	font-size: 11px !important;
	font-weight: 500 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: var(--tel-ink-faint) !important;
	margin-bottom: 16px !important;
}

body .footer-widgets p,
body .footer-widgets .menu a {
	color: var(--tel-ink-soft) !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
}

body .footer-widgets .menu {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

body .footer-widgets .menu a {
	text-decoration: none;
	transition: color 0.15s ease;
}

body .footer-widgets .menu a:hover {
	color: var(--tel-cobalt);
}

footer#colophon {
	border-top: 1px solid var(--tel-rule);
	padding-block: 20px;
}

footer#colophon .copyright,
footer#colophon .footer-menu a {
	color: var(--tel-ink-faint);
	font-size: 13px;
}

footer#colophon .footer-menu a {
	text-decoration: none;
}

footer#colophon .footer-menu a:hover {
	color: var(--tel-cobalt);
}