/* ================= SHOP ALL, FILTERS, CART, CHECKOUT, ORDER DIALOGS ================= */

.site-main--shop, .site-main--commerce { max-width: 1320px; padding: 2rem 1.5rem 4rem; }
.page-title, .shop-head__title { font-family: 'Playfair Display', serif; font-size: 2.2rem; text-align: center; margin: 0 0 0.5rem; }
html[lang^="ar"] .page-title, html[lang^="ar"] .shop-head__title { font-family: 'Cairo', sans-serif; }

/* ---------- buttons ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 1.6rem;
	border-radius: 30px; border: 1px solid #111; font: inherit; font-weight: 500; font-size: 0.95rem; cursor: pointer; text-decoration: none;
}
.btn--primary { background: #111; color: #fff; }
.btn--primary:hover { background: #333; }
.btn--ghost { background: #fff; color: #111; }
.btn--ghost:hover { background: #f1f1f1; }
.btn:focus-visible { outline: 2px solid #111; outline-offset: 3px; }

/* ---------- shop head / toolbar ---------- */
.shop-head { margin-bottom: 1.25rem; }
.shop-head__count { text-align: center; color: #6b6b6b; margin: 0; }
/* Toolbar: Filters button + Sort by. Items wrap onto their own row only when they genuinely do not fit (flex-basis below), never overflow. */
.shop-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.6rem 1rem; margin-bottom: 1rem; }
.shop-sort { display: flex; flex: 0 1 auto; align-items: center; gap: 0.6rem; min-width: 0; font-size: 0.9rem; margin-inline-start: auto; }
.shop-sort > span { flex: none; white-space: nowrap; }
.shop-sort select { min-height: 44px; border: 1px solid #bbb; border-radius: 30px; padding: 0 1rem; font: inherit; background: #fff; }
.filter-toggle { display: none; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1.2rem; border-radius: 30px; border: 1px solid #111; background: #fff; font: inherit; font-weight: 500; cursor: pointer; }
.filter-toggle__count, .chip--count { background: #111; color: #fff; border-radius: 12px; min-width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; font-size: 0.75rem; padding: 0 6px; }

.active-filters { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.25rem; }
.chip { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 36px; padding: 0 0.9rem; border-radius: 20px; background: #f4f1ec; color: #111; text-decoration: none; font-size: 0.85rem; }
.chip:hover { background: #e8e3da; }
.chip--reset { background: #111; color: #fff; }
.chip--reset:hover { background: #333; }

/* ---------- layout ---------- */
.shop-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.shop-filters { position: sticky; top: var(--sticky-top, 6rem); max-height: calc(100vh - var(--sticky-top, 6rem) - 1rem); overflow-y: auto; padding-inline-end: 0.5rem; }
.filter-form__head { display: none; }
.filter-group { border: 0; padding: 0 0 1.25rem; margin: 0 0 1.25rem; border-bottom: 1px solid #eee; min-width: 0; }
.filter-group legend { font-weight: 500; margin-bottom: 0.75rem; padding: 0; font-size: 1rem; }
.check { display: flex; align-items: center; gap: 0.7rem; min-height: 40px; cursor: pointer; font-size: 0.95rem; }
.check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.check__box { width: 22px; height: 22px; border: 1.5px solid #888; border-radius: 6px; flex: 0 0 auto; position: relative; background: #fff; }
.check input:checked + .check__box { background: #111; border-color: #111; }
.check input:checked + .check__box::after { content: ''; position: absolute; inset-inline-start: 6px; top: 2px; width: 6px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.check input:focus-visible + .check__box, .pill input:focus-visible + span { outline: 2px solid #0b57d0; outline-offset: 2px; }
.color-opt input:focus-visible + .color-opt__dot { outline: 2px solid #0b57d0; outline-offset: 4px; }
.pill-group, .color-group { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pill { cursor: pointer; }
.pill input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pill span { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; min-height: 42px; padding: 0 0.9rem; border: 1px solid #bbb; border-radius: 30px; font-size: 0.9rem; background: #fff; }
.pill input:checked + span { background: #111; color: #fff; border-color: #111; }
.color-opt { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; width: 58px; cursor: pointer; font-size: 0.72rem; text-align: center; }
.color-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.color-opt__dot { width: 34px; height: 34px; border-radius: 50%; background: var(--swatch, #ccc); box-shadow: inset 0 0 0 1px rgba(0,0,0,0.12); }
.color-opt input:checked + .color-opt__dot { box-shadow: inset 0 0 0 1px rgba(0,0,0,0.12), 0 0 0 2px #fff, 0 0 0 3.5px #111; }
.color-opt input:checked ~ .color-opt__name { font-weight: 600; }
.price-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.price-inputs label { display: grid; gap: 0.3rem; font-size: 0.85rem; color: #6b6b6b; }
.price-inputs input { min-height: 44px; border: 1px solid #bbb; border-radius: 12px; padding: 0 0.75rem; font: inherit; width: 100%; background: #fff; }
.filter-form__actions { display: grid; gap: 0.6rem; }
@media (min-width: 901px) { .filter-form__actions .btn--primary { display: none; } } /* desktop auto-applies */

.empty-state { text-align: center; padding: 3rem 1rem; background: #f4f1ec; border-radius: 24px; }
.empty-state h2 { margin: 0 0 0.5rem; font-size: 1.4rem; }
.empty-state p { color: #6b6b6b; margin: 0 0 1.5rem; }


/* shop grid: 4 columns beside the filters */
.shop-results ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199px) { .shop-results ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- filters become a slide-in panel on tablet / phone ---------- */
@media (max-width: 900px) {
	.shop-layout { grid-template-columns: minmax(0, 1fr); }
	.filter-toggle { display: inline-flex; }
	.shop-results ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; }
	.shop-filters {
		position: fixed; top: 0; bottom: 0; inset-inline-start: 0; z-index: 1101; width: min(380px, 90vw); max-height: none;
		background: #fff; padding: 0; overflow-y: auto; transform: translateX(-100%); visibility: hidden;
		transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), visibility 0s linear 0.3s; box-shadow: 10px 0 40px rgba(0,0,0,0.2);
	}
	[dir="rtl"] .shop-filters { transform: translateX(100%); box-shadow: -10px 0 40px rgba(0,0,0,0.2); }
	.shop-filters.is-open { transform: none; visibility: visible; transition-delay: 0s; }
	body.admin-bar .shop-filters { top: 32px; }
	.filter-form { display: flex; flex-direction: column; min-height: 100%; }
	.filter-form__head { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1.25rem; border-bottom: 1px solid #eee; position: sticky; top: 0; background: #fff; z-index: 2; }
	.filter-form__head h2 { margin: 0; font-size: 1.2rem; }
	.filter-group { padding-inline: 1.25rem; }
	.filter-form__actions { margin-top: auto; position: sticky; bottom: 0; background: #fff; padding: 1rem 1.25rem calc(1rem + env(safe-area-inset-bottom)); border-top: 1px solid #eee; }
	.filter-backdrop { z-index: 1100; }
}

/* ---------- cart ---------- */
.woocommerce-cart .woocommerce { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); gap: 2rem; align-items: start; }
.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.woocommerce-cart .woocommerce-cart-form { min-width: 0; }
.woocommerce-cart table.shop_table { border: 0; border-collapse: collapse; width: 100%; }
.woocommerce-cart table.shop_table th { text-align: start; font-weight: 500; color: #6b6b6b; border: 0; border-bottom: 1px solid #eee; padding: 0.75rem 0.5rem; }
.woocommerce-cart table.cart td { border: 0; border-bottom: 1px solid #eee; padding: 1rem 0.5rem; vertical-align: middle; text-align: start; }
.woocommerce-cart table.cart img { width: 84px; border-radius: 14px; background: #f4f1ec; object-fit: contain; display: block; }
.woocommerce-cart table.cart td.product-name a { color: #111; font-weight: 500; text-decoration: none; }
.woocommerce-cart table.cart td.product-name dl.variation { margin: 0.4rem 0 0; font-size: 0.85rem; color: #6b6b6b; display: grid; grid-template-columns: auto 1fr; gap: 0.15rem 0.5rem; }
.woocommerce-cart table.cart td.product-name dl.variation dt, .woocommerce-cart table.cart td.product-name dl.variation dd, .woocommerce-cart table.cart td.product-name dl.variation p { margin: 0; }
.woocommerce-cart table.cart td.product-remove a.remove { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: #f4f1ec; color: #111 !important; font-size: 1.4rem; text-decoration: none; }
.woocommerce-cart table.cart td.product-remove a.remove:hover { background: #c8102e; color: #fff !important; }
.woocommerce-cart table.cart td.product-subtotal { font-weight: 600; }
.woocommerce-cart .quantity { display: inline-flex; align-items: stretch; border: 1px solid #bbb; border-radius: 30px; overflow: hidden; }
.woocommerce-cart td.actions { padding-top: 1.25rem; }
/* coupon: one joined pill (ticket icon, code box, black Apply button) that lights up while typing */
.woocommerce-cart td.actions .coupon { display: flex; flex-wrap: nowrap; align-items: stretch; gap: 0; float: none; width: 100%; max-width: 430px; background: #fff; border: 1.5px solid #111; border-radius: 999px; overflow: hidden; transition: box-shadow 0.2s ease, border-color 0.2s ease; }
.woocommerce-cart td.actions .coupon:focus-within { box-shadow: 0 0 0 4px rgba(17, 17, 17, 0.12); }
.woocommerce-cart td.actions .coupon label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.woocommerce-cart td.actions .coupon input.input-text { flex: 1 1 auto; min-width: 0; width: auto; min-height: 50px; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; outline: 0 !important; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9a2 2 0 0 0 0 6v2a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1v-2a2 2 0 0 1 0-6V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1z'/%3E%3Cpath d='M13 6v12' stroke-dasharray='2 2'/%3E%3C/svg%3E") no-repeat 1rem center / 20px; padding: 0 1rem !important; padding-inline-start: 3rem !important; font: inherit; letter-spacing: 0.03em; }
[dir="rtl"] .woocommerce-cart td.actions .coupon input.input-text { background-position: right 1rem center !important; }
.woocommerce-cart td.actions .coupon input.input-text::placeholder { color: #8a8a8a; letter-spacing: 0; }
.woocommerce-cart td.actions .coupon .button { flex: 0 0 auto; min-height: 50px; margin: 0; border: 0; border-radius: 0; background: #111; color: #fff; padding: 0 1.6rem; font: inherit; font-weight: 500; cursor: pointer; float: none; transition: background 0.2s ease; }
.woocommerce-cart td.actions .coupon .button { white-space: nowrap; background-image: linear-gradient(#3a3a3a, #3a3a3a); background-repeat: no-repeat; background-position: left center; background-size: 0% 100%; transition: background-size 0.35s ease; }
[dir="rtl"] .woocommerce-cart td.actions .coupon .button { background-position: right center; }
.woocommerce-cart td.actions .coupon .button:hover, .woocommerce-cart td.actions .coupon .button:focus-visible { background-size: 100% 100%; transform: none !important; box-shadow: none !important; }
.woocommerce-cart td.actions .coupon .button:active { transform: none !important; filter: brightness(1.15); }
/* focus: the pill breathes once (a ring spreads out), then keeps a steady glow; the ticket icon grows a little */
@keyframes sx-coupon-ring { 0% { box-shadow: 0 0 0 0 rgba(17, 17, 17, 0.35); } 100% { box-shadow: 0 0 0 7px rgba(17, 17, 17, 0); } }
.woocommerce-cart td.actions .coupon input.input-text { transition: background-size 0.25s ease; }
.woocommerce-cart td.actions .coupon:focus-within { animation: sx-coupon-ring 0.7s ease-out 1; }
.woocommerce-cart td.actions .coupon:focus-within input.input-text { background-size: 23px; }
@media (prefers-reduced-motion: reduce) { .woocommerce-cart td.actions .coupon:focus-within { animation: none; } .woocommerce-cart td.actions .coupon .button { transition: none; } }
@media (max-width: 480px) {
	.woocommerce-cart td.actions .coupon input.input-text { padding-inline-start: 2.5rem !important; padding-inline-end: 0.4rem !important; background-position: 0.8rem center; font-size: 0.95rem; }
	[dir="rtl"] .woocommerce-cart td.actions .coupon input.input-text { background-position: right 0.8rem center !important; }
	.woocommerce-cart td.actions .coupon .button { padding: 0 1rem; font-size: 0.95rem; }
}
.woocommerce-cart td.actions button[name="update_cart"], .woocommerce-cart td.actions .button[name="update_cart"] { display: none !important; } /* quantities recalculate automatically */

.woocommerce-cart .cart-collaterals { width: 100%; float: none; }
.woocommerce-cart .cart-collaterals .cart_totals { float: none !important; width: 100% !important; background: #f4f1ec; border-radius: 24px; padding: 1.5rem; position: sticky; top: var(--sticky-top, 6rem); }
.woocommerce-shipping-destination, .woocommerce-shipping-calculator { display: none; }
.woocommerce-cart .cart_totals h2 { margin: 0 0 1rem; font-size: 1.3rem; }
.woocommerce-cart .cart_totals table { border: 0; width: 100%; border-collapse: collapse; }
.woocommerce-cart .cart_totals th, .woocommerce-cart .cart_totals td { border: 0; border-bottom: 1px solid rgba(0,0,0,0.08); padding: 0.8rem 0; text-align: start; background: none; vertical-align: top; }
.woocommerce-cart .cart_totals td { text-align: end; }
.woocommerce-cart .cart_totals tr.order-total th, .woocommerce-cart .cart_totals tr.order-total td { font-size: 1.15rem; font-weight: 600; border-bottom: 0; }
.woocommerce-cart .cart_totals ul#shipping_method { list-style: none; margin: 0; padding: 0; }
.woocommerce-cart .cart_totals tr.shynx-delivery td { color: #444; font-size: 0.9rem; text-align: end; }
.woocommerce-cart .wc-proceed-to-checkout { padding: 1rem 0 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { display: flex; align-items: center; justify-content: center; min-height: 54px; border-radius: 30px; background: #111; color: #fff; font-weight: 500; font-size: 1.05rem; margin: 0; padding: 0 1.5rem; text-decoration: none; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover { background: #333; }
.woocommerce-cart .cart-empty { text-align: center; background: #f4f1ec; border-radius: 24px; padding: 3rem 1rem; margin: 0 0 1.5rem; grid-column: 1 / -1; border: 0; }
.woocommerce-cart .cart-empty::before { display: none; }
.woocommerce-cart .return-to-shop { text-align: center; grid-column: 1 / -1; }
.woocommerce-cart .return-to-shop .button { display: inline-flex; align-items: center; min-height: 50px; padding: 0 2rem; border-radius: 30px; background: #111; color: #fff; text-decoration: none; }
.woocommerce-cart table.cart.blockUI, .woocommerce-cart .processing { opacity: 0.6; }

@media (max-width: 900px) {
	.woocommerce-cart .woocommerce { grid-template-columns: minmax(0, 1fr); }
	.woocommerce-cart .cart_totals { position: static; }
	/* items become cards */
	.woocommerce-cart table.shop_table_responsive thead { display: none; }
	.woocommerce-cart table.shop_table_responsive tr.cart_item { display: grid; grid-template-columns: 84px 1fr auto; gap: 0.25rem 0.9rem; padding: 1rem 0; border-bottom: 1px solid #eee; align-items: center; }
	.woocommerce-cart table.shop_table_responsive tr.cart_item td { display: block; border: 0; padding: 0.15rem 0; text-align: start !important; }
	.woocommerce-cart table.shop_table_responsive tr.cart_item td::before { display: none; }
	.woocommerce-cart tr.cart_item td.product-thumbnail { grid-row: 1 / span 4; grid-column: 1; }
	.woocommerce-cart tr.cart_item td.product-name { grid-column: 2; }
	.woocommerce-cart tr.cart_item td.product-remove { grid-column: 3; grid-row: 1; text-align: end !important; }
	.woocommerce-cart tr.cart_item td.product-price { grid-column: 2; font-size: 0.9rem; color: #6b6b6b; }
	.woocommerce-cart tr.cart_item td.product-price::before { display: inline; content: attr(data-title) ': '; }
	.woocommerce-cart tr.cart_item td.product-quantity { grid-column: 2; }
	.woocommerce-cart tr.cart_item td.product-subtotal { grid-column: 2 / 4; }
	.woocommerce-cart tr.cart_item td.product-subtotal::before { display: inline; content: attr(data-title) ': '; font-weight: 400; color: #6b6b6b; }
	.woocommerce-cart table.cart td.actions { display: block; }
	.woocommerce-cart td.actions .coupon { max-width: none; }
}

/* ---------- checkout ---------- */
/* Layout: one centred container; the form and the summary are named grid areas so they always share the top edge (the old explicit row numbers pushed the summary below the form). */
body.woocommerce-checkout:not(.woocommerce-order-received) .page-title { max-width: 1120px; margin: 0.5rem auto 1.5rem; text-align: start; }
body.woocommerce-checkout .site-main--commerce > .shynx-crumbs { max-width: 1120px; }
body.woocommerce-checkout:not(.woocommerce-order-received) .woocommerce { max-width: 1120px; margin-inline: auto; }
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr); grid-template-areas: "notices notices" "details heading" "details review"; grid-template-rows: auto auto 1fr; column-gap: 3rem; row-gap: 0; align-items: start; }
.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup { grid-area: notices; }
.woocommerce-checkout form.checkout > wc-order-attribution-inputs { display: none; }
.woocommerce-checkout #customer_details { grid-area: details; width: 100%; float: none; }
.woocommerce-checkout #customer_details .col-1, .woocommerce-checkout #customer_details .col-2 { width: 100%; float: none; max-width: none; }
.woocommerce-checkout #customer_details .col-2:empty, .woocommerce-checkout #customer_details .col-2:not(:has(.form-row)) { display: none; }
.woocommerce-checkout #order_review_heading { grid-area: heading; margin: 0 0 1rem; font-size: 1.3rem; }
.woocommerce-checkout #order_review { grid-area: review; width: 100%; float: none; box-sizing: border-box; background: #f4f1ec; border-radius: 24px; padding: 1.5rem; margin: 0; }
/* The form stays in view while the longer order summary scrolls past (only where the form fits the screen height). */
@media (min-width: 901px) and (min-height: 640px) { .woocommerce-checkout #customer_details { align-self: start; position: sticky; top: var(--sticky-top, 6rem); } }
.woocommerce-checkout .woocommerce-billing-fields h3 { font-size: 1.3rem; margin: 0 0 1rem; }
.woocommerce-checkout .form-row { margin: 0 0 1.1rem; padding: 0; width: 100%; float: none; }
.woocommerce-checkout .form-row label { display: block; font-weight: 500; margin-bottom: 0.4rem; }
.woocommerce-checkout .form-row .required { color: #c8102e; text-decoration: none; }
.woocommerce-checkout .form-row input.input-text, .woocommerce-checkout .form-row textarea, .woocommerce-checkout .form-row select {
	width: 100%; min-height: 50px; border: 1px solid #bbb; border-radius: 14px; padding: 0.75rem 1rem; font: inherit; font-size: 1rem; background: #fff; box-sizing: border-box;
}
.woocommerce-checkout .form-row textarea { min-height: 120px; display: block; resize: vertical; }
.woocommerce-checkout .form-row input:focus, .woocommerce-checkout .form-row textarea:focus { outline: 2px solid #111; outline-offset: 1px; border-color: #111; }
.woocommerce-checkout .form-row .description, .woocommerce-checkout .form-row span.description { display: block; font-size: 0.85rem; color: #6b6b6b; margin-top: 0.3rem; }
.woocommerce-checkout .form-row.shynx-invalid input, .woocommerce-checkout .form-row.shynx-invalid textarea, .woocommerce-checkout .form-row.woocommerce-invalid input, .woocommerce-checkout .form-row.woocommerce-invalid textarea { border-color: #c8102e; background: #fff7f7; }
.shynx-field-error { color: #c8102e; font-size: 0.88rem; margin: 0.4rem 0 0; }
.shynx-hidden-field { display: none !important; }
#billing_phone { direction: ltr; text-align: start; }
[dir="rtl"] #billing_phone { text-align: right; }
.woocommerce-checkout table.shop_table { border: 0; width: 100%; border-collapse: collapse; }
.woocommerce-checkout table.shop_table th, .woocommerce-checkout table.shop_table td { border: 0; border-bottom: 1px solid rgba(0,0,0,0.08); padding: 0.75rem 0; text-align: start; background: none; vertical-align: top; }
.woocommerce-checkout table.shop_table td.product-total, .woocommerce-checkout table.shop_table tfoot td { text-align: end; }
.woocommerce-checkout table.shop_table .product-name dl.variation { margin: 0.3rem 0 0; font-size: 0.85rem; color: #6b6b6b; }
.woocommerce-checkout table.shop_table .product-name dl.variation dt, .woocommerce-checkout table.shop_table .product-name dl.variation dd, .woocommerce-checkout table.shop_table .product-name dl.variation p { display: inline; margin: 0; }
.woocommerce-checkout table.shop_table tr.order-total th, .woocommerce-checkout table.shop_table tr.order-total td { font-size: 1.15rem; font-weight: 600; border-bottom: 0; }
.woocommerce-checkout table.shop_table tr.shynx-delivery td { font-size: 0.9rem; color: #444; }
.woocommerce-checkout ul#shipping_method { list-style: none; margin: 0; padding: 0; }
.woocommerce-checkout #payment { background: transparent; border-radius: 0; }
.woocommerce-checkout #payment ul.payment_methods { list-style: none; margin: 1rem 0; padding: 0; border: 0; }
.woocommerce-checkout #payment ul.payment_methods li { padding: 0.9rem 1rem; background: #fff; border-radius: 14px; margin-bottom: 0.6rem; }
.woocommerce-checkout #payment div.payment_box { background: transparent; color: #444; padding: 0.5rem 0 0; margin: 0; font-size: 0.9rem; }
.woocommerce-checkout #payment div.payment_box::before { display: none; }
.woocommerce-checkout #payment #place_order { width: 100%; min-height: 56px; border-radius: 30px; background: #111; color: #fff; border: 0; font: inherit; font-weight: 500; font-size: 1.05rem; cursor: pointer; float: none; }
.woocommerce-checkout #payment #place_order:hover { background: #333; }
.woocommerce-checkout #payment #place_order:disabled, .woocommerce-checkout .processing #place_order { opacity: 0.6; cursor: wait; }
.woocommerce-checkout .woocommerce-privacy-policy-text { font-size: 0.8rem; color: #6b6b6b; }
.woocommerce-error, .woocommerce-message, .woocommerce-info { list-style: none; }
.woocommerce-NoticeGroup .woocommerce-error { background: #fff0f0; border: 0; border-inline-start: 4px solid #c8102e; border-radius: 14px; padding: 1rem 1.25rem; margin: 0 0 1rem; }
.woocommerce-NoticeGroup .woocommerce-error::before { display: none; }

@media (max-width: 900px) {
	.woocommerce-checkout form.checkout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "notices" "details" "heading" "review"; column-gap: 0; }
	.woocommerce-checkout #customer_details { margin-bottom: 1.5rem; }
	.woocommerce-checkout #order_review { padding: 1.25rem; }
}

/* ---------- order received ---------- */
.woocommerce-order { max-width: 860px; margin: 0 auto; }
.woocommerce-order .woocommerce-notice--success { font-size: 1.1rem; font-weight: 500; background: #f1f9f4; border-radius: 14px; padding: 1rem 1.25rem; }
/* WooCommerce's clearfix ::before/::after would become empty grid/flex cells and push "Order number" into the second slot, so they are removed. */
.woocommerce-order ul.order_details::before, .woocommerce-order ul.order_details::after { content: none; display: none; }
.woocommerce-order ul.order_details { display: flex; flex-wrap: wrap; gap: 1rem; list-style: none; padding: 0; margin: 1.25rem 0; }
.woocommerce-order ul.order_details li { flex: 1 1 150px; min-width: 0; box-sizing: border-box; border: 0; background: #f4f1ec; border-radius: 14px; padding: 0.8rem 1rem; margin: 0; float: none; font-size: 0.8rem; text-transform: uppercase; color: #6b6b6b; }
.woocommerce-order ul.order_details li.email { flex-basis: 240px; }
.woocommerce-order ul.order_details li strong { display: block; overflow-wrap: anywhere; font-size: 1rem; color: #111; text-transform: none; margin-top: 0.2rem; }
.woocommerce-order table.shop_table { width: 100%; border: 0; border-collapse: collapse; }
.woocommerce-order table.shop_table th, .woocommerce-order table.shop_table td { border: 0; border-bottom: 1px solid #eee; padding: 0.75rem 0.25rem; text-align: start; }
/* Customer details card: icon badge + small label over the value, name + phone side by side on desktop, one on phones. */
.woocommerce-order .woocommerce-customer-details { margin-top: 2rem; }
.woocommerce-order .woocommerce-customer-details .woocommerce-column__title { font-size: 1.3rem; margin: 0 0 1rem; }
.woocommerce-order .woocommerce-customer-details address.shynx-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; border: 0; background: #f4f1ec; border-radius: 24px; padding: 1rem; font-style: normal; text-align: start; }
.shynx-detail { display: flex; align-items: center; gap: 0.9rem; min-width: 0; background: #fff; border-radius: 16px; padding: 0.85rem 1rem; }
.shynx-detail--address, .shynx-detail--email { grid-column: 1 / -1; } /* long values get the whole row */
.shynx-detail__icon { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: #f4f1ec; color: #111; }
.shynx-detail__icon svg { display: block; }
.shynx-detail__text { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.shynx-detail__label { font-size: 0.78rem; color: #6b6b6b; letter-spacing: 0.02em; }
.shynx-detail__value { font-size: 1rem; font-weight: 500; color: #111; overflow-wrap: anywhere; }
.shynx-detail__value[dir="ltr"] { text-align: start; }
@media (max-width: 600px) {
	.woocommerce-order .woocommerce-customer-details address.shynx-details { grid-template-columns: minmax(0, 1fr); border-radius: 20px; padding: 0.75rem; }
}
.woocommerce-instapay { background: #f4f1ec; border-radius: 14px; padding: 1rem 1.25rem; margin: 1rem 0; }

/* ---------- order dialogs ---------- */
.order-success { width: min(480px, calc(100vw - 2rem)); text-align: center; }
.order-success__body { padding: 2rem 1.75rem; }
.order-success__icon { width: 72px; height: 72px; border-radius: 50%; margin: 0 auto 1rem; display: flex; align-items: center; justify-content: center; background: #2e7d4f; color: #fff; font-size: 2.2rem; }
.order-success .modal__title { margin: 0 0 0.75rem; font-size: 1.5rem; }
.order-success__meta { color: #6b6b6b; font-size: 0.9rem; }
.order-success__actions { display: grid; gap: 0.6rem; margin-top: 1.25rem; }
.confirm-order { width: min(460px, calc(100vw - 2rem)); }
.confirm-order__text { margin: 0 0 1rem; }
.confirm-order__total { background: #f4f1ec; border-radius: 14px; padding: 0.9rem 1rem; display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; margin: 0; }
.confirm-order__amount { font-size: 1.25rem; }
.btn:disabled { opacity: 0.6; cursor: wait; }

.woocommerce-message, .woocommerce-info { background: #f4f1ec; border: 0 !important; border-inline-start: 4px solid #111 !important; border-radius: 14px; padding: 1rem 1.25rem; margin: 0 0 1rem; color: #111; }
.woocommerce-message::before, .woocommerce-info::before { display: none; }
.woocommerce-message a.button, .woocommerce-info a.button { float: none; background: transparent; color: #111; text-decoration: underline; padding: 0 0.5rem; }
.woocommerce-form-coupon-toggle .woocommerce-info { margin-bottom: 1rem; }

/* ================= UI REFINEMENTS (plus icon, sort arrow, active filters, loading) ================= */

/* (product-card plus icon + compact-card rules moved to shop.css: the card is also used on the homepage, which does not load this file) */

/* Sort by: custom chevron, balanced padding, same in LTR and RTL (no browser-default arrow). */
.shop-sort select {
	-webkit-appearance: none; appearance: none; background-color: #fff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23111' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 1rem center; background-size: 12px 8px;
	padding-inline: 1.1rem 2.6rem; box-sizing: border-box; width: 250px; flex: 0 1 auto; min-width: 0; max-width: 100%; cursor: pointer; color: #111; font-weight: 500;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* (phone / tablet layout of the toolbar, chips and spacing: see "SHOP MOBILE COMPOSITION" at the end of this file) */
[dir="rtl"] .shop-sort select { background-position: left 1rem center; padding-inline: 2.6rem 1.1rem; }
.shop-sort select:focus-visible { outline: 2px solid #0b57d0; outline-offset: 2px; }
.shop-sort select:hover { border-color: #111; }

/* Active filters: Reset Filters is a fixed anchor (first in reading order); chips wrap in their own container. */
#shop-active:empty { display: none; }
/* Reset Filters + every selected chip are ONE wrapping flow (the chips wrapper is transparent to layout): they share a row while they fit and wrap
   to the next row when they do not; a chip with a long label shrinks and wraps its own text instead of overflowing. */
.active-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.5rem; margin-bottom: 1.25rem; }
.active-filters__chips { display: contents; }
.active-filters .chip--reset { flex: 0 0 auto; white-space: nowrap; min-height: 40px; }
.active-filters .chip { max-width: 100%; box-sizing: border-box; }
.active-filters .chip__label { overflow-wrap: anywhere; min-width: 0; }
.chip { min-height: 40px; }
.chip__x { font-size: 1.1rem; line-height: 1; flex: none; }

/* Real loading state only while a request is pending. */
.shop-page { position: relative; }
.shop-page.is-loading .shop-results { opacity: 0.45; pointer-events: none; transition: opacity 0.15s; }
.shop-page.is-loading::before {
	content: ''; position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 1300;
	background: linear-gradient(90deg, transparent, #111, transparent); background-size: 40% 100%; background-repeat: no-repeat;
	animation: shynx-progress 0.9s linear infinite;
}
@keyframes shynx-progress { from { background-position: -40% 0; } to { background-position: 140% 0; } }
@media (prefers-reduced-motion: reduce) { .shop-page.is-loading::before { animation: none; background-size: 100% 100%; background-color: #111; } }

/* toast sits above the floating language switcher on phones */
@media (max-width: 600px) { .shynx-toast { inset-block-end: 4.2rem; } }

/* ---------- pagination (Shop All) ---------- */
.woocommerce nav.woocommerce-pagination { margin: 2.5rem 0 0; }
.woocommerce nav.woocommerce-pagination ul.page-numbers { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px; list-style: none; padding: 0; margin: 0; border: 0; }
.woocommerce nav.woocommerce-pagination ul.page-numbers li { border: 0; float: none; margin: 0; padding: 0; overflow: visible; display: block; }
.woocommerce nav.woocommerce-pagination ul li a.page-numbers, .woocommerce nav.woocommerce-pagination ul li span.page-numbers {
	display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
	min-width: 38px; height: 38px; padding: 0 10px; border-radius: 999px; margin: 0; line-height: 1;
	font-size: 0.9rem; font-weight: 500; text-decoration: none; color: #111; background: transparent; border: 1px solid #ddd6cc;
	transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.woocommerce nav.woocommerce-pagination ul li a.page-numbers:hover { border-color: #111; background: #f4f1ec; }
.woocommerce nav.woocommerce-pagination ul li a.page-numbers:focus-visible { outline: 2px solid #0b57d0; outline-offset: 2px; }
.woocommerce nav.woocommerce-pagination ul li span.page-numbers.current { background: #111; border-color: #111; color: #fff; }
.woocommerce nav.woocommerce-pagination ul li span.page-numbers.dots { border-color: transparent; min-width: 22px; padding: 0; }
/* The arrow is a drawn chevron (two borders of a small square). WooCommerce's generic `.woocommerce nav.woocommerce-pagination ul li span` rule gives every span
   0.5em padding and a 1em minimum width, which silently turned this 8px square into a 16px one (23px once rotated). Reset both, with matching specificity. */
.woocommerce nav.woocommerce-pagination ul li .pg-arrow { display: block; box-sizing: border-box; width: 9px; height: 9px; min-width: 0; padding: 0; margin: 0; border: solid currentColor; border-width: 0 0 1.6px 1.6px; }
.pg-arrow--prev { transform: translateX(1px) rotate(45deg); }
.pg-arrow--next { transform: translateX(-1px) rotate(-135deg); }
[dir="rtl"] .pg-arrow--prev { transform: translateX(-1px) rotate(-135deg); }
[dir="rtl"] .pg-arrow--next { transform: translateX(1px) rotate(45deg); }
.shop-results:focus { outline: none; }

/* Filter panel buttons (Reset Filters / Apply): the global button hover (motion.css) lifts the button and adds an 8px 20px drop shadow. This panel scrolls and
   clips its content, so that shadow was cut off at the edge and looked broken. Here the hover is a plain, flat colour change instead. */
.filter-form .btn { transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; }
.filter-form .btn:hover, .filter-form .btn:focus-visible { transform: none; box-shadow: none; }
.filter-form .btn:active { transform: none; box-shadow: none; }
.filter-form .btn--ghost:hover { background: #111; color: #fff; border-color: #111; }
.filter-form .btn:focus-visible { outline: 2px solid #0b57d0; outline-offset: 2px; }

/* ================= SHOP MOBILE COMPOSITION (<= 900px: filters live in a panel, cards are 2-up) =================
   One rhythm for the whole top of the page: 40px controls, 34px chips, 0.6rem gaps, then 0.85rem before the products. */
@media (max-width: 900px) {
	.shop-head { margin-bottom: 0.9rem; scroll-margin-top: calc(var(--sx-bar, 0px) + var(--promo-h, 0px) + 5.25rem); } /* filters.js scrolls the head to the top: clear the fixed header */

	/* Toolbar: Filters + Sort by form ONE left-aligned cluster of two same-height pill controls. Sort by only wraps to its own row when it cannot keep 9.5rem. */
	.shop-toolbar { justify-content: flex-start; gap: 0.6rem; margin-bottom: 0.75rem; }
	.filter-toggle { flex: none; min-height: 40px; padding: 0 1rem; font-size: 0.9rem; }
	.shop-sort { flex: 1 1 9.5rem; max-width: 15.5rem; min-width: 0; margin-inline-start: 0; gap: 0.5rem; }
	.shop-sort select { width: auto; flex: 1 1 0; min-width: 0; min-height: 40px; font-size: 0.9rem; padding-inline: 0.9rem 2.3rem; background-position: right 0.85rem center; }
	[dir="rtl"] .shop-sort select { padding-inline: 2.3rem 0.9rem; background-position: left 0.85rem center; }

	/* Selected filters: Reset Filters is just the first chip (outlined, not a solid primary button); every chip shares height, padding, radius and gap. */
	.active-filters { gap: 0.45rem; margin-bottom: 0.85rem; }
	.active-filters .chip, .active-filters .chip--reset { min-height: 34px; padding: 0 0.8rem; border-radius: 17px; font-size: 0.82rem; gap: 0.4rem; border: 1px solid transparent; box-sizing: border-box; }
	.active-filters .chip--reset { background: transparent; color: #111; border-color: #111; font-weight: 500; }
	.active-filters .chip--reset:hover { background: #111; color: #fff; }
	.chip__x { font-size: 1rem; }

	/* Products: a little more air between rows so each title + price clearly belongs to its own image. */
	.shop-results ul.products { row-gap: 1.4rem; }
}
/* On phones the select alone says what is sorted ("Price: High to Low"), so the word "Sort by" is kept for screen readers and dropped visually to leave the select room. */
@media (max-width: 400px) {
	.shop-sort > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* The blue hint under a checkout field ("Optional second number...") floats OVER what follows instead of pushing the form down while you type. */
.woocommerce-checkout .form-row { position: relative; }
.woocommerce-checkout .form-row .description { position: absolute !important; inset-inline-start: 0; top: 100%; margin-top: 0.35rem !important; z-index: 20; max-width: 100%; pointer-events: none; box-shadow: 0 6px 16px rgba(0,0,0,0.15); }


/* ---------- applied coupon line (cart totals and checkout order summary) ---------- */
@keyframes sx-discount-in { 0% { background-color: #bfe6cc; } 100% { background-color: #e4f3ea; } }
.woocommerce-cart .cart_totals tr.cart-discount th, .woocommerce-cart .cart_totals tr.cart-discount td,
.woocommerce-checkout table.shop_table tr.cart-discount th, .woocommerce-checkout table.shop_table tr.cart-discount td { background: #e4f3ea; color: #17623a; font-weight: 600; border-bottom: 0; padding-block: 0.85rem; animation: sx-discount-in 1.1s ease-out 1; }
.woocommerce-cart .cart_totals tr.cart-discount th, .woocommerce-checkout table.shop_table tr.cart-discount th { border-start-start-radius: 14px; border-end-start-radius: 14px; padding-inline-start: 2.6rem; position: relative; }
.woocommerce-cart .cart_totals tr.cart-discount td, .woocommerce-checkout table.shop_table tr.cart-discount td { border-start-end-radius: 14px; border-end-end-radius: 14px; padding-inline-end: 0.9rem; }
.woocommerce-cart .cart_totals tr.cart-discount th::before, .woocommerce-checkout table.shop_table tr.cart-discount th::before { content: ""; position: absolute; inset-inline-start: 0.85rem; top: 50%; width: 20px; height: 20px; margin-top: -10px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2317623a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9a2 2 0 0 0 0 6v2a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1v-2a2 2 0 0 1 0-6V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1z'/%3E%3Cpath d='m9 15 6-6'/%3E%3C/svg%3E") no-repeat center / contain; }
.woocommerce-cart .cart_totals tr.cart-discount td a.woocommerce-remove-coupon, .woocommerce-checkout table.shop_table tr.cart-discount td a.woocommerce-remove-coupon { display: inline-block; margin-inline-start: 0.5rem; padding: 0.1rem 0.6rem; border: 1px solid currentColor; border-radius: 999px; font-size: 0.78rem; font-weight: 500; color: #17623a; text-decoration: none; transition: background 0.2s ease, color 0.2s ease; }
.woocommerce-cart .cart_totals tr.cart-discount td a.woocommerce-remove-coupon:hover, .woocommerce-checkout table.shop_table tr.cart-discount td a.woocommerce-remove-coupon:hover { background: #17623a; color: #fff; }
@media (prefers-reduced-motion: reduce) { .woocommerce-cart .cart_totals tr.cart-discount th, .woocommerce-cart .cart_totals tr.cart-discount td, .woocommerce-checkout table.shop_table tr.cart-discount th, .woocommerce-checkout table.shop_table tr.cart-discount td { animation: none; } }


/* ---------- checkout polish: phones first, tidier on tablets and desktop too ---------- */
/* "Have a coupon?" becomes a slim tappable card, and the code box (when opened) is the same joined pill as in the cart */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info { max-width: 560px; display: block; position: relative; padding-inline-start: 3rem !important; background: #fff; border: 1px solid #e2dccf !important; border-radius: 16px; padding: 0.85rem 1rem; margin: 0 0 0.9rem; font-size: 0.95rem; line-height: 1.4; }
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before { content: ""; display: block !important; position: absolute !important; inset-inline-start: 1rem; top: 50%; margin-top: -11px; width: 22px; height: 22px; font-family: inherit; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9a2 2 0 0 0 0 6v2a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1v-2a2 2 0 0 1 0-6V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1z'/%3E%3Cpath d='M13 6v12' stroke-dasharray='2 2'/%3E%3C/svg%3E") no-repeat center / contain; }
.woocommerce-checkout .woocommerce-form-coupon-toggle .showcoupon { font-weight: 600; color: #111; text-decoration: underline; text-underline-offset: 3px; }
.woocommerce-checkout form.checkout_coupon { max-width: 560px; margin: 0 0 1rem !important; padding: 0 !important; border: 1.5px solid #111 !important; border-radius: 999px; background: #fff; overflow: hidden; transition: box-shadow 0.2s ease; }
.woocommerce-checkout form.checkout_coupon:focus-within { animation: sx-coupon-ring 0.7s ease-out 1; box-shadow: 0 0 0 4px rgba(17, 17, 17, 0.12); }
.woocommerce-checkout form.checkout_coupon .clear { display: none; }
.woocommerce-checkout form.checkout_coupon::after { content: ""; display: block; clear: both; }
.woocommerce-checkout form.checkout_coupon p.form-row { margin: 0 !important; padding: 0 !important; width: auto; }
.woocommerce-checkout form.checkout_coupon p.form-row-first { float: inline-start; width: calc(100% - 9.5rem); }
.woocommerce-checkout form.checkout_coupon p.form-row-last { float: inline-end; width: 9.5rem; }
.woocommerce-checkout form.checkout_coupon input.input-text { width: 100%; min-height: 50px; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; outline: 0 !important; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9a2 2 0 0 0 0 6v2a1 1 0 0 0 1 1h16a1 1 0 0 0 1-1v-2a2 2 0 0 1 0-6V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1z'/%3E%3Cpath d='M13 6v12' stroke-dasharray='2 2'/%3E%3C/svg%3E") no-repeat 1rem center / 20px; padding: 0 0.8rem !important; padding-inline-start: 2.9rem !important; font: inherit; }
[dir="rtl"] .woocommerce-checkout form.checkout_coupon input.input-text { background-position: right 1rem center !important; }
.woocommerce-checkout form.checkout_coupon .button { width: 100%; min-height: 50px; margin: 0; border: 0; border-radius: 0; background: #111; color: #fff; font: inherit; font-weight: 500; white-space: nowrap; cursor: pointer; transform: none !important; box-shadow: none !important; transition: background 0.2s ease; }
.woocommerce-checkout form.checkout_coupon .button:hover { background: #333; }

/* the order summary: labels never wrap into the amounts, the total stands out, native radio becomes black */
.woocommerce-checkout table.shop_table tfoot th { white-space: nowrap; padding-inline-end: 1rem; }
.woocommerce-checkout table.shop_table tfoot tr.order-total th, .woocommerce-checkout table.shop_table tfoot tr.order-total td { padding-top: 1rem; border-top: 2px solid rgba(0, 0, 0, 0.12); }
.woocommerce-checkout table.shop_table tr.cart_item td.product-name { overflow-wrap: anywhere; padding-inline-end: 0.75rem; }
.woocommerce-checkout table.shop_table td.product-total { white-space: nowrap; }
.woocommerce-checkout #payment ul.payment_methods li { border: 1.5px solid #111; }
.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] { accent-color: #111; width: 18px; height: 18px; margin: 0 0.6rem 0 0; vertical-align: -3px; }
[dir="rtl"] .woocommerce-checkout #payment ul.payment_methods li input[type="radio"] { margin: 0 0 0 0.6rem; }
.woocommerce-checkout #payment ul.payment_methods li label { font-weight: 500; cursor: pointer; }

@media (max-width: 600px) {
	body.woocommerce-checkout:not(.woocommerce-order-received) .page-title { font-size: 1.7rem; margin: 0.25rem 0 1rem; text-align: center; }
	.woocommerce-checkout .shynx-crumbs { margin-bottom: 0.25rem; }
	.woocommerce-checkout #customer_details { background: #fff; border: 1px solid #ece6db; border-radius: 22px; padding: 1.15rem 1rem 0.25rem; margin-bottom: 1.25rem; box-sizing: border-box; }
	.woocommerce-checkout .woocommerce-billing-fields h3 { font-size: 1.15rem; margin-bottom: 0.9rem; }
	.woocommerce-checkout .form-row input.input-text, .woocommerce-checkout .form-row textarea, .woocommerce-checkout .form-row select { font-size: 16px; min-height: 52px; } /* 16px stops iPhones zooming into the field */
	.woocommerce-checkout .form-row textarea { min-height: 110px; }
	.woocommerce-checkout #order_review_heading { font-size: 1.15rem; margin: 0 0 0.75rem; }
	.woocommerce-checkout #order_review { padding: 1rem; border-radius: 22px; }
	.woocommerce-checkout table.shop_table th, .woocommerce-checkout table.shop_table td { padding: 0.7rem 0; font-size: 0.95rem; }
	.woocommerce-checkout table.shop_table thead { display: none; }
	/* each line is a row: name (or label) on one side, the amount on the other, so nothing is squeezed into a narrow column */
	.woocommerce-checkout table.shop_table tr.cart_item, .woocommerce-checkout table.shop_table tfoot tr { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; border-bottom: 1px solid rgba(0, 0, 0, 0.08); }
	.woocommerce-checkout table.shop_table tr.cart_item th, .woocommerce-checkout table.shop_table tr.cart_item td, .woocommerce-checkout table.shop_table tfoot tr th, .woocommerce-checkout table.shop_table tfoot tr td { border: 0 !important; }
	.woocommerce-checkout table.shop_table tr.cart_item td.product-name { flex: 1 1 auto; min-width: 0; }
	.woocommerce-checkout table.shop_table tr.cart_item td.product-total { flex: 0 0 auto; }
	.woocommerce-checkout table.shop_table tfoot tr th { flex: 0 0 auto; padding-inline-end: 0; }
	.woocommerce-checkout table.shop_table tfoot tr td { flex: 1 1 auto; min-width: 0; text-align: end; }
	.woocommerce-checkout table.shop_table tfoot tr.order-total { border-bottom: 0; border-top: 2px solid rgba(0, 0, 0, 0.12); margin-top: 0.2rem; }
	.woocommerce-checkout table.shop_table tfoot tr.order-total th, .woocommerce-checkout table.shop_table tfoot tr.order-total td { border-top: 0 !important; padding-top: 0.9rem; }
	.woocommerce-checkout table.shop_table tfoot tr.cart-discount { border-bottom: 0; margin: 0.35rem 0; }
	.woocommerce-checkout table.shop_table tfoot tr.cart-discount th, .woocommerce-checkout table.shop_table tfoot tr.cart-discount td { border-radius: 0; }
	.woocommerce-checkout table.shop_table tfoot tr.cart-discount { background: #e4f3ea; border-radius: 14px; }
	.woocommerce-checkout table.shop_table tfoot tr.cart-discount th, .woocommerce-checkout table.shop_table tfoot tr.cart-discount td { background: transparent; animation: none; }
	.woocommerce-checkout #payment ul.payment_methods { margin: 0.9rem 0; }
	.woocommerce-checkout #payment ul.payment_methods li { padding: 0.85rem 0.9rem; }
	.woocommerce-checkout #payment #place_order { min-height: 58px; font-size: 1.1rem; }
	.woocommerce-checkout form.checkout_coupon p.form-row-first { width: calc(100% - 8.6rem); }
	.woocommerce-checkout form.checkout_coupon p.form-row-last { width: 8.6rem; }
	.woocommerce-checkout form.checkout_coupon .button { font-size: 0.92rem; padding: 0 0.5rem; }
	.woocommerce-checkout form.checkout_coupon input.input-text { padding-inline-start: 2.6rem !important; background-position: 0.8rem center; font-size: 16px; }
	[dir="rtl"] .woocommerce-checkout form.checkout_coupon input.input-text { background-position: right 0.8rem center !important; }
}
@media (max-width: 360px) {
	.woocommerce-checkout form.checkout_coupon p.form-row-first { width: calc(100% - 7.2rem); }
	.woocommerce-checkout form.checkout_coupon p.form-row-last { width: 7.2rem; }
	.woocommerce-checkout form.checkout_coupon input.input-text { padding-inline-start: 2.4rem !important; font-size: 15px; }
	.woocommerce-checkout form.checkout_coupon .button { font-size: 0.85rem; }
}
@media (prefers-reduced-motion: reduce) { .woocommerce-checkout form.checkout_coupon:focus-within { animation: none; } }


/* ---------- cart polish: phones first (items as clean cards, totals as label / amount rows), tidier on larger screens ---------- */
.woocommerce-cart .page-title { margin-bottom: 1.25rem; }
.woocommerce-cart table.cart td.product-name a:hover { text-decoration: underline; }
.woocommerce-cart table.cart td.product-subtotal, .woocommerce-cart table.cart td.product-price { white-space: nowrap; }
.woocommerce-cart .cart_totals h2 { font-size: 1.2rem; }

@media (max-width: 900px) {
	.woocommerce-cart table.shop_table_responsive tr.cart_item { grid-template-columns: 84px minmax(0, 1fr) auto; grid-template-areas: "thumb name name" "thumb price sub" "thumb qty qty"; position: relative; gap: 0.2rem 0.9rem; padding: 1rem 0; }
	.woocommerce-cart tr.cart_item td.product-thumbnail { grid-area: thumb; align-self: start; }
	.woocommerce-cart tr.cart_item td.product-name { grid-area: name; padding-inline-end: 2.8rem !important; font-size: 0.98rem; line-height: 1.35; }
	.woocommerce-cart tr.cart_item td.product-price { grid-area: price; }
	.woocommerce-cart tr.cart_item td.product-quantity { grid-area: qty; justify-self: start; padding-top: 0.35rem; }
	.woocommerce-cart tr.cart_item td.product-subtotal { grid-area: sub; align-self: center; text-align: end !important; font-size: 1.02rem; }
	.woocommerce-cart table.cart tr.cart_item td { background: transparent !important; }
	.woocommerce-cart tr.cart_item td.product-subtotal::before { display: none; }
	.woocommerce-cart tr.cart_item td.product-remove { position: absolute; top: 0.85rem; inset-inline-end: 0; grid-area: auto; padding: 0; }
	.woocommerce-cart table.cart td.product-remove a.remove { width: 34px; height: 34px; font-size: 1.2rem; }

	/* totals: every row is "label ... amount" */
	.woocommerce-cart .cart_totals { padding: 1.15rem 1rem; border-radius: 22px; }
	.woocommerce-cart .cart_totals table, .woocommerce-cart .cart_totals tbody { display: block; width: 100%; }
	.woocommerce-cart .cart_totals tr { display: block; border-bottom: 1px solid rgba(0, 0, 0, 0.08); }
	.woocommerce-cart .cart_totals tr th { display: none; }
	.woocommerce-cart .cart_totals tr td { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 0.2rem 1rem; padding: 0.8rem 0; border: 0; background: transparent !important; text-align: end; }
	.woocommerce-cart .cart_totals tr td::before { float: none; content: attr(data-title); font-weight: 600; color: #111; text-align: start; }
	.woocommerce-cart .cart_totals tr.shynx-delivery td { display: block; text-align: start; font-size: 0.88rem; color: #555; padding: 0.6rem 0; }
	.woocommerce-cart .cart_totals tr.shynx-delivery td::before { display: none; }
	.woocommerce-cart .cart_totals tr.order-total { border-bottom: 0; border-top: 2px solid rgba(0, 0, 0, 0.12); margin-top: 0.2rem; }
	.woocommerce-cart .cart_totals tr.order-total td { padding-top: 0.95rem; font-size: 1.15rem; }
	.woocommerce-cart .cart_totals tr.cart-discount { border-bottom: 0; margin: 0.35rem 0; }
	.woocommerce-cart .cart_totals tr.cart-discount td { display: block; text-align: start; background: #e4f3ea !important; padding: 0.8rem 0.9rem; border-radius: 14px; animation: none; }
	.woocommerce-cart .cart_totals tr.cart-discount td::before { display: block; margin-bottom: 0.15rem; color: #17623a; }
	.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { min-height: 56px; font-size: 1.02rem; padding: 0 1rem; white-space: nowrap; }
}

/* very narrow phones: the coupon box stacks (code box, then a full-width button) so neither is cut off */
@media (max-width: 400px) {
	.woocommerce-cart td.actions .coupon { flex-direction: column; gap: 0.6rem; background: transparent; border: 0; border-radius: 0; overflow: visible; box-shadow: none !important; animation: none !important; }
	.woocommerce-cart td.actions .coupon input.input-text { flex: none; width: 100% !important; box-sizing: border-box; border: 1.5px solid #111 !important; border-radius: 999px !important; background-color: #fff; }
	.woocommerce-cart td.actions .coupon input.input-text:focus { box-shadow: 0 0 0 4px rgba(17, 17, 17, 0.12) !important; }
	.woocommerce-cart td.actions .coupon .button { width: 100% !important; flex: none; border-radius: 999px; min-height: 50px; }
}


/* ---------- cart items as cards: product title, color / size tags, one clean row for quantity and amount ---------- */
.cart-item__title { display: block; font-weight: 600; color: #111; line-height: 1.3; text-decoration: none; }
.cart-item__tags { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.4rem; }
.cart-item__tag { background: #f4f1ec; border-radius: 999px; padding: 0.15rem 0.7rem; font-size: 0.8rem; font-weight: 500; color: #333; white-space: nowrap; }
.woocommerce-cart table.cart td.product-name a.cart-item__title { font-weight: 600; }
.woocommerce-checkout table.shop_table .cart-item__title { display: inline; font-weight: 500; }
.woocommerce-checkout table.shop_table .cart-item__tags { margin-top: 0.3rem; }
.woocommerce-checkout table.shop_table .cart-item__tag { font-size: 0.75rem; padding: 0.1rem 0.6rem; background: #fff; }

@media (max-width: 900px) {
	.woocommerce-cart table.shop_table_responsive, .woocommerce-cart table.shop_table_responsive tbody { display: block; width: 100%; }
	.woocommerce-cart table.shop_table_responsive tr.cart_item { background: #fff; border: 1px solid #ece6db !important; border-radius: 20px; padding: 0.9rem !important; margin: 0 0 0.85rem; grid-template-columns: 88px minmax(0, 1fr) auto; grid-template-areas: "thumb name name" "thumb price price" "qty qty sub"; gap: 0.25rem 0; box-sizing: border-box; }
	.woocommerce-cart tr.cart_item td.product-thumbnail { padding-inline-end: 0.85rem !important; }
	.woocommerce-cart table.cart img { width: 88px; border-radius: 14px; }
	.woocommerce-cart tr.cart_item td.product-name { padding-inline-end: 1.9rem !important; }
	.woocommerce-cart tr.cart_item td.product-price { font-size: 0.88rem; color: #777; align-self: start; }
	.woocommerce-cart tr.cart_item td.product-quantity, .woocommerce-cart tr.cart_item td.product-subtotal { margin-top: 0.45rem; padding-top: 0.75rem; border-top: 0 !important; }
	.woocommerce-cart tr.cart_item td.product-quantity { align-self: center; }
	.woocommerce-cart tr.cart_item td.product-subtotal { align-self: center; font-size: 1.05rem; }
	.woocommerce-cart tr.cart_item td.product-remove { top: 0.6rem; inset-inline-end: 0.6rem; }
	.woocommerce-cart table.cart tr.cart_item td.product-remove a.remove { width: 28px; height: 28px; font-size: 1.05rem; }
	.woocommerce-cart table.shop_table_responsive tr:not(.cart_item) { display: block; }
	.woocommerce-cart table.cart td.actions { display: block; background: #fff; border: 1px solid #ece6db !important; border-radius: 20px; padding: 1rem !important; margin: 0 0 1rem; box-sizing: border-box; }
}


/* ---------- cart on tablets and desktop: no table lines, each product is a card ---------- */
@media (min-width: 901px) {
	.woocommerce-cart table.shop_table.cart, .woocommerce-cart table.shop_table.cart tbody { display: block; width: 100%; border: 0; }
	.woocommerce-cart table.shop_table.cart thead { display: none; }
	.woocommerce-cart table.cart tr.cart_item { display: grid; grid-template-columns: 104px minmax(0, 1fr) auto 120px 40px; grid-template-areas: "thumb name qty sub remove" "thumb price qty sub remove"; column-gap: 1.25rem; row-gap: 0.15rem; align-items: center; background: #fff; border: 1px solid #ece6db; border-radius: 22px; padding: 1rem 1.25rem; margin: 0 0 0.9rem; transition: box-shadow 0.2s ease, border-color 0.2s ease; }
	.woocommerce-cart table.cart tr.cart_item:hover { border-color: #d9d1c3; box-shadow: 0 6px 22px rgba(0, 0, 0, 0.06); }
	.woocommerce-cart table.cart tr.cart_item td { border: 0 !important; padding: 0 !important; background: transparent !important; text-align: start; }
	.woocommerce-cart table.cart tr.cart_item td.product-thumbnail { grid-area: thumb; }
	.woocommerce-cart table.cart tr.cart_item td.product-thumbnail img { width: 104px; border-radius: 16px; }
	.woocommerce-cart table.cart tr.cart_item td.product-name { grid-area: name; align-self: end; font-size: 1.05rem; }
	.woocommerce-cart table.cart tr.cart_item td.product-price { grid-area: price; align-self: start; font-size: 0.92rem; color: #777; }
	.woocommerce-cart table.cart tr.cart_item td.product-quantity { grid-area: qty; }
	.woocommerce-cart table.cart tr.cart_item td.product-subtotal { grid-area: sub; text-align: end; font-size: 1.1rem; }
	.woocommerce-cart table.cart tr.cart_item td.product-remove { grid-area: remove; justify-self: end; }
	.woocommerce-cart table.cart td.product-remove a.remove { width: 36px; height: 36px; font-size: 1.25rem; }
	.woocommerce-cart table.shop_table.cart tr:not(.cart_item) { display: block; }
	.woocommerce-cart table.cart td.actions { display: block; background: #fff; border: 1px solid #ece6db !important; border-radius: 22px; padding: 1rem 1.25rem !important; }
}


/* narrower desktops / landscape tablets: the cart column is too narrow for one long row, so the card keeps the compact phone arrangement */
@media (min-width: 901px) and (max-width: 1200px) {
	.woocommerce-cart table.cart tr.cart_item { position: relative; grid-template-columns: 96px minmax(0, 1fr) auto; grid-template-areas: "thumb name name" "thumb price price" "qty qty sub"; column-gap: 0; row-gap: 0.25rem; padding: 0.9rem; }
	.woocommerce-cart table.cart tr.cart_item td.product-thumbnail { padding-inline-end: 0.9rem !important; }
	.woocommerce-cart table.cart tr.cart_item td.product-thumbnail img { width: 96px; }
	.woocommerce-cart table.cart tr.cart_item td.product-name { align-self: start; padding-inline-end: 2rem !important; }
	.woocommerce-cart table.cart tr.cart_item td.product-quantity, .woocommerce-cart table.cart tr.cart_item td.product-subtotal { margin-top: 0.45rem; padding-top: 0.75rem !important; border-top: 0 !important; }
	.woocommerce-cart table.cart tr.cart_item td.product-remove { position: absolute; top: 0.6rem; inset-inline-end: 0.6rem; }
	.woocommerce-cart table.cart td.product-remove a.remove { width: 28px; height: 28px; font-size: 1.05rem; }
}


/* ---------- totals: no stacked lines. Rows are separated by space; the only line is one above Total, and the green coupon row has none around it ---------- */
.woocommerce-cart .cart_totals tr, .woocommerce-cart .cart_totals th, .woocommerce-cart .cart_totals td,
.woocommerce-checkout table.shop_table tfoot tr, .woocommerce-checkout table.shop_table tfoot th, .woocommerce-checkout table.shop_table tfoot td { border-top: 0 !important; border-bottom: 0 !important; }
.woocommerce-cart .cart_totals tr.order-total, .woocommerce-checkout table.shop_table tfoot tr.order-total { border-top: 1px solid rgba(0, 0, 0, 0.14) !important; }
.woocommerce-cart .cart_totals tr.order-total th, .woocommerce-cart .cart_totals tr.order-total td, .woocommerce-checkout table.shop_table tfoot tr.order-total th, .woocommerce-checkout table.shop_table tfoot tr.order-total td { padding-top: 1rem; }
@media (min-width: 901px) {
	.woocommerce-cart .cart_totals tr.order-total { border-top: 0 !important; }
	.woocommerce-cart .cart_totals tr.order-total th, .woocommerce-cart .cart_totals tr.order-total td { border-top: 1px solid rgba(0, 0, 0, 0.14) !important; }
}
.woocommerce-cart .cart_totals tr.cart-discount th, .woocommerce-cart .cart_totals tr.cart-discount td { margin: 0; }
.woocommerce-cart .cart_totals tr.shynx-delivery th, .woocommerce-cart .cart_totals tr.shynx-delivery td { padding-top: 0.2rem; }


/* coupons switched off: the actions row only holds a hidden "update cart" button, so it must not draw an empty card */
.woocommerce-cart table.cart td.actions:not(:has(.coupon)) { display: none !important; }
.woocommerce-cart table.cart tr:not(.cart_item):has(.coupon) { display: block; }


/* phones and tablets: the totals sit right under the last product (the gap was three stacked spaces: table margin + grid gap + card margin) */
@media (max-width: 900px) {
	.woocommerce-cart .woocommerce { row-gap: 0; }
	.woocommerce-cart table.shop_table.cart { margin-bottom: 0; }
	.woocommerce-cart .cart-collaterals { margin-top: 0; }
}


/* checkout payment block: the privacy text sits right under the payment card (it had four stacked spaces: card margin + list margin + the place-order padding) */
.woocommerce-checkout #payment ul.payment_methods { margin: 1rem 0 0.9rem; }
.woocommerce-checkout #payment ul.payment_methods li:last-child { margin-bottom: 0; }
.woocommerce-checkout #payment .form-row.place-order { padding: 0; margin: 0; }
.woocommerce-checkout #payment .woocommerce-terms-and-conditions-wrapper { margin: 0 0 1rem; padding: 0; }
.woocommerce-checkout #payment .woocommerce-privacy-policy-text p { margin: 0; line-height: 1.5; }
.woocommerce-checkout #payment #place_order { margin: 0; }


/* ---------- offers in the cart / checkout: the lines of one offer read as ONE grouped card (main line, products that come with it, free gift) ---------- */
.cart-offer-badge { display: inline-block; align-self: flex-start; margin: 0 0 0.4rem; padding: 0.15rem 0.6rem; border-radius: 999px; background: #111; color: #fff; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1.4; max-width: 100%; overflow-wrap: anywhere; }
.cart-offer-badge.is-part { background: #f4f1ec; color: #333; }
.cart-offer-badge.is-gift { background: #e4f3ea; color: #17623a; }
.cart-offer-badge + .cart-item__title, .cart-offer-badge + a, .cart-offer-badge + span.cart-item__title { display: block; }
.cart-included { color: #6b6b6b; font-size: 0.9rem; font-weight: 500; }
.cart-gift-qty { font-weight: 600; }
.woocommerce-cart table.cart tr.offer-line--main { margin-bottom: 0 !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; border-bottom-color: transparent !important; }
.woocommerce-cart table.cart tr.offer-line--required, .woocommerce-cart table.cart tr.offer-line--gift { margin-top: 0 !important; border-top: 1px dashed #d9d1c3 !important; border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; background: #faf8f4 !important; }
.woocommerce-cart table.cart tr.offer-line--required { margin-bottom: 0 !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; border-bottom-color: transparent !important; }
.woocommerce-cart table.cart tr.offer-line--gift { margin-bottom: 0.85rem !important; }
.woocommerce-cart table.cart tr.offer-line--required:hover, .woocommerce-cart table.cart tr.offer-line--gift:hover { box-shadow: none !important; }
.woocommerce-cart table.cart tr.offer-line--required td.product-thumbnail img, .woocommerce-cart table.cart tr.offer-line--gift td.product-thumbnail img { width: 72px; }
@media (min-width: 901px) {
	.woocommerce-cart table.cart tr.offer-line--required, .woocommerce-cart table.cart tr.offer-line--gift { grid-template-columns: 104px minmax(0, 1fr) auto 120px 40px; }
	.woocommerce-cart table.cart tr.offer-line--required td.product-thumbnail, .woocommerce-cart table.cart tr.offer-line--gift td.product-thumbnail { justify-self: center; }
}
@media (max-width: 900px) {
	.woocommerce-cart table.cart tr.offer-line--required td.product-thumbnail img, .woocommerce-cart table.cart tr.offer-line--gift td.product-thumbnail img { width: 64px; }
}
.woocommerce-checkout table.shop_table tr.offer-line--required td, .woocommerce-checkout table.shop_table tr.offer-line--gift td { padding-top: 0.4rem; }
.woocommerce-cart table.cart tr.offer-line td.product-price { display: none !important; } /* the amount is already shown once on the right: no repeated "Included" / "FREE" under the name */
