/* Стили магазина. Родительскую тему Woodmart не правим — она обновляется. */

/* Пресет набирает названия капслоком. По-английски это смотрится, но русские
   слова длиннее: «БЕСПРОВОДНЫЕ ЭХОЛОТЫ» занимает две строки и читается тяжело. */
.wd-product .wd-entities-title,
.product-title,
.wd-cat .wd-entities-title,
.category-grid-item .wd-entities-title,
.wd-nav-product-cat a,
.woocommerce-loop-category__title {
	text-transform: none;
	letter-spacing: 0;
}

/* Названия товаров в каталоге длинные («Lowrance Eagle EYE 9 с датчиком Live
   Sonar»), поэтому даём им дышать и выравниваем высоту карточек. */
.wd-product .wd-entities-title {
	font-size: 15px;
	line-height: 1.4;
	min-height: 2.8em;
}

/* Единый размер картинок в каталоге.

   Фотографии из старой выгрузки разного формата: от 12 до 6000 пикселей,
   и вертикальные, и широкие. Обрезать их под квадрат нельзя — эхолоту
   отрежет либо экран, либо датчик. Растягивать мелкие тоже нельзя — мыло.

   Поэтому контейнер картинки делаем квадратным, а изображение вписываем
   в него целиком и центрируем. Поля добираются белым фоном карточки.

   Важно: класс именно .wd-product-thumb — это обёртка картинки в Woodmart 8.
   В прежних версиях она называлась .product-element-top, и попытка стилизовать
   старый класс ломала сетку. */
.wd-product .wd-product-thumb {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #fff;
}

.wd-product .wd-product-img-link,
.wd-product .wd-product-thumb > a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.wd-product .wd-product-thumb img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

/* Обложки категорий — та же логика. */
.wd-cat .wd-entities-image,
.category-grid-item .category-image-wrapp {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #fff;
}

.wd-cat .wd-entities-image img,
.category-grid-item .category-image-wrapp img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

/* Цена — главное в карточке, её должно быть видно сразу. */
.wd-product .price,
.wd-product .price .amount {
	font-size: 17px;
	font-weight: 600;
}

/* «Цена по запросу» — не цена, поэтому не кричим ею, но и не прячем. */
.mh-price-request {
	display: inline-block;
	font-size: 15px;
	font-weight: 600;
	opacity: 0.75;
}

/* Кнопка «Узнать цену» встаёт на место «В корзину» — и выглядеть должна так же. */
.mh-ask-price {
	width: 100%;
	text-align: center;
}

/* Заголовки разделов. */
.wd-el-title .title,
.woocommerce-products-header__title {
	text-transform: none;
	letter-spacing: 0;
}

/* Характеристики товара (бренд) — читаемой таблицей. */
.woocommerce-product-attributes th {
	font-weight: 600;
	width: 30%;
}

/* Условия доставки во вкладке карточки. */
.mh-delivery h4 {
	margin: 20px 0 8px;
	font-size: 16px;
}

.mh-delivery h4:first-child {
	margin-top: 0;
}

.mh-delivery ul {
	margin: 0 0 12px;
	padding-left: 18px;
}

.mh-delivery li {
	margin-bottom: 6px;
}