/* =========================================================
   AFFINA — SAFE ADAPTIVE TRANSPARENT HEADER v0.14.1
   Header remains transparent. Only foreground colour changes.
   ========================================================= */

:root {
	--affina-header-fg-light: #f5f1e8;
	--affina-header-fg-dark: #171714;
	--affina-header-switch-speed: 220ms;
}

.affina-adaptive-header-active {
	background: transparent !important;
	transition:
		color var(--affina-header-switch-speed) ease,
		border-color var(--affina-header-switch-speed) ease !important;
}

.affina-adaptive-header-active a,
.affina-adaptive-header-active button,
.affina-adaptive-header-active .wd-tools-text,
.affina-adaptive-header-active .wd-tools-icon,
.affina-adaptive-header-active .menu-opener,
.affina-adaptive-header-active .nav-link-text,
.affina-adaptive-header-active .wd-nav-link,
.affina-adaptive-header-active svg,
.affina-adaptive-header-active img {
	transition:
		color var(--affina-header-switch-speed) ease,
		fill var(--affina-header-switch-speed) ease,
		stroke var(--affina-header-switch-speed) ease,
		filter var(--affina-header-switch-speed) ease,
		border-color var(--affina-header-switch-speed) ease,
		opacity var(--affina-header-switch-speed) ease !important;
}

/* WHITE foreground — dark backgrounds / photography */
.affina-adaptive-header-active.affina-header-fg-light,
.affina-adaptive-header-active.affina-header-fg-light a,
.affina-adaptive-header-active.affina-header-fg-light button,
.affina-adaptive-header-active.affina-header-fg-light .wd-tools-text,
.affina-adaptive-header-active.affina-header-fg-light .wd-tools-icon,
.affina-adaptive-header-active.affina-header-fg-light .menu-opener,
.affina-adaptive-header-active.affina-header-fg-light .nav-link-text,
.affina-adaptive-header-active.affina-header-fg-light .wd-nav-link {
	color: var(--affina-header-fg-light) !important;
	border-color: rgba(245, 241, 232, .28) !important;
}

/* DARK foreground — cream / paper / bright backgrounds */
.affina-adaptive-header-active.affina-header-fg-dark,
.affina-adaptive-header-active.affina-header-fg-dark a,
.affina-adaptive-header-active.affina-header-fg-dark button,
.affina-adaptive-header-active.affina-header-fg-dark .wd-tools-text,
.affina-adaptive-header-active.affina-header-fg-dark .wd-tools-icon,
.affina-adaptive-header-active.affina-header-fg-dark .menu-opener,
.affina-adaptive-header-active.affina-header-fg-dark .nav-link-text,
.affina-adaptive-header-active.affina-header-fg-dark .wd-nav-link {
	color: var(--affina-header-fg-dark) !important;
	border-color: rgba(23, 23, 20, .22) !important;
}

/* WoodMart external monochrome SVG/PNG logo */
.affina-adaptive-header-active.affina-header-fg-light .site-logo img,
.affina-adaptive-header-active.affina-header-fg-light .wd-logo img,
.affina-adaptive-header-active.affina-header-fg-light .wd-header-logo img {
	filter: brightness(0) invert(1) !important;
}

.affina-adaptive-header-active.affina-header-fg-dark .site-logo img,
.affina-adaptive-header-active.affina-header-fg-dark .wd-logo img,
.affina-adaptive-header-active.affina-header-fg-dark .wd-header-logo img {
	filter: brightness(0) !important;
}

/* Inline SVG with currentColor */
.affina-adaptive-header-active.affina-header-fg-light svg,
.affina-adaptive-header-active.affina-header-fg-dark svg {
	color: inherit !important;
}

.affina-adaptive-header-active.affina-header-fg-light svg [fill]:not([fill="none"]),
.affina-adaptive-header-active.affina-header-fg-dark svg [fill]:not([fill="none"]) {
	fill: currentColor !important;
}

.affina-adaptive-header-active.affina-header-fg-light svg [stroke]:not([stroke="none"]),
.affina-adaptive-header-active.affina-header-fg-dark svg [stroke]:not([stroke="none"]) {
	stroke: currentColor !important;
}

/* Counters */
.affina-adaptive-header-active.affina-header-fg-light .wd-tools-count,
.affina-adaptive-header-active.affina-header-fg-light .wd-cart-number {
	background: var(--affina-header-fg-light) !important;
	color: var(--affina-header-fg-dark) !important;
}

.affina-adaptive-header-active.affina-header-fg-dark .wd-tools-count,
.affina-adaptive-header-active.affina-header-fg-dark .wd-cart-number {
	background: var(--affina-header-fg-dark) !important;
	color: var(--affina-header-fg-light) !important;
}

@media (prefers-reduced-motion: reduce) {
	.affina-adaptive-header-active,
	.affina-adaptive-header-active * {
		transition: none !important;
	}
}
