/* ТЗ ads-analytics 102 (docs/nazarklinok.ru/tz-102.md): карточка товара — только на ней (site:seller/index.html, isProductPage).
   Колонки «фото | покупка» — от 901 px (main.min.css: до 900 px одна колонка), телефонная раскладка — до 799 px. */

/* ---------- п. 8.3: «артикул · звёзды · наличие» одной строкой на ПК; отступы у названия */
.tz102-line { margin: 0 0 10px; }
.tz102-line .page-product__rating { margin: 6px 0 0; }
.tz102-line .product-code { margin: 0; }
@media (min-width: 901px) {
    .page-product__product .page-product__caption { margin-bottom: 12px; }
    .tz102-line { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 20px; }
    .tz102-line .page-product__rating { flex: 1 1 auto; margin: 0; }
}

/* ---------- надпись под фото «* Возможны незначительные отличия от фото…» — компактнее (заказчик 24.09): 12 px, без полей;
   ПК — одной строкой, телефон — вплотную к фото */
.page-product__product .text-note { margin: 6px 0 4px !important; font-size: 12px !important; line-height: 1.35 !important; }
@media (max-width: 900px) {
    .page-product__product .product-slider { margin-bottom: 0 !important; }
    .page-product__product .text-note { margin: -14px 0 10px !important; }   /* низ галереи — 20 px пустого места (место точек листания) */
}

/* ---------- п. 9.2, 10.4: плашки ключевых характеристик */
.tz102-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; }
.tz102-chip { border: 1px solid rgba(255, 255, 255, .22); border-radius: 8px; background: rgba(255, 255, 255, .04); padding: 5px 10px;
    font-size: 13px; line-height: 18px; color: #fff; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.tz102-chip__l { color: #9fb0bf; margin-right: 2px; }
.tz102-chips__all { color: #fbe99c; font-size: 13px; line-height: 18px; text-decoration: none; white-space: nowrap; }
.tz102-chips__all:hover { text-decoration: underline; }

/* ---------- п. 10.2: ПК — цена · «− 1 +» · «В корзину» · «1 клик» одной строкой; подсказка под «1 клик» */
@media (min-width: 901px) {
    .tz102-buyrow { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 14px; }
    /* цена — по средней линии кнопок (заказчик 24.09: «цену аккуратнее»; была по центру строки вместе с подсказкой — ниже кнопок) */
    .tz102-buyrow > .b-product-price { margin: 0 !important; flex: 0 0 auto; align-self: flex-start; min-height: 44px; display: flex; flex-direction: column; justify-content: center; }
    .tz102-buyrow > .b-product-price .s-price-wrapper { line-height: 1; }
    /* колонка покупки на 1366 — ~650 px: у .page-product__buttons темы свой отступ слева 28 px и ширина 630 — без них цена и кнопки влезают в строку;
       не влезают (цена с плашкой «В одном экземпляре») — кнопки целиком переносятся под цену, а не вылезают за колонку */
    .tz102-buyrow > .page-product__buttons { flex: 0 1 auto; padding-left: 0; width: auto; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; gap: 12px; margin: 0; }
    .tz102-buyrow .page-product__btn-buy { flex: 0 0 auto; margin: 0; max-width: none; }   /* у темы .btn-buy{max-width:250px} — «В корзину» вылезала за край */
    .tz102-buyrow .page-product__oneclick { width: auto; flex: 0 0 auto; align-items: stretch; }
    /* подсказка — под «1 клик» по его ширине, по центру, в 2 строки: заказчик 24.09 — «должна визуально относиться к кнопке» (была одной строкой
       правым краем по кнопке и уходила под «В корзину»). Кнопка шире (230 px), чтобы подсказка уместилась в 2 строки */
    .tz102-buyrow .page-product__oneclick { width: 230px; }
    .tz102-buyrow .page-product__buttons .call-back { margin-top: 0; width: 100%; min-width: 0; padding-left: 8px; padding-right: 8px; }
    .tz102-buyrow .page-product__oneclick-note { margin-top: 6px; max-width: none; text-align: center; font-size: 12px; line-height: 16px; }
    /* п. 7.3, 8.3: «Покупка» ≤ 130 px, низ колонки покупки — ближе к низу фото: сноска одной строкой, отступы меньше */
    .page-product__product .tz102-buy { margin-top: 10px; padding: 8px 14px; }
    .page-product__product .tz102-buy__grid { gap: 4px 18px; }
    .page-product__product .tz102-buy__cell { line-height: 1.3; }
    .page-product__product .tz102-buy__note { margin-top: 6px; font-size: 11px; line-height: 1.3; }
    .page-product__product .tz68-custom { margin: 8px 0 0 !important; }
}

/* ---------- п. 10.3: телефон — пустоты первых экранов */
@media (max-width: 900px) {
    .page-product__product .caption-mobile { margin-bottom: 6px; }
    .tz102-line .page-product__rating { margin: 4px 0 0; }
    .tz102-line { margin-bottom: 8px; }
    /* плашки → цена 10 px, цена → «− 1 +» 12 px, «В корзину» → «1 клик» 12 px, «1 клик» → подсказка 8 px. Контейнер кнопок темы — колонка
       flex с переносом; пустоты по 24 px над и под кнопками давали «широкие пробелы» U+2003 в шаблоне (убраны 24.09, product.cart.html); здесь он блок.
       Пустой выбор артикула (.b-product-skus mb-4, у товара с одним артикулом) и пустая строка скидок — без отступов */
    .tz102-chips { margin-bottom: 10px; }
    .tz102-chips + .b-product-skus:not(:has(> :not(input[type="hidden"]))) { margin-bottom: 0 !important; }
    .tz102-buyrow .b-product-savings { margin-bottom: 0 !important; }
    .tz102-buyrow .b-product-savings > * { margin-bottom: 8px; }
    .tz102-buyrow > .b-product-price { margin-bottom: 12px !important; }
    .tz102-buyrow .page-product__buttons { display: block; margin-top: 0; min-height: 0; height: auto; }
    /* «− 1 +» и «В корзину» — одной строкой (заказчик 24.09: «для экономии места») */
    .tz102-buyrow .page-product__btn-buy { margin: 0; flex-direction: row; align-items: stretch; gap: 10px; width: 100%; max-width: none; }
    .tz102-buyrow .page-product__btn-buy .b-product-quantity { flex: 0 0 132px; width: 132px; min-width: 0; }
    .tz102-buyrow .page-product__btn-buy .btn-add { flex: 1 1 auto; width: auto; min-width: 0; }
    .tz102-buyrow .page-product__oneclick { margin-top: 12px; }
    .tz102-buyrow .page-product__buttons .call-back { margin-top: 0; }
    .tz102-buyrow .page-product__oneclick-note { margin-top: 8px; }
}

/* ---------- п. 7.2: «Покупка» 2 × 2 */
.tz102-buy { margin: 14px 0 6px; padding: 12px 14px; border: 1px solid rgba(255, 255, 255, .18); border-radius: 10px; background: rgba(255, 255, 255, .03); }
.tz102-buy__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; }
.tz102-buy__cell { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; line-height: 1.35; color: #d6dde3; text-decoration: none; }
a.tz102-buy__cell:hover b { text-decoration: underline; }
.tz102-buy__cell b { color: #fff; font-weight: 600; }
.tz102-buy__ic { flex: 0 0 18px; text-align: center; color: #fbe99c; line-height: 1.35; }
.tz102-buy__note { margin: 8px 0 0; font-size: 12px; line-height: 1.35; color: #9fb0bf; }
@media (max-width: 380px) { .tz102-buy__grid { gap: 10px 10px; } .tz102-buy__cell { font-size: 13px; } }

/* ---------- п. 7.3, 8.2: «Кузница Назарова В.В.» — ПК полосой, телефон столбиком */
.tz102-kz { border: 1px solid rgba(251, 233, 156, .35); border-radius: 10px; background: rgba(251, 233, 156, .04); padding: 14px 16px; }
.tz102-kz__title { font-family: Montserrat, "Montserrat Fallback", sans-serif; font-weight: 700; font-size: 16px; line-height: 1.3; color: #fbe99c; }
.tz102-kz__list { list-style: none; margin: 0; padding: 0; }
.tz102-kz__list li { display: flex; gap: 8px; font-size: 14px; line-height: 1.4; color: #d6dde3; }
.tz102-kz__list b { color: #fff; font-weight: 600; }
.tz102-kz__ic { flex: 0 0 14px; color: #fbe99c; }
.tz102-kz__ya { color: inherit; text-decoration: none; }
.tz102-kz__ya:hover b { text-decoration: underline; }
.tz102-kz--m { margin: 16px 0 4px; }
.tz102-kz--m .tz102-kz__title { margin-bottom: 8px; }
.tz102-kz--m .tz102-kz__list li + li { margin-top: 6px; }
.tz102-kz--pc { display: none; }
@media (min-width: 901px) {
    .tz102-kz--m { display: none; }
    .tz102-kz--pc { display: flex; align-items: center; gap: 24px; margin: 24px 0 0; padding: 16px 20px; }
    .tz102-kz--pc .tz102-kz__title { flex: 0 0 auto; }
    .tz102-kz--pc .tz102-kz__list { flex: 1 1 auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
}

/* ---------- п. 2.5, 10.1: разделы вместо вкладок */
.tz102-secs.tabs__wrap { margin-top: 28px; }
.tz102-sec { border-top: 1px solid rgba(255, 255, 255, .15); }
.tz102-sec:last-of-type { border-bottom: 1px solid rgba(255, 255, 255, .15); }
.tz102-sec__h { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 16px 4px; background: none; border: 0;
    color: #fff; font-family: Montserrat, "Montserrat Fallback", sans-serif; font-weight: 600; font-size: 17px; line-height: 1.3; text-align: left; cursor: pointer; }
.tz102-sec__h::after { content: "+"; color: #fbe99c; font-size: 22px; font-weight: 400; line-height: 1; margin-left: 12px; }
.tz102-sec.is-open > .tz102-sec__h::after { content: "−"; }
.tz102-sec__h:hover { color: #fbe99c; }
.tz102-sec__b { padding: 4px 4px 20px; }
.tz102-sec__b[hidden] { display: none; }
.tz102-secs .tabs__share { margin-top: 20px; }

/* ПК: каждый раздел — карточкой с фоном и рамкой (заказчик 24.09: «оформить рамкой или фоном»); текст описания — по-прежнему не шире 760 px (ТЗ 42) */
@media (min-width: 901px) {
    .tz102-sec, .tz102-sec:last-of-type { border: 1px solid rgba(255, 255, 255, .14); border-radius: 10px; background: rgba(255, 255, 255, .035); }
    .tz102-sec + .tz102-sec { margin-top: 10px; }
    .tz102-sec__h { padding: 16px 20px; border-radius: 10px; }
    .tz102-sec__h:hover { background: rgba(255, 255, 255, .04); }
    .tz102-sec.is-open > .tz102-sec__h { border-bottom: 1px solid rgba(255, 255, 255, .1); border-radius: 10px 10px 0 0; }
    .tz102-sec__b { padding: 18px 20px 22px; }
}

/* ---------- п. 8.1, 2.4: ленты плиток (как ленты главной, ТЗ 59) */
.tz102-similar, .tz102-viewed { margin: 36px 0 0; }
.tz102-viewed { margin-bottom: 30px; }
.tz102-h2 { font-family: Montserrat, "Montserrat Fallback", sans-serif; font-size: 24px; font-weight: 600; line-height: 1.25; color: #fbe99c; margin: 0 0 4px; }
.tz102-sub { margin: 0 0 6px; font-size: 14px; color: #9fb0bf; }
.tz102-lane { position: relative; }
.tz102-lane .page-category__products { display: flex; flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; padding-bottom: 10px; }
.tz102-lane .page-category__products > .card-product { flex: 0 0 210px; width: 210px; margin: 12px 0 0; scroll-snap-align: start; position: relative; }
.tz102-lane .card-product__img { aspect-ratio: 2 / 3; height: auto; width: 100%; position: relative; }
.tz102-lane .card-product__img img { width: 100%; height: 100%; object-fit: contain; }
.tz102-lane .card-product__title { font-size: 15px; line-height: 20px; height: 60px; margin-bottom: 8px; }
.tz102-lane .card-product__property, .tz102-lane .card-product__rating, .tz102-lane .card-product__more { display: none !important; }
.tz102-lane .s-price { font-size: 17px; }
.tz102-lane .card-product__buttons .btn, .tz102-lane .card-product__btn-buy-text { font-size: 14px; }
.tz102-lane .card-product__buttons .btn { height: auto; min-height: 40px; padding: 8px 6px; line-height: 1.2; white-space: normal; }
.tz102-same { position: absolute; left: 8px; top: 8px; z-index: 2; padding: 2px 8px; border-radius: 8px; background: #306283; color: #fff; font-size: 11px; line-height: 16px; }
@media (max-width: 799px) {
    .tz102-lane .page-category__products > .card-product { flex-basis: 170px; width: 170px; }
    .tz102-h2 { font-size: 20px; }
}