/**
 * Block-pattern styles — pix-theme-g
 *
 * Layout rules for the registered block patterns (header designs).
 * Mirrors the visual hierarchy of the classic header templates
 * (templates/header/header1..6.php) but expressed against core
 * WordPress blocks and the `.pix-header-pattern` class family.
 *
 * Colors / typography intentionally inherit from the theme palette
 * and the .pix-header rules in assets/css/main.css so patterns
 * match the saved Customizer header styling automatically.
 */

/* ----- Shared header pattern rules --------------------------------------- */

.pix-header-pattern {
	display: block;
	width: 100%;
	background: var(--wp--preset--color--pix-white, #ffffff);
	color: var(--wp--preset--color--pix-black, #050203);
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	padding: clamp(12px, 1.2vw, 20px) clamp(16px, 1.6vw, 24px);
	position: relative;
	z-index: 100;
}

.pix-header-pattern a {
	color: inherit;
	text-decoration: none;
}

.pix-header-pattern .pix-header-logo img,
.pix-header-pattern .wp-block-site-logo img {
	max-height: 48px;
	width: auto;
	display: block;
}

.pix-header-pattern .pix-main-menu,
.pix-header-pattern .pix-catalog-menu {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.pix-header-pattern .pix-header-actions {
	gap: 16px;
	align-items: center;
}

.pix-header-pattern .pix-header-btn {
	margin: 0;
}

.pix-header-pattern .pix-search,
.pix-header-pattern .pix-header-search,
.pix-header-pattern .pix-header-search-inline {
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 320px;
}

/* ----- Top-bar (optional pill above main header) ------------------------- */

.pix-header-pattern .pix-header-topbar {
	background: var(--wp--preset--color--pix-black, #050203);
	color: var(--wp--preset--color--pix-white, #ffffff);
	padding: 8px clamp(16px, 1.6vw, 24px);
	font-size: 13px;
}

.pix-header-pattern .pix-header-topbar a {
	color: var(--wp--preset--color--pix-white, #ffffff);
	opacity: 0.85;
}

.pix-header-pattern .pix-header-topbar a:hover {
	opacity: 1;
}

.pix-header-pattern .pix-header-topbar .pix-header-topbar-contact {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	margin: 0;
}

.pix-header-pattern .pix-header-topbar .pix-header-topbar-socials {
	gap: 12px;
}

/* ----- Default header (logo left, nav right) ----------------------------- */

.pix-header-pattern.pix-header-default .pix-header-main {
	align-items: center;
	width: 100%;
}

.pix-header-pattern.pix-header-default .pix-main-menu {
	flex: 1 1 auto;
	justify-content: center;
}

.pix-header-pattern.pix-header-default .pix-header-phone {
	margin: 0;
	font-size: 14px;
	white-space: nowrap;
}

/* ----- Centered logo header ---------------------------------------------- */

.pix-header-pattern.pix-header-centered-logo .pix-header-cols-3 {
	width: 100%;
}

.pix-header-pattern.pix-header-centered-logo .pix-header-logo img,
.pix-header-pattern.pix-header-centered-logo .wp-block-site-logo img {
	margin: 0 auto;
}

.pix-header-pattern.pix-header-centered-logo .pix-header-right {
	justify-content: flex-end;
	gap: 16px;
}

.pix-header-pattern.pix-header-centered-logo .pix-header-socials {
	gap: 12px;
	font-size: 16px;
}

/* ----- Two-level header -------------------------------------------------- */

.pix-header-pattern.pix-header-two-level,
.pix-header-pattern.pix-header-info-row,
.pix-header-pattern.pix-header-search,
.pix-header-pattern.pix-header-catalog {
	padding-bottom: 0;
}

.pix-header-pattern .pix-header-divider {
	margin: clamp(8px, 0.8vw, 12px) 0;
	opacity: 0.5;
}

.pix-header-pattern.pix-header-two-level .pix-header-top-row,
.pix-header-pattern.pix-header-search .pix-header-main,
.pix-header-pattern.pix-header-catalog .pix-header-main {
	align-items: center;
	width: 100%;
}

/* ----- Info row header --------------------------------------------------- */

.pix-header-pattern.pix-header-info-row .pix-header-info-cols {
	width: 100%;
}

.pix-header-pattern.pix-header-info-row .pix-header-info-blocks {
	gap: 16px;
}

.pix-header-pattern.pix-header-info-row .pix-header-info-item {
	margin: 0;
	font-size: 13px;
	display: flex;
	gap: 6px;
	align-items: center;
}

.pix-header-pattern.pix-header-info-row .pix-info-icon {
	font-size: 16px;
	opacity: 0.7;
}

/* ----- Search & catalog header ------------------------------------------- */

.pix-header-pattern.pix-header-search .pix-header-search-inline,
.pix-header-pattern.pix-header-catalog .pix-header-search-inline {
	flex: 1 1 auto;
	max-width: 540px;
}

.pix-header-pattern .pix-header-cart {
	font-size: 18px;
	line-height: 1;
}

.pix-header-pattern.pix-header-catalog .pix-header-catalog-bar {
	padding: 10px clamp(16px, 1.6vw, 24px);
	color: var(--wp--preset--color--pix-white, #ffffff);
}

.pix-header-pattern.pix-header-catalog .pix-header-catalog-bar a {
	color: var(--wp--preset--color--pix-white, #ffffff);
}

/* ----- Responsive collapse ---------------------------------------------- */

@media (max-width: 1024px) {
	.pix-header-pattern .pix-header-main,
	.pix-header-pattern .pix-header-top-row {
		flex-wrap: wrap;
	}

	.pix-header-pattern.pix-header-info-row .pix-header-info-blocks {
		display: none;
	}

	.pix-header-pattern .pix-header-actions {
		gap: 10px;
	}
}

@media (max-width: 768px) {
	.pix-header-pattern {
		padding: 10px 14px;
	}

	.pix-header-pattern .pix-header-search-inline,
	.pix-header-pattern .pix-header-phone,
	.pix-header-pattern .pix-header-info-blocks {
		display: none;
	}

	.pix-header-pattern.pix-header-centered-logo .pix-header-socials {
		display: none;
	}

	.pix-header-pattern .pix-header-logo img,
	.pix-header-pattern .wp-block-site-logo img {
		max-height: 36px;
	}
}

/* ----- Editor preview niceties ------------------------------------------ */

.editor-styles-wrapper .pix-header-pattern {
	margin: 0;
	border: 1px dashed rgba(0, 0, 0, 0.1);
}