/* ==========================================================================
   By-Homefeed — feed footer
   Every By-legal document as a visible link, centred and wrapping, closing
   with the brand mark and the copyright line.
   ========================================================================== */

.hf-footer {
	display: flex;
	flex-direction: column;
	/* In the rail this sits under a hairline with the rest of the column, so it
	   aligns to the same edge instead of centring against nothing. */
	align-items: flex-start;
	gap: 10px;
	padding: 0;
	color: var(--feed-soft, #a5a39c);
	font-size: 12px;
	line-height: 1.6;
	letter-spacing: normal;
	text-align: start;
}

.hf-footer__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 8px 14px;
}

.hf-footer__link {
	color: inherit;
	font-size: 12px;
	text-decoration: none;
	text-wrap: balance;
}

.hf-footer__link:hover,
.hf-footer__link:focus-visible {
	color: #0e0e10;
	text-decoration: underline;
}

/* ── "المزيد" disclosure ─────────────────────────────────────────────────── */

.hf-footer__more > summary {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	list-style: none;
	cursor: pointer;
}

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

.hf-footer__more summary svg {
	inline-size: 12px;
	block-size: 12px;
	flex: 0 0 auto;
	transition: transform .2s cubic-bezier(.2, .7, .2, 1);
}

.hf-footer__more[open] summary svg {
	transform: rotate(180deg);
}

/* Open: the disclosure claims its own line so the links above keep their place. */
.hf-footer__more[open] {
	flex: 0 0 100%;
}

.hf-footer__rest {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 8px 14px;
	margin-block-start: 8px;
}

.hf-footer__copy {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 8px;
	margin: 4px 0 0;
	font-size: 12px;
	color: inherit;
}

.hf-footer__mark {
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--ink, #0b3b2e);
}

.hf-footer :focus-visible {
	outline: none;
	border-radius: 6px;
	box-shadow: 0 0 0 2px var(--accent, #567307);
}
