/* ============================================================
   RANGAURY — WooCommerce CSS Overrides
   Matches Rangaury's warm cream + brown + terracotta palette
   Button style: pill-shaped, uppercase, letter-spacing
   ============================================================ */

/* ----- Buttons (match Rangaury's 30px border-radius) ----- */
.woocommerce-js a.button,
.woocommerce button.button,
.woocommerce .woocommerce-message a.button,
.woocommerce #respond input#submit,
.woocommerce #respond input#submit.alt,
.woocommerce input.button,
.woocommerce input.button.alt,
.woocommerce .button,
.wc-block-grid__products .wc-block-grid__product .wp-block-button__link,
[class*="wc-block"] button,
[class*="wc-block"] .wc-block-components-button {
  background-color: var(--r-brown-deep) !important;
  border-color: var(--r-brown-deep) !important;
  color: var(--r-cream) !important;
  border-radius: 30px !important;
  padding: 14px 30px !important;
  font-family: var(--r-font) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  transition: all 250ms ease !important;
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: none !important;
}
.woocommerce-js a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .button:hover,
[class*="wc-block"] button:hover,
[class*="wc-block"] .wc-block-components-button:hover {
  background-color: var(--r-terracotta) !important;
  border-color: var(--r-terracotta) !important;
  color: var(--r-cream) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(192,98,43,0.28) !important;
}

/* Checkout button */
.woocommerce .wc-proceed-to-checkout .checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.button {
  background: var(--r-terracotta) !important;
  border-color: var(--r-terracotta) !important;
  font-size: 0.8rem !important;
  padding: 16px 40px !important;
  display: block;
  text-align: center;
}

/* ----- Product listings ----- */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.woocommerce ul.products li.product {
  background: #ffffff;
  border: 1px solid var(--r-border);
  border-radius: 16px;
  overflow: hidden;
  transition: all 250ms ease;
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 40px rgba(58,34,16,0.12);
  border-color: var(--r-border-dark);
}

/* Product image */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link img {
  aspect-ratio: 1 / 1.08;
  width: 100%;
  object-fit: cover;
  display: block;
  transition: transform 450ms ease;
}
.woocommerce ul.products li.product:hover img { transform: scale(1.05); }

/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  padding: 0.75rem 1rem 0.25rem;
  font-size: 0.83rem !important;
  font-weight: 600 !important;
  color: var(--r-brown-deep) !important;
  font-family: var(--r-font) !important;
  line-height: 1.5;
  transition: color 250ms ease;
}
.woocommerce ul.products li.product:hover .woocommerce-loop-product__title {
  color: var(--r-terracotta) !important;
}

/* Price */
.woocommerce ul.products li.product .price {
  padding: 0 1rem 0.5rem;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--r-brown-deep) !important;
  display: block;
}
.woocommerce ul.products li.product .price del {
  color: var(--r-brown-pale) !important;
  font-weight: 400 !important;
  font-size: 0.83rem !important;
  margin-right: 0.3rem;
}
.woocommerce ul.products li.product .price ins {
  text-decoration: none;
  color: var(--r-terracotta) !important;
}

/* Add to cart on product cards */
.woocommerce ul.products li.product .button.add_to_cart_button {
  margin: auto 1rem 1rem !important;
  display: block;
  text-align: center;
}

/* Sale badge */
.woocommerce span.onsale {
  background: var(--r-rust) !important;
  color: var(--r-white) !important;
  border-radius: 30px !important;
  font-size: 0.6rem !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  padding: 5px 12px !important;
  min-width: unset !important;
  min-height: unset !important;
  line-height: 1.4 !important;
  top: 0.75rem !important;
  left: 0.75rem !important;
}

/* ----- Star ratings ----- */
.woocommerce .star-rating,
.woocommerce .star-rating span { color: var(--r-gold) !important; }
.woocommerce .star-rating { margin: 0 1rem 0.5rem !important; }
.woocommerce .star-rating::before { color: var(--r-border-dark) !important; }

/* ----- Single Product ----- */
.woocommerce div.product .woocommerce-product-gallery { border-radius: 20px; overflow: hidden; }
.woocommerce div.product .woocommerce-product-gallery figure.woocommerce-product-gallery__wrapper {
  border-radius: 16px;
  overflow: hidden;
  background: var(--r-cream-2);
}

/* Single product title */
.woocommerce div.product .product_title {
  font-size: 2rem !important;
  font-weight: 700 !important;
  font-family: var(--r-font) !important;
  color: var(--r-brown-deep) !important;
  letter-spacing: 1px !important;
  line-height: 1.3 !important;
  margin-bottom: 1rem !important;
}

/* Single product price */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: var(--r-brown-deep) !important;
}
.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
  color: var(--r-brown-pale) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
}
.woocommerce div.product p.price ins {
  color: var(--r-terracotta) !important;
  text-decoration: none;
}

/* Short desc */
.woocommerce-product-details__short-description {
  color: var(--r-text-muted) !important;
  font-size: 0.92rem !important;
  line-height: 1.9 !important;
  margin-bottom: 1.5rem !important;
}

/* Qty */
.woocommerce .quantity input[type="number"] {
  border: 1px solid var(--r-border-dark) !important;
  border-radius: 30px 0 0 30px !important;
  padding: 0 1rem !important;
  height: 48px !important;
  font-weight: 700 !important;
  color: var(--r-brown-deep) !important;
  background: var(--r-cream) !important;
  font-size: 1rem !important;
  font-family: var(--r-font) !important;
}

/* Product meta */
.woocommerce div.product .product_meta {
  padding-top: 1rem !important;
  border-top: 1px solid var(--r-border) !important;
  font-size: 0.8rem !important;
  color: var(--r-text-muted) !important;
}
.woocommerce div.product .product_meta a { color: var(--r-brown-mid); }
.woocommerce div.product .product_meta a:hover { color: var(--r-terracotta); }

/* Product tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  background: transparent !important;
  border-bottom: 1px solid var(--r-border) !important;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  padding: 0.75rem 1.5rem !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: var(--r-text-muted) !important;
  font-family: var(--r-font) !important;
  transition: color 250ms ease;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -1px;
  display: block;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
  color: var(--r-brown-deep) !important;
  border-bottom-color: var(--r-terracotta) !important;
}
.woocommerce div.product .woocommerce-tabs .panel {
  padding: 2rem 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ----- Cart Page ----- */
.woocommerce .woocommerce-cart-form table {
  border-collapse: collapse;
  width: 100%;
}
.woocommerce .woocommerce-cart-form table th {
  background: var(--r-cream-3) !important;
  color: var(--r-brown-deep) !important;
  font-size: 0.72rem !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  padding: 0.75rem 1rem !important;
  border-bottom: 2px solid var(--r-border-dark) !important;
}
.woocommerce .woocommerce-cart-form table td { padding: 1rem !important; border-bottom: 1px solid var(--r-border) !important; vertical-align: middle !important; }
.woocommerce .woocommerce-cart-form td.product-name a { color: var(--r-brown-deep) !important; font-weight: 600 !important; }
.woocommerce .woocommerce-cart-form td.product-name a:hover { color: var(--r-terracotta) !important; }
.woocommerce .woocommerce-cart-form td.product-thumbnail img { border-radius: 10px !important; }
.woocommerce .woocommerce-cart-form td.product-remove a {
  background: var(--r-cream-3) !important;
  color: var(--r-rust) !important;
  border-radius: 50% !important;
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem !important;
}
.woocommerce .woocommerce-cart-form td.product-remove a:hover { background: var(--r-rust) !important; color: #fff !important; }

/* Cart totals */
.woocommerce .cart_totals {
  background: var(--r-cream-2) !important;
  border: 1px solid var(--r-border) !important;
  border-radius: 20px !important;
  padding: 2rem !important;
}
.woocommerce .cart_totals h2 {
  font-size: 1rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--r-brown-deep) !important;
  margin-bottom: 1.5rem !important;
  padding-bottom: 1rem !important;
  border-bottom: 1px solid var(--r-border-dark) !important;
}
.woocommerce .cart_totals table { border: none !important; }
.woocommerce .cart_totals table tr th,
.woocommerce .cart_totals table tr td {
  padding: 0.75rem 0 !important;
  border-top: 1px solid var(--r-border) !important;
  font-size: 0.9rem !important;
  color: var(--r-brown-deep) !important;
}
.woocommerce .cart_totals table tr.order-total th,
.woocommerce .cart_totals table tr.order-total td {
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  color: var(--r-brown-deep) !important;
}

/* ----- Checkout ----- */
.woocommerce .woocommerce-billing-fields h3,
.woocommerce .woocommerce-shipping-fields h3,
.woocommerce #order_review_heading,
.woocommerce form .form-row label {
  color: var(--r-brown-deep) !important;
  font-family: var(--r-font) !important;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  border: 1px solid var(--r-border-dark) !important;
  border-radius: 8px !important;
  background: var(--r-cream) !important;
  color: var(--r-brown-deep) !important;
  font-family: var(--r-font) !important;
}
.woocommerce form .form-row input.input-text:focus { border-color: var(--r-brown-mid) !important; box-shadow: 0 0 0 3px rgba(58,34,16,0.08) !important; }
.woocommerce #payment { background: var(--r-cream-2) !important; border-radius: 16px !important; padding: 1.5rem !important; border: 1px solid var(--r-border) !important; }
.woocommerce #payment ul.payment_methods { border-bottom: 1px solid var(--r-border) !important; }
.woocommerce #payment ul.payment_methods li { border: 1px solid var(--r-border) !important; border-radius: 8px !important; padding: 0.75rem 1rem !important; margin-bottom: 0.5rem !important; background: var(--r-cream) !important; }
.woocommerce #place_order {
  background: var(--r-terracotta) !important;
  border-color: var(--r-terracotta) !important;
  font-size: 0.9rem !important;
  padding: 18px 45px !important;
  width: 100%;
}
.woocommerce #place_order:hover { background: var(--r-terracotta-dk) !important; border-color: var(--r-terracotta-dk) !important; }

/* ----- My Account ----- */
.woocommerce-account .woocommerce-MyAccount-navigation {
  background: var(--r-cream-2) !important;
  border-radius: 16px !important;
  padding: 1.5rem 0 !important;
  border: 1px solid var(--r-border) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 0.75rem 1.5rem !important;
  color: var(--r-brown-deep) !important;
  font-size: 0.83rem !important;
  font-weight: 500 !important;
  transition: all 250ms ease !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  color: var(--r-terracotta) !important;
  background: var(--r-cream-3) !important;
}

/* Notices */
.woocommerce-message,
.woocommerce-info {
  background: var(--r-cream-2) !important;
  border-top-color: var(--r-gold) !important;
  color: var(--r-brown-deep) !important;
  border-radius: 0 0 var(--r-radius-md) var(--r-radius-md) !important;
}
.woocommerce-error {
  background: #fff4f4 !important;
  border-top-color: var(--r-rust) !important;
  color: var(--r-rust) !important;
  border-radius: 0 0 var(--r-radius-md) var(--r-radius-md) !important;
  list-style: none !important;
}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul {
  border: none !important;
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  margin-top: 2.5rem;
}
.woocommerce nav.woocommerce-pagination ul li {
  border: none !important;
  margin: 0 !important;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  padding: 0 !important;
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 30px !important;
  border: 1px solid var(--r-border-dark) !important;
  background: var(--r-cream) !important;
  color: var(--r-brown-deep) !important;
  font-size: 0.83rem !important;
  font-weight: 600 !important;
  transition: all 250ms ease !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--r-brown-deep) !important;
  border-color: var(--r-brown-deep) !important;
  color: var(--r-cream) !important;
}

/* ----- Mini Cart Drawer ----- */
.woocommerce-mini-cart__item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--r-border);
}
.woocommerce-mini-cart__item img { border-radius: 8px; }
.woocommerce-mini-cart__item .r-mini-cart-item-title { font-size: 0.83rem; color: var(--r-brown-deep); font-weight: 600; }
.woocommerce-mini-cart__item .quantity { font-size: 0.8rem; color: var(--r-text-muted); }
.woocommerce-mini-cart__item .remove_from_cart_button {
  margin-left: auto;
  color: var(--r-brown-pale) !important;
  font-size: 1.2rem !important;
  line-height: 1;
}
.woocommerce-mini-cart__item .remove_from_cart_button:hover { color: var(--r-rust) !important; }
.woocommerce-mini-cart.cart_list { margin: 0; padding: 0; list-style: none; }

/* Ordering select */
.woocommerce-ordering select.orderby {
  border: 1px solid var(--r-border-dark) !important;
  border-radius: 30px !important;
  padding: 0.5rem 1rem !important;
  font-size: 0.8rem !important;
  color: var(--r-brown-deep) !important;
  background: var(--r-cream) !important;
  cursor: pointer;
  font-family: var(--r-font) !important;
  outline: none !important;
}

/* Result count */
.woocommerce-result-count {
  font-size: 0.83rem !important;
  color: var(--r-text-muted) !important;
  font-family: var(--r-font) !important;
}

/* Variation swatches / form */
.variations select {
  border: 1px solid var(--r-border-dark) !important;
  border-radius: 8px !important;
  padding: 0.5rem 1rem !important;
  color: var(--r-brown-deep) !important;
  background: var(--r-cream) !important;
  font-family: var(--r-font) !important;
}

@media (max-width: 900px) {
  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem !important; }
}
