/*
 * COS Woo Theme — мост дизайна ↔ WordPress/WooCommerce + мобильные доводки.
 * Дизайн-слой (market-*.css) задаёт .hd/.ft/.mega/.btn. Здесь связываем его
 * со стандартными классами WP/WC, которые дизайн не покрывал.
 */

/* base .mk на body сбрасывает фон кнопок (:where(.mk) button) — возвращаем
   фирменный вид кнопкам WooCommerce и Gutenberg. */
.mk .button,
.mk button.button,
.mk a.button,
.mk .wp-block-button__link,
.mk .woocommerce-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: var(--cyan);
	color: #fff;
	border: 0;
	border-radius: var(--r-sm);
	padding: 12px 22px;
	font-family: var(--font-body);
	font-weight: 600;
	font-size: var(--fs-body);
	line-height: 1;
	cursor: pointer;
	transition: background var(--dur-fast) var(--ease-out);
	text-decoration: none;
}
.mk .button:hover,
.mk a.button:hover,
.mk .wp-block-button__link:hover {
	background: var(--cyan-700);
	color: #fff;
}
.mk .button.alt,
.mk .button.checkout-button {
	background: var(--ink);
}
.mk .button.alt:hover { background: #000; }

/* Контейнер контента — выравниваем под дизайн-сетку (.wrap = 1480 max). */
.mk .site-content,
.mk #primary {
	width: 100%;
}
.mk .cwt-container {
	max-width: var(--cwt-container-wide, 1480px);
	margin-inline: auto;
	padding-inline: clamp(16px, 2.5vw, 40px);
	padding-top: 28px;
	padding-bottom: 48px;
}

/* ===== Каталог (archive) — сетка карточек .pc вместо WC-флоатов ===== */
.mk ul.products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	list-style: none;
	margin: 0 0 32px;
	padding: 0;
}
.mk ul.products::before,
.mk ul.products::after { content: none !important; display: none !important; }
.mk ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	padding: 0 !important;
	clear: none !important;
}
.mk ul.products li.product::before { content: none !important; }
.mk ul.products li.product .pc { height: 100%; }
/* Шапка архива каталога */
.mk .woocommerce-products-header__title,
.mk .woocommerce-products-header h1 {
	font-family: var(--font-display); font-weight: 800; font-size: clamp(24px, 2vw, 34px);
	letter-spacing: -0.02em; color: var(--masla-navy); margin: 0 0 8px;
}
.mk .woocommerce-result-count { color: var(--neutral-500); font-size: 14px; }
.mk .woocommerce-ordering select { font-family: var(--font-body); border: var(--hairline-strong); border-radius: var(--r-sm); padding: 8px 12px; }
@media (max-width: 1024px) { .mk ul.products { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .mk ul.products { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .mk ul.products { grid-template-columns: repeat(2, 1fr); gap: 10px; } }

/* Фолбэк каталога: модуль фильтра плагина грузит грид по AJAX (data-wpaic-filter-grid).
   На Stage индекс не построен → грид пуст. Показываем серверную .pc-сетку, прячем
   пустой filter-grid. ВРЕМЕННО до интеграции фасетного фильтра в редизайн (#17). */
.mk .wpaic-filter-grid:has(.wpaic-filter__grid:empty) { display: none !important; }
.mk .wpaic-filter-grid:has(.wpaic-filter__grid:empty) ~ ul.products { display: grid !important; }
.mk .wpaic-filter-grid:has(.wpaic-filter__grid:empty) ~ nav.woocommerce-pagination { display: flex !important; }

/* Цена WooCommerce — фирменный display-шрифт. */
.mk .price,
.mk .woocommerce-Price-amount {
	font-family: var(--font-display);
	font-weight: 700;
	color: var(--masla-navy);
}

/* ===== Мобильная навигация =====
   Бургер (.hd-burger), мобильная шапка, drawer-шторка (.mnav) и все
   брейкпоинты ≤820 / ≤600 живут в market-responsive.css (порт дизайна v3).
   Здесь намеренно ничего нет, чтобы не конфликтовать с порядком каскада. */

/* Фокус-кольцо для доступности (наши элементы). */
.mk :where(a, button, input, select, textarea):focus-visible {
	outline: none;
	box-shadow: var(--ring);
	border-radius: var(--r-sm);
}

/* ===== Карточка товара .pc — мост WooCommerce (фото/цена/ссылки) ===== */
.mk .pc-shot { display: flex; align-items: flex-end; justify-content: center; width: 100%; height: 100%; }
.mk .pc-media img { max-height: 150px; width: auto; object-fit: contain; mix-blend-mode: multiply; }
/* price_html (WooCommerce) внутри .pc .price — наследует display-шрифт 19px/800 от .pc .price */
.mk .pc .price .woocommerce-Price-amount { font: inherit; color: inherit; }
.mk .pc .price ins { text-decoration: none; }
.mk .pc .price del { display: block; font-size: .62em; font-weight: 500; opacity: .5; }
.mk .pc-add, .mk .pc-add:hover { color: #fff; text-decoration: none; }
.mk .pc-cmp, .mk .pc-cmp:hover { text-decoration: none; }

/* Hero «Хит недели»: цена со скидкой (был …) */
.mk .hero-promo .price .woocommerce-Price-amount { font: inherit; color: inherit; }
.mk .hero-promo .price small .woocommerce-Price-amount { text-decoration: line-through; }

/* Футер — display-телефон 22px (перебиваем специфичность .ft-contacts .r) */
.mk .ft-contacts .ft-phone { font-size: 22px; color: #fff; }
.mk .ft-contacts a.ft-phone:hover { color: var(--cyan); }

/* ===== Мега-меню: серверный рендер всех категорий, переключение по hover ===== */
.mega-center { min-width: 0; }
.mega .mega-panel { display: none; }
.mega .mega-panel.on { display: block; }
/* выпадайки Бренды/Карты/Аналоги — одна оболочка, активная панель .on */
.cwt-sd-pane { display: none; }
.cwt-sd-pane.on { display: block; }
/* Мигрированный контент (vc→ms): адаптивные изображения + ритм */
.mk .ms-section .ms-figure { margin: 0 0 22px; }
.mk .ms-section .ms-figure img,
.mk .ms-section .ms-text img { max-width: 100%; height: auto; border-radius: var(--r-md); }
.mk .ms-section .ms-text + .ms-text { margin-top: 16px; }

/* featured-плитки мега-меню = реальные товары (фото + имя + цена) */
.mk .mega-featured .mfeat .thumb img { max-height: 76px; width: auto; object-fit: contain; mix-blend-mode: multiply; }
.mk .mega-featured .mfeat-meta .c .woocommerce-Price-amount { font-family: var(--font-display); font-weight: 800; font-size: 13px; color: var(--masla-navy); }
.mk .mega-featured .mfeat-meta .c del { display: none; }
.mk .mega-featured .mfeat-meta .c ins { text-decoration: none; }

.screen-reader-text {
	border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0;
	position: absolute !important; word-wrap: normal !important;
}
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 100000; padding: 12px 16px; background: var(--ink); color: #fff; }
.skip-link:focus { left: 8px; top: 8px; }