/* =========== © 2026 Centroarts - https://m1r.ru =========== */

:root {
	--headbar-pad: 14px;
	--cathead-pad-y: var(--sect-vpad);
	--cathead-pad-x: var(--g-sect);
	--cathead-c-text: var(--c-text);
}

/* maincat-head */
.maincat-head-box {
	--mcat-box-rd: var(--rd-box);
	--mcat-box-pad: 20px;
	--mcat-box-gap: 20px;
	--mcat-box-c: hsl(var(--c-text-white));
	--mcat-box-bg-c: hsl(var(--c-dark));

	position: relative; z-index: 1;
	background-color: var(--mcat-box-bg-c);

	border-radius: var(--mcat-box-rd);
	padding: var(--mcat-box-pad);
	color: var(--mcat-box-c);
}
.maincat-head-bg { position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; user-select: none; }
.maincat-head-bg * { border-radius: inherit; }
@media (min-width: 992px) {
	.maincat-head-box {
		border-top-left-radius: 0;
		border-top-right-radius: 0;
	}
}
@media (max-width: 767px) {
	.maincat-head {
		padding-left: 0; padding-right: 0;
	}
	.maincat-head-box {
		--mcat-box-pad: 20px var(--wrp-p);
		--mcat-box-rd: var(--rd-big);
		border-bottom-left-radius: 0; border-bottom-right-radius: 0;
	}
}
.maincat-head-tools {
	--mctools-bg: hsla(var(--c-dark),0.5);
	--mctools-bg-filter: blur(8px);
	--mctools-rd: 22px;
	--mctools-sw: 0 0 0 0.5px hsla(var(--c-text-white),0.2);
	--mctools-с: var(--mcat-box-c);

	display: flex; gap: 8px; margin-bottom: var(--mcat-box-gap);
}
.maincat-head-tools .right { margin-left: auto; }
.maincat-head .heading { position: relative; padding: 14px 0; }
.maincat-head .heading-page { position: absolute; opacity: .6; }

.tabs-round {
	background-color: var(--mctools-bg);
	backdrop-filter: var(--mctools-bg-filter); -webkit-backdrop-filter: var(--mctools-bg-filter);
	border-radius: var(--mctools-rd); padding: 2px; gap: 2px;
	box-shadow: var(--mctools-sw);
}
.tabs-round .btn { --btn-c-text: var(--mctools-с); --btn-fs: var(--fs-1); opacity: .7; }
.tabs-round .btn.active { opacity: 1; --btn-sw: inset 0 0 6px 1px hsla(var(--c-text-white),0.5); }

.tagset-list { display: flex; gap: var(--g-gap); }
.tagset-item {
	display: flex; align-items: center; padding: 4px; gap: 4px; border-radius: var(--rd-box);
	box-shadow: inset 0 0 0 1px var(--c-border); user-select: none;
}
@media (min-width: 992px) {
	.tabs-round .btn:not(.active):hover { opacity: .85; }
	.tagset-item { transition: box-shadow .2s ease; }
	.tagset-item:hover { background-color: hsl(var(--c-body)); box-shadow: inset 0 0 0 1.5px hsl(var(--c-primary)); }
}
.tagset-item .cover { width: 36px; height: 36px; border-radius: 14px; }
.tagset-item span { padding: 6px 8px; }

.maincat-head-tools .right .btn {
	backdrop-filter: var(--mctools-bg-filter); -webkit-backdrop-filter: var(--mctools-bg-filter);
	--btn-rd: var(--mctools-rd);
	--btn-h: 44px;
	--btn-pad: 10px;
	--btn-sw: var(--mctools-sw);
	--btn-c-bg: var(--mctools-bg);
	--btn-c-text: var(--mctools-с);
}

.maincat-head-menu { margin-top: var(--g-sect); }



/* HeadBar - OLD */
.m1r-headbar-in {
	display: flex; justify-content: center; align-items: center;
}

@media (min-width: 992px) {
	.m1r-headbar ~ .m1r-container { padding-top: var(--headbar-h); }
	.m1r-headbar { position: sticky; z-index: 101; top: 0; width: 100%; height: 0; pointer-events: none; }
	.m1r-headbar::after {
		content: ""; position: absolute; top: 0; left: var(--sidebar-lw); right: var(--sidebar-rw); bottom: auto; height: var(--headbar-h);
		background-image: linear-gradient(180deg, hsl(var(--c-body)) 0%, hsla(var(--c-body),0) 100%);
	}
	.m1r-headbar-in { height: var(--headbar-h); padding-top: var(--headbar-pad); padding-bottom: var(--headbar-pad); }
}

/* Cathead */
.m1r-cathead { margin-top: var(--cathead-pad-y); margin-bottom: var(--cathead-pad-y); }
.m1r-cathead.cathead-bg { margin-top: 0; margin-bottom: 0; }
.m1r-cathead.cathead-bg .wrp {
	padding-top: var(--cathead-pad-y);
	padding-bottom: var(--cathead-pad-y);
}

.m1r-cathead .link-back .btn { --btn-c-text: hsl(var(--cathead-c-text)); }

/* HBTNS Tools */
.hbtn-bar + .m1r-cathead .wrp { padding-top: var(--headbar-h); }
.hbtn-bar { position: sticky; z-index: 100; top: 0; height: 0; pointer-events: none; }
.hbtn-bar .wrp {
	display: flex; align-items: center; justify-content: space-between;
	padding-top: var(--headbar-pad); padding-bottom: var(--headbar-pad);
	height: var(--headbar-h);
}
.hbtn {
	display: flex; align-items: center; justify-content: center; gap: 4px;
	border-radius: 22px; position: relative; z-index: 1; pointer-events: all;
	height: 44px; min-width: 44px; width: 44px; padding: 10px; line-height: 24px;
	user-select: none; color: var(--hbtn-text);
}
.hbtn::after {
	content: ""; position: absolute; inset: 2px;
	background-color: var(--hbtn-bg); box-shadow: var(--hbtn-sw);
	border-radius: inherit; z-index: -1;
	backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
	transition: transform .15s ease;
}
.hbtn:hover::after { transform: scale(1.03); }
.hbtn:active::after { transform: scale(0.98); }

/* QSearch */
.qsd { flex: 1 1 auto; pointer-events: all; position: relative; }
.qsd .search-f { z-index: 1; }
.search-select-drop {
	position: absolute; z-index: 99; top: 100%; padding: 16px;
	background-color: hsl(var(--dropdown-bg)); margin-top: 8px; border-radius: var(--dropdown-rd);
	box-shadow: var(--dropdown-sw);
	opacity: 0; transform: translateY(-4px); transition: opacity .2s ease, transform .2s ease;
}
.qsd.open .search-select-drop { opacity: 1; transform: translateY(0); }
.search-select-drop .search-tag-list { margin-bottom: 0; }