/**
 * Google Pay wrapper: LAYOUT ONLY.
 *
 * Root cause of the grey frame:
 * the official Google Pay black button ships with ButtonOptions.buttonBorderType
 * default = default_border (thin official border).
 * PPCP does not pass buttonBorderType, so the SDK keeps that border.
 *
 * The previous wrapper background:#000 created a second black surface around
 * that official hairline and made it look boxed-in. That layer is removed.
 *
 * Do not suppress official SDK chrome with generic resets.
 * Do not restyle the official Google control internals.
 */

body.woocommerce-cart .ppcp-button-googlepay,
body.woocommerce-checkout .ppcp-button-googlepay,
body.woocommerce-order-pay .ppcp-button-googlepay,
body.single-product .ppcp-button-googlepay {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 750px;
  height: 45px;
  min-height: 45px;
  margin-top: 14px;
  background: transparent;
  line-height: 0;
}

body.woocommerce-cart .ppcp-width-min .ppcp-button-googlepay,
body.woocommerce-checkout .ppcp-width-min .ppcp-button-googlepay,
body.woocommerce-order-pay .ppcp-width-min .ppcp-button-googlepay,
body.single-product .ppcp-width-min .ppcp-button-googlepay {
  height: 35px;
  min-height: 35px;
}

body.woocommerce-cart .ppcp-width-300 .ppcp-button-googlepay,
body.woocommerce-checkout .ppcp-width-300 .ppcp-button-googlepay,
body.woocommerce-order-pay .ppcp-width-300 .ppcp-button-googlepay,
body.single-product .ppcp-width-300 .ppcp-button-googlepay {
  height: 45px;
  min-height: 45px;
}

body.woocommerce-cart .ppcp-width-500 .ppcp-button-googlepay,
body.woocommerce-checkout .ppcp-width-500 .ppcp-button-googlepay,
body.woocommerce-order-pay .ppcp-width-500 .ppcp-button-googlepay,
body.single-product .ppcp-width-500 .ppcp-button-googlepay {
  height: 55px;
  min-height: 55px;
}

body.woocommerce-cart .ppcp-button-googlepay.ppcp-button-minicart,
body.woocommerce-checkout .ppcp-button-googlepay.ppcp-button-minicart,
body.single-product .ppcp-button-googlepay.ppcp-button-minicart {
  display: block;
}