/* MakeupState Dynamic Product Page - Additional Styles */

@keyframes toastIn {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}

@keyframes toastOut {
  from {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
  to {
    opacity: 0;
    transform: translateX(-50%) translateY(20px);
  }
}

/* WooCommerce Integration */
.woocommerce-product-rating {
  margin-bottom: 1rem;
}

.woocommerce-variation-add-to-cart {
  padding: 1rem 0;
}

/* Responsive Design */
@media (max-width: 768px) {
  .sticky-bar {
    padding: 0.3rem 0.5rem;
  }
  
  .sticky-price {
    font-size: 0.65rem;
  }
  
  .spnew {
    font-size: 0.95rem;
  }
  
  .satc-btn {
    padding: 0.35rem 0.6rem;
    font-size: 0.6rem;
  }
  
  .pbtn-group {
    margin-bottom: 4rem;
  }
}

/* Product Page Container */
.woocommerce.single-product {
  background: var(--bg);
}

.woocommerce.single-product .entry-header {
  display: none;
}

/* Quantity and Add to Cart */
.quantity {
  margin: 0.5rem 0;
}

.quantity input.qty {
  width: 60px;
  padding: 0.4rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  text-align: center;
  font-weight: 700;
}

.quantity button {
  background: var(--bg2);
  border: 1px solid var(--border);
  padding: 0.4rem 0.6rem;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.2s;
}

.quantity button:hover {
  border-color: var(--crimson);
  color: var(--crimson);
}

/* Add to Cart Button */
.single_add_to_cart_button {
  width: 100% !important;
  padding: 0.7rem !important;
  background: var(--crimson) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 0.75rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  cursor: pointer;
  transition: all 0.2s;
}

.single_add_to_cart_button:hover {
  background: var(--crimson-dk) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(196, 30, 58, 0.2) !important;
}

.single_add_to_cart_button.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Reviews and Ratings */
.woocommerce-Reviews {
  margin: 1rem 0;
}

.comment-form-comment textarea {
  border-radius: 8px !important;
  border: 1px solid var(--border) !important;
}

/* Product Meta */
.product_meta {
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 1rem 0;
  margin: 1rem 0;
  font-size: 0.65rem;
}

.product_meta a {
  color: var(--crimson);
  font-weight: 700;
}

.product_meta a:hover {
  text-decoration: underline;
}

/* Tab Navigation */
.woocommerce-tabs {
  margin: 1rem 0;
}

.woocommerce-tabs ul.tabs {
  border-bottom: 2px solid var(--border);
  padding: 0 1rem;
  list-style: none;
  display: flex;
  gap: 1rem;
}

.woocommerce-tabs ul.tabs li {
  padding: 0.5rem 0;
}

.woocommerce-tabs ul.tabs li.active {
  border-bottom: 2px solid var(--crimson);
  margin-bottom: -2px;
}

.woocommerce-tabs ul.tabs li a {
  color: var(--text2);
  font-weight: 700;
  text-decoration: none;
  transition: color 0.2s;
}

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

/* Related Products */
.related.products {
  margin: 2rem 0;
  padding: 0 1rem;
}

.related.products h2 {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 1rem;
}

/* Upsells */
.upsells.products {
  margin: 2rem 0;
  padding: 0 1rem;
}

.upsells.products h2 {
  font-family: 'Playfair Display', serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 1rem;
}

/* Visibility */
.pinfo,
.pbtn-group,
.sticky-bar {
  display: block;
}

/* Success Message */
.woocommerce-message {
  background: var(--emerald-lt) !important;
  color: var(--emerald) !important;
  border-left: 4px solid var(--emerald) !important;
  padding: 1rem !important;
  margin: 1rem !important;
  border-radius: 4px;
}

.woocommerce-message::before {
  content: "✓ ";
  font-weight: 800;
}

/* Error Message */
.woocommerce-error {
  background: #FEE !important;
  color: var(--crimson) !important;
  border-left: 4px solid var(--crimson) !important;
  padding: 1rem !important;
  margin: 1rem !important;
  border-radius: 4px;
}

/* Notice Message */
.woocommerce-notice {
  background: var(--gold-lt) !important;
  color: var(--gold-dk) !important;
  border-left: 4px solid var(--gold) !important;
  padding: 1rem !important;
  margin: 1rem !important;
  border-radius: 4px;
}
