Untitled

<style>
html body #__next main.site__wrapper>div:nth-child(1)>div:last-child>div {
    flex-direction: column;
}

html body .eg-comb-container {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    margin-top: 74px;
    position: relative;
    flex-direction: column;
    padding: 0;
}

html body .eg-comb-container::before {
    content: 'Pairs Well With';
    position: absolute;
    font-family: ITCGaramondStd-LtCond;
    font-weight: 300;
    font-style: normal;
    font-size: 22px;
    line-height: 86%;
    transform: translateY(-100%);
    letter-spacing: -.03em;
    top: -13px;
    text-transform: capitalize;
}

html body .eg-comb-container:not(.eg-show) {
    display: none !important
}

html body .eg-comb-container .eg-box {
    padding: 15px 0 18px;
    display: flex;
    align-items: center;
    background: transparent;
    border-top: 0.5px solid #c0c0c0;
    max-width: 400px;
    justify-content: flex-start;
}

html body .eg-comb-container .eg-box img {
    width: 95%;
    display: block;
    height: 95%;
}

html body .eg-comb-container .eg-plus {
    font-size: 22px;
    margin-left: 6px;
    margin-right: 6px;
    align-self: center !important;
}

html body button.eg-atc {
    background-color: #f1d27a;
    width: 100%;
    max-width: 78px !important;
    font-style: italic;
    font-weight: 500;
    border-radius: 26px;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, .75);
    font-size: 15px;
    text-transform: uppercase;
    font-family: OptimaLTP;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 10px;
    transition: all 0.3s;
    padding-left: 13px;
    padding-right: 13px;
    padding-bottom: 5px;
}

.eg-reviews button#ratings-summary>div:nth-child(n + 2) {
    align-items: center !important;
    display: flex !important;
    padding-top: 4px !important;
}

html body .eg-reviews {
    margin-bottom: 0px;
}

#__next main.site__wrapper>div:nth-child(1)>div:last-child>div>div:nth-child(1) {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

html body button.eg-atc:hover {
    background-color: #f3c740 !important;
}


html body .eg-img {
    min-width: 90px;
    min-height: 90px;
    background: #ebe6dc;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 90px;
    max-height: 90px;
    width: 100%;
    height: 100%;
}

html body .eg-info {
    display: flex;
    flex-direction: column;
    font-size: 18px;
    font-family: 'ITCGaramondStd-LtCond';
    font-weight: bold;
    align-self: stretch;
    justify-content: center;
    padding-left: 10px;
    line-height: 1.2;
}

html body .eg-product-label {
    background: rgb(226 221 212 / 25%);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-radius: 5px;
    font-size: 11px;
    letter-spacing: 0.5px;
    padding: 3px 2px 0;
    margin-bottom: 3px;
    background-color: #e2ddd4;
    padding: 5px 12px 2px;
    text-transform: uppercase;
    font-family: OptimaLTP;
    font-weight: 500;
    font-style: normal;
    font-size: 10px;
    line-height: 1.2;
    border-radius: 20px;
    display: inline-block;
    letter-spacing: -.03em;
}

html body .eg-comb-container::after {
    content: "";
    height: 0.5px;
    background: #333;
    width: 100%;
    position: absolute;
    top: -65px;
    left: 0;
}

html body .eg-product-title {
    margin-bottom: 0px;
}

@media(max-width:1305px) {

    html body .eg-img {
        min-width: 75px !important;
        max-width: 75px !important;
        min-height: 75px !important;
        max-height: 75px !important;
    }

    html body .eg-comb-container .eg-box img {
        width: 87% !important;
        height: 87% !important;
    }
}

@media(max-width:800px) {
    html body .eg-comb-container .eg-box {
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
        max-width: 400px !important;
    }
}
</style>


(function () {
  if (!document.querySelector(".eg-comb-container")) {
    try {
      /* main variables */
      var debug = 0;
      var variation_name = "";
      var $;
      /* all Pure helper functions */
      function readCookie(name) {
        // READ COOKIE
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
          var c = ca[i];
          while (c.charAt(0) == ' ') c = c.substring(1, c.length);
          if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
        }
        return null;
      }

      function listener() {
        /* These are the modifications: */
        window.addEventListener("locationchange", function () {
          waitForElement('html body main.site__wrapper > div:nth-child(1) > div:nth-child(1)>div:last-child', init, 1500, 15000);
        });
        history.pushState = ((f) =>
          function pushState() {
            var ret = f.apply(this, arguments);
            window.dispatchEvent(new Event("pushstate"));
            window.dispatchEvent(new Event("locationchange"));
            return ret;
          })(history.pushState);
        history.replaceState = ((f) =>
          function replaceState() {
            var ret = f.apply(this, arguments);
            window.dispatchEvent(new Event("replacestate"));
            window.dispatchEvent(new Event("locationchange"));
            return ret;
          })(history.replaceState);
        window.addEventListener("popstate", () => {
          window.dispatchEvent(new Event("locationchange"));
        });
      }

      function waitForElement(selector, trigger, delayInterval, delayTimeout) {
        var interval = setInterval(function () {
          if (
            document &&
            document.querySelector(selector) &&
            document.querySelectorAll(selector).length > 0 && window.egSvg
          ) {
            clearInterval(interval);
            trigger();
          }
        }, delayInterval);
        setTimeout(function () {
          clearInterval(interval);
        }, delayTimeout);
      }
      function addToBag(varientId, varientName) {
        fetch("https://checkout.vacation.inc/api/2020-07/graphql", {
          "headers": {
            "accept": "application/json",
            "accept-language": "*",
            "content-type": "application/json",
            "sec-ch-ua": "\"Not?A_Brand\";v=\"8\", \"Chromium\";v=\"108\", \"Google Chrome\";v=\"108\"",
            "sec-ch-ua-mobile": "?0",
            "sec-ch-ua-platform": "\"macOS\"",
            "sec-fetch-dest": "empty",
            "sec-fetch-mode": "cors",
            "sec-fetch-site": "same-site",
            "x-sdk-variant": "javascript",
            "x-sdk-version": "2.11.0",
            "x-shopify-storefront-access-token": "fe00875189b0e661fdcf65285171dc0f"
          },
          "referrer": "https://www.vacation.inc/",
          "referrerPolicy": "strict-origin-when-cross-origin",
          "body": "{\"query\":\"fragment VariantFragment on ProductVariant  { id,title,price,priceV2 { amount,currencyCode },presentmentPrices (first: 20) { pageInfo { hasNextPage,hasPreviousPage },edges { node { price { amount,currencyCode },compareAtPrice { amount,currencyCode } } } },weight,available: availableForSale,sku,compareAtPrice,compareAtPriceV2 { amount,currencyCode },image { id,src: originalSrc,altText },selectedOptions { name,value },unitPrice { amount,currencyCode },unitPriceMeasurement { measuredType,quantityUnit,quantityValue,referenceUnit,referenceValue } },fragment DiscountApplicationFragment on DiscountApplication  { __typename,targetSelection,allocationMethod,targetType,value { ... on MoneyV2 { amount,currencyCode },... on PricingPercentageValue { percentage } },... on ManualDiscountApplication { title,description },... on DiscountCodeApplication { code,applicable },... on ScriptDiscountApplication { description },... on AutomaticDiscountApplication { title } },fragment AppliedGiftCardFragment on AppliedGiftCard  { amountUsedV2 { amount,currencyCode },balanceV2 { amount,currencyCode },presentmentAmountUsed { amount,currencyCode },id,lastCharacters },fragment VariantWithProductFragment on ProductVariant  { ...VariantFragment,product { id,handle } },fragment UserErrorFragment on UserError  { field,message },fragment CheckoutUserErrorFragment on CheckoutUserError  { field,message,code },fragment MailingAddressFragment on MailingAddress  { id,address1,address2,city,company,country,firstName,formatted,lastName,latitude,longitude,phone,province,zip,name,countryCode: countryCodeV2,provinceCode },fragment CheckoutFragment on Checkout  { id,ready,requiresShipping,note,paymentDue,paymentDueV2 { amount,currencyCode },webUrl,orderStatusUrl,taxExempt,taxesIncluded,currencyCode,totalTax,totalTaxV2 { amount,currencyCode },lineItemsSubtotalPrice { amount,currencyCode },subtotalPrice,subtotalPriceV2 { amount,currencyCode },totalPrice,totalPriceV2 { amount,currencyCode },completedAt,createdAt,updatedAt,email,discountApplications (first: 10) { pageInfo { hasNextPage,hasPreviousPage },edges { node { __typename,...DiscountApplicationFragment } } },appliedGiftCards { ...AppliedGiftCardFragment },shippingAddress { ...MailingAddressFragment },shippingLine { handle,price,priceV2 { amount,currencyCode },title },customAttributes { key,value },order { id,processedAt,orderNumber,subtotalPrice,subtotalPriceV2 { amount,currencyCode },totalShippingPrice,totalShippingPriceV2 { amount,currencyCode },totalTax,totalTaxV2 { amount,currencyCode },totalPrice,totalPriceV2 { amount,currencyCode },currencyCode,totalRefunded,totalRefundedV2 { amount,currencyCode },customerUrl,shippingAddress { ...MailingAddressFragment },lineItems (first: 250) { pageInfo { hasNextPage,hasPreviousPage },edges { cursor,node { title,variant { ...VariantWithProductFragment },quantity,customAttributes { key,value } } } } },lineItems (first: 250) { pageInfo { hasNextPage,hasPreviousPage },edges { cursor,node { id,title,variant { ...VariantWithProductFragment },quantity,customAttributes { key,value },discountAllocations { allocatedAmount { amount,currencyCode },discountApplication { __typename,...DiscountApplicationFragment } } } } } },mutation ($checkoutId:ID!,$lineItems:[CheckoutLineItemInput!]!)  { checkoutLineItemsAdd (checkoutId: $checkoutId lineItems: $lineItems) { userErrors { ...UserErrorFragment },checkoutUserErrors { ...CheckoutUserErrorFragment },checkout { ...CheckoutFragment } } }\",\"variables\":{\"checkoutId\":\"" + readCookie('vacation_checkout_id') + "\",\"lineItems\":[{\"variantId\":\"" + varientId + "\",\"quantity\":1,\"customAttributes\":[{\"key\":\"_subtitle\",\"value\":\"" + varientName + "\"},{\"key\":\"_sc\",\"value\":\"undefined_undefined_undefined\"}]}]}}",
          "method": "POST",
          "mode": "cors",
          "credentials": "omit"
        }).then((response) => response.json())
          .then((data) => {
            console.log("added to cart");
            setCookie("openCart", true, 1);
            window.location.reload();
          })
          .catch((error) => {
            console.error('Error:', error);
          });
      }

      function readCookie(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
          var c = ca[i];
          while (c.charAt(0) == ' ') c = c.substring(1, c.length);
          if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
        }
        return null;
      }
      var setCookie = function (name, value, days) {
        var expires = '';
        if (days) {
          var date = new Date();
          date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
          expires = '; expires=' + date.toUTCString();
        }
        document.cookie = name + '=' + (value || '') + expires + '; path=/';
      };
      var delCookie = function (name) {
        document.cookie = name + '=; Max-Age=0; path=/;';
      }

      function init() {
        let products = {
          "/products/classic-lotion-spf-30": {
            "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0VmFyaWFudC8zOTgxNTU3NTk5NDU0Mg==",
            "name": "Chardonnay Oil SPF 30",
            "img": "https://cdn.sanity.io/images/kie4hq77/development/baf69392313ae60bbeea4340bf21484a780b5432-2000x2000.png?auto=format&q=75&w=100",
            "label": "“The World's Most Indulgent Sunscreen”",
            "title": "Chardonnay Oil SPF 30",
            "price": "$22",
            "reviewHTML": `<div class="bv-star-reviews-summary" data-bv-show="rating_summary" data-bv-product-id="6723866656942"
    data-bv-ready="true">
    <div class="bv_main_container"><button id="ratings-summary" class="bv_main_container_row_flex" role="link"
            type="button" aria-expanded="false">
            <div class="bv_stars_component_container">${egSvg}</div>
            <div itemprop="ratingValue" class="bv_avgRating_component_container notranslate">4.8</div>
            <div class="bv_numReviews_component_container">
                <meta itemprop="reviewCount" content="184">&nbsp;<div class="bv_numReviews_text">(184)</div>
            </div>
        </button></div>
</div>`
          },
          "/products/chardonnay-oil-spf-30": {
            "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0VmFyaWFudC8zOTM2NTU1NzMyMTkwMg==",
            "name": "Classic Lotion SPF 30",
            "img": "https://cdn.shopify.com/s/files/1/0553/2984/9518/products/classic-lotion_200x200.png?v=1627510928",
            "label": "“The World’s Best-Smelling Sunscreen”",
            "title": "Classic Lotion SPF 30",
            "price": "$18",
            "reviewHTML": `<div class="bv-star-reviews-summary" data-bv-show="rating_summary" data-bv-product-id="6566598148270"
    data-bv-ready="true">
    <div class="bv_main_container"><button id="ratings-summary" class="bv_main_container_row_flex" role="link"
            type="button" aria-expanded="false">
            <div class="bv_stars_component_container">${egSvg}</div>
            <div itemprop="ratingValue" class="bv_avgRating_component_container notranslate">4.9</div>
            <div class="bv_numReviews_component_container">
                <meta itemprop="reviewCount" content="318">&nbsp;<div class="bv_numReviews_text">(318)</div>
            </div>
        </button></div>
</div>`
          },
          "airfrsh": {
            "id": "Z2lkOi8vc2hvcGlmeS9Qcm9kdWN0VmFyaWFudC8zOTUwNjU0OTU3MTc1OA==",
            "name": "Vacation® Air",
            "img": "https://cdn.shopify.com/s/files/1/0553/2984/9518/products/air-fresh_200x200.png?v=1627510488",
            "label": "“For Home, Car or Office ”",
            "title": "Vacation® Air",
            "price": "$5",
            "reviewHTML": `<div class="bv-star-reviews-summary" data-bv-show="rating_summary" data-bv-product-id="6609001578670"
    data-bv-ready="true">
    <div class="bv_main_container"><button id="ratings-summary" class="bv_main_container_row_flex" role="link"
            type="button" aria-expanded="false">
            <div class="bv_stars_component_container">${egSvg}</div>
            <div itemprop="ratingValue" class="bv_avgRating_component_container notranslate">4.8</div>
            <div class="bv_numReviews_component_container">
                <meta itemprop="reviewCount" content="264">&nbsp;<div class="bv_numReviews_text">(264)</div>
            </div>
        </button></div>
</div>`
          }
        }

        let key = window.location.pathname;

        let pdp = products[key];
        let egCombination;
        if (pdp) {
          egCombination = `<div class="eg-comb-container eg-show">
            <div class="eg-box eg-crr-product">
                <div class="eg-img"><img src="${pdp.img}"></div>
                <div class="eg-info">
    <span class="eg-crr-product-title eg-product-title">${pdp.title} - <span class="eg-crr-product-price eg-product-price">${pdp.price}</span></span>
                    <span class="eg-crr-product-label eg-product-label">${pdp.label}</span>
                    <div class="eg-reviews">${pdp.reviewHTML}</div>
                    <button class="eg-atc" data-vId="${pdp.id}" data-vName="${pdp.name}">Add</button>
                </div>
                
            </div>
            
            <div class="eg-box ">
                <div class="eg-img"><img src="${products.airfrsh.img}"></div>
                <div class="eg-info">
    <span class="eg-crr-product-title eg-product-title">${products.airfrsh.title} - <span class="eg-crr-product-price eg-product-price">${products.airfrsh.price}</span></span>
                    <span class="eg-crr-product-label eg-product-label">${products.airfrsh.label}</span>
                    <div class="eg-reviews">${pdp.reviewHTML}</div>
                    <button class="eg-atc" data-vId="${products.airfrsh.id}" data-vName="${products.airfrsh.name}">Add</button>
                </div>
                
            </div>
            
        </div>`;
        }

        if (((window.location.href.indexOf("/products/chardonnay-oil-spf-30") != -1) || (window.location.href.indexOf("/products/classic-lotion-spf-30") !== -1))) {
          setTimeout(() => {
            if ((!document.querySelector(".eg-comb-container")) && (!document.querySelector(".product__form-soldout"))) {
              document.querySelector("#__next main.site__wrapper  > div:nth-child(1) > div:last-child > div > div:nth-child(1)").insertAdjacentHTML("beforeend", egCombination);
              document.querySelectorAll(".eg-atc").forEach(atc => {
                atc.addEventListener("click", function () {
                  let varientId = this.getAttribute("data-vId");
                  let varientName = this.getAttribute("data-vName");
                  addToBag(varientId, varientName);
                });
              })
            }
          }, 2000);
        } else {
          document.querySelector(".eg-comb-container") && document.querySelector(".eg-comb-container").remove();
        }
      }

      /* Initialize variation */
      waitForElement('#__next main.site__wrapper  > div:nth-child(1) > div:last-child > div > div:nth-child(1)', init, 100, 15000);
      if (readCookie("openCart")) {
        waitForElement(".header__nav > div > div > div:last-child button:not(.eg-new-bag-cta)", function () {
          delCookie("openCart");
          document.querySelector(".header__nav > div > div > div:last-child button:not(.eg-new-bag-cta)").click();
        }, 50, 15000);
      }
      listener();
    } catch (e) {
      if (debug) console.log(e, "error in Test" + variation_name);
    }
  }
})();