@font-face {
  font-family: "Brandon Text Regular";
  src: url("../fonts/BrandonText-Regular.woff2") format("woff2"), url("../fonts/BrandonText-Regular.woff") format("woff"), url("../fonts/BrandonText-Regular.ttf") format("truetype"), url("../fonts/BrandonText-Regular.svg#HvDTrial_BrandonText-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Brandon Text Bold";
  src: url("../fonts/BrandonText-Bold.woff2") format("woff2"), url("../fonts/BrandonText-Bold.woff") format("woff"), url("../fonts/BrandonText-Bold.ttf") format("truetype"), url("../fonts/BrandonText-Bold.svg#HvDTrial_BrandonText-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Brandon Text Medium";
  src: url("../fonts/BrandonText-Medium.woff2") format("woff2"), url("../fonts/BrandonText-Medium.woff") format("woff"), url("../fonts/BrandonText-Medium.ttf") format("truetype"), url("../fonts/BrandonText-Medium.svg#HvDTrial_BrandonText-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "SignPainter";
  src: url("../fonts/SignPainter-HouseScript.woff2") format("woff2"), url("../fonts/SignPainter-HouseScript.woff") format("woff"), url("../fonts/SignPainter-HouseScript.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Airbnb-Cereal-App-bold";
  src: url("../fonts/AirbnbCerealApp-Bold.eot");
  src: url("../fonts/AirbnbCerealApp-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/AirbnbCerealApp-Bold.woff2") format("woff2"), url("../fonts/AirbnbCerealApp-Bold.woff") format("woff"), url("../fonts/AirbnbCerealApp-Bold.ttf") format("truetype"), url("../fonts/AirbnbCerealApp-Bold.svg#AirbnbCerealApp-Bold") format("svg");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: "Brandon Text Regular" !important;
}

.font-regular {
  font-family: "Brandon Text Regular" !important;
}

.font-bold {
  font-family: "Brandon Text Bold" !important;
}

.font-medium {
  font-family: "Brandon Text Medium" !important;
}

.font-signpainter {
  font-family: "SignPainter" !important;
}

.font-bnb {
  font-family: "Airbnb-Cereal-App-bold" !important;
}

.font-10 {
  font-size: 10px;
}

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

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

.font-13 {
  font-size: 13px;
}

.font-14 {
  font-size: 14px;
}

.font-16 {
  font-size: 16px;
}

.font-18 {
  font-size: 18px;
}

.font-20 {
  font-size: 20px;
}

.font-21 {
  font-size: 21px;
}

.font-22 {
  font-size: 22px;
}

.font-24 {
  font-size: 24px !important;
}

.font-25 {
  font-size: 25px;
}

.font-28 {
  font-size: 28px;
}

.font-30 {
  font-size: 30px;
}

.font-32 {
  font-size: 32px;
}

.font-40 {
  font-size: 40px;
}

.font-44 {
  font-size: 44px;
}

.font-48 {
  font-size: 48px;
}

.font-58 {
  font-size: 58px;
}

.font-55 {
  font-size: 55px;
}

.font-70 {
  font-size: 70px;
}

.primary-text-color {
  color: var(--primary-text-color, #4D4D4F) !important;
}

.disabled-date {
  color: var(--secondary-diable-color, #11515b) !important;
  pointer-events: none;
}

.react-datepicker__week {
  color: var(--secondary-diable-color, #11515b) !important;
}

.secondary-text-color {
  color: var(--secondary-text-color, #009FB8) !important;
}

.secondary-text-color:disabled {
  color: var(--secondary-diable-color, #11515b) !important;
}

.gray-v1 {
  color: var(--gray-v1, #A3A3A3) !important;
}

.gray-v2 {
  color: var(--gray-v2, #CECECE);
}

.gray-v5 {
  color: var(--gray-v5, #4D4D4F);
}

.danger-red {
  color: var(--danger-red, #EB0000);
}

.black-v3 {
  color: var(--black-v3, #3D3D3A);
}

.orange-v1 {
  color: var(--orange-v1, #D66F00);
}

.body-bg {
  background-color: var(--body-bg, #ffffff) !important;
}

.custom-blue {
  color: var(--custom-blue, #009FB8) !important;
}

.custom-gray {
  color: var(--custom-gray, #919191);
}

.text-gray {
  color: var(--text-gray, #a3a3a3);
}

.white-v1 {
  color: var(--white-v1, #ffffff);
}

.color-black {
  color: var(--color-black, #000000) !important;
}

.secondary-grey {
  color: var(--secondary-grey, #aaaaaa);
}

.yellow-v1 {
  color: var(--yellow-v1, #ffe58f);
}

.bg-color-v2 {
  background-color: var(--bg-color-v2, #f9f9f9) !important;
}

body {
  background-color: var(--body-bg, #ffffff) !important;
}

.border-grey {
  border: 2px solid var(--border-grey, #EBEBEB);
}

.custom-bg-box {
  background-color: var(--custom-bg-box, #f9f9f9) !important;
}

.header-bg-color {
  background-color: var(--header-bg-color, #FF8200);
}

.custom-bg-gray {
  background-color: var(--custom-bg-gray, #d9d9d9) !important;
}

.header-box-shadow {
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1019607843) !important;
}

.bg-red {
  background-color: var(--danger-btn, #FA4343);
}

.light-blue-bg {
  background-color: #E5F5F8;
}

.border-grey-right {
  border-right: 1px solid #CECECE;
}

.bg-gray-v1 {
  background-color: var(--bg-gray-v1, #f7f7f7);
}

.primary-btn {
  color: #fff;
  background-color: var(--primary-color, #009FB8);
  border-radius: 50px;
  border: none;
  padding: 14px;
}

.primary-btn:hover {
  background-color: var(--primary-hover, #3392a1);
}

.primary-btn:disabled {
  background-color: var(--disabled-button, #a3a3a3);
}

.secondary-btn {
  color: var(--primary-text-color, #4D4D4F);
  background-color: transparent;
  border-radius: 50px;
  border: none;
  padding: 14px;
}

.secondary-btn:hover {
  background-color: var(--secondary-hover, #ebebeb);
}

.secondary-btn-danger {
  color: var(--danger-btn, #FA4343);
  background-color: transparent;
  border-radius: 50px;
  border: none;
  padding: 14px;
}

.secondary-btn-danger:hover {
  background-color: var(--secondary-hover, #ebebeb);
}

.social-btn {
  color: var(--primary-text-color, #4D4D4F);
  background-color: var(--secondary-btn-color, #ffffff);
  border-radius: 50px;
  border: var(--form-border, 1px solid #EBEBEB);
  padding: 14px;
}

.social-btn:hover {
  background-color: var(--secondary-hover, #ebebeb);
}

.outline-btn {
  color: var(--primary-color, #009FB8) !important;
  background-color: var(--body-bg, #ffffff) !important;
  border-radius: 50px !important;
  border: 1px solid var(--primary-color, #009FB8) !important;
  padding: 14px;
}

.outline-btn:hover {
  background-color: var(--secondary-hover, #ebebeb) !important;
}

.outline-btn:disabled {
  color: var(--gray-v1, #A3A3A3);
  border: 1px solid var(--gray-v1, #A3A3A3);
}

.request-container {
  background-color: var(--yellow-v3, #fce28c) !important;
  color: var(--gray-v5, #4D4D4F) !important;
  padding: 10px;
}

.outline-btn-red {
  color: #FA4343;
  background-color: white;
  border-radius: 50px;
  border: 1px solid var(--danger-btn, #FA4343) !important;
  padding: 14px;
}

.outline-btn-red:hover {
  background-color: var(--secondary-hover, #ebebeb);
}

.danger-btn {
  color: var(--white-v1, #ffffff);
  background-color: var(--danger-btn, #FA4343);
  border-radius: 50px;
  border: none;
  padding: 14px;
}

.danger-btn:hover {
  background-color: #ac2e2e;
}

.bg-none {
  background: none;
}

.height-93vh {
  height: 90vh;
}

.intro-img {
  background-image: url(../images/login-img.png);
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  width: 100%;
  height: 91.5vh;
}

.dark-theme .intro-img {
  background-image: url(../images/login-img-dark.svg);
}

.intro-img-1 {
  background: linear-gradient(142.8deg, #ffdab5 -92.45%, #fffaf5 48.11%, #ffffff 57.8%, #94eaf8 117.18%);
}

.dark-theme .intro-img-1 {
  background: linear-gradient(136.8deg, #53402d -1.45%, #2d2d2d 48.11%, #2d3435 57.8%, #2d3f41 107.18%);
}

.header-container {
  min-height: 60px;
  background-color: var(--header-bg-color, #FF8200);
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1019607843) !important;
}

.header-img-width {
  width: 95px;
}

.input-border {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 4px;
}

.input-border::-moz-placeholder {
  color: var(--gray-v1, #A3A3A3) !important;
}

.input-border::placeholder {
  color: var(--gray-v1, #A3A3A3) !important;
}

.input-border:focus {
  border: 1px solid #009FB8 !important;
}

.input-border:disabled {
  border: none !important;
  background-color: var(--disabled-bg, #F2F2F2) !important;
}

.custom-error {
  border: var(--error-border, 1px solid #EB0000) !important;
  background-color: var(--error-bg, #fef7f7) !important;
}

.progress-step::after {
  content: "";
  width: 45%;
  height: 1px;
  background: var(--custom-border, #EBEBEB);
  position: absolute;
  z-index: 0;
  left: 56%;
  right: -50%;
  top: 48%;
}

.progress-step::before {
  content: "";
  width: 45%;
  height: 1px;
  background: var(--custom-border, #EBEBEB);
  position: absolute;
  z-index: 0;
  left: -2px;
  right: 50%;
  top: 48%;
}

.custom-video-container {
  width: 750px !important;
  height: 404px;
}

.html5-video-container video {
  width: 755px !important;
  height: 404px !important;
  left: 0px !important;
  top: 0px !important;
}

.eye-icon {
  position: absolute;
  right: 10px;
  top: 12px;
}

.success-container {
  z-index: 1050;
  min-width: 350px;
  border: var(--success-border, 1px solid #24A419);
  border-radius: 10px;
  background-color: var(--success-tost-bg, #E9F6E8);
  padding: 15px;
}

.error-container {
  width: 350px;
  border: var(--error-border, 1px solid #EB0000);
  border-radius: 10px;
  background-color: var(--error-toast-bg, #fde6e6);
  padding: 15px;
}

.curser-pointer {
  cursor: pointer;
}

input[type=date]::-webkit-calendar-picker-indicator {
  background-image: url(../images/calender-icon.svg);
}

input[type=time]::-webkit-inner-spin-button,
input[type=time]::-webkit-calendar-picker-indicator {
  z-index: 2;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  -moz-appearance: none;
}

.custom-date {
  position: absolute;
  right: 12px;
  top: 11px;
}

.cust-scroll {
  overflow-y: scroll;
  position: relative;
}

.cust-scroll::-webkit-scrollbar {
  width: 3px !important;
  height: 3px !important;
}

.cust-scroll::-webkit-scrollbar-track {
  background: var(--secondary-btn-color, #ffffff);
  border-radius: 8px;
}

.cust-scroll::-webkit-scrollbar-thumb {
  background: var(--scroll-bg-color, #DADADA);
  border-radius: 10px;
}

.db-chart-scrl {
  height: auto;
  min-height: 5vh;
  max-height: 91.5vh;
}

.pp-scrl {
  height: auto;
  min-height: 5vh;
  max-height: 116vh;
  overflow: scroll;
}

.notify-scroll {
  height: auto;
  min-height: 50px;
  max-height: 500px;
}

.custom-check.box-width {
  width: 20px !important;
  height: 20px !important;
}

.custom-check {
  background-color: var(--secondary-btn-color, #ffffff) !important;
  border-color: var(--custom-border-PPA, #939191) !important;
  width: 18px !important;
  height: 18px !important;
}

.custom-check:checked {
  background-color: var(--primary-color, #009FB8) !important;
  border-color: var(--primary-color, #009FB8) !important;
}

.custom-check:focus {
  box-shadow: none !important;
}

.custom-radio-input.form-check-input:checked[type=radio] {
  background-image: url(../images/check-radio.svg);
  background-size: 12px;
}

.dark-theme .custom-radio-input.form-check-input:checked[type=radio] {
  background-image: url(../images/check-radio-dark.svg);
  background-size: 12px;
}

.custom-radio-input {
  background-color: var(--body-bg, #ffffff) !important;
  border: 2px solid var(--custom-border, #EBEBEB) !important;
  width: 20px !important;
  height: 20px !important;
}

.custom-radio-input:checked {
  background-color: var(--body-bg, #ffffff) !important;
  border: var(--progress-border, 1px solid #000000) !important;
}

.custom-radio-input:focus {
  box-shadow: none !important;
}

.select-border {
  background-color: transparent;
  border: var(--select-border, 2px solid #CECECE) !important;
}

.select-border:checked {
  background-color: var(--primary-color, #009FB8) !important;
  border: var(--primary-color, #009FB8) !important;
}

.select-border:focus {
  box-shadow: none !important;
}

.custom-form-check {
  border: 3px solid var(--gray-v2, #CECECE) !important;
  width: 22px !important;
  height: 22px !important;
}

.step-wizard {
  position: relative;
  z-index: 0;
}

.step-wizard:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  border-bottom: 1px solid var(--custom-border, #EBEBEB);
}

.step-wizard .wizard-step-text {
  z-index: 1;
  bottom: -30px;
}

.step-wizard .wizard-step-num {
  height: 32px;
  width: 32px;
  border-radius: 32px;
  border: var(--progress-border, 1px solid #000000);
  color: var(--primary-text-color, #4D4D4F);
  background-color: var(--secondary-btn-color, #ffffff);
  z-index: 1;
}

.step-wizard .wizard-step-num.active {
  background-color: var(--primary-color, #009FB8);
  color: var(--white-v1, #ffffff);
  border: none;
  outline-offset: 2px;
  height: 32px;
  width: 32px;
}

.step-wizard .wizard-step-num .img {
  display: none;
}

.step-wizard .wizard-step-num.completed {
  background-color: var(--green-v1, #24A419);
  color: var(--secondary-btn-color, #ffffff);
  border: none;
}

.step-wizard .wizard-step-num.completed .number {
  display: none;
}

.step-wizard .wizard-step-num.completed .img {
  display: block;
}

.custom-border-bottom {
  border-bottom: var(--form-border, 1px solid #EBEBEB) !important;
}

.custom-border-top {
  border-top: var(--form-border, 1px solid #EBEBEB) !important;
}

.input-search input {
  border: var(--border-color, #EBEBEB);
  font-size: 14px;
  color: var(--primary-text-color, #4D4D4F);
  height: 40px;
  border-radius: 8px;
}

.input-search input:focus {
  border: var(--form-border, 1px solid #EBEBEB);
  outline: none;
  box-shadow: none;
}

.input-search input:focus-visible {
  border: var(--form-border, 1px solid #EBEBEB);
}

.custom-search {
  background-color: var(--body-bg, #ffffff) !important;
  color: var(--primary-text-color, #4D4D4F) !important;
  height: 40px !important;
  border-radius: 8px !important;
}

.custom-search:focus {
  box-shadow: none;
  background-color: var(--body-bg, #ffffff) !important;
  color: var(--primary-text-color, #4D4D4F) !important;
}

.custom-search:focus-visible {
  outline: unset;
}

.custom-border-box {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 4px;
}

.custom-border-box-no-location {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 4px;
}

.custom-border-box-location {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 3px;
  padding: 10px 24px;
}

.custom-border-box-location:hover {
  border: var(--location-border, 1px solid #009FB8) !important;
}

.custom-border-box-location:active {
  border: var(--location-border, 1px solid #009FB8) !important;
}

.custom-border-box-location.active {
  border: var(--location-border, 1px solid #009FB8) !important;
}

.resize-none {
  resize: none;
}

@keyframes growProgressBar {

  0%,
  33% {
    --pgPercentage: 0;
  }

  100% {
    --pgPercentage: var(--value);
  }
}

@property --pgPercentage {
  syntax: "<number>";
  inherits: false;
  initial-value: 0;
}

div[role=progress] {
  --size: 5rem;
  --fg: #009fb8;
  --bg: #ebebeb;
  --pgPercentage: var(--value);
  animation: growProgressBar 3s 1 forwards;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: radial-gradient(closest-side, white 80%, transparent 0 99.9%, white 0), conic-gradient(var(--fg) calc(var(--pgPercentage) * 1%), var(--bg) 0);
  font-family: Helvetica, Arial, sans-serif;
  font-size: calc(var(--size) / 5);
  color: var(--fg);
}

div[role=progressbar]::before {
  counter-reset: percentage var(--value);
}

.profile-radius {
  border-radius: 50px;
  width: 75px;
  height: 75px;
}

.upload-cont {
  width: 409px !important;
  height: auto;
  background-color: var(--popup-bg, #ffffff) !important;
  border-radius: 10px !important;
  border: none;
}

.alert-cont {
  width: 400px !important;
  min-height: 200px !important;
  background-color: var(--popup-bg, #ffffff) !important;
  border-radius: 10px !important;
  border: none;
}

.welness-cont {
  width: 435px !important;
  height: auto;
  background-color: var(--popup-bg, #ffffff) !important;
  border-radius: 10px !important;
  border: none;
}

.share-cont {
  width: 320px !important;
  height: auto;
  background-color: var(--popup-bg, #ffffff) !important;
  border-radius: 10px !important;
  border: none !important;
}

.upload-doc-cont {
  max-width: 950px !important;
  height: auto;
  border-radius: 10px !important;
  background-color: var(--body-bg, #ffffff) !important;
  border: none;
}

.popup-bg {
  background-color: var(--popup-bg, #ffffff) !important;
}

.width-35 {
  width: 35% !important;
}

.width-40 {
  width: 40% !important;
}

.img-sizing {
  width: unset;
}

.custom-size {
  width: 280px !important;
}

@media (max-width: 576px) {
  .img-sizing {
    width: 100%;
  }
}

.dark-theme .icon-filter {
  filter: invert(161%) sepia(44%) saturate(0%) hue-rotate(17deg) brightness(172%) contrast(95%) !important;
}

.light-bg {
  display: block;
}

.dark-bg {
  display: none;
}

.dark-theme .light-bg {
  display: none;
}

.dark-theme .dark-bg {
  display: block;
}

.blog-tag {
  background-color: var(--orange-v1, #ff8200);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.active-state {
  background-color: var(--success-tost-bg, #E9F6E8);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.required-state {
  background-color: var(--yellow-v2, #fffbe6);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.expire-state {
  background-color: var(--error-toast-bg, #fde6e6);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.marked-state {
  background-color: var(--marked-bg, #f9f9f9);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

.blog-tag-primary {
  background-color: var(--primary-color, #009FB8);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.access-tag {
  background-color: var(--green-v1, #24A419);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.report-border {
  border-bottom: 1px solid #EBEAEA;
  padding-bottom: 7px;
}

.noaccess-tag {
  background-color: #EB0000;
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.unassigned-tag {
  background-color: #A3A3A3;
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.book-tag {
  border: 1px solid #009FB8;
  border-radius: 4px;
  padding: 6.5px 9px;
  width: -moz-fit-content;
  width: fit-content;
  color: #009FB8;
  background-color: var(--body-bg, #ffffff);
}

.book-tag:hover {
  color: var(--primary-hover, #3392a1);
}

.bordered-container {
  border: 5px solid #FFCF01;
  margin-top: 125px;
  margin-bottom: 40px;
  height: 300px;
}

.arrow-position {
  position: absolute;
  top: 10px;
  right: 32px;
}

.events-arrow-position {
  position: absolute;
  top: 10px;
  right: 10px;
}

.border-img-position {
  top: -50%;
  left: 50%;
  transform: translateX(-50%) translateY(30%);
}

.border-btn-position {
  bottom: -4%;
  left: 50%;
  transform: translateX(-50%) translateY(30%);
}

.selected-location {
  border: var(--gray-border, 1px solid #E1DFDF);
  border-radius: 4px;
  background-color: var(--bg-gray, #F4F4F4);
  width: 40%;
  padding: 12px 15px;
}

.dark-theme .selected-location {
  border: none;
}

.custom-dropdown {
  background-color: var(--body-bg, #ffffff) !important;
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 4px;
}

.custom-dropdown:focus {
  border: 1px solid #009FB8 !important;
}

input::-ms-reveal,
input::-ms-clear {
  display: none;
}

.list-mark li::marker {
  font-size: 12px;
}

.custom-margin {
  margin-left: 300px;
}

@media (max-width: 992px) {
  .custom-margin {
    margin-left: 0px;
  }
}

.custom-box-shadow {
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1019607843);
}

.event-container {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 4px;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1019607843) !important;
  padding: 10px;
  background-color: #f9f9f9 !important;
}

.dark-theme .event-container {
  border: unset !important;
}

.form-border {
  border: var(--form-border, 1px solid #EBEBEB);
}

.cal-bg {
  background-color: var(--cal-bg, #ebebeb);
}

.cal-height {
  height: -moz-max-content !important;
  height: max-content !important;
}

.share-btn {
  border-radius: 32px;
  background-color: #e7e7e7;
  border: none;
  width: 32px;
  height: 32px;
}

.share-btn:hover {
  background-color: #DADADA;
}

.social-med-icon {
  width: 25px;
}

.media-img-width {
  width: 20px;
}

.custom-location-dropdown {
  background-color: var(--popup-bg, #ffffff) !important;
}

.custom-location-dropdown:hover {
  background-color: var(--gray-hover, #f3f1f1) !important;
}

.custom-location-dropdown-1 {
  background-color: var(--body-bg, #ffffff) !important;
}

.custom-location-dropdown-1:hover {
  background-color: var(--gray-hover, #f3f1f1) !important;
}

.nav-link.cust-excep-tab-btn {
  color: #a3a3a3;
  background-color: var(--body-bg, #ffffff) !important;
  border-radius: 0;
  border-bottom: 2px solid var(--border-grey, #EBEBEB) !important;
}

.nav-link.cust-excep-tab-btn.appointment {
  border-bottom: none !important;
}

.nav-link.cust-excep-tab-btn.active {
  color: var(--primary-text-color, #4D4D4F) !important;
  background-color: var(--body-bg, #ffffff) !important;
}

.nav-link.cust-excep-tab-btn.active .excep-count {
  background-color: #fbb047;
  color: #ffffff;
}

.cust-nav-border-bottom {
  position: relative;
}

.cust-nav-border-bottom:before {
  content: "";
  position: absolute;
  border-bottom: 2px solid var(--border-grey, #EBEBEB);
  width: 100%;
  bottom: 0;
}

.cus-tab-link.active.cus-tab-border::after {
  background-repeat: no-repeat;
  height: 2px;
  background-color: #ff8200;
  display: block;
  content: "";
  top: auto;
  bottom: 0px;
  left: 0px;
  right: 0px;
  position: absolute;
  border-radius: 5px 5px;
}

.cus-tab-link.active.cus-tab-border.appointment::after {
  bottom: -16px !important;
}

.list-style-none {
  list-style: none;
}

.float-right {
  float: right;
}

.settings-shadow {
  border: none;
  box-shadow: 0px 0px 80px 2px rgba(0, 0, 0, 0.0509803922);
}

.dark-theme .settings-shadow {
  border: 1px solid var(--gray-gray---100, #4d4d4f);
  box-shadow: none !important;
}

.form-switch .form-check-input.custom-toggle:checked[type=checkbox] {
  background-color: var(--primary-color, #009FB8);
  border-color: var(--primary-color, #009FB8);
}

.form-switch .form-check-input.custom-toggle {
  background-image: url(../images/switch-icon.svg) !important;
  background-size: 16px;
  background-color: var(--border-grey, #EBEBEB);
  border-color: transparent;
  width: 40px;
  height: 22px;
}

.access-dropdown {
  border: var(--location-border, 1px solid #009FB8) !important;
  border-radius: 4px !important;
}

.custom-access-dropdown {
  background-color: var(--body-bg, #ffffff) !important;
}

.custom-access-dropdown:hover {
  background-color: var(--hover-secondary, #e6f6f8) !important;
}

.add-dog-icon {
  width: 52px !important;
}

.height-75vh {
  height: 75vh;
}

.height-70vh {
  height: 70vh;
}

.w-60 {
  width: 60% !important;
}

.dog-profile-width {
  width: 46px !important;
}

.dog-profile-conainer {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 10px !important;
  background-color: var(--popup-bg, #ffffff) !important;
  cursor: pointer;
}

.dog-profile-conainer:hover {
  background-color: var(--profile-active, #fbf1e6) !important;
  border: 1px solid #ff8200 !important;
}

.dog-profile-conainer.active {
  border: 1px solid #ff8200 !important;
  background-color: var(--profile-active, #fbf1e6) !important;
}

.wellness-activity-conainer {
  border: 1px solid #CECECE !important;
  border-radius: 14px !important;
  background-color: var(--bg-gray-v1, #f7f7f7) !important;
  padding: 3px 20px !important;
}

.wellness-activity-conainer:hover {
  background-color: var(--profile-active, #fbf1e6) !important;
  border: 1px solid #ff8200 !important;
}

.wellness-activity-conainer.active {
  border: 1px solid #ff8200 !important;
  background-color: var(--profile-active, #fbf1e6) !important;
}

.wellness-activity-conainer.active img {
  filter: invert(56%) sepia(53%) saturate(4196%) hue-rotate(2deg) brightness(107%) contrast(103%);
}

.yellow-container {
  background-color: var(--yellow-v1, #ffe58f) !important;
  border: none;
  border-radius: 10px;
  padding: 15px;
}

.custom-home-tabs.active {
  background-color: #ffffff !important;
  border-bottom: 2px solid #ff8200 !important;
  border-radius: 0 !important;
}

.cust-home-nav-items {
  border-bottom: 2px solid #ebebeb !important;
}

.appointment-container-v1 {
  background-color: var(--popup-bg, #ffffff) !important;
  border: 1px solid var(--container-border, #ebebeb) !important;
  border-radius: 4px;
}

.appointment-container {
  background-color: var(--body-bg, #ffffff);
  border: 1px solid var(--heading-border, #ebebeb) !important;
  border-radius: 4px;
}

.appointment-container-heading {
  background-color: var(--body-bg, #ffffff);
  border: 1px solid var(--heading-border, #ebebeb) !important;
  border-radius: 4px;
}

.bg-gray-v3 {
  background-color: var(--gray-v3, #f5f5f5) !important;
}

.custom-border {
  border-bottom: 1px solid #EBEBEB;
}

.custom-border-PPA {
  border-bottom: 1px solid #939191;
}

.dogt-foundation-container {
  background-color: var(--custom-bg-box, #f9f9f9) !important;
  border-radius: 10px;
}

.cust-mg-container {
  background-color: #ffe58f;
}

.appointment-btn {
  color: #009FB8;
  background-color: #f2fdff;
  border-radius: 50px;
  border: 1px dashed #009FB8;
  padding: 14px;
}

.appointment-btn:hover {
  background-color: #d9f9ff;
}

.appointment-status-container {
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);
}

.appointment-status {
  border-radius: 18px;
  padding: 8px 12px;
}

.appointment-circle {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 50%;
}

.decline-status-color {
  background-color: #FDE5E5;
}

.decline-circle-color {
  background-color: #EB0000;
}

.approved-status-color {
  background-color: #E9F6E8;
}

.approved-circle-color {
  background-color: #24A419;
}

textarea:focus,
input:focus {
  outline: none;
}

.custom-progress {
  border-radius: 50px !important;
  background-color: var(--progress-bg, #d9d9d9) !important;
}

.custom-progress-bar {
  background-color: var(--primary-color, #009FB8) !important;
  border-radius: 50px !important;
}

.appointment-alert-container {
  background-color: var(--yellow-bg-v1, #fce28c);
  border: none;
  border-radius: 4px;
  padding: 10px;
}

.appointment-alert-container-sameday {
  background-color: var(--yellow-bg-v1, #fce28c);
  border: none;
  border-radius: 5px;
  padding: 7px;
  width: 97%;
  margin: 12px;
}

.gray-container {
  background-color: var(--custom-bg-box, #f9f9f9);
  border-radius: 4px;
  padding: 10px;
  width: 100% !important;
}

.date-bg {
  background-color: var(--popup-bg, #ffffff);
  color: var(--primary-text-color, #4D4D4F);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  padding: 7px;
  border: none;
}

.date-bg.active {
  background-color: var(--primary-color, #009FB8);
  color: var(--white-v1, #ffffff);
}

.appointment-cancel-alert {
  background-color: var(--alert-red-bg, #f8e0e0);
  border-radius: 4px;
  padding: 18px 20px;
}

.new-appointment-container {
  background-color: var(--popup-bg, #ffffff) !important;
  border: 1px solid transparent;
  box-shadow: 0px 4px 80px 0px rgba(71, 71, 71, 0.0784313725);
  border-radius: 8px !important;
}

.new-appointment-container:hover {
  border: 1px solid #009FB8 !important;
}

.dark-theme .new-appointment-container {
  box-shadow: none !important;
}

.new-appointment-container.active {
  border: 1px solid #009FB8 !important;
}

.card-img-wh {
  width: 150px !important;
  height: 120px;
}

.cust-border-radius {
  border-radius: 18px !important;
}

@media (min-width: 768px) {
  .custom-filter-width {
    width: 405px !important;
  }
}

.custom-filter-width {
  width: 405px !important;
}

.dd-position {
  top: 5px !important;
}

.dd-position.ddFilter-position {
  top: 61px !important;
  right: 192px;
}

.filter-shadow {
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1803921569);
}

.black-v2 {
  color: var(--black-v2, #0D0A2D) !important;
}

.member-border {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  border-radius: 4px;
}

.white-v2 {
  background-color: var(--white-v2, #FFFFFF) !important;
}

.gray-v4 {
  color: var(--gray-v4, #9a9797);
}

.gray-v7 {
  color: var(--gray-v7, #6D6C6C);
}

.red-bg {
  background-color: var(--red-bg, #fde6e6);
}

.add-profile:hover {
  filter: invert(55%) sepia(46%) saturate(5201%) hue-rotate(1deg) brightness(105%) contrast(104%) !important;
}

.width-45 {
  width: 45% !important;
}

.dark-theme .filter-arrow {
  filter: invert(50%) sepia(65%) saturate(102%) hue-rotate(244deg) brightness(176%) contrast(123%);
}

a.secondary-text-color:hover {
  filter: invert(49%) sepia(31%) saturate(794%) hue-rotate(140deg) brightness(80%) contrast(91%);
}

.file-upload {
  position: relative;
  overflow: hidden;
}

.file-upload input[type=file] {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}

.file-input {
  width: 100%;
  height: 137px;
}

.text-width {
  width: 50%;
}

@media (max-width: 768px) {
  .text-width {
    width: 100%;
  }
}

.cancel-container {
  background-color: var(--red-v1, #f8e1e1) !important;
  color: var(--red-text, #eb0000) !important;
  padding: 10px;
}

.submit-container {
  background-color: var(--green-v2, #e5f1e3) !important;
  color: var(--green-v1, #24A419) !important;
  padding: 10px;
}

.request-container {
  background-color: var(--yellow-v3, #fce28c) !important;
  color: var(--rec-color, #4D4D4F) !important;
  padding: 10px;
}

.orange-v2 {
  color: #ff8200 !important;
}

.notification-position {
  position: absolute;
  top: 12px;
  right: 12px;
}

.wellness-gray-container {
  background-color: transparent;
  border-radius: 4px;
  padding: 15px;
}

@media (min-width: 991px) {
  .wellness-gray-container {
    background-color: var(--bg-gray-v1, #f7f7f7);
  }
}

.blue-btn {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  background-color: var(--popup-bg, #ffffff) !important;
  color: var(--primary-text-color, #4D4D4F);
  border-radius: 4px;
}

.blue-btn:hover {
  background-color: var(--blue-bg, #e6f6f8);
  color: var(--primary-color, #009FB8);
  border: var(--location-border, 1px solid #009FB8) !important;
}

.blue-btn.active {
  background-color: var(--blue-bg, #e6f6f8) !important;
  color: var(--primary-color, #009FB8) !important;
  border: var(--location-border, 1px solid #009FB8) !important;
}

.blue-achievement-count {
  border: var(--form-border, 1px solid #EBEBEB) !important;
  background-color: var(--popup-bg, #ffffff) !important;
  color: var(--primary-text-color, #4D4D4F);
  border-radius: 4px;
}

.blue-achievement-count.active {
  background-color: var(--blue-bg, #e6f6f8) !important;
  color: var(--primary-color, #009FB8) !important;
  border: var(--location-border, 1px solid #009FB8) !important;
}

.profile-img {
  -o-object-fit: cover;
  object-fit: cover;
}

.profile-img-width {
  height: 46px;
  width: 46px;
  border-radius: 50px;
}

.profile-img-width-30 {
  height: 30px;
  width: 30px;
  border-radius: 50px;
}

.profile-img-width-40 {
  height: 40px;
  width: 40px;
  border-radius: 50px;
}

.yellow-notification {
  width: 30px;
  height: 30px;
  border-radius: 30px;
  background-color: var(--color-yellow, #ffcf01);
}

.notifiy-position {
  position: absolute;
  top: 18px;
  right: 14px;
}

.lead-bord-area {
  background-color: var(--bg-gray-v1, #f7f7f7);
  border: 1px solid transparent;
  border-radius: 4px;
  padding: 10px;
}

.lead-bord-area:hover {
  background-color: var(--blue-bg, #e6f6f8);
  border: var(--location-border, 1px solid #009FB8) !important;
}

.lead-bord-area.active {
  background-color: var(--blue-bg, #e6f6f8);
  border: var(--location-border, 1px solid #009FB8) !important;
}

.progress-bar-height {
  height: 188px;
}

.bar-height {
  height: 220px;
}

.green-container {
  background-color: var(--green-bg, #d7f9eb);
  border-radius: 50px;
  width: -moz-fit-content;
  width: fit-content;
  padding: 5px 10px;
}

.profile-image-width {
  width: 20px;
  height: 20px;
}

.container-border {
  border: 1px solid var(--container-border, #ebebeb);
  background-color: var(--popup-bg, #ffffff);
}

.activity-bg {
  background-color: var(--bg-gray-v1, #f7f7f7);
  height: -moz-fit-content;
  height: fit-content;
  border-radius: 16px;
}

.logo-width {
  width: 56px;
}

.gradient-container {
  background: linear-gradient(180.16deg, #ddfaff 0.14%, #e1fafe 0.14%, #e8fbfe 52.59%, #ffffff 103.4%);
  border: 1px solid #f7f7f7;
  border-radius: 8px;
  height: 197px;
}

.dark-theme .gradient-container {
  background: linear-gradient(147.69deg, rgba(43, 224, 252, 0.42) 12.39%, rgba(0, 71, 82, 0.42) 87.61%);
  border: 1px solid transparent;
}

.leaderbord-img {
  width: 84px;
  height: 84px;
  border-radius: 90px;
}

.leader-position {
  position: absolute;
  top: 1px;
  right: 5px;
}

.miles-bg {
  background-color: var(--secondary-text-color, #009FB8);
  width: -moz-fit-content;
  width: fit-content;
  border-radius: 5px;
  color: var(--white-v3, #f9f9f9);
  padding: 3px 4px;
}

.gragh-height {
  height: 230px;
}

.visibility-hidden {
  visibility: hidden;
}

.width-80 {
  width: 80%;
}

.location-scrl {
  height: 130px;
  overflow-y: hidden;
}

.location-scrl-1 {
  min-height: 100px;
}

.location-h-scrl {
  overflow-x: scroll;
}

.address-container {
  max-width: 400px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  box-orient: vertical;
  cursor: default !important;
}

.address-containers {
  max-width: 400px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  box-orient: vertical;
}

.webcam-add-height {
  min-height: 105px;
  display: flex;
  justify-content: center;
}

.dog-profile-conainer .card-text {
  max-width: 115px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  box-orient: vertical;
}

.dp-arrow-width {
  width: 28px;
  height: 28px;
}

.custom-carousel-indicator {
  bottom: -8px !important;
}

.custom-carousel-indicator button {
  background-color: var(--grey-v3, #E1E1E1) !important;
  width: 4px !important;
  height: 4px !important;
  border-radius: 4px !important;
  margin-left: 2px !important;
  margin-right: 2px !important;
  border: 0 !important;
  background-clip: unset !important;
}

.custom-carousel-indicator .active {
  background-color: #009fb8 !important;
  width: 18px !important;
  border: 0 !important;
}

.wellness-cont {
  width: 625px !important;
  height: auto;
  background-color: var(--new-popup-bg, #ffffff) !important;
  border-radius: 10px !important;
  border: none;
}

.carousel-height {
  height: 430px;
}

.custum-tooltip {
  display: none;
}

a.view-container:hover .custum-tooltip {
  display: block;
}

.view-access-tag {
  background-color: var(--green-v1, #d66f00);
  border: none;
  border-radius: 4px;
  padding: 3px 5px;
  width: -moz-fit-content;
  width: fit-content;
}

.tooltip-container {
  background-color: var(--gray-v5, #4D4D4F);
  border: none;
  border-radius: 4px;
  padding: 12px;
  z-index: 1050;
  left: -138px;
  top: 34px;
  width: 337px;
}

.tooltip-container::before {
  position: absolute;
  content: "";
  height: 17px;
  width: 17px;
  display: inline-block;
  background-size: 15px;
  background-image: url(../images/tooltip-pointer.svg);
  background-repeat: no-repeat;
  left: 145px;
  top: -10px;
}

.tooltip-container-calender {
  background-color: var(--gray-v5, #4D4D4F);
  border: none;
  border-radius: 4px;
  padding: 14px;
  z-index: 1;
  left: -6px;
  top: 34px;
  width: 287px;
  color: var(--white-v3, #f9f9f9);
}

.tooltip-container-calender::before {
  position: absolute;
  content: "";
  height: 17px;
  width: 17px;
  display: inline-block;
  background-size: 15px;
  background-image: url(../images/tooltip-pointer.svg);
  background-repeat: no-repeat;
  left: 13px;
  top: -10px;
}

.rmdp-calendar {
  height: 280px !important;
  padding: 5px !important;
  width: 665px !important;
  position: absolute;
  top: 40px;
  left: -286px;
  background-color: var(--popup-bg, #ffffff);
  color: var(--primary-text-color);
  z-index: 1050;
  border-radius: 10px;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1019607843);
}

.custom-date-position .rmdp-calendar {
  top: 42px;
  max-width: 645px !important;
}

.rmdp-ep-arrow {
  display: none !important;
}

.rmdp-day,
.rmdp-week-day,
.event-dot {
  height: 35px !important;
  color: var(--primary-text-color, #4D4D4F) !important;
}

.rmdp-header-values {
  font-family: "Brandon Text Regular";
  font-size: 17px;
  color: var(--primary-text-color, #4D4D4F) !important;
}

.recharts-default-tooltip {
  background-color: var(--body-bg, #ffffff) !important;
  color: var(--primary-text-color, #4D4D4F) !important;
}

.secondary-outline-btn {
  border: 1px solid #009FB8;
  border-radius: 4px;
  padding: 7px 18px;
  background-color: var(--popup-bg, #ffffff);
  color: var(--secondary-text-color, #009FB8);
  font-size: 12px;
}

.secondary-outline-btn:hover {
  background-color: var(--secondary-hover, #ebebeb);
}

.primary-btn-v2 {
  color: var(--white-v1, #ffffff);
  background-color: var(--primary-color, #009FB8);
  border-radius: 4px;
  padding: 7px 18px;
  border: none;
}

.primary-btn-v2:hover {
  background-color: var(--primary-hover, #3392a1);
}

.primary-btn-v2:disabled {
  background-color: var(--gray-color, #ebebeb);
  color: var(--side-nav-text-color, #4D4D4F);
}

.location-container-v1 {
  background-color: var(--white-v2, #FFFFFF);
  border: 1px solid var(--border-grey-v2, #EBEBEB);
  border-radius: 3px;
  height: 180px !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.notify-icon-width {
  width: 82px;
}

.height-60vh {
  height: 60vh;
}

.height-40vh {
  height: 40vh;
}

.react-datepicker__year-option:hover {
  color: var(--black-color, #000);
}

.custom-dropdown-v2 {
  background-color: var(--popup-bg, #ffffff) !important;
}

.custom-dropdown-v2:hover {
  background-color: var(--hover-color, #edfdff) !important;
  color: var(--color-primary, #4d4d4f) !important;
}

.number-picker-item.selected {
  background-color: var(--select-color, #efeff0) !important;
  color: var(--primary-text-color, #4D4D4F) !important;
}

.number-picker-item:not(.selected) {
  color: var(--gray-v6, #444343) !important;
}

.number-picker-item {
  padding: 10px;
  cursor: pointer;
}

.number-picker-item.highlighted {
  font-weight: bold;
  background-color: var(--select-color, #efeff0) !important;
  color: var(--primary-text-color, #4D4D4F) !important;
}

.number-picker-container {
  height: 200px;
  /* Adjust as needed */
  overflow-y: auto;
  scroll-behavior: smooth;
}

.custom-dropdown:disabled {
  background-color: var(--heading-border, #ebebeb) !important;
}

.height-390px {
  height: 390px;
}

.progress-text-position {
  position: absolute;
  bottom: -27px;
}

.bar-border-color {
  color: var(--bar-border-color, #f1f1f1);
}

.bar-hover-container {
  background-color: var(--border-grey-v2, #EBEBEB) !important;
  color: var(--primary-text-color, #4D4D4F);
}

.bar-arrow-hover-container {
  color: var(--primary-text-color, #4D4D4F);
  position: absolute;
  bottom: -9px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid var(--border-grey-v2, #EBEBEB) !important;
}

.width-30 {
  width: 30% !important;
}

.width-103 {
  width: 103% !important;
}

.disabled-icon {
  opacity: 0.5;
  cursor: unset;
}

.tost-position {
  position: fixed;
  width: 100%;
}

.tost-position-createdogprofile {
  z-index: 1050;
  position: fixed;
  width: 57% !important;
}

.tost-position-nonavcreatedogprofile {
  z-index: 1050;
  position: fixed;
  width: 60% !important;
}

.tost-position-mg {
  position: fixed;
  width: 70%;
  z-index: 1100;
  margin-bottom: "4%";
}

.tost-position-nonavmg {
  position: fixed;
  width: 78%;
  z-index: 1100;
  margin-bottom: "4%";
}

.tost-position-reset {
  z-index: 1050;
  position: fixed;
  width: 100% !important;
}

.tost-position-nav {
  z-index: 1050;
  position: fixed;
  width: 87% !important;
}

.tost-position-vaccination {
  z-index: 1050;
  position: fixed;
  width: 85% !important;
  top: 15% !important;
}

.tost-position-nonavvaccination {
  z-index: 1050;
  position: fixed;
  width: 95% !important;
  top: 15% !important;
}

.tost-position-meet {
  z-index: 1050;
  position: fixed;
  width: 58% !important;
}

.tost-position-nonavmeet {
  z-index: 1050;
  position: fixed;
  width: 64% !important;
}

.tost-position-navnoheader {
  z-index: 1050;
  position: fixed;
  width: 95% !important;
}

.tost-position-email {
  z-index: 1050;
  position: fixed;
  width: 100% !important;
}

.tost-position-noheader {
  z-index: 1050;
  position: fixed;
  width: 110% !important;
  margin-top: "4%";
}

.tost-position-appointmentform {
  z-index: 1050;
  position: fixed;
  width: 120% !important;
  margin-top: "4%";
}

.tost-position-dogprofile {
  z-index: 1050;
  position: fixed;
  width: 100% !important;
}

.form-control:disabled {
  background-color: var(--disabled-bg, #F2F2F2) !important;
  border: none !important;
}

.playroom-btn.selected-class {
  background-color: var(--webcam-btn-bg, rgba(0, 159, 184, 0.1019607843)) !important;
  border: 1px solid #009FB8 !important;
  color: var(--blue-light, #009FB8) !important;
  font-family: "Brandon Text Medium" !important;
}

@media (max-width: 1358px) {
  .w-30 {
    width: 40% !important;
  }
}

@media (max-width: 1052px) {
  .w-30 {
    width: 57% !important;
  }
}

@media (max-width: 823px) {
  .w-30 {
    width: 65% !important;
  }
}

@media (max-width: 485px) {
  .w-30 {
    width: 100% !important;
  }
}

.width-25 {
  width: 27% !important;
}

@media (max-width: 1450px) {
  .width-25 {
    width: 33% !important;
  }
}

@media (max-width: 1243px) {
  .width-25 {
    width: 38% !important;
  }
}

@media (max-width: 1112px) {
  .width-25 {
    width: 45% !important;
  }
}

@media (max-width: 994px) {
  .width-25 {
    width: 58% !important;
  }
}

@media (max-width: 832px) {
  .width-25 {
    width: 65% !important;
  }
}

.me-40 {
  margin-right: 40px !important;
}

.date-bg-closed {
  opacity: 0.6;
  border: none;
  background-color: var(--popup-bg, #ffffff);
  color: var(--primary-text-color, #4D4D4F);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  padding: 7px;
  border: none;
}

.login-image {
  width: 100%;
}

.custom-login-scrl {
  overflow: hidden;
}

.dark-theme .calender-icon-color {
  opacity: 0.75;
}

.height-118 {
  height: 118vh;
}

.custom-checkbox-align .form-check-input {
  width: 1.25em !important;
  height: 1.25em !important;
  margin-top: 0.25em !important;
  vertical-align: top !important;
  background-color: var(--body-bg, #ffffff) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  border: 3px solid var(--gray-v2, #CECECE) !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
  border-radius: 50% !important;
  transition: background-color 0.15s ease-in-out, background-position 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.custom-checkbox-align .form-check-input[type=radio]:checked {
  background-color: transparent !important;
  border-color: var(--primary-color, #009FB8) !important;
  box-shadow: none;
}

.custom-checkbox-align .form-check-input:checked[type=radio] {
  background-image: url(../images/check-green-img.svg) !important;
}

/* Media query for zoom levels */
@media screen and (max-width: 768px) {
  .custom-checkbox-align .form-check-input[type=radio] {
    transform: scale(0.8) !important;
  }
}

.pad-start-1 {
  padding-left: 10px !important;
}

.select-location .modal-dialog {
  max-width: 1096px;
}

@media (1700px < width) {
  .select-location .modal-dialog {
    max-width: 1140px;
  }
}

.select-location .modal-content {
  height: auto;
  background-color: var(--popup-bg, #ffffff) !important;
  border-radius: 10px !important;
  border: none;
}

.cards-location {
  display: flex;
  width: 139px;
  padding: 11.5px 15px;
  align-items: center;
  gap: 10px;
  border-radius: 4px;
  border: 1px solid #EBEBEB;
  background: var(--background, #FFF);
}

.card-style {
  background-image: url(../images/card-details-bg.svg);
  background-size: cover;
  background-repeat: no-repeat;
  content: "  ";
  border-radius: 8px;
  height: 200px !important;
}

.achievement-badge-style {
  width: 225px;
  height: 50px;
  flex-shrink: 0;
  border-radius: 50px;
}

.w-33 {
  width: 33.3%;
}

.report-card-content {
  position: relative;
}
.display-report-card-content {
  /* border: 3px solid red; */
}

.display-report-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
}

.display-report-card-back {
  color: #4D4D4F;
  font-size: 16px;
  width: 100%;
}
.display-report-card-back > a {
  margin-left: calc((100% - 58.3333333333%) / 2);
}

.report-card-highlights {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.highlight-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: .5rem;
}

.report-card-highlight {
  border-radius: 8px;
  background: #EBEBEB;
  padding: 4px 8px;
  color: #666;
  font-family: "Brandon Text Regular";
  font-size: 14px;
  font-style: normal;
  font-weight: 420;
  line-height: normal;
}
.report-card-brandon {
  font-family: "Brandon Text Regular";
}

.report-card-upper {
  display: flex;
  width: 100%;
}
.report-card-upper-left {
  width: 50%;
  padding-right: 1rem;
}

.report-card-upper-right {
  width: 50%;
}

.lower-images-container {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  margin-top: .5rem;
}
.lower-image-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 270px;
  width: 270px;
  overflow: hidden;
}
.lower-image-wrapper > img{
 border-radius: 16px;
}
.lower-image {
  width: 100%;
  height: 100%;
}
.report-card-image-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 500px;
}
.report-card-image-container > img {
  height: 100%;
}
.report-card-image {
  border-radius: 16px;
}

.report-card-content-container::after {
  border-radius: 16px;
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 40%; /* controls how wide the fade is */
  height: 100%;
  pointer-events: none;

  /* fade to background color */
  background: linear-gradient(to right, rgba(255,255,255,0) 0%, #fff 100%);
}

.dog-profile-report-stye {
  position: relative;
  display: flex;
  flex-shrink: 0;
  border-radius: 4px;
  border: var(--form-border, 1px solid #EBEBEB) !important;
  height: 250px !important;
  border-radius: 14px;
  cursor: grab;
}

.report-card-content-container {
  padding-left: 15px;
  display: flex;
  align-items: center;
  overflow: hidden;         /* hide overflow */
}

.report-card-content-container * {
  white-space: nowrap;      /* prevent wrapping */
  /* overflow: hidden;          */
  text-overflow: ellipsis;  /* optional: adds "..." */
}

.report-card-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.report-card-lower-image-container > img {
  transform: rotate(-10.238deg);
}

.report-card-lower-image-container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 3rem;
  width: 100%;
  height: 300px;
  background: var(--gray-100, #F9F9F9);
}

.report-card-title {
  font-family: "Brandon Text Medium";
  font-size: 40px;
}
.report-card-date {
  color: #8C8C8C;
  font-family: "Brandon Text Regular";
  font-style: normal;
  font-weight: 390;
  line-height: normal;
}
.highlights-container {
  display: flex;
  gap: 5px;
}
.highlight {
  border-radius: 8px;
  background: #EBEBEB;
  padding: 4px 8px;
  color: #666;
  font-family: "Brandon Text Regular";
  /* font-size: 10px; */
  font-style: normal;
  font-weight: 420;
  line-height: normal;
}

.report-border {
  border-bottom: 1px solid #EBEAEA;
  padding-bottom: 10px;
}

.light-blue-bg {
  background-color: var(--light-blue-bg, #E4FBFF) !important;
}

.badge-blue {
  color: var(--badge-blue, #0D7586) !important;
}

.dark-theme .location-container {
  background-color: #282828;
  border-color: 1px solid #A3A3A3;
}

.dark-theme .location-container:hover {
  background-color: #181818;
}

.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.card-add-btn {
  position: fixed;
  bottom: 50px;
  padding: 15px 15px;
}

.card-add-img {
  height: 28px !important;
  width: 28px !important;
}

/*# sourceMappingURL=commontheme.css.map */

.disabled-input {
  background-color: #f0f0f0 !important;
  /* Light gray background */
  color: #a0a0a0 !important;
  /* Gray text color */
  cursor: not-allowed !important;
  /* Change cursor to indicate it's not clickable */
}

/* --- ImpersonateUser Themed Styles --- */
.impersonate-outer-container {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.07);
  max-width: 420px;
  width: 50vw;
  margin: 2.5rem auto;
  padding: 2.5rem 2rem 2rem 2rem;
  font-family: 'Brandon Text Medium', Arial, sans-serif;
}

.impersonate-container {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.07);
  max-width: 420px;
  margin: 2.5rem auto;
  padding: 2.5rem 2rem 2rem 2rem;
  font-family: 'Brandon Text Medium', Arial, sans-serif;
}

.impersonate-container h2 {
  color: #009FB7;
  font-family: 'Brandon Text Medium', Arial, sans-serif;
  font-size: 1.6rem;
  margin-bottom: 1.5rem;
  text-align: center;
}

.impersonate-outer-container h1 {
  color: #4D4D4F;
  font-family: 'Brandon Text Medium', Arial, sans-serif;
  font-size: 1.6rem;
  margin-bottom: 1.5rem;
  text-align: center;
}

.impersonate-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.impersonate-input {
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  background: #faf9f7;
  transition: border 0.2s;
}

.impersonate-input:focus {
  border-color: #e07a2a;
  outline: none;
}

.impersonate-btn {
  background: linear-gradient(90deg, #e07a2a 0%, #f9b233 100%);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 0.85rem 0;
  font-size: 1.1rem;
  font-family: 'BrandonText-Bold', Arial, sans-serif;
  cursor: pointer;
  margin-top: 0.5rem;
  transition: background 0.2s, box-shadow 0.2s;
  box-shadow: 0 1px 4px rgba(224, 122, 42, 0.08);
}

.impersonate-btn:disabled {
  background: #e0e0e0;
  color: #bdbdbd;
  cursor: not-allowed;
}

.impersonate-error {
  color: #d32f2f;
  background: #fff3f3;
  border: 1px solid #ffd6d6;
  border-radius: 4px;
  padding: 0.7rem 1rem;
  margin-top: 1rem;
  text-align: center;
  font-size: 1rem;
}

.impersonate-success {
  color: #388e3c;
  background: #e8f5e9;
  border: 1px solid #b2dfdb;
  border-radius: 4px;
  padding: 0.7rem 1rem;
  margin-top: 1rem;
  text-align: center;
  font-size: 1rem;
}