/* -------------------------------------------------------------------------
   Cart page: coupon + gift card – same styling as checkout (black border, 8px radius)
   ------------------------------------------------------------------------- */
/* Cart: grey background around both coupon and gift card boxes */
.woocommerce-cart .ok-cart-totals-coupon,
.woocommerce-cart .cart_totals .ok-cart-totals-coupon,
.et_pb_wc_cart_totals .ok-cart-totals-coupon,
.cart-collaterals .cart_totals .ok-cart-totals-coupon {
  margin: 1rem 0 1.25rem !important;
  background: #f0efec !important;
  border-radius: 8px !important;
  padding: 1rem !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-sizing: border-box !important;
}
.et_pb_wc_cart_totals .ok-cart-totals-coupon .coupon,
.cart-collaterals .cart_totals .ok-cart-totals-coupon .coupon,
.woocommerce-cart .ok-cart-totals-coupon .coupon { display: flex !important; align-items: center; gap: .6rem; flex-wrap: wrap; }
.et_pb_wc_cart_totals .ok-cart-totals-coupon .coupon label,
.cart-collaterals .cart_totals .ok-cart-totals-coupon .coupon label,
.woocommerce-cart .ok-cart-totals-coupon .coupon label { display: none !important; }

/* Cart: same input style for coupon and gift card (white bg, black border, 8px radius) */
.woocommerce-cart .ok-cart-totals-coupon input[name="coupon_code"],
.woocommerce-cart .ok-cart-totals-coupon #ok_cart_totals_coupon,
.woocommerce-cart #pwgc-redeem-gift-card-form input[type="text"],
.woocommerce-cart #pwgc-redeem-gift-card-form input[name="card_number"],
.cart_totals .ok-cart-totals-coupon input[name="coupon_code"],
.cart_totals #pwgc-redeem-gift-card-form input[type="text"] {
  height: 44px !important;
  line-height: 44px !important;
  padding: 0 0.85rem !important;
  width: 100% !important;
  max-width: 260px !important;
  box-sizing: border-box !important;
  border: 2px solid #111 !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #111 !important;
  font-size: 1rem !important;
}

/* Cart: IDENTICAL button style for coupon AND gift card (same size text, same as coupon Apply coupon button) */
.woocommerce-cart .ok-cart-totals-coupon .button,
.woocommerce-cart .ok-cart-totals-coupon [name="apply_coupon"],
.woocommerce-cart #pwgc-redeem-gift-card-form .button,
.woocommerce-cart #pwgc-redeem-gift-card-form input[type="submit"],
.woocommerce-cart #pwgc-redeem-gift-card-form button[type="submit"],
.woocommerce-cart #pwgc-redeem-button,
.cart_totals .ok-cart-totals-coupon .button,
.cart_totals #pwgc-redeem-gift-card-form input[type="submit"],
.cart_totals #pwgc-redeem-gift-card-form button[type="submit"],
.cart_totals #pwgc-redeem-button {
  height: 46px !important;
  min-height: 46px !important;
  padding: 12px 1.5rem !important;
  border: 2px solid #111 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #111 !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  text-transform: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.woocommerce-cart .ok-cart-totals-coupon .button:hover,
.woocommerce-cart .ok-cart-totals-coupon [name="apply_coupon"]:hover,
.woocommerce-cart #pwgc-redeem-gift-card-form .button:hover,
.woocommerce-cart #pwgc-redeem-gift-card-form input[type="submit"]:hover,
.woocommerce-cart #pwgc-redeem-gift-card-form button[type="submit"]:hover,
.woocommerce-cart #pwgc-redeem-button:hover,
.cart_totals .ok-cart-totals-coupon .button:hover,
.cart_totals #pwgc-redeem-gift-card-form input[type="submit"]:hover,
.cart_totals #pwgc-redeem-gift-card-form button[type="submit"]:hover,
.cart_totals #pwgc-redeem-button:hover {
  background: #fff !important;
  color: #111 !important;
  border-color: #111 !important;
}

/* Cart: gift card box – same grey background as coupon box */
.woocommerce-cart .cart_totals #pwgc-redeem-gift-card-form,
.woocommerce-cart .cart-collaterals #pwgc-redeem-gift-card-form,
.cart_totals #pwgc-redeem-gift-card-form {
  margin: 1rem 0 1.25rem !important;
  background: #f0efec !important;
  border-radius: 8px !important;
  padding: 1rem !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-sizing: border-box !important;
}
/* Cart: same heading font size for "Have a coupon?" and "Have a gift card?" */
.woocommerce-cart .ok-cart-totals-coupon h3,
.woocommerce-cart .ok-cart-totals-coupon .coupon .ok-coupon-heading,
.cart_totals .ok-cart-totals-coupon h3,
.woocommerce-cart #pwgc-redeem-gift-card-form label,
.cart_totals #pwgc-redeem-gift-card-form label {
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: #333 !important;
  margin: 0 0 0.5rem 0 !important;
}
.woocommerce-cart #pwgc-redeem-gift-card-form label {
  display: block !important;
}
/* Cart: gift card form – same vertical gap between label, input, button as coupon (.6rem) */
.woocommerce-cart #pwgc-redeem-gift-card-form form,
.cart_totals #pwgc-redeem-gift-card-form form {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.6rem !important;
  margin: 0 !important;
}
/* Cart: gift card Apply button – middle-aligned text; same padding above button as coupon */
.woocommerce-cart #pwgc-redeem-gift-card-form input[type="submit"],
.woocommerce-cart #pwgc-redeem-button,
.cart_totals #pwgc-redeem-gift-card-form input[type="submit"],
.cart_totals #pwgc-redeem-button {
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
  margin-top: 0.75rem !important;
  margin-bottom: 0 !important;
}
/* Force "Apply" text centered in gift card submit (override theme .button / form alignment) */
input#pwgc-redeem-button,
#pwgc-redeem-gift-card-form input[type="submit"],
#pwgc-redeem-button.button {
  text-align: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 7rem;
  appearance: none !important;
  -webkit-appearance: none !important;
}
/* Cart: space above Apply coupon button */
.woocommerce-cart .ok-cart-totals-coupon [name="apply_coupon"],
.woocommerce-cart .ok-cart-totals-coupon .button,
.cart_totals .ok-cart-totals-coupon [name="apply_coupon"],
.cart_totals .ok-cart-totals-coupon .button {
  margin-top: 0.75rem !important;
}
/* Cart coupon placeholder: not caps */
.woocommerce-cart .ok-cart-totals-coupon input[name="coupon_code"],
.woocommerce-cart .ok-cart-totals-coupon #ok_cart_totals_coupon {
  text-transform: none !important;
}
.woocommerce-cart .ok-cart-totals-coupon input::placeholder {
  text-transform: none !important;
}

/* Legacy/other contexts: inputs and buttons */
.ok-coupon-gift-row input[name="coupon_code"],
.ok-coupon-gift-row #pwgc-redeem-gift-card-form input[type="text"] {
  height: 44px; line-height: 44px; padding: 0 .85rem; width: 100%; max-width: 260px; box-sizing: border-box;
  border: 2px solid #111; border-radius: 8px; background: #fff; color: #111;
}
.ok-coupon-gift-row [name="apply_coupon"],
.ok-coupon-gift-row #pwgc-redeem-gift-card-form .button,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form input[type="submit"] {
  height: 46px; line-height: 46px; padding: 0 1.15rem;
  border: 2px solid #111 !important; border-radius: 8px;
  background: transparent !important; color: #111 !important; font-weight: 600; text-transform: none; box-shadow: none !important;
}
.ok-coupon-gift-row [name="apply_coupon"]:hover,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form .button:hover,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form input[type="submit"]:hover {
  background: transparent !important; color: #111 !important; border-color: #111 !important;
}

/* -------------------------------------------------------------------------
   Checkout: ok-checkout-coupon-box + pwgc-redeem-gift-card-form – same styling
   ------------------------------------------------------------------------- */
/* Card background: not white; only the input fields are white below */
.woocommerce-checkout .ok-checkout-coupon-box,
.woocommerce-checkout #pwgc-redeem-gift-card-form,
form.checkout .ok-checkout-coupon-box,
form.checkout #pwgc-redeem-gift-card-form {
  margin: 0 0 1rem 0 !important;
  background: #f0efec !important;
  border-radius: 8px !important;
  padding: 1rem !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  text-align: left !important;
}
/* Coupon box inner: same spacing as gift card (label, input, button) */
.woocommerce-checkout .ok-checkout-coupon-box .coupon,
form.checkout .ok-checkout-coupon-box .coupon {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.6rem !important;
}

/* Same label/heading style for both + left alignment (including "Have a coupon?") */
.woocommerce-checkout .ok-checkout-coupon-box .coupon > label,
.woocommerce-checkout .ok-checkout-coupon-box .coupon .ok-coupon-heading,
.woocommerce-checkout .ok-checkout-coupon-box p:first-child,
.woocommerce-checkout #pwgc-redeem-gift-card-form label,
.woocommerce-checkout #pwgc-redeem-gift-card-form .pwgc-label,
form.checkout .ok-checkout-coupon-box .coupon > label,
form.checkout .ok-checkout-coupon-box .coupon .ok-coupon-heading,
form.checkout #pwgc-redeem-gift-card-form label {
  display: block !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  color: #333 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  margin: 0 0 0.25rem 0 !important;
  text-align: left !important;
}
.woocommerce-checkout .ok-checkout-coupon-box .coupon,
.woocommerce-checkout #pwgc-redeem-gift-card-form form,
form.checkout .ok-checkout-coupon-box .coupon,
form.checkout #pwgc-redeem-gift-card-form form {
  text-align: left !important;
  gap: 0.6rem !important;
}
/* Explicit space above Apply buttons (in case theme overrides flex gap) */
.ok-checkout-coupon-box .ok-apply-coupon,
.ok-coupon-gift-row .ok-checkout-coupon-box .ok-apply-coupon,
form.checkout .ok-checkout-coupon-box .ok-apply-coupon {
  margin-top: 0.75rem !important;
}
.woocommerce-checkout #pwgc-redeem-gift-card-form input[type="submit"],
.woocommerce-checkout #pwgc-redeem-button,
form.checkout #pwgc-redeem-gift-card-form input[type="submit"],
form.checkout #pwgc-redeem-button,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form input[type="submit"],
.ok-coupon-gift-row #pwgc-redeem-button {
  margin-top: 0.75rem !important;
  margin-bottom: 0 !important;
}

/* Same input style – coupon and gift card TEXT FIELDS white background (override theme) */
.woocommerce-checkout .ok-checkout-coupon-box #coupon_code,
.woocommerce-checkout .ok-checkout-coupon-box input[name="coupon_code"],
.woocommerce-checkout #pwgc-redeem-gift-card-form input[type="text"],
.woocommerce-checkout #pwgc-redeem-gift-card-form input[type="number"],
form.checkout .ok-checkout-coupon-box #coupon_code,
form.checkout .ok-checkout-coupon-box input[name="coupon_code"],
form.checkout #pwgc-redeem-gift-card-form input[type="text"],
form.checkout #pwgc-redeem-gift-card-form input[type="number"],
.ok-coupon-gift-row .ok-checkout-coupon-box #coupon_code,
.ok-coupon-gift-row .ok-checkout-coupon-box input[name="coupon_code"] {
  height: 44px !important;
  line-height: 44px !important;
  padding: 0 0.85rem !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  border: 2px solid #111 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #111 !important;
  font-size: 1rem !important;
}
/* Coupon placeholder: not caps (override theme uppercase) */
.woocommerce-checkout .ok-checkout-coupon-box #coupon_code,
form.checkout .ok-checkout-coupon-box #coupon_code,
.ok-coupon-gift-row .ok-checkout-coupon-box #coupon_code {
  text-transform: none !important;
}
.woocommerce-checkout .ok-checkout-coupon-box #coupon_code::placeholder,
form.checkout .ok-checkout-coupon-box #coupon_code::placeholder {
  text-transform: none !important;
}

/* Apply coupon + Apply Gift Card: identical padding, height, and hover */
.woocommerce-checkout .ok-checkout-coupon-box .ok-apply-coupon,
.woocommerce-checkout .ok-checkout-coupon-box .button.ok-apply-coupon,
.woocommerce-checkout #pwgc-redeem-gift-card-form .button,
.woocommerce-checkout #pwgc-redeem-gift-card-form input[type="submit"],
.woocommerce-checkout #pwgc-redeem-button,
form.checkout .ok-checkout-coupon-box .ok-apply-coupon,
form.checkout .ok-checkout-coupon-box .button.ok-apply-coupon,
form.checkout #pwgc-redeem-gift-card-form .button,
form.checkout #pwgc-redeem-gift-card-form input[type="submit"],
form.checkout #pwgc-redeem-button,
.ok-coupon-gift-row .ok-checkout-coupon-box .ok-apply-coupon,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form input[type="submit"],
.ok-coupon-gift-row #pwgc-redeem-button {
  height: 46px !important;
  min-height: 46px !important;
  line-height: 1 !important;
  padding: 12px 1.5rem !important;
  border: 2px solid #111 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #111 !important;
  font-weight: 600 !important;
  text-transform: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
/* Same hover for both buttons: white background */
.woocommerce-checkout .ok-checkout-coupon-box .ok-apply-coupon:hover,
.woocommerce-checkout #pwgc-redeem-gift-card-form .button:hover,
.woocommerce-checkout #pwgc-redeem-gift-card-form input[type="submit"]:hover,
.woocommerce-checkout #pwgc-redeem-button:hover,
form.checkout .ok-checkout-coupon-box .ok-apply-coupon:hover,
form.checkout #pwgc-redeem-gift-card-form .button:hover,
form.checkout #pwgc-redeem-gift-card-form input[type="submit"]:hover,
form.checkout #pwgc-redeem-button:hover,
.ok-coupon-gift-row .ok-checkout-coupon-box .ok-apply-coupon:hover,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form input[type="submit"]:hover,
.ok-coupon-gift-row #pwgc-redeem-button:hover {
  background: #fff !important;
  color: #111 !important;
  border-color: #111 !important;
}

/* Checkout: side-by-side row when JS has moved both into .ok-coupon-gift-row */
.ok-coupon-gift-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: stretch;
  margin-bottom: 1rem;
}
.ok-coupon-gift-row .ok-checkout-coupon-box,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form {
  margin: 0 !important;
  flex: 0 0 30%;
  min-width: 0;
  max-width: 30%;
}
/* Same vertical spacing between label, input, and button in both boxes */
.ok-coupon-gift-row .ok-checkout-coupon-box .coupon,
.ok-coupon-gift-row #pwgc-redeem-gift-card-form form {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;
  gap: 0.6rem !important;
}
.ok-coupon-gift-row #pwgc-redeem-gift-card-form form {
  flex-wrap: wrap !important;
}

@media (max-width: 768px) {
  .ok-coupon-gift-row { flex-direction: column; }
  .ok-coupon-gift-row .ok-checkout-coupon-box,
  .ok-coupon-gift-row #pwgc-redeem-gift-card-form {
    flex: 1 1 100%;
    max-width: 100%;
  }
  .ok-coupon-gift-row .ok-apply-coupon,
  .ok-coupon-gift-row #pwgc-redeem-gift-card-form .button,
  .ok-coupon-gift-row #pwgc-redeem-gift-card-form input[type="submit"] {
    width: 100%;
  }
}

/* CENTER "Apply" text in gift card button – highest specificity to override theme */
body input#pwgc-redeem-button,
body #pwgc-redeem-button.button,
body .cart_totals input#pwgc-redeem-button,
body .woocommerce-cart input#pwgc-redeem-button,
body #pwgc-redeem-gift-card-form input[type="submit"][name="redeem_gift_card"],
input[type="submit"][id="pwgc-redeem-button"] {
  text-align: center !important;
}

/* Override theme/WooCommerce button font-size (20px → 18px) so Apply coupon / Apply Gift Card match */
.woocommerce #content input.button,
.woocommerce #content input.button.alt,
.woocommerce #respond input#submit,
.woocommerce #respond input#submit.alt,
.woocommerce-page #content input.button,
.woocommerce-page #content input.button.alt,
.woocommerce-page #respond input#submit,
.woocommerce-page #respond input#submit.alt,
.woocommerce-page a.button,
.woocommerce-page a.button.alt,
.woocommerce-page button.button,
.woocommerce-page button.button.alt,
.woocommerce-page button.button.alt.disabled,
.woocommerce-page input.button,
.woocommerce-page input.button.alt,
.woocommerce a.button,
.woocommerce a.button.alt,
.woocommerce button.button,
.woocommerce button.button.alt,
.woocommerce button.button.alt.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled],
.woocommerce input.button,
.woocommerce input.button.alt {
  font-size: 18px !important;
}