@import url(var.css);
a,button{ transition: ease all 0.4s; -webkit-transition: ease all 0.4s; -moz-transition: ease all 0.4s; -ms-transition: ease all 0.4s; -o-transition: ease all 0.4s; }

.formcontainer.form_gradient_bg{ background: linear-gradient(90deg, var(--primary_color) 0%, var(--secondry_color) 100%);}

body{color:#171717; font-size:15px; font-family:var(--primary-font); font-weight:400;    -webkit-text-size-adjust: 100%;   -webkit-tap-highlight-color: transparent; background: var(--bodylightbg); overflow-x: hidden;}
.formcontainer{position: relative;  background: #fff;  height: 100vh;  padding: 16px 4px;  display: flex;}
.form_or { text-align: center;font-weight: 600;}
.form_or:before {width: 100%; height: 1px; background: #d9d9d9; position: absolute; left: 0;top:20px;content: '';}
.form_or span{background: #fff; display: inline-block; position: relative; padding: 0px 4px;
    color: var(--textgrey); font-size: 13px; font-weight: 500; margin: 12px 0px 7px;}
.form__ .form-check-input:checked {background-color: var(--primary_color);border-color: var(--primary_color);}
.linktext2{ font-size: 15px;  color: #111;  text-decoration: none; font-weight: 500;}
#onboard_business_modal{    z-index: 1062;}
.linktext{text-decoration: none;color: var(--bodycolor);}
.linktext:hover,.linktext2:hover{ color: var(--primary_color);}
.form__  .form-check-input[type=checkbox] {border-radius: 2px;}
.form__{       border-radius: 10px; padding: 22px 40px; width: 100%; background: #fff;}
.form__ h2{ font-size:24px; font-weight: 600; }
.form__group{ position:relative; margin-bottom:15px;}
.form__input{position: relative;  display: block; width: 100%; padding: 10px;
    border: 1px solid #d9d9d9; border-radius: 4px; outline: none;
    background:#fff;  font-size: 13px;  color: #353535;}
.form__input:focus{border:1px solid #d9d9d9;}
.form__label{position: absolute; top: 11px; left: 12px; transition: all 300ms ease-in-out; pointer-events: none; font-size: 13px;
    color: #a3a3a3;}
.form__input:focus~label,.form__input:not(:placeholder-shown)~label{color: #939393;top: -10px;left: 10px; font-weight: 500; font-size: 13px;z-index: 1;background: #fff;}
.form__input::-webkit-input-placeholder{color:transparent;}
.form__input::-moz-placeholder{color:transparent;}
.right_form_info{    padding: 25px;  background: #f0faf7 url(../img/cunnekt-login-bg.png) center top no-repeat; background-size: cover; border-radius: 20px; }
.middle-box{height: 100%;display: flex; align-items: center; justify-content: center;}
.testshowoneline{display: -webkit-box; cursor: pointer; position: relative; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;}
/* Tooltip text */
.tooltips .tooltip-text { visibility: hidden;opacity: 0;width: 200px;background-color:var(--primary_color);
  color: #fff;text-align: center;padding:4px 6px;border-radius: 6px;position: absolute; z-index: 1;
  bottom: 125%;  left: 50%; transform: translateX(-50%);transition: opacity 0.3s; font-size: 14px;
  line-height: 1.4;  white-space: normal; }
.new_chat_btn button{     background: none; border: 1px solid #e5e5e5; padding: 10px; border-radius: 5px;}
/* Tooltip arrow */
.tooltips .tooltip-text::after {content: ""; position: absolute;top: 100%; left: 50%;transform: translateX(-50%); border-width: 6px;border-style: solid;border-color: var(--primary_color) transparent transparent transparent;
}
.contact-info-offcanvas{ width: auto!important;}
.dsbl:disabled{    background: #f7f7f7; cursor: not-allowed;}
.tooltips:hover .tooltip-text {visibility: visible; opacity: 1;}
.normal-font-size18{ font-size: 18px!important;}
.right_form_info h2{font-size: 30px;margin-bottom: 24px;}
.right_form_info h2 strong{ color: var(--themecolor);}
.form_guide{ list-style: none; padding: 0; margin: 0;}
.form_guide li{background: url(../img/tickmark_.png) no-repeat 0px 3px; padding-left: 26px; padding-bottom: 8px; font-weight: 500;}
.onbrd li.tickmark{background: url(../img/tickmark_.png) no-repeat 0px 3px; padding-left: 26px; padding-bottom: 8px;  font-weight: 400; margin-bottom: 6px;}
.form_img{margin: 0 0 30px 0;}
.form_img img{width: 264px;}
.show-password{position: absolute;right: 10px; top: 13px; background: var(--themecolor); color: #fff; border: 0px; border-radius: 30px; font-size: 11px; font-weight: 600; display: inline-block;
    padding: 2px 6px; cursor: pointer;}
.frm_label a{ text-decoration: none; color: var(--themecolor);}
.react-tel-input .form-control {height: 40px!important; width: 100%!important; outline: none;}
.formfield:focus{ outline: none;}
/* Dashboard style start here */
.bp_component_wrap{display: flex; width: 100%; height: 100vh; }
.side_toggle_btn {position: absolute; right: -15px; top: 56px;z-index: 1; width: 30px; height: 30px; background: var(--menu_font_color);
    border-radius: 100%;border: 0; box-shadow: 0px 0px 3px #dddddd;}
.side_toggle_btn::before {position: absolute; left: 12px;top: 10px;content: ''; width: 10px;height: 10px;border-top: 2px solid var(--menu_fill_color);border-left: 2px solid var(--menu_fill_color);transform: rotate(311deg);}
.openside .side_toggle_btn::before{transform: rotate(128deg); left: 8px;}
.sidenav{ width:165px;background:var(--menu_fill_color); z-index: 2; height: 100%; padding: 10px 1px; position: fixed;transition: ease all 0.2s;}
.openside .sidenav{ width: 60px; }

/* start css here */
.applogo{padding: 0 0px 18px 8px;}
.side-links >li, .notify-check >li{ position: relative;}
.logoIcon{display:none; margin-bottom: 21px; margin-left: 15px;}
.openside .sidenav button .side_link_label{    left: 46px;}
.openside .sidenav .side_link_label{position: absolute;left: 56px;    top: 4px;
    background: #ffffff; color: #111; box-shadow: 0px 0px 4px 0 #e4dada;
    padding: 0px 10px;  border-radius: 8px;  line-height: 28px;  font-size: 13px; display: none;    width: 109px; text-align: center;}
.openside .sidenav li:hover .side_link_label{ display: block; }

.openside .sidenav .side_link_label:before{content: ''; position: absolute; top: 9px;left: -5px; width: 10px; height: 10px; background-color: #fff; transform: rotate(45deg);}
.notification .wndo{padding: 0 0 0 0; width: 410px;overflow: hidden;}
.ntsinfo{ border-bottom: 1px solid #f5f2f2; display: flex; flex-wrap: wrap; width: 100%;
    justify-content: space-between; padding: 14px; align-items: center;    transition: ease all 0.4s;}
.ntsinfo:hover{background: #f2f2f2;}
.ntsinfo .notification-figure{ width: 18px;}
.ntsinfo .nts-box{ width: 91%;}
.ntswrap{max-height: 60vh; overflow-x: hidden;  overflow-y: scroll; padding-bottom: 0; }
.sidenav .notification h3{    font-size: 18px;
    padding: 12px 15px;
    color: #000000;
    background: #e4e3ff; margin: 0;
    border-radius: 19px 19px 0 0; }

.ntsinfo .nts-box h5{ font-size: 14px; font-weight: 500; font-family: var(--secondry-font); margin: 0 0 4px 0;  padding: 0;}
.ntsinfo .nts-box p{line-height: 18px; margin: 0; font-size: 13px;  color: var(--textgrey);}

.openside .sidenav .logoIcon{display: block;margin: 0 0 20px 0; text-align: center;}
.openside .side-links >li,.openside .notify-check >li{ border: 0px;}
.openside .sidenav .applogo{display: none;}
.openside  .profile-link { margin-left: 0px; margin-top: 12px;}

.openside .side-links >li> a, .openside .notify-check >li>a,.openside .dropend{ justify-content: center;}
.openside #dropdown-basic{ margin: 0;}
.openside .up-link .dropend .dropdown-toggle::after{ display: none;}
.side-icon img{width: 25px;height: 22px;}
.side-icon svg{ height: 18px!important;}
.side-icon{width: 31px; transition: ease all 0.4s; justify-content: center;align-items: center;
    display: flex;}
.openside .side-icon { width: 37px; height: 37px; display: flex; border-radius: 100%;align-items: center; justify-content: center;}
.openside .side-links >li .dropend{ margin-left:2px;}
.openside .side-icon:hover { background:var(--naviconhover);}
.side-links , .notify-check { list-style: none; width: 100%; line-height:32px; padding: 0 0 0px 0; cursor: pointer; }
.side-links >li> a,.notify-check >li>a{text-decoration: none;color: var(--menu_font_color); width: 100%; display: flex; font-size: 14px; font-family: var(--font-family2);
    font-weight:500;}
.side-links >li.sd-link> a{ color: var(--primary_color);}
.side-links >li.sd-link> a svg path{fill: var(--primary_color);}
.openside .side-links >li.sd-link> a:hover svg path{fill:#fff;}
.side-links >li.acticity.sd-link> a svg path{fill: var(--primary_color); stroke:var(--primary_color);}
.side-links >li.acticity.sd-link> a svg circle{fill: var(--primary_color); }



.fts-button {    border-top: 1px solid #d7f1e7;}
.fts-button button{ background: none;  border: 0; width: 100%;  padding: 9px 0px;  font-weight: 400;  color: var(--primary_color);}
.chat_message_info_recieving.contacts{ width: 250px;}

.side-links >li,.notify-check >li{padding: 0 7px; justify-content: left;
    align-items: center; display: flex;flex-wrap: nowrap; width: 100%;}
.profile-sec button:focus{ box-shadow: none!important;}
.profile-sec button{width: 100%;background: no-repeat;display: flex; justify-content: left; font-size: 14px;
    color: #fff; border: 0px; align-items: center;}
.profile-sec  .dropend .dropdown-toggle::after{ display: none;}
.side-nav h4{color: #fff; font-size: 16px;padding-left: 12px; padding-bottom: 5px; font-family: var(--secondry-font);}
.openside .side-nav h4{ display: none;}

.side-nav{ display: flex; flex-wrap: wrap; width: 100%;align-content: space-between;     height: calc(100% - 57px);}
.profile-sec{list-style: none; width: 100%; margin: 0 0 70px 0; padding: 0;}
.profile-link{margin-left: 7px; margin-top: 12px;}
.profile-link>a{text-decoration: none;color: var(--menu_font_color);width: 100%;display: flex; justify-content: left; align-items: center;}
.profile-icon{background-color: var(--themebghovercolor); padding: 8px;border-radius: 100%;color: var(--menu_font_color); width: 39px; height: 39px; justify-content: center;  display: flex;font-weight: var(--fontweight); align-items: center;margin-right: 4px}

.side-links >li .dropend{display: block;width: 100%;}
.side-links >li .dropend .btn{padding: 0; margin: 0; width: 100%;display: flex; justify-content: left; align-items: center;border: 0; color: var(--menu_font_color); line-height: 40px; font-size: 14px; font-weight:500;}
.wndo {   box-shadow: #00000026 4.95px 5.95px 3.6px;font-family: var(--font-family2); list-style: none;  background-color: var(--navdropdown);padding: 22px 27px;line-height: 25px;  border-radius: 20px;}
.wndo a{font-size: 14px; color:var(--bodycolor); text-decoration: none;}
.wndo a:hover{ color: var(--primary_color);}
button:focus:not(:focus-visible) {box-shadow: none;}


.plans_app .s_bx .css-sc8y68-MuiInputBase-root-MuiOutlinedInput-root-MuiSelect-root{border-radius: 5px !important;    height: 46px;}


.bp_component{ overflow-x: hidden; padding: 25px;  margin-left: 165px; transition: ease all 0.4s;    width: 100%;}
.bp_component.crm-setting{    margin-left: 160px;    padding-right: 0;}
.openside .bp_component{ margin-left:60px;}
._sld{ background: var(--bs-white); padding: 22px 30px; border-radius: var(--fieldradius);  box-shadow:var(--shadow4);}
._sld span.num{display: block; color: var(--menu_fill_color); font-weight: var(--font-600);}
._sld span.nm{display: block;  font-weight: var(--font-600);}
._sld p{ margin-bottom: 24px;}
._sld p.m_lmit{margin-bottom: 5px; color: var(--fontlightcolor);font-size: var(--fontsize12);}
._sld.active{ background: var(--menu_fill_color); color: var(--bs-white);}
._sld.active p.m_lmit,._sld.active span.num{color: var(--bs-white);}
.ck_channels .slick-arrow{    position: absolute;  top: 46%; border: 0; text-indent: -9999px; width: 30px; height:30px; border-radius: 100%; background: #fff;    z-index: 3; box-shadow: 0px 1px 0px 2px rgb(0 0 0 / 8%);}
.ck_channels .slick-arrow:before{position: absolute; left: 8px; top: 10px; content: ''; width: 10px;
    height: 10px; border-top: 2px solid var(--menu_fill_color);border-left: 2px solid var(--menu_fill_color);transform: rotate(131deg);}
.ck_channels .slick-next.slick-arrow{right: 0;}
.ck_channels .slick-prev.slick-arrow{left: 0;}
.ck_channels .slick-prev.slick-arrow:before{transform: rotate(313deg); left: 12px;}
.slick-next.slick-disabled,.slick-prev.slick-disabled{ display: none!important;}
.ck_channels{ position: relative;}
.ck_head  h3{ display: inline-block; margin-right: 20px;font-weight: var(--font-700);}
    .ck_head  h3 svg{ color:var(--bodybgcolor)}
    .ck_head  select{background: var(--bs-white); padding:7px 10px; border-radius: var(--fieldradius);border: 1px solid var(--bordercolor); width: 180px; font-weight: var(--font-600);}
.ck_addnew a{ font-weight: var(--font-600); text-decoration: none; color: var(--menu_fill_color);
    display: flex; justify-content: flex-end; align-items: center;}
.ck_addnew a span{ width: 32px; background: var(--menu_fill_color); height: 32px;  border-radius: 100%;
    color: var(--bs-white);  justify-content: center; display: flex; align-items: center; margin-left: 14px; font-size: var(--fontsize20);}
.ck_head h3 svg {color: var(--textgreen); font-size: 23px; margin-right:4px;}
.v_btn{ background: var(--menu_font_color); border-radius: 10px;  color:var(--textblack); text-decoration: none; font-weight: var(--font-500); display: inline-block; padding: 5px 10px; box-shadow:var(--shadow5)}
.v_btn:hover{ background: var(--menu_fill_color); color: var(--bs-white);}

.status_dots{ width:10px; height: 10px; border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; display: inline-block;}




/* Dashboard new style start here */
.top_head_wrap p{ margin-bottom: 0; color: var(--bcolor);}
.ds_top_navar{  background: #fff; display: flex; justify-content: space-between; padding: 10px 20px; box-shadow: 0px 0px 5px 0px #ebebeb; margin-bottom: 20px; height: 50px; align-items: center;}
.char_box{background: #fff; padding: 10px; border-radius: 10px; box-shadow: 0px 0px 4px 0 #ebebeb;min-height: 240px;}
.comonboxcomponent{ padding: 0px 20px;}
.notes_reminder{background: #fff; border-radius: 10px; box-shadow: 0px 0px 4px 0 #ebebeb;}
.notes_and_reminder_head h2{ font-size:18px;}
.notes_and_reminder_head{ display: flex;justify-content: space-between;align-items: center;padding: 12px 20px;}
.c_table .cs_time{ padding:0; font-weight: 600;}
.c_table .cs_time input[type="checkbox"]{ margin-right: 5px;}
.c_table tr td{border-top: 1px solid #ebebeb; padding: 8px 10px;}
.c_table tr th{border-top: 1px solid #ebebeb; padding: 5px 10px;}
/* Dashboard new style end here */

/* Formbuilder form style start here */
.formbuilderapp{ display: flex;flex-wrap: nowrap;}
.formbuilde.ds-leads-converted{ background: #F0F1FF;}
._leads_num{ font-size:25px; font-family: var(--secondry-font); font-weight: 700;}
._leads_num span{ font-size: 13px; color: #0AAC6D; font-weight: 500;}
.ds-leads-converted p{ color: #555555;}
/* Dashboard new style end here */

/* Formbuilder form style start here */
.formbuilderapp{ display: flex;flex-wrap: nowrap;}
.formbuilder_sidebar { background: #fff;padding:20px 0 20px 20px; position: -webkit-sticky !important;
    position: sticky !important;
    bottom: 0;
    align-self: flex-end;
    width: 28%;  justify-content: center;
    display: flex;box-shadow: 0px 0px 12px 2px rgb(40 40 40 / 8%);
    overflow: hidden;height:100vh;}
.form-control,.form-select{padding: 9px 10px;}

.formbuilder_information{ width:52%;padding: 16px 25px;}
.formbuilder_preview{    position: -webkit-sticky !important;
    position: sticky !important;
    bottom: 0;
    align-self: flex-end;
    width: 20%; background: #fff;
    justify-content: center;
    display: flex;box-shadow: 0px 0px 12px 2px rgb(40 40 40 / 8%);
    overflow: hidden;height:100vh;}
.formbuildertbs{ display: inline-flex;list-style: none; padding: 0; margin: 0;gap:8px;}
.formbuildertbs li svg{ display: none; font-size: 11px;}
.formbuildertbs li.addtbs svg{ display: inline-block;}
.formbuildertbs li.active-tab svg{ display: inline-block;}
.formbuildertbs li.active-tab{margin-bottom: -1px;}
.formbuildertbs li{background: #fff;  cursor: pointer; border: 0; border-bottom: 0; border-radius: 8px 8px 0 0; text-align: center;  display: flex; justify-content: center;  align-items: center;
    color: #236BFE;  font-size: 14px; font-weight: 600;    padding: 7px 12px;}
    .formbuildertbs li span{ display: block;  padding: 8px 11px;}
.formbuildertbs li.active-tab{  background: #fff; color: var(--primary_color)}
.template_form_builder .css-13cymwt-control{    min-height: 44px;    border-color: hsl(0deg 0% 81.1%);}

.formbuildertbs2{ display: inline-flex;list-style: none; padding: 0; margin: 0;gap:8px;}
.formbuildertbs2 li svg{ font-size: 11px;}
.formbuildertbs2 li.active-tab svg{ display: inline-block;}
.formbuildertbs2 li.active-tab{margin-bottom: -1px;}
.formbuildertbs2 li{background: #fff; padding: 8px 11px; cursor: pointer;
    border: 1px solid #D3D3D3; border-bottom: 0; border-radius: 8px 8px 0 0;
    text-align: center; display: flex; justify-content: center; align-items: center;
    color: #929292; font-size: 14px;}
.formbuildertbs2 li.active{  background: #959BFF; color: #fff;}
.formbuildertbs2 li.active svg path{ stroke:white; fill:white}
.cbrs{ border: 1px solid #E2E4FF;  border-radius: 0px 6px 6px 6px;}
.formbuilder_content_box{ background: #fff; padding: 20px;    border-top: 1px solid #f2f3f6;border-radius: 0px 6px 6px 6px;}
.sd_sidewrap .sd_nav {padding: 10px 15px 11px 34px; border-radius: 4px;
    cursor: pointer; font-weight: 400; border: 1px solid #EBEBEB; position: relative;
    font-size: 13px; transition: ease all 0.4s; background: #FAFAFA; color: #111;}
.sd_nav_wrap {display: flex; width: 100%; flex-wrap: wrap; gap: 5px;}    
.sd_sidewrap .sd_nav_wrap .sd_nav{ width: 48%;}
.sd_sidewrap .sd_nav svg{position: absolute;  left: 7px;color: var(--themecolor); width: 20px; height: 20px;
    top: 9px;}
.sd_sidewrap .sd_nav:hover{background: #e1f7ee; border: 1px solid var(--bodylightbg); border-radius: 0px;}
.sd_search {position: relative;background: #ffffff;padding: 0;    border-radius: 7px; border: 1px solid #E8E8E8;
    margin: 0 15px 14px 0;}
.sd_search  svg{ top: 13px; position: absolute;  left: 13px;}
.sd_search input[type="text"] { border: 0; height: 40px; background: no-repeat; padding-left: 37px; font-size: 14px;
    width: 100%;}
.sd_sidewrap{ height: calc(100vh - 82px); overflow-y: scroll;}
.form_build_row{width: 95%;}
.form_build_app{display: flex; flex-wrap: nowrap; width: 100%; gap: 15px; justify-content: center;align-items: center;}
.form_build_row .form__group {margin-bottom: 16px;}
.input_heading{     font-weight: 500;
    font-size: 14px;    cursor: default;
    background: #FAFAFA;
    color: #000000;
    padding: 12px;
    position: relative;
    border: 1px solid #EDEDED;
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .form_build_app.footer_tab{ background: #D2D5FF; border-radius: 7px;}
   .form_build_app.footer_tab .form_build_row { width: 100%;}
   .form_build_app.footer_tab  .input_heading { background: #d2d5ff; border: 1px solid #EDEDED; border-radius: 8px 8px 0 0;}
 .form_build_app.footer_tab  .form__input { border: 1px solid #fff; border-radius: 12px; outline: none; background: #fff;}
 .form_build_app.footer_tab .form_build_row .form__group { margin-bottom: 0;}
 .form_build_app.footer_tab .form_build_cps{background: #d2d5ff;}

.tabs_action_btn button{ border: 0; background: none;  color: #9F9F9F;  padding: 0}
  .tabs_action_btn{  display: flex; gap: 10px;  align-items: center; justify-content: center;}
.tabs_action_btn button:hover{ color: #444;}
.input_heading.open{ border-radius: 8px 8px 0px 0px;}
.input_heading .toggle_btn{     background: url(../img/toggle_arrow.png) no-repeat 0px 7px; border: 0;text-indent: -9999px;  background-size: 12px;  width: 15px; cursor: pointer;}
.input_heading .toggle_btn._btn{transform: rotate(180deg);  top: 14px; }
.form_build_cps{    background: #fafafa;  border: 1px solid #ededed;padding: 24px; display: none; border-top: 0px;    border-radius: 0px 0px 8px 8px;}
.delete_row{ margin-left: 12px;}
.delete_row span{ transition: background-color 0.3s, transform 0.3s;  background: var(--bodylightbg); border: 1px solid #ccc;;
width: 40px;  height: 40px; display: flex; justify-content: center;align-items: center; border-radius: 100%;}
.delete_row span:hover{ background: #fff;}
.form_build_cps.show{  display: block;}
.required_form_option{ text-align: right;font-size: 13px;}
.required_form_option button{border: 0px; padding: 2px 8px; border-radius: 30px; font-weight: 600;}
.selection_input_category{ font-weight: 600; font-size: 14px; margin:32px 0 14px 0;color: var(--menu_fill_color);}
.required_form_toggle{display: flex; justify-content: center;}
.required_form_toggle .form-check-label{ font-size: 13px; color: #FF6565;}
.ckk__ .form__group{ margin-bottom: 0px!important; width: 100%;}
.ckk__{ display: flex; width: 100%; justify-content: space-between;align-items: center;    gap: 8px;}
._dltw button{  border: 0px; background: no-repeat;} 
.add_option_btn{border: 0; background: no-repeat; display: flex;justify-content: left; align-items: center;
    gap: 4px; color: #236BFE; font-weight: 600; font-size: 14px;}

.form-check-input:checked { background-color: var(--primary_color); border-color: var(--primary_color);}
tr.deactivated_row {opacity: 0.5;}
.formbuilder_preview_box{padding: 0 8px; font-size: 13px;width: 100%;    overflow-y: scroll;}
.formpreview_wrap{background: #b2b2b2;position: relative; padding-top: 27px; border-radius: 12px; box-shadow: 0px 0px 3px 8px #e6e6e6;}
.formpreview_content{background: #fff; border-radius: 12px;position: relative; z-index: 1;}
.formpreview_wrap:before{width: 32px;height: 32px;background: #147643;position: absolute;left: 20px; top: 11px; content: ''; border-radius: 100%;}
.pre_screen{text-align: center; padding: 10px; border-bottom: 1px solid #eff1f3; font-size: 14px; font-weight: 500;}
.formpreview_info{ padding: 15px;max-height: calc(100vh - 131px);  overflow-y: scroll;min-height: 350px;}
.formpreview_info h1{font-size: 20px; font-weight: 700;}
.formpreview_info > h2{font-size: 15px; color: #474545; font-weight: 600;}
.frmbdtx{display: flex;flex-wrap: wrap; gap: 2px;}
.frmbdtx p{     color: var(--text-color); margin: 0;}
.b_caption{ color: var(--textgrey); font-size: 11px;}

.formbuilder_preview_box > h2{ font-size: 18px; color: var(--menu_fill_color);margin:14px 0px 10px 0;padding-bottom: 6px;}
.formbuilder_preview_box .form__group {margin-bottom: 15px;}
.pre_drop {display: flex; flex-wrap: wrap; width: 100%;}
.pre_drop h4{ font-size: 14px; font-weight: 600; margin-bottom: 10px;}
.pre_drop label{font-weight: 400;display: flex;  width: 100%; justify-content: space-between;
    color: var(--textgrey);}
.pre_drop .fieldtext{ width: 100%; border: 1px solid #e7e5e5; padding: 5px;border-radius: 3px;}
.option_in_check input[type="checkbox"],.pre_drop input[type="radio"]{ margin-right: 4px;}
.option_in_check span{ line-height: 16px; }
.f_{ width: 100%;}
.preview_text_area textarea{ width: 100%; height: 80px; line-height: 17px; padding: 4px; border: 1px solid #ccc;}
.main_submit_btn{width: 100%; position: fixed; bottom: 0;
    background: #eef3f1; padding: 6px 0px; z-index: 23; gap: 4px;
    display: flex; justify-content: center;}
.--primary_color_default{  width: 100%;border: 0px;padding: 4px;border-radius: 30px;font-weight: 600;}
.align_ { display: flex; justify-content: left; align-items: center; gap: 8px;}
.sdc{ width: 150px; padding:6px 8px; font-size: 13px; border:1px solid #d9d9d9; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
/* Formbuilder form style end here */

.textarea1{ display: block;width: 100%; height: 80px; line-height: 17px; font-size: 14px; font-weight: 400; border: 1px solid #E8E8E8; border-radius: 8px; padding: 12px;}
.channels-tab-content .formfield{ margin: 0;}
.chat_assignedbx select{width: 147px;}
.dd_select { background: none;  overflow: hidden; border: 1px solid #E8E8E8!important;  border-radius: 5px;
    font-size: 14px;  padding: 9px 10px; width: 177px; text-align: left;}
    .dd_select.dropdown-toggle::after {display: inline-block;
    background: #fff url(/images/img/caret_drop.png) right no-repeat;
    margin-left: 0;
    vertical-align: 0;
    content: "";
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    position: absolute;
    right: 1px;
    top: 10px;
    width: 22px;
    height: 20px;
}


.chat_assignedbx  .dropdown-menu { min-width: 100%;  padding: 0; margin: 0; font-size: 13px;  background-color: #fff; border: 1px solid #E8E8E8;
    border-radius: 6px;}

.chat_assignedbx  .dropdown-menu  .dropdown-item.active,.chat_assignedbx  .dropdown-menu  .dropdown-item:active {
    color: #111;  text-decoration: none;  background-color: #f2f2f2;}

.dd_select:hover,.dd_select:focus,.dd_select:active{background: none!important;  border: 1px solid #E8E8E8!important; box-shadow:none!important}    
.ck_top_head {background: #fff;padding: 5px 29px;box-shadow: 0px 0px 19px 0px rgb(0 0 0 / 6%);margin-bottom: 25px;}
.ck_top_head h1{ font-size: 31px; margin: 0px;padding: 0;font-weight: 600;color: var(--menu_fill_color);}
.ck_top_head p{padding: 0;margin: 0 0 4px 0; font-size: 13px;}
.section_wrap{ padding: 0 30px;}
.custom_table{background: #fff; border-radius: 10px;box-shadow: 0px 0px 4px 0px rgb(0 0 0 / 8%);}
._tbl{caption-side: bottom; border-collapse: collapse; background: #fff;
    overflow: hidden; border-radius: 8px;}
._tbl thead th{font-size: 14px; padding: 14px 14px;font-weight: 500; font-family: var(--secondry-font); background:var(--secondry_color);}
._tbl td { font-size: 14px;  padding: 8px 14px;  border-bottom: 1px solid #F3F3F3; font-family: var(--primary-font);
    color: var(--textgrey);}
._tbl thead{ background: #f9f9f9; border-radius: 30px; overflow: hidden;  width: 100%;}
._tbl tbody tr:hover{background: #f9f9f9;}
.d_b4.odd{ background:var(--lightgreen);}
.d_b4.even{ background:var(--lightblue);}
._white_bg{ background: #fff;}
.d_b4 { padding: 20px;margin: 9px 0px;}
.d_b4 h3{ font-size: 14px; font-weight: 500;}
.d_b4 p{ font-size: 14px; color: var(--textcolor); margin-bottom: 0;line-height: 19px;}
.d_b4 figure{    margin: 0 0 9px 0;}
.h2_heading h2{ font-size: 20px; font-weight: 500;}
._dashboard_video{ height: 100%; display: flex; flex-wrap: wrap; align-content: space-around;}
.primary_btn{ width: 100%; display: flex;  justify-content: center;}
.primary_btn a{ background: #F3F4FD; display: inline-block; padding: 10px 20px;  color: #1E2A38;
    text-decoration: none; }
.primary_btn a:hover{ background:var(--lightgreen)}
.--primary_color4{color: var(--primary_color);  display: inline-block; padding: 10px 20px;
    text-decoration: none; border: 1px solid; font-weight: 600;}
.--primary_color4:hover,.--primary_color4.active_{ background: var(--primary_color); color: #fff;}
.plansoffer{background: url(/images/img/diamond_icon.png) no-repeat 0px 0px;font-size: 26px; line-height: 24px;
    padding-left: 52px;}
.tick_connected{background: url(/images/img/greentick_circle.png) no-repeat 2px 2px;border: 1px solid; padding: 7px 20px 7px 45px; border-radius: 30px; color: #12BF7D; font-size: 16px;
    font-weight: 600;}
.plansoffer span{color: #555555; font-size: 15px;}
.listdata{ list-style: none;}
.listdata li{ color: #444444; margin:13px 0px; position: relative; padding-left: 34px;}
.listdata li img{ position: absolute; left:0; top: 0; width:18px;}
._new { list-style: none;}
._new li{position: relative; padding-left:35px; display: flex; justify-content: space-between;
    line-height: 19px; margin:7px 0px;}
._new li>div{width: 81%;}
._new li strong{font-weight: normal; color: #B6B6B6;}
._new li:before{width:10px; height: 10px;  content: ''; position: absolute; left: 0;
    top: 6px; border-radius: 100%;}
._new li:nth-child(1):before{ background: var(--swatch1);}
._new li:nth-child(2):before{ background: var(--swatch2);}
._new li:nth-child(3):before{ background: var(--swatch3);}
._new li:nth-child(4):before{ background: var(--swatch4);}
._new li:nth-child(5):before{ background: var(--swatch5);}
.wop{ background: #F0F1FF; height: 100%;}
.wop ul{ list-style: none; margin: 0; position: relative;}
.wop ul:before{background: url(/images/img/dotted__.png) top repeat-y; position: absolute;
    left: 0; top: 19px; content: '';width: 3px; height: 89%;}
.wop ul li{ position: relative;  padding-left: 30px;line-height: 17px; color: #1E2A38;}
.wop ul li.t1{ padding-bottom:149px;}
.wop ul li.t2{ padding-bottom: 30px;}
.wop ul li:before{width: 22px; height: 22px; background: #768393; position: absolute;left: -10px; top: -1px; content: ''; border-radius: 100%;border: 3px solid #f0f1ff;}
.wop ul li.active{font-weight: 600;}
.wop ul li.active:before{background: #1E2A38;border: 3px solid #fff;}
.mdts{ list-style: none;}
.mdts li{margin: 15px 0px 0 0;display: flex; justify-content: left; align-items: center;}
.mdts li img{ margin-right: 9px;}
.dt_na{ display: flex; gap: 10px;}
.dt_na .date_,.dt_na select{ border: 1px solid #e9e9e9; background: #f8f8ff; font-size: 12px; padding: 10px; border-radius: 4px;}
.epr { font-style: italic;  margin-right: 12px;}
.wts__ svg{font-size: 30px; color: var(--primary_color);  margin-right: 10px;}
.qlty{ padding-left: 15px; position: relative;}
.qlty:before{width: 8px;  height: 8px; background: var(--primary_color);  content: '';
    position: absolute; left: 0; top: 7px;border-radius: 100%;}
 .add_channel a   {border: 2px dashed #CFCDFF;text-decoration: none; display: inline-block; justify-content: center;align-items: center;padding: 24px 20px;}
 .add_channel a:hover{ background: #CFCDFF; color: #111;}
 .verified_bx{background: #F0F1FF; border-radius: 8px 8px 0 0;  padding: 20px 20px 15px 20px;}
 .progress_round_circle  .css-1p8xyck-MuiGauge-container{ height: 56px!important;}
 .verified_bx ul{ list-style: none; padding: 0; margin: 0; display: flex; justify-content: space-between; position: relative;}
 .verified_bx ul li{line-height: 19px; position: relative; padding-top: 18px;}
 .verified_bx ul:before{background: url(/images/img/dotted_2.png) repeat-x; width: 100%; height: 2px; content: '';  position: absolute; left: 0;}
 .verified_bx ul li::before{    background: var(--bcolor); position: absolute; left: 0; top: -6px;  width: 15px; height: 15px; content: '';
    border-radius: 100%;}
    .verified_bx ul li:nth-child(2):before{left: auto; right: 0;}
    .list__a{ list-style: none;}
    .list__a li{     background: url(/images/img/tickmark2.png) no-repeat;
        padding-left: 28px;
        margin-bottom:7px;}
        .fb_verification { margin-bottom: 5px;}
    .fb_verification  a.fb{background: #236BFE;color: #fff;padding: 9px 15px;display: inline-block;border-radius: 8px;text-decoration: none;font-size: 14px;font-weight: 500;}
.help__ svg{ color: #FF0000; font-size: 22px; margin-left: 8px;}
.ds_table table{ width: 100%;}
.ds_table table tr th{font-size: 13px; color: var(--bcolor);  padding: 8px;  border-bottom: 1px solid #e5e5e5;}
.ds_table table tr td{font-size: 13px; color: #666666;  padding: 12px 11px; }
.ds-td-row-content label{ padding-left: 29px; position: relative;}
.ds-td-row-content label .form-check-input{ width: 20px; height: 20px; position: absolute; left: 0;}
.ds-list-nm span{  width: 23px; height: 23px; display: inline-flex; text-align: center;  justify-content: center; align-items: center; border-radius: 100%;
    color: #fff; margin-right: 6px;}
.ds-list-nm strong{ font-weight: 400;}
.usr1{background: var(--swatch-red);}
.usr2{background: var(--swatch-pending);}
.usr3{background: var(--swatch-green);}
._t1{color: var(--swatch-red);}
._t2{color: var(--swatch-pending);}
._t3{color: var(--swatch-green);}
.w-55{ width: 55%;}
.theme_button_fill{background: var(--primary_color); padding: 10px 20px; text-decoration: none; border: 1px solid; font-weight: 600; color: #fff; display: inline-flex
; justify-content: center; align-items: center; gap: 5px;    font-size: 16px;}
.theme_button_fill:hover{ color:#fff; }
.login-legacy{
    border: 1px solid #E3E2FF;
    text-decoration: none;
    padding:10px 40px 10px 20px;
    color: #7672FF;
    font-size: 14px;
    position: relative;
    font-weight: 500;
    border-radius: 10px;
}
.login-legacy:hover{ color: #7672FF;}
.login-legacy:before{background: url(../img/right-btn-arrow.png) no-repeat; width: 12px; height: 12px; content: ''; position: absolute; right: 21px; top: 50%; transform: translateY(-50%);}
/* Dashboard style end here */

.field_ms{  width: 40px;   border: 1px solid #ccc;  height: 31px;  border-radius: 5px;  text-align: center;  padding: 4px;}

/* Pricing plan style start here */
.top_head_wrap  h1{ font-size: 18px; font-weight:500; font-family: var(--secondry-font); color: var(--themecolor);}
.custom_nav .nav-tabs .nav-link{background: no-repeat; border: 0; font-family: var(--secondry-font);    padding: 9px 11px; font-size: 16px; color: var(--bcolor); position: relative;}
.custom_nav .nav-tabs .nav-link.active{ color: var(--primary_color); font-weight: 600;}
.custom_nav .nav-tabs .nav-link.active svg path{ stroke: var(--primary_color);}
.custom_nav .nav-tabs .nav-link.active:before{width:100%; height: 2px;background:var(--primary_color); position: absolute; bottom: 0; left: 0; content: '';}
.custom_nav .nav-tabs {border-bottom: 1px solid #e6e6e6;}
.secondary_price_nav .nav-tabs{border: 0px; width: auto; display: inline-flex; background: #fff;
    border-radius: 30px; overflow: hidden;}
.secondary_price_nav .nav-tabs .nav-link{background: no-repeat; border: 0; font-family: var(--primary-font);
        font-size: 13px; color: var(--bcolor); position: relative; padding: 9px 33px;}
.secondary_price_nav .nav-tabs .nav-link.active{ background: var(--primary_color); color: #fff;    border-radius: 30px; font-size: 14px;}
.bp_plans_list{width: 100%; display: flex; gap: 10px;margin-bottom: 30px;}
.bp_plans_list .bp_plans_bx {
    width: 32%;
    border: 1px solid #E4E4E4;
    background: #fff;
    cursor: pointer;
    align-content: flex-start;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 30px;
    position: relative;
}
.bp_plans_list .bp_plans_bx.selecetd {color: #1d1766}
.bp_plans_list .bp_plans_bx.active {color: #074c32}
.bp_plans_list .bp_plans_bx.upcoming {color: #604d14}

.bp_plans_head{width: 100%;padding: 20px;}
.bp_plans_name h3{ margin: 0; font-size: 18px; font-family: var(--primary-font);}
.bp_plans_name h3 img{ margin-right: 6px;}
.bp_plans_name{display: flex ;  justify-content: space-between;margin-bottom: 20px;}
.bp_price{margin-bottom: 30px;font-size: 27px;font-weight: 700;}
.bp_price span{font-size: 17px; font-weight: 500; color: var(--dcolor);    margin-left: 4px;}
._bp_2 a{border: 1px solid #E4E4E4; background: #fff;text-align: center; padding: 9px; border-radius: 8px;
    font-size: 13px; display: block;color: var(--bcolor);text-decoration: none;}
._bp_2 a:hover{border: 1px solid #111}
.bp_plans_bx{transition: ease all 0.4s; -webkit-transition: ease all 0.4s; -moz-transition: ease all 0.4s; -ms-transition: ease all 0.4s; -o-transition: ease all 0.4s;}
.bp_plans_items{ list-style: none; margin: 0;  }
.bp_plans_items li{    background: url(/images/img/tickmark3h.png) no-repeat; padding-left: 23px;
    font-size: 13px; color: #1E2A38;  margin: 9px 0px; line-height: 15px;}
.bp_plans_bx:hover li,
.bp_plans_list .bp_plans_bx.active li,
.bp_plans_list .bp_plans_bx.upcoming li
.bp_plans_list .bp_plans_bx.default li
{
    background: url(/images/img/tickmark3.png) no-repeat;
}

.bp_plans_bx.selected,
.bp_plans_bx:hover
{
    background: #ecebff;
    border: 1px solid #4A3AFF;
}
.bp_plans_list .bp_plans_bx.upcoming
{
    background: #fdf8ea;
    border: 1px solid #d8ae2d;
}
.bp_plans_list .bp_plans_bx.active
{
    background: #e7f8f2;
    border: 1px solid #12bf7d;
}
.buynow_plan {
    width: 100%;
    padding: 0 12px;
    position: absolute;
    left: 0; display: none;
    bottom: -18px;
}
a.buynow_btn {
    text-align: center;
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    padding: 10px;
    border-radius: 8px;
    background-color: #4A3AFF
}
a.buynow_btn {background-color: #4A3AFF}
a.buynow_btn:hover {background-color: #3426d4;}
a.buynow_btn.active {background-color: #12bf7d}
a.buynow_btn.active:hover {background-color: #10ab70}
a.buynow_btn.upcoming {background-color: #d8ae2d}
a.buynow_btn.upcoming:hover {background-color: #c09b28}

.ppl{ background: #dedeff;  color: #7672FF; border: 1px solid #8582ff; display: inline-block;
    padding: 2px 7px;  font-size: 13px;font-weight: 500;  border-radius: 5px;}

.bp_plans_bx:hover .buynow_plan,
.bp_plans_list .bp_plans_bx.selected .buynow_plan,
.bp_plans_list .bp_plans_bx.active .buynow_plan,
.bp_plans_list .bp_plans_bx.upcoming .buynow_plan
{
    display: block;
}
.floating_price_strip{border-top: 1px solid #e6e3e3; position: fixed; bottom: 0; background: #fff; z-index: 1; padding: 10px; width: 100%; margin-left: -26px; display: flex; justify-content: space-between; padding-right: 229px; box-shadow: 0px 0px 4px 0px hsl(0deg 0% 0% / 9%);    align-items: center;}
    .floating_price_strip   a.buynow_btn{ padding: 10px 100px;}
.__pns{ font-size: 13px;}
.theme_modal .modal-content { border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.modal-head{ padding: 11px 15px; border-bottom: 1px solid #F4F4F4; justify-content: space-between;
    align-items: center;  display: flex; font-size: 16px; font-family: var(--secondry-font);
    font-weight: 500;}
    .selectfield.height-80{ height: 80px;}
.theme_modal  .btn-close {    width: 11px;
    background-size: 9px;
    background-color: #E5E5E5;
    border-radius: 100%;
    height: 11px;
    position: absolute;
    right: 15px;
    top: 9px;}
    .modal-header .btn-close {
    padding: .5rem .5rem;
    margin: 0;
}
.theme_modal .modal-header{padding: 11px 20px;
    border-bottom: 1px solid #F4F4F4;
    justify-content: space-between;
    align-items: center;
    display: flex;
    font-size: 16px;
    font-family: var(--secondry-font);
    font-weight: 500;}
.theme_modal .modal-header .h4{ font-size: 18px;}
.payment_bx{background: #f2f2f2; padding: 14px; border-radius: 7px;}
.payment_bx2{ background: #fff;  padding: 14px 16px; border-radius: 7px; margin-bottom: 2px;}
.pp_plan_head{     background: url(/images/img/ic_a.png) no-repeat 15px 18px;
    background-color: #dddefd;
    padding: 20px 20px 20px 63px;
    border-radius: 8px 8px 0 0;
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;}
    .pp_plan_head strong  {display: block;font-weight: 400;font-size: 14px;color: var(--bcolor);}
    .pp_plans_info{
        background: #f6f7fb;
        padding: 12px;
        border-radius: 0px 0px 8px 8px;
        border: 1px solid #f4f4f4;
        border-top: 0;
        -webkit-border-radius: 0px 0px 8px 8px;
        -moz-border-radius: 0px 0px 8px 8px;
        -ms-border-radius: 0px 0px 8px 8px;
        -o-border-radius: 0px 0px 8px 8px;
}
  .sv_bx span{color: #0AAC6D;font-size: 13px;}
  .sv_bx span.cross_price  { color: var(--bcolor);text-decoration: line-through;}
.pp_plans_list li{display: flex;justify-content: space-between;
        font-size: 15px;margin: 5px 0px;font-weight: 600;}
.pp_plans_list li.gst{ color: var(--bcolor); font-size: 13px;font-weight: 400;}
.pp_plans_list.hrline{border-bottom: 1px solid #D9D9D9; padding-bottom: 5px; margin-bottom: 12px;}
.cmpt_btn button{
    background: #4A3AFF;
    display: block;
    width: 100%;
    border: 0;
    color: #fff;
    padding: 10px;
    border-radius: 8px;
    font-weight: 500;
}
.cmpt_btn button img{ margin-right: 6px;}
.plans_form_detail{ border: 1px solid #EBEBEB; padding: 20px; border-radius: 8px;}
.plans_app h3{ font-size: 14px; font-weight: 600; margin: 0 0 11px 0px;}
.formfield{border: 1px solid #E8E8E8; border-radius: 8px; width: 100%; padding: 12px; font-size: 14px; margin: 6px 0px;}
.add-weblink .formfield{border: unset;}
.add-weblink{ border: 1px solid #E8E8E8; border-radius: 8px; overflow: hidden;}
._xl .modal-lg {  max-width: 940px;}
select.formfield{  -webkit-appearance: none; position: relative; background:url(/images/img/caret_drop.png) right no-repeat;}
.apply_cpn_code button{position: absolute; right: 10px; background: no-repeat; border: 0;
    font-weight: 600; top: 17px;}
.apply_cpn_code button:hover{ color: #4A3AFF;}
.plansapp{ margin-bottom: 120px;}
.bgwhite{ background: #fff;}

.MuiInputLabel-formControl{ background: #fff!important; padding: 0 5px!important;}
.create_search_filter { background: #fff; padding: 12px; border-radius: 0 0 6px 6px;}
.create_search_filter .MuiInputBase-formControl,.s_bx .MuiInputBase-formControl{ background: #ffffff; padding: 1px 8px;
    border-radius: 10px; font-size: 14px; font-weight: 500; color: #888888;}
.create_search_filter .css-w76bbz-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input,.s_bx .css-w76bbz-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input{    padding:11px 14px;font-size: 13px;font-family: 'DM Sans';}

.create_search_filter .MuiFormLabel-colorPrimary, .s_bx .MuiFormLabel-colorPrimary{font-size: 14px;font-family: 'DM Sans';  top: -5px;  }
.create_search_filter .MuiInputLabel-shrink, .s_bx .MuiInputLabel-shrink{ top:1px!important;}

.create_search_filter .css-sc8y68-MuiInputBase-root-MuiOutlinedInput-root-MuiSelect-root,.s_bx .css-sc8y68-MuiInputBase-root-MuiOutlinedInput-root-MuiSelect-root{border-radius: 12px !important; background:#fff;}
.time-zone{ text-align: right; font-size: 13px; color: var(--textcolor);}
.logout_btn{     background: no-repeat;
    border: 0;
    color: #888888;
    font-weight:500;}
    .logout_btn:hover{ color: #111;}
.verify-emails .theme_btn{ width: auto;padding: 7px 24px;}
.error_message{color: #4d1414 !important;background: #fceaea; font-size: 11px; display: block;
    padding: 2px 7px; border-radius: 4px; margin-top: 4px; border: 1px solid #ecd8d8;}
.search_input{ width: 100%; height: 45px; border: 1px solid #E6E6E6; padding: 10px 15px; font-size: 14px; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.inputfield{ width: 100%; height: 45px; border: 1px solid #E6E6E6; padding: 10px 15px; font-size: 14px; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.w_8{ width: 110px!important;}

.create_search_filter .MuiMenu-list li{ font-size: 13px!important;}
.srd a{ text-decoration: none; color: var(--dcolor);}
.formbuilder_info{ width: 100%;}

._tbl_content_wrap{width: auto;display: flex;justify-content: left;align-items: center;}
._tbl_content_wrap figure{ margin: 0; width: 70px;}
.tbl_flex{ width: 425px;}
#myBotContent .template-list-table table tr th:nth-child(3){width: 225px;}
#myBotContent .template-list-table table tr td span{ display: block;}
.template-list-table table tr th:nth-child(4),.template-list-table table tr th:nth-child(5),
.form-list-table table tr th:nth-child(3),.form-list-table table tr th:nth-child(4),.form-list-table table tr th:nth-child(5),.form-list-table table tr th:nth-child(6){ text-align: center;}
.template-list-tbl-first h3{font-size: 14px; font-weight: 500; margin: 0 0 3px 0; padding: 0;}
.template-list-tbl-first h3 a{ color: #000; text-decoration: none;}
.template-list-tbl-first span{display: block; font-weight: 400; color: var(--textgrey); font-size: 12px;}
.tbl_type { color: var(--dcolor); font-size: 14px; margin-bottom: 4px;}
.template-list-tbl-first{ padding-left: 40px; position: relative;}
.status__circle{width:7px; height:7px; border-radius: 100%; background: #12BF7D;
    left: 14px; position: absolute; top: 50%;margin-top: -5px;}
.status__pending{width:7px; height:7px; border-radius: 100%; background: #D89B24;
    left: 14px; position: absolute; top: 50%;margin-top: -5px;}
.status__rejected{width:7px; height:7px; border-radius: 100%; background: #F60032;
    left: 14px; position: absolute; top: 50%;margin-top: -5px;}
.action_td a{width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; border-radius: 100%;color: var(--textgrey); }
.action_td {justify-content: center; align-items: center; display: flex;}
.action_td a:hover{background: #ddd; color: #111;}
.action-edit ul li{ font-size: 13px;}
.action-edit ul li svg{ margin-right: 4px;}
.action-edit ul{ padding: 0;}
.campaign-delivery-progress { border: 1px solid #f2f2f2; padding: 12px;
    border-radius: 11px;}
 .campaign-delivery-progress   .total_contact_progress span { font-size: 12px; font-weight: 400; width: 170px;}

.exp_btn{ background: #F2FFFA; border: 1px solid #CCFFEC; width: 40px; height: 40px;
    border-radius: 100%; display: flex; justify-content: center; align-items: center;}
.exp_btn:hover{background: #CCFFEC;}   
.ttfromfill{ border: 1px solid #E8E8E8; display: inline-block; padding: 6px 15px; border-radius: 30px; background: #F6F6F6;} 
.rts ul{display: flex; gap: 13px;list-style: none;padding: 0;margin: 0;}
.rts  ul li{ position: relative; padding-left: 16px;font-size: 14px;}
.rts  ul li.approved{ color: var(--approved);}
.rts  ul li.pending{ color: var(--pending);}
.rts  ul li.rejected{ color: var(--rejected);}
.rts  ul li:before{width: 8px; height: 8px; left: 0; content: '';  position: absolute; top: 7px; border-radius: 100%;}
.rts  ul li.approved:before{ background: var(--approved);}
.rts  ul li.pending:before{ background: var(--pending);}
.rts  ul li.rejected:before{ background: var(--rejected);}
.pagination__{ text-align: left;}
.pagination{margin: 0; background: #fff; display: inline-flex; border-radius: 30px;box-shadow: 0px 0px 3px 0px #d3d3d3;}
.pagination .page-link {position: relative; display: block; color: #3a3a3a;text-decoration: none; background-color: transparent; border: 0;padding: 4px 7px;font-size: 14px;}
.pagination .page-link:focus{ box-shadow: none;}
.pagination .page-link.active{ color: var(--primary_color); font-weight: 600;}


.sync_ a {
    background: url(../img/sync_icon.png) no-repeat;
    display: inline-block;
    color: var(--dcolor);
    font-size: 14px;
    background-size: 20px;
    padding-left: 27px;
    text-decoration: none;
    font-weight: 600;
}
.sync-icon {
    background: url(../img/sync_icon.png) no-repeat;
    color: var(--dcolor);
    font-size: 14px;
    background-size: 20px;
    text-decoration: none;
    font-weight: 600;
    width: 20px;
    height: 20px;
}
.btn-close{ position: absolute; right: 8px; font-size: 9px;background-color: #E5E5E5;
    color: #111; padding: 8px; border-radius: 100%; top: 10px;
    cursor: pointer; z-index: 12;}
.creating_list {background: #faf9ff;padding: 40px 23px 20px 23px;width: 25%;border-right: 1px solid #f1f2f2;}
.typeoftmp{ width: 75%; padding: 40px 20px;}
.creating_list h3{font-size: 16px;font-family: var(--secondry-font);
    font-weight: 500;color: #000;position: relative;padding-left: 16px;}
.creating_list h3:before{ width: 5px; height:5px; left: 0; background: var(--approved);
    content: '';  position: absolute; top: 7px; border-radius: 100%;}
.creating_list h4{ font-size: 16px; font-family: var(--secondry-font); font-weight: 500; color: #4D4D4D;}
.creating_list ul{ list-style: none; padding: 0;}
.creating_list ul li{display: flex; justify-content: left;align-items: center;font-size: 14px;margin: 16px 0px; color: #4D4D4D;}
.creating_list ul li figure{ width:30px; margin: 0;}
.modal_  .modal-content{border-radius: 10px; overflow: hidden;}
.typeoftmp h3{font-size: 16px;font-family: var(--secondry-font);
    font-weight: 500;color: #000;position: relative;}
.type_items{padding: 0; list-style: none;  margin: 0; display: flex; flex-wrap: wrap; gap:24px;}
.type_items li{width: 31%;  padding: 21px 13px; text-align: center;border-radius: 12px; cursor: pointer;}
.type_items li h4{font-size: 16px;font-weight: 500;}
.type_items li p{ font-size: 13px; color: var(--dcolor);}
.type_items li:nth-child(1){ border: 1px solid #FFE4EB; background:#FFFBFC;}
.type_items li:nth-child(2){ border: 1px solid #FFF1BC; background:#FFFBED;}
.type_items li:nth-child(3){ border: 1px solid #D4F5F5; background:#FAFFFF;}
.type_items li:nth-child(4){ border: 1px solid #F1E7FE; background:#F9F4FF;}
.type_items li:nth-child(5){ border: 1px solid #D1E0DA; background:#F3FFFA;}
.border-none{   border: 0px!important;}
.type_items li.active:nth-child(1){box-shadow: 0px 0px 8px 4px #fde0e7;  border: 1px solid #e5a3b4;}
.type_items li.active:nth-child(2){box-shadow: 0px 0px 8px 4px #fff2c3;  border: 1px solid #fff0b8;}
.type_items li.active:nth-child(3){box-shadow: 0px 0px 8px 4px #e4f8fb;  border: 1px solid #d3faff;}
.type_items li.active:nth-child(4){box-shadow: 0px 0px 8px 4px #ebdbff;  border: 1px solid #e7d6ff;}
.type_items li.active:nth-child(5){box-shadow: 0px 0px 8px 4px #D1E0DA;  border: 1px solid #D1E0DA;}
.modal_heading {font-size: 16px;  font-family: var(--secondry-font);  font-weight: 500;
    color: #000;  position: relative;}
.modal-header  p{ color: #545454; font-size: 14px;}
.form_field{width: 100%;padding: 7px 10px 8px;border-radius: 5px;border: 1px solid #e6e6e6;font-size: 14px;}
.create_campaign_tabs{    list-style: none;
    margin: 0;  display: flex;  justify-content: space-between;
    font-family: var(--primary-font);  font-size: 14px;
    color: #9C9C9C;  border-bottom: 1px solid #E8E8E8; padding: 21px 14px;}
.create_campaign_tabs li { position: relative; cursor: pointer;}
.create_campaign_tabs li strong{ border: 1px solid #DEDEDE; background: #fff; width: 30px; text-align: center; height: 30px; display: inline-flex; border-radius: 100%; justify-content: center; align-items: center;
    margin-right: 5px; font-weight: 700; font-size: 16px;}
.create_campaign_tabs li:before{width: 48px;background: #D9D9D9;height: 1px;  content: '';position: absolute;right: -56px;top: 15px;}
.create_campaign_tabs.ms3 li:nth-child(4):before{ display: inline-block;}
.create_campaign_tabs li:nth-child(4):before,.create_campaign_tabs.ms3 li:nth-child(5):before{ display: none;}
.create_campaign_tabs li.active{ color: #7672FF;}
.create_campaign_tabs li.active strong {  border: 1px solid #7672FF; background: #7672FF;color: #fff;}
.create_campaign_tabs li.done{ color:var(--primary_color);}
.create_campaign_tabs li.done strong { position: relative;  border: 1px solid var(--primary_color); background: var(--primary_color);color: #fff;    text-indent: -9999px;}


.create_campaign_tabs li.done strong:before{ position: absolute;
    top: 12px;
    height: 8px;
    width: 2px;
    background-color: #fff;
    content: "";
    transform: translateX(5px) rotate(-45deg);
    transform-origin: left bottom;
    left: 5px;}
.create_campaign_tabs li.done strong:after{    position: absolute;
        left: 5px;  bottom: 7px;   height: 2px;    width: 16px;
        background-color: #fff;     content: "";     transform: translateX(6px) rotate(-45deg);
        transform-origin: left bottom;}
 .create_campaign_tabs li.done:before {background: var(--primary_color);}
 .opt_bx.inlines input[type="radio"]+label{display: flex; justify-content: left;
    align-items: center; min-height: auto;background-color: #fff; padding: 19px 12px;}
.opt_bx.inlines h3{margin: 0 0 0 8px;}
.opt_bx.inlines .brd {top: 50%;margin-top: -10px;}

.radiobtn input[type="radio"]+label{display: flex ; justify-content: left; align-items: center;min-height: auto;background-color: #EEEEEE;
        padding: 10px 19px;border-radius: 12px;font-weight: 500;cursor: pointer;}
.radiobtn input[type="radio"]:checked + label{ border:0; background: var(--bluecolor); color: #fff;}




.selectbox{
    -webkit-appearance: none;
    position: relative;
    background: #fff url(/images/img/caret_drop.png) right no-repeat;
    color: #111;
    width: 100%;
    font-size: 14px;
    font-family: var(--primary-font);
    border: 1px solid #E8E8E8;
    border-radius: 7px;
    height: 46px;
    padding: 10px 25px 10px 10px;
}
.selectbox_sm{-webkit-appearance: none;   position: relative; background: #F6F6F6 url(/images/img/caret_drop.png) right no-repeat;color: #111; width: 100%; font-size: 13px; font-family: var(--primary-font);
    border: 1px solid #E8E8E8; border-radius: 12px;  padding: 7px 13px;}

.selectfield_sm{background: #fff url(../img/sm-doc.png) no-repeat 12px 6px;color: #111; width: 100%; font-size: 13px; font-family: var(--primary-font); border: 1px solid #E8E8E8; border-radius: 12px; padding: 7px 13px 7px 36px; width: 200px;}


.selectfield{ background:#fff; color: #111; width: 100%; font-size: 14px; font-family: var(--primary-font); border: 1px solid #E8E8E8; border-radius: 8px; height: 46px; padding: 10px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.selectfield.disabled {background-color: #EFEFEF;}

.textfield{ background:#fff; color: #111; width: 100%; font-size: 14px; font-family: var(--primary-font); border: 1px solid #E8E8E8; border-radius: 8px; height: 46px; padding: 10px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }


.opt_bx input,.radiobtn input[type=radio]{ display: none;}
.brd{    width: 20px;
    height: 20px;
    border: 1px solid #E3E3E3;
    position: absolute;
    right: 10px;
    top: 10px;
    background: #fff;
    border-radius: 100%;
}
.opt_bx input[type="radio"]+label{       background-color: #f5f5f5;
    padding: 25px 12px;
    font-weight: normal;
    display: inline-block;
    cursor: pointer;
    min-height: 206px; position: relative;
    width: 100%;
    text-align: center;
    font-size: 14px;
    border: 1px solid #E8E8E8;
    border-radius: 8px;}

	.opt_bx input[type="radio"] { padding: 0 10px;border: 1px solid #ccc; border-radius: 0;height: 40px; width: 100%;}
	.opt_bx input[type="radio"]:checked + label h3,	.opt_bx input[type="radio"]:checked + label p{ color: #7672FF; }
    .opt_bx input[type="radio"]:checked + label{ border: 1px solid #7672FF;}
	.opt_bx input[type="radio"]:checked + label .site_ic svg path{stroke-width: 1.3;stroke: #7672FF; }
    .opt_bx h3{font-size: 14px;color: #555;font-weight: 600;margin: 17px 0 7px 0;}
    .opt_bx p{font-size: 14px;color: #949494;margin: 0px 0 0px 0;}
    .opt_bx input[type="radio"]:checked + label .brd{ background: #7672FF; border: 1px solid #7672FF;}
.opt_bx input[type="radio"]:checked + label .brd:before{position: absolute;left: 2px;  top: 8px;height: 6px;width: 2px;   background-color: #fff;content: "";   transform: translateX(5px) rotate(-45deg);transform-origin: left bottom;}
.opt_bx input[type="radio"]:checked + label .brd:after{position: absolute;left: 0;bottom: 0;position: absolute;left: 1px;bottom: 4px;height: 2px;width: 12px;background-color: #fff;content: "";transform: translateX(6px) rotate(-45deg);transform-origin: left bottom;}
.next_pro{display: flex;flex-direction: row;justify-content: flex-end;}
.cmpdl{list-style: none; padding: 0; margin: 0; color: var(--dcolor); font-size: 14px;    font-family: var(--secondry-font);}
.cmpdl li b{font-weight: normal;display: inline-block;position: absolute;left: 0; }
.cmpdl li {display: flex;flex-wrap: wrap;position: relative;    min-height: 15px;    margin: 10px 0px;}
.cmpdl li span{margin-left: 69px;}
.cmpdr{list-style: none; padding: 0; margin: 0; color: var(--dcolor);font-size: 14px; font-family: var(--secondry-font); display: flex;justify-content: space-between;}
.cmpdr li{background: url(../img/tick12.png) no-repeat 0px 5px;padding-left: 15px;}

.frms_chck label{ font-weight: normal; display: flex; flex-wrap: nowrap; flex-direction: row; align-items: flex-start;
    gap: 8px;}
.frms_chck label h3{margin: 0; color: #333333; font-size: 14px;}
.frms_chck label p{margin: 0; color: #808080; font-size: 13px;}
.c_selected   strong{ font-weight: normal; color: var(--primary_color);}
.c_selected { color: #000;}
.lightbg{ background: #F8F8FF;border: 1px solid #EAE9FF;border-radius: 12px;}
.uplaod_btn {  width: 100%; background: #fff; text-align: center;border: 1px dashed #D1D1D1; justify-content: center; padding: 10px;
    font-size: 14px; border-radius: 12px; color: #555555; font-weight: 500;}
.uplaod_btn:hover{ background:#f2f2f2;}
.b_border{ border-bottom: 1px dashed #C9CCFF;}
.template_preview{background: #ebe4da; border-radius: 8px;}
.template_preview p{ font-size: 14px; color: var(--dcolor); margin:  0 0 6px 0;    word-wrap: break-word;}
.fttext{font-size: 10px; color:#ddd; }
.clr__{ text-align: center;}
.clr__ a{color: #3a7197; text-decoration: none; font-size: 14px; display: block; border-top: 1px solid #f2f1f1;padding:8px 0px;  font-weight: 500;}
.reviewbrodcast{display: flex;justify-content: center;align-items: center;text-align: center;}
.reviewbrodcast h3{ font-size: 24px;  font-weight: 600;}
.reviewbrodcast h4{font-size: 19px; color: var(--bluecolor);font-weight: 600;}
.reviewbrodcast p{ font-size: 16px; color: #555555;}
.uplaodcsv{ width: 100%;}
.radio-toolbar input[type="checkbox"] { opacity: 0; position: fixed; width: 0;}
.radio-toolbar label {display: block;background-color: #F3F3F3;padding: 5px 11px; cursor: pointer; border: 1px solid #DDDCDD; text-align: center;font-weight: normal; text-transform: capitalize; border-radius: 30px;color: var(--textgrey); font-size: 12px;}
.radio-toolbar input[type="checkbox"]:checked+label {background-color: rgba(49, 135, 57, 0.15);
    border-color: rgb(49, 135, 57);color: #161616;}
.ups_csb{list-style: none; padding: 0;}
.ups_csb li{ position: relative; font-size: 13px;}
.outline_btn{ border: 1px solid var(--primary_color); color: var(--primary_color);
    background: #fff;  padding: 12px 48px; border-radius: 12px; font-weight: 500; text-align: center;}
.outline_btn:hover{ background:var(--primary_color); color: #fff;}
.ups_csb li .tsd  strong{background: #e7e5ff;width: 30px;height: 30px;    position: relative;
        z-index: 1;display: flex;justify-content: center;align-items: center;border-radius: 100%;font-size: 13px;}
    .ups_csb li .tsd  {display: flex;justify-content: left;align-items: center;
            padding-left: 0;gap: 7px;}
.download_btn_file{  width: 100%;  border: 1px dashed #DCDCDC; background: #F9F9F9;
    padding: 30px 0px; border-radius: 12px; color: #555555;}
.note__{ color: var(--textgrey); font-size: 12px;margin-left: 37px;margin-bottom: 27px;}
 .radio-toolbar{ list-style: none; padding: 0; display: flex; gap: 6px;}
 .ms_{ margin:11px 33px 14px 37px;}
 .ups_csb li.first:before{width: 1px; height: 100%; content: ''; position: absolute; left: 15px;
    top: 0; border: 1px dashed #E8E6FF;}
.dfs{ display: flex; justify-content: center; align-items: center;}
.cba_btn button{ border: 0; background: #EEEEEE; padding: 8px 20px;border-radius: 12px;}
.cba_btn button.active{ background: var(--bluecolor); color: #fff;}
.addmore{ color: #236BFE; font-size: 13px; display: inline-flex; align-items: center;
    gap: 5px; cursor: pointer; margin: 0px 0 0 9px;}
.cmp-records{ border-radius: 12px; display: flex;padding: 22px 15px; width: 100%;  flex-wrap: wrap;justify-content: space-between;}
.cmp-records figure{ margin: 0 0px 0 0;width: 24%;}
.cmp-records .cmp_ins{line-height: 31px; width: 70%;}
.cmp-records .cmp_ins h3{ font-size: 14px; font-weight: 400; width: 100%;}
._nm{ font-size: 34px; font-weight: 700; display: flex; justify-content: space-between; width: 100%;}
.cmp-records.sent{border: 1px solid #e0e0ff;border-left: 3px solid#7672FF;  }
.cmp-records.Delivery{border: 1px solid #ffe8b1; border-left: 3px solid#ecab18; }
.cmp-records.Read{border: 1px solid #c0ffe7; border-left: 3px solid#12bf7d;  }
.cmp-records.Responded{border: 1px solid #bde1ff; border-left: 3px solid#138bed;  }
.cmp_serach{    background: url(../img/search_icon.png) no-repeat 10px 10px;
    border: 1px solid #E8E8E8;
    padding: 4px;
    font-size: 14px;
    width: 100%;
    height: 40px;
    border-radius: 8px;
    padding-left: 31px;}
.cmp_serach.equal-height{height: 45px;background-position-y: 14px;}
.search-fields-box{ position: relative;}
.search-fields-box:before{background: url(../img/search_icon.png) no-repeat; position: absolute;
    left: 12px; top: 16px; width: 18px; height: 18px; content: '';}
.input_search_data{ background: none; border: 1px solid #E8E8E8; padding: 4px; font-size: 14px;width: 100%; height: 46px; border-radius: 8px;  padding-left: 35px;}





    .map_attribute_ytbl table{ width: 100%;  }
.map_attribute_ytbl{ border: 1px solid #E8E8E8; border-radius: 12px; overflow: hidden; }
.map_attribute_ytbl table th{background: #D5DFF5; font-size: 13px; font-family: var(--secondry-font); font-weight: 500; padding: 8px 10px;}
.map_attribute_ytbl table td{padding: 12px 10px;border-top: 1px solid #E8E8E8; font-size: 13px; }
.selecttemp{ list-style: none; padding: 0; height: 272px; overflow-y: scroll; padding-right: 15px;}
.selecttemp li{ transition:ease all 0.4s;  cursor: pointer; font-size: 14px;color: var(--textgrey); padding: 10px 0px 10px 0px; border-bottom: 1px solid #E9E9E9; position: relative; display: flex;  justify-content: space-between;}
.selecttemp li span{ color: #7E7E7E; font-size: 12px;}
.template_preview_info figure img{ width: 100%;}
.textfield_temp{background:#fff url(../img/tmp_ic.png) no-repeat 12px 15px;border: 1px solid #E8E8E8; padding: 4px; font-size: 14px;width: 100%; height: 46px; border-radius: 8px; padding-left: 35px;}
.selecttemp li.active,.selecttemp li:hover{background: #f0fff9; padding: 10px; border-bottom: 1px solid #f0fff9}



.temp_head{    font-weight: 500; background: #E1E3FF; font-size: 16px; font-family: var(--secondry-font);padding: 10px 18px;}
.temp_head span{ border:1px solid #E4E4E4; background: #fff; font-size: 11px; display: inline-block; padding: 3px 8px; border-radius: 30px; color: var(--textgrey);}
.head_btns .head_btns_bx button{ background: #F5F5F5; border: 1px solid #E8E8E8; padding: 6px 9px; border-radius: 12px; color: var(--textgrey); font-size: 14px; font-weight:500; width: 100%; justify-content: center; display: flex; gap: 10px; align-items: center;}
 .head_btns {grid-template-columns: 1fr 1fr 1fr 1fr 1fr;}
 .head_btns .head_btns_bx button.active{background: #fff; color: var(--bluecolor);}

 .head_btns .head_btns_bx button.active svg path{stroke:var(--bluecolor);}
 .doc_inf a,.docs-upload label{ background: #F8F8FF; padding:25px; text-align: center; display: flex;
    justify-content: center; border: 1px dashed #DCDCDC; border-radius: 12px; text-decoration: none;}
.doc_lbl{
    font-size: 13px;
    color: var(--textgrey);
    /* max-width: 230px; */
    margin-top:14px;
}
.textareafield{width: 100%; border: 1px dashed #ECECEC; background: #F8F8FF; padding: 12px; border-radius: 12px;
    font-size: 14px;}
.num_count{position: absolute;right: 10px; bottom: 10px; color: #999999; font-size: 13px;}
.addmore__{ border: 0; background: none;  color: #236BFE; display: flex; justify-content: center;  align-items: center;
    gap: 5px; font-size: 14px;}
 .bs_{border: 0; background: none;}
 .temp_head.none{ background:#fff;padding-left: 0; border-top: 1px dashed #C9CCFF;}
 .atb  input[type="checkbox"]{
    appearance: none;
    background-color: #F6F6F6;
    margin: 0;
    width:20px;
    height:20px;
    border:1px solid #E8E8E8;
    border-radius:4px;
    transform: translateY(-0.075em);

}
.atb input[type="checkbox"] { display: grid;place-content: center;}
.atb input[type="checkbox"]::before { content: "";width: 9px;height: 9px; transform: scale(0); transition: 120ms transform ease-in-out;
    box-shadow: inset 1em 1em #1e2a38;}

.atb  input[type="checkbox"]:checked::before {transform: scale(1); }
.atb label{ display: flex; justify-content: center; align-items: center; gap: 7px; font-family: var(--primary-font);
    color: var(--textgrey); font-size: 14px;}

.ctr_btn{background: #fff; border: 1px solid #BBD1FF; border-radius: 12px; padding: 12px 7px; width: 100%;  font-size: 13px; display: flex;  gap: 12px;
    text-align: left; line-height: 17px;}
.ctr_btn span{font-size: 12px;display: block;color: var(--dcolor);}
.pls_icon{background: var(--bluecolor);display: flex; justify-content: center;
    align-items: center; width: 34px; height: 34px; border-radius: 12px;}
/* Onboard modal style here */
.onbrd{ list-style: none; padding: 0;}
.onbrd li{font-size: 14px;  color: #111; margin:0 0 22px 0px;padding-left: 48px;}
.onbrd li span{display: block; margin-bottom:5px; font-weight: 600;}
.onbrd li.actphone{ background: url(../img/phone_ico12.png) no-repeat;    background-size: 34px;}
.onbrd li.bw{ background: url(../img/business_website_icon.png) no-repeat;    background-size: 34px;}
.onbrd li.facebk{ background: url(../img/facebook_icon.png) no-repeat;    background-size: 34px;}
.video_{ border-radius: 12px; overflow: hidden;}
.fb_btn{background: #236BFE; color: #fff; text-decoration: none; padding: 12px 15px; text-align: center; border-radius: 12px; font-weight: 600; font-size: 16px; display: flex; justify-content: center;  align-items: center; gap: 10px;} .fb_btn:hover { background:#094edd; color: #fff;}
.loader_{ opacity: 0; position: fixed; justify-content: center; align-items: center; display: flex; z-index: 14;  background: rgb(0 0 0 / 26%);  width: 100%;  height: 0;  top: 0; left: 0; transition: ease all 0.4s;}
.loader_.show{ opacity: 1; height: 100%;}

/* Onboard modal end here */
.qrb-labl{ font-size: 14px;border-bottom: 1px dashed #C9CCFF; padding-bottom: 12px;}
.delete_records{ color: #C2C2C2; border: 0; background: #F9F9F9;padding: 10px; display: inline-flex;border-radius: 100%; width: 40px; height: 40px; justify-content: center; align-items: center;}
.delete_records:hover{ background: #ededed; color: #C2C2C2;}
.react-tel-input .form-control {background: #fff!important; color: #111!important; width: 100%!important; font-size: 14px!important; font-family: var(--primary-font)!important; border: 1px solid #E8E8E8!important; border-radius: 12px!important; height: 46px!important; padding: 10px!important; -webkit-border-radius: 12px!important; -moz-border-radius: 12px!important; -ms-border-radius: 12px!important; -o-border-radius: 12px!important; padding-left: 46px!important;}
.react-tel-input .flag-dropdown { background-color: #ffffff!important; border: 1px solid #E8E8E8!important; border-radius: 12px 0 0 12px!important;}
.react-tel-input .selected-flag:hover, .react-tel-input .selected-flag:focus {background-color:initial!important;}
.form-control:focus{box-shadow:initial!important;}
.webs_btn{background: #F5F5F5;border: 1px solid #E8E8E8;font-size: 13px;color: #555555;border-radius: 12px; padding: 9px 18px;font-weight: 500; display: flex; align-items: center;gap: 7px;}
.webs_btn.active{border: 1px solid #BBD1FF; background: #F6F9FF; color:var(--bluecolor);}
.webs_btn.active svg path{stroke:var(--bluecolor)}
.num_count.b14,.num_count.b12{ top: 14px;}
.chat_bots_btn svg path{ fill: var(--primary_color); }


/* chat style start here */
.chatappinfo{width: 100%;display: flex; height: 100%; flex-wrap: wrap;overflow-y: hidden;}
.chat_inbox{ width: 16%; height: 100%; background: #fff;}
.chat_list{ width: 29%; height: 100%; background:#f2f3f6;}
.chat_information{    width: 55%;
    height: 100%;
    background: url(../img/chatbg.jpg) no-repeat;
    position: relative;
    background-size: cover;
    flex-grow: 1;
    display: flex;
    flex-direction: column;}
.inbx_head h3{font-size: 20px;font-weight: 600; color: #1E2A38;font-family: var(--secondry-font);}
.inbx_head button{ border: 0;background: none; cursor: pointer; padding: 0;}
.rd4 input[type=radio],.rd4 input[type=checkbox]{ display: none;}
.rd4 input[type="radio"]:checked + label,.rd4 input[type="radio"]:checked + label small,.rd4 input[type="checkbox"]:checked + label,.rd4 input[type="checkbox"]:checked + label small{ color: var(--primary_color);}
.rd4 label{width: 100%; display: flex; justify-content: space-between; color: #1E2A38;
    font-size: 14px; font-family: var(--primary-font); padding: 3px 0px; cursor: pointer;}
.rd4 label small{color: #555555; font-size: 14px;}
._wbp h3{font-size: 13px; font-family: var(--secondry-font); color: #000;
    font-weight: 600; border-bottom: 1px solid #EBEBEB; padding-bottom: 12px; margin-bottom: 10x;}
._wbp h3.wts_icon{ background: url(../img/with_status.png) no-repeat; padding-left: 20px;}
._wbp h3.wtl_icon{ background: url(../img/with_label.png) no-repeat; padding-left: 25px;}
._wbp h3.wuser_icon{ background: url(../img/sts_user.png) no-repeat; padding-left: 25px;}
._csheight {height: calc(100vh - 120px); overflow-x: scroll;}
.chat_sidebar_top_head { display: flex; justify-content: space-between; align-items: center;}
.srh_frm{ display: flex; gap: 7px;}
.srh_frm  button.tsd{border: 1px solid #e9e9ea; background: #fff;padding: 7px; border-radius: 6px;
    display: flex; align-items: center; width: 36px; height: 38px; position: relative;}
.srh_frm button > img{ width: 20px;}
#allcontacts-tab table th:nth-child(4){ width: 180px!important;}
#allcontacts-tab table td:nth-child(4) span{    width: auto;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    /* height: 23px; */
    display: -webkit-box;
    text-overflow: ellipsis;
    border: 1px solid #DDDCDD;
    border-radius: 30px !important;
    background: #f5f5f5 !important;
    padding: 7px 14px !important;
    line-height: 15px;
    color: #555;}
.chat_sidebar_top_head  .selectbox {height: 42px; padding: 8px;}
.chatlistitem{ background: #fff; border-radius: 12px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; padding: 12px; border: 1px solid #e9e9ea; transition:ease all 0.4s ; -webkit-transition:ease all 0.4s ; -moz-transition:ease all 0.4s ; -ms-transition:ease all 0.4s ; -o-transition:ease all 0.4s ; cursor: pointer;}
.chatlistitemhead{ display: flex;flex-wrap: wrap; justify-content: space-between; align-items: center;}
.shtnm{margin-right: 9px;  width: 32px;height: 32px; display: flex; align-items: center; justify-content: center; font-size: 17px; color: #fff;  border-radius: 100%; font-weight: 700;
    position: relative;}
.chatlistitemhead ._cnm { width: 75%;}
.chatlistheadname{ font-size: 14px; font-weight: 500; color: #1E2A38;    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 20px;
    display: -webkit-box;
    text-overflow: ellipsis; text-transform: capitalize;
    max-width: 70%;}  
.ctr_wrap{ display: flex; align-items: center; margin: 12px 0px;justify-content: space-between;} 
.chat_short_wrap { width: 73%;}
.ctr_wrap .chat_short_bx{ width: 25px;}
.chat_short_discr{ color: #5B5B5B; font-size: 14px; display: -webkit-box; text-overflow: ellipsis;    -webkit-line-clamp: 1; -webkit-box-orient: vertical; height: 25px; overflow: hidden; width: 90%;} 
.chats_date{ font-size: 12px; color: #5B5B5B;  width:75px;  display: flex; justify-content: flex-end;}
.pns { width: 19px; height: 19px; display: flex; justify-content: center; align-items: center;
    color: #fff; font-size: 12px;  font-weight: 600; border-radius: 100%;}
  .chat_conversation_lbl .rsb{border: 1px solid #DFDFDF;    padding: 4px 12px 4px 30px;
        border-radius: 30px;     font-size: 11px;     position: relative;     color: #555555;    }
 .chat_conversation_lbl .rsb span{        width: 18px;
        height: 18px;        display: inline-block;        position: absolute;        left: 4px;
        border-radius: 100%;        top: 3px;}     
 .cnver_name{color:var(--textgrey); font-size: 12px;  display: flex; gap: 4px; justify-content: center;
    align-items: center;}
.agent-name,.lead-user-name{ text-transform: capitalize; -webkit-line-clamp: 1; -webkit-box-orient: vertical;  overflow: hidden; height: 17px;  display: -webkit-box;  text-overflow: ellipsis;  max-width: 80px;}
.assign-agent-btn{color: var(--hovercolor); font-weight: 500; background: transparent; font-size: 13px;}
.lead-table .assign-agent-btn {font-size: 15px;}
.assign-agent-btn .agent-name{color: var(--bcolor);line-height: 18px;}
.assign-agent-btn:hover,.assign-agent-btn .agent-name:hover{transition: all 0.3s ease; color: var(--bluecolor);}
._cnm   input[type="checkbox"]{ display: none;}
._cnm  input[type="checkbox"]+label{ border: 1px solid #8D8D8D; width: 18px; height: 18px; border-radius: 100%; position: relative; -webkit-appearance: none; opacity: 0; width: 0; transition: ease all 0.4s; -webkit-transition: ease all 0.4s; -moz-transition: ease all 0.4s; -ms-transition: ease all 0.4s; -o-transition: ease all 0.4s; }
._cnm  input[type="checkbox"]:checked + label{ border:0; background: var(--primary_color); color: #fff;}
._cnm  input[type="checkbox"]:checked + label:before{    width: 5px;
    height: 9px;
    margin: 0px 4px; transition: transform 200ms;
    position: absolute;
    content: '';
    left: 2px;
    top: 3px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
}
.leads_data_info  h3,.setinboxwrap span,.lead-name{text-transform: capitalize;}
.chatlistitem:hover ._cnm  input,.active-chat .chatlistitem ._cnm  input[type="checkbox"]+label{ opacity: 1; width: 18px; margin-right: 6px;}
.chatlistitem.active ._cnm  input[type="checkbox"]+label{ opacity: 1; width: 18px; margin-right: 6px;}
.sc_connect{position: absolute; right: -4px; bottom: -3px; background: #0866FF;  width: 16px;
    height: 16px;  border: 1px solid #fff;  border-radius: 100%;   font-size: 10px;
    display: flex;  justify-content: center;  align-items: center; }
    .sc_connect.fb{background: #0866FF;}    
    .sc_connect.wts{background: #12BF7D;}    
    .sc_connect._call{background: #00dfe7; font-size: 8px;}    
    .chatwrap{height: calc(100vh - 29px); overflow-x: scroll;}
  .chatlistitem.active  {background: linear-gradient(79deg, #e6e6f2, transparent); border: 1px solid #959BFF;}
  .chatinformation_head{ background: #fff;}
  .chatusernameinfo{ display: flex; justify-content: center; align-items: center; gap: 7px;}
  .chatusernameinfo span{ background: #111; width: 36px; height: 36px; border-radius: 100%; color: #fff; justify-content: center; align-items: center; display: flex; font-size: 19px;
    font-weight: 600;}
._usersnm{font-weight: 600;font-size: 14px;line-height: 18px;color: #1E2A38; width: 132px;}
._usersnm i{display: block;font-style: normal;font-weight: normal;font-size: 12px;color: #555555;}
._usersnm .usr-name{text-transform: capitalize;  -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;  height: 17px;   display: -webkit-box; text-overflow: ellipsis;}
.usr-phone{ font-size: 12px; font-weight: 400;}
.chat_assignedbx  .selectbox{height: 42px;padding: 10px;     padding-right: 28px;}
.chat_assignedbx {width: 66%;}
.chat_date_time{  position: absolute;  right: 54px;  z-index: 1;  color: #555555;  font-size: 14px;  font-weight: 500;}
.chat_date_time span{ color: #8d8d8d;  font-weight: 400; display: inline-block; margin-left: 4px;}
.chatboxtypewrap {background: #EEF1F8; border: 1px solid #E2E2E2;    align-items: center; position: relative;
    padding: 10px 10px 10px; width: 100%; border-radius: 16px; box-shadow: 6px 0px 12px 0px #dcd6d6; display: flex;  gap: 3px;}
.ssd_btns  { background:#1e2a38  url(../img/manage_users.png) no-repeat 18px 11px; border-radius: 12px 0 0 12px; padding: 5px; border: 0; text-indent: -9999px; width: 79px; margin-left: 12px; }
.chatbox_messagebox{  width: 100%;  display: flex;    overflow-y: scroll; padding: 20px; height: 96%;  }
.chatbox-wrapper{    flex-wrap: nowrap;
    position: relative;
    flex: 1;
    overflow-y: auto;
    display: flex; padding-bottom: 15px;
    flex-direction: column;
    gap: 8px;}
.preview_modal{ width: 100%; height: calc(100% - 0px); background: #fff;  position: absolute;  z-index: 15;}
.preview_attachment img{ width: 100%;}
.preview_attachment{  background: #F1F3F5;
    padding: 11px 11px;
    border-radius: 10px;
    max-width: 430px;
    max-height: 520px;
    overflow-y: scroll;}
.attachement_captions{ margin: 20px 110px; position: relative;}
.attachement_captions .cpt{  width: 100%; border: 1px solid #f1f0f0; padding: 10px 43px 10px 15px; border-radius: 30px;}
.attachement_captions button{ position: absolute;right:11px;background: none;border: 0;top:50%; margin-top: -14px;}
.w_30{ width: 220px;}
.document_attache_btn{background: none; border: 0; margin-right: 4px;}
.manage_edits{background: #fff url(../img/three_dots.png) no-repeat center;
    border: 0;margin-top: 5px; text-indent: -9999px; width: 30px; height: 30px; background-size: 20px; padding: 0; border-radius: 100%; display: flex; align-items: center; justify-content: center;}
.manage_edits:hover{    background: #f2f2f2 url(../img/three_dots.png) no-repeat center;background-size: 20px;}
.no-chat-selected .ms_img img{ width: 250px;}
.no-chat-selected h1{  font-size: 34px;  font-weight: 200; margin-bottom: 11px; color: #121111;}
.no-chat-selected p{ max-width: 350px; margin: 0 auto; margin-bottom: 24px; color: #747474;}
.template_preview_inner .template_preview p{    overflow-y: scroll; height: 250px;}


.chatbox_type_bottom{width: 100%; padding: 0 12px; position: relative;}
.chat_full_width{ width: 100%;}
.chat_sending{ display: flex;justify-content: flex-end;}
.chat_receiving{ display: flex;justify-content:flex-start;}
.chat_receiving .justify-content-end{justify-content: flex-start !important;}
.chat_message_info_recieving{background: #EAFEF6; padding: 6px 6px; border: 1px solid #E0DFFF;
    border-radius: 0px 10px 10px 10px; max-width: 100%;margin-bottom:6px;}
.chat_msg_image img{ margin-bottom: 10px;}
.chat_msg_text{ color: #222222; font-size: 14px; font-family: var(--primary-font);word-wrap: break-word;}
.chat_msg_date {font-size: 11px; color: #555555; justify-content: flex-end; display: flex;} 
.chat_msg_date  img{ width: 17px;}   
.chat_message_info_sending{background: #fff; padding: 7px; border: 1px solid #C6EDDE; border-radius: 10px 0px 10px 10px;  max-width: 100%; margin: 3px 0px;}
.chatusername{width: 100%;display: flex;justify-content: flex-end; font-size: 12px; color: #333333;margin-top: 5px;}
.chat_incoming_date  span{border: 1px solid #E6E6E6; color: #555555; background: #fff;position: relative; border-radius: 30px; font-size: 13px; padding: 2px 14px;}
.chatbox_type_text_fields { line-height: 10px;}
.chatbox_type_field_wrap{    width: 100%; display: flex; position: relative; justify-content: flex-start;align-items: flex-start;    border-bottom: 1px solid #E8E8E8;}
.emgbx{position: absolute; top: 50%; left: 2%; margin-right: -50%; transform: translate(-50%, -50%);}
.send_chat_btn{border: 0px;background: none; height: 25px;width: 26px;}
.emgbx button{ border: 0; background: no-repeat; font-size: 20px; color: #898989;}
.emgbx button:hover{ color: #111;}
.inf_fields_type{border-radius: 16px; width: 100%; height: 42px; padding: 16px 10px 10px 37px;
    color: #555; border: 0; font-size: 14px;}
.dtr{ border: 0;background: no-repeat; font-size: 28px; color: #898989; position: relative; top: 4px;right: 12px;}
.chatbox_type_docs{display: flex; justify-content: left;align-items: center; padding: 10px 15px;}
.ctr_bottom_start button{border: 0px; background: no-repeat; padding: 0; } 
.send_message button{
    background: none;
    color:var(--primary_color);
    border: 0;
    font-size: 14px;
    font-weight: 600;
    padding: 8px 29px;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
}
.send_message button:hover{ background: var(--hovercolor);}   

.tsp .chat_message_info_sending{ width: 44%;}

.ctr_bottom_start button:hover svg path{ fill:#111}
.chat_message_sugegstion{ width: 100%;
    position: absolute;
    bottom: 55px;
    background: #fff;
    border-radius: 8px; z-index: 10;
    border: 1px solid #ebe6e6;
    overflow: hidden;}
.chat_message_sugegstion ul{     list-style: none;
    padding: 0;
    margin: 0;
    max-height: 170px;
    overflow-y: scroll;}
.chat_message_sugegstion ul li{width: 100%; padding: 8px 10px; border-bottom: 1px solid #f8f8f8; cursor: pointer;}
.chat_message_sugegstion ul li .quick-reply-header strong{ font-size: 14px; color: #000; display: inline-block; margin-right: 5px;}
.chat_message_sugegstion ul li .quick-reply-content{ margin: 0; font-size: 13px; color: #555555;}
.chat_message_sugegstion ul li:hover{ background: #EAE9FF;}
.chat_session_expire{  display: flex;  border: 1px solid #FFC0C0;
    padding: 15px;  justify-content: space-between;    flex-wrap: wrap;
    align-items: center;   background: #FFFBFB;  border-radius: 12px;}
.chat_session_expire h3{font-size: 14px;color: #000;}
.chat_session_expire p{ font-size: 13px; color: #555; margin: 0;}
.manage_contact_sidebar{ width: calc(50% - 31px); position: fixed; background: #fff;  height: 100%;
    z-index: 12;  transition: ease all 0.4s;  right: -70%;border: 1px solid #e7e1e1; border-top:0 ;}
  .openside  .manage_contact_sidebar{width: calc(55% - 34px);}
    .managetabs_list_info{padding: 20px;border-top: 1px solid #e7e1e1;}
    .manage_tabs{ display: flex; gap: 9px;}
.manage_tabs button{border: 1px solid #ECECEC; font-size: 14px;padding: 9px 20px; background: #fff;border-radius:8px;display: flex;justify-content: center;
        align-items: center;gap: 6px;}
.manage_tabs button.active{background: var(--primary_color);color: #fff; border: 1px solid var(--primary_color);}
.manage_tabs button.active svg path{ fill:#fff}

.manage_contact_sidebar.open{ right: 0; }
.manage_content_head {background: #ebedff;    }
.mnuser{display: flex;justify-content: center;align-items: center;font-size: 16px;
            font-weight: 600;gap: 6px;}
.mnuser span{background: #111;width: 36px;height: 36px;    border-radius: 100%;
        color: #fff;justify-content: center;align-items: center;display: flex;font-size: 19px;font-weight: 600;}
.close_sidebar{background: none;border: 0;cursor: pointer;}

.ssd_btns_close { background: #1e2a38 url(../img/manage-user-close.png) no-repeat 11px 11px; border-radius: 0px 12px 12px 0px; padding: 5px; border: 0; text-indent: -9999px; width:79px;}  
    .dropdowns_bx.open{ display: block;}
.dropdowns_bx ol{ list-style: none; padding: 0; margin: 0;} 
.dropdowns_bx ol li{cursor: pointer; border-bottom: 1px solid #F3F3F3; padding:8px 18px; font-size: 14px; color: #222; display: flex;  gap: 8px; justify-content: flex-start;  align-items: center;} 
.dropdowns_bx ol li img{ width: 15px; height: 15px;}
.dropdowns_bx ol li:last-child{ border: 0px;}
.dropdowns_bx ol li:hover{ background: #f2f2f2;}  

.chat_sending .rect-emoji-list{ right: 0px!important; left: auto!important;}
.none_style.m1> button{ margin-top: 5px; width: 30px; height: 30px; border-color: transparent!important; background:  url(../img/three_dots.png) no-repeat center!important; background-size: 20px!important;border-radius: 100%; }
.none_style.m1 >button:hover{   border-color: transparent!important;     background: #f2f2f2 url(../img/three_dots.png) no-repeat center!important;  background-size: 20px!important;}
.none_style button:focus{  box-shadow: none!important;}
.none_style.m1 .dropdown-toggle::after{ display: none;}

.none_style .dropdown-menu {z-index: 1000; min-width: 181px; padding: 0;  margin: 0;
    font-size: 14px;  color: #212529; text-align: left; list-style: none;  background-color: #fff;
    background-clip: padding-box; border: 1px solid #f2f2f2; border-radius: 12px;  overflow: hidden;}

.none_style  .dropdown-item {width: 100%;clear: both;color: #212529;text-align: inherit;text-decoration: none;white-space: nowrap;background-color: transparent;border: 0;border-bottom: 1px solid #F3F3F3;padding: 8px 18px;display: flex;gap: 12px;justify-content: left;align-items: center;}
.none_style  .dropdown-item img{ width: 15px; height: 15px;}
.none_style  .dropdown-item:hover{ background: #f2f2f2;}  

.pts__{font-size: 13px; color: #555555;}
.none_style.ddt button{border-color: transparent!important; background: transparent!important; color: var(--bluecolor)!important; font-weight: 600; font-size: 14px;}
.mnlistbx{ border: 1px solid #EFEFFF; overflow: hidden; border-radius: 12px;background: #fff;}
.mnlist_head{ background: #F9F9FF; padding: 5px 10px; font-size: 13px; color: var(--textgrey);}
.mnlistinfo{ padding: 22px 15px;}
.mnlistinfo h3{font-size: 14px;font-weight: 700; color: #111; margin-bottom: 11px;}
.mnlistinfo p{    color: var(--textgrey); line-height: 19px; font-size: 14px; margin: 0;}
.mnlistinfo ul{gap: 16px; padding: 0; margin: 20px 0 0 0; list-style: none; display: flex;}
.mnlistinfo ul li{ font-size: 13px; color: var(--textgrey);}
.mnlistinfo ul li strong{ color: #000; font-weight: 700;}
.manage_tabs_list_entry{height: calc(100vh - 170px); overflow-x: scroll; padding-right: 6px;}
.manage_tabs_list_entry.leads_{height: calc(100vh - 107px);}
.etds .none_style.m1 button{transform: rotate(90deg);margin-top:0px!important; }

.mn_check   input[type="checkbox"]{ display: none;}
.mn_check  input[type="checkbox"]+label{ border: 1px solid #8D8D8D; width: 18px; height: 18px; border-radius: 100%; position: relative; -webkit-appearance: none;  }
.mn_check  input[type="checkbox"]:checked + label{ border:0; background: var(--primary_color); color: #fff;}
.mn_check  input[type="checkbox"]:checked + label:before{    width: 5px;
    height: 9px; margin: 0px 4px; transition: transform 200ms; position: absolute; content: ''; left: 2px; top: 3px; border-bottom: 2px solid #fff;  border-right: 2px solid #fff;  transform: rotate(45deg);}
.mn_check{ height: 18px;}
.mnlist_head h3{     font-size: 14px;
    color: #111;
    font-weight: 600;
    margin: 0;
    display: flex;
    gap: 6px;}
.formbuildertbs.s1 li{width: 100%;  border-radius: 8px; border: 1px solid #dddddd; color: var(--bcolor);}
.formbuildertbs.s1 li.active,.formbuildertbs.s2 li.active{ background: #7672FF; color: #fff;}
.formbuildertbs.s2 li{width: 100%;  border-radius: 8px; border: 1px solid #dddddd; color: var(--bcolor);}
.formbuildertbs.s2{    justify-content: space-between;}

input[type="date"].date__::-webkit-calendar-picker-indicator {
        color: var(--textgrey);   opacity: 1;
        display: block;
        background-repeat:  no-repeat;
        width: 15px;
        height: 15px;
        border-width: thin
    }
    input[type="date"].date__::-webkit-calendar-picker-indicator {
        position: absolute;
        left:25px;
    }
    input[type="date"].date__::-webkit-datetime-edit-fields-wrapper {
        position: relative;
        left: 10px;
    }
    input[type="date"].date__::-webkit-datetime-edit {
        position: relative;
        left:10px;
    }
.icss span{position: absolute;top: 13px;left: 10px;color: var(--textcolor);}
.icss .selectfield{ padding-left: 32px;}
.checklabel input[type="checkbox"]{ display: none;}
.checklabel label{border: 1px solid #F0F0F0; padding:10px 10px 10px 39px; border-radius: 12px;
    display: block; cursor: pointer; transition: ease all 0.4s; position: relative;}
.checklabel label h3{ font-size: 13px; font-weight: 400; color: var(--textgrey); margin: 0;}
.tmps{ font-size: 11px; color: var(--textgrey); display: flex; justify-content: left;
    align-items: center; gap: 3px; margin-top: 2px;}
.chckcircle{width: 20px; height: 20px; border: 1px solid #E3E3E3; position: absolute; left: 10px;
    top: 15px; background: #fff; border-radius: 100%;}
.checklabel input[type="checkbox"]:checked + label .chckcircle {background: #7672FF; border: 1px solid #7672FF;}
.checklabel input[type="checkbox"]:checked + label .chckcircle:before { position: absolute; left: 2px; top: 8px; height: 6px; width: 2px; background-color: #fff; content: ""; transform: translateX(5px) rotate(-45deg);  transform-origin: left bottom;}
.checklabel input[type="checkbox"]:checked + label .chckcircle:after { position: absolute;left: 0;bottom: 0; position: absolute; left: 1px; bottom: 4px; height: 2px; width: 12px; background-color: #fff; content: "";
    transform: translateX(6px) rotate(-45deg); transform-origin: left bottom;}
.checklabel input[type="checkbox"]:checked + label {border: 1px solid #7672FF;}
.checklabel input[type="checkbox"]:checked + label h3, .checklabel input[type="checkbox"]:checked + label .tmps {
    color: #7672FF;}
.checklabel input[type="checkbox"]:checked + label .tmps svg path {stroke-width: 1.3;stroke: #7672FF;}  
.notes_list{list-style: none; padding: 0;}  
.notes_list li{border: 1px solid #F0F0F0; padding: 12px; border-radius: 12px; position: relative; background: #FDFDFD; margin: 0 0 6px 0;}
.notes_list li h3{ font-size: 14px; font-weight: 700; color: #111;}
.notes_list li p{ color: var(--textgrey);}
.docs_cdr{ border: 1px solid #E8E8E8;  padding: 6px 11px;  font-size: 13px; background: #F3F5F7;
    border-radius: 6px; gap: 8px;  display: inline-flex; justify-content: center;    align-items: center;  }
.docs_cdr img{    background: #fff; padding: 4px; border: 1px solid #E4E4E4; border-radius: 3px;}
.dtsr{display: flex; justify-content: center;    align-items: center;    font-size: 13px;
    color: var(--textgrey);    gap: 5px;}
    .notes_list li:before{width: 36px;  height: 32px;content: ''; background: url(../img/triangle_shape.png) no-repeat;
        background-size: cover;position: absolute;right: -2px;top: -1px; z-index: 1;}    
 .notes_list li:after{width: 36px;height: 32px;content: '';background: #ffffff;background-size: cover;
            position: absolute;right: -2px;top: -1px;}  
.addn__{  color: #7672FF; text-decoration: none; font-weight: 600; font-size: 14px;} 
.addn__:hover{ color: #111;} 
.timelines_infor{border: 1px solid #F0F0F0; margin-top: 23px;border-radius: 12px;padding: 47px 30px;}   
.timelines_infor ul{min-height: 240px;margin: 0; padding: 0; width: 100%;background: url(../img/dotted_line.jpg) top left repeat-y; list-style: none;border-radius: 12px;display: flex; flex-wrap: wrap;
        align-content: space-between;} 
.timelines_infor ul li{ position: relative;padding-left:30px;}     
.timlines_infor ul li:before{width: 16px; height: 16px; border: 1px solid #dddddd;background: #f7f7f7; position: absolute; left: -7px; top: 4px; content: ''; border-radius: 100%;} 
    .timelines_infor ul li:after{width: 8px;height: 8px;background: #dbdbdb;position: absolute;left: -3px;top: 8px;content: '';border-radius: 100%;}     
    
.selectbox2{ border: 1px solid #E8E8E8; border-radius: 12px; width: 100%; padding: 12px; font-size: 14px;  -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; }
select.selectbox2{  -webkit-appearance: none; position: relative; background:url(../img/caret_drop.png) right no-repeat;}   

.icos span{ position: absolute; left: 10px; top: 11px;}
.icos .selectbox2{ padding-left: 30px;}
.etds2 .none_style.m1 button{ margin-top: 0;}
._ids{ color: #111;  font-weight: 500;}
.ls2 strong{ color: #111;}

select.selectbox3{-webkit-appearance: none; position: relative; background: url(../img/dd_drop1.png) right no-repeat; border: 0; padding-right: 23px; color: var(--textcolor); padding-left: 5px;} 
.apprd select.selectbox3{ background: url(../img/green_caret.png) right no-repeat; } 
.pending select.selectbox3{ background: url(../img/pending_caret.png) right no-repeat; } 

.sd4_{font-size: 13px; display: flex; justify-content: left; align-items: center; gap: 2px;} 
.sd4_ strong{ display: flex; justify-content: center; align-items: center; gap: 4px; color: #111;}
.sd4_ strong img{ width: 11px; }
.mnlistinfo .selectfield{ border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; }
.comments{ display: flex; justify-content: flex-end; font-size: 13px; color: var(--textgrey);
    align-items: center;  gap: 5px; font-weight: 500;}
.comments i  { color: #7672FF}
.apprd select.selectbox3,.sd4_.apprd{ color: #12BF7D;}
.pending select.selectbox3,.sd4_.pending{ color: #EB3545;}

.lead-container h3{ font-weight: 600; font-size: 15px;}
.lead-btn-group{ margin-top: 15px;  display: flex;  align-items: center;  flex-wrap: wrap; gap: 8px;}
.tbl_notes{ font-size: 13px; color: var(--textgrey); line-height: 17px;}
.leads_edit_modals{  color: #1E2A38;}
.lead-btn-group button{display: inline-block; font-size: 14px; font-weight: 500; padding:7px 8px; border: 1px solid transparent;}
.lead-btn-group .active-btn{ background-color: #E5FDF4; border: 1px solid #B7F0DA; color: #12BF7D;}
.lead-btn-group button:nth-child(1){border-top-left-radius: 15px; border-bottom-left-radius: 15px;}
.lead-btn-group button:last-child{ border-top-right-radius: 15px; border-bottom-right-radius: 15px;}
.grow {flex-grow: 1;}
.deals-table{ border: 1px solid #E4E4E4; border-radius: 15px; overflow: hidden;}
.table_content{ overflow: auto;}
.table_content table{  width: 100%;  border-collapse: collapse;}
.table_content  th { padding: 13px 10px; font-size: 13px; font-weight: 600;}
.table_content td { padding: 10px 10px; border-bottom: #E4E4E4; font-size: 13px; font-weight: 400;}
.table_content table thead{ background-color: #D5DFF5;}
.table_content tbody tr{border-bottom: 1px solid #F3F3F3;}
.table_content tr th.thw{ min-width: 180px;}
.table_content tbody tr td span { border: 1px solid #E4E4E4; padding: 7px 25px; border-radius: 6px;}
.table_content tbody tr td select { border: 1px solid #E4E4E4; padding: 3px 8px; border-radius: 6px;
    outline: none; font-size: 13px;}
.table_content tbody tr td .select-close{background-color: #E5FDF4; border: 1px solid #B7F0DA;color: #12BF7D;}
.table_content tbody tr td .select-dead{background-color: #FFF4F5; border: 1px solid #F4CACD; color: #D32030;}
.table_content tbody tr td .select-pending{ background-color: #F6F6F6; border: 1px solid #DFDFDF;color: #9A9A9A;}
.activeplanshead{background: url(../img/active-plans_bg1.jpg) top center no-repeat; background-size: cover;
    color: #fff; padding-bottom: 47px; text-align: center;}
 .activeplanshead h3{font-size: 30px; font-family: var(--secondry-font); margin:0 0 9px 0;padding: 0;}
 .active_plans_md{padding: 37px; text-align: center;}
.active_plans_md h4{font-size: 16px;font-weight: 500; margin-bottom: 18px;}
.active_plans_md ul{list-style: none; display: flex; justify-content: center;  align-items: center;
    gap: 21px; margin:0 0 39px 0;}
.active_plans_md ul li{font-size: 14px; display: flex; gap: 9px;}
.active_madal .modal-content{ border-radius: 12px; overflow: hidden;}
.search_chat_field{ display: none; position: absolute; width: 100%;box-shadow: 0px 0px 3px 0px #e1e1e1; left: 0; z-index: 10; top: 0; background: #fff; padding: 9px;border-radius: 6px;}
.search_chat_field .textfield_2{ width: 100%; height: 40px; border: 1px solid #efefef; padding: 8px; border-radius: 12px;}
.search_chat_field.open{ display: block;}
.form_build_submit{ display: flex; justify-content: flex-end; gap: 5px;   margin-top: 20px;}
.cross-right .btn-close{ right: -25px; top: -10px;}
.select-option{ font-size: 14px; padding: 2px; border: 1px solid #E8E8E8; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.select-option  select{ padding-top: 7px; padding-bottom: 7px;}
.select-option img{ width: 22px;}
.total_contact_progress .progress-container {width: 80px; background-color: #e0e0e0;
    border-radius: 8px; height: 5px; overflow: hidden;}
.total_contact_progress .progress-bar { height: 100%;  width: 70%; background-color: var(--primary_color); text-align: center; line-height: 24px;}
.total_contact_progress  span{ font-size: 12px; font-weight: 700;}
.status-badge{display: inline-block; padding: 4px 15px; border-radius: 4px;   font-size: 12px; font-weight: 600;}
/* chat style end here */
 


/* CRM Settings */
._tbl tbody{    border: 1px solid #ededed;}
.d_flex{display: flex; justify-content: space-between;}
._rdbox .opt_bx input[type="radio"]+label{ background:#fff;}
._rdbox .opt_bx p { font-size: 12px; line-height: 17px;    min-height: 70px;}
._rdbox  .opt_bx input[type="radio"]:checked + label .site_ic svg path { stroke-width: 0.5; stroke: #fff; fill: #7672FF;
}
._rdbox  .opt_bx h3 { font-size: 16px; color: #000000; margin: 17px 0 11px 0;}
.setting_info_right  {width: 100%; height: 100vh; overflow-y: scroll;}
.setting_sidebar{ height: 100%; height: 100%;} 
.setting_sidebar h2{font-size: 16px; font-weight: 600; padding: 17px 20px; font-family: var(--secondry-font);
    border-bottom: 1px solid #F1F1F1; height: 56px;}
.setting_list_item h3{color: var(--textgrey); font-size: 14px; margin: 0; padding: 16px;
    position: relative; display: flex; gap: 8px;}
.setting_list_item h3 a{color: var(--textgrey); text-decoration: none;flex: 1; z-index: 1;}

.setting_list_item.open h3{color: var(--primary_color); }
.setting_list_item h3.active a{color: var(--primary_color); }

.setting_list_item.open h3 svg path,.setting_list_item h3.active svg path{ stroke:var(--primary_color); }
.setting_list_item h3:before{background: url(../img/setting_right_arrow.png) no-repeat; width: 18px;
    height: 20px; content: ''; position: absolute; right: 14px; top: 17px;    transition: ease all 0.4s;}
.setting_list_item.open h3:before{background: url(../img/setting_right_arrow_45degree.png) no-repeat; width: 18px;
    height: 20px; content: ''; position: absolute; right: 14px; top: 17px;    transition: ease all 0.4s;}  
    
.setting_list_item h3.active:before{background: url(../img/setting_right_arrow_45degree.png) no-repeat; width: 18px;
    height: 20px; content: ''; position: absolute; right: 14px; top: 17px;    transition: ease all 0.4s;}     

.setting_list_item ul{     list-style: none;
    padding: 9px 20px 10px; 
    margin: 0 23px 15px 23px; background:#FDFDFD;
    border: 1px solid #F2F2F2; display: none;
    border-radius: 12px;}
    .setting_list_item.open ul{ display: block;}
.setting_list_item ul li a{font-size: 13px; color: var(--textgrey); text-decoration: none; display: block;
    padding: 5px 0px 5px 15px; position: relative;}
.setting_list_item ul li a:hover,.setting_list_item ul li.active a{ color: var(--primary_color); font-weight: 500;}
.setting_list_item ul li a:before{border: solid var(--textgrey); border-width: 0 1px 1px 0; position: absolute; left: 0; top: 11px;  display: inline-block; content: '';  padding: 3px;
    transform: rotate(310deg);}
.setting_list_item ul li a:hover:before,.setting_list_item ul li.active a:before{border: solid var(--primary_color);border-width: 0 1px 1px 0;}
.top_heading{ padding: 8px 20px;height: 56px; border-bottom: 1px solid #F1F1F1;}
.top_heading h1{font-size: 16px; font-weight: 600;  font-family: var(--secondry-font);}

.accordion_bx .accordion-item { background-color:transparent; border: 0; margin: 0 0 10px 0; border-radius: 0px !important; -webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; -ms-border-radius: 0px !important; -o-border-radius: 0px !important;
}
.accordion_bx .accordion-body { background: #fff;}
.accordion_bx .accordion-button {
    padding: 12px 15px;
    font-size: 15px;
    font-weight: 600;
    color: #111;
    margin: 0;
    color: #111;
    background-color: var(--secondry_color);
    border: 0;
    border-radius:8px 8px 0px 0px !important;
   
}
.accordion_bx .accordion-button.collapsed{border-radius: 8px !important;}
.accordion_bx  .accordion-button:not(.collapsed){     box-shadow: none;}
.accordion_bx  .accordion-collapse{  border: 1px solid #EDEDED;}
.accordion_bx .accordion-button::after{
    background: url(../img/white_circle_arrow.png) no-repeat;
    width: 24px;
    height: 24px;
    content: '';
    position: absolute;
    right: 8px;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}
.accordion_bx .accordion-button:not(.collapsed)::after { transform: rotate(0deg);}
.accordion_bx .accordion-button .form-check{ line-height: normal; margin: 0;}
.accordion_bx .form-check-input:checked{    background-color: #fff; background-image:url(../img/green_circle.png); background-repeat: no-repeat; border: 1px solid var(--primary_color);background-position: right center;}
.accordion_bx  .form-check-input:focus { border-color: var(--primary_color); outline: 0; box-shadow:none;}


.working-hours-list{display: flex; justify-content: space-between; border: 1px solid #ECECEC;    width: 100%;
    background: #FDFDFE;  padding: 12px; align-items: center; border-radius: 12px;    align-items: flex-start;}
.wrk-name{width: 130px; font-size: 15px; display: flex; gap: 8px; font-weight: 500;align-items: center;}
.wrk-name span {
    min-width: 25px;
    min-height: 25px;
    color: #fff;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
}
.wrk-name.sunday{ color: var(--sunday);}
.wrk-name.sunday span {background:var(--sunday);}
.wrk-name.monday{ color: var(--monday);}
.wrk-name.monday span {background:var(--monday);}
.wrk-name.tuesday{ color: var(--tuesday);}
.wrk-name.tuesday span {background:var(--tuesday);}
.wrk-name.wednesday{ color: var(--wednesday);}
.wrk-name.wednesday span {background:var(--wednesday);}
.wrk-name.thursday{ color: var(--thursday);}
.wrk-name.thursday span {background:var(--thursday);}
.wrk-name.friday{ color: var(--friday);}
.wrk-name.friday span {background:var(--friday);}
.wrk-name.saturday{ color: var(--saturday);}
.wrk-name.saturday span {background:var(--saturday);}

.unbl{ color: var(--textgrey);}
.addbtnplus{ background: no-repeat; border: 0px; padding: 0; margin: 0;}
.datefield{ border: 1px solid #E8E8E8; padding: 8px 12px;border-radius: 7px; font-size: 13px; width: 210px;}
.datefield:focus{ outline: none;}
.working-hours-fields{ display: flex; gap: 12px; margin: 3px 0px;    align-items: center;}
.copylist{ background: no-repeat; border: 0; padding: 0; margin: 0; color: #7672FF;}
.working-trash-control button,.working-hours-time button{ background: no-repeat; border: 0; padding: 0;}
.ullist4{ list-style: none;  margin: 0; padding: 0;}
.ullist4 li{display: flex; justify-content: space-between; margin: 0 0 16px 0px;}
.ullist4 li input[type="checkbox"]{ width: 19px; height: 19px; background: #ccc;}

.swatched-label{width: 19px; height: 19px; border-radius: 100%;}
.swatched-label-row{ display: flex; border: 1px solid #f2eaea;padding: 2px 3px; align-items: center; gap: 2px; border-radius: 30px;
    color: var(--textgrey); font-size: 11px;}
.usernm{ -webkit-line-clamp: 1;  -webkit-box-orient: vertical;  overflow: hidden;
    display: -webkit-box;  text-overflow: ellipsis;  max-width: 93px;}
.note_{ font-size: 14px; border: 1px dashed #bbe8d6; padding: 6px 15px;  background: #e8fff6; border-radius: 5px;  color: #108256;}
 .check-box input[type="checkbox"], .check-box input[type="radio"] {  display: none;}
 .check-box input[type="checkbox"]+label, .check-box input[type="radio"]+label{border: 1px solid #E9E9E9;position: relative; width: 100%; border-radius: 12px; background: #fff; cursor: pointer;  padding: 12px;}
 .str-info h3{  font-size: 14px;  color: #111; font-weight: 600;  margin: 0;  padding: 0;}
 .str-info span{    color: #444444;  font-size: 13px;    display: -webkit-box;  text-overflow: ellipsis;  -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;  overflow: hidden;}
.ctr-agents{ display: flex;  justify-content: left;  align-items: center;   gap:7px;}
.ctr-agents .str-info{ width: 75%;}
.ctr-agents .st-name{  width: 26px; height:26px; display: flex;
    justify-content: center;  align-items: center; color: #fff; border-radius: 100%;  font-weight: 600;
    font-size: 17px;}
  .check-box .brd { top: 20px;}
  .check-box input[type="checkbox"]:checked + label,.check-box input[type="radio"]:checked + label { border: 1px solid #7672FF;}
  .check-box input[type="checkbox"]:checked + label .brd,  .check-box input[type="radio"]:checked + label .brd {background: #7672FF;border: 1px solid #7672FF;}
  .check-box input[type="checkbox"]:checked + label .brd:before,  .check-box input[type="radio"]:checked + label .brd:before  { position: absolute; left: 2px;  top: 8px; height: 6px; width: 2px; background-color: #fff; content: ""; transform: translateX(5px) rotate(-45deg);  transform-origin: left bottom;}
.check-box input[type="checkbox"]:checked + label .brd:after,.check-box input[type="radio"]:checked + label .brd:after { position: absolute; left: 0; bottom: 0;  position: absolute;  left: 1px;  bottom: 4px;  height: 2px;  width: 12px; background-color: #fff;  content: "";  transform: translateX(6px) rotate(-45deg); transform-origin: left bottom;}
.margin-inside-box .check-box{ margin: 7px 0px;}
.color-plate{border: 1px solid #E8E8E8; background: #F5F5F5; border-radius: 12px; padding: 7px 15px;  display: flex; align-items: center;  gap: 12px; color: var(--textgrey); font-size: 14px;}
.c_color{     width: 24px;  height: 24px; border: 0px;}
textarea.inputfield{ height: 100px;}
.go_btn{ border: 1px solid #868686; padding: 7px 16px; color: #000; text-decoration: none; font-weight: 500; border-radius: 8px;  font-size: 14px; display: flex;  align-items: center;  gap: 6px;}
.go_btn:hover,.apikey button.cpybtn:hover{ background: #f2f2f2; color: #000;}

.apikey .api-btns{position: absolute; right: 11px; top: 11px;  display: flex; align-items: flex-end; justify-content: center;
    gap: 10px;}
.sh-text{ border: 0; background: no-repeat; padding: 0; margin: 0; color: #a4a4a4;}
.apikey button.cpybtn{ border: 1px solid #868686; background: #fff; 
    border-radius: 8px; font-size: 12px;  padding: 2px 10px; display: flex; align-items: center;
    justify-content: center; gap: 5px; }
 .apikey input[type="text"]  { width: 100%; border: 1px solid #E8E8E8; padding: 11px 85px 11px 11px; border-radius: 8px;
    font-size: 14px;}
.newgner a{ font-size: 13px; text-decoration: none; color: #000; display: inline-block;}
.newgner a:hover{ text-decoration: underline;}

.bu-dropdown button{background: var(--primary_color); border: 0px; padding: 7px 16px; border-radius: 8px;
    font-size: 16px;  font-weight: 600; display: inline-flex; align-items: center; gap: 8px;}
.bu-dropdown.equal-height button{padding: 10px 16px;}
.bu-dropdown button:hover{background: var(--primary_color); }
.bu-dropdown button:focus{ box-shadow: none!important;background-color:  var(--primary_color)!important;}
.bu-dropdown.show>.btn-primary.dropdown-toggle {background-color:  var(--primary_color); border-color:  var(--primary_color);}
.tt_contacts{ position: absolute;  right: 0; top: 9px; font-size: 16px;}
.tt_contacts strong{ font-weight: 700;}

.bu-dropdown2 button { background: #fff; border: 0px;padding:8px 16px; border-radius: 8px;
    font-size: 16px; font-weight: 400; display: inline-flex;align-items: center; gap: 8px;
    border: 1px solid #E8E8E8; color: #000; font-size: 14px;}
.bu-dropdown2 button:hover{background:#fff; color: #000!important; border: 1px solid #E8E8E8; }
.bu-dropdown2 button:focus{ box-shadow: none!important;background-color:white!important; color: #000!important;border-color: #E8E8E8!important;}    
.bu-dropdown2.show>.btn-primary.dropdown-toggle {background-color:#fff; border-color: #E8E8E8; color: #000!important;}
.bu-dropdown2 .dropdown-item {width: 100%; padding: 6px 19px; clear: both; font-weight: 400;
    color: #222 !important; text-align: inherit; text-decoration: none;  white-space: nowrap;border: 0; border-bottom: 1px solid #f4f4f4; font-size: 14px; display: flex; justify-content: left;align-items: center; gap: 7px;}
.bu-dropdown2 .dropdown-item:active{ background-color:#fff!important;}
.bu-dropdown2 .dropdown-menu { overflow: hidden; min-width: 198px; padding: 0; margin: 0; color: #212529; text-align: left;  list-style: none;  border: 1px solid #E8E8E8; border-radius: 10px;} 


.select_box {border: 1px solid #E8E8E8; border-radius: 8px;padding: 2px;}
.select_box select{ font-size: 14px; padding:6px 33px 6px 10px; position: relative; background-position: right 8px center;}
._flex{ display: flex; gap: 10px;justify-content: flex-end;}
._tables{ overflow: hidden; border-radius: 14px;}

.m_1.opt_bx.inlines input[type="radio"]+label{padding: 15px 12px;}
.prs_btn{ border-top: 1px solid #eeeeee;}
.prs_btn a{  text-align: center; color: #3a7197; text-decoration: none; font-size: 14px;  padding: 9px 4px;
    font-weight: 400;  font-family: var(--secondry-font); display: flex; align-items: center;  justify-content: center; gap: 6px;}
.ebotbox{ border: 1px solid #d5dff5; border-radius: 12px; padding: 22px;}
.bots_slides.open{ display: block;}
.bots_slides,.add_conversaiton_box input[type="radio"]{ display: none;}

.add_conversaiton_box{  
    position: relative;
    margin-bottom: 8px;}
.chkbox {
    width: 20px;
    height: 20px;
    border: 1px solid #E3E3E3;
    position: absolute;
    right: 10px;
    top: 5px;
    background: #fff;
    border-radius: 100%;
}
.add_conversaiton_box input[type="radio"]:checked + label .chkbox {
    background: #7672FF;
    border: 1px solid #7672FF;
}
.add_conversaiton_box input[type="radio"]:checked + label .chkbox:before {
    position: absolute;
    left: 2px;
    top: 8px;
    height: 6px;
    width: 2px;
    background-color: #fff;
    content: "";
    transform: translateX(5px) rotate(-45deg);
    transform-origin: left bottom;
}
.add_conversaiton_box input[type="radio"]{ display: none;}
.add_conversaiton_box input[type="radio"]:checked + label .chkbox:after {
    position: absolute;
    left: 0;
    bottom: 0;
    position: absolute;
    left: 1px;
    bottom: 4px;
    height: 2px;
    width: 12px;
    background-color: #fff;
    content: "";
    transform: translateX(6px) rotate(-45deg);
    transform-origin: left bottom;
}
.c_labels{  position: relative; padding: 4px 15px 4px 29px; border-radius: 30px;}
.c_labels small{width: 13px; height: 13px; position: absolute; left: 8px;
    top: 9px; border-radius: 100%;}

.thin-border{  border: 1px solid #F4F4F4; border-radius: 8px;}
.t3 .head_btns_bx { width: 33.333%;}
.custom_size .modal-dialog{ max-width: 700px;}
.back-to-page-btn{ background: none; border: 0; padding: 0; margin: 0; cursor: pointer; width: 30px;height: 30px; border-radius: 100%; display: flex;  align-items: center;  justify-content: center;}
.back-to-page-btn:hover{ background: #f2f2f2;}    
._chckbx input[type="checkbox"],._chckbx input[type="radio"]{ display: none;}
._chckbx h3{ font-size: 14px; margin: 0; padding: 0;}
._chckbx p{ color: #444; font-size: 13px; margin: 0;}
._chckbx label{position: relative; padding-left: 38px; display: inline-block; line-height: 17px;}
._chckbx .round-box-2{ border: 1px solid #E3E3E3; width: 28px; height: 30px; position: absolute;
    left: 0; border-radius: 4px; top: 2px;}
._chckbx input[type="checkbox"]:checked + label .round-box-2,._chckbx input[type="radio"]:checked + label .round-box-2{background: #7672FF;border: 1px solid #7672FF;}
._chckbx input[type="checkbox"]:checked + label .round-box-2:before,._chckbx input[type="radio"]:checked + label .round-box-2:before {position: absolute; left: 6px; top: 13px; height: 6px; width: 2px; background-color: #fff; content: ""; transform: translateX(5px) rotate(-45deg); transform-origin: left bottom;}
._chckbx input[type="checkbox"]:checked + label .round-box-2:after,._chckbx input[type="radio"]:checked + label .round-box-2:after {position: absolute;left: 6px; bottom: 9px;height: 2px;width: 13px;background-color: #fff; content: "";transform: translateX(6px) rotate(-45deg); transform-origin: left bottom;}
.channels_table table th{font-size: 14px; font-family: var(--secondry-font); font-weight: 500; padding: 5px;}
.channels_table table td{font-size: 14px; color: var(--textgrey);   padding: 5px;}
.ht_hover{display: flex; align-items: center; gap: 0 10px; padding: 0 !important;}
.hoverinfo{  position: relative;}
.hoverinfo button{ background: none; border: 0; padding: 0;margin: 0;}
.hovertxt{position: absolute ;  display: none; left: 29px;width: 220px;background: #f7f7f7;padding: 7px 7px;text-align: center;font-size: 13px;border-radius: 2px;box-shadow: 0px 0px 4px 0px #d8d8d8;top: -13px;line-height: 19px;}
.hoverinfo:hover .hovertxt{ display: block;}
._gradients{    border: 1px solid #E5E5E5; padding: 18px;  background: linear-gradient(to bottom, #e4e6ff, #fff, #fff 40%);
   border-radius: 20px;}
   .tsbox{ display: flex; align-items: center;  gap: 5px; justify-content: space-between; margin-bottom:25px;}
.tsbox h3{ font-size: 18px; font-family: var(--secondry-font); margin: 0;} 
.tsbox .form-select {  width: 100%; padding:6px 19px 6px 10px; font-size: 14px;  font-weight: 400;  line-height: 1.5;  color: #212529;
    background-color: #fff;  background-position: right 6px center;  background-size: 12px 12px; border: 1px solid #959BFF;  border-radius: 4px;}
  .cn_wrap{ list-style: none; padding: 0; margin: 0;}
.cn_wrap li{ display: flex;    justify-content: space-between;    margin:2px 0px;}
.cn_head{ display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500;}
.cn_head figure{ margin: 0; padding: 0;}
.cn_info{display: flex; align-items: center; gap: 10px;  font-size: 14px;  color: var(--textgrey);}
.cn_wrap li.first_child{ margin-bottom: 25px;}
.cn_info button{ border: 1px solid #7672FF;  background: #fff; font-size: 13px; font-weight: 600;
    color: #7672FF; padding:7px 13px; border-radius: 4px;}
    .cn_info button:hover{ background: #7672FF; color: #fff;}
 .cn_sub strong{ display: block; color: #000;} 
 .cn_sub{line-height: 17px; font-size: 14px;} 
 .cn_wrap li.last-child{ margin-top: 20px;} 
 .performance-reports{list-style: none;  padding: 0; margin: 0; display: flex; gap: 10px;justify-content: space-between;}
  .performance-reports li{ width: 32%; border: 1px solid #C8E2CD; border-radius: 12px; padding:3px 10px; display: flex; align-items: center; justify-content: space-between; font-size: 14px; line-height: 23px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px;
}
.reports-count span{ display: block; font-size: 13px; color: var(--textgrey); font-weight: 400;}
.reports-count{ font-size:24px; font-weight:600;}
.performance-reports li.ts1{  border: 1px solid #C1BCFA;border-left: 2px solid #7672FF;}
.performance-reports li.ts2{ border-left: 2px solid #12BF7D;}
.reporsts-tabs { display: flex;gap: 10px;    flex-wrap: wrap;}
.reporsts-tabs button{
    border:1px solid #E3E3E3;
    background: #fff;
    padding: 10px;
    width: 16%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius:8px 8px 0 0;
    font-size: 14px;
    font-weight: 600;
  
}
.reporsts-tabs button span{ font-size: 13px; font-weight: 400; color: var(--textgrey);}
.reporsts-tabs button.active{ background: var(--bluecolor); color: #fff;}
.reporsts-tabs button.active span{ color: #fff;}
.reports-table-items{ background: #fff; border:1px solid #E3E3E3; border-top: 0;border-radius: 0px 0px 10px 10px;}
._nt_permission{ border: 1px solid #FFC0C0;  background: #FFFBFB;  padding: 12px;  border-radius: 4px;
    display: flex;  align-items: center;  gap: 10px; font-size: 14px;}

    
.channel-users{ border: 1px solid #DFDFDF; text-align: center; padding: 21px 15px; border-radius: 12px;
    box-shadow: 0px 0px 4px 0px rgb(0 0 0 / 0%); margin: 10px 0px;}    
.channel-users  h3{ font-size: 18px; font-weight: 600; margin: 0 0 9px 0;}
.channel-users p{margin: 0 0 4px 0;color: var(--textgrey); font-size: 14px; display: flex; gap: 5px;
    align-items: center; justify-content: center;}
.channel-users p svg{ color: var(--bluecolor);}
.c_btn a,
.c_btn button
{
    border: 1px solid var(--primary_color);
    color: var(--primary_color);
    text-decoration: none;
    padding: 7px 15px; background: none;
    display: inline-block;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
}
.btn-link.disabled {border-color: silver;}
.c_btn a span,.c_btn button span{ display: inline-block; background: url(../img/arrow_right.png) right no-repeat; padding-right: 25px; display: inline-block;}   

.c_btn{ margin-top: 20px;}
.c_btn a:hover{ background: #eefbf6; }
.channel-users figure ._social_media.wts{background: #54BA66;}
.channel-users figure ._social_media.fb{background: #0866FF;}
.channel-users figure{margin: 0 0 27px 0; position: relative; display: inline-block;}
.channel-users figure ._social_media{ color: #fff; position: absolute; width: 30px; height: 30px; display: flex;  align-items: center;  justify-content: center; font-size: 20px; border-radius: 100%;
    bottom: 3px; right: -12px;}
.channel-users.addnew{ text-align: left; display: flex; justify-content: space-between; gap: 8px; position: relative;} 
.adnewchannel{ width: 82%;}    
.channel-users.addnew figure {  margin: 0 0 27px 0; position: relative; display: inline-block; width: 54px;}
.addn { margin-top: 14px;}
.addn a{ color: #B7B9B8; text-decoration: none; font-size: 16px; font-weight: 500; background: url(../img/right-arrow-btn2.png) right 6px no-repeat; padding-right: 30px;}
.active .addn a,
.active .addn button
{
    color: var(--primary_color);
    background: url(../img/arrow_right.png) right 14px no-repeat;
}

.channels_head{ background: #FDFDFF; border: 1px solid #F1F0FF; padding: 12px;border-radius: 10px;}
.channels_status{ display: flex; width: 100%; justify-content: space-between;
    list-style: none;  padding: 0; margin: 5px 0 0 0;}
.channels_status li{ display: flex;}
.channels_status li figure{ margin:0 10px 0 0;}
.channels_stats p{ margin: 0; padding: 0;    font-weight: 600;}
.channels_stats {line-height: 18px; margin-top: 2px;}
.channels_stats span{display: block; color: var(--textgrey); font-size: 14px;}
.channels_user_info{ display: flex; justify-content: flex-start;}
.channels_user_info figure{ width: 52px; margin:  0 21px 0 0; position: relative;}
.channels_info_text p{margin: 0; font-size: 16px; font-weight: 500;} 
.channels_info_text span{ color: var(--textgrey); font-size: 14px; display: block; }
.channels_user_info ._social_media{ position: absolute; bottom: 0; right: -7px;  background: #54BA66;
    color: #fff;  font-size: 14px; border-radius: 100%;  width: 20px;  height: 20px; display: flex;  align-items: center;  justify-content: center; padding-left: 2px;}
.channels_stats span.active{ color: var(--primary_color);}
.channels_stats span.low{ color:#D32030;}
.channels-tabs { display: flex; gap: 10px;}
.channels-tabs button {gap: 9px; border: 1px solid #E3E3E3; background: #fff; padding: 9px 18px;  width: auto;  display: flex; align-items: center;
    justify-content: space-between; border-radius: 8px 8px 0 0; font-size: 14px;font-weight: 600;  flex-wrap: wrap;}
.channels-tab-content{ background: #fff; border: 1px solid #E3E3E3; padding: 20px; border-radius: 0px 10px 10px 10px; -webkit-border-radius: 0px 10px 10px 10px; -moz-border-radius: 0px 10px 10px 10px; -ms-border-radius: 0px 10px 10px 10px; -o-border-radius: 0px 10px 10px 10px; }
.channels-tabs button.active{background: var(--bluecolor); color: #fff;}
.channels-tabs button.active svg path{ stroke: #fff;    stroke-width:1px;}
.extr{border-top: 1px solid #DFDFDF; border-radius: 14px 14px 0 0; padding:10px 15px 15px 20px; margin-top: 24px; }
.channel-users .extr p{justify-content: left; margin: 15px 0px; line-height: 18px;text-align: left;    align-items: flex-start;} 

.chat_message_info_recieving,.chat_message_info_sending{ position: relative  ; min-width: 120px;}
.chatcomponetnsbox{ max-width:350px; position: relative;}
.selected-message-preview{border-left: 3px solid var(--primary_color); background: rgb(255 255 255);
    padding: 10px;  border-radius: 8px;width: 100%; position: absolute; bottom: 56px; overflow: hidden;} 
 .selected-message-preview   button{    position: absolute; top: 7px;  right: 6px; z-index: 1; border: 0px; cursor: pointer; font-size: 13px;}
 .chat_message_info_recieving .dropdown-icon, .chat_message_info_sending .dropdown-icon{position: absolute; visibility: hidden;top: 1px;right: 6px;}
 .chat_message_info_recieving .btn-light:hover, .chat_message_info_recieving .btn-light { background-color: transparent; border-color: transparent;  padding: 0; margin: 0; color: #8f8f8f;}
.chat_message_info_sending .btn-light:hover, .chat_message_info_sending .btn-light
.chat_message_info_recieving .dropdown-toggle::after,.chat_message_info_sending .dropdown-toggle::after{ display: none;}
 .chat_message_info_recieving .btn-light:focus, .chat_message_info_sending .btn-light:focus{ box-shadow: none;}
.chat_message_info_sending .dropdown-menu{ right: 0px; left: auto;}

.selected-message-reply{border-left: 3px solid var(--primary_color); background: rgb(244 244 244);
    padding: 10px; border-radius: 8px; width: 100%; margin-bottom: 12px;}


.insights_list{ list-style: none; padding: 0; display: flex; margin: 26px 0 65px 0;}
.insights_list li{width: 25%; text-align: center; border: 1px solid #DFDFF8; background: #F8F8FF; display: flex; align-items: center;
    justify-content: center;padding: 20px;    min-height: 217px;
}
.insights_list li:nth-child(1){ border-radius: 10px 0 0 10px;}
.insights_list li:nth-child(4){ border-radius: 0px 10px 10px 0px;}
.insights_list li h3  {    font-size: 20px; color: #CDCDFF;}
.insights_list li span,.insights_list li p{ display: none;}
.insights_list li.active{ background: #fff; scale: 1.1; border: 0; box-shadow: 0px 0px 0px 7px #f3f3f3;border-radius: 2px;}
.insights_list li.active span{background: var(--primary_color); color: #fff; padding: 2px 15px; border-radius: 30px; font-size: 13px; font-weight: 500; margin-bottom: 7px;
    display: inline-block;}
.insights_list li.active h3 { font-size: 26px;color: #000000;}
.insights_list li.active p{    font-size: 14px; color: #555555; line-height: 17px; margin: 0;}
.insights_list li.active p,.insights_list li.active span{ display: inline-block;}
.accordion_bx .off .accordion-button::after{ display: none;}
.insights_list_dd{list-style: none; padding: 0; width: 100%; display: flex; flex-direction: column; gap: 18px;}
.insights_list_dd li h3{font-size: 15px; font-weight: 500; margin: 0;}
.insights_list_dd li { padding-left: 22px; position: relative;}
.insights_list_dd li p{ margin: 0; color: var(--textgrey); font-size: 13px;}
.insights_list_dd li p.learnmore a{ text-decoration: none; color: var(--bluecolor);}
.insights_list_dd li p.learnmore a:hover{ text-decoration: underline;}
.insights_list_dd li input[type="radio"]{ display: none;}
.insights_list_dd li label{width: 12px;height: 12px; background: #dbdbdb;top: 3px;border-radius: 100%; position: absolute; left: 0;}
.insights_list_dd li input[type="radio"]:checked + label  { background: #7672FF; border: 1px solid #7672FF;}
.insights_list_dd li input[type="radio"]:checked + label:before { position: absolute; left: 2px;
    top: 8px; height: 6px; width: 2px; background-color: #fff; content: ""; transform: translateX(5px) rotate(-45deg);
    transform-origin: left bottom;}
.insights_list_dd li  input[type="radio"]:checked + label:after { position: absolute; left: 0;  bottom: 0;  position: absolute; left: 1px; bottom: 4px; height: 2px; width: 12px;  background-color: #fff;  content: ""; transform: translateX(6px) rotate(-45deg);
    transform-origin: left bottom;}
.form-create-attribute{ background: var(--menu_fill_color); color: #fff;color: #fff; padding: 20px; border-radius: 12px;}
.form-create-attribute h3{font-size: 17px; font-weight: 600; font-family: var(--secondry-font);margin-bottom: 16px;}
.t_field{background: #2E3A49; padding: 9px 10px; border: 1px solid #495769; font-size: 14px; width: 100%; color: #fff; border-radius: 6px;}
.t_field::placeholder{ color: #969696;}
.t_select{background: #2E3A49; padding: 9px 10px; border: 1px solid #495769; font-size: 14px; width: 100%; color: #fff; border-radius: 6px;}
.chkmrk label{border: 1px solid #495769; background:#2E3A49; padding: 5px 11px; border-radius: 3px; cursor: pointer;}
.chkmrk input[type="checkbox"]{ display: none;}
.chkmrk input[type="checkbox"]:checked + label { background:var(--primary_color); color: #fff;}
td span.system_generated{ color: #929292;}
.add-atrributes input[type="text"]{  background: #2E3A49; padding: 9px 10px; border: 1px solid #495769;  font-size: 14px;  width: 100%; color: #fff;width: 82%; height: 40px; border-radius: 6px;}
.cdolor{ background: #2E3A49; padding: 0;  border: 1px solid #495769; font-size: 14px;  width: 100%;  border-radius: 6px;  display: flex; align-items: center;  gap: 10px; color: #a6a1a1;}
.add-atrributes{  display: flex; width: 100%; justify-content: space-around; align-items: center;}
.add-atrributes button{ border: 0; color: #fff; background: #2c3b4e; width: 27px; height: 27px; border-radius: 100%; font-size: 15px;}
.cdolor input[type="color"]{ box-shadow: none;  width: 35px; height: 37px; border: none;} 
.tags-list-table td span{background: #F3F3F3;border: 1px solid #DDDCDD;padding: 3px 10px;border-radius: 30px;font-size: 13px;}   
.add-attribute-ans{ list-style: none; padding: 0; margin: 8px 0 0 0;}
.add-attribute-ans li{display: flex; align-items: center; justify-content: space-between;
    position: relative; font-size: 13px; border-top: 1px solid #34465a;   padding: 6px 30px 6px 0;}
.add-attribute-ans li button {background: none; border: 0;   color: #fff; font-size: 12px;
    right: 0; position: absolute;}
.add-attribute-ans li:nth-child(1){ border: 0px;}
.msg-quick-reply-box{position: absolute; top: 0; right:3px; }
.msg-quick-reply-box button{    background: #fff url(../img/gradient-bg2.png) repeat center top;
    background-size: cover;
    border: 0;
    font-size: 12px;
    opacity: 0;
    border-radius: 100%;}
.chat_message_info_recieving:hover button,.chat_message_info_sending:hover button,.chatcomponetnsbox:hover button{opacity: 1;}
.msg-quick-reply-dropdown{
    background: #fff;
    width: 140px;
    position: absolute;
    left: 4px;
    z-index: 12;
    top: 0;
    border-radius: 12px;
    box-shadow: 0px 0px 6px rgb(0 0 0 / 16%);
    padding: 10px;
    transform: scale(0.01);
    opacity: 0;
    transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease 0.15s;
    transform-origin: center top;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
}
.resend_btn .theme_btn  { background: #fff;  border: 1px solid #ccc;  color: #333;  width: auto;  padding: 12px 25px; font-size: 16px;}
.resend_btn .g_mail{     display: flex;
    justify-content: center;
    background: var(--primary_color);
    border: 0;
    color: #fff;
    padding: 11px 25px;
    transition: ease all 0.4s;
    font-size: 16px;
    border-radius: 8px;
    cursor: pointer;
    width: auto; text-decoration: none;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;}
.verify_num{
    color: #7672FF;
    text-decoration: none;
    font-weight: 500; background: url(../img/whatspp-icon.png) no-repeat right; padding-right:24px;
}
.msg-quick-reply-dropdown.sender{ left: auto; right: 0; top: auto; bottom: 0;}    
.msg-quick-reply-dropdown.open { transform: scale(1); opacity: 1;
    box-shadow: 3px 3px 30px rgb(0 0 0 / 30%);}
.msg-quick-reply-dropdown ul{ list-style: none; padding: 0; margin: 0;}    
.msg-quick-reply-dropdown ul li a{text-decoration: none; color: var(--textgrey); font-size: 14px;
    display: flex; align-items: center; gap: 8px; justify-content: flex-start; padding: 5px 10px;
    border-radius: 5px;}    
.msg-quick-reply-dropdown ul li a:hover{ background: #f2f2f2;}
.fill_form_bx{ font-size: 17px; padding-left: 30px;  position: relative;  line-height: 17px;
    padding-right: 12px;  font-weight: 600;  padding-top: 7px;}
.fill_form_bx span{ display: block;  font-size: 13px;  font-weight: 300;}
.fill_form_bx figure{  width: 20px;  position: absolute;  left: 1px;  top: 9px;}
.your-response-modal h4{ font-size: 15px;font-weight: 600;    margin-bottom: 10px;}
.response-data .Keylabel{font-size: 13px; color: #a5a5a5;}
.response-data .value-ans{font-size: 14px; color: #111;}
.response-data{ display: flex; gap: 10px;}
.fill-form{  cursor: pointer;}
.btn_call  button{  border: 1px solid #F6F6F6;height: 33px;width: 33px;display: grid !important; place-items: center; border-radius: 10px;background: #fff !important;}
.dial_ring_btn{    border-radius: 6px;
    border: 1px solid #ede9e9;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 20px;
    gap: 7px;
    font-size: 14px;}
.pr_4{ padding-right: 37px!important;}
.table.reposts_tbl>:not(caption)>*>* { padding: .5rem 0px;}
.table.reposts_tbl .reports_nm { width: 180px;}
.dropdown-icon {
                    /* position: absolute; */
              
                visibility: hidden;
}

                .chat_message_info_recieving:hover .dropdown-icon,   .chat_message_info_sending:hover .dropdown-icon {
                    visibility: visible;
}
.custom-confirm-buttons .btn_back {padding: 6px 20px;}
.custom-confirm-close{ position: absolute; right: 5px; top: 5px; cursor: pointer;}
.custom-confirm-content h5{    font-size: 20px;   font-family: var(--secondry-font);  color: #000;  max-width: 260px;}
.adm  h4{font-size: 13px; font-weight: 400; color: #333; margin:10px 0 6px 0;}
.extlink{ font-size: 15px;  color: #236BFE;  text-decoration: none; font-weight: 700;}
._progress_bar_top{ display: flex; align-items: center; justify-content: flex-end; gap: 9px;}
._ct{ font-size: 14px;}
.option_rd{ display: flex; align-items: center; justify-content: left; gap: 20px;}
.option_rd input[type="radio"],.dt_h input[type="radio"]{ display: none;}
.option_rd label{padding-left:27px; position: relative;  color: #1E2A38;  font-size: 14px; font-family: var(--primary-font);}
.option_rd label span{ width: 20px; height: 20px; border: 1px solid #D9D9D9; background: #fff;
    display: inline-block; border-radius: 100%; position: absolute; left: 0; }

.option_rd input[type="radio"]:checked + label span:before{position: absolute; left: 3px;  top: 3px; background: var(--primary_color); width: 12px; height: 12px; content: ''; border-radius: 100%; transition: ease all 0.4s;}
.dt_h {    justify-content: flex-end; gap:8px; display: flex; align-items: center;}
.dt_h label{  font-size: 13px;  border: 1px solid #DFDFDF; display: inline-block; padding:3px 21px; border-radius: 30px;    color: var(--textgrey); cursor: pointer;}
.dt_h input[type="radio"]:checked + label{ background: var(--primary_color); color: #fff;border: 1px solid var(--primary_color);}
.manage_tabs button.active.tsbtn  svg path{stroke: #fff;}
.page-tabs{border-bottom: 1px solid #e6e6e6; display: flex;  flex-wrap: wrap; width: 100%; gap: 0;}
.page-tabs button{border: 0; font-family: var(--secondry-font);  padding: 5px 22px;
    font-size: 16px;  color: var(--bcolor);  position: relative; display: flex; align-items: center;
    gap: 4px; background: none; border-radius: 0;}
.page-tabs button.active {color: var(--primary_color); background: no-repeat; font-weight: 600;}
.page-tabs button.active:before{width: 100%;  height: 2px; background: var(--primary_color);
    position: absolute;  bottom: 0; left: 0; content: '';}
.page-tabs button.active  svg path{fill: #fff; stroke: #fff;}
.ps-right{position: absolute; right: 0; top: 5px; display: flex; gap: 10px;}
.filter_by_select{border: 1px solid #E8E8E8; padding: 4px 0 4px 8px; border-radius: 8px;  display: inline-flex; flex-wrap: wrap;  justify-content: center; align-items: center; background: #fff;}
.text-filter select{color: #236BFE; text-align: end; font-weight: 500; cursor: pointer; margin-right: 5px;}
.text-filter option{ color: var(--bcolor); font-weight: 400; }
.btn-toggles{ background: #F5F7F9;  border-radius: 8px; border: 1px solid #E8E8E8;margin: 0 12px;}
.btn-toggles button{border: 0; padding: 11px 10px; background: no-repeat; overflow: hidden; border-radius: 8px; transition: ease all 0.4s; }
.btn-toggles button.active{ scale: 1.1;  background: #fff;  box-shadow: 0px 0px 13px 2px #e0e0e0;}
.ps-btn{font-weight: 500;  padding: 4px 12px; border-radius: 4px; font-size: 12px; transition: all 0.3s ease;}
.ps-btn.ts{ background:#E9F0FF; color: #236BFE; border:1px solid #B3CBFF}
.ps-btn.ts:hover, .ps-btn.ts.active{background: #236BFE; color: #fff;}
.ps-btn.fs{ background:#F2F2FF; color: #7672FF; border:1px solid #DCDCFF}
.ps-btn.fs:hover, .ps-btn.fs.active{background: #7672FF; color: #fff;}
.ps-btn.ups{ background:#E0FFF3; color: #0AAC6D; border:1px solid #A7F2D5}
.ps-btn.ups:hover, .ps-btn.ups.active{background: #0AAC6D; color: #fff;}
.ps-btn.over{ background:#FFEAEC; color: #D32030; border:1px solid #F2C5C9}
.ps-btn.over:hover, .ps-btn.over.active{background: #D32030; color: #fff;}
.scr_num{  border: 1px solid #D8D8D8; display: inline-block;  padding: 2px 10px; border-radius: 5px;font-size: 12px;}

.msg-num li{width: 49%; border: 1px solid #e9e9e9; text-align: center;  padding: 7px 5px;border-radius: 5px;  font-weight: 600;  cursor: pointer; color: var(--primary_color);}
.msg-visit li{border-top: 1px solid #e9e9e9;  text-align: center; padding: 10px 0px; font-weight: 600;
    color: var(--primary_color); cursor: pointer;}
.billing-plans-card{ border: 1px solid #E6E6E6; border-radius: 6px;}
.billing-plans-card-head{border-bottom: 1px dashed #D4D3FF; padding: 15px 11px; display: flex
; justify-content: space-between;    align-items: center;}
.billing-plans-card-head .plan-name{ font-size: 18px; color: #000; font-family: var(--secondry-font);}
.billing-plans-card-head span.pro{border: 1px solid #7672FF; color: #7672FF;
    display: inline-block; padding: 2px 7px; border-radius: 30px; font-size: 12px;background: #FAFAFF;}
.plan-exp-date{ font-size: 13px; font-style: italic;  color: #484747;}
.billing-plans-value h3{font-weight: 700; font-size: 30px;}
.billing-plans-value h3 span{ font-weight: normal; font-size: 13px; color: #8f8d8d;}
.plan-cancel-btn{ border: 0px; color: #7672FF; background: no-repeat; padding: 0;}
.plan-cancel-btn:hover{ color:var(--themecolor);}
.billing-card-info-head h3{ font-size: 18px; margin: 0;}
.billing-card-info-head .cd-price{ font-weight: 700; font-size: 22px;}
.plus-btn{  background: no-repeat;  border: 0; color: var(--primary_color);
    display: flex;  align-items: center;  gap: 4px;}
.plus-btn svg path{fill: var(--primary_color);}
.bs-details  h3{font-size: 18px;font-weight: 500; font-family: var(--secondry-font);}
.bs-details .edits{  background: no-repeat;  border: 0;  padding: 0;  color: #7672FF;}
.bs-details .billing-address{ list-style: none;  padding: 0; display: flex; width: 100%;
    gap: 19px;  margin: 0;justify-content: space-between;}
.bs-details .billing-address li span{display: block; font-size: 12px; color: #8f8f8f;}
.bs-details .billing-address li{ font-size: 13px;}
.bs-detail{ min-height: 120px;}
.download-file{ background: none;  border: 0;  padding: 0; margin: 0;}
.invoice-td{display: flex;  color: #000;  align-items: center;  gap: 9px;}
.paid-td{  border: 1px solid #12bf7d;  color: #12bf7d;  text-align: center;  display: inline-block;  padding: 1px 10px;  border-radius: 7px;}
.standard-box,.existence-box{ width: 46%;}
.standard-box{    border: 1px solid #12BF7D; background: #fafefc; border-radius: 10px;}
.existence-box{    border: 1px solid #7672FF; background: #fcfcff; border-radius: 10px;}
.due-td{  border: 1px solid #D32030;  color: #D32030;  text-align: center;  display: inline-block;  padding: 1px 10px;  border-radius: 7px;}
.std_btn5{ background: #12BF7D; color: #fff; border: 0px; border-radius: 6px;font-size: 17px;    box-shadow: 0px 0px 13px 0px #cbcbcb;}
.std_btn5:hover{ background: #09ab6d;}
.onboarding_wrap{ height:422px; overflow: hidden;}
.text-border-radius-30{ width: 100%; height: 65px; border: 1px solid #e5e5e5; padding: 9px; border-radius: 9px; font-size: 14px; color: #8f8f8f;}
.tt_tip  span{  width: 20px;  height: 20px; display: inline-block; text-align: center; cursor: pointer; border: 1px solid #ccc; border-radius: 100%;
    font-size: 12px; margin-left: 12px;}
    .tt_tip.tooltips .tooltip-text{width: 340px;}
.std_btn6{ background: #7672ff; color: #fff; border: 0px; border-radius: 6px;font-size: 17px;    box-shadow: 0px 0px 13px 0px #cbcbcb;}
.std_btn6:hover{ background: #615cfa;}

.leads_data_info {
    overflow-x: auto; /* Enable scroll if content overflows */
    width: 100%;
}
.overflow-text{ -webkit-line-clamp: 1; -webkit-box-orient: vertical;
    overflow: hidden;  height: 17px;  display: -webkit-box;  text-overflow: ellipsis;
    max-width: 110px;}
.chat_msg_document a{background: #ffffff; padding: 6px 9px;
    display: block;  color: #111; text-decoration: none; border-radius: 6px;
    display: flex;  align-items: center; gap: 13px;}
.chat_msg_document .doc_donwload{ background: #fff; border: 0; font-size: 12px; width: 30px; height: 30px; border-radius: 100%;
    border: 1px solid #f2f2f2;}  
    .table-title{font-size: 14px; color: #111; font-weight: normal;}  
    .shor-data{ margin: 0;}
.video_item video{ width: 100%;border-radius: 8px; overflow: hidden;}
.leads_data_info ul {
    display: flex;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;    min-height: calc(100vh - 177px);
    flex-wrap: nowrap; /* Prevent wrapping */
    overflow-x: auto; /* Show scroll when needed */
}

.leads_data_info ul li {
    background: #fff;
    padding: 16px 0px 10px;
    border: 2px solid #e6e6e6;
    width: calc((100% - 24px) / 4); /* Fit 4 items with 8px gap */
    min-width: 325px; /* Optional: ensures a reasonable min width */
    border-radius: 14px;
    flex-shrink: 0; /* Prevent shrinking */
}

.leads_data_info ul li:nth-last-child(3) {border-color: #A7F2D5;}
.leads_data_info ul li:nth-last-child(3) h3,.leads_data_info ul li:nth-last-child(3) .scr_num{color: #0AAC6D; border-color:#A7F2D5 ;}
.leads_data_info ul li:nth-last-child(2) {border-color: #F2C5C9;}
.leads_data_info ul li:nth-last-child(2) h3,.leads_data_info ul li:nth-last-child(2) .scr_num{color: #D32030; border-color:#F2C5C9 ;}
.leads_data_info ul li:last-child {border-color: #d7d3d3;}
.leads_data_info ul li:last-child h3,.leads_data_info ul li:last-child .scr_num{color: #c3c3c3; border-color:#d7d3d3 ;}
.leadbx{    border: 1px solid #d9d9d9;
    background: #FBFBFB;
    border-radius: 6px;
    margin: 0px 12px 0 0;
    box-shadow: 0px 0px 5px 0px #d5d5d5;}
.leadhead{ padding: 12px;}
.leadhead h4{ font-size: 14px; font-style: italic; font-weight: 600;}
.card-scroller {    
    height: calc(100vh - 257.29px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0px 0px 0px 16px; display: flex; flex-direction: column; gap: 12px;}
.custom-scroller::-webkit-scrollbar{width: 6px;}
.custom-scroller::-webkit-scrollbar-thumb{  background: #888; transform: translate(0px, 20px);
    border-radius: 10px;}
.prevnext-btn{font-size: 13px;}
.prevnext-btn button{border: none; background: transparent; color: #236BFE;font-weight: 600;}
.prevnext-btn button:disabled{color: var(--bcolor);}
.prevnext-btn button:hover{color: var(--approved);}

.lead_num_row{ display: flex; gap: 10px; justify-content: flex-end;}
.lead_num_row a{background: #fff; padding: 8px 9px;  border-radius: 10px; display: flex; align-items: center;
    justify-content: center; border: 1px solid #F6F6F6; color: var(--textgrey); font-size: 17px;}
.lead_num_row a:hover,.lead_num_row .leads_chatms.active a{ color: var(--primary_color);}
.leads_chatms a{ position: relative;}
.leads_chatms a span { position: absolute; right: 0; top: -9px; font-size: 12px;}
.leads_ft{ border-top: 1px solid #F0F0F0;  display: flex;   justify-content: space-between;  font-size: 13px; padding: 12px;  color: var(--textgrey);}
.lead-table .form-check-input{width: 20px; height: 20px; margin-top: 0;}
.lead-table .funnel{background: #A9A9A9; padding:5px 4px;border-radius: 6px; color: #fff;}
.lead-table .funnel.bkg-green{background: #18B34C;}
.lead-table .funnel.bkg-purple{background: #7672FF;}
.lead-table .funnel.has-text{flex: 1; text-align: center; display: -webkit-box;text-overflow: ellipsis; -webkit-line-clamp: 1;-webkit-box-orient: vertical; overflow: hidden;}
.activity{    font-size: 14px;  background: url(../img/video-icon.png) no-repeat 0px 2px;
    padding-left: 25px;  color: var(--textgrey);  margin-top: 4px;
    gap: 2px;    display: flex; align-items: center;}
.rsv{font-size: 12px;  padding: 3px 10px 3px 21px; height: 22px;  border-radius: 30px;  position: relative; border: 1px solid transparent; text-align: start;}
.rsv span{width: 13px;height: 13px;display: inline-block;border-radius: 50%;position: absolute;left: 3px;top: 50%; transform: translateY(-50%);}
.rsv h4{font-size: 11px; display: -webkit-box; text-overflow: ellipsis;  -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;  max-width: 69px; overflow: hidden;}
.lead-name{display: -webkit-box; text-overflow: ellipsis;  -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;  max-width: 100%; overflow: hidden;}
.activity span{ text-transform: capitalize;}
.mts{ font-size: 14px;  color: var(--textgrey);  margin-top: 8px; display: flex; align-content: center;
    flex-wrap: wrap;  align-items: center;  gap: 5px;} 
.mts span{width: 8px;height: 8px;display: inline-block;border-radius: 100%;}
.lead-table .rsv{ padding: 12px 10px 0px 22px; width: 112px; height: 29px; display: flex; align-items: center;}
.lead-table .rsv span{ width: 20px;height: 20px; left: 4px; top: 50%;transform: translateY(-50%);}
.lead-table .rsv h4{font-size: 12px; transform: translate(3px, -6px);max-width:100%;}
.msg-notification{position: relative; width: 33px; height: 33px; display: grid; place-items: center; border: 1px solid #F6F6F6; background: #fff; border-radius: 10px; padding: 6px;}
.msg-notification .fa-message{color: #525252; font-size: 17px;}
.msg-notification .notice-num{position: absolute; display: none; top: -11px; right: 0px; font-size: 12px; }
.msg-notification.active .fa-message{color: #18B34C;}
.msg-notification.active .notice-num{display: block; color: #18B34C;}
.select-option-md{position: relative;  width: 100%;}
.select-option-md select{  appearance: none;    -webkit-appearance: none;
      -moz-appearance: none;width: 100%;    padding: 12px 10px;    padding-right: 35px;
      border: 1px solid #E8E8E8;border-radius: 6px;    font-size: 14px;    background: #fff;    background-image: none;
      cursor: pointer;}
.select-option-md::after {
      content: '▼';
      position: absolute;
      top: 50%;
      right: 12px;
      transform: translateY(-50%);
      font-size: 12px;
      color: #888;
      pointer-events: none;
    }
.select-option-md.s_icon select{  padding-left:32px;}
.s_icon img{  position: absolute;  left: 8px;  top: 50%;  transform: translateY(-50%);}
.select-option-md.s_icon select option{ padding-left: 10px;}
.lead-mng-option input[type="radio"],.leads_cs li input[type="checkbox"]{ display: none;}
.lead-mng-option h3{  font-size: 15px; font-weight: 600;}
.lead-mng-option p{ font-size: 14px; color: var(--textgrey);margin: 0;}
.lead-mng-option{ padding-left: 37px; position: relative; margin: 8px 0 24px 0px; }
.ckt{width: 20px;  height: 20px; border: 1px solid #A8A8A8; position: absolute;left:0px;  top:0px; background: #fff; border-radius: 100%;}
.lead-mng-option input[type="radio"]:checked + label .ckt,.leads_cs li input[type="checkbox"]:checked + label .ckt { background: #7672FF; border: 1px solid #7672FF;}
.lead-mng-option input[type="radio"]:checked + label .ckt:before,.leads_cs li input[type="checkbox"]:checked + label .ckt:before  { position: absolute; left: 2px; top: 8px; height: 6px; width: 2px; background-color: #fff;
    content: "";  transform: translateX(5px) rotate(-45deg); transform-origin: left bottom;}
.lead-mng-option input[type="radio"]:checked + label .ckt:after,.leads_cs li input[type="checkbox"]:checked + label .ckt:after {left: 0; bottom: 0; position: absolute; left: 1px; bottom: 4px; height: 2px; width: 12px;
    background-color: #fff;  content: "";  transform: translateX(6px) rotate(-45deg); transform-origin: left bottom;}
.leads_cs{ list-style: none; margin: 0 0 0 40px; padding: 0;}
.leads_cs li{position: relative; padding-left: 28px; margin: 9px 0px; font-size: 14px; color: var(--textgrey);}
.lds input[type="text"]{ width: 72px; border: 1px solid #ccc; height: 45px; border-radius: 6px; text-align: center;}
.rts  input[type="radio"]:checked + .ctr_btn{ background:#f1f5ff ;}
.accordion_bx ._mns  .accordion-button::after{ display: none;}
.button_check:first-child label{ background: #F4F4F4;  color: #111; font-size: 14px; border: 1px solid #F4F4F4;
    border-radius: 5px; cursor: pointer;font-weight: 400;}
.button_check:first-child label svg path { stroke: #111;}
.button_check label{ background: #E5FDF4;  padding: 7px 12px;  display: flex; align-items: center; justify-content: center; gap:5px; font-size: 14px; border: 1px solid #B7F0DA; color: #12BF7D; border-radius: 5px; cursor: pointer;font-weight: 400;}
.button_check label svg path { stroke: #12BF7D;}


.button_check  input[type="checkbox"]:checked + label{ background:#E5FDF4 ; border: 1px solid #B7F0DA; color: #12BF7D;}
.button_check  input[type="checkbox"]:checked + label svg path { stroke: #12BF7D;}
.button_check:first-child label{ border-radius:15px 0 0 15px; -webkit-border-radius:15px 0 0 15px; -moz-border-radius:15px 0 0 15px; -ms-border-radius:15px 0 0 15px; -o-border-radius:15px 0 0 15px; }
.button_check:last-child label{ border-radius:0px 15px 15px 0px; -webkit-border-radius:0px 15px 15px 0px; -moz-border-radius:0px 15px 15px 0px; -ms-border-radius:0px 15px 15px 0px; -o-border-radius:0px 15px 15px 0px; }
.ats-rule{ display: flex; color: var(--textgrey); font-size: 14px; gap: 8px; margin-bottom:5px;}
.str_stage{background: #F2F2FF; padding: 9px 10px;border-radius: 5px; border: 1px solid #E8E8E8; display: flex; justify-content: space-between; align-items: center;}
.str_stage button{ border: 0; padding: 0; cursor: pointer;}
.delete_btnr,.add_btn_field{  border: 0;background: #ffffff; display: flex; align-items: center; border-radius: 100%;
    justify-content: center; padding: 0;}
.sts-form{ display: flex; gap: 10px; flex-wrap: nowrap; align-items: center; margin:10px 0px;}
.addfunnelmodel{ background: no-repeat; border: 0; display: flex; gap: 4px; color: #236BFE; font-size: 14px;
    font-weight: 600;}
.btn-drag-field{ background: none; border: 0; cursor: pointer;}
.fcs--{ border: 1px solid #EEEEEE; padding: 20px;  border-radius: 10px; margin-top: 30px; background: #FDFDFD;}
.selectfield.bs{background: #F0EFFF; border: 1px solid #D6D6D6;}
.modal-head._with_discription{ display: block;line-height: 19px;}
.modal-head._with_discription span{display: block;font-size: 14px;font-weight:400; color: #555555;}
.createfil-box{ background: #F8F8FF; padding:0 20px 20px 20px; border: 1px solid #E5E4FF; border-radius: 8px;
    margin-top: 10px;}
    .b_dashed{ border-bottom:1px dashed #C9CCFF ;}
 .cpmdt-tools{ padding: 40px 0px;}
 .cpmdt-tools h3 {    font-size: 24px; font-family: var(--secondry-font); margin: 0 0 8px 0;} 
 .tsde{ color: var(--primary_color);  font-size: 14px; }
 .tsde span{ color: #111;}
 .unsubscribe_btn{
    width: 50%;
    background: #fff;
    border: 1px solid #D32030;
    color: #D32030;
    padding: 10px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;

}

.stp_promotional_bx{overflow: hidden; background: #FAFAFA; border: 1px solid #E9E9E9; border-radius: 8px; font-size: 14px;}
.stp_stop a{ background: #FFE8EA; text-align: center; padding: 10px;color: #D32030; text-decoration: none; font-weight: 600; font-size: 16px;
    display: flex; align-items: center; justify-content: center; gap: 5px;}
.stp_stop a:hover{ background:#f3d1d4;} 
.add-ts button{background: none; border: 0;padding: 0; margin: 0;}  
.add-ts{ display: flex; justify-content: center; align-items: center; gap: 9px; margin-left: 19px;} 
.profile_imagebox button{ position: absolute; right: 0; bottom: 0; background: #fff; border-radius: 100%;
    font-size: 9px;  width: 24px;  height: 24px; border: 1px solid #f1eded; display: flex; align-items: center;
    justify-content: center;}
.profiel-dt-form { background:#FDFDFF;    height: 100%;}    

.inf_fields_type {
  width: 100%;
  min-height: 40px;
  max-height: 150px; /* or whatever you prefer */
  resize: none;
  overflow-y: auto;
  padding: 10px 40px;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  line-height: 20px;
  box-sizing: border-box;
  outline: none;
  background: #fff;
}

            .message-bubble {
  background-color: #dcf8c6;
  padding: 10px 14px;
  border-radius: 8px;
  display: inline-block;
  max-width: 300px;
}

.msg-quick-reply-dropdown ul {
  list-style: none;
  padding: 0px;
  background: #fff;
  border-radius: 6px;
  margin-top: 0px;
  display: flex;
  gap: 1px;flex-wrap: wrap;
}
.msg-quick-reply-dropdown ul li{ width:100%;}
.msg-quick-reply-dropdown ul li a {
  text-decoration: none;
  font-size: 14px;
  color: #333;
}

.reaction-bar {
  position: absolute;
  bottom: 40px;
  left: 10px;
  background: #fff;
  padding: 5px 10px;
  border-radius: 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.15);
  display: flex;
  gap: 10px;
  z-index: 10;
}

.reaction-emoji {
  cursor: pointer;
  font-size: 20px;
  transition: transform 0.1s;
}
.reaction-emoji:hover {
  transform: scale(1.3);
}


.inf_fields_type {
  direction: ltr !important;
  unicode-bidi: plaintext !important;
  text-align: left !important;
  white-space: pre-wrap;
  word-break: break-word;
}
.action_btn button{ background: none; border: 0; padding: 0; margin: 0;    color: #a19a9a;    font-size: 14px;}
.action_btn button:hover{ color: #333;}
.none_style.m1.bg_none> button{border: 1px solid #e9e9ea; background: #fff !important; padding: 7px; border-radius: 6px; display: flex; align-items: center; width: 36px; height: 36px; margin: 0;}
.none_style.m1.bg_none .dropdown-menu { min-width: 349px; padding: 12px; border: 1px solid #ededed; border-radius: 8px; transform: translate(-270px, 45px)!important;}
.dd_bts button{ padding: 5px 20px!important;}

.sticky-date {    position: sticky;
    top: 0;
    background-color: #f1f1f1;
    z-index: 10;
    padding: 4px 4px;
    text-align: center;
    font-weight: 500;
    border-radius: 6px;
    margin: 8px auto;
    width: fit-content;
    box-shadow: 0px 0px 4px 0px #e3e3e3;
}
.preview_attachment video{ width: 100%;}
.chat_msg_text .clr__ a { font-size: 14px; padding: 9px 0px;}
.fixsidebar{position: -webkit-sticky !important; position: sticky !important; top: 0; align-self: flex-start; height: 100vh;}
.chat_msg_audio audio{ width: 220px;}
.s-card{ background: #fff; border: 1px solid #C6EDDE; border-radius: 10px 10px 10px 10px; }
.s-card figure img{ width: 100%; height: 176px;}
.chatbox_messagebox  .slick-slider .slick-slide>div{ padding: 0 2px;}
.chatbox_messagebox  .slick-slider .slick-next { right: -8px;z-index: 2;}
.chatbox_messagebox  .slick-slider .slick-prev { left:-17px;z-index: 2;}
.chatbox_messagebox  .slick-prev:before, .chatbox_messagebox  .slick-next:before { font-size: 30px; opacity: 1; color: #dfd5d5;}
.chatbox_messagebox  .slick-track { margin-right: initial;}
.chatbox_messagebox .slick-slider{ padding:0;}
.carousel-ts .chat_message_info_sending{ width: 266px; margin-right: 27px;}
.create_search_filter  .MuiOutlinedInput-input{padding: 10.5px 14px!important;font-size: 13px;}
.create_search_filter .MuiList-root li{ font-size: 13px!important;}
.cdr_dt .MuiOutlinedInput-input{padding: 10.5px 14px!important; font-size: 13px!important;} 
.cdr_dt { background: #fff;  padding: 18px 12px 10px; border-radius: 8px;  border: 1px solid #eeeeee;}
.fs_logo{ position: absolute; right: 20px; top: 20px;}
.signup_with a{ border: 1px solid #EBEBEB; padding: 12px 12px;border-radius: 8px;  width: 48%; text-align: center; text-decoration: none; display: flex;     gap: 8px; align-items: center; justify-content: center; color: #111; font-size: 14px;}
.signup_with a:hover{ background: #f2f2f2;}
.als_link {justify-content: center; color: var(--textgrey); font-size: 14px; gap: 6px;}
.consent_box a{color: var(--textgrey); text-decoration: none;}
.als_link a,.consent_box a:hover{ color: var(--primary_color);}
.consent_box{color: var(--textgrey); font-size: 14px; display: flex; gap: 9px;    justify-content: space-between;}
.slide-out-left { transition: transform 200ms ease, opacity 200ms ease; transform: translateX(-100%); opacity: 0; -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); -webkit-transition: transform 200ms ease, opacity 200ms ease; -moz-transition: transform 200ms ease, opacity 200ms ease; -ms-transition: transform 200ms ease, opacity 200ms ease; -o-transition: transform 200ms ease, opacity 200ms ease; }

.highlight {
  animation: highlight-animation 2s ease-out;
}

.fade-message {
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
  color: green;
  margin-left: 8px;
}

.fade-message.show {
  opacity: 1;
}
.themebtn.disabled {
    background-color: silver;
    cursor: not-allowed;
}
.bp_plans_items ul {
  padding: 0;
  list-style-type: none;
}
.active-points{ 
    position: absolute;
    right: 0;
    top: -1px;
    width: 8px;
    height: 8px;
    background: #12bf7d;
    border-radius: 100%;
}
.close-chat-num{ display: flex;  gap: 6px;}
.close-chat-num span{ font-style: italic; color: #E56262;font-size: 12px;}
._bv-label {
  position: absolute;
  left: 1px;
  top: 1px;
  background-color: #EEE;
  display: flex;
  width: 41px;
  height: 44px;
  justify-content: center;
  align-items: center;
  border-radius: 6px 0 0 6px;
  font-weight: bold;
  font-size: 12px;
}

/* CSS for JSON highlight */
.string { color: #ce9178; }
.number { color: #b5cea8; }
.boolean { color: #569cd6; }
.null { color: #569cd6; }
.key { color: #9cdcfe; }

.opt_bx.disabled {opacity: 0.5;}

@keyframes highlight-animation { 0% { background-color: gray;}
  100% {background-color: transparent;}}

  .new-message-notification {
    position: absolute;
    bottom: 80px;
    right: 20px;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px;
    padding: 8px 16px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    z-index: 1000;
    backdrop-filter: blur(10px);
    border: 1px solid #e0e0e0;
    transition: all 0.3s ease;
}

.new-message-notification:hover {
    background: rgba(255, 255, 255, 1);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

.notification-content {
    display: flex;
    align-items: center;
    gap: 8px;
}

.notification-icon {
    color: #25D366;
    font-size: 14px;
}

.notification-text {
    color: #333;
    font-size: 14px;
    font-weight: 500;
}

.add-auto-field{border-top: 1px dashed #e6e6e6; padding-top: 12px; margin-top: 12px;display: flex;justify-content: flex-end;}
.add-auto-field button{    font-size: 13px; border: 1px solid #3678fe; border-radius: 6px;color: #3678fe;  padding: 4px 10px; display: flex; align-items: center; gap: 10px; font-weight: 600;}
.__check .ckt{ top: 4px;}
.ps .lead-mng-option{ padding-left: 29px;}
.loader-spinner-container{    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
    height: 100%;
    background: hwb(0deg 0% 100% / 76%);
    justify-content: center;
    align-items: center;
    display: flex;
    z-index: 999;
}
.loader-spinner-container p{
    color: #ffffff;
    font-size: 13px;
    font-weight: 300;    max-width: 320px;
}
.loader-spinner {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  border: 4px solid #0000;
  border-radius: 50%;    margin: 0 auto 21px;
  border-right-color: #25b09b;
  animation: l15 1s infinite linear;
}
.loader-spinner::before,
.loader-spinner::after,.btn-loader-spinner::before,
.btn-loader-spinner::after {    
  content: "";
  grid-area: 1/1;
  margin: 2px;
  border: inherit;
  border-radius: 50%;
  animation: l15 2s infinite;
}
.loader-spinner::after,.btn-loader-spinner::after {
  margin: 8px;
  animation-duration: 3s;
}
@keyframes l15{ 
  100%{transform: rotate(1turn)}
}

.spin {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.btn_3.disabled, .btn_3.disabled:hover {
    background-color: #BBB;
    color: #FFF;
    border-color: #BBB;
}




/* Animation for the notification */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.new-message-notification {
    animation: pulse 1s ease-in-out;
}
.button-type-selector {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.button-type-selector .button-type{background: #F5F5F5;
    border: 1px solid #E8E8E8;
    padding: 6px 9px;
    border-radius: 12px;
    color: var(--textgrey);
    font-size: 14px;
    font-weight: 500;
    width: 100%;
    justify-content: center;
    display: flex;
    gap: 10px;    cursor: pointer;
    align-items: center;}
    .button-type-selector .button-type.active{background: #fff; color: var(--bluecolor);}
    .cols-data{
    display: flex;
    gap: 10px;
    justify-content: center;
    align-items: center;
}
.variable-container{ margin-bottom: 13px;}
.broadcast-box{position: absolute;  bottom: 86px;  z-index: 8;  background: #fff;
    width: 58%;  box-shadow: 0px 0px 4px rgb(0 0 0 / 28%); padding: 7px 12px;
    border-radius: 5px;  display: flex;  justify-content: space-between;
    align-items: center;  font-size: 14px;  color: #111;  left: 50%;  margin-right: -50%;
    transform: translate(-50%, -50%);}
.bss{ color: #11A16A; text-decoration: none;}
.bss:hover{ color: #111;}
.d-select{ margin-left: 20px; display: inline-block;}
.code-delivery-setup{ background: #FBFBFF;  padding: 12px; border: 1px solid #E0DFFF;border-radius: 10px;}
.notes__{ font-size: 14px;  color: var(--textgrey);  margin: 0 0 0 37px; border-top: 1px solid #E0DFFF;
    padding-top: 14px;}
.broadcast-item{ display: flex; gap:6px;}
.broadcast-item select.selectbox{ width: 172px; height: 41px;}
.baseurl{width: 100%;
    border: 1px solid #E8E8E8;
    padding: 11px 85px 11px 11px;
    border-radius: 8px;
    font-size: 14px;}
    .css-18jp67o-MuiNativeSelect-root-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input{padding: 11.5px 14px!important; font-size: 13px!important;}
  .quick-reply-btn  {color: #C2C2C2;
    background: #F9F9F9;
    padding: 10px;
    display: inline-flex;
    border-radius: 100%;
    width: 40px;
    height: 40px; border:0px;
    justify-content: center;
    align-items: center;}
    .quick-reply-btn:hover{background: #ededed; color: #C2C2C2;}
    .source-web{background: url(../img/phone-icon.png) no-repeat 1px 4px; padding-left: 12px;
    color: #878787;  font-size: 13px;  margin-top:4px;    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;}
    .auto_width_ms1{ width: 80%;}

    .btn-loader-spinner {  width: 26px;  aspect-ratio: 1;  display: grid;  border: 2px solid #0000;  border-radius: 50%;  margin: 0 0 0 14px;  border-right-color: #ffffff;  animation: l15 1s infinite linear;}
    .dd_channels.active{    background: #f0f1ff; cursor: pointer;}
    .lead-analytics-chart .recharts-xAxis{ font-size: 10px!important;}
    .message_sent_chart{display: flex;
    align-items: center;
    justify-content: space-between;}
    .three_dots_dropdown button{background: none;
    color: #6c6c6c;
    border:0;
    border-radius: 100%;
    width: 35px;
    padding: 00;
    height: 35px;
    line-height: 35px;
    margin: 0;
}
  .three_dots_dropdown .dropdown-toggle::after{ display: none;}
   .three_dots_dropdown button:hover{ background: #ddd; color: #111;}  
    .three_dots_dropdown button:focus, .three_dots_dropdown button:active, .three_dots_dropdown .show>.btn-success.dropdown-toggle{ background-color: #ddd!important; box-shadow: none!important; color: #111!important;}

 .three_dots_dropdown .dropdown-menu {
    position: absolute;
    z-index: 1000;
    min-width: 10rem;
    padding: 0;
    margin: 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
}
 .three_dots_dropdown .dropdown-menu {  background-color: #fff;  border: 1px solid rgb(221 221 221);  border-radius: .25rem;}
.three_dots_dropdown .dropdown-item{ padding: 6px 11px;  border: 0;  font-size: 14px;  display: flex;    align-items: center;  gap: 4px;}
.create_search_filter .css-13cymwt-control,.create_search_filter .css-t3ipsp-control{border-color: #E8E8E8!important;min-height: 42px!important;}
.timelines_infor .css-18p5xg2-MuiNotchedOutlined-root-MuiOutlinedInput-notchedOutline{    border-color: #ddd!important;}
.timelines_infor .css-19qnlrw-MuiFormLabel-root-MuiInputLabel-root{ top: -2px!important; font-size: 14px!important;color: rgb(80 80 80 / 60%)!important;}
.table-tags{  background: #ededed;  font-size: 14px;  display: inline-block;  padding: 1px 10px;  border-radius: 30px;  border: 1px solid #a9a4a4;}


 .integration-card{ position: relative; border: 1px solid #EAEAEA; box-shadow: rgba(0, 0, 0, 0.05) 0px 4px 12px; border-radius: 15px; padding: 30px; transition: all 0.4s ease; cursor: pointer; height: 100%;}
.integration-card:hover{ border-color: #12BF7D;}
        .integration-card .icon-box{height: 60px; width: 60px; border: 1px solid #EAEAEA; border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 12px -6px; display: grid; place-items: center;}
        .integration-card h3{font-size: 18px; font-weight: 600; color: #000; margin: 24px 0px 10px;}
        .integration-card p{font-size: 14px; font-weight: 400; color:#555; margin-bottom: 0px;}
        .integration-card .coming-soon-badge{color: #3C3C3C; border: 1px solid #E5E5E5; border-radius: 4px;
    background: #F6F6F6; padding: 2px 6px;  font-size: 12px;  font-weight: 500; position: absolute; right: 30px;}  
    .integration-card a{ text-decoration: none; color: #111;}


         .integ-store{border: 1px solid #F2F2F2;background: #fff; margin-bottom: 12px; border-radius: 30px; padding: 24px 20px;box-shadow: rgba(149, 157, 165, 0.1) 0px 5px 24px; }
        .integ-store .icon-box{width: 60px; height: 60px; background-color: #7672FF; border-radius: 10px;display: grid; place-items: center;box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 23px -5px, rgba(0, 0, 0, 0.2) 0px 5px 10px -8px;}
        .integ-store h3{font-size: 18px; font-weight: 500; color: #000; line-height: 28px; margin: 20px 0 8px;}
        .integ-store p{font-size: 14px; color: #777;margin-bottom: 0;}
        
        .ky-points{font-size:16px; font-weight: 500; color: #000; margin: 30px 0px 20px;}
        .kypoints-list{padding-left: 0px; margin-bottom: 0px; list-style: none;}
        .kypoints-list li{padding-left: 30px; background: url(/images/img/tickmark2.png) 0px 2px no-repeat; background-size: 18px; font-size: 14px; font-weight: 400; color: #000; margin-bottom: 12px;}
        .copy_url{  border: 0; position: absolute !important; right: 0;  top: 3px; background: no-repeat!important;  border: 0;}
             .copy_url:hover{ color: #111;}
.pr_20{ padding-right: 30px!important;}

.remove-row-btn {
    position: absolute;
    top: 5px;
    right: 5px;
    background: transparent;
    color: red;
    border: none;
    cursor: pointer;
}

.h2_styles{ margin-top: -15px!important; margin-bottom: 39px!important;}
.b_top {border-top: 1px solid #e7e3e3; padding: 20px;}
.stepbox_app{padding: 30px; position: relative;}
        .ft-box .icon-box{border: 1px solid #EEEEFF; border-radius: 50%; width: 104px; height: 104px; padding: 7.5px; background: #fff; margin:0px auto 30px;}
        .ft-box .icon-box span {display: grid; place-items: center; background: #F0EFFA; height: 100%; border-radius: 50%;}
        .ft-box .ft-heading{font-size: 30px; font-weight:600; text-align: center; margin-bottom: 30px;font-family:var(--secondry-font);}
        .ft-box .ft-heading span{color:var(--themecolor);}
        .ft-box .content-box{position: relative; padding: 15px 20px 15px 55px; border: 1px solid #CECDFF; margin-bottom: 15px ; border-radius: 15px;}
        .ft-box .content-box img{ position: absolute;left: 20px;top: 16px;}
        .ft-box .content-box h3{font-size: 16px; color: #000; font-weight: 500; margin-bottom: 0px; }
        .ft-box .content-box p{font-size: 14px; font-weight: 400; color: #555; margin: 5px 0px 0px;}

        
        .ft-box .input-box{outline: none; border: 1px solid #E8E8E8; border-radius: 8px; padding: 12px;width: 100%;}
        .ft-box label{font-size: 14px; font-weight: 400; color: #000; margin-bottom: 6px;}
        .ft-box ul{border: 1px solid #EAEAEA; background: #FBFBFB; padding: 20px; border-radius: 16px; list-style: none;}
        .ft-box ul li{background:url(../img/ft-green-check.png) 0px 3px no-repeat; background-size: 16px; font-size: 14px; font-weight: 400; margin-bottom: 16px; padding-left: 30px;}
        .ft-box .back-butn{border: 1px solid #888888; border-radius: 8px; padding: 14px 35px; background: #fff;}
        .icon-rotate { animation: spin 1.5s linear infinite;}
        @keyframes spin {
            100% { transform: rotate(360deg); }
        }
        .success-temp-box{padding: 35px 25px; border: 1px solid #EBEBEB; border-radius: 16px; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; max-width: 380px; margin: 30px auto; }
        .success-temp-box p{font-size: 14px; color: #616161; margin-bottom: 5px; font-weight: 400;}
        .success-temp-box a{font-size: 14px; font-weight: 500; color: #12BF7D; text-decoration: transparent; transition: all 0.4s ease;}
        .success-temp-box a:hover {text-decoration: underline;}
        .pd-50{ padding-left: 44px;margin-top: 50px;}
        .psrd_{ position: absolute; right: 20px;}
        .upcoming{ position: absolute; right: 12px; background: #f7f7f7; padding: 1px 13px; font-size: 13px;border: 1px solid #dfdfdf; border-radius: 30px; top: 14px;}
        .chatbox_Message{    overflow-x: hidden;
    height: 100%;
    overflow-y: hidden;
    transform-origin: left top;
    position: relative;
    flex-grow: 1;}
    .graybox{
    background: #FBFBFF;
    border: 1px solid #E5E4FF;
    padding: 20px;
    border-radius: 8px;
}

.missedcall_seding{
    background: #eafef5;
    width: 198px;
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #E0DFFF;
    border-radius: 0px 10px 10px 10px;
}
.call_drop figure{margin: 0 9px 0 0;  width: 30px; height: 30px; border-radius: 100%; display: flex; justify-content: center; align-items: center;}
/* Missed call (red) */
.call_drop figure.call_missed {
  background: #d22030;
}

/* Connected call (green) */
.call_drop figure.call_connected {
  background: #12BF7D; /* or any green you like */
}
.call_drop h4{font-size: 14px; font-weight: 600;  margin: 0;}
.call_drop span{ color: #666666; display: block;  font-size: 14px;}
.call_drop  .ms_time{ width: 100%; padding: 0 9px 3px 0; font-size: 11px; color: #555555; display: flex; justify-content: flex-end;}

.dd_menu ul li { font-size: 14px !important;  padding: 10px;}
.dd_menu ul{ width: 210px;}
.css-pa188r-MuiModal-root-MuiPopover-root-MuiMenu-root .css-1tktgsa-MuiPaper-root-MuiPopover-paper-MuiMenu-paper{ border-radius: 10px!important; -webkit-border-radius: 10px!important; -moz-border-radius: 10px!important; -ms-border-radius: 10px!important; -o-border-radius: 10px!important; }
.call_histry_data ul{list-style: none; padding: 0;  display: flex; border: 1px solid #e7e7e7; border-radius: 8px; }
.call_histry_data ul li{display: flex;  padding: 18px 15px; flex-wrap: wrap; width: 25%; align-items: center;  gap: 7px; font-size: 15px; font-weight: 500;
    color: var(--textcolor);}

/* Hide expand arrow when accordion is permission-disabled */
.accordion-item.accordion-disabled
  > .accordion-header
  > .accordion-button::after {
    display: none;
}

/* Optional: cursor feedback */
.accordion-item.accordion-disabled
  > .accordion-header
  > .accordion-button {
    cursor: not-allowed;
}

/* No-body accordions should never show expand arrow */
.accordion-item.accordion-no-body
  > .accordion-header
  > .accordion-button::after {
    display: none !important;
}

/* normal cursor (not expandable) */
.accordion-item.accordion-no-body
  > .accordion-header
  > .accordion-button {
    cursor: default;
}

.accordion-header.disabled .accordion-button,
.accordion-header.no-accordion-body .accordion-button,
.accordion-header.always-open .accordion-button
{
    cursor: default;
}

.accordion-header.no-accordion-body .accordion-button {border-radius: 8px !important;}
.accordion-hgiteader.disabled .accordion-button::after {display: none;}

.active-call-modal.active_caller{border: 2px solid #41c909;}
.active-call-modal{    background: #3B3B3B;
    position: absolute;
    right: 25px;
    top: 20px;
    width: 195px; z-index: 12;
    border-radius: 18px;
    border: 2px solid #000;
    text-align: center;
    padding: 12px;
    color: #fff
}
.active-user-name{
    background: #E02FB4;
    width: 50px;
    height: 50px;
    justify-content: center;
    align-items: center;
    display: inline-flex;
    border-radius: 100%;
    font-size: 30px; font-weight: 800;
    position: relative;
}
.active-user-name span{
    position: absolute;
    font-size: 15px;
    right: -11px; font-weight: 400;
    background: #25d366;
    width: 25px;
    height: 25px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #fff;
    bottom: -1px;
}
.active-call-modal h3{    font-size: 20px; margin: 20px 0 5px 0; font-weight: 700;}
.active-call-modal h3 span{ -webkit-line-clamp: 1;  -webkit-box-orient: vertical; overflow: hidden; height: 20px; display: -webkit-box; text-overflow: ellipsis;
    text-transform: capitalize;}
    .inc_num{  font-size: 18px; color: #b1acac; margin-bottom: 12px;}
.btn_circle{width: 40px;  height: 40px;border-radius: 100%; font-size:17px; display: flex; align-items: center; justify-content: center;border: 0; }
.active_ring_btn{    background: #12BF7D; color: #fff;  }
.chat_x_message{    background: #fff;   }
   .active_ring_btn svg,.drop_ring_btn svg{transform: rotate(134deg);}
    .mute_ring_btn{background: #A6999D; color: #fff;}
    .drop_ring_btn{background: #E90039; color: #fff;}
.check-box.no-cb label{ border: 1px solid #e7e7e7; width: 100%;  padding: 10px; border-radius: 4px;}

.accordion_bx .always-open .accordion-button{ background: #17120d; color: #fff;}
.close_call_ui {
    position: absolute;
    right: -10px;
    top: -10px;
}
.close_call_ui button {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.bp_plans_items h4{ font-size: 16px; font-weight: 600; margin: 30px 0 13px 0;}
.no-of-users{    background: url(../img/pricing-user-icon.png) 0 2px no-repeat;
    font-size: 14px;
    padding-left: 29px;
    margin-bottom: 11px;
    color: #111;
    padding-bottom: 11px;
    border-bottom: 1px dashed #E4E4E4;
    font-weight: 500;
}
.bp_plans_items .all-features {
    background: #FBFBFB;
    color:#111;
    border-radius: 6px;
    padding: 12px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    margin-top: 20px;
    border: 1px solid #EDEDED;
}
.pricing-page .price-card.standard .all-features {
    background: var(--accent-color);
    color: #fff;
    border: none;
}
.call_histry_data{
    height: calc(100vh - 205px);
    overflow-x: scroll;
}
.wacall-tootip:after {display: none;}
.std_btn5.disabled, .std_btn6.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background-color: #777;
}
.verified .verified_bx ul li:first-child::before,
.verified .verified_bx ul li:last-child.cc-attached::before
{
    background: green;
}
.verified .verified_bx ul li:last-child::before {
    background: goldenrod;
}
.form-floating > label {
    color: #666;
}

/* code */
.righttopchat{position: absolute; top: 0px; right: 0px; background: #fff; border-radius: 0px 0px 0px 5px;}
.righttopchat .none_style.m1> button{margin-top: 0; color: var(--bcolor); background: #fff; background-image:unset !important; width: 36px; height: 36px; border-radius: 0px 0px 0px 5px;}
.righttopchat .none_style.m1> button:hover{ box-shadow: -2px 2px 15px 3px #edebeb; color: green !important;} 
.righttopchat .none_style .dropdown-item svg{font-size: 15px;}

@media (max-width:900px) {
    .right_form_info{all: unset;}
    .right_form_info .middle-box{display: none; }
    .middle-box{display: block;}
    .form__{padding: 10px 20px;}
}