/* ==========================================================================
   WooCommerce под фирменный стиль. Штатные стили WC оставлены (сетка, галерея,
   адаптив корзины) — здесь только цвета, шрифты и отступы, чтобы обновления
   плагина не ломали вёрстку.
   ========================================================================== */

.shop { padding-block: clamp(28px, 4vw, 48px) clamp(48px, 7vw, 80px); }
.shop--product { padding-top: 24px; }

.woocommerce-breadcrumb { font-size: .88rem; color: var(--kof-muted); margin-bottom: 24px !important; }
.woocommerce-breadcrumb a { color: var(--kof-navy); }

/* Кнопки WC приводим к кнопкам темы. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce-page .button,
.price-list .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: .55em 1.3em;
    border: 0;
    border-radius: 3px;
    background: var(--kof-red);
    color: var(--kof-white);
    font: 400 .92rem/1.2 var(--font-display);
    text-decoration: none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.price-list .button:hover { background: #ff2b33; color: var(--kof-white); }
.woocommerce a.button.loading, .price-list .button.loading { opacity: .6; }
.woocommerce a.button.added::after, .price-list .button.added::after { content: " ✓"; margin-left: .3em; }

.woocommerce .woocommerce-ordering select,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .quantity .qty {
    padding: 10px 12px;
    border: 2px solid #cfd5e2;
    border-radius: 3px;
    font: inherit;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus { border-color: var(--kof-navy); outline: none; }

/* Сетка товаров */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font: 400 1.05rem/1.25 var(--font-display);
    color: var(--kof-ink);
    padding-top: .6em;
}
.woocommerce ul.products li.product .price {
    font: 400 1.25rem/1 var(--font-display);
    color: var(--kof-red-ink);
}
.woocommerce ul.products li.product a img { border-radius: 4px; background: var(--kof-ice-soft); }
.kof-abon-terms-inline { margin: -.3em 0 .6em; color: var(--kof-navy); font-weight: 600; font-size: .9rem; }

.woocommerce span.onsale {
    background: var(--kof-red);
    font: 400 .8rem/3em var(--font-display);
    border-radius: 50%;
}

/* Карточка товара */
.woocommerce div.product .product_title { font-size: clamp(1.6rem, 3.6vw, 2.3rem); color: var(--kof-navy); }
.woocommerce div.product p.price,
.woocommerce div.product span.price { font: 400 1.9rem/1 var(--font-display); color: var(--kof-red-ink); }
.kof-abon-terms {
    display: flex; flex-wrap: wrap; gap: 8px;
    margin: 0 0 1.4em; padding: 0; list-style: none;
}
.kof-abon-terms li {
    padding: 6px 12px;
    border-radius: 3px;
    background: var(--kof-ice-soft);
    color: var(--kof-navy);
    font-weight: 600;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li { border-radius: 3px 3px 0 0; background: var(--kof-ice-soft); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--kof-white); }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { font-family: var(--font-display); font-weight: 400; color: var(--kof-navy); }
.woocommerce div.product .woocommerce-tabs .panel h2 { font-size: 1.3rem; }
/* Штатно «Похожие» отбиваются от картинки вкладками (у них clear: both).
   Если вкладок нет — например, у товара без описания и с выключенными
   отзывами, — блок всплывал рядом с картинкой. */
.woocommerce div.product .related.products,
.woocommerce div.product .upsells.products { clear: both; padding-top: 24px; }
.related.products > h2, .upsells.products > h2 { font-size: 1.5rem; color: var(--kof-navy); }

/* Уведомления */
.woocommerce-message, .woocommerce-info { border-top-color: var(--kof-navy); }
.woocommerce-message::before, .woocommerce-info::before { color: var(--kof-navy); }
.woocommerce-error { border-top-color: var(--kof-red); }
.woocommerce-error::before { color: var(--kof-red); }
/* Иконка уведомления наезжала на первую букву: отступ слева под неё. */
.woocommerce-error, .woocommerce-info, .woocommerce-message { padding-left: 3.5em; }
.woocommerce-error::before, .woocommerce-info::before, .woocommerce-message::before { left: 1.25em; }

/* Корзина и оформление */
.woocommerce table.shop_table { border-radius: 4px; border-color: #d7dce7; }
.woocommerce table.shop_table th { font-family: var(--font-display); font-weight: 400; color: var(--kof-navy); }
.woocommerce-checkout h3 { font-size: 1.35rem; color: var(--kof-navy); }
.woocommerce-checkout #payment { background: var(--kof-ice-soft); border-radius: 4px; }
.woocommerce-checkout #payment div.payment_box { background: var(--kof-white); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--kof-white); }
.woocommerce #payment #place_order { width: 100%; min-height: 54px; font-size: 1.05rem; }

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span { padding: 10px 14px; }
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--kof-navy); color: var(--kof-white); }

/* ---------- Одностраничное оформление: количество в «Ваш заказ» ---------- */

.woocommerce-checkout-review-order-table td.product-name { vertical-align: middle; }
/* Название занимает всё, кроме места под количество и крестик (~110px),
   поэтому элементы управления стоят ровным столбцом у правого края ячейки. */
.kof-item-name { display: inline-block; width: calc(100% - 120px); vertical-align: middle; }
.kof-qty { display: inline-flex; align-items: center; gap: 8px; vertical-align: middle; }
.kof-qty__input.input-text {
    width: 64px;
    padding: 6px 8px;
    border: 1px solid #c9ccd6;
    border-radius: 4px;
    font: inherit;
    text-align: center;
}
.kof-qty__remove {
    width: 32px; height: 32px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--kof-red-ink);
    font: 700 1.4rem/1 var(--font-text);
    cursor: pointer;
}
.kof-qty__remove:hover { background: #fde5e6; }

/* «Подытог» дублирует «Итого»: скидок и доставки у абонементов нет, так что
   строки всегда равны. Скрываем стилями — хука на эту строку в шаблоне WC нет,
   а переопределять review-order.php ради одной строки не хочется. */
.woocommerce-checkout-review-order-table tr.cart-subtotal { display: none; }

/* Столбец «Сумма» — по ширине самой длинной цены, суммы прижаты вправо:
   штатно WC делит таблицу пополам, и справа от цен оставалась пустота. */
.woocommerce-checkout-review-order-table th.product-total,
.woocommerce-checkout-review-order-table td.product-total,
.woocommerce-checkout-review-order-table tfoot td {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}

/* Способ оплаты один (оплата в клубе) — выбирать нечего, а текст шлюза
   «Оплата при доставке» для абонемента сбивает с толку. Скрываем список,
   только когда способ единственный: радиокнопка остаётся в форме отмеченной,
   заказ уходит как раньше. Подключат онлайн-оплату — выбор появится сам. */
.woocommerce-checkout #payment ul.wc_payment_methods:has(> li:only-child) { display: none; }
.woocommerce-checkout #payment:has(ul.wc_payment_methods > li:only-child) .place-order { border-top: 0; }

/* Галочка согласия над кнопкой «Подтвердить заказ». */
.kof-consent--checkout { margin: 0 0 16px; padding: 10px 12px; border: 2px solid transparent; border-radius: 4px; font-size: .92rem; line-height: 1.45; color: var(--kof-ink); transition: border-color .2s, background-color .2s; }
.kof-consent--checkout a { color: var(--kof-red-ink); }
/* Не отметили — подсвечиваем саму галочку, а не только пишем наверху страницы. */
.kof-consent--checkout.is-invalid { border-color: var(--kof-red); background: #fdecec; }
.kof-consent--checkout.is-invalid input { outline: 2px solid var(--kof-red); outline-offset: 2px; }
.kof-consent--checkout.is-shake { animation: kof-shake .4s; }
@keyframes kof-shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
@media (prefers-reduced-motion: reduce) { .kof-consent--checkout.is-shake { animation: none; } }
.kof-consent__error { margin: -8px 0 16px; padding-left: 14px; color: var(--kof-red-ink); font-weight: 600; font-size: .9rem; }

/* «Заказ принят»: способ оплаты в шапке заказа не показываем (см. inc/woocommerce.php,
   woocommerce_get_order_item_totals) — разметку шаблона WC не переопределяем ради одной строки. */
.woocommerce-order-overview__payment-method { display: none; }
/* Скрытый способ оплаты — последний пункт: у предпоследнего убираем разделитель справа. */
.woocommerce ul.order_details li:has(+ .woocommerce-order-overview__payment-method:last-child) { border-right: 0; margin-right: 0; padding-right: 0; }