/* =========================================================
   Coloring — modern layer v2
   Подключается ПОСЛЕ stylesheet.css. Всё, что здесь, можно
   отключить, убрав одну строку <link> в header.tpl.
   Цвета меняются в :root ниже.
   ========================================================= */

:root {
	/* фирменный красный — чуть глубже и «чище», чем был (#e3194b) */
	--c-primary: #e11d48;
	--c-primary-hover: #be123c;
	--c-primary-soft: #fff1f3;
	--c-accent: #e11d48;
	--c-accent-hover: #be123c;
	--grad-primary: linear-gradient(180deg, #ec2d55 0%, #e11d48 100%);
	--shadow-primary: 0 6px 16px -6px rgba(225, 29, 72, .55);

	--c-text: #1a1d29;
	--c-bg-soft: #f6f6f8;

	--topbar-h: 36px;
	--strip-h: 46px;
	--card-ratio: 1 / 1;          /* пропорции фото: 1 / 1 — квадрат, 4 / 5 и 3 / 4 — выше */
	--tabbar-h: 60px;
}

body { background: #fff; }
.container { max-width: 100%; }
@media (min-width: 1300px) { .container { width: 1270px; } }

h1 { font-size: 32px; font-weight: 800; letter-spacing: -.02em; margin: 8px 0 22px; }
@media (max-width: 767px) { h1 { font-size: 24px; margin-bottom: 16px; } }

/* хлебные крошки */
.breadcrumb {
	background: none;
	padding: 18px 0 6px;
	margin: 0;
	font-size: 13px;
	color: var(--c-muted);
}
.breadcrumb > li + li:before { content: "\203A"; color: var(--c-border-strong); padding: 0 8px; }
.breadcrumb a { color: var(--c-text-soft); }
.breadcrumb a:hover { color: var(--c-primary); }
.breadcrumb > .active { color: var(--c-muted); }

/* =========================================================
   ШАПКА
   ========================================================= */
.site-header {
	position: -webkit-sticky;
	position: sticky;
	top: calc(-1 * var(--topbar-h));
	z-index: 1030;
	background: #fff;
	transition: box-shadow var(--t);
}
.site-header.is-scrolled { box-shadow: 0 6px 24px -12px rgba(17, 17, 17, .25); }

/* верхняя строка */
#top {
	height: var(--topbar-h);
	padding: 0;
	background: var(--c-bg-soft);
	border-bottom: 1px solid var(--c-border);
	font-size: 13px;
}
#top .top-inner { display: flex; align-items: center; justify-content: space-between; height: 100%; }
#top .top-left, #top .top-right { display: flex; align-items: center; gap: 4px; }
#top .btn { line-height: 24px; padding: 0 8px; }
#top .top-links { display: flex; gap: 18px; margin-left: 14px; }
#top .top-links a { color: var(--c-text-soft); font-weight: 500; }
#top .top-links a:hover { color: var(--c-primary); }

/* основная строка */
.header-main { position: relative; background: #fff; border-bottom: 1px solid var(--c-border); }
.header-main__inner {
	display: flex;
	align-items: center;
	gap: 20px;
	min-height: 78px;
}
#logo { padding: 0; flex: 0 0 auto; }
#logo img { max-height: 52px; width: auto; margin: 0; }
#logo .logo-text { font-size: 22px; font-weight: 800; color: var(--c-text); letter-spacing: -.02em; }

/* три полоски */
.burger-lines { display: inline-flex; flex-direction: column; justify-content: center; gap: 4px; width: 18px; }
.burger-lines i { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform var(--t), opacity var(--t); }

.header-burger {
	display: none;
	width: 42px; height: 42px;
	border: 0; border-radius: var(--radius-sm);
	background: var(--c-bg-soft);
	color: var(--c-text);
	align-items: center; justify-content: center;
	flex: 0 0 auto;
}

/* кнопка «Каталог» */
.btn-catalog {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 46px;
	padding: 0 20px;
	border: 0;
	border-radius: var(--radius);
	background: var(--grad-primary);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	box-shadow: var(--shadow-primary);
	transition: filter var(--t), box-shadow var(--t);
	white-space: nowrap;
}
.btn-catalog:hover { filter: brightness(.96); }
.btn-catalog:focus { outline: none; }
.mega-open .btn-catalog .burger-lines i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.mega-open .btn-catalog .burger-lines i:nth-child(2) { opacity: 0; }
.mega-open .btn-catalog .burger-lines i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* поиск */
.header-main .search-box { flex: 1 1 auto; min-width: 0; padding: 0; }
#search { margin: 0; width: 100%; display: flex; }
#search .form-control {
	height: 46px;
	border: 2px solid var(--c-primary);
	border-left: 0;
	border-right: 0;
	border-radius: 0;
	font-size: 15px;
	padding-left: 14px;
	box-shadow: none;
	flex: 1 1 auto;
	float: none;
}
#search .input-group-btn { width: auto; display: flex; }
#change_category {
	height: 46px;
	border: 2px solid var(--c-primary);
	border-right: 1px solid var(--c-border);
	border-radius: var(--radius) 0 0 var(--radius) !important;
	background: #fff;
	color: var(--c-text-soft);
	padding: 0 12px 0 16px;
}
#change_category .category-name { max-width: 110px; }
#search-button {
	height: 46px;
	min-width: 56px;
	border: 0;
	border-radius: 0 var(--radius) var(--radius) 0 !important;
	background: var(--grad-primary);
	color: #fff;
	padding: 0 18px;
}
#search-button:hover, #search-button:focus { background: var(--c-primary-hover); color: #fff; }
#search-button .fa { font-size: 18px; }
#search .categories .dropdown-menu { max-height: 360px; overflow: auto; }

/* телефон */
.header-phone { padding: 0; text-align: right; flex: 0 0 auto; line-height: 1.2; }
#phone.header-phone .phone { font-size: 17px; font-weight: 800; line-height: 1.2; }
#phone .main-phone a { color: var(--c-text); }
#phone .main-phone a:hover { color: var(--c-primary); }
#phone .main-phone .caretalt { color: var(--c-muted); font-size: 13px; }
#phone .hint { display: block; font-size: 12px; color: var(--c-text-soft); margin-top: 2px; }
#phone .hint:hover { color: var(--c-primary); }

/* иконки: кабинет, избранное, корзина */
.header-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.ha-item,
#cart > .btn.ha-item {
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	min-width: 64px;
	padding: 6px 6px 4px;
	border: 0;
	border-radius: var(--radius-sm);
	background: none !important;
	box-shadow: none !important;
	filter: none !important;
	color: var(--c-text) !important;
	line-height: 1;
	text-decoration: none;
	transition: color var(--t), background-color var(--t);
}
.ha-item:hover, #cart.open > .btn.ha-item, #cart > .btn.ha-item:hover { background: var(--c-bg-soft) !important; color: var(--c-primary) !important; }
.ha-icon { position: relative; display: inline-block; font-size: 22px; line-height: 24px; }
.ha-icon .fa { font-size: 22px; }
.ha-label { font-size: 12px; font-weight: 600; color: var(--c-text-soft); }
.ha-item:hover .ha-label { color: var(--c-primary); }
.ha-badge {
	position: absolute;
	top: -6px; right: -10px;
	min-width: 18px; height: 18px;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--c-primary);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 18px;
	text-align: center;
	box-shadow: 0 0 0 2px #fff;
}
.ha-badge.is-empty { display: none; }
#cart { margin: 0; z-index: 1031; }
#cart > .btn > .fa { float: none; }

/* мини-корзина */
#cart .mini-cart {
	width: 380px;
	max-width: calc(100vw - 20px);
	padding: 0;
	margin-top: 10px;
	border: 1px solid var(--c-border);
	border-radius: var(--radius);
	box-shadow: var(--shadow-lg);
	overflow: hidden;
}
#cart .dropdown-menu li > div { min-width: 0; padding: 0; }
.mini-cart__items { max-height: 340px; overflow: auto; padding: 8px 0; }
.mini-cart__item { display: flex; align-items: center; gap: 12px; padding: 10px 16px; }
.mini-cart__item + .mini-cart__item { border-top: 1px solid var(--c-border); }
.mini-cart__img { flex: 0 0 56px; height: 56px; border-radius: var(--radius-sm); overflow: hidden; background: var(--c-bg-soft); display: flex; align-items: center; justify-content: center; }
.mini-cart__img img { max-width: 100%; max-height: 100%; }
.mini-cart__img--gift { font-size: 22px; color: var(--c-primary); }
.mini-cart__info { flex: 1 1 auto; min-width: 0; }
.mini-cart__name { display: block; font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--c-text); white-space: normal; }
.mini-cart__opts { font-size: 12px; color: var(--c-muted); margin-top: 2px; }
.mini-cart__opts span { display: block; }
.mini-cart__price { font-size: 14px; font-weight: 700; margin-top: 4px; }
.mini-cart__qty { color: var(--c-muted); font-weight: 500; }
.mini-cart__remove {
	flex: 0 0 28px; height: 28px;
	border: 0; border-radius: 50%;
	background: var(--c-bg-soft); color: var(--c-muted);
	transition: background-color var(--t), color var(--t);
}
.mini-cart__remove:hover { background: var(--c-primary-soft); color: var(--c-primary); }
.mini-cart__footer { padding: 14px 16px 16px; background: var(--c-bg-soft); border-top: 1px solid var(--c-border); }
.mini-cart__totals { width: 100%; font-size: 13px; margin-bottom: 12px; }
.mini-cart__totals td { padding: 2px 0; color: var(--c-text-soft); }
.mini-cart__totals tr:last-child td { font-size: 16px; font-weight: 800; color: var(--c-text); padding-top: 6px; }
.mini-cart__buttons { display: flex; gap: 8px; }
.mini-cart__buttons .btn { flex: 1 1 0; padding: 10px 12px; }
.mini-cart__empty { padding: 32px 20px; text-align: center; color: var(--c-muted); }
.mini-cart__empty .fa { font-size: 36px; color: var(--c-border-strong); margin-bottom: 10px; }
.mini-cart__empty p { margin: 0; }

/* строка категорий */
.category-strip { background: #fff; border-bottom: 1px solid var(--c-border); }
.category-strip__list {
	display: flex;
	gap: 4px;
	margin: 0; padding: 0;
	list-style: none;
	height: var(--strip-h);
	overflow-x: auto;
	scrollbar-width: none;
}
.category-strip__list::-webkit-scrollbar { display: none; }
.category-strip__list > li { flex: 0 0 auto; }
.category-strip__list a {
	position: relative;
	display: flex; align-items: center;
	height: 100%;
	padding: 0 12px;
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text);
	white-space: nowrap;
}
.category-strip__list > li:first-child a { padding-left: 0; }
.category-strip__list a:after {
	content: "";
	position: absolute;
	left: 12px; right: 12px; bottom: 0;
	height: 2px;
	background: var(--c-primary);
	transform: scaleX(0);
	transition: transform var(--t);
}
.category-strip__list > li:first-child a:after { left: 0; }
.category-strip__list a:hover { color: var(--c-primary); }
.category-strip__list a:hover:after { transform: scaleX(1); }
.category-strip__list a.is-accent { color: var(--c-primary); }

/* =========================================================
   МЕГА-МЕНЮ
   ========================================================= */
.mega-menu {
	position: absolute;
	left: 0; right: 0; top: 100%;
	background: #fff;
	border-top: 1px solid var(--c-border);
	box-shadow: 0 24px 40px -20px rgba(17, 17, 17, .3);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity .2s var(--ease), transform .2s var(--ease), visibility 0s linear .2s;
	z-index: 1032;
}
.mega-open .mega-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.mega-menu__inner {
	display: flex;
	max-height: calc(100vh - 140px);
	min-height: 360px;
}
.mega-menu__roots {
	flex: 0 0 270px;
	margin: 0; padding: 14px 0;
	list-style: none;
	border-right: 1px solid var(--c-border);
	overflow-y: auto;
}
.mega-menu__roots a {
	display: flex; align-items: center; justify-content: space-between;
	padding: 9px 16px 9px 4px;
	margin-right: 12px;
	border-radius: var(--radius-sm);
	font-size: 15px;
	font-weight: 600;
	color: var(--c-text);
	transition: background-color var(--t), color var(--t), padding-left var(--t);
}
.mega-menu__roots a .fa { color: var(--c-muted); font-size: 16px; }
.mega-menu__roots > li.active > a,
.mega-menu__roots > li > a:hover {
	background: var(--c-primary-soft);
	color: var(--c-primary);
	padding-left: 14px;
}
.mega-menu__roots > li.active > a .fa { color: var(--c-primary); }
.mega-menu__roots .mega-extra a { color: var(--c-primary); }
.mega-menu__panes { flex: 1 1 auto; padding: 22px 0 22px 32px; overflow-y: auto; }
.mega-pane { display: none; animation: megaIn .2s var(--ease); }
.mega-pane.active { display: block; }
@keyframes megaIn { from { opacity: 0; transform: translateX(6px); } to { opacity: 1; transform: none; } }
.mega-pane__head { display: flex; align-items: baseline; gap: 18px; margin-bottom: 18px; }
.mega-pane__title { font-size: 22px; font-weight: 800; letter-spacing: -.01em; color: var(--c-text); }
.mega-pane__all { font-size: 13px; font-weight: 600; color: var(--c-primary); }
.mega-pane__all:hover { color: var(--c-primary-hover); }
.mega-pane__empty { color: var(--c-text-soft); }
.mega-pane__empty a { color: var(--c-primary); font-weight: 600; }

.mega-pane__cols { columns: 3 200px; column-gap: 32px; }
.mega-col { break-inside: avoid; -webkit-column-break-inside: avoid; padding-bottom: 18px; }
.mega-col__title { display: inline-block; font-size: 15px; font-weight: 700; color: var(--c-text); margin-bottom: 6px; }
.mega-col__title:hover { color: var(--c-primary); }
.mega-col ul { list-style: none; margin: 0; padding: 0; }
.mega-col li a { display: inline-block; padding: 3px 0; font-size: 14px; color: var(--c-text-soft); }
.mega-col li a:hover { color: var(--c-primary); }

.mega-mask {
	position: fixed; inset: 0;
	top: 0; left: 0; right: 0; bottom: 0;
	background: rgba(17, 17, 17, .35);
	opacity: 0; visibility: hidden;
	transition: opacity .2s var(--ease), visibility 0s linear .2s;
	z-index: 1025;
}
.mega-open .mega-mask { opacity: 1; visibility: visible; transition-delay: 0s; }

/* =========================================================
   КАТЕГОРИИ СЛЕВА НА ГЛАВНОЙ
   ========================================================= */
#menu-home-helper { position: relative; margin-bottom: 24px; display: block; }
.home-cats {
	list-style: none;
	margin: 0; padding: 8px;
	background: #fff;
	border: 1px solid var(--c-border);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-sm);
}
.home-cats > li > a {
	display: flex; align-items: center; justify-content: space-between;
	padding: 9px 12px;
	border-radius: var(--radius-sm);
	font-size: 14px;
	font-weight: 600;
	color: var(--c-text);
}
.home-cats > li > a .fa { color: var(--c-muted); }
.home-cats > li:hover > a { background: var(--c-primary-soft); color: var(--c-primary); }
.home-cats > li:hover > a .fa { color: var(--c-primary); }
.home-flyout {
	display: none;
	position: absolute;
	top: 0; left: 100%;
	margin-left: 10px;
	width: 300%;
	min-height: 100%;
	padding: 24px 28px 8px;
	background: #fff;
	border: 1px solid var(--c-border);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	z-index: 20;
}
.home-flyout:before { content: ""; position: absolute; left: -12px; top: 0; bottom: 0; width: 12px; }
.home-cats > li.has-flyout:hover > .home-flyout { display: block; }
@media (max-width: 1199px) { .home-flyout { width: 290%; } }

/* =========================================================
   МОБИЛЬНОЕ МЕНЮ (DRAWER)
   ========================================================= */
.drawer {
	position: fixed;
	top: 0; bottom: 0; left: 0;
	width: 88vw; max-width: 380px;
	background: #fff;
	z-index: 1060;
	display: flex; flex-direction: column;
	transform: translateX(-102%);
	transition: transform .3s var(--ease), visibility 0s linear .3s;
	visibility: hidden;
}
.drawer-open .drawer { transform: none; visibility: visible; box-shadow: var(--shadow-lg); transition-delay: 0s; }
.drawer-mask {
	position: fixed; top: 0; left: 0; right: 0; bottom: 0;
	background: rgba(17, 17, 17, .45);
	z-index: 1055;
	opacity: 0; visibility: hidden;
	transition: opacity .3s var(--ease), visibility 0s linear .3s;
}
.drawer-open .drawer-mask { opacity: 1; visibility: visible; transition-delay: 0s; }
.drawer-open { overflow: hidden; }
.drawer__head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 0 8px 0 20px;
	height: 60px;
	border-bottom: 1px solid var(--c-border);
	flex: 0 0 auto;
}
.drawer__title { font-size: 18px; font-weight: 800; }
.drawer__close {
	width: 44px; height: 44px;
	border: 0; border-radius: 50%;
	background: none;
	font-size: 30px; line-height: 1;
	color: var(--c-text-soft);
}
.drawer__body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 24px; }
.drawer-cats, .drawer-sub, .drawer-links { list-style: none; margin: 0; padding: 0; }
.drawer-row { display: flex; align-items: stretch; border-bottom: 1px solid var(--c-border); }
.drawer-row > a { flex: 1 1 auto; padding: 14px 20px; font-size: 15px; font-weight: 600; color: var(--c-text); }
.drawer-row > a.is-accent { color: var(--c-primary); }
.drawer-toggle {
	flex: 0 0 52px;
	border: 0; border-left: 1px solid var(--c-border);
	background: none;
	color: var(--c-muted);
	font-size: 18px;
}
.drawer-toggle .fa { font-size: 18px; transition: transform var(--t); }
li.is-open > .drawer-row > .drawer-toggle .fa { transform: rotate(180deg); color: var(--c-primary); }
.drawer-sub { display: none; background: var(--c-bg-soft); }
.drawer-sub .drawer-row > a { padding-left: 34px; font-weight: 500; font-size: 14px; }
.drawer-sub .drawer-sub { background: #eeeef1; }
.drawer-sub .drawer-sub .drawer-row > a { padding-left: 48px; color: var(--c-text-soft); }
.drawer-links { margin-top: 16px; }
.drawer-links a { display: block; padding: 11px 20px; color: var(--c-text); font-weight: 500; }
.drawer-links a .fa { width: 20px; color: var(--c-muted); margin-right: 6px; }
.drawer-contacts { margin: 16px 20px 0; padding: 16px; background: var(--c-bg-soft); border-radius: var(--radius); }
.drawer-phone { font-size: 18px; font-weight: 800; color: var(--c-text); }
.drawer-phone .fa { color: var(--c-primary); margin-right: 6px; }
.drawer-schedule { font-size: 13px; color: var(--c-text-soft); margin-top: 4px; }

/* нижняя панель на телефоне */
.tabbar { display: none; }

/* =========================================================
   АДАПТИВ ШАПКИ
   ========================================================= */
@media (max-width: 1199px) {
	.header-phone { display: none; }
	.header-main__inner { gap: 14px; }
}
@media (max-width: 991px) {
	.header-burger { display: inline-flex; }
	.header-catalog, .category-strip, .mega-menu, .mega-mask { display: none !important; }
	#change_category { display: none; }
	#search .form-control { border-left: 2px solid var(--c-primary); border-radius: var(--radius) 0 0 var(--radius); }
	.home-cats-col { display: none; }
}
@media (max-width: 767px) {
	:root { --topbar-h: 0px; }
	#top { display: none; }
	.header-main__inner { flex-wrap: wrap; gap: 8px 10px; min-height: 0; padding: 10px 0; }
	#logo { flex: 1 1 auto; text-align: center; }
	#logo img { max-height: 40px; margin: 0 auto; }
	.header-main .search-box { order: 10; flex: 1 1 100%; }
	#search .form-control, #search-button { height: 42px; }
	.ha-account, .ha-wishlist { display: none; }
	.ha-label { display: none; }
	.ha-item, #cart > .btn.ha-item { min-width: 42px; padding: 8px; }
	#cart .mini-cart { position: fixed; top: 64px; left: 10px; right: 10px; width: auto; }

	body { padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); }
	.tabbar {
		display: flex;
		position: fixed;
		left: 0; right: 0; bottom: 0;
		height: calc(var(--tabbar-h) + env(safe-area-inset-bottom));
		padding-bottom: env(safe-area-inset-bottom);
		background: rgba(255, 255, 255, .97);
		border-top: 1px solid var(--c-border);
		z-index: 1040;
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
	}
	.tabbar a {
		position: relative;
		flex: 1 1 0;
		display: flex; flex-direction: column; align-items: center; justify-content: center;
		gap: 3px;
		font-size: 11px; font-weight: 600;
		color: var(--c-text-soft);
	}
	.tabbar a .fa { font-size: 21px; color: var(--c-text); }
	.tabbar a:active .fa, .tabbar a:hover .fa { color: var(--c-primary); }
	.tabbar .ha-badge { top: 5px; right: auto; left: 50%; margin-left: 4px; }
	#scroll-top-button { bottom: calc(var(--tabbar-h) + 16px); right: 14px; width: 42px; height: 42px; line-height: 42px; }
}

/* =========================================================
   УВЕДОМЛЕНИЯ (TOAST)
   ========================================================= */
.toast-wrap {
	position: fixed;
	right: 20px; bottom: 20px;
	z-index: 1070;
	display: flex; flex-direction: column; gap: 10px;
	width: 380px; max-width: calc(100vw - 24px);
}
.toast {
	position: relative;
	padding: 14px 40px 14px 16px;
	background: #fff;
	border: 1px solid var(--c-border);
	border-left: 4px solid #1f9d55;
	border-radius: var(--radius);
	box-shadow: var(--shadow-lg);
	font-size: 14px;
	line-height: 1.45;
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .25s var(--ease), transform .25s var(--ease);
}
.toast.is-shown { opacity: 1; transform: none; }
.toast--info { border-left-color: #2c6fbb; }
.toast .fa { color: #1f9d55; margin-right: 4px; }
.toast--info .fa { color: #2c6fbb; }
.toast a { color: var(--c-primary); font-weight: 600; }
.toast__actions { margin-top: 10px; }
.toast__actions .btn { color: #fff !important; }
.toast__close {
	position: absolute; top: 8px; right: 8px;
	width: 28px; height: 28px;
	border: 0; background: none;
	font-size: 22px; line-height: 1; color: var(--c-muted);
}
@media (max-width: 767px) {
	.toast-wrap { left: 12px; right: 12px; width: auto; bottom: calc(var(--tabbar-h) + 12px); }
}

/* =========================================================
   КАТАЛОГ: ПАНЕЛЬ СОРТИРОВКИ, ПОДКАТЕГОРИИ
   ========================================================= */
.subcat-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: -6px 0 22px; }
.subcat-chip {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 6px 16px;
	min-height: 40px;
	border: 1px solid var(--c-border-strong);
	border-radius: 999px;
	background: #fff;
	font-size: 14px; font-weight: 600;
	color: var(--c-text);
	transition: border-color var(--t), color var(--t), background-color var(--t);
}
.subcat-chip:hover { border-color: var(--c-primary); color: var(--c-primary); background: var(--c-primary-soft); }
.subcat-chip__img { width: 28px; height: 28px; margin-left: -10px; border-radius: 50%; overflow: hidden; background: var(--c-bg-soft); flex: 0 0 28px; }
.subcat-chip__img img { width: 100%; height: 100%; object-fit: cover; }

.catalog-toolbar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 16px;
	margin-bottom: 20px;
	padding: 10px 12px;
	background: var(--c-bg-soft);
	border-radius: var(--radius);
}
.catalog-toolbar__field { display: flex; align-items: center; gap: 8px; }
.catalog-toolbar__field label { margin: 0; font-size: 13px; font-weight: 500; color: var(--c-text-soft); white-space: nowrap; }
.catalog-toolbar select.form-control {
	height: 38px;
	padding: 0 34px 0 12px;
	border: 1px solid var(--c-border);
	border-radius: var(--radius-sm);
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%235f6676' stroke-width='1.6' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center;
	-webkit-appearance: none; -moz-appearance: none; appearance: none;
	font-size: 14px; font-weight: 600;
	color: var(--c-text);
	box-shadow: none;
	cursor: pointer;
	width: auto;
}
.catalog-toolbar select.form-control:focus { border-color: var(--c-primary); }
.catalog-toolbar__view { margin-left: auto; display: flex; gap: 4px; }
.catalog-toolbar__view .btn {
	width: 38px; height: 38px; padding: 0;
	border: 1px solid var(--c-border) !important;
	border-radius: var(--radius-sm) !important;
	background: #fff !important;
	color: var(--c-muted) !important;
	box-shadow: none !important;
}
.catalog-toolbar__view .btn .fa { font-size: 16px; }
.catalog-toolbar__view .btn.btn-danger,
.catalog-toolbar__view .btn:hover { color: var(--c-primary) !important; border-color: var(--c-primary) !important; }
.catalog-filter-btn {
	height: 38px;
	padding: 0 14px;
	border: 1px solid var(--c-border-strong);
	border-radius: var(--radius-sm);
	background: #fff;
	font-weight: 700;
}
.catalog-filter-btn .fa { color: var(--c-primary); margin-right: 4px; }
@media (min-width: 768px) { .catalog-filter-btn { display: none !important; } }
@media (max-width: 767px) {
	.catalog-toolbar { padding: 8px; gap: 8px; }
	.catalog-toolbar__field label { display: none; }
	.catalog-toolbar__field { flex: 1 1 auto; }
	.catalog-toolbar__field select.form-control { width: 100%; }
	.catalog-toolbar__view .btn { width: 36px; }
}

/* фильтры на телефоне — выезжающая панель */
.filters-panel__head { display: none; }
.filters-mask { display: none; }
@media (max-width: 767px) {
	#column-left.filters-panel,
	#category-column-left.filters-panel {
		display: block !important;
		position: fixed;
		top: 0; bottom: 0; left: 0;
		width: 88vw; max-width: 380px;
		padding: 0 14px 24px;
		background: #fff;
		overflow-y: auto;
		z-index: 1060;
		transform: translateX(-102%);
		transition: transform .3s var(--ease), visibility 0s linear .3s;
		visibility: hidden;
	}
	body.filters-open #column-left.filters-panel,
	body.filters-open #category-column-left.filters-panel { transform: none !important; visibility: visible; box-shadow: var(--shadow-lg); transition-delay: 0s; }
	.filters-panel #column-left { display: block !important; width: 100%; padding: 0; }
	.filters-panel__head {
		display: flex; align-items: center; justify-content: space-between;
		position: sticky; top: 0;
		margin: 0 -14px 14px; padding: 0 8px 0 18px;
		height: 58px;
		background: #fff;
		border-bottom: 1px solid var(--c-border);
		font-size: 18px; font-weight: 800;
		z-index: 2;
	}
	.filters-panel__head button { width: 44px; height: 44px; border: 0; background: none; font-size: 30px; line-height: 1; color: var(--c-text-soft); }
	.filters-mask {
		display: block;
		position: fixed; top: 0; left: 0; right: 0; bottom: 0;
		background: rgba(17, 17, 17, .45);
		z-index: 1055;
		opacity: 0; visibility: hidden;
		transition: opacity .3s var(--ease), visibility 0s linear .3s;
	}
	.filters-open .filters-mask { opacity: 1; visibility: visible; transition-delay: 0s; }
	.filters-open { overflow: hidden; }
}

/* =========================================================
   КАРТОЧКИ ТОВАРОВ
   ========================================================= */
.product-row { display: flex; flex-wrap: wrap; }
.product-row:before, .product-row:after { display: none; }
.product-row > .product-layout { display: flex; float: none; }
@media (max-width: 767px) {
	.product-row { margin-left: -6px; margin-right: -6px; }
	.product-row > .product-layout { padding-left: 6px; padding-right: 6px; }
}

.product-thumb {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-bottom: 24px;
	padding: 0;
	border: 1px solid var(--c-border);
	border-radius: var(--radius-lg);
	background: #fff;
	overflow: hidden;
	transition: box-shadow var(--t), border-color var(--t), transform var(--t);
}
@media (max-width: 767px) { .product-thumb { margin-bottom: 12px; border-radius: var(--radius); } }

.product-thumb .image {
	position: relative;
	aspect-ratio: var(--card-ratio);
	background: #fff;
	overflow: hidden;
	padding: 0 !important;
	min-height: 0 !important;
}
.product-thumb .image > a { display: block; width: 100%; height: 100%; }
.product-thumb .image img {
	width: 100%;
	height: 100%;
	max-width: none !important;
	object-fit: contain;
	margin: 0;
}
.product-thumb:hover .image img { transform: scale(1.05); }

/* скидка */
.product-thumb .sticker {
	position: absolute;
	left: 12px; top: 12px;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--c-primary);
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .02em;
	z-index: 2;
}
.product-thumb .sticker:after { display: none; }

/* избранное / сравнение на фото */
.pc-actions {
	position: absolute;
	top: 10px; right: 10px;
	display: flex; flex-direction: column; gap: 6px;
	z-index: 3;
}
.pc-icon {
	width: 36px; height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	color: var(--c-text);
	box-shadow: 0 2px 8px rgba(17, 17, 17, .12);
	opacity: 0;
	transform: translateX(6px);
	transition: opacity var(--t), transform var(--t), color var(--t), background-color var(--t);
}
.pc-icon .fa { font-size: 15px; }
.pc-icon:nth-child(2) { transition-delay: .03s; }
.product-thumb:hover .pc-icon { opacity: 1; transform: none; }
.pc-icon:hover { background: var(--c-primary); color: #fff; }
.pc-icon.is-active { color: var(--c-primary); opacity: 1; transform: none; }
.pc-icon.is-active:hover { color: #fff; }
@media (hover: none) {
	.pc-icon { opacity: 1; transform: none; }
	.pc-icon:nth-child(2) { display: none; }
}

.product-thumb .caption {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 14px 16px 16px !important;
	min-height: 0 !important;
}
.product-thumb .caption h4 {
	order: 2;
	height: 2.8em;
	margin: 0 0 12px;
	overflow: hidden;
	font-size: 14px;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.product-thumb .caption h4 a { display: inline; font-size: 14px !important; font-weight: 500 !important; line-height: 1.4 !important; color: var(--c-text); }
.product-thumb .caption h4 a:hover { color: var(--c-primary); }
.product-thumb .caption .price {
	order: 1;
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px;
	margin: 0 0 6px !important;
	font-size: 20px !important;
	font-weight: 800 !important;
	letter-spacing: -.01em;
	color: var(--c-text) !important;
}
.product-thumb .caption .price .price-new { color: var(--c-primary) !important; font-weight: 800; }
.product-thumb .caption .price .price-old { margin: 0 !important; font-size: 14px !important; font-weight: 500 !important; color: var(--c-muted) !important; text-decoration: line-through; }
.product-thumb .caption .price .price-tax { flex-basis: 100%; font-size: 12px !important; font-weight: 500 !important; color: var(--c-muted) !important; }
.product-thumb .caption .rating { order: 3; margin: -6px 0 10px; font-size: 12px; color: var(--c-border-strong); }
.product-thumb .caption .rating .fa { font-size: 12px; }
.product-thumb .caption .rating .active { color: var(--c-star); }
.product-thumb .caption .rating-count { margin-left: 4px; color: var(--c-muted); }
.product-thumb .caption .description { order: 4; font-size: 13px; color: var(--c-text-soft); }
.product-thumb .caption .btn-group { order: 5; margin-top: auto; }
.product-thumb .caption .btn-group > .btn {
	width: 100%;
	height: 42px;
	border-radius: var(--radius) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
}
.product-thumb .caption .btn-group > .btn .fa { margin-right: 6px; }
.product-thumb .caption .btn-group > .btn[disabled] { background: var(--c-bg-soft) !important; border-color: var(--c-border) !important; color: var(--c-muted) !important; opacity: 1; }

@media (min-width: 992px) {
	.product-thumb:hover { border-color: transparent; box-shadow: 0 16px 36px -14px rgba(17, 17, 17, .28); transform: translateY(-3px); }
	.product-layout .product-thumb:hover { transform: translateY(-3px); }
}
@media (max-width: 767px) {
	.product-thumb .caption { padding: 10px 10px 12px !important; }
	.product-thumb .caption .price { font-size: 16px !important; }
	.product-thumb .caption h4, .product-thumb .caption h4 a { font-size: 13px !important; }
	.product-thumb .caption .btn-group > .btn { height: 38px; font-size: 13px !important; padding: 0 6px; }
	.product-thumb .caption .btn-group > .btn span { display: none; }
	.product-thumb .caption .btn-group > .btn .fa { margin: 0; font-size: 16px; }
	.product-thumb .caption .btn-group > .btn[disabled] { font-size: 12px !important; white-space: normal; line-height: 1.2; }
	.pc-icon { width: 32px; height: 32px; }
	.product-thumb .sticker { left: 8px; top: 8px; padding: 3px 8px; font-size: 11px; }
}

/* вид «списком» */
.product-grid .description { display: none; }
.product-list .product-thumb { flex-direction: row; }
.product-list .product-thumb .image { flex: 0 0 240px; width: 240px; float: none !important; margin: 0 !important; }
.product-list .product-thumb .caption { padding: 22px 24px !important; }
.product-list .product-thumb .caption h4 { order: 1; height: auto; -webkit-line-clamp: 2; font-size: 17px; margin-bottom: 8px; }
.product-list .product-thumb .caption h4 a { font-size: 17px !important; font-weight: 700 !important; }
.product-list .product-thumb .caption .price { order: 3; font-size: 22px !important; margin-top: 4px !important; }
.product-list .product-thumb .caption .rating { order: 2; margin: 0 0 8px; }
.product-list .product-thumb .caption .description { order: 4; display: block; max-width: 680px; }
.product-list .product-thumb .caption .btn-group { order: 5; margin-top: 12px; width: auto !important; }
.product-list .product-thumb .caption .btn-group > .btn { width: auto; padding: 0 28px; }
@media (max-width: 767px) {
	.product-list .product-thumb .image { flex-basis: 120px; width: 120px; }
	.product-list .product-thumb .caption { padding: 12px !important; }
	.product-list .product-thumb .caption .description { display: none; }
	.product-list .product-thumb .caption h4, .product-list .product-thumb .caption h4 a { font-size: 14px !important; }
	.product-list .product-thumb .caption .price { font-size: 17px !important; }
}

/* пагинация */
.catalog-pager { margin-top: 8px; }
.catalog-pager p { color: var(--c-muted); font-size: 13px; }
.pagination { margin: 16px 0; display: flex; flex-wrap: wrap; gap: 6px; }
.pagination > li > a,
.pagination > li > span {
	float: none;
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 40px;
	padding: 0 10px;
	margin: 0;
	border: 1px solid var(--c-border) !important;
	border-radius: var(--radius-sm) !important;
	color: var(--c-text);
	font-weight: 600;
	background: #fff;
}
.pagination > li > a:hover { border-color: var(--c-primary) !important; color: var(--c-primary); background: #fff; }
.pagination > .active > a, .pagination > .active > span,
.pagination > .active > a:hover, .pagination > .active > span:hover {
	background: var(--c-primary) !important;
	border-color: var(--c-primary) !important;
	color: #fff;
}

/* описание категории */
.category-description {
	margin: 32px 0 8px;
	padding: 24px 28px;
	background: var(--c-bg-soft);
	border-radius: var(--radius-lg);
	color: var(--c-text-soft);
	line-height: 1.65;
}
.category-description:after { content: ""; display: table; clear: both; }
.category-description__img { float: left; max-width: 160px; margin: 0 20px 10px 0; border-radius: var(--radius); }
@media (max-width: 767px) { .category-description { padding: 18px; } .category-description__img { max-width: 100px; } }

/* =========================================================
   БЛОКИ ТОВАРОВ (Рекомендуемые, Новинки, Хиты, Акции, Похожие)
   ========================================================= */
.box-modern { position: relative; margin-bottom: 36px; }
.box-modern .box-heading { display: flex; align-items: center; min-height: 40px; margin-bottom: 16px; padding-right: 100px; }
.box-modern .box-heading h3 { margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -.02em; }
.box-carousel { margin: 0 -8px; }
.box-carousel .product-item { padding: 0 8px; height: 100%; }
.box-carousel .owl-wrapper { display: flex !important; }
.box-carousel .owl-item { display: flex; float: none; }
.box-carousel .owl-item > .product-item { display: flex; width: 100%; }
.box-carousel .product-thumb { margin-bottom: 6px; }
.box-carousel .product-thumb:hover { transform: none; box-shadow: 0 10px 26px -14px rgba(17, 17, 17, .3); }
.box-carousel .owl-controls { position: absolute; top: -56px; right: 8px; margin: 0; }
.box-carousel .owl-buttons { display: flex; gap: 6px; }
.box-carousel .owl-buttons > div {
	width: 40px; height: 40px;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid var(--c-border);
	border-radius: 50%;
	background: #fff;
	color: var(--c-text);
	cursor: pointer;
	transition: border-color var(--t), color var(--t), background-color var(--t);
}
.box-carousel .owl-buttons > div .fa { font-size: 20px; }
.box-carousel .owl-buttons > div:hover { border-color: var(--c-primary); background: var(--c-primary); color: #fff; }
.box-carousel .owl-buttons > div.disabled { opacity: .35; cursor: default; }
.box-carousel.no-owl { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
.box-carousel.no-owl .product-item { flex: 0 0 240px; scroll-snap-align: start; }
@media (max-width: 767px) {
	.box-modern .box-heading h3 { font-size: 20px; }
	.box-carousel { margin: 0 -6px; }
	.box-carousel .product-item { padding: 0 6px; }
}

/* =========================================================
   ГЛАВНАЯ
   ========================================================= */
.common-home .slideshow { border-radius: var(--radius-lg); margin-bottom: 24px; }
@media (min-width: 992px) {
	.common-home .slideshow .nivoSlider { left: auto; margin-left: 0; width: auto; }
}

/* =========================================================
   СТРАНИЦА ТОВАРА — лёгкая доводка
   ========================================================= */
.product-product .thumbnails .main-image,
.product-product .thumbnail { border-radius: var(--radius-lg); border-color: var(--c-border); }
.product-tabs > li > a { font-size: 15px; font-weight: 700; }

/* =========================================================
   ПОДВАЛ
   ========================================================= */
.site-footer { margin-top: 56px; }
.footer-main {
	background: var(--c-bg-soft);
	border-top: 1px solid var(--c-border);
	padding: 48px 0 20px;
	font-size: 14px;
}
.footer-col { margin-bottom: 24px; }
.footer-col h5 {
	margin: 0 0 16px;
	font-size: 13px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--c-text);
}
.footer-col li { margin: 0 0 9px; }
.footer-col a { color: var(--c-text-soft); }
.footer-col a:hover { color: var(--c-primary); }
.footer-social { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.footer-social a {
	width: 40px; height: 40px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--c-border);
	border-radius: 50%;
	background: #fff;
	color: var(--c-text);
	transition: background-color var(--t), color var(--t), border-color var(--t);
}
.footer-social a .fa { font-size: 17px; }
.footer-social a:hover { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.footer-share-label { margin: 0 0 6px; font-size: 13px; color: var(--c-muted); }
.footer-bottom { background: var(--c-bg-soft); border-top: 1px solid var(--c-border); }
.footer-bottom__inner {
	display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
	gap: 10px 24px;
	padding-top: 16px; padding-bottom: 16px;
	font-size: 13px;
	color: var(--c-muted);
}
.footer-bottom .pay-icons { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.footer-bottom .pay-icons img { max-height: 26px; width: auto; }
#footer-map + .footer-main { border-top: 0; }
#footer-map { background: var(--c-bg-soft); }
#footer-map .glass:before { background: linear-gradient(to right, var(--c-bg-soft) 0%, rgba(246,246,248,0) 50%, var(--c-bg-soft) 100%); }
#footer-map .glass:after { background: linear-gradient(to bottom, #fff 0%, rgba(246,246,248,0) 100%); }
@media (max-width: 767px) {
	.site-footer { margin-top: 36px; }
	.footer-main { padding: 32px 0 8px; }
	.footer-bottom__inner { justify-content: center; text-align: center; }
}

/* кнопка «наверх» */
#scroll-top-button { width: 44px; height: 44px; line-height: 44px; background: #fff; color: var(--c-text); border: 1px solid var(--c-border); box-shadow: var(--shadow); }
#scroll-top-button .fa { font-size: 22px; line-height: 42px; }
#scroll-top-button:hover { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }

/* общие мелочи */
.dropdown-menu { border-radius: var(--radius); border-color: var(--c-border); box-shadow: var(--shadow-lg); }
.form-control { border-radius: var(--radius-sm); }
.btn-primary { box-shadow: none; }

/* «В корзину» в блоках товаров — как в каталоге */
.box-carousel .product-thumb .caption .btn-group > .btn-addtocart {
	background: var(--c-primary) !important;
	border: 1px solid var(--c-primary) !important;
	color: #fff !important;
}
.box-carousel .product-thumb .caption .btn-group > .btn-addtocart:hover {
	background: var(--c-primary-hover) !important;
	border-color: var(--c-primary-hover) !important;
}
.box-carousel .product-thumb .caption .btn-group { display: flex; width: 100%; }

#cart .mini-cart .mini-cart__footer { padding: 14px 16px 16px; }
#cart .mini-cart table { margin-bottom: 12px; }
.product-list .product-thumb .caption .btn-group { display: block !important; }
.product-list .product-thumb .caption .btn-group > .btn { flex: none !important; width: auto !important; min-width: 200px; }
@media (min-width: 768px) { .toast-wrap { bottom: 84px; } }

/* скрытый текст закладок: что бы ни было внутри (badge и т.п.) — не показывать */
#wishlist-total, #wishlist-total * { display: none !important; }

/* карточки компактнее по высоте */
.product-thumb .caption { padding: 12px 14px 14px !important; }
.product-thumb .caption .price { margin-bottom: 4px !important; }
.product-thumb .caption h4 { margin-bottom: 10px; }
.product-thumb .caption .rating { margin: -4px 0 8px; }
.product-thumb .caption .btn-group > .btn { height: 38px; }
.product-thumb .image img { padding: 8px; }

/* «Купить в 1 клик» в карточках каталога */
.product-thumb .caption .btn-group { flex-direction: column; gap: 6px; }
.product-thumb .caption .btn-group > .btn-quick-order-category {
	height: 34px !important;
	background: transparent !important;
	border: 1px solid var(--c-border-strong) !important;
	color: var(--c-text) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
}
.product-thumb .caption .btn-group > .btn-quick-order-category:hover {
	border-color: var(--c-primary) !important;
	color: var(--c-primary) !important;
	background: var(--c-primary-soft) !important;
}
.product-list .product-thumb .caption .btn-group > .btn-quick-order-category { margin-left: 8px !important; }
@media (max-width: 767px) {
	.product-thumb .caption .btn-group > .btn-quick-order-category { height: 32px !important; font-size: 12px !important; padding: 0 4px; white-space: normal; line-height: 1.1; }
}

/* карточка компактнее (квадратное фото) */
.product-thumb .image img { padding: 4px; }
.product-thumb .caption { padding: 10px 12px 12px !important; }
.product-thumb .caption h4 { margin-bottom: 8px; }
.product-thumb .caption .btn-group > .btn-addtocart { height: 36px; }

.product-thumb .caption .btn-group > .btn-quick-order-category .fa { color: var(--c-primary); margin-right: 4px; }
