/**
 * Styles for the [fitrx_site_footer] shortcode.
 *
 * Everything is scoped under .fitrx-site-footer so this can be dropped into
 * an existing Elementor-built page (via the Shortcode widget in the Footer
 * theme template) without leaking into or being overridden by the site's
 * own global styles. Colors match the FitRx brand palette already used by
 * the hero-banner block (ink #181818, accent red #CE0E2D, pink #FFBDC8).
 * 'Anton' is the same display font used site-wide for headings, expected to
 * load from the theme — this file only enqueues 'Manrope' for body copy.
 */

.fitrx-site-footer,
.fitrx-site-footer *,
.fitrx-site-footer *::before,
.fitrx-site-footer *::after {
	box-sizing: border-box;
}

.fitrx-site-footer {
	--ink-3: #0d0d0d;
	--red: #ce0e2d;
	--pink: #ffbdc8;
	--line: rgba(255, 255, 255, 0.12);
	--line-soft: rgba(255, 255, 255, 0.07);
	--ink-soft: rgba(255, 255, 255, 0.68);
	--ink-softer: rgba(255, 255, 255, 0.42);

	position: relative;
	width: 100%;
	overflow: hidden;
	background: var(--ink-3);
	border-top: 1px solid var(--line-soft);
	color: #fff;
	font-family: 'Manrope', -apple-system, sans-serif;
	-webkit-font-smoothing: antialiased;
}

.fitrx-site-footer a {
	color: inherit;
	text-decoration: none;
}
.fitrx-site-footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.fitrx-site-footer :focus-visible {
	outline: 2px solid var(--pink);
	outline-offset: 3px;
}

.fitrx-site-footer .footer-blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(90px);
	pointer-events: none;
}
.fitrx-site-footer .footer-blob--a { width: 460px; height: 460px; background: var(--red); opacity: 0.16; top: -160px; left: -120px; }
.fitrx-site-footer .footer-blob--b { width: 340px; height: 340px; background: var(--pink); opacity: 0.08; bottom: -140px; right: 6%; }

.fitrx-site-footer .footer-watermark {
	position: absolute;
	left: 50%;
	bottom: -6%;
	transform: translateX(-50%);
	font-family: 'Anton', sans-serif;
	font-size: min(22vw, 340px);
	line-height: 1;
	color: rgba(255, 255, 255, 0.025);
	white-space: nowrap;
	user-select: none;
	pointer-events: none;
	z-index: 0;
}

.fitrx-site-footer .footer-inner {
	position: relative;
	z-index: 1;
	max-width: 1520px;
	margin: 0 auto;
	padding: 20px;
}

.fitrx-site-footer .footer-grid {
	display: grid;
	/* Products carries 8 links vs. 2 apiece for Support/Company — a straight
	   4-up split left two columns short and stranded next to one tall one.
	   Support + Company now share a column (see .footer-col-group) so the
	   three columns read as roughly even blocks instead of lopsided. */
	grid-template-columns: 1.3fr 1.1fr 1fr;
	gap: 32px;
	padding: 0 0 56px;
}

.fitrx-site-footer .footer-col-group {
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.fitrx-site-footer .logo-img {
	display: block;
	height: 26px;
	width: auto;
}

.fitrx-site-footer .footer-brand p {
	margin: 18px 0 24px;
	color: var(--ink-soft);
	font-size: 14px;
	line-height: 1.7;
	max-width: 260px;
}

.fitrx-site-footer .footer-social { display: flex; gap: 10px; }
.fitrx-site-footer .social-btn {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid var(--line);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--ink-soft);
	transition: border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.fitrx-site-footer .social-btn:hover { border-color: var(--red); color: #fff; transform: translateY(-2px); }

.fitrx-site-footer .footer-walmart-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 20px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.3px;
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: var(--red);
	transition: color 0.15s ease;
}
.fitrx-site-footer .footer-walmart-link:hover { color: var(--pink); }

.fitrx-site-footer .footer-col-title {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1.6px;
	text-transform: uppercase;
	color: var(--ink-softer);
	margin: 0 0 20px;
	list-style: none; /* suppress Firefox's native <summary> marker */
	cursor: default;
	pointer-events: none; /* desktop: not an accordion — a <summary> click always toggles <details> natively, so this is what actually stops that, not just the cursor */
}
.fitrx-site-footer .footer-col-title::-webkit-details-marker { display: none; }
.fitrx-site-footer .footer-col-title .chev { display: none; } /* only meaningful once the column becomes a tap-to-expand accordion, below 900px */

.fitrx-site-footer .footer-col ul li + li { margin-top: 13px; }
.fitrx-site-footer .footer-col a {
	font-size: 14.5px;
	color: var(--ink-soft);
	transition: color 0.15s ease;
}
.fitrx-site-footer .footer-col a:hover { color: #fff; }

.fitrx-site-footer .footer-bottom {
	position: relative;
	z-index: 1;
	max-width: 1520px;
	margin: 0 auto;
	padding: 26px 20px 30px;
	border-top: 1px solid var(--line-soft);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
}
.fitrx-site-footer .footer-legal { display: flex; gap: 22px; flex-wrap: wrap; }
.fitrx-site-footer .footer-legal a,
.fitrx-site-footer .footer-copy { font-size: 12.5px; color: var(--ink-softer); }

@media (max-width: 900px) {
	.fitrx-site-footer .footer-grid { grid-template-columns: 1fr; padding: 0 0 8px; gap: 4px; }
	.fitrx-site-footer .footer-brand { padding-bottom: 32px; margin-bottom: 8px; border-bottom: 1px solid var(--line-soft); }
	.fitrx-site-footer .footer-col { border-bottom: 1px solid var(--line-soft); }
	.fitrx-site-footer .footer-col-title { margin: 0; padding: 20px 0; justify-content: space-between; cursor: pointer; pointer-events: auto; }
	.fitrx-site-footer .footer-col-title .chev { display: inline-block; transition: transform 0.25s ease; opacity: 0.7; }
	.fitrx-site-footer details[open] .footer-col-title .chev { transform: rotate(180deg); }
	.fitrx-site-footer .footer-col ul { padding-bottom: 22px; }
	.fitrx-site-footer .footer-bottom { flex-direction: column; align-items: flex-start; }
	.fitrx-site-footer .footer-watermark { font-size: 28vw; }
}