/**
 * WooCommerce CSS Overrides
 *
 * Custom WooCommerce overrides for pokemoncenter-theme.
 *
 * @package PokemonCenter
 * @version 2.0.0
 */

/* WooCommerce Buttons */
.woocommerce a.button, 
.woocommerce button.button, 
.woocommerce input.button, 
.woocommerce #respond input[type="submit"] {
  background-color: var(--brand-secondary) !important;
  color: var(--black) !important;
  font-family: var(--font-family-alt) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 10px 20px !important;
  border: none !important;
}

.woocommerce a.button:hover, 
.woocommerce button.button:hover, 
.woocommerce input.button:hover {
  background-color: var(--brand-secondary-darker) !important;
  color: var(--black) !important;
}

.woocommerce a.button.alt, 
.woocommerce button.button.alt, 
.woocommerce input.button.alt {
  background-color: var(--brand-primary) !important;
  color: var(--white) !important;
}

.woocommerce a.button.alt:hover, 
.woocommerce button.button.alt:hover, 
.woocommerce input.button.alt:hover {
  background-color: var(--brand-primary-darker) !important;
  color: var(--white) !important;
}

/* Product Badges */
.woocommerce span.onsale {
  background-color: var(--alert-color) !important;
  color: var(--white) !important;
  font-family: var(--font-family-alt) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
  padding: 4px 8px !important;
  min-height: auto !important;
  line-height: 1 !important;
}

/* Single Product Page Layout */
.single-product .product {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  padding-top: 30px;
  padding-bottom: 50px;
}

@media (max-width: 768px) {
  .single-product .product {
    grid-template-columns: 1fr;
  }
}

/* Payment Gateway Section Compatibility (PayPal & Stripe) */
.woocommerce-checkout #payment {
  background-color: var(--gray-lightest) !important;
  border: 1px solid var(--gray-light) !important;
  border-radius: 0 !important;
  padding: 20px !important;
}

.woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid var(--gray-light) !important;
  padding-bottom: 15px !important;
}

.woocommerce-checkout #payment div.payment_box {
  background-color: var(--white) !important;
  border: 1px solid var(--gray-lighter) !important;
  color: var(--body-color) !important;
  font-size: 13px !important;
  padding: 12px 15px !important;
  border-radius: 0 !important;
}

.woocommerce-checkout #place_order {
  background-color: var(--brand-primary) !important;
  color: var(--white) !important;
  font-size: 16px !important;
  width: 100% !important;
  border-radius: 0 !important;
  padding: 14px 20px !important;
}

.woocommerce-checkout #place_order:hover {
  background-color: var(--brand-primary-darker) !important;
}