/**
 * Shop — WooCommerce in the Home 4 design.
 *
 * Shop and category grids, single product, and the block-based Cart and
 * Checkout pages. Loaded on WooCommerce pages only (inc/shop.php).
 */

.woocommerce .page-content,.woocommerce-page .page-content{padding:48px 0 88px}

/* ---------- Toolbar and notices ---------- */
.woocommerce .woocommerce-result-count{margin:0 0 24px;font-size:.9rem;color:var(--muted)}
.woocommerce .woocommerce-ordering{margin:0 0 24px}
.woocommerce .woocommerce-ordering select{height:44px;padding:0 38px 0 14px;border:1px solid #cfdcee;border-radius:10px;background-color:#fff;font:600 .9rem var(--body);color:var(--ink)}
.woocommerce-notices-wrapper .woocommerce-message,.woocommerce-notices-wrapper .woocommerce-info,.woocommerce-notices-wrapper .woocommerce-error{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0 0 24px;padding:14px 18px;border:1px solid #bfe6cd;border-left:4px solid #16A34A;border-radius:12px;background:#f0faf4;color:#14532d}
.woocommerce-notices-wrapper .woocommerce-message:before,.woocommerce-notices-wrapper .woocommerce-info:before{display:none}
.woocommerce-notices-wrapper .woocommerce-message .button{order:2;margin-left:auto}

/* Product grid and cards: assets/css/home4-shop-cards.css */

/* ---------- Single product ---------- */
.woocommerce div.product{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:24px 56px;align-items:start}
.woocommerce div.product>*{grid-column:1/-1}
.woocommerce div.product div.images,.woocommerce div.product div.summary{float:none!important;width:auto!important;margin:0!important}
/* Not sticky: a pinned gallery slid over the Description tabs below it. */
.woocommerce div.product div.images{grid-column:1;position:relative;opacity:1!important}
.woocommerce div.product div.summary{grid-column:2}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper{overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:18px}
.woocommerce div.product div.images img{width:100%;height:auto}
.woocommerce div.product div.images .flex-control-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.woocommerce div.product div.images .flex-control-thumbs li{width:auto!important}
.woocommerce div.product div.images .flex-control-thumbs img{border:1px solid var(--line);border-radius:10px;opacity:.7}
.woocommerce div.product div.images .flex-control-thumbs img.flex-active,.woocommerce div.product div.images .flex-control-thumbs img:hover{opacity:1;border-color:var(--blue)}
.woocommerce div.product .woocommerce-product-gallery__trigger{top:14px!important;right:14px!important;border-radius:50%;background:#fff;box-shadow:0 6px 16px rgba(4,16,35,.15)}

.woocommerce div.product div.summary{padding:32px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 60px rgba(4,16,35,.07)}
.woocommerce div.product .product_title{margin:0 0 10px;font:800 clamp(1.8rem,3vw,2.6rem)/1.05 var(--km-display);letter-spacing:-.04em;color:var(--ink)}
.woocommerce div.product p.price,.woocommerce div.product span.price{margin:0 0 18px;font:800 1.8rem var(--km-display)!important;color:var(--red)!important}
.woocommerce div.product .woocommerce-product-details__short-description{margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid var(--line);font-size:1.02rem;line-height:1.7;color:#3e4654}
.woocommerce div.product form.cart{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 22px!important}
.woocommerce div.product form.cart:before,.woocommerce div.product form.cart:after{display:none}
.woocommerce div.product form.cart .quantity{float:none!important;margin:0!important}
.woocommerce .quantity .qty{width:84px;height:54px;border:1px solid #cfdcee;border-radius:10px;background:#f8fafd;font:800 1.05rem var(--km-display);color:var(--ink);text-align:center}
.woocommerce div.product form.cart .single_add_to_cart_button{float:none!important;flex:1;min-height:54px;padding:0 24px!important;border-radius:10px!important;background:var(--red)!important;color:#fff!important;font:800 .86rem var(--body)!important;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 14px 30px rgba(205,46,58,.28);transition:background-color .2s,transform .2s}
.woocommerce div.product form.cart .single_add_to_cart_button:hover{background:#e53b48!important;transform:translateY(-2px)}
.woocommerce div.product .product_meta{display:grid;gap:6px;padding-top:18px;border-top:1px solid var(--line);font-size:.86rem;color:var(--muted)}
.woocommerce div.product .product_meta a{font-weight:700;color:var(--blue)}
.km-product-perks{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 22px;padding:0;list-style:none}
.km-product-perks li{padding:12px;background:#f4f8fd;border-radius:10px;font-size:.78rem;font-weight:700;line-height:1.35;text-align:center;color:var(--ink)}
.km-product-perks b{display:block;font-size:1.1rem;color:var(--blue)}

.woocommerce div.product .woocommerce-tabs{margin-top:8px;padding:28px 32px;background:#fff;border:1px solid var(--line);border-radius:18px}
.woocommerce div.product .woocommerce-tabs ul.tabs{display:flex;gap:6px;margin:0 0 22px!important;padding:0!important;border-bottom:1px solid var(--line)}
.woocommerce div.product .woocommerce-tabs ul.tabs:before{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li{margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li:before,.woocommerce div.product .woocommerce-tabs ul.tabs li:after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{display:block;padding:12px 16px!important;border-bottom:3px solid transparent;font:800 .82rem var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{border-color:var(--red);color:var(--ink)!important}
.woocommerce div.product .woocommerce-tabs .panel{margin:0;line-height:1.75;color:#3e4654}
.woocommerce div.product .woocommerce-tabs .panel h2{font:800 1.3rem var(--km-display)}
.woocommerce div.product .related.products{margin-top:40px}
.woocommerce div.product .related.products>h2{margin:0 0 22px;font:800 clamp(1.8rem,3vw,2.4rem)/1 var(--km-display);letter-spacing:-.04em}

/* ---------- Cart and Checkout blocks ---------- */
.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout{font-family:var(--body);color:var(--ink)}

/* Coupon form: input and Apply on one line at the same height. The general
   block-button rule further down made Apply a tall red checkout button whose
   disabled text was unreadable; these selectors are more specific. */
.wc-block-components-totals-coupon__form{display:flex!important;align-items:stretch!important;gap:8px!important}
.wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__input{flex:1;margin:0!important}
/* The input keeps WooCommerce's own height and padding: its "Enter code" label
   floats up into that top padding once you type, so removing it overlapped them. */
.wc-block-components-totals-coupon__form .wc-block-components-button.wc-block-components-totals-coupon__button{flex:none;align-self:stretch;height:auto!important;min-height:50px!important;padding:0 20px!important;border:0!important;border-radius:10px!important;background:var(--ink)!important;color:#fff!important;font:800 .78rem/1 var(--body)!important;letter-spacing:.08em;box-shadow:none!important;transform:none!important;opacity:1!important}
.wc-block-components-totals-coupon__form .wc-block-components-button.wc-block-components-totals-coupon__button:hover:not([disabled]){background:var(--blue)!important}
.wc-block-components-totals-coupon__form .wc-block-components-button.wc-block-components-totals-coupon__button[disabled],.wc-block-components-totals-coupon__form .wc-block-components-button.wc-block-components-totals-coupon__button[aria-disabled="true"]{background:#e8edf4!important;color:#7a8494!important;cursor:not-allowed}
.wc-block-components-totals-coupon__form .wc-block-components-button.wc-block-components-totals-coupon__button .wc-block-components-button__text{color:inherit!important;opacity:1!important}
.wc-block-cart .wc-block-cart-items,.wc-block-checkout__form,.wc-block-components-sidebar .wp-block-woocommerce-cart-order-summary-block,.wc-block-components-sidebar .wp-block-woocommerce-checkout-order-summary-block{background:#fff;border:1px solid var(--line)!important;border-radius:18px!important}
.wc-block-cart .wc-block-cart-items{border-collapse:separate;overflow:hidden}
.wc-block-cart .wc-block-cart-items th{padding:18px 22px!important;font:800 .68rem var(--body)!important;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.wc-block-cart .wc-block-cart-items td{padding:22px!important;border-top:1px solid var(--line)!important}
.wc-block-cart-item__image img{border-radius:12px;background:#f3f4f6}
.wc-block-components-product-name{font:800 1.05rem/1.3 var(--km-display)!important;color:var(--ink)!important;text-decoration:none!important}
.wc-block-components-product-price,.wc-block-cart-item__total .wc-block-components-product-price__value{font-weight:800;color:var(--red)}
.wc-block-components-quantity-selector{border-radius:10px!important;overflow:hidden}
.wc-block-components-quantity-selector:after{border-color:#cfdcee!important;border-radius:10px!important}
.wc-block-cart-item__remove-link{font-size:.8rem!important;font-weight:700;color:var(--muted)!important}
.wc-block-components-sidebar .wp-block-woocommerce-cart-order-summary-block,.wc-block-components-sidebar .wp-block-woocommerce-checkout-order-summary-block{padding:24px}
.wc-block-components-totals-item__label,.wc-block-components-totals-item__value{font-weight:600}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{font:800 1.3rem var(--km-display)!important}
.wc-block-components-button:not(.is-link),.wc-block-cart__submit-button,.wc-block-components-checkout-place-order-button{min-height:56px!important;border:0!important;border-radius:12px!important;background:var(--red)!important;color:#fff!important;font:800 .9rem var(--body)!important;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 14px 30px rgba(205,46,58,.28);transition:background-color .2s,transform .2s}
.wc-block-components-button:not(.is-link):hover{background:#e53b48!important;transform:translateY(-2px)}
.wc-block-checkout__form{padding:28px 32px}
.wc-block-components-checkout-step__title,.wc-block-components-title{font:800 1.3rem var(--km-display)!important;letter-spacing:-.02em;color:var(--ink)}
.wc-block-components-checkout-step__heading-content{color:var(--muted)}
.wc-block-components-checkout-step{padding-bottom:24px!important;border-bottom:1px solid var(--line)}
.wc-block-components-text-input input,.wc-block-components-combobox .wc-block-components-combobox-control input,.wc-blocks-components-select .wc-blocks-components-select__select,.wc-block-components-textarea{border:1px solid #cfdcee!important;border-radius:10px!important;background:#f8fafd!important;color:var(--ink)!important}
.wc-block-components-text-input.is-active input,.wc-block-components-text-input input:focus{background:#fff!important;border-color:var(--blue)!important;box-shadow:0 0 0 3px rgba(0,71,160,.13)!important}
.wc-block-components-radio-control__option,.wc-block-components-radio-control-accordion-option{border-radius:12px!important}
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,.wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted{box-shadow:inset 0 0 0 2px var(--blue)!important}
.wc-block-components-radio-control__input:checked:before{background:var(--blue)!important}
.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked{background:var(--blue)!important;border-color:var(--blue)!important}
.wc-block-components-notice-banner{border-radius:12px!important}
.wc-block-cart__empty-cart__title{font:800 2rem var(--km-display)!important}
.wc-block-components-order-summary-item__image img{border-radius:10px}

@media(max-width:900px){
	.woocommerce div.product{grid-template-columns:1fr;gap:24px}
	.woocommerce div.product div.images,.woocommerce div.product div.summary{grid-column:1;position:static}
}
@media(max-width:760px){
	.woocommerce ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
	.woocommerce ul.products li.product .woocommerce-loop-product__title{padding:0 12px!important;font-size:.9rem!important}
	.woocommerce ul.products li.product .price{padding:0 12px}
	.woocommerce ul.products li.product .button{margin:auto 12px 0!important;font-size:.66rem!important}
	.woocommerce div.product div.summary{padding:22px}
	.woocommerce div.product .woocommerce-tabs{padding:20px}
	.km-product-perks{grid-template-columns:1fr}
	.wc-block-checkout__form{padding:20px}
}
@media(prefers-reduced-motion:reduce){
	.woocommerce ul.products li.product:hover,.woocommerce ul.products li.product:hover a img{transform:none}
}

/* ---------- Cart and checkout: the sticky order summary ----------
   The summary sticks as you scroll, but it stuck to the top of the viewport —
   behind the pinned masthead, which hid its top edge (16px of the card, and the
   start of its heading). --h4-pinned is the header's height once the page has
   scrolled (79px, or 111px with the WordPress admin bar), the same variable the
   shop filters, My account nav and event booking panel already stick to. */
.wc-block-components-sidebar{position:sticky;top:calc(var(--h4-pinned,79px) + 20px);align-self:start}

/* Below WooCommerce's own layout breakpoint the summary stacks above the form
   and does not stick. WooCommerce keeps position:sticky there with top:auto, so
   this restates it at the same specificity to keep the intent explicit. */
@media(max-width:980px){
	.wc-block-components-sidebar.wc-block-components-sidebar{position:static;top:auto}
}