/**
 * mospion.ru — Product Page — Design System v2
 * ────────────────────────────────────────────────────────────────
 * Selectors based on Impreza + WooCommerce product page structure:
 *   .woocommerce-product-gallery — image gallery
 *   .entry-title / h1.w-post-elm.post_title — product title
 *   .w-post-elm.product_field.price — price
 *   .w-post-elm.post_content — description
 *   form.cart — add to cart form
 *   .quantity — qty stepper
 *   .single_add_to_cart_button — add to cart button
 *   #byoneclick — buy in 1 click
 *   .related — related products
 */

/* ═══════════════════════════════════════════════════════════════
   PRODUCT TITLE
═══════════════════════════════════════════════════════════════ */

h1.entry-title,
h1.w-post-elm.post_title,
.product_title {
  font-family: 'Bricolage Grotesque', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(24px, 4vw, 40px) !important;
  letter-spacing: -.04em !important;
  line-height: 1.1 !important;
  color: #0D0D0D !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRICE
═══════════════════════════════════════════════════════════════ */

/* Price: monospace font but NO color override —
   the Impreza column us_custom_c07715a2 has background:#3c4140
   so we must let color inherit from the parent theme settings */
.w-post-elm.product_field.price .woocommerce-Price-amount,
.w-post-elm.product_field.price bdi {
  font-family: 'DM Mono', monospace !important;
  font-size: 26px !important;
  font-weight: 500 !important;
  letter-spacing: -.02em !important;
}

p.price,
.price {
  font-family: 'DM Mono', monospace !important;
}

.price del .woocommerce-Price-amount {
  font-size: 14px !important;
  font-weight: 400 !important;
  opacity: .5;
}

.price ins {
  text-decoration: none !important;
}

.variable_price {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT GALLERY
═══════════════════════════════════════════════════════════════ */

.woocommerce-product-gallery {
  border-radius: 20px !important;
  overflow: hidden !important;
  background: #F5F3EF !important;
}

.woocommerce-product-gallery__wrapper {
  border-radius: 20px !important;
  overflow: hidden !important;
}

.woocommerce-product-gallery__image img {
  border-radius: 20px !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
}

/* Thumbnail strip */
.woocommerce-product-gallery .flex-control-thumbs {
  display: flex !important;
  gap: 8px !important;
  margin-top: 12px !important;
  list-style: none !important;
  padding: 0 !important;
}

.woocommerce-product-gallery .flex-control-thumbs li {
  flex: 1 !important;
}

.woocommerce-product-gallery .flex-control-thumbs img {
  border-radius: 10px !important;
  aspect-ratio: 1 !important;
  object-fit: cover !important;
  cursor: pointer !important;
  border: 2px solid transparent !important;
  transition: border-color .14s !important;
  opacity: .7 !important;
}

.woocommerce-product-gallery .flex-control-thumbs .flex-active,
.woocommerce-product-gallery .flex-control-thumbs img:hover {
  border-color: #C4547A !important;
  opacity: 1 !important;
}

/* ═══════════════════════════════════════════════════════════════
   DESCRIPTION
═══════════════════════════════════════════════════════════════ */

.w-post-elm.post_content,
.woocommerce-product-details__short-description,
.woocommerce-Tabs-panel p,
.woocommerce-Tabs-panel {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: #3A3A3A !important;
}

.w-text.us_custom_eaf80277 .w-text-value {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: #6A6A6A !important;
  display: block !important;
  margin-bottom: 6px !important;
}

/* Separator line */
.w-separator {
  opacity: .15 !important;
}

/* ═══════════════════════════════════════════════════════════════
   ADD TO CART FORM
═══════════════════════════════════════════════════════════════ */

/* Don't set display:flex on form.cart — Impreza positions
   qty and button in separate columns via its page builder */

/* ── Quantity stepper ────────────────────────────────────────── */
.woocommerce .quantity {
  display: inline-flex !important;
  align-items: center !important;
  background: #F5F3EF !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  border: none !important;
}

.woocommerce .quantity .qty {
  font-family: 'DM Mono', monospace !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: #0D0D0D !important;
  text-align: center !important;
  width: 44px !important;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.woocommerce .quantity .plus,
.woocommerce .quantity .minus {
  font-size: 18px !important;
  font-weight: 400 !important;
  color: #0D0D0D !important;
  width: 40px !important;
  height: 44px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background .12s !important;
  border-radius: 0 !important;
}

.woocommerce .quantity .plus:hover,
.woocommerce .quantity .minus:hover {
  background: rgba(13,13,13,.08) !important;
  color: #0D0D0D !important;
}

/* spinner arrows — hide native */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

/* ── Add to cart button ──────────────────────────────────────── */
.single_add_to_cart_button,
button[name="add-to-cart"],
.woocommerce button.single_add_to_cart_button.button {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  background: #FF2D6E !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px !important;
  padding: 14px 32px !important;
  height: auto !important;
  cursor: pointer !important;
  transition: background .15s, transform .1s, box-shadow .15s !important;
  letter-spacing: -.01em !important;
}

.single_add_to_cart_button:hover,
button[name="add-to-cart"]:hover {
  background: #E0155A !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(255,45,110,.3) !important;
}

/* ── Buy in 1 click ──────────────────────────────────────────── */
#byoneclick,
.go-order {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #C4547A !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-color: rgba(232,160,192,.4) !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin-top: 4px !important;
  transition: color .14s !important;
}

#byoneclick:hover,
.go-order:hover {
  color: #FF2D6E !important;
  text-decoration-color: rgba(255,45,110,.3) !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCT META (SKU, categories)
═══════════════════════════════════════════════════════════════ */

.product_meta {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  color: #6A6A6A !important;
  margin-top: 16px !important;
}

.product_meta a {
  color: #C4547A !important;
}

.product_meta a:hover {
  color: #FF2D6E !important;
}

/* ═══════════════════════════════════════════════════════════════
   TABS (description, reviews)
═══════════════════════════════════════════════════════════════ */

.woocommerce-tabs .tabs {
  border-bottom: 2px solid rgba(13,13,13,.08) !important;
  display: flex !important;
  gap: 4px !important;
  padding: 0 !important;
  margin-bottom: 24px !important;
  list-style: none !important;
}

.woocommerce-tabs .tabs li a {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #6A6A6A !important;
  padding: 10px 18px !important;
  border-radius: 9999px !important;
  border: none !important;
  background: transparent !important;
  transition: color .14s, background .14s !important;
  display: block !important;
}

.woocommerce-tabs .tabs li a:hover {
  color: #C4547A !important;
  background: rgba(232,160,192,.1) !important;
}

.woocommerce-tabs .tabs li.active a {
  color: #0D0D0D !important;
  background: rgba(13,13,13,.06) !important;
}

/* ═══════════════════════════════════════════════════════════════
   RELATED PRODUCTS
═══════════════════════════════════════════════════════════════ */

.related.products > h2,
.upsells.products > h2 {
  font-family: 'Bricolage Grotesque', sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  letter-spacing: -.035em !important;
  color: #0D0D0D !important;
  margin-bottom: 24px !important;
}

.related .products,
.upsells .products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
  gap: 16px !important;
}

.related .product,
.upsells .product {
  background: #fff !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid rgba(13,13,13,.07) !important;
  transition: box-shadow .2s, transform .2s !important;
}

.related .product:hover,
.upsells .product:hover {
  box-shadow: 0 8px 32px rgba(13,13,13,.1) !important;
  transform: translateY(-2px) !important;
}

.related .product img,
.upsells .product img {
  width: 100% !important;
  aspect-ratio: 1 !important;
  object-fit: cover !important;
}

.related .woocommerce-loop-product__title,
.upsells .woocommerce-loop-product__title {
  font-family: 'Bricolage Grotesque', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
  color: #0D0D0D !important;
  padding: 10px 14px 4px !important;
}

.related .price,
.upsells .price {
  font-family: 'DM Mono', monospace !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  padding: 0 14px 14px !important;
  color: #0D0D0D !important;
}

/* ═══════════════════════════════════════════════════════════════
   SWATCHES (woo-variation-swatches)
═══════════════════════════════════════════════════════════════ */

.wvs-style--default .wvs-term {
  border-radius: var(--mp-r-md, 12px) !important;
  border: 1.5px solid rgba(13,13,13,.12) !important;
  transition: border-color .14s !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
}

.wvs-style--default .wvs-term.selected,
.wvs-style--default .wvs-term:hover {
  border-color: #C4547A !important;
}

/* ═══════════════════════════════════════════════════════════════
   VARIABLE PRICE (shown on product page)
═══════════════════════════════════════════════════════════════ */

.woocommerce-variation-price .woocommerce-Price-amount {
  font-family: 'DM Mono', monospace !important;
  font-size: 24px !important;
  font-weight: 500 !important;
  color: #0D0D0D !important;
}
