

/*----------------------------
         Add CSS file
----------------------------*/
@import "../plugins/bootstrap/css/bootstrap.min.css";
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/*----------------------------
   element      
----------------------------*/
:root {
    --cyan:#21A8A8;
    --darkcyan:#0d6060;
    --black:#4B4747;
    --green:#A0C825;
    --orange:#F19A3A;
    --border:#E9E9E9;
    --placeholder:#DDDCDA;
    --black:#404040;
    --red:#FF2222;
    --lightgray:#8F93A0;
    --white:#ffffff;
    --body:#E9E9E9;
}

* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
html { text-rendering: optimizeLegibility !important;-webkit-font-smoothing: antialiased !important;}
*{margin:0; padding:0}
a{ text-decoration:none;}
a:hover{ text-decoration:none !important;}
header, nav, section, article, aside, footer { display:block;}
html {font-size: 100%;}
body {font-size: 14px; background:var(--body);font-family: "Poppins", sans-serif;line-height: 26px;color:var(--gray, #4F5168);-webkit-font-smoothing: antialiased;font-weight: normal;}
h1, h2, h3, h4, h5, h6 {padding: 5px 0 15px 0;font-weight: normal;-webkit-font-smoothing: antialiased;}




/*----------------------------
   auth      
----------------------------*/
.auth-height{height: 100vh;}
.rmt-1{margin-top: 1rem;}
.rmt-2{margin-top: 2rem;}
.rmt-3{margin-top: 3rem;}
.rmt-4{margin-top: 4rem;}
.rmt-5{margin-top: 5rem;}

.auth-content-card{width: 100%}

#background-objects {width: 100vw; height: 100vh; object-fit: cover; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: -1; }
/*.auth-bg-objects:before {content: ''; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background:rgb(111 81 189 / 51%) }*/


.auth-section {display: flex; align-items: center; height: 100vh; position: relative;} 
.auth-section .container {max-width: 65%; }
.auth-content {padding: 4rem 2rem; position: relative; text-align: center; border-radius: 15px 0 0 15px; } 
.auth-content-info  h2 {font-size: 24px; font-weight: 600; color: var(--green); margin: 0; padding: 0; }
.auth-content-info  p {font-size:14px; font-weight: 300; color: var(--Lighter); margin: 0; padding: 0; }



.auth-content-info {position: relative; z-index: 1; }
.auth-card {position: relative;background: #ffffff5c;box-shadow: 0px 4px 70px 10px rgba(0, 0, 0, 0.08);border-radius: 5px;backdrop-filter: blur(6px);}

.brand-logo {text-align: center; display: flex ; align-items: center; justify-content: center; margin: 0 auto 0rem auto; background: var(--purple); padding: 1rem; }
.brand-logo img{height: 75px}

.auth-form-info{margin: 0px;padding: 0px;display: flex;align-items: center; height:calc( 100vh - 80px); width: 100%; flex-wrap: wrap; /* background: #ffffffa6; */} 
.auth-form {padding: 30px; width: 100%;  max-width: 580px;    text-align: center;}
.auth-form  h2 {font-size: 24px; font-weight: 600; color:var(--cyan); margin: 0; padding: 0; }
.auth-form  p {font-size:14px; font-weight: 300; color:var(--black); margin: 0; padding: 0; }
.auth-illustration-card{padding: 2rem;position: relative;background: #f0ffffb3;}
.auth-illustration img {width: 100%; height: 100%; object-fit: cover; }
#signup-flow{width: 100%;}
.auth-illustration-content h2{ color:var(--cyan); text-align:center; font-size:30px; font-weight:600; padding:0; margin:0 0 1rem 0 }
.auth-illustration-content p{ color:var(--black); text-align:center; font-size:20px; font-weight:400; padding:0; margin:0 0 0rem 0 }

.step-section{position: relative; padding: 2rem 0}

a.auth-link{font-size: 0.875rem; margin: 0; color: #ffcc00; font-weight: normal; }

.auth-form .form-group {margin-bottom: 10px; }
.auth-form .form-group label {color: #fff; font-size: 14px; font-weight: 600; }
.auth-form input.form-control {background: var(--white); border-radius: 5px; font-size: 13px; border: 1px solid var(--border); font-weight: 400; height: auto; padding: 0.94rem 0.94rem; outline: 0; width: 100%; display: inline-block; color: var(--black); box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.05); }

.auth-form select.form-control {background:var(--white); appearance: auto; border-radius: 5px;font-size: 13px;border: 1px solid #e1e1e1;font-weight: 400;height: auto;padding: 0.94rem 0.94rem;outline: 0;width: 100%;display: inline-block;color:var(--gray);box-shadow: 0px 8px 13px 0px rgba(0, 0, 0, 0.05);}
.auth-form input.form-control:focus {border: 1px solid var(--cyan); }

.auth-form input.form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color:var(--placeholder); }
.auth-form input.form-control::-moz-placeholder { /* Firefox 19+ */ color:var(--placeholder); }
.auth-form input.form-control:-ms-input-placeholder { /* IE 10+ */ color: var(--placeholder); }
.auth-form input.form-control:-moz-placeholder { /* Firefox 18- */ color:var(--placeholder); }


 button.auth-form-btn {outline: none;width: 100%;padding: 12px 40px;display: inline-block;color: #fff;font-size: 14px;font-weight: 600;border-radius: 5px;border: none;background:var(--cyan);box-shadow:2px 8px 16px hsl(180deg 67% 39% / 16%), #1FB9B9 -6px -6px 16px inset, #3AE1E1 2px 2px 12px inset;}

.auth-action{display: flex;gap: 10px;}
 button.auth-form-btn-1{outline: none;width: 100%;padding: 12px 40px;display: inline-block;color: #fff;font-size: 14px;font-weight: 600;border-radius: 5px;border: none;background:var(--black);box-shadow:2px 8px 16px hsl(180deg 67% 39% / 16%), #646464 -6px -6px 16px inset, #525252 2px 2px 12px inset;}


.note-msg-info {background: #fbfbfb; display: inline-block; font-size: 12px; border-radius: 10px; line-height: 20px; color: #455A64; position: relative; padding: 8px 8px 8px 45px; }
.note-msg-info i {position: absolute; left: 8px; font-size: 30px; top: 14px; }
.forgotpsw-text a {font-size: 14px; color: var(--cyan); }
.forgotpsw-text {font-size: 14px; color: var(--black); }

.iti{width: 100%}

.otp-input-item {display: flex; gap: 20px; margin-bottom:2rem }
.otp-input-item input{text-align: center;}
.auth-shape-image{text-align: center;}
.auth-shape-image img{height: 200px;}

.about-form-group{position: relative; background: #fff; gap: 10px; margin-bottom: 1rem; border-radius: 10px; display: flex; align-items: center;box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.05); padding: 5px;}
.about-form-icon{box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.05); background:#A1DDDD; border-radius: 10px; padding: 10px;}
.about-form-group textarea.form-control,
.about-form-group input.form-control{box-shadow: none; border: none;}
.about-form-group input.form-control:focus{box-shadow: none; border: none;}

.form-status-icon{padding: 10px;}
.filled-status svg path{stroke:var(--cyan);}

.photo-file-box{margin-bottom: 1rem;}
.photo-file-add{box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.05); background:#A1DDDD; border-radius: 10px; width: 50px; height: 50px; padding: 8px;  }


.photo-file-box label{width: 100%;height: 130px; display: flex; align-items: center; justify-content: center; border: 1px dashed var(--cyan);border-radius: 10px;padding: 10px;box-shadow: 0px 4px 30px rgb(95 94 231 / 7%);background: #FCFFFF;color: #3ecd7b;
    text-align: center;font-size: 14px;}
.uploadphto1 {width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1;}
.uploadphto1:focus + label,
.uploadphto1.has-focus + label,
.uploadphto1 + label:hover {color: #92b116; }
.uploadphto1 + label figure {width: 100px; height: 100px; border-radius: 50%; background-color: #d3394c; display: block; padding: 20px; margin: 0 auto 10px; }
.upload-file span {font-size: 14px; letter-spacing: 0; color: #455A64; white-space: nowrap;text-align: left;}


.uploaded-photo-card{border: 1px dashed var(--cyan);border-radius: 10px; position: relative; padding: 2px;box-shadow: 0px 4px 30px rgb(95 94 231 / 7%);background: #FCFFFF;}

.uploaded-photo-image{width: 100%; height: 130px; position: relative; border-radius: 10px; overflow: hidden;}
.uploaded-photo-image img{object-fit: cover; width: 100%; height: 100%;}
.uploaded-photo-action{box-shadow: 0px 4px 13px 0px rgba(0, 0, 0, 0.05); margin: auto; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background:#fff; border-radius: 10px; width: 50px; height: 50px; padding: 8px;  }

.birthday-form-group{margin-bottom: 1rem;}
.birthday-form-group h5{font-size: 14px; font-weight: 600; text-align: left; color:var(--black); margin: 0; padding: 0; }

.lookingfor-form-group{margin-bottom: 1rem;}
.lookingfor-form-group h5{font-size: 14px; font-weight: 600; text-align: left; color:var(--black); margin: 0 0 5px 0; padding: 0; }

.lookingfor-list{display: flex; gap: 10px; align-items: center;}
.lookingfor-card{width: 33%;}
.mmCheckbox label {position: relative;display: inline-block;height: auto;cursor: pointer;margin-bottom: 0;width: 100%;border-radius: 15px;padding:15px;box-shadow: 0px 8px 13px rgb(0 0 0 / 5%);background: #FCFFFF;}
.mmCheckbox label::before, 
.mmCheckbox label::after {position: absolute;top: 0;border-radius: 15px;left: 0;display: block;right: 0;bottom: 0;}
.mmCheckbox label::before {content: " ";border: 1px solid #FCFFFF;}
.mmCheckbox input[type="radio"]{position: absolute; opacity: 0; z-index: -1; margin: 0; }
.mmCheckbox input[type="radio"] + label::after {content: ""; color: #FFC107; font-size: 15px; height: 15px; width: 15px; margin: 0 auto; text-align: center; left: 5px; top: 5px; }
.mmCheckbox input[type="radio"]:checked + label::before {border-color:var(--cyan);}
.mmCheckbox input[type="radio"] + label::after{-webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); }
.mmCheckbox input[type="radio"]:checked + label::after{-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }
.mmCheckbox .checkbox-circle-mark{top: 5px; right: 30px; position: absolute; display: block;}
.mmCheckbox .checkbox-circle-mark:before{content: ""; width: 26px; height: 26px; border-radius: 100%; position: absolute; background: url(../images/lverify.svg) no-repeat;} 
.mmCheckbox .checkbox-circle-mark:after{top: 4px; left: 4px; width: 25px; content: ""; display: none; height: 25px; position: absolute; } 
.mmCheckbox input[type="radio"]:checked + label .checkbox-circle-mark:before { background: url(../images/dverify.svg) no-repeat;} 
.mmCheckbox input[type="radio"]:checked + label .checkbox-circle-mark:after {display: block; }
.mmCheckbox input[type="radio"]:checked + label .account-option-text{color: #004a8e;}

.location-form-group{margin-bottom: 0px;}
.location-form-group h5{font-size: 14px; font-weight: 600; text-align: left; color:var(--black); margin: 0 0 5px 0; padding: 0; }


.location-form-input{position: relative;}
.location-icon{position: absolute;left: 5px; top: 3px; padding: 10px;}
.location-form-input input{padding: 0.94rem 0.94rem  0.94rem 2rem !important; }

.current-form-group{text-align: left;margin-bottom: 1rem;}
.Use-Current-btn{outline: none;  padding:8px 30px;display: inline-block;color:var(--cyan);font-size: 14px;font-weight: 600;border-radius: 5px;border: 1px solid var(--cyan);background:var(--white)}



.step-subscription-section {padding: 2rem 0; position: relative;} 

#step-background-objects {width: 100vw; height: 100vh; object-fit: cover; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: -1; }
/*.auth-bg-objects:before {content: ''; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background:rgb(111 81 189 / 51%) }*/






.plan-item-card{box-shadow: 0 0 #0000,0 0 #0000, 0px 12px 28px 0px rgba(36,7,70,.06); padding: 1rem; margin-bottom: 10px; background: var(--white);  border-radius: 10px; position: relative;}
.plan-item-card:before {content: ''; position: absolute; background: url(../images/logo-bgicon.svg); width: 150px; height: 164px; right: 0; opacity: 0.05; }
.plan-item-name-price h2 {font-size: 18px; font-weight: 700; margin: 0 0 5px 0; padding: 0; color:var(--black); }
.plan-item-name-price{margin-bottom: 1rem; position: relative;}
.plan-item-price {font-size: 24px; font-weight: 700; margin: 0 0 0px 0; padding: 0; color:var(--cyan); }
.plan-item-price span{font-size: 14px; color:var(--black); }
.plan-item-benefits-list{margin-bottom: 1rem;     min-height: 130px;}
.plan-item-benefits-list ul{ list-style:none; margin:0; padding:0; position:relative; }
.plan-item-benefits-list ul li {font-size: 14px; margin: 0;color:var(--black);line-height: 30px; font-weight:500 }



.plan-item-action{display: flex; gap: 5px;}
.plan-btn{background:var(--cyan); white-space: nowrap; border: 1px solid var(--cyan); padding:5px 10px; display: inline-block; font-size: 14px;  color: var(--white); border-radius: 5px; font-weight: 500; text-align: center; }
.delete-btn{background:var(--red); white-space: nowrap; border: 1px solid var(--red); padding:5px 10px; display: inline-block; font-size: 14px;  color: var(--white); border-radius: 5px; font-weight: 500; text-align: center; }


.mm-modal-benefit-list{display: flex;flex-wrap: wrap; gap:10px}
.plan-head{margin-bottom: 1rem; padding: 1rem 0}
.plan-head  h2 {font-size: 24px; font-weight: 600; color:var(--cyan); margin: 0; padding: 0; text-align:center; }
.plan-head  p {font-size:14px; font-weight: 300; color:var(--black); margin: 0; padding: 0; text-align:center; }



.plan-item-discount-card{border: 1px dashed var(--cyan);border-radius: 10px; margin-bottom: 1rem; position: relative; padding: 5px;box-shadow: 0px 4px 30px rgb(95 94 231 / 7%);background: #FCFFFF;}
.plan-item-discount-card h4{font-size:14px; font-weight: 600; color:var(--black); margin: 0; padding: 0; text-align:center; }
.plan-item-discount-card h4 span{font-size:18px; font-weight: 600; color:var(--cyan); }


.plan-foot p{font-size:14px; font-weight: 300; color:var(--white); margin: 0; padding: 0; text-align:center; }


.dating-upgrade-membership{display: flex; background: url(../images/membership-bg.jpg) fixed; margin-bottom: 1rem; background-size: cover;  align-items: center; justify-content:space-between; box-shadow: 0 0 #0000, 0 0 #0000, 0px 12px 28px 0px rgba(36, 7, 70, .06);position: relative; overflow: hidden;border-radius: 10px;}

.dating-upgrade-membership:before{position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100%; width: 100%; content: ''; background: linear-gradient(270deg,rgba(7, 51, 51, 1) 0%, rgba(7, 51, 51, 0.25) 100%); }
.dating-upgrade-membership-content{position: relative;padding: 2rem;}
.dating-upgrade-membership-content h2 {font-size: 24px; font-weight: 500; margin: 0 0 10px 0; padding: 0; color:var(--white);}
.dating-upgrade-membership-content h2 span{font-size: 28px; color: var(--cyan); font-weight: bold;}
.dating-upgrade-membership-content p {font-size: 14px; font-weight: 500; margin: 0 0 10px 0; padding: 0; color:var(--white);}

.upgrade-membership-point-list{margin: 0; padding: 0; display:flex; list-style:none; gap:40px; }
.upgrade-membership-point-list li{font-size: 14px; font-weight: 500; margin: 0 0 10px 0; padding: 0; color:var(--white); text-align: }

.valid-time{position: relative; padding: 1rem;}
.valid-time p{font-size: 14px; font-weight: 500; margin: 0 0 10px 0; padding: 0; color:var(--white); text-align: }
.timer-text{font-size: 40px; font-weight: 500; margin: 0 0 0px 0; padding: 0; color:var(--white);}


.dating-upgrade-membership-action{position: relative; padding: 1rem; width: 30%}
.dating-upgrade-membership-action a {background: var(--cyan); white-space: nowrap; border: 1px solid var(--cyan); padding: 10px 20px; display: inline-block; font-size: 14px; color: var(--white); border-radius: 5px; font-weight: 500; text-align: center; }

.dating-upgrade-price{display: flex; gap: 20px;}

.old-price{font-size:18px; font-weight: 500; margin: 0 0 10px 0; padding: 0; color:var(--lightcyan); text-decoration:line-through; }

.new-price{font-size:40px; font-weight: 600; margin: 0 0 10px 0; padding: 0; color:var(--white); }
.new-price span{font-size:20px; font-weight: 600;  color:var(--white); }

