/**
 * Footer accordion — uses core/details (native disclosure, light JS).
 *
 * Markup: parts/footer.html nests four core/details blocks
 * (`.footer-acc-item`) inside a `.footer-accordion` group in the right
 * column. Every item is CLOSED by default so mobile lands collapsed
 * with no flash.
 *
 * Mobile (<768px): items stack and toggle natively via <details>;
 * assets/js/footer-accordion.js enforces one-open-at-a-time.
 * Desktop (≥768px): items lay out as a 4-column flex row, JS opens
 * them all (with a ::details-content CSS fallback for no-JS), the
 * summary is neutralized (cursor + pointer-events) and the disclosure
 * indicator is hidden so the column feels like static navigation.
 *
 * Spec: specs/parts/footer.spec.json (mobile accordion polish)
 */

/* ---------- Reset details chrome inside the footer ---------- */

.site-footer .footer-accordion {
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
}

.site-footer details.footer-acc-item {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
}

.site-footer .footer-acc-item > summary {
	background: transparent;
	border: 0;
	color: var(--wp--preset--color--text-body-tinted);
	font-family: var(--wp--preset--font-family--dm-sans);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	line-height: 26px;
	padding: 0;
	width: 100%;
	text-align: left;
	list-style: none;
}

/* Hide the native disclosure marker (all breakpoints — the mobile
 * chevron below is our own). */
.site-footer .footer-acc-item > summary::marker {
	content: '';
}

.site-footer .footer-acc-item > summary::-webkit-details-marker {
	display: none;
}

.site-footer .footer-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
    width: 100%;
}

.site-footer .footer-list li {
	margin: 0;
	list-style: none;
	line-height: 21.7px;
}

.site-footer .footer-list a {
	color: var(--wp--preset--color--text-form, #2a2e3a) !important;
	font-size: 14px !important;
	line-height: 21.7px !important;
	letter-spacing: -0.08px;
	text-decoration: none;
}

.site-footer .footer-list a:hover {
	color: var(--wp--preset--color--primary-red) !important;
	text-decoration: none;
}

/* Services column spans two link lists on desktop */
.site-footer .footer-services-lists {
	gap: var(--wp--preset--spacing--large, 2rem);
}

/* ---------- Mobile: stack columns; native accordion behavior ---------- */

@media (max-width: 767px) {
	.site-footer .footer-columns.wp-block-columns {
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--medium, 1rem) 0 !important;
	}

	.site-footer .footer-brand.wp-block-column,
	.site-footer .footer-links-col.wp-block-column {
		flex-basis: 100% !important;
		width: 100%;
	}

	/* Stack the two Services lists on mobile */
	.site-footer .footer-services-lists {
		flex-direction: column;
		gap: 1rem;
	}

	.site-footer .footer-acc-item {
		border-top: 1px solid rgba(20, 32, 26, 0.12);
	}

	.site-footer .footer-acc-item:last-child {
		/*border-bottom: 1px solid rgba(20, 32, 26, 0.12);*/
        border-bottom: 0;
	}

	.site-footer .footer-acc-item > summary {
		padding: var(--wp--preset--spacing--small, 0.75rem) 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: var(--wp--preset--spacing--x-small, 0.5rem);
		cursor: pointer;
	}

	/* Chevron — mobile only */
	.site-footer .footer-acc-item > summary::after {
		content: '';
		flex: 0 0 auto;
		width: 10px;
		height: 10px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg) translateY(-2px);
		transition: transform 200ms ease;
	}

	.site-footer .footer-acc-item[open] > summary::after {
		transform: rotate(-135deg) translateY(2px);
	}

	.site-footer .footer-acc-item > :not(summary) {
		padding-bottom: 1rem;
	}
}

/* ---------- Desktop: 4-column flex; neutralize summary ---------- */

@media (min-width: 768px) {
	.site-footer .footer-accordion {
		display: flex;
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--large, 2rem);
	}

	.site-footer .footer-acc-item {
		flex: 1 1 0;
		min-width: 0;
	}

	/* Services holds two link lists, so give it twice the width */
	.site-footer .footer-acc-services {
		flex: 2 1 0;
	}

	.site-footer .footer-services-lists {
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-start;
	}

	.site-footer .footer-services-lists > .footer-list {
		flex: 1 1 0;
		min-width: 0;
	}

	/* No-JS / pre-JS fallback: items ship closed in the markup, so
	 * force-reveal the panel content at desktop. Supported in all
	 * evergreen browsers; JS setting `open` covers the rest. */
	.site-footer .footer-acc-item::details-content {
		content-visibility: visible;
	}

	.site-footer .footer-acc-item > summary {
		padding-bottom: 14px;
		margin-bottom: 24px;
		border-bottom: 1px solid var(--wp--preset--color--border-subtle);
		cursor: default;
		pointer-events: none;
	}

	.site-footer .footer-acc-item > summary:focus-visible {
		outline: none;
	}
}
