/*
 * Footer — observatorio-cero-theme
 * Styles for the site footer: inverse/dark surface, gradient top border,
 * navigation columns, social links and bottom bar.
 *
 * All colors reference design tokens via CSS custom properties
 * (var(--wp--preset--color--*)). No hardcoded colors.
 */

/* ── Footer Base ── */
.site-footer {
	--_muted: color-mix(in srgb, var(--wp--preset--color--inverse-on-surface) var(--wp--custom--blend--muted), transparent);
	--_border: color-mix(in srgb, var(--wp--preset--color--inverse-on-surface) var(--wp--custom--blend--hairline), transparent);
	--_hover-bg: color-mix(in srgb, var(--wp--preset--color--inverse-on-surface) var(--wp--custom--blend--hover), transparent);
	--_icon-color: var(--wp--preset--color--surface-variant);
	--_icon-hover: var(--wp--preset--color--primary-fixed);

	color: var(--wp--preset--color--inverse-on-surface);
	margin-top: var(--wp--preset--spacing--60);
	transition: background-color var(--wp--custom--mode-transitions--duration) var(--wp--custom--mode-transitions--timing), color var(--wp--custom--mode-transitions--duration) var(--wp--custom--mode-transitions--timing);
	background: linear-gradient(135deg, var(--wp--preset--color--inverse-surface) 0%, color-mix(in srgb, var(--wp--preset--color--inverse-surface) var(--wp--custom--blend--gradient), var(--wp--preset--color--inverse-on-surface)) 100%);
}

/* Dark/HC: footer uses surface-container gradient + on-background text.
 * Scoped variables remap to mode-appropriate tokens.
 * Exception justified: footer uses an inverted surface concept that
 * requires different token families per mode (inverse-* in light, surface-container-* in dark). */
[data-theme="dark"] .site-footer,
[data-theme="high-contrast"] .site-footer {
	--_muted: color-mix(in srgb, var(--wp--preset--color--on-background) var(--wp--custom--blend--muted), transparent);
	--_border: color-mix(in srgb, var(--wp--preset--color--on-background) var(--wp--custom--blend--hairline), transparent);
	--_hover-bg: color-mix(in srgb, var(--wp--preset--color--on-background) var(--wp--custom--blend--hover), transparent);

	color: var(--wp--preset--color--on-background);
	background: linear-gradient(135deg, var(--wp--preset--color--surface-container-low) 0%, var(--wp--preset--color--surface-container-highest) 100%);
}

[data-theme="dark"] .site-footer {
	--_icon-color: var(--wp--preset--color--primary-fixed);
	--_icon-hover: var(--wp--preset--color--primary);
}

[data-theme="high-contrast"] .site-footer {
	--_icon-color: var(--wp--preset--color--primary);
	--_icon-hover: var(--wp--preset--color--secondary);
}

.site-footer a {
	color: inherit;
	text-decoration: none;
}

/* ── Top Gradient Border ── */
.site-footer__top-border {
	height: var(--wp--custom--site-footer--top-border-height);
	width: 100%;
	background: linear-gradient(to right, var(--wp--preset--color--primary), transparent);
}

/* ── Inner Container ── */
.site-footer__inner {
	max-width: var(--wp--style--global--wide-size);
	margin: 0 auto;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

/* ── Grid ── */
.site-footer__grid {
	gap: var(--wp--preset--spacing--50);
}

.site-footer__grid>.wp-block-column {
	min-width: 0;
}

/* ── Brand Column ── */
.site-footer__grid .site-footer__brand {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: fit-content;
	margin-block-start: calc(-1 * (var(--wp--preset--spacing--60) - var(--wp--preset--spacing--20)));
	margin-top: calc(-1 * (var(--wp--preset--spacing--60) - var(--wp--preset--spacing--20)));
	gap: var(--wp--preset--spacing--20);
	margin-bottom: var(--wp--preset--spacing--40);
}

.site-footer__brand .site-logo-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.site-footer__brand .site-logo__img {
	width: var(--wp--custom--site-footer--logo-size);
	height: var(--wp--custom--site-footer--logo-size);
}

.site-footer__brand .wp-block-site-title {
	font-size: var(--wp--preset--font-size--headline-md);
	font-weight: var(--wp--custom--typography--font-weight--display-lg);
	line-height: var(--wp--custom--typography--line-height--display-md);
	color: inherit;
}

.site-footer__brand .wp-block-site-title a {
	color: inherit;
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	margin: calc(-1 * var(--wp--preset--spacing--10)) calc(-1 * var(--wp--preset--spacing--20));
	border-radius: var(--wp--custom--border-radius--default);
	transition: background-color var(--wp--custom--ui--interaction--fast), color var(--wp--custom--ui--interaction--fast), transform var(--wp--custom--ui--interaction--medium);
	transform: scale(1);
}

.site-footer__brand .wp-block-site-title a:hover {
	background-color: var(--_hover-bg);
	color: var(--wp--preset--color--primary-fixed);
	transform: scale(var(--wp--custom--ui--scale--text));
}

.site-footer__acronym {
	font-size: var(--wp--preset--font-size--label-sm);
	font-weight: var(--wp--custom--typography--font-weight--label-sm);
	letter-spacing: var(--wp--custom--typography--letter-spacing--label-sm);
	text-transform: uppercase;
	color: var(--wp--preset--color--primary-fixed);
	border-left: var(--wp--custom--ui--border-width--standard) solid var(--wp--preset--color--primary-fixed);
	padding-left: var(--wp--preset--spacing--40);
}

.site-footer__description {
	color: var(--_muted);
	line-height: var(--wp--custom--typography--line-height--body-md);
}

/* ── Section Headings ── */
.site-footer__heading {
	font-size: var(--wp--preset--font-size--label-sm);
	font-weight: var(--wp--custom--typography--font-weight--label-sm);
	letter-spacing: var(--wp--custom--typography--letter-spacing--label-sm);
	text-transform: uppercase;
	color: var(--_muted);
	margin-bottom: var(--wp--preset--spacing--40);
}

/* ── Navigation Columns ── */
.site-footer__nav .wp-block-navigation__container {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
}

.site-footer__nav .wp-block-navigation-item__content {
	color: inherit;
	font-size: var(--wp--preset--font-size--body-md);
	line-height: var(--wp--custom--typography--line-height--ui);
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
	border-radius: var(--wp--custom--border-radius--default);
	transition: background-color var(--wp--custom--ui--interaction--fast), color var(--wp--custom--ui--interaction--fast), transform var(--wp--custom--ui--interaction--medium);
	transform: scale(1);
}

.site-footer__nav .wp-block-navigation-item__content:hover {
	background-color: var(--_hover-bg);
	color: var(--wp--preset--color--primary-fixed);
	transform: scale(var(--wp--custom--ui--scale--text));
}

.site-footer__nav .wp-block-navigation-item--active>.wp-block-navigation-item__content {
	color: var(--wp--preset--color--primary-fixed);
}

/* ── Social Column ── */
.site-footer__social-icons {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
}

.site-footer__social-links {
	display: flex;
	flex-direction: row;
	gap: var(--wp--preset--spacing--30);
	margin: 0;
	padding: 0;
}

.site-footer ul.wp-block-social-links.site-footer__social-links {
	gap: var(--wp--preset--spacing--30);
}

.site-footer .site-footer__social-links .wp-block-social-link {
	border-radius: var(--wp--custom--border-radius--default);
	color: var(--_icon-color);
	transition: color var(--wp--custom--ui--interaction--fast), transform var(--wp--custom--ui--interaction--medium);
}

.site-footer .site-footer__social-links .wp-block-social-link:hover,
.site-footer .site-footer__social-links .wp-block-social-link:focus-within {
	color: var(--_icon-hover);
}

.site-footer .site-footer__social-links .wp-block-social-link-anchor {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--wp--custom--site-footer--social-icon-size);
	height: var(--wp--custom--site-footer--social-icon-size);
	padding: 0;
	border-radius: var(--wp--custom--border-radius--default);
	background-color: transparent;
	color: inherit;
	transition: background-color var(--wp--custom--ui--interaction--fast), color var(--wp--custom--ui--interaction--fast), transform var(--wp--custom--ui--interaction--medium);
	transform: scale(1);
	position: relative;
	cursor: pointer;
}

.site-footer .site-footer__social-links .wp-block-social-link-anchor:hover,
.site-footer .site-footer__social-links .wp-block-social-link-anchor:focus {
	background-color: transparent;
	color: inherit;
	transform: scale(var(--wp--custom--ui--scale--icon));
	outline: none;
}

.site-footer .site-footer__social-links .wp-block-social-link svg {
	width: var(--wp--custom--ui--control-size--mobile);
	height: var(--wp--custom--ui--control-size--mobile);
	color: inherit;
}

/* Forzar fill en todos los iconos (incluido X y LinkedIn) para heredar el color en todos los modos */
.site-footer .site-footer__social-links.is-style-logos-only .wp-block-social-link svg,
.site-footer .site-footer__social-links.is-style-logos-only .wp-block-social-link svg path,
.site-footer .site-footer__social-links.is-style-logos-only .wp-block-social-link svg * {
	fill: currentColor;
	color: inherit;
}


/* ── Bottom Bar ── */
.site-footer__bottom-bar {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	margin-top: var(--wp--preset--spacing--60);
	padding-top: var(--wp--preset--spacing--50);
	border-top: var(--wp--custom--ui--decoration--border) solid var(--_border);
}

.site-footer__copyright {
	color: var(--_muted);
	font-size: var(--wp--preset--font-size--label-sm);
	text-align: center;
	margin: 0;
}

.site-footer__legal-separator {
	width: var(--wp--preset--spacing--20);
	height: var(--wp--preset--spacing--20);
	border-radius: var(--wp--custom--border-radius--full);
	background-color: var(--_muted);
}

/* ── Responsive ── */
@media (min-width: 600px) {
	.site-footer__bottom-bar {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}

	.site-footer__copyright {
		text-align: left;
		margin: 0;
	}

	.site-footer__social-icons {
		justify-content: flex-end;
	}
}

@media (min-width: 1024px) {
	.site-footer__grid {
		gap: var(--wp--preset--spacing--60);
	}

	.site-footer__inner {
		padding-top: var(--wp--preset--spacing--70);
		padding-bottom: var(--wp--preset--spacing--70);
	}
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {

	.site-footer,
	.site-footer__nav .wp-block-navigation-item__content,
	.site-footer__social-links .wp-block-social-link-anchor,
	.site-footer__brand .wp-block-site-title a {
		transition: none !important;
		transform: none !important;
	}
}