/* =============================================
   SPVEGAN SHOP — woocommerce.css
   WooCommerce override styles
   ============================================= */

/* ─── GENERAL WC RESETS ─── */
.woocommerce,
.woocommerce-page {
  font-family: var(--sp-font-body);
  color: var(--sp-text);
}

/* Notices */
.woocommerce-notices-wrapper { margin-bottom: 1.5rem; }
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  background: var(--sp-green-light);
  border-left: 4px solid var(--sp-green);
  border-radius: var(--sp-radius-sm);
  padding: 0.875rem 1rem;
  margin-bottom: 1rem;
  font-size: 0.9375rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  list-style: none;
}
.woocommerce-error {
  background: #fff5f5;
  border-color: var(--sp-coral);
}
.woocommerce-info {
  background: #EFF8FF;
  border-color: #3B9BDB;
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { display: none; }
.woocommerce-message .button,
.woocommerce-info .button {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.875rem;
  background: var(--sp-green);
  color: #fff;
  border-radius: var(--sp-radius-sm);
  font-size: 0.875rem;
  font-weight: 600;
  border: none;
  margin-left: auto;
  white-space: nowrap;
  transition: background var(--sp-transition);
}
.woocommerce-message .button:hover { background: var(--sp-green-dark); color: #fff; }

/* ─── PRODUCT PRICE ─── */
.woocommerce span.price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--sp-green);
  font-weight: 700;
}
.woocommerce span.price del,
.woocommerce div.product p.price del {
  color: var(--sp-text-muted);
  font-weight: 400;
  font-size: 0.85em;
}
.woocommerce span.price ins,
.woocommerce div.product p.price ins {
  text-decoration: none;
  font-weight: 700;
  color: var(--sp-coral);
}

/* ─── STAR RATINGS ─── */
.woocommerce .star-rating {
  color: #f5a623;
  font-size: 0.875rem;
  display: inline-block;
}
.woocommerce .star-rating span {
  color: #f5a623;
  overflow: hidden;
}

/* ─── FORM FIELDS ─── */
.woocommerce form .form-row { margin-bottom: 1rem; }
.woocommerce form .form-row label {
  display: block;
  font-weight: 600;
  font-size: 0.875rem;
  margin-bottom: 0.375rem;
  color: var(--sp-text);
}
.woocommerce form .form-row label .required { color: var(--sp-coral); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  width: 100%;
  padding: 0.65rem 0.875rem;
  border: 1.5px solid var(--sp-border);
  border-radius: var(--sp-radius-sm);
  font-family: var(--sp-font-body);
  font-size: 0.9375rem;
  background: #fff;
  color: var(--sp-text);
  transition: border-color var(--sp-transition), box-shadow var(--sp-transition);
  -webkit-appearance: none;
  appearance: none;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  outline: none;
  border-color: var(--sp-green);
  box-shadow: 0 0 0 3px rgba(29,158,117,0.15);
}
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid textarea {
  border-color: var(--sp-coral);
}
.woocommerce form .form-row.woocommerce-validated input.input-text {
  border-color: var(--sp-green);
}

/* ─── BUTTONS ─── */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.65rem 1.375rem;
  background: var(--sp-green);
  color: #fff;
  border: 2px solid var(--sp-green);
  border-radius: var(--sp-radius-sm);
  font-family: var(--sp-font-heading);
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--sp-transition), border-color var(--sp-transition);
  text-decoration: none;
  -webkit-appearance: none;
  appearance: none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  background: var(--sp-green-dark);
  border-color: var(--sp-green-dark);
  color: #fff;
}
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: var(--sp-green);
  border-color: var(--sp-green);
  color: #fff;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: var(--sp-green-dark);
  border-color: var(--sp-green-dark);
}

/* ─── MY ACCOUNT ─── */
.woocommerce-account .woocommerce { display: flex; gap: 2rem; flex-wrap: wrap; }
.woocommerce-account .woocommerce-MyAccount-navigation {
  width: 220px;
  flex-shrink: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul { padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 0.625rem 0.875rem;
  border-radius: var(--sp-radius-sm);
  color: var(--sp-text);
  font-size: 0.9375rem;
  font-weight: 500;
  transition: background var(--sp-transition), color var(--sp-transition);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
  background: var(--sp-green-light);
  color: var(--sp-green);
}
.woocommerce-account .woocommerce-MyAccount-content { flex: 1; min-width: 0; }

/* ─── ORDER DETAILS TABLE ─── */
.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
  width: 100%;
  border-collapse: collapse;
  border-radius: var(--sp-radius);
  overflow: hidden;
  border: 1px solid var(--sp-border);
  margin-bottom: 1.5rem;
}
.woocommerce table.shop_table thead th {
  background: var(--sp-bg);
  padding: 0.875rem 1rem;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--sp-text-muted);
  border-bottom: 1px solid var(--sp-border);
  text-align: left;
}
.woocommerce table.shop_table tbody td {
  padding: 1rem;
  border-bottom: 1px solid var(--sp-border);
  vertical-align: middle;
  font-size: 0.9375rem;
}
.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--sp-border);
  font-weight: 600;
}
.woocommerce table.shop_table tfoot tr:last-child td,
.woocommerce table.shop_table tfoot tr:last-child th {
  font-size: 1.125rem;
  font-weight: 700;
  border-top: 2px solid var(--sp-text);
  border-bottom: none;
}

/* ─── CHECKOUT PAYMENT METHODS ─── */
.woocommerce-checkout #payment {
  background: var(--sp-bg);
  border-radius: var(--sp-radius);
  overflow: hidden;
}
.woocommerce-checkout #payment ul.payment_methods {
  padding: 1.25rem;
  border-bottom: 1px solid var(--sp-border);
}
.woocommerce-checkout #payment ul.payment_methods li {
  margin-bottom: 0.75rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--sp-border);
}
.woocommerce-checkout #payment ul.payment_methods li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.woocommerce-checkout #payment ul.payment_methods label {
  font-weight: 600;
  cursor: pointer;
}
.woocommerce-checkout #payment .payment_box {
  background: #fff;
  border-radius: var(--sp-radius-sm);
  padding: 1rem;
  margin-top: 0.5rem;
  border: 1px solid var(--sp-border);
}
.woocommerce-checkout #payment .place-order { padding: 1.25rem; }

/* ─── COUPON FORM ─── */
.woocommerce-cart .coupon { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
.woocommerce-cart .coupon input#coupon_code {
  flex: 1;
  max-width: 240px;
}
.woocommerce-cart .coupon .button {
  padding: 0.625rem 1rem;
  font-size: 0.875rem;
}

/* ─── PRODUCT GALLERY ─── */
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper { }
.woocommerce div.product div.images figure { margin: 0; }

/* ─── PRODUCT TABS ─── */
.woocommerce div.product .woocommerce-tabs { margin: 2rem 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 0; border-bottom: 1px solid var(--sp-border); }
.woocommerce div.product .woocommerce-tabs ul.tabs li { display: inline-block; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: block;
  padding: 0.75rem 1.25rem;
  color: var(--sp-text-muted);
  font-weight: 600;
  border: none;
  border-bottom: 2px solid transparent;
  background: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--sp-green);
  border-bottom-color: var(--sp-green);
}
.woocommerce div.product .woocommerce-tabs .panel { padding: 1.5rem 0; }

/* ─── WOOCOMMERCE PRODUCT ORDERING ─── */
.woocommerce-ordering { }
.woocommerce-ordering select {
  border: 1.5px solid var(--sp-border);
  border-radius: var(--sp-radius-sm);
  padding: 0.5rem 2rem 0.5rem 0.75rem;
  font-size: 0.875rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888780' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  cursor: pointer;
  width: auto;
}

/* ─── AJAX LOADING SPINNER ─── */
.woocommerce .blockUI.blockOverlay {
  background: rgba(250,250,248,0.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='32' height='32'%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='%231D9E75' stroke-width='2.5' stroke-dasharray='32' stroke-dashoffset='0'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='0.7s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E") center center no-repeat !important;
  border-radius: var(--sp-radius);
}

/* ─── CHECKOUT SHIP TO DIFFERENT ADDRESS ─── */
#ship-to-different-address label { font-weight: 700; }
#ship-to-different-address-checkbox { margin-right: 0.5rem; }

/* ─── SHOP EMPTY ─── */
.woocommerce-info.woocommerce-empty-cart-message {
  flex-direction: column;
  text-align: center;
  padding: 3rem;
}

/* ─── ORDER RECEIVED ─── */
.woocommerce-order-received .woocommerce-thankyou-order-received {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sp-green);
  margin-bottom: 1.5rem;
}
.woocommerce-order-received ul.order_details {
  background: var(--sp-green-light);
  border-radius: var(--sp-radius);
  padding: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-bottom: 2rem;
  list-style: none;
}
.woocommerce-order-received ul.order_details li {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sp-text-muted);
}
.woocommerce-order-received ul.order_details li strong {
  display: block;
  font-size: 1rem;
  color: var(--sp-text);
  font-weight: 700;
}

/* ─── PRODUCT REVIEWS ─── */
#reviews { }
#reviews h2 { font-size: 1.375rem; font-weight: 800; margin-bottom: 1.25rem; }
.woocommerce-reviews-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 1rem; }
.commentlist { list-style: none; }
.comment_container {
  display: flex;
  gap: 1rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--sp-border);
}
.comment_container img { border-radius: 50%; }
.comment-text { flex: 1; }
.woocommerce-review__author { font-weight: 700; }
.woocommerce-review__dash { margin: 0 0.25rem; color: var(--sp-text-muted); }
.woocommerce-review__published-date { font-size: 0.8125rem; color: var(--sp-text-muted); }

#review_form { }
#review_form h3 { font-size: 1.25rem; font-weight: 700; margin-bottom: 1.25rem; }
#review_form_wrapper .form-submit input {
  display: inline-flex;
  align-items: center;
  padding: 0.65rem 1.375rem;
  background: var(--sp-green);
  color: #fff;
  border: none;
  border-radius: var(--sp-radius-sm);
  font-family: var(--sp-font-heading);
  font-weight: 600;
  font-size: 0.9375rem;
  cursor: pointer;
  transition: background var(--sp-transition);
}
#review_form_wrapper .form-submit input:hover { background: var(--sp-green-dark); }

/* ─── ACCOUNT LOGIN/REGISTER ─── */
.woocommerce-form-login,
.woocommerce-form-register {
  background: #fff;
  border: 1px solid var(--sp-border);
  border-radius: var(--sp-radius);
  padding: 2rem;
}
.woocommerce-form-login__submit,
.woocommerce-form-register__submit {
  width: 100%;
}
.woocommerce-privacy-policy-text { font-size: 0.8125rem; color: var(--sp-text-muted); margin-top: 0.5rem; }

/* ─── COUPON TAG ─── */
.wc-block-components-chip,
.woocommerce-remove-coupon {
  background: var(--sp-green-light);
  color: var(--sp-green-dark);
  border-radius: 50px;
  padding: 0.2rem 0.625rem;
  font-size: 0.8125rem;
  font-weight: 600;
}

/* ─── ONSALE BADGE ─── */
.woocommerce span.onsale {
  background: var(--sp-coral);
  color: #fff;
  border-radius: 50px;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.25rem 0.625rem;
  min-height: auto;
  min-width: auto;
  line-height: 1.4;
  top: 0.75rem;
  left: 0.75rem;
  right: auto;
}

/* ─── PRODUCT ADD-TO-CART ANIMATION ─── */
.sp-quick-add.adding {
  opacity: 0.7;
  pointer-events: none;
}
.sp-quick-add.added {
  background: var(--sp-green-dark);
}

/* ─── PAYMENT ICONS RESPONSIVE ─── */
@media (max-width: 480px) {
  .sp-footer__payments { display: none; }
}
