/*
 * Cart block: the cross-sell collection.
 * Loaded on is_cart() when the page uses the block (inc/wge-blocks-checkout.php).
 *
 * The products themselves are WooCommerce's own Product Collection blocks, not
 * this theme's cards, so only the surrounding container is styled here. The
 * selection they show comes from inc/wge-cart-crosssell.php.
 */

.wc-block-cart .wp-block-woocommerce-product-collection {
    margin-top: 2.5rem;
    padding-top: 1.75rem;
    border-top: 1px solid rgba(0, 0, 0, .1);
}

.wc-block-cart .wp-block-woocommerce-product-collection > .wp-block-heading {
    margin: 0 0 1rem;
    font-size: 1.25rem;
    line-height: 1.2;
}

/* --- Proceed to checkout -------------------------------------------------
 * WooCommerce renders this button with no background of its own, so it came
 * out as dark text on the page — present, clickable, and effectively
 * invisible as a button. It was previously coloured by a rule in the site's
 * customizer Additional CSS, which does not travel with a theme rename.
 *
 * Styling it here instead means the most important button on the cart no
 * longer depends on a setting stored in the database.
 */
.wc-block-cart__submit-container a,
.wc-block-cart__submit-container button,
.wc-block-cart .wc-block-cart__submit-button {
    display: block;
    width: 100%;
    padding: 14px 22px;
    border: 0;
    border-radius: 4px;
    background-color: var(--gbl-primary-color, #a12324);
    color: #fff;
    font-family: var(--gbl-primary-font, inherit);
    /* 15px and the margins are the values the site had settled on in its
       Additional CSS; adopted here so that rule can be deleted. */
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: .3px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    margin-top: 5px;
    margin-bottom: 15px;
    transition: background-color .15s ease-in-out;
}

.wc-block-cart__submit-container a:hover,
.wc-block-cart__submit-container a:focus,
.wc-block-cart .wc-block-cart__submit-button:hover,
.wc-block-cart .wc-block-cart__submit-button:focus {
    background-color: #7f1c1d;
    color: #fff;
}

.wc-block-cart .wc-block-cart__submit-button:focus-visible {
    outline: 3px solid #1434CB;
    outline-offset: 2px;
}