@import url("../css/common.css");

/* top navbar section  */
.top-navmail-address li a {
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 400;
  color: var(--white-color);
}
.top-social-icons a {
  color: var(--white-color);
  height: 30px;
  width: 30px;
  display: flex;
  align-items: center;
  border-radius: 100%;
  justify-content: center;
  font-size: 18px;
  transition: all 0.3s;
}
.top-social-icons a:hover {
  background: #ffffff24;
}

/* navbar start  */
.mobile-logo-category .brand-logo{
  width: 80px;
  transition: all 0.4s;
}
.mobile-logo-category .brand-logo:hover{
  transform: scale(0.9);
}
.navbar-ui .nav-item{
  font-size: 14px;
  font-weight: 400;
  color: var(--title-color);
  padding: 2px 4px;
  margin: 0px 4px;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  gap: 2px;
}
.navbar-ui .nav-item i{
  font-size: 24px;
  line-height: 0;
}
.navbar-ui .nav-item.active,
.navbar-ui .nav-item:hover{
  color: var(--secondary-color);
}
.nav-login-btn{
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--title-color);
  border-radius: 40px;
  padding: 4px 4px 4px 22px;
  font-size: 14px;
  font-weight: 500;
  color: var(--title-color);
  transition: all 0.3s;
}
.nav-login-btn:hover{
  background: var(--black-color);
  color: var(--white-color);
}
.nav-login-btn i{
  background: linear-gradient(90deg, #6D0073 0%, #1800A9 100%);
  color: var(--white-color);
  height: 36px;
  width: 36px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transform: rotate(135deg);
  transition: all 0.3s;
}
.nav-login-btn:hover i{
  background: var(--white-color);
  color: var(--black-color);
}
.nav-call-btn{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--title-color);
  transition: all 0.3s;
}
.nav-call-btn i{
  background: var(--white-color);
  color: var(--title-color);
  height: 36px;
  width: 36px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transition: all 0.3s;
}
.main-navheader-gradientbg{
  background: linear-gradient(90.63deg, rgba(218, 118, 12, 0.1) 21.32%, rgba(165, 31, 26, 0.1) 132.04%);
}
.comman-bg-btn {
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color) !important;
  padding: 13px 36px;
  display: flex;
  justify-content: center;
  text-align: center;
  border-radius: 40px;
  border: none;
  font-weight: 400;
  position: relative;
  overflow: hidden;
  width: max-content;
  transition: all 0.4s ease;
}
.comman-bg-btn:focus-visible{
  outline: none;
}
.comman-bg-btn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 100%;
  background: #ffffff14;
  transition: width 0.4s ease;
  border-radius: 4px;
  transform: translate(-50%, -50%);
}
.comman-bg-btn:hover::before {
  width: 100%;
}
.comman-bg-btn.bg-white{
  background: var(--white-color);
  color: var(--secondary-color) !important;
}
.comman-border-btn {
  position: relative;
  padding: 13px 36px;
  font-weight: 400;
  border-radius: 8px;
  display: inline-block;
  color: var(--primary-color);
  text-decoration: none;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s;
}
.comman-border-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: 8px;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-mask: linear-gradient(white 0 0) content-box, linear-gradient(white 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  transition: all 0.3s;
}
.comman-border-btn:hover{
  color: var(--white-color);
  -webkit-text-fill-color: unset;
}
.comman-border-btn:hover::before{
  -webkit-mask: unset;
  z-index: -1;
}
.form-border-btn {
  position: relative;
  padding: 11px 52px;
  font-weight: 400;
  border-radius: 40px;
  border: none;
  display: inline-block;
  color: var(--primary-color);
  text-decoration: none;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s;
}
.form-border-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: 40px;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-mask: linear-gradient(white 0 0) content-box, linear-gradient(white 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  transition: all 0.3s;
}
.form-border-btn:hover{
  color: var(--white-color);
  -webkit-text-fill-color: unset;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}
.form-border-btn:hover::before{
  -webkit-mask: unset;
  z-index: -1;
}
.form-bg-btn {
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
  padding: 11px 52px;
  display: inline-block;
  text-align: center;
  border-radius: 40px;
  border: none;
  position: relative;
  font-weight: 400;
  overflow: hidden;
  transition: all 0.4s ease;
}
.form-bg-btn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 100%;
  background: #ffffff14;
  transition: width 0.4s ease;
  border-radius: 4px;
  transform: translate(-50%, -50%);
}
.form-bg-btn:hover::before {
  width: 100%;
}
.afterlogin-sidelog .user-img{
  height: 40px;
  width: 40px;
  border-radius: 100%;
  min-width: 38px;
  object-fit: cover;
  background: linear-gradient(90deg,rgba(118, 105, 246, 1) 0%, rgba(174, 35, 223, 1) 50%, rgba(243, 159, 32, 1) 100%);
  padding: 2px;
}
.afterlogin-sidelog{
  display: flex;
  align-items: center;
  gap: 2px;
  font-size: 24px;
  color: var(--title-color);
  font-weight: 500;
}
.common-dropdown-menu{
  position: absolute;
  border-radius: 12px;
  left: -38px !important;
  top: 34px !important;
  z-index: 991;
  transition: all 0.4s;
  background: var(--white-color);
  border: 1px solid #00000012;
  min-width: 190px;
  transform: unset !important;
}
.afterlogin-sidelog ~ .common-dropdown-menu{
  top: 52px !important;
  right: 0 !important;
  left: unset !important;
}
.common-dropdown-menu li .dropdown-item{
  font-size: 14px;
  font-weight: 400;
  color: var(--subtitle-color);
  background: var(--white-color);
  margin-bottom: 3px;
  padding: 7px 12px;
  transition: all 0.3s;
}
.common-dropdown-menu li .dropdown-item.active,
.common-dropdown-menu li .dropdown-item:hover{
  background: #ededed;
}
.notification-nav{
  background: transparent;
  border: 1px solid #00000024;
  padding: 4px;
  border-radius: 40px;
  display: flex;
  align-items: center;
  gap: 2px;
  font-size: 22px;
  color: var(--primary-color);
  font-weight: 500;
  height: 44px;
  width: 44px;
  min-width: 44px;
  justify-content: center;
  position: relative;
}
.notification-nav .count-notification{
  position: absolute;
  font-size: 10px;
  top: -8px;
  right: -2px;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  padding: 2px 6px;
  border-radius: 40px;
  font-weight: 400;
}
.notification-design .notification-menu-dropdown {
  position: absolute;
  border-radius: 12px;
  top: 52px;
  right: -54px;
  z-index: 991;
  transition: all 0.4s;
  background: var(--white-color);
  border: 1px solid #00000012;
  min-width: 420px;
  max-height: 480px;
  overflow: auto;
}
.notification-time::before {
  content: "";
  height: 12px;
  width: 12px;
  border-radius: 100%;
  background: var(--white-color);
  border: 3px solid var(--primary-color);
  display: inline-block;
  position: relative;
  top: 1px;
  margin-right: 5px;
}
.notification-listing li {
  border: 1px solid transparent;
  border-bottom: 1px solid var(--lightborder-color);
  cursor: pointer;
}
.notification-listing li.unread,
.notification-listing li:hover {
  background: #e871280d;
  border-bottom: 1px solid #da760c4f;
}
.notification-listing li:last-child {
  border: none;
}
.title-notification-dvs {
  position: sticky;
  top: -8px;
  background: var(--white-color);
  z-index: 1;
}
.nav-mobile-profile{
  width: 200px;
  height: 200px;
  border-radius: 20px;
  object-fit: cover;
  object-position: top;
  background: linear-gradient(90deg,rgba(118, 105, 246, 1) 0%, rgba(174, 35, 223, 1) 50%, rgba(243, 159, 32, 1) 100%);
  padding: 3px;
}

/* header section start  */
.banner-slide-items .khatoon-banner-img{
  width: 100%;
  height: 580px;
  object-fit: cover;
}
.inner-khatoon-header{
  border-radius: 30px;
  overflow: hidden;
}
.banner-slide-items::before{
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #182b4ca6;
}
.btn-get-header{
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--white-color);
  border-radius: 40px;
  padding: 4px 4px 4px 22px;
  font-size: 14px;
  font-weight: 500;
  color: var(--title-color);
  transition: all 0.3s;
  width: max-content;
  margin: auto;
  background: var(--white-color);
}
.btn-get-header:hover{
  background: var(--third-color);
  border-color: var(--third-color);
  color: var(--white-color);
}
.btn-get-header i{
  background: var(--third-color);
  color: var(--white-color);
  height: 36px;
  width: 36px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transform: rotate(135deg);
  transition: all 0.3s;
}
.btn-get-header:hover i{
  background: var(--white-color);
  color: var(--black-color);
}
.header-center-contents{
  position: absolute;
  top: 0;
  width: 100%;
  bottom: 0;
  height: fit-content;
  margin: auto;
  left: 0;
  right: 0;
}
.header-title-border{
  width: fit-content;
  margin: auto;
  color: var(--white-color);
  border: 1px solid var(--white-color);
  border-radius: 30px;
  padding: 4px 14px;
  text-transform: uppercase;
}
.khaaton-banner-slider .slick-dots{
  position: absolute;
  bottom: -1px;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--white-color);
  right: -1px;
  padding: 20px 38px;
  border-radius: 22px 0px 0px;
}
.khaaton-banner-slider .slick-dots li{
  line-height: 0;
}
.khaaton-banner-slider .slick-dots button{
  border: none;
  height: 12px;
  width: 12px;
  font-size: 0;
  background: var(--black-color);
  border-radius: 100%;
}
.khaaton-banner-slider .slick-dots li.slick-active button{
  background: var(--third-color);
}
.common-home-bgdesign{
  background: var(--white-color);
  border-radius: 30px;
}

/* How Does It Work section start  */
.process-title{
  border: 1px solid var(--gray3-color);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--third-color);
  padding: 3px 14px;
  border-radius: 20px;
  width: max-content;
}
.single_howcontents .how-icons-bg{
  height: 92px;
  width: 92px;
  background: transparent;
  color: var(--title-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 46px;
  cursor: pointer;
  border-radius: 100%;
  transition: all 0.4s;
}
.single_howcontents.active .how-icons-bg,
.single_howcontents:hover .how-icons-bg{
  background: linear-gradient(90deg, #6D0073 0%, #1800A9 100%);
  color: var(--white-color);
}
.single_howcontents.active .how-dot-center,
.single_howcontents:hover .how-dot-center{
  background: var(--third-color);
}
.getstarted-btn-how{
  padding: 13px 49px;
  color: var(--white-color) !important;
  font-weight: 500;
  font-size: 14px;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  border-radius: 48px;
  display: inline-block;
  transition: all 0.2s;
}
.inner_content-howd::before{
  content: "";
  height: 1px;
  width: 100%;
  background: var(--gray2-color);
  position: absolute;
  top: 118px;
}
.how-dot-center{
  width: 14px;
  height: 14px;
  background: var(--black-color);
  border: 4px solid var(--body-color);
  border-radius: 100%;
  position: absolute;
  top: 95px;
  left: 0;
}

/* last added profile section start  */
.common-arrow-dots .slick-prev{
  font-size: 0;
  border: none;
  background: transparent;
  position: absolute;
  right: 54px;
  top: -64px;
  z-index: 1;
}
.common-arrow-dots .slick-prev::before{
  content: "\e9b4";
  font-family: 'boxicons', sans-serif;
  font-size: 18px;
  height: 42px;
  width: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
  background: var(--black-color);
  border: 1px solid transparent;
  border-radius: 100%;
}
.common-arrow-dots .slick-next{
  font-size: 0;
  border: none;
  background: transparent;
  position: absolute;
  right: 0;
  top: -64px;
  z-index: 1;
}
.common-arrow-dots .slick-next::before{
  content: "\e9b4";
  font-family: 'boxicons', sans-serif;
  font-size: 18px;
  height: 42px;
  width: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
  background: var(--black-color);
  border: 1px solid transparent;
  border-radius: 100%;
  transform: rotate(180deg);
}
.common-arrow-dots .slick-next:hover::before,
.common-arrow-dots .slick-prev:hover::before{
  background: var(--primary-color);
  border-color: var(--primary-color);
  color: var(--white-color);
}
.common-arrow-dots .slick-track{
  margin: 0;
}

/* about khatoon matrimony */
.feature-common-btn{
  background: #E5F4FB;
  padding: 16px 28px;
  border-radius: 10px;
  font-weight: 500;
  cursor: pointer;
}
.feature-common-btn:nth-child(1){
  background: #FFF8F8;
}
.feature-common-btn:nth-child(2){
  background: #E4FCF9;
}
.feature-common-btn:nth-child(3){
  background: #E5F4FB;
}
.feature-common-btn:nth-child(4){
  background: #FFF9E6;
}
.feature-common-btn:nth-child(5){
  background: #F9EDFF;
}
.feature-common-btn:nth-child(6){
  background: #F0F9E0;
}
.feature-common-btn:nth-child(7){
  background: #FFF0F0;
}

/* language cast cities contries section  */
.language-home-section{
  background: #EAF8F8;
}
.citie-language-img .langeages-img{
  height: 48px;
  width: 48px;
  object-fit: contain;
}

/* Best way to manage section */
.manage-way-leftside h4 span{
  height: 12px;
  width: 2px;
  background: var(--title-color);
  display: inline-block;
  margin: 0px 24px;
}
.apps-playstore img{
  width: 160px;
}
.usersappsgroup .commanprofile {
  height: 46px;
  width: 46px;
  border-radius: 100%;
  object-fit: cover;
  object-position: top;
  border: 3px solid var(--white-color);
  margin-left: -28px;
}

/* community & about us section start  */
.single-community-str{
  background: #FFF8F8;
  padding: 14px 24px;
  border-radius: 30px;
}
.single-community-str.clr-1{
  background: #E4FCF9;
}
.single-community-str.clr-2{
  background: #FFF9E6;
}
.single-community-str.clr-3{
  background: #F0F9E0;
}
.single-community-str.clr-4{
  background: #F9EDFF;
}
.single-community-str.clr-5{
  background: #FFF0F0;
}
.single-community-str .accordion-button{
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  color: var(--black-color);
  font-family: 'Recoleta-Regular', sans-serif;
  font-weight: 500;
}
.single-community-str .accordion-button::after{
  content: "\ebc0";
  font-family: 'boxicons';
  background: transparent;
  padding: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: unset;
  width: unset;
}
.accordion-button:not(.collapsed)::after{
  content: "\eb8b";
}
.matri-comunity-s .lvg{
  height: 10px;
  width: 1px;
  background: var(--gray4-color);
  margin: 0px 10px;
}

/* home-success-stories-section */
.home-success-stories-section .container::before {
  content: "";
  background: url(../images/home-success-bg-img.png) no-repeat 0 74% / cover;
  position: absolute;
  inset: 0;
  z-index: -1;
  padding: 0;
  border-radius: 30px;
}
.home-success-stories-section .slick-slide img {
  height: 207px;
}
.home-success-stories-section .container::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, #6d00735f 0%, #1900a95f 100%);
  border-radius: 30px;
}
.home-success-stories-section .singelcard .success-card-heart {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 100%;
  font-size: 25px;
  right: 12px;
  bottom: -11px;
}
button.slick-prev.slick-arrow,
button.slick-next.slick-arrow{
  visibility: hidden;
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 999;
}
button.slick-prev.slick-arrow{
  left: -36px;
}
button.slick-next.slick-arrow{
  right: -36px;
}
.home-success-stories-section .slick-prev.slick-arrow::before,
.home-success-stories-section .slick-next.slick-arrow::before {
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  background: #fff;
  color: #000;
  visibility: visible;
  font-family: boxicons !important;
  font-weight: 400;
  font-size: 20px;
  }
  .home-success-stories-section .slick-prev.slick-arrow::before{
    content: "\ea4d";
  }
  .home-success-stories-section .slick-next.slick-arrow::before {
    content: "\ea50";
  }

/* Our Planning tools start */
.inner-bgapp-main{
  background: #FFF5EC;
  border-radius: 40px;
}
.right_apps-sides{
  background: var(--white-color);
  border-radius: 40px;
}
.btn-get-started{
  display: inline-block;
  background: var(--black-color);
  border: 1px solid var(--black-color);
  color: var(--white-color);
  padding: 11px 40px;
  border-radius: 31px 0px;
  font-weight: 500;
  transition: all 0.3s;
}
.btn-get-started:hover{
  color: var(--black-color);
  background: transparent;
}

/* footer section start  */
.footerlist li{
  line-height: 20px;
}
.comman_inputfield_main .send-now-btn{
  border-radius: 40px;
  border: none;
  outline: none;
  background: var(--title-color);
  color: var(--white-color);
  padding: 11px 40px;
  display: inline-block;
}
.copy-right-footers{
  border-top: 1px solid var(--lightborder-color);
}
.custom-tooltip {
  --bs-tooltip-bg: var(--secondary-color);
  --bs-tooltip-color: var(--white-color);
}
.social-footers-home a{
  height: 32px;
  width: 32px;
  background: var(--white-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--black-color);
  box-shadow: 0px 4px 4px 0px #ad844a0f;
  transition: all 0.3s;
}
.social-footers-home a:hover{
  background: var(--black-color);
  color: var(--white-color);
}
.footer_linking-mng .footer-logo{
  width: 60px;
}
.footer-contact-suport i{
  height: 36px;
  width: 36px;
  background: var(--black-color);
  color: var(--white-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
.footer-contact-suport:hover i{
  background: var(--third-color);
}

/* form settings  */
.comman_inputfield_main .input_comman_field{
  width: 100%;
  background: var(--white-color);
  border: 1px solid var(--lightborder-color);
  height: 48px;
  border-radius: 8px;
  padding: 12px 20px;
  outline: none;
  color: var(--title-color);
  font-size: 14px;
  font-weight: 400;
}
.comman_inputfield_main .input_comman_field:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px var(--white-color) inset;
}
.edit_inputMain-sltr label,
.comman_inputfield_main label{
  margin-bottom: 4px;
  color: var(--label-color);
  font-size: 14px;
  font-weight: 500;
}
.comman_inputfield_main .icon-input .input_comman_field{
  padding: 12px 20px 12px 39px;
}
.icon-input i{
  position: absolute;
  left: 15px;
  top: 0;
  bottom: 0;
  align-content: center;
  font-size: 18px;
  color: var(--placeholder-color);
}
.comman_inputfield_main .input_comman_field::placeholder{
  color: var(--placeholder-color);
}
.comman_inputfield_main .input_comman_field:focus{
  border: 1px solid var(--primary-color);
}
.comman_inputfield_main .input_comman_field:focus::placeholder{
  color: var(--placeholder-color);
}
.comman_inputfield_main .input_comman_field:focus::-ms-input-placeholder{
  color: var(--placeholder-color);
}
.comman_inputfield_main .input_comman_field:focus::-webkit-input-placeholder{
  color: var(--placeholder-color);
}
.comman_inputfield_main .input_comman_field:focus::-moz-placeholder{
  color: var(--placeholder-color);
}
.comman_inputfield_main .input_comman_field.error {
  background: url(../images/error-icon.svg) no-repeat 100% center;
  background-origin: content-box;
  border: 1px solid var(--error-color) !important;
  background-size: 20px;
}
.comman_inputfield_main .input_comman_field.error::placeholder{
  color: var(--title-color) !important;
}
.comman_inputfield_main .input_comman_field.success {
  content: "";
  background: url(../img/icons/input-success-icon.svg) no-repeat 100% center;
  background-origin: content-box;
  border: 1px solid var(--secondary-color) !important;
}
.comman_inputfield_main .input_comman_field.success::placeholder{
  color: var(--title-color) !important;
}
.comman_inputfield_main .input_comman_field.textareasize{
  height: 108px;
  resize: none;
}
.comman_inputfield_main label.error,
.razorpay-payment-button{
  display: none !important;
}
.edit_inputMain-sltr > .Single_searchDv.error ~ label.error{
  display: none !important;
}

/* select option in error show & suceess css  */
.edit_inputMain-sltr .Single_searchDv.error {
  content: "";
  background: url(../img/icons/error-input-icon.svg) no-repeat center, var(--white-color) !important;
  position: absolute !important;
  z-index: 99;
  height: 32px !important;
  width: 32px !important;
  display: block;
  clip: unset !important;
  right: 25px;
  top: 0;
  bottom: 0;
  margin: auto;
  color: transparent;
  background-repeat: no-repeat;
  border-radius: 6px;
  clip-path: unset !important;
  pointer-events: none;
}
.edit_inputMain-sltr > .Single_searchDv.error ~ label{
  color: var(--gray4-color);
  transform: scale(0.9) translateY(-28px) translateX(-11px);
}
.edit_inputMain-sltr .Single_searchDv.success {
  content: "";
  background: url(../img/icons/input-success-icon.svg) no-repeat center, var(--white-color) !important;
  position: absolute !important;
  z-index: 99;
  height: 32px !important;
  width: 32px !important;
  display: block;
  clip: unset !important;
  right: 25px;
  top: 0;
  bottom: 0;
  margin: auto;
  color: transparent;
  background-repeat: no-repeat;
  border-radius: 6px;
  clip-path: unset !important;
  pointer-events: none;
}
.edit_inputMain-sltr .Single_searchDv.js-example-basic-multiple.success {
  height: 52px !important;
  width: 32px !important;
  border-radius: 0px 6px 6px 0px;
  border: 1px solid var(--secondary-color) !important;
  border-left: unset !important;
  right: 0px;
  padding-right: 50px !important;
}

/* checkbox custom */
.commom-checkboxdiv-l .comman_chack::before {
  content: "";
  height: 22px;
  width: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  border-radius: 4px;
  border: 1px solid var(--gray3-color);
  background: var(--white-color);
  cursor: pointer;
}
.commom-checkboxdiv-l input:checked + .comman_chack::before {
  content: "\ea41";
  font-family: 'boxicons', sans-serif;
  background: var(--third-color);
  border: 1px solid var(--third-color);
  color: var(--white-color);
}

/* radio button custom  */
.id-proof-radioBG{
  background: var(--gray1-color);
  padding: 12px 22px 10px;
  border-radius: 10px;
}
.single_input_radio-L .radio_filterinp::before {
  content: "";
  height: 18px;
  width: 18px;
  min-width: 18px;
  display: block;
  border-radius: 100%;
  border: 3px solid var(--white-color);
  outline: 1px solid var(--placeholder-color);
}
.single_input_radio-L input:checked + .radio_filterinp::before {
  background: var(--primary-color);
  outline: 2px solid var(--primary-color);
  height: 18px;
  width: 18px;
}
.single_input_radio-L input:checked + .radio_filterinp.check::before{
  content: "\ed31";
  font-family: 'boxicons';
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: var(--primary-color);
}
.single_input_radio-L .disabled::before{
  background: var(--placeholder-color) !important;
  border: var(--placeholder-color) !important;
  outline: var(--placeholder-color) !important;
}
.comman_inputfield_main .input_comman_field[type="date"]::-webkit-calendar-picker-indicator {
  background: transparent;
  background-origin: content-box;
  color: transparent;
  cursor: pointer;
  height: auto;
  position: absolute;
  right: 24px;
  bottom: 0;
  top: 0;
  left: 0;
  width: auto;
}
.comman_inputfield_main .input_comman_field[type="time"]::-webkit-calendar-picker-indicator {
  background: transparent;
  background-origin: content-box;
  color: transparent;
  cursor: pointer;
  height: auto;
  position: absolute;
  right: 24px;
  bottom: 0;
  top: 0;
  left: 0;
  width: auto;
}
.single_input_radio-L .radio_filterinp{
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

/* login & register & register steps section start  */
.steps-regis-lefts{
  display: none;
}
.steps-regis-lefts.active {
  display: block;
}
.register-steps-box{
  background: var(--white-color);
  display: flex;
  padding: 7px;
  border-radius: 70px;
  overflow: auto;
  border: 1px solid var(--gray2-color);
  justify-content: space-between;
}
.register-steps-box::-webkit-scrollbar{
  height: 3px;
}
.register-steps-items{
  display: flex;
  align-items: center;
  padding: 12px 20px;
  border-radius: 50px;
  gap: 6px;
  color: var(--title-color);
  cursor: pointer;
  text-wrap-mode: nowrap;
  transition: 0.3s;
}
.register-steps-items.active{
  background: var(--secondary-color);
  color: var(--white-color);
}
.single-side-lists{
  display: flex;
  align-items: center;
  border-bottom: 1px solid #0000003b;
}
.single-side-lists:last-child{
  border-bottom: none;
}
.login-register-cmnbg{
  background: var(--white-color);
  border-radius: 16px;
  overflow: hidden;
}
.or-withline-center::before,
.or-withline-center::after {
  display: block;
  content: '';
  z-index: 1;
  background: #00000012;
  position: absolute;
  width: 100%;
  height: 1px;
}
.or-withline-center span{
  position: relative;
  z-index: 2;
  background: var(--white-color);
  padding: 8px 24px;
  border-radius: 40px;
  font-weight: 400;
}
.or-withline-center span.bg-gradient{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%) !important;
  color: var(--white-color);
}
.comman_inputfield_main .toggle-password::after{
  content: "\eb0e";
  font-family: 'boxicons', sans-serif;
  position: absolute;
  right: 24px;
  top: 0;
  bottom: 0;
  margin: auto;
  background-origin: content-box;
  cursor: pointer;
  align-content: center;
  font-size: 20px;
  color: var(--placeholder-color);
}
.comman_inputfield_main .toggle-password.eye-open::after{
  content: "\ec0c";
  font-family: 'boxicons', sans-serif;
}
.loginwith-otp-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border-radius: 8px;
  border: 1px solid var(--darkborder-color);
  color: var(--title-color);
  font-size: 14px;
  transition: all 0.3s;
  padding: 12px 20px;
  font-weight: 500;
}
.login-regist-rightmng{
  background: url(../img/Bg-shape-loginregist.png) no-repeat 0% 0%, var(--secondary-color);
}
.login-innerbg-cnt{
  height: 410px;
  width: 410px;
  position: relative;
}
.login-innerbg-cnt .inner-roundsone{
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(217, 217, 217, 0.00) 100%);
  border-radius: 100%;
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.inner-roundsone .inner-roundtwo{
  height: 70%;
  width: 70%;
  border-radius: 100%;
  border: 0.966px solid rgba(255, 255, 255, 0.10);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(217, 217, 217, 0.00) 100%);
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.login-innerbg-cnt .login-arrow-shap{
  position: absolute;
  left: 122px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.login-innerbg-cnt .right-mockuplogin{
  position: absolute;
  right: -23px;
  top: 0;
  bottom: 0;
  margin: auto;
  transition: all 0.4s;
}
.login-innerbg-cnt .right-mockuplogin:hover{
  right: -42px;
  transform: scale(1.1);
}
.login-innerbg-cnt .right-mockuplogin:hover ~ .right-Loginlogohere{
  transform: scale(1.1);
  right: -20px;
}
.login-innerbg-cnt .right-Loginlogohere{
  position: absolute;
  right: 0;
  top: 130px;
  height: 60px;
  width: 152px;
  object-fit: contain;
  transition: all 0.4s;
}
.login-innerbg-cnt .usr-login-profile1{
  cursor: pointer;
  height: 54px;
  width: 54px;
  border-radius: 100%;
  border: 4px solid rgba(255, 255, 255, 0.23);
  position: absolute;
  top: -220px;
  left: 92px;
  bottom: 0;
  margin: auto;
  transition: all 0.4s;
  animation: moverlogoapp 5s infinite alternate;
}
.login-innerbg-cnt .usr-login-profile2{
  cursor: pointer;
  height: 54px;
  width: 54px;
  border-radius: 100%;
  border: 4px solid rgba(255, 255, 255, 0.23);
  position: absolute;
  left: 39px;
  top: 0;
  bottom: 0;
  margin: auto;
  transition: all 0.4s;
  animation: moverlogoapp 1.5s infinite alternate;
}
.login-innerbg-cnt .usr-login-profile3{
  cursor: pointer;
  height: 54px;
  width: 54px;
  border-radius: 100%;
  border: 4px solid rgba(255, 255, 255, 0.23);
  top: 0;
  bottom: -215px;
  position: absolute;
  margin: auto;
  left: 92px;
  transition: all 0.4s;
  animation: moverlogoapp 3s infinite alternate;
}
@-webkit-keyframes moverlogoapp {
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
@keyframes moverlogoapp {
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
.gander-textLable{
  width: 150px;
}
.captcha-refresh-btn .refresh-icon-captcha{
  height: 30px;
  width: 30px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--title-color);
  font-size: 24px;
  cursor: pointer;
  position: absolute;
  right: 15px;
  top: 3px;
  bottom: 0;
  margin: auto;
}
.comman_inputfield_main .CaptchaWrap .capcode{
  height: 48px;
  width: 120px;
  border-radius: 8px;
}
.comman_inputfield_main .captcha-error{
  position: absolute;
  bottom: -14px;
  font-size: 14px;
  color: var(--error-color);
}
.btn-loginwith-otp{
  background: #EBEBEB;
  color: var(--black-color);
  padding: 13px 36px;
  display: inline-block;
  text-align: center;
  border-radius: 40px;
  border: none;
  font-weight: 500;
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
}
.btn-loginwith-otp:hover{
  background: var(--gray2-color);
}
.login-registe-bannerbg::before{
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #182b4ca6;
}
.login-registe-bannerbg{
  border-radius: 30px;
  overflow: hidden;
}
.login-registe-bannerbg .login-bgbanner{
  width: 100%;
  height: 390px;
  object-fit: cover;
  object-position: top;
}
.login-position-section{
  margin-top: -300px;
  position: relative;
  z-index: 1;
}
.common-section-bg,
.login-register-main{
  background: url(../images/bg-login-light.png);
  background-repeat: repeat-x;
  background-position: bottom;
  background-size: 40%;
}


/* login otp sections start */
.OTP_login-designs .otp-field input {
  height: 49px;
  width: 49px;
  border-radius: 8px;
  outline: none;
  font-size: 16px;
  text-align: center;
  border: 1px solid var(--lightborder-color);
  color: var(--label-color);
  background: transparent;
  font-weight: 400;
}
.otp-field input::-webkit-inner-spin-button,
.otp-field input::-webkit-outer-spin-button {
  display: none;
}
.forms-next-back-btngroup .back-btn-forms{
  width: 175px;
  height: 46px;
  border-radius: 12px;
  background: var(--white-color);
  border: 1px solid var(--gray3-color);
  color: var(--gray4-color);
  font-size: 14px;
  font-weight: 500;
  transition: all 0.5s;
}
.forms-next-back-btngroup .next-btn-forms{
  width: 175px;
  height: 46px;
  border-radius: 12px;
  background: var(--secondary-color);
  border: none;
  color: var(--white-color);
  font-size: 14px;
  font-weight: 500;
  transition: all 0.5s;
}
.inner-vbnimgtext i{
  font-size: 70px;
  color: var(--label-color);
  opacity: 0.3;
}
.inner_photoupload-mn .upload-bg-border{
  height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gray1-color);
  border: 1px dashed var(--gray3-color);
  border-radius: 12px;
}
.uploaded-img-container-back.image-uploaded .uploaded-id-back,
.uploaded-img-container-front.image-uploaded .uploaded-id{
  width: 99%;
  height: 99%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 12px;
  z-index: 1;
}
.uploaded-img-container-back .edit_id,
.uploaded-img-container-front .edit_id{
  display: none;
  position: absolute;
  bottom: 9px;
  right: 9px;
  z-index: 2;
  height: 40px;
  width: 40px;
  background: var(--secondary-color);
  border-radius: 100%;
  color: var(--white-color);
  font-size: 20px;
  cursor: pointer;
}
.uploaded-img-container-back.image-uploaded .edit_id,
.uploaded-img-container-front.image-uploaded .edit_id{
  display: flex;
  align-items: center;
  justify-content: center;
}
.male-female-account label{
  width: 100%;
  border: 1px solid var(--gray2-color);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 10px 16px;
  border-radius: 53px;
  color: var(--title-color);
  background: var(--gray2-color);
  cursor: pointer;
}
.male-female-account input:checked ~ label{
    background: var(--third-color);
    color: var(--white-color);
    border-color: var(--third-color);
}
.male-female-account input:checked ~ label::after{
  content: "\ea46";
  font-family: 'boxicons', sans-serif;
}

/* register step in 5 photo upload start  */
.main-pgofile-ifgtyyu .profile_pic{
  width: 260px;
  height: 316px;
  object-fit: cover;
  object-position: top;
  border-radius: 12px;
  border: 1px dashed var(--gray2-color);
}
.main-upload_phtrefuoe.big{
  width: 260px;
}
.p-image .edit-labelbig{
  height: 42px;
  width: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  background: var(--black-color);
  position: absolute;
  right: 15px;
  bottom: 12px;
  color: var(--white-color);
  font-size: 20px;
  cursor: pointer;
}
.main-pgofile-small .profile_pic{
  width: 120px;
  height: 145px;
  border-radius: 12px;
  border: 1px dashed var(--gray2-color);
  object-fit: cover;
  object-position: top;
}
.main-upload_phtrefuoe.small{
  width: 120px;
}
.p-image .edit-labelsmall{
  height: 28px;
  width: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  background: var(--black-color);
  position: absolute;
  right: 15px;
  bottom: 12px;
  font-size: 16px;
  color: var(--white-color);
  cursor: pointer;
}

/* breadcrumb section start  */
.common-breadcrumb{
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  padding: 14px 20px 14px 28px;
  border-radius: 12px;
  border: 1px solid #00000012;
}
.common-breadcrumb ol li::after{
  content: "\ea50";
  font-family: 'boxicons', sans-serif;
  font-size: 18px;
  color: var(--label-color);
  margin: 0px 4px;
}
.common-breadcrumb ol li::before{
  display: none;
}
.common-breadcrumb ol li{
  display: flex;
  align-items: center;
  color: var(--label-color);
}
.common-breadcrumb ol li.active{
  color: var(--label-color);
  opacity: 0.8;
}
.common-breadcrumb ol li.active::after{
  display: none;
}

/* about us section start  */
.listabout-items li{
  color: var(--label-color);
  font-weight: 400;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: all 0.3s;
}
.listabout-items li:hover{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.listabout-items li:hover i{
  margin-right: 8px;
}
.listabout-items li i{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 18px;
  transition: all 0.3s;
  margin-right: 4px;
}

/* contact us section start  */
.epl_flexmain .round-contacticon{
  height: 49px;
  width: 49px;
  min-width: 49px;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  color: var(--white-color);
  font-size: 24px;
}
.location_mapsmain .contact-maps iframe{
  width: 100%;
  height: 520px;
  border-radius: 12px;
}
.common-bgwhite-main{
  background: var(--white-color);
  border-radius: 16px;
  border: 1px solid var(--gray2-color);
  position: relative;
}
.common-bglight-main {
  background: #F6F8FD;
  border-radius: 16px;
  position: relative;
  border: 1px solid var(--gray2-color);
}
.common-bgwhite-main12{
  background: var(--white-color);
  border-radius: 12px;
  border: 1px solid #00000012;
  position: relative;
}
.common-bgtransparent-main{
  background: var(--white-color);
  border-radius: 16px;
  border: 1px solid var(--gray2-color);
  position: relative;
}
.file-attach-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 500;
  background: #EEEEEE;
  cursor: pointer;
  color: var(--label-color);
  width: max-content;
  padding: 10px 20px;
  border-radius: 10px;
  border: 1px dashed var(--primary-color);
  margin-left: auto;
}

/* Success story & blogs start  */
.story-imagecoupl .str-imgs{
  width: 100%;
  height: 233px;
  object-fit: cover;
  border-radius: 12px;
  object-position: top;
}
.story-imagecoupl .big_storyprofils{
  width: 100%;
  height: 486px;
  object-fit: cover;
  border-radius: 12px;
  object-position: top;
}
.blogs-multieswagg::after{
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  background: transparent linear-gradient(175deg, #17171700 0%, #000000de 100%) 0% 0% no-repeat padding-box;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 12px;
}
.blogs-multieswagg:hover::after{
  background: linear-gradient(178deg, #da760c29 0%, hsl(2.16deg 72.77% 37.45% / 20%) 100%);
}
.blogs-multieswagg .comman-blogs{
  height: 320px;
  width: 100%;
  border-radius: 12px;
  object-fit: cover;
  object-position: top;
}
.blogs_contentsettextvdf h4{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.stories-bottoms-box{
  background: var(--white-color);
  border: 1px solid var(--gray2-color);
  border-radius: 14px;
  padding: 64px 18px 18px;
  text-align: center;
  margin-top: -50px;
}
.stories-bottoms-box h4{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.blogs_contentsettextvdf h5 span,
.stories-details-box h5 span,
.stories-bottoms-box h5 span{
  height: 12px;
  width: 1px;
  display: inline-block;
  background: var(--gray3-color);
  margin: 0px 8px;
}
.stories-bottoms-box p{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.more-stories{
  background: linear-gradient(90deg, #6D0073 0%, #1800A9 100%);
  color: var(--white-color);
  padding: 9px 24px;
  display: inline-block;
  border-radius: 40px;
  font-weight: 400;
  width: max-content;
}
.stories-details-box{
  background: var(--white-color);
  padding: 176px 30px 30px;
  border-radius: 22px;
  margin-top: -150px;
}
.blog-singles-mng{
  background: var(--white-color);
  padding: 18px;
  border-radius: 16px;
  border: 1px solid var(--gray2-color);
}

/* events section start  */
.khaaton-event-detail-slider .slick-dots{
  position: absolute;
  bottom: 10px;
  width: fit-content;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  right: 0px;
  left: 0;
  margin: 0 auto;
}
.khaaton-event-detail-slider .slick-dots li{
  line-height: 0;
}
.khaaton-event-detail-slider .slick-dots button{
  border: none;
  height: 12px;
  width: 12px;
  font-size: 0;
  background: var(--gray3-color);
  border-radius: 100%;
}
.khaaton-event-detail-slider .slick-dots li.slick-active button{
  background: var(--secondary-color);
}
.event-flex-content .arrow-event{
  height: 48px;
  width: 48px;
  border: 1px solid var(--secondary-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: var(--secondary-color);
  transform: rotate(131deg);
  min-width: 48px;
}
.event-side-img .events-details-img{
  width: 100%;
  height: 420px;
  object-fit: cover;
  border-radius: 12px;
}
.event-right-maps iframe{
  width: 100%;
  height: 380px;
  border-radius: 12px;
}
.placeQty_box {
  width: 274px;
  height: 50px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  border-radius: 12px;
  display: flex;
  justify-content: space-between;
  padding: 6px 7px;
  align-items: center;
}
.placeQty_box .qty_select-opt select {
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  height: 38px;
  width: 98px;
  border-radius: 9px;
  font-size: 14px;
  color: var(--black-color);
  font-weight: 500;
  padding: 8px 8px;
  outline: none;
}
.event-checktitle{
  border-bottom: 1px solid #00000012;
}

/* pagination code  */
.pagination_nav{
  background: var(--white-color);
  border-radius: 60px;
  padding: 4px;
  width: max-content;
  margin: auto;
  border: 1px solid var(--gray2-color);
}
.pagination_nav ul .page_items a.active, .pagination_nav ul .page_items a:hover {
  background: linear-gradient(180deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
}
.pagination_nav ul .page_items a {
  height: 40px;
  min-width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: var(--placeholder-color);
  font-size: 16px;
  font-weight: 400;
  border-radius: 100%;
  transition: all 0.3s;
  padding-top: 1px;
}
.pagination_nav ul .prev-next a{
  height: 40px;
  min-width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white-color);
  color: var(--title-color);
  border-radius: 100%;
  transition: all 0.3s;
  padding-top: 1px;
  border: 1px solid var(--gray2-color);
  font-size: 24px;
}


/* quick search & advance search & id search start  */
.common-tabs-design ul li .nav-link {
  width: 100%;
  color: var(--subtitle-color);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 10px;
  border-radius: 60px;
  gap: 6px;
  font-weight: 400;
}
.common-tabs-design .nav{
  background: var(--white-color);
  border-radius: 60px;
  border: 1px solid var(--gray2-color);
  padding: 3px;
}
.common-tabs-design ul li .nav-link.active{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
}
.common-tabs-design ul .nav-item{
  width: 33.33%;
}
.show_recent-mdata{
  height: 38px;
  width: 38px;
  min-width: 38px;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  color: var(--white-color);
  font-size: 20px;
}
.membr-img-fdfa{
  width: 54px;
  height: 57px;
  border-radius: 9px;
  overflow: hidden;
  position: relative;
}
.membr-img-fdfa .rstmmb{
  width: 54px;
  height: 57px;
  border-radius: 9px;
  object-fit: cover;
  object-position: top;
}
.lockprofiles-1::before{
  content: "\eb49";
  font-family: 'boxicons', sans-serif;
  font-size: 22px;
  position: absolute;
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
}
.slidersng-profile{
  background: linear-gradient(180deg, var(--primary-color)0%, var(--secondary-color) 100%);
  border-radius: 14px;
}
.membr_sidetext-O .elips-blogtext{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.slidersng-profile .prf-dayimg{
  height: 94px;
  width: 94px;
  margin: auto;
  border: 6px solid var(--white-color);
  object-position: top;
  object-fit: cover;
  border-radius: 100%;
}
.irs .irs-to span,
.irs .irs-from span {
  height: 7px;
  width: 7px;
  display: block;
  position: absolute;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  transform: rotate(45deg);
  left: 0;
  right: 0;
  margin: auto;
}
.irs.irs--round.js-irs-0 .irs .irs-from::after,
.irs.irs--round.js-irs-0 .irs .irs-to::after{
  content: "";
  height: 7px;
  width: 7px;
  display: block;
  position: absolute;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  transform: rotate(45deg);
  left: 0;
  right: 0;
  margin: auto;
}
.irs--round .irs-handle.state_hover::after{
  outline: 2px solid #2280EF33;
}
.idsearching-btnsdview{
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: none;
  background: var(--pink-color);
  color: var(--white-color);
  font-weight: 500;
  font-size: 15px;
  width: 208px;
  border-radius: 12px;
}
.idsearching-btnsdview img{
  width: 18px;
}
.gender-field-box{
  border: 1px solid var(--gray2-color);
  padding: 4px;
  border-radius: 60px;
  display: flex;
  align-items: center;
  gap: 2px;
}
.single-gender-fild label{
  width: 100%;
  background: transparent;
  color: var(--black-color);
  text-align: center;
  padding: 10px 16px;
  border-radius: 40px;
  font-family: 'Gordita-Regular', sans-serif;
  cursor: pointer;
}
.single-gender-fild input:checked ~ label{
  background: linear-gradient(90deg, #6D0073 0%, #1800A9 100%);
  color: var(--white-color);
}
.checkbox-input-search label::before{
  content: "";
  height: 20px;
  width: 20px;
  border: 1px solid var(--gray3-color);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2px;
  color: var(--white-color);
  font-size: 18px;
}
.checkbox-input-search input:checked ~ label::before{
  content: "\ea41";
  font-family: 'boxicons', sans-serif;
  background: var(--title-color);
  border-color: var(--title-color);
}
.checkbox-input-search label{
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--label-color);
  font-family: 'Gordita-Medium', sans-serif;
}

/* range slider css  */
.irs--round .irs-bar {
  height: 8px;
  border-radius: 6px;
  background: var(--secondary-color);
}
.irs--round .irs-handle {
  background-color: transparent;
  border-color: transparent;
  box-shadow: unset;
  width: 16px;
  height: 16px;
  top: 29px;
  cursor: pointer;
}
.irs--round .irs-handle.state_hover,
.irs--round .irs-handle:hover {
  background-color: transparent;
}
.irs--round .irs-from,
.irs--round .irs-to,
.irs--round .irs-single {
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
  font-size: 14px;
  font-weight: 400;
  padding: 5px 12px;
  border-radius: 40px;
}
.irs--round .irs-from:before,
.irs--round .irs-to:before,
.irs--round .irs-single:before,
.irs--round .irs-min,
.irs--round .irs-max {
  display: none;
}
.irs--round .irs-handle::after {
  content: "";
  background: var(--secondary-color);
  height: 22px;
  width: 22px;
  display: block;
  position: relative;
  top: -5px;
  left: -13px;
  border-radius: 100%;
}
.irs--round .irs-line {
  top: 36px;
  height: 8px;
  background-color: var(--gray2-color);
  border-radius: 6px;
}
.age_height_fted .btn_ageheights{
  border: 1px solid var(--gray2-color);
  width: 100%;
  border-radius: 12px;
  padding: 11px 15px;
  color: var(--placeholder-color);
  background: var(--white-color);
  height: 44px;
}
.age_height_fted .line-dfg{
  width: 24px;
  height: 2px;
  background: var(--gray3-color);
}

/* search result section start  */
.filter-lftd-mng{
  background: #F6F8FD;
  border: 1px solid #0000001A;
  border-radius: 8px;
  cursor: pointer;
  padding: 11px 19px;
}
.filter-lftd-mng .filter_collapsemobiles ~ i{
  background: #F6F8FD;
  border: 1px solid #0000001A;
  height: 34px;
  width: 34px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 25px;
  transition: all 0.3s;
}
.collapsed .filter_collapsemobiles ~ i{
  transform: rotate(180deg);
}
.common-box-filters{
  background: #F6F8FD;
  border: 1px solid #0000001A;
  border-radius: 8px;
  cursor: pointer;
  padding: 5px 20px;
}
.common-box-filters .accordion-header button{
  box-shadow: none;
  background: transparent;
  padding: 8px 0px;
  font-size: 15px;
  font-weight: 500;
  color: var(--title-color);
}
.ctm-accordion-body{
  border-top: 1px solid #00000030;
  padding-top: 14px;
}
.All-accordi-result .accordion-header .accordion-button::after{
  content: "\ea4a";
  font-family: 'boxicons', sans-serif;
  background: linear-gradient(180deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  height: 24px;
  width: 24px;
  border-radius: 5px;
  transition: unset;
  line-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--white-color);
}
.single_result-profiles{
  background: var(--white-color);
  border: 1px solid #00000012;
  border-radius: 16px;
  position: relative;
}
.user-profile-round{
  position: relative;
  height: 124px;
  width: 124px;
  border-radius: 100%;
  overflow: hidden;
}
.lockprofiles-2::before{
  content: "\eb49";
  font-family: 'boxicons', sans-serif;
  font-size: 46px;
  position: absolute;
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
}
.btn-comman-profile{
  height: 36px;
  width: 36px;
  border-radius: 100%;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  color: var(--secondary-color);
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.view-more-result{
  display: flex;
  align-items: center;
  gap: 5px;
  justify-content: end;
  font-weight: 500;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
  width: max-content;
  margin-left: auto;
}
.common-profile-badge{
  position: absolute;
  right: 16px;
  top: 14px;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px 15px;
  border-radius: 30px;
  font-size: 13px;
  cursor: pointer;
}

/* membership plans section start  */
.qr-codegenrets .qr-codes{
  height: 167px;
  width: 167px;
}
.upi-bhimsdfef .upibheem{
  width: 89px;
}
.bank-details-content p span{
  width: 230px;
  display: inline-block;
}
.premiup-plantpsstf{
  padding: 41px 30px 257px;
}
.premiup-plantpsstf .secure-icons{
  height: 49px;
  width: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  border-radius: 10px;
  background: #ffffff33;
}
.plans-iconbox{
  height: 68px;
  width: 68px;
  min-width: 68px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  font-size: 34px;
  color: var(--title-color);
}
.plan-next-btndgrg .btn-planscomman{
  height: 48px;
  width: 90%;
  border: 1px solid var(--gray3-color);
  border-radius: 12px;
  font-size: 15px;
  font-weight: 500;
  color: var(--black-color);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  transition: 0.3s;
}
.popular_select .plan-next-btndgrg .btn-planscomman{
  background: var(--secondary-color);
  color: var(--bs-white);
  border: 1px solid var(--secondary-color);
}
.plan-next-btndgrg .btn-planscomman:hover{
  border: 1px solid var(--gray4-color);
}
.plans_sliders-id .slick-prev.slick-arrow{
  font-size: 0px;
  background: transparent;
  border: none;
  position: absolute;
  z-index: 9;
  bottom: 0;
  top: 0;
  left: -36px;
  margin: auto;
  height: 43px;
  width: 43px;
}
.plans_sliders-id .slick-next.slick-arrow{
  font-size: 0px;
  background: transparent;
  border: none;
  position: absolute;
  z-index: 9;
  bottom: 0;
  top: 0;
  right: -36px;
  margin: auto;
  height: 43px;
  width: 43px;
}
.plans_sliders-id .slick-prev.slick-arrow::after{
  content: "";
  background: url(../img/icons/arrow-left-plans.svg) no-repeat, var(--gray1-color);
  height: 43px;
  width: 43px;
  display: block;
  border-radius: 100%;
  background-position: center;
  border: 1px solid var(--white-color);
}
.plans_sliders-id .slick-next.slick-arrow::after{
  content: "";
  background: url(../img/icons/arrow-right-plans.png) no-repeat, var(--gray1-color);
  height: 43px;
  width: 43px;
  display: block;
  border-radius: 100%;
  background-position: center;
  border: 1px solid var(--white-color);
}
.plans_bgmain{
  margin-top: -212px;
}
.single_meber-plans{
  border: 1px solid var(--gray2-color);
  background: var(--white-color);
  border-radius: 26px;
  position: relative;
}
.single_meber-plans.popular_select{
  background: linear-gradient(180deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}
.single_meber-plans.popular_select h4,
.single_meber-plans.popular_select p,
.single_meber-plans.popular_select li,
.single_meber-plans.popular_select span
{
  color: var(--white-color);
}
.popular_select .plans-iconbox{
  color: var(--white-color);
}
.listmatchis-items li::before{
  content: "\ea41";
  font-family: 'boxicons', sans-serif;
  font-size: 16px;
  height: 26px;
  width: 26px;
  min-width: 26px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--subtitle-color);
}
.popular_select .listmatchis-items li::before{
  background: transparent;
  color: var(--white-color);
}
.popular_select .popular-plans-div{
  background: var(--bs-white);
  color: var(--title-color);
  padding: 7px 15px 5px;
  position: absolute;
  right: 14px;
  width: max-content;
  border-radius: 40px;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 500;
  top: 10px;
}
.border-right-plans{
  border-right: 1px solid #DDE2E5;
}
.center_offers-dfg{
  border: 1px solid #DDE2E5;
}
.coupncodeboxinr .offerdiv{
  border-bottom: 1px solid #DDE2E5;
}
.coupncodeboxinr .view-labels{
  border-bottom: 1px dashed var(--black-color);
  padding-bottom: 2px;
}
.center_offers-dfg::after{
  content: "";
  height: 29px;
  width: 3px;
  background: var(--secondary-color);
  display: block;
  position: absolute;
  left: 0;
  top: 18px;
}
.more-coupen-btndiv .dot-line{
  height: 26px;
  width: 1px;
  border: 1px dashed var(--white-color);
  margin-left: 5px;
  margin-right: 8px;
}
.more-coupen-btndiv::before {
  content: "";
  height: 16px;
  width: 16px;
  display: block;
  border-radius: 100%;
  top: -10px;
  position: absolute;
  left: 46px;
  background: var(--white-color);
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}
.plan-list-style {
  list-style: inside;
}
.more-coupen-btndiv::after {
  content: "";
  height: 16px;
  width: 16px;
  border: 1px solid var(--primary-color);
  display: block;
  border-radius: 100%;
  bottom: -10px;
  position: absolute;
  left: 46px;
  background: var(--white-color);
  border-top: none;
  border-left: none;
  transform: rotate(222deg);
}
.btn-apply-coupon{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
  border: none;
  padding: 6px 24px;
  border-radius: 30px;
}
.btn_packegeadded_btn {
  background: var(--payment-color);
  border: none;
  padding: 9px 30px;
  border-radius: 9px;
  font-weight: 500;
  color: var(--white-color);
  display: block;
}
.btn_packegeadd_btn {
  background: var(--saleText-color);
  border: none;
  padding: 9px 30px;
  border-radius: 9px;
  font-weight: 500;
  color: var(--white-color);
  display: block;
}
.plan-btn-border {
  position: relative;
  padding: 10px 36px;
  font-weight: 400;
  border-radius: 40px;
  border: none;
  display: inline-block;
  color: var(--primary-color);
  text-decoration: none;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s;
}
.plan-btn-border::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: 40px;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-mask: linear-gradient(white 0 0) content-box, linear-gradient(white 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  transition: all 0.3s;
}
.plan-btn-border:hover{
  color: var(--white-color);
  -webkit-text-fill-color: unset;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}
.plan-btn-border:hover::before{
  -webkit-mask: unset;
  z-index: -1;
}
.plan-btn-bg{
  background: var(--white-color);
  padding: 10px 36px;
  display: inline-block;
  border-radius: 40px;
  color: var(--primary-color);
  font-weight: 400;
}

/* my profile section start  */
.single-view-photos .profile-photo {
  width: 88px;
  height: 96px;
  border-radius: 10px;
  object-fit: cover;
}
.single-view-photos .add-profile-photos {
  width: 88px;
  height: 96px;
  border-radius: 10px;
  background: #F4F8FF;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-color);
  font-size: 28px;
  cursor: pointer;
}
.btn-profile-edits {
  background: transparent;
  border: none;
  font-size: 22px;
  line-height: 0;
  padding: 2px;
  color: var(--primary-color);
  cursor: pointer;
}
.view-label-profile {
  background: #EFF5FF;
  padding: 7px 15px;
  border-radius: 30px;
  color: var(--title-color);
  font-family: 'Gordita-Regular', sans-serif;
}
.btn-profile-change {
  background: var(--accept-bgcolor);
  color: var(--accept-textcolor);
  border: none;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px 9px;
  border-radius: 25px;
}
.edit_inputMain-sltr label,
.comman_inputfield_main label {
  margin-bottom: 4px;
  color: var(--label-color);
  font-size: 14px;
  font-family: 'Gordita-Regular', sans-serif;
}
.comman_inputfield_main .input_comman_field {
  width: 100%;
  background: var(--white-color);
  border: 1px solid var(--lightborder-color);
  height: 48px;
  border-radius: 8px;
  padding: 12px 20px;
  outline: none;
  color: var(--title-color);
  font-size: 14px;
  font-family: 'Gordita-Regular', sans-serif;
}
.change-btn-groups .btn-cancel-forms {
  background: var(--white-color);
  border: none;
  color: var(--title-color);
  padding: 8px 28px;
  border-radius: 8px;
  font-weight: 500;
}
.change-btn-groups .btn-save-forms {
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  border: none;
  color: var(--white-color);
  padding: 8px 28px;
  border-radius: 8px;
  font-weight: 500;
}







.common-left-profilebox {
  width: 24%;
}
.common-center-profilebox {
  width: 76%;
}
.user-online-status {
  height: 7px;
  width: 7px;
  border-radius: 100%;
  background: var(--payment-color);
  margin-left: 3px;
  margin-top: -14px;
  animation: StatusBlink 1.5s infinite ease-in-out alternate;
  -webkit-animation: StatusBlink 1.5s infinite ease-in-out alternate;
}
@keyframes StatusBlink {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}
@-webkit-keyframes StatusBlink {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}
.action-count-profile{
  background: var(--secondary-color);
  font-size: 13px;
  font-weight: 500;
  color: var(--title-color);
  padding: 2px 11px;
  display: inline-block;
  border-radius: 32px;
  margin-top: 2px;
}
.action-count-profile.chat{
  background: #F3F5FF;
}
.action-count-profile.shortlist{
  background: #FFF9E6;
}
.action-count-profile.matches{
  background: #FFF8F8;
}
.top-profile-short {
  border-bottom: 1px solid var(--gray2-color);
}
.view-profile-count{
  background: #00000080;
  display: flex;
  align-items: center;
  font-size: 18px;
  color: var(--white-color);
  border-radius: 100%;
  position: absolute;
  bottom: 12px;
  right: 10px;
  cursor: pointer;
  height: 38px;
  width: 38px;
  justify-content: center;
}
.profile-placeholder-user{
  width: 100%;
  height: 260px;
  border-radius: 16px;
  overflow: hidden;
  position: relative;
}
.profile-rb-image{
  width: 100%;
  height: 260px;
  object-fit: cover;
  border-radius: 16px;
  object-position: top;
  cursor: pointer;
}
.more-profiles-view{
  width: 100%;
  border-radius: 6px;
  height: 420px;
  object-fit: cover;
}
.more-small-users{
  width: 100%;
  height: 62px;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
}
.more-small-users .small-user-profile{
  width: 100%;
  height: 62px;
  object-fit: cover;
  border-radius: 8px;
  object-position: top;
  cursor: pointer;
}
.custom-more-profile .carousel-control-prev-icon,
.custom-more-profile .carousel-control-next-icon{
  background: #000;
  opacity: 1;
  height: 42px;
  width: 42px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}
.verified-profile-icon .verified-phone{
  font-size: 24px;
  line-height: 1;
  color: var(--title-color);
}
.verified-profile-icon .verified-check{
  position: absolute;
  left: 0;
  bottom: 0;
  height: 15px;
  width: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  background: var(--payment-color);
  color: var(--white-color);
  font-size: 11px;
  border: 1px solid var(--white-color);
}
.verified-profile-icon .verified-cross{
  position: absolute;
  left: 0;
  bottom: 0;
  height: 15px;
  width: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  background: var(--error-color);
  color: var(--white-color);
  font-size: 11px;
  border: 1px solid var(--white-color);
}
.profile-topbar-boxlist li{
  width: 50%;
}
.profile-topbar-boxlist li.prifie-look-li{
  width: 33.33%;
}
.ui-menulist-design{
  background: var(--white-color);
  border: 1px solid var(--gray2-color);
  border-radius: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 3px;
  overflow: auto;
}
.ui-menulist-design::-webkit-scrollbar{
  height: 5px;
}
.ui-menulist-design li a{
  color: var(--subtitle-color);
  font-weight: 500;
  padding: 10px 26px;
  text-wrap-mode: nowrap;
  margin: 0px 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 46px;
  opacity: 0.7;
  transition: all 0.3s;
}
.ui-menulist-design li a:hover,
.ui-menulist-design li a.active{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  opacity: 1;
}
.single-profile-box .btn-shortlist {
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  font-size: 24px;
  color: var(--primary-color);
}
.btn-view-contact-profile{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  border: 1px solid #00000012;
  padding: 3px 28px 3px 3px;
  font-size: 15px;
  font-weight: 500;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 40px;
  transition: all 0.3s;
}
.btn-view-contact-profile i{
  /* background: linear-gradient(270deg, var(--primary-color)0%, var(--secondary-color) 100%); */
  /* border: 1px solid #00000012; */
  height: 42px;
  width: 42px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  /* color:linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);  */
}
.main-pgofiledashed .profile_pic{
  height: 138px;
  width: 138px;
  border: 4px solid var(--white-color);
  border-radius: 100%;
  object-fit: cover;
  object-position: top;
}
.my-dashprowidthset{
  width: 142px;
  margin: auto;
}
.p-image .myprofileedit{
  height: 33px;
  width: 33px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  background: var(--pink-color);
  position: absolute;
  right: 14px;
  bottom: 4px;
  border: 2px solid var(--white-color);
}
.multi-profilsbtns{
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 400;
  color: var(--white-color);
  background: var(--pink-color);
  border: 1px solid var(--white-color);
  width: max-content;
  padding: 5px 12px;
  border-radius: 36px;
  position: absolute;
  top: 60px;
  left: -30px;
}
.right-listmainshort.bg-lightblue{
  background: #ffffff26;
  border-radius: 12px;
}
.right-listmainshort .center-line-profile{
  height: 50px;
  width: 1px;
  background: #ffffff36;
}
.listingsidebarafter li a{
  background: var(--gray1-color);
  border-radius: 10px;
  padding: 12px 10px 12px 21px;
  color: var(--gray4-color);
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all 0.3s;
}
.listingsidebarafter li span{
  height: 34px;
  width: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white-color);
  border-radius: 9px;
  color: var(--gray3-color);
}
.listingsidebarafter li a:hover,
.listingsidebarafter li a.active{
  background: var(--pink-color);
  color: var(--white-color);
}
.listingsidebarafter li:hover span,
.listingsidebarafter li.active span{
  color: var(--white-color);
  background: #ffffff36;
}
.upgrate-download-btn{
  height: 50px;
  width: 50px;
  min-width: 50px;
  border: 1px solid #00000012;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white-color);
  color: var(--secondary-color);
  font-size: 26px;
}
.progress-bar-boxs .progress {
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  justify-content: flex-start;
  border-radius: 41px;
  height: 12px;
  width: 100%;
  margin: 0;
  border: 1px solid #00000012;
  padding: 2px 3px;
}
.progress-bar {
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  border-radius: 14px;
}
.verifyed-numbertext{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background: var(--white-color);
  box-shadow: 0px 1.933px 3.866px 0px rgba(33, 36, 41, 0.05);
  border: none;
  outline: none;
  border-radius: 12px;
  height: 66px;
  gap: 8px;
}
.notification-divdash{
  width: 66px;
  height: 66px;
  min-width: 66px;
  cursor: pointer;
}
.notification-divdash .count-notificatin{
  position: absolute;
  right: -10px;
  top: -10px;
  height: 29px;
  width: 29px;
  background: var(--pink-color);
  border-radius: 100%;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 400;
  border: 2px solid var(--gray1-color);
}
.topcolleps-edtbar .btn-editfields{
  height: 36px;
  width: 36px;
  min-width: 36px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  outline: none;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #00000012;
  color: var(--secondary-color);
  font-size: 20px;
}
.single_matchesdiv{
  position: relative;
  width: 100%;
  height: 242px;
  border-radius: 10px;
  overflow: hidden;
}
.single_matchesdiv .match-profiles{
  width: 100%;
  height: 242px;
  object-fit: cover;
  object-position: top;
}
.single_matchesdiv .matches-content-sd{
  background: linear-gradient(177deg, rgb(255 255 255 / 0%) 0%, rgb(0 0 0 / 32%) 46%, rgb(0 0 0 / 72%) 100%);
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  padding: 30px 10px 15px;
  border-radius: 10px;
  z-index: 2;
}
.lockprofiles-3::before{
  content: "\eb49";
  font-family: 'boxicons', sans-serif;
  font-size: 46px;
  position: absolute;
  z-index: 1;
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
}
.topcolleps-edtbar .collapseicon::after{
  content: "";
  background: url(../img/icons/search-sidetoparrow.svg), var(--secondary-color);
  background-repeat: no-repeat;
  height: 36px;
  width: 36px;
  background-position: center;
  background-size: 17px;
  border-radius: 5px;
  display: block;
  transition: unset;
}
.topcolleps-edtbar .collapseicon.collapsed::after {
  content: "";
  background: url(../img/icons/search-sidetoparrow.svg), var(--secondary-color);
  background-repeat: no-repeat;
  height: 36px;
  width: 36px;
  background-position: center;
  background-size: 17px;
  border-radius: 5px;
  display: block;
  transform: rotate(180deg);
}
.premium-box-matches {
  border-radius: 16px;
  overflow: hidden;
  background: url(../images/premium-matches.png) no-repeat 0% 0%, linear-gradient(93.75deg, #F7CE46 3.76%, #FBE27E 90.19%);
}
.premium-box-matches .connect-btn {
  display: block;
  text-align: center;
  background: var(--white-color);
  border-radius: 10px;
  padding: 12px 14px;
  color: var(--title-color);
  font-weight: 600;
  transition: all 0.3s;
}
.pro-common-leftbar {
  background: var(--white-color);
  border-radius: 16px;
  overflow: hidden;
}
.left-premiup-imgdiv .premium-sm-profile {
  width: 56px;
  min-width: 56px;
  height: 58px;
  object-fit: cover;
  border-radius: 12px;
}
.left-premiup-imgdiv .badge-sm-premium {
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
  width: 88%;
  margin: auto;
  text-align: center;
  border-radius: 30px;
  padding: 2px;
  font-size: 12px;
  font-weight: 400;
  margin-top: -12px;
  position: relative;
}
.right-premium-contents h4, .right-premium-contents p {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.left-premium-profile-list {
  max-height: 365px;
  overflow: auto;
}
.matches-left-main-profiles {
  width: 25%;
}
.matches-users-profiles{
  overflow: hidden;
  border-radius: 12px;
  position: relative;
}
.matches-users-profiles .matches-profiles {
  width: 100%;
  height: 272px;
  border-radius: 12px;
  object-fit: cover;
  object-position: top;
}
.matches-photo-protact::before {
  content: "\eb4a";
  font-family: 'boxicons', sans-serif;
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 60px;
  width: 60px;
  border-radius: 100%;
  background: var(--white-color);
  font-size: 34px;
  color: var(--primary-color);
  z-index: 2;
  margin: auto;
  align-items: center;
  justify-content: center;
}
.matches-photo-protact img {
  filter: blur(8px);
}
.matches-calling-chats {
  margin-top: -20px;
  position: relative;
  z-index: 2;
}
.matches-calling-chats .btn-matches-call {
  height: 44px;
  width: 44px;
  border-radius: 100%;
  border: 1px solid var(--white-color);
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  font-size: 18px;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-right-main-contents {
  width: 75%;
}
.btn-full-profile {
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 11px 22px;
  border: none;
  border-radius: 40px;
  justify-content: center;
  transition: all 0.3s;
}
.matches-details-lists {
  border-radius: 16px;
  background: #1C01A70D;
  padding: 12px 8px;
  border: 1px solid #DDDFE5;
}
.matches-details-lists li {
  width: 48%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  padding: 11px 14px;
  border-radius: 10px;
  margin: 0px 3px;
}
.common-matches-btn {
  color: var(--primary-color);
  background: #FF5A8A1A;
  height: 68px;
  width: 70px;
  border: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: center;
  justify-content: center;
  padding: 4px;
  border-radius: 8px;
  font-weight: 500;
  transition: all 0.3s;
}
.common-matches-btn.shortlist {
  background: #F2994A1C;
  color: #EFA51B;
}
.common-matches-btn.interest {
  background: #FF5A8A1A;
  color: var(--primary-color);
}
.common-matches-btn.chat {
  background: #0084FF14;
  color: #0084FF;
}
.common-matches-btn.block {
  background: #F6F8FD;
  color: #ADADAD;
}
.single-matches-box-main {
  border: 1px solid var(--gray2-color);
  border-radius: 16px;
  padding: 14px;
}
.matches-details-lists li.odd-matches {
  background: transparent;
  box-shadow: none;
}

/* photo request and express interest sent section start  */
.btnsgroup-trashchack .trash-btn-reque{
  height: 66px;
  width: 66px;
  border: none;
  min-width: 66px;
}
.select-allrequest{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #00000012;
  width: max-content;
  padding: 8px 26px 8px 14px;
  border-radius: 12px;
}
.comman-reguestimg{
  min-width: 88px;
  width: 88px;
  height: 98px;
  overflow: hidden;
  border-radius: 10px;
  position: relative;
}
.comman-reguestimg .request-profile{
  min-width: 88px;
  width: 88px;
  height: 98px;
  border-radius: 10px;
  object-fit: cover;
  object-position: top;
  transition: all 0.3s;
}
.comman-reguestimg .request-profile:hover{
  transform: scale(1.1);
}
.lockprofiles-4::before{
  content: "\eb49";
  font-family: 'boxicons', sans-serif;
  font-size: 34px;
  position: absolute;
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
}
.common-request-btn{
  padding: 5px 20px;
  display: inline-block;
  border-radius: 22px;
  border: none;
  font-size: 14px;
  font-weight: 500;
}
.common-request-btn.pending{
  background: var(--pending-bgcolor);
  color: var(--pending-textcolor);
}
.common-request-btn.accepted{
  background: var(--accept-bgcolor);
  color: var(--accept-textcolor);
}
.common-request-btn.rejected{
  background: var(--error-color);
  color: var(--white-color);
}
.right-btngroupreg .delete-bnt-request{
  height: 46px;
  width: 46px;
  min-width: 46px;
  border-radius: 8px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  border: 1px solid #00000012;
  color: var(--secondary-color);
  font-size: 22px;
}
.shortlist-bnt-request{
  height: 46px;
  width: 46px;
  min-width: 46px;
  border-radius: 8px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  border: 1px solid #00000012;
  color: var(--secondary-color);
  font-size: 22px;
}
.delete-all-request{
  height: 52px;
  width: 52px;
  min-width: 52px;
  border-radius: 8px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  border: 1px solid #00000012;
  color: var(--secondary-color);
  font-size: 22px;
}
.delete-bnt-request:hover{
  background: var(--saleText-color);
  color: var(--white-color);
}
.shortlist-bnt-request:hover{
  background: var(--saleText-color);
  color: var(--white-color);
}
.center-request-contents .shortlist-bnt-request {
  padding: 5px 20px;
  border: none;
  border-radius: 30px;
  display: inline-block;
  color: var(--white-color);
  background: var(--secondary-color);
  transition: all 0.2s;
  font-size: 14px;
  font-weight: 500;
  width: auto;
  height: auto;
}
.request-boxedmain .single-request{
  border-bottom: 1px solid #00000012;
}
.request-boxedmain {
  overflow: auto;
  max-height: 840px;
}
.request-boxedmain .single-request:last-child{
  border-bottom: none;
}
.center-request-contents .delete-bnt-request{
  padding: 5px 20px;
  border: none;
  border-radius: 30px;
  display: inline-block;
  color: var(--white-color);
  background: var(--secondary-color);
  transition: all 0.2s;
  font-size: 14px;
  font-weight: 500;
}
.right-btngroupreg .accept-primary-btn{
  font-size: 14px;
  background: var(--secondary-color);
  border: 1px solid var(--secondary-color);
  padding: 11px 40px;
  border-radius: 8px;
  color: var(--white-color);
  font-weight: 500;
}
.right-btngroupreg .reject_alternatebtn{
  font-size: 14px;
  background: var(--white-color);
  border: 1px solid var(--gray3-color);
  padding: 11px 40px;
  border-radius: 8px;
  color: var(--gray4-color);
  font-weight: 500;
}
.center-request-contents .reject_alternatebtn{
  font-size: 13px;
  background: var(--white-color);
  border: 1px solid var(--gray3-color);
  padding: 5px 20px;
  border-radius: 40px;
  color: var(--gray4-color);
  font-weight: 500;
}
.center-request-contents .accept-primary-btn{
  font-size: 13px;
  background: var(--secondary-color);
  border: 1px solid var(--secondary-color);
  padding: 5px 20px;
  border-radius: 40px;
  color: var(--white-color);
  font-weight: 500;
}
.bg-nowhites .edit_inputMain-sltr .select2-container .select2-selection--single{
  border: none !important;
  box-shadow: 0px 1.933px 3.866px 0px rgba(33, 36, 41, 0.05);
  padding: 8px 24px;
  height: 66px;
}
.request-intrest-box {
  border: 1px solid var(--gray2-color);
  border-radius: 16px;
  position: relative;
}
.btn-request-intrest-delete {
  height: 28px;
  width: 28px;
  border-radius: 6px;
  background: var(--white-color);
  font-size: 18px;
  position: absolute;
  right: 12px;
  top: 8px;
  z-index: 2;
  border: 1px solid var(--gray2-color);
  color: var(--primary-color);
  display: flex;
  align-items: center;
  justify-content: center;
}
.inner-request-profile {
  height: 80px;
  width: 80px;
  border-radius: 100%;
  overflow: hidden;
  margin: auto;
  border: 1px solid var(--gray2-color);
}
.inner-request-profile .profile-request-img {
  height: 80px;
  width: 80px;
  object-fit: cover;
  object-position: top;
  border-radius: 100%;
  border: 5px solid var(--white-color);
}
.status-profils {
  background: #fbe0785c;
  color: var(--title-color);
  font-weight: 500;
  width: max-content;
  margin: auto;
  padding: 5px 18px;
  border-radius: 17px;
}
.status-profils.accepted {
  background: var(--accept-bgcolor);
  color: var(--accept-textcolor);
}
.status-profils.pending {
  background: var(--pending-bgcolor);
  color: var(--pending-textcolor);
}
.status-profils.rejected {
  background: var(--sale-bg-color);
  color: var(--saleText-color);
}
.border-hr-line{
  border-color: var(--gray2-color);
  opacity: 1;
}
.request-intrest-bottom p {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  height: 44px;
}
.common-photo-protact::before {
  content: "\eb4a";
  font-family: 'boxicons', sans-serif;
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 34px;
  width: 34px;
  border-radius: 100%;
  background: var(--white-color);
  font-size: 18px;
  color: var(--primary-color);
  z-index: 2;
  margin: auto;
  align-items: center;
  justify-content: center;
}
.common-photo-protact img {
  filter: blur(2px);
}
.btn-request-groups .btn-accept-btn{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
  padding: 8px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  text-align: center;
  border-radius: 40px;
  border: none;
  position: relative;
  font-weight: 400;
  overflow: hidden;
  transition: all 0.4s ease;
  width: 50%;
}
.btn-request-groups .btn-accept-btn::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 100%;
  background: #ffffff14;
  transition: width 0.4s ease;
  border-radius: 4px;
  transform: translate(-50%, -50%);
}
.btn-request-groups .btn-accept-btn:hover::before {
  width: 100%;
}
.btn-request-groups .btn-reject-btn{
  position: relative;
  padding: 8px 24px;
  font-weight: 400;
  border-radius: 40px;
  border: none;
  display: inline-block;
  color: var(--primary-color);
  text-decoration: none;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s;
  width: 50%;
}
.btn-request-groups .btn-reject-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: 40px;
  background: linear-gradient(65deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  -webkit-mask: linear-gradient(white 0 0) content-box, linear-gradient(white 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  transition: all 0.3s;
}
.btn-request-groups .btn-reject-btn:hover{
  color: var(--white-color);
  -webkit-text-fill-color: unset;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}
.btn-request-groups .btn-reject-btn:hover::before{
  -webkit-mask: unset;
  z-index: -1;
}
/* end  */

/* chat section start  */
.user-chatprofiles{
  border-radius: 100%;
  overflow: hidden;
  height: 54px;
  width: 54px;
  min-width: 54px;
  position: relative;
}
.user-chatprofiles .chatuser{
  height: 54px;
  width: 54px;
  border-radius: 100%;
  object-fit: cover;
  object-position: top;
}
.single-chats-divmain .chat-flexsingles{
  cursor: pointer;
  padding: 12px;
  border-radius: 12px;
  background: var(--white-color);
  transition: all 0.4s;
}
.single-chats-divmain.active .chat-flexsingles,
.single-chats-divmain:hover .chat-flexsingles{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
}
.single-chats-divmain.active .chat-flexsingles h4,
.single-chats-divmain:hover .chat-flexsingles h4,
.single-chats-divmain.active .chat-flexsingles p,
.single-chats-divmain:hover .chat-flexsingles p,
.single-chats-divmain.active .chat-right-time>div,
.single-chats-divmain:hover .chat-right-time>div{
  color: var(--white-color);
}
.chats-listings-box{
  overflow: auto;
  max-height: 1020px;
}
.chat-previewcontents h4,
.chat-previewcontents p{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.chat-previewcontents .receiver{
  transform: rotate(-45deg);
  font-size: 18px;
  color: var(--accept-textcolor);
}
.chat-previewcontents .sender{
  transform: rotate(145deg);
  font-size: 18px;
  color: var(--accept-textcolor);
}
.back-chatbtn{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-weight: 400;
  color: var(--white-color);
  transition: all 0.3s;
  border: none;
  height: 42px;
  width: 42px;
  border-radius: 100%;
  font-size: 22px;
}
.user-dp-profiles{
  height: 46px;
  width: 46px;
  border-radius: 100%;
  overflow: hidden;
  position: relative;
}
.user-dp-profiles .prifile-dp{
  height: 46px;
  width: 46px;
  border-radius: 100%;
  object-fit: cover;
  object-position: top;
}
.name-statususer .username{
  font-weight: 600;
  color: var(--title-color);
  line-height: 16px;
  padding-top: 5px;
}
.name-statususer .status-usersview::before{
  content: "";
  height: 10px;
  width: 10px;
  display: inline-block;
  border-radius: 100%;
  background-color: var(--accept-textcolor);
  min-width: 10px;
  margin-right: 4px;
  position: relative;
  top: 1px;
}
.name-statususer .status-usersview.online::before{
  background: var(--accept-textcolor);
}
.name-statususer .status-usersview.away::before{
  background: var(--pending-textcolor);
}
.name-statususer .status-usersview.invisuble::before{
  background: var(--gray3-color);
}
.name-statususer .status-usersview.nodistrub::before{
  background: var(--saleText-color);
}
.call-voice-video{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-weight: 400;
  color: var(--white-color);
  transition: all 0.3s;
  border: none;
  height: 42px;
  width: 42px;
  border-radius: 100%;
  font-size: 22px;
}
.inner_chatspanelmng .chat_headers-lites{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0px 20px 0px;
  border-bottom: 1px solid var(--gray2-color);
  position: relative;
  gap: 6px;
}
.inner_chatspanelmng .chats_middlesScreen-main{
  padding: 10px 24px;
  height: 420px;
  overflow: auto;
}
.receive-messages .receive-single-msg{
  background: var(--msg-receive-color);
  border-radius: 10px;
  width: fit-content;
  max-width: 258px;
  margin-bottom: 4px;
  padding: 8px 16px;
  color: var(--black-color);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  word-wrap: break-word;
}
.receive-user-dp,
.send-user-dp {
  height: 40px;
  width: 40px;
  min-width: 40px;
  overflow: hidden;
  border-radius: 100%;
  position: relative;
}
.receive-user-dp .reciveuser-profile,
.send-user-dp .senduser-profile{
  height: 40px;
  width: 40px;
  border-radius: 100%;
  object-fit: cover;
  object-position: top;
}
.send-messages .send-single-msg{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  border-radius: 10px;
  max-width: 258px;
  margin-bottom: 4px;
  padding: 8px 12px;
  margin-inline-start: auto;
  color: var(--white-color);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  position: relative;
  word-wrap: break-word;
  width: fit-content;
}
.inner_chatspanelmng .chats_bottomsmaindivs{
  padding: 24px 0px 0px;
}
.send-msgboxed-mn .typing-msgdiv{
  width: 100%;
  padding: 13px 45px 13px 20px;
  height: 52px;
  border-radius: 85px;
  border: 1px solid var(--gray3-color);
  color: var(--black-color);
  font-size: 14px;
  font-weight: 400;
  outline: none;
  resize: none;
}
.send-msgboxed-mn .send-msgbtn{
  background: var(--secondary-color);
  border: none;
  position: absolute;
  right: 5px;
  top: 5px;
  transition: all 0.2s;
  border-radius: 48px;
  color: var(--white-color);
  height: 42px;
  width: 42px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.send-msgboxed-mn .send-msgbtn:hover{
  background: var(--success-bgcolor-L);
}
.chats_bottomsmaindivs .link_sendicons{
  padding: 8px 9px;
  border: none;
  background: transparent;
  margin-bottom: 9px;
  border-radius: 10px;
  transition: all 0.2s;
}
.chats_bottomsmaindivs .link_sendicons:hover{
  background: var(--gray2-color);
}
.top_chatsearchbar .chatsearch-inp{
  width: 100%;
  height: 46px;
  border-radius: 12px;
  outline: none;
  border: 1px solid var(--gray2-color);
  padding: 8px 42px 8px 16px;
  font-size: 15px;
  font-weight: 400;
  color: var(--gray4-color);
}
.top_chatsearchbar .chatsearch-inp::placeholder{
  color: var(--gray4-color);
}
.top_chatsearchbar .serach-btn{
  position: absolute;
  right: 18px;
  bottom: 10px;
  background: transparent;
  border: none;
  outline: none;
}
.top_chatsearchbar .chatsearch-inp[type="search"]::-webkit-search-cancel-button {
  height: 1em;
  width: 1em;
  padding-right: 14px;
  background: var(--primary-color);
  font-size: 15px;
}
.customs-tabsdesignset li .nav-link{
  width: 100%;
  background: var(--gray1-color);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--black-color);
  padding: 11px 12px;
  text-align: center;
}
.customs-tabsdesignset li .nav-link.active{
  background: var(--purple-color);
  color: var(--white-color);
}
.main_chatssidepanels .chats-listings-box{
  max-height: 740px;
}
.chatright-status .commonstatus::before{
  content: "";
  height: 8px;
  width: 8px;
  display: inline-block;
  border-radius: 100%;
  background-color: var(--accept-textcolor);
  min-width: 8px;
  margin-right: 6px;
  position: relative;
  top: 1px;
}
.chatright-status .commonstatus.online::before{
  background: var(--accept-textcolor);
}
.chatright-status .commonstatus.away::before{
  background: var(--pending-textcolor);
}
.chatright-status .commonstatus.invisuble::before{
  background: var(--gray3-color);
}
.user-chatprofiles .chatuser-online{
  height: 42px;
  width: 42px;
  border-radius: 12px;
  object-fit: cover;
  object-position: top;
}
.viode-audio-outgoing{
  background: linear-gradient(90deg, #fef0ff 0%, #e8e5ff 100%);
  border-radius: 12px;
  width: auto;
  max-width: 258px;
  margin-bottom: 6px;
  padding: 11px 62px 11px 12px;
  margin-inline-start: auto;
  color: var(--title-color);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  word-wrap: break-word;
  display: flex;
  align-items: center;
  gap: 8px;
}
.call-outgoing-icon{
  height: 38px;
  width: 38px;
  min-width: 38px;
  background: var(--white-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: var(--title-color);
}
.call-outgoing-icon.in-call{
  color: var(--green-color-L);
}
.outgoing-call-contents h4{
  font-size: 14px;
  font-weight: 600;
}
.outgoing-call-contents p{
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.time-outgoing-call{
  color: var(--title-color);
  font-weight: 400;
  font-size: 11px;
  position: absolute;
  right: 10px;
  bottom: 1px;
}
.call-outgoing-icon .send-call::after{
  content: "\ed92";
  font-family: 'boxicons', sans-serif;
  position: absolute;
  color: var(--white-color);
  top: 4px;
  left: 2px;
  font-size: 12px;
  transform: rotate(45deg);
}
.call-outgoing-icon .receive-call::after{
  content: "\ed92";
  font-family: 'boxicons', sans-serif;
  position: absolute;
  color: var(--white-color);
  top: 4px;
  left: 2px;
  font-size: 12px;
  transform: rotate(222deg);
}
.viode-audio-incoming {
  background: var(--msg-receive-color);
  border-radius: 12px;
  width: auto;
  max-width: 258px;
  margin-bottom: 6px;
  padding: 11px 62px 11px 12px;
  color: var(--black-color);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  word-wrap: break-word;
  display: flex;
  align-items: center;
  gap: 8px;
}
.call-incoming-icon {
  height: 38px;
  width: 38px;
  min-width: 38px;
  background: var(--white-color);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--title-color);
}
.incoming-call-contents h4 {
  font-size: 14px;
  font-weight: 600;
}
.incoming-call-contents p {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.time-incoming-call {
  color: var(--title-color);
  font-weight: 400;
  font-size: 11px;
  position: absolute;
  right: 10px;
  bottom: 1px;
}
.call-incoming-icon.miss-call{
  color: var(--saleText-color);
}
.call-incoming-icon.in-call{
  color: var(--green-color-L);
}
.send-msg-timing{
  color: var(--subtitle-color);
  font-weight: 400;
  font-size: 11px;
  text-align: end;
}
.receive-msg-timing{
  color: var(--subtitle-color);
  font-weight: 400;
  font-size: 11px;
  text-align: start;
}
.call-history-box{
  cursor: pointer;
  padding: 9px 12px;
  border-radius: 12px;
  border: 1px solid var(--gray2-color);
  background: var(--white-color);
  transition: all 0.4s;
}
.btn-history-call{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  border: none;
  color: var(--white-color);
  height: 34px;
  padding: 4px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 40px;
  font-size: 18px;
}
.ouotgoin-miss-call{
  display: flex;
  color: var(--saleText-color);
}
.incommin-miss-call{
  display: flex;
  color: var(--green-color-L);
}

/* short list profile & block profile section start  */
.shortlistcomman, .shortlistcomman .request-profile {
  width: 56px;
  height: 63px;
  border-radius: 10px;
  object-fit: cover;
  object-position: top;
}
.right-btngroupreg .shortlist-btns{
  height: 37px;
  width: 37px;
  border: none;
  background: var(--pink-color);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.right-btngroupreg .blocked-btns{
  height: 37px;
  width: 37px;
  background: var(--gray1-color);
  border: 1px solid var(--gray2-color);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* viewed profiles start  */
.viewed-profile-img .viewed-profiles{
  width: 100%;
  height: 220px;
  border-radius: 10px;
  object-fit: cover;
  object-position: top;
}
.viewed-profile-img{
  width: 100%;
  height: 220px;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}
.lockprofiles-5::before{
  content: "\eb49";
  font-family: 'boxicons', sans-serif;
  font-size: 46px;
  position: absolute;
  z-index: 1;
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
}
.viewed-profile-box .commom-checkboxdiv-l{
  position: absolute;
  left: 12px;
  top: 12px;
  z-index: 1;
}

/* privacy settings start */
.left-settingPanels .nav li .nav-link{
  width: 100%;
  text-align: start;
  padding: 14px 24px;
  background: var(--white-color);
  margin-top: 10px;
  border-radius: 10px;
  border: 1px solid var(--gray2-color);
}
.left-settingPanels .nav-pills .nav-link.active, .left-settingPanels .nav-pills .show > .nav-link {
  color: var(--white-color);
  background: linear-gradient(90deg, #6D0073 0%, #1800A9 100%);
}
.left-settingPanels .nav-pills .nav-link.active h4,
.left-settingPanels .nav-pills .nav-link.active p,
.left-settingPanels .nav-pills .show > .nav-link h4,
.left-settingPanels .nav-pills .show > .nav-link p{
  color: var(--white-color);
}
/* end  */

/* user profile section */
.user-prfilesimg-groups .biguser-img{
  width: 100%;
  height: 316px;
  object-fit: cover;
  object-position: top;
  border-radius: 12px;
}
.action-profile-user .singleBig{
  width: 100%;
  height: 316px;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}
.common-user-sm{
  border-radius: 12px;
  width: 100%;
  height: 100px;
  position: relative;
  overflow: hidden;
  margin-bottom: 8px;
}
.common-user-sm .smalluser-img{
  border-radius: 12px;
  width: 100%;
  height: 100px;
  object-fit: cover;
  object-position: top;
}
.user-prfilesimg-groups .multiple-smalls{
  width: 28%;
}
.userlist-allbtnmain .shortlist-inetr-users{
  padding: 7px;
  background: var(--secondary-color);
  border-radius: 13px;
  display: flex;
  align-items: center;
  gap: 13px;
  color: var(--white-color);
  font-size: 14px;
  font-weight: 500;
  border: none;
}
.userlist-allbtnmain .shortlist-inetr-users.intrest{
  background: var(--intrest-bgcolor);
}
.userlist-allbtnmain .shortlist-inetr-users.message{
  background: var(--pink-color);
}
.shortlist-inetr-users span{
  height: 37px;
  width: 37px;
  border-radius: 8px;
  background: #ffffff3d;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* faq section start  */
.main-ctmacordion .accordion-item{
  background: var(--white-color);
  border-radius: 12px;
  border: 1px solid #d5d5d5;
  padding: 18px 22px;
}
.main-ctmacordion .accordion-item .accordion-button{
  background: transparent;
  border: none;
  box-shadow: none;
  font-weight: 500;
  color: var(--black-color);
  padding: 0;
}
.main-ctmacordion .accordion-item .accordion-body{
  padding: 0;
}
.main-ctmacordion .accordion-header .accordion-button::after {
  content: "\ea4a";
  font-family: 'boxicons', sans-serif;
  background: transparent;
  font-size: 26px;
  height: 26px;
  width: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* current plan section start  */
.print-btninvoiced{
  border-radius: 12px;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 400;
  border: 1px solid #00000012;
  padding: 10px 44px;
  height: 56px;
}
.downloadBtn_invoiced{
  height: 56px;
  width: 56px;
  border-radius: 12px;
  border: 1px solid #00000012;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.plan_paydetails{
  border: 1px dashed var(--gray3-color);
  border-radius: 12px;
  width: 100%;
  align-items: center;
}
.lx-setdeea .view-btn-invoice{
  font-size: 15px;
  color: var(--gray4-color);
  background: transparent;
  border: 1px solid var(--primary-color);
  border-radius: 12px;
  font-weight: 500;
  width: 162px;
  height: 51px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.currant-plan-icon{
  height: 62px;
  width: 62px;
  min-width: 62px;
  color: var(--primary-color);
  background: #76006f21;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.remove-package {
  font-size: 12px;
  color: #dc3545!important;
}
.btn-applied-coupon{
  background: var(--green-color-L);
  color: var(--white-color);
  border: none;
  padding: 7px 24px;
  border-radius: 8px;
}
.history-plan-icon {
  height: 48px;
  width: 48px;
  min-width: 48px;
  color: var(--primary-color);
  background: #76006f21;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}
.btn-plan-print{
  display: flex;
  align-items: center;
  height: 42px;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  border: none;
  color: var(--white-color);
  padding: 8px 32px;
  gap: 6px;
  border-radius: 100px;
  transition: all 0.4s;
}
.btn-plan-download{
  display: flex;
  align-items: center;
  height: 42px;
  width: 42px;
  justify-content: center;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  border: none;
  border-radius: 100px;
  color: var(--white-color);
  transition: all 0.3s;
}

/* meeting page  */
.meeting-status-images .user-meeting-img{
  width: 167px;
  height: 186px;
  border-radius: 12px;
  object-fit: cover;
}
.meeting-status{
  width: max-content;
  background: var(--secondary-color);
  margin: auto;
  margin-top: -17px;
  position: relative;
  z-index: 1;
  font-size: 14px;
  padding: 12px 32px;
  border-radius: 40px;
  color: var(--white-color);
  border: 2px solid var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  line-height: 1;
}
.meeting-status.Accepted{
  background: var(--accept-bgcolor);
  color: var(--accept-textcolor);
}
.meeting-status.Rejected{
  background: var(--sale-bg-color);
  color: var(--saleText-color);
}
.meeting-status.Pending{
  background: var(--pending-bgcolor);
  color: var(--pending-textcolor);
}
.btn-meeting-accept{
  background: var(--accept-textcolor);
  padding: 10px 42px;
  border-radius: 40px;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
}
.btn-meeting-reject{
  background: var(--saleText-color);
  padding: 10px 42px;
  border-radius: 40px;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
}
.complate-metting-suggest{
  border-top: 1px solid #b5b5b5;
}
.meeting-status-images{
  width: max-content;
}
.btn-meeting-modal {
  font-size: 15px;
  color: var(--white-color);
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  border-radius: 43px;
  font-weight: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
  width: max-content;
  padding: 9px 31px;
}

/* vendor section start  */
.vender-items-img .vendor-img{
  width: 100%;
  height: 290px;
  object-fit: cover;
  border-radius: 12px;
}
.vender-items-img::after{
  content: "";
  background: linear-gradient(177deg, rgb(0 0 0 / 0%) 0%, rgb(0 0 0 / 78%) 100%);
  position: absolute;
  width: 100%;
  height: 100%;
  display: inline-block;
  left: 0;
  right: 0;
  border-radius: 12px;
}
.vendor-gried-content{
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0px 20px 16px;
}
.vendor-number-box{
  background: var(--primary-color);
  padding: 4px 22px;
  border-radius: 40px;
  color: var(--white-color);
  border: none;
}
.slider-big-vendor .vendor-big-img{
  width: 100%;
  height: 276px;
  object-fit: cover;
  border-radius: 12px;
}
.vendor-list-left .vendor-list-img{
  width: 100%;
  height: 248px;
  object-fit: cover;
  border-radius: 12px;
}
.btn-view-vendors{
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  padding: 11px 28px;
  border-radius: 12px;
  font-weight: 500;
}
.items-small-vendor .vendor-small-img{
  width: 100%;
  border-radius: 10px;
  height: 66px;
  object-fit: cover;
}
.slider-small-vendor .slick-track{
  display: flex;
  gap: 8px;
}
.vendoe-planner-review i{
  color: #F9DC6E;
}
.top-right-contents .pricing-vendors{
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  padding: 10px 17px;
  border-radius: 12px;
  font-weight: 600;
}
.icon-contact-vendor{
  height: 46px;
  width: 46px;
  min-width: 46px;
  background: var(--black-color);
  border-radius: 100%;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.icon-contact-vendor.sm-size{
  height: 36px;
  width: 36px;
  min-width: 36px;
  font-size: 20px;
}
.btn-vendor-search{
  background: var(--white-color);
  color: var(--primary-color);
  padding: 7px 36px;
  display: inline-block;
  text-align: center;
  border-radius: 8px;
  border: none;
  font-weight: 500;
  position: relative;
  overflow: hidden;
  transition: all 0.4s ease;
  height: 48px;
  width: 100%;
}
.vendor-common-topbar{
  background: url(../images/vendor-top-bg.png) no-repeat;
  background-size: cover;
  min-height: 280px;
  border-radius: 16px;
  overflow: hidden;
}
.vendor-common-topbar::before{
  content: "";
  height: 100%;
  width: 100%;
  background: linear-gradient(90deg, rgba(109, 12, 88, 0.61) 0%, rgba(48, 38, 196, 0.61) 100%);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.vendor-common-topbar.event-bnr{
  background: url(../images/event-top-bg.png) no-repeat;
}
.vendor-common-topbar.event-bnr::before {
  background: linear-gradient(90deg, #0000009c 0%, rgb(0 0 0 / 61%) 100%);
}
.vendor-details-contents{
  margin-top: -140px;
}
.event-details-views{
  margin-top: -140px;
}
.event-checkout-views{
  margin-top: -230px;
}
.contact-help-leftbar {
  background: var(--white-color);
  border: 1px solid var(--gray2-color);
  border-radius: 12px;
}
.left-help-listing .help-left-contents {
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--gray2-color);
  padding: 12px 0px;
  cursor: pointer;
}
.left-help-listing .help-left-contents:last-child {
  border-bottom: none;
}
.single-addon-box{
  border-bottom: 1px solid var(--gray2-color);
}

/* all modal popup design  */
.customsmallmodel_light {
  background: #000000bf;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.custom-more-profile {
  background: #000000bf;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.customsmallmodel_light.couponsize .modal-dialog{
  width: 780px;
  max-width: 780px;
}
.customsmallmodel_light .modal-dialog{
  width: 548px;
  max-width: 548px;
}
.customsmallmodel_light.vendor-size .modal-dialog{
  width: 950px;
  max-width: 950px;
}
.custom-more-profile .modal-dialog{
  width: 440px;
  max-width: 440px;
}
.customsmallmodel_light .modal-content .modal-header{
  padding: 0;
  border-bottom: none;
  padding-bottom: 15px;
}
.customsmallmodel_light .modal-header .btn-close{
  box-shadow: none;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  opacity: 1;
  border: none;
  padding: 0;
  height: 32px;
  width: 32px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  line-height: 0;
  color: var(--white-color);
}
.btn-close.btn-crop-cancel{
  box-shadow: none;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  opacity: 1;
  border: none;
  padding: 0;
  height: 32px;
  width: 32px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  line-height: 0;
  color: var(--white-color);
}
.custom-more-profile .modal-header .btn-close{
  box-shadow: none;
  background: linear-gradient(178deg, #da760c 0%, hsl(2.16deg 72.77% 37.45%) 100%);
  opacity: 1;
  padding: 0;
  height: 32px;
  width: 32px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  line-height: 0;
  color: var(--white-color);
  position: absolute;
  right: 25px;
  top: 24px;
  z-index: 9;
}
.modal-buttonsGroup .click-changeButton{
  padding: 13px 40px;
  color: var(--white-color);
  font-weight: 500;
  font-size: 14px;
  border: 1px solid var(--secondary-color);
  background: var(--secondary-color);
  border-radius: 12px;
  display: inline-block;
  transition: all 0.2s;
}
.modal-buttonsGroup .clickClosebutton{
  padding: 13px 40px;
  color: var(--gray4-color);
  font-size: 14px;
  border: 1px solid var(--gray3-color);
  border-radius: 12px;
  display: inline-block;
  transition: all 0.2s;
  background: transparent;
  font-weight: 500;
}
.number-editsbtn{
  height: 48px;
  width: 48px;
  min-width: 48px;
  border-radius: 10px;
  border: none;
  background: var(--secondary-color);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white-color);
  font-size: 24px;
}
.paymentbuttons-check{
  height: 46px;
  width: 160px;
  border-radius: 40px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
  margin-top: 14px;
  background: var(--payment-color);
  color: var(--white-color) !important;
  font-size: 15px;
  font-weight: 500;
}
.paymentbuttons-check.fail{
  background: var(--error-color);
}
.payment-innnerstyle .paymet-icon{
  width: 120px;
}
.coupncodeboxinr .copu-codebtn{
  height: 32px;
  width: 32px;
  background: var(--white-color);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--gray2-color);
  color: var(--gray4-color);
  font-size: 18px;
}
.customsmallmodel_light .modal_liteBody{
  max-height: 462px;
  overflow: auto;
}
.modal_announce-body .profile-img-art{
  width: 100%;
  display: block;
  border-radius: 14px;
  height: 380px;
  object-fit: cover;
}
.modal_announce-body .items-image-dark::before{
  content: "";
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #0000004a;
  border-radius: 14px;
}
.modal_announce-body .carousel-control-prev,
.modal_announce-body .carousel-control-next {
  top: 190px;
  bottom: unset;
}
.modal_announce-body .carousel-control-prev-icon{
  height: 38px;
  width: 38px;
  background:#0000008f;
  font-size: 20px;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal_announce-body .carousel-control-next-icon {
  height: 38px;
  width: 38px;
  background:#0000008f;
  font-size: 20px;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* invoice css  */
.invoice_logo .invoice-logo{
  width: 74px;
}
.invoice_headerbar{
  border-bottom: 1px solid var(--gray2-color);
}
.invoicetables table thead tr th{
  padding: 5px 12px;
  text-align: center;
  font-weight: 500;
  color: var(--black-color);
  font-size: 15px;
  border-right: 1px solid #DDE2E5;
  border-bottom: 1px solid #DDE2E5;
}
.invoicetables table tbody tr td{
  padding: 10px 12px;
  text-align: center;
  font-weight: 400;
  color: var(--gray4-color);
  font-size: 13px;
  border-right: 1px solid #DDE2E5;
}
.invoicetables .innertableinvoice{
  border: 1px solid #DDE2E5;
  border-radius: 8px;
  padding: 4px;
  overflow: auto;
}
.invoicetables table thead tr th:first-child{
  border-radius: 6px 0px 0px 6px;
}
.invoicetables table thead tr th:last-child{
  border-radius: 0px 6px 6px 0px;
  border-right: none;
}
.invoicetables table tbody tr td:last-child{
  border-right: 0px;
}
.invoicetables table thead tr th.darkclr{
  color: var(--error-color);
}
.invoicetables table tbody tr td.txtbig{
  font-size: 14px;
  font-weight: 500;
}
.invoice_footers{
  border-top: 1px solid var(--gray2-color);
}
.gstsetintable{
  border-bottom: 1px solid var(--gray2-color);
  width: fit-content;
  margin-left: auto;
  padding-left: 24px;
  padding-bottom: 10px;
}




.matches-sliders .slick-list .slick-track{
  margin-left: 0px;
}
.view_profileIcons{
  position: absolute;
  right: 12px;
  top: 10px;
  background: #d9475c75;
  height: 32px;
  width: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
}
.usrt-profilesnterjgbsbs{
  padding: 7px;
  background: #F1F7FE;
  border-radius: 12px;
}
.group-btn-gried_list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 8px;
  position: relative;
  top: 33px;
  margin-top: -25px;
}
.group-btn-gried_list .btn-gried-group.star {
  background: var(--secondary-color);
  border: 4px solid #EFF5FC;
  height: 42px;
  width: 42px;
  min-width: 42px;
}
.group-btn-gried_list .btn-gried-group.star img{
  width: 16px;
}
.group-btn-gried_list .btn-gried-group.heart {
  background: #F73668;
  border: 4px solid #EFF5FC;
}
.group-btn-gried_list .btn-gried-group.heart img{
  width: 22px;
}
.group-btn-gried_list .btn-gried-group.chats {
  background: #539BF9;
  border: 4px solid #EFF5FC;
  height: 42px;
  width: 42px;
  min-width: 42px;
}
.group-btn-gried_list .btn-gried-group.chats img{
  width: 16px;
}
.group-btn-gried_list .btn-gried-group {
  height: 52px;
  width: 52px;
  min-width: 52px;
  background: transparent;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.usrt-profilesnterjgbsbs:hover .single_matchesdiv .view_profileIcons{
  background: var(--pink-color);
}
.usrt-profilesnterjgbsbs:hover{
  background: #e5eef8;
}
.group-btn-gried_list .btn-gried-group:hover{
  transform: scale(1.05);
}
.usrt-profilesnterjgbsbs:hover .single_matchesdiv .matches-content-sd {
  background: linear-gradient(177deg, rgb(255 255 255 / 0%) 0%, rgb(217 71 92 / 8%) 46%, rgb(217 71 92 / 58%) 100%);
}
.group-btn-gried_list .btn-gried-group .bxs-block{
  font-weight: bold;
}

/* cropper code */
.btn-cropping{
  background: var(--black-color);
  color: var(--white-color);
  font-size: 14px;
  border: none;
  padding: 8px 14px;
  border-radius: 7px;
  transition: all 0.3s;
}
.btn-cropping:hover{
  background: var(--title-color);
}
.croping-btn{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  display: flex;
  width: max-content;
  padding: 11px 17px;
  align-items: center;
  border-radius: 8px;
  border: none;
  font-size: 15px;
  gap: 6px;
}
/* side menu  */
.listingsidebarafter li .accordion-collapse li a{
  justify-content: start;
  gap: 12px;
}
.listingsidebarafter li .accordion-collapse li a::before{
  content: "";
  display: block;
  height: 7px;
  width: 7px;
  background: var(--white-color);
  border: 1px solid var(--pink-color);
  border-radius: 100%;
}
.arrows-dropdowns{
  width: 16px;
  transition: all 0.4s;
}
.listingsidebarafter li a.collapsed p img{
  transform: rotate(180deg);
}

/* matches  */
.profle_resutl-prft .profile-newaddreslet{
  height: 220px;
  width: 180px;
  border-radius: 10px 0px 0px 10px;
  object-fit: cover;
  object-position: top;
}
.matches_buttonGroups .comman-mtcBtn{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  width: 42px;
  border-radius: 100%;
  border: 1px solid var(--pink-color);
  background: var(--pink-color);
  transition: all 0.4s;
}
.matches_buttonGroups .comman-mtcBtn i{
  font-size: 20px;
  color: var(--white-color);
}
.matches_buttonGroups .comman-mtcBtn.btn2{
  background: var(--secondary-color);
  border: 1px solid var(--secondary-color);
}
.matches_buttonGroups .comman-mtcBtn.btn3{
  background: var(--purple-color);
  border: 1px solid var(--purple-color);
}
.matches_buttonGroups .comman-mtcBtn.btn4{
  background: var(--intrest-bgcolor);
  border: 1px solid var(--intrest-bgcolor);
}
.matches_buttonGroups .comman-mtcBtn.btn5{
  background: var(--notification-color);
  border: 1px solid var(--notification-color);
}
.matches_buttonGroups .comman-mtcBtn.btn3 .bxs-block{
  font-weight: bold;
}
.matches_buttonGroups .comman-mtcBtn:hover{
  border: 1px solid #b23144;
  background: #b23144;
}
.matches_buttonGroups .comman-mtcBtn.btn2:hover{
  background: #273747;
  border: 1px solid #273747;
}
.matches_buttonGroups .comman-mtcBtn.btn3:hover{
  background: #4d26bf;
  border: 1px solid #4d26bf;
}
.matches_buttonGroups .comman-mtcBtn.btn4:hover{
  background: #189376;
  border: 1px solid #189376;
}
.matches_buttonGroups .comman-mtcBtn.btn5:hover{
  background: #c53d07;
  border: 1px solid #c53d07;
}

/* dashboard section start  */
.dashboard-profile-slider .slick-track{
  margin-left: 0;
}
.single-dashboard-profiles{
  box-shadow: 0px 13px 17.6px 0px rgba(46, 219, 178, 0.08);
  border-radius: 15px;
  background: linear-gradient(185deg, rgba(255,255,255,0) 0%, rgb(167 240 223 / 17%) 45%, #2EDBB2 100%);
  padding: 2px;
}
.single-dashboard-profiles.dimand{
	background: linear-gradient(185deg, rgba(255,255,255,0) 0%, rgb(167 240 223 / 17%) 45%, #2EDBB2 100%);
}
.single-dashboard-profiles.Platinum{
	background: linear-gradient(185deg, rgba(255,255,255,0) 0%, hsl(313deg 71% 52% / 10%) , #DB2EB5 100%);
	box-shadow: 0px 13px 10.6px 0px rgba(216, 46, 219, 0.08);
}
.single-dashboard-profiles.Silver{
	background: linear-gradient(185deg, rgba(255,255,255,0) 0%, hsl(245deg 71% 52% / 10%), #3C2EDB 100%);
	box-shadow: 0px 13px 17.6px 0px rgba(46, 63, 219, 0.08);
}
.single-dashboard-profiles.Gold{
	background: linear-gradient(185deg, rgba(255,255,255,0) 0%, hsl(51deg 71% 52% / 17%), #DBC02E 100%);
	box-shadow: 0px 13px 17.6px 0px rgba(219, 191, 46, 0.08);
}
.single-dashboard-profiles.Free{
	background: linear-gradient(185deg, #83838300 0%, #8383832b, #838383 100%);
	box-shadow: 0px 13px 17.6px 0px #8383831a;
}
.single-dashboard-profiles.DimandPlus{
	background: linear-gradient(185deg, rgb(247 132 173 / 0%) 0%, hsl(338.61deg 87.79% 74.31% / 28%), #f784ad 100%);
	box-shadow: 0px 13px 17.6px 0px rgb(247 132 173 / 12%);
}
.profile-box-whitebg{
  border-radius: 14px;
}
.profile-box-whitebg .tops_imagesdsd {
  display: inline-block;
  margin: auto;
  position: relative;
  width: 100%;
  height: 240px;
  overflow: hidden;
  border-radius: 12px;
}
.tops_imagesdsd .lastprofileimg {
  width: 100%;
  height: 240px;
  border-radius: 12px;
  object-fit: cover;
  object-position: top;
  transition: all 0.4s;
}
.profile-dashboard-text p{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.tops_imagesdsd:hover .lastprofileimg{
	transform: scale(1.2);
}
.tops_imagesdsd .commanbadge{
	position: absolute;
	left: 12px;
	bottom: 7px;
	background: #2EDBB2;
	font-size: 14px;
	color: #fff;
	font-weight: 500;
	border-radius: 8px;
	padding: 5px 14px;
	transition: all 0.3s;
  z-index: 2;
}
.tops_imagesdsd .commanbadge.dimand{
	color: #fff;
	background: #2EDBB2;
}
.tops_imagesdsd .commanbadge.Platinum{
	color: #fff;
	background: #DB2EB5;
}
.tops_imagesdsd .commanbadge.Silver{
	color: #fff;
	background: #3C2EDB;
}
.tops_imagesdsd .commanbadge.Gold{
	color: #fff;
	background: #DBC02E;
}
.tops_imagesdsd .commanbadge.Free{
	color: #fff;
	background: #838383;
}
.tops_imagesdsd .commanbadge.DimandPlus{
	color: #fff;
	background: #f784ad;
}
.tops_imagesdsd:hover .commanbadge{
	margin-left: 20px;
}

/* invite friend section start  */
.invite-share-icon{
  height: 46px;
  width: 46px;
  min-width: 46px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
.copy_text-views {
  display: flex;
  justify-content: space-between;
  padding: 12px 18px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  align-items: center;
  border-radius: 10px;
  border: 1px dashed #00000012;
}
.social_invites-icons .invite-border {
  height: 44px;
  width: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  background: linear-gradient(180deg, var(--primary-color)0%, var(--secondary-color) 100%);
  font-size: 24px;
  color: var(--white-color);
}

.href-link{
  color: #4165f5;
}

 /* Call Connecting  */
.zegocloud-connecting {
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.callconnect-pulse i {
	color: var(--white-color);
	font-size: 32px;
}
.callconnect-pulse {
	height: 100px;
	width: 100px;
	border-radius: 50%;
	background-color: #44bd32;
	background-image: radial-gradient(hsl(112, 58%, 40%), hsl(112, 58%, 47%));
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	cursor: pointer;
}
.callconnect-pulse::before, .callconnect-pulse::after {
	content: '';
	position: absolute;
	width: calc(100%);
	height: calc(100%);
	border-radius: 50%;
	border: 1px solid #44bd32;
	animation: calling 2s ease-in-out infinite;
}
.callconnect-pulse::after {
	animation: calling 2s ease-in-out .35s infinite;
}
@keyframes calling {
	0% {
		width: calc(100%);
    height: calc(100%);
		opacity: 1;
	}
	100% {
		width: calc(100% + 60px);
    height: calc(100% + 60px);
		opacity: 0;
	}
}

.cropping_imagmain img{
  width: 100%;
  height: 420px;
  border-radius: 20px;
}
.ctms-prevuisfa .preview{
  overflow: hidden;
  width: 216px !important;
  height: 240px !important;
  border: 2px solid var(--secondary-color);
  border-radius: 6px;
}
.modal-header .ctmcropclose{
  position: absolute;
  right: -18px;
  top: -16px;
  height: 40px;
  width: 40px;
  border: none;
  border-radius: 100%;
  padding: 0;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  font-size: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* browse matrimony section start  */
.browse-poster-contents .browse-banner {
  width: 100%;
  height: 320px;
  object-fit: cover;
  border-radius: 20px;
  border: 1px solid #DDDFE5;
}
.browse-city-list li {
  width: 24%;
}
.browse-city-list li .city-items {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--white-color);
  padding: 12px 16px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 500;
  transition: all 0.3s;
}
.browse-city-list li .city-items span {
  height: 30px;
  width: 30px;
  background: #F6F8FD;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--title-color);
}
.browse-city-list li .city-items:hover {
  background: linear-gradient(90deg, #6D0073 0%, #1800A9 100%);
  color: var(--white-color);
}
.breadcrumb-browse {
  display: flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(90deg, #6D0073 0%, #1800A9 100%);
  padding: 11px 16px;
  border-radius: 12px;
  font-family: 'Recoleta-Regular', sans-serif;
  color: var(--white-color);
}
.browse-religion-list .religion-item a{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-weight: 600;
  color: var(--title-color);
}
.browse-religion-list .religion-item:hover a,
.browse-religion-list .religion-item.active a{
  color: var(--primary-color);
}
.browse-religion-list .religion-item a span{
  height: 30px;
  width: 30px;
  background: #F6F8FD;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--title-color);
}
.browse-religion-list .religion-item:hover a span,
.browse-religion-list .religion-item.active a span{
  color: var(--white-color);
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
}
.more-religion .more-items{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-weight: 600;
  color: #0084FF;
}
.more-religion .more-items span{
  height: 30px;
  width: 30px;
  background: #F6F8FD;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: var(--title-color);
}
.with-photos-search label{
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--gray2-color);
  padding: 11px 8px 11px 12px;
  border-radius: 10px;
  font-weight: 400;
  cursor: pointer;
}
.with-photos-search label::before{
  content: "";
  height: 20px;
  width: 20px;
  border-radius: 5px;
  border: 1px solid var(--gray2-color);
  font-family: 'boxicons';
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}
.with-photos-search input:checked ~ label::before{
  content: "\ea41";
  background: var(--primary-color);
  color: var(--white-color);
  border-color: var(--primary-color);
}
.browse_headerMain .matrimonial_haders{
  padding: 48px 64px 56px;
  border-radius: 42px;
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
}
.profile_matri_side{
  width: max-content;
  margin: auto;
  justify-content: center;
  gap: 16px;
  position: relative;
}
.profile_matri_side .groom_profiles{
  height: 240px;
  width: 240px;
  border-radius: 300px 300px 0px 300px;
  object-fit: cover;
  object-position: top;
  border-top: 2px solid var(--pink-color);
  border-left: 2px solid var(--pink-color);
  position: relative;
  z-index: 1;
  transition: all 0.4s;
}
.profile_matri_side .bride_profiles:hover,
.profile_matri_side .groom_profiles:hover{
  border-radius: 12px;
  border: 2px solid var(--pink-color);
}
.profile_matri_side .bride_profiles{
  height: 240px;
  width: 240px;
  border-radius: 0px 300px 300px 300px;
  object-fit: cover;
  object-position: top;
  margin-top: 120px;
  border-bottom: 2px solid var(--pink-color);
  border-right: 2px solid var(--pink-color);
  position: relative;
  z-index: 1;
  transition: all 0.4s;
}
.profile_matri_side .design-flower-1{
  position: absolute;
  top: -24px;
  right: 57px;
}
.profile_matri_side .design-flower-2{
  position: absolute;
  bottom: -32px;
  left: 57px;
}
.btn_register_browse{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 35px;
  width: max-content;
  border-radius: 10px;
  color: var(--white-color);
  font-weight: 400;
  transition: all 0.4s;
}
.search_boxed-main{
  background: linear-gradient(84.34deg, #1BA348 4.51%, #0B60DF 101.6%);
  padding: 12px 16px;
  border-radius: 30px;
  position: relative;
  width: 92%;
  margin: auto;
  border: 10px solid var(--gray1-color);
}
.center_liness-ss{
  height: 2px;
  width: 20px;
  background: var(--white-color);
}
.search-coman-div.sizefix1{
  width: 13%;
}
.search-coman-div.sizefix2{
  width: 28%;
}
.search-coman-div.sizefix3{
  width: 28%;
}
.search-coman-div.sizefix4{
  width: 16%;
}
.search-coman-div.sizefix5{
  width: 12%;
}
.search-coman-div .lable_search{
  font-size: 15px;
  color: var(--white-color);
  font-weight: 400;
  margin-bottom: 2px;
}
.search-coman-div .search-btn_browse{
  width: 100%;
  height: 50px;
  background: var(--white-color);
  border: none;
  border-radius: 43px;
  font-size: 16px;
  font-weight: 500;
  color: #0065d3;
}
.bg_browse-choose{
  background: var(--light-green-color);
  border-radius: 22px;
  padding: 102px 48px 30px;
}
.why_choosesmaindiv-browse{
  margin-top: -58px;
}
.single_profile-list{
  box-shadow: 0px 3px 7px 0px #f3f3f32e;
  border-radius: 14px;
  border: 1px solid var(--gray2-color);
  background: var(--white-color);
}
.single_profile-list .heading_listmain{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  padding: 15px 28px;
  border-radius: 12px 12px 0px 0px;
  color: var(--white-color);
  font-weight: 500;
}
.single_profile-list .browse_list li a{
  display: block;
  padding: 12px 28px;
  color: var(--black-color);
  font-size: 15px;
  font-weight: 400;
  margin: 5px 0px;
  transition: all 0.4s;
}
.single_profile-list .browse_list li a:hover{
  background: #a51f1a0d;
  color: var(--title-color);
}
.inner_profile--boxed{
  background: var(--gray1-color);
  border: 1px solid var(--gray2-color);
  padding: 6px;
  border-radius: 20px;
}
.profile_overflow{
  position: relative;
  height: 248px;
  border-radius: 14px;
  overflow: hidden;
}
.coman_profile{
  width: 100%;
  height: 248px;
  border-radius: 14px;
  object-fit: cover;
  overflow: hidden;
  object-position: top;
  transition: all 0.4s;
}
.coman_profile:hover{
  transform: scale(1.1);
}
.btn_connect-profiles{
  display: block;
  padding: 9px 30px;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  border-radius: 40px;
  color: var(--white-color);
  position: relative;
  top: 22px;
  margin: auto;
  margin-top: -16px;
  width: max-content;
  transition: all 0.4s;
  font-weight: 400;
}
.btn_connect-profiles:hover{
  background: transparent;
  padding: 9px 34px;
  color: var(--pink-color);
}
.browse_list li.slice {
  display: list-item;
}
.more-browse-matribox .btn-more-matri{
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
  color: var(--white-color);
  display: inline-block;
  padding: 10px 22px;
  margin: 5px 3px;
  border-radius: 6px;
  font-weight: 400;
  transition: all 0.2s;
}
.more-browse-matribox .btn-more-matri:hover{
  opacity: 0.9;
}
.user-plan-badge{
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  color: var(--white-color);
  display: flex;
  width: max-content;
  padding: 5px 10px;
  align-items: center;
  gap: 3px;
  border-radius: 7px;
}
.error-back-btn{
  display: inline-block;
  background: var(--black-color);
  color: var(--white-color);
  padding: 11px 22px;
  border-radius: 52px;
  border: none;
  outline: none;
}

/* ads bottom offcanvas  */
.offcanvas.ctmsetcanvas {
  height: 140px;
}
.ctmsetcanvas .offcanvas-header .btn-close {
  padding: 0;
  background: linear-gradient(90deg, var(--primary-color)0%, var(--secondary-color) 100%);
  opacity: 1;
  height: 36px;
  width: 36px;
  border-radius: 10px;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 50px;
  top: -34px;
  box-shadow: none;
  font-size: 32px;
}
.setinner_imageprevs .vrn-imahbff {
  width: 100%;
  height: 140px;
  object-fit: cover;
  object-position: top;
}
.privacy-header-right .lottie-box-design{
  width: 20%;
  right: 18%;
  position: absolute;
  bottom: -1%;
  height: fit-content;
}
.founder-left-img .founder-img{
  width: 100%;
  height: 420px;
  object-fit: cover;
  border-radius: 24px;
  object-position: top;
}
.founder-right-contents h2::before{
  content: "";
  width: 4px;
  background: var(--secondary-color);
  display: inline-block;
  margin-top: 2px;
}
.inner-privacy-fundamental{
  border-top: 1px solid var(--gray2-color);
}
.fundamental-profile-img .fundamentsal-img{
  width: 100%;
  height: 240px;
  object-fit: contain;
  border-radius: 12px;
  background: var(--white-color);
  border: 1px solid #00000012;
}
.single-fundamental-box{
  background: linear-gradient(90deg, #6d00731a 0%, #1800a91a 100%);
  border: 1px solid #00000012;
  border-radius: 12px;
  padding: 10px;
}
.saty-safeus-section{
  background: #0cda880f;
}
.single-stay-safe-box{
  background: var(--white-color);
  border: 1px solid #00000012;
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.3s;
}
.single-stay-safe-box:hover{
  background: linear-gradient(84.34deg, #1BA348 4.51%, #0B60DF 101.6%);
}
.single-stay-safe-box .stay-safe-icons{
  height: 48px;
  width: 48px;
  border: 1px solid #00000012;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  border-radius: 8px;
  color: var(--title-color);
}
.single-stay-safe-box:hover .stay-safe-icons{
  background: var(--white-color);
}
.single-stay-safe-box:hover h4,
.single-stay-safe-box:hover p{
  color: var(--white-color);
}