/* =====================================================================
   کاسب — Product Seller Box CSS (flat design)
   ===================================================================== */

/* ── Design tokens ─────────────────────────────────────────────────── */
.woocommerce div.product .vrs-product-sections,
.vrs-auction-box,
.vrs-seller-box,
.vrs-marketing-box,
.vrs-qna-section {
  --vrs-product-border:       #e2e8f0;
  --vrs-product-text:         #1e293b;
  --vrs-product-muted:        #64748b;
  --vrs-product-surface:      #ffffff;
  --vrs-product-bg:           #f8fafc;
  --vrs-product-accent:       #0f766e;
  --vrs-product-accent-dark:  #0d6661;
  --vrs-product-accent-soft:  #f0fdf4;
  --vrs-product-danger:       #dc2626;
  --vrs-product-success:      #16a34a;
}

/* ── Product sections wrapper (full-width below summary) ───────────── */
.woocommerce div.product .vrs-product-sections,
.vrs-product-sections {
  margin: 24px 0 16px;
  display: grid;
  gap: var(--vrs-gap-md);
  box-sizing: border-box;
  direction: rtl;
  clear: both;
  width: 100%;
}

/* ── Shared box style ──────────────────────────────────────────────── */
.woocommerce div.product .vrs-marketing-box,
.woocommerce div.product .vrs-seller-box,
.vrs-marketing-box,
.vrs-seller-box {
  box-sizing: border-box;
  margin: 0;
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-md);
  background: var(--vrs-color-surface);
  padding: var(--vrs-card-padding);
}
.woocommerce div.product .vrs-marketing-box,
.vrs-marketing-box { border-inline-start: 3px solid var(--vrs-color-info); }
.woocommerce div.product .vrs-seller-box,
.vrs-seller-box    { border-inline-start: 3px solid var(--vrs-color-primary); }

.vrs-marketing-box h4,
.vrs-seller-box h4 {
  margin: 0 0 8px;
  line-height: 1.5;
  color: var(--vrs-product-text);
  font-weight: 700;
}
.vrs-marketing-box > :last-child,
.vrs-seller-box > :last-child { margin-bottom: 0; }
.vrs-marketing-box p,
.vrs-seller-box p {
  margin: 0 0 8px;
  line-height: 1.8;
  color: var(--vrs-product-muted);
}

/* ── Marketing actions ─────────────────────────────────────────────── */
.vrs-marketing-actions {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.vrs-marketing-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  border: 1px solid var(--vrs-product-accent);
  background: var(--vrs-product-accent);
  color: #fff;
  border-radius: 6px;
  padding: 7px 14px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.vrs-marketing-btn:hover {
  background: var(--vrs-product-accent-dark);
  border-color: var(--vrs-product-accent-dark);
  color: #fff;
}

/* ── Marketing popup ───────────────────────────────────────────────── */
.vrs-marketing-popup {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, 0.5);
  z-index: var(--vrs-z-overlay);
  padding: 16px;
}
.vrs-marketing-popup.is-visible { display: flex; }
.vrs-marketing-popup-inner {
  width: min(96vw, 520px);
  background: var(--vrs-product-surface);
  border: 1px solid var(--vrs-product-border);
  border-radius: 8px;
  padding: 20px;
  position: relative;
}
.vrs-marketing-popup-close {
  position: absolute;
  top: 10px;
  inset-inline-end: 10px;
  width: 30px;
  height: 30px;
  border: 1px solid var(--vrs-product-border);
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vrs-marketing-popup h3 {
  margin: 0 0 10px;
  padding-inline-end: 34px;
  color: var(--vrs-product-text);
  font-size: 16px;
  font-weight: 700;
}
.vrs-marketing-popup p {
  margin: 0 0 10px;
  color: var(--vrs-product-muted);
  font-size: 13px;
  line-height: 1.8;
}
.vrs-marketing-ref-link {
  display: block;
  margin: 6px 0;
  border: 1px dashed var(--vrs-product-border);
  background: var(--vrs-product-bg);
  border-radius: 6px;
  padding: 10px;
  word-break: break-all;
  font-size: 12px;
  font-family: monospace;
}
.vrs-marketing-copy-notice {
  margin-top: 8px;
  font-size: 12px;
  color: var(--vrs-product-success);
  min-height: 18px;
}
.vrs-marketing-copy-notice.is-error { color: var(--vrs-product-danger); }

/* ── Seller box ────────────────────────────────────────────────────── */
.vrs-seller-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.vrs-seller-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--vrs-product-text);
}
.vrs-seller-meta { margin: 4px 0 0; color: var(--vrs-product-muted); font-size: 13px; }
.vrs-seller-rate-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(15,118,110,0.2);
  border-radius: 20px;
  padding: 4px 12px;
  background: var(--vrs-product-accent-soft);
  color: var(--vrs-product-accent);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.vrs-seller-foot {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid var(--vrs-product-border);
  padding-top: 10px;
}
.vrs-seller-rate-count { color: var(--vrs-product-muted); font-size: 12px; }
.vrs-seller-store-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  text-decoration: none;
  border: 1px solid var(--vrs-product-accent);
  border-radius: 6px;
  padding: 5px 12px;
  color: var(--vrs-product-accent);
  font-size: 13px;
  font-weight: 600;
  background: var(--vrs-product-surface);
  transition: background 0.15s, color 0.15s;
}
.vrs-seller-store-link:hover {
  background: var(--vrs-product-accent);
  color: #fff;
}

/* ── Verified badge ────────────────────────────────────────────────── */
.vrs-verified-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--vrs-product-accent);
  color: #fff;
  font-size: 9px;
  font-style: normal;
  vertical-align: middle;
  margin-inline-start: 4px;
}

/* ── Rating form ───────────────────────────────────────────────────── */
.vrs-rate-form {
  margin-top: 14px;
  padding: 12px;
  border: 1px solid var(--vrs-product-border);
  border-radius: 8px;
  background: var(--vrs-product-bg);
  display: grid;
  gap: 8px;
}
.vrs-rate-notice {
  border: 1px solid var(--vrs-color-success-border);
  background: var(--vrs-color-success-bg);
  color: var(--vrs-color-success-dark);
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 12px;
}
.vrs-rate-label { display: block; color: var(--vrs-product-text); font-size: 13px; font-weight: 600; }
.vrs-rate-select,
.vrs-rate-comment {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--vrs-product-border);
  border-radius: 6px;
  padding: 8px 10px;
  background: #fff;
  color: var(--vrs-product-text);
  font-family: inherit;
  transition: border-color 0.15s;
}
.vrs-rate-select:focus,
.vrs-rate-comment:focus {
  outline: none;
  border-color: var(--vrs-product-accent);
}
.vrs-rate-comment { min-height: 80px; resize: vertical; }
.vrs-rate-submit {
  justify-self: start;
  border: 1px solid var(--vrs-product-accent);
  border-radius: 6px;
  padding: 8px 14px;
  background: var(--vrs-product-accent);
  color: #fff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  transition: background 0.15s;
}
.vrs-rate-submit:hover { background: var(--vrs-product-accent-dark); }

/* ── Auction participation box (single product page) ─────────────────── */
.vrs-auction-box {
  border: 1px solid var(--vrs-color-accent-warm-border);
  border-radius: var(--vrs-radius-md);
  background: var(--vrs-color-accent-warm-soft);
  padding: var(--vrs-card-padding);
  margin: 16px 0;
  display: grid;
  gap: var(--vrs-gap-md);
}
.vrs-auction-box h4 {
  margin: 0;
  color: var(--vrs-color-accent-warm-dark);
  font-size: var(--vrs-font-size-lg);
  font-weight: 700;
}
.vrs-auction-box h5 {
  margin: 0 0 8px;
  color: var(--vrs-color-accent-warm-dark);
  font-size: var(--vrs-font-size-sm);
  font-weight: 700;
}
.vrs-auction-meta,
.vrs-auction-next-min {
  margin: 0;
  color: var(--vrs-color-accent-warm-dark);
  font-size: var(--vrs-font-size-sm);
  line-height: 1.7;
}
.vrs-auction-ended-note {
  margin: 0;
  color: var(--vrs-color-danger);
  font-weight: 700;
}

.vrs-auction-price {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid var(--vrs-color-accent-warm-border);
  border-radius: var(--vrs-radius-md);
  background: var(--vrs-color-surface);
}
.vrs-auction-price-title { font-size: var(--vrs-font-size-md); font-weight: 700; color: var(--vrs-color-accent-warm-dark); }
.vrs-auction-price-state {
  display: inline-flex;
  width: fit-content;
  font-size: var(--vrs-font-size-xs);
  font-weight: 700;
  color: var(--vrs-color-accent-warm-dark);
  background: var(--vrs-color-accent-warm-soft);
  border: 1px solid var(--vrs-color-accent-warm-border);
  border-radius: var(--vrs-radius-pill);
  padding: 2px 8px;
}
.vrs-auction-price-line { font-size: var(--vrs-font-size-sm); color: var(--vrs-color-accent-warm-dark); }
.vrs-auction-price-line strong { color: var(--vrs-color-text); font-weight: 700; }

.vrs-auction-bid-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--vrs-gap-sm);
  align-items: center;
}
.vrs-auction-bid-form label {
  grid-column: 1 / -1;
  margin: 0;
  font-size: var(--vrs-font-size-sm);
  font-weight: 700;
  color: var(--vrs-color-accent-warm-dark);
}
.vrs-auction-bid-form input[type="number"] {
  min-width: 0;
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--vrs-color-accent-warm-border);
  border-radius: var(--vrs-radius-sm);
  background: var(--vrs-color-surface);
  padding: 7px 10px;
  font-family: inherit;
}
.vrs-auction-submit-btn {
  min-height: 40px;
  padding: 8px 16px;
  border: 1px solid var(--vrs-color-accent-warm-dark);
  border-radius: var(--vrs-radius-sm);
  background: var(--vrs-color-accent-warm-dark);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  transition: background var(--vrs-transition), border-color var(--vrs-transition);
}
.vrs-auction-submit-btn:hover {
  background: var(--vrs-color-accent-warm);
  border-color: var(--vrs-color-accent-warm);
}
.vrs-auction-message { margin-top: 0; font-size: var(--vrs-font-size-sm); line-height: 1.7; }
.vrs-auction-message.is-error   { color: var(--vrs-color-danger); }
.vrs-auction-message.is-success { color: var(--vrs-color-success); }
.vrs-auction-winner-box {
  padding: 10px 12px;
  border-radius: var(--vrs-radius-md);
  border: 1px solid var(--vrs-color-success-bright);
  background: var(--vrs-color-success-soft);
  color: var(--vrs-color-success);
}

/* bids list */
.vrs-auction-bids-box { margin: 0; }
.vrs-auction-bids-list {
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid var(--vrs-color-accent-warm-border);
  background: var(--vrs-color-surface);
  border-radius: var(--vrs-radius-md);
  padding: 8px;
  display: grid;
  gap: 6px;
}
.vrs-auction-bid-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-sm);
  background: var(--vrs-color-surface);
  padding: 6px 8px;
  font-size: var(--vrs-font-size-sm);
  color: var(--vrs-color-text);
}
.vrs-auction-bid-row.is-top { border-color: var(--vrs-color-success-bright); background: var(--vrs-color-success-soft); color: var(--vrs-color-success); font-weight: 700; }
.vrs-auction-bid-row.is-empty { justify-content: center; color: var(--vrs-color-muted); border-style: dashed; }
.vrs-auction-bid-amount { font-weight: 700; }
.vrs-auction-bid-head { display: inline-flex; align-items: center; gap: 6px; }
.vrs-auction-bid-user { width: 18px; height: 18px; display: inline-flex; align-items: center; }
.vrs-auction-bid-user svg { width: 18px; height: 18px; fill: currentColor; }
.vrs-auction-bid-prefix { font-size: var(--vrs-font-size-xs); font-weight: 700; color: var(--vrs-color-muted); }
.vrs-auction-bid-row.is-top .vrs-auction-bid-prefix { color: var(--vrs-color-success); }

@media (max-width: 640px) {
  .vrs-auction-box { padding: var(--vrs-card-padding-sm); }
  .vrs-auction-bid-form { grid-template-columns: 1fr; }
  .vrs-auction-submit-btn { width: 100%; }
}

/* ── Unified loop badge / timer (auction + service share the same pill) ── */
.vrs-loop-badge,
.vrs-auction-loop-badge,
.vrs-auction-card-timer,
.vrs-auction-loop-timer,
.vrs-service-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--vrs-radius-pill);
  border: 1px solid var(--vrs-color-border);
  background: var(--vrs-color-surface-soft);
  color: var(--vrs-color-text);
  font-size: var(--vrs-font-size-xs);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
}

/* Auction badge / timer use warm accent */
.vrs-auction-loop-badge,
.vrs-auction-loop-timer,
.vrs-auction-card-timer {
  border-color: var(--vrs-color-accent-warm-border);
  background: var(--vrs-color-accent-warm-soft);
  color: var(--vrs-color-accent-warm-dark);
}
.vrs-auction-loop-timer { direction: ltr; margin-top: 6px; }

/* Service badge uses primary accent */
.vrs-service-badge {
  border-color: var(--vrs-color-primary);
  background: var(--vrs-color-primary-soft);
  color: var(--vrs-color-primary);
}

/* Ended state shared between auction badge + timer */
.vrs-auction-loop-badge.is-ended,
.vrs-auction-loop-timer.is-ended,
.vrs-auction-card-timer.is-ended {
  border-color: var(--vrs-color-border);
  background: var(--vrs-color-surface-soft);
  color: var(--vrs-color-muted);
}

.vrs-auction-loop-icon { line-height: 1; width: 14px; height: 14px; display: inline-flex; align-items: center; }
.vrs-auction-loop-icon svg { width: 14px; height: 14px; fill: currentColor; }

.vrs-auction-time-left { direction: ltr; display: inline-flex; gap: 2px; font-variant-numeric: tabular-nums; }
.vrs-auction-time-left .vrs-timer-part,
.vrs-auction-loop-timer .vrs-timer-part { display: inline-block; min-width: 2ch; text-align: center; }

/* ── Unified loop action button (auction + service share the same shape) ── */
.vrs-loop-action,
.vrs-auction-loop-action,
.vrs-service-loop-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  padding: 8px 14px;
  border-radius: var(--vrs-radius-sm);
  font-size: var(--vrs-font-size-sm);
  font-weight: 700;
  text-decoration: none;
  border: 1px solid var(--vrs-color-primary);
  background: var(--vrs-color-primary);
  color: #fff;
  transition: background var(--vrs-transition), border-color var(--vrs-transition);
}
.vrs-loop-action:hover,
.vrs-auction-loop-action:hover,
.vrs-service-loop-button:hover {
  background: var(--vrs-color-primary-dark);
  border-color: var(--vrs-color-primary-dark);
  color: #fff;
}

/* Auction action button uses warm accent */
.vrs-auction-loop-action {
  border-color: var(--vrs-color-accent-warm);
  background: var(--vrs-color-accent-warm);
}
.vrs-auction-loop-action:hover {
  background: var(--vrs-color-accent-warm-dark);
  border-color: var(--vrs-color-accent-warm-dark);
}

.vrs-auction-loop-action-icon { display: none; width: 16px; height: 16px; align-items: center; }
.vrs-auction-loop-action-icon svg { width: 16px; height: 16px; fill: currentColor; }

/* auction product card in archive */
.woocommerce ul.products li.product.vrs-auction-product,
.wc-block-grid__product.vrs-auction-product,
.wp-block-post.vrs-auction-product {
  overflow: hidden;
  padding: 12px;
  border: 1px solid var(--vrs-product-border);
  border-radius: 8px;
  background: #fff;
  transition: border-color 0.15s;
  box-sizing: border-box;
  direction: rtl;
}
.woocommerce ul.products li.product.vrs-auction-product:hover,
.wc-block-grid__product.vrs-auction-product:hover,
.wp-block-post.vrs-auction-product:hover { border-color: var(--vrs-product-accent); }

.woocommerce ul.products li.product.vrs-auction-product img,
.wc-block-grid__product.vrs-auction-product img,
.wp-block-post.vrs-auction-product img { border-radius: 6px; }

/* hide WC default add-to-cart on auction products */
.woocommerce ul.products li.product.vrs-auction-product .button.add_to_cart_button,
.woocommerce ul.products li.product.vrs-auction-product .button.ajax_add_to_cart,
.woocommerce ul.products li.product.vrs-auction-product .button.product_type_simple,
.woocommerce ul.products li.product.vrs-auction-product .button.product_type_variable,
.woocommerce ul.products li.product.vrs-auction-product .button.product_type_grouped,
.woocommerce ul.products li.product.vrs-auction-product .button.product_type_external,
.woocommerce ul.products li.product.vrs-auction-product a.added_to_cart,
.vrs-auction-product .button.add_to_cart_button,
.vrs-auction-product .button.ajax_add_to_cart,
.vrs-auction-product .button.product_type_simple,
.vrs-auction-product .button.product_type_variable,
.vrs-auction-product .button.product_type_grouped,
.vrs-auction-product .button.product_type_external,
.vrs-auction-product a.added_to_cart,
.wc-block-grid__product.vrs-auction-product .wc-block-grid__product-add-to-cart,
.wp-block-post.vrs-auction-product .wp-block-woocommerce-product-button { display: none !important; }
.vrs-auction-product .vrs-auction-loop-action { display: inline-flex !important; }

/* ── Auction participation modal ───────────────────────────────────── */
.vrs-auction-participation-modal {
  position: fixed;
  inset: 0;
  z-index: var(--vrs-z-overlay);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(15, 23, 42, 0.5);
}
.vrs-auction-participation-modal.is-visible { display: flex; }
.vrs-auction-participation-backdrop { position: absolute; inset: 0; }
.vrs-auction-participation-dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 500px);
  padding: 24px;
  border: 1px solid var(--vrs-product-border);
  border-radius: 8px;
  background: #fff;
}
.vrs-auction-participation-close {
  position: absolute;
  top: 12px;
  inset-inline-end: 12px;
  width: 32px;
  height: 32px;
  border: 1px solid var(--vrs-product-border);
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vrs-auction-participation-dialog h3 { margin: 0 0 8px; font-size: 18px; font-weight: 700; color: var(--vrs-product-text); }
.vrs-auction-participation-desc { margin: 0 0 14px; color: var(--vrs-product-muted); font-size: 13px; }
.vrs-auction-participation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.vrs-auction-participation-dialog label { display: grid; gap: 5px; margin-bottom: 10px; font-weight: 600; font-size: 13px; }
.vrs-auction-participation-dialog input {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--vrs-product-border);
  border-radius: 6px;
  background: #fff;
  padding: 7px 10px;
  box-sizing: border-box;
  font-family: inherit;
}
.vrs-auction-participation-dialog input:focus {
  border-color: var(--vrs-product-accent);
  outline: none;
}
.vrs-auction-participation-summary {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 12px;
  margin: 12px 0;
  padding: 12px;
  border: 1px solid rgba(15,118,110,0.2);
  border-radius: 8px;
  background: var(--vrs-product-accent-soft);
  font-size: 13px;
}
.vrs-auction-participation-summary span { color: var(--vrs-product-muted); font-weight: 600; }
.vrs-auction-participation-summary strong { color: var(--vrs-product-accent); font-weight: 700; }
.vrs-auction-participation-error { min-height: 20px; margin-bottom: 10px; color: var(--vrs-product-danger); font-size: 13px; font-weight: 600; }
.vrs-auction-participation-submit { width: 100%; }

@media (max-width: 640px) {
  .vrs-auction-participation-dialog { padding: 16px; }
  .vrs-auction-participation-grid { grid-template-columns: 1fr; }
}

/* ── Service product ───────────────────────────────────────────────── */
.vrs-service-booking-box,
.vrs-service-card {
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-md);
  background: var(--vrs-color-surface);
  padding: var(--vrs-card-padding);
  margin: 16px 0;
  direction: rtl;
}
.vrs-service-booking-box h3,
.vrs-service-card h3 { margin: 0 0 10px; font-size: var(--vrs-font-size-lg); font-weight: 700; }
.vrs-service-step { display: none; margin-top: 14px; }
.vrs-service-step.is-active { display: block; }

/* Step navigation footer (prev/next) */
.vrs-service-step-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--vrs-gap-sm);
  margin-top: 16px;
  flex-wrap: wrap;
}
.vrs-service-step-nav > * { min-width: 0; }
.vrs-service-step-nav .vrs-service-prev {
  background: var(--vrs-color-surface-soft);
  color: var(--vrs-color-text);
  border: 1px solid var(--vrs-color-border);
}
.vrs-service-step-nav .vrs-service-prev:hover {
  background: var(--vrs-color-border);
  color: var(--vrs-color-text);
}
.vrs-service-step-nav button[disabled] { opacity: 0.5; cursor: not-allowed; }
@media (max-width: 480px) {
  .vrs-service-step-nav { flex-direction: column-reverse; align-items: stretch; }
  .vrs-service-step-nav button,
  .vrs-service-step-nav > span { width: 100%; }
}
.vrs-service-days,
.vrs-service-slots,
.vrs-service-slot-preview,
.vrs-service-summary,
.vrs-service-days-selector { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.vrs-service-days span,
.vrs-service-slot,
.vrs-service-slot-preview span {
  border: 1px solid var(--vrs-product-border);
  border-radius: 6px;
  background: #fff;
  padding: 6px 12px;
  font-size: 13px;
}
.vrs-service-slot { cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.vrs-service-slot.is-selected { border-color: var(--vrs-product-accent); background: var(--vrs-product-accent-soft); color: var(--vrs-product-accent); font-weight: 600; }
.vrs-service-slot:disabled { opacity: 0.4; cursor: not-allowed; }
.vrs-service-message { min-height: 22px; margin-top: 10px; font-size: 13px; }
.vrs-service-message.is-error { color: var(--vrs-product-danger); }
.vrs-service-message.is-success { color: var(--vrs-product-success); }
/* ── Shop archive (unified for auction + service + vendor store) ────── */
.vrs-shop-archive,
.vrs-auction-archive,
.vrs-service-archive {
  margin: 24px 0;
  direction: rtl;
  display: grid;
  gap: var(--vrs-gap-lg);
}
.vrs-shop-filter,
.vrs-auction-filter,
.vrs-service-filter {
  display: flex;
  flex-wrap: wrap;
  gap: var(--vrs-gap-sm);
  padding: var(--vrs-card-padding-sm);
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-md);
  background: var(--vrs-color-surface);
}
.vrs-shop-filter input,
.vrs-shop-filter select,
.vrs-auction-filter input,
.vrs-auction-filter select,
.vrs-service-filter input,
.vrs-service-filter select {
  flex: 1 1 160px;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-sm);
  background: var(--vrs-color-surface);
  font-size: var(--vrs-font-size-sm);
}
.vrs-shop-filter .vrs-btn,
.vrs-auction-filter .vrs-btn,
.vrs-service-filter .vrs-btn { flex: 0 0 auto; min-height: 36px; }

.vrs-shop-grid,
.vrs-auction-grid,
.vrs-service-grid {
  display: grid;
  grid-template-columns: repeat(var(--vrs-auction-cols-desktop, 4), minmax(0, 1fr));
  gap: var(--vrs-gap-lg);
}
@media (max-width: 1024px) {
  .vrs-shop-grid,
  .vrs-auction-grid,
  .vrs-service-grid {
    grid-template-columns: repeat(var(--vrs-auction-cols-tablet, 3), minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .vrs-shop-grid,
  .vrs-auction-grid,
  .vrs-service-grid {
    grid-template-columns: repeat(var(--vrs-auction-cols-mobile, 2), minmax(0, 1fr));
  }
}
@media (max-width: 480px) {
  .vrs-shop-grid,
  .vrs-auction-grid,
  .vrs-service-grid { grid-template-columns: 1fr; }
}

.vrs-shop-pagination,
.vrs-auction-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: center;
  margin-top: var(--vrs-gap-lg);
}
.vrs-shop-pagination .vrs-auction-page-btn,
.vrs-auction-pagination .vrs-auction-page-btn {
  min-width: 36px;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-sm);
  background: var(--vrs-color-surface);
  color: var(--vrs-color-text);
  text-decoration: none;
  cursor: pointer;
  font-weight: 600;
  font-size: var(--vrs-font-size-sm);
}
.vrs-shop-pagination .vrs-auction-page-btn.is-active,
.vrs-auction-pagination .vrs-auction-page-btn.is-active {
  background: var(--vrs-color-primary);
  border-color: var(--vrs-color-primary);
  color: #fff;
}

/* Auction / Service card (in the grid) */
.vrs-auction-card,
.vrs-service-card {
  display: flex;
  flex-direction: column;
  margin: 0;
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-md);
  background: var(--vrs-color-surface);
  overflow: hidden;
  transition: border-color var(--vrs-transition);
}
.vrs-auction-card:hover,
.vrs-service-card:hover { border-color: var(--vrs-color-primary); }
.vrs-auction-card-thumb,
.vrs-service-card-image {
  display: block;
  background: var(--vrs-color-surface-soft);
  overflow: hidden;
}
.vrs-auction-card-thumb img,
.vrs-service-card-image img {
  display: block;
  width: 100%;
  height: 180px;
  object-fit: cover;
}
.vrs-auction-no-thumb {
  display: block;
  width: 100%;
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--vrs-color-muted);
  font-size: var(--vrs-font-size-sm);
  background: var(--vrs-color-surface-soft);
}
.vrs-auction-card-body,
.vrs-service-card-body {
  display: flex;
  flex-direction: column;
  gap: var(--vrs-gap-sm);
  padding: var(--vrs-card-padding-sm);
  flex: 1;
}
.vrs-auction-card-title {
  font-size: var(--vrs-font-size-md);
  font-weight: 700;
  color: var(--vrs-color-text);
  text-decoration: none;
  line-height: 1.5;
}
.vrs-auction-card-title:hover { color: var(--vrs-color-primary); }
.vrs-auction-card-badge-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  min-height: var(--vrs-btn-min-height, 36px);
  margin-top: 4px;
}
/* Push timer to the *left* and button to the *right* in RTL by giving the
   timer auto inline-start margin. The button is rendered first in HTML, so
   under RTL it naturally sits on the right; the timer follows and is pushed
   to the opposite edge. */
.vrs-auction-card-badge-wrap > .vrs-auction-card-timer,
.vrs-auction-card-badge-wrap > .vrs-auction-loop-timer {
  margin-inline-start: auto;
  min-height: var(--vrs-btn-min-height, 36px);
  display: inline-flex;
  align-items: center;
}
.vrs-auction-card-badge-wrap > .vrs-auction-loop-action {
  min-height: var(--vrs-btn-min-height, 36px);
  display: inline-flex;
  align-items: center;
}

/* Ended-state action button: muted but still clickable, label «مشاهده مزایده» */
.vrs-auction-loop-action.is-ended {
  background: var(--vrs-color-surface-soft);
  border-color: var(--vrs-color-border-strong);
  color: var(--vrs-color-text);
}
.vrs-auction-loop-action.is-ended:hover {
  background: var(--vrs-color-surface);
  color: var(--vrs-color-primary);
  border-color: var(--vrs-color-primary);
}

/* Spacing for card body + meta */
.vrs-auction-card-body,
.vrs-service-card-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  flex: 1;
}
.vrs-auction-card-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px dashed var(--vrs-color-border);
  color: var(--vrs-color-muted);
  font-size: var(--vrs-font-size-sm);
}
.vrs-auction-card-meta strong { color: var(--vrs-color-text); }

/* .vrs-service-badge and .vrs-service-loop-button core styles are defined
   in the unified loop block above — only spacing additions are local */
.vrs-service-badge { margin-bottom: 4px; }

/* service product cards (mirror auction card structure) */
.woocommerce ul.products li.product.vrs-service-product,
.wc-block-grid__product.vrs-service-product,
.wp-block-post.vrs-service-product {
  overflow: hidden;
  padding: 12px;
  border: 1px solid var(--vrs-color-border);
  border-radius: var(--vrs-radius-md);
  background: var(--vrs-color-surface);
  transition: border-color var(--vrs-transition);
  box-sizing: border-box;
  direction: rtl;
}
.woocommerce ul.products li.product.vrs-service-product:hover,
.wc-block-grid__product.vrs-service-product:hover,
.wp-block-post.vrs-service-product:hover { border-color: var(--vrs-color-primary); }
.woocommerce ul.products li.product.vrs-service-product img,
.wc-block-grid__product.vrs-service-product img,
.wp-block-post.vrs-service-product img { border-radius: var(--vrs-radius-sm); }

/* hide default WC elements for service products — keep only the service loop button */
.woocommerce ul.products li.product.vrs-service-product .button:not(.vrs-service-loop-button),
.woocommerce ul.products li.product.vrs-service-product a.added_to_cart,
.woocommerce ul.products li.product.vrs-service-product a.add_to_cart_button:not(.vrs-service-loop-button),
.woocommerce ul.products li.product.vrs-service-product a.ajax_add_to_cart:not(.vrs-service-loop-button),
.vrs-service-product .button:not(.vrs-service-loop-button),
.vrs-service-product a.add_to_cart_button:not(.vrs-service-loop-button),
.vrs-service-product a.ajax_add_to_cart:not(.vrs-service-loop-button),
.vrs-service-product a.added_to_cart,
.vrs-service-product .price,
.vrs-service-product span.price,
.wc-block-grid__product.vrs-service-product .wc-block-grid__product-add-to-cart,
.wp-block-post.vrs-service-product .wp-block-woocommerce-product-button,
.wp-block-post.vrs-service-product .wp-block-woocommerce-product-price { display: none !important; }
.vrs-service-product .vrs-service-loop-button { display: inline-flex !important; }
/* URL-based fallback: WC add-to-cart links always contain add-to-cart in the href */
.vrs-service-product a[href*="add-to-cart"]:not(.vrs-service-loop-button) { display: none !important; }
/* data-product_id targets ajax add-to-cart buttons regardless of class */
.vrs-service-product a[data-product_id]:not(.vrs-service-loop-button),
.vrs-service-product a[data-product-id]:not(.vrs-service-loop-button) { display: none !important; }

/* ── Service button :has() fallback (modern browsers) ──────────────── */
/* Hides WC add-to-cart when the service loop button is already present,
   without needing the vrs-service-product class on the parent element. */
@supports selector(:has(*)) {
  li.product:has(a.vrs-service-loop-button) .add_to_cart_button:not(.vrs-service-loop-button),
  li.product:has(a.vrs-service-loop-button) .ajax_add_to_cart:not(.vrs-service-loop-button),
  li.product:has(a.vrs-service-loop-button) a[href*="add-to-cart"]:not(.vrs-service-loop-button),
  li.product:has(a.vrs-service-loop-button) a[data-product_id]:not(.vrs-service-loop-button),
  li.product:has(a.vrs-service-loop-button) a[data-product-id]:not(.vrs-service-loop-button),
  li.product:has(a.vrs-service-loop-button) button[name="add-to-cart"],
  li.product:has(a.vrs-service-loop-button) .wp-element-button:not(.vrs-service-loop-button),
  li.product:has(a.vrs-service-loop-button) form.cart,
  article.product:has(a.vrs-service-loop-button) .add_to_cart_button:not(.vrs-service-loop-button),
  article.product:has(a.vrs-service-loop-button) a[href*="add-to-cart"]:not(.vrs-service-loop-button),
  .products .product:has(a.vrs-service-loop-button) form.cart,
  .wc-block-grid__product:has(a.vrs-service-loop-button) .wc-block-grid__product-add-to-cart,
  .wp-block-post:has(a.vrs-service-loop-button) .wp-block-woocommerce-product-button { display: none !important; }
}

/* ── Q&A section (single product page) ─────────────────────────────── */
.vrs-qna-section {
  margin: 24px 0;
  padding: 20px;
  background: var(--vrs-product-surface);
  border: 1px solid var(--vrs-product-border);
  border-radius: 8px;
  direction: rtl;
}
.vrs-qna-title {
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 16px;
  color: var(--vrs-product-text);
}
.vrs-qna-list { margin-bottom: 20px; }
.vrs-qna-item {
  padding: 12px 0;
  border-bottom: 1px solid var(--vrs-product-border);
}
.vrs-qna-item:last-child { border-bottom: none; }
.vrs-qna-question,
.vrs-qna-answer {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 14px;
}
.vrs-qna-answer {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--vrs-product-border);
}
.vrs-qna-icon { flex-shrink: 0; font-style: normal; }
.vrs-qna-text { margin: 0 0 4px; line-height: 1.7; color: var(--vrs-product-text); }
.vrs-qna-meta { font-size: 12px; color: var(--vrs-product-muted); }
.vrs-qna-vendor-badge {
  display: inline-flex;
  align-items: center;
  background: var(--vrs-color-success-bg);
  color: var(--vrs-product-success);
  padding: 1px 8px;
  border-radius: 10px;
  font-size: var(--vrs-font-size-xs);
  font-weight: 600;
  border: 1px solid var(--vrs-color-success-border);
}
.vrs-qna-form-wrap { margin-top: 16px; }
.vrs-qna-form-wrap h4 { font-size: 14px; margin: 0 0 12px; color: var(--vrs-product-text); }
.vrs-qna-form-wrap textarea,
.vrs-qna-form-wrap input[type="text"] {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--vrs-product-border);
  border-radius: 6px;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 14px;
  color: var(--vrs-product-text);
  background: var(--vrs-product-surface);
  margin-bottom: 8px;
  transition: border-color 0.15s;
}
.vrs-qna-form-wrap textarea:focus,
.vrs-qna-form-wrap input[type="text"]:focus {
  outline: none;
  border-color: var(--vrs-product-accent);
}
.vrs-qna-form-wrap textarea { min-height: 80px; resize: vertical; }
.vrs-qna-form-wrap button[type="submit"],
.vrs-qna-submit-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border: 1px solid var(--vrs-product-accent, #0f766e);
  background: var(--vrs-product-accent, #0f766e);
  color: #fff;
  border-radius: 6px;
  padding: 7px 16px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s;
}
.vrs-qna-form-wrap button[type="submit"]:hover,
.vrs-qna-submit-btn:hover { background: var(--vrs-product-accent-dark, #0d6661); }
.vrs-qna-notice {
  margin-top: 8px;
  font-size: 13px;
  color: var(--vrs-product-success);
  font-weight: 500;
}
.vrs-qna-error {
  margin-top: 8px;
  font-size: 13px;
  color: var(--vrs-product-danger);
}

/* ── Responsive ────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .vrs-auction-loop-action-label { display: none; }
  .vrs-auction-loop-action-icon { display: inline-flex; }
  .vrs-auction-loop-action { min-width: 36px; padding: 6px 8px; }
}

@media (max-width: 640px) {
  .woocommerce div.product .vrs-product-sections { gap: 10px; }
  .woocommerce div.product .vrs-marketing-box,
  .woocommerce div.product .vrs-seller-box { padding: 12px; }
  .vrs-seller-head,
  .vrs-seller-foot { flex-direction: column; align-items: stretch; }
  .vrs-marketing-actions { flex-direction: column; }
  .vrs-marketing-btn,
  .vrs-seller-store-link,
  .vrs-rate-submit { width: 100%; }
  .vrs-auction-bid-form { flex-direction: column; }
  .vrs-auction-bid-form input[type="number"],
  .vrs-auction-submit-btn { width: 100%; }
  .vrs-auction-participation-grid,
  .vrs-auction-participation-summary { grid-template-columns: 1fr; }
}