/* ============================================================
   SHOPSTYLE — шапка (Woodmart 7.0.2, Header Builder header_768969)
   Палитра макета. Подключается автоматически inc/enqueue.php (assets/*.css) после style.css.
   ============================================================ */
:root {
	--ss-bg: #F3F0EB;
	--ss-text: #2B2724;
	--ss-accent: #C4593A;
	--ss-muted: #8A837C;
	--ss-burger-photo: none; /* [ФОТО: магазин для панели бургера] → url(...) */
}

/* ---------- ряд шапки ---------- */
/* тема красит ряд без фона в #fff — нам нужен тёплый фон макета */
.whb-header .whb-row.whb-color-dark:not(.whb-with-bg) { background-color: var(--ss-bg); }
/* full_width=true в настройках хедера: контейнер 95% → отступы как в макете */
.whb-full-width .whb-row > .container { width: 100%; max-width: none; padding: 0 28px; }
/* липкое состояние (класс whb-sticked ставит JS темы): тонкая линия вместо тени */
.whb-sticked .whb-row { box-shadow: 0 1px 0 rgba(43, 39, 36, .08); }

/* ---------- логотип текстом (header-elements/logo.php) ---------- */
.ss-logo .wd-logo {
	font-family: 'Jost', var(--wd-header-el-font, sans-serif);
	font-weight: 500;
	font-size: 24px;
	line-height: 1;
	letter-spacing: .2em;
	padding-left: .2em; /* компенсация трекинга после последней буквы — центр ровный */
	text-transform: uppercase;
	color: var(--ss-text);
	white-space: nowrap;
}

/* ---------- главное меню ---------- */
.whb-header .wd-nav[class*="wd-style-"] {
	--nav-color: var(--ss-text);
	--nav-color-hover: var(--ss-accent);
	--nav-color-active: var(--ss-text);
	--nav-chevron-color: var(--ss-muted);
}
.whb-header .wd-nav-main > li > a {
	font-weight: 500;
	font-size: 13px;
	letter-spacing: .06em;
	text-transform: uppercase;
}
/* SALE — единственное цветное место меню (класс пункта ss-sale) */
.whb-header .wd-nav-main > li.ss-sale > a { --nav-color: var(--ss-accent); --nav-color-active: var(--ss-accent); }

/* ---------- иконки (бургер, поиск, аккаунт, избранное, корзина) ---------- */
.whb-header .wd-tools-element > a { color: var(--ss-text); }
.whb-header .wd-tools-element .wd-tools-icon:before { font-size: 18px; }
.whb-header .wd-header-mobile-nav .wd-tools-icon:before { font-size: 22px; }
.whb-header .wd-header-cart .wd-cart-number { top: -6px; right: -8px; background-color: var(--ss-accent); }

/* ---------- ГЛАВНАЯ ----------
   Прозрачная шапка поверх hero убрана 05.09 по правке С.: белый текст терялся на светлом фото,
   шапка наезжала на изображение. Теперь шапка везде одинаковая — фон страницы, тёмный текст. */
body.home .whb-header { margin-bottom: 0; }

/* ---------- МЕГА-МЕНЮ «Одежда» ----------
   Пункт 1-го уровня с классом ss-mega и _menu_item_design=full-width. Дети (категории)
   рендерятся темой как li.col-auto → раскладываем в 2 колонки. Фото справа — миниатюра
   (featured image) пункта «Одежда»: тема отдаёт её как --wd-dropdown-bg-img. */
.wd-nav-main > li.ss-mega > .wd-dropdown-menu {
	min-height: 480px;
	padding: 36px 0 0;
	background: var(--ss-bg); /* фото — в ::before (правый блок 40%, cover) */
	box-shadow: 0 1px 0 rgba(43, 39, 36, .08);
}
.wd-nav-main > li.ss-mega > .wd-dropdown-menu > .container { position: static; width: 62%; max-width: none; margin: 0; padding: 6px 28px 40px; }
/* градиент под белый промо-текст справа (виден и когда фото ещё нет) */
.wd-nav-main > li.ss-mega > .wd-dropdown-menu::before {
	content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 40%; pointer-events: none;
	background: linear-gradient(to top, rgba(43, 39, 36, .55), rgba(43, 39, 36, 0) 55%), var(--wd-dropdown-bg-img, none) center / cover no-repeat;
}
.ss-mega .wd-sub-menu { display: grid; grid-template-columns: repeat(3, minmax(0, 220px)); gap: 0 28px; margin: 0; padding: 0; background: transparent; box-shadow: none; } /* Woodmart 8: ul без .row (flex через [class*=wd-grid-f]) и с тенью .wd-sub-accented — убираем */
.ss-mega .wd-sub-menu > li { width: auto; margin: 0; padding: 0; }
.ss-mega .wd-sub-menu > li > a {
	--sub-menu-color: var(--ss-text);
	--sub-menu-color-hover: var(--ss-accent);
	padding: 9px 0;
	font-weight: 400;
	font-size: 15px;
	line-height: 1.3;
	text-transform: none;
}
/* строка внизу: «Смотреть все» (класс ss-mega-links) + его дети — служебные ссылки */
.ss-mega .wd-sub-menu > li.ss-mega-links { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 22px; margin-top: 36px; }
.ss-mega .wd-sub-menu > li.ss-mega-links > a { padding: 0; font-size: 14px; text-decoration: underline; text-underline-offset: 6px; }
.ss-mega li.ss-mega-links > .sub-sub-menu { display: flex; flex-wrap: wrap; gap: 0 16px; margin: 0; padding: 0; list-style: none; }
.ss-mega li.ss-mega-links .sub-sub-menu a { padding: 0; font-size: 13px; color: var(--ss-muted); }
.ss-mega li.ss-mega-links .sub-sub-menu a:hover { color: var(--ss-text); }
/* промо-подпись поверх фото (пункт с классом ss-mega-promo) */
.ss-mega .wd-sub-menu > li.ss-mega-promo { position: absolute; left: 80%; bottom: 36px; transform: translateX(-50%); width: auto; text-align: center; }
.ss-mega .wd-sub-menu > li.ss-mega-promo > a {
	--sub-menu-color: #fff;
	--sub-menu-color-hover: #fff;
	display: block;
	padding: 0;
	font-weight: 300;
	font-size: 26px;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-shadow: 0 1px 8px rgba(0, 0, 0, .35);
}
.ss-mega .wd-sub-menu > li.ss-mega-promo > a:after {
	content: "Смотреть все";
	display: block;
	margin-top: 6px;
	font-weight: 400;
	font-size: 14px;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: underline;
	text-underline-offset: 6px;
}

/* ---------- ПАНЕЛЬ БУРГЕРА / мобильное меню ----------
   Тема выводит одну off-canvas панель .mobile-nav (локация mobile-menu) — она же открывается
   бургером на десктопе. Классы пунктов: ss-m-cat (категории), ss-m-page (страницы), ss-m-service. */
.mobile-nav.wd-side-hidden { background-color: var(--ss-bg); padding-bottom: 40px; }
.mobile-nav .wd-heading { padding: 12px 28px 0; }
.mobile-nav .wd-nav-mobile li a { min-height: 0; border: 0; background: none; }
.mobile-nav .wd-nav-mobile li:active > a { background: none; }
.mobile-nav .wd-nav-mobile > li.ss-m-cat > a,
.mobile-nav .wd-nav-mobile > li.ss-m-page > a {
	padding: 13px 28px;
	font-weight: 400;
	font-size: 22px;
	line-height: 1.2;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ss-text);
}
.mobile-nav .wd-nav-mobile > li.ss-sale > a { color: var(--ss-accent); }
/* служебные ссылки + пункты аккаунт/избранное, которые тема добавляет в конец меню */
.mobile-nav .wd-nav-mobile > li.ss-m-service > a,
.mobile-nav .wd-nav-mobile > li.menu-item-account > a,
.mobile-nav .wd-nav-mobile > li.menu-item-wishlist > a { padding: 6px 28px; font-size: 14px; color: var(--ss-muted); }
.mobile-nav .wd-nav-mobile > li.ss-m-page + li.ss-m-service { margin-top: 36px; }
.mobile-nav .wd-nav-mobile .wd-with-icon > a:before { color: var(--ss-muted); }

@media (min-width: 1025px) {
	/* десктоп: панель на половину экрана, категории не дублируем (они в главном меню), поиск не нужен */
	.mobile-nav.wd-side-hidden { width: min(50vw, 720px) !important; }
	.mobile-nav .wd-nav-mobile > li.ss-m-cat,
	.mobile-nav .searchform { display: none; }
	.mobile-nav .wd-nav-mobile > li.ss-m-cat + li.ss-m-page { margin-top: 24px; }
	/* фото магазина справа от списка — когда появится картинка, задать --ss-burger-photo */
	.mobile-nav.wd-side-hidden:after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 40%; background: var(--ss-burger-photo) center / cover no-repeat; pointer-events: none; }
}

@media (max-width: 1024px) {
	/* мобайл (ТЗ п.3): меню на весь экран, категории крупным списком, страницы/служебные мельче внизу */
	.mobile-nav.wd-side-hidden { width: 100vw !important; }
	.ss-logo .wd-logo { font-size: 20px; }
	.mobile-nav .wd-nav-mobile > li:first-child { margin-top: 12px; }
	.mobile-nav .wd-nav-mobile > li.ss-m-page > a { font-size: 15px; letter-spacing: .04em; padding: 8px 28px; }
	.mobile-nav .wd-nav-mobile > li.ss-m-cat + li.ss-m-page { margin-top: 32px; }
	.mobile-nav .wd-nav-mobile > li.ss-m-page + li.ss-m-service { margin-top: 20px; }
}

/* ---------- Боковая корзина (видна на всех страницах — правила перенесены из page-cart.css 08.09) ---------- */
.cart-widget-side .widget_shopping_cart_content { background: var(--ss-bg); }
.cart-widget-side .woocommerce-mini-cart-item { padding: 14px 0; border-bottom: 1px solid var(--ss-line); }
.cart-widget-side .woocommerce-mini-cart-item .wd-entities-title { font-size: 14px; font-weight: 400; }
.cart-widget-side .woocommerce-mini-cart-item .quantity,
.cart-widget-side .woocommerce-mini-cart-item .wd-product-sku { color: var(--ss-muted); font-size: 13px; }
.cart-widget-side .woocommerce-mini-cart-item .remove { color: var(--ss-muted); border-color: transparent; }
.cart-widget-side .woocommerce-mini-cart-item .remove:hover { color: var(--ss-accent); }
.cart-widget-side .woocommerce-mini-cart__total { border-top: 1px solid var(--ss-line); padding-top: 14px; letter-spacing: .08em; text-transform: uppercase; font-size: 12px; }
.cart-widget-side .woocommerce-mini-cart__total .amount { font-size: 16px; letter-spacing: 0; }
.cart-widget-side .woocommerce-mini-cart__buttons { display: grid; gap: 8px; }
.cart-widget-side .woocommerce-mini-cart__buttons .button { width: 100%; margin: 0; }
.cart-widget-side .wd-empty-mini-cart { padding: 60px 20px; text-align: center; color: var(--ss-muted); }
.cart-widget-side .wd-empty-mini-cart .empty { font-size: 14px; text-transform: none; letter-spacing: 0; }
.cart-widget-side .wd-empty-mini-cart::before, .cart-widget-side .wd-empty-mini-cart > svg, .cart-widget-side .wd-empty-mini-cart .wd-icon { display: none; }
.cart-widget-side .shopping-cart-widget-body, .cart-widget-side .wd-scroll-content { height: 100%; }
.cart-widget-side .wd-empty-mini-cart { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: calc(100vh - 140px); padding: 20px; gap: 18px; }
.cart-widget-side .wd-empty-mini-cart .empty { margin: 0; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; color: var(--ss-text); }

/* правки 14.09: выпадающее меню «Личный кабинет» — одна панель без вложенной рамки */
.wd-header-my-account .wd-dropdown-menu.wd-design-default{--wd-dropdown-padding:10px 0;--wd-dropdown-width:210px}
.wd-header-my-account .wd-dropdown-menu .wd-sub-menu{background:transparent!important;box-shadow:none!important;border:0;margin:0;padding:0}
.wd-header-my-account .wd-dropdown-menu .wd-sub-menu>li{margin:0}
.wd-header-my-account .wd-dropdown-menu .wd-sub-menu>li>a{display:block;padding:9px 24px;font-size:14px;line-height:1.4;color:var(--ss-text)}
.wd-header-my-account .wd-dropdown-menu .wd-sub-menu>li>a:hover{color:var(--ss-accent);background:transparent}
/* иконка Instagram в шапке (assets/header.js) */
.ss-insta-tool .wd-tools-icon{display:flex;align-items:center;justify-content:center}
.ss-insta-tool .wd-tools-icon::before{content:none}
.ss-insta-tool svg{width:20px;height:20px;display:block;color:inherit}
.ss-insta-tool a:hover{color:var(--ss-accent)}
@media (max-width:1024px){.whb-mobile-right .ss-insta-tool{margin-right:6px}.whb-mobile-right .ss-insta-tool svg{width:22px;height:22px}}