/* Width of the fancyBox popup */
body {
  font-family: "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  margin: 1em;
  max-width: 400px;
}

label {
  display: block;
  margin-bottom: 0.5em;
  margin-top: 0 !important;
}
p.password-notice label {
  font-size: 14px;
  text-align: center;
}

h2 {
  font-size: 22px;
  font-weight: normal;
  margin: 0 0 1em;
}

h2.with-subtitle {
  margin-bottom: 0;
}

/* Hide "Billing details" and "Your order" */
h3 {
  display: none;
}

h4 {
  font-size: 15px;
  font-weight: normal;
  margin-top: 7px;
  text-transform: uppercase;
}

p,
.woocommerce button.button {
  font-family: "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 18px;
}

h2, p {
  margin-bottom: 1em;
}

input[type="text"], input[type="email"], input[type="password"] {
  border: 1px solid lightgray;
  border-radius: 6px;
  font-size: 1rem;
  height: 45px;
  padding: .9rem .5rem;
}

form.woocommerce-checkout {
  width: 100%;
}

.woocommerce .col2-set .col-1 {
  float: none;
  width: 100%;
}

body.quick-checkout .woocommerce form .form-row {
  padding: 0;
  margin-bottom: 1em;
}

#billing_email_field {
  margin-bottom: .7em;
}

body.quick-checkout .woocommerce-checkout #payment div.form-row {
  padding: 0;
  margin-bottom: 0;
}

.wc-saved-payment-methods {
  display: none;
}

/* Full width for gateway fields */
.woocommerce-page input[type="radio"].shipping_method ~ .payment_box,
.woocommerce-page input[type="radio"][name="payment_method"] ~ .payment_box {
  padding-left: 0;
}

.woocommerce-terms-and-conditions-wrapper {
  margin-bottom: 0;
}


/* Hide the "Pay via PayPal" text */
.payment_box.payment_method_ppcp-gateway {
  display: none !important;
}

/* Do not show red star next to email field, as it's the only field, so of course it's required */
#billing_email_field .required {
  display: none;
}

/* Hide email field when logged in */
body.logged-in .woocommerce-billing-fields {
  display: none;
}

/* Payment selection box should have no background */
body.quick-checkout .woocommerce-checkout #payment {
  background: transparent;
}
/* Payment selection box should have no border and padding */
body.quick-checkout .woocommerce-checkout #payment ul.payment_methods {
  border: 0;
  padding: 0;
}

/* Hide the radio buttons for payment methods */
.wc_payment_method .input-radio {
  display: none;
}

/* Payment method labels should look like buttons */
.woocommerce-checkout #payment ul.payment_methods li > label {
  background: rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  cursor: pointer;
  display: block;
  font-weight: 600;
  list-style: none;
  height: 35px;
  margin-bottom: 10px;
  padding: 5px 10px;
  text-align: center;
}
.woocommerce-checkout #payment ul.payment_methods li:hover > label {
  background: rgba(0, 0, 0, 0.2);
}
.woocommerce-checkout #payment ul.payment_methods li.payment_method_stripe > label {
  background-color: #635bff;
  color: #fff;
}
.woocommerce-checkout #payment ul.payment_methods li.payment_method_stripe:hover > label {
  background-color: #433bdf;
}

/* Hide the PayPal radio button as we show the PayPal button at all times if available */
.payment_method_ppcp-gateway {
  display: none;
}
/* PayPal button bottom spacing as it has been moved to the top of the payment methods */
.ppc-button-wrapper {
  margin-bottom: 1em;
}
/* PayPal button should always show */
#ppc-button-ppcp-gateway {
  display: block !important;
}

/* No border for "Have a coupon?" notice and errors as it's not consistent in block and PHP themes */
.woocommerce-error, .woocommerce-info, .woocommerce-message {
  border: 0;
  margin-bottom: 1em;
}

body.quick-checkout .woocommerce form.woocommerce-form-coupon,
body.quick-checkout .woocommerce form.woocommerce-form-login {
  border: 0;
  padding: 0;
  margin: 0;
}

.woocommerce form.woocommerce-form-coupon {
  display: grid;
  grid-template-columns: 3fr 1fr;
  grid-column-gap: .5em;
  position: relative;
}
.woocommerce form.woocommerce-form-coupon .woocommerce-error,
.woocommerce form.woocommerce-form-coupon .woocommerce-message {
  left: 0;
  position: absolute;
  right: 0;
  top: -8px;
}
.woocommerce form.woocommerce-form-coupon .form-row {
  width: 100%;
}
.woocommerce button {
  height: 45px;
  width: 100%;
  -webkit-font-smoothing: antialiased;
}

/* Hide coupon form intro text */
.woocommerce-form-coupon > p:first-of-type {
  display: none;
}

/* We always create the account, but we need this form input as we use it to register new users. */
.create-account {
  display: none;
}

body.quick-checkout .woocommerce .woocommerce-form-login .woocommerce-form-login__submit {
  float: none;
  margin-right: 0;
}

.lost_password {
  text-align: center;
}
.lost_password a {
  text-decoration: none;
}

.fv-player-ppv-login-errors {
  position: relative;
}
.fv-player-ppv-login-errors.is-loading ul {
  opacity: .1;
}
.fv-player-ppv-login-errors-loading {
  color: black;
  margin: 0;
  position: absolute;
  text-align: center;
  top: 25%;
  width: 100%;
}

/* PayPal button height will be at least 45px, so let's reserve the space */
#ppc-button-ppcp-gateway {
  min-height: 45px;
}

/* Hide to order review section initially, then show with JS on ppcp-shown event */
#order_review {
  display: none;
}

/* Avoid animated loading indicators */
body.quick-checkout .woocommerce .blockUI.blockOverlay::before {
  background: transparent;
}

/**
 * Twenty Twenty-Three fixes
 */
.woocommerce-checkout #payment ul.payment_methods li > label:before {
  content: unset;
}
.woocommerce-billing-fields > *,
#order_review > * {
  margin-top: 0 !important;
}

@media (max-width: 331px) {
  input[type="text"], input[type="email"], input[type="password"],
  .woocommerce button.button,
  .woocommerce-checkout #payment ul.payment_methods li > label {
    height: 35px;
    padding: 0px .5em;
  }
}