/*
 * Shop pages (checkout, cart, order received, My account) on the carbon desk: the form stays on the desk, the
 * order is a paper receipt with a torn edge, the one action is the highlighter button. WooCommerce blocks keep
 * their structure; only the look changes.
 */

/* ---------- width: room for the receipt next to the form ---------- */
body.jbs-site.woocommerce-checkout:not(.elementor-page) .site-main.page,
body.jbs-site.woocommerce-cart:not(.elementor-page) .site-main.page { max-width: 72rem; }
body.jbs-site.woocommerce-account:not(.elementor-page) .site-main.page { max-width: 60rem; }

/* ---------- form on the desk ---------- */
.jbs-site .wc-block-components-title,
.jbs-site .wc-block-components-checkout-step__title { font-family: var(--jbs-display); font-weight: 800; font-size: 1.6rem; color: var(--jbs-on-desk); letter-spacing: 0; }
.jbs-site .wc-block-components-checkout-step__description,
.jbs-site .wc-block-checkout__terms,
.jbs-site .wc-block-components-checkbox__label { color: var(--jbs-on-desk-2); }
.jbs-site .wc-block-checkout__terms a, .jbs-site .wc-block-components-checkout-step a { color: var(--jbs-hl); }

.jbs-site .wc-block-components-text-input input,
.jbs-site .wc-block-components-combobox .wc-block-components-combobox-control input,
.jbs-site .wc-blocks-components-select .wc-blocks-components-select__select,
.jbs-site .wc-block-components-textarea {
	background: #fff; color: var(--jbs-ink); border: 1px solid var(--jbs-control-line); border-radius: 4px; font-family: var(--jbs-sans);
}
.jbs-site .wc-block-components-text-input label,
.jbs-site .wc-blocks-components-select__label { color: var(--jbs-ink-2); }
.jbs-site .wc-block-components-text-input input:focus,
.jbs-site .wc-blocks-components-select .wc-blocks-components-select__select:focus,
.jbs-site .wc-block-components-textarea:focus { border-color: var(--jbs-hl); box-shadow: 0 0 0 2px var(--jbs-hl); outline: none; }
.jbs-site .wc-block-components-validation-error p { color: #ff9b8f; }

/* Payment choices: slips on the desk, the chosen one outlined in highlighter. */
.jbs-site .wc-block-components-radio-control-accordion-option,
.jbs-site .wc-block-components-radio-control__option { border-color: var(--jbs-desk-line) !important; background: var(--jbs-desk-2); color: var(--jbs-on-desk); }
.jbs-site .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.jbs-site .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option--checked-option-highlighted { box-shadow: inset 0 0 0 2px var(--jbs-hl); }
.jbs-site .wc-block-components-radio-control__label, .jbs-site .wc-block-components-payment-method-label { color: var(--jbs-on-desk); font-weight: 600; }

/* Express buttons only when there are some (Apple Pay / Google Pay depend on the device). */
.jbs-site .wc-block-components-express-payment:not(:has(.wc-block-components-express-payment__event-buttons > li)),
.jbs-site .wc-block-components-express-payment:not(:has(.wc-block-components-express-payment__event-buttons > li)) + .wc-block-components-express-payment-continue-rule { display: none; }
.jbs-site .wc-block-components-express-payment-continue-rule { color: var(--jbs-on-desk-2); }
.jbs-site .wc-block-components-express-payment-continue-rule::before,
.jbs-site .wc-block-components-express-payment-continue-rule::after { border-color: var(--jbs-desk-line); }

/* ---------- the one action: the highlighter button ---------- */
body.jbs-site .wc-block-components-checkout-place-order-button,
body.jbs-site .wc-block-cart__submit-button,
body.jbs-site .woocommerce-account .woocommerce-Button,
body.jbs-site .woocommerce-account button.button,
body.jbs-site .woocommerce-account .button {
	background: var(--jbs-hl); color: var(--jbs-ink); border: 0; border-radius: 3px; box-shadow: none;
	font-family: var(--jbs-sans); font-weight: 600; font-size: 1.05rem; padding: 0.95rem 1.4rem; text-decoration: none;
	transition: transform 0.2s var(--jbs-ease), background 0.2s;
}
body.jbs-site .wc-block-components-checkout-place-order-button { width: 100%; min-height: 3.4rem; }
body.jbs-site .wc-block-components-checkout-place-order-button:hover,
body.jbs-site .wc-block-cart__submit-button:hover,
body.jbs-site .woocommerce-account .button:hover { background: #ffe27a; color: var(--jbs-ink); transform: translateY(-1px); }
body.jbs-site .wc-block-components-checkout-place-order-button:active { transform: translateY(1px); }
body.jbs-site .wc-block-components-checkout-place-order-button:focus-visible { outline: 2px solid var(--jbs-paper); outline-offset: 3px; }
body.jbs-site .wc-block-components-checkout-place-order-button .wc-block-components-button__text { color: inherit; }
@media (prefers-reduced-motion: reduce) { body.jbs-site .wc-block-components-checkout-place-order-button, body.jbs-site .wc-block-cart__submit-button { transition: none; } }

/* ---------- the order: a paper receipt with a torn bottom edge ---------- */
.jbs-site .wc-block-checkout__sidebar,
.jbs-site .wc-block-cart__sidebar {
	--tear: 9px;
	background: var(--jbs-paper); color: var(--jbs-ink); border-radius: 4px 4px 0 0;
	padding: 1.4rem 1.4rem calc(1.6rem + var(--tear));
	-webkit-mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / calc(2 * var(--tear)) 100%;
	mask: conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) 50% / calc(2 * var(--tear)) 100%;
}
.jbs-site .wc-block-checkout__sidebar *,
.jbs-site .wc-block-cart__sidebar * { color: var(--jbs-ink); border-color: var(--jbs-rule); }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title,
.jbs-site .wc-block-cart__sidebar .wc-block-cart__totals-title { border-bottom: 2px solid var(--jbs-ink); padding-bottom: 0.6rem; margin-bottom: 0.4rem; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title-text,
.jbs-site .wc-block-cart__sidebar .wc-block-cart__totals-title { font-family: var(--jbs-mono); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-totals-wrapper { border-top: 1px dashed var(--jbs-rule); }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-product-name { font-weight: 600; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-product-metadata,
.jbs-site .wc-block-checkout__sidebar .wc-block-components-product-details { color: var(--jbs-ink-2); font-size: 0.85rem; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-order-summary-item__image { display: none; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-order-summary-item__description { padding-left: 0; }
.jbs-site .wc-block-components-formatted-money-amount,
.jbs-site .wc-block-components-totals-item__value,
.jbs-site .wc-block-components-order-summary-item__total-price { font-family: var(--jbs-mono); font-variant-numeric: tabular-nums; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-totals-footer-item { font-size: 1.15rem; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-weight: 700; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-panel__button { color: var(--jbs-ink-2); }
.jbs-site .wc-block-checkout__sidebar input { background: #fff; border-color: var(--jbs-control-line); }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-button:not(.is-link) { background: var(--jbs-ink); color: var(--jbs-paper); border: 0; border-radius: 3px; }

/* Mobile: the collapsed "Order summary" bar on the desk. */
.jbs-site .wc-block-components-checkout-order-summary__title { color: var(--jbs-on-desk); }

/* ---------- order received ---------- */
.jbs-site .wc-block-order-confirmation-status { color: var(--jbs-on-desk); }
.jbs-site .wc-block-order-confirmation-summary { border-color: var(--jbs-desk-line); }
.jbs-site .wc-block-order-confirmation-summary-list-item__key { font-family: var(--jbs-mono); font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--jbs-on-desk-2); }
.jbs-site .wc-block-order-confirmation-totals,
.jbs-site .woocommerce-order-details .woocommerce-table,
.jbs-site .woocommerce-account .woocommerce-orders-table,
.jbs-site .woocommerce-account .woocommerce-table--order-details {
	background: var(--jbs-paper); color: var(--jbs-ink); border-radius: 4px; border-collapse: collapse; overflow: hidden;
}
.jbs-site .wc-block-order-confirmation-totals *,
.jbs-site .woocommerce-order-details .woocommerce-table *,
.jbs-site .woocommerce-account .woocommerce-orders-table *,
.jbs-site .woocommerce-account .woocommerce-table--order-details * { color: var(--jbs-ink); border-color: var(--jbs-rule) !important; }
.jbs-site .wc-block-order-confirmation-totals th,
.jbs-site .woocommerce-account .woocommerce-orders-table th { font-family: var(--jbs-mono); font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--jbs-ink-2) !important; }
.jbs-site .wc-block-order-confirmation-totals th, .jbs-site .wc-block-order-confirmation-totals td,
.jbs-site .woocommerce-account .woocommerce-orders-table th, .jbs-site .woocommerce-account .woocommerce-orders-table td { padding: 0.7rem 0.9rem; background: transparent; }
.jbs-site .wc-block-order-confirmation-billing-address,
.jbs-site .wc-block-order-confirmation-shipping-address { border-color: var(--jbs-desk-line); color: var(--jbs-on-desk-2); }
.jbs-site .woocommerce-account .woocommerce-orders-table a { color: var(--jbs-stamp) !important; }

/* ---------- My account (signed out): log in and lost password on the desk ---------- */
.jbs-site .woocommerce-account .woocommerce-form-login,
.jbs-site .woocommerce-account .woocommerce-form-register,
.jbs-site .woocommerce-account .woocommerce-ResetPassword { background: var(--jbs-paper); color: var(--jbs-ink); border: 0; border-radius: 6px; padding: clamp(1.25rem, 3.5vw, 2rem); box-shadow: 0 18px 30px -12px rgba(0, 0, 0, 0.5); }
.jbs-site .woocommerce-account .woocommerce-form-login *,
.jbs-site .woocommerce-account .woocommerce-ResetPassword * { color: var(--jbs-ink); }
.jbs-site .woocommerce-account .woocommerce-form-login input.input-text,
.jbs-site .woocommerce-account .woocommerce-ResetPassword input.input-text { width: 100%; background: #fff; border: 1px solid var(--jbs-control-line); border-radius: 4px; padding: 0.6rem 0.75rem; font: inherit; }
.jbs-site .woocommerce-account .woocommerce-LostPassword a { color: var(--jbs-stamp); }
.jbs-site .woocommerce-account .woocommerce-MyAccount-content > p { color: var(--jbs-on-desk-2); }
.jbs-site .woocommerce-account .woocommerce-MyAccount-content > p a { color: var(--jbs-hl); }

/* ---------- notices ---------- */
.jbs-site .wc-block-components-notice-banner { border-radius: 4px; color: var(--jbs-ink); }
.jbs-site .woocommerce-message, .jbs-site .woocommerce-info, .jbs-site .woocommerce-error { background: var(--jbs-paper); color: var(--jbs-ink); border-top-color: var(--jbs-stamp); border-radius: 4px; }
.jbs-site .woocommerce-error { border-top-color: #b3261e; }

/* The receipt is the box: no second box inside it. */
.jbs-site .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block,
.jbs-site .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__content { border: 0 !important; padding-left: 0; padding-right: 0; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title { padding-left: 0; padding-right: 0; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-totals-wrapper { padding-left: 0; padding-right: 0; }
.jbs-site .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-panel { padding-left: 0; padding-right: 0; }
/* Saved address card on the desk. */
.jbs-site .wc-block-components-address-card { background: var(--jbs-desk-2); border-color: var(--jbs-desk-line); color: var(--jbs-on-desk-2); }
.jbs-site .wc-block-components-address-card__edit { color: var(--jbs-hl); }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-totals-item,
.jbs-site .wc-block-checkout__sidebar .wc-block-components-order-summary .wc-block-components-order-summary-item,
.jbs-site .wc-block-checkout__sidebar .wc-block-components-totals-coupon,
.jbs-site .wc-block-checkout__sidebar .wc-block-components-panel__button { padding-left: 0 !important; padding-right: 0 !important; }
.jbs-site .wc-block-checkout__sidebar .wc-block-components-order-summary { padding-left: 0; padding-right: 0; }

/* ---------- empty cart ---------- */
.jbs-site .jbs-empty-cart { text-align: center; padding: clamp(2rem, 6vw, 4rem) 0; }
.jbs-site .jbs-empty-cart__title { font-family: var(--jbs-display); font-weight: 800; font-size: clamp(1.8rem, 4vw, 2.4rem); line-height: 1.1; color: var(--jbs-on-desk); margin: 0 0 0.6rem; }
.jbs-site .jbs-empty-cart p { color: var(--jbs-on-desk-2); }
body.jbs-site:not(.elementor-page) .page-content .jbs-empty-cart a.jbs-btn { color: var(--jbs-ink); text-decoration: none; }

/* The checkout's order summary follows the scroll; WooCommerce pins it 24px from the top, under our sticky header.
   Same offset as the site's other sticky asides. */
.jbs-site .wc-block-checkout__sidebar.is-sticky { top: 6.5rem; }

/* Viva's logo strip next to the payment method's title: spaced from the text, centred on it, under it on narrow screens */
.jbs-site .wc-block-components-radio-control__label > div:has(> img[src*="viva_plugin_logo"]) { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.jbs-site .wc-block-components-radio-control__label img[src*="viva_plugin_logo"] { height: 26px; width: auto; border-radius: 3px; margin: 0; }
