.form-control:focus {
  color: #000 !important;
}

.stDate.theme--light.v-card {
  width: 100%;
}

.stDate .v-icon {
  top: unset;
  right: unset;
}

.tabs {
  display: flex;
  justify-content: center;
  margin-bottom: 1rem;
  position: absolute;
  top: 0rem;
}

.tab {
  padding: 0.5rem 1rem;
  cursor: pointer;
  margin: 0 0.5rem;
  display: inline-block;
  list-style-type: none;
}

.tab.active {
  background-color: #B80E74;
  color: #fff;
  border-color: #B80E74;
}

.tab-content {
  margin-top: 5rem !important;
  display: none;
  height: calc(100vh - 25rem) !important;
  overflow: auto;
  overflow-x: hidden;
  scrollbar-width: none;
}

.tab-content.active {
  display: block;
}

iframe.iframe-visible {
  max-width: 84dvh;
}

input[type="date"]::placeholder {
  color: #6c757d;
  /* Adjust color as needed */
  opacity: 1;
  /* Ensure it's fully visible */
  font-size: 14px;
  /* Adjust size if necessary */
}

.slot-btn.highlight {
  background-color: #B80E74 !important;
  color: #FFFFFF !important;
  border: 2px solid #6d0343;
  /* Optional for better visual distinction */
}

.chat-message,
.msg-sent {
  word-break: break-word;
  text-align: left !important;
}

.doubleColumn {
  height: fit-content;
  flex: none;
  width: 89%;

}

.toast {
  position: absolute;
  max-width: 100%;
  width: 100%;
  left: auto;
  right: 20px;
  top: 0;
}

.dropdown .v-input__append-inner {
  position: absolute;
  top: 50%;
  right: 10px;
  /* Align the arrow to the right */
  transform: translateY(-50%);
  pointer-events: none;
  /* Prevent interactions with the SVG */
}

.dropdown .v-icon {
  display: none !important;
  /* Hide the default Vuetify arrow */
}

.dropdown svg {
  width: 16px;
  /* Match the SVG width */
  height: 10px;
  /* Match the SVG height */
  stroke: #999999;
  /* Adjust the stroke color */
}

.v-text-field.v-input--is-focused>.v-input__control>.v-input__slot:after {
  display: none;
}

.feedback-icons button {
  background: #fff;
  padding: 10px;
  border-radius: 30px;
  border: 1px solid;
}

.loader-overlay {
  position: fixed;
  top: 60px;
  left: 0;
  width: 100%;
  height: calc(100% - 60px);
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  /* Ensure it appears above other elements */
}

.loader {
  border: 8px solid #f3f3f3;
  border-top: 8px solid #3498db;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.invalid-otp {
  color: red;
  font-family: 'Poppins', sans-serif;
  /* <!-- margin-left: 6%; -->  */
}

textarea#chatbox {
  height: 3.5rem !important;
  overflow-y: auto;
}

.valid-otp {
  color: green;
  font-family: 'Poppins', sans-serif;
  /* <!-- margin-left: 6%; -->  */
}

.v-application .title .validation-div {
  position: absolute;
  margin: 0 auto;
  text-align: center;
  left: 0;
  right: 0;
  top: 40px;
}

.v-application .title .validation-div+div {
  margin-top: 30px;
  height: calc(100vh - 11.6rem);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.check-icon {
  color: #00D439;
}

.card-div .card-body {
  padding: 2rem 1rem;
  color: var(--bs-card-color);
}

/* Feedback Modal Styles */
.feedback-header {
    background-color: #B80E74;
    padding: 1.5rem;
    text-align: center;
    position: relative;
    clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 80%);
    padding-bottom: 3rem;
    margin-bottom: 0;
}

.feedback-option {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0px 13px 0px 0px;
    border-radius: .5rem;
    cursor: pointer;
    transition: all 0.2s;
    border: 2px solid transparent;
    font-weight: 600;
    min-width: 130px;
}

#feedbackOptionLike {
    background-color: #E5F9F7;     
}

#feedbackOptionDislike {
    background-color: #FFF3E6;      
}

.feedback-icon-img {
    width: 32px;
    height: 32px;
    display: block;
}

.feedback-option.selected {
    box-shadow: 0 0 0 2px #B80E74;
}

.feedback-option:hover {
    opacity: 0.9;
}

.btn-cancel-feedback {
    border: 1px solid #B80E74 !important;
    color: #B80E74;
    background: white;
    font-weight: 600;
}
.btn-cancel-feedback:hover {
    background-color: #fce4ec;
    color: #B80E74;
}

.btn-send-feedback {
    background-color: #B80E74;
    color: white;
    font-weight: 600;
}
.btn-send-feedback:hover {
    background-color: #880a55;
    color: white;
}

/* Terms Modal Styles */
#termsModal h6 {
    font-size: 1.2rem;
}

#termsModal p {
    font-size: 1.2rem;
    color: #000;
    font-weight: 400;
}

#termsModal ul {
    font-size: 1.2rem;
    color: #000;
    font-weight: 400;
}

.appoint {
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 21px;
  text-align: left;
  color: #00D439;
}

.textareaMainDiv {
  width: 100%;
  padding: 0px 10px;
  padding-bottom: 30px;
}

.appoint-data {
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 21px;
  text-align: left;

}

.apointmentUser {
  font-size: 16px;
  /* margin-bottom:20px; */
}

.calendar-app {
  position: absolute;
  top: 54px;
  left: 0;
  width: 100%;
  height: calc(100vh - 60px);
  display: flex;
  justify-content: center;
  align-items: center;

}

.v-dialog__content {
  align-items: center;
  display: flex;
  height: calc(100% - 55px);
  justify-content: center;
  pointer-events: none;
  position: relative;
  transition: .2s cubic-bezier(.25, .8, .25, 1), z-index 1ms;
  width: 100%;
  z-index: 6;
  outline: none;
  border: 1px solid #BDD9FF;
  border-radius: 6px;
}

.v-dialog>* {
  width: 100%;
}

.apointmentMain {
  height: calc(100vh - 302px);
  overflow-y: auto;
}

.appointmentsContainer {
  max-height: 40vh;
  overflow-y: auto;
}

.theme--light.v-card {
  background-color: #fff;
  color: rgba(0, 0, 0, .87);
  padding: 0;
  /* <!-- left: -22px; -->  */
  width: 90%;
  max-width: 290px;
  height: 28rem;
}

.theme--light.v-application {
  background: #fff !important;
  color: rgba(0, 0, 0, .87);
  height: 100%;
  width: 44.3rem;
  z-index: 99;
  position: fixed;
  top: 60px;
  padding: 10px;
}

.v-picker__body {
  height: auto;
  overflow: hidden;
  position: relative;
  z-index: 0;
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
  max-height: 100%;
}

.v-date-picker-title__year {
  font-size: 16px;
  font-weight: 500;
}

.verify-otp-div {
  margin-top: 35px;
}

.validation-message-for-otp {
  font-size: 1.2rem !important;
  font-weight: 600;
}

.appointments-container {
  /* max-height: 40vh; */
  overflow-y: auto;
}

.v-dialog:not(.v-dialog--fullscreen) {
  height: 100% !important;
  max-height: calc(100vh - 80px) !important;
  overflow-x: hidden;
  /* padding-bottom: 50px; */
}

.v-dialog {
  border-radius: 4px;
  margin: 0;
  overflow-y: auto;
  pointer-events: auto;
  transition: .3s cubic-bezier(.25, .8, .25, 1);
  /* width: 320px; */
  z-index: inherit;
  box-shadow: none;
  background: #ffffff;
  position: relative;
  /* border:1px solid #BDD9FF; */
}

.v-overlay__scrim {
  border-radius: inherit;
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: inherit;
  width: 100%;
  will-change: opacity;
  background-color: transparent !important;
}

.theme--light.v-text-field:not(.v-input--has-state):hover>.v-input__control>.v-input__slot:before {
  border-color: rgba(0, 0, 0, .87);
}

.theme--light.v-text-field>.v-input__control>.v-input__slot:before {
  border-color: rgba(0, 0, 0, .42);
}

.v-text-field>.v-input__control>.v-input__slot:before {
  border-color: inherit;
  border-style: none;
  border-width: thin 0 0;
}

.v-select__slot {
  position: relative;
  display: flex;
  max-width: 100%;
  min-width: 0;
  width: 100%;
  border: 1px solid #ccc;
  flex-direction: row;
  background-color: #fff;
  border-radius: 5px;
  height: 37px;
}

.title {
  width: 100%;
}

.firstname {
  width: 100%;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.lastname {
  width: 100%;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.dob {
  width: 100%;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;

}

.email {
  width: 100%;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.pnum {
  width: 100%;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.bookapp {
  width: 100%;
  color: #B80E74;
  font-family: 'Poppins', sans-serif;
  font-size: 1.5rem;
  font-weight: bold;
  line-height: 28px;
  text-align: center;
  max-width: 80%;
  margin: 0 auto;
}

button.verify-otp-text.verify-otp-btn.v-btn.v-btn--is-elevated.v-btn--has-bg.theme--light.v-size--default {
  margin-top: 16px;
}

.location {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.provider {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.reason {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.v-input .v-label {
  height: 20px;
  line-height: 20px;
  letter-spacing: normal;
  left: 14px !important;
  right: auto;
  position: absolute;
  top: 10px !important;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #b0b0b0;
}

.v-icon {
  top: 5px;
  right: 7px;
}

.confirmdate,
.confirmtime,
.confirmtimemore {
  width: 90%;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  text-align: left;
  color: #48505E;
  /* left: 3px; */
  position: relative;
  top: 10px;
  padding: 0;
  margin: 0 auto;
}

.confirmtime>div:first-child {
  display: none;
}

.confirmdate {
  display: none;
}

.v-application .justify-center {
  justify-content: center !important;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  margin: 0;
}

.v-card__actions {
  align-items: center;
  display: flex;
  padding: 2px !important;
}

.v-text-field__details {
  display: none !important;
}

.v-text-field__details {
  display: none !important;
}



.v-application .primary {
  background-color: #B90E75 !important;
  border-color: #B90E75 !important;
}



.v-application .my-2 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


.v-select.v-input--dense .v-select__selection--comma {
  margin: 5px 4px 3px 12px;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 20px;
  text-align: left;
  color: #000;
}

.mob-num-text {
  font-family: 'Poppins', sans-serif;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 24px;
  text-align: left;
  color: #48505E;
}

.bot-message a {
  color: #0056b3 !important;
  text-decoration: underline;
  font-weight: 500;
}

.bot-message a:hover {
  color: #8eaccd !important;
  text-decoration: underline;
}

.verify-otp-text {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 24px;
  text-align: left;
  color: #48505E;
  padding: 8px 16px;
  margin-top: 16px;
  border-radius: 8px;
  width: calc(100% - 25px);
  text-align: center;
}

.card-div .card-header {
  min-height: 60px;
  z-index: 999;
}

input:-webkit-autofill {
  background-color: #fff !important;
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;

  box-shadow: 0 0 0 1000px #fff inset !important;

  -webkit-text-fill-color: #000000 !important;

}

input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  background-color: #fff !important;
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  box-shadow: 0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color: black !important;
  border-color: #90b7ff;
}

.mob-num-text {
  font-family: 'Poppins', sans-serif;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 24px;
  text-align: left;
  color: #48505E;
}


.prefilled {
  color: #000000;
}

.v-menu__content {
  left: 4% !important;
  position: absolute;
}

.input-invalid {
  background-color: #ffdcdd;
  border: 1px solid #ed5247;
}

.highlight {
  background-color: #007bff;
  /* Highlight color */
  color: #fff;
  border: 2px solid #0056b3;
}

.v-dialog {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

/* a {
        color: #1a73e8;
        text-decoration: none;
      } */

.v-list-item__title {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem !important;
  font-weight: 500;
  line-height: 18px !important;
  color: #48505E;
}

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

.slot-btn {
  background: #F9D4EB !important;
  color: #300D21 !important;
  width: 100%;
  height: fit-content;
  font-weight: 500;
}

.slot-btn:hover {
  background-color: #B80E74 !important;
  color: #FFFFFF !important;
}




.slot-btn:active {
  background-color: #B80E74 !important;
  color: #FFFFFF !important;
}

.form-control {
  font-size: 1.2rem;
}

.v-input--dense>.v-input__control>.v-input__slot {
  margin-bottom: 16px;
}

.v-text-field {
  margin-top: 0 !important;
}

.outer-slot-container {
  /* height: calc(100vh - 246px);*/
  width: 100%;
  /* overflow: auto;
      overflow-x: hidden;*/
  /* max-height: 57vh; */
}

.v-picker {
  max-width: 90%;
}

.v-date-picker-title__date {
  font-size: 27px !important;
}

.validation-message3,
.validation-message {
  color: red;
  /* left: 1.7rem; */
  position: relative;
  width: fit-content;
  display: none;
  /* bottom: 1rem; */
  font-size: 1.2rem;
  text-align: center;
  margin: 0 auto;
  left: auto;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

.p-3.pt-1.pb-1.rounded.bg-light-info.text-dark.fs-16.fw-semibold.text-start {
  padding: .50rem .75rem !important;
}

.v-btn.v-size--default,
.v-btn.v-size--large {
  font-size: 1.2rem;
  font-family: 'Poppins';
}

.v-application .mb-1 {
  margin-bottom: 6px !important;
}

.validation-div {
  margin: 0 auto;
  text-align: center;
  margin-bottom: 15px;
}

.validation-message-forEmail {
  color: red;
  /* left: 1.7rem; */
  position: relative;
  width: fit-content;
  display: none;
  /* bottom: 1rem; */
  font-size: 1.2rem;
  text-align: center;
  margin: 0 auto;
  left: auto;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  top: 1px;
}

.validation-message-forDOB1 {
  color: red;
  /* left: 1.7rem; */
  position: relative;
  width: fit-content;
  display: none;
  /* bottom: 1rem; */
  font-size: 1.2rem;
  text-align: center;
  margin: 0 auto;
  left: auto;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  top: 1px;
}

.validation-message-forDOB {
  left: 1.7rem;
  position: relative;
  width: fit-content;
  display: none;
  bottom: 1rem;
  font-size: 1.25rem;
  text-align: center;
}

.step-one {
  width: 98%;
  margin-top: 0% !important;
}

.back-btn {
  border: 1px solid #B80E74 !important;
  width: 95% !important;
  background: none !important;
  color: #B80E74 !important;
}

.next-btn {
  background: #B80E74 !important;
  width: 95% !important;
  border: 1px solid #B80E74 !important;
}

.verify-otp-btn {
  position: relative;
  /* <!-- left: 84px; -->  */
  top: 15px;
  background: #B80E74 !important;
  color: #fff !important;
}

.submit {
  background: #B80E74 !important;
  color: #fff !important;
  width: 95%;
}

.fixed-bottom-buttons .submit {
  text-transform: capitalize;
}

.chatbot-div {
  width: 100%;
  height: 100%;
}

.card-div {
  width: 100%;
  height: 100%;
}

.card-div .card-body {
  border-right: 1px solid #ddd;
  border-left: 1px solid #ddd;
  border: 0;
}

.card-div .card-footer {
  border-right: 0;
  border-left: 0;
  /* border-bottom: 1px solid #ddd;  */
  z-index: 2;
}

.appointment-card {
  border: 1px solid #D0D5DD;
  border-radius: 4px;
  padding: 10px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  max-width: 300px;
  margin: 10px auto;
  /* justify-content: center; */
}

.appointment-card input[type="radio"] {
  margin-right: 10px;
  /* accent-color: #ccc;  Modern browsers only */
  transform: scale(1.3);
}

/* .appointment-card input[type="radio"]:checked::after {
              content: '';
              position: absolute;
              top: 50%;
              left: 50%;
              width: 4px;
              height: 4px;
              background-color: #B80E74;
              border-radius: 50%;
              transform: translate(-50%, -50%);
              transition: transform 0.2s ease;
          } */
.appointment-card .details h6 {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  color: #000000;
}

.appointment-card .details p {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  color: #000000;
}

.card-div .card-footer {
  z-index: 9;
  position: relative;
  background: #fff;
}

/* .validation-div {
      height: 0px;
    }

    .verify-otp-div {
      height: 39.5vh;
    } */


/* <!-- iframe{ -->
  <!-- border:none; -->
  <!-- } --> */

.btn-next-back {
  width: 90%;
  position: relative;
}

.btn-next-time {
  width: 91%;
  position: relative;
}

.v-application .justify-center+.row {
  margin: 0;
}


.btn-next-location {
  width: 98%;
}

.textarea-class {
  font-size: 1.2rem !important;
  font-family: 'Poppins', sans-serif;
}

.scroll-y {
  min-height: calc(100vh - 227px);
  height: auto !important;
  z-index: 1;
  max-height: 18vh;
  padding-bottom: 0px !important;
  scrollbar-width: none;
}

.closeAppBtn svg {
  max-width: 1rem;
}

.closeAppBtn {
  position: absolute;
  left: auto;
  right: 20px;
  top: 17px;
  font-size: 20px !important;
  line-height: 0 !important;
  cursor: pointer;
  border:2px solid #B80E74;
  border-radius: 50%;
  PADDING: 0.2rem 0.5rem;
}

.v-picker__body.theme--light {
  border: 1px solid #eee;
}

.suggestion-div {
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 6px;
  padding: 12px 0px;
  overflow-x: auto;
  max-width: 100%;
  font-family: 'Poppins', sans-serif;
}

.further-suggestion-btn,
.further-suggestion-btn-1,
.further-suggestion-btn-2 {
  color: #B90E75;
  border: 1px solid #B90E75 !important;
  padding: 6px 12px !important;
  font-size: 1rem;
  text-transform: capitalize;
}

.further-suggestion-btn:hover,
.further-suggestion-btn-1:hover,
.further-suggestion-btn-2:hover {
  color: #fff !important;
  background: #B90E75 !important;
  border: 1px solid #B90E75 !important;
}



.yesBookAppt {
  background: transparent !important;
  color: #B90E75;
  border: 1px solid #B90E75 !important;
  padding: 6px 12px !important;
  font-size: 1rem;
  text-transform: capitalize;
}

.yesBookAppt:hover {
  color: #fff !important;
  background: #B80E74 !important;
  border: 1px solid !important;
}

.noBookAppt {
  background: transparent !important;
  color: #B80E74;
  border: 1px solid #B80E74!important;
  padding: 6px 12px !important;
  font-size: 1rem;
  text-transform: capitalize;
}

.noBookAppt:hover {
  color: #fff !important;
  background: #B80E74 !important;
  border: 1px solid !important;
}

.yescancelAppt {
  background: transparent !important;
  color: #B90E75;
  border: 1px solid #B90E75 !important;
  padding: 6px 12px !important;
  font-size: 1rem;
  text-transform: capitalize;
}

.yescancelAppt:hover {
  color: #fff !important;
  background: #B80E74 !important;
  border: 1px solid !important;
}

.nocancelAppt {
  background: transparent !important;
  color: #B80E74;
  border: 1px solid #B80E74!important;
  padding: 6px 12px !important;
  font-size: 1rem;
  text-transform: capitalize;
}

.nocancelAppt:hover {
  color: #fff !important;
  background: #B80E74 !important;
  border: 1px solid !important;
}

.suggestion-div button {
  background: #fff !important;
  color: #B90E75;
  border: 1px solid #B80E74 !important;
  padding: 6px 12px !important;
  font-size: 1rem;
  text-transform: capitalize;
  transition: 0.6s ease all;
}

.suggestion-div button:hover {
  background: #fff !important;
  color: #B90E75;
  border: 1px solid #B80E74 !important;
  /* opacity: .7; */
}

.pagination-buttons {
  display: flex;
  align-items: center;
}

.pagination {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  overflow: hidden;
  display: none;
}

#button-container {
  display: flex;
  gap: 5px;
  width: 347px;
  justify-content: flex-start;
}

.button-container {
  padding: 4px;
  display: inline-block;
}

.suggestion-btn {
  padding: 5px 10px !important;
  background: #F2F2F2 !important;
  text-align: center;
  white-space: nowrap;
  display: flex;
}

.pagination button {
  border: none;
  background: none;
  cursor: pointer;
  font-size: 1.2rem;
}

.suggestion-div>button {
  background: transparent !important;
  padding: unset !important;
}

/* <!-- #left-btn { -->
      <!-- font-size: 18px; -->
      <!-- border-radius: 70px; -->
      <!-- border: 1px solid; -->
      <!-- padding: 7px 10px; -->
    <!-- } -->

    <!-- #right-btn { -->
      <!-- font-size: 18px; -->
      <!-- border-radius: 70px; -->
      <!-- border: 1px solid; -->
      <!-- padding: 7px 10px; -->
    <!-- } --> */
.fs-12 {
  font-size: 0.90rem !important;
}

.fs-16 {
  font-size: 1.2rem !important;
  font-family: 'Poppins', sans-serif;
}

.text-muted {
  color: #737376 !important;
  font-weight: normal;
  font-family: 'Poppins', sans-serif;
}

.card .card-header .card-title {
  margin: 0;
}

.suggestion-container {
  display: flex !important;
  gap: 10px !important;
  padding: 1px 8px;
  max-width: 100%;
}

.suggestion-container button.btn:first-child {
  position: relative;
}

/*.suggestion-container button.btn:first-child:after {
      content: 'calendar_today';
      font-family: 'Material Symbols Outlined';
      font-weight: normal;
      font-size: 18px;
      position: relative;
      left: auto;
      color: #013499;
      line-height: 1;
      right: 10px;
      margin-left: 5px;
  }*/

.suggestion-btn.book-appointment::after {
  content: 'calendar_today';
  /* Icon name for Material Icons */
  font-family: "Material Symbols Outlined";
  /* Material Icons font family */
  margin-left: 8px;
  /* Space between text and icon */
  vertical-align: middle;
  display: inline-block;
  font-size: 18px;
  position: relative;
  left: auto;
  line-height: 1;
}

/* .scroll-container { -->
      <!-- display: flex; -->
      <!-- overflow-x: auto; -->
      <!-- white-space: nowrap; -->
      <!-- scroll-behavior: smooth; Enables smooth scrolling -->
  <!-- }
  .row.input-box {
      margin-top: 10px;
  }
  /* Custom scrollbar for WebKit browsers (Chrome, Safari, Edge) */
/* ::-webkit-scrollbar {
      width: 4px;
  } */

::-webkit-scrollbar-thumb {
  background-color: #ddd;
  /* Scroll thumb color */
  border-radius: 8px;
  /* Rounded corners */
  border: 2px solid transparent;
  /* Transparent border for cleaner look */
  background-clip: content-box;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  /* Soft shadow */
}

::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.05);
  /* Light track background */
  margin: 2px 0;
}

/* Hide scrollbar arrows */
::-webkit-scrollbar-button {
  display: none;
}

/* Firefox */
/* * {
      scrollbar-width: thin;
      scrollbar-color: #ddd rgba(0, 0, 0, 0.05);
  } */

.v-dialog>div {
  position: absolute;
}

.fixed-bottom-buttons {
  position: fixed;
  bottom: 6px;
  width: 42.6rem;
  /* background-color: #fff !important; */
  padding: 10px 13px !important;
  box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.1);
  z-index: 10;
  align-items: center;
}

/* .apointmentMain .fixed-bottom-buttons {
      bottom: 50px;
  } */
.fixed-bottom-buttons button {
  font-weight: 600;
}

.title3,
.title4 {
  margin: 0 auto;
  text-align: center;
}

.otp-input-container {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.v-menu__content {
  left: 7% !important;
  left: 0;

  min-width: auto !important;
}

.form-control,
body select.form-control {
  color: #000000;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
}

.otp-input {
  width: 50px;
  height: 50px;
  font-size: 1.5rem;
  text-align: center;
  font-family: 'Poppins', sans-serif;
}

body input.form-control::placeholder,
body select.form-control::placeholder {
  color: #b0b0b0 !important;
  opacity: 1;
}



.form-control#idDOB {
  color: #b0b0b0;
  /* -webkit-text-fill-color: #b0b0b0; */
}

/* <!-- .form-control { -->
      <!-- color: #b0b0b0;  -->
  <!-- } --> */
.form-control.has-date {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

button.btn.p-3.slot-btn.mb-2 {
  width: 100%;
}

div#kt_chat_messenger_body {
  overflow: hidden;
}

footer.text-center.mt-6.h-10 {
  display: none;
}

main.max-w-screen-lg {
  height: 100% !important;
  width: 44.5rem;
  margin: auto;
}

input[type="date"]::-webkit-datetime-edit {
  text-align: left;
  /* Force left alignment for iOS */
  padding-left: 10px;
  /* Optional: Adjust padding for better appearance */
}

input[type="date"]::-webkit-datetime-edit-fields-wrapper {
  text-align: left;
  /* Ensure left alignment for wrapper */
}

input[type="date"]::-webkit-datetime-edit-text {
  text-align: left;
  /* Left-align the separator text (e.g., dashes or slashes) */
}

input[type="date"]::-webkit-datetime-edit-month-field,
input[type="date"]::-webkit-datetime-edit-day-field,
input[type="date"]::-webkit-datetime-edit-year-field {
  text-align: left;
  /* Ensure left alignment for date fields */
}

/* iOS-specific fix */
@supports (-webkit-appearance: none) and (not (appearance: none)) {
  .dob input[type="date"] {
    text-align: left !important;
  }
}

/* <!-- .suggestion-container { -->
      <!-- justify-content: end; -->
  <!-- } --> */

@media (max-width: 992px) {
  .suggestion-container {
    justify-content: flex-start;
  }

  .scroll-y {
    padding-bottom: 10px !important;
  }

  .text-center.bottom_fixed {
    position: fixed;
    bottom: 10px;
    z-index: 99;
  }
}

.typing-loader {
  /* padding: 10px 0px !important; */
  margin-bottom: 0;
  /* bottom: 160px; */
  width: 100%;
  background: transparent;
  z-index: 99;
  /* position: absolute; */
  padding-top: 0 !important;
  /* padding-left: 15px !important; */
}

.typing-dots {
  display: inline-block;
  margin-left: 5px;
}

.close_icn_top span.material-symbols-outlined {
  color: #f8f8f8;
  font-size: 2.6rem;
}

.close_icn_top {
  position: absolute;
  right: 15px;
  top: 15px;
}

.dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 0 2px;
  background-color: #999;
  border-radius: 50%;
  opacity: 0;
  animation: blink 1.5s infinite;
}

.dot:nth-child(1) {
  animation-delay: 0s;
}

.dot:nth-child(2) {
  animation-delay: 0.3s;
}

.dot:nth-child(3) {
  animation-delay: 0.6s;
}

@keyframes blink {

  0%,
  20% {
    opacity: 0;
  }

  20%,
  80% {
    opacity: 1;
  }

  80%,
  100% {
    opacity: 0;
  }
}

.cancelApoint {
  color: #F05423;
  position: relative;
  font-weight: bold;
}

.successApoint {
  color: #00AA2E;
  position: relative;
}

.errorApoint {
  color: red;
  position: relative;
}

.v-select.v-input--dense .v-select__selection--comma+.input-invalid {
  display: none;
}

.text-center.bottom_fixed {
  position: fixed;
  bottom: 10px;
  z-index: 99;
  width: 100%;
  left: 0;
  padding-top: 5px;
  color: #D882B3;
  pointer-events: none;
  font-family: 'Poppins', sans-serif;
}

.dob {
  position: relative;
}

.mdi-calendar {
  position: absolute;
  bottom: 10px;
  right: 20px;
  color: #6c757d;
  font-size: 21px;
  pointer-events: none;
  cursor: pointer;
}

input[type="date"] {
  -webkit-appearance: none;
  /* For Safari */
  -moz-appearance: textfield;
  /* For Firefox */
  appearance: none;
}

.input-invalid {
  border-color: red;
  /* Highlight invalid input */
}

.text-center.bottom_fixed span {
  color: #66053D !important;
  font-weight: 600;
}

.copyBtn {
  color: #A0ADC6;
  cursor: pointer;
  position: relative;
}

.copyBtn::after {
  content: "Copy to Clipboard";
  position: absolute;
  background-color: #fff;
  color: #000;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
  pointer-events: none;
  font-family: 'Poppins', sans-serif;
  right: 3rem;
  border: 1px solid #BCC1CA;
  box-shadow: 0px 4px 4px 0px #00000040;
}

.copyBtn:hover::after {
  opacity: 1;
  visibility: visible;
}

.copyBtnOptical {
  color: #A0ADC6;
  cursor: pointer;
  position: relative;
}

.copyBtnOptical::after {
  content: "Copy to Clipboard";
  position: absolute;
  background-color: #fff;
  color: #000;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
  pointer-events: none;
  font-family: 'Poppins', sans-serif;
  right: 115%;
  border: 1px solid #BCC1CA;
  box-shadow: 0px 4px 4px 0px #00000040;
}

.copyBtnOptical:hover::after {
  opacity: 1;
  visibility: visible;
}

.hiddenDiv {
  display: none !important;
}

button#restart_button {
  margin: 0 auto;
  width: 100%;
}

button#restart_button::after {
  content: 'restart_alt';
  /* Changed from 'calendar_today' to 'restart_alt' */
  font-family: "Material Symbols Outlined";
  margin-left: 8px;
  vertical-align: middle;
  display: inline-block;
  font-size: 18px;
  position: absolute;
  left: auto;
  color: #ffffff;
  line-height: 1;
}

#slotDuration_header {
  color: #63738F;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  text-align: center;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
}

.restart-button {
  color: #ffffff !important;
  /* margin-bottom: 14px; */
  font-family: 'Poppins', sans-serif;
}

.noSlot {
  font-family: 'Poppins';
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 24.2px;
  letter-spacing: 0.2336047738790512px;
  text-align: center;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  color: #000;
}

#CanResBtnId:disabled {
  background-color: #B80E74;
  color: #76A2DF !important;
  cursor: not-allowed;
  /* Change the cursor to indicate it's disabled */
}

#ApptNotSelectedMsgId {
  color: red !important;
  position: relative;
  width: 100%;
  bottom: 1rem;
  font-size: 1rem;
  text-align: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

#SlotNotSelectedMsgId {
  color: red !important;
  position: relative;
  width: 100%;
  bottom: 1rem;
  font-size: 1rem;
  text-align: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

#currentStep8Validation {
  color: red !important;
  position: relative;
  width: 100%;
  bottom: 1rem;
  font-size: 1rem;
  text-align: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

#ApptStatusConfirmedValidation {
  color: red !important;
  position: relative;
  width: 100%;
  bottom: 1rem;
  font-size: 1rem;
  text-align: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

@media screen and (min-width: 1920px) {
  .outer-slot-container {
    height: 65vh;
  }

  .insuranceMain {
    height: calc(100vh - 26.4rem) !important;
  }

  .textarea-div {
    display: flex;
    width: 99.3%;
    border: 1px solid #ccc;
    border-radius: 7px;
    align-items: center;
  }

  .mainInsuranceDiv {
    height: calc(100vh - 24rem);
  }

  .modal {
    height: calc(100vh - 6.2rem) !important;
  }
}

.dob {
  position: relative;
}

input[type="text"]::placeholder {
  color: #b0b0b0;
}


.custom-placeholder {
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  color: #b0b0b0;
  pointer-events: none;
  font-size: 14px;
  padding: 5px 0px;
  background: #fff;
}

.input-container {
  position: relative;
}

/* To ensure the input content doesn't overlap with the custom placeholder */
/* input[type="date"] {
        padding-left: 10px;
      } */
/* <!-- input[type="date"]::placeholder { -->
    <!-- color: #b0b0b0;  -->
    <!-- font-style: italic; -->
    <!-- opacity: 1; -->
  <!-- } -->

  <!-- input[type="date"]::-webkit-datetime-edit { -->
    <!-- color: transparent;  -->
  <!-- } -->

  <!-- input[type="date"]::-webkit-datetime-edit-text, -->
  <!-- input[type="date"]::-webkit-datetime-edit-month-field, -->
  <!-- input[type="date"]::-webkit-datetime-edit-day-field, -->
  <!-- input[type="date"]::-webkit-datetime-edit-year-field { -->
    <!-- color: #b0b0b0;-->
    <!-- font-style: normal; -->
  <!-- } -->

  <!-- input[type="date"]:focus::-webkit-datetime-edit { -->
    <!-- color: #000;
  <!-- } --> */

input#idDOB.has-date+.mdi-calendar+span#dob-placeholder {
  display: none;
}

.validation-message-for-slotNotAvailable {
  color: red;
  position: relative;
  width: fit-content;
  /* display: none !important; */
  bottom: 1rem;
  font-size: 1.2rem;
  text-align: center;
  margin: 0 auto;
  left: auto;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
}

.dob {
  position: relative;
}

input[type="text"]::placeholder {
  color: #b0b0b0;
}

.title3 .v-date-picker-table .v-btn .v-btn__content {
  font-size: 1.2rem;
  font-weight: 600;
}

.v-application .accent {
  background-color: #B90E75 !important;
  border-color: #B90E75 !important;
}

.v-application .accent--text {
  color: #B80E74 !important;
  caret-color: #B80E74 !important;
}

.title3 v-date-picker-header__value button {
  font-size: 1.4rem;
}

.title3 .v-btn--icon.v-size--default .v-icon {
  position: static;
}

.title3 .v-date-picker-header__value {
  font-size: 1.3rem;
}

.v-application .accent--text {
  color: #B80E74 !important;
  caret-color: #B80E74 !important;
}

.custom-placeholder {
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  color: #b0b0b0;
  pointer-events: none;
  font-size: 14px;
  padding: 5px 0px;
  background: #fff;
  padding-right: 30px;
}

.input-container {
  position: relative;
}

input[type="date"]::-webkit-datetime-edit {
  padding: 0;
  margin: 0;
  border: 0;
  text-align: left;
}

.apointmentMain .fixed-bottom-buttons .d-flex.flex-row.justify-content-center.align-items-center.w-100 {
  max-width: 100% !important;
}

/* <!-- input[type="date"]::placeholder { -->
    <!-- color: #b0b0b0;  -->
    <!-- font-style: italic; -->
    <!-- opacity: 1; -->
  <!-- } -->

  <!-- input[type="date"]::-webkit-datetime-edit { -->
    <!-- color: transparent;  -->
  <!-- } -->

  <!-- input[type="date"]::-webkit-datetime-edit-text, -->
  <!-- input[type="date"]::-webkit-datetime-edit-month-field, -->
  <!-- input[type="date"]::-webkit-datetime-edit-day-field, -->
  <!-- input[type="date"]::-webkit-datetime-edit-year-field { -->
    <!-- color: #b0b0b0;-->
    <!-- font-style: normal; -->
  <!-- } -->

  <!-- input[type="date"]:focus::-webkit-datetime-edit { -->
    <!-- color: #000;
  <!-- } --> */
.v-picker__title__btn.v-date-picker-title__year {
  /* color: #fff !important; */
  opacity: 1;
}

.input-invalid+span.mdi.mdi-calendar {
  background: transparent !important;
}

input#idDOB:focus+.mdi-calendar+span#dob-placeholder {
  display: none;
}

input#idDOB.has-date+.mdi-calendar+span#dob-placeholder {
  display: none;
}

.input-invalid+.mdi-calendar+span#dob-placeholder {
  display: none;
}

.v-input input {
  max-height: 37px;
  min-height: 37px;
  border-radius: 4px;
}

.v-application--is-ltr .v-text-field .v-label {
  transform-origin: top left;
  z-index: 1;
}

.textarea-class:focus {
  box-shadow: none;
}

.leaveHeader {
  font-weight: 500;
  font-size: 1.2rem;
  font-family: 'Poppins';
}

.leaveText {
  font-weight: 500;
  font-size: 1rem;
  font-family: 'Poppins';
}

.cancelBtn {
  border: 1px solid #B80E74 !important;
  background: none !important;
  color: #B80E74 !important;
  font-size: 1rem;
  font-weight: 500;
  font-family: 'Poppins';
}

.leaveBtn {
  background: #B80E74 !important;
  color: #fff !important;
  font-size: 1rem;
  font-weight: 500;
  font-family: 'Poppins';
  border: 1px solid #B80E74 !important
}
.leaveBtn:hover {
  background: #B80E74 !important;
  color: #fff !important;
  font-size: 1rem;
  font-weight: 500;
  font-family: 'Poppins';
  border: 1px solid #B80E74 !important
}
.leaveOtpBtn {
  background: #fff !important;
  color: #B80E74 !important;
  font-size: 1rem;
  font-weight: 500;
  font-family: 'Poppins';
  border: 1px solid #B80E74 !important
}
.leaveOtpBtn:hover {
  background: #d10b82 !important;
  color: #fff !important;
  font-size: 1rem;
  font-weight: 500;
  font-family: 'Poppins';
  border: 1px solid #B80E74 !important
}
.resendBtn {
  background: #B80E74 !important;
  color: #fff;
  font-size: 1rem;
  font-weight: 500;
  font-family: 'Poppins';
  border: 1px solid #B80E74 !important
}

#countdown {
  font-size: 16px;
  color: #333;
}

#resend {
  font-size: 14px;
  color: #B80E74;
  cursor: pointer;
}

#otp-container {
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 600;
  color: #48505E;
}

.disabledResendBtn {
  cursor: no-drop !important;
  opacity: 0.8;
  text-decoration: none;
}

/* @media (min-width:1200px) {
    .v-application .title .validation-div + div {
      max-height: 60vh;
      overflow-y: auto;
  }
  } */

.insuranceUploadBtn {
  position: absolute;
  font-size: 50px;
  opacity: 0;
  right: 0;
  top: 0;
}

@media (max-width: 767px) {
  iframe {
    max-width: 100%;
  }

  .tab-content {
    height: calc(100vh - 29rem) !important;
  }

  /* .form-control#idDOB.has-date {
       <!-- appearance: none; Remove default mobile styles (if needed) -->
      text-align: left !important;
      display: flex;
          justify-content: start;
          margin: 0;
          padding-left: 0;
  } */
  main.max-w-screen-lg {
    height: 100% !important;
    overflow: hidden;
    width: 100%;
  }

  .scroll-y {
    min-height: calc(100vh - 210px);
  }

  .suggestion-container {
    justify-content: flex-start;
  }

  .typing-loader {
    /* bottom: 145px; */
    max-width: 97%;
  }

  .three-dot-loader {
    width: 54.3vh !important;
    height: calc(100vh - 36.7rem) !important;
  }

  .theme--light.v-application {
    background: #fff !important;
    color: rgba(0, 0, 0, .87);
    height: 100%;
    width: 100%;
    z-index: 99;
    position: fixed;
    top: 60px;
    padding: 10px;
  }

  .fixed-bottom-buttons {
    position: fixed;
    bottom: 6px;
    width: 100%;
    /* background-color: #fff !important; */
    padding: 10px 13px !important;
    box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.1);
    z-index: 10;
    align-items: center;
    left: 0;
    margin-left: 0;
  }

  .v-application .title .validation-div+div {
    margin-top: 30px;
    height: calc(100vh - 12.6rem);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .mainInsuranceDiv {
    height: calc(100vh - 16rem) !important;
    scrollbar-width: thin;
  }

  .insuranceDiv {
    width: 31rem !important;
    background: #DEE9FF;
    margin: 10px auto;
    border-radius: .5rem;
    font-size: 1.2rem;
    font-family: 'Poppins';
    font-weight: 600;
  }

  .insuranceDivNew {
    width: 32rem !important;
    margin: 10px auto;
    border-radius: .5rem;
    font-size: 1.2rem;
    font-family: 'Poppins';
    font-weight: 600;
    border: 1px solid #D0D5DD;
    box-shadow: 0px 1px 2px 0px #1018280D;
  }

  /* #idDOB{
    padding-left: 13px !important;
  } */
}

@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) and (not (max-device-width: 600px)) {

  div#kt_chat_messenger_header {
    position: absolute;
    width: 100%;
    top: 0;
  }

  .scroll-y {
    padding-top: 70px !important;
  }
}

@media (max-width: 900px) and (orientation: landscape) {

  .fixed-bottom-buttons {
    position: relative;
    margin-top: 50px !important;
  }

  .submit {
    width: 100%;
  }

  @media only screen and (max-width: 1024px) and (hover: none) and (pointer: coarse) and (-webkit-min-device-pixel-ratio: 2),
  (min-resolution: 192dpi) {

    /* Styles for high-DPI smartphones in landscape */
    body {
      transform: scale(0.9);
      /* Adjust as needed */
      transform-origin: top left;
    }
  }
}

@media only screen and (device-width: 1080px) and (device-height: 2400px) and (aspect-ratio: 20/9) and (orientation: landscape) {

  /* Vivo 100-specific styles */
  .fixed-bottom-buttons {
    position: relative;
    margin-top: 50px !important;
  }
}

@media only screen and (max-width: 1024px) and (max-height: 600px) and (orientation: landscape) and (hover: none) and (pointer: coarse) {

  /* Styles for all smartphones in landscape mode */
  .fixed-bottom-buttons {
    position: relative;
    margin-top: 50px !important;
  }

  .submit {
    width: 100%;
  }
}

@media (max-width: 1280px) and (orientation: landscape) {
  .scroll-y {
    padding-bottom: 140px !important;
  }
}

@media (min-width:768px) and (max-width: 992px) {
  .suggestion-container {
    justify-content: flex-start;
  }

  .scroll-y {
    padding-bottom: 140px !important;
  }

  .text-center.bottom_fixed {
    position: fixed;
    bottom: 10px;
    z-index: 99;
  }

  .fixed-bottom-buttons {
    bottom: 15px;
  }
}

@media (max-width: 390px) {
  .chatbotHeader {
    font-size: 1.60rem !important;
  }

  .close_icn_top span.material-symbols-outlined {
    font-size: 2.3rem;
  }

  .menuIcon span.material-symbols-outlined {
    font-size: 2.3rem !important;
  }
}

.camera-container {
  font-family: Arial, sans-serif;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20px;
}

#video {
  border: 2px solid #ddd;
  width: 320px;
  height: 240px;
  background-color: #000;
  display: block;
}

.chat-box {
  margin-top: 20px;
  width: 400px;
  height: 400px;
  border: 1px solid #ccc;
  padding: 10px;
  overflow-y: scroll;
  background-color: #f9f9f9;
}

.message {
  margin-bottom: 10px;
}

.captured-image {
  max-width: 100%;
}

.input-area {
  margin-top: 20px;
  width: 400px;
  display: flex;
}

/* input[type="text"] {
    flex-grow: 1;
    padding: 10px;
  } */

.cameraBtn {
  padding: 10px;
  background-color: #007BFF !important;
  color: white;
  cursor: pointer;
  border: none;
  border-radius: 5px;
  line-height: 1.5rem;
}

.cameraBtn:hover {
  background-color: #0056b3 !important;
}

#capture-btn {
  margin-top: 10px;
  padding: 10px;
  background-color: #28a745;
  color: white;
  cursor: pointer;
}

#capture-btn:hover {
  background-color: #218838;
}

.modal {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100vh - 6.7rem);
  background-color: rgba(0, 0, 0, 0.7);
  display: none;
  justify-content: center;
  align-items: center;
}

.modal-content {
  border-radius: 10px;
  position: relative;
  overflow-y: hidden;
}

.modal-content img {
  width: 100%;
  height: 100%;
}

.close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  font-size: 2rem;
  font-weight: bold;
  cursor: pointer;
}

.close:hover {
  color: #007BFF;
}

.insuranceTitleName {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.mainInsuranceDiv {
  height: calc(100vh - 24rem);
  overflow-y: auto;
  overflow-x: hidden;
}

.mainInsuranceDiv .modal-content {
  border-radius: 10px;
  position: relative;
  overflow-y: hidden;
  width: 40rem;
}

.photoBtn {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 17px;
}

.uploadInsuranceBtn {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 17px;
}

.previewEyeSymbol {
  cursor: pointer;
  font-size: 2.7rem;
  color: #B80E74;
}

.insuranceUser {
  font-size: 16px;
  font-weight: 600;
}

.insurance-container {
  /* max-height: 40vh; */
  overflow-y: auto;
}

.insurance-card {
  /* border: 1px solid #D0D5DD; */
  border-radius: 4px;
  padding: 10px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  width: 32rem;
  margin: 10px auto;
  background-color: #CFEBFF !important;
}

.insurance-card .details span {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  color: #000000;
  display: flex;
  width: 30.4rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.insurance-card .details span span {
  font-weight: 600;
}

.insuranceMain {
  height: calc(100vh - 26rem);
  overflow-y: auto;
  scrollbar-width: none;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
}

.suggestion-container::-webkit-scrollbar {
  height: 4px;
  /* Width of the scrollbar */
}

.suggestion-container::-webkit-scrollbar-thumb {
  background: #ddd;
  /* Color of the scrollbar thumb */
  border-radius: 10px;
  /* Make the thumb rounded */
}

.suggestion-container::-webkit-scrollbar-thumb:hover {
  background: #ccc;
  /* Darker color when hovered */
}

.scroll-y::-webkit-scrollbar {
  width: 6px;
  /* Width of the scrollbar */
}

.scroll-y::-webkit-scrollbar-thumb {
  background: #ddd;
  /* Color of the scrollbar thumb */
  border-radius: 10px;
  /* Make the thumb rounded */
}

.scroll-y::-webkit-scrollbar-thumb:hover {
  background: #ccc;
  /* Darker color when hovered */
}

.outer-slot-container::-webkit-scrollbar {
  width: 6px;
  /* Width of the scrollbar */
}

.outer-slot-container::-webkit-scrollbar-thumb {
  background: #ddd;
  /* Color of the scrollbar thumb */
  border-radius: 10px;
  /* Make the thumb rounded */
}

.outer-slot-container::-webkit-scrollbar-thumb:hover {
  background: #ccc;
  /* Darker color when hovered */
}


.v-date-picker-title__year {
  margin-bottom: 0 !important;
}

@media (max-width: 1024px) and (hover: none) {
  .toaster {
    display: none !important;
  }
}

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
  -webkit-appearance: none;
  opacity: 0;
}

.error-message {
  color: red;
  margin-top: 5px;
  font-family: 'Poppins';
  font-size: 1.2rem;
  font-weight: 600;
  text-align: center;
}

.delete-btn {
  cursor: pointer;
}

.tooltip-icon-closeEvaa {
  position: relative;
  cursor: pointer;
}

.tooltip-icon-closeEvaa::after {
  content: "Close Evaa";
  position: absolute;
  background-color: #fff;
  color: #000;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
  pointer-events: none;
  font-family: 'Poppins';
  right: 100%;
  border: 1px solid #BCC1CA;
  box-shadow: 0px 4px 4px 0px #00000040;
  width: fit-content;
  z-index: 1;
}

.tooltip-icon-closeEvaa:hover::after {
  opacity: 1;
  visibility: visible;
}

.tooltip-icon-closeform::after {
  content: "Close Form";
  position: absolute;
  background-color: #fff;
  color: #000;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
  pointer-events: none;
  font-family: 'Poppins';
  right: 100%;
  border: 1px solid #BCC1CA;
  box-shadow: 0px 4px 4px 0px #00000040;
  width: fit-content;
  z-index: 1;
  margin-right: 5px;
  line-height: 1rem;
}

.tooltip-icon-closeform:hover::after {
  opacity: 1;
  visibility: visible;
}

.tooltip-icon-send {
  position: relative;
  cursor: pointer;
}

.tooltip-icon-send::after {
  content: "Send";
  position: absolute;
  background-color: #fff;
  color: #000;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
  pointer-events: none;
  font-family: 'Poppins';
  right: 100%;
  border: 1px solid #BCC1CA;
  box-shadow: 0px 4px 4px 0px #00000040;
  width: fit-content;
  z-index: 1;
}

.tooltip-icon-send:hover::after {
  opacity: 1;
  visibility: visible;
}

.menuIcon {
  position: absolute;
  left: 15px;
  top: 15px;
  text-decoration: none;
}

.menu-dropdown {
  display: none;
  position: absolute;
  background: #FFFFFF;
  color: #fff;
  padding: 10px;
  border-radius: 10px;
  top: 45px;
  left: 15px;
  box-shadow: 0px 4px 4px 0px #737373;
  font-family: 'Poppins';
}

.menu-dropdown ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu-dropdown ul li {
  padding: 10px;
}

.menu-dropdown ul li a {
  color: #000000 !important;
  text-decoration: none !important;
}

.menu-dropdown.show {
  display: block;
}

.menu-dropdown ul li span {
  margin-right: 10px;
  /* Adds spacing between the icon and text */
  color: #fff;
}

.menu-dropdown ul li:hover {
  background-color: #E4EFFF;
  border-radius: 10px;
}

.menu-dropdown ul li.disabled {
  opacity: 0.5;
  /* Make it look faded */
  pointer-events: none;
  /* Disable clicks */
  cursor: not-allowed;
  background: none;
  /* No hover effect */
}

#emailModal {
  display: none;
  /* height: 100% !important;
      width: 100%; */
  margin: auto;
  height: calc(100vh - 0rem) !important;
}

#emailModal .modal-content {
  height: fit-content;
  width: 35rem;
  margin: auto;
  position: absolute;
  display: flex;
  align-items: center;
}

.emailTranscriptText {
  color: #2A66DD;
  font-family: 'Poppins';
  font-weight: 600;
  font-size: 2rem;
  line-height: 1.5rem;
  letter-spacing: 0%;
  text-align: center;
}

.youNeedText {
  font-family: 'Poppins';
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 24px;
  letter-spacing: 0%;
  text-align: center;

}

.confirmLabel {
  font-family: 'Poppins';
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 24px;
  letter-spacing: 0%;
  color: #000;
}

.cancelEmailTranscrpit {
  border: 1px solid #B80E74 !important;
  color: #B80E74;
  font-family: 'Poppins';
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 20px;
  letter-spacing: 0%;
  width: 9rem;
}

.cancelEmailTranscrpit:focus {
  border-color: #86b7fe !important;
  outline: 0 !important;
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25) !important;
  color: #B80E74 !important;
}

.sendEmailTranscrpit:focus {
  border-color: #86b7fe !important;
  outline: 0 !important;
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25) !important;
  background: #B80E74 !important;
  color: #fff !important;
}

.sendEmailTranscrpit {
  background: #B80E74;
  border: 1px solid #B80E74 !important;
  color: #fff;
  font-family: 'Poppins';
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 20px;
  letter-spacing: 0%;
  width: 9rem;
  margin-left: 1rem;
}

.cancelEmailTranscrpit:hover {
  border: 1px solid #B80E74 !important;
  color: #B80E74;
  font-family: 'Poppins';
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 20px;
  letter-spacing: 0%;
  width: 9rem;
}

.sendEmailTranscrpit:hover {
  background: #B80E74;
  border: 1px solid #B80E74 !important;
  color: #fff;
  font-family: 'Poppins';
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 20px;
  letter-spacing: 0%;
  width: 9rem;
  margin-left: 1rem;
}

#popupModal {
  height: calc(100vh - 0rem) !important;
  width: 100%;
  margin: auto;
}

#popupModal .modal-content {
  height: fit-content;
  width: 35rem;
  margin: auto;
  position: absolute;
  display: flex;
  align-items: center;
}

.emailSentSuccessIcon {
  color: #3CB972;
  font-size: 9rem;
}

.img-fluid {
  border-radius: 2rem;
}

.send-btn {
  font-size: 2.6rem;
}

.transcriptIcon {
  font-size: 4rem;
  color: #B80E74;
  border: 4px solid #B80E74;
  border-radius: 50%;
  padding: .8rem;
}

.v-date-picker-header__value button {
  font-size: 1.4rem;
}

.v-btn__content {
  font-size: 1.2rem;
  font-family: 'Poppins';
}

.v-date-picker-table--date th {
  font-size: 1.2rem;
  font-family: 'Poppins';
}

.welcome-note {
  color: slategray;
  font-style: italic;
  font-size: .9rem;
  font-weight: 500;
}

.three-dot-loader {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
  padding: 20px;
  border-radius: 8px;
  z-index: 9999;
  width: 50vh;
  height: calc(100vh - 48rem);
}

.dot1 {
  width: 10px;
  height: 10px;
  margin: 5px;
  background-color: white;
  border-radius: 50%;
  display: inline-block;
  animation: bounce 1.4s infinite;
}

.dot1:nth-child(1) {
  animation-delay: 0s;
}

.dot1:nth-child(2) {
  animation-delay: 0.2s;
}

.dot1:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes bounce {

  0%,
  80%,
  100% {
    transform: scale(0);
    opacity: 0.3;
  }

  40% {
    transform: scale(1);
    opacity: 1;
  }
}

.feedback-icons span.disabled {
  pointer-events: none;
  opacity: 0.5;
  cursor: not-allowed;
}

body {
  font-family: Verdana, sans-serif;
  background-image: url(ChatBot_BG.jpg);
  background-repeat: no-repeat;
}

#chatbot-icon {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  z-index: 1000;
}

#chatbot-icon img {
  width: 60px;
  height: 60px;
}

#chatbot-container {
  display: none;
  position: fixed;
  bottom: 100px;
  right: 20px;
  width: 423px;
  height: 651px;
  border: 1px solid #ccc;
  border-radius: 10px;
  background-color: white;
  z-index: 1001;
  overflow: auto;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

#chatbot-home {
  display: block;
  border: 1px solid #ccc;
  border-radius: 10px;
  z-index: 1001;
  overflow: auto;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  background: linear-gradient(180deg, hsla(220, 99%, 31%, 1) 50%, hsla(0, 0%, 100%, 1) 94%);
}

#chatbot-header {
  background-color: #013499 !important;
  color: white;
  padding: 20px;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: none;
}

#close-chatbot {
  cursor: pointer;
}

#chatbot-messages {
  height: 470px;
  overflow-y: auto;
  padding: 10px;
}

#chatbot-input {
  display: flex;
  padding: 10px;
}

#user-input {
  flex-grow: 1;
  margin-right: 10px;
  padding: 10px;
  border: none;
}

#send-button {
  padding: 5px 10px;
  color: #013499;
  border: none;
  cursor: pointer;
  background: none;
}

.message {
  margin-bottom: 15px;
  padding: 10px;
  border-radius: 8px;
  width: fit-content;
  word-wrap: break-word;
}

.user-message {
  background: #2A66DD;
  font-family: 'Poppins';
  font-size: 15px;
  font-weight: 400;
  line-height: 21px;
  text-align: left;
  margin-left: auto;
  color: white;
}

.bot-message {
  /* background: #F2F1ED; */
  font-family: 'Poppins';
  font-size: 15px;
  /* font-weight: 400; */
  line-height: 21px;
  text-align: left;
  margin-right: auto;
}

.source-links {
  margin-top: 10px;
  font-size: 0.9em;
}

.source-link {
  display: block;
  margin-bottom: 5px;
  color: #007bff;
  text-decoration: none;
}

.source-link:hover {
  text-decoration: underline;
}

#video-popup {
  display: none;
  position: fixed;
  bottom: 200px !important;
  right: 500px;
  width: 820px;
  background-color: white;
  padding: 10px;
  border-radius: 10px;
  z-index: 1002;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

#close-video {
  position: absolute;
  top: 5px;
  right: 10px;
  cursor: pointer;
  font-size: 20px;
}

#video-container {
  width: 100%;
  height: 100%;
}

@media (max-width: 1200px) {
  #video-popup {
    right: 20px;
    bottom: 570px;
  }
}

.input-chatbot {
  margin-top: 40px;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  position: relative;
}

input:focus-visible {
  outline: none;
}

.bot-message-wrapper {
  display: flex;
  align-items: flex-end;
}

.circle {
  background-color: #FAD5A5;
  border-radius: 50%;
  align-content: flex-end;
  width: 25px;
  height: 25px;
  display: flex;
  font-family: 'Poppins';
  font-size: 24px;
  color: white;
  position: relative;
  margin-right: 5px;
  bottom: 13px;
}

.container {
  max-width: 800px;
  /* margin: auto; */
  background: white;
  padding: 20px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  margin-top: 87px;
  margin-left: 303px;
}

h1 {
  color: #333;
}

.note {
  color: red;
}

.first-img {
  width: 74.83px;
  height: 40.83px;
  gap: 0px;
  opacity: 0px;
}

.text-hello {
  margin-top: 2rem;
  margin-left: 1rem;
  font-size: 2.5rem;
  font-family: 'Poppins';
  font-weight: 600;
  line-height: 2rem;
  text-align: left;
  color: #F8F8F8;
}

.text-help {
  margin-left: 1rem;
  font-family: 'Poppins';
  font-size: 2rem;
  font-weight: 600;
  line-height: 4.5rem;
  text-align: left;
  color: #F8F8F8;
}

.chatbot-inner-container {
  background-color: white;
  border-radius: 6px;
  margin-left: 27px;
  margin-top: 19px;
  padding: 15px;
  box-shadow: 2px 2px 15px 0px #0000001A;
  width: 320px;
  padding: 22px 24px 22px 24px;
  gap: 10px;
  border-radius: 10px;
}

.second-img {
  width: 42px;
  height: 26px;
  margin-top: 9px;
}

.chatbot-inner-text {
  font-family: 'Poppins';
  font-size: 16px;
  font-weight: 600;
  line-height: 22.4px;
  text-align: left;
}

.homeCardBody {
  height: 397px;
}

.mainCard {
  width: 100%;
  height: 100%;
}

.card-footer {
  padding-top: 6px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  border-top: 3px solid aliceblue;
  margin-top: 22px;
}

#back-home {
  cursor: pointer;
}

/* Image showing css */
.image-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.pdf-preview-image-wrapper {
  flex: 0 0 auto;
  cursor: pointer;
}

.pdf-preview-image {
  max-width: 100px;
  max-height: 100px;
  object-fit: cover;
  transition: all 0.3s ease;
}

.pdf-preview-image-wrapper.enlarged {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.pdf-preview-image-wrapper.enlarged .pdf-preview-image {
  max-width: 90%;
  max-height: 90%;
  object-fit: contain;
}

@media (max-width: 1200px) {
  #video-popup {
    right: 20px;
    bottom: 570px;
  }
}

.qna-source {
  font-size: 0.9em;
  color: #666;
  margin-top: 5px;
  padding: 5px;
  background-color: #f0f0f0;
  border-radius: 5px;
}

.chatHomecontainer {
  max-width: 25rem;
  /*margin: auto;*/
  padding-top: 20px;
  font-family: 'Poppins';
}

iframe {
  width: 100%;
}

img {
  max-width: 100%;
}

.card {
  border-radius: 12px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  margin-bottom: 15px;
  position: relative;
}

.contentCard {
  max-width: 40em;
}

.search-bar {
  display: flex;
  align-items: center;
  padding: 10px;
  background: white;
  border-radius: 12px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.search-bar input {
  border: none;
  outline: none;
  width: 100%;
  padding-left: 10px;
}

.video-card {
  position: relative;
  /* text-align: center; */
}

.video-card .play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #ffc107;
  padding: 12px;
  border-radius: 50%;
  font-size: 24px;
  color: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  width: 64px;
  text-align: center;
}

.editor-container {
  display: none;
}

/* a {
          text-decoration: none;
          color: black;
      } */

span.badge {
  background: #E5EEFF;
  color: #3047EC;
  display: inline-block;
  width: max-content;
  border-radius: .5rem;
}

.ql-snow.ql-toolbar button {
  position: relative;
}

/* .drag-handle {
              position: absolute;
              top: 10px;
              left: -30px;
              cursor: grab;
              font-size: 18px;
              color: #6c757d;
          } */
.draft-label {
  font-size: 12px;
  color: #6c757d;
  margin-bottom: 10px;
  display: block;
  background: #ffd3d0;
  padding: 8px 12px;
  border-radius: 12px;
}

.ql-audio::before {
  content: '🎵';
  position: absolute;
  top: 0;
  left: 2px;
}

.sendIcon {
  color: #3047EC;
}

.searchIcon {
  color: #3047EC;
}

.rightArrowIcon {
  color: #3047EC;
}

.playIcon {
  color: #fff;
}

.headerText {
  font-size: 1.16rem;
  font-weight: 600;
}

.recentSubText {
  font-size: 1rem;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 20rem;
}

.chatbotTimeText {
  font-size: 1rem;
  font-weight: 400;
  color: #6c757d !important;
}

.homeTab {
  height: calc(100vh - 54px);
  overflow: auto;
}

.homeFooter {
  display: flex;
  justify-content: space-around;
  background: #fff;
  height: 4rem;
  align-items: center;
}

.paymentModalBody {
  text-align: center;
  font-size: 1.6rem;
  font-weight: 500;
  font-family: Poppins;
}

.backPaymentBtn {
  border: 1px solid #B80E74 !important;
  color: #B80E74 !important;
  font-weight: 600;
  font-family: 'Poppins';
  font-size: 1.2rem;
  width: 45%;
}

.continuePaymentBtn {
  border: 1px solid #B80E74 !important;
  background: #B80E74 !important;
  color: #fff !important;
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 600;
  width: 45%;
}

#paymentModal {
  height: 100vh;
}

.form-check-input:checked {
  background-color: #B80E74 !important;
  border-color: #B80E74 !important;
  box-shadow: 0 0 0 .25rem #F9D4EB;
}

.form-check-input {
  width: 1.4rem !important;
  height: 1.4rem !important;
}

.selfPayLabel {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

.form-check .form-check-input {
  margin-left: -0.5em !important;
  border-color: #aaa;
}

.selfPayModal.show {
  display: flex !important;
}

.selfPayHeader {
  font-size: 1.5rem;
  font-family: 'Poppins';
  font-weight: 600;
}

.selfPayBody {
  font-size: 1.2rem;
  font-family: 'Poppins';
  color: #686868;
}

.selfPayInsuranceBtn {
  border: 1px solid #B80E74 !important;
  color: #B80E74 !important;
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 600;
  padding: .55rem 1rem !important;
}

.selfPayBookingBtn {
  border: 1px solid #B80E74 !important;
  color: #fff !important;
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 600;
  background: #B80E74 !important;
}

.video-link {
  color: #0d6efd;
  text-decoration: underline;
}

.contact-link {
  color: #0d6efd;
  text-decoration: underline;
}

.pdf-link {
  color: #0d6efd;
  text-decoration: underline;
}

.insuranceButtonTitle {
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 14px;
  text-align: left;
  color: #48505E;
}

#insurancePRN {
  position: relative;
  z-index: 1;
}

.disabled-style {
  opacity: 0.5;
  cursor: no-drop !important;
  color: #fff !important;
}

.your-balance-button {
  border: 1px solid #B0B0B0 !important;
  color: #48505E !important;
  font-size: 1rem;
  font-family: 'Poppins';
  font-weight: 500;
}

.selectPayment {
  color: #48505E !important;
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 500;
}

.btn-check:checked+.your-balance-button,
.your-balance-button.active,
.your-balance-button.show,
.your-balance-button:first-child:active,
:not(.btn-check)+.your-balance-button:active {
  background-color: #3CB972 !important;
  color: #fff !important;
  border-color: #3CB972 !important;
}

.vue-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
}

.vue-modal-content {
  background-color: #fff;
  padding: 2rem;
  border-radius: 8px;
  max-width: 400px;
  width: 90%;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}

#cardTitleDisplay {
  color: #F8F8F8 !important;
  user-select: none;
  pointer-events: none;
  font-family: 'Poppins', sans-serif;
  text-decoration: none !important;
}

.custom-date-wrapper {
  position: relative;
}

.custom-date-input {
  padding-right: 2rem;
}

.calendar-icon {
  right: 9px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  z-index: 4;
  width: 16px;
  height: 16px;
  color: #6c757d;
}

.coverage-date-placeholder {
  position: absolute;
  left: .8rem;
  top: 70%;
  transform: translateY(-50%);
  color: #b0b0b0;
  pointer-events: none;
  z-index: 3;
  background: #fff;
  padding-right: 3rem;
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 500;
}

.coverage-date-input:focus+.coverage-date-placeholder,
.coverage-date-input:not(:placeholder-shown)+.coverage-date-placeholder {
  display: none;
}

.insuranceNote {
  color: #7E55C4;
  font-weight: 600;
  font-size: 1rem;
}

.insuranceNote span {
  font-weight: 500;
}

.text-purple {
  font-family: 'Poppins';
  font-size: 1rem;
  font-weight: 600;
  color: #7E55C4;
}

.uploadText {
  color: #B0B0B0;
  font-size: 1rem;
  font-family: 'Poppins';
  font-weight: 500;
}

.upload-box {
  border: 1px solid #E5E5E5;
  border-radius: 8px;
}

.uploadBtn {
  color: #B80E74;
}

.Capturebtn {
  background-color: rgb(185, 14, 117);
  color: rgb(255, 255, 255);
  font-size: 1.2rem;
  font-family: 'Poppins';
  padding: .5rem 2rem;
  border-radius: .5rem;
}

.fileWarningpopup {
  width: fit-content;
  padding: 2rem;
  font-family: 'Poppins';
  font-size: 1.2rem;
}

.infoMainDiv {
  background-color: #DDFEEB;
  border-radius: 50%;
  padding-top: .8rem;
  padding-left: .8rem;
  padding-right: .8rem;
  padding-bottom: .3rem;
}

.warningMainDiv {
  background-color: #FFEEC1;
  border-radius: 50%;
  padding-top: .8rem;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-bottom: .5rem;
}

.insuranceDiv {
  width: 39rem;
  background: #DEE9FF;
  margin: 10px auto;
  border-radius: .5rem;
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 600;
}

.toggle-switch {
  position: relative;
  width: 8rem;
  height: 2.5rem;
  display: inline-block;
}

.toggle-switch input {
  display: none;
}

.slider {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  border-radius: 40px;
  border: 2px solid #8F9195;
  transition: 0.4s;
  font-family: sans-serif;
  font-size: 16px;
  color: #8F9195;
  padding: 0 10px;
  box-sizing: border-box;
}

.slider::before {
  content: "";
  position: absolute;
  right: 5px;
  height: 1.5rem;
  width: 1.5rem;
  background-color: #8F9195;
  border-radius: 50%;
  transition: 0.4s;
}

/* ACTIVE State */
input:checked+.slider {
  background-color: #00b33c;
  border-color: #00b33c;
  justify-content: flex-end;
}

input:checked+.slider::before {
  left: 5px;
  right: auto;
  background-color: white;
}

/* ACTIVE/INACTIVE TEXT */
.slider span::before {
  content: "Inactive";
  font-size: 1.1rem;
  font-family: 'Poppins';
  font-weight: 500;
}

input:checked+.slider span::before {
  content: "Active";
  font-size: 1.1rem;
  font-family: 'Poppins';
  font-weight: 500;
  color: #fff !important;
}

.addNewInsuranceLink {
  font-family: 'Poppins';
  font-weight: 600;
  font-size: 1.2rem;
  text-decoration: underline;
  color: #B80E74;
  cursor: pointer;
}

.insuranceDivNew {
  width: 39rem;
  margin: 10px auto;
  border-radius: .5rem;
  font-size: 1.2rem;
  font-family: 'Poppins';
  font-weight: 600;
  border: 1px solid #D0D5DD;
  box-shadow: 0px 1px 2px 0px #1018280D;
}

.back-btn-insurnace {
  border: 1px solid #B80E74 !important;
  background: none !important;
  width: fit-content !important;
}

.dropdown-toggle::after {
  display: inline-block;
  margin-left: 15.255em !important;
  vertical-align: .255em;
  content: "";
  border-top: .3em solid;
  border-right: .3em solid transparent;
  border-bottom: 0;
  border-left: .3em solid transparent;
}

.dropdown-toggle {
  background: #fff !important;
  border: 1px solid #ddd !important;
  width: 100%;
  text-align: start;
  font-size: 1rem;
  font-family: 'Poppins';
  font-weight: 500;
}

.insuranceListContainer {
  height: calc(100vh - 21rem);
  overflow-y: auto;
}

.paymentStar {
  color: red;
}

.input-wrapper {
  position: relative;
}

.input-wrapper .form-control {
  padding-right: 40px;
  /* Make space for icon inside */
}

.toggle-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  color: #666;
}

.paymentCardDiv {
  font-size: 1.2rem;
  font-family: 'Poppins';
  padding: 2rem;
  font-weight: 500;
  color: #343a40;
}

.processTrans {
  background: #aaa;
  padding: .5rem;
  border-radius: .5rem;
  color: #fff;
  cursor: pointer;
}

.cancelTrans {
  text-decoration: underline;
  color: #B80E74;
  cursor: pointer;
}

.cancelTrans:hover {
  text-decoration: underline;
  color: #0056cf;
  cursor: pointer;
}

.successPaymentMessage {
  color: green;
  font-weight: 600;
  text-align: center;
}

.transactionMainDiv {
  font-family: 'Poppins';
  font-size: 1.2rem;
}

.transactionText {
  color: #1A1A1A;
  font-size: 1.5rem;
  text-align: center;
}
  .input-with-dollar {
  position: relative;
  width: 100%;
}
.dollar-sign {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
  color: black;
}
.input-with-dollar input {
  padding-left: 25px; /* space for $ sign */
  text-align: left;
}
.v-application a{
  color: #B80E74 !important;
}

.back-btn-insurnace:hover{
  background-color: transparent !important;
}

.finish-btn:hover{
  background-color: transparent !important;
}

.noteFirstName{
  color: #A24AA5;
  line-height: 15px;
  font-size: 1rem;
}

.finishBtn{
  background-color: #9E0E5A !important;
  color: #fff !important;
}

 [v-cloak] {
  display: none;
}