/* ==========================================================================
   Ziora: WooCommerce cart, checkout, account, notices, reviews.
   Styles WooCommerce's own markup (no template copies) so payment gateways
   and extensions keep working. Loaded on cart/checkout/account/product pages.
   ========================================================================== */

/* -------------------------------------------------------------------------
   Notices
   ------------------------------------------------------------------------- */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
	position: relative;
	display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
	margin: 0 0 20px; padding: 16px 20px;
	list-style: none;
	border-radius: var(--radius);
	background: var(--white);
	border: 1px solid var(--line);
	border-left: 3px solid var(--green);
	font-size: var(--t-sm);
}
.woocommerce-error { border-left-color: var(--danger); display: block; }
.woocommerce-error li + li { margin-top: 6px; }
.woocommerce-info { border-left-color: var(--gold); }
.woocommerce-message .button, .woocommerce-info .button { order: 2; margin-left: auto; min-height: 38px; padding: 8px 18px; }
.woocommerce-notice--error { border-left-color: var(--danger); }

/* -------------------------------------------------------------------------
   Forms
   ------------------------------------------------------------------------- */
.woocommerce form .form-row { display: grid; gap: 6px; margin: 0 0 16px; padding: 0; }
.woocommerce form .form-row label { font-size: var(--t-sm); font-weight: 600; color: var(--ink); }
.woocommerce form .form-row .required { color: var(--danger); text-decoration: none; border: 0; }
.woocommerce form .form-row .optional { font-weight: 400; color: var(--ink-soft); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row .input-text,
.woocommerce form .form-row select,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form textarea {
	width: 100%;
	min-height: var(--tap);
	padding: 12px 16px;
	border: 1px solid var(--line-strong);
	border-radius: var(--radius-sm);
	background: var(--white);
	font-size: 1rem; /* 16px: no iOS zoom on focus */
	transition: border-color 0.2s var(--ease), box-shadow 0.2s var(--ease);
}
.woocommerce form .form-row select { appearance: none; padding-right: 40px; background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E2E2E' stroke-width='1.6'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 16px; }
.woocommerce form .form-row textarea { min-height: 96px; resize: vertical; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(75, 93, 65, 0.15); }
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select { border-color: var(--danger); }
.woocommerce form .form-row .description { font-size: var(--t-xs); color: var(--ink-soft); margin: 0; }
.woocommerce form .form-row-first, .woocommerce form .form-row-last { width: 100%; }
@media (min-width: 600px) {
	.woocommerce form .woocommerce-billing-fields__field-wrapper,
	.woocommerce form .woocommerce-shipping-fields__field-wrapper,
	.woocommerce form .woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
	.woocommerce form .form-row-wide, .woocommerce form .form-row.notes { grid-column: 1 / -1; }
}
.woocommerce form .is-fixed-country { display: none; } /* Nigeria only: shown as text by WooCommerce, not needed */
.woocommerce form .woocommerce-input-wrapper { display: block; }
.woocommerce-form__label-for-checkbox { display: inline-flex !important; align-items: center; gap: 10px; font-weight: 500 !important; cursor: pointer; }
.woocommerce-form__input-checkbox, input[type="checkbox"], input[type="radio"] { width: 18px; height: 18px; accent-color: var(--green); }

/* -------------------------------------------------------------------------
   Tables (cart, order review, order details)
   ------------------------------------------------------------------------- */
.shop_table { width: 100%; border-collapse: collapse; font-size: var(--t-sm); }
.shop_table th, .shop_table td { padding: 14px 8px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.shop_table thead th { font-size: var(--t-xs); font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-soft); }
.shop_table .amount { font-weight: 600; white-space: nowrap; }
.shop_table tfoot th { font-weight: 500; color: var(--ink-soft); }
.shop_table .order-total th, .shop_table .order-total td { font-size: 1rem; color: var(--ink); border-bottom: 0; }
.shop_table .order-total .amount { font-family: var(--f-text); font-size: 1.6rem; font-weight: 600; }
.woocommerce-shipping-methods { list-style: none; margin: 0; padding: 0; }
.woocommerce-shipping-methods li { display: flex; gap: 8px; align-items: center; justify-content: flex-end; }

/* -------------------------------------------------------------------------
   Cart page
   ------------------------------------------------------------------------- */
.commerce-page { padding-bottom: var(--section); }
.woocommerce-cart .woocommerce { display: grid; gap: clamp(24px, 4vw, 56px); }
@media (min-width: 1000px) {
	.woocommerce-cart .woocommerce { grid-template-columns: 1fr 380px; align-items: start; }
	.woocommerce-cart .woocommerce-notices-wrapper { grid-column: 1 / -1; }
	.woocommerce-cart .cart-collaterals { position: sticky; top: calc(var(--header-h) + 20px); }
}
.woocommerce-cart-form .product-thumbnail img { width: 72px; aspect-ratio: 3 / 4; object-fit: contain; border-radius: var(--radius-sm); background: var(--linen); mix-blend-mode: multiply; }
.woocommerce-cart-form .product-name a { font-family: var(--f-text); font-size: 1.2rem; font-weight: 500; text-decoration: none; }
.woocommerce-cart-form .product-remove a { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; text-decoration: none; font-size: 1.3rem; color: var(--ink-soft); }
.woocommerce-cart-form .product-remove a:hover { background: var(--greige); color: var(--danger); }
.woocommerce-cart-form .quantity { height: 40px; }
.woocommerce-cart-form .actions { padding-top: 20px; }
.woocommerce-cart-form .coupon { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.woocommerce-cart-form .coupon label { display: none; }
.woocommerce-cart-form .coupon .input-text { flex: 1 1 180px; min-height: 44px; padding: 10px 16px; border: 1px solid var(--line-strong); border-radius: var(--pill); background: var(--white); }
.woocommerce-cart-form button[name="update_cart"] { --btn-bg: transparent; --btn-fg: var(--ink); --btn-bd: var(--line-strong); }
@media (max-width: 767px) {
	.woocommerce-cart-form table.cart thead { display: none; }
	.woocommerce-cart-form table.cart tr.cart_item { display: grid; grid-template-columns: 80px 1fr auto; gap: 4px 14px; padding: 16px 0; border-bottom: 1px solid var(--line); position: relative; }
	.woocommerce-cart-form table.cart td { padding: 0; border: 0; }
	.woocommerce-cart-form td.product-thumbnail { grid-row: 1 / span 3; }
	.woocommerce-cart-form td.product-remove { position: absolute; top: 12px; right: 0; }
	.woocommerce-cart-form td.product-name { grid-column: 2 / 4; padding-right: 36px; }
	.woocommerce-cart-form td.product-price { display: none; }
	.woocommerce-cart-form td.product-quantity { grid-column: 2; }
	.woocommerce-cart-form td.product-subtotal { grid-column: 3; align-self: center; }
	.woocommerce-cart-form td.actions { display: block; padding-top: 16px; }
}
.cart_totals { padding: 28px; border-radius: var(--radius-lg); background: var(--white); }
.cart_totals > h2 { font-family: var(--f-display); font-size: 1.8rem; font-weight: 400; margin-bottom: 12px; }
.cart_totals .shop_table th { padding-left: 0; }
.cart_totals .shop_table td { text-align: right; padding-right: 0; }
.wc-proceed-to-checkout { padding-top: 18px; }
.wc-proceed-to-checkout .checkout-button { width: 100%; min-height: 56px; }
.cart-empty.woocommerce-info { font-size: var(--t-lg); }
.return-to-shop { margin-top: 12px; }

/* -------------------------------------------------------------------------
   Checkout
   ------------------------------------------------------------------------- */
.is-checkout-flow .wa-float { display: none; }
.woocommerce-checkout .commerce-page { padding-top: clamp(20px, 3vw, 40px); }
.woocommerce-form-coupon-toggle .woocommerce-info { background: transparent; border: 1px dashed var(--line-strong); border-left-width: 1px; }
.checkout_coupon { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; padding: 18px; margin-bottom: 20px; border-radius: var(--radius); background: var(--white); }
.checkout_coupon p:first-child { flex-basis: 100%; font-size: var(--t-sm); color: var(--ink-soft); }
.checkout_coupon .form-row { margin: 0 !important; }
.checkout_coupon .form-row-first { flex: 1 1 200px; }

form.checkout { display: grid; gap: clamp(24px, 4vw, 56px); }
@media (min-width: 1000px) {
	form.checkout { grid-template-columns: 1fr 440px; align-items: start; }
	form.checkout > .woocommerce-NoticeGroup { grid-column: 1 / -1; }
	form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 3; }
	form.checkout #order_review_heading { grid-column: 2; grid-row: 1; margin: 0; }
	form.checkout #order_review { grid-column: 2; grid-row: 2; position: sticky; top: 24px; }
}
#customer_details .col-1, #customer_details .col-2 { width: 100%; float: none; }
#customer_details h3 { font-family: var(--f-display); font-size: 1.7rem; font-weight: 400; margin: 0 0 18px; }
#customer_details .woocommerce-billing-fields h3::before { content: "1"; }
#customer_details .woocommerce-additional-fields h3::before { content: "2"; }
#customer_details h3::before {
	display: inline-grid; place-items: center; width: 30px; height: 30px; margin-right: 12px; vertical-align: 4px;
	border-radius: 50%; background: var(--green); color: var(--white);
	font-family: var(--f-text); font-size: var(--t-sm); font-weight: 700;
}
#ship-to-different-address { font-family: var(--f-text) !important; font-size: var(--t-sm) !important; font-weight: 600; margin: 8px 0 16px !important; }
#ship-to-different-address::before { display: none !important; }
.woocommerce-additional-fields { margin-top: 16px; }
#order_review_heading { font-family: var(--f-display); font-size: 1.7rem; font-weight: 400; margin-bottom: 14px; }
#order_review { padding: 24px; border-radius: var(--radius-lg); background: var(--white); }
#order_review .shop_table td.product-name { font-weight: 500; }
#order_review .shop_table .product-quantity { font-weight: 600; color: var(--ink-soft); }
#order_review .shop_table td:last-child, #order_review .shop_table th:last-child { text-align: right; }
.checkout-secure { display: flex; gap: 10px; align-items: flex-start; margin: 18px 0 6px; font-size: var(--t-xs); color: var(--ink-soft); }
.checkout-secure .icon { color: var(--green); width: 18px; height: 18px; }
#payment { margin-top: 8px; }
#payment ul.payment_methods { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
#payment ul.payment_methods li { padding: 14px 16px; border: 1px solid var(--line-strong); border-radius: var(--radius); }
#payment ul.payment_methods li:has(input:checked) { border-color: var(--green); box-shadow: 0 0 0 1px var(--green); }
#payment ul.payment_methods li > label { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; cursor: pointer; }
#payment ul.payment_methods li > label img { max-height: 22px; width: auto; display: inline-block; }
#payment ul.payment_methods li input { margin: 0 8px 0 0; vertical-align: middle; }
#payment .payment_box { margin-top: 10px; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--beige); font-size: var(--t-sm); color: var(--ink-soft); }
#payment .payment_box p:last-child { margin-bottom: 0; }
.woocommerce-terms-and-conditions-wrapper { font-size: var(--t-xs); color: var(--ink-soft); margin-bottom: 16px; }
.woocommerce-terms-and-conditions-wrapper a { color: var(--green); }
#place_order { width: 100%; min-height: 58px; font-size: 0.9375rem; }
#place_order.is-submitting { opacity: 0.7; pointer-events: none; }
.blockUI.blockOverlay { background: rgba(248, 244, 237, 0.7) !important; }

/* -------------------------------------------------------------------------
   Thank-you page
   ------------------------------------------------------------------------- */
.thankyou { max-width: 760px; margin-inline: auto; padding-top: clamp(28px, 5vw, 64px); }
.thankyou__hero { text-align: center; display: grid; gap: 10px; justify-items: center; margin-bottom: 28px; }
.thankyou__mark { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--green); color: var(--white); margin-bottom: 8px; }
.thankyou__mark .icon { width: 30px; height: 30px; }
.thankyou__title { font-family: var(--f-display); font-size: clamp(2.4rem, 1.8rem + 2.4vw, 3.6rem); font-weight: 400; line-height: 1; }
.thankyou .woocommerce-thankyou-order-received { border: 0; background: none; padding: 0; justify-content: center; color: var(--ink-soft); font-size: var(--t-lg); }
.thankyou__status { display: grid; gap: 4px; margin-top: 10px; padding: 16px 20px; border-radius: var(--radius); text-align: left; max-width: 560px; border-left: 3px solid var(--gold); background: var(--white); }
.thankyou__status strong { font-size: var(--t-sm); letter-spacing: 0.06em; text-transform: uppercase; }
.thankyou__status span { font-size: var(--t-sm); color: var(--ink-soft); }
.thankyou__status--paid { border-left-color: var(--green); }
.thankyou__overview { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: 0 0 28px; padding: 0; list-style: none; border-radius: var(--radius); overflow: hidden; background: var(--line); }
.thankyou__overview li { display: grid; gap: 2px; padding: 14px 16px; background: var(--white); font-size: var(--t-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-soft); }
.thankyou__overview strong { font-size: var(--t-sm); letter-spacing: 0; text-transform: none; color: var(--ink); }
@media (min-width: 700px) { .thankyou__overview { grid-template-columns: repeat(4, 1fr); } }
.thankyou__next { display: grid; gap: 12px; margin-bottom: 24px !important; }
.thankyou__next li { display: flex; gap: 14px; padding: 16px; border-radius: var(--radius); background: var(--white); font-size: var(--t-sm); color: var(--ink-soft); }
.thankyou__next li > span { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--sage-soft); color: var(--green-ink); font-weight: 700; }
.thankyou__next strong { display: block; color: var(--ink); }
.thankyou__help { text-align: center; font-size: var(--t-sm); color: var(--ink-soft); margin-bottom: 36px; }
.thankyou__help a { color: var(--green); font-weight: 600; }
.thankyou__actions { justify-content: center; }
.woocommerce-order-details, .woocommerce-customer-details, .woocommerce-bacs-bank-details { padding: 24px; margin-bottom: 20px; border-radius: var(--radius-lg); background: var(--white); }
.woocommerce-order-details__title, .woocommerce-column__title, .wc-bacs-bank-details-heading { font-family: var(--f-display); font-size: 1.6rem; font-weight: 400; margin-bottom: 12px; }
.woocommerce-customer-details address { font-style: normal; line-height: 1.7; font-size: var(--t-sm); }
.wc-bacs-bank-details { list-style: none; padding: 0; display: grid; gap: 6px; font-size: var(--t-sm); }

/* -------------------------------------------------------------------------
   My account
   ------------------------------------------------------------------------- */
.woocommerce-account .woocommerce { display: grid; gap: clamp(20px, 4vw, 48px); }
@media (min-width: 900px) { .woocommerce-account.logged-in .woocommerce { grid-template-columns: 240px 1fr; align-items: start; } }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
@media (min-width: 900px) { .woocommerce-MyAccount-navigation ul { flex-direction: column; } }
.woocommerce-MyAccount-navigation a { display: block; padding: 10px 16px; border-radius: var(--pill); text-decoration: none; font-size: var(--t-sm); font-weight: 500; }
.woocommerce-MyAccount-navigation .is-active a { background: var(--ink); color: var(--beige); }
.woocommerce-MyAccount-content { display: grid; gap: 16px; }
.woocommerce-MyAccount-content mark { background: var(--sage-soft); padding: 0 4px; border-radius: 4px; }
.u-columns.col2-set { display: grid; gap: 28px; }
@media (min-width: 900px) { .u-columns.col2-set { grid-template-columns: 1fr 1fr; } }
.woocommerce-form-login, .woocommerce-form-register, .woocommerce-ResetPassword { padding: 28px; border-radius: var(--radius-lg); background: var(--white); }
.woocommerce-account h2 { font-family: var(--f-display); font-size: 1.8rem; font-weight: 400; margin-bottom: 14px; }
.woocommerce-LostPassword { font-size: var(--t-sm); }

/* -------------------------------------------------------------------------
   Product reviews (WooCommerce comments template)
   ------------------------------------------------------------------------- */
#reviews { display: grid; gap: 24px; }
#reviews .woocommerce-Reviews-title { font-family: var(--f-display); font-size: var(--t-h2); font-weight: 400; line-height: 1; }
#reviews .woocommerce-noreviews { color: var(--ink-soft); }
#reviews ol.commentlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
#reviews .comment_container { display: flex; gap: 14px; padding: 20px; border-radius: var(--radius); background: var(--white); }
#reviews .comment_container img.avatar { width: 44px; height: 44px; border-radius: 50%; }
#reviews .meta { font-size: var(--t-xs); color: var(--ink-soft); }
#reviews .woocommerce-review__verified { color: var(--green); font-style: normal; font-weight: 600; }
#reviews .star-rating span { position: absolute; inset: 0 auto 0 0; overflow: hidden; background: var(--gold-deep); } /* WooCommerce sets the span's width (e.g. 80%) */
#reviews .star-rating { font-size: 0; position: relative; width: 80px; height: 14px; margin-bottom: 4px; background: var(--line-strong); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 14'%3E%3Cg%3E%3Cpath id='s' d='M7 0l2 4.5 5 .7-3.6 3.4.9 5L7 11.3 2.7 13.6l.9-5L0 5.2l5-.7z'/%3E%3Cuse href='%23s' x='16'/%3E%3Cuse href='%23s' x='32'/%3E%3Cuse href='%23s' x='48'/%3E%3Cuse href='%23s' x='64'/%3E%3C/g%3E%3C/svg%3E") no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 14'%3E%3Cg%3E%3Cpath id='s' d='M7 0l2 4.5 5 .7-3.6 3.4.9 5L7 11.3 2.7 13.6l.9-5L0 5.2l5-.7z'/%3E%3Cuse href='%23s' x='16'/%3E%3Cuse href='%23s' x='32'/%3E%3Cuse href='%23s' x='48'/%3E%3Cuse href='%23s' x='64'/%3E%3C/g%3E%3C/svg%3E") no-repeat; }
#review_form_wrapper { padding: 28px; border-radius: var(--radius-lg); background: var(--white); }
#review_form .comment-reply-title { display: block; font-family: var(--f-display); font-size: 1.6rem; font-weight: 400; margin-bottom: 12px; }
#review_form .comment-form { display: grid; gap: 14px; }
#review_form .comment-form p { margin: 0; display: grid; gap: 6px; }
#review_form .comment-form label { font-size: var(--t-sm); font-weight: 600; }
#review_form select#rating { max-width: 220px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--white); }
#review_form .form-submit input[type="submit"] { justify-self: start; }
.woocommerce-verification-required { padding: 18px; border-radius: var(--radius); background: var(--white); color: var(--ink-soft); font-size: var(--t-sm); }