/* Карточка товара в каталоге и на главной:
   название в одну строку, ниже раздел, оценка и цена. */

.km-product-card .km-card-body {
   display: flex;
   flex-direction: column;
   gap: 6px;
}

/* Название — одной строкой во всю ширину карточки, длинное обрезается многоточием. */
.km-product-card .km-card-title {
   margin: 0;
   font-size: 18px;
   font-weight: 500;
   line-height: 1.3;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.km-product-card .km-card-title a {
   color: inherit;
   text-decoration: none;
   transition: opacity .2s ease;
}

.km-product-card .km-card-title a:hover {
   opacity: .65;
}

.km-product-card .km-card-category {
   display: block;
   font-size: 14px;
   line-height: 1.35;
   color: #8a8a8a;
}

.km-product-card .km-card-rating {
   display: flex;
   align-items: center;
   gap: 6px;
   font-size: 14px;
   line-height: 1;
}

.km-product-card .km-stars {
   display: inline-flex;
   gap: 1px;
   letter-spacing: 0;
}

.km-product-card .km-star {
   color: #d9d9d9;
   font-size: 14px;
   line-height: 1;
}

.km-product-card .km-star.is-on {
   color: #f5a623;
}

.km-product-card .km-card-rating b {
   font-weight: 600;
   color: #1a1a1a;
}

.km-product-card .km-card-reviews {
   color: #8a8a8a;
}

.km-product-card .km-card-price {
   display: flex;
   align-items: baseline;
   flex-wrap: wrap;
   gap: 10px;
   margin-top: 2px;
}

.km-product-card .km-price-old {
   font-size: 15px;
   color: #9a9a9a;
   text-decoration: line-through;
}

.km-product-card .km-price-new {
   font-size: 19px;
   font-weight: 600;
   color: #1a1a1a;
   text-decoration: none;
   background: none;
}

/* Цена со скидкой — красная. */
.km-product-card .km-price-new.is-sale {
   color: #e02b2b;
}

@media (max-width: 575px) {
   .km-product-card .km-card-title { font-size: 17px; }
   .km-product-card .km-price-new { font-size: 18px; }
}

/* --- Страница результатов поиска --- */
.km-search-form {
   display: flex;
   gap: 12px;
   max-width: 720px;
   margin: 0 0 48px;
}

.km-search-form input {
   flex: 1 1 auto;
   min-width: 0;
   height: 56px;
   padding: 0 20px;
   border: 1px solid rgba(17, 16, 19, 0.15);
   border-radius: 999px;
   background: #fff;
   color: #1a1a1a;
   font-size: 16px;
}

.km-search-form input:focus {
   outline: none;
   border-color: #1a1a1a;
}

.km-search-form button {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   height: 56px;
   padding: 0 28px;
   border: 0;
   border-radius: 999px;
   background: #1a1a1a;
   color: #fff;
   font-size: 15px;
   cursor: pointer;
   transition: background-color .2s ease;
}

.km-search-form button:hover { background: #333; }

.km-search-empty {
   padding: 40px 0 60px;
   max-width: 720px;
}

.km-search-empty h3 {
   margin: 0 0 10px;
   font-size: clamp(26px, 3vw, 36px);
   letter-spacing: -0.02em;
}

.km-search-empty p {
   margin: 0 0 26px;
   color: #777;
}

.km-search-cats {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
}

.km-search-cats a {
   padding: 9px 18px;
   border: 1px solid rgba(17, 16, 19, 0.15);
   border-radius: 999px;
   color: #1a1a1a;
   font-size: 14px;
   transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.km-search-cats a:hover {
   border-color: #1a1a1a;
   background: #1a1a1a;
   color: #fff;
}

@media (max-width: 575px) {
   .km-search-form { flex-direction: column; }
   .km-search-form input,
   .km-search-form button { width: 100%; justify-content: center; }
}

/* Галерея товара прилипает при прокрутке — описание в правой колонке длиннее.
   Страница использует ScrollSmoother, который трансформирует контент,
   поэтому на десктопе галерея пиньтся через ScrollTrigger (см. theme/js/product.js),
   а sticky остаётся запасным вариантом. */
@media (min-width: 992px) {
   .product-layout .product-gallery {
      position: sticky;
      top: 16px;
      align-self: start;
   }

   .product-layout .product-gallery.is-scroll-pinned {
      position: relative;
      top: auto;
   }
}

/* Аккордеон описания переехал в правую колонку под блоки доставки и гарантии. */
.product-content .product-details-list {
   margin-top: 10px;
}

/* Заголовок секции в узкой колонке — тот же стиль темы, но соразмерный колонке. */
.product-content .product-details-title {
   margin: 36px 0 0;
   font-size: clamp(30px, 3.2vw, 44px);
   line-height: 1.08;
   letter-spacing: -0.03em;
}

/* Заголовки аккордеона — фирменный шрифт шаблона. */
.product-content .product-details-list summary {
   font-family: var(--tp-ff-sequel-medium);
   letter-spacing: -0.02em;
}

/* Подкатегории в боковом меню каталога — вложенным списком под своей категорией. */
.catalog-sidebar .catalog-subnav {
   display: flex;
   flex-direction: column;
   gap: 2px;
   margin: 2px 0 8px 12px;
   padding-left: 12px;
   border-left: 1px solid rgba(17, 16, 19, 0.12);
}

.catalog-sidebar .catalog-sublink {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 8px 10px;
   border-radius: 8px;
   color: #5b5b57;
   font-family: var(--tp-ff-inter);
   font-size: 14px;
   font-weight: 500;
   line-height: 1.3;
   text-align: left;
   text-decoration: none;
}

.catalog-sidebar .catalog-sublink:hover,
.catalog-sidebar .catalog-sublink.active {
   color: var(--tp-common-black);
   background: #f2f2ef;
}

.catalog-sidebar .catalog-sublink.active {
   font-weight: 600;
}

/* E-mail в подвале показываем заглавными средствами CSS —
   в разметке остаётся адрес как есть, его удобнее копировать. */
.footer-two .info-mail .mail {
   text-transform: uppercase;
}

/* Чекбоксы в окне «Купить в один клик»: квадрат и текст на одной оси,
   ссылки на документы подчёркнуты. */
.quick-order-check {
   align-items: center;
   font-size: 12px;
   line-height: 1.5;
}

.quick-order-checkmark {
   border-radius: 5px;
}

.quick-order-check a {
   color: #1a1a1a;
   text-decoration: underline;
   text-underline-offset: 3px;
}

.quick-order-check a:hover {
   color: #e02b2b;
}