/* ============================================================
   CUSTOM_2.CSS — правки сайта forex-robot.store
   Шаблон: UniShop2 3.6.7.2

   Файл создаётся заново. Правим в него по одному блоку за раз:
   добавили раздел → сохранили → проверили на всех типах страниц.

   Подключение: панель шаблона → «Свои стили»
   (custom_style = "slideshow.css, custom_2.css")

   Правила:
   - не меняем цвета сайта и расположение блоков;
   - не дублируем то, что уже подключает шаблон;
   - каждый раздел — отдельная задача, с комментарием зачем.

   История разделов:
   01. Карточка товара — вернуть подложку и отступы (07.11)
   02. Верхняя полоса и меню — отступы (07.11)
   03. Сетка контента — отступы модулей и заголовков (07.11)
   04. Вторая валюта (USDT) — стиль подписи (07.11)
   05. Облако SEO-тегов — вид ссылок (07.11)
   06. Баннеры в карточке товара — вид карточек (07.11)
   07. Иконки Font Awesome 4 → 6 (07.11)
   08. Дубль блока отзывов на главной — скрыть (07.11)
   09. Контент в описании — картинки не вылезают (07.11)
   ============================================================ */

/* ============================================================
   01. КАРТОЧКА ТОВАРА
   Проблема: карточки потеряли белую подложку и отступы,
   текст и кнопки прижаты к краям.
   ============================================================ */

.product-thumb {
	margin: 10px 0;
	padding: 10px;
	background: #fff;
	border: 1px solid #c5d0df;
	border-radius: 5px;
	transition: border-color .2s, box-shadow .2s;
}

.product-thumb:hover {
	border-color: rgba(0, 0, 0, .14);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .07);
}

.product-thumb__name {
	margin-bottom: 6px;
	line-height: 1.35;
}

.product-thumb__description {
	margin-bottom: 18px;
	line-height: 1.45;
}

.product-thumb__price {
	margin-bottom: 8px;
}

.product-thumb__cart {
	margin-top: 8px;
}

/* ============================================================
   02. МЕНЮ КАТЕГОРИЙ
   Проблема: меню упирается в слайдер, углы острые.
   ============================================================ */

.menu {
	margin-bottom: 20px;
	border-radius: 6px;
}

/* подложка у «хвоста» меню — цвет фона, как на боевом */
.main-menu.set-before::before {
	background: #f4f7fb;
}

/* ============================================================
   03. СЕТКА КОНТЕНТА
   Проблема: модули идут вплотную друг к другу, заголовки
   прижимаются к предыдущему блоку.
   ============================================================ */

.content-top .uni-module,
.content-bottom .uni-module {
	margin-bottom: 20px;
}

.content-top > .heading,
.content-bottom > .heading {
	margin-top: 15px;
	margin-bottom: 15px;
}

.content-top > .uni-module:first-child,
.content-bottom > .uni-module:first-child {
	margin-top: 0;
}

#column-left .uni-module,
#column-right .uni-module {
	margin-bottom: 18px;
}

#column-left > .heading,
#column-right > .heading {
	margin-top: 0;
	margin-bottom: 12px;
}

/* ============================================================
   04. ВТОРАЯ ВАЛЮТА (USDT)
   Класс .currency2 добавляет наш модуль партнёрских цен —
   шаблон о нём не знает, поэтому стиль задаём здесь.
   ============================================================ */

.currency2 {
	display: inline-block;
	margin-left: 4px;
	font-size: .7em;
	font-weight: 500;
	color: var(--a-c, #3d7db1);
	white-space: nowrap;
}

.price .price-old .currency2 {
	display: none;
}

/* ============================================================
   05. ОБЛАКО SEO-ТЕГОВ
   Ссылки тегов выводились как обычный текст — делаем их
   аккуратными чипами в цветах шаблона.
   ============================================================ */

.seotags_cloud .seotags_list {
	display: block;
	width: auto;
	padding: 0;
	font-size: 14px;
}

.seotags_cloud .seotags_list a {
	display: inline-block;
	margin: 0 5px 10px 2px;
	padding: 4px 10px;
	color: #4088c2;
	font-size: 12.6px;
	line-height: 17.64px;
	background: #fff;
	border: 1px solid #c5d0df;
	border-radius: 5px;
	transition: all .2s;
}

.seotags_cloud .seotags_list a:hover,
.seotags_cloud .seotags_list a:focus {
	color: #fff;
	background: #4088c2;
	border-color: #4088c2;
	outline: 0;
	box-shadow: none;
	text-decoration: none;
}

/* ============================================================
   06. БАННЕРЫ В КАРТОЧКЕ ТОВАРА
   Блоки «Как купить», «Поддержка» и т.д. — белые карточки
   вместо цветных плашек с затемнением.
   ============================================================ */

.product-banner__item-div {
	padding: 0 16px;
	height: calc(100% - 5px);
	margin: 0 0 3px;
	background: #fff;
	border: 1px solid #c5d0df;
	border-radius: 6px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
	transition: border-color .2s, box-shadow .2s;
}

.product-banner__item-div:after {
	display: none;
}

.product-banner__item-div:hover {
	border-color: var(--a-c, #3d7db1);
	box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

.product-banner__icon {
	color: var(--a-c, #3d7db1);
}

.product-banner__text {
	font-weight: 500;
	line-height: 1.35;
}

.product-banner__text-span {
	color: #777;
	font-size: .9em;
}

/* ============================================================
   07. ИКОНКИ FONT AWESOME 4 → 6
   В теме FA 6.5.1, старые модули выводят имена FA4
   (fa-trash-o, fa-star-o и т.д.) — без алиасов иконки пустые.
   ============================================================ */

.fa-trash-o:before              { content: "\f1f8"; }
.fa-star-o:before               { content: "\f005"; }
.fa-check-circle-o:before       { content: "\f058"; }
.fa-times-circle-o:before       { content: "\f057"; }
.fa-envelope-o:before           { content: "\f0e0"; }
.fa-user-o:before               { content: "\f007"; }
.fa-comment-o:before            { content: "\f075"; }
.fa-file-text-o:before          { content: "\f15c"; }
.fa-clock-o:before              { content: "\f017"; }
.fa-phone-square:before         { content: "\f095"; }
.fa-plus-circle-o:before        { content: "\f055"; }
.fa-minus-circle-o:before       { content: "\f056"; }
.fa-pencil-square-o:before      { content: "\f044"; }
.fa-search-plus:before          { content: "\f00e"; }
.fa-times-circle:before         { content: "\f057"; }
.fa-check-circle:before         { content: "\f058"; }
.fa-exclamation-triangle:before { content: "\f071"; }
.fa-arrow-circle-o-right:before { content: "\f0a9"; }
.fa-caret-square-o-down:before  { content: "\f150"; }

/* ============================================================
   08. ДУБЛЬ БЛОКА ОТЗЫВОВ НА ГЛАВНОЙ
   Тема выводит блок отзывов дважды: свой (без заголовка,
   подхватывает «Теги товаров») и модуль «Последние отзывы».
   Показываем только модуль. Временное решение.
   ============================================================ */

/* Заголовок первого блока внизу показываем (дубль отзывов убран переходом на uni_reviews) */


/* ============================================================
   09. КОНТЕНТ В ОПИСАНИИ
   Картинки и фреймы из описаний товаров не должны вылезать
   за пределы колонки.
   ============================================================ */

#tab-description img,
#tab-description iframe,
.product-page__description img,
.product-page__description iframe {
	max-width: 100%;
	height: auto;
	margin: 4px 0;
}

/* ============================================================
   10. МОБИЛЬНЫЕ ПРАВКИ
   ============================================================ */

@media (max-width: 766px) {
	#column-left,
	#column-right {
		padding: 8px;
	}

	.content-top > .heading,
	.content-bottom > .heading {
		margin-top: 12px;
		margin-bottom: 12px;
	}

	.product-thumb__description {
		margin-bottom: 14px;
	}
}

@media (min-width: 767px) {
  .product-page__image {
    position: static;
    position: sticky;
    top: 60px;
    transition: top ease-in-out .15s;
    background-image: url(/image/catalog/products/fon.jpg);
    background-repeat: no-repeat;
  }
}

/* ============================================================
   11. БЕЛАЯ КАРТОЧКА САЙТА
   Сайт (шапка + главное меню + контент) лежит на одной белой
   подложке со скруглёнными углами, верхняя полоса меню — вне её.

   В этой теме #top.top-menu лежит ВНУТРИ header, поэтому шапку
   целиком белой делать нельзя. Красим только контейнеры:
   header > .container (шапка и меню) и main > .container (контент).
   #top в контейнер не входит, поэтому остаётся на фоне body.
   ============================================================ */

header,
main {
	background: transparent;
}

header > .container,
main > .container,
main > .container-fluid {
	background: #fff;
}

/* верхние углы карточки — у контейнеров шапки, нижние — у контента */
header > .container {
	border-radius: 6px 6px 0 0;
}

main > .container:last-of-type,
main > .container-fluid:last-of-type {
	border-radius: 0 0 6px 6px;
}

/* меню — без нижнего отступа, чтобы не было шва внутри карточки */
.menu {
	margin-bottom: 0;
}

/* белая полоса под горизонтальным меню: отступ внутри белого контейнера,
   чтобы между меню и контентом был белый фон, а не body */
main > .container,
main > .container-fluid {
	padding-top: 20px;
}

/* ============================================================
   12. ВЕРХНЯЯ ПОЛОСА МЕНЮ
   Отдельная плашка над карточкой: свой фон, рамка и тень.
   ============================================================ */

.top-menu {
	background: var(--top-menu-bg, #f4f7fb);
	margin-bottom: 20px;
	border: 1px solid #c5d0df;
	box-shadow: 0 2px 4px #c5d0df;
}

main {
	margin: 0 auto;
}

h1 {
  margin: 0 0 5px;
}
.rating-model {
;
  margin: 0 0 20px;

}

/* ============================================================
   15. КРАТКОЕ ОПИСАНИЕ ПОД ИЗОБРАЖЕНИЕМ
   Блок mpn перенесён из списка характеристик в колонку с фото
   (модификатор mpn_under_image). Чтобы он встал под картинкой,
   колонка стала flex-контейнером, а блок получает order: 2.
   ============================================================ */

.product-page__image {
	display: flex;
	flex-direction: column;
}

.product-page__image-wrapper {
	order: 1;
	width: 100%;
}

.product-page__mpn {
	order: 2;
	margin-top: 12px;
	padding: 12px 14px;
	color: #555;
	font-size: 1.1em;
	font-style: italic;
	line-height: 1.5;
	background: #f4f7fb;
	border-radius: var(--border-radius-1, 4px);
}

/* ============================================================
   16. ШАПКА ПОД БОЕВОЙ САЙТ (09.11)
   Задача: шапка стенда визуально совпадает с forex-robot.store.
   Все значения сняты с боевого сайта через computed styles.

   Всё, кроме скрытия плашки, завёрнуто в min-width: 992px —
   на телефонах у шапки своя раскладка (раздел 10), и эти
   правила её ломали.
   ============================================================ */

/* 16.0 Плашка «Ведутся технические работы» — на боевом её нет */
.topstripe {
	display: none !important;
}

@media (min-width: 992px) {

	/* 16.1 Верхняя полоса: высота 43px, как на боевом (было 36) */
	#top.top-menu {
		height: 43px;
		line-height: 40px;
	}

	#top .container {
		min-height: 41px;
		align-items: center;
	}

	#top .top-links__ul {
		display: flex;
		align-items: center;
	}

	#top .top-links__li {
		margin: 0 20px 0 0;
	}

	#top .top-links__a {
		font-size: 12.75px;
		font-weight: 500;
		line-height: 24px;
		color: #434343;
	}

	/* «Личный кабинет» переехал в шапку к корзине — стили плашки верхнего меню удалены (10.11) */


	/* 16.2 Сетка шапки — как на боевом.
	   Ряд шире контейнера на 10px с каждой стороны (1160 при 1280,
	   1490 при 1920), поэтому отрицательные поля. */
	.header-block {
		margin: 0 -10px;
		padding: 25px 0 28px;
	}

	.header-block > .header-block__item-logo {
		flex: 0 0 25%;
	}

	/* логотип на 10px правее, как на боевом */
	#logo {
		margin-left: 10px;
	}

	.header-block > .header-block__item-search {
		flex: 0 0 38%;
	}

	/* min-width: 0 — иначе длинный e-mail растягивает блок и толкает корзину */
	.header-block > .header-block__item-telephone {
		justify-content: flex-end;
		flex: 0 0 22%;
		min-width: 0;
		padding: 0 0 0 20px;
	}

	.header-block > .header-block__item-account {
		flex: 0 0 9%;
		justify-content: flex-end;
		align-items: flex-end;
		padding: 0;
	}

	.header-block > .header-block__item-cart {
		flex: 0 0 6%;
		justify-content: center;
		padding: 0;
	}

	/* поле поиска — 463px при 1280, как на боевом */
	#search {
		padding: 0 10px;
	}

	/* 16.3 Поиск: белое поле с рамкой, кнопка-лупа 30×30 */
	#search .header-search__input {
		height: 34px;
		padding: 0 40px 0 12px;
		font-size: 13.5px;
		color: #434343;
		background: #fff;
		border: 1px solid #c5d0df;
		border-radius: 5px;
	}

	#search .header-search .search-btn {
		top: 2px;
		right: 2px;
		width: 30px;
		height: 30px;
		padding: 0;
		font-size: 15px;
		line-height: 30px;
		color: #434343;
		background: none;
		border-radius: 0;
		transform: none;
	}

	/* 16.4 Телефон и плашки «Телеграм / E-mail» */
	.header-phones,
	.header-phones.has-addit {
		padding-right: 0;
		text-align: right;
		max-width: 100%;
	}

	.header-phones__main {
		display: flex;
		align-items: center;
		justify-content: flex-end; /* телефон по правому краю, как и плашки под ним */
		max-width: 100%;
		overflow: hidden;
		min-width: 0;
		font-size: 18.75px;
		font-weight: 500;
		line-height: 26px;
		color: #434343;
	}

	/* иконка Telegram перед номером (в шаблоне не выводится) */
	.header-phones__main::before {
		content: "\f1d8";
		margin-right: 10px;
		font-family: "Font Awesome 5 Free";
		font-size: .9em;
		font-weight: 900;
		color: #434343;
	}

	/* flex вместо inline-block: иначе пробел между span выталкивает
	   вторую плашку на новую строку на ширине ~1024 */
	.header-phones__additionals {
		display: flex;
		justify-content: flex-end;
		gap: 5px;
		margin-top: 4px;
	}

	.header-phones__additional {
		display: inline-block;
		padding: 5px 8px;
		font-size: 15px;
		font-weight: 500;
		line-height: 18px;
		color: #fff;
		background: #77a24d;
		border-radius: 2px;
	}

	.header-phones__additional.selected {
		color: #fff; /* тема ставит свой цвет через --header-phones-m-c */
		background: #3d7db1;
	}

	.header-phones__additional + .header-phones__additional {
		margin-left: 0;
	}

	/* 16.5 Корзина: иконка 48px и счётчик-бейдж, как на боевом */
	.header-cart__btn {
		position: relative;
		width: 42px;
		height: 48px;
	}

	.header-cart__icon {
		font-size: 48px;
		line-height: 1;
	}

	#cart-total.header-cart__total-items {
		display: block !important;
		position: absolute;
		top: auto;
		right: -4px;
		bottom: -6px;
		min-width: 17px;
		height: 17px;
		padding: 0;
		font-size: 12px;
		line-height: 17px;
		color: #fff;
		text-align: center;
		background: #434343;
		border-radius: 100%;
	}

	/* 16.6 Меню: высота 50, шрифт 15, разделители — как на боевом */

	/* тема подкладывает под меню полосу шириной 100vw цветом body
	   (.main-menu.set-before::before). На боевом меню лежит на белой
	   карточке, поэтому полосу убираем — иначе вокруг меню серый фон. */
	.main-menu.set-before::before {
		display: none;
	}

	.menu2 {
		height: 50px;
		border-radius: 5px;
	}

	.menu2 .menu__collapse {
		height: 50px;
	}

	.menu2 .menu__collapse > li {
		height: 50px;
		box-shadow: inset -1px 0 0 rgba(0, 0, 0, .12);
	}

	.menu2 .menu__collapse > li:last-child {
		box-shadow: none;
	}

	.menu2 .menu__level-1-a {
		padding: 10px;
		font-size: 15px;
		font-weight: 400;
		line-height: 30px;
	}

	.menu2 .menu__level-1-icon {
		width: 18.75px;
		margin-right: 5px;
		font-size: 15px;
	}

} /* @media (min-width: 992px) */

/* ============================================================
   16.7 ШИРОКИЕ ЭКРАНЫ (≥1600)
   На боевом сайте с 1600px сетка шапки меняется:
   лого 20%, поиск 50%, телефон 20%, корзина 10%
   (до этого — 25 / 41.6 / 25 / 8.4).
   ============================================================ */

@media (min-width: 1600px) {

	.header-block > .header-block__item-logo {
		flex: 0 0 20%;
	}

	.header-block > .header-block__item-search {
		flex: 0 0 44%;
	}

	.header-block > .header-block__item-telephone {
		flex: 0 0 22%;
	}

	.header-block > .header-block__item-account {
		flex: 0 0 7%;
	}

	.header-block > .header-block__item-cart {
		flex: 0 0 7%;
	}

}

/* ============================================================
   17. ПЛИТКА ТОВАРА БЕЗ КНОПОК (09.11)
   На боевом сайте в плитках категорий и на главной нет ни
   «В корзину», ни избранного, ни сравнения — покупка только
   на странице товара (#button-cart). Иконки не используются.
   ============================================================ */

.product-thumb .add_to_cart,
.product-thumb__wishlist,
.product-thumb__compare,
/* те же кнопки на странице товара */
.product-page__wishlist-btn,
.product-page__compare-btn,
/* иконки в верхней полосе шапки (на телефонах они видны) */
.top-menu__wishlist,
.top-menu__compare {
	display: none !important;
}

/* ============================================================
   18. КАТЕГОРИЯ: H1 В КОЛОНКУ КОНТЕНТА (09.11)
   В этой теме .breadcrumb-h1 лежит НАД обеими колонками,
   поэтому заголовок визуально уезжал к левому столбцу.
   На боевом сайте H1 стоит в колонке контента, а левый
   столбец начинается с той же высоты.

   Раскладываем контейнер гридом: крошки — во всю ширину,
   затем слева столбец, справа — H1 и под ним контент.
   ============================================================ */

@media (min-width: 992px) {

	#product-category {
		display: grid;
		grid-template-columns: 290px minmax(0, 1fr);
		align-items: start;
		padding-left: 15px;
		padding-right: 15px;
	}

	#product-category > .breadcrumb-h1 {
		display: contents;
	}

	#product-category > .breadcrumb-h1 > .breadcrumb {
		grid-column: 1 / -1;
		grid-row: 1;
		margin: 0 0 6px 0;
	}

	/* заголовок — как на боевом: 30px, линия до правого края */
	#product-category > .breadcrumb-h1 > h1 {
		display: flex;
		align-items: center;
		grid-column: 2;
		grid-row: 2;
		margin: 0;
		padding: 0 0 0 10px;
		font-size: 30px;
		font-weight: 500;
		line-height: 33px;
		color: #555;
	}

	#product-category > .breadcrumb-h1 > h1::after {
		content: "";
		flex: 1;
		margin-left: 15px;
		border-bottom: 2px solid rgba(0, 0, 0, .1);
	}

	#product-category > .row {
		display: contents;
	}

	#product-category > .row > #column-left {
		grid-column: 1;
		grid-row: 2 / span 2;
		width: auto !important;
		margin: 0;
		padding: 0 15px 0 0;
	}

	#product-category > .row > #content {
		grid-column: 2;
		grid-row: 3;
		width: auto !important;
		margin: 0;
		padding: 0 0 0 10px;
	}

	/* если левого столбца нет — контент на всю ширину */
	#product-category:not(:has(#column-left)) {
		grid-template-columns: minmax(0, 1fr);
	}

	#product-category:not(:has(#column-left)) > .row > #content {
		grid-column: 1 / -1;
		grid-row: 2;
		padding-left: 10px;
	}

	/* --- сортировка ссылками — бежевые плашки, как на боевом --- */
	.sorts-block__span {
		display: inline-block;
		margin: 0 5px 0 0;
		padding: 6px 12px;
		font-size: 15px;
		line-height: 21px;
		color: #262626;
		background: #f7f4ce;
		border-radius: 5px;
		cursor: pointer;
		-webkit-user-select: none;
		user-select: none;
		transition: background-color .15s ease, color .15s ease;
	}

	.sorts-block__span:hover {
		background: #efe8b8;
	}

}

/* ============================================================
   19. ПОЛЯ В КАРТОЧКЕ ТОВАРА — ПОРЯДОК КАК НА БОЕВОМ (09.11)
   Тема собирает addit_fields в своём порядке (upc, ean, isbn,
   версия, даты, а «Наличие» вообще идёт после них).
   На боевом порядок другой: Разработчик → Версия → Ссылка →
   Платформа → Тип файлов → Наличие → Опубликовано → Обновлено.
   Переставляем визуально через flex order — PHP не трогаем.
   ============================================================ */

@media (min-width: 992px) {

	/* Ровный шаг строк как на боевом: строка 24px + 3px отступа = 27px.
	   Отступы задаём через gap, а не margin: у темы margin есть только
	   у НЕ последнего элемента, и после перестановки полей он «прыгал». */
	.product-data {
		display: flex;
		flex-direction: column;
		gap: 3px;
	}

	.product-data > li {
		order: 10;
		margin: 0 !important;
		line-height: 24px;
		min-height: 24px;
	}

	.product-data > .product-data__item.versiy {
		order: 1;
	}

	.product-data > .product-data__item.manufacturer {
		order: 2;
	}

	.product-data > .product-data__item.isbn {
		order: 3;
	}

	.product-data > .product-data__item.upc {
		order: 4;
	}

	.product-data > .product-data__item.ean {
		order: 5;
	}

	.product-data > .product-data__item.stock {
		order: 6;
	}

	.product-data > .product-data__item.date_published {
		order: 7;
	}

	.product-data > .product-data__item.date_updated {
		order: 8;
	}

	.product-data > .product-data__more-attr {
		order: 20;
	}

}

/* ============================================================
   20. МЕТКИ ПОЛЕЙ КАРТОЧКИ — КАК НА БОЕВОМ (09.11)
   На боевом сайте перед названием поля стоит ✅ (в настройках
   темы у upc/ean уже свои значки — их не дублируем).
   ============================================================ */

.product-data__item.manufacturer .product-data__item-div::before,
.product-data__item.versiy .product-data__item-div::before,
.product-data__item.isbn .product-data__item-div::before,
.product-data__item.stock .product-data__item-div::before,
.product-data__item.date_published .product-data__item-div::before,
.product-data__item.date_updated .product-data__item-div::before {
	content: "✅ ";
}


/* ============================================================
   21. ПЛИТКА ТОВАРА — ТИПОГРАФИКА КАК НА БОЕВОМ (09.11)
   У новой темы название 14px и цена жирнее, описание светлее.
   На боевом: название 18px, цена 20.25/500, описание 12.75 #333,
   рамка карточки #c5d0df, радиус 5.
   ============================================================ */

.product-thumb__image {
	margin-bottom: 10px;
}

@media (max-width: 575px) {
	.product-thumb__image {
		padding: 0;
	}
}

.product-thumb__name {
	margin: 0 0 5px;
	font-size: 18px;
	font-weight: 600;
	line-height: 25px;
}



.product-thumb__rating {
	margin: 0 0 10px;
	font-size: 15px;
}

.product-thumb .price {
	margin: 0 0 10px;
	font-size: 20.25px;
	font-weight: 500;
	line-height: 24px;
}

/* старая цена — перед новой, как на боевом */
.product-thumb .price-old {
	order: -1;
	margin: 2px 10px 0 0;
	font-size: 17.2px;
}

/* ============================================================
   22. ОТЗЫВЫ НА ГЛАВНОЙ — ТЕКСТ КРУПНЕЕ НА 1PX (09.11)
   Название 14 → 15, текст 13.3 → 14.3, автор/дата 12.6 → 13.6.
   ============================================================ */

.review-module__name {
	font-size: 15px;
	line-height: 21px;
}

.review-module__text {
	font-size: 14.3px;
	line-height: 20px;
}

.review-module__author,
.review-module__date {
	font-size: 13.6px;
	line-height: 19px;
}

/* ============================================================
   23. МОБИЛЬНАЯ ВЁРСТКА — УБИРАЕМ ГОРИЗОНТАЛЬНОЕ ПЕРЕПОЛНЕНИЕ (09.11)
   body — flex-колонка, а у main min-width: auto, поэтому на телефоне
   main растягивался по содержимому до 1822px при экране 390px,
   и вся вёрстка считалась «шире экрана» и обрезалась.
   ============================================================ */

@media (max-width: 991px) {

	html {
		overflow-x: hidden;
	}

	main {
		width: 100%;
		min-width: 0;
	}

}

/* ============================================================
   24. ЗВЁЗДЫ РЕЙТИНГА — РАЗМЕР 0.95 (09.11)
   Уменьшаем иконки звёзд на 5% во всех блоках (плитки, отзывы, карточка).
   ============================================================ */

.rating i {
	font-size: .95em;
}

/* ============================================================
   25. КОЛИЧЕСТВО ТОВАРА СКРЫТО (09.11)
   Покупка всегда на 1 шт.: убираем переключатель количества
   на странице товара, в корзине и в мини-корзине.
   Поле ввода остаётся в DOM (value = минимальное), поэтому
   добавление в корзину продолжает работать.
   ============================================================ */

.qty-switch,
.checkout-cart__quantity,
.header-cart__quantity {
	display: none !important;
}

/* ============================================================
   26. НАЗВАНИЕ ТОВАРА + «ПОДЕЛИТЬСЯ» И «РАСПЕЧАТАТЬ» (09.11)
   Строка отзывов увеличена до 1.2em. Кнопки «Поделиться» и
   «Распечатать» стоят справа на строке названия (перенос и
   добавление кнопки делает user_js в настройках темы).
   ============================================================ */

.product-page__rating {
	font-size: 1.2em;
}

/* «Поделиться» стоит в строке «В корзину», правее кнопки на 40px (10.11) */
.product-page__cart {
	align-items: center;
}

/* у кнопки «В корзину» свой margin-right 15px — добавляем 25, чтобы визуально вышло 40 */
.product-page__cart .product-page__share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 38px;
	margin: 0 0 0 25px;
}

/* текст «Поделиться» перед иконкой (в шаблоне только иконка) */
.product-page__cart .product-page__share-btn::before {
	content: 'Поделиться';
	margin-right: 7px;
}

/* убираем нижний отступ «В корзину», иначе кнопки стоят на разной высоте */
.product-page__cart .product-page__add-to-cart {
	margin-bottom: 0;
}

.product-page__cart .product-page__share-btn i {
	font-size: 1.3em;
	vertical-align: middle;
}

/* ============================================================
   27. КАРТОЧКА ТОВАРА: «НАЛИЧИЕ» СКРЫТО, МОБИЛЬНЫЙ ПОРЯДОК
   И ОФОРМЛЕНИЕ БЛОКА ПОКУПКИ (09.11)
   ============================================================ */

/* 27.1 Поле «Наличие» не показываем */
.product-data__item.stock {
	display: none !important;
}

/* 27.2 На телефоне поля идут в том же порядке, что на ПК,
   и по одной строке «Название ..... Значение», как на боевом */
@media (max-width: 991px) {

	.product-page .product-data {
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 0;
		width: 100%;
		margin: 0 0 20px;
	}

	.product-page .product-data__item {
		display: flex;
		width: 100%;
		flex-wrap: nowrap;
		align-items: flex-end;
		padding: 0;
		margin: 0 0 8px !important;
		font-size: 1em;
	}

	.product-page .product-data__item:last-child {
		margin-bottom: 0 !important;
	}

	/* название — фиксированная колонка, чтобы значения начинались на одной линии */
	.product-page .product-data__item-div {
		width: 56% !important;
		min-width: 56% !important;
		flex: 0 0 auto;
		margin: 0;
		font-size: .95em;
		font-weight: 500;
		color: inherit;
		white-space: nowrap;
	}

	.product-page .product-data__item-div::before {
		flex: 0 0 auto;
	}

	/* возвращаем пунктирную линию до значения */
	.product-page .product-data__item-div:after {
		display: block;
		content: '';
		flex: 1 1 auto;
		min-width: 10px;
		margin: 0 10px 5px;
		border-bottom: dotted 1px #bbb;
	}

	.product-data > li {
		order: 10;
		line-height: 24px;
		min-height: 24px;
	}

	.product-data > .product-data__item.versiy {
		order: 1;
	}

	.product-data > .product-data__item.manufacturer {
		order: 2;
	}

	.product-data > .product-data__item.isbn {
		order: 3;
	}

	.product-data > .product-data__item.upc {
		order: 4;
	}

	.product-data > .product-data__item.ean {
		order: 5;
	}

	.product-data > .product-data__item.stock {
		order: 6;
	}

	.product-data > .product-data__item.date_published {
		order: 7;
	}

	.product-data > .product-data__item.date_updated {
		order: 8;
	}

	.product-data > .product-data__more-attr {
		order: 20;
	}

}

/* 27.3 Карточка полей товара — на экранах больше телефона */
@media (min-width: 768px) {
	.product-block .product-data {
		margin: 0 0 25px;
		padding: 18px 22px;
		background: #f8fafc;
		border: 1px solid #c5d0df;
		border-radius: 5px;
	}
}
/* ============================================================
   28. ЕДИНАЯ СЕТКА ПО КРАЯМ: ЛЕВО 70, ПРАВО 1210 (10.11)
   Все блоки — шапка, меню, хлебные крошки, заголовки,
   контент — выравниваются по одной вертикали.
   ============================================================ */

@media (min-width: 992px) {

	/* корзина прижата к правому краю контента, как кнопка «Личный кабинет» сверху */
	.header-block > .header-block__item-cart {
		justify-content: flex-end;
		padding-right: 10px;
	}

	/* контент карточки товара — по общему левому краю, как название */
	#product-product .uni-wrapper {
		padding-left: 0;
		padding-right: 0;
	}

	/* h1 в текстовом HTML-модуле — по общему левому краю */
	.content-bottom .html-module:has(h1) {
		padding-left: 0;
		padding-right: 0;
	}

}

/* ============================================================
   29. АККАУНТ В ШАПКЕ У КОРЗИНЫ + КУРС USDT (10.11)
   В теме включён показ иконки аккаунта в шапке (позиция 2),
   в верхнем меню его больше нет — старые стили плашки убраны.
   ============================================================ */

@media (min-width: 992px) {


}

/* иконки аккаунта и корзины — одного размера и начертания */
@media (min-width: 992px) {

	/* иконки аккаунта и корзины: один размер 2.8em, подпись вплотную */
	.header-block__item-account,
	.header-block__item-cart {
		justify-content: center;
		align-items: center;
	}

	.header-cart__btn {
		position: relative;
		width: auto;
		height: auto;
		line-height: 1;
	}

	.header-block__item-account .header-account__icon,
	.header-block__item-cart .header-cart__icon,
	.header-block__item-account + .header-block__item-cart .header-cart__icon {
		display: block;
		font-size: 2.8em;
		line-height: 1;
	}

	.header-block__item-account .header-account__icon {
		font-weight: 900; /* solid, как у корзины (в шаблоне far — контур) */
	}

	.header-block__item-account .header-block__item-caption,
	.header-block__item-cart .header-block__item-caption {
		margin-top: 2px;
		line-height: 14px;
	}

	/* бейдж корзины — у самой иконки */
	#cart-total.header-cart__total-items {
		top: -6px;
		right: -12px;
		bottom: auto;
	}

}

/* курс USDT в верхнем меню справа */
.top-menu__usdt {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0 15px 0 0;
	font-size: 12.75px;
	font-weight: 500;
	color: #434343;
	white-space: nowrap;
}

.top-menu__usdt i {
	font-size: .95em;
	color: #77a24d;
}

.top-menu__usdt b {
	font-weight: 700;
	color: #3d7db1;
}

/* ============================================================
   31. ВКЛАДКИ ТОВАРА НА ТЕЛЕФОНЕ — ОДНА СТРОКА С ПРОКРУТКОЙ (10.11)
   Если названия вкладок не влезают в экран, они не переносятся
   на новую строку, а листаются по горизонтали.
   ============================================================ */

@media (max-width: 991px) {

	.product-page-tabs {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;      /* Firefox */
		-ms-overflow-style: none;   /* IE/Edge */
	}

	.product-page-tabs::-webkit-scrollbar {
		display: none;              /* Chrome/Safari */
	}

	.product-page-tabs > li {
		flex: 0 0 auto;
	}

	.product-page-tabs > li > a {
		white-space: nowrap;
	}

}

/* ============================================================
   32. ОТЗЫВЫ В КОНЦЕ ОПИСАНИЯ ТОВАРА (10.11)
   Блок добавляет модификатор 138 desc_reviews:
   2 последних отзыва с 5 звёздами + ссылка на вкладку отзывов.
   ============================================================ */

.desc-reviews {
	margin: 25px 0 0;
	padding: 18px 20px;
	background: #f8fafc;
	border: 1px solid #c5d0df;
	border-radius: 5px;
}

.desc-reviews__title {
	margin: 0 0 14px;
	font-size: 19px;
	font-weight: 500;
	line-height: 1.3;
	color: #434343;
}

.desc-reviews__item + .desc-reviews__item {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #dfe6ef;
}

.desc-reviews__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: 6px;
}

.desc-reviews__rating {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: #77a24d;
}

.desc-reviews__name {
	font-size: 14px;
	font-weight: 600;
	color: #434343;
}

.desc-reviews__date {
	font-size: 12.6px;
	color: #888;
}

.desc-reviews__text {
	font-size: 14px;
	line-height: 1.5;
	color: #333;
}

.desc-reviews__all {
	display: inline-block;
	margin-top: 14px;
	font-size: 14px;
	font-weight: 500;
	color: #3d7db1;
	border-bottom: 1px dotted #3d7db1;
	cursor: pointer;
}

.desc-reviews__all:hover {
	color: #2f6390;
	border-bottom-color: #2f6390;
}

/* ============================================================
   33. КАРТИНКИ В ТЕКСТОВОМ КОНТЕНТЕ НЕ ШИРЕ КОНТЕЙНЕРА (10.11)
   Правильный способ: ограничить max-width: 100% + height: auto
   только у картинок внутри текстовых блоков (описания, вкладки,
   статьи) — иконки, логотип и слайдеры не затрагиваются.
   ============================================================ */

.article_description img,
.category-info__description img,
.news-page__description img,
.product-description img,
.tab-content img,
#tab-description img,
#tab-additional img,
#tab-review .review-list__comment img {
	max-width: 100%;
	height: auto;
}

/* ============================================================
   34. ЕДИНЫЙ ЦВЕТ ГРАНИЦ — #c5d0df (10.11)
   Все карточки, модули и контролы с серыми границами
   приведены к цвету границ карточек товара.
   ============================================================ */

.review-module__item,
.news-thumb,
.category-list__item,
.uni-slideshow,
.container-faq,
.product-page__image-main,
.product-page__image-addit-img,
.footer__text,
.risk-warning,
.owl-carousel .owl-prev,
.owl-carousel .owl-next {
	border-color: #c5d0df !important;
}

.form-control,
.sorts-block__select {
	border-color: #c5d0df;
}

/* у параграфа-предупреждения в контенте свой инлайн-стиль — перебиваем */
.risk-warning {
	border-top-color: #c5d0df !important;
}

/* ============================================================
   35. НАЗВАНИЕ ТОВАРА И HTML-МОДУЛИ НА ГЛАВНОЙ (10.11)
   ============================================================ */

.product-thumb__name {
	font-weight: 600;
}

.home-page .html-module {
	padding: 0;
	background: none;
}

/* ============================================================
   36. ОТЗЫВЫ В КАРТОЧКЕ ТОВАРА — КОМПАКТНЫЕ КАРТОЧКИ (10.11)
   Было: одна широкая карточка на всю строку, слева колонка
   рейтинг/имя/дата/голоса высотой 148px, справа текст 45px —
   много пустого места. Стало: сетка 2 колонки, шапка в одну
   строку, текст ниже.
   ============================================================ */

#tab-review .review-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

#tab-review .review-list__item {
	margin: 0;
	padding: 14px 16px;
	border-radius: 5px;
	display: flex;
}

#tab-review .review-list__item > div {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
	min-width: 0;
}

#tab-review .review-list__info {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 10px;
	width: 100%;
	flex: 0 0 auto;
}

#tab-review .review-list__rating {
	margin: 0;
	font-size: 13px;
	line-height: 1;
}

#tab-review .review-list__name {
	margin: 0;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.3;
}

#tab-review .review-list__date {
	margin: 0;
	color: #8a8f96;
	font-size: 12.5px;
	line-height: 1.3;
}

#tab-review .review-list__votes {
	display: flex;
	align-items: center;
	margin: 0 0 0 auto;
	padding: 0;
	gap: 12px;
}

#tab-review .review-list__votes .review-list__date {
	margin: 0;
	color: #8a8f96;
	font-size: 12.5px;
}

#tab-review .review-list__info-text {
	width: 100%;
	flex: 0 1 auto;
}

#tab-review .review-list__comment {
	font-size: 13.5px;
	line-height: 1.5;
	color: #333;
}

#tab-review .review-list__images {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 2px 0 0;
}

#tab-review .review-list__images img {
	width: 72px;
	height: 58px;
	object-fit: cover;
	border: 1px solid #c5d0df;
	border-radius: 4px;
}

@media (max-width: 991px) {
	#tab-review .review-list {
		gap: 10px;
	}

	#tab-review .review-list__item {
		padding: 12px 14px;
	}

	#tab-review .review-list__votes {
		flex-basis: 100%;
		margin-left: 0;
		justify-content: flex-end;
	}
}

/* ============================================================
   37. «ПОДЕЛИТЬСЯ»: НА ПК — В СТРОКЕ H1 СПРАВА,
   НА ТЕЛЕФОНЕ — У КНОПКИ «В КОРЗИНУ» БЕЗ ТЕКСТА (10.11)
   ============================================================ */

.breadcrumb-h1 {
	position: relative;
}

.product-page__share-btn--title {
	position: absolute;
	right: 0;
	bottom: 0;
	display: inline-flex;
	align-items: center;
	height: 36px;
	margin: 0;
}

.product-page__share-btn--title::before {
	content: 'Поделиться';
	margin-right: 7px;
}

/* ПК: кнопка в строке H1, из блока покупки убираем */
@media (min-width: 767px) {
	.breadcrumb-h1 h1 {
		padding-right: 170px;
	}

	.product-page__cart .product-page__share-btn {
		display: none;
	}
}

/* Телефон: кнопка у «В корзину», только иконка и меньший отступ */
@media (max-width: 766px) {
	.product-page__share-btn--title {
		display: none;
	}

	.product-page__cart .product-page__share-btn {
		margin-left: 8px;
	}

	.product-page__cart .product-page__share-btn::before {
		content: none;
	}
}

/* ============================================================
   38. МЕНЮ КАТЕГОРИЙ В САЙДБАРЕ (статьи/новости) — КРУПНЕЕ (10.11)
   ============================================================ */

.menu-module {
	border-color: #c5d0df;
	overflow: hidden;
}

.menu-module__li + .menu-module__li {
	border-top: 1px solid #eef2f7;
}

.menu-module__a {
	font-size: 15px;
	font-weight: 600;
	color: #2f4a63;
	padding: 14px 16px;
	transition: color .15s ease, background-color .15s ease;
}

.menu-module__a:hover,
.menu-module__a.active {
	color: #4088c2;
}

i.menu-module__chevron {
	width: 30px;
	height: 30px;
	font-size: 12px;
	border-radius: 6px;
	background: #f2f6fa;
	color: #4088c2;
}

.menu-module__children {
	padding: 2px 0 6px;
}

.menu-module__children li + li {
	border-top: 1px dashed #eef2f7;
}

.menu-module__children-a {
	font-size: 14px;
	line-height: 1.45;
	color: #333;
	padding: 9px 14px 9px 22px;
	border-left: 2px solid transparent;
	transition: color .15s ease, background-color .15s ease, border-color .15s ease;
}

.menu-module__children-a:hover {
	color: #4088c2;
	background: #f7fafd;
}

.menu-module__children-a.active {
	color: #4088c2;
	font-weight: 600;
	border-left-color: #4088c2;
	background: #f2f8fd;
}

/* ============================================================
   39. СТРАНИЦА «ВСЕ ОТЗЫВЫ» (/reviews) (10.11)
   ============================================================ */

.all-reviews__sorts {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 16px;
}

.all-reviews__sorts .sorts-block__span {
	margin: 0;
	text-decoration: none;
}

.all-reviews__sorts .sorts-block__span.selected {
	background: #4088c2;
	color: #fff;
	font-weight: 600;
}

.all-reviews__sorts .sorts-block__span.selected:hover {
	background: #3576ac;
	color: #fff;
}

.all-reviews {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.all-reviews__item {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	background: #fff;
	border: 1px solid #c5d0df;
	border-radius: 5px;
	padding: 16px 18px;
}

.all-reviews__body {
	flex: 1 1 auto;
	min-width: 0;
}

.all-reviews__title {
	display: block;
	font-size: 16px;
	font-weight: 600;
	color: #2f4a63;
	line-height: 1.35;
	margin-bottom: 8px;
}

.all-reviews__title:hover {
	color: #4088c2;
}

.all-reviews__image {
	flex: 0 0 245px;
	max-width: 245px;
}

.all-reviews__image img {
	width: 245px;
	height: 197px;
	object-fit: cover;
	border-radius: 5px;
	border: 1px solid #eef2f7;
}

.all-reviews .review-list__info {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 12px;
	margin-bottom: 8px;
}

.all-reviews .review-list__rating,
.all-reviews .review-list__name,
.all-reviews .review-list__date {
	margin: 0;
}

.all-reviews .review-list__name {
	font-weight: 600;
	font-size: 14px;
}

.all-reviews .review-list__date {
	color: #8a8f96;
	font-size: 12.5px;
	margin-left: 0;
}

.all-reviews__likes {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 9px;
	border-radius: 12px;
	background: #f2f6fa;
	color: #8a8f96;
	font-size: 12.5px;
	line-height: 18px;
	white-space: nowrap;
}

.all-reviews__likes.has-likes {
	background: #e8f2fb;
	color: #4088c2;
	font-weight: 600;
}

.all-reviews__likes i {
	margin: 0;
	font-size: 12px;
}

.all-reviews .review-list__real-buyer {
	margin: 0;
}

.all-reviews__text {
	font-size: 14px;
	line-height: 1.5;
	color: #333;
}

.all-reviews__plus,
.all-reviews__minus {
	margin-top: 8px;
	font-size: 13.5px;
	color: #333;
}

.all-reviews__plus span,
.all-reviews__minus span {
	display: block;
	font-weight: 600;
	color: #6b7a8c;
	font-size: 12.5px;
	margin-bottom: 2px;
}

.all-reviews__images {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 10px;
}

.all-reviews__images img {
	width: 92px;
	height: 74px;
	object-fit: cover;
	border-radius: 4px;
	border: 1px solid #c5d0df;
}

.all-reviews__reply {
	margin-top: 12px;
	background: #f6f9fc;
	border-left: 3px solid #c5d0df;
	border-radius: 0 5px 5px 0;
	padding: 10px 14px;
	font-size: 13.5px;
	line-height: 1.5;
	color: #333;
}

.all-reviews__reply-heading {
	font-weight: 600;
	color: #2f4a63;
	margin-bottom: 4px;
	font-size: 13px;
}

.all-reviews__empty {
	padding: 30px 0;
	text-align: center;
	color: #6b7a8c;
}

@media (max-width: 575px) {
	.all-reviews__item {
		padding: 12px 14px;
		flex-direction: column;
	}

	.all-reviews__image {
		flex: 0 0 auto;
		max-width: 100%;
	}

	.all-reviews__image img {
		width: 100%;
		height: auto;
	}

	.all-reviews .review-list__date {
		margin-left: 0;
	}
}

/* ============================================================
   40. «САМЫЙ ПОПУЛЯРНЫЙ ОТЗЫВ» — БЕЙДЖ НАД ОТЗЫВОМ (10.11)
   В шаблоне бейдж — соседний flex-элемент, из-за нашего
   .review-list__item { display:flex } он занимал половину ширины.
   ============================================================ */

#tab-review .review-list__item.popular {
	flex-wrap: wrap;
}

#tab-review .review-list__item.popular > .review-list__popular-text {
	flex: 0 0 auto;
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	gap: 6px;
	width: auto;
	margin: 0 0 10px;
	padding: 4px 12px;
	background: #fdf0ea;
	border-radius: 12px;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 18px;
	color: #e25822;
}

#tab-review .review-list__item.popular > .review-list__popular-text i {
	font-size: 12px;
}
