/* ==========================================================================
   PrintNotch: basket, checkout and order confirmation
   ========================================================================== */

.pn-flow { padding: 28px 0 80px; background: var(--pn-wash); min-height: 60vh; }
.pn-flow .pn-container { max-width: 1180px; }
.pn-flow h1, .pn-flow h2, .pn-flow h3 { color: var(--pn-ink); letter-spacing: -0.02em; }
.pn-flow a { color: var(--pn-blue); }
.pn-flow a.pn-btn-primary, .pn-flow a.pn-btn-dark, .pn-flow a.pn-btn-primary:hover, .pn-flow a.pn-btn-dark:hover { color: #fff; }
.pn-flow a.pn-btn-outline { color: var(--pn-ink); }
.pn-flow .pn-icon { flex-shrink: 0; }

/* 16px text in fields stops phones zooming in when you tap them */
.pn-flow input[type="text"], .pn-flow input[type="email"], .pn-flow input[type="tel"], .pn-flow input[type="password"],
.pn-flow input[type="number"], .pn-flow select, .pn-flow textarea {
    width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid var(--pn-line-2); border-radius: 8px; background: #fff;
    font-family: var(--pn-font); font-size: 16px; line-height: 1.4; color: var(--pn-ink); box-shadow: none; transition: border-color .15s, box-shadow .15s;
}
.pn-flow textarea { min-height: 96px; resize: vertical; }
.pn-flow input:focus, .pn-flow select:focus, .pn-flow textarea:focus { outline: none; border-color: var(--pn-blue); box-shadow: 0 0 0 3px rgba(47, 118, 175, .18); }
.pn-flow ::placeholder { color: #94a3b8; opacity: 1; }
.pn-flow input[type="checkbox"], .pn-flow input[type="radio"] { width: 18px; height: 18px; margin: 0; accent-color: var(--pn-blue); flex-shrink: 0; }
.pn-flow :focus-visible { outline: 2px solid var(--pn-blue); outline-offset: 2px; }

.pn-card, .pn-cart-items, .pn-summary, .pn-co-step, .pn-co-summary {
    background: #fff; border: 1px solid var(--pn-line); border-radius: 14px;
}

/* Notices */
.pn-flow .woocommerce-notices-wrapper:empty { display: none; }
.pn-flow .woocommerce-message, .pn-flow .woocommerce-info, .pn-flow .woocommerce-error {
    margin: 0 0 20px; border: 1px solid var(--pn-line); border-left: 4px solid var(--pn-blue); border-radius: 10px; background: #fff; padding: 14px 18px; color: var(--pn-ink); font-size: .94rem; line-height: 1.5;
}
.pn-flow .woocommerce-message { border-left-color: var(--pn-green); background: #f0fdf4; }
.pn-flow .woocommerce-error { border-left-color: var(--pn-red); background: #fef2f2; }
.pn-flow .woocommerce-error li { margin: 0 0 4px; }
.pn-flow .woocommerce-error li:last-child { margin: 0; }
.pn-flow .woocommerce-message a.button, .pn-flow .woocommerce-info a.button { float: none; margin-left: 10px; min-height: 34px; padding: 6px 12px; font-size: .84rem; }

/* ─── Page heading and steps ─────────────────────────────────── */
.pn-flow-head { display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; flex-wrap: wrap; margin: 0 0 24px; }
.pn-flow-head h1 { margin: 0; font-size: clamp(1.6rem, 3vw, 2.1rem); font-weight: 800; }

.pn-steps { display: flex; align-items: center; gap: 0; margin: 0; padding: 0; list-style: none; font-size: .88rem; font-weight: 600; color: var(--pn-subtle); }
.pn-steps li { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.pn-steps li + li::before { content: ""; width: 32px; height: 2px; margin: 0 12px; background: var(--pn-line-2); border-radius: 2px; }
.pn-steps li.is-done + li::before, .pn-steps li.is-current::before { background: var(--pn-blue); }
.pn-step-dot { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 2px solid var(--pn-line-2); font-size: .75rem; font-weight: 800; color: var(--pn-subtle); }
.pn-steps .is-current { color: var(--pn-ink); }
.pn-steps .is-current .pn-step-dot { background: var(--pn-blue); border-color: var(--pn-blue); color: #fff; }
.pn-steps .is-done .pn-step-dot { background: var(--pn-blue-wash); border-color: var(--pn-blue); color: var(--pn-blue); }
.pn-steps a { color: var(--pn-ink); text-decoration: none; }
.pn-steps a:hover { text-decoration: underline; }

/* ─── Basket ─────────────────────────────────────────────────── */
.pn-cart { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 28px; align-items: start; }
.pn-cart-main { min-width: 0; }
.pn-cart-items { padding: 4px 24px; }
.pn-cart-item { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--pn-line); }
.pn-ci-img a, .pn-ci-img > img { display: block; }
.pn-ci-img img { display: block; width: 104px; height: 104px; object-fit: cover; border-radius: 10px; background: var(--pn-wash-2); border: 1px solid var(--pn-line); }
.pn-ci-body { display: flex; flex-direction: column; justify-content: space-between; gap: 14px; min-width: 0; }
.pn-ci-top { display: flex; justify-content: space-between; gap: 16px; }
.pn-ci-name { min-width: 0; color: var(--pn-muted); font-size: .9rem; line-height: 1.45; }
.pn-ci-name > a, .pn-ci-name > span:first-child { display: inline-block; margin-bottom: 4px; color: var(--pn-ink); font-size: 1.02rem; font-weight: 700; text-decoration: none; line-height: 1.35; }
.pn-ci-name > a:hover { color: var(--pn-blue); }
.pn-ci-name dl.variation { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; margin: 4px 0 0; }
.pn-ci-name dl.variation dt { margin: 0; font-weight: 600; color: var(--pn-muted); float: none; clear: none; }
.pn-ci-name dl.variation dd { margin: 0; float: none; }
.pn-ci-name dl.variation dd p { margin: 0; }
.pn-ci-each { margin: 6px 0 0; font-size: .85rem; color: var(--pn-subtle); }
.pn-ci-total { flex-shrink: 0; color: var(--pn-ink); font-weight: 800; font-size: 1.05rem; text-align: right; }
.pn-ci-total del { display: block; font-weight: 500; font-size: .85rem; color: var(--pn-subtle); }
.pn-ci-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.backorder_notification { margin: 6px 0 0; font-size: .85rem; color: #b45309; }

/* Quantity stepper (buttons are added by flow.js) */
.pn-flow .quantity { display: inline-flex; align-items: stretch; height: 42px; border: 1px solid var(--pn-line-2); border-radius: 999px; background: #fff; overflow: hidden; }
.pn-flow .quantity .qty { width: 46px; min-height: 0; height: 100%; padding: 0; border: 0; border-radius: 0; text-align: center; font-weight: 700; font-size: 16px; -moz-appearance: textfield; appearance: textfield; }
.pn-flow .quantity .qty:focus { box-shadow: none; }
.pn-flow .quantity:focus-within { border-color: var(--pn-blue); box-shadow: 0 0 0 3px rgba(47, 118, 175, .18); }
.pn-flow .quantity .qty::-webkit-outer-spin-button, .pn-flow .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pn-qty-btn { display: grid; place-items: center; width: 40px; padding: 0; border: 0; background: transparent; color: var(--pn-ink); font-size: 1.2rem; line-height: 1; cursor: pointer; transition: background-color .15s; }
.pn-qty-btn:hover { background: var(--pn-wash-2); }
.pn-qty-btn:disabled { color: #cbd5e1; cursor: default; background: transparent; }

.pn-ci-remove a.remove, .pn-flow .product-remove a.remove {
    display: inline-flex; align-items: center; gap: 6px; width: auto; height: auto; padding: 8px 10px; margin-right: -10px; border-radius: 8px;
    font-size: .88rem; font-weight: 600; color: var(--pn-subtle) !important; background: none !important; text-decoration: none; line-height: 1;
}
.pn-ci-remove a.remove:hover { color: var(--pn-red) !important; background: #fef2f2 !important; }

.pn-cart-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 0; }
.pn-link-back { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: .92rem; text-decoration: none; }
.pn-link-back:hover { text-decoration: underline; }
.pn-flow .pn-update-cart { min-height: 40px; padding: 8px 16px; font-size: .88rem; background: var(--pn-ink); }
.pn-js .pn-flow .pn-update-cart { display: none; }

/* Summary */
.pn-cart-side { position: sticky; top: calc(var(--pn-header-h) + 20px); }
.pn-summary { padding: 22px 22px 20px; }
.pn-summary-title { margin: 0 0 16px; font-size: 1.15rem; font-weight: 800; }
.pn-flow table.pn-totals, .pn-flow table.pn-review { width: 100%; margin: 0; border: 0; border-radius: 0; border-collapse: collapse; overflow: visible; }
.pn-flow table.pn-totals th, .pn-flow table.pn-totals td, .pn-flow table.pn-review tfoot th, .pn-flow table.pn-review tfoot td {
    padding: 8px 0; border: 0; background: none; font-size: .95rem; font-weight: 500; color: var(--pn-body); vertical-align: top;
}
.pn-flow table.pn-totals th, .pn-flow table.pn-review tfoot th { text-align: left; }
.pn-flow table.pn-totals td, .pn-flow table.pn-review tfoot td { text-align: right; color: var(--pn-ink); font-weight: 600; }
.pn-flow .pn-totals .order-total th, .pn-flow .pn-totals .order-total td,
.pn-flow .pn-review .order-total th, .pn-flow .pn-review .order-total td { padding-top: 16px; border-top: 1px solid var(--pn-line); font-size: 1.15rem; font-weight: 800; color: var(--pn-ink); }
.pn-flow .order-total small, .pn-flow .order-total .includes_tax { display: block; font-size: .78rem; font-weight: 500; color: var(--pn-subtle); }
.pn-flow .cart-discount td, .pn-flow .cart-discount th { color: var(--pn-green); }
.pn-flow .cart-discount td .amount { color: var(--pn-green); }
.pn-flow a.woocommerce-remove-coupon { display: block; margin-top: 2px; font-size: .78rem; font-weight: 600; color: var(--pn-subtle); }
.pn-flow a.woocommerce-remove-coupon:hover { color: var(--pn-red); }

/* Delivery options (inside the totals) */
.pn-flow tr.woocommerce-shipping-totals { display: block; }
.pn-flow tr.woocommerce-shipping-totals th, .pn-flow tr.woocommerce-shipping-totals td { display: block; width: auto; text-align: left !important; }
.pn-flow .pn-ship-name { flex: 1; min-width: 0; }
.pn-flow .pn-ship-cost { flex-shrink: 0; font-weight: 700; }
.pn-flow .pn-delivery-row th small { display: block; margin-top: 2px; font-size: .78rem; font-weight: 500; color: var(--pn-subtle); }
.pn-flow .pn-free { color: var(--pn-green); }
.pn-flow .pn-muted-val { font-weight: 500; color: var(--pn-subtle); }
.pn-flow tr.woocommerce-shipping-totals th { padding-bottom: 6px; }
.pn-flow tr.woocommerce-shipping-totals td { padding-top: 0; }
.pn-flow ul#shipping_method { margin: 0; padding: 0; list-style: none; }
.pn-flow ul#shipping_method li { position: relative; display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding: 12px 14px; border: 1px solid var(--pn-line); border-radius: 10px; background: #fff; font-weight: 600; font-size: .92rem; color: var(--pn-ink); text-indent: 0; }
.pn-flow ul#shipping_method li:has(input:checked) { border-color: var(--pn-blue); background: var(--pn-blue-wash); box-shadow: inset 0 0 0 1px var(--pn-blue); }
.pn-flow ul#shipping_method li input { position: static; margin: 0; }
.pn-flow ul#shipping_method li label { flex: 1; display: flex; justify-content: space-between; gap: 10px; margin: 0; cursor: pointer; }
.pn-flow ul#shipping_method li label .amount { font-weight: 700; }
.pn-flow .woocommerce-shipping-destination { margin: 4px 0 6px; font-size: .82rem; font-weight: 500; color: var(--pn-subtle); }
.pn-flow .woocommerce-shipping-calculator { margin: 0; }
.pn-flow .shipping-calculator-button { font-size: .85rem; font-weight: 600; }
.pn-flow .shipping-calculator-form { padding-top: 10px; }
.pn-flow .shipping-calculator-form p { margin: 0 0 10px; }
.pn-flow .shipping-calculator-form button { min-height: 40px; }
.pn-flow tr.woocommerce-shipping-totals p { margin: 0 0 6px; font-size: .88rem; font-weight: 500; color: var(--pn-subtle); }

/* Free delivery progress */
.pn-freeship { margin: 0 0 16px; padding: 14px; border-radius: 10px; background: var(--pn-blue-wash); color: var(--pn-ink-2); font-size: .9rem; }
.pn-freeship p { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; line-height: 1.4; }
.pn-freeship p .pn-icon { color: var(--pn-blue); flex-shrink: 0; }
.pn-freeship-track { height: 6px; border-radius: 6px; background: #D7E7F4; overflow: hidden; }
.pn-freeship-track span { display: block; height: 100%; border-radius: 6px; background: var(--pn-blue); transition: width .4s ease; }
.pn-freeship.is-done { background: #f0fdf4; }
.pn-freeship.is-done p .pn-icon { color: var(--pn-green); }
.pn-freeship.is-done .pn-freeship-track { display: none; }
.pn-freeship.is-done p { margin: 0; }

/* Discount code */
.pn-coupon { margin: 14px 0 0; padding: 14px 0 0; border-top: 1px solid var(--pn-line); }
.pn-coupon-toggle { display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; border: 0; background: none; color: var(--pn-ink); font: inherit; font-size: .92rem; font-weight: 600; cursor: pointer; }
.pn-coupon-toggle:hover { color: var(--pn-blue); }
.pn-coupon-panel { display: flex; gap: 8px; margin-top: 10px; }
.pn-coupon-panel[hidden] { display: none; }
.pn-coupon-panel input { flex: 1; min-width: 0; text-transform: uppercase; }
.pn-coupon-panel input::placeholder { text-transform: none; }
.pn-coupon-panel .pn-btn { min-height: 48px; padding: 0 18px; }
.pn-coupon-msg { margin: 8px 0 0; font-size: .86rem; font-weight: 600; color: var(--pn-green); }
.pn-coupon-msg.is-error { color: var(--pn-red); }
.pn-coupon-msg[hidden] { display: none; }

.pn-flow .wc-proceed-to-checkout { margin: 18px 0 0; padding: 0; }
.pn-flow .wc-proceed-to-checkout a.checkout-button {
    display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 56px; margin: 0 0 10px; padding: 14px 20px;
    border-radius: 10px; background: var(--pn-blue); color: #fff; font-size: 1.05rem; font-weight: 700; text-decoration: none;
}
.pn-flow .wc-proceed-to-checkout a.checkout-button:hover { background: var(--pn-blue-dark); color: #fff; }

.pn-trust { display: grid; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; font-size: .84rem; color: var(--pn-muted); }
.pn-trust li { display: flex; align-items: center; gap: 8px; line-height: 1.4; }
.pn-trust .pn-icon { color: var(--pn-subtle); flex-shrink: 0; }

.pn-cart-bar { display: none; }

/* Cross-sells */
.pn-cart-extras { margin-top: 48px; }
.pn-cart-extras h2 { margin: 0 0 18px; font-size: 1.3rem; font-weight: 800; }
.pn-cart-extras ul.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin: 0 !important; padding: 0; list-style: none; }
.pn-cart-extras ul.products::before, .pn-cart-extras ul.products::after { display: none !important; }
.pn-cart-extras ul.products li.product { float: none !important; width: auto !important; margin: 0 !important; padding: 0 0 16px; background: #fff; border: 1px solid var(--pn-line); border-radius: 12px; overflow: hidden; text-align: left; }
.pn-cart-extras ul.products li.product img { margin: 0 0 12px !important; aspect-ratio: 1; object-fit: cover; }
.pn-cart-extras ul.products li.product .woocommerce-loop-product__title { padding: 0 14px !important; font-size: .95rem !important; color: var(--pn-ink); }
.pn-cart-extras ul.products li.product .price { display: block; padding: 0 14px; color: var(--pn-ink) !important; font-weight: 700; }
.pn-cart-extras ul.products li.product .button { margin: 10px 14px 0 !important; min-height: 38px; padding: 6px 14px; font-size: .85rem; }

/* Empty basket */
.pn-cart-empty { max-width: 560px; margin: 24px auto 0; padding: 56px 32px; text-align: center; background: #fff; border: 1px solid var(--pn-line); border-radius: 16px; }
.pn-cart-empty-icon { display: grid; place-items: center; width: 76px; height: 76px; margin: 0 auto 18px; border-radius: 50%; background: var(--pn-blue-wash); color: var(--pn-blue); }
.pn-cart-empty h1 { margin: 0 0 10px; font-size: 1.7rem; font-weight: 800; }
.pn-cart-empty p { margin: 0 auto 24px; max-width: 42ch; color: var(--pn-muted); line-height: 1.6; }
.pn-cart-empty-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
.pn-cart-empty .pn-cart-empty-note { margin: 24px 0 0; font-size: .9rem; }
.pn-flow .pn-cart-empty .wc-empty-cart-message::before { display: none; }

/* ─── Checkout ───────────────────────────────────────────────── */
.pn-flow .woocommerce-form-login-toggle .woocommerce-info { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; background: #fff; border-left-color: var(--pn-line-2); }
.pn-flow form.woocommerce-form-login { max-width: 640px; margin: 0 0 24px; padding: 22px; border: 1px solid var(--pn-line); border-radius: 14px; background: #fff; }
.pn-flow form.woocommerce-form-login .form-row { margin: 0 0 14px; padding: 0; }
.pn-flow form.woocommerce-form-login .form-row-first, .pn-flow form.woocommerce-form-login .form-row-last { width: 100%; float: none; }
.pn-flow form.woocommerce-form-login label { display: block; margin-bottom: 6px; font-weight: 600; font-size: .9rem; color: var(--pn-ink); }
.pn-flow form.woocommerce-form-login .woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 8px; margin: 0 16px 0 0; font-weight: 500; }

.pn-co { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 28px; align-items: start; }
.pn-co > .woocommerce-NoticeGroup, .pn-co > .woocommerce-notices-wrapper, .pn-co > .woocommerce-error { grid-column: 1 / -1; }
.pn-co-main { min-width: 0; display: grid; gap: 20px; }
.pn-co-step { padding: 24px 26px 26px; }
.pn-co-step-title { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; font-size: 1.2rem; font-weight: 800; }
.pn-co-num { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--pn-ink); color: #fff; font-size: .9rem; font-weight: 800; letter-spacing: 0; }
.pn-co-sub { margin: 22px 0 12px; font-size: .95rem; font-weight: 700; color: var(--pn-ink); }
.pn-co-billing > .woocommerce-billing-fields > .pn-co-sub:first-child { margin-top: 0; }

/* Fields: two to a row where WooCommerce says first/last */
.pn-flow .pn-co .pn-fields, .pn-flow .pn-co .woocommerce-shipping-fields__field-wrapper, .pn-flow .pn-co .woocommerce-additional-fields__field-wrapper {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 14px;
}
.pn-flow .pn-co .form-row { grid-column: 1 / -1; float: none; width: auto; margin: 0 0 16px; padding: 0; }
.pn-flow .pn-co .form-row-first { grid-column: 1; }
.pn-flow .pn-co .form-row-last { grid-column: 2; }
.pn-flow .pn-co .form-row label { display: block; margin: 0 0 6px; font-size: .88rem; font-weight: 600; line-height: 1.4; color: var(--pn-ink); }
.pn-flow .pn-co .form-row label.checkbox, .pn-flow .pn-co .form-row .woocommerce-form__label-for-checkbox { display: flex; align-items: flex-start; gap: 10px; font-weight: 500; font-size: .93rem; cursor: pointer; }
.pn-flow .pn-co .form-row label.checkbox input { margin-top: 2px; }
.pn-flow .pn-co .form-row .required { color: var(--pn-red); text-decoration: none; border: 0; }
.pn-flow .pn-co .form-row .optional { font-weight: 500; color: var(--pn-subtle); }
.pn-flow .pn-co .form-row .woocommerce-input-wrapper { display: block; }
/* Helper text: always shown under the field (WooCommerce's default is a pop-up) */
.pn-flow .pn-co .form-row .description { display: block !important; position: static !important; margin: 6px 0 0 !important; padding: 0 !important; background: none !important; color: var(--pn-subtle) !important; font-size: .8rem !important; line-height: 1.45; border-radius: 0 !important; box-shadow: none !important; }
.pn-flow .pn-co .form-row .description::before { display: none; }
.pn-flow .pn-co .form-row.woocommerce-invalid input.input-text, .pn-flow .pn-co .form-row.woocommerce-invalid select,
.pn-flow .pn-co .form-row.woocommerce-invalid .select2-selection { border-color: var(--pn-red); }
.pn-flow .pn-co .form-row.woocommerce-invalid label { color: var(--pn-red); }
.pn-flow .pn-co .form-row.woocommerce-validated input.input-text { border-color: var(--pn-line-2); }
.pn-flow .checkout-inline-error-message { margin: 6px 0 0; color: var(--pn-red); font-size: .82rem; font-weight: 600; }

/* Country / county dropdowns (select2) */
.pn-flow .select2-container .select2-selection--single { height: 48px; border: 1px solid var(--pn-line-2); border-radius: 8px; }
.pn-flow .select2-container .select2-selection--single .select2-selection__rendered { line-height: 46px; padding-left: 14px; color: var(--pn-ink); font-size: 16px; }
.pn-flow .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; right: 8px; }
.pn-flow .select2-container--focus .select2-selection--single, .pn-flow .select2-container--open .select2-selection--single { border-color: var(--pn-blue); box-shadow: 0 0 0 3px rgba(47, 118, 175, .18); }
.select2-dropdown { border-color: var(--pn-line-2); border-radius: 8px; overflow: hidden; font-family: var(--pn-font); }
.select2-results__option--highlighted[aria-selected], .select2-results__option--highlighted[data-selected] { background: var(--pn-blue) !important; }

.pn-flow .pn-co .woocommerce-account-fields { margin: 0 0 6px; padding: 14px 16px; border-radius: 10px; background: var(--pn-wash); }
.pn-flow .pn-co .woocommerce-account-fields .form-row { margin-bottom: 0; }
.pn-flow .pn-co .woocommerce-account-fields div.create-account { margin-top: 14px; }
.pn-flow .pn-co .woocommerce-account-fields div.create-account .form-row { margin-bottom: 0; }

.pn-flow #ship-to-different-address { margin: 8px 0 16px; font-size: 1rem; }
.pn-flow #ship-to-different-address label { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: .95rem; cursor: pointer; }
.pn-flow .woocommerce-shipping-fields .shipping_address { padding-top: 4px; }
.pn-flow .woocommerce-additional-fields > h3 { display: none; }
.pn-flow .pn-notes-toggle { display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 0; padding: 4px 0; border: 0; background: none; color: var(--pn-blue); font: inherit; font-size: .92rem; font-weight: 600; cursor: pointer; }
.pn-flow .pn-notes-toggle:hover { text-decoration: underline; }
.pn-js .pn-flow .woocommerce-additional-fields.is-collapsed .woocommerce-additional-fields__field-wrapper { display: none; }

/* Payment */
.pn-flow #payment { background: none; border-radius: 0; }
.pn-flow #payment ul.payment_methods { margin: 0 0 18px; padding: 0; border: 0; list-style: none; }
.pn-flow #payment ul.payment_methods::before, .pn-flow #payment ul.payment_methods::after { display: none; }
.pn-flow #payment ul.payment_methods li.wc_payment_method, .pn-flow #payment ul.payment_methods li.woocommerce-notice {
    margin: 0 0 10px; padding: 0; border: 1px solid var(--pn-line); border-radius: 10px; background: #fff; line-height: 1.5; list-style: none;
}
.pn-flow #payment ul.payment_methods li.wc_payment_method:has(> input:checked) { border-color: var(--pn-blue); box-shadow: inset 0 0 0 1px var(--pn-blue); }
.pn-flow #payment ul.payment_methods li.wc_payment_method > input { position: absolute; margin: 18px 0 0 16px; }
.pn-flow #payment ul.payment_methods li.wc_payment_method > label { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 54px; margin: 0; padding: 14px 16px 14px 46px; font-weight: 700; color: var(--pn-ink); cursor: pointer; }
.pn-flow #payment ul.payment_methods li.wc_payment_method > label img { max-height: 24px; width: auto; margin: 0 0 0 auto; }
.pn-flow #payment ul.payment_methods li.woocommerce-notice { padding: 14px 16px; font-size: .92rem; }
.pn-flow #payment div.payment_box { margin: 0; padding: 4px 16px 16px 46px; background: none; color: var(--pn-muted); font-size: .9rem; border-radius: 0; }
.pn-flow #payment div.payment_box::before { display: none; }
.pn-flow #payment div.payment_box p:last-child { margin-bottom: 0; }
.pn-flow #payment div.payment_box fieldset { margin: 0; padding: 0; border: 0; }
.pn-flow #payment div.form-row.place-order { margin: 0; padding: 0; }
.pn-flow .woocommerce-terms-and-conditions-wrapper { margin: 0 0 16px; font-size: .85rem; color: var(--pn-muted); line-height: 1.55; }
.pn-flow .woocommerce-terms-and-conditions-wrapper .woocommerce-privacy-policy-text p { margin: 0 0 10px; }
.pn-flow .woocommerce-terms-and-conditions-wrapper .form-row { margin: 0; }
.pn-flow .woocommerce-terms-and-conditions { margin: 0 0 12px; padding: 14px; border: 1px solid var(--pn-line); border-radius: 10px; max-height: 240px; overflow: auto; }
.pn-flow .woocommerce-terms-and-conditions-checkbox-text { color: var(--pn-ink); font-weight: 500; }
.pn-flow #place_order {
    float: none; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 58px; margin: 0; padding: 14px 20px;
    border-radius: 10px; background: var(--pn-blue); color: #fff; font-size: 1.08rem; font-weight: 700;
}
.pn-flow #place_order:hover { background: var(--pn-blue-dark); }
.pn-secure-note { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 12px 0 0; font-size: .82rem; color: var(--pn-subtle); text-align: center; }
.pn-co-main > .pn-trust { grid-template-columns: repeat(3, auto); justify-content: center; gap: 8px 24px; margin: 0; }

/* Order summary */
.pn-co-side { position: sticky; top: calc(var(--pn-header-h) + 20px); min-width: 0; }
.pn-co-summary { padding: 22px; }
.pn-co-summary-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 12px; }
.pn-co-summary-head h2 { margin: 0; font-size: 1.15rem; font-weight: 800; }
.pn-co-summary-head a { font-size: .88rem; font-weight: 600; text-decoration: none; }
.pn-co-summary-head a:hover { text-decoration: underline; }
.pn-flow .woocommerce-checkout-review-order { position: relative; }
.pn-flow table.pn-review tbody td { padding: 12px 0; border: 0; border-bottom: 1px solid var(--pn-line); background: none; vertical-align: middle; }
.pn-flow table.pn-review tbody tr:first-child td { padding-top: 4px; }
.pn-flow table.pn-review tbody td.product-total { padding-left: 12px; text-align: right; font-weight: 700; color: var(--pn-ink); white-space: nowrap; }
.pn-flow table.pn-review tfoot tr:first-child th, .pn-flow table.pn-review tfoot tr:first-child td { padding-top: 16px; }
.pn-rv-item { display: flex; align-items: center; gap: 14px; }
.pn-rv-thumb { position: relative; flex-shrink: 0; }
.pn-rv-thumb img { display: block; width: 60px; height: 60px; object-fit: cover; border-radius: 10px; border: 1px solid var(--pn-line); background: var(--pn-wash-2); }
.pn-rv-qty { position: absolute; top: -8px; right: -8px; display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--pn-subtle); color: #fff; font-size: .75rem; font-weight: 700; }
.pn-rv-text { min-width: 0; font-size: .85rem; color: var(--pn-muted); line-height: 1.45; }
.pn-rv-name { display: block; color: var(--pn-ink); font-weight: 700; font-size: .93rem; }
.pn-rv-text .product-quantity { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pn-rv-text dl.variation { display: grid; grid-template-columns: auto 1fr; gap: 0 6px; margin: 2px 0 0; }
.pn-rv-text dl.variation dt, .pn-rv-text dl.variation dd { margin: 0; float: none; }
.pn-rv-text dl.variation dd p { margin: 0; }
.pn-co-freeship:empty { display: none; }
.pn-co-freeship .pn-freeship { margin: 16px 0 0; }
.pn-co-summary .pn-coupon { margin-top: 12px; }

/* WooCommerce's "please wait" overlay */
.pn-flow .blockUI.blockOverlay { background: rgba(255, 255, 255, .7) !important; }

/* Summary rows: label left, amount right, full width (tables squeeze the labels) */
.pn-flow table.pn-totals, .pn-flow table.pn-totals > tbody, .pn-flow table.pn-review > tfoot { display: block; width: 100%; }
.pn-flow table.pn-totals tr, .pn-flow table.pn-review > tfoot > tr { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.pn-flow table.pn-totals tr > th, .pn-flow table.pn-review > tfoot > tr > th { flex: 1; min-width: 0; }
.pn-flow table.pn-totals tr > td, .pn-flow table.pn-review > tfoot > tr > td { flex-shrink: 0; }
.pn-flow table.pn-totals tr.order-total, .pn-flow table.pn-review > tfoot > tr.order-total { align-items: baseline; margin-top: 8px; border-top: 1px solid var(--pn-line); }
.pn-flow table.pn-totals tr.order-total > *, .pn-flow table.pn-review > tfoot > tr.order-total > * { border-top: 0 !important; }
.pn-flow table.pn-review > tfoot > tr.woocommerce-shipping-totals { display: block; }
.pn-flow table.pn-review > tfoot > tr.woocommerce-shipping-totals > td { width: 100%; }
.pn-flow table.pn-review, .pn-flow table.pn-review > tbody { display: block; width: 100%; }
.pn-flow table.pn-review > tbody > tr { display: flex; align-items: center; justify-content: space-between; }
.pn-flow table.pn-review > tbody > tr > td.product-name { flex: 1; min-width: 0; }
.pn-flow table.pn-review > tbody > tr > td { display: block; }
.pn-flow table.pn-review > tbody > tr > td { border: 0 !important; }
.pn-flow table.pn-review > tbody > tr + tr { border-top: 1px solid var(--pn-line); }
.pn-flow table.pn-totals tr > th, .pn-flow table.pn-totals tr > td, .pn-flow table.pn-review > tfoot > tr > th, .pn-flow table.pn-review > tfoot > tr > td { border: 0 !important; }
.pn-flow table.pn-totals tr.pn-delivery-row, .pn-flow table.pn-totals tr.cart-discount + tr:not(.order-total) { border-top: 1px solid var(--pn-line); }
.pn-flow table.pn-review > tfoot { border-top: 1px solid var(--pn-line); }

/* ─── Focused checkout header and footer ─────────────────────── */
.pn-header--focus .pn-header-inner { gap: 16px; }
.pn-header--focus .pn-logo { margin-right: auto; }
.pn-focus-secure { display: inline-flex; align-items: center; gap: 8px; color: var(--pn-green); font-size: .9rem; font-weight: 700; }
.pn-focus-back { display: inline-flex; align-items: center; gap: 8px; margin-left: 20px; padding: 8px 12px; border-radius: 8px; color: var(--pn-ink); font-size: .9rem; font-weight: 600; text-decoration: none; }
.pn-focus-back:hover { background: var(--pn-wash-2); color: var(--pn-ink); }
.pn-footer--focus { background: #fff; }
.pn-footer--focus .pn-footer-bottom-inner { padding-top: 22px; padding-bottom: 26px; }

/* ─── Order confirmation ─────────────────────────────────────── */
.pn-flow--done .pn-container { max-width: 820px; }
.pn-done-hero { padding: 40px 32px 32px; text-align: center; background: #fff; border: 1px solid var(--pn-line); border-radius: 16px; }
.pn-done-icon { display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 18px; border-radius: 50%; background: #dcfce7; color: var(--pn-green); }
.pn-done-hero--failed .pn-done-icon { background: #fee2e2; color: var(--pn-red); }
.pn-done-kicker { margin: 0 0 6px; font-size: .88rem; font-weight: 700; color: var(--pn-green); letter-spacing: .02em; }
.pn-done-hero h1 { margin: 0 0 10px; font-size: clamp(1.6rem, 3.4vw, 2.1rem); font-weight: 800; }
.pn-done-hero .woocommerce-notice { max-width: 52ch; margin: 0 auto; color: var(--pn-muted); line-height: 1.6; border: 0; background: none; padding: 0; }
.pn-done-hero--failed .pn-done-actions { margin-top: 20px; }
.pn-flow ul.pn-done-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; }
.pn-flow ul.pn-done-facts::before, .pn-flow ul.pn-done-facts::after { display: none; }
.pn-flow ul.pn-done-facts li { float: none; margin: 0; padding: 14px 16px; border: 1px solid var(--pn-line) !important; border-radius: 12px; background: #fff; font-size: .8rem; color: var(--pn-subtle); text-transform: none; line-height: 1.4; }
.pn-flow ul.pn-done-facts li strong { display: block; margin-top: 4px; font-size: .98rem; color: var(--pn-ink); overflow-wrap: anywhere; }
.pn-done-next { margin: 16px 0 0; padding: 26px 28px; background: #fff; border: 1px solid var(--pn-line); border-radius: 16px; }
.pn-done-next h2 { margin: 0 0 16px; font-size: 1.15rem; font-weight: 800; }
.pn-done-next ol { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.pn-done-next li { display: flex; gap: 14px; }
.pn-done-next strong { color: var(--pn-ink); }
.pn-done-next p { margin: 2px 0 0; color: var(--pn-muted); font-size: .92rem; line-height: 1.55; }
.pn-done-n { display: grid; place-items: center; flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: var(--pn-blue-wash); color: var(--pn-blue); font-weight: 800; font-size: .85rem; }
.pn-done-note { margin: 16px 0 0; padding: 18px 22px; background: #fff; border: 1px solid var(--pn-line); border-left: 4px solid var(--pn-blue); border-radius: 12px; color: var(--pn-body); }
.pn-done-note > *:first-child { margin-top: 0; }
.pn-done-note > *:last-child { margin-bottom: 0; }
.pn-done-note h2 { font-size: 1.05rem; }
.pn-done-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 24px 0 8px; }
.pn-done .woocommerce-order-details, .pn-done .woocommerce-customer-details { margin: 16px 0 0; padding: 24px 26px; background: #fff; border: 1px solid var(--pn-line); border-radius: 16px; }
.pn-done .woocommerce-order-details__title, .pn-done .woocommerce-column__title { margin: 0 0 14px; font-size: 1.1rem; font-weight: 800; }
.pn-done table.shop_table { width: 100%; margin: 0; border: 0; border-radius: 0; border-collapse: collapse; }
.pn-done table.shop_table th, .pn-done table.shop_table td { padding: 10px 0; border: 0; border-bottom: 1px solid var(--pn-line); background: none; text-align: left; font-size: .93rem; }
.pn-done table.shop_table td:last-child, .pn-done table.shop_table th:last-child { text-align: right; }
.pn-done table.shop_table thead { display: none; }
.pn-done table.shop_table tfoot tr:last-child th, .pn-done table.shop_table tfoot tr:last-child td { border-bottom: 0; font-size: 1.05rem; font-weight: 800; color: var(--pn-ink); }
.pn-done .wc-item-meta { margin: 4px 0 0; padding: 0; list-style: none; font-size: .85rem; color: var(--pn-muted); }
.pn-done .wc-item-meta li { display: flex; gap: 6px; }
.pn-done .wc-item-meta p { margin: 0; }
.pn-done .woocommerce-customer-details .woocommerce-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; }
.pn-done .woocommerce-customer-details .woocommerce-column { float: none; width: auto; }
.pn-done .woocommerce-customer-details address { padding: 0; border: 0; font-style: normal; line-height: 1.6; color: var(--pn-body); }
.pn-done .woocommerce-customer-details address p { margin: 6px 0 0; }

/* ─── Tablet and phone ───────────────────────────────────────── */
@media (max-width: 980px) {
    .pn-cart, .pn-co { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .pn-cart-side { position: static; }
    .pn-cart-extras ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    /* Order summary moves to the top and stays OPEN.
       It used to fold behind a "Show order summary" button, which hid the
       delivery method, the discount field and the total — three things the
       customer acts on, not just reads. The heading is visible again too: it
       was hidden because the toggle already said "order summary", and with
       the toggle gone the panel would otherwise be unlabelled. */
    .pn-co-side { position: static; order: -1; }
    .pn-co > .woocommerce-NoticeGroup, .pn-co > .woocommerce-notices-wrapper, .pn-co > .woocommerce-error { order: -2; }
    .pn-co-main > .pn-trust { grid-template-columns: 1fr; justify-content: start; }
}

@media (max-width: 768px) {
    .pn-flow { padding: 18px 0 56px; }
    .pn-flow-head { margin-bottom: 18px; gap: 12px; }
    .pn-steps { width: 100%; font-size: .8rem; }
    .pn-steps li + li::before { flex: 1; width: auto; min-width: 12px; margin: 0 8px; }
    .pn-steps li:not(.is-current) > span:not(.pn-step-dot), .pn-steps li:not(.is-current) > a { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .pn-steps li:not(:first-child) { flex: 1; }

    .pn-cart-items { padding: 0 16px; }
    .pn-cart-item { grid-template-columns: 84px minmax(0, 1fr); gap: 14px; padding: 18px 0; }
    .pn-ci-img img { width: 84px; height: 84px; }
    .pn-ci-top { flex-direction: column; gap: 6px; }
    .pn-ci-total { text-align: left; }
    .pn-summary { padding: 18px 16px; }
    .pn-cart-actions { flex-wrap: wrap; }

    /* Checkout button stays in reach while scrolling the basket */
    .pn-cart-bar {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; display: flex; align-items: center; justify-content: space-between; gap: 16px;
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--pn-line);
        box-shadow: 0 -8px 24px rgba(15, 23, 42, .08); transform: translateY(0); transition: transform .25s ease;
    }
    .pn-cart-bar.is-hidden { transform: translateY(110%); }
    .pn-cart-bar-total { display: flex; flex-direction: column; line-height: 1.2; }
    .pn-cart-bar-total span { font-size: .78rem; color: var(--pn-subtle); }
    .pn-cart-bar-total strong { font-size: 1.15rem; color: var(--pn-ink); }
    .pn-cart-bar-total small { display: none; }
    .pn-cart-bar .pn-btn { flex: 1; max-width: 220px; min-height: 48px; }
    .pn-flow--cart { padding-bottom: 110px; }

    .pn-co-step { padding: 20px 16px 22px; border-radius: 12px; }
    .pn-co-step-title { font-size: 1.1rem; margin-bottom: 16px; }
    .pn-flow .pn-co .pn-fields, .pn-flow .pn-co .woocommerce-shipping-fields__field-wrapper { column-gap: 10px; }
    .pn-co-summary { padding: 18px 16px; }
    .pn-focus-secure span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .pn-focus-back { margin-left: 4px; }

    .pn-done-hero { padding: 32px 20px 26px; }
    .pn-done-next, .pn-done .woocommerce-order-details, .pn-done .woocommerce-customer-details { padding: 20px 18px; }
    .pn-cart-empty { padding: 40px 20px; }
}

@media (max-width: 420px) {
    .pn-flow .pn-co .form-row-first, .pn-flow .pn-co .form-row-last { grid-column: 1 / -1; }
    .pn-cart-extras ul.products { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
}

/* ── Delivery choice ──────────────────────────────────────────────────────
   Never a dropdown. A <select> shows only the CURRENT value, so on a phone
   the customer saw one collapsed line and had to tap it open to find out
   whether they were getting delivery or collection — after typing a full
   delivery address. Radios show every option and the active one at a glance. */
.pn-flow tr.woocommerce-shipping-totals select,
.pn-flow .woocommerce-shipping-methods select,
.pn-flow #shipping_method select { display: none !important; }

.pn-flow ul#shipping_method li label { flex: 1; cursor: pointer; margin: 0; }
.pn-flow ul#shipping_method li input[type="radio"] { width: 18px; height: 18px; accent-color: var(--pn-blue); }

/* The pickup caveat, so choosing collection is never a surprise. */
.pn-flow .pn-ship-note {
    display: block;
    width: 100%;
    margin: 4px 0 0 28px;
    font-size: .78rem;
    font-weight: 500;
    color: #6b7c8a;
}

/* On a phone the options stack with room to tap — 44px minimum target. */
@media (max-width: 782px) {
    .pn-flow ul#shipping_method li { min-height: 48px; padding: 12px; }
}

/* Prompt shown while no delivery method is chosen. Nothing is preselected on
   purpose — an auto-picked method reads as a decision the customer never
   made, and that is how people ended up on collection by accident. */
.pn-flow tr.pn-ship-prompt td {
    padding: 10px 12px;
    border: 1px dashed var(--pn-blue);
    border-radius: 10px;
    background: var(--pn-blue-wash);
    color: var(--pn-blue-dark);
    font-size: .88rem;
    font-weight: 600;
}

/* ── Delivery choice: its own step in the main column ─────────────────────
   Moved out of the order summary because that panel is COLLAPSED on phones,
   so the radios were invisible until the customer tapped it open. A recap can
   be hidden; a decision cannot. */
.pn-co-step--delivery .pn-ship-prompt-inline {
    margin: 0 0 10px;
    font-size: .9rem;
    font-weight: 600;
    color: var(--pn-blue-dark);
}

.pn-ship-list { margin: 0; padding: 0; list-style: none; }

.pn-ship-opt {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 10px;
    padding: 14px;
    border: 1.5px solid var(--pn-line);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s, background .15s;
}
.pn-ship-opt:hover { border-color: var(--pn-blue); }
.pn-ship-opt.is-chosen,
.pn-ship-opt:has(input:checked) {
    border-color: var(--pn-blue);
    background: var(--pn-blue-wash);
    box-shadow: inset 0 0 0 1px var(--pn-blue);
}

.pn-ship-opt input[type="radio"] {
    width: 20px;
    height: 20px;
    margin: 1px 0 0;
    flex-shrink: 0;
    accent-color: var(--pn-blue);
}
.pn-ship-opt label { flex: 1; min-width: 0; margin: 0; cursor: pointer; }

.pn-ship-main { display: flex; align-items: baseline; gap: 12px; }
.pn-ship-main .pn-ship-name { flex: 1; min-width: 0; font-weight: 600; }
.pn-ship-main .pn-ship-cost { flex-shrink: 0; font-weight: 700; }

.pn-ship-note {
    display: block;
    margin-top: 3px;
    font-size: .8rem;
    font-weight: 500;
    color: #6b7c8a;
}

.pn-ship-none {
    padding: 12px 14px;
    border: 1px solid var(--pn-line);
    border-radius: 10px;
    background: #fff;
    font-size: .9rem;
}

/* Summary recap — read-only, links back up to the real choice. */
.pn-ship-chosen { display: block; font-size: .85rem; color: #6b7c8a; }
.pn-ship-choose-link { font-size: .85rem; }

@media (max-width: 782px) {
    /* Comfortable tap targets; these are the whole decision on a phone. */
    .pn-ship-opt { padding: 15px 14px; }
}

/* Shown in the delivery step before an address has been entered. The step is
   always in the DOM so its AJAX fragment has something to replace — it just
   has nothing to offer yet. */
.pn-ship-await {
    margin: 0;
    padding: 12px 14px;
    border: 1px dashed var(--pn-line);
    border-radius: 10px;
    background: #fff;
    color: #6b7c8a;
    font-size: .88rem;
}

/* Delivery-date estimates and anything else hooked onto woocommerce_after_shipping_rate
   sit on their own line under the option, lined up with its label. */
.pn-flow .pn-ship-opt { flex-wrap: wrap; }
.pn-flow .pn-ship-opt > .delivery-estimate,
.pn-flow .pn-ship-opt > .woocommerce-shipping-method-description,
.pn-flow .pn-ship-opt > p:not([class]) {
    flex: 0 0 100%; width: 100%; margin: 6px 0 0 30px !important; font-size: .85rem; line-height: 1.5; color: var(--pn-muted) !important;
}
.pn-flow .pn-ship-opt > .delivery-estimate strong { color: var(--pn-ink); }
.pn-flow .pn-ship-opt > .delivery-estimate small { color: var(--pn-subtle) !important; }