/*
Theme Name:   Woodmart Child — GLANIS
Description:  Child-тема GLANIS. Все правки — только здесь, родитель не трогается (CLAUDE.md).
Template:     woodmart
Version:      0.24.0
Author:       GLANIS
Text Domain:  woodmart-child-glanis
*/

/* Версия поднимается при каждом изменении (правило версионирования CLAUDE.md).
   Стили — ниже. Цвета/типографика/отступы — токены в theme.json. */

/* --- Витрина Фазы 1: спрятать корзину в шапке ---
   Catalog mode темы прячет кнопки покупки, но элемент корзины в хедере
   остаётся (по докам Woodmart он убирается в header builder — сделаем
   при дизайн-батче; до тех пор — CSS, уровень 2 лестницы инвазивности). */
.wd-header-cart,
.cart-widget-side,
.wd-cart-side {
	display: none !important;
}

/* --- Cookie-баннер: равнозначность выбора ---
   Зачем: по спецификации «Принять» и «Отклонить» обязаны быть одного размера,
   цвета и веса — неравнозначные кнопки трактуются как отсутствие свободного
   выбора. Плагин рисует их inline-block, ширина идёт от длины текста:
   замер до правки — «Принять» 72,53 px против «Отклонить» 86,28 px.
   Уровень 2 лестницы инвазивности: настройки такого не дают, шаблон не трогаем.

   Снять вместе с баннером, если плагин когда-нибудь заменят. */
#cookie-notice #cn-notice-buttons {
	display: flex;
	gap: 10px;
	margin-top: 12px;
}

#cookie-notice #cn-notice-buttons .cn-set-cookie {
	flex: 1 1 0;
	min-width: 0;
	max-width: 220px;
	margin: 0;
	padding: 11px 10px;
}

/* Крестик закрытия помечен для скринридера как «Отклонить», а фактически
   несёт data-cookie-set="accept" — то есть закрытие крестиком даёт согласие.
   Замер 2026-08-15: кнопка видима, 40×42 px. Это противоречие между подписью
   и действием, а не вопрос вкуса, поэтому кнопка убирается: выбор остаётся
   двумя явными кнопками. */
#cookie-notice #cn-close-notice {
	display: none !important;
}

/* Спецификация требует работы с клавиатуры — делаем фокус видимым.
   У кнопок плагина outline снят его же стилями. */
#cookie-notice .cn-set-cookie:focus-visible,
#cookie-notice .cn-revoke-cookie:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

/* Ссылки на политики внутри баннера наследовали фирменный цвет ссылок #403F41
   и оказывались тёмно-серыми на тёмном фоне бара: замер 2026-08-15 дал
   контраст 1,21:1 при пороге 4,5:1 (WCAG 2.2 AA, наши пороги качества).
   Фактически ссылки были нечитаемы, а спецификация требует их наличия.
   Наследуем цвет текста баннера (белый, 12,7:1) и подчёркиваем. */
#cookie-notice #cn-notice-text a {
	color: inherit;
	text-decoration: underline;
}

#cookie-notice #cn-notice-text a:hover,
#cookie-notice #cn-notice-text a:focus-visible {
	text-decoration: none;
}

/* --- Контраст текста: приглушённые подписи темы к палитре ---
   Замер 2026-08-16 на фактическом фоне элемента (не «по умолчанию белый»):
   тема красит служебные подписи в #a5a5a5 и полупрозрачный #333, и на белом
   это 2,46:1 и 2,78:1 при норме WCAG 2.2 AA 4,5:1 для обычного текста.
   Приглушённый цвет палитры #58595B даёт 7,01:1 на белом.

   Правится не сам цвет темы, а её переменная в области нужных элементов:
   так затронуты ровно эти подписи, а границы и разделители того же серого
   остаются как были — норма контраста про текст, а не про линии.

   Пороговые значения оставлены как есть: #767676 даёт 4,54:1 на белом
   и норму проходит, красить его не требовалось. */

/* подпись категории и артикул в карточке товара
   (тема: :where(.wd-loop-builder-off) :is(.wd-product-cats,…)) */
.wd-product-wrapper :is(.wd-product-cats, .wd-product-brands-links, .wd-product-sku),
.product-wrapper :is(.wd-product-cats, .wd-product-brands-links, .wd-product-sku) {
	--wd-link-color: #58595B;
	color: #58595B;
}

/* «Автор:» и имя автора в списке журнала (тема: .wd-post-author) */
.wd-post-meta .wd-post-author,
.wd-post-meta .wd-post-author a {
	--wd-link-color: #58595B;
	color: #58595B;
}

/* неактивная вкладка мобильного меню: тема ставит --nav-color
   как rgba(var(--wd-navigation-color), .5) — половинная прозрачность.
   Активная вкладка (--nav-color-hover) не трогается, различие сохраняется. */
.wd-nav.wd-nav-mob-tab {
	--nav-color: #58595B;
}

/* --- Текст поверх фотографии в секции: основной цвет, а не приглушённый ---
   У тёмной цветовой схемы темы свой приглушённый текст #767676. На белом он
   даёт 4,54:1 и норму проходит, но поверх светлой фотографии падает до
   1,20–3,61:1 (замер по пикселям кадра, блок «Как подобрать размер»).
   Фон-фотография светлее и пестрее ровного белого, запаса у #767676 нет.

   Заголовку это не мешает — он и так основным цветом, 11,77:1. Правим текст
   абзацев: поверх снимка он должен быть основным #231F20 (13,5:1).
   Охват — только секции с фоном: обычные тёмные схемы вне секций не трогаем. */
.wp-block-wd-section .color-scheme-dark {
	--wd-text-color: #231F20;
}

/* --- Нижняя панель: не показывать пустую оболочку ---
   Из панели убран «Каталог» — он вёл на /shop/, страницу вне меню.
   Осталось поле «Фильтры», но тема рисует обёртку панели на каждой странице,
   даже когда внутрь нечего положить: на главной, в карточке и в журнале
   получалась пустая полоса 55 px плюс такой же отступ снизу у страницы.

   Прячем панель, когда в ней нет ни одного элемента, и снимаем отступ.
   Условие «нет дочерних элементов», а не список страниц: если тема однажды
   добавит в панель что-то ещё, правило само перестанет срабатывать.
   Селектор с префиксом body намеренно: у `.wd-toolbar` из
   opt-bottom-toolbar.css та же специфичность, а грузится он позже child-темы
   и потому выигрывал. Проверено перечислением всех правил, задающих display. */
body .wd-toolbar:not(:has(> *)) {
	display: none;
}

/* Отступ снизу тема даёт классом .sticky-toolbar-on под панель. Когда панель
   скрыта, остаётся пустая полоса 55 px. Убираем её там, где панели нет.
   Здесь не `:has()`: вложенный `:has()` внутри `:has()` запрещён спецификацией,
   такой селектор браузер отбрасывает целиком — проверено перечислением правил,
   применившихся к body. Поэтому условие по классам страницы. */
body.sticky-toolbar-on:not(.tax-product_cat):not(.woocommerce-shop) {
	padding-bottom: 0 !important;
}

/* --- Плашки зон: на телефоне сеткой, а не каруселью ---
   Замер до правки при 390 px: плашка 380×278, в экран целиком помещается одна,
   до шестой зоны пять свайпов. Смысл блока — показать выбор, а не листать его.

   Дорожка карусели превращается в сетку 2×3: шесть плашек видны сразу.
   Правило ограничено классом этой карусели (wd-9a89560a) — на карусели
   товаров и журнала не распространяется.

   transform !important обязателен: Swiper ставит сдвиг дорожки инлайном,
   и без перебивки сетка уезжала бы вбок при касании. */
@media (max-width: 768.98px) {
	.wd-9a89560a .wd-carousel-wrap {
		display: grid !important;
		/* minmax(0, 1fr), а не 1fr: иначе колонка раздувается под содержимое
		   и вторая уезжает за край экрана — было 204 px при доступных 180 */
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px;
		width: 100% !important;
		transform: none !important;
	}

	.wd-9a89560a .wd-carousel-item {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	.wd-9a89560a .wd-carousel,
	.wd-9a89560a .wd-carousel-inner {
		height: auto !important;
	}

	/* стрелки листания больше не нужны: листать нечего */
	.wd-9a89560a .wd-nav-arrows {
		display: none;
	}
}

/* --- Подписи плашек зон: читаемость поверх фотографии ---
   Замер по пикселям кадра при 390 px: пять подписей из шести не проходят
   порог 4,5:1. Хуже всего «Плечо и рука» — 62,6% площади ниже нормы,
   и «Колено» — 56,8%: тёмный текст ложится на тёмную одежду и тень.

   Кадры зон разные и пёстрые, гарантировать контраст выбором места нельзя.
   Поэтому под текстовый блок ставится светлая подложка из палитры (#FFFFFF)
   с небольшой прозрачностью: фотография остаётся видна, текст читается.

   Это отступление от «подложки быть не должно» — то правило задавалось для
   баннеров главной, где свободная треть кадра оставлена под текст намеренно.
   У плашек такой области нет. Решение назвал в отчёте. */
.wd-9a89560a .wp-block-wd-container {
	padding: 10px 12px;
	background-color: rgba(255, 255, 255, .88);
	border-radius: 2px;
}

/* Компенсации узкой плашки — ТОЛЬКО на телефоне (до 576 px), а не везде.
   Сетка 2×3 включается с 768.98 px, но обе правки ниже нужны не из-за сетки,
   а из-за ширины плитки: на телефоне она 185 px, на планшете уже 374 px.

   Замер 20.08.2026 показал цену ошибки. Пока эти строки лежали вне
   медиазапроса, они действовали на всех ширинах, и подложки получались
   по содержимому: на 1440 от 135 px («Локоть») до 280 px («Запястье и
   пальцы») — разброс 145 px; на 1024 — 105 px; на 768 — 78 px.
   После переноса в @media 768.98 разброс на десктопе исчез, но на планшете
   остался: 768 попадал в запрос, а компенсация там не нужна. */
/* От 576 px подложка занимает долю плитки — так она одинакова у всех шести
   и вмещает самую длинную подпись.

   Почему не оставить ширину темы. Она даёт 160 px при плашке 354 (1440) и
   134 px при 374 (768). Подпись «Голеностоп» — 154 и 130 px плюс отступы:
   замер 20.08.2026 показал выход за подложку на 18–20 px на всех ширинах от
   576 до 1440. Сама подложка — наша, ширина была темы; порознь ни то ни
   другое не мешало, вместе буквы вылезали на фотографию, где контраст
   никем не обещан.

   Доля, а не пиксели: одно правило на все ширины, растёт вместе с плиткой,
   и переименование зоны его не ломает. */
@media (min-width: 576px) {
	.wd-9a89560a .wp-block-wd-container {
		width: 66% !important;
		max-width: none !important;
	}
}

@media (max-width: 575.98px) {
	/* у блока своя узкая ширина (115 px при плашке 185): с подложкой
	   «Запястье и пальцы» уходило в три строки. Отдаём подписи всю плашку. */
	.wd-9a89560a .wp-block-wd-container {
		width: auto !important;
		max-width: none !important;
	}

	/* на плашке 185 px заголовок 22 px переносит длинные названия в три строки */
	.wd-9a89560a .wp-block-wd-title {
		font-size: 17px !important;
		line-height: 1.25 !important;
	}
}

/* --- Подписи блока «Выберите зону»: читаемость поверх фотографии ---
   Замер по пикселям кадра 21.08.2026: при 1440 и 1024 подпись ложится прямо
   на фото, и «Плечо и рука» даёт 1,04:1 — тёмный текст на тёмной футболке.
   «Локоть» при 1024 — 4,89:1, то есть у самого порога. Остальные проходят
   с запасом, но случайно: это зависит от того, что попало в кадр.

   До 768 px включительно подпись стоит ПОД кадром, на белом, там 16,30:1 —
   поэтому подложка включается только с 769 px, где она действительно нужна.

   Решение то же, что у плашек зон выше: светлая подложка из палитры с
   прозрачностью. Кадры зон пёстрые, гарантировать контраст выбором места
   нельзя, а переснимать фотографии ради подписи — несоразмерно.

   Правило привязано к классу этого блока (wd-146a9b07, из его blockId):
   каталожные списки категорий на других страницах не затрагиваются. */
@media (min-width: 769px) {
	.wd-146a9b07 .wd-cat .wd-entities-title {
		padding: 8px 12px;
		background-color: rgba(255, 255, 255, .88);
		border-radius: 2px;
	}
}

/* --- Вводная строка на плитке зоны ---
   Хук шаблона стоит ПОСЛЕ заголовка (подходящего выше в шаблоне нет),
   поэтому строка поднимается над названием раскладкой: контейнер подписи
   становится колонкой, строке даётся order: -1. Переопределять шаблон
   ради порядка двух элементов несоразмерно — правило 2 лестницы.

   Начертание мельче названия и того же цвета из палитры. Подложка та же,
   что у названия: строка ложится на фотографию рядом с ним. */
.wd-146a9b07 .wd-cat-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

/* На десктопе тема ставит название ВНЕ блока подписи: сам блок прижат к низу
   плитки (inset сверху 560 px), а заголовок поднят над ним через position:
   absolute и top: -44px. Из-за этого строка, добавленная внутрь блока,
   оказывалась под названием, а не над ним — замер показал «над названием: НЕТ»
   при 1440 и 1024, при том что на 768 и 390 всё было верно.

   Возвращаем заголовок в поток и отпускаем верхнюю привязку блока: тогда
   блок растёт снизу вверх, а порядок задаёт колонка. Правило действует
   только внутри нашего блока (wd-146a9b07). */
@media (min-width: 769px) {
	/* !important обязателен: у темы своё правило на top, и без перебивки блок
	   подписи оставался приколотым сверху, а вниз выезжал на 56 px за плитку —
	   у неё overflow: hidden, и название срезало. Поймано замером краёв. */
	.wd-146a9b07 .wd-cat-inner {
		position: relative;
	}

	/* Привязку задаём явно всеми сторонами. Иначе блок подписи терял нижний
	   якорь и выезжал на 56 px за плитку, а у неё overflow: hidden — название
	   срезало. Поймано замером краёв плитки и подписи, не на глаз. */
	/* У оформления «hover-mask» блок подписи сдвинут вниз на собственную высоту
	   и выезжает при наведении. Пока в нём было только название, сдвиг умещался
	   в плитку. Вводная строка добавила 24 px, блок уехал на 56 px за нижний
	   край, а у плитки overflow: hidden — название срезало наполовину.
	   Разбор: computed top 516 px совпадал с расчётом по bottom:15px, а
	   getBoundingClientRect давал на 72 px ниже — ровно на высоту блока.
	   Отключаем сдвиг: подпись и так видна всегда, выезжать ей неоткуда. */
	.wd-146a9b07 .wd-cat-content {
		transform: none !important;
	}

	.wd-146a9b07 .wd-cat .wd-entities-title {
		position: static !important;
	}
}

.wd-146a9b07 .glanis-cat-kicker {
	order: -1;
	margin: 0 0 4px;
	font-size: 12px;
	line-height: 1.3;
	color: #231F20;
}

@media (min-width: 769px) {
	.wd-146a9b07 .glanis-cat-kicker {
		padding: 4px 12px;
		background-color: rgba(255, 255, 255, .88);
		border-radius: 2px;
	}
}