/* ============================================================
   oloi — WooCommerce cart / checkout / shop / product styling
   Themed to match the prototype's checkout modal & cards.
   ============================================================ */

.oloi-wc {
	padding: 120px 24px 80px;
}
.oloi-wc__inner {
	max-width: 1080px;
	margin: 0 auto;
}

/* Footer logo — keep it identical to the rest of the site on WC pages */
.oloi-footer__logo { opacity: 0.5 !important; height: 96px !important; width: auto !important; }
@media (max-width: 767px) { .oloi-footer__logo { height: 72px !important; } }

/* Font enforcement — brand fonts everywhere on WC pages */
.oloi-wc,
.oloi-wc p, .oloi-wc span, .oloi-wc a, .oloi-wc li, .oloi-wc td, .oloi-wc th,
.oloi-wc label, .oloi-wc legend, .oloi-wc input, .oloi-wc select, .oloi-wc textarea,
.oloi-wc button, .oloi-wc .select2-container {
	font-family: "DM Sans", sans-serif;
}

/* Form rows & labels */
.oloi-wc .form-row { margin: 0 0 14px; }
.oloi-wc .woocommerce-billing-fields__field-wrapper .form-row,
.oloi-wc .woocommerce-additional-fields__field-wrapper .form-row { margin-bottom: 12px; }
.oloi-wc form .form-row label {
	display: block;
	font-size: 12px;
	color: var(--dim);
	margin-bottom: 6px;
	letter-spacing: 0.02em;
}
.oloi-wc .required { color: var(--terra); border: none; }
.oloi-wc .optional { color: var(--dim); }

/* Validation states */
.oloi-wc .woocommerce-invalid input.input-text,
.oloi-wc .woocommerce-invalid select { border-color: var(--terra) !important; }
.oloi-wc .woocommerce-validated input.input-text { border-color: var(--amber) !important; }

/* select2 dropdowns (kept from WC core) themed to match text inputs */
.oloi-wc .select2-container--default .select2-selection--single {
	border: 1px solid var(--border) !important;
	border-radius: 0 !important;
	background: var(--bg);
}
.oloi-wc .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--text);
	line-height: 42px;
	padding-left: 14px;
	font-size: 13px;
}
.oloi-wc .select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; }
.oloi-wc .select2-dropdown { border-color: var(--border); border-radius: 0; }
.oloi-wc .select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--amber); }

/* Quantity input */
.oloi-wc .quantity input.qty {
	width: 64px;
	text-align: center;
	padding: 8px !important;
	border: 1px solid var(--border) !important;
	border-radius: 0 !important;
}

/* Headings */
.oloi-wc h1, .oloi-wc h2 {
	font-family: "Cormorant Garamond", serif;
	font-weight: 400;
	color: var(--text);
	letter-spacing: 0.01em;
}
.oloi-wc .woocommerce-products-header__title,
.oloi-wc h1.entry-title,
.oloi-wc .product_title {
	font-size: clamp(30px, 4vw, 46px);
	margin-bottom: 24px;
}

/* Eyebrow style labels */
.oloi-wc .woocommerce-billing-fields > h3,
.oloi-wc .woocommerce-shipping-fields h3,
.oloi-wc #order_review_heading,
.oloi-wc .woocommerce-additional-fields h3 {
	font-family: "DM Sans", sans-serif;
	font-size: 11px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--amber);
	font-weight: 400;
	margin: 0 0 20px;
}

/* Inputs */
.oloi-wc .input-text,
.oloi-wc input[type="text"],
.oloi-wc input[type="email"],
.oloi-wc input[type="tel"],
.oloi-wc input[type="password"],
.oloi-wc input[type="number"],
.oloi-wc textarea,
.oloi-wc select,
.oloi-wc .select2-selection {
	width: 100%;
	padding: 11px 14px !important;
	background: var(--bg);
	color: var(--text);
	border: 1px solid var(--border) !important;
	font-size: 13px;
	border-radius: 0 !important;
	outline: none;
	box-shadow: none !important;
	transition: border-color 0.2s;
	font-family: "DM Sans", sans-serif;
	min-height: 44px;
	line-height: 1.4;
}
.oloi-wc .input-text:focus,
.oloi-wc textarea:focus,
.oloi-wc select:focus {
	border-color: var(--amber) !important;
}
.oloi-wc .select2-container--default .select2-selection--single {
	height: 44px;
	display: flex;
	align-items: center;
}
.oloi-wc label { font-size: 13px; color: var(--dim); }
.oloi-wc .form-row { margin-bottom: 14px; }

/* Buttons */
.oloi-wc .button,
.oloi-wc button.button,
.oloi-wc input.button,
.oloi-wc #place_order,
.oloi-wc .wc-block-components-button {
	background: var(--amber) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 14px 32px !important;
	font-family: "DM Sans", sans-serif !important;
	font-size: 12px !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	font-weight: 400 !important;
	cursor: pointer;
	transition: opacity 0.2s;
	line-height: 1.4 !important;
}
.oloi-wc .button:hover,
.oloi-wc #place_order:hover { opacity: 0.85; }

/* Secondary / ghost buttons (e.g. "Update cart", "Apply coupon") */
.oloi-wc .cart .actions .button[name="update_cart"],
.oloi-wc .actions .coupon .button {
	background: transparent !important;
	color: var(--terra) !important;
	border: 1px solid var(--terra) !important;
}

/* Tables (cart / order review) */
.oloi-wc table.shop_table {
	border: 1px solid var(--border-l);
	border-radius: 0;
	border-collapse: collapse;
	background: var(--bg);
}
.oloi-wc table.shop_table th,
.oloi-wc table.shop_table td {
	border-top: 1px solid var(--border-l);
	padding: 16px;
	font-size: 14px;
	color: var(--text);
}
.oloi-wc table.shop_table th {
	font-family: "DM Sans", sans-serif;
	font-weight: 400;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dim);
}
.oloi-wc .cart-subtotal, .oloi-wc .order-total { font-size: 16px; }
.oloi-wc .order-total .amount,
.oloi-wc .cart_totals h2 { font-family: "Cormorant Garamond", serif; }
.oloi-wc .amount { color: var(--text); }

/* Detail panels — same tinted pattern background as the footer */
.oloi-wc .cart_totals,
.oloi-wc #order_review,
.oloi-wc .woocommerce-billing-fields__field-wrapper,
.oloi-wc .woocommerce-additional-fields__field-wrapper,
.oloi-wc .shipping_address {
	background: linear-gradient(oklch(87% 0.035 68 / 0.62), oklch(87% 0.035 68 / 0.62)), var(--pattern);
	background-size: 460px;
	background-attachment: fixed;
	border: 1px solid var(--border);
	padding: 24px 26px;
}
/* Order-review "cart content" sits directly on the frosted panel (no white table) */
.oloi-wc #order_review table.shop_table {
	background: transparent;
	border: none;
}
.oloi-wc #order_review table.shop_table th,
.oloi-wc #order_review table.shop_table td {
	border-top: 1px solid var(--border-l);
}
.oloi-wc .woocommerce-billing-fields__field-wrapper,
.oloi-wc .woocommerce-additional-fields__field-wrapper,
.oloi-wc .shipping_address { margin-bottom: 20px; }
/* the eyebrow headings sit above their panel, tops aligned across both columns */
.oloi-wc form.checkout #customer_details,
.oloi-wc form.checkout #order_review_heading { margin-top: 0; }
.oloi-wc .woocommerce-billing-fields > h3,
.oloi-wc .woocommerce-additional-fields > h3,
.oloi-wc .woocommerce-shipping-fields h3,
.oloi-wc #order_review_heading { margin: 0 0 14px; line-height: 1.2; }

/* ---- Coupon: compact bar, not a full-width banner ---- */
.oloi-wc .woocommerce-form-coupon-toggle { margin-bottom: 22px; }
.oloi-wc .woocommerce-form-coupon-toggle .woocommerce-info {
	background: transparent;
	border: 1px dashed var(--border);
	padding: 10px 14px;
	margin: 0;
	font-size: 12px;
	color: var(--dim);
	display: flex;
	align-items: center;
	gap: 6px;
}
.oloi-wc .woocommerce-form-coupon-toggle .woocommerce-info::before,
.oloi-wc .woocommerce-form-coupon-toggle .woocommerce-info::after { content: none; display: none; }
.oloi-wc .woocommerce-form-coupon-toggle .showcoupon { color: var(--amber); text-decoration: underline; }
.oloi-wc form.checkout_coupon {
	border: 1px solid var(--border);
	background: transparent;
	padding: 18px;
	margin-bottom: 22px;
}
.oloi-wc form.checkout_coupon .form-row { display: inline-block; vertical-align: middle; margin: 0 8px 0 0; }
.oloi-wc form.checkout_coupon .form-row-first { width: auto; min-width: 220px; }
.oloi-wc form.checkout_coupon .button { padding: 12px 22px !important; }

/* ---- Order-review table: alignment, fonts, spacing ---- */
.oloi-wc #order_review table.shop_table { width: 100%; margin: 0; }
.oloi-wc #order_review table.shop_table thead th {
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--dim);
	font-weight: 400;
	padding: 0 0 12px;
	border-top: none;
}
.oloi-wc #order_review table.shop_table th.product-name,
.oloi-wc #order_review table.shop_table td.product-name { text-align: left; padding-left: 0; }
.oloi-wc #order_review table.shop_table th.product-total,
.oloi-wc #order_review table.shop_table td.product-total,
.oloi-wc #order_review table.shop_table tfoot td,
.oloi-wc #order_review table.shop_table tfoot th + td { text-align: right; padding-right: 0; }
.oloi-wc #order_review table.shop_table td.product-name {
	font-size: 13px;
	color: var(--text);
	padding: 14px 0;
	line-height: 1.5;
}
.oloi-wc #order_review table.shop_table td.product-name .product-quantity {
	color: var(--dim);
	font-size: 12px;
}
.oloi-wc #order_review table.shop_table td.product-total {
	font-size: 13px;
	color: var(--text);
	padding: 14px 0;
	white-space: nowrap;
}
/* Totals footer rows */
.oloi-wc #order_review table.shop_table tfoot th {
	text-align: left;
	font-weight: 400;
	font-size: 13px;
	color: var(--dim);
	padding: 12px 0;
}
.oloi-wc #order_review table.shop_table tfoot td { font-size: 13px; padding: 12px 0; }
.oloi-wc #order_review table.shop_table tfoot .order-total th { color: var(--text); font-size: 14px; letter-spacing: 0.04em; }
.oloi-wc #order_review table.shop_table tfoot .order-total td .amount {
	font-family: "Cormorant Garamond", serif;
	font-size: 26px;
	font-weight: 400;
	color: var(--text);
}

/* Payment methods */
.oloi-wc #payment,
.oloi-wc ul.wc_payment_methods {
	background: transparent;
	border: none;
	padding: 0;
}
.oloi-wc ul.wc_payment_methods li {
	border: 1px solid var(--border);
	padding: 14px 16px;
	margin-bottom: 10px;
	list-style: none;
	background: transparent;
}
.oloi-wc ul.wc_payment_methods li input:checked ~ label {
	color: var(--text);
}
.oloi-wc .payment_box {
	background: oklch(76% 0.11 76 / 0.12) !important;
	border-left: 2px solid var(--amber);
	color: var(--dim);
	font-size: 13px;
}
.oloi-wc .payment_box::before { display: none; }

/* Radios & checkboxes */
.oloi-wc input[type="radio"],
.oloi-wc input[type="checkbox"] { accent-color: var(--amber); }

/* Notices */
.oloi-wc .woocommerce-message,
.oloi-wc .woocommerce-info {
	border-top-color: var(--amber);
	background: var(--bg2);
	color: var(--text);
}
.oloi-wc .woocommerce-error { border-top-color: var(--terra); background: var(--bg2); }
.oloi-wc .woocommerce-message .button,
.oloi-wc .woocommerce-info .button {
	background: var(--amber) !important;
}

/* Product grid on shop archive */
.oloi-wc ul.products li.product h2,
.oloi-wc ul.products li.product .woocommerce-loop-product__title {
	font-family: "Cormorant Garamond", serif;
	font-weight: 400;
	font-size: 22px;
	color: var(--text);
}
.oloi-wc ul.products li.product .price {
	color: var(--text);
	font-family: "Cormorant Garamond", serif;
	font-size: 20px;
}
.oloi-wc ul.products li.product .price del { color: var(--dim); }

/* Single product */
.oloi-wc div.product .price,
.oloi-wc div.product span.price { color: var(--text); font-family: "Cormorant Garamond", serif; font-size: 28px; }
.oloi-wc .woocommerce-tabs ul.tabs li.active { border-bottom-color: var(--amber); }

/* -----------------------------------------------------------------
   Checkout layout: TWO columns on desktop (form left, summary right).
   flow-root on the form contains the floats so the footer stays below.
   ----------------------------------------------------------------- */
.oloi-wc form.checkout.woocommerce-checkout { display: flow-root; }

@media (min-width: 980px) {
	.oloi-wc form.checkout #customer_details {
		float: left;
		width: 54%;
	}
	.oloi-wc form.checkout #order_review_heading,
	.oloi-wc form.checkout #order_review {
		float: right;
		width: 42%;
		clear: right;
	}
	/* Collapse billing + shipping/notes into ONE left column (not two) */
	.oloi-wc form.checkout #customer_details .col2-set { display: block; }
	.oloi-wc form.checkout #customer_details .col-1,
	.oloi-wc form.checkout #customer_details .col-2 {
		float: none;
		width: 100%;
		max-width: 100%;
		margin: 0 0 28px;
		padding: 0;
	}
}

/* Sticky order summary on desktop for a tidy scroll */
@media (min-width: 980px) {
	.oloi-wc form.checkout #order_review { position: sticky; top: 96px; }
}

@media (max-width: 767px) {
	.oloi-wc { padding: 96px 16px 64px; }
}