/**
 * ClingKit WooCommerce Styles
 * Global cart and checkout overrides.
 * Enqueued on all WooCommerce pages (cart, checkout, shop).
 *
 * @package ClingKit
 */

@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;600;700&family=Jost:wght@400;500;600&display=swap');

/* -------------------------------------------------------------------------
   Coupon input field - wider so coupon codes aren't truncated
------------------------------------------------------------------------- */
.woocommerce #content table.cart td.actions .input-text,
.woocommerce table.cart td.actions .input-text,
.woocommerce-page #content table.cart td.actions .input-text,
.woocommerce-page table.cart td.actions .input-text {
    width: 200px;
}

/* -------------------------------------------------------------------------
   Proceed to Checkout button - match ClingKit brand style
------------------------------------------------------------------------- */
.woocommerce .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    font-family: 'Roboto Slab', serif;
    font-weight: 600;
    background-color: #cc3300;
    color: #fff;
    border-radius: 4px;
    letter-spacing: 0.02em;
    transition: background 0.15s;
}

.woocommerce .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background-color: #aa2900;
    color: #fff;
}

/* -------------------------------------------------------------------------
   Cart item names - subject and accessory display names
------------------------------------------------------------------------- */
.ck-subject-name {
    font-weight: 600;
}

.ck-subject-type {
    font-size: 0.85em;
    color: #666;
    font-weight: 400;
}

/* -------------------------------------------------------------------------
   Checkout order review thumbnails
   filter_checkout_item_quantity prepends thumbnail to the quantity cell
------------------------------------------------------------------------- */
.woocommerce-checkout-review-order .product-quantity img {
    vertical-align: middle;
}