/*  */
.page-template-registration header,
.page-template-sign-up-2 header,
.page-template-login header,
.page-template-login-2 header,
.page-template-forgot-password header,
.page-template-new-password header,
.page-template-verify-email header,
.page-template-verify-email-2 header                            {display:none;}
.account-page-wrap                                              {padding: 16px; background-color: var(--gray); position: relative; z-index: 1; height: 100vh; min-height: 600px; }
.account-page-wrap .row                                         {height: 100%;}
.account-form-image,.custom-login-form                          {height: 100%;}
/* left side */
/* logo */
.account-form-image                                             {padding: 72px 40px;border-radius: 20px;overflow: hidden;background-repeat: no-repeat;background-position: center center;background-size: cover;}
.account-form-image .logo img                                   {width:181px;height: auto;margin-bottom:77px;}
/* menu */
.login-wrap                                                     {gap:16px;}
.account-form-left-content li .login-left-icon                  {position: relative;}
.account-form-left-content li .login-left-icon::after           {content: '';position: absolute;left: 28px;top: 100%;height: 100%;width: 1px;background-color:rgba(255, 255 , 255, 0.2) ;}
.account-form-left-content li                                   {margin-bottom: 59px;}
.account-form-left-content li:last-child                        {margin-bottom: 0 !important;}
.account-form-left-content li:last-child .login-left-icon:after {display:none;}
.login-left-icon                                                {border: 1px solid rgba(255, 255 , 255, 0.2);border-radius:50%;flex-shrink: 0; background-color: #4193CD;height:56px;width: 56px;display:flex;justify-content: center;align-items: center;}
.account-form-left-content li:first-child .login-left-icon      {background-color: var(--white);}
.login-left-icon img                                            {height: 24px;width: 24px;}
.login-left-content .heading-style-9                            {color: var(--white);margin-bottom:4px;}
.login-left-content .p-big                                      {color: var(--gray-01);}
/* right form */
.custom-login-form                                              {display: flex;justify-content: center;align-items: center;flex-direction: column;}
.account-form-inner                                             {max-width: 500px;margin:0 auto;width: 100%;}
.account-form-title                                             {margin-bottom: 56px;}
.account-form-title .heading-style-2                            {color: var(--light-blue);}
.account-form-title .heading-style-10                           {color: var(--secondary-01);}
.account-form-title .heading-style-10 a                         {color: var(--secondary-01);text-decoration: underline;}
/* extra link */
.extra-links                                                    {margin-top: 20px;}
.extra-links p                                                  {font-size: 18px;line-height: 26px;font-family:var(--helvetica-reg);}
.extra-links p a                                                {font-family:var(--helvetica-bold);color:var(--blue-01);text-decoration:underline;}
.extra-links p a:hover                                          {color:var(--dark-blue);}

/*============================== verify email page ============================== */
.verify-email-page-wrap .input-wrap                             {gap: 24px;}
.verify-email-page-wrap .email-verfication-div input[type=text],
.verify-email-page-wrap input[type=number]                      {width:54px;height:54px;border-radius: 16px;-moz-appearance: textfield;text-align: center;}
.verify-email-page-wrap input::-webkit-outer-spin-button,
.verify-email-page-wrap input::-webkit-inner-spin-button        { -webkit-appearance: none; margin: 0; }
/*============================== forgot-pass-page ============================== */
.forgot-pass-page-wrap .account-form-image                      {padding: 24px 23px !important;position: relative;z-index: 1;}
.forgot-pass-page-wrap .account-form-image:after                {content:"";position: absolute;left: 0;top: 0;height:35%;width:100%;background: rgb(0,0,0); background: linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);z-index: -1;}
/*============================== verify-modal-check-pop up ============================== */
.verify-modal-check-image                                       {width:132px;height: 132px;margin-bottom:24px;margin-inline:auto;}

/* ============================== login 2 page ============================== */
#two_factor_auth_form  input[type=submit]{margin-top: 0;}


/* ======================================================== Media Query ================================================= */
/* @media screen and (max-width:1600px) {} */
@media screen and (max-width:1500px)                            {
    .account-form-image                                         {padding: 60px 35px;}
    .account-form-left-content li                               {margin-bottom: 52px; }
    .account-form-image .logo img                               {width: 175px;}
    /* right form */
    .account-form-title                                         {margin-bottom: 45px; }   
}
@media screen and (max-width:1400px)                            {}
@media screen and (max-width:1199px)                            {
    .account-form-image                                         {padding: 54px 32px;}
    .account-form-left-content li                               {margin-bottom: 48px; }
    .account-form-image .logo img                               {width: 170px;margin-bottom: 66px;}
    /* left side */
    .login-left-icon                                            {height: 50px; width: 50px;}
    .login-left-icon img                                        {height: 20px; width: 20px; }
    .account-form-left-content li .login-left-icon::after       {left: 24px;}
    /* right form */
    .account-form-inner                                         {max-width: 420px;}
    .account-form-title                                         {margin-bottom: 40px; }
    .extra-links p                                              {font-size: 16px;line-height: 24px;}   
}
@media screen and (max-width:991px)                             {
    .account-page-wrap                                          {height: 100%; min-height: 100vh;display: flex;flex-direction: column;justify-content: center;}
    .account-page-wrap .row                                     {gap: 25px;}
    .account-form-left-content li                               {margin-bottom: 42px; }
    .account-form-image .logo img                               {width: 150px;margin-bottom: 60px;}
    /* left side */
    .login-left-icon                                            {height: 45px; width: 45px;}
    .login-left-icon img                                        {height: 18px; width: 18px; }
    .account-form-left-content li .login-left-icon::after       {left: 22px;}
    /* right form */
    .account-form-inner                                         {max-width: 100%;}
    .account-form-title                                         { margin-bottom: 28px; }
    .extra-links p                                              {font-size: 15px;line-height: 22px;}
    /*============================== verify email page ============================== */
    .verify-email-page-wrap.account-page-wrap                   {height: 100vh;min-height: auto;}
    .verify-email-page-wrap.account-page-wrap .row              {gap:0;}
    .verify-email-page-wrap .input-wrap                         {gap: 20px;}
    .verify-email-page-wrap .email-verfication-div input[type=text],
    .verify-email-page-wrap input[type=number]                  {width:45px;height:45px;border-radius: 12px;}
    /*============================== forgot-pass-page ============================== */
    .forgot-pass-page-wrap .account-form-image                  {height:400px;}
    /*============================== verify-modal-check-pop up ============================== */
    .verify-modal-check-image                                   {width:110px;height: 110px;margin-bottom:22px;}
}
@media screen and (max-width:767px)                             {
    .account-form-left-content li                               {margin-bottom: 28px; }
    .account-form-image .logo img                               {width: 130px;margin-bottom: 40px;}
    .account-form-image                                         {padding: 35px 25px;border-radius: 15px;}  
    /* right form */
    .account-form-title                                         {margin-bottom: 26px; }
    /*============================== verify email page ============================== */
    .verify-email-page-wrap.account-page-wrap                   {height: 100%; min-height: 100vh;}
    .verify-email-page-wrap.account-page-wrap .row              {gap:25px;}
    .verify-email-page-wrap .input-wrap                         {gap: 18px;}
    /*============================== forgot-pass-page ============================== */
    .forgot-pass-page-wrap .account-form-image                  {height:350px;}
    /*============================== verify-modal-check-pop up ============================== */
    .verify-modal-check-image                                   {width:90px;height: 90px;margin-bottom:20px;}
}
@media screen and (max-width:575px)                             {
    .account-form-image .logo img                               {width: 120px; margin-bottom: 35px; }
    .account-page-wrap                                          {padding: 15px;}
    .account-form-image                                         {padding: 25px 20px; border-radius: 13px; }
    .account-form-left-content li .login-left-icon::after       {left: 19px; height: 120%; }
    .login-left-icon                                            {height: 40px; width: 40px; }
    .account-form-title                                         {margin-bottom: 22px; }  
    /*============================== verify email page ============================== */
    .verify-email-page-wrap .input-wrap                         {gap: 15px;}
    .verify-email-page-wrap .email-verfication-div input[type=text],
    .verify-email-page-wrap input[type=number]                  {width: 42px;height: 42px; }
    /*============================== forgot-pass-page ============================== */
    .forgot-pass-page-wrap .account-form-image                  {height:310px;padding: 25px 20px !important;}
    /*============================== verify-modal-check-pop up ============================== */
    .verify-modal-check-image                                   {width:60px;height: 60px;margin-bottom:15px;}
}
