/* Yuvi Jewels brand skin for WooCommerce's default templates.
   Uses the same tokens as the landing page so Shop/Product/Cart/Checkout
   feel like one site instead of "theme default + custom homepage". */
:root{
  --yj-ink:#1B1B1B;
  --yj-gold:#B9902F;
  --yj-rose:#7C4750;
  --yj-line:#EDE5DC;
  --yj-bg-soft:#FAF6F2;
}

.woocommerce ul.products li.product .price ins,
.woocommerce span.price{ color:var(--yj-ink); font-weight:700; }
.woocommerce ul.products li.product .price del{ color:#999; }

.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce-page a.button{
  background:var(--yj-rose) !important; color:#fff !important; border-radius:999px !important;
  border:none !important; padding:12px 26px !important; font-weight:600 !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover{ background:var(--yj-ink) !important; }

.woocommerce div.product .woocommerce-tabs ul.tabs li.active{ border-color:var(--yj-gold); }
.woocommerce div.product p.price, .woocommerce div.product span.price{ color:var(--yj-ink); }

.woocommerce-cart table.cart img, .woocommerce-checkout table.cart img{ border-radius:10px; }
.woocommerce table.shop_table{ border-radius:12px; overflow:hidden; border-color:var(--yj-line) !important; }
.woocommerce #payment div.payment_box{ background:var(--yj-bg-soft) !important; border-radius:10px; }

.yj-pdp-trust{ display:flex; flex-wrap:wrap; gap:10px 18px; margin:18px 0; padding:14px 16px; background:var(--yj-bg-soft); border-radius:10px; font-size:0.82rem; font-weight:500; }
.yj-pdp-payment-note{ background:#FCEFC7; color:#5c4a05; padding:10px 14px; border-radius:8px; font-size:0.88rem; margin-bottom:16px; }

/* Cart — two-column layout via a wrapper added around WooCommerce's own
   cart form + totals (see YJ_Woocommerce_Style::cart_wrapper_*), so the
   underlying cart table/nonces/quantity logic stay 100% untouched. */
.yj-cart-layout{ display:grid; grid-template-columns:1.6fr 1fr; gap:28px; align-items:start; margin:24px 0; }
.yj-cart-layout table.cart{ border:1px solid var(--yj-line); border-radius:14px; overflow:hidden; }
.yj-cart-layout table.cart th{ background:var(--yj-bg-soft); }
.yj-cart-layout .product-remove a{ color:#b5432e !important; }
.yj-cart-layout .cart-collaterals{ background:var(--yj-bg-soft); border-radius:14px; padding:22px; }
.yj-cart-layout .cart-collaterals .cart_totals table{ border:none; }
@media(max-width:900px){ .yj-cart-layout{ grid-template-columns:1fr; } }

/* Checkout — same trick: WooCommerce's own col2-set/col-1/col-2 classes,
   just switched from float to grid and restyled. Fields, nonces and the
   payment form itself are all still WooCommerce's default template. */
.woocommerce-checkout .col2-set{ display:grid !important; grid-template-columns:1.3fr 1fr; gap:32px; }
.woocommerce-checkout .col-1, .woocommerce-checkout .col-2{ float:none !important; width:100% !important; }
.woocommerce-checkout #customer_details{ background:#fff; border:1px solid var(--yj-line); border-radius:14px; padding:22px; }
.woocommerce-checkout .woocommerce-billing-fields input,
.woocommerce-checkout .woocommerce-billing-fields select{ border-radius:8px !important; padding:11px 12px !important; }
.woocommerce-checkout #order_review{ background:var(--yj-bg-soft); border-radius:14px; padding:22px; }
.woocommerce-checkout #payment{ background:transparent !important; }
@media(max-width:900px){ .woocommerce-checkout .col2-set{ grid-template-columns:1fr; } }
