/**
 * Mamma Rosa shop theme - cart, checkout and order-received pages.
 *
 * Re-themes the raw WooCommerce pages (Blocks markup AND classic fallback) so
 * the whole purchase flow matches the menu card. All colors/fonts/sizes come
 * from the --po-* variables output by Pizza_Design_Frontend on :root, with the
 * same local fallbacks as pizza-menu.css.
 *
 * Enqueued only on cart/checkout/order-received (see Pizza_Design_Frontend).
 * !important is used deliberately on buttons/inputs to win over WC Blocks'
 * highly specific selectors (per the "changes must win the cascade" rule).
 *
 * @since 2.15.0
 */

body.woocommerce-cart,
body.woocommerce-checkout {
    --c-primary: var(--po-primary, #c5341f);
    --c-secondary: var(--po-secondary, #2f5d3a);
    --c-accent: var(--po-accent, #e0a528);
    --c-bg: var(--po-bg, #fbf3e4);
    --c-card: var(--po-card-bg, #fffdf8);
    --c-text: var(--po-text, #2b1d16);
    --c-muted: var(--po-text-muted, #6b5746);
    --c-line: var(--po-border, #e6d6ba);
    --c-button: var(--po-button, #c5341f);
    --c-button-text: var(--po-button-text, #ffffff);
    --c-price: var(--po-price, #a52817);
    --f-head: var(--po-font-heading, "Playfair Display", Georgia, serif);
    --f-body: var(--po-font-body, "Outfit", system-ui, sans-serif);
    --radius: var(--po-card-radius, 18px);

    background: var(--c-bg) !important;
    font-family: var(--f-body);
    color: var(--c-text);
}

/* ---------- LAYOUT: constrain + center (theme gives full width) ---------- */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
    max-width: var(--po-menu-max, 1180px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 22px;
    padding-right: 22px;
    box-sizing: border-box;
}

/* ---------- HEADINGS (page title, section titles, totals) ---------- */
body.woocommerce-cart h1,
body.woocommerce-checkout h1,
body.woocommerce-cart h2,
body.woocommerce-checkout h2,
body.woocommerce-cart .wp-block-heading,
body.woocommerce-checkout .wp-block-heading,
.wc-block-components-checkout-step__title,
.wc-block-components-title {
    font-family: var(--f-head) !important;
    color: var(--c-secondary) !important;
    letter-spacing: -.01em;
}

/* ---------- CART: items table as a card ---------- */
.wp-block-woocommerce-cart .wc-block-cart-items,
.wc-block-cart-items {
    background: var(--c-card);
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
    padding: 10px 18px;
}

.wc-block-cart-items__header {
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 12px;
    color: var(--c-muted);
}

.wc-block-cart-items .wc-block-cart-items__row {
    border-top: 1px dashed var(--c-line);
}

/* Product thumbnails: style like the menu card's .po-thumb (real images come
   from the SVG icons attached as featured images in phase 12). */
.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img,
body.woocommerce-cart table.shop_table .product-thumbnail img,
body.woocommerce-checkout .cart_item .product-thumbnail img {
    background: linear-gradient(135deg, #f7e7c8, #f1d9b0);
    border: 1px solid var(--c-line) !important;
    border-radius: 12px !important;
    padding: 6px;
    box-sizing: border-box;
}

/* Product name + meta (toppings/size) */
.wc-block-components-product-name {
    font-family: var(--f-head) !important;
    font-weight: 600;
    font-size: 17px;
    color: var(--c-text) !important;
}

.wc-block-components-product-details,
.wc-block-components-product-metadata {
    color: var(--c-muted) !important;
    font-size: 13px;
}

.wc-block-components-product-details__name {
    color: var(--c-secondary) !important;
    font-weight: 600;
}

/* Prices */
.wc-block-cart-item__total .wc-block-components-product-price,
.wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-formatted-money-amount {
    font-family: var(--f-head);
    color: var(--c-price) !important;
    font-weight: 700;
}

/* Quantity selector */
.wc-block-components-quantity-selector {
    border: 1.5px solid var(--c-line) !important;
    border-radius: 12px !important;
    background: var(--c-bg);
    overflow: hidden;
}

.wc-block-components-quantity-selector input,
.wc-block-components-quantity-selector button {
    color: var(--c-secondary) !important;
    font-weight: 600;
}

.wc-block-components-quantity-selector::after {
    border: none !important;
}

/* ---------- CART: sidebar / totals as a card ---------- */
.wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block,
.wc-block-cart__sidebar .wc-block-components-sidebar,
.wp-block-woocommerce-checkout .wc-block-components-sidebar .wp-block-woocommerce-checkout-order-summary-block {
    background: var(--c-card);
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
    padding: 8px 16px;
}

.wc-block-components-totals-wrapper {
    border-top: 1px dashed var(--c-line) !important;
}

/* ---------- BUTTONS (Gå til Kassen / Afgiv ordre / generelt) ---------- */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.wc-block-components-button:not(.is-link),
body.woocommerce-cart .button,
body.woocommerce-checkout .button,
body.woocommerce-checkout #place_order {
    background: var(--c-button) !important;
    color: var(--c-button-text) !important;
    border: none !important;
    border-radius: 12px !important;
    font-family: var(--f-body) !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    transition: filter .2s;
}

.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.wc-block-components-button:not(.is-link):hover,
body.woocommerce-cart .button:hover,
body.woocommerce-checkout .button:hover,
body.woocommerce-checkout #place_order:hover {
    filter: brightness(.92);
    background: var(--c-button) !important;
    color: var(--c-button-text) !important;
}

/* Secondary/link-style actions keep the basil green */
.wc-block-components-button.is-link,
body.woocommerce-cart a:not(.button),
body.woocommerce-checkout a:not(.button) {
    color: var(--c-secondary);
}

/* ---------- INPUTS (checkout form, coupon) ---------- */
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-components-select .components-custom-select-control__button,
.wc-block-components-totals-coupon__input input,
body.woocommerce-checkout form .input-text,
body.woocommerce-checkout form select,
body.woocommerce-cart .coupon .input-text {
    background: #fff !important;
    border: 1.5px solid var(--c-line) !important;
    border-radius: 10px !important;
    color: var(--c-text) !important;
    font-family: var(--f-body) !important;
}

.wc-block-components-text-input input:focus,
body.woocommerce-checkout form .input-text:focus {
    border-color: var(--c-accent) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-accent) 20%, transparent) !important;
    outline: none;
}

.wc-block-components-text-input label,
.wc-block-components-checkout-step__description,
body.woocommerce-checkout form label {
    color: var(--c-muted) !important;
    font-family: var(--f-body) !important;
}

/* Checkout step sections as cards (blocks) */
.wp-block-woocommerce-checkout .wc-block-components-checkout-step {
    background: var(--c-card);
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
    padding: 18px;
    margin-bottom: 16px;
}

/* ---------- EMPTY CART ---------- */
/* Hide the theme/WC "New in store" product grid + heading on the empty cart. */
.wp-block-woocommerce-cart .wp-block-heading,
.wp-block-woocommerce-cart .wc-block-grid,
.wp-block-woocommerce-cart ul.wc-block-grid__products,
.wp-block-woocommerce-cart ul.products,
body.woocommerce-cart .cross-sells {
    display: none !important;
}

.wc-block-cart__empty-cart__title,
.wp-block-woocommerce-cart .with-empty-cart-icon {
    font-family: var(--f-head) !important;
    color: var(--c-secondary) !important;
}

/* ---------- CLASSIC FALLBACK (shop_table, order received) ---------- */
body.woocommerce-cart table.shop_table,
body.woocommerce-checkout table.shop_table,
.woocommerce-order-details table.shop_table,
.woocommerce-customer-details,
.woocommerce-order {
    background: var(--c-card);
    border: 1px solid var(--c-line) !important;
    border-radius: var(--radius);
    border-collapse: separate !important;
    overflow: hidden;
}

body.woocommerce-cart table.shop_table th,
body.woocommerce-checkout table.shop_table th {
    text-transform: uppercase;
    letter-spacing: .1em;
    font-size: 12px;
    color: var(--c-muted);
}

body.woocommerce-cart table.shop_table td,
body.woocommerce-checkout table.shop_table td {
    border-top: 1px dashed var(--c-line) !important;
}

.woocommerce-order-received .woocommerce-thankyou-order-received {
    font-family: var(--f-head);
    font-size: 24px;
    color: var(--c-secondary);
}

/* Notices in the rustic palette */
.wc-block-components-notice-banner.is-success,
.woocommerce-message {
    border-color: var(--c-secondary) !important;
}

.wc-block-components-notice-banner.is-error,
.woocommerce-error {
    border-color: var(--c-primary) !important;
}