/* variables from theme configuration */
:root {
    --am_logo_link: 1;
--am_bg: #f1f5f9;
--am_bg_size: auto;
--am_bg_size_px: auto;
--am_bg_attachment: scroll;
--am_bg_repeat: no-repeat;
--am_color: #f1f5f9;
--am_link_color: #3f7fb0;
--am_btn_color: #4e80a6;
--am_text_color: #303030;
--am_color_c: #0e0a06;
--am_color_d: #bfc3c7;
--am_logo_align: left;
--am_logo_width: auto;
--am_logo_width_px: auto;
--am_max_width: 800;
--am_max_width_px: 800px;
--am_font_size: 14;
--am_font_size_px: 14px;
--am_font_family: Roboto;
--am_drop_shadow: 1;
--am_content_shadow: 0px 0px 5px #00000022;;
--am_login_layout: layout.phtml;
--am_login_bg: none;
--am_login_bg_color: unset;
--am_login_shadow: none;
--am_login_legend_bg: #f9f9f9;
--am_login_legend_padding_top: 1em;
--am_login_form_bg_color: #f9f9f9;
--am_login_header_display: block;
--am_header_bg_size: cover;
--am_header_bg_size_px: cover;
--am_header_bg_repeat: no-repeat;
--am_header_bg: none;
--am_menu_color: #eb6653;
--am_menu_dashboard: icon;
--am_dashboard_layout: two-col;
--am_identity_align: left;
--am_identity_type: login;
--am_page_bg_color: #ffffff;
--am_page_bg: #ffffff;
--am_header_menu_link_color: #000000;
--am_header_menu_link2_color: #000000;
--am_header_menu_bg_color: #f1f5f9;
--am_footer_bg: none;
--am_footer_text_color: #0d0d0d;
--am_footer_link_color: #0d0d0d;
--am_sm_size: 18;
--am_sm_size_px: 18px;
--am_sm_color: #0d0d0d;
--am_body_finish_out: <script> 
document.addEventListener("DOMContentLoaded", () => { 
const loginasUserParWrap = document.querySelector( ".am-logged-out.am-page-login .am-body-content-content .am-signup-link");

if(loginasUserParWrap) {

const link = document.createElement("a"); 
link.href = "https://app-dashboard.videoraiq.com/user-login";
 link.textContent = "Login as a user";
 link.target = "_blank"; 

link.className = "login-user-link";

loginasUserParWrap.appendChild(link);

}


});
</script>

<script> 

document.addEventListener("DOMContentLoaded", () => {
    const signUpSubBtn = document.querySelector(
        ".am-logged-out.am-page-signup .am-cta-signup.inputsubmitbtn"
    );
    const errorEmailWrapper = document.querySelector(
        ".am-logged-out.am-page-signup.am-page-signup-default #row-email-0 .am-element"
    );

  
    const errorEmailNew = document.createElement("span");
    errorEmailNew.className = "email-existNew-errors";
    errorEmailNew.style.opacity = "1";
    errorEmailNew.textContent = "";

    if (errorEmailWrapper) {

     
        errorEmailWrapper.appendChild(errorEmailNew);
    }

    // Add permanent hiding style
    const style = document.createElement("style");
    style.textContent = `
    #row-email-0 #email-0-error {
      display: none !important;
    }
  `;
    document.head.appendChild(style);

    if (signUpSubBtn) {
        signUpSubBtn.addEventListener("click", function () {

       const errorEmailNewWrap = document.querySelector(
                ".am-logged-out.am-page-signup .email-existNew-errors"
            );

          
            const getEmailInpValue = document.querySelector(
                ".am-logged-out.am-page-signup #row-email-0 #email-0"
            );
     
  

const interval = setInterval(() => {
  const emailExistsError = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default #row-email-0 #email-0-error"
  );

  if (emailExistsError && getEmailInpValue.value.trim() !== "") {

    errorEmailNewWrap.textContent =
                    "An account with the same email ID already exists";
    clearInterval(interval); // stop checking once the element is found
  }

    if (getEmailInpValue.value.trim() === "" && errorEmailNewWrap && emailExistsError) {

           

                errorEmailNewWrap.textContent =
                    "Enter Valid Email";
            }

            getEmailInpValue.addEventListener("input", () => {
                console.log("Input event detected");
// if(emailExistsError && emailExistsError.textContent.trim() ===""){

    if(emailExistsError && emailExistsError.textContent.trim() !=="") {

      console.log("detected" , emailExistsError.textContent);

     errorEmailNewWrap.textContent = "An account with the same email ID already exists";
} else {
      errorEmailNewWrap.textContent = "";
}




            } );


            if (getEmailInpValue.value.trim() !== "" && emailExistsError && emailExistsError.textContent.trim() ==="") {
           
errorEmailNewWrap.textContent = "";
}


}, 100); // check every 100ms

// optional safety timeout to stop after 2 seconds
setTimeout(() => clearInterval(interval), 2000);

          

          
         
        });
    }
});


document.addEventListener("DOMContentLoaded", () => {
  // ===== Password field =====
 

  const newPassWrapperProfile = document.querySelector(
    ".am-logged-out.am-page-changepass #row-pass0-0 .am-element"
  );

  if (newPassWrapperProfile) {
    const newpassInput = newPassWrapperProfile.querySelector("input");
    if (newpassInput) {
      const passSpan = document.createElement("span");
      passSpan.className = "am-switch-reveal am-switch-reveal-off";
      passSpan.title = "Toggle Password Visibility";
      newpassInput.insertAdjacentElement("afterend", passSpan);

      passSpan.addEventListener("click", () => {
        if (newpassInput.type === "password") {
          newpassInput.type = "text";
          passSpan.classList.remove("am-switch-reveal-off");
          passSpan.classList.add("am-switch-reveal-on");
        } else {
          newpassInput.type = "password";
          passSpan.classList.remove("am-switch-reveal-on");
          passSpan.classList.add("am-switch-reveal-off");
        }
      });
    }
  }


   const newConfPassWrapperProfile = document.querySelector(
    ".am-logged-out.am-page-changepass #row-pass1-0 .am-element"
  );

  if (newConfPassWrapperProfile) {
    const newpassConfInput = newConfPassWrapperProfile.querySelector("input");
    if (newpassConfInput) {
      const passSpan = document.createElement("span");
      passSpan.className = "am-switch-reveal am-switch-reveal-off";
      passSpan.title = "Toggle Password Visibility";
      newpassConfInput.insertAdjacentElement("afterend", passSpan);

      passSpan.addEventListener("click", () => {
        if (newpassConfInput.type === "password") {
          newpassConfInput.type = "text";
          passSpan.classList.remove("am-switch-reveal-off");
          passSpan.classList.add("am-switch-reveal-on");
        } else {
          newpassConfInput.type = "password";
          passSpan.classList.remove("am-switch-reveal-on");
          passSpan.classList.add("am-switch-reveal-off");
        }
      });
    }
  }

});


</script>


<script> 





const loginLogoID = document.querySelector('.am-logged-out.am-page-login .am-login-form-wrapper');

if (loginLogoID) {
  // Create anchor
  const newElement = document.createElement('a');

  newElement.style.cssText = `
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px; /* spacing */
  `;

  // Create the image
  const logoImage = document.createElement('img');
  logoImage.classList.add('am-header-content-logo');
  logoImage.src = "https://storage.googleapis.com/empmonitor-cctv-dev/CCTV-I/VideoraIQ%20logo-white.png";
  logoImage.alt = "Emp-Surveillance";

  newElement.appendChild(logoImage);

  // Create H1 after anchor
  const heading = document.createElement('h1');
  heading.textContent = "Login";
  heading.style.cssText = `
    text-align: center;
  
font-weight: 500;
   margin: 0.6rem 0 2rem 0 !important;
    font-size: 28px;
    color: #fff; /* change color as needed */
  `;

  // Insert anchor first
  loginLogoID.insertBefore(newElement, loginLogoID.firstChild);

  // Insert heading right after anchor
  loginLogoID.insertBefore(heading, newElement.nextSibling);
}


console.log("jjjghmhvmbnvmnvb" , loginLogoID);

const logoutLogoId = document.querySelector(
  '.am-logged-out:not(.am-page-login):not(.am-page-signup.am-page-signup-default) .am-body-content-wrapper.am-main .am-body-content'
);

const logoutLogoIdChaPs = document.querySelector(
  '.am-logged-out.am-page-changepass .am-body-content-wrapper.am-main .am-body-content'
);
if (logoutLogoId && !logoutLogoIdChaPs) {
  // Create anchor
  const newAnchor = document.createElement('a');
  newAnchor.href = "https://app.videoraiq.com/member";
  newAnchor.style.cssText = `
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

    margin: 15px 0px; /* spacing */
  `;

  // Create the image
  const logoutLogoImg = document.createElement('img');
  logoutLogoImg.classList.add('am-header-content-logo');
  logoutLogoImg.src = "https://storage.googleapis.com/empmonitor-cctv-dev/CCTV-I/VideoraIQ%20logo-white.png";
  logoutLogoImg.alt = "Emp-Surveillance";

  newAnchor.appendChild(logoutLogoImg);



  // Insert anchor first
  logoutLogoId.insertBefore(newAnchor, logoutLogoId.firstChild);

}

if (logoutLogoIdChaPs){

  // Create anchor
  const newAnchor = document.createElement('a');
  newAnchor.href = "https://app.videoraiq.com/login";
  newAnchor.style.cssText = `
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

    margin: 15px 0px; /* spacing */
  `;

  // Create the image
  const logoutLogoImg = document.createElement('img');
  logoutLogoImg.classList.add('am-header-content-logo');
  logoutLogoImg.src = "https://storage.googleapis.com/empmonitor-cctv-dev/CCTV-I/VideoraIQ%20logo-white.png";
  logoutLogoImg.alt = "Emp-Surveillance";

  newAnchor.appendChild(logoutLogoImg);



  // Insert anchor first
  logoutLogoIdChaPs.insertBefore(newAnchor, logoutLogoIdChaPs.firstChild);
}
document.addEventListener("DOMContentLoaded", () => {
  // ===== Password field =====
  const passWrapper = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default .am-form #row-pass-0 .am-pass-indicator-wrap"
  );

  if (passWrapper) {
    const passInput = passWrapper.querySelector("input");
    if (passInput) {
      const passSpan = document.createElement("span");
      passSpan.className = "am-switch-reveal am-switch-reveal-off";
      passSpan.title = "Toggle Password Visibility";
      passInput.insertAdjacentElement("afterend", passSpan);

      passSpan.addEventListener("click", () => {
        if (passInput.type === "password") {
          passInput.type = "text";
          passSpan.classList.remove("am-switch-reveal-off");
          passSpan.classList.add("am-switch-reveal-on");
        } else {
          passInput.type = "password";
          passSpan.classList.remove("am-switch-reveal-on");
          passSpan.classList.add("am-switch-reveal-off");
        }
      });
    }
  }

  // ===== Confirm Password field =====
  const confirmWrapper = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default .am-form #row-pass-confirm .am-element"
  );

  if (confirmWrapper) {
    const confirmInput = confirmWrapper.querySelector("input");
    if (confirmInput) {
      const confirmSpan = document.createElement("span");
      confirmSpan.className = "am-switch-reveal am-switch-reveal-off";
      confirmSpan.title = "Toggle Confirm Password Visibility";
      confirmInput.insertAdjacentElement("afterend", confirmSpan);

      confirmSpan.addEventListener("click", () => {
        if (confirmInput.type === "password") {
          confirmInput.type = "text";
          confirmSpan.classList.remove("am-switch-reveal-off");
          confirmSpan.classList.add("am-switch-reveal-on");
        } else {
          confirmInput.type = "password";
          confirmSpan.classList.remove("am-switch-reveal-on");
          confirmSpan.classList.add("am-switch-reveal-off");
        }
      });
    }
  }

const signUpUserInp = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default .am-form #row-login-0 #login-0"
  );

if(signUpUserInp) {
signUpUserInp.placeholder ="Enter a Username";

};

const signUpEmailInp = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default .am-form #row-email-0 #email-0"
  );

if(signUpEmailInp) {
signUpEmailInp.placeholder ="Enter E-Mail Address";

};


const signUpNewPassInp = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default .am-form #row-pass-0 #pass-0"
  );

 if(signUpNewPassInp) { 
signUpNewPassInp.placeholder ="Enter a Password";

} ;

const signUpNewPassConfInp = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default .am-form #row-pass-confirm #pass-confirm"
  );

if(signUpNewPassConfInp) {
signUpNewPassConfInp.placeholder ="Confirm Password";
};















});




const resetPassSubBtn = document.querySelector(
    '.am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form input[type="submit"]'
);

const resetInputPass = document.querySelector(
    ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form .am-row.am-row-sendpass-email input"
);

if (resetPassSubBtn) {
    const form = document.querySelector(
        ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form"
    );

    // Add permanent hiding style
    const style = document.createElement("style");
    style.textContent = `
    .am-errors.am-login-errors {
      display: none !important;
    }
  `;
    document.head.appendChild(style);

    // Create custom error list
    const errorList = document.createElement("ul");
    errorList.className = "custom-active-errors";
    errorList.style.opacity = "1";
    errorList.style.display = "none";

    const errorItem = document.createElement("li");
    errorItem.textContent =
        "Please enter either your username or email address";
    errorList.appendChild(errorItem);

    // Insert custom error at top of the form
    form.insertBefore(errorList, form.firstChild);

    let newErrorSHowWrapper = document.querySelector(
        ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form .custom-active-errors"
    );

    let newErrorSHowContent;
    let oldErrorShowWrapper;
    let oldErrorShowContent;

    let successShowWrapper;

    resetPassSubBtn.addEventListener("click", function (e) {
        if (newErrorSHowWrapper && resetInputPass.value.trim() === "") {
            console.log("newErrorSHowWrapper");
            newErrorSHowWrapper.style.display = "flex";

            newErrorSHowContent = document.querySelector(
                ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form .custom-active-errors li"
            );

            const intervalId = setInterval(() => {
                if (
                    oldErrorShowContent &&
                    newErrorSHowContent &&
                    oldErrorShowContent.textContent.trim() ===
                        "Please enter either login or email"
                ) {
                    console.log("match");
                    newErrorSHowContent.textContent =
                        "Please enter either your username or email address";

                    // stop the interval once matched
                    clearInterval(intervalId);
                }
            }, 200);
        }

        const checkInterval = setInterval(() => {
            oldErrorShowWrapper = document.querySelector(
                ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form .am-errors.am-login-errors"
            );

            if (oldErrorShowWrapper) {
                oldErrorShowContent = document.querySelector(
                    ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form .am-errors.am-login-errors li"
                );

                if (oldErrorShowContent) {
                    console.log(
                        "Old error detected and interval cleared.",
                        oldErrorShowContent
                    );

                    // update new custom error message
                    if (
                        newErrorSHowContent &&
                        resetInputPass.value.trim() !== ""
                    ) {
                        newErrorSHowContent.textContent =
                            oldErrorShowContent.textContent.trim();
                    }

                    // // ✅ stop interval immediately once found
                    // clearInterval(checkInterval);
                    // clearTimeout(stopIntervalTimeout);
                }
            }
            successShowWrapper = document.querySelector(
                ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form .am-info"
            );

            if (successShowWrapper) {
                console.log(
                    "Success message detected and interval cleared.",
                    successShowWrapper
                );

                newErrorSHowWrapper.style.display = "none";

                // ✅ stop interval immediately once found
                clearInterval(checkInterval);
                clearTimeout(stopIntervalTimeout);
            }
        }, 50);

        // ✅ stop interval automatically after 1 second (1000 ms)
        const stopIntervalTimeout = setTimeout(() => {
            clearInterval(checkInterval);
            console.log("Interval cleared automatically after 1 second.");
        }, 1000);

        if (resetInputPass.value.trim() !== "") {
            newErrorSHowContent = document.querySelector(
                ".am-logged-out.am-page-login .am-form.am-auth-form.am-sendpass-form .custom-active-errors li"
            );
            console.log(newErrorSHowContent, "!");
            console.log("chala");

            const checkInterval = setInterval(() => {
                // ✅ When all elements exist, run your logic once
                if (newErrorSHowContent && oldErrorShowContent) {
                    console.log("Elements found, running logic...");

                    newErrorSHowWrapper.style.display = "flex";
                    newErrorSHowContent.textContent =
                        oldErrorShowContent.textContent.trim();

                    console.log("chalassss");

                    // Stop checking once logic has run
                    clearInterval(checkInterval);
                    clearTimeout(stopCheckTimeout);
                }
            }, 50);

            // ✅ Safety timeout: stop after 1 second
            const stopCheckTimeout = setTimeout(() => {
                clearInterval(checkInterval);
                console.log(
                    "Stopped checking after 1 second (elements not found)."
                );
            }, 1000);
        }

        if (
            oldErrorShowContent &&
            oldErrorShowContent.trim() ===
                `The information you have entered is incorrect. Username [${resetInputPass.value}] does not exist in database`
        ) {
            console.log("match found");
        }
    });

    resetInputPass.addEventListener("input", function () {
        console.log("input");

        if (resetInputPass.value.trim() !== "") {
            console.log("resetInputPass.value.trim() !== ");

            if (
                oldErrorShowContent &&
                oldErrorShowContent.trim() ===
                    "The information you have entered is incorrect. Username [aaaa] does not exist in database"
            ) {
                console.log(
                    "oldErrorShowContent oldErrorShowContent.trimThe information you have entered is incorrect. Username [aaaa] does not exist in database"
                );

                if (newErrorSHowContent) {
                    console.log("newErrorSHowContent");

                    newErrorSHowContent.textContent =
                        "The information you have entered is incorrect. Username [aaaa] does not exist in database";
                }
            }
        }
    });
};




</script>

<script>





// Function to add overlay and show modal
function addOverlay() {
  const parentElement = document.querySelector(".am-sendpass-form-wrapper");

const linksingup = document.querySelector(".am-body-content-content .am-signup-link");

console.log("hhhh");

  // append close icon also
  if (!document.getElementById("modal_close_id")) {
    const closeIcon = document.createElement("span");
    closeIcon.id = "modal_close_id";
    closeIcon.innerHTML = "&times;"; // × symbol
    closeIcon.style.fontSize = "3rem";
    closeIcon.style.height = "fit-content";
    closeIcon.style.position = "absolute";
    closeIcon.style.top = "0";
    closeIcon.style.right = "1rem";
    closeIcon.style.cursor = "pointer";
    closeIcon.style.zIndex = "29";
      // Add onclick attribute to call removeOverlay function
    closeIcon.setAttribute("onclick", "removeOverlay()");
    parentElement.appendChild(closeIcon);
  }


const Logdata = document.querySelector('.am-body-content-content .am-login-form-wrapper');

if (Logdata) {
  console.log("objjjjdddddddj", Logdata);
  Logdata.style.setProperty("display", "none");
}
if(linksingup){
 linksingup.style.setProperty("display", "none");
}


  // Show the modal
  const modal = document.querySelector('.am-sendpass-form-wrapper');
  if (modal) {
    modal.style.display = 'block';
console.log("modal");
  }

const logsemail = document.querySelector(".am-sendpass-form-wrapper .login_modal_button_wrapper a");

if (logsemail) {
  logsemail.addEventListener("click", function (e) {
    e.preventDefault(); // prevent the default link behavior
   modal.style.display = 'none';
Logdata.style.setProperty("display", "flex");
linksingup.style.setProperty("display", "flex");
linksingup.style.setProperty("justify-content", "center");

  });
}



}

function removeOverlay() {


  // Show the login form
  const Logdata2 = document.querySelector('.am-body-content-content .am-login-form-wrapper');
  if (Logdata2) {

    Logdata2.style.setProperty("display", "flex", "important");
  }

  // Show the signup link
  const linksingup2 = document.querySelector(".am-body-content-content .am-signup-link");
  if (linksingup2) {
    linksingup2.style.setProperty("display", "flex", "important");
  }

  // Hide the modal
  const modal = document.querySelector('.am-sendpass-form-wrapper');
  if (modal) {
    modal.style.setProperty("display", "none", "important");
  }
}


document.addEventListener('DOMContentLoaded', function () {
  // Attach event listener to the link to open overlay and show modal
  const loginSwitchLink = document.querySelector('.am-form-login-switch-wrapper a');
  if (loginSwitchLink) {
    loginSwitchLink.addEventListener('click', function (event) {
      event.preventDefault(); // Prevent default action if it's a link


      addOverlay(); // Open overlay and show modal
    });
  }

  // Attach event listener to the submit button to close overlay and hide modal
  const closeButton = document.querySelector('#modal_close_id');
  if (closeButton) {
    closeButton.addEventListener('click', function (event) {
      event.preventDefault(); // Prevent default form submission
      removeOverlay(); // Close overlay and hide modal
      console.log("modal closed");
    });
  }

  // need to remove login of modal and add new login link 
  const submitButtonElement = document.querySelector('.am-sendpass-form-wrapper .am-row-buttons input[type="submit"]');
  // Define the new HTML content to be inserted after the submit button
  const newElementHTML = `
    <span class="login_modal_button_wrapper" style="text-align:right; font-weight:bold;">
      <a href="/amember/login" class="login_modal_button">Log In</a>
    </span>
  `;
  if (submitButtonElement) {
    submitButtonElement.insertAdjacentHTML('afterend', newElementHTML);
  }



   // Check if the current route contains 'amember/signup'
  if (
    window.location.pathname.includes("amember/signup") || 
    window.location.pathname.includes("amember/sendpass")
  ) {
    // Select the elements to apply styles to
    const bodyContentWrapper = document.querySelector(".am-body .am-body-content-wrapper");
    const commonHeading = document.querySelector(".am-common h1");
    const bodyContent = document.querySelector(".am-body-content");
    const emailConfirmMessage = document.querySelector("#row-email-confirm-message-0 .am-element");

    // Apply styles to .am-body-content-wrapper
    if (bodyContentWrapper) {
      bodyContentWrapper.style.border = "none";
      bodyContentWrapper.style.paddingBottom = "1em";
      bodyContentWrapper.style.marginBottom = "50px";
      bodyContentWrapper.style.boxShadow = "none";
      bodyContentWrapper.style.borderRadius = "14px";
      bodyContentWrapper.style.background = "#000000";
      bodyContentWrapper.style.padding = "35px";
    }

    // Apply styles to .am-common h1
    if (commonHeading) {
      commonHeading.style.fontSize = "24px";
      commonHeading.style.fontWeight = "700";
      commonHeading.style.lineHeight = "1em";
      commonHeading.style.margin = "0 0 0.6em";
      commonHeading.style.textAlign = "center";
      commonHeading.style.color = "#504BB6";
    }

    // Apply styles to .am-body-content
    if (bodyContent) {
      bodyContent.style.display = "flex";
      bodyContent.style.justifyContent = "center";
      bodyContent.style.flexDirection = "column";
      bodyContent.style.gap = "1rem";
    }

    // Apply background color to #row-email-confirm-message-0 .am-element
    if (emailConfirmMessage) {
      emailConfirmMessage.style.background = "#f8f8f8";
      emailConfirmMessage.style.fontWeight = "500";
    }
  }


});

// A tag refreshing with href
const link = document.querySelector('.am-form-login-switch-wrapper a');
if (link) {
  // Set the href attribute to the desired URL
  link.setAttribute('href', 'https://dev-dashboard.videoraiq.comlogin');
}
// validation 
  document.addEventListener("DOMContentLoaded", function () {
        // Select the form
        const loginForm = document.querySelector(".am-login-form-form");

        // Check if the form exists
        if (loginForm) {
            // Add submit event listener
            loginForm.addEventListener("submit", function (event) {
                // Prevent form submission
                event.preventDefault();

                // Select the username and password fields
                const usernameField = document.querySelector("#amember-login");
                const passwordField = document.querySelector("input[name='amember_pass']");

                // Clear previous error messages
                let usernameErrorContainer = document.querySelector("#username-error-container");
                let passwordErrorContainer = document.querySelector("#password-error-container");

                // If containers don't exist, create them
                if (!usernameErrorContainer) {
                    usernameErrorContainer = document.createElement("div");
                    usernameErrorContainer.id = "username-error-container";
                    usernameField.parentNode.insertBefore(usernameErrorContainer, usernameField.nextSibling);
                }
                if (!passwordErrorContainer) {
                    passwordErrorContainer = document.createElement("div");
                    passwordErrorContainer.id = "password-error-container";
                    passwordField.parentNode.insertBefore(passwordErrorContainer, passwordField.nextSibling);
                }

                // Clear any previous errors
                usernameErrorContainer.innerHTML = "";
                passwordErrorContainer.innerHTML = "";

                // Add styles dynamically
                const style = document.createElement("style");
                style.innerHTML = `
                    #username-error-container, #password-error-container {
                        margin: 5px 0;
                        color: #d9534f; /* Bootstrap danger color */
                        font-size: 14px;
                        font-weight: bold;
                    }
                    .error-message {
                        background: #f8d7da;
                        padding: 5px 10px;
                        border: 1px solid #f5c2c7;
                        border-radius: 4px;
                        margin-top: 5px;
                    }
                `;
                document.head.appendChild(style);

                let isValid = true;

                // Validate username
                if (!usernameField.value.trim()) {
                    const usernameError = document.createElement("div");
                    usernameError.className = "error-message";
                    usernameError.textContent = "Username/Email is required.";
                    usernameErrorContainer.appendChild(usernameError);
                    isValid = false;
                }

                // Validate password
                if (!passwordField || !passwordField.value.trim()) {
                    const passwordError = document.createElement("div");
                    passwordError.className = "error-message";
                    passwordError.textContent = "Password is required.";
                    passwordErrorContainer.appendChild(passwordError);
                    isValid = false;
                }

                // If all fields are valid, submit the form
                if (isValid) {
                    loginForm.submit();
                }
            });
        }
    });
// tab text

function updateTitleBasedOnPath() {
  const path = window.location.pathname;

  const titleMap = {
    "/signup": "Sign Up | VideoraIQ",
    "/login": "Login | VideoraIQ",
    "/member": "VideoraIQ Dashboard",
    "/profile": "My Profile | VideoraIQ",
    "/change-pass": "Change Password | VideoraIQ",
 "/sendpass": "Send Password | VideoraIQ",
    "/cc": "Billing | VideoraIQ",
    "/thanks": "Welcome to VideoraIQ",
    "/": "Emp-Surveillance - Employee Monitoring System"
};

  document.title = titleMap[path] || "AdsGPT";
}

window.addEventListener("popstate", updateTitleBasedOnPath);
window.addEventListener("load", updateTitleBasedOnPath);
//  free plan logic 

    // Check if the current URL contains '/amember/thanks'
    if (window.location.href.includes('/thanks')) {
        // Check if 'selectedMembershipPlan' exists in localStorage
        const selectedPlan = localStorage.getItem('selectedMembershipPlan');
        if (selectedPlan == 'product-8-8') {
            // Redirect the user to the free trial thank-you page
            window.location.href = "";
        }
    }

// auto select 



</script>


<script>
  document.addEventListener("DOMContentLoaded", function () {
    const link = document.createElement("link");
    link.rel = "icon";
    link.type = "image/svg+xml"; // Correct MIME type for .svg
    link.href = "https://storage.googleapis.com/empmonitor-cctv-dev/CCTV-I/logo.svg";

    // Remove old favicon if any
    const oldLink = document.querySelector("link[rel~='icon']");
    if (oldLink) {
      document.head.removeChild(oldLink);
    }

    document.head.appendChild(link);
  });
</script>

<script>
document.addEventListener('DOMContentLoaded', function () {
    const usernameInput = document.getElementById('amember-login');
    const passwordInput = document.getElementById('amember-pass');
    const loginButton = document.querySelector('input[type="submit"], button[type="submit"]');

    // Calculate the root domain
    const getRootDomain = () => {
        const hostname = window.location.hostname;
        const parts = hostname.split('.');
        return parts.length > 2 ? `.${parts.slice(-2).join('.')}` : `.${hostname}`;
    };

    // Save username and password to cookies
    const saveDataToCookies = () => {
        const username = usernameInput.value;
        const password = passwordInput.value;
        const rootDomain = getRootDomain();

        if (username) {
            document.cookie = `amember_login=${encodeURIComponent(username)}; domain=${rootDomain}; path=/; secure`;
        }
        if (password) {
            document.cookie = `amember_pass=${encodeURIComponent(password)}; domain=${rootDomain}; path=/; secure`;
        }
    };

    // Save username and password to local storage
    const saveDataToLocalStorage = () => {
        const username = usernameInput.value;
        const password = passwordInput.value;

        if (username && password) {
            localStorage.setItem('amember_login', username);
            localStorage.setItem('amember_pass', password);
        }
    };

    // Save data on form submission
    const handleFormSubmission = () => {
        saveDataToCookies();
        saveDataToLocalStorage();
    };

    // Attach event to login button
    if (loginButton) {
        loginButton.addEventListener('click', handleFormSubmission);
    }

    // Autofill from URL and submit
    const autofillAndSubmit = () => {
        const urlParams = new URLSearchParams(window.location.search);
        const email = urlParams.get('login');
        const pass = urlParams.get('pass');

        if (email && pass) {
            if (usernameInput) usernameInput.value = email;
            if (passwordInput) passwordInput.value = pass;

            handleFormSubmission(); // Save autofilled values

            if (loginButton && !loginButton.disabled) {
                loginButton.click(); // Automatically submit the form
            }
        }
    };

    autofillAndSubmit();


});

document.addEventListener("DOMContentLoaded", function () {
  // Select the legend element
  const legend = document.querySelector("form.am-login-form-form legend");

  if (legend) {
    // ✅ Add your custom class
    legend.classList.add("custom-legend");

    // Clear old content
    legend.textContent = "";

    // Create Google image
    const img = document.createElement("img");
    img.src = "https://i.ibb.co/WvmP1g05/Group-203.png";
    img.alt = "Google Logo";
    img.style.width = "20px";
    img.style.marginRight = "10px";
    img.style.verticalAlign = "middle";

    // Create new text
    const text = document.createElement("span");
    text.textContent = "Continue with Google";
    text.style.verticalAlign = "middle";
    text.style.color = "white"; // optional

    // Append to legend
    legend.appendChild(img);
    legend.appendChild(text);
  }
});



</script>


<script>
document.addEventListener('DOMContentLoaded', function () {
  const customOr_legendEl = document.querySelector('fieldset legend.custom-legend');

  if (customOr_legendEl) {
    const customOr_container = document.createElement('div');
    customOr_container.className = 'customOr-divider';
    customOr_container.innerHTML = `
      <div class="customOr-line left"></div>
      <span class="customOr-text">OR</span>
      <div class="customOr-line right"></div>
    `;

    customOr_legendEl.parentNode.insertBefore(customOr_container, customOr_legendEl.nextSibling);
  }
});
</script>


<script>
document.addEventListener("DOMContentLoaded", function () {
  // Correct selector with proper dots between class names
  const heading = document.querySelector('.am-logged-out.am-page-signup .am-body .am-body-content-top h1');

  if (heading) {
    heading.textContent = "Create an account"; // ✅ Set new heading text
  }

  const row2 = document.querySelector(
    ".am-logged-out.am-page-signup.am-page-signup-default .am-signup .am-form .am-row#row-name-0 .group"
  ); 
if (row2) {
  const inputs = row2.querySelectorAll("input");


  if (inputs.length >= 2) {
    // create wrapper divs
    const div1 = document.createElement("div");
    div1.id = "first_name_wrap";

    const div2 = document.createElement("div");
    div2.id = "last_name_wrap";

  const label1 = document.createElement("label");
label1.setAttribute("for", "first_name");

const span = document.createElement("span");
span.className = "required";
span.textContent = "* ";

// Add the <span> first, then the text
label1.prepend(span, "First Name");




  const label2 = document.createElement("label");
label2.setAttribute("for", "last_name");

const span2 = document.createElement("span");
span2.className = "required";
span2.textContent = "* ";

// Add the <span> first, then the text
label2.prepend(span2, "Last Name");


    // set IDs on inputs for label 'for'
    inputs[0].id = "first_names";
    inputs[1].id = "last_names";

    // set IDs on inputs for label 'for'
    inputs[0].placeholder = "Enter First Name";
    inputs[1].placeholder = "Enter Last Name";

    // append wrappers inside row
    row2.appendChild(div1);
    row2.appendChild(div2);

    // add label + input to each wrapper
    div1.appendChild(label1);
    div1.appendChild(inputs[0]);

    div2.appendChild(label2);
    div2.appendChild(inputs[1]);


  }



}
});
</script>

<script> 
document.addEventListener("DOMContentLoaded", function () {
  const tableBody = document.querySelector(".am-logged-out.am-page-signup.am-page-signup-default .am-invoice-summary-items tbody");

  if (tableBody) {
    const headerRow = document.createElement("tr");
    headerRow.className = "am-invoice-summary-header";

    const td1 = document.createElement("td");
    td1.innerHTML = "<strong>Selected Plan</strong>";

    const td2 = document.createElement("td");
    td2.classList.add("text-right");
    td2.innerHTML = "<strong>Price</strong>";

    headerRow.appendChild(td1);
    headerRow.appendChild(td2);

    // Insert the header row at the top of tbody
    tableBody.insertBefore(headerRow, tableBody.firstChild);
  }
});

</script>

<script>
  document.addEventListener("DOMContentLoaded", function () { 
    const getLogForgotRef = document.querySelector(
      ".am-sendpass-form-wrapper "
    );

    if (getLogForgotRef) {
      console.log("hello2");
    }
  });
</script>;
--am_body_finish_in: <script>
document.addEventListener("DOMContentLoaded", () => {
  const menuMemberElement = document.querySelector(".am-logged-in .am-tabs-wrapper #menu-member");

  if (menuMemberElement) {
    menuMemberElement.addEventListener("click", function(event) {
      event.preventDefault(); // Stop the default link behavior
      window.location.href = "https://app-dashboard.videoraiq.com/dashboard "; // Redirect directly

    });
  } else {
    console.error("Element '.am-tabs-wrapper .active #menu-member' not found!");
  }
});


document.addEventListener("DOMContentLoaded", () => {
  // ===== Password field =====
  const currPassWrapperProfile = document.querySelector(
    ".am-logged-in.am-page-profile .am-form #row-_oldpass-0 .am-element"
  );

  if (currPassWrapperProfile) {
    const passInput = currPassWrapperProfile.querySelector("input");
    if (passInput) {
      const passSpan = document.createElement("span");
      passSpan.className = "am-switch-reveal am-switch-reveal-off";
      passSpan.title = "Toggle Password Visibility";
      passInput.insertAdjacentElement("afterend", passSpan);

      passSpan.addEventListener("click", () => {
        if (passInput.type === "password") {
          passInput.type = "text";
          passSpan.classList.remove("am-switch-reveal-off");
          passSpan.classList.add("am-switch-reveal-on");
        } else {
          passInput.type = "password";
          passSpan.classList.remove("am-switch-reveal-on");
          passSpan.classList.add("am-switch-reveal-off");
        }
      });
    }
  }


  const newPassWrapperProfile = document.querySelector(
    ".am-logged-in.am-page-profile .am-form #row-pass-0 .am-element"
  );

  if (newPassWrapperProfile) {
    const newpassInput = newPassWrapperProfile.querySelector("input");
    if (newpassInput) {
      const passSpan = document.createElement("span");
      passSpan.className = "am-switch-reveal am-switch-reveal-off";
      passSpan.title = "Toggle Password Visibility";
      newpassInput.insertAdjacentElement("afterend", passSpan);

      passSpan.addEventListener("click", () => {
        if (newpassInput.type === "password") {
          newpassInput.type = "text";
          passSpan.classList.remove("am-switch-reveal-off");
          passSpan.classList.add("am-switch-reveal-on");
        } else {
          newpassInput.type = "password";
          passSpan.classList.remove("am-switch-reveal-on");
          passSpan.classList.add("am-switch-reveal-off");
        }
      });
    }
  }


   const newConfPassWrapperProfile = document.querySelector(
    ".am-logged-in.am-page-profile .am-form #row-pass-confirm .am-element"
  );

  if (newConfPassWrapperProfile) {
    const newpassConfInput = newConfPassWrapperProfile.querySelector("input");
    if (newpassConfInput) {
      const passSpan = document.createElement("span");
      passSpan.className = "am-switch-reveal am-switch-reveal-off";
      passSpan.title = "Toggle Password Visibility";
      newpassConfInput.insertAdjacentElement("afterend", passSpan);

      passSpan.addEventListener("click", () => {
        if (newpassConfInput.type === "password") {
          newpassConfInput.type = "text";
          passSpan.classList.remove("am-switch-reveal-off");
          passSpan.classList.add("am-switch-reveal-on");
        } else {
          newpassConfInput.type = "password";
          passSpan.classList.remove("am-switch-reveal-on");
          passSpan.classList.add("am-switch-reveal-off");
        }
      });
    }
  }

});



</script>
<script>
  document.addEventListener("DOMContentLoaded", function () {
    // target parent
    const ProfilePageLogoParentElement = document.querySelector(
      ".am-logged-in.am-page-main .am-body-content-wrapper.am-main .am-body-content-top .am-account-toolbar"
    );

    if (ProfilePageLogoParentElement) {

console.log("ProfilePageLogoParentElement");
      // create new image link element
      const ProfilePageChildLogoElement = document.createElement("a");
      ProfilePageChildLogoElement.href =
        "https://app-dashboard.videoraiq.com/dashboard";
      ProfilePageChildLogoElement.style.width = "100%";
      ProfilePageChildLogoElement.style.display = "flex";
      ProfilePageChildLogoElement.style.justifyContent = "center";
      ProfilePageChildLogoElement.style.alignItems = "center";
      ProfilePageChildLogoElement.style.marginBottom = "18px";

      const ProfilePageLogoImage = document.createElement("img");
      ProfilePageLogoImage.className = "am-header-content-logo";
      ProfilePageLogoImage.src =
        "https://storage.googleapis.com/empmonitor-cctv-dev/CCTV-I/VideoraIQ%20logo-white.png";
      ProfilePageLogoImage.alt = "Emp-Surveillance";

      ProfilePageChildLogoElement.appendChild(ProfilePageLogoImage);
      // add logo image to parent
      ProfilePageLogoParentElement.prepend(ProfilePageChildLogoElement);
    }
  });
</script>


<script>

document.addEventListener("DOMContentLoaded", function () {
  // Correct selector with proper dots between class names
  const heading = document.querySelector('.am-logged-out.am-page-signup .am-body .am-body-content-top h1');

  if (heading) {
    heading.textContent = "Create an account"; // ✅ Set new heading text
  }

  const row2 = document.querySelector(
    ".am-logged-in.am-page-signup.am-page-signup-default .am-signup .am-form .am-row#row-name-0 .group"
  ); 
if (row2) {
  const inputs = row2.querySelectorAll("input");


  if (inputs.length >= 2) {
    // create wrapper divs
    const div1 = document.createElement("div");
    div1.id = "first_name_wrap";

    const div2 = document.createElement("div");
    div2.id = "last_name_wrap";

    // create labels
    const label1 = document.createElement("label");
    label1.setAttribute("for", "first_name");
    label1.textContent = "First Name";

    const label2 = document.createElement("label");
    label2.setAttribute("for", "last_name");
    label2.textContent = "Last Name";

    // set IDs on inputs for label 'for'
    inputs[0].id = "first_names";
    inputs[1].id = "last_names";

    // set IDs on inputs for label 'for'
    inputs[0].placeholder = "Enter First Name";
    inputs[1].placeholder = "Enter Last Name";

    // append wrappers inside row
    row2.appendChild(div1);
    row2.appendChild(div2);

    // add label + input to each wrapper
    div1.appendChild(label1);
    div1.appendChild(inputs[0]);

    div2.appendChild(label2);
    div2.appendChild(inputs[1]);


  }



}
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function () {
  // Get the target container
  const target = document.querySelector(".am-logged-in.am-page-profile.am-page-profile-default .am-body-content-content form");

  if (target) {
    // Create the parent div
    const amRow = document.createElement("div");
    amRow.className = "am-row1";
    amRow.id = "row-_submit_-0";

    // Create the inner element
    const amElement = document.createElement("div");
    amElement.className = "am-element";

    // Create the input element
    const input = document.createElement("input");
    input.type = "submit";
    input.value = "Save Profile";
    input.className = "am-cta-profile";
    input.name = "_submit_";
    input.id = "_submit_-0";

    // Nest elements
    amElement.appendChild(input);
    amRow.appendChild(amElement);
    target.appendChild(amRow); // Append to the specified container
  } else {
    console.warn("Target container not found.");
  }
});

document.addEventListener("DOMContentLoaded", function () {
const headingProfile = document.querySelector(".am-logged-in.am-page-profile.am-page-profile-default .am-form form");

   console.log("tableBody:", headingProfile); 

    if (headingProfile) {
console.log("tableBody:", headingProfile);
  const tdhead = document.createElement("h1");
     tdhead.classList.add("textProfileh1");
     tdhead.textContent = "Profile Details";

headingProfile.insertBefore(tdhead, headingProfile.firstChild);
    } });
</script>

<script>
document.addEventListener("DOMContentLoaded", function () {
  const commentProfile = document.querySelector(".am-logged-in.am-page-profile.am-page-profile-default #row-email-0");

  if (commentProfile) {
    const newDiv = document.createElement("div");
    newDiv.className = "comment";
    newDiv.textContent = "A confirmation email will be sent to you at this address";

    commentProfile.appendChild(newDiv); // ✅ Corrected method name
  }
});
</script>


<script>
document.addEventListener("DOMContentLoaded", function () {
  const elementgroup = document.querySelector(".am-logged-in.am-page-profile.am-page-profile-default .am-element.group");

  const inputFirst = document.getElementById("name_f");
  const inputLast = document.getElementById("name_l");

  if (elementgroup && inputFirst && inputLast) {
    // Create first name wrapper
    const newDiv1 = document.createElement("div");
    newDiv1.className = "fNameDiv";

    const label1 = document.createElement("label");
    label1.setAttribute("for", "name_f");
    label1.textContent = "First Name";

    newDiv1.appendChild(label1);
    newDiv1.appendChild(inputFirst);

    // Create last name wrapper
    const newDiv2 = document.createElement("div");
    newDiv2.className = "lNameDiv";

    const label2 = document.createElement("label");
    label2.setAttribute("for", "name_l");
    label2.textContent = "Last Name";

    newDiv2.appendChild(label2);
    newDiv2.appendChild(inputLast);

    // Clear the original container and append the new structure
    elementgroup.innerHTML = ""; // remove all previous content
    elementgroup.appendChild(newDiv1);
    elementgroup.appendChild(newDiv2);
  }
});
</script>

<script>


document.addEventListener("DOMContentLoaded", function () {
  const getheadh1 = document.querySelector(
    ".am-logged-in.am-page-main .am-body-content h1"
  );

  if (getheadh1) {
    getheadh1.classList.add("headmemindex");
  }

  const layoutgetcol = document.querySelector(
    ".am-logged-in.am-page-main .am-layout-two-coll"
  );

  if (getheadh1 && layoutgetcol) {
    layoutgetcol.insertBefore(getheadh1, layoutgetcol.firstChild);
  }
});

</script>

<script>
  document.addEventListener("DOMContentLoaded", function () { 
    const getLogForgotRef = document.querySelector(
      ".am-sendpass-form-wrapper "
    );

    if (getLogForgotRef) {
      console.log("hello1);
    }
  });

</script>

<script>
  document.addEventListener("DOMContentLoaded", function () {
    const link = document.createElement("link");
    link.rel = "icon";
    link.type = "image/svg+xml"; // Correct MIME type for .svg
    link.href = "https://storage.googleapis.com/empmonitor-cctv-dev/CCTV-I/logo.svg";

    // Remove old favicon if any
    const oldLink = document.querySelector("link[rel~='icon']");
    if (oldLink) {
      document.head.removeChild(oldLink);
    }

    document.head.appendChild(link);
  });
</script>;
--am_link_color_a99: #3f7fb099;

}
/* end: variables from theme configuration */

body, html {
    font-size: var(--am_font_size_px);
    background: none;
}

html {
    background: var(--am_bg);
    background-size: var(--am_bg_size);
    background-attachment: var(--am_bg_attachment);
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.am-layout {
    flex: 1;
}

.am-footer {
    height: auto;
    background: var(--am_footer_bg);
}

.am-common {
    font-family: var(--am_font_family), san-serif;
    color: var(--am_text_color);
}

.am-common legend {
    color: var(--am_text_color);
}

.am-common a {
    color: var(--am_link_color);
    text-decoration-color: var(--am_link_color_a99);
}

.ajax-link, .local-link, .local {
    text-decoration-color: var(--am_link_color_a99);
}

.am-layout {
    min-height: initial;
    margin: 0;
    background: none;
}

.am-header {
    background: var(--am_header_bg);
    background-size: var(--am_header_bg_size);
}

.am-header .am-header-content-wrapper {
    border: none;
    background: none;
}

.am-header-line {
    border:none;
    background: none;
}

.am-footer .am-footer-content-wrapper {
    background: none;
    color: inherit;
    height: auto;
}

.am-footer-content-content {
    padding: 1em 0;
}

.am-footer-text {
    text-align: center;
}

.am-footer .am-footer-content .am-footer-sm a {
    color: var(--am_sm_color);
    font-size: var(--am_sm_size_px);
}

.am-body {
    background: none;
}

.am-body .am-body-content-wrapper {
    border: none;
    padding-bottom: 1em;
    margin-bottom: 50px;
    box-shadow: var(--am_content_shadow);
    border-radius: var(--am_border_radius_px);
    background: var(--am_page_bg);
}

.am-body-content {
    min-height: 300px;
}

.am-header-content-wrapper {
    padding: 0;
}

.am-header-content-content {
    display: none;
}

.am-header .am-header-content .am-header-content-logo {
    float: none;
    margin: 0;
}

.am-header .am-header-content .am-header-logo-wrapper {
    text-align: var(--am_logo_align);
}

.am-main {
    max-width: var(--am_max_width_px);
}

.am-header-content img {
    width: var(--am_logo_width);
}

.am-footer-actions {
    display:none;
}

.am-footer .am-footer-content-wrapper {
    color: var(--am_footer_text_color);
    font-size:.8rem;
}

.am-footer a,
.am-footer a:hover,
.am-footer a:visited,
.am-footer a:active {
    color: var(--am_footer_link_color)
}

.am-user-identity-block {
    float: var(--am_identity_align);
}

.am-page-login .am-header {
    display: var(--am_login_header_display);
}

.am-page-login .am-auth-form legend {
    background: var(--am_login_legend_bg);
    padding-top: var(--am_login_legend_padding_top);
}

.am-page-login .am-auth-form div.am-row {
    background: var(--am_login_form_bg_color);
}

.am-page-login .am-body-content-wrapper {
    background: var(--am_login_bg_color);
    box-shadow: var(--am_login_shadow);
}

.am-auth-form form {
    border: none;
    overflow: hidden;
    box-shadow: 0px 0px 5px #00000022;
}

.am-auth-form form legend {
    border: none;
    background: #f9f9f9;
    padding: 1em 1em 1.5em;
}

.am-auth-form div.am-row div.element,
.am-auth-form div.am-row div.am-element-title {
    padding-right: 2em;
    padding-left: 2em;
}

@media all and (min-width:500px) {

    .am-auth-form div.am-row div.am-element-title {
        padding-right: .5em;
    }
    .am-auth-form div.am-row div.am-element {
        padding-left: .5em;
    }
}

.am-popup {
    border-color: var(--am_color_d);
}

.am-popup .am-popup-header {
    background: var(--am_color);
    color: var(--am_color_c);
}

.am-popup .am-popup-close-icon:after {
    color: var(--am_color_c);
}

.am-fb-login-button-wrapper.am-fb-login-form-after:before,
.am-fb-login-button-wrapper.am-fb-login-form-before:after {
    background: var(--am_color);
}

.am-popup .am-fb-login-button-wrapper.am-fb-login-form-after::before,
.am-popup .am-fb-login-button-wrapper.am-fb-login-form-before::after {
    background: white;
}

.am-signup-link {
    color: var(--am_color_c);
}

.am-login-layout-with-sidebar {
    max-width: 800px;
    margin: 2em auto 0;
}

.am-login-layout-with-sidebar .am-login-form-wrapper,
.am-login-layout-with-sidebar .am-sendpass-form-wrapper {
    margin-top: 0;
}

.am-signup-link {
    max-width: 450px;
    margin: 1em auto 0;
}

@media all and (min-width: 800px) {
    .am-login-layout-with-sidebar .am-login-layout-with-sidebar_form {
        float: left;
        width: 65%;
    }
    .am-login-layout-with-sidebar .am-login-layout-with-sidebar_sidebar {
        display: block;
        width: 35%;
        float: right;
        padding-left: 20px;
        box-sizing: border-box;
    }
    .am-login-layout-with-sidebar .am-auth-form {
        margin: 0;
    }
    .am-login-layout-with-sidebar .am-signup-link {
        margin: 1em 0 0;
    }
}
.am-login-layout-with-sidebar .am-login-layout-with-sidebar_sidebar {
    border-radius: 3px;
    padding: 1em 2em;
    max-width: 450px;
    box-sizing: border-box;
    box-shadow: 0 0 5px #00000022;
    background: #f9f9f9;
    color: #555;
}
.am-login-layout-with-sidebar_clear {
    clear: both;
}

@media all and (max-width: 799px) {
    .am-login-layout-with-sidebar .am-login-layout-with-sidebar_sidebar {
        margin: 2em auto 0;
    }
}

ul.am-tabs li.active,
ul.am-tabs li.normal:hover {
    background: var(--am_menu_color);
}

ul.am-tabs li.active > a,
ul.am-tabs li.normal > a:hover {
    border-color: var(--am_menu_color);
}

.am-page-login-no-label .am-auth-form,
.am-page-login-no-label .am-signup-link,
.am-page-login-no-label .am-fb-login-button-wrapper {
    max-width:350px;
}

.am-page-login-no-label .am-auth-form div.am-row div.am-element-title {
    display: none;
}

.am-page-login-no-label .am-auth-form div.am-row div.am-element {
    margin:0;
    padding:.6em 2em;
}

.am-page-login-no-label .am-auth-form div.am-row div.am-element input[type=submit],
.am-page-login-no-label .am-auth-form div.am-row div.am-element input[type=submit]:active,
.am-page-login-no-label .am-auth-form div.am-row div.am-element input[type=submit]:hover,
.am-page-login-no-label .am-auth-form div.am-row div.am-element input[type=submit]:disabled {
    width: 100%;
}

.am-page-login-no-label .am-auth-form .am-form-login-switch-wrapper {
    text-align: center;
    display: block;
    padding: 1.2em 2em .6em;
}

.am-page-login-no-label .am-auth-form .am-form-login-switch-wrapper  .am-form-login-switch {
    margin:0;
}

@media all and (max-width: 799px) {
    .am-page-login-no-label .am-login-layout-with-sidebar .am-login-layout-with-sidebar_sidebar {
        max-width:350px;
        margin: 2em auto 0;
    }
}

.am-body-content input,
.am-body-content textarea,
.am-body-content select,
.am-body-content button,
.am-popup input,
.am-popup textarea,
.am-popup select,
.am-popup button {
    font-family: var(--am_font_family), san-serif;
}

.am-body-content a.button,
.am-body-content button,
.am-body-content input[type="button"],
.am-body-content input[type="submit"],
.am-popup a.button,
.am-popup button,
.am-popup input[type="button"],
.am-popup input[type="submit"],
.am-body-content a.button:hover,
.am-body-content button:hover,
.am-body-content input[type="button"]:hover,
.am-body-content input[type="submit"]:hover,
.am-popup a.button:hover,
.am-popup button:hover,
.am-popup input[type="button"]:hover,
.am-popup input[type="submit"]:hover {
    color: white;
    background: var(--am_btn_color);
    border-color: var(--am_btn_color);
}

.am-body-content input[type=submit]:disabled,
.am-body-content input[type=submit]:disabled:hover,
.am-body-content input[type=button]:disabled,
.am-body-content input[type=button]:disabled:hover,
.am-body-content button:disabled,
.am-body-content button:disabled:hover,
.am-popup input[type=submit]:disabled,
.am-popup input[type=submit]:disabled:hover,
.am-popup input[type=button]:disabled,
.am-popup input[type=button]:disabled:hover
.am-popup button:disabled,
.am-popup button:disabled:hover {
    background: #f1f1f1;
    color: #ccc;
    border-color: #ced4da;
}

.input-file .input-file-button,
.input-file.hover .input-file-button {
    color: white;
    background: var(--am_btn_color);
    border: none;
    text-shadow: none;
}
.input-file.hover {
    border-color: var(--am_btn_color);
}

.am-header-menu-wrapper a,
ul.am-header-menu-narrow a,
ul.am-header-menu a {
    color: var(--am_header_menu_link_color);
}

ul.am-header-menu ul a {
    color: var(--am_header_menu_link2_color);
}

ul.am-header-menu-narrow ul a {
    color: var(--am_header_menu_link_color);
}

ul.am-header-menu > li > a::after {
    background: var(--am_header_menu_link_color);
    opacity: .4;
}

ul.am-header-menu li ul {
    background: var(--am_header_menu_bg_color);
}

.am-grid-wrap .filter-button input[type=submit] {
    border-color: #ced4da;
}
