.nomob {
display: none;
position: absolute;
top:0px;
left: 0px;
}

.ath_frm_wrp {
width: 100%;
min-height: 100vh;
min-height: 800px;
background-image: url("../static/setup.png");
background-repeat: repeat;
display: flex;
justify-content: center;
align-items: start;
padding-top: 80px;
padding-bottom: 80px;
}

.ath_frm_cn {
background-color: white;
border: 1px rgb(205, 205, 205) dotted;
border-radius: 5px;
box-shadow: 0px 4px 12px 0px rgba(199, 199, 199, 0.4);
width: 450px;
min-height:500px;
display: flex;
justify-content: center;
align-items: center;
padding-bottom: 55px;
padding-top: 45px;
}

.ath_frm_bx {
width: 86%;
height: auto;
margin-left: 7%;
margin-right: 7%;
transform-origin: 0.2s;
padding-bottom:35px;
border: 1px rgb(224, 224, 224) dotted;
}


.ath_frm_hdcmbx {
width: 90%;
height: 110px;
margin-left: 5%;
margin-right: 5%;
border-bottom: 2px dashed rgb(212, 212, 212);
}

.ath_frm_hdcmbx img {
display: block;
margin-left: auto;
margin-right: auto;
width: 50px;
margin-top: 25px;
}

.ath_frm_hdcmbx p {
font-size: 18px;
font-family: 'Poppins', sans-serif;  
text-align: center;
font-weight: bold;
margin-top: 10px;
color: black;
}

.ath_cdim {
width: 60px;
margin-left: auto;
margin-right: auto;
display: block;
margin-top: 30px;
}

.ath_hdtx {
font-size: 18px;
font-family: 'Poppins', sans-serif;  
text-align: center;
margin-top: 25px;
color: black;
margin-bottom: 15px;
padding-left: 10px;
padding-right: 10px;
}

.ath_sbtx {
font-size: 14px;
font-family: 'Poppins', sans-serif;  
text-align: center;
margin-top: 5px;
color: rgb(1, 92, 220);
font-weight: 500;
margin-bottom: 5px;
padding-left: 10px;
padding-right: 10px;
cursor: default;
}

.ath_sbtx:hover {
text-decoration: underline;
}

.ath_ecfmbx {
width: 100%;
height: auto;
display: flex;
opacity: 100%;
transition-duration: 0.2s;
justify-content: start;
align-items: center;
flex-direction: row;
padding-top: 10px;
position: relative;
}

.ath_ecfmb_hfcnx {
width: 100%;
height: auto;
display: flex;
opacity: 100%;
transition-duration: 0.2s;
justify-content: center;
align-items: center;
padding-left: 5%;
padding-right: 5%;
padding-top: 10px;
}

#ath_opt_bx {
display: none;
}

.ath_ecinbx {
width: 90%;
height: auto;
margin-left: 5%;
margin-right: 5%;
position: relative;
}

.ath_ecinbx_hf {
width: 50%;
height: auto;
position: relative;
padding-bottom: 5px;
display: flex;
justify-content: start;
align-items: center;
}


.ath_ecfmb_hfcnx .ath_ecinbx_hf:nth-child(2) {
padding-left: 10px;
}

.ath_flb {
font-family: 'Inter', sans-serif;  
font-size: 16px;
font-weight: 400;
z-index: 90;
margin-top: -35px;
margin-left: 10px;
position: absolute;
color: black;
transition-duration: 0.2s;
cursor: text; 
background-color: white;
padding-left: 10px;
padding-right: 5px;
border-radius: 5px;
padding-bottom: 2px;
}

/* Label floats up when input is focused or has text */
.ath_fm_inp:focus + .ath_flb, 
.ath_fm_inp:not(:placeholder-shown) + .ath_flb {
margin-top: -60px;
margin-left: 5px;
font-size: 14px;
color: gray;
background-color: white;
}

.vw_cont_aa_otp {
display: none;
opacity: 0%;
transition-duration: 0.2s;
}

.ath_fm_inp {
position: relative;
cursor: text;
font-size: 15px;
line-height: 20px;
z-index: 60;
padding-left: 15px;
cursor: default;
height: 50px;
background-color: #fff;
border: 1px solid #d6d6e7;
border-radius: 3px;
color: rgb(35, 38, 59);
box-shadow: inset 0 1px 4px 0 rgb(119 122 175 / 30%);
overflow: hidden;
transition: all 100ms ease-in-out;
margin-top: 10px;
width: 95%;
outline: none;
font-family: 'Inter', sans-serif;   
}

.ath_fm_inp:focus {
border-color: #ffffff;
box-shadow: 0 0 0 4px #dfe6f8;
}

.disabledIN {
opacity: 70%;
user-select: none;
color: grey;
pointer-events: none; 
cursor: not-allowed;
}

/* FOR CUSTOMER  */
/* APP TYPE RADIO  */
.setup_form_radi:focus {
outline: 0;
border-color: #2260ff;
box-shadow: 0 0 0 4px #b5c9fc;
}

.setup_mydict div {
display: flex;
flex-wrap: wrap;
justify-content: start;
padding-left: 10px;
}

.setup_mydict input[type="radio"] {
clip: rect(0 0 0 0);
clip-path: inset(100%);
height: 1px;
overflow: hidden;
position: absolute;
white-space: nowrap;
width: 1px;
}

.setup_mydict input[type="radio"]:checked + span {
box-shadow: 0 0 0 0.0625em #0043ed;
background-color: #dee7ff;
z-index: 50;
color: #0043ed;
}

.setup_mydict label span {
display: block;
cursor: pointer;
background-color: #fff;
padding: 0.250em .65em;
position: relative;
margin-left: .02em;
box-shadow: 0 0 0 0.0625em #b5bfd9;
letter-spacing: .05em;
font-family: 'Poppins', sans-serif;  
font-size: 14px;
color: #3e4963;
text-align: center;
transition: background-color .2s ease;
}

.setup_mydict label:first-child span {
border-radius: .375em 0 0 .375em;
}

.setup_mydict label:last-child span {
border-radius: 0 .375em .375em 0;
}

.ath_ectpbx {
width: 80%;
height: 53px;
margin-left: 10%;
margin-right: 10%;
border: 1px black solid;
display: flex;
justify-content: start;
align-items: center;
cursor: default;
transition-duration: 0.2s;
}


/* CHECKBOX FOR DASBOARD  */
.dssetup_mydict{
font-size: 13px;
}





.ath_ectpbx img {
width: 37px;
height: 37px;
margin-left: 20px;
}

.ath_ectpbx p {
font-family: 'Poppins', sans-serif;  
font-size: 19px;
margin-left: 15px;
font-weight: 400;
}


/* BUTTON */
.form_btn01 {
appearance: none;
background: radial-gradient(100% 100% at 100% 0, #5adaff 0, #5468ff 100%);
border: none;
border-radius: 6px;
box-shadow: rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, rgba(58, 65, 111, .5) 0 -3px 0 inset;
box-sizing: border-box;
color: #fff;
cursor: pointer;
font-family: 'Poppins', sans-serif;  
height: 40px;
min-width: 30%;
width: 90%;
margin-left: 5%;
margin-right: 5%;
padding: 0 16px;
margin-top: 15px;
text-decoration: none;
transition: box-shadow .15s, transform .15s;
user-select: none;
font-size: 15px;
}
.form_btn01:focus {
box-shadow: #3c4fe0 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #3c4fe0 0 -3px 0 inset;
}
.form_btn01:hover {
box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #3c4fe0 0 -3px 0 inset;
transform: translateY(-2px);
}
.form_btn01:active {
box-shadow: #3c4fe0 0 3px 7px inset;
transform: translateY(2px);
}

.form_btn02 {
background: radial-gradient(100% 100% at 100% 0, #ecc440 0, #e19a01 100%);
border: 1px solid transparent;
border-radius: 3px;
box-shadow: rgba(229, 223, 169, 0.4) 0 2px 4px, rgba(244, 212, 152, 0.3) 0 7px 13px -3px, rgba(176, 136, 2, 0.5) 0 -3px 0 inset;
box-sizing: border-box;
color: #fff;
cursor: pointer;
font-family: 'Lato', sans-serif;  
height: 50px;
width: auto;
padding-left: 20px;
padding-right: 20px;
margin-top: 15px;
text-decoration: none;
transition: box-shadow .15s, transform .15s;
user-select: none;
font-size: 16px;
padding-bottom: 3px;
}
.form_btn02:focus {
box-shadow: #e0ac3c 0 0 0 1.5px inset, rgba(66, 64, 35, 0.4) 0 2px 4px, rgba(66, 60, 35, 0.3) 0 7px 13px -3px, #e09e3c 0 -3px 0 inset;
}
.form_btn02:hover {
box-shadow: rgba(207, 146, 2, 0.4) 0 4px 8px, rgba(183, 160, 12, 0.3) 0 7px 13px -3px, #b88701 0 -3px 0 inset;
transform: translateY(-2px);
}
.form_btn02:active {
box-shadow: #d79925 0 3px 7px inset;
transform: translateY(2px);
}
    


.form_btn03 {
background: radial-gradient(100% 100% at 100% 0, #ecc440 0, #e19a01 100%);
border: 1px solid transparent;
border-radius: 3px;
box-shadow: rgba(229, 223, 169, 0.4) 0 2px 4px, rgba(244, 212, 152, 0.3) 0 7px 13px -3px, rgba(176, 136, 2, 0.5) 0 -3px 0 inset;
box-sizing: border-box;
color: #fff;
cursor: pointer;
font-family: 'Poppins', sans-serif;  
height: 40px;
width: auto;
padding-left: 15px;
padding-right: 15px;
margin: 10px;
text-decoration: none;
transition: box-shadow .15s, transform .15s;
user-select: none;
font-size: 13px;
}
.form_btn03:focus {
box-shadow: #e0ac3c 0 0 0 1.5px inset, rgba(66, 64, 35, 0.4) 0 2px 4px, rgba(66, 60, 35, 0.3) 0 7px 13px -3px, #e09e3c 0 -3px 0 inset;
}
.form_btn03:hover {
box-shadow: rgba(207, 146, 2, 0.4) 0 4px 8px, rgba(183, 160, 12, 0.3) 0 7px 13px -3px, #b88701 0 -3px 0 inset;
transform: translateY(-2px);
}
.form_btn03:active {
box-shadow: #d79925 0 3px 7px inset;
transform: translateY(2px);
}



.form_btn04 {
background-color: rgb(232, 251, 255);
color: rgb(0, 152, 207);
border: 1px solid rgba(0, 152, 207, 0.25);
border-radius: 6px;
font-family: 'Poppins', sans-serif;
font-size: 13px;
font-weight: 500;
height: 30px;
width: fit-content;
margin-left: 5px;
margin-right: 5px;
padding: 0 10px;
margin-top:0px;
cursor: pointer;
user-select: none;
transition: all 0.2s ease;
box-shadow: 0 2px 6px rgba(0, 152, 207, 0.12);
}

.form_btn04:hover {
background-color: rgb(0, 152, 207);
color: white;
box-shadow: 0 6px 14px rgba(0, 152, 207, 0.35);
transform: translateY(-2px);
}

.form_btn04:active {
transform: translateY(1px);
box-shadow: 0 3px 8px rgba(0, 152, 207, 0.25) inset;
}

.form_btn04:focus {
outline: none;
box-shadow: 0 0 0 3px rgba(0, 152, 207, 0.25);
}








.ath_ecbtbx {
width: 100%;
height: auto;
padding-top: 05px;
display: block;
}

.ath_fdc {
font-family: 'Poppins', sans-serif;  
font-size: 11px;
font-weight: 400;
color: grey;
text-align: center;
margin-top: 20px;
margin-bottom: 5px;
}

.ath_fm_img {
width: 210px;
display: block;
margin-left: auto;
margin-right: auto;
}

/* TABBING  */
.ath_tbbx {
width: 100%;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 15px;
}


.ath_ectbbx {
width: 30%;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: row;
cursor: default;
transition-duration: 0.2s;
border-bottom: 1px #5468ff solid;
}

.ath_ectbbx:hover {
background-color: rgb(245, 245, 245);
}

.ath_ectbbx i {
color: grey;  
font-size: 16px;
padding-right: 10px;
}

.ath_ectbbx p {
color: grey;
font-family: 'Poppins', sans-serif;  
font-size: 14px;
font-weight: 400;
}

.selected_ath_ectbbx i {
color: rgb(48, 25, 255);
}

.selected_ath_ectbbx p {
color: rgb(48, 25, 255);
font-family: 'Poppins', sans-serif;  
font-size: 16px;
font-weight: 400;
}

.selected_ath_ectbbx {
border-bottom: 5px #5468ff solid;
background-color: #f5f6ff ;
}

.selected_ath_ectbbx:hover {
background-color: #e9eafc ;
}

/* FORM DISPLAY  */
.ath_tb_frmbx {
transition-duration: 0.2s;
opacity: 100%;
/* display: none; */
}

/* QRCODE DISPLAY  */
.ath_ecqrbx {
width: 100%;
height: auto;
/* display: flex; */
transition-duration: 0.2s;
opacity: 0%;
display: none;
justify-content: center;
align-items: center;
flex-direction: column;
padding-top: 40px;
}

.ath_qr_im {
width: 65%;
border: 3px rgba(30, 30, 30, 0.603) solid;
padding: 15px;
}

.ath_qr_tx {
color: rgb(4, 126, 178);
font-family: 'Poppins', sans-serif;  
padding: 10px;
background-color: rgb(239, 251, 255);
margin-top: 20px;
font-size: 14px;
border: 1px rgb(193, 234, 247) solid;
width: 90%;
margin-left: 5%;
margin-right: 5%;
border-radius: 5px;
}



/* MOBILE VIEWPORT */
@media  (max-width: 700px) {
    .not_mobile {
    display: none;
    }
     .nomob {
    font-family: 'Inter', sans-serif; 
    font-size: 15px;
    width: 100%;
    padding: 20px;
    color: rgb(5, 105, 130);
    background-color: rgb(200, 249, 255);
    display: block;
    z-index: 100;
    }

    .ath_frm_wrp {
        height: auto;
    }

    .ath_frm_cn {
        min-height: 400px;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
    }

    .ath_frm_bx {
        width: 86%;
        min-height: 500px;
    }

    .ath_ectbbx {
        width: 100%;
    }

    .ath_ectbbx i {
    font-size: 14px;
    }
    
    .ath_ectbbx p {
    font-size: 14px;
    font-weight: 400;
    }
    
    .selected_ath_ectbbx i {
    font-size: 14px;
    }

    .selected_ath_ectbbx p { 
    font-size: 14px;
    }

    .ath_hdtx {
    font-size: 16px;
    }

    .ath_ectpbx {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    }

    .ath_ectpbx img {
    width: 27px;
    height: 27px;
    margin-left: 20px;
    }

    .ath_ectpbx p {
    font-size: 15px;
    }

    .ath_ecfmbx {
    width: 100%;
    display: block;
    }
    
    .ath_ecinbx {
    width: 90%;
    height: auto;
    margin-left: 5%;
    margin-right: 5%;
    position: relative;
    }

    .ath_ecinbx_hf {
    width: 90%;
    padding-left: 0px;
    display: flex;
    justify-content: start;
    padding-bottom: 3px;
    }

    .ath_ecinbx_hf label input{
    width: 122%;
    margin-left: 1px;
    }

    .setup_mydict div {
    margin-top: 15px;
    margin-left: -8px;
    }

    .ar_mb_mr01 {
        margin-top: 15px;
    }

    .ar_mb_mr02 {
        margin-top: -5px;
    }
    
    .form_btn02 { 
    width: auto;
    margin-left: 1px;
    }
}




/* Remove autofill background color */
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset !important;
    -webkit-text-fill-color: #000 !important; /* keep text black (change as needed) */
    transition: background-color 5000s ease-in-out 0s; /* prevent flicker */
}

/* For dark mode background */
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #fff inset !important; /* change #fff to your input bg */
}


#sign_mtd_otp {
display: none;
}