/* =========================================================================
   Кошик TechHub
   Токени — з techhub-ui.css, який підключається раніше.
   ====================================================================== */

/* -------------------------------------------------------------------------
   Мертві колонки
   Кількість завжди 1 (унікальні вживані екземпляри), тому «Кількість»
   порожня, а «Проміжний підсумок» дослівно дублює «Ціну». display:none
   прибирає їх і з дерева доступності, тож зчитувачі екрана їх теж не
   озвучують.
   ---------------------------------------------------------------------- */
.woocommerce-cart-form__contents th.product-quantity,
.woocommerce-cart-form__contents td.product-quantity,
.woocommerce-cart-form__contents th.product-subtotal,
.woocommerce-cart-form__contents td.product-subtotal {
    display: none;
}

/* -------------------------------------------------------------------------
   Рядок характеристик під назвою
   ---------------------------------------------------------------------- */
.th-cart-specs {
    margin-top: 4px;
    color: var(--th-muted, #667085);
    font-size: 13px;
    line-height: 1.45;
}

.woocommerce-cart-form__contents td.product-name > a {
    font-weight: 600;
    color: var(--th-ink, #0F1419);
    font-size: 15px;
    line-height: 1.3;
}

.woocommerce-cart-form__contents td.product-name > a:hover {
    color: var(--th-primary, #1C64F2);
}

/* Ціна праворуч, моноширинні цифри — щоб суми в стовпчику вирівнювались. */
.woocommerce-cart-form__contents td.product-price {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Мобільний вигляд
   Тема перемикає таблицю в «картки», де кожна клітинка отримує підпис із
   data-title. Прихованим колонкам підписи не потрібні, а назва має
   займати весь рядок.
   ---------------------------------------------------------------------- */
@media (max-width: 768px) {
    .woocommerce-cart-form__contents td.product-name {
        display: block;
        width: 100%;
    }

    .woocommerce-cart-form__contents td.product-name::before {
        display: none;
    }
}

/* -------------------------------------------------------------------------
   Методи доставки: вартість/строк другим рядком
   ---------------------------------------------------------------------- */
.th-ship-note {
    display: block;
    margin-top: 2px;
    color: var(--th-muted, #667085);
    font-size: 12.5px;
    font-weight: 400;
    line-height: 1.4;
}

.woocommerce-shipping-methods li,
#shipping_method li {
    margin-bottom: 10px;
}

/* -------------------------------------------------------------------------
   Блок довіри — під підсумками кошика і над кнопкою оформлення на чекауті
   ---------------------------------------------------------------------- */
.th-trust {
    list-style: none;
    margin: 16px 0 0;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    background: var(--th-soft, #F7F9FC);
    border: 1px solid var(--th-border, #E4E8EF);
    border-radius: var(--th-radius, 14px);
}

.th-trust li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0;
    font-size: 13.5px;
    line-height: 1.45;
    color: var(--th-ink, #0F1419);
}

.th-trust svg {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin-top: 1px;
    fill: none;
    stroke: var(--th-success, #12885F);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* -------------------------------------------------------------------------
   Порожній кошик
   Рідна кнопка «Повернутись до магазину» живе в самому шаблоні
   cart-empty.php, а не на хуку, тож зняти її фільтром неможливо — своя
   кнопка «До каталогу» вже є всередині блоку.
   ---------------------------------------------------------------------- */
.cart-empty,
.wc-empty-cart-message + .return-to-shop,
.th-cart-empty ~ .return-to-shop {
    display: none;
}

.th-cart-empty {
    max-width: 560px;
    margin: 8px auto 40px;
    padding: 34px 30px;
    text-align: center;
    background: var(--th-soft, #F7F9FC);
    border: 1px solid var(--th-border, #E4E8EF);
    border-radius: var(--th-radius-lg, 20px);
}

.th-cart-empty h2 {
    margin: 0 0 8px;
    font-size: 22px;
    line-height: 1.2;
    color: var(--th-ink, #0F1419);
}

.th-cart-empty p {
    margin: 0 0 20px;
    color: var(--th-muted, #667085);
    font-size: 14.5px;
    line-height: 1.55;
}

.th-cart-empty__picks {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--th-border, #E4E8EF);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px 10px;
    font-size: 13.5px;
}

.th-cart-empty__picks span {
    color: var(--th-muted, #667085);
    width: 100%;
    margin-bottom: 2px;
}

.th-cart-empty__picks a {
    padding: 5px 13px;
    border: 1px solid var(--th-border, #E4E8EF);
    border-radius: var(--th-radius-pill, 999px);
    background: var(--th-bg, #FFFFFF);
    color: var(--th-ink, #0F1419);
    transition: border-color .15s ease, color .15s ease;
}

.th-cart-empty__picks a:hover {
    border-color: var(--th-primary, #1C64F2);
    color: var(--th-primary, #1C64F2);
}

/* Абзац «Доставка до …» — див. коментар у inc/cart.php: фільтра для
   першого речення немає, а сам рядок нічого не додає, бо адресу покупець
   вказує на оформленні. */
.woocommerce-shipping-destination {
    display: none;
}

/* =========================================================================
   Оформлення замовлення
   Макет теми (дві колонки, «чек» праворуч) лишаємо — правимо тільки те,
   що заважає заповнювати форму.
   ====================================================================== */

/* Поля в один стовпчик і ширші: у двоколонковій розкладці теми «Ім'я» та
   «Прізвище» стискались до половини і так вужчої колонки. Форма з
   чотирьох полів нічого не виграє від двох колонок, а помилок дає більше. */
.woocommerce-checkout .woocommerce-billing-fields .form-row {
    width: 100%;
    float: none;
    padding-inline: 0;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.woocommerce-checkout .woocommerce-billing-fields .form-row {
    margin-bottom: 0;
}

/* Поле під палець: 44px — мінімум, за який зручно влучати на телефоні. */
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select {
    min-height: 44px;
    font-size: 16px; /* нижче 16px iOS зумить сторінку при фокусі */
}

/* Характеристики в «Вашому замовленні» — той самий сірий рядок, що в кошику. */
.woocommerce-checkout-review-order-table .th-cart-specs {
    margin-top: 3px;
    font-size: 12.5px;
}

/* Кнопка підтвердження — на всю ширину колонки й помітно вища за поля. */
.woocommerce-checkout #place_order {
    width: 100%;
    min-height: 52px;
    font-size: 15px;
}

/* Блок довіри стоїть безпосередньо над кнопкою — прибираємо подвійний
   відступ між ними. */
.woocommerce-checkout .th-trust {
    margin-bottom: 14px;
}

/* Опис способу оплати розкривається під вибраним варіантом; типовий
   відступ теми робить його схожим на окремий блок. */
.woocommerce-checkout .payment_box {
    font-size: 13.5px;
    line-height: 1.5;
}

@media (max-width: 768px) {
    /* На телефоні спершу форма, потім чек: спочатку дія, потім довідка. */
    .woocommerce-checkout .checkout-order-review {
        order: 2;
    }

    .woocommerce-checkout .customer-details {
        order: 1;
    }
}

/* Акція про безкоштовну доставку — стилі спільні зі сторінкою товару
   (assets/css/product.css), тут лише відступ у блоці підсумків. */
.cart_totals .th-promo,
.woocommerce-checkout-review-order .th-promo {
    margin: 12px 0 0;
}

/* -------------------------------------------------------------------------
 * Порожній кошик: прибираємо чужі дублі
 *
 * inc/cart.php знімає стандартний блок WooCommerce (`wc_empty_cart_message`)
 * і ставить наш «Кошик порожній» з кнопкою «До каталогу» та добірками.
 * Але WoodMart малює СВІЙ порожній стан у власному шаблоні — його той
 * remove_action не торкається. Тому під нашим блоком з'являлась ще одна
 * порада («Перш ніж перейти до оформлення…») і ще одна кнопка повернення:
 * та сама думка тричі поспіль.
 *
 * Ховаємо, а не видаляємо з шаблону: правити шаблон батьківської теми не
 * можна, а перекривати її PHP-хуки заради двох абзаців — зайва складність.
 * ---------------------------------------------------------------------- */
.th-cart-empty ~ .wd-empty-block-text,
.th-cart-empty ~ .return-to-shop,
.th-cart-empty ~ .cart-empty {
    display: none;
}