/**
 * @file style.css
 * @package mnorwise/mnorbase
 * @subpackage css
 * @since 1.0.0
 * @author Mnorwise
 *
 * Main stylesheet for the MNorBase theme.
 * This file serves as the primary CSS entry point, importing design tokens,
 * base styles, components, and block-specific rules.
 */

/* --- # Base --- */

/**
 * @file base.css
 * --- Base theme styles ---
 */

:root :where(.wp-site-blocks > main) {
	margin-block-start: 0 !important;
}

/* --- # Components --- */

/**
 * @file components.css
 * --- Component styles ---
 */

/* --- # Buttons --- */

/* WordPress button element with smooth transitions */

.wp-element-button {
	transition: var(--wp--custom--transition--base);
}

.wp-element-button:hover,
.wp-element-button:focus,
.wp-element-button:active {
	box-shadow: var(--wp--preset--shadow--base);
}

/* Primary */

.wp-block-button__link:not([class*="has"]):hover,
.wp-block-button__link:not([class*="has"]):focus,
.wp-block-button__link:not([class*="has"]):active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--primary),
		var(--wp--preset--color--base-content) 35%
	) !important;
}

/* Primary Outline */

.wp-block-button.is-style-outline .wp-block-button__link:not([class*="has-"]) {
	color: var(--wp--preset--color--primary) !important;
	border-color: var(--wp--preset--color--primary) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:not([class*="has-"]):hover,
.wp-block-button.is-style-outline .wp-block-button__link:not([class*="has-"]):focus,
.wp-block-button.is-style-outline .wp-block-button__link:not([class*="has-"]):active {
	background-color: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--primary) !important;
}

/* Secondary */

.wp-block-button__link.has-secondary-background-color:hover,
.wp-block-button__link.has-secondary-background-color:focus,
.wp-block-button__link.has-secondary-background-color:active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--secondary),
		var(--wp--preset--color--base-content) 15%
	) !important;
}

/* Secondary Outline */

.wp-block-button.is-style-outline .wp-block-button__link.has-secondary-color {
	color: var(--wp--preset--color--secondary) !important;
	border-color: var(--wp--preset--color--secondary) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link.has-secondary-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-secondary-color:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-secondary-color:active {
	background-color: var(--wp--preset--color--secondary) !important;
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--secondary) !important;
}

/* Accent */

.wp-block-button__link.has-accent-background-color:hover,
.wp-block-button__link.has-accent-background-color:focus,
.wp-block-button__link.has-accent-background-color:active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--accent),
		var(--wp--preset--color--base-content) 15%
	) !important;
}

/* Accent Outline */

.wp-block-button.is-style-outline .wp-block-button__link.has-accent-color {
	color: var(--wp--preset--color--accent) !important;
	border-color: var(--wp--preset--color--accent) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link.has-accent-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-accent-color:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-accent-color:active {
	background-color: var(--wp--preset--color--accent) !important;
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--accent) !important;
}

/* Success */

.wp-block-button__link.has-success-background-color:hover,
.wp-block-button__link.has-success-background-color:focus,
.wp-block-button__link.has-success-background-color:active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--success),
		var(--wp--preset--color--base-content) 15%
	) !important;
}

/* Success Outline */

.wp-block-button.is-style-outline .wp-block-button__link.has-success-color {
	color: var(--wp--preset--color--success) !important;
	border-color: var(--wp--preset--color--success) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link.has-success-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-success-color:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-success-color:active {
	background-color: var(--wp--preset--color--success) !important;
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--success) !important;
}

/* Warning */

.wp-block-button__link.has-warning-background-color:hover,
.wp-block-button__link.has-warning-background-color:focus,
.wp-block-button__link.has-warning-background-color:active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--warning),
		var(--wp--preset--color--base-content) 15%
	) !important;
}

/* Warning Outline */

.wp-block-button.is-style-outline .wp-block-button__link.has-warning-color {
	color: var(--wp--preset--color--warning) !important;
	border-color: var(--wp--preset--color--warning) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link.has-warning-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-warning-color:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-warning-color:active {
	background-color: var(--wp--preset--color--warning) !important;
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--warning) !important;
}

/* Error */

.wp-block-button__link.has-error-background-color:hover,
.wp-block-button__link.has-error-background-color:focus,
.wp-block-button__link.has-error-background-color:active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--error),
		var(--wp--preset--color--base-content) 15%
	) !important;
}

/* Error Outline */

.wp-block-button.is-style-outline .wp-block-button__link.has-error-color {
	color: var(--wp--preset--color--error) !important;
	border-color: var(--wp--preset--color--error) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link.has-error-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-error-color:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-error-color:active {
	background-color: var(--wp--preset--color--error) !important;
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--error) !important;
}

/* Base Content */

.wp-block-button__link.has-base-content-background-color:hover,
.wp-block-button__link.has-base-content-background-color:focus,
.wp-block-button__link.has-base-content-background-color:active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--base-content),
		var(--wp--preset--color--base-100) 15%
	) !important;
}

/* Base Content Outline */

.wp-block-button.is-style-outline .wp-block-button__link.has-base-content-color {
	color: var(--wp--preset--color--base-content) !important;
	border-color: var(--wp--preset--color--base-content) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link.has-base-content-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-base-content-color:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-base-content-color:active {
	background-color: var(--wp--preset--color--base-content) !important;
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--base-content) !important;
}

/* Base 100 */

.wp-block-button__link.has-base-100-background-color:hover,
.wp-block-button__link.has-base-100-background-color:focus,
.wp-block-button__link.has-base-100-background-color:active {
	background-color: color-mix(
		in srgb,
		var(--wp--preset--color--base-100),
		var(--wp--preset--color--base-content) 15%
	) !important;
}

/* Base 100 Outline */

.wp-block-button.is-style-outline .wp-block-button__link.has-base-100-color {
	color: var(--wp--preset--color--base-100) !important;
	border-color: var(--wp--preset--color--base-100) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link.has-base-100-color:hover,
.wp-block-button.is-style-outline .wp-block-button__link.has-base-100-color:focus,
.wp-block-button.is-style-outline .wp-block-button__link.has-base-100-color:active {
	background-color: var(--wp--preset--color--base-100) !important;
	color: var(--wp--preset--color--base-content) !important;
	border-color: var(--wp--preset--color--base-100) !important;
}

/* --- # Soft Button Styles --- */

/* Primary Soft Style */

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-primary-background-color {
	--soft-color: var(--wp--preset--color--primary, currentColor);

	background-color: color-mix(in oklab, var(--soft-color) 12%, var(--wp--preset--color--base-100)) !important;
	border-color: color-mix(in oklab, var(--soft-color) 16%, var(--wp--preset--color--base-100));
	color: var(--soft-color);
}

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link:hover,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link:focus,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link:active,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-primary-background-color:hover,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-primary-background-color:focus,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-primary-background-color:active {
	background-color: var(--wp--preset--color--primary) !important;
	border-color: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--base-100) !important;
}

/* Success Soft Style */

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-success-background-color {
	--soft-color: var(--wp--preset--color--success, currentColor);

	background-color: color-mix(in oklab, var(--soft-color) 12%, var(--wp--preset--color--base-100)) !important;
	border-color: color-mix(in oklab, var(--soft-color) 16%, var(--wp--preset--color--base-100));
	color: var(--soft-color);
}

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-success-background-color:hover,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-success-background-color:focus,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-success-background-color:active {
	background-color: var(--wp--preset--color--success) !important;
	border-color: var(--wp--preset--color--success) !important;
	color: var(--wp--preset--color--base-100) !important;
}

/* Warning Soft Style */

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-warning-background-color {
	--soft-color: var(--wp--preset--color--warning, currentColor);

	background-color: color-mix(in oklab, var(--soft-color) 12%, var(--wp--preset--color--base-100)) !important;
	border-color: color-mix(in oklab, var(--soft-color) 16%, var(--wp--preset--color--base-100));
	color: var(--soft-color);
}

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-warning-background-color:hover,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-warning-background-color:focus,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-warning-background-color:active {
	background-color: var(--wp--preset--color--warning) !important;
	border-color: var(--wp--preset--color--warning) !important;
	color: var(--wp--preset--color--base-100) !important;
}

/* Error Soft Style */

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-error-background-color {
	--soft-color: var(--wp--preset--color--error, currentColor);

	background-color: color-mix(in oklab, var(--soft-color) 12%, var(--wp--preset--color--base-100)) !important;
	border-color: color-mix(in oklab, var(--soft-color) 16%, var(--wp--preset--color--base-100));
	color: var(--soft-color);
}

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-error-background-color:hover,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-error-background-color:focus,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-error-background-color:active {
	background-color: var(--wp--preset--color--error) !important;
	border-color: var(--wp--preset--color--error) !important;
	color: var(--wp--preset--color--base-100) !important;
}

/* Base content Soft Style */

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-base-content-background-color {
	--soft-color: var(--wp--preset--color--base-content, currentColor);

	background-color: color-mix(in oklab, var(--soft-color) 12%, var(--wp--preset--color--base-100)) !important;
	border-color: color-mix(in oklab, var(--soft-color) 16%, var(--wp--preset--color--base-100));
	color: var(--soft-color);
}

.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-base-content-background-color:hover,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-base-content-background-color:focus,
.wp-block-button.is-style-mnorbase-soft .wp-block-button__link.has-base-content-background-color:active {
	background-color: var(--wp--preset--color--base-content) !important;
	border-color: var(--wp--preset--color--base-content) !important;
	color: var(--wp--preset--color--base-100) !important;
}

.shadow-sm {
	/* box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.06); */
	box-shadow: var(--wp--preset--shadow--sm);
}

.shadow-base {
	box-shadow: var(--wp--preset--shadow--base);
}

.shadow-md {
	box-shadow: var(--wp--preset--shadow--md);
}

.shadow-lg {
	box-shadow: var(--wp--preset--shadow--lg);
}

.shadow-inset {
	box-shadow: var(--wp--preset--shadow--inset);
}

/*
 * @file cf7.css
 * --- Contact Form 7 styles ---
 */

/* --- Input styles --- */

.wpcf7-form .wpcf7-text,
.wpcf7-form .wpcf7-email,
.wpcf7-form .wpcf7-tel,
.wpcf7-form .wpcf7-textarea,
.wpcf7-form .wpcf7-select,
.wpcf7-form .wpcf7-date {
	width: 100%;
	padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--xs);
	border: 1px solid var(--wp--preset--color--base-300, #e0e0e0);
	font-size: var(--wp--preset--font-size--base, 1rem);
	transition:
		border-color var(--wp--custom--transition--duration--base),
		box-shadow var(--wp--custom--transition--base);
	background: var(--wp--preset--color--base-200, #f9f9f9);
	box-sizing: border-box;
}

/* --- Focus effect on field --- */

.wpcf7-form .wpcf7-text:focus,
.wpcf7-form .wpcf7-email:focus,
.wpcf7-form .wpcf7-tel:focus,
.wpcf7-form .wpcf7-textarea:focus {
	border-color: var(--wp--preset--color--success, #4caf50) !important;
	box-shadow: var(--wp--preset--shadow--base);
	background: var(--wp--preset--color--base-100, #ffffff);
	outline: none;
}

/* --- Textarea styles --- */

.wpcf7-form .wpcf7-textarea {
	min-height: 6.5rem;
	resize: vertical;
}

/* --- Submit button styles --- */

.wpcf7-form .wpcf7-submit {
	background-color: var(--wp--preset--color--primary);
	border-radius: 0;
	border-width: 0;
	color: var(--wp--preset--color--base-100);
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	padding-top: calc(0.667em + 2px);
	padding-right: calc(1.333em + 2px);
	padding-bottom: calc(0.667em + 2px);
	padding-left: calc(1.333em + 2px);
	text-decoration: none;
	text-transform: inherit;
	transition: var(--wp--custom--transition--base);
	cursor: pointer;
}

.wpcf7 .wpcf7-submit:disabled {
	background-color: color-mix(in srgb, var(--wp--preset--color--primary), var(--wp--preset--color--base-100) 35%);
}

/* --- Hover effect on button --- */

.wpcf7-form .wpcf7-submit:hover:not(:disabled) {
	background-color: color-mix(in srgb, var(--wp--preset--color--primary), var(--wp--preset--color--base-content) 35%);
	box-shadow: var(--wp--preset--shadow--base);
}

/* --- Error and success message styles --- */

.wpcf7-form .wpcf7-not-valid-tip {
	color: var(--wp--preset--color--error, #f44336);
	font-size: var(--wp--preset--font-size--xs, 0.875rem);
	margin-top: var(--wp--preset--spacing--xxs, 0.25rem);
	display: block;
}

.wpcf7-form .wpcf7-not-valid {
	border-color: var(--wp--preset--color--error, #f44336);
}

.wpcf7-spinner {
	/* background-color: var(--wp--preset--color--base-300, #e0e0e0); */
	background-color: var(
		color-mix(in srgb, var(--wp--preset--color--base-dark), var(--wp--preset--color--base-content) 35%),
		#23282d
	);
	background-color: color-mix(in srgb, var(--wp--preset--color--base-dark), transparent 25%);
	border: 1px solid #fff;
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: var(--wp--preset--color--success, #4caf50) !important;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	border-color: var(--wp--preset--color--warning, #ffaa00) !important;
}

.wpcf7 form .wpcf7-response-output {
	justify-content: center;
	background-color: color-mix(in srgb, var(--wp--preset--color--base-300), transparent 65%);
}

/* --- Mobile responsiveness --- */

@media (max-width: 768px) {
	.wpcf7-form {
		padding: 15px;
	}

	.wpcf7-form .wpcf7-submit {
		padding: 16px 20px;
		font-size: 15px;
	}
}

/* --- # Template Parts --- */

/**
 * @file blog.css
 * --- Blog template-part styles ---
 */

/* Add your blog template-part styles here */

.blog-default figure.wp-block-post-featured-image {
	min-width: 14rem;
}

@media (max-width: 781px) {
	.blog-default .wp-block-post-featured-image-and-excerpt {
		flex-wrap: wrap !important;
	}
	.blog-default figure.wp-block-post-featured-image {
		min-width: 100%;
	}
}

/**
 * @file header.css
 * --- Header template-part styles ---
 */

/* --- # Layout & Colors --- */

/* Header and navigation menu styles */

header.wp-block-template-part {
	position: sticky;
	inset-block-start: 0;
	z-index: 1024;
	background-color: var(--wp--preset--color--base-100);
	border-bottom: 1px solid color-mix(in oklch, currentColor 10%, transparent 90%);
	transition: all var(--wp--custom--transition--base);
}

header.wp-block-template-part a {
	color: var(--wp--preset--color--base-content);
}

header.wp-block-template-part .wp-block-navigation a {
	color: var(--wp--preset--color--base-link);
}

header.wp-block-template-part .wp-block-navigation__submenu {
	background: var(--wp--preset--color--base-300);
}

header.wp-block-template-part .wp-block-navigation__submenu .wp-block-navigation-item__content > a {
	color: var(--wp--preset--color--base-content);
}

.wp-block-navigation__responsive-container.is-menu-open {
	min-height: 100vh;
}

/* --- # Scrolled State --- */

/* Header scrolled state transitions */

header.wp-block-template-part {
	transition:
		color var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base),
		background-color var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base),
		background-image var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base),
		box-shadow var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base),
		padding var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base),
		backdrop-filter var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base);
}

header.wp-block-template-part.is-scrolled {
	background-color: var(--wp--preset--color--base-100);
	background-color: color-mix(in srgb, var(--wp--preset--color--base-content) 0%, transparent 100%);
	background-image:
		linear-gradient(
			135deg,
			color-mix(in srgb, var(--wp--preset--color--base-100) 75%, transparent 25%) 100%,
			transparent 100%
		),
		linear-gradient(
			100deg,
			color-mix(in srgb, var(--wp--preset--color--base-200) 35%, transparent 75%) 25%,
			transparent 65%
		);
	backdrop-filter: blur(20px);
	box-shadow: var(--wp--preset--shadow--base);
}

/* --- # Change Colors on scrolled state --- */

header.wp-block-template-part.is-scrolled a,
header.wp-block-template-part.is-scrolled
	.wp-block-navigation:not(.has-text-color)
	.wp-block-navigation__submenu-container {
	color: var(--wp--preset--color--base-content);
}

/* --- # Invert Logo on scrolled state(only SVG) --- */

header .custom-logo:is(img[src$=".svg"]) {
	filter: invert(1);
	transition: var(--wp--custom--transition--base);
}

header.is-scrolled .custom-logo:is(img[src$=".svg"]) {
	filter: invert(0);
}

/*
 * @file footer.css
 * --- Footer template-part styles ---
 */

footer.wp-block-template-part .custom-logo:is(img[src$=".svg"]) {
	filter: invert(1);
}

/* --- # Blocks --- */

/**
 * @file columns.css
 * --- Columns block styles ---
 */

/**
 * Fix for columns block to allow reordering.
 * This applies the order-first style to the columns block.
 */

@media (max-width: 781px) {
	.wp-block-columns .order-1 {
		order: -1;
	}
}

/**
 * @file group.css
 * --- Group block styles ---
 */

/** Stretched link for Gallery Block to fix on hover for figcaption */

.wp-block-gallery .wp-block-image a::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	inset: 0;
	z-index: 1;
}

/**
 * @file group.css
 * --- Group block styles ---
 */

/* --- # Layout Constraints --- */

/* Group Block / Layout constraints */

/* @media (max-width: 781px) {
	.wp-block-group .is-nowrap {
		flex-wrap: wrap;
	}
	.wp-block-group .wp-block-post-featured-image,
	.wp-block-group .wp-block-post-excerpt {
		flex-basis: 100%;
	}
} */

/* .is-layout-constrained:where(.alignfull) > * {
	padding-left: var(--wp--preset--spacing--base);
	padding-right: var(--wp--preset--spacing--base);
} */

/* --- # Helpers --- */

/**
 * @file helpers.css
 * --- Utility and layout fix styles ---
 */

/* --- # Smooth Scroll --- */

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* --- # Scroll Margin --- */

/* Base scroll margin for all IDs to account for fixed/sticky header */

[id] {
	scroll-margin-top: var(--header-height, 4rem);
}

/* Adjust scroll margin when WP Admin Bar is present */

.admin-bar [id] {
	scroll-margin-top: calc(var(--header-height, 4rem) + 32px);
}

@media screen and (max-width: 782px) {
	.admin-bar [id] {
		scroll-margin-top: calc(var(--header-height, 4rem) + 46px);
	}
}

/* Skip scroll margin for elements that shouldn't have it */

.skip-scroll-margin[id] {
	scroll-margin-top: 0 !important;
}

/* --- # Admin Bar Compensation --- */

/* -------------------------------------------------------
 * Fix for WP Admin Bar + site header
...
 * ------------------------------------------------------- */

/* Prevent WP's own margin/padding from conflicting */

html {
	scroll-padding-top: 0 !important;
}

html.admin-bar,
body.admin-bar {
	margin-top: 0 !important;
}

/* --- 1. Fixed & Sticky header --- */

/* Both fixed and sticky headers need the top offset to avoid being covered by the admin bar */

body.admin-bar header.wp-block-template-part,
body.admin-bar header.wp-block-template-part[style*="position: fixed"],
body.admin-bar header.wp-block-template-part.is-position-fixed,
body.admin-bar header.wp-block-template-part[style*="position: sticky"],
body.admin-bar header.wp-block-template-part.is-position-sticky {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar header.wp-block-template-part,
	body.admin-bar header.wp-block-template-part[style*="position: fixed"],
	body.admin-bar header.wp-block-template-part.is-position-fixed,
	body.admin-bar header.wp-block-template-part[style*="position: sticky"],
	body.admin-bar header.wp-block-template-part.is-position-sticky {
		top: 46px;
	}
}

/* --- 2. Relative / static header --- */

/* If the header is NOT fixed and NOT sticky, we must cancel any injected 'top' values 
   and ensure it flows naturally in the document. */

body.admin-bar
	header.wp-block-template-part:not(header):not([style*="position: fixed"]):not(.is-position-fixed):not(
		[style*="position: sticky"]
	):not(.is-position-sticky) {
	top: auto !important;
	margin-top: 0;
}

@media screen and (max-width: 601px) {
	body.admin-bar
		header.wp-block-template-part.is-scrolled:not([style*="position: fixed"]):not(.is-position-fixed):not(
			[style*="position: sticky"]
		):not(.is-position-sticky) {
		top: 0 !important;
	}
}

@media screen and (max-width: 782px) {
	body.admin-bar
		header.wp-block-template-part:not([style*="position: fixed"]):not(.is-position-fixed):not(
			[style*="position: sticky"]
		):not(.is-position-sticky) {
		margin-top: 0;
	}
}

/* --- 3. Back to Top Button --- */

.back-to-top {
	position: fixed;
	bottom: 1.25rem;
	right: 1.25rem;
	z-index: 1023;
	transition:
		opacity var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base),
		visibility var(--wp--custom--transition--duration--base) var(--wp--custom--transition--timing--base);
}

.back-to-top[aria-hidden="true"] {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}