/* Agent E - UX-mobile fixes (2026-04-22) */
/* 1. Устранение iOS-zoom при фокусе на input — шрифт полей >= 16px */
@media (max-width: 767px) {
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  input[type="search"],
  input[type="number"],
  textarea,
  select {
    font-size: 16px !important;
  }
  /* Стабилизация кнопки "В корзину" и quantity: min-height 44px */
  #button-cart,
  button[id*="button-cart"],
  .buttons .btn-primary {
    min-height: 44px !important;
  }
  input[name="quantity"] {
    min-height: 44px !important;
    font-size: 16px !important;
  }
}

/* 2. Резервирование aspect-ratio для галереи товара — снижает CLS */
.thumbnails .thumbnail,
#product .thumbnails a,
.product-info .thumbnails .thumbnail {
  aspect-ratio: 4 / 3;
  display: block;
  background: #f5f5f5;
}
.thumbnails .thumbnail img,
#product .thumbnails a img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* 3. Cookie-баннер — фиксированная минимальная высота снизу экрана */
.cookieText,
.cookie-notice,
.cookie-wrap {
  min-height: 64px;
}

/* 4. Body font-size на мобиле — 14px (не так радикально как 16px, но лучше 13px) */
@media (max-width: 480px) {
  body { font-size: 14px; }
  body .product-thumb .caption h4,
  body .product-thumb .caption .price { font-size: 14px; }
}


/* fix3 2026-04-22: компактные карточки товаров на главной (в 2× меньше) */
.product-carousel .product-thumb,
#tablatest-carousel .product-thumb,
#special-carousel .product-thumb,
#tabbestseller-carousel .product-thumb {
  padding: 8px 6px !important;
}
.product-carousel .product-thumb .image,
.product-carousel .product-thumb .img-wrap .image,
.product-carousel .product-thumb .img-wrap {
  width: 100% !important;
  max-width: 100% !important;
  height: 220px !important;
  max-height: 220px !important;
  overflow: hidden !important;
  margin-bottom: 6px !important;
  display: block !important;
  position: relative !important;
}
.product-carousel .product-thumb .image img,
.product-carousel .product-thumb .img-wrap img {
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: 220px !important;
  object-fit: cover !important;
  object-position: center !important;
  margin: 0 !important;
  display: block !important;
}
.product-carousel .product-thumb h4,
.product-carousel .product-thumb .caption h4,
.product-carousel .product-thumb .caption h4 a {
  font-size: 12px !important;
  line-height: 1.25 !important;
  margin: 0 0 6px 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  max-height: 4.5em !important;
  text-overflow: ellipsis !important;
}
.product-carousel .product-thumb .caption p:not(.price),
.product-carousel .product-thumb .caption .description {
  display: none !important;
}
/* Явно показываем цену — она <p class="price"> */
.product-carousel .product-thumb .price,
.product-carousel .product-thumb p.price {
  display: block !important;
  visibility: visible !important;
}
.product-carousel .product-thumb .price {
  font-size: 13px !important;
  line-height: 1.15 !important;
  margin: 4px 0 !important;
}
.product-carousel .product-thumb .price-new,
.product-carousel .product-thumb .price > span:first-child {
  font-size: 14px !important;
}
.product-carousel .product-thumb .price-old {
  font-size: 11px !important;
}
.product-carousel .product-thumb .button-group button,
.product-carousel .product-thumb .button-group a,
.product-carousel .product-thumb .cart_button {
  padding: 6px 10px !important;
  font-size: 11px !important;
  min-height: 32px !important;
}
.product-carousel .product-thumb .rating { display: none !important; }
.product-carousel .product-thumb .product-label,
.product-carousel .product-thumb .saleicon,
.product-carousel .product-thumb .saleicon-percent {
  font-size: 10px !important;
  padding: 3px 6px !important;
}
/* /fix3 */


/* fix4 2026-04-22: растянуть карточки товаров и убрать жёлтую рамку Акций */
.product-carousel .owl-item .slider-item,
.product-carousel .owl-item .product-thumb,
.product-carousel .owl-item .product-block {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.product-carousel .owl-item {
  padding: 0 6px !important;
  box-sizing: border-box !important;
}
.product-carousel .owl-item .image {
  text-align: center !important;
}
.product-carousel .owl-item .caption {
  padding: 8px 4px !important;
}
/* Убрать жёлтую рамку у box-content вокруг карусели товаров (усиленная специфичность) */
html body .box-content:has(.product-carousel),
html body .box:has(.product-carousel) > .box-content,
html body div.box-content:has(.product-carousel) {
  border: 0 none transparent !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  outline: none !important;
  padding: 5px 0 !important;
  box-shadow: none !important;
}
/* /fix4 */

/* fix4b 2026-04-22: target специально .box.special .box-content */
html body .box.special .box-content,
html body .box.special .container .box-content,
html body .box.special .container .row .box-content {
  border: 0 none transparent !important;
  border-width: 0 !important;
  border-style: none !important;
  outline: none !important;
  box-shadow: none !important;
}
/* /fix4b */

/* E13 (2026-04-22): touch-target ≥ 44px для ссылок меню на мобиле (WCAG 2.5.5) */
@media (max-width: 767px) {
  .main-menu a,
  .main-menu ul li a,
  #menu a,
  #menu ul li a {
    min-height: 44px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    box-sizing: border-box !important;
  }
}
/* /E13 */

/* === J2 2026-04-28: CLS-фикс через aspect-ratio === */

/* Товарные карточки (категории, главная — Featured/Latest/Special/ProductCategory) */
.product-thumb img,
.product-layout img.img-responsive,
.featured img,
.latest img,
.special img,
.bestseller img,
.productcategory img,
.product-carousel img {
  aspect-ratio: 1 / 1;
  width: 100%;
  height: auto;
  object-fit: contain;
  background: #fff;
}

/* Главная картинка товара (LCP) */
#tmzoom img,
#thumb img {
  aspect-ratio: 4 / 3;
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* Карусели/слайдшоу */
.swiper-slide img,
#wdcmsbanner-carousel img,
.service-area-carousel img,
.owl-item img.banner-image {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Картинки в блоге */
.blogger-thumb img,
.blogger-image img,
article img {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Бренды */
.manufacturer-list img,
#wdcms-carousel img {
  aspect-ratio: 3 / 2;
  width: 100%;
  max-width: 154px;
  height: auto;
  object-fit: contain;
}

/* Логотип в шапке */
.header_left img.img-responsive,
header .logo img {
  width: 154px;
  height: 80px;
  object-fit: contain;
}

/* === /J2 === */

