body:has(.white-section) {
  background-color: white !important;
}

html,
html body {
  font-size: 18px;
}

/* ========== Font size Styles ========== */

.text-t1 {
  font-size: var(--text-t1);
}

.text-t2 {
  font-size: var(--text-t2);
}

.caption-1 {
  font-size: var(--caption-1);
}

.caption-2 {
  font-size: var(--caption-2);
}

/* ========== Buttons Styles ========== */

.button-element {
  opacity: 1 !important;
}

.button-outline-green:hover {
  color: var(--grean__2);
  border-color: var(--grean__2);
  background-color: #fff;
}

.button-outline-green:active {
  color: var(--grean__2);
  border-color: var(--grean__4);
  background-color: var(--grean__4);
}

.button-element[disabled],
.button-element-gray {
  color: var(--grey__3);
  background-color: #fff;
  border-color: var(--grey__3);
}

.button-element[disabled] path,
.button-element-gray svg path {
  fill: #cccccc;
}

.button-element-yellow:hover {
  border-color: var(--yellow__2);
  background-color: var(--yellow__2);
}

.button-element-yellow:active {
  border-color: var(--yellow__3);
  background-color: var(--yellow__3);
}

.button-element-filled-green:hover {
  color: #fff;
  border-color: var(--grean__2);
  background-color: var(--grean__2);
}

.button-element-filled-green:active {
  color: #fff;
  border-color: var(--grean__3);
  background-color: var(--grean__3);
}

.button-element-outline-black:hover {
  background-color: var(--grey__3);
  border-color: var(--black);
}

.button-element-outline-black:active {
  background-color: var(--grey__2);
  border-color: var(--black);
}

/* ========== Card Styles ========== */

.card-element:hover {
  background-color: var(--grean__5);
}

/* === Radio Styles === */

/* === Radio Styles (1) === */

.form-switch.form-label-end .form-check-input {
  margin-left: 0 !important;
  margin-right: 0.6rem !important;
}

.form-check.form-switch .form-check-input:not(:checked) {
  background-color: var(--grey__4) !important;
}

.form-switch:not(.form-label-end) .form-check-input {
  position: relative;
  display: block;
  margin-top: 0;
  margin-left: 0.6rem !important;
}

.form-switch.form-label-end .form-check-input {
  margin-top: 0;
  margin-left: 0.6rem !important;
}

/* === Radio Styles (2) === */

.form-radio-buttons-t2 .form-radio-button:checked + .btn {
  background-color: var(--green) !important;
}

.form-radio-buttons-t2 .form-radio-button:not(:checked) + .btn:hover {
  color: var(--green);
  background-color: var(--grean__4);
}

.btn-check:disabled + .btn,
.btn-check[disabled] + .btn {
  opacity: 1 !important;
}

input.form-radio-button[disabled] + label {
  color: #cccccc !important;
}

/* === Radio Styles (3) === */

.form-radio-item.form-serivce-radio .btn {
  text-align: left !important;
}

.form-radio-item.focused-radio input:checked ~ label .btn-check-option:after,
.form-radio-item input:not(:checked) ~ label:hover .btn-check-option:after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 80%;
  height: 80%;
  border-radius: 100%;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.form-radio-item.focused-radio
  input[type="radio"]:checked
  ~ label
  .btn-check-option:after,
.form-radio-item
  input[type="radio"]:not(:checked)
  ~ label:hover
  .btn-check-option:after {
  background: url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.60927 9.91063C4.37427 9.91063 4.15146 9.80469 4.00271 9.62188L0.553647 5.375C0.281772 5.04 0.332709 4.54813 0.667709 4.27594C1.00271 4.00406 1.49458 4.055 1.76677 4.39L4.58677 7.8625L10.2161 0.400002C10.4761 0.0556267 10.9658 -0.0131233 11.3102 0.246877C11.6546 0.506877 11.7233 0.996564 11.4633 1.34094L5.23302 9.6C5.08833 9.79188 4.86333 9.90625 4.62333 9.91063C4.61865 9.91063 4.61396 9.91063 4.60927 9.91063Z' fill='%23FFC40C'/%3E%3C/svg%3E%0A")
      center no-repeat,
    var(--yellow__4);
}

.form-radio-item.focused-radio
  input[type="checkbox"]:checked
  ~ label
  .btn-check-option:after,
.form-radio-item
  input[type="checkbox"]:not(:checked)
  ~ label:hover
  .btn-check-option:after {
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background: url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.60927 9.91063C4.37427 9.91063 4.15146 9.80469 4.00271 9.62188L0.553647 5.375C0.281772 5.04 0.332709 4.54813 0.667709 4.27594C1.00271 4.00406 1.49458 4.055 1.76677 4.39L4.58677 7.8625L10.2161 0.400002C10.4761 0.0556267 10.9658 -0.0131233 11.3102 0.246877C11.6546 0.506877 11.7233 0.996564 11.4633 1.34094L5.23302 9.6C5.08833 9.79188 4.86333 9.90625 4.62333 9.91063C4.61865 9.91063 4.61396 9.91063 4.60927 9.91063Z' fill='%23FFD349'/%3E%3C/svg%3E%0A")
      center no-repeat,
    var(--yellow__4);
}

/* ========== Mobile date picker Styles ========== */

.dateBtn-pick-container {
  position: relative;
  width: 100%;
  overflow-x: auto;
  white-space: nowrap;
}

.dateBtn-pick-container::-webkit-scrollbar {
  display: none;
}

.dateBtn-pick-container {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

.form-radio-date-buttons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.dateBtnTxt {
  font-weight: 700;
  font-size: var(--subheadline);
  color: var(--black);
}

.dateBtnItem {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center;
  max-width: 3rem;
  width: 100%;
  padding: 0.5rem 0.25rem 0.25rem;
  background-color: #ffffff;
  border: 1px solid var(--grey__5);
  border-radius: 2.5rem;
  font-size: var(--caption-1);
  font-weight: 700;
  color: var(--black);
  margin-right: 0.25rem;
}

.dateBtnItem-number {
  position: relative;
  overflow: hidden;
  text-align: center;
  padding: 0.75rem;
  width: 2.5rem;
  height: 2.5rem;
  font-size: var(--text-t1);
  color: var(--black);
  background: var(--grey__5);
  border-radius: 3.125rem;
  margin-top: 0.25rem;
}

.form-radio-date-buttons .btn-check:checked + .dateBtnItem {
  color: white;
  background-color: var(--green);
}

.dateBtnItem:hover {
  color: var(--green);
  background-color: var(--grean__4);
}

.dateBtnItem:hover .dateBtnItem-number {
  color: var(--green);
  background-color: #fff;
}

/* ========== calenadar Styles ========== */

/*.air-datepicker-body--cells .air-datepicker-cell.-day- {*/
/*  background: transparent !important;*/
/*}*/

.air-datepicker-cell > span {
  display: block;
  width: 1.875rem;
  height: 1.875rem;
  line-height: 1.875rem;
  text-align: center;
  border-radius: 100% !important;
}

.air-datepicker-cell.-day-.-current- > span {
  background-color: var(--grean__5);
}

.air-datepicker-cell.-day-.-selected- > span {
  color: var(--black) !important;
  background-color: var(--yellow) !important;
}

.air-datepicker-cell.-day-:not(.-selected-):hover > span {
  color: var(--yellow) !important;
  background-color: var(--yellow__4) !important;
}

.air-datepicker-cell.-day-.-weekend-:not(.-current-):not(.-selected-):not(
    :hover
  )
  > span {
  color: var(--grey__3) !important;
  background-color: #fff !important;
}

/* ========== Chat sidebar Styles ========== */

/* === Chat sidebar item Styles === */

.chat-wrapper__sidebar-convoItem {
  border-left: 0.125rem solid white;
  border-top: 0.125rem solid white;
  border-bottom: 0.125rem solid white;
}

.chat-wrapper__sidebar-convoItem.convoItem-selected {
  border-color: var(--grean__4);
}

.chat-wrapper__sidebar-convoItem:hover {
  background: transparent !important;
  border-color: var(--green);
}

/* === Chat status message Styles === */

.chat-wrapper__messages-fluid {
  position: relative;
  padding: 0.8333rem;
  background: var(--grean__4);
  border-radius: 1.25rem;
}

.chat-wrapper__messages-fluid-icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  background: var(--green);
  border-radius: 2.8889rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.fluid-item__label {
  font-weight: 300;
  font-size: var(--caption-1);
  line-height: 1em;
  color: var(--grey__1);
}

.fluid-item__title {
  font-weight: 700;
  color: var(--green);
  font-size: var(--text-t1);
}

.chat-wrapper__messages-fluid-message {
  font-weight: 300;
  font-size: var(--text-t1);
  color: var(--black);
}

.chat-wrapper__messages-msg-time {
  color: var(--grey__2);
  font-size: var(--caption-3);
}

/* === Chat input Styles === */

.chat-wrapper__inputPanel .input-element input.ps-5 {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  padding-left: calc(2rem + 0.75rem) !important;
}

.chat-wrapper__inputPanel .input-element input:not(.ps-5) {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  padding-left: calc(4rem + 0.75rem) !important;
}

.chat-wrapper__inputPanel-toolbar > * {
  left: 0;
}

.chat-wrapper__inputPanel-toolbar > * svg {
  max-width: 1.5rem;
  max-height: 1.5rem;
}

.chat-wrapper__inputPanel-toolbar:first-of-type {
  left: 10px;
  right: auto;
}

.chat-wrapper__inputPanel {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

/* === Chat default message Styles === */

.chat-wrapper__messages-image {
  display: block;
  max-width: 22.5rem;
  width: 100%;
  height: 13.75rem;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.chat-wrapper__messages-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
}

.chat-wrapper__messages-upFile-info {
  line-height: 1em;
}

.chat-wrapper__messages-msgDate:after {
  content: "";
  width: 7px;
  height: 6px;
  margin-left: 3px;
  display: inline-block;
  vertical-align: middle;
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='14' viewBox='0 0 17 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.4935 1.3454C16.0279 0.874627 15.2693 0.868688 14.7964 1.33217L5.92643 10.0987L2.07056 6.10694C1.61067 5.62762 0.849313 5.61188 0.370044 6.07177C-0.109276 6.53166 -0.125009 7.29302 0.334881 7.77229C0.336964 7.77443 0.338996 7.77656 0.34108 7.7787L5.0425 12.6509C5.26749 12.8804 5.57501 13.0104 5.89643 13.0117H5.90966C6.22499 13.0107 6.52734 12.8859 6.75156 12.6641L16.4826 3.04243C16.9528 2.57619 16.9576 1.81764 16.4935 1.3454Z' fill='%23989898'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-position: center;
}

.chat-wrapper__messages-msgDate.msg-delivered:after {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='6' viewBox='0 0 12 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.24674 0.172641C8.01395 -0.0627476 7.63465 -0.0657169 7.39822 0.166025L2.96322 4.5493L1.03528 2.55341C0.805336 2.31375 0.424656 2.30588 0.185022 2.53583C-0.0546382 2.76577 -0.0625045 3.14645 0.16744 3.38609C0.168482 3.38715 0.169498 3.38822 0.17054 3.38929L2.52125 5.82538C2.63375 5.94014 2.7875 6.00513 2.94821 6.00578H2.95483C3.11249 6.00529 3.26367 5.94288 3.37578 5.832L8.24132 1.02115C8.47639 0.788032 8.47879 0.408759 8.24674 0.172641Z' fill='%23989898'/%3E%3Cpath d='M6.12954 5.82542C6.24175 5.9399 6.39502 6.00483 6.55531 6.00582H6.56193C6.71959 6.00533 6.87077 5.94292 6.98288 5.83204L11.8484 1.02119C12.069 0.77286 12.0465 0.39278 11.7981 0.172238C11.573 -0.0277003 11.2347 -0.030331 11.0065 0.166065L6.57334 4.54934L6.41518 4.38517C6.18526 4.1455 5.80458 4.13761 5.56492 4.36756C5.32526 4.59748 5.31737 4.97816 5.54731 5.21782C5.54835 5.21891 5.54939 5.21998 5.55044 5.22105L6.12954 5.82542Z' fill='%23989898'/%3E%3C/svg%3E%0A");
}

.chat-wrapper__messages-File-icon {
  position: relative;
  width: 2.2222rem;
  height: 2.2222rem;
  background: url("data:image/svg+xml,%3Csvg width='12' height='14' viewBox='0 0 12 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 3V0.315L11.73 3.5H9.5C9.36739 3.5 9.24021 3.44732 9.14645 3.35355C9.05268 3.25979 9 3.13261 9 3ZM9.5 4.5C9.10218 4.5 8.72064 4.34196 8.43934 4.06066C8.15804 3.77936 8 3.39782 8 3V0H1.5C1.10218 0 0.720644 0.158035 0.43934 0.43934C0.158035 0.720644 0 1.10218 0 1.5V12.5C0 12.8978 0.158035 13.2794 0.43934 13.5607C0.720644 13.842 1.10218 14 1.5 14H10.5C10.8978 14 11.2794 13.842 11.5607 13.5607C11.842 13.2794 12 12.8978 12 12.5V4.5H9.5Z' fill='white'/%3E%3C/svg%3E%0A")
      center no-repeat,
    var(--green);
  border-radius: 1.1111rem;
}

.messages-quote {
  font-size: var(--text-t2);
  padding: 0.25rem 0.5rem;
  background: #f7fbf7;
  border-left: 0.1875rem solid var(--green);
  border-radius: 0.25rem;
}

.messages-quote__name {
  display: block;
  color: var(--green);
}

/* ========== FAQ Styles ========== */

.faqList-group__item {
  border: 2px solid #fff;
}

.Faqlist-item-selected {
  background-color: var(--grean__4);
  border-color: var(--grean__4);
}

.faqList-group__item:hover {
  border-color: var(--green);
}

/* ========== order Styles ========== */

.order-item:hover {
  background-color: var(--grean__5);
}

/* ========== Review box Styles ========== */

.testimonial-box {
  position: relative;
  padding: 0.8333rem;
  background: var(--grean__4);
  border-radius: 1.25rem;
}

/* ========== Profile sidebar Styles ========== */

.profile-sidebar__nav .nav-link {
  border-radius: 0.8333rem;
}

.profile-sidebar__nav .nav-link:not(.active):hover {
  background-color: var(--grean__2);
}

/* ========== Input Styles ========== */

.input-element input:not(:placeholder-shown),
.input-element textarea:not(:placeholder-shown) {
  background-color: #fff;
}

.input-element-invalid input,
.input-element-invalid textarea {
  background-color: #fff;
  border-color: var(--red);
}

.input-element-invalid .icon-box path,
.input-element-invalid .icon-box path {
  fill: var(--red);
}

.input-element-invalid + .input-element-tooltip {
  display: block;
  font-weight: 300;
  font-size: var(--caption-2);
  color: #d14343;
}

.input-element.input-element-disabled input:disabled,
.input-element.input-element-disabled textarea:disabled {
  color: var(--grey__2);
  background-color: var(--grey__3) !important;
  border-color: var(--grey__3) !important;
}

.input-element.input-element-disabled:has(input:disabled) .icon-box path,
.input-element.input-element-disabled:has(textarea:disabled) .icon-box path {
  fill: #989898 !important;
}

/* === Floating input Styles === */

.form-floating > label {
  color: var(--grey__3);
}
