/* Hemdox Ecommerce Kit — Checkout & Cart (TEREA HUB light / glossy)
Styles WooCommerce's classic checkout + cart markup. WooCommerce keeps all logic. */
.hemdox-checkout, .hemdox-cart {
--co-accent:#7C3AED; --co-flame:#FF3D2E; --co-ink:#101A3A; --co-muted:#5A6076;
--co-border:#E7E5F1; --co-panel:#F7F5FD; --co-bg:#FAF9F6; --co-radius:16px;
color:var(--co-ink); width:100%;
}
.hemdox-checkout *:focus-visible, .hemdox-cart *:focus-visible { outline:2px solid var(--co-accent); outline-offset:1px; }
/* ---------- Headings ---------- */
.hemdox-checkout__head, .hemdox-cart__title { margin:0 0 24px; }
.hemdox-checkout__title, .hemdox-cart__title { margin:0; font-size:clamp(26px,4vw,36px); font-weight:800; letter-spacing:-.5px; color:var(--co-ink); }
.hemdox-checkout__sub { margin:8px 0 0; color:var(--co-muted); font-size:16px; }
/* ============================ CHECKOUT LAYOUT ============================ */
.hemdox-checkout .woocommerce { width:100%; }
/* Neutralise WooCommerce's default float / 48% columns so OUR grid controls layout.
NOTE: do NOT zero the padding here — the cards below set their own padding, and
this selector is more specific, so zeroing it would collapse the card padding. */
.hemdox-checkout #customer_details,
.hemdox-checkout #order_review,
.hemdox-checkout .col2-set,
.hemdox-checkout .col2-set .col-1,
.hemdox-checkout .col2-set .col-2 {
float:none !important; width:100% !important; max-width:none !important; margin:0 !important;
}
/* wrappers stay padding-less; only the cards get inner padding */
.hemdox-checkout #customer_details,
.hemdox-checkout .col2-set { display:block; padding:0 !important; }
/* Desktop: ~60 / 40 split, order summary sticky on the right. */
@media (min-width:981px){
.hemdox-checkout form.woocommerce-checkout {
display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
gap:40px; align-items:start;
}
.hemdox-checkout #customer_details { grid-column:1; grid-row:1 / span 2; }
.hemdox-checkout #order_review_heading{ grid-column:2; grid-row:1; margin:0 0 14px; }
.hemdox-checkout #order_review { grid-column:2; grid-row:2; position:sticky; top:96px; }
}
/* Cards — generous padding, soft rounding + faint lift so panels breathe */
.hemdox-checkout .col-1,
.hemdox-checkout .col-2,
.hemdox-checkout #order_review,
.hemdox-checkout .woocommerce-additional-fields {
background:#fff; border:1px solid var(--co-border); border-radius:20px !important;
padding:30px !important; margin:0 0 24px !important;
box-shadow:0 1px 2px rgba(16,26,58,.03);
}
.hemdox-checkout .col-2 { margin-top:4px !important; }
.hemdox-checkout h3 { font-size:20px; font-weight:800; letter-spacing:-.3px; color:var(--co-ink); margin:0 0 22px; }
.hemdox-checkout #order_review_heading { font-size:13px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:var(--co-muted); margin:0 0 14px; }
/* ---------- Fields ---------- */
.hemdox-checkout .form-row {
float:none !important; width:auto !important; margin:0 0 20px !important; padding:0;
display:flex; flex-direction:column;
}
.hemdox-checkout .form-row label {
display:block; font-size:14px; font-weight:700; color:var(--co-ink);
margin:0 0 9px; white-space:normal; line-height:1.35;
}
.hemdox-checkout .form-row label .required { color:var(--co-flame); text-decoration:none; margin-left:3px; }
.hemdox-checkout .form-row label .optional { color:var(--co-muted); font-weight:500; font-size:13px; }
.hemdox-checkout .woocommerce-input-wrapper { width:100%; display:block; }
.hemdox-checkout input.input-text,
.hemdox-checkout textarea,
.hemdox-checkout select,
.hemdox-checkout .select2-selection {
width:100% !important; min-height:54px !important; padding:15px 18px !important;
border:1.5px solid var(--co-border) !important; border-radius:14px !important;
background:#F5F3FC !important; color:var(--co-ink) !important; font-size:16px !important;
box-sizing:border-box; line-height:1.4; box-shadow:none !important;
transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.hemdox-checkout input.input-text::placeholder,
.hemdox-checkout textarea::placeholder { color:#9AA0B4; }
.hemdox-checkout textarea { min-height:110px !important; }
.hemdox-checkout input.input-text:hover,
.hemdox-checkout textarea:hover,
.hemdox-checkout select:hover { border-color:#C9C2E8 !important; }
.hemdox-checkout input.input-text:focus,
.hemdox-checkout textarea:focus,
.hemdox-checkout select:focus,
.hemdox-checkout .select2-container--focus .select2-selection,
.hemdox-checkout .select2-container--open .select2-selection {
border-color:var(--co-accent) !important; box-shadow:0 0 0 4px rgba(124,58,237,.14) !important; outline:0; background:#fff !important;
}
/* select2 (country dropdown) — match the inputs exactly */
.hemdox-checkout .select2-container { width:100% !important; }
.hemdox-checkout .select2-container .select2-selection--single {
height:54px !important; display:flex; align-items:center; border:1.5px solid var(--co-border) !important;
border-radius:14px !important; background:#F5F3FC !important;
}
.hemdox-checkout .select2-container--default .select2-selection--single .select2-selection__rendered { line-height:52px; padding-left:18px; color:var(--co-ink); font-size:16px; }
.hemdox-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { height:52px; right:14px; }
/* Two-up: First / Last name side-by-side; every other field full width. */
@media (min-width:600px){
.hemdox-checkout .woocommerce-billing-fields__field-wrapper,
.hemdox-checkout .woocommerce-shipping-fields__field-wrapper {
display:grid; grid-template-columns:1fr 1fr; gap:0 18px;
}
.hemdox-checkout .form-row-wide { grid-column:1 / -1 !important; }
.hemdox-checkout .form-row-first { grid-column:1 !important; }
.hemdox-checkout .form-row-last { grid-column:2 !important; }
}
/* ---------- Order review — fully re-skinned (kills default table borders/rows) ---------- */
.hemdox-checkout #order_review table.shop_table,
.hemdox-checkout #order_review table.woocommerce-checkout-review-order-table {
width:100%; border:0 !important; border-collapse:collapse !important; border-spacing:0 !important;
margin:0 0 6px; font-size:15px; background:transparent !important;
}
/* reset EVERY cell: no borders, no backgrounds, no theme striping */
.hemdox-checkout #order_review .shop_table tr,
.hemdox-checkout #order_review .shop_table th,
.hemdox-checkout #order_review .shop_table td {
border:0 !important; background:transparent !important; box-shadow:none !important;
}
.hemdox-checkout #order_review .shop_table tr:nth-child(even),
.hemdox-checkout #order_review .shop_table tr:nth-child(odd) { background:transparent !important; }
/* header labels */
.hemdox-checkout #order_review .shop_table thead th {
padding:0 0 12px; text-align:left; font-size:11px; font-weight:800; letter-spacing:.8px;
text-transform:uppercase; color:var(--co-muted);
}
.hemdox-checkout #order_review .shop_table thead th.product-total { text-align:right; }
/* product rows */
.hemdox-checkout #order_review .shop_table tbody td,
.hemdox-checkout #order_review .shop_table tbody th {
border-top:1px solid var(--co-border) !important; padding:16px 0; vertical-align:top; color:var(--co-ink);
}
.hemdox-checkout #order_review .shop_table tbody td.product-name { font-weight:700; color:var(--co-ink); padding-right:12px; line-height:1.4; }
.hemdox-checkout #order_review .shop_table tbody td.product-total { text-align:right; white-space:nowrap; font-weight:800; color:var(--co-ink); }
/* totals (tfoot) */
.hemdox-checkout #order_review .shop_table tfoot th,
.hemdox-checkout #order_review .shop_table tfoot td {
border-top:1px solid var(--co-border) !important; padding:12px 0; text-align:left;
color:var(--co-muted); font-weight:600;
}
.hemdox-checkout #order_review .shop_table tfoot td { text-align:right; color:var(--co-ink); font-weight:700; }
.hemdox-checkout #order_review .shop_table tfoot tr.order-total th,
.hemdox-checkout #order_review .shop_table tfoot tr.order-total td {
border-top:2px solid var(--co-border) !important; padding-top:16px; font-size:20px; font-weight:800; color:var(--co-ink);
}
.hemdox-checkout #order_review .shop_table tfoot tr.order-total .amount,
.hemdox-checkout #order_review .shop_table tfoot tr.order-total bdi { color:var(--co-accent); }
/* editable qty steppers inside the review (Xoo) — brand them */
.hemdox-checkout #order_review .xoo-wsc-qty-box,
.hemdox-checkout #order_review .quantity {
display:inline-flex !important; align-items:stretch; margin:10px 0 0; border:1px solid var(--co-border);
border-radius:10px; overflow:hidden; background:#fff; max-width:118px;
}
.hemdox-checkout #order_review .xoo-wsc-qty-stepper,
.hemdox-checkout #order_review .xoo-wsc-qty-box button {
border:0 !important; background:transparent !important; color:var(--co-ink); width:34px; min-height:38px;
font-size:16px; font-weight:700; cursor:pointer;
}
.hemdox-checkout #order_review .xoo-wsc-qty-stepper:hover { background:rgba(124,58,237,.08) !important; color:var(--co-accent); }
.hemdox-checkout #order_review .xoo-wsc-qty-box input,
.hemdox-checkout #order_review .quantity input { border:0 !important; box-shadow:none !important; text-align:center; width:38px; font-weight:700; background:transparent !important; }
.hemdox-checkout #order_review a.remove,
.hemdox-checkout #order_review .xoo-wsc-remove {
color:var(--co-muted) !important; font-size:13px; font-weight:600; text-decoration:underline; margin-left:10px;
}
.hemdox-checkout #order_review a.remove:hover,
.hemdox-checkout #order_review .xoo-wsc-remove:hover { color:var(--co-flame) !important; }
/* ---------- Payment ---------- */
.hemdox-checkout #payment { background:transparent; border-radius:0; }
.hemdox-checkout #payment ul.payment_methods { border:0; padding:0; margin:0 0 12px; list-style:none; }
.hemdox-checkout #payment ul.payment_methods li { border:1px solid var(--co-border); border-radius:12px; padding:14px; margin:0 0 10px; }
.hemdox-checkout #payment ul.payment_methods li label { font-weight:700; color:var(--co-ink); }
.hemdox-checkout #payment .payment_box { background:var(--co-panel); border-radius:10px; padding:12px 14px; margin-top:10px; font-size:13.5px; color:var(--co-muted); }
.hemdox-checkout #payment .payment_box::before { display:none; }
/* place order button */
.hemdox-checkout #place_order,
.hemdox-checkout .wc-proceed-to-checkout .checkout-button {
display:block; width:100%; padding:16px 22px; border:0; border-radius:12px;
background:linear-gradient(120deg,#7C3AED,#FF3D2E); color:#fff !important; font-size:16px; font-weight:800;
cursor:pointer; box-shadow:0 12px 26px -12px rgba(124,58,237,.6); transition:filter .15s ease, transform .15s ease;
}
.hemdox-checkout #place_order:hover { filter:brightness(1.05); transform:translateY(-1px); }
/* ---------- Coupon (collapsible) ---------- */
.hemdox-checkout .woocommerce-form-coupon-toggle { margin:0 0 22px; }
.hemdox-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
background:var(--co-panel); border:1px solid var(--co-border); border-left:4px solid var(--co-accent);
border-radius:14px; padding:16px 20px; color:var(--co-ink); font-size:14.5px; margin:0;
}
.hemdox-checkout .woocommerce-form-coupon-toggle .woocommerce-info a { color:var(--co-accent); font-weight:800; text-decoration:none; }
.hemdox-checkout .woocommerce-form-coupon-toggle .woocommerce-info a:hover { text-decoration:underline; }
.hemdox-checkout form.checkout_coupon { border:1px solid var(--co-border); border-radius:14px; padding:18px; margin:0 0 22px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.hemdox-checkout form.checkout_coupon .input-text { flex:1 1 200px; }
.hemdox-checkout form.checkout_coupon .button { background:var(--co-accent); color:#fff; border:0; border-radius:12px; padding:15px 22px; font-weight:800; cursor:pointer; }
/* Kill WooCommerce's tofu/box pseudo-icons (its icon font isn't loaded) on notices */
.hemdox-checkout .woocommerce-info::before,
.hemdox-checkout .woocommerce-message::before,
.hemdox-checkout .woocommerce-error::before { content:none !important; display:none !important; }
/* notices */
.hemdox-checkout .woocommerce-error,
.hemdox-checkout .woocommerce-message,
.hemdox-checkout .woocommerce-info { border-radius:14px; padding:16px 20px; }
.hemdox-checkout .woocommerce-error { border-left:4px solid #E5484D; background:#FEF2F2; }
/* trust badges */
.hemdox-checkout__trust { list-style:none; display:flex; flex-wrap:wrap; gap:14px 24px; margin:24px 0 0; padding:18px 0 0; border-top:1px solid var(--co-border); }
.hemdox-checkout__trust li { display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600; color:var(--co-muted); }
.hemdox-checkout__trustico { font-size:18px; }
/* ============================ CART (2-column, modern) ============================ */
.hemdox-cart__title { margin:0 0 30px !important; }
/* Desktop: items+coupon (left) | Cart Totals sticky (right) */
@media (min-width:981px){
.hemdox-cart .woocommerce { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:32px; align-items:start; }
.hemdox-cart .woocommerce-notices-wrapper { grid-column:1 / -1; }
.hemdox-cart form.woocommerce-cart-form { grid-column:1; margin:0 !important; }
.hemdox-cart .cart-collaterals { grid-column:2; width:auto !important; margin:0 !important; float:none !important; position:sticky; top:96px; }
}
/* Items table = ONE clean card (header + row dividers), no per-row boxes */
.hemdox-cart form.woocommerce-cart-form { width:100%; }
.hemdox-cart .shop_table.cart {
width:100%; table-layout:fixed !important; border:1px solid var(--co-border) !important; border-radius:20px !important;
border-collapse:collapse !important; border-spacing:0 !important; overflow:hidden;
background:#fff !important; box-shadow:0 1px 2px rgba(16,26,58,.03);
}
/* fixed column widths so the table can't overflow its grid column (was overlapping the totals) */
.hemdox-cart .shop_table.cart th.product-remove, .hemdox-cart .shop_table.cart td.product-remove { width:56px !important; }
.hemdox-cart .shop_table.cart th.product-thumbnail, .hemdox-cart .shop_table.cart td.product-thumbnail { width:88px !important; }
.hemdox-cart .shop_table.cart th.product-price, .hemdox-cart .shop_table.cart td.product-price { width:15% !important; }
.hemdox-cart .shop_table.cart th.product-quantity, .hemdox-cart .shop_table.cart td.product-quantity { width:148px !important; }
.hemdox-cart .shop_table.cart th.product-subtotal, .hemdox-cart .shop_table.cart td.product-subtotal { width:15% !important; }
.hemdox-cart .shop_table.cart td.product-name { word-break:break-word; }
.hemdox-cart .shop_table.cart td.product-price bdi,
.hemdox-cart .shop_table.cart td.product-subtotal bdi { white-space:nowrap; }
.hemdox-cart .shop_table.cart thead { display:table-header-group !important; }
.hemdox-cart .shop_table.cart thead th {
background:transparent !important; border:0 !important; border-bottom:1px solid var(--co-border) !important;
padding:18px 16px !important; text-align:left; font-size:12px; font-weight:800; letter-spacing:.6px;
text-transform:uppercase; color:var(--co-muted);
}
.hemdox-cart .cart_item td {
background:#fff !important; border:0 !important; border-bottom:1px solid var(--co-border) !important;
padding:18px 16px !important; vertical-align:middle !important; color:var(--co-ink);
}
.hemdox-cart .cart_item td.product-thumbnail { width:92px; }
.hemdox-cart .cart_item td.product-thumbnail img { width:72px !important; height:72px !important; object-fit:cover; border-radius:12px; background:var(--co-panel); border:1px solid var(--co-border); display:block; }
.hemdox-cart .cart_item td.product-name a { color:var(--co-ink) !important; font-weight:700; text-decoration:none; font-size:15.5px; }
.hemdox-cart .cart_item td.product-name a:hover { color:var(--co-accent) !important; }
.hemdox-cart .cart_item td.product-price { color:var(--co-muted) !important; font-weight:600; }
.hemdox-cart .cart_item td.product-subtotal { color:var(--co-ink) !important; font-weight:800; }
/* professional circular remove button */
.hemdox-cart td.product-remove { width:56px; text-align:center; }
.hemdox-cart .product-remove a.remove {
display:inline-flex !important; align-items:center; justify-content:center; width:32px; height:32px;
border-radius:50%; border:1px solid var(--co-border); background:#fff; color:var(--co-muted) !important;
font-size:18px !important; line-height:1 !important; text-decoration:none; transition:all .15s ease;
}
.hemdox-cart .product-remove a.remove:hover { background:#FDECEC; border-color:#E5484D; color:#E5484D !important; }
/* qty stepper (built by JS: wraps input.qty) */
.hemdox-qtywrap { display:inline-flex; align-items:stretch; border:1px solid var(--co-border); border-radius:12px; overflow:hidden; background:#fff; max-width:140px; }
.hemdox-qtywrap__btn { flex:0 0 40px; border:0; background:transparent; color:var(--co-ink); font-size:18px; font-weight:700; cursor:pointer; min-height:46px; transition:background .15s ease, color .15s ease; }
.hemdox-qtywrap__btn:hover { background:rgba(124,58,237,.08); color:var(--co-accent); }
.hemdox-qtywrap input.qty { width:46px; min-height:46px !important; border:0 !important; box-shadow:none !important; text-align:center; font-weight:700; padding:0 !important; background:transparent !important; -moz-appearance:textfield; }
.hemdox-qtywrap input.qty::-webkit-outer-spin-button,
.hemdox-qtywrap input.qty::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
/* coupon + update cart — sit inside the card footer; coupon input is WIDE */
/* IMPORTANT: .actions IS the | . Keep it a table-cell (so its colspan width holds);
put the flex on the .coupon div INSIDE it, else the cell collapses and the input is tiny. */
.hemdox-cart td.actions {
display:table-cell !important; border:0 !important; border-top:1px solid var(--co-border) !important;
padding:20px 16px !important; background:#fff !important; text-align:left !important;
}
.hemdox-cart td.actions::before { content:none !important; }
.hemdox-cart .actions .coupon {
display:flex !important; gap:10px; width:100%; max-width:620px; margin:0 0 14px !important; float:none !important;
}
.hemdox-cart .actions .coupon .input-text {
flex:1 1 auto !important; width:auto !important; min-width:0; min-height:50px !important; padding:13px 16px !important;
border:1.5px solid var(--co-border) !important; border-radius:12px !important; background:#F5F3FC !important; font-size:15px !important;
}
.hemdox-cart .actions .coupon .input-text:focus { border-color:var(--co-accent) !important; background:#fff !important; box-shadow:0 0 0 3px rgba(124,58,237,.12) !important; }
.hemdox-cart .actions .coupon .button {
flex:0 0 auto; background:var(--co-accent) !important; color:#fff !important; border:0 !important;
border-radius:12px !important; padding:14px 24px !important; font-weight:800 !important; white-space:nowrap; cursor:pointer;
}
.hemdox-cart .actions > button[name="update_cart"] {
display:inline-block; float:none !important; margin:0 !important; background:#fff !important; color:var(--co-ink) !important;
border:1.5px solid var(--co-border) !important; border-radius:12px !important; padding:14px 22px !important; font-weight:700 !important; cursor:pointer;
}
.hemdox-cart .actions > button[name="update_cart"]:hover:not(:disabled) { border-color:var(--co-accent) !important; color:var(--co-accent) !important; }
.hemdox-cart .actions > button[name="update_cart"]:disabled { opacity:.45; }
/* Cart Totals (right column) */
.hemdox-cart .cart-collaterals { margin-top:0; width:100%; }
.hemdox-cart .cart_totals { width:100% !important; float:none !important; background:#fff; border:1px solid var(--co-border); border-radius:20px; padding:28px; box-shadow:0 1px 2px rgba(16,26,58,.03); }
.hemdox-cart .cart_totals > h2 { font-size:17px; font-weight:800; letter-spacing:-.3px; text-transform:none; color:var(--co-ink); margin:0 0 18px; }
.hemdox-cart .cart_totals table { width:100%; border:0 !important; border-collapse:collapse !important; }
.hemdox-cart .cart_totals td::before { content:none !important; } /* kill responsive "Subtotal:/Shipment:" labels */
.hemdox-cart .cart_totals th, .hemdox-cart .cart_totals td { padding:14px 0 !important; border:0 !important; border-bottom:1px solid var(--co-border) !important; background:transparent !important; text-align:left; color:var(--co-muted); font-weight:600; vertical-align:top; }
.hemdox-cart .cart_totals td { text-align:right; color:var(--co-ink); font-weight:700; }
.hemdox-cart .cart_totals .cart-subtotal th { color:var(--co-ink); }
.hemdox-cart .cart_totals .order-total th,
.hemdox-cart .cart_totals .order-total td { font-size:20px; font-weight:800; color:var(--co-ink); border-bottom:0 !important; padding-top:18px !important; }
.hemdox-cart .cart_totals .order-total .amount,
.hemdox-cart .cart_totals .order-total bdi { color:var(--co-accent); }
/* shipping row: label on its OWN line, options stacked with descriptions */
.hemdox-cart .cart_totals tr.shipping th,
.hemdox-cart .cart_totals tr.shipping td { display:block !important; width:100% !important; text-align:left !important; }
.hemdox-cart .cart_totals tr.shipping th { padding:16px 0 10px !important; color:var(--co-ink); font-weight:800; border-bottom:0 !important; }
.hemdox-cart .cart_totals tr.shipping td { padding:0 0 4px !important; }
.hemdox-cart .cart_totals ul#shipping_method { list-style:none; margin:0; padding:0; }
.hemdox-cart .cart_totals ul#shipping_method li { display:flex; flex-wrap:wrap; align-items:flex-start; gap:6px 10px; padding:9px 0; font-weight:600; color:var(--co-ink); }
.hemdox-cart .cart_totals ul#shipping_method li input[type=radio] { width:auto !important; min-height:auto !important; margin:3px 0 0 !important; accent-color:var(--co-accent); flex:0 0 auto; }
.hemdox-cart .cart_totals ul#shipping_method li label { margin:0; flex:1 1 auto; font-weight:700; color:var(--co-ink); }
.hemdox-cart .cart_totals ul#shipping_method li .amount { font-weight:800; color:var(--co-ink); }
.hemdox-cart .cart_totals .woocommerce-shipping-destination,
.hemdox-cart .cart_totals p { color:var(--co-muted); font-size:13px; margin:8px 0 0; line-height:1.5; }
.hemdox-cart .cart_totals a.shipping-calculator-button { color:var(--co-accent); font-weight:700; text-decoration:none; }
.hemdox-cart .cart_totals a.shipping-calculator-button:hover { text-decoration:underline; }
/* proceed to checkout button */
.hemdox-cart .wc-proceed-to-checkout { margin-top:20px; padding:0; }
.hemdox-cart .wc-proceed-to-checkout .checkout-button {
display:block; width:100%; padding:16px 22px; border:0; border-radius:12px;
background:linear-gradient(120deg,#7C3AED,#FF3D2E) !important; color:#fff !important; font-size:16px; font-weight:800;
text-align:center; text-decoration:none; box-shadow:0 12px 26px -12px rgba(124,58,237,.6); transition:filter .15s ease, transform .15s ease;
}
.hemdox-cart .wc-proceed-to-checkout .checkout-button:hover { filter:brightness(1.05); transform:translateY(-1px); }
/* ---------- MOBILE cart: clean cards, no generic "Product:" labels ---------- */
@media (max-width:768px){
.hemdox-cart .shop_table.cart { border:0 !important; border-radius:0 !important; box-shadow:none !important; overflow:visible !important; border-spacing:0 !important; background:transparent !important; }
.hemdox-cart .shop_table.cart thead { display:none !important; }
.hemdox-cart td.actions { border-top:0 !important; padding:16px 0 0 !important; background:transparent !important; }
.hemdox-cart .cart_item {
display:grid !important; grid-template-columns:76px 1fr auto; grid-auto-rows:min-content; gap:2px 14px;
position:relative; background:#fff !important; border:1px solid var(--co-border) !important;
border-radius:16px !important; padding:16px !important; margin:0 0 14px !important;
}
.hemdox-cart .cart_item td {
display:block !important; border:0 !important; padding:0 !important; background:transparent !important;
width:auto !important; text-align:left !important; font-size:14px;
}
.hemdox-cart .cart_item td::before { content:none !important; } /* kill "Product:/Price:" labels */
.hemdox-cart .cart_item td.product-thumbnail { grid-column:1; grid-row:1 / span 4; }
.hemdox-cart .cart_item td.product-thumbnail img { width:76px !important; height:76px !important; }
.hemdox-cart .cart_item td.product-name { grid-column:2 / span 2; font-weight:700; padding-right:34px !important; }
.hemdox-cart .cart_item td.product-price { grid-column:2; color:var(--co-muted) !important; margin-top:4px; }
.hemdox-cart .cart_item td.product-quantity { grid-column:2; margin-top:10px; }
.hemdox-cart .cart_item td.product-subtotal { grid-column:3; align-self:end; text-align:right !important; font-weight:800; }
.hemdox-cart .cart_item td.product-remove { position:absolute; top:12px; right:12px; grid-row:1; }
.hemdox-cart .actions { flex-direction:column; align-items:stretch; }
.hemdox-cart .actions .coupon { flex:1 1 100%; max-width:none; }
.hemdox-cart .actions > button[name="update_cart"] { width:100%; }
.hemdox-cart .cart-collaterals .cart_totals { max-width:100%; padding:22px; }
}
/* ---------- Order review — breathing room + no edge-hugging ---------- */
.hemdox-checkout #order_review .shop_table tbody td { padding:18px 0 !important; }
.hemdox-checkout #order_review .shop_table tbody td.product-name { padding-right:16px !important; }
.hemdox-checkout #order_review .shop_table td.product-total,
.hemdox-checkout #order_review .shop_table th.product-total,
.hemdox-checkout #order_review .shop_table tfoot td { padding-left:12px !important; }
.hemdox-checkout #order_review .shop_table tbody td.product-name .amount { white-space:nowrap; }
/* ---------- MOBILE / TABLET checkout (single column, comfortable) ---------- */
@media (max-width:980px){
.hemdox-checkout form.woocommerce-checkout { display:block; }
.hemdox-checkout #order_review { position:static !important; top:auto !important; }
.hemdox-checkout .col-1,
.hemdox-checkout .col-2,
.hemdox-checkout #order_review,
.hemdox-checkout .woocommerce-additional-fields { padding:24px 20px; border-radius:18px; margin:0 0 18px !important; }
.hemdox-checkout #order_review_heading { margin:8px 0 14px; }
.hemdox-checkout__title { font-size:26px; }
.hemdox-checkout__head { margin-bottom:20px; }
}
@media (max-width:560px){
.hemdox-checkout .col-1,
.hemdox-checkout .col-2,
.hemdox-checkout #order_review,
.hemdox-checkout .woocommerce-additional-fields { padding:20px 16px; }
.hemdox-checkout .woocommerce-billing-fields__field-wrapper,
.hemdox-checkout .woocommerce-shipping-fields__field-wrapper { display:block; } /* name fields stack on small phones */
.hemdox-checkout input.input-text,
.hemdox-checkout textarea,
.hemdox-checkout select { min-height:52px !important; padding:14px 16px !important; }
.hemdox-checkout__trust { gap:10px 18px; }
}
/* ---------- Shipping methods row (don't right-align; clean left list, no overflow) ---------- */
.hemdox-checkout #order_review .shop_table tfoot tr.woocommerce-shipping-totals th,
.hemdox-checkout #order_review .shop_table tfoot tr.woocommerce-shipping-totals td {
display:block !important; width:100% !important; text-align:left !important; padding-left:0 !important;
}
.hemdox-checkout #order_review .shop_table tfoot tr.woocommerce-shipping-totals th {
padding:14px 0 6px !important; border-top:1px solid var(--co-border) !important;
font-size:13px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--co-muted);
}
.hemdox-checkout #order_review .shop_table tfoot tr.woocommerce-shipping-totals td { border-top:0 !important; padding-top:0 !important; padding-bottom:6px !important; }
.hemdox-checkout #order_review ul#shipping_method { list-style:none; margin:0; padding:0; }
.hemdox-checkout #order_review ul#shipping_method li {
display:flex; align-items:center; gap:10px; padding:8px 0; color:var(--co-ink); font-weight:600;
}
.hemdox-checkout #order_review ul#shipping_method li label {
display:inline; margin:0; font-weight:600; color:var(--co-ink); white-space:normal; flex:1 1 auto;
}
.hemdox-checkout #order_review ul#shipping_method li input[type=radio] {
width:auto !important; min-height:auto !important; height:auto !important; margin:0 !important;
padding:0 !important; flex:0 0 auto; accent-color:var(--co-accent);
}
.hemdox-checkout #order_review ul#shipping_method li .amount { margin-left:auto; font-weight:800; color:var(--co-ink); white-space:nowrap; }
.hemdox-checkout #order_review .woocommerce-shipping-destination { color:var(--co-muted); font-size:13px; margin:6px 0 0; }
/* ---------- Professional order-item rows (image + linked name + spaced stepper/remove) ----------
Keep the | as a table cell (so the price column stays aligned); place the image in a
reserved left gutter via absolute positioning. */
.hemdox-checkout #order_review .shop_table tbody td.product-name {
position:relative; padding-left:74px !important; padding-right:16px !important; min-height:58px;
}
.hemdox-checkout #order_review .hemdox-oi__thumb { position:absolute; left:0; top:16px; display:block; line-height:0; }
.hemdox-checkout #order_review .hemdox-oi__thumb img,
.hemdox-checkout #order_review .hemdox-oi__img {
width:58px !important; height:58px !important; object-fit:cover; border-radius:12px;
background:var(--co-panel); border:1px solid var(--co-border); display:block; margin:0 !important;
}
.hemdox-checkout #order_review .hemdox-oi__name {
display:block; font-weight:700; font-size:15px; line-height:1.35;
color:var(--co-ink) !important; text-decoration:none;
}
.hemdox-checkout #order_review .hemdox-oi__name:hover { color:var(--co-accent) !important; }
/* stepper + remove: own line under the name, with clear spacing */
.hemdox-checkout #order_review .xoo-wsc-cm-qty {
margin-top:12px; display:flex; align-items:center; gap:16px;
}
.hemdox-checkout #order_review .xoo-wsc-qty-stepper {
display:inline-flex; align-items:stretch; border:1px solid var(--co-border) !important;
border-radius:10px; overflow:hidden; background:#fff;
}
.hemdox-checkout #order_review .xoo-wsc-qs-btn {
border:0 !important; background:transparent !important; color:var(--co-ink) !important;
width:34px; min-height:36px; font-size:16px; font-weight:700; cursor:pointer;
}
.hemdox-checkout #order_review .xoo-wsc-qs-btn:hover { background:rgba(124,58,237,.08) !important; color:var(--co-accent) !important; }
.hemdox-checkout #order_review .xoo-wsc-qs-input {
width:40px; border:0 !important; text-align:center; font-weight:700; background:transparent !important; box-shadow:none !important;
}
.hemdox-checkout #order_review .xoo-wsc-cm-remove {
color:var(--co-muted) !important; font-size:13px; font-weight:600; text-decoration:underline; text-underline-offset:2px;
}
.hemdox-checkout #order_review .xoo-wsc-cm-remove:hover { color:var(--co-flame) !important; }
@media (max-width:560px){
.hemdox-checkout #order_review .xoo-wsc-cm-qty { margin-left:0; }
.hemdox-checkout #order_review .hemdox-oi__thumb img { width:48px !important; height:48px !important; }
}
/* ---------- Shipping method items: name on top, description stacked below ----------
Handles both a single method (hidden input, no radio) and multiple methods (radio). */
.hemdox-cart .cart_totals ul#shipping_method li,
.hemdox-checkout #order_review ul#shipping_method li {
display:block !important; position:relative; padding:10px 0 !important; color:var(--co-ink); font-weight:600;
}
.hemdox-cart .cart_totals ul#shipping_method li input[type=radio],
.hemdox-checkout #order_review ul#shipping_method li input[type=radio] {
position:absolute; left:0; top:4px; width:auto !important; min-height:auto !important; height:auto !important;
margin:0 !important; padding:0 !important; accent-color:var(--co-accent); flex:none !important;
}
.hemdox-cart .cart_totals ul#shipping_method li label,
.hemdox-checkout #order_review ul#shipping_method li label {
display:block !important; margin:0 !important; float:none !important; font-weight:700; color:var(--co-ink);
}
/* indent name + description ONLY when a real radio is shown (2+ methods) */
.hemdox-cart .cart_totals ul#shipping_method li:has(input[type=radio]) label,
.hemdox-cart .cart_totals ul#shipping_method li:has(input[type=radio]) .shipping-method-description,
.hemdox-checkout #order_review ul#shipping_method li:has(input[type=radio]) label,
.hemdox-checkout #order_review ul#shipping_method li:has(input[type=radio]) .shipping-method-description { padding-left:28px; }
/* the description paragraph -> its own line, muted */
.hemdox-cart .cart_totals ul#shipping_method li .shipping-method-description,
.hemdox-cart .cart_totals ul#shipping_method li > p,
.hemdox-checkout #order_review ul#shipping_method li .shipping-method-description,
.hemdox-checkout #order_review ul#shipping_method li > p {
display:block !important; margin:4px 0 0 !important; color:var(--co-muted); font-size:13px; font-weight:500; line-height:1.55;
}
.hemdox-cart .cart_totals ul#shipping_method li .amount,
.hemdox-checkout #order_review ul#shipping_method li .amount { font-weight:800; color:var(--co-ink); }
|