/* ============================================================
   OCCELY — WooCommerce classic cart / checkout / my-account
   Styles WC's default markup into the Occely system.
   ============================================================ */

.woocommerce, .woocommerce-page { font-family:"Jost",system-ui,-apple-system,sans-serif; color:var(--ink); }
.woocommerce .wrap, .woocommerce-page .wrap { } /* page.php already constrains width */

/* buttons -> .btn--ink */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #place_order, .woocommerce-page button.button, .woocommerce .button.alt {
	background:var(--ink); color:#fff; border:1px solid var(--ink); border-radius:0;
	font-family:inherit; font-size:11px; letter-spacing:.22em; text-transform:uppercase; font-weight:400;
	padding:15px 32px; box-shadow:none; transition:background .3s var(--ease),color .3s var(--ease);
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #place_order:hover, .woocommerce .button.alt:hover { background:transparent; color:var(--ink); }

/* prices */
.woocommerce .woocommerce-Price-amount { font-weight:400; letter-spacing:.03em; color:var(--ink); }

/* form fields -> hairline underline like the mockup */
.woocommerce form .form-row label,
.woocommerce-checkout .form-row label,
.woocommerce-account .form-row label {
	font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:#46443f; margin-bottom:8px; display:block;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout input.input-text,
.woocommerce-account input.input-text,
.woocommerce .select2-container .select2-selection,
.woocommerce select, .woocommerce input[type="email"], .woocommerce input[type="tel"], .woocommerce input[type="password"] {
	border:0; border-bottom:1px solid var(--ink); border-radius:0; background:none;
	padding:11px 2px; font-family:inherit; font-size:14px; letter-spacing:.02em; color:var(--ink); box-shadow:none;
}

/* cart + checkout tables */
.woocommerce table.shop_table { border:0; border-radius:0; border-collapse:collapse; }
.woocommerce table.shop_table th { font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--stone); border:0; border-bottom:1px solid var(--line); padding:16px 12px; font-weight:500; }
.woocommerce table.shop_table td { border:0; border-bottom:1px solid var(--line); font-size:13px; letter-spacing:.02em; padding:18px 12px; }
.woocommerce .cart_totals h2, .woocommerce-checkout #order_review_heading,
.woocommerce-cart .cart_totals h2 { font-size:11px; letter-spacing:.26em; text-transform:uppercase; font-weight:500; margin-bottom:18px; }
.woocommerce .cart_totals { background:var(--bone); padding:clamp(22px,3vw,34px); }
.woocommerce a.remove { color:var(--ink) !important; border-radius:0; }
.woocommerce .quantity input.qty { border:1px solid var(--line); border-radius:0; padding:8px; font-family:inherit; }
.woocommerce .coupon input { border:0 !important; border-bottom:1px solid var(--ink) !important; }

/* checkout layout: 2-col on desktop */
@media (min-width:901px) {
	.woocommerce-checkout form.checkout.woocommerce-checkout { display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(28px,4vw,60px); align-items:start; }
	.woocommerce-checkout #customer_details { width:auto; float:none; }
	.woocommerce-checkout #order_review, .woocommerce-checkout #order_review_heading { width:auto !important; float:none !important; }
	.woocommerce-checkout #order_review { background:var(--bone); padding:clamp(22px,3vw,32px); }
}
.woocommerce-checkout #payment { background:transparent; border-radius:0; }
.woocommerce-checkout #payment ul.payment_methods { border:0; padding:0; }
.woocommerce-checkout #payment ul.payment_methods li { border-bottom:1px solid var(--line); padding:14px 0; }

/* my account */
.woocommerce-account .woocommerce { display:grid; grid-template-columns:230px 1fr; gap:clamp(28px,4vw,56px); align-items:start; }
.woocommerce-account .woocommerce-MyAccount-navigation { width:auto; float:none; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.woocommerce-account .woocommerce-MyAccount-navigation li { border-bottom:1px solid var(--line); }
.woocommerce-account .woocommerce-MyAccount-navigation li a { display:block; padding:15px 4px; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:#4a4842; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a, .woocommerce-account .woocommerce-MyAccount-navigation li a:hover { color:var(--ink); font-weight:500; }
.woocommerce-account .woocommerce-MyAccount-content { width:auto; float:none; font-size:14px; line-height:1.8; color:#46443f; }
.woocommerce-account .col2-set .col-1, .woocommerce-account .col2-set .col-2 { float:none; width:100%; }

/* notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error { border-top-color:var(--ink); background:var(--bone); border-radius:0; font-size:13px; }

/* checkout: the WC form ALSO carries .checkout (which style.css makes a grid) -> stop the double/nested grid; only the inner div.checkout is the 2-col */
.occ-checkout.checkout { display:block !important; padding:0 !important; }
.occ-checkout #customer_details .co-sec { margin-bottom:34px; }
.occ-checkout .woocommerce-billing-fields > h3, .occ-checkout .woocommerce-shipping-fields > h3, .occ-checkout .woocommerce-additional-fields > h3 {
	font-size:11px; letter-spacing:.24em; text-transform:uppercase; font-weight:500; margin-bottom:22px; padding-bottom:14px; border-bottom:1px solid var(--line);
}
.occ-checkout .co-review .shop_table { background:none; }
.occ-checkout .co-review .shop_table th, .occ-checkout .co-review .shop_table td { padding:12px 4px; font-size:12.5px; }

/* PDP: neutralise WooCommerce's form.cart / button floats so the mockup .pdp layout holds */
.single-product .pdp form.cart { float:none !important; display:block !important; margin:0 !important; padding:0 !important; border:0 !important; width:auto !important; }
.single-product .pdp form.cart::before, .single-product .pdp form.cart::after { content:none !important; display:none !important; }
.single-product .pdp .pdp__actions { display:flex; flex-direction:column; gap:12px; }
.single-product .pdp .pdp__actions .btn, .single-product .pdp .btn--block { float:none !important; width:100%; }
.single-product .pdp .sizes, .single-product .pdp .swatches { display:flex; flex-wrap:wrap; }
.single-product .pdp .size, .single-product .pdp .swatch { float:none !important; }
.single-product .pdp .pdp__img img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* cart qty stepper number input (sits between the - / + buttons) */
.cart .qty .occ-qty { width:42px; text-align:center; border:0; background:none; font-family:inherit; font-size:12px; letter-spacing:.05em; -moz-appearance:textfield; padding:0; color:var(--ink); }
.cart .qty .occ-qty::-webkit-outer-spin-button, .cart .qty .occ-qty::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

@media (max-width:900px) {
	.woocommerce-account .woocommerce { grid-template-columns:1fr; }
	.woocommerce-account .woocommerce-MyAccount-navigation ul { display:flex; flex-wrap:wrap; gap:4px 18px; border:0; }
	.woocommerce-account .woocommerce-MyAccount-navigation li { border:0; }
}