@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Oswald:wght@500;600;700&display=swap');

/* =========================================================
   TACTICOOL — сучасний дизайн
   Палітра: графітовий + мисливський помаранчевий + бетонний сірий
   Структура та назви класів збережені, змінено лише вигляд
   ========================================================= */

:root {
	--font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	--font-display: 'Oswald', 'Arial Narrow', 'Roboto Condensed', Impact, sans-serif;
	--body-background-color: #f3f4f5;
	--body-font-size: 15px;
	--button-font-size: 14px;
	--input-font-size: 15px;
	--button-padding: 10px 22px;
	--input-padding: 11px 14px;

	--popup-background-color: #ffffff;
	--white-background-color: #ffffff;
	--main-text-color: #1c1f22;
	--hard-light-color: #f3f4f5;
	--light-color: #dde0e3;
	--medium-color: #9ca1a6;
	--light-dark-color: #545a60;
	--hard-dark-color: #1c1f22;

	--graphite: #3b4046;
	--graphite-dark: #24282c;
	--coyote: #b9a074;
	--accent: #d14a16;
	--accent-dark: #a63a0e;

	--light-fail-color: #fdf0ed;
	--dark-fail-color: #c0392b;

	--radius: 6px;
	--shadow-sm: 0 1px 2px rgba(28, 31, 34, .08);
	--shadow-md: 0 8px 24px rgba(28, 31, 34, .14);
	--shadow-pop: 0 24px 70px rgba(12, 14, 16, .45);
	--ease: .2s ease;
}

* { -webkit-tap-highlight-color: transparent; }

body {
	font-size: var(--body-font-size);
	font-family: var(--font-family);
	line-height: 1.5;
	color: var(--main-text-color);
	margin: 0;
	background: var(--body-background-color);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { font-family: var(--font-display); letter-spacing: .01em; line-height: 1.2; }
h1 { font-weight: 600; font-size: 28px; padding: 4px 0; margin: 0 0 12px; }

img { max-width: 100%; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}

/* ---------- ЗАГАЛЬНІ ЕЛЕМЕНТИ ---------- */

div.fon {
	display: none;
	background: rgba(12, 14, 16, .72);
	width: 100%;
	height: 100%;
	position: fixed;
	z-index: 400;
	top: 0;
	left: 0;
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

input, select, textarea { outline: none; width: 100%; }

input[type="button"] {
	width: unset;
	font-size: var(--button-font-size);
	font-family: var(--font-display);
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: var(--button-padding);
	background: var(--graphite-dark);
	color: #fff;
	border: 1px solid var(--graphite-dark);
	cursor: pointer;
	border-radius: var(--radius);
	transition: background var(--ease), border-color var(--ease), color var(--ease), transform var(--ease);
}

input[type="button"]:hover {
	background: var(--graphite);
	border-color: var(--graphite);
	color: #fff;
}

input[type="button"]:active { transform: translateY(1px); }

input[type="text"], input[type="password"], textarea, select {
	font-size: var(--input-font-size);
	font-family: var(--font-family);
	padding: var(--input-padding);
	box-sizing: border-box;
	color: var(--hard-dark-color);
	background: #fff;
	border: 1px solid var(--light-color);
	border-radius: var(--radius);
	transition: border-color var(--ease), box-shadow var(--ease);
}

input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
	border-color: var(--graphite);
	box-shadow: 0 0 0 3px rgba(59, 64, 70, .18);
}

input.fail, textarea.fail, select.fail {
	background: var(--light-fail-color);
	border: 1px solid var(--dark-fail-color);
}

a { text-decoration: none; color: var(--graphite); transition: color var(--ease); }
a:hover { color: var(--accent); }

div.relative { position: relative; }

div.delivercent {
	display: flex;
	flex-direction: column;
	margin: 5px;
	flex: 1 1 49%;
}

div.incenter {
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

div.nothingfound { color: var(--light-dark-color); font-size: 90%; text-align: center; margin: 24px auto; }
div.textfail { color: var(--dark-fail-color); font-size: 90%; padding: 2px; }
span.star { color: var(--dark-fail-color); }

/* ---------- ВСПЛИВАЮЧІ ВІКНА ---------- */

div.answerform, div.callmeform, div.loginform, div.oneclickform, div.questform, div.cartform, div.bigproductform {
	position: fixed;
	background: var(--popup-background-color);
	border-radius: 10px;
	border-top: 4px solid var(--accent);
	box-shadow: var(--shadow-pop);
	box-sizing: border-box;
	display: none;
	z-index: 500;
	max-width: 96%;
}

div.answerform { padding: 24px; width: 500px; }
div.callmeform, div.loginform { padding: 30px; width: 500px; }
div.oneclickform, div.questform { padding: 24px; width: 500px; }
div.cartform { padding: 16px; width: 800px; }
div.bigproductform { padding: 20px; }

div.answer_main, div.callme_main, div.login_main, div.oneclick_main, div.quest_main { width: 100%; }

div.answer_closeline, div.callme_closeline, div.login_closeline, div.oneclick_closeline, div.quest_closeline { height: 40px; }
div.answer_close, div.callme_close, div.login_close, div.oneclick_close, div.quest_close { float: right; }

div.answer_title { text-align: center; padding: 20px; }

div.callme_title, div.login_title, div.oneclick_title, div.quest_title {
	font-family: var(--font-display);
	text-align: center;
	font-size: 22px;
	font-weight: 600;
	padding: 10px;
	margin-bottom: 10px;
}

div.oneclick_title, div.quest_title { border-bottom: 2px solid var(--light-color); text-transform: none; }

div.callme_line { margin: 6px 0; }
div.login_block { margin-bottom: 10px; }
div.login_forget { margin-top: 3px; float: right; cursor: pointer; color: var(--graphite); }
div.login_forget:hover { color: var(--accent); }
div.oneclick_itemline, div.quest_itemline { margin: 12px 0; }
div.oneclick_line, div.quest_line { margin-bottom: 8px; }
div.oneclick_button, div.quest_button { text-align: center; }

div.oneclick_itemblockimg, div.quest_itemblockimg { display: inline-block; }
div.oneclick_itemblockimg img, div.quest_itemblockimg img {
	max-width: 150px;
	max-height: 100px;
	border: 1px solid var(--light-color);
	border-radius: var(--radius);
	background: #fff;
	padding: 8px;
}
div.oneclick_itemblockname, div.quest_itemblockname { display: inline-block; vertical-align: top; padding-left: 20px; }
div.oneclick_itemname, div.quest_itemname { font-family: var(--font-display); font-size: 18px; }

div.login_titlesocial { text-align: center; font-size: 100%; color: var(--light-dark-color); padding: 10px; }
div.login_titlesocialin { text-align: center; }
div.login_socialfb, div.login_socialod, div.login_socialgg, div.login_socialvk { display: inline-block; padding: 5px; }
div.login_socialfb input, div.login_socialod input, div.login_socialgg input, div.login_socialvk input {
	width: 50px; height: 50px; border: 0; font-size: 0; color: transparent; padding: 0;
	background-repeat: no-repeat; background-color: transparent;
	transition: transform var(--ease);
}
div.login_socialfb input:hover, div.login_socialod input:hover, div.login_socialgg input:hover, div.login_socialvk input:hover { transform: translateY(-2px); background-color: transparent; }
div.login_socialfb input { background-image: url('/themes/images/f.png'); }
div.login_socialod input { background-image: url('/themes/images/od.png'); }
div.login_socialgg input { background-image: url('/themes/images/g.png'); }
div.login_socialvk input { background-image: url('/themes/images/vk.png'); }

/* ---------- РОЗМІТКА ---------- */

div.allheader {
	width: 100%;
	display: flex;
	flex-direction: column;
	background: #fff;
	border-top: 4px solid var(--accent);
	border-bottom: 1px solid var(--light-color);
}

div.overhead, div.head {
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
	padding: 6px 12px;
	box-sizing: border-box;
}

div.head { padding-top: 12px; padding-bottom: 12px; }

div.overheadinfo { margin: 0 auto; display: flex; justify-content: space-between; flex-direction: row; }

div.headinfo { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; }

@media all and (max-width: 380px) { div.headinfo { flex-direction: column; } }

div.headcolumnlogo { display: flex; flex-direction: column; padding: 5px; flex: 1 1 1%; }
@media all and (max-width: 790px) { div.headcolumnlogo { flex-basis: 100%; text-align: center; } }

div.headcolumn1 { display: flex; flex-direction: column; padding: 5px; flex: 0 1 1%; }
div.headcolumn2 { display: flex; flex-direction: column; padding: 5px; flex: 1 1 15%; }
div.headcolumn3 { display: flex; flex-direction: column; padding: 5px; flex: 0 1 1%; min-width: 180px; }

@media all and (min-width: 599px) and (max-width: 790px) { div.headcolumn3 { min-width: 250px; } }

div.headcolumn3row1, div.headcolumn3row2 { text-align: right; }
@media all and (max-width: 699px) { div.headcolumn3row2 { text-align: center; } }

div.underhead {
	width: 100%;
	margin: 0 auto;
	background: var(--graphite-dark);
	box-sizing: border-box;
}

div.underheadinfo { margin: 0 auto; max-width: 1600px; display: flex; justify-content: space-between; flex-wrap: wrap; }
div.underheadright { text-align: right; }

div.allcentermain { margin: 0 auto; max-width: 1600px; width: 100%; }
div.allcenterblock { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; }

div.leftmain { padding: 5px 10px 5px 5px; margin: 5px; flex: 1 1 200px; }
div.centermain { padding: 5px 10px; margin: 5px; flex: 1 1 70%; min-width: 0; }
div.rightmain { padding: 5px 5px 5px 10px; margin: 5px; flex: 1 1 200px; }

@media all and (max-width: 800px) { div.leftmain, div.rightmain { display: none; } }

div.allfooter {
	background: var(--hard-dark-color);
	border-top: 4px solid var(--graphite);
	width: 100%;
	box-sizing: border-box;
	color: #c3c7cb;
	margin-top: 40px;
}


div.allfooterinfo { padding: 28px 12px; max-width: 1600px; margin: 0 auto; }

div.overfooter { display: flex; flex-wrap: wrap; }
@media all and (max-width: 600px) { div.overfooter { flex-direction: column; } }

div.footer_1, div.footer_2, div.footer_3, div.footer_4 { flex: 1 1 25%; padding: 8px 12px; box-sizing: border-box; }
div.footer_1 a, div.footer_2 a, div.footer_3 a, div.footer_4 a { color: #c3c7cb; }
div.footer_1 a:hover, div.footer_2 a:hover, div.footer_3 a:hover, div.footer_4 a:hover { color: var(--coyote); }
div.footer_1 ul, div.footer_2 ul, div.footer_3 ul, div.footer_4 ul { list-style: none; padding: 0; line-height: 2; }
div.footer_title {
	font-family: var(--font-display);
	font-size: 18px;
	font-weight: 500;
	margin: 5px 0 14px;
	color: #fff;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--accent);
	display: inline-block;
}

/* ---------- РОЗДІЛИ У ШАПЦІ ---------- */

div.topchapters { display: flex; flex-direction: row; flex-wrap: wrap; gap: 4px; }
div.topchapters_separator { display: none; }

div.topchapter, div.topactivechapter { position: relative; cursor: pointer; padding: 6px 12px; border-radius: var(--radius); transition: background var(--ease); }
div.topchapter:hover { background: var(--hard-light-color); }

a.topchapter_link, a.topactivechapter_link {
	font-size: 14px;
	font-weight: 500;
	min-height: 10px;
	align-items: center;
	display: flex;
	justify-content: center;
}
a.topchapter_link { color: var(--light-dark-color); }
a.topactivechapter_link { color: var(--accent); }
a.topchapter_link:hover { color: var(--hard-dark-color); }

div.topchapter:hover div.topchapters_submenu, div.topactivechapter:hover div.topchapters_submenu { display: block; }

div.topchapters_submenu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: var(--popup-background-color);
	z-index: 100;
	border: 1px solid var(--light-color);
	border-radius: var(--radius);
	box-shadow: var(--shadow-md);
	overflow: hidden;
}

div.topchapter_submenu { min-width: 170px; padding: 8px 14px; transition: background var(--ease); }
div.topchapter_submenu:hover { background: var(--hard-light-color); }
div.topchapter_submenu a { color: var(--light-dark-color); font-size: 14px; white-space: nowrap; }
div.topchapter_submenu:hover a { color: var(--accent); }

div.mobiletopchapters { display: none; }

@media all and (max-width: 699px) {
	div.topchapters { display: none; }
	div.mobiletopchapters { position: relative; display: block; width: 36px; height: 36px; margin: 4px 0; }
}

div.mobiletopchapters #seeChapters {
	width: 36px; height: 36px; cursor: pointer; font-size: 0;
	background: url("/themes/images/menu.png") no-repeat center;
	border: 0; padding: 0;
}

div.menuchapters_name { color: var(--hard-dark-color); }

div.menuchapters {
	display: none;
	position: fixed;
	height: 100%;
	width: 0;
	top: 0;
	left: 0;
	z-index: 1000;
	max-height: 100%;
	overflow-y: auto;
	background: var(--popup-background-color);
	border-right: 3px solid var(--accent);
	box-shadow: var(--shadow-pop);
}

div.menuchapters_block { padding: 12px; text-align: left; border-bottom: 1px solid var(--light-color); }

/* Колонкові списки: розділи, категорії */

div.columnchapters_main, div.columncategorys_main { margin-bottom: 14px; }

div.columnchapters_title, div.columncategorys_title, div.columnarticles_title, div.columngallery_title, div.columncomments_title,
div.columnbrands_title, div.columnitems_title, div.columnpolls_title, div.centerarticles_title, div.centercomments_title,
div.slidergallery_title, div.slidercomments_title, div.sliderbrand_title, div.slidertopitem_title, div.slideractitem_title,
div.slidernewitem_title, div.sliderlasitem_title, div.slidersameitem_title, div.feedback_title, div.account_title {
	font-family: var(--font-display);
	font-size: 20px;
	font-weight: 600;
	color: var(--hard-dark-color);
	padding: 4px 0 4px 12px;
	margin-bottom: 14px;
	border-left: 4px solid var(--accent);
	border-bottom: 0;
}

div.columnchapter0, div.columncategory0 { padding: 8px 10px; cursor: pointer; border-radius: var(--radius); transition: background var(--ease), padding var(--ease); }
div.columnchapter1, div.columncategory1 { padding: 6px 10px 6px 22px; cursor: pointer; border-radius: var(--radius); transition: background var(--ease); }
div.columnchapter2, div.columncategory2 { padding: 6px 10px 6px 36px; cursor: pointer; border-radius: var(--radius); transition: background var(--ease); }

div.columnchapter0 a, div.columncategory0 a { color: var(--light-dark-color); font-weight: 500; }
div.columnchapter1 a, div.columncategory1 a, div.columnchapter2 a, div.columncategory2 a { color: var(--light-dark-color); font-size: 14px; }

div.columnchapter0:hover, div.columnchapter1:hover, div.columnchapter2:hover,
div.columncategory0:hover, div.columncategory1:hover, div.columncategory2:hover { background: #e6e8ea; }

div.columnchapter0:hover a, div.columnchapter1:hover a, div.columnchapter2:hover a,
div.columncategory0:hover a, div.columncategory1:hover a, div.columncategory2:hover a { color: var(--hard-dark-color); }

div.columnchapteractive0, div.columnchapteractive1, div.columnchapteractive2,
div.columncategoryactive0, div.columncategoryactive1, div.columncategoryactive2 {
	cursor: pointer; background: #e6e8ea; border-radius: var(--radius); border-left: 3px solid var(--accent);
}
div.columnchapteractive0, div.columncategoryactive0 { padding: 8px 10px; }
div.columnchapteractive1, div.columncategoryactive1 { padding: 6px 10px 6px 22px; }
div.columnchapteractive2, div.columncategoryactive2 { padding: 6px 10px 6px 36px; }
div.columnchapteractive0 a, div.columnchapteractive1 a, div.columnchapteractive2 a,
div.columncategoryactive0 a, div.columncategoryactive1 a, div.columncategoryactive2 a { color: var(--hard-dark-color); font-weight: 600; }

/* Картки розділів/категорій у центрі */

div.centerchapters, div.centercategorys { margin: 16px 0; text-align: center; }
div.centerchapters_in, div.centercategorys_in { justify-content: center; display: flex; flex-wrap: wrap; text-align: center; }

div.centerchapter, div.centercategory {
	display: flex;
	flex-direction: column;
	margin: 8px;
	padding: 10px;
	box-sizing: border-box;
	flex: 0 1 calc(25% - 16px);
	background: #fff;
	border: 1px solid var(--light-color);
	border-radius: 8px;
	transition: border-color var(--ease), box-shadow var(--ease), transform var(--ease);
}
div.centerchapter:hover, div.centercategory:hover { border-color: var(--graphite); box-shadow: var(--shadow-md); transform: translateY(-2px); }

@media all and (min-width: 600px) and (max-width: 1199px) { div.centerchapter, div.centercategory { flex-basis: calc(33% - 16px); } }
@media all and (max-width: 599px) { div.centerchapter, div.centercategory { flex-basis: calc(100% - 16px); } }

div.centerchapter_topname, div.centercategory_topname { display: none; }

div.centerchapter_img, div.centercategory_img, div.centerarticle_img, div.slidergallery_img, div.slideritem_img {
	width: 100%; height: 200px; overflow: hidden; margin-bottom: 10px;
	align-items: center; justify-content: center; text-align: center; display: flex;
	border-radius: var(--radius);
}
div.centerchapter_imgin, div.centercategory_imgin, div.centerarticle_imgin, div.slidergallery_imgin, div.slideritem_imgin { width: 100%; }
div.centerchapter_imgin img, div.centercategory_imgin img, div.centerarticle_img img, div.slidergallery_imgin img, div.slideritem_imgin img {
	max-width: 100%; max-height: 200px; border: 0;
}

@media all and (max-width: 599px) {
	div.centerchapter_img, div.centercategory_img, div.centerarticle_img, div.slidergallery_img, div.slideritem_img, div.gallery_img, div.pagebrand_img { height: auto; }
	div.centerchapter_imgin img, div.centercategory_imgin img, div.centerarticle_imgin img, div.slidergallery_imgin img, div.slideritem_imgin img, div.gallery_imgin img, div.pagebrand_imgin img { max-height: 100%; }
}

div.centerchapter_infoblock, div.centercategory_infoblock { vertical-align: top; text-align: center; }
div.centerchapter_bottomname, div.centercategory_bottomname { padding: 8px 0; text-align: center; }
div.centerchapter_bottomname a, div.centercategory_bottomname a { font-family: var(--font-display); font-size: 18px; font-weight: 500; color: var(--hard-dark-color); }
div.centerchapter_bottomname a:hover, div.centercategory_bottomname a:hover { color: var(--accent); }
div.centerchapter_info { margin: 5px 0; font-size: 90%; color: var(--light-dark-color); }
div.centerchapter_button { text-align: center; }
div.centercategory_info { margin: 5px 0; }
div.centercategory_button { text-align: center; display: none; }
div.centersubcategory_main { text-align: center; }
div.centersubcategory_info { padding-bottom: 6px; }
div.centersubcategory_info a { color: var(--light-dark-color); font-size: 90%; }
div.centersubcategory_info a:hover { color: var(--accent); }

/* ---------- ПОШУК ---------- */

div.search { position: relative; max-width: 560px; margin: 0 auto; }
div.search form { display: flex; flex-direction: row; position: relative; align-items: center; margin: 0; }
div.search_input { position: relative; max-width: 100%; width: 100%; }
div.search_input input {
	width: 100%;
	max-width: 560px;
	border-radius: 999px;
	padding: 12px 52px 12px 20px;
	font-size: 15px;
	background: var(--hard-light-color);
	border: 1px solid var(--light-color);
}
div.search_input input:focus { background: #fff; }

div.search_button { position: absolute; right: 10px; }
div.search_button input, div.search_button input:hover {
	padding: 0; width: 24px; height: 24px; font-size: 0; border: 0; border-radius: 0;
	background: url("/themes/images/icon_search.png") no-repeat center; transform: none;
}
div.search_button input:hover { background-image: url("/themes/images/icon_search_hover.png"); }

div.dropdownsearch { position: absolute; z-index: 500; width: 100%; }
div.dropdownsearchfon {
	position: relative; left: 0; margin-top: 6px;
	background: var(--popup-background-color);
	border: 1px solid var(--light-color);
	border-radius: 8px;
	box-shadow: var(--shadow-md);
	overflow: hidden;
}
div.searchrow { display: flex; flex-direction: row; cursor: pointer; align-items: center; transition: background var(--ease); }
div.searchrow:hover { background: #e6e8ea; }
div.dropdownimage { text-align: center; padding: 6px; flex-basis: 56px; }
div.dropdownimage img { max-width: 50px; max-height: 50px; }
div.dropdownname { text-align: left; color: var(--hard-dark-color); padding: 6px; font-size: 14px; flex-basis: 70%; }
div.dropdownprice { text-align: right; color: var(--accent); font-weight: 600; font-size: 14px; padding: 6px 12px; flex-grow: 1; }

/* ---------- НОВИНИ ---------- */

div.columnarticle_separator, div.centerarticle_topname, div.pagearticle_topname { display: none; }

div.columnarticle { text-align: left; border-bottom: 1px solid var(--light-color); padding: 12px 0; display: flex; flex-direction: column; }
div.columnarticle_imgleft img, div.columnarticle_imgright img { max-width: 100%; border-radius: var(--radius); }
div.columnarticle_info { vertical-align: top; }
div.columnarticle_name { padding: 4px 0; }
div.columnarticle_name a { color: var(--hard-dark-color); font-weight: 500; }
div.columnarticle_name a:hover { color: var(--accent); }
div.columnarticle_date, div.centerarticle_date, div.pagearticle_date { color: var(--medium-color); font-size: 13px; }
div.columnarticle_seeall { text-align: center; margin: 12px 0; }

div.centerarticles_main { margin: 16px 0; }
div.centerarticle_wrap, div.pagearticles { justify-content: center; display: flex; flex-wrap: wrap; text-align: center; }

div.centerarticle {
	margin: 8px;
	display: flex;
	flex-direction: column;
	flex: 0 1 calc(33% - 16px);
	box-sizing: border-box;
	background: #fff;
	border: 1px solid var(--light-color);
	border-radius: 8px;
	overflow: hidden;
	transition: box-shadow var(--ease), border-color var(--ease);
}
div.centerarticle:hover { box-shadow: var(--shadow-md); border-color: var(--graphite); }
@media all and (min-width: 500px) and (max-width: 890px) { div.centerarticle { flex-basis: calc(50% - 16px); } }
@media all and (max-width: 499px) { div.centerarticle { flex-basis: calc(100% - 16px); } }

div.centerarticle_img { margin-bottom: 0; border-radius: 0; }
div.centerarticle_info { text-align: center; margin-top: 10px; padding: 0 14px 14px; }
div.centerarticle_name { text-align: left; margin: 8px 0; font-family: var(--font-display); font-size: 18px; }
div.centerarticle_name a { color: var(--hard-dark-color); }
div.centerarticle_name a:hover { color: var(--accent); }
div.centerarticle_short { margin: 5px 0; text-align: left; color: var(--light-dark-color); font-size: 14px; }
div.centerarticle_date { padding: 5px 0; text-align: left; }
div.centerarticle_seeall { text-align: center; }

div.pagearticle {
	margin: 8px 0;
	display: flex;
	flex-direction: row;
	text-align: center;
	flex-basis: 100%;
	background: #fff;
	border: 1px solid var(--light-color);
	border-radius: 8px;
	padding: 12px;
}
@media (max-width: 500px) { div.pagearticle { flex-direction: column; } }
div.pagearticle_img { min-width: 180px; }
@media (max-width: 500px) { div.pagearticle_img { width: 98%; margin: 0 auto; } }
div.pagearticle_imgin { width: 100%; }
div.pagearticle_imgin img { max-width: 180px; max-height: 150px; border-radius: var(--radius); }
@media (max-width: 500px) { div.pagearticle_imgin img { max-width: 100%; max-height: 100%; } }
div.pagearticle_info { text-align: left; padding-left: 16px; flex: 1 1 auto; }
div.pagearticle_name { margin-bottom: 4px; font-family: var(--font-display); font-size: 19px; }
div.pagearticle_name a { color: var(--hard-dark-color); }
div.pagearticle_name a:hover { color: var(--accent); }
div.pagearticle_short { margin: 4px 0; font-size: 14px; color: var(--light-dark-color); }

div.articleback { margin: 10px 0; }
div.articlename { margin-bottom: 20px; }
div.articledate { padding: 8px 0; color: var(--medium-color); }

/* ---------- ХЛІБНІ КРИХТИ ---------- */

div.breads { margin: 0 auto; padding: 12px 0; font-size: 13px; color: var(--medium-color); }
div.linkicon { display: inline-block; vertical-align: middle; padding: 0 8px; }
div.link, div.linkactive { display: inline-block; vertical-align: middle; }
div.link a, div.linkactive a { font-size: 13px; color: var(--light-dark-color); }
div.linkactive a { color: var(--hard-dark-color); font-weight: 500; }
div.link a:hover, div.linkactive a:hover { color: var(--accent); text-decoration: underline; }

/* ---------- ПАГІНАЦІЯ ---------- */

div.paging { align-items: center; margin: 16px auto; display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; gap: 4px; }
div.pagingbutton { vertical-align: middle; }

div.pagingall, div.pagingnow {
	min-width: 36px;
	box-sizing: border-box;
	text-align: center;
	cursor: pointer;
	margin: 0 2px;
	border-radius: var(--radius);
	padding: 8px 12px;
	font-weight: 500;
	transition: background var(--ease), color var(--ease), border-color var(--ease);
}
div.pagingall { background: #fff; border: 1px solid var(--light-color); color: var(--light-dark-color); }
div.pagingall a { color: var(--light-dark-color); display: block; }
div.pagingall:hover { background: var(--graphite-dark); border-color: var(--graphite-dark); }
div.pagingall:hover a { color: #fff; }
div.pagingnow { border: 1px solid var(--accent); color: #fff; background: var(--accent); }

/* ---------- ЗАМОВИТИ ДЗВІНОК ---------- */

div.callme_block, div.callme_button { margin-top: 6px; }

/* ---------- СЛАЙДЕР ---------- */

div.sliderimg { margin: 0 auto; }
div.advbanner { position: absolute; }
div.sliderarrows { margin: 0 auto; position: relative; }

div.sliderleft { position: absolute; z-index: 100; margin-top: 10%; left: 15px; }
div.sliderright { position: absolute; z-index: 100; right: 15px; margin-top: 10%; }

div.sliderleft input, div.sliderright input {
	width: 40px; height: 40px; font-size: 0; padding: 0; border: 0; border-radius: 50%;
	background-repeat: no-repeat; background-position: center; background-color: rgba(255, 255, 255, .85);
	box-shadow: var(--shadow-sm);
	transition: background-color var(--ease), transform var(--ease);
}
div.sliderleft input { background-image: url("/themes/images/arrow_left.png"); }
div.sliderright input { background-image: url("/themes/images/arrow_right.png"); }
div.sliderleft input:hover { background-image: url("/themes/images/arrow_left_hover.png"); background-color: #fff; transform: scale(1.08); }
div.sliderright input:hover { background-image: url("/themes/images/arrow_right_hover.png"); background-color: #fff; transform: scale(1.08); }

div.sliderbuttons { position: relative; top: -30px; height: 0; z-index: 100; text-align: center; }
div.sliderbutton { display: inline-block; }
div.slidernext, div.slidernextact { width: 12px; height: 12px; margin: 4px; font-size: 0; cursor: pointer; border-radius: 20px; transition: width var(--ease), background var(--ease); }
div.slidernext { background: rgba(255, 255, 255, .8); border: 1px solid var(--light-dark-color); }
div.slidernextact { background: var(--accent); border: 1px solid var(--accent); width: 26px; }

/* ---------- ГАЛЕРЕЯ ---------- */

div.pagegallery { justify-content: center; display: flex; flex-wrap: wrap; text-align: center; }

div.gallery { display: flex; flex-direction: column; margin: 8px; flex: 0 1 calc(25% - 16px); }
@media all and (min-width: 600px) and (max-width: 1199px) { div.gallery { flex-basis: calc(33% - 16px); } }
@media all and (max-width: 599px) { div.gallery { flex-basis: calc(100% - 16px); } }

div.gallery_img { width: 100%; height: 140px; overflow: hidden; margin-bottom: 10px; align-items: center; justify-content: center; text-align: center; display: flex; border-radius: var(--radius); }
div.gallery_imgin { width: 100%; }
div.gallery_imgin img { max-width: 100%; max-height: 140px; border: 0; }
div.gallery_text { text-align: center; padding-top: 6px; }

/* Слайдери: галерея, виробники, товари */

div.slidergallerys { position: relative; padding-bottom: 10px; margin-top: 20px; }
div.sliderbrands, div.slidertopitems, div.slideractitems, div.slidernewitems, div.sliderlasitems, div.slidersameitems, div.slideraccessoriesitems, div.slidercomplectitems { position: relative; }

div.slidergallery_info, div.sliderbrand_info, div.slidertopitem_info, div.slideractitem_info, div.slidernewitem_info,
div.sliderlasitem_info, div.slidersameitem_info, div.slideraccessoriesitem_info, div.slidercomplectitem_info, div.smallitem_info {
	display: flex; flex-direction: row; align-items: center;
}

div.slidergallery_left, div.sliderbrand_left, div.slideritem_left, div.smallitem_left, div.slidercomment_left { padding-right: 6px; box-sizing: border-box; }
div.slidergallery_right, div.sliderbrand_right, div.slideritem_right, div.smallitem_right, div.slidercomment_right { padding-left: 6px; box-sizing: border-box; }

div.slidergallery_center, div.sliderbrand_center, div.slidertopitem_center, div.slideractitem_center, div.slidernewitem_center,
div.sliderlasitem_center, div.slidersameitem_center, div.slideraccessoriesitem_center, div.slidercomplectitem_center, div.smallitem_center { width: 100%; }

div.slidergallery_contin, div.sliderbrand_contin, div.slidertopitem_contin, div.slideractitem_contin, div.slidernewitem_contin,
div.sliderlasitem_contin, div.slidersameitem_contin, div.slideraccessoriesitem_contin, div.slidercomplectitem_contin, div.smallitem_contin {
	display: flex; flex-direction: row;
}

div.slidergallery_main, div.sliderbrand_main, div.slidertopitem_main, div.slideractitem_main, div.slidernewitem_main,
div.sliderlasitem_main, div.slidersameitem_main, div.slideraccessoriesitem_main, div.slidercomplectitem_main, div.smallitem_main { vertical-align: top; }

div.slideraccessoriesitem_title, div.slidercomplectitem_title { display: none; }

/* Ширини елементів слайдерів (залежать від JS, значення збережені) */
div.slidergallery { margin: 5px; width: 278px; }
div.sliderbrand { margin: 5px; width: 278px; display: flex; flex-direction: column; }
div.slideritem { margin: 5px; width: 278px; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--light-color); border-radius: 8px; padding: 10px; box-sizing: border-box; transition: border-color var(--ease), box-shadow var(--ease); }
div.slideritem:hover { border-color: var(--graphite); box-shadow: var(--shadow-md); }

@media all and (min-width: 1400px) and (max-width: 1500px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 306px; } }
@media all and (min-width: 1300px) and (max-width: 1399px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 288px; } }
@media all and (min-width: 1200px) and (max-width: 1299px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 266px; } }
@media all and (min-width: 1000px) and (max-width: 1199px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 274px; } }
@media all and (min-width: 900px) and (max-width: 999px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 252px; } }
@media all and (min-width: 799px) and (max-width: 899px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 302px; } }
@media all and (min-width: 650px) and (max-width: 798px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 288px; } }
@media all and (max-width: 649px) { div.slidergallery, div.sliderbrand, div.slideritem { width: 228px; } }

div.slidergallery_topname, div.slideritem_topname { min-height: 40px; display: none; }
div.slidergallery_bottomname { text-align: center; }
div.slidergallery_bottomname a:hover { color: var(--accent); }
div.slidergallery_seeall, div.sliderbrand_seeall, div.slideritem_seeall { text-align: center; margin: 14px 0; }

div.sliderbrand_topname, div.sliderbrand_bottomname { min-height: 40px; display: none; justify-content: center; text-align: center; }
div.sliderbrand_img { width: 100%; height: 120px; overflow: hidden; margin-bottom: 10px; align-items: center; justify-content: center; text-align: center; display: flex; }
div.sliderbrand_imgin { width: 100%; }
div.sliderbrand_imgin img { max-width: 100%; max-height: 120px; border: 0; filter: grayscale(1); opacity: .75; transition: filter var(--ease), opacity var(--ease); }
div.sliderbrand_imgin img:hover { filter: none; opacity: 1; }

div.slideritem_bottomname { height: 5.6em; align-items: flex-start; justify-content: center; text-align: center; display: flex; overflow: hidden; font-size: 14px; line-height: 1.4; }
div.slideritem_bottomname a { color: var(--hard-dark-color); font-weight: 500; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
div.slideritem_bottomname a:hover { color: var(--accent); }
div.slideritem_buyinfo { display: flex; flex-direction: column; justify-content: space-between; align-items: center; }
div.slideritem_price { text-align: center; font-family: var(--font-display); font-size: 22px; font-weight: 600; margin: 8px 0; }
div.slideritem_oldprice { display: inline-block; color: var(--medium-color); font-size: 80%; font-weight: 400; text-decoration: line-through; padding-right: 12px; }
div.slideritem_actprice { display: inline-block; text-align: left; color: var(--accent); font-size: 100%; font-weight: 600; }
div.slideritem_buy { text-align: center; }

/* Галерея в колонці */
div.columngallery { border-bottom: 1px solid var(--light-color); padding: 12px 0; }
div.columngallery_imgleft, div.columngallery_imgright { width: 100%; }
div.columngallery_imgleft img, div.columngallery_imgright img { max-width: 100%; border-radius: var(--radius); }
div.columngallery_seeall { text-align: center; margin: 12px 0; }

/* ---------- ВІДГУКИ ---------- */

div.addcomment, div.addfaq { min-width: 50%; max-width: 500px; margin: 30px auto 0; }
div.addcomment_title { text-align: center; color: var(--hard-dark-color); }
div.addcommenttitle, div.addfaqtitle { padding: 10px 0; font-family: var(--font-display); font-size: 22px; text-align: center; margin: 0 auto 10px; }
div.addcomment_line { margin: 10px 0; }
div.addfaq_line { margin: 10px 0; }
div.addcomment_button, div.addfaq_button { text-align: center; }
div.addcomment_vote { margin-top: 10px; display: flex; align-items: center; }
div.addcomment_votename { padding-right: 20px; vertical-align: middle; }
div.addcomment_voterate { vertical-align: middle; }

div.itemactvote { background: url('/themes/images/star1.png'); width: 30px; height: 30px; cursor: pointer; }
div.itemvote { background: url('/themes/images/star.png'); width: 30px; height: 30px; cursor: pointer; }

div.pagecomment {
	padding: 14px 16px;
	margin: 10px auto;
	background: #fff;
	border: 1px solid var(--light-color);
	border-left: 4px solid var(--graphite);
	border-radius: var(--radius);
}
div.pagecomment_info { display: flex; flex-direction: row; justify-content: space-between; }
@media all and (max-width: 500px) { div.pagecomment_info { flex-direction: column; } }
div.pagecomment_name { color: var(--hard-dark-color); font-weight: 600; margin-bottom: 4px; }
div.pagecomment_vote, div.columncomment_vote, div.centercomment_vote, div.slidercomment_vote { display: flex; flex-direction: row; margin: 3px 0; }
div.pagecomment_date, div.columncomment_date, div.centercomment_date, div.slidercomment_date { color: var(--medium-color); font-size: 13px; }

div.columncomment { text-align: left; border-bottom: 1px solid var(--light-color); padding: 12px 0; }
div.columncomment_name, div.columncomment_item, div.columncomment_text, div.columncomment_date { margin: 2px 0; }
div.columncomment_name { font-weight: 600; }
div.columncomment_seeall { margin-top: 10px; text-align: center; }

div.centercomments { vertical-align: top; display: flex; flex-wrap: wrap; }
div.centercomments_title { width: 100%; box-sizing: border-box; }
div.centercomment { display: flex; flex-direction: column; margin: 8px; padding: 14px 16px; background: #fff; border: 1px solid var(--light-color); border-radius: 8px; flex: 0 1 calc(50% - 16px); box-sizing: border-box; }
@media all and (max-width: 599px) { div.centercomment { flex-basis: calc(100% - 16px); } }
div.centercomment_name { font-weight: 600; }
div.centercomment_text, div.slidercomment_text { font-size: 15px; margin: 6px 0; }
div.centercomment_seeall { width: 100%; }

div.slidercomments { vertical-align: top; }
div.slidercomment { opacity: 1; padding: 20px; box-sizing: border-box; }
div.slidercomments_info { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
@media all and (max-width: 500px) { div.slidercomments_info { flex-direction: column; } }
div.slidercomment_name { font-weight: 600; }
div.slidercomment_seeall { text-align: center; margin-top: 10px; }

/* ---------- FAQ ---------- */

div.page_faq { padding: 10px; margin: 10px auto; }
div.pagefaq_info { display: flex; flex-direction: row; justify-content: space-between; }
div.pagefaq_name { font-weight: 600; }
div.pagefaq_text { font-size: 16px; margin: 8px 0; }
div.pagefaq_date, div.pagefaq_answerdate { color: var(--medium-color); font-size: 13px; }
div.pagefaq_answerinfo { display: flex; flex-direction: row; justify-content: space-between; }
@media all and (max-width: 500px) { div.pagefaq_answerinfo { flex-direction: column; } }
div.pagefaq_answername { padding-top: 20px; font-weight: 600; }
div.pagefaq_answertext { margin: 6px 0; background: #e6e8ea; padding: 12px 16px 12px 24px; font-size: 15px; border-radius: var(--radius); border-left: 4px solid var(--graphite); }

/* ---------- ФОРМА ЗВ'ЯЗКУ ---------- */

div.feedback_main { vertical-align: top; padding: 14px; box-sizing: border-box; background: #fff; border: 1px solid var(--light-color); border-radius: 8px; }
div.feedback_titlein { text-align: left; }
div.feedback_line { margin: 12px 0; }
div.feedback_blockname, div.feedback_blockparam { vertical-align: top; }
div.feedback_button { text-align: center; }

/* ---------- ГОЛОСУВАННЯ ---------- */

div.columnpolls { margin-top: 20px; padding: 5px; }
div.columnpoll_infoin { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
div.columnpoll_radio { flex-basis: 26px; vertical-align: middle; }
div.columnpoll_radio input { width: unset; accent-color: var(--accent); }
div.columnpoll_name { flex-basis: 99%; vertical-align: middle; padding: 5px 0; }
div.columnpoll_votes { flex-basis: 1px; vertical-align: middle; font-weight: 600; }
div.columnpoll_line { background: var(--light-color); border-radius: 999px; overflow: hidden; }
div.columnpoll_linein { background: var(--accent); height: 10px; border-radius: 999px; }

/* ---------- РЕЄСТРАЦІЯ ---------- */

div.registration_main { max-width: 800px; min-width: 50%; margin: 20px auto 0; background: #fff; border: 1px solid var(--light-color); border-radius: 10px; padding: 20px; box-sizing: border-box; }
div.registration_title { padding: 10px 0; text-align: right; margin: 0 auto 10px; color: var(--medium-color); }
div.registration_line { display: table; width: 100%; }
div.registration_blockname { display: table-cell; width: 25%; padding: 6px; vertical-align: middle; }
div.registration_blockparam { display: table-cell; padding: 6px; vertical-align: middle; }
@media all and (max-width: 899px) {
	div.registration_blockname { display: none; }
	div.registration_blockparam { display: block; padding: 4px; margin: 3px; }
}
div.registration_button { text-align: center; margin: 20px; }

/* ---------- АВТОРИЗАЦІЯ ---------- */

div.buttonsusers { margin-top: 5px; }
div.buttonsusers_main, div.polesusers_button { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
div.buttonsusers_button2, div.buttonsusers_button4, div.polesusers_button2 { margin-left: 5px; }
div.polesusers_enter1, div.polesusers_enter2 { margin: 4px 0; }
div.polesusers_forget span { cursor: pointer; color: var(--graphite); }
div.polesusers_forget span:hover { color: var(--accent); }

/* ---------- АКАУНТ, ВКЛАДКИ ---------- */

div.userwelcome { padding: 10px 0; font-family: var(--font-display); font-size: 24px; text-align: center; margin: 0 auto 10px; border-bottom: 1px solid var(--light-color); }

div.accounttabs, div.notemenu, div.producttabs {
	margin: 6px 0;
	border-bottom: 2px solid var(--light-color);
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
@media all and (max-width: 700px) { div.accounttabs, div.producttabs { flex-direction: column; } }

div.accounttabposition, div.notetabposition, div.producttabposition { vertical-align: bottom; position: relative; margin: 0 2px 0 0; top: 2px; }

div.accounttab, div.notetab, div.producttab, div.accountactivetab, div.notetabact, div.productactivetab {
	padding: 12px 20px;
	cursor: pointer;
	display: inline-block;
	vertical-align: bottom;
	font-family: var(--font-display);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: .02em;
	border: 0;
	border-bottom: 3px solid transparent;
	border-radius: var(--radius) var(--radius) 0 0;
	transition: background var(--ease), color var(--ease), border-color var(--ease);
}
div.accounttab, div.notetab, div.producttab { background: transparent; color: var(--light-dark-color); }
div.accounttab:hover, div.notetab:hover, div.producttab:hover { background: #e6e8ea; color: var(--hard-dark-color); }
div.accountactivetab, div.notetabact, div.productactivetab { background: #fff; color: var(--hard-dark-color); border-bottom-color: var(--accent); }
div.notetab a { color: var(--light-dark-color); }
div.notetab:hover a, div.notetabact a { color: var(--hard-dark-color); }

@media all and (max-width: 899px) {
	div.accounttabposition, div.notetabposition, div.producttabposition { display: block; top: 0; }
	div.accounttab, div.notetab, div.producttab, div.accountactivetab, div.notetabact, div.productactivetab { text-align: center; display: block; padding: 10px; border-radius: 0; }
}

div.accounttabinfo, div.notetabinfo { padding: 20px 8px; }
div.producttabinfo { padding: 12px 4px; }

div.account_userdata { display: flex; flex-direction: row; justify-content: space-between; }
div.account_userdatacolumn1, div.account_userdatacolumn2 { flex: 1 1 50%; padding: 10px; }
@media all and (max-width: 899px) {
	div.account_userdata { flex-direction: column; }
	div.account_userdatacolumn1, div.account_userdatacolumn2 { flex-basis: 100%; padding: 10px 0; }
}
div.account_button { text-align: center; margin-top: 20px; }
div.account_blockname { color: var(--light-dark-color); font-size: 14px; padding: 10px 0 2px; }

div.account_orders { margin: 20px auto 0; }
div.account_orders table, div.account_ordertable table { width: 100%; }
div.account_orders table td { padding: 8px; text-align: center; }
div.account_order { border: 1px solid var(--light-color); border-radius: 8px; padding: 12px; background: #fff; margin-bottom: 10px; }
div.ordernumber { display: inline-block; font-family: var(--font-display); font-size: 18px; }
div.orderinfo { padding: 5px; text-align: right; float: right; margin-bottom: 10px; display: inline-block; }
span.seemoreorder { cursor: pointer; margin: 10px 0; color: var(--graphite); }
span.seemoreorder:hover { color: var(--accent); }
div.product_favordel { margin: 5px 0; }

/* ---------- МОВИ ---------- */

div.languages { display: flex; flex-direction: row; }
div.languageact { padding: 3px 8px; margin: 3px; border: 1px solid var(--graphite); border-radius: var(--radius); background: var(--graphite); color: #fff; }
div.language { padding: 3px 8px; margin: 3px; }

/* ---------- КАТЕГОРІЇ У ШАПЦІ ---------- */

div.topcategorys { display: flex; flex-direction: row; }
@media all and (max-width: 650px) { div.topcategorys { display: none; } }
div.topcategorys_separator { display: none; }

div.topcategory, div.topactivecategory { position: relative; cursor: pointer; padding: 6px 12px; transition: background var(--ease); }
div.topactivecategory { background: var(--graphite); }
div.topcategory:hover { background: var(--graphite); }

a.topcategory_link, a.topactivecategory_link { color: #fff; min-height: 32px; align-items: center; display: flex; justify-content: center; font-weight: 500; }
a.topcategory_link:hover, a.topactivecategory_link:hover { color: #fff; }

div.topcategory:hover div.topcategorys_submenu, div.topactivecategory:hover div.topcategorys_submenu { display: block; }

div.topcategorys_submenu {
	display: none; position: absolute; top: 100%; left: 0;
	background: #fff; z-index: 100;
	border: 1px solid var(--light-color); border-radius: 0 0 var(--radius) var(--radius);
	box-shadow: var(--shadow-md);
}
div.topcategory_submenu { min-width: 170px; padding: 8px 14px; transition: background var(--ease); }
div.topcategory_submenu:hover { background: #e6e8ea; }
div.topcategory_submenu a { color: var(--light-dark-color); white-space: nowrap; }
div.topcategory_submenu:hover a { color: var(--accent); }

div.topcategorys_adapt { flex-direction: column; display: none; }
@media all and (max-width: 650px) { div.topcategorys_adapt { display: flex; } }
.topcategory_adapt { text-align: center; cursor: pointer; padding: 12px 5px; border-bottom: 1px solid rgba(255, 255, 255, .15); }
.topcategory_adapt a { color: #fff; font-size: 17px; }

/* ---------- ВИРОБНИКИ ---------- */

div.columnbrand_separator { height: 1px; background: var(--light-color); width: 100%; }
div.columnbrand { text-align: center; margin: 18px 0; }
div.columnbrand_imgleft, div.columnbrand_imgright, div.columnbrand_info { display: inline-block; vertical-align: top; }
div.columnbrand_imgleft { width: 100%; }
div.columnbrand_imgleft img, div.columnbrand_imgright img { max-width: 100%; }
div.columnbrand_name { display: none; }
div.columnbrand_seeall { text-align: center; }

div.pagebrands { margin: 20px 0; text-align: center; display: flex; justify-content: space-between; flex-wrap: wrap; }
@media all and (max-width: 400px) { div.pagebrands { flex-direction: column; } }

div.pagebrand {
	margin: 8px; padding: 12px; display: flex; flex-direction: column; flex: 0 1 calc(25% - 16px);
	background: #fff; border: 1px solid var(--light-color); border-radius: 8px; box-sizing: border-box;
	transition: border-color var(--ease), box-shadow var(--ease);
}
div.pagebrand:hover { border-color: var(--graphite); box-shadow: var(--shadow-md); }
@media all and (min-width: 600px) and (max-width: 1199px) { div.pagebrand { flex-basis: calc(33% - 16px); } }
@media all and (max-width: 599px) { div.pagebrand { flex-basis: calc(100% - 16px); } }

div.pagebrand_img { width: 100%; height: 120px; overflow: hidden; margin-bottom: 10px; align-items: center; justify-content: center; text-align: center; display: flex; }
div.pagebrand_imgin { width: 100%; }
div.pagebrand_imgin img { max-width: 100%; max-height: 120px; border: 0; }
div.pagebrand_info { text-align: left; margin-top: 20px; }
div.pagebrand_topname, div.pagebrand_name, div.pagebrand_short { display: none; }

div.brandname h1 { padding: 5px 0 10px; text-align: center; margin: 0 auto 10px; }
div.brandtext { margin-bottom: 20px; }
div.brandcat { margin: 10px 0; max-width: 400px; }

/* ---------- СОРТУВАННЯ ТА ВИГЛЯД ---------- */

div.sortviewblock { background: #fff; border: 1px solid var(--light-color); border-radius: 8px; margin-bottom: 12px; }
div.sortviewblockin { display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 8px 14px; }
@media all and (max-width: 500px) { div.sortviewblockin { flex-direction: unset; flex-wrap: wrap; } }

div.sorting { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
@media all and (max-width: 500px) { div.sorting { margin-bottom: 6px; } }
div.sorting_title { color: var(--light-dark-color); }
div.sorting_sortingcellin { display: flex; flex-direction: row; justify-content: space-between; align-items: center; margin: 0 8px; }
div.sortby, div.sortbyact { cursor: pointer; }
div.sortby:hover { color: var(--accent); }
div.sortbyact { color: var(--accent); font-weight: 600; }
div.sortarrowact { display: inline-block; }

div.perpage_main { position: relative; padding-left: 20px; padding-right: 5px; vertical-align: middle; }
@media all and (max-width: 500px) { div.perpage_main { padding-left: 0; } }
#perPageChange { padding: 5px 8px; }

div.viewblock_main { flex-grow: 1; text-align: right; position: relative; padding-left: 20px; vertical-align: middle; }
@media all and (max-width: 500px) { div.viewblock_main { padding-left: 0; text-align: left; } }

div.viewblock_table, div.viewblock_tableact, div.viewblock_list, div.viewblock_listact { display: inline-block; }
div.viewblock_table input, div.viewblock_tableact input, div.viewblock_list input, div.viewblock_listact input {
	font-size: 0; border: 0; width: 32px; height: 32px; padding: 0; border-radius: var(--radius);
	background-color: transparent; background-repeat: no-repeat; background-position: center right; transform: none;
}
div.viewblock_table input { background-image: url("/themes/images/table.jpg"); }
div.viewblock_table input:hover, div.viewblock_tableact input, div.viewblock_tableact input:hover { background-image: url("/themes/images/table_act.jpg"); background-color: transparent; }
div.viewblock_list input { background-image: url("/themes/images/list.jpg"); }
div.viewblock_list input:hover, div.viewblock_listact input, div.viewblock_listact input:hover { background-image: url("/themes/images/list_act.jpg"); background-color: transparent; }

/* ---------- КАТАЛОГ: КАРТКИ ТОВАРІВ ---------- */

div.products, div.products_hor, div.product_main_wrap { justify-content: center; display: flex; flex-wrap: wrap; text-align: center; }

div.product_topicon, div.product_topicon_hor, div.productin_topicon { position: relative; }

/* Бейджі TOP / NEW / SALE — зрізаний кут у стилі тактичних шевронів */
div.product_topitem, div.product_newitem, div.product_actitem,
div.product_topitem_hor, div.product_newitem_hor, div.product_actitem_hor,
div.productin_topitem, div.productin_newitem, div.productin_actitem {
	position: absolute;
	left: 0;
	top: 8px;
	z-index: 2;
	height: 26px;
	min-width: 56px;
	padding: 0 14px 0 10px;
	box-sizing: border-box;
	clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
	background-image: none;
	filter: none;
	border-radius: 0;
	width: auto;
}
div.product_topitem, div.product_topitem_hor, div.productin_topitem { background: var(--coyote); }
div.product_newitem, div.product_newitem_hor, div.productin_newitem { background: var(--graphite); }
div.product_actitem, div.product_actitem_hor, div.productin_actitem { background: var(--accent); }

div.product_topitem::after, div.product_topitem_hor::after, div.productin_topitem::after,
div.product_newitem::after, div.product_newitem_hor::after, div.productin_newitem::after,
div.product_actitem::after, div.product_actitem_hor::after, div.productin_actitem::after {
	color: #fff;
	font-family: var(--font-display);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: .08em;
	line-height: 26px;
}
div.product_topitem::after, div.product_topitem_hor::after, div.productin_topitem::after { content: "TOP"; color: var(--hard-dark-color); }
div.product_newitem::after, div.product_newitem_hor::after, div.productin_newitem::after { content: "NEW"; }
div.product_actitem::after, div.product_actitem_hor::after, div.productin_actitem::after { content: "SALE"; }

div.product_main {
	background: var(--white-background-color);
	border: 1px solid var(--light-color);
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	margin: 6px;
	box-sizing: border-box;
	flex: 0 0 calc(25% - 12px);
	max-width: calc(25% - 12px);
	overflow: hidden;
	transition: border-color var(--ease), box-shadow var(--ease), transform var(--ease);
}
@media all and (min-width: 600px) {
	div.product_main:hover { border-color: var(--graphite); box-shadow: var(--shadow-md); transform: translateY(-3px); }
}
@media all and (min-width: 600px) and (max-width: 899px) { div.product_main { flex-basis: calc(33.333% - 12px); max-width: calc(33.333% - 12px); } }

div.product_img { width: 100%; height: 230px; overflow: hidden; margin-bottom: 6px; align-items: center; justify-content: center; text-align: center; display: flex; background: #fff; }
div.product_imgin { width: 100%; }
div.product_imgin img { max-width: 100%; max-height: 230px; border: 0; transition: transform .3s ease; }
div.product_main:hover div.product_imgin img { transform: scale(1.04); }
@media all and (max-width: 599px) {
	div.product_img { height: 190px; }
	div.product_imgin img { max-height: 190px; }
}

div.product_one { padding: 6px 12px 14px; display: flex; flex-direction: column; flex-grow: 1; }
div.product_topname { min-height: 40px; display: none; justify-content: center; text-align: center; }
div.product_rate { margin: 0 auto; padding: 4px 0; justify-content: center; display: flex; flex-direction: row; }
div.product_rate div { margin: 0 1px; }
div.item_actrate { background: url('/themes/images/starsm1.png'); width: 18px; height: 18px; }
div.item_rate { background: url('/themes/images/starsm.png'); width: 18px; height: 18px; }

div.product_bottomname { margin: 6px 0; height: 5.6em; align-items: flex-start; display: flex; justify-content: center; text-align: center; overflow: hidden; font-size: 14px; line-height: 1.4; }
div.product_bottomname a { color: var(--hard-dark-color); font-weight: 500; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
div.product_bottomname a:hover { color: var(--accent); }
div.product_short { display: none; }

div.product_buyinfo { display: flex; justify-content: space-between; flex-direction: column; margin-top: auto; }
div.product_price { text-align: center; font-family: var(--font-display); font-size: 24px; font-weight: 600; margin: 8px 0; }
div.product_oldprice, div.product_oldpriceright_hor { display: inline-block; color: var(--medium-color); font-family: var(--font-family); font-size: 14px; font-weight: 400; text-decoration: line-through; padding-right: 12px; }
div.product_actprice, div.product_actpriceright_hor { display: inline-block; text-align: left; color: var(--accent); font-weight: 600; }

/* Кнопки «Купити» */
div.product_buy input, div.slideritem_buy input, div.columnitem_buy input, div.product_buyright_hor input,
div.productbuybutton input, div.actpocket_buybutton input, div.cartpage_blockin2 input {
	background: var(--accent);
	color: #fff;
	border: 1px solid var(--accent);
}
div.product_buy input:hover, div.slideritem_buy input:hover, div.columnitem_buy input:hover, div.product_buyright_hor input:hover,
div.productbuybutton input:hover, div.actpocket_buybutton input:hover, div.cartpage_blockin2 input:hover {
	background: var(--accent-dark);
	border-color: var(--accent-dark);
	color: #fff;
}
div.product_buy input, div.slideritem_buy input { width: 100%; }

/* Вивід списком */
div.product_main_hor {
	margin: 8px 0;
	border: 1px solid var(--light-color);
	border-radius: 8px;
	background: var(--white-background-color);
	display: flex;
	flex-direction: column;
	flex: 1 1 100%;
	transition: border-color var(--ease), box-shadow var(--ease);
}
@media all and (min-width: 600px) { div.product_main_hor:hover { border-color: var(--graphite); box-shadow: var(--shadow-md); } }

div.product_one_hor { padding: 10px; }
div.product_topname_hor, div.product_price_hor, div.product_buy_hor { display: none; }
div.product_maininfo_hor { display: flex; flex-direction: row; justify-content: space-between; }
@media all and (max-width: 500px) { div.product_maininfo_hor { flex-direction: column; justify-content: center; } }
div.product_img_hor { flex-basis: 200px; min-width: 200px; vertical-align: middle; }
div.product_imgin_hor img { max-width: 200px; }
div.product_info_hor { flex-basis: 90%; vertical-align: top; }
div.product_bottomname_hor { text-align: left; margin: 8px 0; font-family: var(--font-display); font-size: 19px; }
div.product_bottomname_hor a { color: var(--hard-dark-color); }
div.product_bottomname_hor a:hover { color: var(--accent); }
div.product_rate_hor { margin: 4px 0; text-align: left; }
div.product_short_hor { font-size: 14px; color: var(--light-dark-color); }
div.product_rightinfo_hor { flex-basis: 160px; vertical-align: top; text-align: right; padding-left: 16px; }
@media all and (max-width: 500px) { div.product_rightinfo_hor { flex-basis: auto; padding-left: 0; text-align: left; } }
div.product_priceright_hor { text-align: left; font-family: var(--font-display); font-size: 24px; font-weight: 600; display: inline-block; margin: 8px 0; }

/* Товарні слайдери */
div.slideritem_title { display: none; }

/* Товари в колонці */
div.columnitems_main { margin-bottom: 20px; }
div.columnitem_separator { height: 1px; background: var(--light-color); width: 100%; }
div.columnitem { text-align: center; border-bottom: 1px solid var(--light-color); padding: 12px 0; display: flex; flex-direction: row; }
div.columnitem_imgleft, div.columnitem_imgright { vertical-align: top; flex-basis: 40%; }
div.columnitem_imgleft img, div.columnitem_imgright img { max-width: 100%; }
div.columnitem_info { padding-left: 8px; box-sizing: border-box; vertical-align: top; flex-basis: 60%; text-align: left; }
div.columnitem_topname { display: none; }
div.columnitem_bottomname a { color: var(--hard-dark-color); font-size: 14px; font-weight: 500; }
div.columnitem_bottomname a:hover { color: var(--accent); }
div.columnitem_price { font-family: var(--font-display); font-size: 18px; font-weight: 600; display: inline-block; margin: 6px 0; }
div.columnitem_oldprice { display: inline-block; color: var(--medium-color); font-size: 80%; font-weight: 400; text-decoration: line-through; }
div.columnitem_actprice { display: inline-block; color: var(--accent); font-weight: 600; }
div.columnitemsall { margin-top: 10px; text-align: center; }

/* ---------- СТОРІНКА ТОВАРУ ---------- */

div.allproductblock { padding-top: 10px; }
div.nextproduct_block { display: table; padding: 5px; margin-bottom: 10px; }
div.lastproduct { display: table-cell; white-space: nowrap; }
div.nextproduct { display: table-cell; text-align: right; width: 100%; }
div.productblock_over { display: none; }

div.productcolumns { display: flex; flex-direction: row; justify-content: space-between; background: #fff; border: 1px solid var(--light-color); border-radius: 10px; padding: 20px; gap: 8px; }
div.productleftcolumn { flex-basis: 500px; }
div.productcentercolumn { padding: 0 16px; flex-grow: 1; }
div.productrightcolumn { border-left: 1px solid var(--light-color); padding: 10px 10px 10px 18px; flex-basis: 250px; }
@media all and (max-width: 1100px) { div.productrightcolumn { display: none; } }
@media all and (max-width: 899px) {
	div.productcolumns { flex-direction: column; padding: 12px; }
	div.productleftcolumn, div.productrightcolumn { width: auto; flex-basis: unset; }
	div.productcentercolumn { padding: 0; text-align: center; }
}

div.productname h1 { margin: 0 0 8px; padding: 0; font-size: 30px; }
div.productcode { padding: 2px 0 10px; color: var(--medium-color); font-size: 14px; }
div.pricefor { padding: 8px 0; }
div.productrate { margin: 8px 0; display: flex; flex-direction: row; align-items: center; }
div.productrate div { margin: 0 1px; }

div.inproductactiontimer { margin: 10px 0; background: var(--accent); padding: 12px 16px; font-size: 16px; color: #fff; border-radius: var(--radius); display: flex; flex-direction: row; align-items: center; }
div.actiontimerclock { display: flex; flex-direction: row; padding-left: 12px; font-family: var(--font-display); font-size: 24px; }

div.productprice { text-align: left; font-family: var(--font-display); font-size: 36px; font-weight: 600; display: inline-block; margin: 8px 0; }
div.productoldprice { display: inline-block; color: var(--medium-color); font-family: var(--font-family); font-size: 18px; font-weight: 400; text-decoration: line-through; padding-right: 14px; }
div.productactprice { display: inline-block; text-align: left; color: var(--accent); font-size: 100%; font-weight: 600; }

div.valuteseparator { display: inline-block; padding: 0 5px; }
div.valuteinprice { display: inline-block; }
div.valuteoldprice { display: inline-block; color: var(--medium-color); text-decoration: line-through; }
div.valuteactprice { display: inline-block; margin-left: 14px; color: var(--accent); }

div.productbuyamount { display: inline-block; }
div.productbuyamount input { width: 70px; text-align: center; }
div.productbuybutton { margin: 10px 8px; display: inline-block; }
div.productbuybutton input { padding: 14px 32px; font-size: 16px; }
div.productonebuybutton { display: inline-block; }
div.productonebuybutton input { padding: 14px 24px; }
div.productbuttons { margin: 10px 0; }
div.productcompare, div.productfavor, div.productquest { display: inline-block; }
div.productbrand a { font-weight: 600; }

/* Акційний комплект */
div.actpocket_allblock { margin: 20px auto; border: 1px solid var(--accent); padding: 14px; border-radius: 8px; display: table; background: #fff; }
div.actpocket_inblock { text-align: center; }
div.actpocket_title { font-family: var(--font-display); font-size: 20px; color: var(--accent); padding: 5px; margin-bottom: 10px; border-bottom: 1px solid var(--accent); }
div.actpocket_block { display: flex; flex-direction: row; align-items: center; }
div.actpocket_left, div.actpocket_right { flex-basis: 50px; vertical-align: middle; margin: 0 20px; }
div.actpocket_center { display: inline-block; vertical-align: middle; }
div.actpocket_plus, div.actpocket_summ { display: inline-block; vertical-align: middle; margin: 0 20px; font-size: 22px; font-weight: 600; }
div.actpocket_item { display: inline-block; vertical-align: middle; width: 150px; }
div.actpocket_img { height: 150px; display: table-cell; vertical-align: middle; }
div.actpocket_img img { max-width: 150px; max-height: 150px; }
div.actpocket_name { text-align: center; }
div.actpocket_allprice { display: inline-block; vertical-align: middle; font-size: 120%; font-weight: 600; margin: 5px 0; }
div.actpocket_oldprice { color: var(--medium-color); font-size: 80%; text-decoration: line-through; margin: 5px 0; }
div.actpocket_newprice { font-family: var(--font-display); font-size: 22px; color: var(--accent); margin: 5px 0; }

/* Параметри товару */
div.productoptions { border-top: 1px solid var(--light-color); border-bottom: 1px solid var(--light-color); padding: 12px 0; margin: 12px 0; }
div.productoption { margin: 8px 0; position: relative; max-width: 320px; }
div.productoption_name { margin: 3px 0; font-weight: 600; font-size: 14px; }
div.productoption_case { margin: 3px 0; max-width: 280px; }

div.attr_one_block {
	border: 1px solid var(--light-color);
	border-radius: var(--radius);
	padding: 10px 18px;
	font-size: 14px;
	background: url("/themes/images/selectdown.png") no-repeat #fff;
	background-position: 98% 50%;
	cursor: pointer;
	text-align: left;
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: row;
	align-items: center;
}
div.attr_one_block:hover { border-color: var(--graphite); }

div.choose_attr_div {
	display: none; position: absolute; background: #fff;
	border: 1px solid var(--light-color); border-top: 0;
	border-radius: 0 0 var(--radius) var(--radius);
	box-shadow: var(--shadow-md);
	width: 100%; max-width: 280px; z-index: 2; box-sizing: border-box;
}
div.choose_attr_line { padding: 9px 18px; border-bottom: 1px solid var(--light-color); width: 100%; box-sizing: border-box; font-size: 14px; cursor: pointer; }
div.choose_attr_line:hover { background: #e6e8ea; }

div.productoption_checkers { display: flex; flex-direction: row; align-items: center; }
div.attr_one_cube { display: flex; flex-wrap: wrap; cursor: pointer; padding: 5px; border: 1px solid var(--light-color); border-radius: var(--radius); box-sizing: border-box; align-items: center; }
div.attr_one_cube input { width: unset; accent-color: var(--accent); }
div.attr_one_cube div { padding: 5px; box-sizing: border-box; }

/* Характеристики */
div.inproductcharrow { display: flex; flex-direction: row; width: 100%; border-radius: 4px; }
div.inproductcharrow:nth-child(odd) { background: var(--hard-light-color); }
div.inproductcharname { padding: 8px 10px; flex-basis: 30%; color: var(--light-dark-color); }
div.inproductchartext { padding: 8px 10px; flex-basis: 70%; font-weight: 500; }

/* Велике зображення */
div.productbigimg_in { width: 500px; height: 500px; display: table-cell; vertical-align: middle; text-align: center; }
div.productbigimg_in img { max-width: 500px; cursor: zoom-in; }
@media all and (max-width: 899px) {
	div.productbigimg_in { width: 98%; height: auto; display: block; }
	div.productbigimg_in img { max-width: 100%; }
}

div.bigproductinfo { position: relative; }
div.bigoverclose { position: absolute; left: 99%; margin-top: -44px; margin-left: -44px; }
div.bigimgcenter { cursor: pointer; text-align: center; display: table-cell; vertical-align: middle; }
div.rightbgarrow { margin-left: -52px; }
#smBgImage { cursor: pointer; }

/* Мініатюри */
div.smallitem { margin: 5px; width: 80px; }
div.smallitem_img { vertical-align: middle; display: table-cell; text-align: center; width: 80px; height: 80px; border: 1px solid var(--light-color); border-radius: var(--radius); transition: border-color var(--ease); }
div.smallitem_img:hover { border-color: var(--accent); }
div.smallitem_imgin img { max-width: 78px; max-height: 78px; }

@media all and (min-width: 600px) and (max-width: 700px) {
	div.smallitem, div.smallitem_img { width: 70px; }
	div.smallitem_img { height: 70px; }
	div.smallitem_imgin img { max-width: 68px; max-height: 68px; }
}
@media all and (min-width: 400px) and (max-width: 599px) {
	div.smallitem, div.smallitem_img { width: 68px; }
	div.smallitem_img { height: 68px; }
	div.smallitem_imgin img { max-width: 66px; max-height: 66px; }
}
@media all and (min-width: 365px) and (max-width: 399px) {
	div.smallitem, div.smallitem_img { width: 82px; }
	div.smallitem_img { height: 82px; }
	div.smallitem_imgin img { max-width: 80px; max-height: 80px; }
}
@media all and (min-width: 330px) and (max-width: 364px) {
	div.smallitem, div.smallitem_img { width: 80px; }
	div.smallitem_img { height: 80px; }
	div.smallitem_imgin img { max-width: 78px; max-height: 78px; }
}
@media all and (max-width: 329px) { div.smallitem_info { display: none; } }

/* ---------- КОШИК ---------- */

div.cart_block { background: url('/themes/images/icon_cartmob.png') no-repeat right center; padding-right: 45px; text-align: right; min-height: 32px; }
div.cart_title { display: none; }
div.cart_modul { margin: 5px 0; }
div.cartmodul_amount, div.cartmodul_price, div.cartmodul_empty { text-align: right; }
div.cartmodul_price { font-weight: 600; color: var(--accent); }
div.cartmodul_empty { padding-top: 7px; color: var(--light-dark-color); }

div.cartinfo_table table, div.cartpage_table table { width: 100%; border-collapse: collapse; }
div.cartinfo_table table td, div.cartpage_table table td { padding: 10px 8px; text-align: center; border-bottom: 1px solid var(--light-color); }

tr.carttitlerow, div.cartpage_table table tr.carttitlerow { background: var(--graphite-dark) !important; color: #fff; }
tr.carttitlerow td { border-bottom: 0 !important; font-family: var(--font-display); font-weight: 500; letter-spacing: .03em; }

td.carttitlecode { font-size: 0; width: 1px; }
td.carttitleprice, td.carttitlesumm, td.cartprice, td.cartsumm { width: 100px; }
td.cartcode { width: 1px; }
td.cartimg { width: 56px; }
td.cartimg img { max-height: 56px; max-width: 56px; border-radius: 4px; }
td.cartname { text-align: left !important; }
table.cartparams { text-align: left !important; }
table.cartparams td { padding: 2px !important; border-bottom: 0 !important; }
td.cartparams_name { text-align: left !important; color: var(--light-dark-color); width: 1px; font-size: 90%; }
td.cartparams_param { text-align: left !important; color: var(--light-dark-color); font-size: 90%; }
td.cartamount { text-align: center; width: 60px; }
td.cartamount input { width: 60px; text-align: center; padding: 8px 4px; }
td.cartprice, td.cartsumm { color: var(--accent); font-weight: 600; }
td.cartdelete { width: 1px; }
td.cartall { text-align: right !important; font-size: 110%; }
td.cartallsumm { color: #fff; font-family: var(--font-display); font-size: 20px; background: var(--accent); font-weight: 600; width: 100px; }
table.pockettable { width: 100%; position: relative; border: 1px solid var(--light-fail-color); background: var(--light-fail-color); }

div.cartinfo_buttons { margin: 10px 0 0; text-align: center; display: table; width: 100%; }
div.cartinfo_button1 { display: table-cell; text-align: left; padding: 3px; }
div.cartinfo_button2 { display: table-cell; text-align: right; padding: 3px; }

@media all and (max-width: 799px) {
	td.carttitleprice, td.cartprice, td.carttitlecode, td.cartcode, td.carttitleimg, td.cartimg, div.cartpage_title { display: none; }
}

div.cartpage_table { max-width: 1000px; margin: 20px auto 0; background: #fff; border: 1px solid var(--light-color); border-radius: 8px; padding: 6px; box-sizing: border-box; }
div.cartpage_data { max-width: 1000px; margin: 20px auto 0; }
div.cartpage_title { color: var(--hard-dark-color); padding: 10px 0; font-family: var(--font-display); font-size: 24px; text-align: center; margin: 0 auto 10px; border-bottom: 2px solid var(--accent); }

div.cartpage_blockin1 { display: flex; flex-direction: row; justify-content: space-between; }
div.cartpage_blockin11, div.cartpage_blockin12 { flex: 1 1 50%; padding: 10px; }
@media all and (max-width: 899px) {
	div.cartpage_blockin1 { flex-direction: column; }
	div.cartpage_blockin11, div.cartpage_blockin12 { flex-basis: 100%; padding: 10px 0; }
}
div.cartpage_blockin2 { text-align: center; margin: 20px 0; }
div.cartpage_blockin2 input { padding: 14px 32px; font-size: 16px; }
div.cartpage_blockname { padding: 10px 0 2px; font-weight: 600; font-size: 14px; }
div.cartpage_paymentblock { margin: 10px 0; }
div.cartpage_paymentinblock1 { display: inline-block; vertical-align: middle; margin-right: 10px; }
div.cartpage_paymentinblock2 { display: inline-block; vertical-align: middle; }
div.paymenttitle { color: var(--hard-dark-color); font-family: var(--font-display); font-size: 20px; padding: 10px; text-align: center; }

input.cash, input.privat24, input.liqpay, input.portmone, input.webmoney,
input.cash:hover, input.privat24:hover, input.liqpay:hover, input.portmone:hover, input.webmoney:hover {
	height: 24px; background-color: transparent; background-repeat: no-repeat; border: 0; font-size: 0; color: transparent; padding: 0; transform: none;
}
input.cash { width: 72px; background-image: url('/themes/images/cash.png'); }
input.privat24 { width: 135px; background-image: url('/themes/images/privat24.png'); }
input.liqpay { width: 119px; background-image: url('/themes/images/liqpay.png'); }
input.portmone { width: 193px; background-image: url('/themes/images/portmone.png'); }
input.webmoney { width: 92px; background-image: url('/themes/images/webmoney.png'); }

/* ---------- ФІЛЬТРИ ---------- */

div.filterscolumn, div.filtercolumn { background: transparent; }
div.filterscolumntitle, div.filterscolumntitleicon { display: none; }
div.filtercolumnname { text-align: left; margin: 8px 0 4px; padding: 5px; font-family: var(--font-display); font-size: 17px; font-weight: 500; border-bottom: 2px solid var(--light-color); }
div.filterparaminfo { display: flex; flex-direction: row; align-items: center; padding: 3px 0; }
div.filterparaminfo_slide { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
div.filterparamcheck input { width: unset; accent-color: var(--accent); }
div.filterparamname { padding-left: 4px; }
div.filtercolumnseparator { margin: 5px 0; }
div.filtercolumnbutton { text-align: center; margin: 10px 6px; }
div.filterslider { margin: 12px 8px; left: -2px; }

div.filters_adapt, div.filtersblock_adapt { display: none; }
@media all and (max-width: 800px) {
	div.filters_adapt { display: block; }
	div.filtersbutton_adapt { text-align: center; margin: 10px 0; }
	div.filtercolumn { padding: 0 5px; }
}

/* ---------- МЕГАМЕНЮ ---------- */

div.megacatalog { width: 100%; background: var(--graphite-dark); }

div.megacatalogin { max-width: 1600px; cursor: pointer; margin: 0 auto; justify-content: center; align-items: center; display: flex; flex-direction: row; }

div.megacatalogseparator { background: rgba(255, 255, 255, .14); height: 24px; flex-basis: 1px; }

div.megacategory, div.activemegacategory {
	display: flex; flex-direction: column; flex-grow: 1; flex-shrink: 1; align-items: center; cursor: pointer;
	transition: background var(--ease);
}
div.megacategory:hover { background: var(--graphite); }
div.activemegacategory { background: var(--graphite); box-shadow: inset 0 -3px 0 var(--accent); }

a.megacategory, a.activemegacategory {
	padding: 14px 16px; min-height: 30px; align-items: center; display: flex; justify-content: center;
	color: #fff; font-family: var(--font-display); font-size: 16px; font-weight: 500; letter-spacing: .03em;
}
a.megacategory:hover, a.activemegacategory:hover { color: #fff; }

div.megacatalogsubmenu_load { opacity: 0; display: block; }
div.megacatalogsubmenu { opacity: 1; display: none; position: relative; left: 0; top: 0; z-index: 200; transition: opacity var(--ease); }
div.activemegacategory:hover div.megacatalogsubmenu, div.megacategory:hover div.megacatalogsubmenu, div.megacatalogsubmenu:hover { display: block; }

div.megacatalogsubmenuinfo { position: absolute; box-shadow: var(--shadow-pop); }
@media all and (max-width: 770px) { div.megacatalogsubmenuinfo { display: none; } }
div.megacatalogsubmenuinfo1 { position: relative; width: 100%; z-index: 200; background: var(--graphite); border-top: 3px solid var(--accent); }

div.megasubcategory { min-width: 250px; text-align: left; }
div.megasubcategoryblock { padding: 8px 20px; }
div.megacatalogrow { display: flex; flex-direction: row; }
div.megacatalogcolumn { display: flex; flex-direction: column; }
div.megasubcategoryinfo { margin-bottom: 6px; }
div.megasubcategorysublink { padding: 3px 3px 3px 10px; }

a.subcattwo { color: #fff; font-weight: 600; }
a.subcattwo:hover { color: var(--coyote); }
a.subcatthree { color: #dde0e3; font-size: 14px; }
a.subcatthree:hover { color: var(--coyote); }

@media all and (max-width: 700px) {
	div.megacatalogin { flex-direction: column; background: var(--graphite); display: none; }
	div.megacatalog { background: var(--hard-light-color); }
}

/* ---------- ПОРІВНЯННЯ ---------- */

div.compare_block { box-sizing: border-box; padding: 10px; color: var(--light-dark-color); font-size: 14px; }
div.compare_in1 { display: inline-block; }
div.compare_in2 { display: inline-block; margin-left: 10px; }

table.comparetable { border-collapse: collapse; background: #fff; border: 1px solid var(--light-color); border-radius: 8px; }
table.comparetable tr:nth-child(odd) { background: var(--hard-light-color); }
table.comparetable tr:nth-child(even) { background: #fff; }
tr.nobackground { background: transparent !important; }
table.comparetable td { padding: 10px 8px; }

td.comp_name { text-align: left; padding: 8px 0; }
td.comp_name a { font-family: var(--font-display); font-size: 18px; color: var(--hard-dark-color); }
td.comp_name a:hover { color: var(--accent); }
td.comp_img { height: 150px; vertical-align: middle; text-align: center; }
td.comp_img img { max-width: 150px; max-height: 150px; }
td.comp_price { text-align: left; font-family: var(--font-display); font-size: 22px; font-weight: 600; display: inline-block; margin: 8px 0; }
span.comp_oldprice { color: var(--medium-color); text-decoration: line-through; font-size: 80%; }
span.comp_actprice { color: var(--accent); }

.topadapt { display: none; background: var(--graphite-dark); }

/* ---------- ВИПРАВЛЕННЯ: однакова висота блоків у слайдерах ---------- */

div.slidertopitem_contin, div.slideractitem_contin, div.slidernewitem_contin, div.sliderlasitem_contin,
div.slidersameitem_contin, div.slideraccessoriesitem_contin, div.slidercomplectitem_contin { align-items: stretch; }

div.slidertopitem_main, div.slideractitem_main, div.slidernewitem_main, div.sliderlasitem_main,
div.slidersameitem_main, div.slideraccessoriesitem_main, div.slidercomplectitem_main { display: flex; }

div.slideritem { flex-grow: 1; box-sizing: border-box; }
div.slideritem_buyinfo { margin-top: auto; width: 100%; }
div.slideritem_buy { width: 100%; }
div.slideritem_buy input { width: 100%; }

/* ---------- ВИПРАВЛЕННЯ: колір тексту в шапці (години роботи, телефони) ---------- */

div.overhead, div.overhead *,
div.headcolumn3row1, div.headcolumn3row1 *, div.headcolumn3row2, div.headcolumn3row2 * { color: var(--hard-dark-color) !important; }
div.overhead a:hover, div.headcolumn3row1 a:hover, div.headcolumn3row2 a:hover { color: var(--accent) !important; }
div.cartmodul_price, div.cartmodul_price * { color: var(--accent) !important; }

/* ---------- ВИПРАВЛЕННЯ: активна мова (UA / RU) — білий текст на графітовому ---------- */

div.overhead div.languageact, div.overhead div.languageact *,
div.headcolumn3row1 div.languageact, div.headcolumn3row1 div.languageact *,
div.headcolumn3row2 div.languageact, div.headcolumn3row2 div.languageact *,
div.languageact, div.languageact *,
div.overhead div.languageact a:hover, div.languageact a:hover { color: #fff !important; }
div.languageact { background: var(--graphite); border-color: var(--graphite); font-weight: 600; }

/* ---------- ВИПРАВЛЕННЯ: шапка — години роботи та кнопки «Вхід / Реєстрація» (лише кольори) ---------- */

/* Години роботи call-центру */
div.headcolumn2, div.headcolumn2 * { color: var(--hard-dark-color) !important; }
div.headcolumn2 a { color: var(--graphite-dark) !important; }
div.headcolumn2 a:hover { color: var(--accent) !important; }

/* Кнопки в шапці: білий текст на графітовому */
div.overhead input[type="button"], div.headcolumn3 input[type="button"],
div.overhead input[type="button"]:hover, div.headcolumn3 input[type="button"]:hover { color: #fff !important; }

/* Трохи компактніші кнопки «Вхід / Реєстрація» */
div.buttonsusers_main input[type="button"], div.polesusers_button input[type="button"] { padding: 10px 14px; }

/* ---------- НЕМАЄ В НАЯВНОСТІ: якщо кнопки «В кошик» немає, показуємо напис ---------- */

div.product_buy:not(:has(input))::after,
div.slideritem_buy:not(:has(input))::after,
div.columnitem_buy:not(:has(input))::after,
div.product_buyright_hor:not(:has(input))::after,
div.productbuy:not(:has(input))::after {
	content: "Немає в наявності";
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 100%;
	min-height: 42px;
	padding: 10px 14px;
	border: 1px dashed var(--medium-color);
	border-radius: var(--radius);
	background: var(--hard-light-color);
	color: var(--light-dark-color);
	font-family: var(--font-display);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .04em;
	text-align: center;
}

div.productbuy:not(:has(input))::after { display: inline-flex; width: auto; min-width: 220px; margin: 10px 0; font-size: 16px; }

/* Фото товару, якого немає, трохи приглушене */
div.product_main:has(div.product_buy:not(:has(input))) div.product_imgin img,
div.slideritem:has(div.slideritem_buy:not(:has(input))) div.slideritem_imgin img { opacity: .55; filter: grayscale(.7); }

/* ---------- ВИПРАВЛЕННЯ: однакова висота фото на мобільних, щоб кнопки були на одному рівні ---------- */
@media all and (max-width: 599px) {
	div.slideritem_img { height: 190px; }
	div.slideritem_imgin img { max-height: 190px; }
}

/* ---------- ВИПРАВЛЕННЯ: меню розділів на темній смузі (underhead) ---------- */

div.underhead a.topchapter_link { color: #e8eaec; }
div.underhead a.topactivechapter_link { color: #fff; font-weight: 600; box-shadow: inset 0 -2px 0 var(--accent); }
div.underhead a.topchapter_link:hover, div.underhead a.topactivechapter_link:hover { color: #fff; }
div.underhead div.topchapter:hover { background: rgba(255, 255, 255, .12); }
div.underhead div.topchapter, div.underhead div.topactivechapter { border-radius: 0; padding: 10px 14px; }

/* ---------- ВИПРАВЛЕННЯ: час роботи call-центру (headcolumn1 / headcolumn2) ---------- */

div.headcolumn1, div.headcolumn1 *,
div.headcolumn2, div.headcolumn2 * { color: #1c1f22 !important; }
div.headcolumn1 a, div.headcolumn2 a { color: #24282c !important; }
div.headcolumn1 a:hover, div.headcolumn2 a:hover { color: var(--accent) !important; }
div.headcolumn1 input[type="button"], div.headcolumn2 input[type="button"] { color: #fff !important; }

/* ---------- ФУТЕР: однакова коротка лінія під заголовками, без іконок оплати ---------- */

div.footer_title { display: block; border-bottom: 0; padding-bottom: 0; margin: 5px 0 18px; }
div.footer_title::after { content: ""; display: block; width: 48px; height: 3px; background: var(--accent); margin-top: 12px; }

/* Visa / Mastercard */
div.allfooter img[src*="visa" i], div.allfooter img[src*="master" i], div.allfooter img[src*="pay" i] { display: none; }
/* колонка, де лишились тільки картинки (без посилань і списків), ховається повністю */
div.overfooter > div:has(img):not(:has(a)):not(:has(li)) { display: none; }

/* ---------- КАТАЛОГ: уся картка товару клікабельна ---------- */

div.product_main, div.product_main_hor, div.slideritem { position: relative; cursor: pointer; }

div.product_bottomname a::after, div.product_bottomname_hor a::after, div.slideritem_bottomname a::after {
	content: "";
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: 1;
}

/* лише кнопка «В кошик» лежить над «прозорим посиланням»; ціна клікабельна як і вся картка */
div.product_buy, div.product_buyright_hor, div.slideritem_buy, div.columnitem_buy { position: relative; z-index: 2; }
div.product_topicon, div.product_topicon_hor { z-index: 0; pointer-events: none; }

/* ---------- КОШИК У ШАПЦІ: ховер ---------- */

div.cart_block {
	cursor: pointer;
	border-radius: 8px;
	padding-left: 10px;
	background-repeat: no-repeat;
	background-position: right center;
	transition: background-color var(--ease), color var(--ease);
}
div.cart_block, div.cart_block div { transition: color var(--ease); }

div.cart_block:hover {
	background-color: color-mix(in srgb, var(--accent) 10%, #fff);
	background-image: url('/themes/images/icon_cartmob.png'), radial-gradient(circle, color-mix(in srgb, var(--accent) 22%, transparent) 0 20px, transparent 21px);
	background-repeat: no-repeat, no-repeat;
	background-position: right center, right -6px center;
	background-size: auto, 44px 44px;
}

div.cart_block:hover div.cartmodul_amount, div.cart_block:hover div.cartmodul_empty,
div.cart_block:hover div.cartmodul_price, div.cart_block:hover div.cart_modul { color: var(--accent) !important; }
div.cart_block:hover div.cartmodul_empty, div.cart_block:hover div.cartmodul_amount { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- ТЕЛЕФОН: у каталозі завжди 2 товари в ширину ---------- */
@media all and (max-width: 599px) {
	div.product_main { margin: 4px; flex: 0 0 calc(50% - 8px); max-width: calc(50% - 8px); }
	div.product_img { height: 160px; }
	div.product_imgin img { max-height: 160px; }
	div.product_one { padding: 4px 8px 10px; }
	div.product_bottomname { font-size: 13px; height: 5.4em; }
	div.product_price { font-size: 20px; margin: 6px 0; }
	div.product_oldprice { padding-right: 6px; font-size: 12px; }
	div.product_buy input { padding: 10px 6px; font-size: 13px; letter-spacing: .03em; }
}
.display--additinal--cart:first-of-type {
    display: none !important;
}

/* ---------- ПРИБРАНО: кнопка «Замовити в 1 клік» (кошик, сторінка товару, каталог) ---------- */

div.productonebuybutton,
div.oneclickform,
input[type="button"][value*="1 клік" i],
input[type="button"][value*="1 клік"],
input[type="button"][value*="1 Клік"],
input[type="button"][value*="1 клик" i],
input[type="button"][value*="1 клик"],
input[type="button"][value*="1 Клик"],
input[type="submit"][value*="1 клік" i],
input[type="submit"][value*="1 клик" i],
button[value*="1 клік" i],
button[value*="1 клик" i],
input[onclick*="oneclick" i],
button[onclick*="oneclick" i],
a[onclick*="oneclick" i] { display: none !important; }

/* 1. Общий контейнер: на мобильных — в столбик */
.maininfoboard {
    display: flex !important;
    flex-direction: column !important;
    gap: 25px !important;
    background-color: #f2f2f2 !important; /* Серый фон */
    padding: 25px !important;
    border-radius: 4px !important;
}

/* 2. Общие стили для колонок */
.maininfoboard_2,
.maininfoboard_3,
.maininfoboard_4 {
    width: 100% !important;
    text-align: center !important;
}

/* Скрываем первый блок */
.maininfoboard_1 {
    display: none !important;
}

/* 3. Настройка иконок (без фоновых кругов) */
.maininfoboard_2::before,
.maininfoboard_3::before,
.maininfoboard_4::before {
    content: "" !important;
    display: block !important;
    width: 50px !important;                /* Ширина иконки (можете изменить под себя) */
    height: 50px !important;               /* Высота иконки */
    margin: 0 auto 15px auto !important;   /* Центрируем и делаем отступ до текста */
    background-size: contain !important;   /* Сохраняем пропорции картинки */
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* Ссылки на ваши иконки для каждого блока */

.maininfoboard_2::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640' fill='%23d9531e'%3E%3Cpath d='M144 288C144 190.8 222.8 112 320 112C417.2 112 496 190.8 496 288L496 332.8C481.9 324.6 465.5 320 448 320L432 320C405.5 320 384 341.5 384 368L384 496C384 522.5 405.5 544 432 544L448 544C501 544 544 501 544 448L544 288C544 164.3 443.7 64 320 64C196.3 64 96 164.3 96 288L96 448C96 501 139 544 192 544L208 544C234.5 544 256 522.5 256 496L256 368C256 341.5 234.5 320 208 320L192 320C174.5 320 158.1 324.7 144 332.8L144 288zM144 416C144 389.5 165.5 368 192 368L208 368L208 496L192 496C165.5 496 144 474.5 144 448L144 416zM496 416L496 448C496 474.5 474.5 496 448 496L432 496L432 368L448 368C474.5 368 496 389.5 496 416z'/%3E%3C/svg%3E") !important;

}

.maininfoboard_3::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640' fill='%23d9531e'%3E%3Cpath d='M528 320C528 434.9 434.9 528 320 528C205.1 528 112 434.9 112 320C112 205.1 205.1 112 320 112C434.9 112 528 205.1 528 320zM64 320C64 461.4 178.6 576 320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320zM296 184L296 320C296 328 300 335.5 306.7 340L402.7 404C413.7 411.4 428.6 408.4 436 397.3C443.4 386.2 440.4 371.4 429.3 364L344 307.2L344 184C344 170.7 333.3 160 320 160C306.7 160 296 170.7 296 184z'/%3E%3C/svg%3E") !important;
}

.maininfoboard_4::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640' fill='%23d9531e'%3E%3Cpath d='M96 144C87.2 144 80 151.2 80 160L80 448C80 456.8 87.2 464 96 464L99.3 464C109.7 427.1 143.7 400 184 400C224.3 400 258.2 427.1 268.7 464L371.3 464C376.2 446.6 386.4 431.3 400 420.1L400 160C400 151.2 392.8 144 384 144L96 144zM99.3 512L96 512C60.7 512 32 483.3 32 448L32 160C32 124.7 60.7 96 96 96L384 96C419.3 96 448 124.7 448 160L448 192L503.4 192C520.4 192 536.7 198.7 548.7 210.7L589.3 251.3C601.3 263.3 608 279.6 608 296.6L608 448C608 483.3 579.3 512 544 512L540.7 512C530.3 548.9 496.3 576 456 576C415.7 576 381.8 548.9 371.3 512L268.7 512C258.3 548.9 224.3 576 184 576C143.7 576 109.8 548.9 99.3 512zM448 320L560 320L560 296.6C560 292.4 558.3 288.3 555.3 285.3L514.7 244.7C511.7 241.7 507.6 240 503.4 240L448 240L448 320zM448 368L448 400.4C450.6 400.2 453.3 400 456 400C496.3 400 530.2 427.1 540.7 464L544 464C552.8 464 560 456.8 560 448L560 368L448 368zM184 528C206.1 528 224 510.1 224 488C224 465.9 206.1 448 184 448C161.9 448 144 465.9 144 488C144 510.1 161.9 528 184 528zM456 528C478.1 528 496 510.1 496 488C496 465.9 478.1 448 456 448C433.9 448 416 465.9 416 488C416 510.1 433.9 528 456 528z'/%3E%3C/svg%3E") !important;

}

/* 4. ДЛЯ КОМПЬЮТЕРОВ (экраны шире 768px): делаем сетку в ряд */
@media (min-width: 769px) {
    .maininfoboard {
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: stretch !important;
    }

    .maininfoboard_2,
    .maininfoboard_3,
    .maininfoboard_4 {
        flex: 1 !important;
        width: auto !important;
    }
}

/* Скрываем кнопку "Замовити в 1 клік" в блоке корзины */
.cartpage_table .display--additinal--cart:nth-of-type(2) #toCartOneCartButton,
#toCartOneCartButton {
    display: none !important;
}

/* Добавляем отступ сверху для контейнера кнопки "Продовжити покупки" */
.cartpage_table .display--additinal--cart:nth-of-type(2) {
    margin-top: 15px !important;
}
/* Адаптив блоку сортування тільки за допомогою CSS для мобільних */
@media (max-width: 768px) {
    /* Змінюємо головний контейнер сортування на блочний/флекс із перенесенням */
    div.sorting {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px 10px !important;
        padding: 10px !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    /* Назва "Сортувати по:" займає весь верхній рядок */
    div.sorting_title {
        width: 100% !important;
        font-weight: 600 !important;
        margin-bottom: 2px !important;
    }

    /* Комірки з варіантами сортування аккуратно групуються разом */
    div.sorting_sortingcell {
        display: inline-flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    /* Робимо самі елементи сортування схожими на акуратні компактні кнопки-плашки */
    div.sorting_sortingcell div, 
    div.sorting_sortingcell span {
        display: inline-block !important;
        padding: 4px 8px !important;
        background: #f1f1f1 !important;
        border-radius: 4px !important;
        font-size: 12px !important;
    }
}
/* Стилі для десктопної версії блоку сортування (екрани ширше 768px) */
@media (min-width: 769px) {
    div.sorting {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 12px 16px !important;
        background-color: #f9f9f9 !important;
        border: 1px solid #e5e5e5 !important;
        border-radius: 6px !important;
        margin-bottom: 20px !important;
    }

    /* Заголовок сортування */
    div.sorting_title {
        font-weight: 600 !important;
        color: #333 !important;
        margin-right: 15px !important;
        white-space: nowrap !important;
    }

    /* Контейнер для елементів сортування в ряд */
    div.sorting_sortingcell {
        display: flex !important;
        align-items: center !important;
        gap: 15px !important;
        flex-wrap: nowrap !important;
    }

    /* Посилання/елементи сортування на десктопі */
    div.sorting_sortingcell span,
    div.sorting_sortingcell a {
        cursor: pointer !important;
        transition: color 0.2s ease !important;
    }

    /* Ефект при наведенні миші */
    div.sorting_sortingcell span:hover,
    div.sorting_sortingcell a:hover {
        color: #d9531e !important; /* Ваш фірмовий оранжевий колір */
    }
}
/* Вирівнюємо зірочки в горизонтальний рядок у горизонтальному списку товарів */
.product_maininfo_hor div.product_rate_hor {
    display: flex !important;
    flex-direction: row !important;
    gap: 3px !important;
    align-items: center !important;
}
/* Робимо заголовки в блоці інформації напівжирними */
div[class*="maininfoboard_"] > div[class*="in1"],
.maininfoboard_2in1,
.maininfoboard_3in1,
.maininfoboard_4in1 {
    font-weight: 700 !important;
    margin-bottom: 8px !important;
    line-height: 1.2 !important;
}
/* Робимо YouTube-відео та його контейнери адаптивними на мобільних */
@media (max-width: 768px) {
    iframe[src*="youtube.com"],
    iframe[src*="youtu.be"],
    ytm-watch-player-controls,
    .ytp-player-controls,
    video,
    [class*="video"] {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
        box-sizing: border-box !important;
    }
}

/* 1. Розширюємо головний контейнер на всю ширину екрана на десктопах */
@media (min-width: 992px) {
    div.allcentermain,
    div.allcentermain_item,
    div.allcenterblock {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    div.allcenterblock {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: flex-start !important;
    }

    /* Фіксуємо ширину правої колонки з кольорами на ПК */
    div.productrightcolumn, 
    div.rightmain {
        flex: 0 0 100px !important;
        width: 100px !important;
        max-width: 100px !important;
        display: block !important;
        visibility: visible !important;
    }
}
/* --- МАКСИМАЛЬНЕ РОЗШИРЕННЯ КАРТКИ НА ВСЮ ШИРИНУ ЕКРАНА --- */
@media (max-width: 991px) {
    body, html {
        overflow-x: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Повністю обнуляємо відступи, роблячи картку на всі 100% ширини екрана */
    div.allcentermain,
    div.allcentermain_item,
    div.allcenterblock,
    div.productcolumns {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Внутрішні колонки теж на повну ширину */
    div.productleftcolumn, 
    div.productcentercolumn {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        text-align: center !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Назва та ціна товару */
    div.productcentercolumn h1,
    div.productcentercolumn div[class*="productname"],
    div.productcentercolumn div[class*="price"] {
        text-align: center !important;
        font-size: 19px !important;
    }

    /* Блок «Інші кольори» — горизонтальна лінія по центру */
    div.productrightcolumn, 
    div.rightmain {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 15px !important;
        margin-bottom: 15px !important;
        gap: 10px !important;
    }

    div.productrightcolumn > div:first-child,
    div.rightmain > div:first-child,
    div.productrightcolumn span,
    div.rightmain span {
        width: 100% !important;
        text-align: center !important;
        display: block !important;
    }

    div.productrightcolumn div[class*="columnitems"],
    div.productrightcolumn .columnitems_main,
    div.productrightcolumn a,
    div.rightmain a {
        display: inline-flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 3px !important;
    }

    div.productrightcolumn img, 
    div.rightmain img {
        max-width: 50px !important;
        width: auto !important;
        height: auto !important;
        display: inline-block !important;
    }
}
/* --- АККУРАТНЫЙ СЛАЙДЕР МИНИАТЮР НА МОБИЛЬНЫХ --- */
@media (max-width: 991px) {
    /* Контейнер под большой фото, куда входят миниатюры */
    div.smallitem,
    div.smallitem_info {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 0 2px !important;
        overflow: hidden !important;
    }

    /* Зона с картинками */
    div.smallitem_center {
        flex: 1 !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    /* Стрелки слева и справа: возвращаем им нормальный компактный вид */
    div.smallitem_left,
    div.smallitem_right {
        flex: 0 0 auto !important;
        width: 36px !important;
        max-width: 36px !important;
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    input#smallItemRight,
    input#smallItemLeft {
        width: 32px !important;
        height: 32px !important;
        box-sizing: border-box !important;
    }
}