*{
  margin:0;
  padding:0;
  box-sizing: border-box;
  font-family: 'Helvetica', sans-serif;
}

@font-face {
  font-family: "KirvyBold";
  src: url("/assets/fonts/kirvy/Kirvy-Bold.otf") format("opentype")
}
@font-face {
  font-family: "Helvetica";
  src: url("/assets/fonts/HelveticaNeue.ttf") format("ttf")
}

img {
  display: block;
}
#root{
  height:100%;
}
#root > div, .content{
  height: 100%;
}
body{
  background: #f5f8fa;
}
html{
  font-size: 16px;
  /* background:#fff; */
}
.content{
  /*display: grid;*/
  grid-template-columns: 1fr 1fr;
  background: #fff;

}
.wrapper{
  display: grid;
  grid-template-rows: 6.25rem 1fr 4rem;
  height: 100%;
}
.group{
  display: flex;
  flex-direction: column;
  margin-bottom: 4rem;
  position: relative;
}

.btn{
  padding: 0.5rem 1rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  cursor: pointer;
  background: #D8D8D8;
  border-radius: 16.5px;
  color: #000000;
  font-weight: 100;
  width:max-content;
  min-width: 8rem;
}
.btnReset {
  display: inline;
  margin: 20px!important;
}
.btn:hover{
  transition:all .3s linear;
  background: #7B7B7B;
  color:#fff;
}


.smallBtn{
  padding: 0.2rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: #6d0679;
  color: #fff;
  font-size: 12px;
  cursor: pointer;
  max-width:30%;
  border: 2px solid #6d0679;
  text-transform: uppercase;
}
.smallBtn:hover{
  transition:all .3s linear;
  color:#6d0679;
  background:#fff;
}

.btnIntent{
  width: 8rem;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: #6d0679;
  color: #fff;
  font-size: 1rem;
  cursor: pointer;
  border: 2px solid #6d0679;
  text-transform: uppercase;
  padding:5px;
}
.btnIntent:hover{
  transition:all .3s linear;
  color:#6d0679;
  background:#fff;
}


.logout{
  position: absolute;
  right:10px;
  top:10px;
}
.containerPadding{
  padding:1rem 2rem;
}
.innerBlock{
  width: 100%;
  background: #fff;
  box-shadow: 0 0 5px rgba(0,0,0,0.5);
  height:100%;
  padding:2rem 1rem;
}

.btnOrange{
  background: brown!important;
  color:#fff;
}
.btnOrange:hover{
  background:#e4b77d!important;
}

.btnYellow{
  background:#F8952A!important;
  color:#fff;
}

.btnYellow:hover{
  background:#ffc280!important;
}
.dialogflowInit .tabInputGroup{
  margin-top: 3rem;
}
.botBubble p{
  color:#000;
  margin-bottom: 6px;
}

.delete.deleteBtn{
  color: #8C8C8C;
  font-size: 15px;
  right: 10px;
  top: 3px;
}

.codeSnippet{
  max-width: 27rem;
  font-size: 14px;
  padding: 15px;
  background: #fff;
  border: 5px solid #c0c0c0;
}

.applyPopupWrapper{
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(0,0,0,0.5);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.applyPopupInner{
  width: 30rem;
  height: 10rem;
  background: #fff;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding:10px;
}

.applyPopupBtns{
  display: flex;
  flex-direction: row;
  margin-top: 1rem;
}
.applyPopupBtns .btnYellow{
  margin-right: 10px;
}
.preloaderInner{
  width: 100%;
  height: 100%;
  background: #fff5e2;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.preloaderImg{
  margin-bottom: 1rem;
}

.preloaderCloningTxt{
  text-align:center;
  color:#F8952A;
  font-size: 20px;
}


@keyframes blink {
  0% {
    opacity: .2;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: .2;
  }
}

@keyframes blinkStaged {
  0% {
    opacity: 1;
  }
  10%{
    opacity: 0.8;
  }
  20%{
    opacity: 0.6;
  }
  30%{
    opacity: 0.4;
  }
  40%{
    opacity: 0.2;
  }
  50%{
    opacity: 0.1;
  }
  60%{
    opacity: 0.2;
  }
  70%{
    opacity: 0.4;
  }
  80%{
    opacity: 0.6;
  }
  90%{
    opacity: 0.8;
  }
  100%{
    opacity: 1;
  }
}

.preloaderCloningTxt span {
  font-size: 40px;
  line-height: 1;
  animation-name: blink;
  animation-duration: 1.4s;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
}
.preloaderImg{
  animation-name: blinkStaged;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
}

.preloaderCloningTxt span:nth-child(2) {
  animation-delay: .2s;
}

.preloaderCloningTxt span:nth-child(3) {
  animation-delay: .4s;
}

.delimiter{
  border-top:2px outset #000;
  margin-top: 3rem;
  margin-bottom: 10px;
}

.inputContent label{
  font-size: 0.8rem;
  padding-right: 0.5rem;
}
.inputContent{
  margin-left: 1rem;
}
.alignCenter{
  text-align: center;
}
.formGroup{
  width:100%;
}
.innerBlockStylingPageOneRow{
  display:block;
}
.innerBlockStylingPageOneRow .formGroup{
  padding-bottom: 1rem;
  border-bottom: 1px solid #ccc;
  margin-bottom: 1rem;
}
.orientation{
  display:grid;
  grid-template-columns: 1fr 300px;
  grid-column-gap: 1rem;
}
.previewer{
  /* height: 300px; */
  position: relative;
}
.previewer .bubble{
  width: 80px;
  height: 80px;
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 7px;
  position: absolute;
  bottom: 23px;
  right: 20px;
  background-size: cover;
  background-position: center center;
}

.previewer .horizontal {
  width: 300px;
  height: 60px;
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 7px;
  position: absolute;
  bottom: 23px;
  right: 20px;
  background-size: cover;
  background-position: center center;
  border-radius: 10px;
}

.previewer .vertical{
  width: 60px;
  height: 300px;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.2) 0 0 7px;
  position: absolute;
  bottom: 23px;
  right: 0;
  background-size: cover;
  background-position: center center;
}
.currentOperator{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.currentOperator h4{
  margin-right: 1rem;
}
.orientation h5{
  padding: .5rem 0;
}
.vss{
  display:flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 2rem;
}

.vss span{
  padding-left: 6px;
  font-size: 10px;
  font-weight: bold;
}

.fdc{
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.image_picker .responsive img.thumbnail{
  border-radius: 50%!important;
  width:3.875rem!important;
  height:3.875rem!important;
  padding:0;
  margin:0;
}
.image_picker .selected{
  opacity: 1!important;
}
.image_picker .selected img{
  border: 5px solid #008005 !important;
  background-color: transparent!important;
}
.image_picker .responsive .checked{
  display:none!important;
}
.image_picker{
  width:auto!important;
}

.SingleIntent{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
.Intent{
  margin-bottom: 10px;
}

.activeIntent{
  transition: all .3s linear;
  color: #6d0679;
  background: #fff;
}
.Sidebar{
  padding:10px;
  background:#F2F2F2;
  border-top-left-radius: 14px;
  border-bottom-left-radius: 14px;
  border: 0.5px solid #CECECE;
  min-height:calc(100vh - 75.05px);
}
.SidebarTabs .react-tabs__tab-list{
  display: flex;
  flex-direction: column;
}

.SidebarTabs{
  padding:1rem 2rem;
  width:7.9rem;
}
.tabWrappTxt{
  font-family: "Pero";
  font-size:12px;
  padding-top: 5px;
}
.SidebarTabs .react-tabs__tab{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding:4px 12px;
  padding-bottom: 5px;
  border: 0.5px solid #CECECE;
  border-radius: 2px;
  margin-bottom: 8px;
}
.react-tabs__tab .active, .react-tabs__tab--selected .disabled{
  display: none;
}

.react-tabs__tab--selected .active{
  display:block;
}
.react-tabs__tab-list{
  border:none!important;
}

.SidebarTabWrapp{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.react-tabs__tab .tabWrappTxt{
  color:#909090;
}
.react-tabs__tab--selected .tabWrappTxt {
  color:#000;
}
.SidebarTabsContent{
  padding: 1rem 2rem;
  width:100%;
}
.SidebarTabsWrapper{
  display:flex;
  flex-direction: row;
}
.SidebarTabsContent .react-tabs__tab-panel--selected{
  background:transparent;
  box-shadow: none;
  width: 100%;
  height: 100%;
}
.BotTabSearchBlock{
  opacity: 0.8;
  position: relative;
}
.BotTabSearchBlock input{
  width: 100%;
  border: none;
  outline: none;
  height: 2.35rem;
  padding-left: 2.5rem;
  font-size: 1rem;
  line-height: 1;
  color: #C9C9C9;
  font-weight: bold;
  border-radius: 5px;
}
.BotTabSearchBlock input::placeholder{
  color: #C9C9C9;
}
.BotTabSearchGlass {
  position: absolute;
  height:100%;
  display:flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  left:11px;
}
.BotTabSearchGlass img{
  width:1.125rem;
}
h4{
  color:#606060;
  padding-left: 3px;
  padding-bottom: 0.5625rem;
  padding-top: 0.875rem;
  letter-spacing: -0.09px;

}
p{
  color:#A6A6A6;
  letter-spacing: -0.09px;
  margin-bottom: 10px;
}
.pGroup{
  font-size: 12px;
  font-family: "Pero";
  color:#767676;
  text-transform: uppercase;
}
.intentBlockPlus {
  font-size: 1rem;
  color:#AFAFAF;
}
.BotTabAddGroup{
  /* margin-bottom: 1.25rem; */
}
.addBlock {
  width:6.5625rem;
  height:2.375rem;
  background:#D8D8D8;
  border: 0.5px solid #979797;
  border-radius: 2px;
  display:flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  color:#AFAFAF;
  cursor:pointer;
  margin-bottom: 10px;
}
.BotTabInfo{
  margin-bottom: 20px;
}

.groupCreated input{
  background:transparent;
  border:none;
  padding:5px;
  width:100%;
}


.groupCreated input:focus{
  background:#fff;
  outline: none;
}
.groupInput{
  margin-bottom: 1rem;
}
.err{
  color: #da2121;
  font-size: 12px;
  font-weight: bold;
}
.inputBlock{
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.5rem;
}
.threeDotsOptions{
  cursor:pointer;
  align-self: baseline;
  font-size: 1rem;
  font-weight: bold;
  letter-spacing: 2px;
}
.deleteGroup{
  z-index: 9;
  position: absolute;
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  right: 3rem;

  top: 0;
}
.deleteOption{
  color:red;
  cursor:pointer;
}
.groupCreated{
  margin-bottom: 2rem;
}

.tabsGroup{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
}
.intentBlock{
  width: 8.25rem;
  min-height: 3.0625rem;
  background: #D8D8D8;
  border: 0.5px solid #979797;
  border-radius: 2px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  color: #AFAFAF;
  cursor: pointer;
  margin-bottom: 10px;
  height: calc(100% - 10px);
  position: relative;
  /* padding-left: 1rem; */
}
.intentColor{
  color:#454545;
}

.activeIntentNew{
  background:#4E4E4E;

}
.activeIntentNew .intentColor{
  color:#fff;
}
.setupIntents select{
  width: calc(100% - 10px);
  margin-top: 5px;
}
.intentWrappBlock{
  width:100%;
  height:100%;
  display:flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.allIntentsDropdown{
  text-align: center;
}
.intentBuilt{
  padding-left: 13px;
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  height: 100%;
}

.groupCreated .inputCreateCustomIntent{
  background:#fff;
  margin: 5px;
  width: calc(100% - 10px);
}
.settingsContainer{
  padding:1rem 2rem;
}

.settingsContainer .react-tabs{
  display: flex;
  flex-direction: row;
}
.settingsContainer .react-tabs__tab:focus{
  outline: none;
  border:none;
  box-shadow: none;
}
.settingsContainer .react-tabs__tab-list{
  display: flex;
  flex-direction: column;
  /* box-shadow: 0px 3px 5px rgba(0,0,0,0.5); */
  border:none;
  margin-right: 1rem;
}
.settingsContainer .react-tabs__tab{
  border-radius: 0;
  border:0;
  background:#6d0679;
  color:#fff;
  padding:0;
  width: 15rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  height:3rem;
  font-weight: bold;
  letter-spacing: 0.01em;
}
.settingsContainer .react-tabs__tab--selected{
  background:#fff;
  color:#6d0679;
  border-radius: 0;
  border:0;
}
.react-tabs__tab-panel--selected{
  width:100%;
  background:#fff;
  box-shadow: 0 0 5px rgba(0,0,0,0.5);

}
.wrappTabContent{
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding:1.5rem 0;
}
.wrappTabContent a{
  color:#6d0679;
}
.wrappTabInner{
  display: flex;
  flex-direction: column;
  width:100%;
}
.wrappTabInner h2{
  text-align: center;
  margin-bottom: 2rem;
}
.tabInputGroup{
  margin-top: 0;
}
.tabInputGroup input[type="text"],
.tabInputGroup > input[type="password"],
.tabInputGroup input[type="date"],
.tabInputGroup input[type="time"],
.tabInputGroup input[type="number"] {
  width:100%;
  max-width:30rem;
  height:2rem;
  border:none;
  border-bottom: 1px solid #DBDBDB;
  font-size: 1rem;
  color:#989898;
  background:transparent;
  margin-bottom: 10px;
}

.tabInputGroup .fas, .tabInputGroup .far {
  margin-left: -30px;
  cursor: pointer;
}

.tabInputGroup label {
  color:#a09e9e;
  cursor: pointer;
  display: block;
  padding-bottom: 0.5rem;
}
.tabInputGroup label.transcript {
  font-size: 1rem;
  padding-left: 0.5rem;
  display: inline-block;
}
.tabInputGroup input[type="text"]:focus{
  border-color: #AB7700;
  transition: all .2s linear;
  outline: none;
}

.tabButtonGroup {
  display: flex;
}
.tabButtonGroup div{
  margin-left: 10px;
}
.messagepopupsuccess {
  height: 15rem;
}
.messagepopuperror {
  height: 20rem;
}
.messagepopup p{
  font-size: 20px;
  font-weight: 600;
  color: #033;
}
.messagepopup img {
  margin-bottom: 10px;
}
.messagepopup .error {
  font-size: 12px;
  padding: 20px;
  font-weight: normal;
  text-align: center;
  line-height: 1.2;
}
.wrappTabInner .btn{
  margin:2rem 0;
}
.tabContentHeading{
  text-align: center;
}
.enabledAddon{
  margin-top: 1rem;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.enabledAddon label{
  padding-left: 0.5rem;
}
.VerPopup{
  position: fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-color:rgba(0,0,0,0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}
.verPopupContainer{
  position: relative;
  padding: 2rem;
  background:#fff;
  min-width:500px;
  max-width:50%;
}
.closePopup{
  cursor: pointer;
}
.statusCred{
  color:rgb(236, 132, 0);
}
.settingsWrapp h4{
  padding-left: 0;
}
.OptionsWrapp{
  display: flex;
  flex-direction: column;
  max-width: 30rem;
  padding: 1rem;
}
.optionWrapp{
  padding: 2rem;
  border: 1px solid;
  margin-bottom: 2rem;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.optionWrapp input{
  font-size: 1rem;
  margin-bottom: 1rem;
}
.delete{
  position: absolute;
  top: 0;
  right: 1rem;
  font-weight: bold;
  font-size: 1rem;
  cursor: pointer;
}

.sectionWrapp{
  position: relative;
  width: 100%;
  height: 100%;
  border: 1px solid;
  margin-bottom: 2rem;
  padding: 1rem;
}
.sections input{
  margin-bottom: 1rem;
  width: 100%;
  height:1.3rem;
  border:none;
  border-radius: 3px;
  color:#BABABA;
  padding-left: 10px;
  outline: none;
}
.sections input::placeholder{
  color:#BABABA;
}
.sections{
  margin-bottom: 1rem;
  background: #E1E1E1;
  padding: 1rem;
  max-width: 20rem;
  position: relative;
}
.optionContainer{
  margin-bottom: 1.5rem;
}
.sectionWrapp .btn{
  min-width: 5rem;
  padding:0.4rem 1rem;
}

.sections * {
  font-size: 12px;
}

.txtToSmall p{
  font-size: 11px;
}

.optionContainer input{
  margin-bottom: 2px;
}
.optionsDemo *{
  font-size: 10px;
}
.IntentVars{
  position: relative;
  min-height: 20rem;
  background: #fff;
  padding: 15px;
}
.IntentVarsInner{
  padding: 2rem 0;
}
.VarBlock{margin-bottom: 1rem;}
.VarBlockInner{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 1rem;
}
.VarBlockQuestion{
  width: 40%;
}
.VarBlockVar{width:20%;}
.VarBlock input{width:100%;height: 2rem;padding-left: 1rem;}
.notification{
  font-size: 12px;
  color:#ccc;
}
.VarBlockBtns{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.IntentVarsInner h1{
  margin-bottom: 1rem;
}

.IntentItem{
  width: 20.5rem;
  min-height: 20rem;
  background: transparent;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;

  position: relative;
  margin-top: 1rem;
  margin-bottom: 0;
}
.IntentItem textarea{
  margin-top: 1rem;
  width: 100%;
  height: 100%;
  min-height: 6.8rem;
  border: 1px solid #DDDDDD;
  border-radius: 11px;
  margin-bottom: 7px;
  font-size: 1rem;
  line-height: 1.31em;
  outline:none;
  padding: 7px 21px 7px 12px;
}
.IntentItem label{
  font-weight: 600;
  padding-bottom: 7px;
}
.IntentItem input{
  border: 1px solid #DDDDDD;
  outline: none;
  height: 1.75rem;
  padding: 4px 23px 6px 10px;
  font-size: 1rem;
  border-radius: 8px;
}
.deleteBlock{
  position: absolute;
  top: 5px;
  right:5px;
  cursor: pointer;
}
.deleteBlock i{font-size: 1rem;}
.IntentHookInner input {
  width: 100%;
  height: 2rem;
  padding-left: 1rem;
  margin-bottom: 1rem;
}
.IntentHookInner input[type=radio] {
  width: 10%;
  height: 1.2rem;
  display: inline-block;
  margin: 0 0.5rem 0;
}
.IntentHookInner Label {
  display: inline-flex;
  align-items: center;
  flex: 1;
}
.IntentHook {
  position: relative;
  padding: 2rem;
  background: #fff;
  box-shadow: 0 0 3px rgba(0,0,0,0.1);
}

.headerWrapp{
  background: #fff;

  /* margin-bottom: 2rem; */

  padding: 1rem 2rem;
  /* box-shadow: 0 2px 1px rgba(0,0,0,0.3); */
}
.headerInnerWrapp{
  display: flex;
  flex-direction: row;
  align-items: center;
}
.headerInnerWrapp a{
  margin-right: 25px;
}
.headerInnerWrapp > div {
  margin-right: 10px;
}


.headerLinks a{
  padding: 0 1rem;
  color:#6d0679;
  text-decoration: none;
}

.shapeBubble{
  width:2.25rem;
  height:2.25rem;
  border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  display:flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-left: 1rem;
}
.shapeBubble img{
  margin-right: 2px;
}
.botnameHeader {
  font-size: 1rem;
  color:#AB7700;
  font-family: KirvyBold;
  font-weight: 100;
}
.container{
  background:#fff;
}
.HandoverItem input{
  padding: 5px;
  margin-top: 10px;
}
.HandoverItem{
  min-height: unset;
  padding: 20px 10px;
}
.ContentUpdate{
  margin-top: 5rem;
  padding: 15px;
  /* background: #fff; */
}
.ContentUpdate{
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap:wrap;
}
.ContentUpdate .btn{
  margin-bottom: 1rem;
  margin-right: 1rem;
}

.ContentSection{
  padding:15px;
  display: flex;
  flex-direction: column;
  padding-left: 3.5625rem !important;
  background:#E0E0E0;
  border: 1px solid #979797;
  border-radius: 14px;
  width: 100%;
}
.BotTabWrapper{
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-column-gap: 20px;
}
.intentBlock.selectedIntent{
  background-color: rgb(78, 78, 78);
  color: rgb(255, 255, 255) !important;
}
.intentBlock.selectedIntent .intentBuilt{
  color: rgb(255, 255, 255) !important;
}
.intentHeader{
  font-weight: 100;
  font-size: 1.5625rem;
  padding-top: 1rem;
  text-transform: uppercase;
  color: #868686;
}

.tpWrapp{
  background: #fff;
  padding: 1rem;
  border-radius: 10px;
}

.tp{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding-bottom: 3px;
  margin-bottom: 5px;
}
.tpDelete{
  color:red;
  cursor: pointer;
}

/* Delete intent popup */

.popupWrapper {
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0, .7);
  z-index: 10;
}

.popupWrapper .modal {
  border-radius: 5px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  padding: 20px 30px;
  background:white;
}

.popupWrapper .modal .modalClose {
  position: relative;
  left: 100%;
  top: -12px;
  font-size: 16px;
}

.modalClose:hover {
  color: red;
  cursor: pointer;
  font-weight: bold;
}

.popupWrapper .modal .modalTitle {
  padding-bottom: 20px;
}

.popupWrapper .modal .buttonWrapper {
  width: 350px;
  display: flex;
  justify-content: center;
}

.popupWrapper .modal .buttonWrapper button {
  padding: 10px 20px;
  font-weight: 500;
  border-radius: 5px;
}

.popupWrapper .modal .buttonWrapper button:hover {
  cursor: pointer;
  list-style: none;
  outline: none;
}

.popupWrapper .modal .buttonWrapper .buttonCancel {
  border: 1px solid grey;
  margin-right: 10px;
}

.popupWrapper .modal .buttonWrapper .buttonDelete {
  background: red;
  border: 1px solid red;
  color: white;
  margin-left: 10px;
}

/* End Delete intent popup */

.addTp{
  display: flex;
  flex-direction: row;
  margin-top: 3rem;
}

.addTp input{
  padding-left: 10px;
  margin-right: 1rem;
  font-size: 15px;
  border: 0;
  outline: none;
  min-width:13rem;
  transition: all .3s linear;
  border-bottom: 2px solid transparent;
}

.addTp input:focus{
  border-bottom-color:#D8D8D8;
}
.tpWrapp .tp{
  transition: all 0.4s ease-out;
  opacity: 0;
}
.tpWrapp .tp.tpAppear{
  opacity: 1;
}
.ButtonWrapp{
}
.ButtonWrappAdd {
  margin-top: 3px;
  margin-bottom: 8px;
}
.readyBtns{
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap:wrap;
}
.readyBtns .btn{
  margin-right: 1.2rem;
  margin-bottom: 1.2rem;
}
.ButtonPopup{
  /* position: fixed; */
  height: 100%;
  background: transparent;
  width:22.5rem;
  margin-top: 1rem;
}
.ButtonPopupInner{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  background: transparent;
  position: relative;

}

.btnRows input, .btnRows select {
  width:18.3125rem;
  height:1.75rem;
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 2px;
  font-size: 1rem;
}
.btnRows{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 11px;
}
.btnRows label{
  line-height: 1;
  padding: 0;
}

.controlBtnsWrapp{
  display: flex;
  width: 19.4375rem;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
}

.controlBtnsWrapp .btn{
  width:9.1875rem;
  height:2.0625rem;
  border-radius: 7px;
  display:flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  color:#fff;
}
.btnUpdate{
  background: #DA5500!important;
}
.btnDelete{
  background:#6C0000!important;
}
.ButtonItemInner span{
  font-size: 0.9rem;
}
.ButtonItemInfo{
  text-decoration: underline;
  color: #6d0679;
  font-weight: bold;
}
.ButtonItem{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding-bottom: 1.5rem;
}
.ButtonItemDelete{
  cursor:pointer;
  color:#6d0679;
  font-size: 1rem;
}
.ButtonItemSpan{
  padding-right: 5px;
}

.txtToSmall p{
  font-size: 11px;
}

.optionsContainer{
  display: grid;
  grid-template-columns: 16rem 16rem 16rem;
  grid-row-gap: 1rem;
  grid-column-gap: 1rem;
  margin-bottom: 2rem;
}

.optionsWrapp{
  padding:11px;
  width: 100%;
  height: 11.1875rem;
  background: #E1E1E1;
  border-radius: 5px;
  position: relative;
}
.optionsWrapp *{
  font-size: 12px;
}
.optionsWrapp h5{
  padding-bottom: 4px;
  font-weight: 300;
}
.optionsWrapp input{
  width:calc(100% - 10px);
  height:1.4rem;
  color:#BABABA;
  font-size: 11px;
  padding-left: 11px;
  margin-bottom: 4px;
}
.optionsWrapp p {
  font-size: 11px;
  margin-bottom: 1rem;
}
.optionsWrapp .btn{
  width: 4.4rem;
  height: 1.3rem;
  padding: 0;
  margin: 0 auto;
  margin-top: 7px;
  min-width: 4.4rem;
}
.optionsWrapp .delete{
  color: #8C8C8C;
  font-size: 15px;
  line-height: 1;
  right: 10px;
  top: 3px;

}
.AutoLink input{
  margin-top: 1rem;
}






.dot-pulse {
  position: relative;
  left: -9999px;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #F8952A;
  color: #F8952A;
  box-shadow: 9999px 0 0 -5px #F8952A;
  animation: dotPulse 1.5s infinite linear;
  animation-delay: .25s;
}

.dot-pulse::before, .dot-pulse::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 0;
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #F8952A;
  color: #F8952A;
}

.dot-pulse::before {
  box-shadow: 9984px 0 0 -5px #F8952A;
  animation: dotPulseBefore 1.5s infinite linear;
  animation-delay: 0s;
}

.dot-pulse::after {
  box-shadow: 10014px 0 0 -5px #F8952A;
  animation: dotPulseAfter 1.5s infinite linear;
  animation-delay: .5s;
}

@keyframes dotPulseBefore {
  0% {
    box-shadow: 9984px 0 0 -5px #F8952A;
  }
  30% {
    box-shadow: 9984px 0 0 2px #F8952A;
  }
  60%,
  100% {
    box-shadow: 9984px 0 0 -5px #F8952A;
  }
}

@keyframes dotPulse {
  0% {
    box-shadow: 9999px 0 0 -5px #F8952A;
  }
  30% {
    box-shadow: 9999px 0 0 2px #F8952A;
  }
  60%,
  100% {
    box-shadow: 9999px 0 0 -5px #F8952A;
  }
}

@keyframes dotPulseAfter {
  0% {
    box-shadow: 10014px 0 0 -5px #F8952A;
  }
  30% {
    box-shadow: 10014px 0 0 2px #F8952A;
  }
  60%,
  100% {
    box-shadow: 10014px 0 0 -5px #F8952A;
  }
}

.textLoaderWrapp{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.textLoaderWrapp .snippet{
  width: 100%;
  justify-content: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.textLoaderWrapp .snippet .stage{
  margin-bottom: 10px;
}

.textLoaderWrapp.textLoaderWrappOverlay{
  position:absolute;
  width:100%;
  height:100%;
  left:0;
  top:0;
  background: rgba(255,255,255, 0.7);
  z-index: 999;
}

.BotTab .IntentGroups{
  min-width: 630px;
  width: 40%;
}
.closeBtn{
  color: red;
  position: absolute;
  top: -10px;
  right: -10px;
  cursor: pointer;
  z-index: 9;
}

.card-body{
  min-height: 23.75rem;
  display: grid;
  grid-template-columns: 1fr 2.5fr;
  grid-column-gap: 2.5rem;
  align-items: center;
  padding: 1rem 3rem;
  box-shadow: 0 4px 4px rgb(0 0 0 / 25%);
  border-radius: 5px;
  background: #fff;
}
.loginWrapper{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.formgroupAuth{
  display: grid;
  grid-template-columns: 1fr 3fr;
  grid-column-gap: 1rem;
}
.formSide{
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr;
  grid-row-gap: 1rem;
}
.formgroupAuth label{
  font-size: 1.5rem;
  color: #EC8400;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
}
.authFonts{
  color: #EC8400;
}
.formgroupAuth input{
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.6;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
  padding: 0.375rem 0.75rem;
}
.btnAuth{
  margin: 0 auto;
  width: 12.6875rem;
  height: 3.25rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  background-color: #EC8400;
  color: #fff;
  font-size: 1.5625rem;
  line-height: 1;
  text-transform: capitalize;
  border-radius: 5px;
  border:none;
}
.btnAuth:hover{
  background-color: #efa950;
}


.logoutButton{
  position: absolute;
  right:0;
  bottom: 0;
}

.visualSettingsInputStyle{
  border: 0;
  margin-left: 4px;
  margin-top: 2px;
  width: 6.75rem;
  height: 1.1rem;
}
.imageUploaderWrapper{

}
.imageUploaderWrapper input{
  display:none;
}
.imageUploaderWrapper .imageUploaderCircle{
  width: 62px;
  height: 62px;
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.imageUploaderOverlay{
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 35px;
  opacity: 0.3;
  left: 0;
  top: 0;
}

.customSection{
  margin: 10px 0;
}
.customSection h3{
  margin-bottom: 10px;
}
.blurOverlayWrapper{
  display: flex;
  position: absolute;
  top: 0;
  backdrop-filter: blur(4px);
  z-index: 999;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 100px;
  width: 100%;
  height: 100%;
  left: 0;
}
.ContainerOverlayWrapper{
  display: flex;
  position: absolute;
  top: 0;
  backdrop-filter: blur(4px);
  z-index: 999;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 50px;
  width: 100%;
  height: 100%;
  left: 0;
}

.SidebarTabsContent{
  position: relative;
}
.SidebarTabsNew {
  display:flex;
  flex-direction:column;
  max-width: 200px;
  width: 100%;
}
.SidebarTabsNew > a {
  margin-bottom:10px;
}
.SidebarTabWrappNew{
  display: grid;
  grid-template-columns: 40px 1fr;
  align-items: center;
  grid-column-gap: 10px;
  padding: 10px;
  background:#fff;
  cursor:pointer;
}
.SidebarTabWrappNew > a {
  text-decoration: none;
  color: #000;
  transition: all .3s linear;
}
.SidebarTabWrappNew:hover{
  background: transparent;
  padding-left: 30px;
}
.SidebarTabWrappNew.tabWrappNewActive{
  background: transparent;
  padding-left: 30px;
}
.gmapsMapsContainer{
  width:100%;
  height:400px;
  background-color: rgba(0,0,0,0.1);
  position: relative;
}

.statusBlock{
  display: grid;
  grid-template-columns: 200px 1fr;
}
.statusBlockValue{
  color:rgb(236, 132, 0);
  margin-bottom: 20px;
}

.ContainerPreloaderWrapper{
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 9;
  top: 0;
  left: 0;
}
.ContainerPreloaderWrapper img{
  width:100%;
  height:100%;
}

.ContainerPreloaderInner {
  position: absolute;
  width:100%;
  height:100%;
}


.IntentVars{
  position: relative;
  min-height: 20rem;
  background: #fff;
  padding: 15px;
}
.IntentVarsInner{
  padding: 2rem 0;
}
.VarBlock{
  padding: 10px;
  box-shadow: 0 0 3px #000;
}
.VarBlockInner{
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-bottom: 1rem;
}
.VarBlockInner > div{
  margin-bottom: 20px;
}
.VarBlockQuestion{
}
.VarBlock input{width:100%;height: 2rem;padding-left: 1rem;}
.notification{
  font-size: 12px;
  color:#ccc;
}
.VarBlockBtns{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.IntentVarsInner h1{
  margin-bottom: 1rem;
}
.IntentVarsBlock{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 30px;
  grid-row-gap: 30px;
}
.VarBlock .formGroup label{
  margin-bottom: 5px;
}
.VarBlock .formGroup select{
  display: block;
  width: 100%;
  font-size: 15px;
  padding: 5px 0;
}
.variableOptionsOption{
  display: grid;
  grid-template-columns: 1fr 130px;
  grid-column-gap: 30px;
  margin: 10px 0;
}
.fileUploadLimitInput{
  display:block;
  width: 100%!important;
}
.variableSubContainer{
  margin-top: 25px;
}
.variableSubContainer .formGroup{
  margin-bottom: 15px;
}
.variableSubContainer .formGroup .btn{
  margin-top: 15px;
}
.regexTestMatches{
  margin-top: 20px;
}
.regexTestMatches ul{
  list-style-position: inside;
  font-size: 14px;
}
.VarBlockInner > div {
  width:100%;
}

.fileTypesContainer input{
  width:20px;
}
.checkboxWrapperVariables{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.checkboxWrapperVariables span{
  margin-left:5px;
}
.btn.buttonGrey{
  background:grey!important;
}
.flowItemDraggable{
  margin:20px 0;
}

.ContentSectionHolder{
  position: relative;
}
.ContentSection{
  position: fixed;
  top: 0;
  height: 100vh;
  overflow-y: scroll;
  width: inherit;
}
.loginWrapper{
  height:100vh!important;
}

.textCardPreviewWrapper{
  background: #fff;
  border-radius: 10px;
  padding: 5px 10px;
  margin-bottom: 15px;
  font-size: 14px;
  max-width: 300px;
  width: fit-content;
}
.textCardPreviewWrapper p{
  color:#000;
}
.textCardPreviewWrapper * {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}
.checkboxGroupWrapper{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 10px;
}
.checkboxGroupWrapper label {
  padding-bottom: 0;
  padding-right: 10px;
}

.sitemap-table table {
  width:100%;
}

.sitemap-intent-del {
  display: flex;
  justify-content: center;
}
div.errorLists p{
  margin-bottom: 5px;
}
div.errorLists p em {
  color: #ff0000;
}

.statusBlockWrapper .statusSettings {
  display: flex;
  gap: 2rem;
}

.dialogflowPopup .btn {
  margin: 0 10px 0 0;
}

.paginator {
  display: flex;
  list-style: none;
  margin-bottom: 10px;
  justify-content: center;
  gap: 0.2rem;
}

.paginator .btn {
  min-width: auto;
}
.paginatorBreak {
  margin-left: 10px;
  margin-right: 10px;
}

.paginator li{
  cursor: pointer;
}

.sitemapSearch {
  display: flex;
}

.sitemapSearch select {
  height: 2rem;
}

.sitemapSearch .btn {
  margin: 0 2rem;
}

.sitemapSearch input {
  margin-left: 10px;
}

.errorMsg {
  display: block;
  color: red;
  margin-bottom: 1rem;
}

.migrateBot .applyPopupInner {
  height: 30rem;
  align-items: flex-start;
  padding: 40px;
  width: 45rem;
}

.migrateBot .applyPopupInner h3{
  position: relative;
  top: -15px;
  align-self: center;
}

.scheduleMigration .tabInputGroup, .migrateBot .tabInputGroup{
  width: 100%;
}

.migrateBot .applyPopupBtns {
  justify-content: center;
}

.migrateBot .applyPopupBtns .btn {
  width: 30%;
}

.authMenu {
  display: flex;
}

.authMenu .item {
  width: 200px;
  height: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 2rem;
  background-color: rgb(237, 237, 237);
  color: rgb(137, 137, 137);
  font-weight: 600;
  cursor: pointer;
}

.authMenu .active {
  color: rgb(232, 121, 0);
  border-bottom: 2px solid rgb(232, 121, 0);
  background-color: rgb(242,223,201);
}
.usersContainer, .rolesContainer {
  box-shadow: 0 0 2px 2px rgba(137 137 137, 0.5);
  display: flex;
}
.usersContainer .grid, .rolesContainer .grid {
  display: flex;
  width: 100%;
  padding: 2rem;
  box-shadow: rgb(0 0 0 / 10%) 0 4px 12px;
  flex-direction: column;
  background-color: #fff;
  margin-bottom: 2rem;
}

.usersContainer .header, .usersContainer .row, .rolesContainer .row {
  display: flex;
  width: 100%;
  padding-bottom: 0.5rem;
  color: rgb(137, 137, 137);
  font-size: 14px
}

.usersContainer .header, .usersContainer .footer {
  border-bottom: 1.5px solid rgb(137, 137, 137);
}

.usersContainer .footer {
  margin-bottom: 1rem;
  margin-top: 0.5rem;
}
.usersContainer .row {
  padding-top: 1rem;
}

.usersContainer  .row i{
  margin-right: 0.5rem;
}

.usersContainer .header div, .usersContainer .grid .row div {
  padding-left: 10px;
  width: 20%;
}

.usersContainer .header div:nth-child(2), .usersContainer .grid .row div:nth-child(2) {
  width: 30%;
}

.usersContainer .header div:nth-child(5), .usersContainer .grid .row div:nth-child(5) {
  width: 10%;
}

.usersContainer .btnAdd {
  border-radius: 5px;
  align-self: end;
  margin-bottom: 1rem;
  font-size: 14px;
  color: #F8952A;
  background: #fff;
  border: 1px solid #F8952A;
  font-weight: 600;
}

.btnAdd:hover {
  box-shadow: 0 0 1px 1px #f8952a;
}

.usersContainer .form {
  width: 75%;
  background-color: white;
  box-shadow: rgb(0 0 0 / 10%) 0 4px 12px;
  padding: 2rem;
  margin-bottom: 2rem;
  flex-direction: column;
}

.usersContainer .form .label {
  display: flex;
  margin-bottom: 1rem;
  align-self: flex-start;
  margin-left: 10%;
}

.usersContainer .form .control {
  width: 80%;
  padding: 5px;
}

.usersContainer .form .row > div {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.usersContainer .buttons{
  display: flex;
  justify-content: center;
  flex-direction: row!important;
}

.multi-select{
  height: inherit;
  width: 80%;
}

.dropdown-heading{
  height: inherit!important;
}

.buttons .btn {
  margin: 5px;
}

.usersContainer h3{
  margin-left: 5%;
}

.multipleBots {
  padding: 0!important;
}

#nameError,
#emailError,
#passwordError,
#rpasswordError,
#roleError,
#botError {
  color: red;
  align-self: flex-start;
  margin-left: 11%;
  margin-top: 5px;
  font-size: 12px;
}

.tabList {
  display: flex;
  margin-bottom: 1rem;
}

.tabList .tab{
  padding: 1rem;
  border-bottom: 2px solid rgb(137, 137, 137);
  color: rgb(137,137,137);
  cursor: pointer;
  width: 7rem;
}

.tabList .activeTab {
  padding: 1rem;
  border-bottom: 3px solid #F8952A;
  color: #F8952A;
}

.versionStrap {
  display: flex;
  flex-direction: row;
  border-radius: 10px;
  width: fit-content;
  background-color: #ec8434;
  padding: 1rem 2rem;
  color: white;
  font-size: 18px;
  margin-bottom: 2rem;
}

.versionStrap div{
  margin-right: 3rem;
  display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: center
}

.versionStrap div span.small{
  font-size: 16px;
}

.versionTable{
  background-color: white;
  box-shadow: rgb(0 0 0/10%) 0 4px 12px;
  padding: 1rem;
  margin-bottom: 2rem;
  min-height: 400px;
}

.versionTable span{
  min-width: 12%;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  margin-left: 1rem
}

.versionTable .row{
  display: flex;
  width: 100%;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 14px;
  border-bottom: 2px solid rgb(137, 137, 137);
}

.palette {
  display: none;
  background-color: white;
  padding: 10px;
  position: absolute;
  box-shadow: rgb(0 0 0 / 10%) 0px 4px 12px;
  border: 1px solid rgba(137, 137, 137, 0.3);
  border-radius: 10px;
  font-weight: 100;
}

.inputGroups{
  display: flex;
  width: 100%;
}

.scheduleMigration .applyPopupInner{
  height: 15rem;
}

.scheduleMigration .tabInputGroup{
  margin: 1rem;
}

.scheduleMigration h2{
  position: relative;
  margin-bottom: 16px;
  align-self: center;
}

.scheduleMigration span{
  padding-left: 5px;
  margin-bottom: 5px;
  display: inline-block;
}

.btnMigrate {
  justify-content: space-between;
  position: relative;
}

.btnSchedule {
  position: absolute;
  bottom: 36px;
  width: 100%!important;
  text-align: center;
  margin-left: -16px;
}

div[role="dialog"]{
  z-index: 10000!important;
}

.fa-caret-down{
  align-self: center;
  flex: 1;
  margin-left: 0!important;
}

.caretLabel{
  width: 35px;
  margin: -10px -10px -10px 13px;
  height: 30px;
  display: flex;
  text-align: center;
  border-left: 1px solid white;
}


/* Tree */
.rd3t-tree-container {
  width: 100%;
  height: 100%;
}

.rd3t-grabbable {
  cursor: move; /* fallback if grab cursor is unsupported */
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
}
.rd3t-grabbable:active {
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}

/* Node */
.rd3t-node {
  cursor: pointer;
  fill: #777;
  stroke: #000;
  stroke-width: 2;
}

.rd3t-leaf-node {
  cursor: pointer;
  fill: transparent;
  stroke: #000;
  stroke-width: 1;
}

.rd3t-label__title {
  fill: #000;
  stroke: none;
  font-weight: bolder;
}

.rd3t-label__attributes {
  fill: #777;
  stroke: none;
  font-weight: bolder;
  font-size: smaller;
}

/* Link */
.rd3t-link {
  fill: none;
  stroke: #000;
}

.qrCodeGroup {
  margin-top: 1rem;
  box-shadow: 0 4px 4px rgb(0 0 0 / 25%);
  padding-bottom: 10px;
}

.aLinkIntent {
  color: blue;
}

.tabTitle {
  margin-bottom: 2rem;
}

.tabTitle span {
  display: inline-block;
  min-width: 10rem;
  margin-bottom: 1rem;
  color: gray;
  cursor: pointer;
  border-bottom: 1px solid black;
  padding-bottom: 1rem;
}

.tabTitle span.active {
  color: black;
  border-bottom: 2px solid black;
}

.tabs > div {
  display: none;
}

.tabs > .active {
  display: inline;
}

.dropdown-container {
  border: 1px solid black!important;
  border-radius: 0!important;
  margin-top: -5px!important;
}

.multiRoles div{
  width: 100%!important;
}

.usersContainer .messagepopup {
  height: fit-content!important;
  padding: 1rem;
}

.usersContainer .messagepopup p{
  font-weight: 100;
  color: rgb(137, 137, 137);
  font-size: 14px;
}

.usersContainer .dropdown-heading-value{
  width: 150px;
}

.groupError .messagepopuperror {
  height: 250px!important;
}

.groupError p.error{
  font-weight: bold;
  font-size: 14px;
}

.groupError .messagepopuperror .applyPopupBtns div.btnYellow:first-child {
  display: none;
}

.saveBtn {
  color: green;
  position: absolute;
  top: -10px;
  right: -30px;
  cursor: pointer;
  z-index: 9;
}

.splitterCard {
  width: 100%;
}

.splitterCard label {
  font-weight: normal;
}
.splitterCard input[type="number"]{
  padding-right: 5px;
  width: 50px;
}

.splitterCard input {
  margin: 0 5px 0;
}

.splitterCard .splitterRoute {
  margin-bottom: 1rem;
  margin-top: 1rem;
}

.splitterCard .heading {
  text-decoration: underline;
}

.routeRow {
  display: flex;
  margin-bottom: 1rem;
}

.routeRow label{
  width: 30%;
}

.radio-input-wrapper-section {
  margin-top: 25px;
}
.radio-input-wrapper {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  width: 270px;
}

.radio-input-header {
  font-size: large;
  font-weight: bold;
  display: block;
}

.radio-input-label {
  display: flex;
  align-items: center;
}

.radio-input-label input[type="radio"] {
  margin-right: 5px;
}

.disconnect-facebook {
  height: 40px;
  width: 210px;
  color: white;
  background-color: #3982E4;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}

.companyLogoLivechat {
  background-size: contain;
  width: 160px;
  height: 160px;
  overflow: hidden;
}

.platformDetailsContainer {
  display: flex;
    justify-content: space-between;
    max-width: 400px;
    background-color: white;
    border-radius: 10px;
    padding: 10px 0;
}

.platformItems {
  margin-left: 15px;
  margin-right: 5px;
}

.votesUpDownTable {
  width: 100%;
  border: 1px solid black;
  border-collapse: collapse;
  background-color: white;
}

/* Table header style */
.votesUpDownTable thead th {
  border: 1px solid black;
  padding: 8px;
  text-align: left;
  background-color: white;
}

/* Table body style */
.votesUpDownTable tbody td {
  border: 1px solid black;
  padding: 8px;
  text-align: left;
  background-color: white;
}

.votes-table-container {
  text-align: center;
  margin-bottom: 40px; /* Adjust the spacing as needed */
  margin-top: 40px;
}

.votes-table-heading {
  margin-bottom: 25px; /* Adjust the spacing as needed */
}

.no-data {
  text-align: center !important;
}

.votes-table-btn {
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
  cursor: pointer;
  background: #D8D8D8;
  border-radius: 16.5px;
  color: white;
  font-weight: 100;
  width: max-content;
  min-width: 8rem;
  border: none;
  width: 200px;
  margin-left: 5px;
}

.pagination-center {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}

.pagination-btn {
    background-color: #e0e0e0;
    border: 1px solid #ccc;
    color: #333;
    padding: 5px 10px;
    margin: 0 3px;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

.pagination-btn.active {
    background-color: #007bff;
    color: #fff;
    border-color: #007bff;
}

.pagination-btn:hover {
    background-color: #007bff;
    color: #fff;
    border-color: #007bff;
}

.filter-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.votes-table-download-btn {
  margin-left: 270px;
}

.votestable-button-container {
  flex-grow: 1;
}

.date-range-input {
  display: inline;
  padding: 8px;
  border-radius: 4px;
  border: 1px solid #ccc;
  cursor: pointer;
}

.date-range-input input {
  flex-grow: 1;
  margin-right: 8px; /* Adjust the margin as needed */
  border: none;
  outline: none;
}

.date-range-input span {
  font-weight: bold;
  margin-right: 8px; /* Adjust the margin as needed */
}

.no-border{
  border: 0px solid !important;
}

button[disabled=disabled], button:disabled {
  opacity: 0.6;
}

.sidebar {
  position: relative;
}

.submenu {
  z-index: 1000;
  background-color: #fff;
}

.no-border{
  border: 0px solid !important;
}

button[disabled=disabled], button:disabled {
  opacity: 0.6;
}

.intentSelect {
  position: absolute;
  left: -20px;
  top: 0;
}

.addGroup {
  display: flex;
}

.BotTabAddGroup i {
  margin-left: 30px;
  font-size: 30px;
}

.moveIntents{
  display: flex;
  flex-direction: column;
  width: 5rem;
  margin: 5px;
}

.intentSelect input[type="checkbox"] {
  width: 1.2rem;
  height: 1.2rem;
  margin-left: -0.2rem;
}

/* width */
::-webkit-scrollbar {
  width: 5px;
}
/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #bec4c4;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}
.groupContainer {
  min-height: 22rem;
  width: 18rem;
  justify-content: space-between;
  padding-top: 2rem;
}
ul.groupLists {
  width: 100%;
  text-align: center;
  overflow-y: scroll;
}
.groupContainer .btn {
  width: 15rem;
  height: 2rem;
}
ul.groupLists li {
  list-style: none;
  line-height: 2em;
  width: 90%;
  border-bottom: 1px solid rgba(125, 125, 125, 0.5);
  display: inline-block;
  padding: 5px;
}

ul.groupLists li:hover,ul.groupLists li.active {
  background-color: rgb(125, 125, 125);
}

.hf-main {
  display: flex;
  flex-direction: column;
}

.hf-title {
  display: flex;
  justify-content: center;
  font-weight: 700;
  font-size: 1.5rem;
}

.hf-settings {
  margin-left: 75px;
  position: relative;
}

.hf-main .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 50%;
  margin-bottom: 10px;
  margin-left: 20px;
}

.hf-main .row.button {
  justify-content: center;
}
.hf-main .row .column {
  display: flex;
  width: 50%;
  justify-content: space-between;
  margin-left: 1rem;
}
.hf-main input[type="checkbox"] {
  width: 25px;
  height: 25px;
  margin: 10px;
}

.hf-group-title {
  font-weight: 700;
  text-decoration: underline;
  margin: 10px 0 10px 0;
}

.hf-settings input[type="text"], .hf-settings input[type="password"], .hf-settings input[type="date"] {
  width: 60%;
  height: 25px;
  padding: 5px;
}

.hf-settings > .row {
  justify-content: flex-start;
}

.overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(200,200,200, 0.5);
  top: 40px;
  left: -20px;
}
.hf-settings .hint {
  margin-bottom: 10px;
}
.hf-settings p{
  margin-bottom: 0;
  font-size: 14px;
}

.hf-group {
  margin-bottom: 40px;
}

.hf-main .row .column.flex-end{
  align-items: flex-end;
}

.human-first-conversations .row .column  {
  flex-direction: column;
}

.error {
  color: red;
  align-self: flex-start;
  margin-top: 5px;
  font-size: 12px;
}

.hf-intents-controls .row {
  width: 80%!important;
}

.hf-intents-controls .timestamp {
  font-style: italic;
  font-size: 14px;
  min-width: 30%;
}

.hf-conversations-details .row {
  margin: 10px 0 10px;
  width: 80%;
}

.hf-conversations-details .row div {
  flex: 1
}

.hf-conversations-details .heading  div {
  text-decoration: underline;
  font-weight: 700;
}
.dfDefaultResponses li{
  list-style: none;
  line-height: 1.5;
}

.cardTitle {
  display: block;
  margin-bottom: 10px;
}

.text-right{
  text-align: right;
}

.text-center{
  text-align: center;
}


.text-yellow{
  color: #EC8400;
}

.text-black{
  color: #000;
}

.text-white{
  color: #ffffff;
}
.full-width{
  width: auto !important;

}
.no-decoration{
  text-decoration: none;
}

.formSide-1{
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: none;
  grid-row-gap: 1rem;
}

.form-control-custom {
  width: 70%;
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.6;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out,-webkit-box-shadow 0.15s ease-in-out;
  padding: 0.375rem 0.75rem;
}
.no-border{
  border: 0px solid !important;
}

button[disabled=disabled], button:disabled {
  opacity: 0.6;
}

.bot_type_button_active{
  background-color: #007500;
  color: #fff;
  border: 0px;
  padding: 2px 12px;
  border-radius: 2px;
}

.bot_type_button{
  background-color: #a0a0a0;
  color: #000;
  border: 0px;
  padding: 2px 12px;
  border-radius: 2px;
}
.VoiceContentSection{
  background-color: #bde0ff !important;
}