/**
 * Luxur-E WooCommerce Styles
 * Overrides default WooCommerce to match luxury aesthetic
 */

/* ─── Product title ─────────────────────────────────── */
.woocommerce .product_title {
  font-family: var(--font-display) !important;
  font-size: clamp(32px, 4vw, 56px) !important;
  font-weight: 700 !important;
  color: #f0ede8 !important;
  line-height: 1.1 !important;
  margin-bottom: 16px !important;
}

/* ─── Price ──────────────────────────────────────────── */
.woocommerce .price,
.woocommerce .woocommerce-Price-amount {
  font-family: var(--font-ui) !important;
  font-size: 28px !important;
  color: var(--gold) !important;
}

.woocommerce del .woocommerce-Price-amount {
  color: rgba(240,237,232,0.3) !important;
  font-size: 18px !important;
}

/* ─── Add to cart button ────────────────────────────── */
.woocommerce .single_add_to_cart_button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button {
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  padding: 18px 48px !important;
  background: var(--grad-purple-pink) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 2px !important;
  transition: all 0.4s ease !important;
  cursor: pointer !important;
}

.woocommerce .single_add_to_cart_button:hover,
.woocommerce button.button:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 15px 40px rgba(191,95,255,0.4) !important;
  background: var(--grad-purple-pink) !important;
}

/* ─── Product images ────────────────────────────────── */
.woocommerce .woocommerce-product-gallery {
  border: 1px solid var(--glass-border) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  background: var(--glass-bg) !important;
}

/* ─── Tabs ──────────────────────────────────────────── */
.woocommerce .woocommerce-tabs ul.tabs {
  border-bottom: 1px solid var(--glass-border) !important;
  background: none !important;
  padding: 0 !important;
  display: flex !important;
  gap: 0 !important;
}

.woocommerce .woocommerce-tabs ul.tabs li {
  background: none !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
}

.woocommerce .woocommerce-tabs ul.tabs li a {
  font-family: var(--font-ui) !important;
  font-size: 12px !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: rgba(240,237,232,0.5) !important;
  padding: 16px 24px !important;
}

.woocommerce .woocommerce-tabs ul.tabs li.active {
  border-bottom-color: var(--orchid) !important;
}

.woocommerce .woocommerce-tabs ul.tabs li.active a {
  color: var(--orchid) !important;
}

.woocommerce .woocommerce-tabs .panel {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  border-top: none !important;
  padding: 32px !important;
  font-family: var(--font-body) !important;
  font-size: 17px !important;
  font-style: italic !important;
  color: rgba(240,237,232,0.7) !important;
  line-height: 1.8 !important;
}

/* ─── Reviews ───────────────────────────────────────── */
.woocommerce #reviews #comments ol.commentlist li {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: 4px !important;
  margin-bottom: 16px !important;
  padding: 24px !important;
}

.woocommerce #reviews #comments ol.commentlist .comment-text p {
  color: rgba(240,237,232,0.7) !important;
  font-family: var(--font-body) !important;
  font-style: italic !important;
}

/* ─── Related products ──────────────────────────────── */
.woocommerce .related h2,
.woocommerce .upsells h2 {
  font-family: var(--font-display) !important;
  font-size: 36px !important;
  font-weight: 700 !important;
  color: #f0ede8 !important;
  margin-bottom: 32px !important;
}

/* ─── Cart & Checkout ───────────────────────────────── */
.woocommerce-cart table.cart,
.woocommerce-checkout form .form-row input,
.woocommerce-checkout form .form-row textarea,
.woocommerce-checkout form .form-row select {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  color: #f0ede8 !important;
  font-family: var(--font-body) !important;
  border-radius: 2px !important;
}

.woocommerce-checkout form .form-row input:focus,
.woocommerce-checkout form .form-row textarea:focus {
  border-color: var(--orchid) !important;
  box-shadow: 0 0 20px var(--orchid-glow) !important;
  outline: none !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  color: #f0ede8 !important;
}

/* ─── Shop archive grid ──────────────────────────────── */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 28px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.woocommerce ul.products li.product {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  transition: all 0.4s ease !important;
  text-decoration: none !important;
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-8px) !important;
  border-color: rgba(191,95,255,0.3) !important;
  box-shadow: 0 30px 80px rgba(0,0,0,0.5) !important;
}

.woocommerce ul.products li.product a.woocommerce-loop-product__link img {
  width: 100% !important;
  height: 260px !important;
  object-fit: cover !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--font-display) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #f0ede8 !important;
  padding: 16px 20px 8px !important;
}

.woocommerce ul.products li.product .price {
  font-family: var(--font-ui) !important;
  font-size: 18px !important;
  color: var(--gold) !important;
  padding: 0 20px 16px !important;
}

/* ─── Notices ────────────────────────────────────────── */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  background: rgba(191,95,255,0.06) !important;
  border-top: 3px solid var(--orchid) !important;
  color: #f0ede8 !important;
  font-family: var(--font-body) !important;
  border-radius: 2px !important;
}

/* ─── Quantity input ────────────────────────────────── */
.woocommerce .quantity input[type=number] {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  color: #f0ede8 !important;
  font-family: var(--font-ui) !important;
  padding: 12px 16px !important;
  border-radius: 2px !important;
  text-align: center !important;
}

/* ─── Order received ────────────────────────────────── */
.woocommerce .woocommerce-thankyou-order-received {
  font-family: var(--font-display) !important;
  font-size: 28px !important;
  color: var(--emerald) !important;
}
