<?php ?>

<style>
	* {
		box-sizing: border-box;	
	}
	
    .wfacp_collapsible_order_summary_wrap {
        display: none !important;
    }

    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .form_section_single_step_0_gutenberg {
        margin: 0 !important;
        padding-bottom: 0 !important;

        border-width: 0 !important;
        background-color: transparent;
    }

    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .form_section_single_step_1_gutenberg {
        margin: 0 !important;

        border-width: 0 !important;
        background-color: transparent;
    }

    #wfacp-e-form .wfacp-section.wfacp_payment {
        border-radius: 0 !important;
        border-width: 0px !important;
        border-color: #B7C7B7;
        background-color: #F1F0F6 !important;
    }

    body #wfacp-e-form .woocommerce-checkout #payment ul.payment_methods {
        background-color: #FFFFFF;
    
	}
	
	.wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp_main_form.woocommerce button#place_order {
		background: #ea2222ff !important;
	}

    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp_main_form.woocommerce button#place_order:hover {
        opacity: .75;
    }

    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp_main_form.woocommerce .form_section_single_step_0_gutenberg .wfacp_section_title,
    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp_main_form.woocommerce .form_section_single_step_1_gutenberg .wfacp_section_title {
        margin-bottom: 1rem;

        font-size: .9rem;
        color: #1C1962;
        text-transform: uppercase;
    }

    .step__subtitle {
        font-size: 1.75rem !important;
        color: #1F2A37 !important;
    }

    .step__description {
        font-size: 1.1rem !important;
        color: #1F2A37 !important;
    }

    .paypal-button-container {
        max-width: 100% !important;
    }

    #wfacp-e-form .wfacp_main_form #payment .place-order {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;

        width: 100%;
    }

    .wc-ppcp-checkout-container {
        width: 100%;
        max-width: 750px;
    }

    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp_main_form .woocommerce-input-wrapper input[type="text"].wfacp-form-control {
        border-radius: .125rem;
        border-color: #4D5761 !important;
		color: #1F2A37 !important;
    }

    #wfacp_smart_button_paymentplugins_wc_ppcp {
        display: flex !important;
        justify-content: center !important;
    }

    #wc-ppcp-express-button {
        width: 100% !important;
        max-width: 750px !important;
    }

    body .bwf-section-wrap.bwf-section-4d6ccf62>.bwf-col {
        max-width: 1080px !important;
        padding-inline: 1rem !important;
    }

    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .form_section_your_order_0_gutenberg {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    body .bwf-section-wrap.bwf-section-4d6ccf62 {
        padding: 0 !important;
    }
	
	.wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp-coupon-section .wfacp-coupon-page .woocommerce-info > a, .wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp-coupon-section .wfacp-coupon-page .woocommerce-info > a:not(.wfacp_close_icon):not(.button-social-login):not(.wfob_btn_add):not(.ywcmas_shipping_address_button_new):not(.wfob_qv-button):not(.wfob_read_more_link):not(.wfacp_step_text_have ):not(.wfacp_cart_link) {
		color: #1c1962 !important;
	}
	
	.wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp-coupon-section .wfacp-coupon-page .wfacp-coupon-field-btn {
		background: #1c1962 !important;
	}
	
	.wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .wfacp-coupon-section .wfacp-coupon-page p.wfacp-form-control-wrapper .wfacp-form-control:focus {
		border-color: #1c1962 !important;
		box-shadow: none;
	}
	
	#wfacp-e-form .wfacp-left-panel {
		display: flex;
		gap: 2rem;
	}
	
	.checkout_form__step_2 {
		width: 100%;
	}
	
	@media screen and (max-width: 675px) {
		#wfacp-e-form .wfacp-left-panel {
			display: flex;
			flex-direction: column;
			gap: 1rem;
		}
	}
	
	.payment_method_woosa_adyen_card .adn-wrap-form {
		margin-top: 1rem !important;
	}
</style>

<script lang="js">
  // const originalOpen = XMLHttpRequest.prototype.open;
  // const originalSend = XMLHttpRequest.prototype.send;
  //
  // XMLHttpRequest.prototype.open = function (method, url, ...rest) {
  //   this._requestMethod = method;
  //   this._requestUrl = url;
  //
  //   originalOpen.apply(this, [method, url, ...rest]);
  // };
  //
  // XMLHttpRequest.prototype.send = function (body) {
  //   let formDataObject = {};
  //   let jsonData;
  //
  //   if (this._requestMethod === "POST" && body) {
  //     if (body instanceof FormData) {
  //       body.forEach((value, key) => {
  //         formDataObject[key] = value;
  //       });
  //     } else if (typeof body === "string") {
  //       try {
  //         jsonData = JSON.parse(body);
  //       } catch (e) {
  //         jsonData = body;
  //       }
  //     }
  //   }
  //
  //   this.addEventListener("readystatechange", function () {
  //     if (this.readyState === 4 && this.status === 200) {
  //       try {
  //         let response = JSON.parse(this.responseText);
  //         if (response && response?.fragments?.place_order_text && jsonData?.split("&").find((el) => el === "payment_method=mollie_wc_gateway_klarna")) {
  //           response.fragments.place_order_text = `<img style="display: flex !important; height: 24px;" src="https://imagedelivery.net/u8JiH5bJQTfO_tBFRSJ5Lg/d3ae4608-37eb-4123-b3e6-0402f4808600/gamma=0" alt="klarna" />`;
  //         }
  //         Object.defineProperty(this, "responseText", { value: JSON.stringify(response) });
  //       } catch (e) {
  //         console.error("Error processing response:", e);
  //       }
  //     }
  //   });
  //
  //   originalSend.apply(this, [body]);
  // };
  const today = new Date();
  today.setDate(today.getDate() + 1);

  const langCodes = {
    en: "en-GB",
    ie: "en-GB",
    de: "de-DE",
    fr: "fr-FR",
    nl: "nl-NL",
    benl: "nl-BE",
    befr: "fr-BE",
    dk: "da-DK",
    sv: "sv-SE"
  };

  const shippingText = {
    en: "Your order will be shipped on:",
    ie: "Your order will be shipped on:",
    de: "Ihre Bestellung wird verschickt am",
    fr: "Votre commande sera expédiée le :",
    nl: "Je bestelling wordt verzonden op:",
    benl: "Je bestelling wordt verzonden op:",
    befr: "Votre commande sera expédiée le :",
    dk: "Din ordre vil blive afsendt den:",
    sv: "Din beställning kommer att skickas den:"
  };

  console.log("hello <?php echo do_shortcode('[language]'); ?>");
  console.log("dfg", today.toLocaleDateString(langCodes["<?php echo do_shortcode('[language]'); ?>"] || "de-DE", { day: "numeric", month: "long", year: "numeric" }));

  const firstElement = document.querySelector(".wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .form_section_single_step_1_gutenberg");
  const secondElement = document.querySelector(".wfacp_smart_buttons");
  const thirdElement = document.querySelector(".wfacp-checkout-form-block.wfacp-ac36544b #wfacp-e-form .form_section_your_order_0_gutenberg");

  const wrapperDiv = document.createElement("div");
  wrapperDiv.classList.add("checkout_form__step_2");

  firstElement.parentNode.insertBefore(wrapperDiv, firstElement);

  const parentNodeEl = document.querySelector("body #wfacp-sec-wrapper #wfacp_checkout_form");
	
  parentNodeEl.prepend(secondElement);
  // existingElement.parentNode.insertBefore(secondElement, parentNode);
	
  wrapperDiv.appendChild(firstElement);
  // wrapperDiv.appendChild(secondElement);
  wrapperDiv.appendChild(thirdElement);

  document.querySelector(".wfacp_main_form")?.classList.add("container");

  const shippingInfoHTML = `
    <div class="item__shipping">
      <img class="shipping__image" src="https://staging.glucofit.co/wp-content/uploads/2024/11/shipping.svg" alt="shipping__image">
      <div class="shipping__info">
        <span class="info__title">${shippingText["<?php echo do_shortcode('[language]'); ?>"] || "Your order will be shipped on:"}</span>
        <span class="info__date">${today.toLocaleDateString(langCodes["<?php echo do_shortcode('[language]'); ?>"] || "de-DE", { day: "numeric", month: "long", year: "numeric" })}</span>
      </div>
    </div>
  `;

  const phoneInput = document.querySelector("#billing_phone_field");
  // phoneInput.insertAdjacentHTML("afterend", shippingInfoHTML);

  const expressCheckoutText = `
    <span id="express_checkout_text">Express checkout</span>
  `;

  const expressCheckoutOr = `
    <div class="express_checkout_or">
      <div class="express_checkout_or__divider"></div>
       <span id="express_checkout_or__text">Or</span>
      <div class="express_checkout_or__divider"></div>
    </div>
  `;

  // jQuery(document).ready(function($) {
  //   function addCustomButton() {
  //     $("#place_order").style.cssText = "display:none !important";
  //
  //     if ($(".custom-checkout-button").length === 0) {
  //       $(`<button type="button" class="button alt custom-checkout-button">Pay with Klarna</button>`)
  //         .insertAfter('#place_order')
  //         .on("click", function() {
  //           $('#place_order').trigger("click");
  //         });
  //     }
  //   }
  //
  //   addCustomButton();
  //
  //   const targetNode = document.querySelector("#payment");
  //   const config = { childList: true, subtree: true };
  //
  //   const observer = new MutationObserver(function(mutationsList) {
  //     for (let mutation of mutationsList) {
  //       if (mutation.type === "childList") {
  //         addCustomButton();
  //       }
  //     }
  //   });
  //
  //   if (targetNode) observer.observe(targetNode, config);
  // });

  // setInterval(() => {
  //   const klarnaBtn = document.querySelector("#payment_method_mollie_wc_gateway_klarna");
  //   if (klarnaBtn.checked) {
  //     const orderButton = document.querySelector("#place_order");
  //     orderButton.innerHTML = `
  //       <img
  //         src="https://imagedelivery.net/u8JiH5bJQTfO_tBFRSJ5Lg/d3ae4608-37eb-4123-b3e6-0402f4808600/gamma=0"
  //         style="
  //           width: 256px;
  //           height: 40px;
  //           object-fit: cover;
  //           z-index: 10;
  //         "
  //         alt="klarna"
  //       />
  //     `;
  //     orderButton.style.cssText = 'background:#ffb3c7 !important';
  //   }
    //
    // klarnaBtn.addEventListener("change", () => {
    //   console.log("checked");
    //   if (klarnaBtn.checked) {
    //     const orderButton = document.querySelector("#place_order");
    //     orderButton.innerHTML = `
    //     <img src="https://imagedelivery.net/u8JiH5bJQTfO_tBFRSJ5Lg/d3ae4608-37eb-4123-b3e6-0402f4808600/gamma=0" alt="klarna" />
    //   `;
    //     orderButton.style.background = "#ffb3c7";
    //   }
    // });
  // }, 1000);

  // setInterval(() => {
  //   if (!document.querySelector("#express_checkout_text")) {
  //     const paypalBtn = document.querySelector("body.woocommerce-checkout #wfacp-e-form #payment div.form-row");
  //
  //     paypalBtn.insertAdjacentHTML("beforebegin", expressCheckoutText);
  //     paypalBtn.insertAdjacentHTML("afterend", expressCheckoutOr);
  //   }
  // }, 2000);

  const addressNumber = {
    en: "Street address and number",
    ie: "Street address and number",
    de: "Straße und Hausnummer",
    fr: "Numéro de rue et de maison",
    nl: "Straat en huisnummer",
    benl: "Straat en huisnummer",
    befr: "Numéro de rue et de maison",
    dk: "Gade og husnummer",
    sv: "Gatu- och husnummer"
  };

  const shippingAddress = document.querySelector("#shipping_address_1_field label");
  shippingAddress.innerHTML = shippingAddress.innerHTML.replace("Street address", addressNumber["<?php echo do_shortcode('[language]'); ?>"] || "Street address and number");

  console.log("all injected");
  // const klarnaAddress = document.querySelector(".payment_method_mollie_wc_gateway_klarna");
  // klarnaAddress.innerHTML = `
  //   <div>${klarnaAddress.innerHTML}</div>
  //   <span>With Klarna Pay Later, you have the option of paying by invoice. And only when the order has arrived</span>
  // `;
</script>