.color-input {
  width: 30% !important;
  padding: 3px 3px !important;
}

.icons {
  height: 50px;
  width: 50px;
  border-radius: 50%;
}

.radio-btn {
  padding: 3px !important;
}

.input-style {
  border: none;
  width: 90%;
  color: #5A6A85;
}

.error {
  font-size: 12px;
  display: block;
  margin-top: 5px;
  font-weight: normal;
  color: #F44336;
}

.plan_details {
  width: 100%;
  height: 200px;
  background-color: #81ddff;
  opacity: 1;
  border-radius: 2rem;
}


/* .bot-img{ 
    border-radius: 2rem;
}
.bot-img img {
    width : 200px;
    height: 200px;
} */

.plan_title {
  margin-top: 8%;
  margin-left: 2%;
  font-size: 50px;
  color: white;
  text-decoration: double;
}

.required {
  color: black;
}

.select2-container--default {
  width: 250px;
}

.select2-container .select2-selection--single {
  height: 35px;
}

.prefix_style {
  background-color: transparent;
  color: #000;
  border-radius: 3px;
  padding: 0 4px;
  font-size: 12px;
  font-weight: bold;
}

.on_click_submit .form-label {
  font-size: 16px;
}

.on_click_submit small {
  line-height: 25px;
  width: 100%;
  margin-bottom: 15px;
}

.domain_heading {
  background-color: #7bb5ff;
  color: white;
  border-radius: 3px;
  padding-right: 3px;
  padding-left: 3px;
  text-decoration: solid;
  font-weight: bold;
}

.hide {
  display: none !important;
}

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked+.slider {
  background-color: #2196F3;
}

input:focus+.slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked+.slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

#chat-window {
  width: 100%;
  height: 500px;
  border: 1px solid #ccc;
  overflow-y: scroll;
}

.message {
  margin-bottom: 15px;
  padding: 5px;
  background-color: #f2f2f2;
  border-radius: 5px;
}

.user-message {
  max-width: fit-content;
  /* direction: rtl; */
  background-color: #3b37a3;
  color: #fff;
  margin-left: auto;
}

.timestamp {
  display: flex;
  font-size: 11px;
  color: #707070;
  font-weight: 600;
  justify-content: end;
  align-items: end;
}

.user-message .timestamp {
  color: #e9e9e9;
}

.bot-message {
  background-color: #e7f3e7;
  max-width: fit-content;
}

.chat-container {
  margin: 1%;
}

.date-container {
  display: flex;
  justify-content: center;
}

.dateStamp {
  font-size: 12px;
  max-width: fit-content;
  background-color: #eaeaea;
  padding: 0px 7px 0px 7px;
  border-radius: 1rem;
  color: black;
  margin-bottom: 10px;
  box-shadow: 0px 0px 2px 1px rgb(116 116 116 / 30%);
}

.dynamic-span {
  margin-right: 20px;
}

/* 04-09-2023 */
.profile-head .card-body span {
  color: #2A3547;
  font-size: 14px;
  font-weight: 500;
}

.profile-head .card-body p {
  border: 1px solid #DFE5EF;
  -webkit-box-shadow: inset 0 1px 2px rgba(var(--bs-body-color-rgb), 0.075);
  box-shadow: inset 0 1px 2px rgba(var(--bs-body-color-rgb), 0.075);
  border-radius: 7px;
  padding: 8px 16px;
  color: #2A3557;
  font-size: 14px;
  font-weight: 400;
  background-color: #f5f5f5;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.profile-head .card-body p.update-btn {
  position: relative;
  padding-right: 160px;
}

.profile-head .card-body p.update-btn a {
  position: absolute;
  right: 3px;
  top: 3px;
  padding: 4px 15px;
  font-size: 14px;
  background-color: #fff !important;
  color: #3b37a3 !important;
}

.profile-head .card-body p.update-btn a:hover {
  background-color: #3b37a3 !important;
  color: #fff !important;
}

.form-control {
  color: #2A3557 !important;
}

.btn-secondary,
.btn-primary,
.btn {
  background-color: #3b37a3 !important;
  border: 1px solid #3b37a3 !important;
  color: #fff !important;
}

.btn-success {
  color: #fff !important;
  background-color: #28a745 !important;
  border-color: #28a745 !important;
}

.btn-secondary:hover,
.btn-primary:hover,
.btn:hover {
  background-color: #fff !important;
  color: #3b37a3 !important;
}

.btn-outline {
  background-color: transparent !important;
  border: 1px solid #3b37a3 !important;
  color: #3b37a3 !important;
  padding: 8px 16px;
}

.btn-outline:hover {
  background-color: #3b37a3 !important;
  color: #fff !important;
}

#update_password .password-input {
  position: relative;
}

#update_password .password-input input {
  padding-right: 40px;
}

#update_password .password-input .visibility-icon {
  position: absolute;
  right: 10px;
  top: 6px;
  opacity: .6;
}


/* plan-section */
.plan-section {
  margin-top: 50px;
}

.plan-section h3 {
  font-size: 40px;
  font-weight: 700;
  color: #2a3547;
}

.plan-detail-head p {
  font-size: 16px;
  font-weight: 400;
}

.plan-detail-box {
  margin-top: 60px;
}

.plan-detail-box .box-inner {
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  padding: 30px 20px;
  border-radius: 15px;
}

.plan-title span {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #2A3547;
}

.plan-title.standard-text span {
  background-color: #3b37a3;
}

.plan-title.premium-text span {
  background-color: #ffb80e;
}

.plan-title p {
  font-size: 17px;
  font-weight: 700;
  color: #2a3547;
  margin-bottom: 0;
  margin-left: 15px;
}

.plan-title.standard-text p {
  color: #3b37a3;
}

.plan-title.premium-text p {
  color: #ffb80e;
}

.plan_details {
  margin: 40px auto 0 !important;
  height: auto;
  align-items: center;
}

.plan_details {
  background-color: #fff;
  border: 2px solid #2A3547;
  overflow: hidden;
}

.plan_details.basic-subs h2 {
  color: #2A3547;
}

.plan_details.basic-subs {
  border-color: #2A3547;
}

.plan_details.standred-subs h2 {
  color: #3b37a3;
}

.plan_details.standred-subs {
  border-color: #3b37a3;
}

.plan_details.premium-subs h2 {
  color: #ffb80e;
}

.plan_details.premium-subs {
  border-color: #ffb80e;
}

.plan-price {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  margin: 20px 0 40px;
}

.plan-price p {
  margin-bottom: 0;
  font-size: 45px;
  line-height: 45px;
  font-weight: 500;
  color: #2a3547;
}

.plan-price span {
  font-size: 15px;
  font-weight: 500;
  color: #2a3547;
}

.plan-specs {
  margin-bottom: 70px;
}

.plan-specs li {
  font-size: 14px;
  font-weight: 500;
  color: #2A3547;
  margin-bottom: 13px;
  line-height: 17px;
  position: relative;
  padding-left: 27px;
}

.plan-specs li::before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  background-image: url(../images/chatbot_images/sparkle_icon.svg);
  width: 18px;
  height: 18px;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
}

.btn-outline.get-plan {
  width: 100%;
  font-size: 17px;
  padding: 13px;
}

.sidebar-nav ul .sidebar-item.selected>.sidebar-link,
.sidebar-nav ul .sidebar-item.selected>.sidebar-link.active,
.sidebar-nav ul .sidebar-item>.sidebar-link.active {
  background-color: #3b37a3 !important;
}

.sidebar-nav ul .sidebar-item.selected>.sidebar-link:hover,
.sidebar-nav ul .sidebar-item.selected>.sidebar-link.active:hover,
.sidebar-nav ul .sidebar-item>.sidebar-link.active:hover {
  background-color: #3b37a3 !important;
  color: #fff !important;
}

.sidebar-nav ul .sidebar-item .sidebar-link:hover {
  background-color: rgb(73, 190, 255, 0.1) !important;
  color: #3b37a3 !important;
}

.btn-group-toggle .btn {
  color: #3b37a3 !important;
  background-color: #fff !important;
}

.btn-group-toggle .btn.active {
  background-color: #3b37a3 !important;
  color: #fff !important;
}

.plan_details .plan-specs {

  margin: 20px 0 0;
}

.plan_details .plan-specs li::before {
  background-image: url(../images/chatbot_images/sparkle_icon_black-01.svg);
}

.plan_details .plan-specs li {
  color: #2A3547;
}

.plan_details .right-section {
  position: relative;
  z-index: 0;
  display: flex;
  justify-content: center;
}

.plan_title {
  margin-top: 0;
  margin-left: 0;
  padding: 30px 10px;
  line-height: normal;
  display: flex;
  flex-direction: column;
}

.plan_title span {
  font-size: 14px;
  margin-bottom: 7px;
  line-height: 20px;
  color: #2A3547;
  font-weight: 500;
}

.plan_title h2 {
  font-size: 35px;
  color: white;
  line-height: 40px;
  font-weight: 700;
}

.plan_title p {
  font-size: 16px;
  margin-bottom: 10px;
  line-height: 22px;
}

.plan_title .btn-primary {
  font-size: 15px;
  width: 160px;
  /* background-color: #fff !important; */
}

.basic-subs .plan_title .btn-primary {
  background-color: #2A3547 !important;
  border-color: #2A3547 !important;
}

.basic-subs .plan_title .btn-primary:hover {
  background-color: #fff !important;
  border-color: #2A3547 !important;
  color: #2A3547 !important;
}

.view_subscription_details .btn-primary {
  background-color: #2A3547 !important;
  border-color: #2A3547 !important;
}

.view_subscription_details .btn-primary:hover {
  background-color: #fff !important;
  border-color: #2A3547 !important;
  color: #2A3547 !important;
}

.standred-subs .plan_title .btn-primary {
  background-color: #fff !important;
  border-color: #3b37a3 !important;
  color: #3b37a3 !important;
}

.standred-subs .plan_title .btn-primary:hover {
  background-color: #3b37a3 !important;
  border-color: #3b37a3 !important;
}

.premium-subs .plan_title .btn-primary {
  background-color: #ffb80e !important;
  border-color: #ffb80e !important;
}

.premium-subs .plan_title .btn-primary:hover {
  background-color: #fff !important;
  border-color: #ffb80e !important;
  color: #ffb80e !important;
}

.plan-expiry {
  border-top: 1px solid #fff;
  padding-top: 10px;
  margin-top: 10px;
}

.plan-expiry span {
  font-size: 15px;
  font-weight: 600;
  color: #2A3547;
}

.plan-expiry p {
  font-size: 14px;
  font-weight: 600;
  color: #2A3547;
}

.upload-box-start .upload-box {
  border: 2px dashed #e7e7e9;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  padding: 25px 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  margin-bottom: 0;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #f5f5f5;
  cursor: pointer;
}

.upload-box p {
  text-align: center;
  color: #2A3547;
  margin-bottom: 0;
  font-size: 15px;
  font-weight: 500;
}

.upload-tool .upload-box img {
  width: 80px;
  margin-bottom: 20px;
}

.upload-tool .upload-box span {
  margin-top: 15px;
}

.upload-tool .upload-box span.small-text {
  font-size: 12px;
}

.attched-link {
  max-width: 890px;
  /* border: 1px solid #ddd; */
  /* padding: 20px; */
  margin: 0 auto;
  border-radius: 10px;
}

.attched-link-field {
  font-size: 14px;
  font-weight: 400;
}

.attched-link-field:hover {
  border-color: #2a3547;
}

.add-more-box .form-line {
  position: relative;
}

.add-more-box .form-line input {
  padding-right: 35px;
  text-overflow: ellipsis;
}

.form-label :where(small, span) {
  font-size: 13px;
  font-weight: 400;
}

/* theme-setting */

.theme-box {
  margin-top: 50px;
}

.theme-box .nav-tabs {
  border: none;
}

.theme-box .nav-tabs .nav-item {
  margin-bottom: -4px;
}

.theme-box .nav-tabs .nav-link:focus-visible {
  box-shadow: none;
  outline: none;
  border: 0;
}

.theme-box .nav-tabs .nav-link {
  background-color: #fff;
  border: 1px solid #fff;
  color: #2A3547;
  margin-right: 15px;
  font-size: 17px;
  font-weight: 600;
  /* border-radius: 50px; */
  padding: 16px 30px;
  /* transition: all 0.3s ease-in-out; */
}

.theme-box .nav-tabs .nav-item:last-child .nav-link {
  margin-right: 0;
}

.theme-box .nav-tabs .nav-link:hover {
  color: #3b37a3;
  border-color: #fff;
  border: 1px solid transparent;
}

.theme-box .nav-tabs .nav-link.active {
  background-color: #fff;
  color: #3b37a3;
  padding: 18px 30px;
  border: 1px solid #c5c5c5;
  font-weight: 700;
  border-bottom-color: #fff;
  margin-bottom: 2px;
  /* color: #fff; */
}

.theme-box .tab-content .tab-pane.show {
  padding: 20px;
  border: 1px solid #c5c5c5;
  transition: all 0.4s ease-in-out;
  border-radius: 10px;
  border-top-left-radius: 0;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

}

.theme-selector .form-check {
  padding-left: 28px;
}

.theme-selector .form-check .form-check-input {
  width: 20px;
  height: 20px;
  margin-left: -30px;
  transition: all 0.2s ease-in-out;
}

.theme-selector .form-check .form-check-input:checked {
  background-color: #3b37a3;
  border-color: #3b37a3;
  /* transition: all 0.2s ease-in-out; */
}

.theme-selector figure {
  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 30px;
}

.theme-selector figure img {
  width: 100%;
}

.theme-selector .form-check {
  padding-left: 0;

}

.theme-selector .form-check input {
  display: none;
}

.theme-selector .form-check label {
  width: 100%;
  border: 1px solid #3b37a3;
  padding: 10px;
  text-align: center;
  border-radius: 50px;
  font-size: 16px;
  color: #3b37a3;
  font-weight: 600;
  transition: all 0.3s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.theme-selector .form-check input:checked+label {
  background-color: #3b37a3;
  color: #fff;
  transition: all 0.3s ease-in-out;

}

.theme-selector .form-check label img {
  max-width: 20px;
  margin-right: -15px;
  transition: all 0.3s ease-in-out;
  /* display: none; */
  opacity: 0;
  visibility: hidden;
}

.theme-selector .form-check input:checked+label img {
  margin-right: 5px;
  /* display: block; */
  opacity: 1;
  visibility: visible;
  transition: all 0.3s ease-in-out;

}

.bot-icon-selector h3 {
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 10px;
}

.bot-icon-selector label {
  background-color: #fff !important;
  border: 1px solid #ddd !important;
}

.bot-icon-selector input:checked+label {
  background-color: #3b37a3 !important;
  border-color: #3b37a3 !important;
}

.theme-box>p {
  color: #2A3547;
}

.color-input {
  width: 50px !important;
  padding: 3px;
  height: 50px !important;
  border-radius: 0 !important;

}

.switch .slider {
  height: 28px;
  background-color: #acacac;
}

.switch .slider:before {
  height: 26px;
  width: 26px;
  left: 0px;
  bottom: 1px;
}

.switch input:checked+.slider:before {
  -webkit-transform: translateX(33px);
  -ms-transform: translateX(33px);
  transform: translateX(33px);
}

.add-more-box .uploaded-links {
  width: 100%;
  border: 1px solid #a4a4a4;
  padding: 10px 10px;
  border-radius: 5px;
}

.add-more-box .uploaded-links p {
  font-size: 15px;
  font-weight: 600;
  color: #2A3547;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding-right: 10px;
}

.add-more-box .uploaded-links .remove-links {
  border: none;
  background-color: transparent;
  border: 1px solid #bf7474;
  box-shadow: 0px 0px 2px 0px #bf7474;
  border-radius: 5px;
  padding: 5px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.attched-link .form-line input {
  text-overflow: ellipsis;
}

.domain_heading {
  background-color: transparent;
  color: #2A3547;
  font-weight: 800;
  padding: 0;
}

.dashboard-listing {
  margin: 0 -10px;
}

.dashboard-listing li {
  width: 33.33%;
  padding: 0 10px 20px;
}

.dashboard-listing li a {
  display: block;
  text-align: center;
  /* justify-content: space-between; */
  height: 100%;
  padding: 20px 15px;
  box-shadow: rgba(145, 158, 171, 0.2) 0px 0px 2px 0px, rgba(145, 158, 171, 0.12) 0px 12px 24px -4px;
  border-radius: 10px;
  background-color: #fff;
  /* border: 1px solid #ddd; */
  transition: all 0.2s ease-in-out;
}

.dashboard-listing li a span {
  font-size: 15px;
  font-weight: 500;
  color: #2A3547;
}

.dashboard-listing li a p {
  font-size: 40px;
  margin-bottom: 10px;
  line-height: 32px;
  font-weight: 700;
  color: #2A3547;
}

.index-doc-box {
  box-shadow: rgba(145, 158, 171, 0.2) 0px 0px 2px 0px, rgba(145, 158, 171, 0.12) 0px 12px 24px -4px;
  border-radius: 10px;
  background-color: #fff;
  border: 1px solid #ddd;
  transition: all 0.2s ease-in-out;
}

.index-doc-box {
  padding: 20px;
}

.index-doc-box h3 {
  font-size: 16px;
  font-weight: 500;
  color: #2A3547;
  margin-bottom: 20px;
}

.index-doc-box ul {
  margin: 0 -10px;
}

.index-doc-box ul li {
  padding: 0 10px;
  width: 20%;
  /* text-align: center; */
}

.index-doc-box ul li a {
  display: block;
  text-align: center;
  box-shadow: rgba(145, 158, 171, 0.2) 0px 0px 2px 0px, rgba(145, 158, 171, 0.12) 0px 12px 24px -4px;
  border-radius: 10px;
  background-color: #fff;
  border: 1px solid #ddd;
  transition: all 0.2s ease-in-out;
  padding: 10px;
}

.index-doc-box ul li a figure {
  max-width: 45px;
  margin: 0 auto 7px;
}

.index-doc-box ul li a img {
  width: 100%;
}

.index-doc-box ul li a p {
  font-size: 20px;
  margin-bottom: 0;
  line-height: 25px;
  font-weight: 700;
  color: #2A3547;
}

.bot-img {
  background-color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  /* width: 190px;
  height: 190px; */
}

.bot-img img {
  width: 185px;
}

.upload-file-canvas.offcanvas-start {
  left: inherit !important;
  right: -100%;
  width: 450px !important;
  transform: none !important;
  transition: 0.2s ease-in-out;
}

.upload-file-canvas.offcanvas-start.show {
  right: 0 !important;
}

.upload-file-canvas .accordion-body .files-panel {
  max-height: 350px;
  overflow-x: hidden;
  overflow-y: auto;
}

button.box-main-logo {
  font-size: 18px;
  font-weight: 700;
  color: #2A3547 !important;
  margin-bottom: 0;
  background-color: #fff !important;
  border-bottom: 0.5px solid #ebf1f6 !important;
  box-shadow: none !important;
}

button.box-main-logo::after {
  filter: invert(1) brightness(0);
}

button.box-main-logo.collapsed {
  font-size: 17px;
  font-weight: 500;
  background-color: #fff !important;
  color: #2A3547;
  border-bottom: 0.5px solid transparent !important;
}

.box-main-logo img {
  max-width: 22px;
}

.files-panel ul {
  margin: 0 -10px;
}

.files-panel ul li {
  /* width: 20%; */
  padding: 0 10px 10px;
}

.files-panel ul li .box-content {
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
  /* border-radius: 10px; */
  text-align: center;
  position: relative;
  display: flex;
  align-items: center;
  /* transition: all 0.3s ease-in-out; */
  background-color: #fff;
  overflow: hidden;
}

.files-panel ul li .box-content figure {
  margin-bottom: 0;
  margin-right: 10px;
  flex: 0 0 auto;
  max-width: 22px;
}

.files-panel ul li .box-content figure img {
  width: 100%;
}

.files-panel ul li .box-content span {
  font-size: 15px;
  color: #2A3547;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 55px;
  max-width: 290px;
}

.files-panel ul li .box-content .file-delete {
  background-color: transparent;
  border: 1px solid #bf7474;
  box-shadow: 0px 0px 2px 0px #bf7474;
  border-radius: 5px;
  padding: 5px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  /* margin-right: -100%; */
  transition: all 0.3s ease-in-out;

}

body {
  background: #f5f5f5 !important;
}

.files-panel ul li .box-content:hover .file-delete {
  margin-right: 0;
}

button.uploaded-btn {
  border: 1px solid #3b37a3;
  border-radius: 10px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  padding: 8px 30px !important;

  padding: 0;
  font-size: 16px;
  font-weight: 600;
}

.offcanvas-title {
  font-size: 20px;
  font-weight: 700;
}

.bot-message {
  font-size: 14px;
  line-height: 16px;
  background-color: #f5f5f5;
  padding: 3px;
  border-radius: 5px;
  font-weight: 500;
}

.installation-int input {
  background-color: #f5f5f5;
  padding: 7px;
  border-radius: 10px;
}

.installation-int .bottom-text {
  font-size: 14px;
  font-weight: 500;
  color: #2A3547;
  margin-top: 15px;
}

.installation-int .fa-copy {
  font-size: 19px;
  cursor: pointer;
}

.deleteChat.file-delete {
  margin-left: auto;
  background-color: transparent !important;
  border: 1px solid #bf7474 !important;
  box-shadow: 0px 0px 2px 0px #bf7474 !important;
  border-radius: 5px;
  padding: 5px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: -100%;
  transition: all 0.3s ease-in-out;
}

a.view-history {
  margin-right: 7px !important;
  background-color: #3b37a3 !important;
  border: 1px solid #3b37a3 !important;
  box-shadow: 0px 0px 2px 0px #3b37a3 !important;
  border-radius: 5px;
  padding: 5px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: -100%;
  transition: all 0.3s ease-in-out;
}

.theme-head {
  position: relative;
  width: 100%;
  margin-bottom: 20px;
}

.theme-head::before {
  position: absolute;
  content: "";
  top: 14px;
  width: 100%;
  height: 1px;
  background-color: #ddd;
}

.theme-head h2 {
  font-size: 18px;
  background-color: #fff;
  padding-right: 15px;
  position: relative;
  z-index: 1;
  width: fit-content;
  font-weight: 600;
  color: #2A3547;
}

.custom-theme-selector {
  margin-top: 75px;
}

.history-list-start .dropdown-menu li a {
  padding: 5px 10px;
  width: 100%;
  display: block;
}

.history-list-start .dropdown-menu[x-placement="bottom-start"] {
  left: auto !important;
  right: 0;
}

.history-list-start .dropdown-menu li a :where(svg, i) {
  margin-right: 5px;
}

.enable-box {
  border: 1px solid #DFE5EF;
  padding: 15px;
  border-radius: 10px;
  height: 100%;
}

.enable-box .capture {
  width: 17px;
  height: 17px;
}

.enable-box .capture:checked {
  background-size: 10px;
}

/* piyush */
span.email-ids {
  float: left;
  border: 1px solid #ccc;
  margin-right: 5px;
  padding-left: 10px;
  padding-right: 10px;
  margin-bottom: 5px;

  padding-top: 3px;
  padding-bottom: 3px;
  border-radius: 5px;
}

span.cancel-email {
  border: 1px solid #ccc;
  width: 18px;
  display: block;
  float: right;
  text-align: center;
  margin-left: 20px;
  border-radius: 49%;
  height: 18px;
  line-height: 15px;
  margin-top: 1px;
  cursor: pointer;
}

.col-sm-12.email-id-row {
  border: 1px solid #ccc;
}

.col-sm-12.email-id-row input {
  border: 0px;
  outline: 0px;
  box-shadow: none;
}

.col-sm-12.email-id-row input:focus {
  box-shadow: none;
  outline: none;
}

span.to-input {
  display: block;
  float: left;
  padding-right: 11px;
}

.col-sm-12.email-id-row {
  padding-top: 6px;
  padding-bottom: 7px;
  margin-top: 23px;
}

/* piyush */
.domain-select .select2.select2-container {
  width: 250px !important;
  max-width: 100%;
}

.message-view {
  padding: 10px 12px;
  line-height: 19px;
  font-size: 13px;
}

.dateStamp {
  background-color: rgb(0 132 255 / 20%);
  padding: 4px 10px;
  border-radius: 5px;
  font-weight: 500;
  box-shadow: none;
  margin-bottom: 20px;
}

.bot-message {
  border-radius: 15px;
  border-top-left-radius: 0;
  max-width: 730px;
  width: fit-content;
}

.user-message {
  border-radius: 15px;
  border-top-right-radius: 0;
  max-width: 630px;
  background-color: #2A3547;
  width: fit-content;
}

.domain-select .select2.select2-container {
  width: 210px !important;
}

.domain-select .select2-container--default .select2-selection--single {
  background-color: #3b37a3;
  border: 1px solid #3b37a3;
  border-radius: 4px;
  color: #fff;
  font-weight: 600;
  display: flex;
  height: 37px;
  align-items: center;
  position: relative;
}

.domain-select .select2-container--default .select2-selection--single::before {
  position: absolute;
  content: "";
  right: 10px;
  top: 10px;
  background-image: url(../images/chatbot_images/down_icon.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  width: 15px;
  height: 15px;
}

.domain-select .select2-selection--single .select2-selection__rendered {
  color: #fff !important;
}

.domain-select .select2-selection__arrow {
  display: none !important;
}



.chat-history-box {
  display: flex;
  flex-direction: column;
  align-items: start;
}

.chat-history-box .user-info {
  font-size: 18px;
  font-weight: 900;
  color: #2A3547;
  line-height: 24px;
}

.chat-history-box.user-message-section {
  align-items: end;
}

.message {
  margin-bottom: 5px;
}

#pImage {
  display: flex;
  align-items: center;
  justify-content: center;
}

#pImage img {
  width: 100%;
}

.dropzone {
  border: none !important;
  padding: 0 !important;
}

.dropzone.dz-started {
  border: 2px dashed #e7e7e9 !important;
  background: #f5f5f5 !important;
  padding: 25px 30px;
  border-radius: 8px;
}

.dropzone .dz-message {
  margin: 0;
}

.dropzone.dz-started a {
  color: #2A3547;
  margin-top: 8px;
  font-weight: 700;
}


@media (max-width:991px) {
  .plan-section h3 {
    font-size: 30px;
  }

  .plan-detail-head p {
    font-size: 14px;
  }

  .plan-detail-box {
    margin-top: 40px;
  }

  .files-panel ul li .box-content .file-delete {
    margin-right: 0;
  }

  .on_click_submit .form-label {
    font-size: 14px;
  }
}

@media (max-width:767px) {

  .body-wrapper>.container-fluid,
  .body-wrapper>.container-lg,
  .body-wrapper>.container-md,
  .body-wrapper>.container-sm,
  .body-wrapper>.container-xl,
  .body-wrapper>.container-xxl {
    padding: 30px 12px !important;
    padding-top: calc(70px + 15px) !important;
  }

  .app-header {
    padding: 0 12px !important;
  }

  .card-body {
    padding: 20px 15px !important;

  }

  .upload-box-start .upload-box {
    font-size: 15px;
    padding: 25px 15px;
  }

  .upload-box p {
    font-size: 14px;
  }

  .bot-img {
    margin-top: 20px;
    margin-left: 10px;
  }

  .bot-img {
    width: 130px;
    height: 130px;
  }

  .bot-img img {
    max-width: 100%;
  }

  .plan_title h2 {
    font-size: 30px;
    line-height: 32px;
  }

  .plan_title span {
    font-size: 13px;
    margin-bottom: 5px;
    line-height: 17px;
  }

  .plan-specs li {
    line-height: 20px;
  }

  .plan-detail-head p {
    width: 100%;
    margin-bottom: 10px;
  }

  .plan-detail-head p br {
    display: none;
  }

  .plan-section h3 {
    font-size: 27px;
  }

  .plan-price p {
    font-size: 35px;
    line-height: 35px;
  }

  .plan-price span {
    font-size: 13px;
  }

  .plan-price {
    margin: 20px 0;
  }

  .plan-specs {
    margin-bottom: 45px;
  }

  .btn-outline.get-plan {
    padding: 10px;
  }

  .plan-detail-box .box-inner {
    padding: 20px;
  }

  .card-title {
    font-size: 16px !important;
  }

  .theme-box .nav-tabs .nav-link {
    margin-right: 5px;
    font-size: 15px;
    padding: 17px;
  }

  .theme-selector .form-check label {
    font-size: 14px;
  }

  .theme-selector .form-check label img {
    max-width: 15px;
  }

  .plan_details .right-section {
    justify-content: start;
  }

  .upload-file-canvas.offcanvas-start {
    width: 100% !important;
  }

  button.box-main-logo {
    padding: 15px 10px;
    font-size: 17px;
  }

  .upload-file-canvas .accordion-body {
    padding: 15px 10px;
  }

  .uploaded-btn {
    font-size: 13px !important;
  }

  .theme-box .nav-tabs {
    width: 100%;
    /* margin-bottom: 35px; */
    justify-content: center;
  }

  button.uploaded-btn {
    font-size: 15px !important;
    padding: 8px 17px !important;
    width: 100%;
  }

  .domain-select .select2.select2-container {
    width: 140px !important;
    max-width: 100%;
  }

  .app-header .navbar .navbar-nav .nav-item .nav-link {
    padding: 0 15px 0 0 !important;
  }

  .app-header .navbar .navbar-nav .nav-item.dropdown .nav-link {
    padding-left: 15px !important;
    padding-right: 0 !important;
  }

  .theme-box {
    margin-top: 30px;
  }

  .dropzone.dz-started {
    padding: 25px 15px;
  }

  /* 19-10-2023 */

  .index-doc-box ul {
    justify-content: center;
  }

  .index-doc-box ul li {
    width: 50%;
    margin-bottom: 20px;
  }

  .dashboard-listing li {
    width: 100%;
  }

  .saving-btn div {
    width: 100%;
  }

  .saving-btn .btn {
    width: 100%;
    margin-bottom: 15px;
    margin-right: 0 !important;
  }

  .app-header .navbar .navbar-nav li a.guide-btn {
    padding: 5px;
  }

  .app-header .navbar .navbar-nav li a.guide-btn {
    border-radius: 50%;
    padding: 5px;
  }

  .app-header .navbar .navbar-nav li a.guide-btn:hover {
    background-color: #fff !important;
  }

  /* 19-10-2023 */
}

@media (max-width:576px) {
  .saving-btn .btn {
    font-size: 13px;
    padding: 7px;
  }

  .color-input {
    width: 100% !important;
  }

  .upload-tool .upload-box img {
    width: 60px;
  }

  .attched-link {
    padding: 20px 12px;
  }

  .add-more-box .uploaded-links p {
    font-size: 14px;
  }

  .history-list-start .dropdown-menu[x-placement="bottom-start"] {
    right: -40px !important;
  }
}

.navbar-nav .dropdown-menu .dropdown-item:hover {
  color: #3b37a3;
}

.brand-logo {
  justify-content: space-between !important;
}

.swal2-title {
  font-size: 19px;
  padding-top: 5px;
}

.swal2-icon {
  transform: scale(0.8);
}

.swal2-html-container {
  margin-top: 10px !important;
}

.swal2-confirm {
  background-color: #3b37a3 !important;
}

div:where(.swal2-container) div:where(.swal2-actions) {
  margin-top: 5px !important;
}

.custom-theme-selector button.theme-delete-btn {
  border: 1px solid #ef2929 !important;
  padding: 10px;
  background-color: #fff !important;
  text-align: center;
  border-radius: 50px;
  font-size: 16px;
  color: #ef2929 !important;
  font-weight: 600;
  transition: all 0.3s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.custom-theme-selector button.theme-delete-btn:hover {
  background-color: #ef2929 !important;
  color: #fff !important;
}

.theme-selector .form-check label:hover {
  background-color: #3b37a3 !important;
  color: #fff !important;
}

.files-panel ul li .box-content .file-delete {
  position: absolute;
  right: 0;
  top: 0;
}

.files-panel ul li .box-content .refine-file {
  position: absolute;
  right: 35px;
  top: 0;
  height: 55%;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0.6;
  z-index: 9;
  display: none;
}

.body-scroll .overlay {
  display: block;
}

.body-scroll {
  overflow: hidden;
}

.files-panel .filetext {
  padding-right: 25px;
}

.on_click_submit .select2.select2-container--default {
  width: 100% !important;
}

@media (min-width:768px) {
  .on_click_submit span.error {
    min-height: 18px;
  }

}

.on_click_submit .modal-body .form-check-input:checked {
  background-color: #00A651;
  border-color: #00A651;
}

.domain_delete_info {
  color: red;
}

.chat-analysis {
  border: 2px solid rgb(20, 160, 253);
  box-shadow: 5px 5px 10px rgba(0, 0, 255, 0.2);
  border-radius: 10px;
  margin: 10px;
  height: 150px;
  overflow: auto;
  padding: 10px;
}

.refine-web {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.retry-web {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
}

table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting::after,
table.dataTable thead .sorting_desc::after {
  display: none !important;
}

.instruction-list {
  list-style-type: disc;
  list-style-position: outside;
  margin-left: 20px;
}

.context_text {
  border-radius: 10px;
  margin: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  padding: 10px;
  border: 2px solid skyblue;
}

.link_disabled{
  pointer-events: none;
  cursor: default;
  opacity: 0.6;
}

.crawler-info {
  display: flex; /* Make the container a flex container */
  align-items: center; /* Align items vertically */
  width: 30%;
  padding: 2px 10px;
  color: #000;
  font-size: small;
  border: 1px solid rgb(164, 164, 164);
  /* border-left-width: 2px; */
  border-top-width: 0px;
  border-image: none;
  border-radius: 5px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  margin-left: 25px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* HTML: <div class="loader"></div> */
.info-loader {
  height: 7px;
  aspect-ratio: 5;
  --_g:no-repeat radial-gradient(farthest-side,#3b37a3 94%,#0000);
  background: var(--_g),var(--_g),var(--_g),var(--_g);
  background-size: 20% 100%;
  animation:
    l40-1 .75s infinite alternate,
    l40-2 1.5s infinite alternate; 
}
@keyframes l40-1 {
  0%,
  10% {background-position: 0 0,0 0,0 0,0 0}
  33% {background-position: 0 0,calc(100%/3) 0,calc(100%/3) 0,calc(100%/3) 0}
  66% {background-position: 0 0,calc(100%/3) 0,calc(2*100%/3) 0,calc(2*100%/3) 0}
  90%,
  100% {background-position: 0 0,calc(100%/3) 0,calc(2*100%/3) 0,100% 0}
}
@keyframes l40-2 {
  0%,49.99% {transform: scale( 1)}
  50%,100%  {transform: scale(-1)}
}

.multi-crawled-url {
  width: 95%;
  padding: 2px 10px;  
  color: #000;
  font-size: small;
  border: 1px solid rgb(164, 164, 164);
  /* border-left-width: 2px; */
  border-top-width: 0px;
  border-image: none;
  border-radius: 5px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  margin-left: 20px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.accordion-web{
  --bs-accordion-btn-padding-y: 0.1rem !important;
  --bs-accordion-body-padding-y: 0.2rem !important;
  --bs-accordion-active-bg: none !important;
}

.multi-url-box{
  max-height: 400px;
  overflow-y: auto;
}

.uploaded-links-mini {
  height: 30px !important;
  padding: 5px 5px !important;
}

.btn-sm-mini{
  --bs-btn-line-height: 0.5 !important;
}

.remove-links-mini{
  height: 22px !important;
}


/****** 29-03-2024 *****/
.multi-crawled-url.accordion-weburl{width:100%; padding:0px; border:1px solid #ddd; margin:0px;  box-shadow: none;}
.multi-crawled-url.accordion-weburl .accordion {
    border: none;
    box-shadow: none;
}
.multi-crawled-url.accordion-weburl .accordion .accordion-item {
    border: none;
    box-shadow: none;
    padding: 0px;
    background-color: transparent;
}
.counterpages span{font-weight:700; font-size:13px; color:#000; display:block;     line-height: 14px; min-width: 83px; width: 88px;  max-width: 120px;}
.multi-crawled-url.accordion-weburl .accordion .accordion-item .accordion-button{    padding: 4px 8px; margin:0px 6px;     border: var(--bs-border-width) solid #DFE5EF;     border-radius: 7px; -webkit-box-shadow: inset 0 1px 2px rgba(var(--bs-body-color-rgb), 0.075);
    box-shadow: inset 0 1px 2px rgba(var(--bs-body-color-rgb), 0.075);      height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;}
.add-more-box .uploaded-links{border:1px solid #ddd; padding: 14px 20px; }
.add-more-box .uploaded-links p img{opacity:0.4;}
.multi-crawled-url.accordion-weburl .accordion .accordion-item .accordion-button:after {
    background-size: 12px; background-position: center;
}
.multi-crawled-url.accordion-weburl .accordion .accordion-body{padding-top:0; padding-bottom:20px;}
.multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box{border-top:1px solid #ddd; padding-top:0px;}
.multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box .uploaded-links-mini {
    padding: 15px 0px !important;
    border-bottom: 1px solid #efecec;
    height: inherit !important;
    border-radius: 0px;
}
.multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box .uploaded-links-mini:last-child{border:none;}
.multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box .uploaded-links-mini p{font-weight:500; font-size:14px;}
.add-more-box .multi-crawled-url.accordion-weburl  .uploaded-links{border:none;     padding: 14px 20px; height:58px;}
.add-more-box .multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box .uploaded-links-mini .remove-links{height:28px !important;}
.add-more-box .multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box .uploaded-links-mini .btn-sm-mini {height:28px;}
.add-more-box .multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box .uploaded-links-mini .btn-sm-mini.disabled {
    display: flex;
    align-items: center;
    color: #000 !important;
    border: 1px solid #000 !important;
    opacity: 0.16;
}


@media (max-width:767px) {
	
	.add-more-box .multi-crawled-url.accordion-weburl .accordion .accordion-body .multi-url-box .uploaded-links-mini .btn-sm-mini{margin-left:10px !important;}
		.add-more-box  .uploaded-links  .btn.btn-outline.btn-sm{margin-left:10px !important;}

#web-link-pane .attched-link{padding-left:0px; padding-right:0px; }
.tab-pane#web-link-pane{padding-left:10px; padding-right:10px;}
.crawler-info{    width: 100%;     margin-left: 0px;}
}

@media (max-width:599px) {
.add-more-box .multi-crawled-url.accordion-weburl  .uploaded-links{height: auto;}
	.add-more-box   .uploaded-links {
    display: block !important;
    text-align: center;
}
		.add-more-box   .uploaded-links .counterpages, .add-more-box .uploaded-links figure, .add-more-box   .uploaded-links .btn, .add-more-box .uploaded-links .remove-links {display:inline-flex !important; vertical-align:middle; align-items: center; margin-bottom:10px;}
		
		.add-more-box .uploaded-links p{padding-bottom:10px; border-bottom:1px solid #ddd; margin-bottom:15px !important;}
	.multi-crawled-url.accordion-weburl .accordion .accordion-item .accordion-button{margin-top:0px;}
	.add-more-box   .uploaded-links figure{margin-top:0px;}
}

/****    06-05-2024 *****/
/*@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');*/
body.tayaritheme{ /*font-family: "Inter", sans-serif;*/ background-color: transparent !important;}
aside.left-sidebar{    background: linear-gradient(to right, #0c2d32e5 0%, #031725 100%);     border: none;}
.brand-logo img {filter: brightness(0) invert(1);}
aside.left-sidebar .brand-logo{    padding: 0px 26px; border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  justify-content: flex-start !important; min-height: 60px;}
  aside.left-sidebar .simplebar-content { padding:0px  !important;display: flex;flex-direction: column;justify-content: space-between;height: 100%;}
aside.left-sidebar .simplebar-content ul{   padding: 0px 10px ; margin-top: 20px;}
aside.left-sidebar .simplebar-content ul#sidebarnav{    flex-grow: 1; padding-left: 0px;
  padding-right: 0px;}
  aside.left-sidebar .simplebar-content ul.domain-sidebarnav {margin-top: 0; }
aside.left-sidebar .sidebar-nav ul .sidebar-item>.sidebar-link.active { background-color: rgb(255 255 255 / 10%) !important;}
aside.left-sidebar .sidebar-nav ul .sidebar-item>.sidebar-link.active:hover {background-color: rgb(255 255 255 / 4%) !important;color: #fff!important;}
aside.left-sidebar.scroll-sidebar{    border-radius: 0px;}
aside.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link{padding: 10px 20px;     margin: 0px 0px 4px;     color: rgb(255 255 255 / 67%);}
aside.left-sidebar .sidebar-nav ul .sidebar-item .sidebar-link:hover { background-color: rgb(255 255 255 / 4%) !important;color: #fff!important;}

aside.left-sidebar .sidebar-nav ul .sidebar-item.selected>.sidebar-link, aside.left-sidebar .sidebar-nav ul .sidebar-item.selected>.sidebar-link.active, aside.left-sidebar .sidebar-nav ul .sidebar-item>.sidebar-link.active {background-color: rgb(255 255 255 / 10%) !important;}
aside.left-sidebar .simplebar-wrapper{margin:0px !important;}

.page-wrapper .body-wrapper .container-fluid{max-width: 100%;}
.tayaritheme header.app-header{/*border-bottom: 1px solid rgba(0, 0, 0, 0.1);*/ box-shadow: 0 0 17px 0 rgba(130,122,122,0.1);}
.tayaritheme .app-header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link{height: 32px; width: 32px; font-weight: 400;      font-size: 14px;     background-color: #33691e;
  border: none;}
.tayaritheme  aside.left-sidebar .simplebar-content .sidebarbottom ul{ margin-bottom: 10px; margin-top:10px;}
.plan-info-sidebar {padding: 0px 22px;}
.plan-info-sidebar .planBoxsiderbar{ margin-bottom:0px; flex-wrap: wrap;}
.plan-info-sidebar .planCard{width: 50%; padding: 0px 6px; color: #fff; font-size: 16px; font-weight: 600;}
.plan-info-sidebar .planCard strong{display: block; color: rgb(255 255 255 / 67%); font-weight: 400; font-size: 12px;}
.plan-info-sidebar .plan-btn{width: 100%; margin-top: 10px;}
.plan-info-sidebar .plan-btn a{ display: block; background: #fff !important; color: #3b37a3 !important;}
.plan-info-sidebar .plan-btn a:hover{border-color: #fff !important;}
.plan-info-sidebar .planGrid{padding: 16px; border-radius: 10px; background: linear-gradient(to right, #152436 0%, #204b52f5 100%);}
.plan-info-sidebar .planGrid h6{color: #fff; font-size: 12px; font-weight: 500; padding-left: 6px; flex-grow: 1;}
.plan-info-sidebar .planGrid h6{margin: 0;}
.plan-usage-display {display: flex; justify-content: space-between; margin: 10px 0;}
.plan-time-display {display: block; font-size: 15px; color: #fff;}


.tayaritheme .card  {border:1px solid #e5e7eb; box-shadow: none;}
.tayaritheme .card .card-body{padding: 16px !important;}
.tayaritheme .card-title {font-size: 16px; margin-bottom: 10px !important; color: #2a3547;}
.tayaritheme .table thead th{    border: none; vertical-align: middle;  padding: 16px 18px; color: #495057;background-color: #e9edf3; }
.tayaritheme .table thead th h6{color: #495057; margin: 0px !important;}
.tayaritheme .table>:not(caption)>*>*{    padding: 12px 18px;     box-shadow: none;}
.tayaritheme .table>thead {vertical-align: middle;border-color: transparent}
.tayaritheme .table tbody tr:first-child td{    border-top: 0px !important;}
.tayaritheme .table tbody tr td{color: #747a80; vertical-align: middle;}
.tayaritheme .table tbody tr td h6{color: #747a80; margin: 0px !important;}
.tayaritheme .table tbody tr:hover{background-color: #f8f9fa;}
.tayaritheme .table thead th:first-child {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
.tayaritheme .table thead th:last-child {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

.tayaritheme .table tbody tr td button.btn  {
  height: 35px;
  width: 35px;
  display: flex;
  background: rgba(0, 0, 0, 0.05) !important;
  border-radius: 5px !important;
  border:none !important;
  align-items: center;
  justify-content: center;
  font-size: 0;
  cursor: pointer;
  color: #a19f9f !important;
}

.tayaritheme .table tbody tr td .btn:hover{
  background-color: rgba(109, 97, 234, 0.18) !important;
  color: #6d61ea !important;
}
.dashboard-listing{margin-top:0px;}
.dashboard-listing li a{    border: 1px solid #e5e7eb; box-shadow: none; padding: 30px;   text-align: left; position: relative;}
.dashboard-listing li a span{font-size: 12px;     text-transform: uppercase;     display: block;
   font-weight: 600;}
.dashboard-listing li a p{margin-bottom: 0px;    color: #58677c;  padding-bottom: 10px;     }
.dashboard-listing li a:hover{box-shadow: 0 2px 20px 0 rgba(0,0,0,0.1);
  transition: all 0.2s ease-in-out;}
.iconcircle{height: 48px; width: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: rgba(109,97,234,0.18); color: #6d61ea; position: absolute; top:20px; right: 20px; padding: 12px;}

.botsection{margin-bottom: 30px;}

.botsection .tophead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 7px;
}
.botsection .tophead  .card-title{    color: #2a3547; margin: 0 !important;}

.botCard a.card{display: block; padding: 16px; color: #2a3547; text-decoration: none; height: 100%; margin-bottom: 0;}

.botCard a.card:hover{ background-color:#fff; box-shadow: 0 2px 20px 0 rgba(0,0,0,0.1);
  transition: all 0.2s ease-in-out;}
.botlisting{display: flex; flex-wrap: wrap; margin: 0 -6px;}
.botlisting .botCard{width: 25%; padding: 0px 6px; position: relative;}
.botlisting .botCard strong{display: block; padding-bottom: 10px;}
.botBottom{display: flex; align-items: center; justify-content: space-between;}
.botBottom .chat-info{flex-grow: 1; padding-right: 8px; margin: 0px;}
.botBottom .chat-info p{margin: 0; font-size: 12px; color: #495057; font-weight: 600;}
.bot-image{border:1px solid #e5e7eb; width: 40px; margin-bottom: 10px; padding: 6px; border-radius: 2px; position: relative;}
.bot-image:before{position: absolute; left: -18px; top:0px; height: 100%; width: 4px; border-radius: 5px; background-color: #3b37a3; content: '';}
.bot-image img{max-width: 100%;}
.lastupdate-time p{font-size: 12px; font-weight: 500; color: #878787;}

span.editBot {
  display: inline-flex;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  background-color: rgba(63, 53, 162, 0.1);
  color: #3b37a3;
  border-radius: 5px;
}

.link_disabled{
  pointer-events: none;
  cursor: default;
  opacity: 0.6;
}

.botplan-info{ background-color: rgba(63, 53, 162, 0.1);   font-size: 12px;
  font-weight: 700; display: flex; gap: 6px;   color: #3b37a3; margin-top:10px;
  padding: 6px 10px;  border-radius: 5px;}  
  .botplan-info p{margin: 0;   color: #3b37a3;}


  .planUpgrade-section{margin-bottom: 30px; padding: 22px; border-radius: 10px; display: flex; align-items: center; color: #495057; justify-content: space-between;
    background-image: radial-gradient(circle at 64% 7%, rgba(55, 55, 55,0.06) 0%, rgba(55, 55, 55,0.06) 50%,rgba(228, 228, 228,0.06) 50%, rgba(228, 228, 228,0.06) 100%),radial-gradient(circle at 71% 6%, rgba(182, 182, 182,0.06) 0%, rgba(182, 182, 182,0.06) 50%,rgba(86, 86, 86,0.06) 50%, rgba(86, 86, 86,0.06) 100%),radial-gradient(circle at 94% 76%, rgba(158, 158, 158,0.06) 0%, rgba(158, 158, 158,0.06) 50%,rgba(76, 76, 76,0.06) 50%, rgba(76, 76, 76,0.06) 100%),linear-gradient(90deg, rgb(250, 250, 250),rgb(220, 220, 220));
    }
    .contentPlan{display: flex; gap: 8px; align-items: center;}
    .contentPlan strong{font-size: 16px;}
    .contentPlan p{margin: 0px; font-size: 12px;}

    .documentfile-list {display: flex; flex-wrap:wrap ; margin-top: 12px; margin-bottom: 0;}
    .documentfile-list li{width: 50%; padding: 0px 6px;  border-right:1px solid #e5e7eb; border-bottom: 1px solid #e5e7eb;}
    .documentfile-list li .doc-card{   padding: 16px; border-radius: 7px; text-align: center;}
    .documentfile-list li .doc-card img{max-width: 100%;}
    .documentfile-list li:nth-child(even){border-right:none}
    .documentfile-list li:nth-last-child(2){border-bottom: 0;}
    .documentfile-list li:last-child{border: none;}
    .documentfile-list li .doc-card figure {
      max-width: 45px;
      margin: 0 auto 7px;
  }

  .documentfile-list li .doc-card p {
    font-size: 20px;
    margin-bottom: 0;
    line-height: 25px;
    font-weight: 700;
    color: #2A3547;
}

  .card-docBox{padding: 16px;}
.profile-name{padding: 10px 20px 0px; color: #2a3547;}
.message-body a{ color: #2a3547;}
.logout-link{border-top:1px solid #e5e7eb !important; border-radius: 0px !important;}

.dropdown-menu.dropdown-menu-end.dropdown-menu-animate-up {
  margin-top: 10px;
}
.dropdown-menu.dropdown-menu-animate-up.show{  -webkit-animation-name:DropDownSlide;
  animation-name:DropDownSlide;
  -webkit-animation-duration:.3s;
  animation-duration:.3s;
  -webkit-animation-fill-mode:both;
  animation-fill-mode:both;}

  @-webkit-keyframes DropDownSlide {
    100% {
      -webkit-transform:translateY(0);
      transform:translateY(0)
    }
    0% {
      -webkit-transform:translateY(10px);
      transform:translateY(10px)
    }
  }
  @keyframes DropDownSlide {
    100% {
      -webkit-transform:translateY(0);
      transform:translateY(0)
    }
    0% {
      -webkit-transform:translateY(10px);
      transform:translateY(10px)
    }
  }


  .actionDropdown button.dropdown-toggle.btn:after {
    display: none;
}
.botlisting .actionDropdown {
  position: absolute;
  top: 15px;
  right: 20px;
}

.actionDropdown button.dropdown-toggle.btn {
  background-color: transparent !important;
  padding: 0px;
  color: #8f9091 !important;
  height: 32px;
  width: 32px;
  border: 1px solid rgba(63, 53, 162, 0.1) !important;
}

.actionDropdown .dropdown-menu {
  left: auto !important;
  right: 0px !important;
  top: 26px !important;
}
.actionDropdown .dropdown-menu  a{color: #16181b;     padding: 8px 14px; display: block;}
.actionDropdown .dropdown-menu ul{margin: 0;}
.actionDropdown .dropdown-menu ul li{display: block;}
.actionDropdown .dropdown-menu ul li a i{color: #3b37a3; margin-right: 6px; font-size: 16px;     line-height: 15px;}
.actionDropdown .dropdown-menu ul li.actionbot-items{border-top: 1px solid #e5e7eb;}
.actionDropdown .dropdown-menu a span {
  display: flex;
  align-items: center;
}

.actionDropdown .dropdown-menu ul li a i.ti-trash {
  color: red;
}
.createBot{text-align: left;}

.addicon{    height: 40px;
  width: 40px;
  margin-bottom: 12px;
  border-radius: 50%;
  display: flex;
  font-size: 20px;
  align-items: center;
  justify-content: center;
  background-color: rgba(109, 97, 234, 0.10);
  color: #6d61ea;
  padding: 8px;}
  .botlisting .botCard .createBot strong{padding-bottom: 3px;}
  .createBot .lastupdate-time p{margin-bottom: 5px;}

  small.dateExp {
    font-size: 10px;
    display: block;
   /* padding-top: 5px;
    padding-left: 6px;*/

    text-align: center;
    font-weight: 600;
    color: rgb(247 247 247 / 57%);

}
.topgridPlan{display: flex; align-items: center; justify-content: space-between; padding-bottom: 8px;  margin-bottom: 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }


.modal-backdrop{background-color: #484766 !important;}
.modal .modal-dialog{max-width: 600px;}
.modal-dialog .modal-title{font-size: 20px;
  font-weight: 700;     text-transform: capitalize;}

  .modal-dialog  .modal-header {
    border-bottom: 1px solid #e5e7eb;
    padding: 20px;
}

.modal-dialog  .modal-body{padding: 25px;}
.login-inner-box .domain-name label.form-label {
  margin: 0px;
  font-size: 14px;
}

.login-inner-box .form-control {
  height: 54px;
}

.theme-box .nav-tabs .nav-item {
  margin-bottom: 0;
}
.theme-box .tab-content .tab-pane.show {
  padding: 0px;
  border: none;
  box-shadow: none;
}

.theme-box .nav-tabs { background-color: #f3f4f6; padding: 6px; border-radius: 5px;}
.theme-box .nav-tabs .nav-link {
  background-color: transparent;
  border: transparent;
  color: #6b7280;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 5px;
  margin-right: 0;
}

.theme-box .nav-tabs .nav-item{margin-right: 10px;}
.theme-box .nav-tabs .nav-item:last-child{margin-right: 0;}
.theme-box .nav-tabs .nav-link.active {
  background-color: #fff;
  padding: 10px 20px;
  border: none;
  font-weight: 700;
  margin-bottom: 0px;
}

.theme-box .nav-tabs .nav-link:hover{    border: none;}
.theme-box {
  margin-top:0px;
  background-color: #f9fafb;
  padding: 20px 20px;
  border-radius: 5px;
}
.upload-box-start .upload-box{    border: 1px dashed #b1aeff; background-color: #fff; padding: 20px 16px;}
.upload-box p{font-weight: 700; font-size: 16px;}
.upload-icon{    height: 48px;
  width: 48px;
  padding: 8px;
  margin: 0px auto 16px; 
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(109, 97, 234, 0.18);
  color: #6d61ea;}

  .upload-tool .upload-box img {
    width: auto;
    margin-bottom: 10px;
    max-width: 40px;
    filter: grayscale(1);
}

.upload-box-start.uploadDocFile {
  max-width: 400px;
  margin: auto;
}
.upload-box-start.uploadDocFile .upload-box{border: 1px dashed #ddd; background-color: #f3f4f6;}
.upload-box-start.uploadDocFile .upload-box p{font-weight: 500;
  font-size: 12px;}

  .upload-tool .upload-box span.btn {
    margin-top: 10px;
    display: block;
    min-width: 240px;
    padding: 9px 20px;
}

.upload-tool .upload-box span{margin-top: 0;}

.upload-tool.dropzone.dz-started {
  border: 1px dashed #b1aeff !important;
  background: #fff !important;}

  .upload-tool.dropzone .dz-preview.dz-file-preview .dz-image {
    border-radius: 10px;
    background: rgba(109, 97, 234, 0.06);
    border: 1px solid rgba(109, 97, 234, 0.1);
}
.upload-tool.dropzone .dz-preview .dz-remove{    font-size: 12px;     font-weight: 500;}

.rightbar-info{display: flex; align-items: center;}
.progressbar-line{margin-right: 16px;}

.infoicon-link{color: #2c3e50;}
.infoicon-link:hover{color: #3b37a3;}

.contentBoxLong .headingFile{    background-color: rgba(63, 53, 162, 0.1);
  font-size: 12px;
  border-radius: 6px;
  font-weight: 700;
  display: flex;
  color: #3b37a3;
  padding: 6px 15px;}

  .contentText{padding: 5px 10px;}
  .contentText p{color: #000; position: relative;}
  .contentText  .form-check-input{margin:0px; left: 0px;}
  .contentBoxLong   .contentText  .check-text {
    padding-left: 26px;
}
.showagainView {
  padding-left: 30px;
}
.contentBtn button#save-contentBox {
  min-width: 160px;
  padding: 14px 14px;
}

.attched-link {
  max-width: 100%;
  border: transparent;
  padding: 20px;
  margin: 0 auto;
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);
}



.on_click_submit span.error {
   min-height: auto;
}

input.form-control, textarea.form-control {
  height: 50px;
  font-family: 'Poppins', sans-serif;
  transition: all 0.3s ease-in-out !important;
}



.profileCardBox textarea.form-control{height: 110px ;resize: none;}

.contentBoxLong   .contentText .prohibited-icon{margin-right: 10px;}
form.on_click_submit .form-label {
  font-size: 14px;
}
.profileCardBox .on_click_submit label{font-size: 14px;}
.profileCardBox .switch-box label{font-size: 14px;}
.bot-setting-section{background-color: #f9f9fb;}
.profileCardBox form {
  max-width: 1200px;
  margin: auto;
  background-color: #fff;
  padding: 30px;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
}


.bot-setting-section #pImage{    border: 4px solid #e3e3e3;     box-shadow: none;}
.add-image .changePhoto{    padding: 10px 19px;}
.switch{width: 50px;}
.switch .slider:before {
  left: 1px;
  background-color: #acacac;
  bottom: 1px;
  height: 24px;
  width: 24px;
}
.switch .slider{background-color: #fff;
  border: 1px solid #acacac;}
  .switch input:checked+.slider{border: 1px solid #605cd3;}
  .switch input:checked+.slider:before{background-color: #fff;}
.switch input:checked+.slider:before{    -webkit-transform: translateX(21px);
  -ms-transform: translateX(21px);
  transform: translateX(21px);  }
  .switch input:checked+.slider {
    background-color: #605cd3;
}
  .profileCardBox .btn.btn-primary{    padding: 12px 20px;
    min-width: 200px;}

    .bot-setting-section  .profileCardBox  .select2-selection{height: 50px !important;}
    .profileCardBox .select2-container--default .select2-selection--single .select2-selection__rendered{line-height: 50px; padding-left: 20px;}
    .profileCardBox .select2-container--default .select2-selection--single .select2-selection__arrow  b{display: none;}
    .profileCardBox .select2-container--default .select2-selection--single .select2-selection__arrow {
      height: 50px;
      top: 0px;
      right: 0px;
      width: 30px;
      background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
      background-repeat: no-repeat;
      background-position: right .75rem center;
      background-size: 15px;
      opacity: 0.6;
  }
  .tayaritheme .select2-dropdown{    border: 1px solid #dfe5ef;     padding: 10px; z-index: 9; box-shadow: 0 0 17px 0 rgba(130,122,122,0.1)}
  .tayaritheme .select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #dfe5ef;
    height: 40px;
    border-radius: 5px;
    margin-bottom: 6px;
}


li.sidebar-item.data-source-create.domain_namesidebar {
  display: flex;
  align-items: center;
  width: 100%;
}
.data-source-create .sidebar_domain_name {
  font-size: 14px;
  font-weight: 500;
  padding-left: 5px;
  display: block;
  position: relative;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-right: 28px;
  flex: auto;
  max-width: 210px;
}
.data-source-create .sidebar_domain_name  i {
  font-size: 21px;
  line-height: 21px;
  position: relative;
  top: 2px;
  margin-right: 10px;
}

li.sidebar-item.data-source-create.domain_namesidebar:after {
  position: absolute;
  top: 3px;
  right: 20px;
  content: '';
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  width: 13px;
  height: 13px;
  background-size: 13px;
  /* transform: rotate(-90deg); */
  margin: auto;
  bottom: 0px;
  filter: brightness(0.5) invert(1);
}

li.sidebar-item.data-source-create.domain_namesidebar {
  display: flex;
  border-radius: 0px;
  align-items: center;
  width: 100%;
  padding: 16px 10px 24px;
  position: relative;
  margin-bottom: 0px;
 
  background: linear-gradient(to bottom,  #0e0e0e 26%,#58677c 100%);
}

li.sidebar-item {
  padding-left: 12px;
  padding-right: 12px;
}
.form-group.add-image{margin-bottom: 30px;}

.tayaritheme .left-sidebar .scroll-sidebar{border-radius: 0px;}

.tayaritheme .navbar-nav .dropdown-menu .dropdown-item{border-radius: 0px;}
.app-header ul.navbar-nav li a#preview_chatbot{background-color: #3b37a3  !important; color: #fff !important;}
.profile-head{  max-width: 1200px;
  margin: 0px auto 0px;}


.profileDetailBox.card-body {
  background-color: #fff;
  padding: 30px;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
}
.profile-head .card-body p{    height: 50px;
  display: flex;
  align-items: center;}

  .profile-head .card-body p.update-btn a {
    position: absolute;
    right: 3px;
    top: 4px;
    padding:11px 15px;
    font-size: 12px;
    background-color: rgba(63, 53, 162, 0.1) !important;
    color: #3b37a3 !important;
    font-weight: 500;
    border:none !important;
    border-radius: 5px;
}
header.app-header .navbar{min-height: 60px;}

.bg-fluidColor{min-height: 100vh; background-color: #f9f9fb;}
#update_password .password-input .visibility-icon{    top: 14px;}


.btnGroupsBox .btn {
  padding: 10px 20px;
  min-width: 150px;  
}
.btnGroupsBox .btn#change_password_btn:hover{    border-color: 1px solid #3b37a3 !important;}
.gatForm{display: flex; align-items: center; gap: 20px;}
.attched-webLink .attched-link-field {
  max-width: 200px;
  padding: 10px 20px;
}

.uploadfile-card {
  margin: 20px -20px -30px;
  border-top: 30px solid #fff;
}

.tayaritheme .uploadfile-card .card-title{    background-color: #fff;
  margin: 0px !important;
  padding-bottom: 14px;}

.theme-box .theme-head h2{background-color: tr;}

.zooqq-chat-screen.zooqq-custom-theme{position: relative; overflow: hidden;}
.zooqq-chat-screen.zooqq-custom-theme:after {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  content: '';
  width: 100%;
  background-color: #3b37a3;
  transition: all 0.3s ease-in-out;
  visibility: hidden;
  opacity: 0;
  border-radius: 10px;
}
.themeChatBot:hover .zooqq-chat-screen.zooqq-custom-theme:after{opacity: 0.8; visibility: visible;}
.theme-selector .themeChatBot .form-check{position: absolute; bottom:0px; left: 0px; top: 0px; right: 0px; margin: auto; width: 160px;   transition: all 0.3s ease-in-out; visibility: hidden; opacity: 0;     display: flex;
  align-items: center;}
.theme-selector .themeChatBot:hover  .form-check{opacity: 1; visibility: visible; z-index: 9;}
.theme-selector .themeChatBot  .form-check label {
  background: #fff !important;
  color: #3b37a3 !important;
}
.theme-selector .themeChatBot .form-check label svg{margin-right: -28px; opacity: 0; visibility: hidden;  transition: all 0.3s ease-in-out; }
.theme-selector .themeChatBot input.form-check-input:checked + .zooqq-chat-screen  .form-check label svg{margin-right: 6px; opacity: 1; visibility: visible;}
.theme-selector .themeChatBot input.form-check-input:checked +  .zooqq-chat-screen  .form-check{opacity: 1; visibility: visible; z-index: 9;}
.theme-selector .themeChatBot input.form-check-input:checked ~ .zooqq-chat-screen.zooqq-custom-theme:after{opacity: 0.8; visibility: visible;}
.theme-selector .themeChatBot input.form-check-input{opacity: 0; position: absolute; left: 0px; visibility: hidden;}

.custom-theme-selector{margin-top: 20px;}

.saving-btn {
  position: fixed;
  padding: 10px 10px;
  right: 0px;
  width: calc(100% - 270px);
  bottom: 0px;
  background-color: #fff;
  box-shadow: 0 0 50px 0 rgba(0,0,0,.07);
  z-index: 10;
  border-top: 1px solid #ebebeb;
}
.saving-btn .btn{min-width: 200px; padding: 12px 20px;}

.custom-theme-selector.theme-selector .themeChatBot .form-check{padding: 0px 30px; width: 100%; gap: 16px;     max-width: 400px;}
#chat_bot_customized_form .saving-btn{gap: 16px;}
.theme-box .theme-head h2{background-color: #f9fafb;     font-size: 16px;}
.theme-box .theme-head .theme-head::before{background-color: #ededed;     top: 11px;}



.uploadfile-card .table tbody tr td:first-child{font-weight: 500; color: #2A3547;}
.uploadfile-card .table tbody tr td p{    color: #747a80 !important;}
.tayaritheme .uploadfile-card .table tbody tr td .actionDropdown .btn {
  color: #6d61ea !important;
  border: none !important;
  border-radius: 5px !important;
}

.tayaritheme .uploadfile-card .table tbody tr td .actionDropdown .btn:hover{    background-color: rgba(109, 97, 234, 0.18) !important;}

.tayaritheme .uploadfile-card .table tbody tr td .dropdown.actionDropdown.show {
  display: inline-flex;
}

.tayaritheme .uploadfile-card .table tbody tr td .actionDropdown ul li a{cursor: pointer;}
.tayaritheme .uploadfile-card .table tbody tr td .actionDropdown ul li a:hover{background-color: #f6f9fc; color: #2A3547;}

.tayaritheme div.dataTables_wrapper div.dataTables_paginate ul.pagination{    border: 1px solid #dee2e6;
  display: inline-flex;}
  .tayaritheme div.dataTables_wrapper div.dataTables_paginate ul.pagination > li > a{margin: 0; color: #747a80 ; font-weight: 400;     background-color: transparent;}
  .tayaritheme div.dataTables_wrapper div.dataTables_paginate ul.pagination > li.active a {color: #6d61ea;    background-color: rgba(109, 97, 234, 0.18);}


  .tayaritheme .installation-int table tbody tr td h6{font-weight: 500; color: #2A3547;}
  .tayaritheme .installation-int .api-tophead .card-title{margin-bottom: 0 !important;}
  .tayaritheme .installation-int .api-tophead .addApiBtn .btn{min-width: 120px;     padding: 8px 16px;}
  .tayaritheme .installation-int .api-tophead{margin-bottom: 16px ;}

  .generatebtn.btn.btn-secondary{    min-width: 160px;
    padding: 14px 14px;}

    .key_class #mySpan{border-radius: 6px; white-space: pre-wrap; padding: 8px 16px; height: 50px;  overflow-wrap: break-word;   border: 1px solid #dfe5ef;     border-radius: 7px;}

    .key_class button#copyBtn {
      position: absolute;
      top: 10px;
      right: 18px;
      padding: 0px;
      font-size: 20px;
      background: rgba(109, 97, 234, 0.18) !important;
      border: none !important;
      color: #6d61ea !important;
      height: 30px;
      width: 30px;
      display: flex;
      align-items: center;
      justify-content: center;
  }


  .installation-int  .install-apiCard input{background-color: #f3f4f6; padding: 20px;  padding-right: 70px; height: 50px; border: 1px solid #e5e7eb; border-radius: 5px; text-overflow:ellipsis;}
  .installation-int  .install-apiCard{position: relative;}
  .installation-int .install-apiCard .fa-copy {
    font-size: 17px;
    cursor: pointer;
    height: 35px;
    width: 35px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(109, 97, 234, 0.18);
    color: #6d61ea;
    position: absolute;
    top: 7px;
    right: 16px;
}
.tayaritheme .integrations-page .card:hover{    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.1);
  transition: all 0.2s ease-in-out;}

  ul.actionIcons {
    margin: 0px;
    display: flex;
    align-items: center;
}

ul.actionIcons li a {
    height: 35px;
    width: 35px;
    display: flex;
    background-color: rgba(0, 0, 0, 0.05) !important;
    border-radius: 5px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #a19f9f !important;
}
ul.actionIcons li {
    margin-right: 12px;
}
ul.actionIcons li a  i{    font-size: 18px;}


.btnIicon:hover{ background-color: rgba(109, 97, 234, 0.18) !important;
  color: #6d61ea !important;}
.deleteIcon:hover{background-color: rgba(206, 13, 6, 0.18) !important;
  color: #f10b0b !important;}  

  .bot-icon-selector {margin-bottom: 30px; margin-top: 20px;}
  .bot-icon-selector .bot-iconList{display: flex; align-items: center; flex-wrap: wrap;}
  .bot-icon-selector .bot-iconList .botCardBox{margin-right: 20px;}
  .bot-icon-selector .bot-iconList .botCardBox:last-child{margin-right: 0;}
  .bot-icon-selector h3{font-size: 14px;}

  .bot-icon-selector .bot-iconList label img{max-width: 100%; border-radius: 3px;}
  .bot-icon-selector .bot-iconList label {
    background-color: #fff !important;
    border-color: #e5e7eb !important;
    padding: 8px !important;
    border-radius: 5px;
    height: 46px;
    width: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
}

.bot-icon-selector .bot-iconList label:hover{ background-color: rgba(109, 97, 234, 0.18) !important;    border-color: #6d61ea !important;}

  .bot-icon-selector input:checked+label {
    background-color: #fff !important;
    border-color: #6d61ea !important;
    padding: 4px !important;
}

.colorplateCard{display: flex; flex-wrap: wrap; align-items: center;}
.colorplateCard .color-input.form-control {
  height: 46px !important;
  border-radius: 5px !important;
  padding: 4px !important;
  width: 46px !important;
}
.colorplateCard .color-input.form-control[type="color" i]::-webkit-color-swatch {
  border: none;
  border-radius: 4px;
}
.colorplateCard .colorplateBox{margin-right: 30px;     display: flex;
  align-items: center;
  gap: 10px;}
.colorplateCard .colorplateBox:last-child{margin-right: 0;}
.colorplateCard{margin-bottom: 22px;}
.inputplateCard{max-width: 600px;}
.inputplateCard .d-flex{position: relative;}
.colorplateCard .colorplateBox label {
  display: block;
  margin: 0px;
  max-width: 100px;
  line-height: 19px;
  font-weight: 500;
}

.textPx{
  font-size: 12px;
  cursor: pointer;
  height: 35px;
  width: 35px;
  border-radius: 5px;
  display: flex;
  font-weight: 600;
  align-items: center;
  justify-content: center;
  background-color: rgba(109, 97, 234, 0.18);
  color: #6d61ea;
  position: absolute;
  top: 7px;
  right: 10px;
  text-transform: uppercase;
}
.form-select.form-control{    height: 50px;
  font-family: 'Poppins', sans-serif;
  transition: all 0.3s ease-in-out !important;}

.documentation-main .documentation-link-wrap{margin-top: 0;}
.tayaritheme ul.documentation-link-wrap  li a{padding-left: 22px; background-color: #fff; padding-right: 50px; position: relative;}
.tayaritheme ul.documentation-link-wrap  li a:after {
  position: absolute;
  top: 3px;
  right: 20px;
  content: '';
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  background-size: 16px;
transform: rotate(-90deg);
  margin: auto;
  bottom: 0px;

}


.tayaritheme ul.documentation-link-wrap  li a h3{margin: 0px 0px 5px !important; padding: 0px; display: block;}
.tayaritheme ul.documentation-link-wrap  li a  p{margin: 0px; color: #5a6a85;}

ul.refineActionIcons.actionIcons li{margin-right: 0;}
ul.refineActionIcons.actionIcons li a{margin-right: 12px;}
ul.refineActionIcons.actionIcons li:last-child a{margin-right: 0;}
.btnIicon.btn-success {
  background-color: #d1e7dd !important;
  color: #0f5132 !important;
}

.instruction-list{margin: 0px 0px 20px; padding: 0px; list-style: none;}
.instruction-list li{color: #000; margin-bottom: 8px; padding-left: 22px; position: relative;}
.instruction-list li:before{position: absolute; top:0px; left: 0px; content: '\ea5e'; font-family: "tabler-icons" !important;}
.example p{color: #000;}
.domain-name textarea.form-control{height: 110px;}
.modal .modal-dialog.Regenerate-modal-dialog{max-width: 1000px;}

.btnGroupBox .btn{min-width: 160px;}
.Regenerate-modal-dialog .context_text  p{margin: 0px;}
.Regenerate-modal-dialog .context_text {
  margin: 0px 0px 30px;
  box-shadow: none;
  color: #000;
  line-height: 24px;
  padding: 20px;
  border: 1px solid #ddd;
}


.infoTooltip i{column-rule: #747a80; font-size: 16px;}
small.infoTooltip {
  vertical-align: bottom;
}

.enableLaunch{display: flex; margin-top: 6px; align-items: center; gap: 10px;flex-wrap: wrap;}
.bot-setting-section .enableLaunch label{margin: 0;}
.bot-setting-section .enableLaunch .animation_time{display: flex; align-items: center;}
.bot-setting-section .enableLaunch .launch-time {
  margin-left: 0px;
  max-width: 100%;
  max-height: inherit;
  height: 30px;
  width: 50px;
  padding: 5px 6px;
  text-align: center;
}
.enableLaunch .switch{height: 28px;}

.tayaritheme .integrations-page .card-body h3{font-size: 16px;}

/***** checkboxes *****/
.checkboxes span{margin-right: 22px;}
.checkboxes span:last-child{margin-right: 0;}
.checkboxes input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}

.checkboxes label {
  position: relative;
  cursor: pointer;
  color: #2A3547;
  font-weight: 500;
}

.checkboxes label:before {
  content: "";
  -webkit-appearance: none;
  background-color: transparent;
  border: 2px solid #b6b6b6;
    height: 20px;
    width: 20px;
    border-radius: 2px;
  display: inline-block;
  position: relative;
  vertical-align: top;
  cursor: pointer;
  margin-right: 5px;
  transition: all 0.3s ease-in-out;
}
.checkboxes input:checked + label:before{ border: 2px solid #605cd3;}
.checkboxes input:checked + label:after {
  content: "";
  display: block;
  position: absolute;
  top: 4px;
  left: 8px;
  width: 5px;
  height: 10px;
  border: solid #605cd3;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  transition: all 0.3s ease-in-out;
}

header.app-header ul.navbar-nav li a {
  padding: 8px 16px;
  border-radius: 5px;
  font-size: 14px;
}

/***** checkboxes *****/




/****** domain hide ******/
.domain-select {
  display: none;
}
/****** domain hide ******/


.sidebar_domain_name{
  font-size: larger;
  font-weight: bolder;
  color: white;
}


/**** chatbar ***/

.chatBarTop.theme-box {
  background-color: transparent;
  padding: 0px;
  margin: 0px;
}

.chatBarTop.theme-box .nav-tabs{background-color: #fff; border-bottom: 1px solid #f3f3f3;}
.chatBox-container{display: flex; flex-wrap: wrap;     height: calc(100vh - 110px);}
.chatBox-container .leftChatBox{width: 25%; background-color: #fff; height: 100%; border: 1px solid #f3f3f3; position: relative; padding-top: 56px;}
.chatBox-container .ChatHistory{width: 75%; height: 100%; padding:0px 0px 0px 16px ;}

.chatBarTop.theme-box .nav-tabs .nav-link.active{background-color: rgba(109, 97, 234, 0.1);}


.searchBox{padding: 8px 12px; background-color: #f3f3f3; display: flex; align-items: center; justify-content: space-between; gap: 12px;     position: absolute;
  top: 0px;
  left: 0px;
  z-index: 2;
  width: 100%; }
.searchBox form{flex-grow: 1;}
.searchBox .form-group{margin: 0  ; position: relative;}
.searchBox .form-group input{padding-left: 38px !important; background-color: #fff; height: 40px;     text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;}
.searchBox .form-group:before{position: absolute; top:0px; bottom: 0px; margin: auto; font-size: 20px; left: 12px; content: '\eb1c'; font-family: "tabler-icons" !important; display: flex; align-items: center; opacity: 0.4; }

.chatlistingPanel{margin: 0px; padding: 0; height:100%;}
.chatlistingPanel li{display: block; padding: 0px; display: block;  margin-bottom: 0px; position: relative;}
.chatlistingPanel li a{display: block; color: #5a6a85;   transition: all 0.3s ease-in-out;  border-bottom: 1px solid #f3f3f3; padding: 16px 20px;}
.chatlistingPanel li a:after{position: absolute; top:0px; left: 0px; height: 100%; width: 2px; content: ''; background-color: #223f44; opacity: 0; visibility: visible;}
.chatlistingPanel li a:hover{background-color: rgba(0, 0, 0, 0.03);}
.chatlistingPanel li.active a{background-color: rgba(109, 97, 234, 0.05);}
.chatlistingPanel li.active a:after{opacity: 1; visibility: visible; }
.chatlistingPanel li:last-child a{border: none;}
.chatlistingPanel li a h4{font-size: 15px; margin: 0px 0px 0px; padding: 0px; font-weight: 600; flex-grow: 1;     text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  max-width: 160px;}
.chatlistingPanel li a p{line-height: 20px; font-size: 14px; margin: 0px 0px 4px; display: block; overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;}
.topbarHead{display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 5px;}
.topbarHead span{display: block; font-size: 12px; font-weight: 500; color: #5a6a85;}
.chatlistingPanel li a span.alert {
  padding: 0px 6px;
  font-size: 10px;
  font-weight: 500;
  border-radius: 4px;
}

.ChatHistory{display: flex;}
.ChatHistory .chatRecordList{width: 100%; background-color: #fff; border-radius: 10px; }
.ChatHistory  .chatInfo-Panel{width: 30%;}
.charlistRecord {height: calc(100% - 60px);}
.charlistRecord .chat-item{display: flex; margin-bottom: 22px; padding-left: 44px; position: relative;}
.messageItemsCard .timestamp{justify-content: flex-start; padding-left:2px;}
.charlistRecord .chat-item figure{height: 36px; width: 36px; margin: 0;  overflow: hidden; border-radius: 50%; border: 1px solid #e5e7eb; position: absolute; top:0px; left: 0px;}
.charlistRecord .chat-item figure img{max-width: 100%;}
.charlistRecord{padding: 10px 26px 20px; margin-top: 8px;}
.charlistRecord .chat-item .bot-message{ border-radius: 5px;}
.charlistRecord .chat-item.botchat-items{padding-left: 0px; padding-right: 44px;}
.charlistRecord .chat-item.botchat-items figure{left: auto; right: 0px;}

.topRecordname{padding: 12px 16px; background-color: #fff; border-bottom: 1px solid #f3f3f3; display: flex; align-items: center; justify-content: space-between;}
.topRecordname .userinfo{flex-grow: 1;}
.topRecordname .userinfo span{font-size: 12px;}
.topRecordname h4{font-size: 16px; font-weight: 600; margin: 0px; }
.charlistRecord .chat-item.botchat-items{    flex-direction: row-reverse;}
.chatRecordList .dateStampTop {
  display: inline-block;
  max-width: 100%;
  margin: 0px 0px 0px;
  font-size: 13px;
  border-radius: 5px;

  color: #2a3547;
  font-weight: 600;
 
}
.charlistRecord .chat-item.botchat-items .bot-message{background-color: rgba(109, 97, 234, 0.1);}
.contactInfo {
  display: flex;
  gap: 3px;
  align-items: center;
}
.contactInfo i{font-size: 18px;}


.searchBox .actionDropdown .dropdown-menu a.activeClick{position: relative; border-radius: 0px;     border: none;
  font-weight: 500;     margin: 0px;}
.searchBox .actionDropdown .dropdown-menu a.activeClick:before {
  position: absolute;
  top: 5px;
  font-size: 18px;
  right: 15px;
  content: '\ea5e';
  font-family: "tabler-icons" !important;
}

.whiteboxed{background-color: #fff; padding: 20px; margin-bottom: 16px;}
.chatInfo-Panel{padding-left: 16px;}
.chatInfoCard .infoTitle{margin: 0px 0px 16px; padding: 0px 0px 12px; font-size: 16px; text-transform: capitalize; font-weight: 600; border-bottom: 1px solid #f3f3f3;}
.info-items strong{font-size: 13px; color: #2a3547;}
.info-items p{margin: 0px;}
.info-items p a{color: #4a6ccc;}
.info-items{margin-bottom: 12px;}
.info-items:last-child{margin-bottom: 0;}
.info-items-btns a.btn.btn-primary i{ font-size: 16px; margin-right: 4px;     line-height: 17px;}
.info-items-btns{display: flex; gap: 10px; align-items: center; border-top: 1px solid #f3f3f3; padding-top: 16px;}
.info-items-btns a.btn.btn-primary {display: flex; align-items: center;     background: rgba(63, 53, 162, 0.1) !important;border: none !important;
  color: #3b37a3 !important;     padding: 8px 6px;flex: auto; justify-content: center;}
.chataccordionInfo .accordion-button{color: #2a3547;}

.chataccordionInfo .accordion-button:not(.collapsed) {
  background-color: rgba(0, 0, 0, 0.05);
  color: #2a3547;
  font-weight: 500;
}
.chataccordionInfo .accordion-button:not(.collapsed):after{    filter: grayscale(1);}

.chatModeTitleEle span.alert {
  padding: 2px 10px;
  font-size: 12px;
  font-weight: 500;
  border-radius: 4px;
}
.chatModeTitleEle.actionDropdown .dropdown-menu a.activeClick{position: relative; border-radius: 0px;     border: none;
  font-weight: 500;     margin: 0px;}
  .chatModeTitleEle.actionDropdown .dropdown-menu a.activeClick:before {
  position: absolute;
  top: 5px;
  font-size: 18px;
  right: 15px;
  content: '\ea5e';
  font-family: "tabler-icons" !important;
}
.circle{position: relative; z-index: 1;}
.circle .icons{position: relative; z-index: 2; background-color: #fff;}

.circle::before {
  animation: mymove 2s infinite;
  position: absolute;
  background-color: #a098f6;
  z-index: -1;
  content: " ";
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin:auto;
  transition: all 0.5s;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}

@-webkit-keyframes mymove {
  50% {
    transform: scale(2);
    opacity: 0;
  }
  100% {
    transform: scale(2);
    opacity: 0;
  }
}
/*
.custom-previewBox .zooqq-botIcon-preview{    bottom: 0px;
  right: 0px;
  position: relative;
  display: flex;
  justify-content: flex-end;
}
  .custom-previewBox .zooqq-showBotSubject-preview.zooqq-botIcon-preview .zooqq-Layout-expand {
    display: block;
    bottom: 0px;
    right: 0px;
    position: relative;
}

.custom-previewBox  .zooqq-iconInner-preview {
  position: absolute;
  bottom: 0px;
  right: 0px;
}*/

.customBotTheme {height: calc(100vh - 265px); min-height: 760px;}
.chataccordionInfo .accordion-body{max-height: 230px; overflow-y: auto;}

.chatInfo-Panel{height: calc(100vh - 110px);}
.botCardlisting.botlisting .botCard{margin-bottom: 14px;}
.on_click_submit .domain-name small{line-height: 16px;}

.body_breadcrumb{position: absolute; top:70px; left: 0px; padding-left: 25px; }
.body_breadcrumb ol.breadcrumb{margin: 0px; padding: 0px;}
.body_breadcrumb ol.breadcrumb li  i {
display: none;
}
.body_breadcrumb ol.breadcrumb li:after {
  content: "/";
  position: absolute;
  margin: 0px;
  top: 2px;
  right: -9px;
  font-size: 12px;
}
.body_breadcrumb ol.breadcrumb li {
  position: relative;
  margin-right: 16px;
}
.body_breadcrumb ol.breadcrumb li:last-child:after{display: none;}
.body_breadcrumb ol.breadcrumb li:last-child {
  margin-right: 0px;
}

.addRefineData{display: flex; justify-content: flex-end;}
.addRefineData .btn.btn-primary{min-width: 120px;}

.view_subscription_details{text-align: center;}
.view_subscription_details .btn.btn-primary{min-width: 160px; padding: 10px 20px;}

.tayaritheme .domain-step-box .table tbody tr td button.btn{    font-size: 17px;
    cursor: pointer;
    height: 35px;
    width: 35px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(109, 97, 234, 0.18);
    color: #6d61ea;}

.documentation-main .domain-step-box h2{    font-size: 16px;}
.documentation-main .domain-step-box h3{    font-size: 16px;}

/**** subscription plan *****/
.planListing{display: flex; flex-wrap: wrap; margin: 0px auto; justify-content: center; max-width: 1000px; }
.planListing > div{width: 50%; padding: 0px 12px; margin-top: 12px;}
.PlanBox{
  background-color: #f2f2f2;
  padding: 30px;
  border-radius: 20px;
  height: 100%;
}

.even.PlanBox{background-color: #161718; position: relative; overflow: hidden;}
.even.PlanBox .iq-price-info h2.price{color: #fff;}
.even.PlanBox .iq-price-info h5.title{color: #fff;}
.even.PlanBox .iq-price-info .nav-pills{    background-color: rgba(255, 255, 255, 0.02);}
.even.PlanBox .iq-price-info .nav-pills li .nav-link{color: #fff;}
.even.PlanBox .iq-talkie-price-info li{color: #fff;}


.odd.PlanBox{    background: #3639a4; position: relative; overflow: hidden;}
.odd.PlanBox .iq-price-info h2.price{color: #fff;}
.odd.PlanBox .iq-price-info h5.title{color: #fff;}
.odd.PlanBox .iq-price-info .nav-pills{    background-color: rgba(255, 255, 255, 0.02);}
.odd.PlanBox .iq-price-info .nav-pills li .nav-link{color: #fff;}
.odd.PlanBox .iq-talkie-price-info li{color: #fff;}

.odd.PlanBox .iq-talkie-price-info, .even.PlanBox .iq-talkie-price-info{height: 400px; }
.odd.PlanBox .planchoose{position: absolute; bottom: 20px; left: 0px; text-align: center; z-index: 2; width: 100%;}
.odd.PlanBox .planchoose a.btn {
  background-color: #fff !important;
  color: #3b37a3 !important;
  border: none !important;
  border-radius: 30px;
  padding: 14px 20px;
  width: 200px;
  justify-content: center;
}
.even.PlanBox .planchoose{position: absolute; bottom: 20px; left: 0px; text-align: center; z-index: 2; width: 100%;}
.even.PlanBox .planchoose a.btn {
  background-color: #fff !important;
  color: #161718 !important;
  border: none !important;
  border-radius: 30px;
  padding: 14px 20px;
  width: 200px;
  justify-content: center;
}

.even.PlanBox:after {
  position: absolute;
  left: 0px;
  bottom: 0px;
  content: '';
  height: 70%;
  z-index: 1;
  width: 100%;
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(22,23,24,1) 100%);
}
.odd.PlanBox:after {
  position: absolute;
  left: 0px;
  bottom: 0px;
  content: '';
  height: 70%;
  z-index: 1;
  width: 100%;
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(54,57,164,1) 100%);
}

.iq-talkie-price-info{margin: 20px 0px 0px; padding: 0px;}
.iq-talkie-price-info li{list-style: none; display: block; padding-left: 35px; font-size: 16px; position: relative; margin-bottom: 22px;   color: #2a3547;}
.iq-talkie-price-info li:after {position: absolute; top:0px; left: 0px; content: ''; background-repeat: no-repeat;   background-image: url(../images/chatbot_images/checkmark.svg);
  width: 26px; background-size: 26px;
  height: 26px;}
 
.iq-price-info{text-align: left; padding: 20px 0px 20px;}
.iq-price-info h5.title {
  font-size: 40px;
  font-weight: 300;
  margin: 0px 0px 0px;
  padding: 0px;

}
.iq-price-info h2.price{
  font-size: 22px;
  font-weight: 700;
  margin: 0px 0px 5px;
  padding: 0px;
}
.planchoose  span {
  display: inline-flex;
  color: #161718;
  font-size: 16px;
  font-weight: 600;
  text-transform: capitalize;
  padding: 20px 48px;
  border-radius: 40px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  background-color: #fff;
  margin: 0px 0px 20px;
  margin-left: -31px;
  border-left: 0px;
  position: relative;
}
/*.planchoose  span:after{position: absolute; right: 16px; top:0px; bottom: 0px; margin: auto; height: 16px; width: 16px; border-radius: 50%; content: '';    background: #3639a4;transition: all .3s ease-in-out;}*/

.planchoose a{
  display: inline-flex;
  color: #161718;
  font-size: 16px;
  font-weight: 600;
  text-transform: capitalize;
  padding: 20px 48px;
  border-radius: 40px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  background-color: #fff;
 /* margin: 0px 0px 20px;
  margin-left: -31px;*/

  border-left: 0px;
  position: relative;
  transition: all .3s ease-in-out;
}
.planchoose a:hover{color: #3639a4;}

/*.planchoose a:after{position: absolute; right: 16px; top:0px; bottom: 0px; margin: auto; height: 16px; width: 16px; border-radius: 50%; content: '';  background: #3639a4; transition: all .3s ease-in-out;     -webkit-transform-origin: bottom center;
  transform-origin: bottom center;}
.planchoose a:hover:after{-webkit-transform: scale(1.2);
  transform: scale(1.2);}*/

.iq-price-info .nav-pills{    background-color: #f9f9fb;
  display: inline-flex;
  border-radius: 30px;}
  .iq-price-info .nav-pills li .nav-link{  color: #2a3547; font-weight: 600; font-size: 12px;  border-radius: 20px;}
  .iq-price-info .nav-pills li  .nav-link.active{background-color: rgba(109, 97, 234, 0.18); color: #3639a4;     border-radius: 20px;}

  .CurrentPlan-body{padding: 30px; background-color: #fff; border-radius: 12px;    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease-in-out; border: 1px solid #e5e7eb;}
    .CurrentPlanActive .iq-price-info{display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0px;}
    .CurrentPlanActive .iq-price-info .currentText{    font-size: 18px; color: #161718;
      font-weight: 700;
      margin: 0px 0px 8px;
      display: block;
      padding: 0px;}

      .CurrentPlanActive .iq-price-info h2.price {
        color: #8b8b8b;
        font-weight: 500;
        font-size: 18px;
    }
    .CurrentPlanActive .iq-price-info h5.title{margin-bottom: 8px; font-weight: 700;}
    .CurrentPlanActive .planchoose span {    border: 1px solid #e5e7eb;
      border-left: 0px;     background-color: #f9f9fb;     padding: 18px 48px;}

  .CurrentPlanActive{margin-bottom: 30px;}

  .CurrentPlanActive .left-price-info {
    width: 25%;
    
}

  .CurrentPlanActive  .iq-talkie-price-info{display: flex; flex-wrap: wrap;  margin: 0px;
    padding: 0px 0px 0px 12px;
    width: 75%;}

    .CurrentPlanActive  .iq-talkie-price-info li{width: 33.33%;}
    .CurrentPlanActive  .iq-talkie-price-info li:last-child{margin-right: 0px; margin-bottom: 0;}
  .CurrentPlanActive  .iq-talkie-price-info li{padding-right: 20px; margin-bottom: 12px; font-size: 15px;}
  .CurrentPlanActive  .iq-talkie-price-info li:nth-child(3n+3){padding-right: 0;}
  .CurrentPlanActive  .plan-expiryDate { font-weight: 500;   color: #161718;}

    .planActive span{margin: 0;     display: inline-flex;
      font-size: 12px;
      font-weight: 600;
      margin-bottom: 12px;
      padding: 8px 15px;
      background-color: rgba(63, 53, 162, 0.1);
      color: #3b37a3;
      border-radius: 5px;}

.headingPlanTitle h2{font-size: 18px; font-weight: 600;}
@media (min-width:768px) {
  header.app-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
  }
  
.breadcrumbHeader .breadcrumb{margin: 0;}
.breadcrumbHeader .breadcrumb li{display: none;}
.breadcrumbHeader .breadcrumb li.active{display: block;  font-size: 15px; font-weight: 600; color: #2a3547;}
.breadcrumbHeader .breadcrumb li.active i{display: none;}
.header.flex-wrap {
  display: none !important;
}


}

@media (min-width:992px) {
  .userLeftcollapse.collapse:not(.show) {
    display: block;
  }
  .collapse.chatInfo-Panel:not(.show) {
    display: block;
  }
  .topFilterInfo{display: none;}
  }



@media (min-width: 1600px) and (max-width: 1700px) { 
  .chatBox-container .leftChatBox{width: 23%;}
  .chatBox-container .ChatHistory{width: 77%;}
  .ChatHistory .chatRecordList{width: 68%;}
  .ChatHistory .chatInfo-Panel{width: 32%;}

}

@media (min-width: 1500px) and (max-width: 1599px) { 
  .chatBox-container .leftChatBox{width: 24%;}
  .chatBox-container .ChatHistory{width: 76%;}
  .ChatHistory .chatRecordList{width: 66%;}
  .ChatHistory .chatInfo-Panel{width: 34%;}


}

@media (min-width: 1400px) and (max-width: 1499px) { 

  .chatBox-container .leftChatBox{width: 25%;}
  .chatBox-container .ChatHistory{width: 75%; padding-left: 10px;}
  .ChatHistory .chatRecordList{width: 64%;}
  .ChatHistory .chatInfo-Panel{width: 36%; padding-left: 10px;}
  .chatlistingPanel li a h4{max-width: 140px;}
  .CurrentPlanActive .iq-price-info h5.title{font-size: 32px;}
  .CurrentPlanActive .iq-talkie-price-info li{font-size: 14px;}
}

@media (min-width: 1300px) and (max-width: 1399px) { 

  .chatBox-container .leftChatBox{width: 25%;}
  .chatBox-container .ChatHistory{width: 75%; padding-left: 10px;}
  .ChatHistory .chatRecordList{width: 62%;}
  .ChatHistory .chatInfo-Panel{width: 38%; padding-left: 10px;}
  .chatlistingPanel li a h4{max-width: 120px; font-size: 14px;}
  .info-items-btns a.btn.btn-primary{font-size: 12px;}
  .CurrentPlanActive .iq-price-info h5.title{font-size: 32px;}
  .CurrentPlanActive .iq-talkie-price-info li{font-size: 14px;}
}


@media (min-width: 1200px) and (max-width: 1300px) { 
  .botCard a.card{padding-left: 10px; padding-right: 10px;}
  .bot-image:before{left: -12px;}
  .inputplateCard {
    max-width: 440px;
}

.chatBox-container .leftChatBox{width: 26%;}
.chatBox-container .ChatHistory{width: 74%; padding-left: 10px;}
.ChatHistory .chatRecordList{width: 60%;}
.ChatHistory .chatInfo-Panel{width: 40%; padding-left: 10px;}
.chatlistingPanel li a h4{max-width: 100px; font-size: 14px;}
.info-items-btns a.btn.btn-primary{font-size: 12px;}
.chatlistingPanel li a p{font-size: 13px; line-height: 17px;}
.info-items-btns{gap: 5px;}

.CurrentPlanActive .iq-price-info h5.title{font-size: 28px;}
.CurrentPlanActive .iq-talkie-price-info li{font-size: 14px;}
.CurrentPlanActive .plan-expiryDate{display: block !important;}




 }

 @media (min-width: 768px) and (max-width: 991px) { 
 .gatForm{display: block;}
  .gatForm .checkboxes {margin-top: 12px;}
  .profileCardBox .switch-box .gatForm .checkboxes label{font-size: 13px;}
 }

 .custom-previewBox .zooqq-showBotSubject-preview.zooqq-botIcon-preview .zooqq-Layout-expand {
  max-height: calc(100% - 240px)!important;
}


@media (max-width:1199px){
  .saving-btn{    width: 100%;}

  .chatBox-container .leftChatBox{width: 26%;}
  .chatBox-container .ChatHistory{width: 74%; padding-left: 10px;}
  .ChatHistory .chatRecordList{width: 60%;}
  .ChatHistory .chatInfo-Panel{width: 40%; padding-left: 10px;}
  .chatlistingPanel li a h4{max-width: 100px; font-size: 14px;}
  .info-items-btns a.btn.btn-primary{font-size: 12px;}
  .chatlistingPanel li a p{font-size: 13px; line-height: 17px;}
  .info-items-btns{gap: 5px;}
  aside.left-sidebar .brand-logo{justify-content: space-between !important;}
  .planListing{max-width: 100%;}
  .CurrentPlanActive .iq-price-info h5.title{font-size: 28px;}


  .CurrentPlanActive .iq-price-info{display: block;}
  .CurrentPlanActive .left-price-info{width: 100%;}
  .CurrentPlanActive .iq-talkie-price-info{width: 100%; margin-top: 20px; padding-top: 20px; border-top: 1px solid #ddd; padding-left: 0px;}

}

@media (max-width:991px) {
  .botlisting .botCard{width: 50%;}
  .inputplateCard {
    max-width: 440px;
}

.chatBox-container .ChatHistory{width: 100%; padding-left: 0px;}
.ChatHistory .chatRecordList {
  width: 100%;
}
.topFilterInfo{display: flex; align-items: center; justify-content: space-between; margin: 0px 0px 10px;}
.topFilterInfo a.btn.btn-primary{
  font-weight: 600;
  padding: 8px 10px;
  background-color: rgba(63, 53, 162, 0.1) !important;
  color: #3b37a3 !important;
  border: none !important;

}
.PlanBox .iq-price-info h5.title{font-size: 30px;}
.iq-price-info h2.price{font-size: 20px;}
.CurrentPlanActive .iq-talkie-price-info li{width: 50%;}
.leftChatBox.userLeftcollapse.show{left: 0; visibility: visible; opacity: 1;}
.leftChatBox.userLeftcollapse {
  position: fixed;
  left: -100%;
  z-index: 999;
  width: 100%;
  height: calc(100% - 60px);
  top: 60px;
  transition: .5s;
  -moz-transition: .5s;
  -ms-transition: .5s;
  -o-transition: .5s;
  -webkit-transition: .5s;
  opacity: 0;
  visibility: hidden;
}

.leftChatBox.userLeftcollapse .closebtnbar{  background-color: rgba(63, 53, 162, 0.1) !important;
  color: #3b37a3 !important;
  border: none !important; 
  padding: 4px 8px; font-size: 18px;}

  .ChatHistory .chatInfo-Panel{
    position: fixed;
    right: -100%;
    z-index: 9999;
    width: 100%;
    height: calc(100% - 60px);
    top: 60px;
    transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    -webkit-transition: .5s;
    opacity: 0;
    visibility: hidden;
    padding-left: 0px;
    background-color: #fff;
  }

  .ChatHistory .chatInfo-Panel.show{right: 0; visibility: visible; opacity: 1;}
  .chatInfoCard {position: relative;}

  
  .chatInfoCard .closebtnbar.btn.btn-primary{  background-color: rgba(63, 53, 162, 0.1) !important;
  color: #3b37a3 !important;
  border: none !important; 
  padding: 4px 8px; font-size: 18px; position: absolute; top:10px; right: 18px;}



}

@media (max-width:767px) {
	.body_breadcrumb{top:75px; padding-left:12px}
  .app-header .navbar .navbar-nav li a.guide-btn img{max-width: 100%;}
  .app-header .navbar .navbar-nav li a.guide-btn {
    justify-content: center;
    height: 32px;
    width: 32px;
    background-color: rgba(109, 97, 234, 0.18) !important;
    border: none !important;
    padding: 6px;

}
header.app-header ul.navbar-nav li a.logo-img{padding: 0px;}
header.app-header ul.navbar-nav li a.logo-img img{max-width: 100px;}
.app-header .navbar .navbar-nav .nav-item .nav-link.sidebartoggler {    line-height: 50px;
  height: auto;}
  .dashboard-listing{margin-top: 0;}
  .app-header .navbar .navbar-nav .nav-item .nav-link.sidebartoggler:before{display: none;}
  .page-wrapper .body-wrapper .container-fluid{    padding-top: 100px !important;}
  aside.left-sidebar .brand-logo{justify-content: space-between !important;}
  .dashboard-listing li:last-child{margin-bottom: 0; padding-bottom: 10px;}
  .header  h5{font-size: 14px;}
  .profileCardBox form{padding: 20px;}

  .preview_chat_bot  img{max-width: 32px;}
  .preview_chat_bot   span{display: none;}
  .tayaritheme header.app-header ul.navbar-nav li a.preview_chat_bot#preview_chatbot {padding: 0px; background: transparent !important; border:none !important}

  .tayaritheme header.app-header .dropdown-menu.dropdown-menu-end.dropdown-menu-animate-up {
    margin-top: 0px;
}
.header.mb-4 {
  margin-bottom: 10px !important;
}
.header{
  margin-bottom: 10px !important;
}
.rightbar-info {
  margin: 12px auto 0px;
}
.dropzone .dz-preview{    margin: 8px;}
.tayaritheme div.dataTables_wrapper div.dataTables_paginate ul.pagination {
  margin-top: 10px;
  margin-bottom: 10px;
}
.tayaritheme .table thead th{white-space: nowrap;}
.tab-pane#web-link-pane {
  padding-left: 0px;
  padding-right: 0px;
}
#web-link-pane .attched-link{padding-left: 16px; padding-right: 16px;}
.tayaritheme .table tbody tr td .contextElement {
  min-width: 500px;
  display: block;
}

.modal-dialog .modal-title {
  font-size: 16px;
  line-height: 20px;
}
.modal-dialog  .modal-body {
  padding: 16px;
}

.saving-btn .btn{margin-bottom: 0 !important;}
.zooqq-chat-screen.zooqq-custom-theme {
  margin-bottom: 0px;
}
.custom-theme-selector.theme-selector {
  margin-top: 0px;
}
.theme-box{margin-bottom: 40px;}

.customBotTheme{min-height: 650px;}


.CurrentPlanActive .iq-talkie-price-info li{width: 100%;}
.planListing > div{width: 100%; margin-bottom: 30px; padding: 0px;}


}

@media (max-width:599px) {


}

@media (max-width:499px) {
  .botlisting .botCard{width: 100%; margin-bottom: 20px;}
  .botlisting .botCard:last-child{margin-bottom: 0;}
  .gatForm{display: block;}
  .gatForm .checkboxes {margin-top: 12px;}


}




/* 29-05-2024 */
.botDropdown .dropdown-toggle{
  width: 100%;
  text-align: left;
  background-color: transparent;
  border: 0;
  outline: none;
  color: #fff;
  padding-right: 25px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  font-size: 14px;
    font-weight: 500;
    font-family: 'Poppins', sans-serif;
}
.botDropdown .dropdown-toggle i{
  font-size: 21px;
    line-height: 21px;
    position: relative;
    top: 2px;
    margin-right: 10px;
  
}
.botDropdown .dropdown-toggle::after{
  position: absolute;
  top: 3px;
  right: 0;
  content: '';
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  width: 13px;
  height: 13px;
  background-size: 13px;
  margin: auto;
  bottom: 0px;
  filter: brightness(0.5) invert(1);
  border: 0;
  transition: 0.4s all;
}
.botDropdown .dropdown-menu{
  width: 100%;
  padding: 10px 0px!important;
  margin-top: 30px!important;
  background-color: #292e33!important;
  box-shadow: none;
  max-height: 247px;
  overflow: auto;
  
}
.botDropdown .dropdown-menu li{
  padding: 0 5px;
}
.botDropdown .dropdown-menu li a{
  color: rgb(255 255 255 / 67%);
  padding: 10px 20px;
  margin: 0px 0px 4px;
  display: block;
  border-radius: 7px;
  transition: 0.4s all;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.botDropdown .dropdown-menu li a:hover{
  background-color: #58677c;
  color: #fff;
}
.botDropdown-item{
  border-radius: 0px;
  align-items: center;
  width: 100%;
  padding: 16px 10px 24px;
  position: relative;
  margin-bottom: 0px;
  background: linear-gradient(to bottom, #0e0e0e 26%, #58677c 100%);
  font-family: 'Poppins', sans-serif;
}
@media (max-width:991px) {
  .userLeftcollapse.collapse:not(.show){
    left: 0;
    visibility: visible;
    opacity: 1;
    display: block;
  }
  .leftChatBox.userLeftcollapse.show{
    left: -100%;
    visibility: hidden;
    opacity: 0;
  }
  aside.left-sidebar {
    z-index: 99999;
}
.show-sidebar .overlay{
  z-index: 9999;
}
}


.analytics-listing {
  margin: 0 -10px;
}

.analytics-listing li {
  width: 20%;
  padding: 0 10px 20px;
}

.analytics-listing li a {
  display: block;
  text-align: center;
  /* justify-content: space-between; */
  height: 100%;
  padding: 20px 15px;
  box-shadow: rgba(145, 158, 171, 0.2) 0px 0px 2px 0px, rgba(145, 158, 171, 0.12) 0px 12px 24px -4px;
  border-radius: 10px;
  background-color: #fff;
  /* border: 1px solid #ddd; */
  transition: all 0.2s ease-in-out;
}

.analytics-listing li a span {
  font-size: 15px;
  font-weight: 500;
  color: #2A3547;
}

.analytics-listing li a p {
  font-size: 40px;
  margin-bottom: 10px;
  line-height: 32px;
  font-weight: 700;
  color: #2A3547;
}


.analytics-listing{margin-top:0px;}
.analytics-listing li a{    border: 1px solid #e5e7eb; box-shadow: none; padding: 30px;   text-align: left; position: relative;}
.analytics-listing li a span{font-size: 12px;     text-transform: uppercase;     display: block;
   font-weight: 600;}
.analytics-listing li a p{margin-bottom: 0px;    color: #58677c;  padding-bottom: 10px;     }
.analytics-listing li a:hover{box-shadow: 0 2px 20px 0 rgba(0,0,0,0.1);}

.analytics-listing{margin-top: 0;}
.analytics-listing li a .percentage{
  font-size: larger;
}



/** Pricing Plan Page*/

.pricingTitle{
  font-size: 14px;
  font-family: sans-serif;
  color: #ff7364;
}

.pageTitle{
  font-size: 42px;
  font-style: italic;
}

/**** Subscription Pricing Plan for Wordpress *****/
.prcingPlanListing{display: flex; flex-wrap: wrap; margin: 0px auto; justify-content: center; }
.prcingPlanListing > div{width: 25%; padding: 10px 12px; margin-top: 12px;}
.pricingBox{
  background-color: #f2f2f2;
  padding: 30px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.PlanBox_card{height: auto; transition: transform 0.5s ease;}
.PlanBox_card:hover {
  transform: translateY(-10px);
}

.two div.pricingBox{background-color: #3639a4; position: relative; overflow: hidden;}
.two div.pricingBox .priceInfo h2.price{color: #fff; text-align: center;}
.two div.pricingBox .priceInfo h5.title{color: #fff; text-align: center;}
.two div.pricingBox .priceInfo .nav-pills{    background-color: rgba(255, 255, 255, 0.02);}
.two div.pricingBox .priceInfo .nav-pills li .nav-link{color: #fff;}
.two div.pricingBox .listing_plans li{color: #fff;}


.one div.pricingBox{background: #f2f2f2;}
.one div.pricingBox .priceInfo h2.price{color: #2a3547; text-align: center;}
.one div.pricingBox .priceInfo h5.title{color: #2a3547; text-align: center;}
.one div.pricingBox .priceInfo .nav-pills{    background-color: rgba(255, 255, 255, 0.02);}
.one div.pricingBox .priceInfo .nav-pills li .nav-link{color: #fff;}
.one div.prcingBox .listing_plans li{color: #fff;}

.one div.pricingBox .listing_plans, .two.pricingBox .listing_plans{height: auto;}

.listing_plans{margin: 20px 0px 0px; padding: 0px;}
.listing_plans li{list-style: none; display: block; padding-left: 35px; font-size: 16px; position: relative; margin-bottom: 22px;   color: #2a3547;}
.listing_plans li:after {position: absolute; top:0px; left: 0px; content: ''; background-repeat: no-repeat;   background-image: url(../images/chatbot_images/checkmark.svg);
  width: 26px; background-size: 26px;
  height: 26px;}
 
.priceInfo{text-align: left; padding: 20px 0px 20px;}
.priceInfo h5.title {
  font-size: 40px;
  font-weight: 300;
  margin: 0px 0px 0px;
  padding: 0px;

}
.priceInfo h2.price{
  font-size: 22px;
  font-weight: 700;
  margin: 0px 0px 5px;
  padding: 0px;
}

.one .plan_sign_in{
  text-align: center;
  width: 100%;
  display: block;
  color: var(--global-font-title);
  border-top: 0.0625em solid;
  padding: 1.5em 1em;
  
  border-radius: 0 0 var(--border-radius) var(--border-radius);
  transition: all .3s ease-in;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  background-color: #f2f2f2;
  color: #3639a4;
}

.one .plan_sign_in:hover{
  background-color: #302f5b;
  color: #f2f2f2;
}



.two .plan_sign_in{
  text-align: center;
  width: 100%;
  display: block;
  color: var(--global-font-title);
  border-top: 0.0625em solid;
  padding: 1.5em 1em;
  
  border-radius: 0 0 var(--border-radius) var(--border-radius);
  transition: all .3s ease-in;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  background-color: #3639a4;
  color: #f2f2f2;
}

.two .plan_sign_in:hover{
  background-color: #302f5b;
  color: #f2f2f2;
}

.priceInfo .nav-pills{    background-color: #f9f9fb;
  display: inline-flex;
  border-radius: 30px;}
  .priceInfo .nav-pills li .nav-link{  color: #2a3547; font-weight: 600; font-size: 12px;  border-radius: 20px;}
  .priceInfo .nav-pills li  .nav-link.active{background-color: rgba(109, 97, 234, 0.18); color: #3639a4;     border-radius: 20px;}


/** Country code css for registration html page field */
#country_code_id + .select2-container .select2-selection--single   {
  width: 100%;
  background-color: #fff;
  border: 0.5px solid #DFE5EF;
  border-radius: 4px;
  font-size: 15px;
  height: 49px;
  padding-top: 8px;
}

#country_code_id + .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px;
  position: absolute;
  top: 10px;
  right: 1px;
  width: 20px;
}

#dial_code + .select2-container .select2-selection--single   {
  width: 100%;
  background-color: #fff;
  border: 0.5px solid #DFE5EF;
  border-radius: 4px;
  font-size: 15px;
  height: 49px;
  padding-top: 8px;
}

#dial_code + .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px;
  position: absolute;
  top: 10px;
  right: 1px;
  width: 20px;
}

/** Subscription box selected */

.PlanBox .form-check {
  padding-left: 0;

}

.PlanBox .form-check label {
  width: 100%;
  border: 1px solid #fff;
  padding: 10px;
  text-align: center;
  border-radius: 50px;
  font-size: 16px;
  color: #fff;
  font-weight: 600;
  transition: all 0.3s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #28a745;
  position: absolute;
  visibility: visible;
  z-index: 2;
  bottom: -3px;
}


.verificationStatus{ background-color: rgba(63, 53, 162, 0.1);   font-size: 12px;
  font-weight: 700; display: flex; gap: 6px;   color: #ef0f0f; margin-top:10px;
  padding: 6px 10px;  border-radius: 5px;}  
.verificationStatus p{margin: 0;   color: #ef0f0f;}

  .password-input {
    position: relative;
  }
  
  .password-input input {
    padding-right: 40px;
  }
  
  .password-input .visibility-icon {
    position: absolute;
    right: 10px;
    top: 11px;
    opacity: .6;
  }


/** Country code css for registration html page field */
#country_code + .select2-container .select2-selection--single   {
  width: 100%;
  background-color: #fff;
  border: 0.5px solid #DFE5EF;
  border-radius: 4px;
  font-size: 15px;
  height: 49px;
  padding-top: 8px;
}

#country_code + .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 49px;
  position: absolute;
  top: 10px;
  right: 1px;
  width: 20px;
}
#country_code + .select2-container--default .select2-selection--single .select2-selection__arrow b {
  margin-top: -11px !important;
}


.planStatus {
  background-color: rgba(63, 53, 162, 0.1);
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #3b37a3;
  margin-top: 10px;
  padding: 6px 10px;
  border-radius: 5px;
}

.planStatus-message {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-grow: 1;
}

.planStatus-message p {
  margin: 0;
}
/*----------------------------------------------------------------*/

/**July 09, 2025 */

body.befor_login{
  /* font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  background: linear-gradient(135deg, #e3f2fd 0%, #ffffff 50%, #f0f8ff 100%)!important; */
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center; 
  /* padding: 20px; */
}

/***Registration Page Css */
.befor_login .card {
  background: white;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
  padding: 40px;
  width: 65%;
  max-width: 800px;
  animation: slideUp 0.6s ease-out;
}

@keyframes slideUp {
  from {
      opacity: 0;
      transform: translateY(30px);
  }
  to {
      opacity: 1;
      transform: translateY(0);
  }
}

.befor_login .form-header {
    text-align: center;
    margin-bottom: 30px;
}

.befor_login .form-header h1 {
    color: #2d3748;
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 8px;
}

.befor_login .form-header p {
    color: #718096;
    font-size: 14px;
}

.befor_login .form-group {
    margin-bottom: 20px;
}

.befor_login .form-row {
    display: flex;
    gap: 15px;
}

.befor_login .form-row .form-group {
    flex: 1;
}

.befor_login label {
    display: block;
    margin-bottom: 6px;
    font-weight: 500;
    /* color: #2d3748; */
    font-size: 14px;
}

.befor_login .required::after {
    content: "*";
    color: #e53e3e;
    margin-left: 4px;
}

.befor_login  input[type="text"],input[type="email"],input[type="tel"],input[type="password"],select:not(.selectpicker) {
    width: 100%;
    padding: 5px 16px;
    /* border: 2px solid #e2e8f0; */
    /* border-radius: 8px; */
    font-size: 14px;
    transition: all 0.3s ease;
    background: white;
}

.befor_login input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus,input[type="password"]:focus,select:not(.selectpicker):focus {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.befor_login select:not(.selectpicker) {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px;
    padding-right: 40px;
}

.befor_login .mobile-group {
    display: flex;
    gap: 0;
}

.befor_login .country-code {
    width: 120px;
    border-right: none;
    border-radius: 8px 0 0 8px;
    background: #f7fafc;
    text-align: center;
}

.befor_login .mobile-number {
    flex: 1;
    border-radius: 8px;
}

.befor_login .password-group {
    position: relative;
}

.befor_login .password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    color: #718096;
    font-size: 16px;
    padding: 4px;
}

.befor_login .password-toggle:hover {
    color: #2d3748;
}

/* .befor_login .signup-btn {
    width: 100%;
    background: linear-gradient(135deg, #70b6c2 0%, #134b66 100%);
    color: white;
    border: none;
    padding: 14px 24px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 10px;
} */

.befor_login .signup-btn:hover {
    /* transform: translateY(-2px); */
    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.4);
}

.befor_login .signup-btn:active {
    transform: translateY(0);
}

.befor_login .login-link {
    text-align: center;
    margin-top: 20px;
    color: #718096;
    font-size: 14px;
}

.befor_login .login-link a {
    color: #667eea;
    text-decoration: none;
    font-weight: 500;
}

.befor_login .login-link a:hover {
    text-decoration: underline;
}

@media (max-width: 640px) {
    .befor_login .card {
        padding: 30px 20px;
        margin: 10px;
    }
    
    .befor_login .form-row {
        flex-direction: column;
        gap: 0;
    }
    
    .befor_login .form-header h1 {
        font-size: 24px;
    }
}

/* Bootstrap Select Picker Styling */
.befor_login .bootstrap-select {
    width: 100% !important;
}

.befor_login .bootstrap-select .dropdown-toggle {
    background: white!important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 14px;
    color: #2d3748;
    transition: all 0.3s ease;
    height: auto;
    line-height: 1.5;
}

.befor_login .bootstrap-select .dropdown-toggle:focus,
.befor_login .bootstrap-select .dropdown-toggle:hover {
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    background: white;
}

.befor_login .bootstrap-select .dropdown-toggle::after {
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-left: 0.3em solid transparent;
    margin-top: 0.2em;
}

.befor_login .bootstrap-select .dropdown-menu {
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    margin-top: 4px;
}

.befor_login .bootstrap-select .dropdown-item {
    padding: 8px 16px;
    color: #2d3748;
    transition: all 0.2s ease;
}

.befor_login .bootstrap-select .dropdown-item:hover,
.befor_login .bootstrap-select .dropdown-item.active {
    background: #667eea;
    color: white;
}

.befor_login .bootstrap-select .dropdown-item.selected {
    background: #f0f8ff;
    color: #667eea;
}

.befor_login .bootstrap-select .filter-option-inner-inner {
    color: #2d3748;
}

.befor_login .bootstrap-select.show .dropdown-toggle {
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.befor_login .iti{
  width: 100% !important;
}

/***July 10,2025 */
.main-content {
    flex: 1;
    padding: 30px;
    background-color: #ffffff;
}

.dashboard-header {
    margin-bottom: 30px;
}

.dashboard-title {
    font-size: 28px;
    font-weight: 600;
    color: #333333;
    margin-bottom: 8px;
}

.dashboard-subtitle {
    color: #6c757d;
    font-size: 16px;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card {
    background: linear-gradient(135deg, #ffffff, #f8f9fa);
    border-radius: 12px;
    padding: 24px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #4a90e2, #5cb85c, #f0ad4e);
}

.stat-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.stat-title {
    font-size: 14px;
    color: #6c757d;
    font-weight: 500;
}

.stat-icon {
    width: 24px;
    height: 24px;
    opacity: 0.6;
    color: #6c757d;
}

.stat-value {
    font-size: 32px;
    font-weight: 700;
    color: #333333;
    margin-bottom: 8px;
}

.stat-change {
    font-size: 12px;
    color: #5cb85c;
    display: flex;
    align-items: center;
}

.charts-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    margin-bottom: 30px;
}

.chart-container {
    background-color: #ffffff;
    border-radius: 12px;
    padding: 24px;
    border: 1px solid #e9ecef;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.chart-title {
    font-size: 18px;
    font-weight: 600;
    color: #333333;
    margin-bottom: 20px;
}

.chart-wrapper {
    position: relative;
    height: 300px;
}

.monthly-chart {
    height: 350px;
}

.legend {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 16px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #6c757d;
}

.legend-color {
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

@media (max-width: 768px) {
    .sidebar {
        width: 200px;
    }
    
    .charts-grid {
        grid-template-columns: 1fr;
    }
    
    .main-content {
        padding: 20px;
    }
}

.tayaritheme .form-row .form-group {
    flex: 1;
}

.tayaritheme label {
    display: block;
    margin-bottom: 6px;
    font-weight: 500;
    color: #2d3748;
    font-size: 14px;
}

.tayaritheme .required::after {
    content: "*";
    color: #e53e3e;
    margin-left: 4px;
}

.tayaritheme  input[type="text"],input[type="email"],input[type="tel"],input[type="password"],select:not(.selectpicker) {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    font-size: 14px;
    transition: all 0.3s ease;
    background: white;
}

.tayaritheme input[type="text"]:focus,input[type="email"]:focus,input[type="tel"]:focus,input[type="password"]:focus,select:not(.selectpicker):focus {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.tayaritheme select:not(.selectpicker) {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px;
    padding-right: 40px;
}

.tayaritheme .mobile-group {
    display: flex;
    gap: 0;
}

.tayaritheme .country-code {
    width: 120px;
    border-right: none;
    border-radius: 8px 0 0 8px;
    background: #f7fafc;
    text-align: center;
}

.tayaritheme .mobile-number {
    flex: 1;
    border-radius: 0 8px 8px 0;
}


/* Bootstrap Select Picker Styling */
.tayaritheme .bootstrap-select {
    width: 100% !important;
}

.tayaritheme .bootstrap-select .dropdown-toggle {
    background: white!important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 14px;
    color: #2d3748;
    transition: all 0.3s ease;
    height: auto;
    line-height: 1.5;
}

.tayaritheme .bootstrap-select .dropdown-toggle:focus,
.tayaritheme .bootstrap-select .dropdown-toggle:hover {
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
    background: white;
}

.tayaritheme .bootstrap-select .dropdown-toggle::after {
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-left: 0.3em solid transparent;
    margin-top: 0.2em;
}

.tayaritheme .bootstrap-select .dropdown-menu {
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    margin-top: 4px;
}

.tayaritheme .bootstrap-select .dropdown-item {
    padding: 8px 16px;
    color: #2d3748;
    transition: all 0.2s ease;
}

.tayaritheme .bootstrap-select .dropdown-item:hover,
.tayaritheme .bootstrap-select .dropdown-item.active {
    background: #667eea;
    color: white;
}

.tayaritheme .bootstrap-select .dropdown-item.selected {
    background: #f0f8ff;
    color: #667eea;
}

.tayaritheme .bootstrap-select .filter-option-inner-inner {
    color: #2d3748;
}

.tayaritheme .bootstrap-select.show .dropdown-toggle {
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.tayaritheme .error{
  color: red!important;
}

/* --- REQUIRED LOADER CSS --- */
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

#questionList {
  min-height: 100px;
  position: relative; /* Required for loader overlay */
}

/****************Loader css****************/
.loader-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    border-radius: inherit;
}
.centered-loader {
    border: 5px solid #f3f3f3;
    border-top: 5px solid #007bff;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
}
.inline-loader {
    display: inline-block;
    border: 2px solid #f3f3f3;
    border-top: 2px solid #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    margin-left: 8px;
    animation: spin 0.8s linear infinite;
}

/*******************Chat Analytics Panel ********************/
 .analytics-section {
        margin-bottom: 2rem;
        padding: 1.5rem;
        background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
        border-radius: 12px;
        border: 1px solid #e9ecef;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }

    .section-header {
        margin-bottom: 1.5rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #e9ecef;
    }

    .section-header h5 {
        color: #2c3e50;
        font-weight: 600;
        margin: 0;
        display: flex;
        align-items: center;
    }

    .metrics-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .metric-card {
        background: white;
        padding: 1.25rem;
        border-radius: 8px;
        border-left: 4px solid #6e8590;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        transition: transform 0.2s ease;
    }

    .metric-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }

    .metric-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .metric-label {
        font-weight: 500;
        color: #495057;
        font-size: 0.9rem;
    }

    .metric-value {
        font-weight: 700;
        color: #2c3e50;
        font-size: 1.1rem;
    }

    .a-progress-container {
        position: relative;
    }

    .a-progress {
        height: 8px;
        background-color: #e9ecef;
        border-radius: 4px;
        overflow: hidden;
    }

    .a-progress-bar {
        transition: width 0.8s ease;
        border-radius: 4px;
    }

    .a-stat-card {
        background: white;
        padding: 1.25rem;
        border-radius: 8px;
        display: flex;
        align-items: center;
        gap: 1rem;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        transition: transform 0.2s ease;
    }

    .a-stat-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }

    .a-stat-card.full-width {
        grid-column: 1 / -1;
    }

    .a-stat-icon {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: linear-gradient(276deg, #005964, #bbb);
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 1.5rem;
        flex-shrink: 0;
    }

    .a-stat-content h6 {
        margin: 0;
        font-size: 1.5rem;
        font-weight: 700;
        color: #2c3e50;
    }

    .a-stat-content p {
        margin: 0;
        color: #6c757d;
        font-size: 0.85rem;
    }

    .rating-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 1.5rem;
        align-items: center;
    }

    .circular-progress {
        display: flex;
        justify-content: center;
        padding-left: 50%;
    }

    .circle-chart {
        position: relative;
        width: 100px;
        height: 100px;
    }

    .circle-svg {
        width: 100%;
        height: 100%;
        transform: rotate(-90deg);
    }

    .circle-bg {
        fill: none;
        stroke: #e9ecef;
        stroke-width: 2;
    }

    .circle-progress {
        fill: none;
        stroke: #5C969D;;
        stroke-width: 2;
        stroke-linecap: round;
        transition: stroke-dasharray 0.8s ease;
    }

    .circle-text {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }

    .circle-value {
        display: block;
        font-size: 1.5rem;
        font-weight: 700;
        color: #2c3e50;
    }

    .circle-label {
        display: block;
        font-size: 0.8rem;
        color: #6c757d;
        margin-top: 0.25rem;
    }

    .overall-rating {
        background: linear-gradient(135deg, #639e90, #00384de3);
        color: white;
        padding: 1.5rem;
        border-radius: 12px;
        text-align: center;
        grid-column: 1 / -1;
    }

    .overall-score h3 {
        margin: 0;
        font-size: 2.5rem;
        font-weight: 700;
    }

    .overall-score p {
        margin: 0.5rem 0;
        opacity: 0.9;
    }

    .rating-stars {
        margin-top: 1rem;
    }

    .rating-stars i {
        font-size: 1.2rem;
        margin: 0 0.15rem;
        color: #ffc107;
    }

    .no-data-container {
        text-align: center;
        padding: 3rem 1.5rem; /* Increased padding */
        background: white;
        border-radius: 12px;
        border: 2px dashed #dee2e6;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); /* Subtle shadow */
        max-width: 400px; /* Max width for better presentation */
        width: 100%;
        transition: all 0.3s ease-in-out; /* Smooth transitions for status changes */
    }

    .no-data-icon {
        font-size: 4.5rem; /* Slightly larger icon */
        color: #6c757d;
        margin-bottom: 1.5rem; /* Increased margin */
        transition: color 0.3s ease-in-out;
    }

    .no-data-container h5 {
        font-size: 1.5rem; /* Larger heading */
        font-weight: 600; /* Semi-bold */
        color: #343a40; /* Darker text */
        margin-bottom: 0.75rem; /* Increased margin */
        transition: color 0.3s ease-in-out;
    }

    .no-data-container p {
        font-size: 1rem;
        color: #6c757d;
        margin: 0;
        line-height: 1.5;
        transition: color 0.3s ease-in-out;
    }

    /* --- Specific Status Designs --- */

    /* Analysis Pending - Updated to a light blue-grey */
    .analysis-pending {
        border-color: #a7c7e7; /* Soft blue-grey border */
        background-color: #f0f8ff; /* Very light blue background */
    }
    .analysis-pending .no-data-icon {
        color: #6a9bd8; /* Muted blue icon */
    }
    .analysis-pending h5 {
        color: #4a7bbd; /* Darker blue heading */
    }
    .analysis-pending p {
        color: #5b8ecf; /* Muted blue paragraph */
    }

    /* Analysis Errored */
    .analysis-error {
        border-color: #dc3545; /* Red border */
        background-color: #fcebeb; /* Light red background */
    }
    .analysis-error .no-data-icon {
        color: #dc3545; /* Red icon */
    }
    .analysis-error h5 {
        color: #c82333; /* Darker red heading */
    }
    .analysis-error p {
        color: #bd2130; /* Darker red paragraph */
    }

    /* No Analytics Data */
    .no-analytics {
        border-color: #007bff; /* Blue border */
        background-color: #e6f2ff; /* Light blue background */
    }
    .no-analytics .no-data-icon {
        color: #007bff; /* Blue icon */
    }
    .no-analytics h5 {
        color: #0056b3; /* Darker blue heading */
    }
    .no-analytics p {
        color: #004085; /* Darker blue paragraph */
    }

    

    @media (min-width: 768px) {
        .metrics-grid {
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        }

        .a-stat-card:not(.full-width) {
            grid-column: auto;
        }
    }

    @media (max-width: 767px) {
        .analytics-section {
            padding: 1rem;
        }

        .rating-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .overall-rating {
            grid-column: 1 / -1;
        }
    }

/** July 17,2025 CSS for models*/
 .modal-content {
    border-radius: 15px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border-radius: 15px 15px 0 0;
    padding: 20px 30px;
}

.modal-title {
    font-weight: 600;
    font-size: 1.5rem;
}

.btn-close {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    opacity: 0.8;
}

.btn-close:hover {
    opacity: 1;
}

.plan-section {
    padding: 25px;
    margin: 20px;
    border-radius: 12px;
    transition: all 0.3s ease;
}

.current-plan {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
}

.upgrade-plan {
    background: linear-gradient(135deg, #e3f2fd 0%, #f3e5f5 100%);
    border: 2px solid #2196f3;
    position: relative;
}

.upgrade-plan::before {
    content: "RECOMMENDED";
    position: absolute;
    top: -10px;
    right: 20px;
    background: #ff4081;
    color: white;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.plan-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.plan-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    font-size: 1.5rem;
}

.current-plan .plan-icon {
    background: #6c757d;
    color: white;
}

.upgrade-plan .plan-icon {
    background: #2196f3;
    color: white;
}

.plan-name {
    font-size: 1rem;
    font-weight: 600;
    color: #333;
}

.plan-price {
    font-size: 1rem;
    font-weight: 540;
    color: #2196f3;
    margin: 10px 0;
}

.current-plan .plan-price {
    color: #6c757d;
}

.plan-period {
    color: #666;
    font-size: 0.9rem;
}

.feature-list {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.feature-list li {
    padding: 8px 0;
    display: flex;
    align-items: center;
}

.feature-list li i {
    margin-right: 10px;
    width: 20px;
}

.feature-included {
    color: #4caf50;
}

.feature-excluded {
    color: #f44336;
}

.feature-new {
    color: #ff9800;
    font-weight: 600;
}

.savings-badge {
    background: #ff4081;
    color: white;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    margin-top: 10px;
    display: inline-block;
}

.comparison-divider {
    text-align: center;
    margin: 30px 0;
    position: relative;
}

.comparison-divider::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: #dee2e6;
}

.comparison-divider span {
    background: white;
    padding: 0 20px;
    color: #666;
    font-weight: 600;
}

@media (max-width: 768px) {
    .plan-section {
        margin: 10px;
        padding: 20px;
    }

    .modal-body {
        padding: 15px;
    }
}





/* Section Headers */
.chat-analytics .section-title {
  font-size: 1.4rem;
  margin-bottom: 1rem;
  font-weight: 600;
  color: #333;
}

/* Cards for metrics */
.chat-analytics .card {
  border-radius: 1rem;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s ease;
}
.chat-analytics .card:hover {
  transform: translateY(-3px);
}

/* Soft Skill Progress Bars */
.progress {
  height: 1.2rem;
  border-radius: 0.5rem;
  background-color: #f0f0f0;
}
.progress-bar {
  font-size: 0.75rem;
  line-height: 1.2rem;
  border-radius: 0.5rem;
  transition: width 1s ease-in-out;
}

/* AI Rating Circular Spinner */
.spinner-container {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.spinner-circle {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 6px solid #dee2e6;
  position: relative;
}
.spinner-fill {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  clip: rect(0, 80px, 80px, 40px);
  position: absolute;
  transform: rotate(0deg);
  transition: transform 1s ease-in-out;
}
.spinner-fill .fill {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  clip: rect(0, 40px, 80px, 0);
  background-color: #007bff;
}
.spinner-text {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  font-size: 1.2rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Chat Metric Icons */
.chat-analytics .metric-icon {
  font-size: 1.5rem;
  color: #6c757d;
  margin-right: 0.5rem;
}

/* Accordion (Strengths & Improvements) */
.accordion-button {
  background-color: #f8f9fa;
  font-weight: 600;
}
.accordion-item {
  border-radius: 0.5rem;
  margin-bottom: 0.5rem;
}
.accordion-body {
  font-size: 0.95rem;
  padding: 1rem;
  color: #444;
}

/* Filler Words Tags */
.badge.filler-badge {
  background-color: #ffc107;
  color: #212529;
  margin: 2px;
  padding: 6px 10px;
  font-size: 0.85rem;
  border-radius: 1rem;
}

#progressChart {
  width: 100%;
  height: 400px; /* Default height, will adjust responsively */
  max-width: 100%;
  margin: 0 auto;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
}

@media (max-width: 768px) {
  #progressChart {
    height: 350px;
  }
}

@media (max-width: 480px) {
  #progressChart {
    height: 300px;
  }
}

.swal2-toast-mobile {
  font-size: 14px;
  min-width: 200px;
  max-width: 90vw;
  padding: 10px 15px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

@media (max-width: 767px) {
  .swal2-toast-mobile {
    font-size: 13px;
    padding: 8px 12px;
  }
}


/* Style for the clear button inside Flatpickr */
.flatpickr-calendar .flatpickr-clear-button {
    background: none;
    border: none;
    color: #007bff; /* Or your preferred link color */
    cursor: pointer;
    font-size: 14px;
    padding: 0 10px;
}

.flatpickr-calendar .flatpickr-clear-button:hover {
    text-decoration: underline;
}

/* Optional: adjust the layout if needed */
.flatpickr-calendar .flatpickr-rangelabel {
    display: flex;
    justify-content: space-between;
    align-items: center;
}