/**
 * Snabdent — страница товара.
 * Подключается последним, перебивает старые правила style.css.
 */

/* ---------------------------------------------------------------------------
 * 1. Раскладка
 *
 * На .type-product навешен display:flex + flex-wrap, поэтому вкладки, пустой
 * рекламный блок и «Вам пригодится» становились колонками рядом с описанием:
 * описание сжималось до ~65% ширины, справа оставалась пустая дыра.
 * Нижние блоки возвращаем на всю ширину.
 * ------------------------------------------------------------------------- */

.woocommerce div.product.type-product > .woocommerce-tabs,
.woocommerce div.product.type-product > .ads-banner,
.woocommerce div.product.type-product > .related,
.woocommerce div.product.type-product > .up-sells,
.woocommerce div.product.type-product > .cross-sells,
.woocommerce div.product.type-product > .single-product-bottom {
	flex: 1 1 100% !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* Пустой блок под баннер не должен занимать место */
.woocommerce div.product .ads-banner:empty {
	display: none !important;
}

/* Правая колонка по высоте content'а, без растягивания на всю строку */
.woocommerce div.product div.summary.entry-summary {
	align-self: flex-start;
	min-height: 0 !important;
}

/* ---------------------------------------------------------------------------
 * 2. Описание товара
 * ------------------------------------------------------------------------- */

/* Пункты показаний свёрстаны плитками с галочкой ::before —
   родной маркер списка давал второй значок «✓ •». */
.woocommerce-tabs .panel ul li {
	list-style: none !important;
}

/* Свёрнутое описание обрезается по высоте посреди плитки.
   Добавляем затухание, чтобы обрез читался как «есть продолжение». */
.woocommerce-tabs .product-content.closed {
	-webkit-mask-image: linear-gradient(to bottom, #000 72%, rgba(0, 0, 0, .15) 100%);
	mask-image: linear-gradient(to bottom, #000 72%, rgba(0, 0, 0, .15) 100%);
}

.woocommerce-tabs .more-less-buttons {
	text-align: center;
}

/* ---------------------------------------------------------------------------
 * 3. Карточки товаров в каруселях «Вам пригодится» / сопутствующих
 *    (на странице товара они оставались со старой вёрсткой кнопки)
 * ------------------------------------------------------------------------- */

:is(.related, .up-sells, .cross-sells) .product .product-wrapper {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 14px 14px 16px !important;
	background: #fff;
	border: 1px solid #e8e9ee;
	border-radius: 12px;
	transition: box-shadow .25s ease, border-color .25s ease;
}

:is(.related, .up-sells, .cross-sells) .product .product-wrapper:hover {
	border-color: rgba(4, 104, 199, .35);
	box-shadow: 0 12px 26px rgba(17, 24, 39, .10);
}

:is(.related, .up-sells, .cross-sells) .product .thumbnail-wrapper > a {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	width: 100%;
	overflow: hidden;
}

:is(.related, .up-sells, .cross-sells) .product .thumbnail-wrapper figure {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	margin: 0 !important;
	padding: 0 !important;
}

:is(.related, .up-sells, .cross-sells) .product .thumbnail-wrapper figure img {
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	padding: 0 !important;
	object-fit: contain;
	mix-blend-mode: multiply;
}

:is(.related, .up-sells, .cross-sells) .product .product-name {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	height: auto !important;
	min-height: 3.9em;
	margin: 14px 0 6px !important;
	font-size: 14px !important;
	line-height: 1.35 !important;
	font-weight: 500 !important;
	text-align: center;
}

:is(.related, .up-sells, .cross-sells) .product .product-name a {
	color: #2f2f2f !important;
}

:is(.related, .up-sells, .cross-sells) .product .product-name a:hover {
	color: #0468c7 !important;
}

:is(.related, .up-sells, .cross-sells) .product .sd-card__meta {
	margin: 0 0 10px !important;
	font-size: 12px;
	line-height: 1.4;
	color: #8d8d97;
	text-align: center;
}

:is(.related, .up-sells, .cross-sells) .product .sd-card__meta span + span:before {
	content: " · ";
	color: #c9c9d1;
}

:is(.related, .up-sells, .cross-sells) .product .meta-wrapper {
	margin-top: auto !important;
	padding: 12px 0 0 !important;
	text-align: center;
}

:is(.related, .up-sells, .cross-sells) .product .thumbnail-wrapper .product-group-button {
	display: none !important;
}

/* Кнопка: нейтральная по умолчанию, заливка — по наведению */
:is(.related, .up-sells, .cross-sells) .product a.button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 12px !important;
	background: transparent !important;
	color: #2f2f2f !important;
	border: 1px solid #e8e9ee !important;
	border-radius: 8px !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	text-transform: none !important;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}

:is(.related, .up-sells, .cross-sells) .product a.button:hover {
	background: #0468c7 !important;
	border-color: #0468c7 !important;
	color: #fff !important;
}

:is(.related, .up-sells, .cross-sells) .product a.button .ts-tooltip {
	position: static !important;
	display: inline !important;
	visibility: visible !important;
	opacity: 1 !important;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	color: inherit !important;
	font-size: inherit !important;
	line-height: 1 !important;
	box-shadow: none !important;
	transform: none !important;
}

:is(.related, .up-sells, .cross-sells) .product a.button .ts-tooltip:before,
:is(.related, .up-sells, .cross-sells) .product a.button .ts-tooltip:after {
	display: none !important;
}

/* Карточки в карусели — одной высоты, кнопки на одной линии */
:is(.related, .up-sells, .cross-sells) .owl-stage {
	display: flex;
	align-items: stretch;
}

:is(.related, .up-sells, .cross-sells) .owl-item {
	display: flex;
}

:is(.related, .up-sells, .cross-sells) .owl-item > .product {
	display: flex;
	width: 100%;
}

:is(.related, .up-sells, .cross-sells) .owl-item > .product {
	align-items: stretch;
}

:is(.related, .up-sells, .cross-sells) .owl-item .product-wrapper {
	flex: 1 1 auto;
}

/* Кнопка внутри карусели должна тянуться на всю ширину карточки */
:is(.related, .up-sells, .cross-sells) .product .product-group-button-meta,
:is(.related, .up-sells, .cross-sells) .product .but-cat {
	display: block !important;
	width: 100% !important;
}


/* ---------------------------------------------------------------------------
 * 5. Заголовок товара и кнопка «В корзину»
 *
 * В style.css они были скрыты:
 *   .entry-summary .product_title { display: none; visibility: hidden }
 *   .product_cat-stomatologicheskie-raskhodnye-materialy .cart { display: none !important }
 * Здесь возвращаем. Чтобы снова спрятать — удалите две первые строки этого блока.
 * ------------------------------------------------------------------------- */

.woocommerce div.product .entry-summary h1.product_title {
	display: block !important;
	visibility: visible !important;
	margin: 0 0 12px !important;
}

.woocommerce div.product .entry-summary form.cart {
	display: block !important;
}

/* Карточка справа — без тени */
.woocommerce div.product div.summary.entry-summary {
	box-shadow: none !important;
	border: 1px solid #e8e9ee;
}


/* ---------------------------------------------------------------------------
 * 6. Блок вкладок — минималистичный стиль с акцентами
 * ------------------------------------------------------------------------- */

/* Контейнер: плоская карточка вместо синей тени */
.woocommerce div.product .woocommerce-tabs {
	background: #fff !important;
	border: 1px solid #e8e9ee !important;
	border-radius: 14px !important;
	box-shadow: none !important;
	padding: 0 0 8px !important;
	overflow: hidden !important;
}

/* Полоса вкладок */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex !important;
	flex-wrap: nowrap;
	overflow-x: auto;
	background: none !important;
	border: 0 !important;
	border-bottom: 1px solid #e8e9ee !important;
	margin: 0 !important;
	padding: 0 10px !important;
	list-style: none;
	scrollbar-width: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs:before,
.woocommerce div.product .woocommerce-tabs ul.tabs:after {
	display: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	display: block !important;
	flex: 0 0 auto;
	float: none !important;
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li:before,
.woocommerce div.product .woocommerce-tabs ul.tabs li:after {
	display: none !important;
}

.woocommerce .site-content div.product .woocommerce-tabs ul.tabs li > a,
.woocommerce div.product .woocommerce-tabs ul.tabs li > a {
	display: block !important;
	position: relative;
	padding: 18px 18px 16px !important;
	background: none !important;
	border: 0 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #8d8d97 !important;
	white-space: nowrap;
	transition: color .2s ease;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li > a:before {
	display: none !important;
}

/* Акцентное подчёркивание активной вкладки */
.woocommerce div.product .woocommerce-tabs ul.tabs li > a:after {
	content: "";
	position: absolute;
	left: 18px;
	right: 18px;
	bottom: -1px;
	height: 2px;
	background: #0468c7;
	opacity: 0;
	transform: scaleX(.4);
	transform-origin: center;
	transition: opacity .2s ease, transform .2s ease;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li:hover > a {
	color: #2f2f2f !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active > a {
	color: #0468c7 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active > a:after {
	opacity: 1;
	transform: scaleX(1);
}

/* Содержимое вкладки */
.woocommerce div.product .woocommerce-tabs .panel {
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 28px 32px 24px !important;
	font-size: 15px !important;
	line-height: 1.75 !important;
	color: #3a3a46 !important;
}

.woocommerce div.product .woocommerce-tabs .panel > :first-child {
	margin-top: 0 !important;
}

.woocommerce div.product .woocommerce-tabs .panel p {
	margin: 0 0 14px;
}

/* Подзаголовки описания — тихие метки разделов */
.woocommerce div.product .woocommerce-tabs .panel h2,
.woocommerce div.product .woocommerce-tabs .panel h3,
.woocommerce div.product .woocommerce-tabs .panel h4 {
	margin: 26px 0 12px !important;
	padding-top: 14px;
	border-top: 1px solid #eef0f4;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #8d8d97 !important;
}

/* Списки в описании — светлые плитки вместо залитых синих */
.woocommerce div.product .woocommerce-tabs .panel ul {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
	gap: 10px !important;
	margin: 0 0 18px !important;
	padding: 0 !important;
	list-style: none;
}

.woocommerce div.product .woocommerce-tabs .panel ul li {
	position: relative;
	background: #fff !important;
	border: 1px solid #e8e9ee !important;
	border-left: 1px solid #e8e9ee !important;
	border-radius: 10px !important;
	padding: 14px 16px 14px 46px !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	color: #2f2f2f !important;
	list-style: none !important;
	transition: border-color .2s ease, box-shadow .2s ease;
}

.woocommerce div.product .woocommerce-tabs .panel ul li:hover {
	border-color: rgba(4, 104, 199, .35) !important;
	box-shadow: 0 6px 16px rgba(17, 24, 39, .06);
}

/* Галочка-акцент в кружке */
.woocommerce div.product .woocommerce-tabs .panel ul li:before {
	content: "\2713" !important;
	position: absolute !important;
	left: 14px !important;
	top: 13px !important;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	border-radius: 50%;
	background: rgba(4, 104, 199, .12);
	color: #0468c7 !important;
	font-size: 11px;
	font-weight: 700;
}

/* Таблица «Детали» — волосяные линии вместо синих блоков */
.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes {
	width: 100%;
	margin: 0;
	border: 0 !important;
	border-collapse: collapse;
}

.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes tr,
.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes tbody tr {
	background: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes th {
	width: 38%;
	background: none !important;
	border: 0 !important;
	border-bottom: 1px solid #eef0f4 !important;
	padding: 14px 16px 14px 0 !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #8d8d97 !important;
	text-align: left;
	vertical-align: middle !important;
}

.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes td {
	background: none !important;
	border: 0 !important;
	border-bottom: 1px solid #eef0f4 !important;
	padding: 14px 0 !important;
	font-size: 15px !important;
	color: #2f2f2f !important;
	vertical-align: middle !important;
}

.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes tr:last-child th,
.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes tr:last-child td {
	border-bottom: 0 !important;
}

.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes td p {
	margin: 0 !important;
}

.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes td a {
	color: #0468c7 !important;
}

/* Кнопка «Развернуть» — призрачная, заливка по наведению */
.woocommerce div.product .woocommerce-tabs .more-less-buttons {
	text-align: center;
	padding-top: 4px;
}

.woocommerce div.product .woocommerce-tabs .more-less-buttons .button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	height: 40px !important;
	padding: 0 22px !important;
	background: none !important;
	border: 1px solid #e8e9ee !important;
	border-radius: 999px !important;
	color: #2f2f2f !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	text-transform: none !important;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.woocommerce div.product .woocommerce-tabs .more-less-buttons .button:hover {
	background: #0468c7 !important;
	border-color: #0468c7 !important;
	color: #fff !important;
}

@media only screen and (max-width: 767px) {
	.woocommerce div.product .woocommerce-tabs ul.tabs {
		padding: 0 6px !important;
	}

	.woocommerce div.product .woocommerce-tabs ul.tabs li > a {
		padding: 15px 12px 13px !important;
		font-size: 12px !important;
	}

	.woocommerce div.product .woocommerce-tabs ul.tabs li > a:after {
		left: 12px;
		right: 12px;
	}

	.woocommerce div.product .woocommerce-tabs .panel {
		padding: 20px 16px !important;
		font-size: 14px !important;
	}

	.woocommerce div.product .woocommerce-tabs .panel ul {
		grid-template-columns: 1fr !important;
		gap: 8px !important;
	}

	.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes th {
		width: 42%;
		padding-right: 12px !important;
		font-size: 11px !important;
	}

	.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes td {
		font-size: 14px !important;
	}
}


/* ---------------------------------------------------------------------------
 * 7. Адаптив страницы товара
 * ------------------------------------------------------------------------- */

@media only screen and (max-width: 900px) {

	/* Поля: было 30px у #main-content + 20px у карточки = 50px с каждой стороны */
	.single-product #main-content {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}

	.woocommerce div.product.type-product {
		padding: 16px !important;
		margin-bottom: 24px !important;
	}

	/* Картинка: на телефоне оставались десктопные margin-left:70px и padding-right:40px */
	.woocommerce div.product div.images,
	.woocommerce div.product div.images-thumbnails {
		margin: 0 !important;
		padding: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		float: none !important;
	}

	.woocommerce div.product div.images figure {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.woocommerce div.product div.images img {
		display: block;
		margin: 0 auto;
		max-width: 100%;
		max-height: 300px !important;
		height: auto;
		object-fit: contain;
	}

	/* flex-basis:320px у .summary на мобильном превращался в пустоту под ценой */
	.woocommerce div.product div.summary.entry-summary {
		align-self: stretch;
		flex: 0 0 auto !important;
		flex-basis: auto !important;
		min-height: 0 !important;
		padding: 16px !important;
		margin: 16px 0 24px !important;
	}

	.woocommerce div.product .woocommerce-tabs {
		padding-bottom: 8px !important;
	}

	.woocommerce div.product .woocommerce-tabs .panel {
		padding: 18px 16px !important;
	}

	.woocommerce div.product .entry-summary h1.product_title {
		font-size: 20px !important;
		line-height: 1.3 !important;
	}

	/* Количество и кнопка floated-ами не помещались в ширину экрана */
	.woocommerce div.product .entry-summary form.cart {
		display: flex !important;
		flex-wrap: wrap;
		gap: 10px;
		margin: 0 0 16px !important;
	}

	.woocommerce div.product .entry-summary form.cart .quantity {
		float: none !important;
		width: 130px !important;
		margin: 0 !important;
	}

	/* Кнопка — отдельной строкой во всю ширину карточки */
	.woocommerce div.product .entry-summary form.cart .single_add_to_cart_button {
		float: none !important;
		flex: 1 1 100% !important;
		width: auto !important;
		min-width: 0;
	}

	/* Пустой блок «Избранное» оставлял дыру под кнопкой */
	.woocommerce div.product .entry-summary .yith-wcwl-add-to-wishlist {
		margin: 0 !important;
	}

	.woocommerce div.product .entry-summary > *:last-child {
		margin-bottom: 0 !important;
	}
}
