:root{
    --white: #fff;
    --d-grey: #212121;
    --primary-color: #2DBAE4;
    --text-grey: #616161;
    --rajdhani: "Rajdhani", sans-serif;
    --roboto: "Roboto", sans-serif;
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15' fill='none' stroke='%23052c65' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}

body, html{height: 100%;}
body{font-family: var(--roboto); color: var(--text-grey); line-height: 28px; font-size: 16px; background: #EFF3F9;}
img{ max-width: 100%;}
.btn:active, .btn:first-child:active{ border-color: transparent; outline: 0;}


/* authentication */
.auth-outr{ background: #fff;}
.auth-outr .btn{ padding: 15px; font-size: 22px; border-radius: 8px;}
.auth-outr .form-control{padding: 15px;}
.auth-left{flex:1 0 45%;}
.auth-left{/* justify-content: center;*/ display: flex; flex-direction: column;}

.auth-outr .next-btn, .auth-outr .prev-btn {min-width: 150px;}

.auth-right{ /*justify-content: center;*/ text-align: right; background: #E8E9EB; padding: 90px 120px; display: flex; flex-direction: column;}
.auth-right img{height: auto; object-fit: contain; width: 100%; object-position: right center;}

.auth-right .dark-title{color:#1D2333 ;text-align:center; font-family:var(--rajdhani); font-size:61px; font-weight:700; line-height:65px; letter-spacing:0.108px; padding-bottom:33px; padding-top:34px;}
.auth-right .dark-title span{color:var(--primary-color);}

.auth-footer{ padding: 30px 15px;}

.w-480{ width: 100%; max-width: 480px; padding-left: 16px; padding-right: 16px;}
.mb-35{ margin-bottom: 35px;}
.logo-box{ margin-bottom: 38px;}
.logo-box-inner { padding: 27px; margin-bottom: 30px;}

.back-to-log{color: #424242; font-size: 20px; font-weight: 500; line-height: normal; letter-spacing: 0.03px; text-decoration: none;}
.back-to-log span{font-weight: 700; color: var(--primary-color);}
.back-to-log:hover{color: #424242; text-decoration: underline;}
.back-to-log svg{ margin-right: 5px;}

h1, h2, h3, h4, h5, h6{ font-family: var(--rajdhani);}

h1{ font-weight: 700;  font-size: 36px; line-height: 44px; letter-spacing: 0.054px;}

.dark-title{ color: var(--d-grey);}

.form-group{ margin-bottom: 20px; position: relative;}
.form-group label{color:var(--d-grey); font-size: 16px; line-height: 26px; letter-spacing: 0.04px; margin-bottom: 8px;}
.form-control{border-radius: 5px; border: 1px solid #E0E0E0; padding: 12px; font-family: var(--roboto);}
.form-control.form-select{padding-right: 35px;}
.form-control:disabled{border: 1px solid #E0E0E0; background: #FAFAFA;}

.form-control:disabled::-webkit-input-placeholder{ color:rgba(33, 33, 33, .3);}
.form-control:disabled::-moz-placeholder {color:rgba(33, 33, 33, .3);}

.form-group .input-group .input-group-text{ background: transparent; color: #9E9E9E; padding-left: 1.1rem; padding-left: 1.1rem;}

.iconed-field{ position: relative;}
.iconed-field .icon { position: absolute; top: auto; right: 0; line-height: normal; padding: 15px; cursor: pointer;  display: flex; align-items: center; justify-content: center; height: 100%;}

.gl-upload{border-radius: 10px; border: 1px solid #BDBDBD; display: flex; text-align: center; height: 172px; align-items: center; justify-content: center; position: relative; color: #BDBDBD !important; margin: 0 !important;}
.gl-upload [type=file]{ opacity: 0; position: absolute; left: 0; top: 0; right: 0; bottom: 0;}
.gl-upload svg{ margin-bottom: 5px;}
.gl-upload .txt-up{ display: block;}

.simple-link{color: var(--primary-color); font-family: var(--rajdhani); font-weight: 700; letter-spacing: 0.03px; text-decoration: none;}
.simple-link:hover{color: var(--d-grey); text-decoration: underline;}

.btn{font-family: var(--rajdhani); font-weight: 700; line-height: normal; letter-spacing: 0.033px; font-size: 18px; border-radius: 6px; padding: 8px 16px;  text-align: center; position: relative; }
.btn .btn-loader{ max-width: 42px; position: absolute; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.btn-lg{ font-size: 22px; padding: 10px 20px; border-radius: 8px;}

.btn-primary{ background: var(--primary-color); border-color: var(--primary-color);  color: #FFF;}
.btn-primary:hover{background: transparent; border-color:var(--primary-color); color: var(--primary-color);}
.btn-primary:focus{background: var(--d-grey); border-color:#212121; color: #FFF;}

.btn-light.alter{background: #fff; border-color: #8FA0C1;  color: #1D2333;}
.btn-light.alter:hover{background: #8FA0C1; border-color: #8FA0C1; color:#fff;}

.btn-dark-blue{ background: #1D2333; border-color: #1D2333; color: #FFF; }
.btn-dark-blue:hover{background: transparent; border-color:#1D2333; color: #1D2333;}
.btn-dark-blue:disabled{opacity: .3; background: #1D2333; color: #fff;}

.btn-danger{ background: #DC3535; border-color: #DC3535;  color: #FFF; }
.btn-danger:hover{background: var(--d-grey); border-color:var(--d-grey);}

.btn-grey{ background: #596684; border-color: #596684;  color: #FFF; }
.btn-grey:hover{background: transparent; border-color: #596684; color:#1D2333;}

.btn-grey.alter{ background: transparent; border-color: #596684;  color: #1D2333; }
.btn-grey.alter:hover{background: #596684; border-color: #596684; color:#fff;}

.btn-danger{ background: #E97D7D; border-color: #E97D7D;  color: #fff;}
.btn-danger:hover{background: transparent; border-color: #DC3535; color: #DC3535;}

.btn-danger.alter{ background: #fff; border-color: #E97D7D;  color: #DC3535;}
.btn-danger.alter.transparent{ background: transparent;}
.btn-danger.alter:hover{background: #DC3535; border-color: #DC3535; color: var(--white);}

.btn-danger-light{ background: #FCEFEF; border-color: #F1AEAE;  color: #DC3535;}
.btn-danger-light:hover{background: transparent; border-color: #DC3535; color: #DC3535;}
.btn-danger-light.iconed-btn svg{ fill: #DC3535;}

.btn-success{ background: #249E28; border-color: #249E28;  color: #FFF;}
.btn-success:hover{background: transparent; border-color: #249E28; color:#249E28;}

.btn-white.alter{ background: transparent; border-color: #fff;  color: #FFF;}
.btn-white.alter:hover{background: #fff; border-color: #fff; color: var(--primary-color);}

.bor-btn-grey{border: 1px solid #E0E0E0;}
.bor-btn-grey:hover{background: transparent; border-color: #E0E0E0; color: var(--primary-color);}
.bor-btn-grey:hover svg path{ fill: var(--primary-color); stroke:  var(--primary-color);}

.text-theme-danger{ color: #DC3535;}

.fnt-raj{font-family: var(--rajdhani); font-weight: 500;}

footer{color: #757575; font-family: var(--rajdhani); font-size: 18px; font-weight: 500; line-height: normal; letter-spacing: 0.027px;}

/* form steps */

.form-container .btn{ min-width: 140px;}
.form-step{display:none;}
.form-step.active{display:block;}

.progress-strip{display:flex; justify-content:space-between; margin-bottom:35px; gap: 14px;}
.progress-step{width:100%; height:8px; background:#E0E0E0; position: relative;}
.progress-step:after{ content: ""; position: absolute; inset: 0; transition: .25s; width: 0; background:#59C452;}
.progress-step.active:after{width: 100%;}

.not-eligible { border-radius: 5px; border: 1px solid #EA8686; background: #FCEFEF; padding: 30px 60px; text-align: center;}
.progress-sper{ border-color: #E0E0E0; margin: 30px 0; opacity: 1;}

.radio-button-group{display:flex; flex-wrap:wrap; gap:14px;}
.radio-button-group input{display:none;}
.radio-button-group label{padding:15px 26px; border:2px solid #ccc; border-radius:8px; cursor:pointer; background-color:#fff; transition:all 0.3s ease; margin: 0; text-align: center; }
.radio-button-group input:checked + label{border-color:var(--primary-color); background:#EAF8FC; color: var(--primary-color);}

/* custom radio */

.cst-radio{ vertical-align: middle;}
.cst-radio input{ display: none;}
.cst-radio span{height: 18px; width: 18px; display: inline-block; position: relative; border-radius: 50px; border: 2px solid #9E9E9E; position: relative; vertical-align: middle;}
.cst-radio span:before{ background: #fff; width: 8px; height: 8px; border-radius: 50px; content: ''; position: absolute; opacity: 0; margin: calc(50% - 4px); left: 0;}
.cst-radio input:checked + span{ border-color: var(--primary-color); background: var(--primary-color); box-shadow: 0px 2px 4px 0px rgba(46, 38, 61, 0.16);}
.cst-radio input:checked + span:before{ opacity: 1;}

.cst-radio input:disabled + span{ opacity: .55;}

.cst-radio span.radio-lg { width: 22px; height: 22px;}
.cst-radio span.radio-lg:before{ width: 12px; height: 12px; margin: calc(50% - 6px);}

/* sidebar */

#sidebar-wrapper{ width: 18rem; background:#1D2333;  z-index: 1; display: flex; flex-direction: column; position: fixed; overflow-y: scroll; overflow-x: hidden; top: 0; bottom: 0; left: 0; transition: 0.25s ease-out; padding: 16px; }
.sidebar-heading { z-index: 55; position: relative; text-align: center; padding:10px 0 30px 0; display: flex; align-items: center; justify-content: center; cursor: pointer; border-bottom: 1px solid rgba(255, 255, 255, 0.10); }

.profile-part{border-bottom: 1px solid rgba(255, 255, 255, 0.10); padding: 10px 0; display: flex; align-items: center; gap: 14px; text-decoration: none; margin-bottom: 20px;}
.profile-part .profile-img{border-radius: 4px; overflow: hidden; width: 42px; height: 42px;}
.profile-part .profile-img img{width: 100%; height: 100%; object-fit: cover; object-position: center;}
.profile-part h5{ color: var(--white); font-family: var(--rajdhani); font-size: 20px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 0.03px; margin-bottom:0px; }
.profile-part p{ color: #BDBDBD; font-family: var(--roboto); font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; letter-spacing: 0.03px; margin-bottom:0px;}
.profile-part .arrow{ margin-left: auto; margin-right: 10px;}
.profile-part .arrow svg{opacity: .6; transition: 0.25s;}
.profile-part:hover .arrow svg{opacity: 1;}


#sidebar-wrapper:hover::-webkit-scrollbar-thumb {background:var(--secondary-color);}
#sidebar-wrapper::-webkit-scrollbar { width:3px; }
#sidebar-wrapper::-webkit-scrollbar-track { background:transparent; border-radius:0px; }
#sidebar-wrapper::-webkit-scrollbar-thumb { background:transparent; border-radius:0px; }

#sidebar-wrapper .navbar-nav li{ margin-bottom: 10px;}
#sidebar-wrapper .navbar-nav li:last-child{ margin-bottom: 0px;}
#sidebar-wrapper .navbar-nav li a,
#sidebar-wrapper .logout{position: relative; display: flex; color: #F5F5F5; text-decoration: none; align-items: center; padding: 14px; color: var(--white); font-family: var(--rajdhani); font-size: 18px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 0.027px; border-radius: 8px;}

#sidebar-wrapper .navbar-nav li a:hover,
#sidebar-wrapper .logout:hover{ color: var(--primary-color);}

#sidebar-wrapper .navbar-nav li a .svg-holder,
#sidebar-wrapper .logout .svg-holder{margin-right: 8px; transition: .25s;}

#sidebar-wrapper .navbar-nav li a svg,
#sidebar-wrapper .logout svg{ fill: #F5F5F5;  width: 24px; height: 24px; vertical-align: text-top;}

#sidebar-wrapper .navbar-nav li.active a{ color: var(--white); background: var(--primary-color);}
#sidebar-wrapper .navbar-nav li.active a svg{ fill: var(--white);}

.accordion-button::after { width: 18px; height: 18px; filter: invert(1) brightness(1) hue-rotate(45deg); transition: transform 0.2s ease-in-out; transform: rotate(270deg);}
.accordion-button:not(.collapsed)::after{transform: rotate(180deg);}

#sidebar-wrapper .navbar-nav li .sub-menu{ list-style: none; padding-left: 45px; position: relative;}
#sidebar-wrapper .navbar-nav li .sub-menu:after{ content: ""; position: absolute; top: 0; left: 23px; width: 1px; height: 100%; background: #BDBDBD;}
#sidebar-wrapper .navbar-nav li .sub-menu li{ margin-bottom: 8px; }
#sidebar-wrapper .navbar-nav li .sub-menu li a{ padding: 7px 15px; border-radius: 4px;}

#sidebar-wrapper hr{border-color: #ffffff40; margin: 30px 0;}
#sidebar-wrapper .menu-title{color: rgba(255, 255, 255, 0.60); font-size: 16px; font-style: normal; font-weight: 500; line-height: normal; margin-bottom: 10px;}

/* navbar */
.navbar{background: #FFF; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.04); padding: 0; }
.nav-inner{ display: flex; align-items: center; justify-content: space-between; flex-grow: 1; padding:20px 24px; gap: 24px;}
.navbar-toggler.profile-pic{ border: 0; padding: 0;}

#sidebarToggle{ padding: 6px;}

.app-drawer{ display: flex; gap: 24px;}
.app-status{display: flex; align-items: center; margin-left: auto;}

.search{ width: 300px; position: relative;}
.search button{ position: absolute; top: 0; left: 0; padding: 10px; cursor: pointer; padding: 6px 0px 7px 12px; border: 0; background: transparent;}
.search .form-control{border-radius: 8px; padding: 8px 10px 8px 45px; font-size: 16px;}

.leads-badge{ border-radius: 5px; border: 1px solid;  padding: 6px 22px; font-size: 16px; display: flex; align-items: center; line-height: normal; font-weight: 500;}
.bg-info-subtle{ border-color: var(--primary-color); background: #EAF8FC; color: var(--primary-color);}
.bg-danger-subtle{ border-color: #F1AEAE; background: #FCEFEF; color: #DC3535;}

.status{ display: flex; gap: 5px; font-size: 16px; font-weight: 500; letter-spacing: 0.04px; margin-right: 40px;}
.approved{color:#249E28;}
.pending{color:#FAB222;}

.navbar-collapse .status{ margin: 0;}
.navbar-collapse .status svg path{ fill:#fff;}
.navbar-collapse .approved{ color: #fff; background-color:#249E28;}
.navbar-collapse .pending{ color: #fff; background-color:#FAB222;}

.notification{ position: relative; margin-right: 30px;}
.notification .counter{ background: #DC3535; color: var(--white); width: 22px; height: 22px; font-size: 12px; font-weight: 600; display: inline-block; text-align: center; border-radius: 50%; position: absolute; right: -5px; top: -5px; line-height: 24px;}
.notification .btn{ position: relative;}
.notification > .btn, .mobile-search-icon{ border-radius: 8px; border: 1px solid #E0E0E0; padding: 8px;}
.notification .btn svg, .mobile-search-icon svg{ display: block;}

.profile-pic>a{ display: block;}
.profile-pic figure{ margin: 0; width: 40px; height: 40px; border-radius: 50%; overflow: hidden;}
.profile-pic figure img{ width: 100%; height: 100%; object-fit: cover; object-position: center;}
.profile-pic .dropdown-menu{left: auto; right: 0; background: #FFF; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.04); margin-top: 21px; border-radius: 0; list-style-type: none;padding: 5px 0; border: 0;}
.profile-pic .dropdown-menu a { display: block; padding: 6px 15px; clear: both; line-height: 1.42857143; color: #292D32; white-space: nowrap; text-decoration: none; font-size: 15px;}

/* main */

main{ padding: 24px ;}
h2{color: #000; font-size: 28px; font-weight: 700; line-height: normal; letter-spacing: 0.042px; }

.hot-box{padding: 24px; border-radius: 15px; display: flex; align-items: center; gap: 22px;}
.hot-box .icon-box{ width: 72px; height: 72px; border-radius: 50%;}
.hot-box .counter{color: var(--d-grey); font-family: var(--rajdhani); font-size: 36px; font-weight: 700; letter-spacing: 0.054px;}
.hot-box .counter small{ color: #424242; font-family: var(--roboto);font-size: 18px; font-weight: 500; letter-spacing: 0.045px; display: block; margin-top: 12px;}

.hot-box.red{background: #F8D7D7;}
.hot-box.red .icon-box{background: #E97D7D;}

.hot-box.yellow{background: #FEF0D3;}
.hot-box.yellow .icon-box{background: #FBC14E;}

.hot-box.green{background: #DFFAD3;}
.hot-box.green .icon-box{background: #59C452;}

.hot-box.purple{background: #E2DEF9;}
.hot-box.purple .icon-box{background: #8C7DE9;}

.collapse:not(.show) {display: none !important;}

/* new lead */
.font-12{ font-size: 12px !important;}
.font-14{ font-size: 14px;}
.font-16{ font-size: 16px;}
.font-18{ font-size: 18px;}
.font-20{ font-size: 20px;}
.font-22{ font-size: 22px;}
.font-24{ font-size: 24px;}
.font-32{ font-size: 32px;}

.fw-nomal{ font-weight: 400;}
.fw-500{ font-weight: 500;}

.roboto{ font-family: var(--roboto); word-break: break-word;}
.rajdhani{ font-family: var(--rajdhani);}
.d-grey{ color: var(--d-grey);}
.text-grey{ color: var(--text-grey);}

.card-box{ border-radius: 15px;}

.card-box .card-header{ color: #424242; padding: 16px 20px;}
.card-box .card-body{padding: 20px; border-radius: 15px; background: #fff; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.04); color: #424242;}
.card-box .tab-pane .card-body{ box-shadow: none;}
.card-box .tab-pane .datatable-bottom{ border-top: 1px solid #E0E0E0; padding-top: 1rem; }
.card-box .tab-pane .all-db-table .card-body{ padding: 0;}

h6.text-lable{ color: #757575; font-family: var(--roboto); font-size: 14px; line-height: normal; letter-spacing: 0.035px; font-weight: 400; margin-bottom: 6px;}
.expand-link{border-radius: 25px; background: rgba(255, 255, 255, 0.60); padding: 13px; display: flex; align-items: center;  transition: .25s;}
.expand-link svg{ transform: rotate(0); transition: .25s;}
.expand-link:hover {background: rgba(255, 255, 255, 1)}
.expand-link:hover svg{ transform: rotate(45deg);}

.card-box.equliz-hieght{ height: 100%; display: flex; flex-direction: column;}
.card-box.equliz-hieght .card-body{ display: flex; flex-direction: column;}

.card-box .date-box{color: var(--text-grey); font-size: 16px; line-height: 26px; letter-spacing: 0.04px;}

.card-box .brd-clr-grey{ border-color: #E0E0E0; opacity: 1; margin: 20px 0;}
.card-header .brd-clr-blue{ border-color: #C2D0EA; opacity: 1; margin: 25px 0;}

.leads-outer{ position: relative;}
.subscription-overly{border-radius: 15px; background: rgba(255, 255, 255, 0.40); backdrop-filter: blur(9px); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 5;}
.w-570{ width: 100%; max-width: 570px;}

.attachment-box {width: 130px; line-height: 1.5; word-break: break-word; color: #424242; text-decoration: none; position: relative;}
.attachment-box:hover{ color: var(--text-grey);}
.attachment-box figure{border-radius: 5px; border: 1px solid #E0E0E0; padding: 5px; margin: 0; height: 110px; margin-bottom: 6px;}
.attachment-box img{ width: 100%; height: 100%; object-fit: cover; object-position: center;}

.attached {width: 110px; height: 110px; display: block; border-radius: 6px; overflow: hidden; position: relative; }
.attached img{ width: 100%; height: 100%; object-fit: cover; object-position: center;}

.attached.bluerd:after{content: ''; position: absolute; inset: 0; z-index: 0; backdrop-filter: blur(2px);}

.attached.wd-100{width: 100px; height: 100px;}
.attached.wd-170{width: 170px;}
.attached.full-width{ width: 100%; height: 100%;}

.dt-delete{ position: absolute; background: #fff; padding: 8px; bottom: 0; right: 0; border-radius: 50%; margin: 6px; border: 0; z-index: 1;}
.dt-delete svg{ fill: #000; display: block;}
.dt-delete:hover{ background: #DC3535;}
.dt-delete:hover svg path{ fill: var(--white);}

.no-notes{ height: calc(100% - 48px);}

/* notification */
.notification-wrapper.dropdown-menu{  width: 350px; min-width: auto; margin-top: 20px; left: auto; right: 0; background: #FFF; box-shadow: 0px 6px 16px 0px rgba(46, 38, 61, 0.22); border: 0; border-radius: 6px; padding: 0;}
.notification-wrapper .badge{border-radius: 40px; background: rgba(45, 186, 228, 0.20); color: var(--primary-color); font-size: 13px; font-style: normal; font-weight: 500; padding: 8px 14px;}

.notification-wrapper ul{list-style: none; margin: 0; padding: 0;}
.notification-wrapper li{ display: flex;  border-bottom: 1px solid rgba(46,38,61,0.12); padding: 15px; color: #757575; font-size: 14px; line-height: 1.5;}
.notification-wrapper li:hover{color:#302F2A;}

.notification-wrapper li:last-child{ border-bottom: 0;}
.notification-wrapper li .pf-rnd{flex: 0 0 40px; height: 40px; margin: 0; border-radius: 50px; overflow: hidden; margin-right: 12px;}
.notification-wrapper li .pf-rnd img{ object-fit: cover; height: 100%; width: 100%;}

.notification-header{ padding: 15px; border-bottom: 1px solid rgba(46,38,61,0.12); display: flex; justify-content: space-between; align-items: center;}
.notification-wrapper li .media-body .btn{ font-size: 14px; border-radius: 4px; padding: 6px 25px;}

/* subscription */
.plan-box{border-radius: 15px; padding: 30px; display: flex ; flex-direction: column; height: 100%;}
.plan-header .plan-name{ font-size: 24px; font-weight: 500; display: flex; gap: 8px; margin-bottom: 15px; line-height: 36px; letter-spacing: 0.036px; color: #424242; align-items: center;}
.plan-header .plan-name .badge{border: 1px solid #757575; padding: 6px 16px; color: #616161; font-size: 12px; font-weight: 500; line-height: normal; letter-spacing: 0.03px;}

.plan-price{ color: var(--d-grey); font-family: var(--rajdhani); font-size: 56px; font-weight: 700; line-height: normal; letter-spacing: -0.14px; display: flex; gap: 16px; align-items: center;  margin-bottom: 15px;}
.plan-price .p-leads{border-radius: 4px; color: #424242; font-family: var(--roboto); font-size: 26px; font-weight: 500;letter-spacing: 0.039px; padding: 14px; display: flex; align-items: center; flex: 1;}

.plan-body{ flex-grow: 1; color: #424242; font-size: 18px; font-weight: 400; line-height: 28px; letter-spacing: 0.045px; margin-bottom: 30px;}
.plan-footer{ text-align: center;}
.plan-footer .btn{border-radius: 50px; background: var(--white); padding: 13px; color: var(--d-grey); text-align: center; font-family: var(--rajdhani); font-size: 22px; font-weight: 700; line-height: normal; letter-spacing: 0.033px; min-width: 220px;}
.plan-footer .btn:disabled{ border: transparent; opacity: .5;}

.no-leads{border-radius: 15px; background: var(--white); box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.04); height: auto; display: flex; align-items: center; justify-content: center; padding: 30px; height: calc(100vh - 190px);}
.only-main-height{height: calc(100vh - 82px);}
.w-550{ width: 100%; max-width: 550px;}

.thumb-30{ width: 30px; height: 30px; border-radius: 50%; overflow: hidden;}
.thumb-50{ width: 50px; height: 50px; border-radius: 50%; overflow: hidden;}
.thumb-60{ width: 60px; height: 60px; border-radius: 50%; overflow: hidden;}
.thumb-120{ width: 120px; height: 120px; border-radius: 50%; }
.thumb-120 img{border-radius: 50%; }
.thumb-150{ width: 150px; height: 150px; border-radius: 50%; }
.thumb-150 img{border-radius: 50%; }

.thumb-50 img, .thumb-60 img, .thumb-150 img{ width: 100%; height: 100%; object-fit: cover; object-position: center;}

/* modals */

.modal-body{ padding: 30px;}
.modal-content{ border-radius: 20px; border: 0;}
.modal-w-600{ max-width: 600px;}
.modal-w-520{ max-width: 520px;}
.modal-w-430{ max-width: 430px;}

.min-w180{ min-width: 180px;}
.min-w200{ min-width: 200px;}

/* my profile */
.profile-overview{border-radius: 15px; background: #2092C4 url(../img/profile-bg.png) no-repeat top left; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.04); padding: 30px; position: relative; background-size: cover;}

.user-ttl{ position: relative; padding-left: 12px; padding-bottom: 24px;}
.user-ttl:before{ content: ""; border-radius: 4px; background:  #FFF; width: 4px; height: 26px; position: absolute; left: 0;}

.floated-btn-profile{ position: absolute; top: 0; right: 0; margin: 30px;}
.profile-section .change-image{ position: absolute; background: #fff; border-radius: 50%; padding: 4px; bottom: 0; right: 0; transform: translate(-5px, -5px ); box-shadow: 0px 4px 12px rgba(33, 33, 33, 0.08);}
.profile-section .change-image:focus{ background: #fff;}
.profile-section .pf-thumb{ margin-right: 30px;}

/* tabs */
.brand-tabs{ padding: 0 1.5rem; border-bottom: 1px solid #E0E0E0; display: flex; flex-wrap: wrap;}
.brand-tabs li a{color: #212121; text-align: center; font-family: var(--rajdhani); font-size: 20px; font-weight: 700; line-height: normal; letter-spacing: 0.03px; display: block; padding: 22px 25px; position: relative; }
.brand-tabs li a:hover, .brand-tabs li a.active{color: var(--primary-color);}
.brand-tabs li a::after{ content: ''; position: absolute; border-bottom: 3px solid transparent; left: 0; bottom: -1px; right: 0;}
.brand-tabs .nav-link.active::after{ border-color: var(--primary-color);}

/* single hand range slider */
.slider-container {position: relative;}
.slider-container #value {position: absolute;right: 10px;  }
#slider { appearance: none; -webkit-appearance: none; height: 5px; width: 100%; outline: none; border: 0;}
#slider::-webkit-slider-thumb { appearance: none; background: rgb(255, 255, 255); height: 20px; width: 20px; border-radius: 50%; cursor: pointer; box-shadow: 0 0 2px #4a4a4a;}
#slider::-webkit-slider-thumb:active {scale: 1.02;}

/* doouble hand range slider */

.irs--round{margin: 35px 0;}
.irs--round .irs-line, .irs--round .irs-bar {height: 8px; border-radius: 20px;}
.irs--round .irs-line{ background: #EEE;}
.irs-from, .irs-to, .irs-single{ top: -13px;}
.irs--round .irs-bar { background-color: var(--primary-color);}

.irs--round .irs-handle { background-color: var(--primary-color); border-color: #fff; /*box-shadow: 0px 0px 0px 5px rgba(0, 194, 192, 0.2); */}

.irs--round .irs-handle.state_hover, .irs--round .irs-handle:hover {background-color: #00C2C0; }

.irs--round .irs-handle { width: 20px; height: 20px;top: 29px; }

.irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single {background: #D5F1FA; color: #2092C4; font-family: var(--roboto); font-weight: 600; letter-spacing: 0.035px; padding: 7px;}

.irs--round .irs-min, .irs--round .irs-max {display: none;}

.irs--round .irs-from:before, .irs--round .irs-to:before, .irs--round .irs-single:before{ border-width:5px ; bottom: -10px; margin-left: -5px; border-top-color:#D5F1FA;}


/* table date */
.all-db-table table{ border-radius: 12px; overflow: hidden; color: #424242;}
.all-db-table table thead th { border-bottom:0 !important; background-color: #EFF3F9; text-align: left; font-family: var(--rajdhani); color: var(--d-grey); font-size: 18px; font-weight: 700; letter-spacing: 0.027px;}

.table-responsive .card-body{overflow-x: auto; -webkit-overflow-scrolling: touch;}
/* .all-db-table table.dataTable tr:nth-of-type(even)>* { background-color: #FBFBFC; } */

div.dt-container.dt-empty-footer tbody>tr:last-child>*{border-bottom:0 !important;}

.all-db-table .table > :not(caption) > * > *{ padding-top: 1rem; padding-bottom: 1rem;}

/* .all-db-table table.dataTable tr:hover { background-color: #FFF6F0 !important;}  */

.all-db-table tbody tr td{border-color:#EEE;}

.dt-paging .dt-paging-button:hover{background: #222 !important; border-color: #222 !important; }

.all-db-table div.dt-container .dt-paging .dt-paging-button.current, .all-db-table div.dt-container .dt-paging .dt-paging-button.current:hover{background: #1D2333 !important; border-color: #1D2333 !important; color: #fff !important; border: 0;}

.dt-paging .dt-paging-button{border-radius: 25px !important; color: var(--mid-grey) !important; font-size: 15px; font-weight: 400; padding: .4em !important; min-width: 40px !important;}

.all-db-table div.dt-container select.dt-input{border-radius: 3px; border: 1px solid rgba(154, 162, 172, 0.80); background: #FFF; color: var(--light-grey); font-size: 14px;  padding: 12px 10px;  margin-right: 15px; appearance: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); width: 80px; background-repeat: no-repeat; background-position: 82% 15px; background-size: 14px; line-height: normal;}

div.dt-container .dt-paging .dt-paging-button.previous:hover, div.dt-container .dt-paging .dt-paging-button.next:hover, .all-db-table div.dt-container .dt-paging .dt-paging-button.disabled, .all-db-table div.dt-container .dt-paging .dt-paging-button.disabled:hover, .all-db-table div.dt-container .dt-paging .dt-paging-button.disabled:active{ font-weight: 600 !important; background: transparent !important; border-color: transparent !important; color: rgba(0, 0, 0, 0.5) !important;}

.all-db-table div.dt-container .dt-paging .dt-paging-button.previous, .all-db-table div.dt-container .dt-paging .dt-paging-button.next{ font-size: 18px;}

div.dt-container .dt-paging .dt-paging-button.previous{ margin-left: 0; margin-right: 10px;}
div.dt-container .dt-paging .dt-paging-button.next{ margin-left: 10px; margin-right: 0px;}

div.dt-container .dt-search input{padding: 8px !important; border: 1px solid rgba(154, 162, 172, 0.80) !important; padding: 12px 15px !important; margin: 0;}
div.dt-container .dt-search input:focus-visible{ outline: none;}

/* dt dropdown*/
.dt-button-collection { position: absolute; left: 0; top: 100% !important; margin: 0; margin-top: 5px; padding: 0; border-radius: 3px; z-index: 9000; min-width: 180px;  text-align: left; list-style: none; border: 1px solid rgba(154, 162, 172, 0.80); background: #FFF; box-shadow: 0px 4px 10px 0px rgba(138, 142, 148, 0.15);}
.dt-button-collection button { border: none; color: #4A4A4A; padding: 8px 16px; word-wrap: break-word; white-space: normal; font-weight: 400; line-height: 1.42857143; background: transparent; display: block; width: 100%;text-align: left; font-size: 14px;}

.datatable-bottom{ display: flex; align-items: center; margin-top: 1.5rem; justify-content: space-between;}
.datatable-top{display: flex; gap: 10px; margin-bottom: 1.5rem; flex-wrap: wrap; justify-content: space-between;}

div.dt-container .dt-search input{border-radius: 5px !important; border: 1px solid rgba(154, 162, 172, 0.80) !important; background-color: #FFF !important; color: var(--light-grey) !important; margin-left: 0 !important; line-height: normal;}

.dt-search {position: relative;}

.all-db-table .table td a{ text-decoration: underline; color: #000; font-weight: 600;}
.all-db-table .table td a:hover{text-decoration: none; }
.all-db-table .table td a[type="button"]{text-decoration: none !important;}
.all-db-table .table td a[type="button"]:hover{ color:#F1F1F1; text-decoration: none !important;}

.action-box{display: flex; gap: 10px; justify-content: center;}
.action-box .btn { padding: 0px;}

.badge{padding: 6px 20px; border-radius: 4px; font-family: var(--roboto); font-size: 14px; font-weight: 400; letter-spacing: 0.035px; border-radius: 4px;}
.success-bg{ color: #249E28; border: 1px solid #59C452; background: #DFFAD3;}
.inactive-bg{ color: #9E9E9E; border: 1px solid #BDBDBD; background: #F5F5F5;}
.info-bg{ color: #2092C4; border: 1px solid #2DBAE4; background: #E9FEFD;}
.danger-bg{ color: #DC3535; border: 1px solid #E97D7D; background: #F8D7D7;}
.badge.alter{ border: 1px solid; background: transparent !important; font-weight: 500; }
.badge.alter.text-bg-danger{  border-color: #EA8686; color: #DC3535 !important;}

/* custom check box */

.cst-check input{ display: none;}
.cst-check span{height: 20px; width: 20px; display: inline-block; position: relative; background: transparent; border: 2px solid #BDBDBD; border-radius: 3px; vertical-align: middle;}
.cst-check span:before{content: ""; background: url(../img/check.svg) no-repeat; width: 14px; height: 10px; position: absolute; line-height: normal; left: 1px; top: 3px; opacity: 0; background-size: cover; }
.cst-check input:checked + span{ background: var(--primary-color); border-color: var(--primary-color);}
.cst-check input:checked + span:before{ opacity: 1;}
.cst-check input:disabled + span{ opacity: .55;}

/* Toggle switch */
.toggle{ display: flex; align-items: center;}
.toggle input[type=checkbox]{ height: 0; width: 0; visibility: hidden; }
.toggle .toggler { cursor: pointer; text-indent: -9999px; width: 48px; height: 25px; background: #EEEEEE; border-radius: 100px; position: relative;}
.toggle .toggler:after { content: ''; position: absolute; top: 4px; left: 5px; width: 17px; height: 17px; background: #fff; border-radius: 90px; transition: 0.3s;}
.toggle input:checked + .toggler { background: #DFFAD3;}
.toggle input:checked + .toggler:after { left: calc(100% - 5px); transform: translateX(-100%); background: #59C452;}

.wd-70{ width: 70px;}
.w-h-50{width: 50px; height: 50px; flex: 0 0 50px;}
.bg-light-grey{ background: #F2F5FA;}

.bord-box{border-radius: 5px; border: 1px solid #E0E0E0;}

.ck.ck-editor__main>.ck-editor__editable{min-height: 170px;}

/* Toggle */

.toggle-btns-group { box-sizing: border-box; display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: stretch;}
.toggle-btns-group input { display: none; }
.toggle-btns-group input + label:first-of-type { border-radius: 5px 0 0 5px; border-right: none; }
.toggle-btns-group input + label:last-of-type { border-radius: 0 5px 5px 0; border-left: none;  }
.toggle-btns-group input + label {margin: 0; padding: .88rem .5rem; box-sizing: border-box; position: relative; border: solid 1px #E0E0E0; background-color: #fff; text-align: center; flex-grow: 1; display: flex; justify-content: center; align-items: center; min-height: 45px; cursor: pointer; transition: all .25s}
.toggle-btns-group input + label i{ font-size: 23px; margin-left: 5px; display: none;}
.toggle-btns-group input:checked + label i{ display: block;}
.toggle-btns-group input:checked + label { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); z-index: 1;}

.table-danger-custom{ background:#FCEFEF !important;}

.lead-card {
    cursor: pointer;
}

.dt-type-numeric {
  text-align: left !important;
}
/* sweet popup */
div:where(.swal2-container) div:where(.swal2-popup){width: 520px !important; padding-bottom: 35px!important; border-radius: 20px !important; border: 0 !important;}
div:where(.swal2-container) h2:where(.swal2-title){color: #212121 !important; font-family: var(--font-bold) !important; font-size: 24px !important; line-height: 36px; padding: 15px 35px !important;}
div:where(.swal2-container).swal2-backdrop-show, div:where(.swal2-container).swal2-noanimation{background: rgba(0, 0, 0, .62) !important;}

div:where(.swal2-container) button:where(.swal2-styled){width: calc(50% - 20px); margin: 0 !important; font-family: "Rajdhani", sans-serif !important; font-size: 22px !important; font-weight: 700 !important; padding: 10px 14px !important; flex-grow: 1;}
div:where(.swal2-container) button:where(.swal2-styled).swal2-cancel{background: var(--white) !important; border: 1px solid #5D7A94 !important; color: #1D2333 !important; border-radius: 8px !important; transition: all .25s ease-in-out !important;}

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm{ cursor: pointer; user-select: none; border-radius: 8px !important; transition: all .25s ease-in-out !important; background: var(--primary-color) !important; border: 1px solid var(--primary-color) !important; letter-spacing: 0.95px !important;}

div:where(.swal2-container) div:where(.swal2-actions){ padding: 0 35px !important; width: 100% !important; gap: 20px;}

div:where(.swal2-container) button:where(.swal2-styled).swal2-default-outline{font-weight: normal !important; margin: 0 !important; flex: 0 0 calc(50% - 10px);  font-size: 18px !important;}

div:where(.swal2-container) div:where(.swal2-actions):not(.swal2-loading) .swal2-styled:hover{ background: #8FA0C1 !important; border-color: #8FA0C1 !important; color: #fff !important;}

div:where(.swal2-container) div:where(.swal2-actions):not(.swal2-loading) .swal2-styled.swal2-confirm:hover{background: transparent !important; color: var(--primary-color) !important; border-color: var(--primary-color) !important;}
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm:focus{box-shadow:none !important}
div:where(.swal2-container) img:where(.swal2-image){margin: 2em auto 0.5em !important;}
div:where(.swal2-container) div:where(.swal2-html-container){ color: #616161 !important; font-size: 16px  !important; line-height: 24px; letter-spacing: 0.04px; padding: .3em 1.6em 1em !important ;}

.icon-box {
    position: relative;
    width: 150px;
    height: 150px;
    border: 1px solid #ddd;
    border-radius: 8px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}

.image-preview-wrapper img.preview-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.company-image-preview-wrapper img.preview-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.remove-image {
    position: absolute;
    top: 4px;
    right: 4px;
    background: #fff;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-weight: bold;
    color: #ff0000;
    cursor: pointer;
    z-index: 10;
    display: none;
}

#uploadPlaceholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #aaa;
}

#companyUploadPlaceholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: #aaa;
}

.btn-download svg {
    fill: #d32f2f; /* red */
    transition: fill 0.2s ease-in-out;
}

.btn-download:hover svg {
    fill: #b71c1c; /* darker red */
}
.wd-50{ width: 50%;}
.info-box {border-radius: 8px;padding:10px 15px; background: #fff; color: var(--d-grey); font-size: 14px; line-height: normal; flex:0 0 calc(25% - 1rem)}
.info-box .count_leads{ font-size: 25px;}
.ck-editor.is-invalid .ck.ck-editor__main {border: 1px solid #dc3545; border-radius: 0.375rem;}

/* sweet popup */

.img-delete{ position: absolute; background: #fff; padding: 8px; bottom: 0; right: 0; border-radius: 50%; margin: 6px; border: 0; z-index: 1;}
.img-delete svg{ fill: #000; display: block;}
.img-delete:hover{ background: #DC3535;}
.img-delete:hover svg path{ fill: var(--white);}


.timeline { position: relative;}
.timeline::before{ content: ''; position: absolute; top: 0; left: 50%; width: 2px; height: 100%; background-color: #eff3f9; z-index: 0; border-radius: 50px; transform: translate(-50%, 0%);}

.timeline-item { display: flex; align-items: flex-start; position: relative; margin-bottom: 20px; position: relative;}

.timeline-item:before{ content: ''; width: 25px; height: 25px; background: var(--primary-color); border-radius: 50%; z-index: 1; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 6px solid #fff;}

.timeline-content:after{content: ''; border: 1px solid #eff3f9; position: absolute; z-index: 0; top: 50%;}

.timeline-item-left .timeline-content:after{ left: auto; right: 0; transform: translate(-50%, -50%) scale3d(21, 1, 1); transform-origin: right; margin-right: -30px;}
.timeline-item-right .timeline-content:after{left: 0; transform: translate(-50%, -50%) scale3d(21, 1, 1); transform-origin: left; margin-left: -30px;}

.time-desc{ padding-right: 90px;}
.time-desc .badge{ position: absolute; right: 0; top: 0;}

.timeline-content {padding: 20px; border-radius: 15px; background: #eff3f9; /*box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.04);*/ color: #424242; flex: 0 0 48%; position: relative;}

.timeline-item-left {flex-direction: row; }
.timeline-item-right {flex-direction: row-reverse;}

.timeline-date { display: flex; align-items: center; gap: 8px;}
.timeline-date svg { width: 20px; fill: #4c4444;}
.timeline-thumb { width: 75px; height: 75px; overflow: hidden; flex-shrink: 0; border-radius: 8px; transition: all 0.2s;}
.timeline-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.timeline-thumb img:hover {transform: scale(1.05);}

.saved-card{ border: 1px solid #E0E0E0; border-radius: 12px; padding: 15px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
.saved-card:last-child{ margin-bottom: 0;}
.saved-card .card-icon{border: 1px solid #E0E0E0; border-radius: 8px; padding: 8px;}
.text-bg-dark{background: #19202c;}



@media (min-width: 768px) {
    #page-content-wrapper{margin-left: 18rem; transition: margin 0.25s ease-out; min-height: 100vh;}
    body.sb-sidenav-toggled #wrapper #sidebar-wrapper {margin-left: -18rem;  }
    body.sb-sidenav-toggled #wrapper #page-content-wrapper { margin-left: 0; }
 }

 @media (min-width: 992px) {
    .navbar-expand-lg .navbar-collapse{ flex-wrap: wrap;}
}

@media (min-width: 1025px) {
    .desk-hide { display: none;}
}

@media (max-width: 1500px) {
    .plan-footer .btn{ min-width: 180px;}
}

@media (max-width: 1300px) {
    .card-box .date-box{ flex-wrap: wrap;}
    .card-box .date-box.gap-3 {gap: 0.5rem !important;}
    .search { width: 130px;}
    .status{ margin-right: 10px;}
    .notification{ margin-right: 20px;}
    .navbar{ gap: 15px;}
    #sidebarToggle.me-3{ margin: 0 !important;}
}

@media (max-width: 1200px) {
    .app-drawer{gap: 15px;}
    .search .form-control{padding: 8px 10px;}
    .search button{ display: none;}
}

@media (max-width: 1024px) {
    .auth-outr{ flex-wrap: wrap;}
    .auth-left, .auth-right{ flex: auto;}
    .auth-left{ order: 2; padding: 25px 20px;}
    .auth-right{ order: 1;}
    .auth-footer{ margin-top: 20px;}
    .logo-box-inner{ text-align: center;}
    .navbar{ display: block;}
    .mob-hide{ display: none;}
    .notification{ margin-right: 0;}
}

@media (max-width: 991px) {
    .attachment-row{position: relative; padding-right: 70px;}
    .attachment-row .col-auto{position: absolute; right: 0; top: auto; bottom: 0;}
    .attachment-row .d-block.blank{ display: none !important;}
}

@media (max-width: 767px) {
    .w-480{ padding: 0;}
    .auth-right{ padding: 30px;}
    .auth-right .dark-title{ font-size: 2em; line-height: normal;}
    .sb-sidenav-toggled #sidebarToggle{ position: relative; z-index: 2; }
    .sb-sidenav-toggled #sidebarToggle svg rect{position: absolute;transition: .25; fill: #fff;}
    .sb-sidenav-toggled #sidebarToggle svg rect:first-child{ transform: rotate(45deg) translate(4px, -3px);}
    .sb-sidenav-toggled #sidebarToggle svg rect:nth-child(2){ display: none;}
    .sb-sidenav-toggled #sidebarToggle svg rect:nth-child(3){ transform: rotate(-45deg) translate(-10px, -4px);}
    .notification{ position: static;}
    .notification-wrapper.dropdown-menu{ width: 100%; margin-top: 0;}
}

@media (max-width: 550px) {
    .floated-btn-profile{ position: static; margin: 0 0 20px 0;}
}