/******Manrope *****/
@font-face {
  font-family: "Manrope-Light";
  src: url("../fonts/Manrope-Light.woff") format("woff"), url("../fonts/Manrope-Light.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Manrope-Regular";
  src: url("../fonts/Manrope-Regular.woff") format("woff"), url("../fonts/Manrope-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Manrope-Medium";
  src: url("../fonts/Manrope-Medium.woff") format("woff"), url("../fonts/Manrope-Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Manrope-Bold";
  src: url("../fonts/Manrope-Bold.woff") format("woff"), url("../fonts/Manrope-Bold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
.blue {
  color: #007bfc !important;
}

.indigo {
  color: #5D5FEF !important;
}

.indigo-lite {
  color: #5D5FEF !important;
}

.orange {
  color: #fe8024 !important;
}

.oranged {
  color: #ff6746 !important;
}

.green {
  color: #1bd084 !important;
}

.sky {
  color: #48a9f8 !important;
}

.cyan {
  color: #3065D0 !important;
}

.brown {
  color: #8d6e63 !important;
}

.pink {
  color: #e83e8c !important;
}

.fn {
  font-family: "Manrope-Regular";
}

.fm {
  font-family: "Manrope-Medium";
}

.fb {
  font-family: "Manrope-Bold";
}

/*$primary  : #7356f1 !default;*/
.w-1 {
  width: 1%;
}

.w-2 {
  width: 2%;
}

.w-3 {
  width: 3%;
}

.w-4 {
  width: 4%;
}

.w-5 {
  width: 5%;
}

.w-6 {
  width: 6%;
}

.w-7 {
  width: 7%;
}

.w-8 {
  width: 8%;
}

.w-9 {
  width: 9%;
}

.w-10 {
  width: 10%;
}

.w-11 {
  width: 11%;
}

.w-12 {
  width: 12%;
}

.w-13 {
  width: 13%;
}

.w-14 {
  width: 14%;
}

.w-15 {
  width: 15%;
}

.w-16 {
  width: 16%;
}

.w-17 {
  width: 17%;
}

.w-18 {
  width: 18%;
}

.w-19 {
  width: 19%;
}

.w-20 {
  width: 20%;
}

.w-21 {
  width: 21%;
}

.w-22 {
  width: 22%;
}

.w-23 {
  width: 23%;
}

.w-24 {
  width: 24%;
}

.w-25 {
  width: 25%;
}

.w-26 {
  width: 26%;
}

.w-27 {
  width: 27%;
}

.w-28 {
  width: 28%;
}

.w-29 {
  width: 29%;
}

.w-30 {
  width: 30%;
}

.w-31 {
  width: 31%;
}

.w-32 {
  width: 32%;
}

.w-33 {
  width: 33%;
}

.w-34 {
  width: 34%;
}

.w-35 {
  width: 35%;
}

.w-36 {
  width: 36%;
}

.w-37 {
  width: 37%;
}

.w-38 {
  width: 38%;
}

.w-39 {
  width: 39%;
}

.w-40 {
  width: 40%;
}

.w-41 {
  width: 41%;
}

.w-42 {
  width: 42%;
}

.w-43 {
  width: 43%;
}

.w-44 {
  width: 44%;
}

.w-45 {
  width: 45%;
}

.w-46 {
  width: 46%;
}

.w-47 {
  width: 47%;
}

.w-48 {
  width: 48%;
}

.w-49 {
  width: 49%;
}

.w-50 {
  width: 50%;
}

.w-51 {
  width: 51%;
}

.w-52 {
  width: 52%;
}

.w-53 {
  width: 53%;
}

.w-54 {
  width: 54%;
}

.w-55 {
  width: 55%;
}

.w-56 {
  width: 56%;
}

.w-57 {
  width: 57%;
}

.w-58 {
  width: 58%;
}

.w-59 {
  width: 59%;
}

.w-60 {
  width: 60%;
}

.w-61 {
  width: 61%;
}

.w-62 {
  width: 62%;
}

.w-63 {
  width: 63%;
}

.w-64 {
  width: 64%;
}

.w-65 {
  width: 65%;
}

.w-66 {
  width: 66%;
}

.w-67 {
  width: 67%;
}

.w-68 {
  width: 68%;
}

.w-69 {
  width: 69%;
}

.w-70 {
  width: 70%;
}

.w-71 {
  width: 71%;
}

.w-72 {
  width: 72%;
}

.w-73 {
  width: 73%;
}

.w-74 {
  width: 74%;
}

.w-75 {
  width: 75%;
}

.w-76 {
  width: 76%;
}

.w-77 {
  width: 77%;
}

.w-78 {
  width: 78%;
}

.w-79 {
  width: 79%;
}

.w-80 {
  width: 80%;
}

.w-81 {
  width: 81%;
}

.w-82 {
  width: 82%;
}

.w-83 {
  width: 83%;
}

.w-84 {
  width: 84%;
}

.w-85 {
  width: 85%;
}

.w-86 {
  width: 86%;
}

.w-87 {
  width: 87%;
}

.w-88 {
  width: 88%;
}

.w-89 {
  width: 89%;
}

.w-90 {
  width: 90%;
}

.w-91 {
  width: 91%;
}

.w-92 {
  width: 92%;
}

.w-93 {
  width: 93%;
}

.w-94 {
  width: 94%;
}

.w-95 {
  width: 95%;
}

.w-96 {
  width: 96%;
}

.w-97 {
  width: 97%;
}

.w-98 {
  width: 98%;
}

.w-99 {
  width: 99%;
}

.w-100 {
  width: 100%;
}

.offset-top-1 {
  margin: 0.5rem 0rem 0rem 0rem;
}

.offset-right-1 {
  margin: 0rem 0.5rem 0rem 0rem;
}

.offset-bottom-1 {
  margin: 0rem 0rem 0.5rem 0rem;
}

.offset-left-1 {
  margin: 0rem 0rem 0rem 0.5rem;
}

.offset-top-2 {
  margin: 1rem 0rem 0rem 0rem;
}

.offset-right-2 {
  margin: 0rem 1rem 0rem 0rem;
}

.offset-bottom-2 {
  margin: 0rem 0rem 1rem 0rem;
}

.offset-left-2 {
  margin: 0rem 0rem 0rem 1rem;
}

.offset-top-3 {
  margin: 1.5rem 0rem 0rem 0rem;
}

.offset-right-3 {
  margin: 0rem 1.5rem 0rem 0rem;
}

.offset-bottom-3 {
  margin: 0rem 0rem 1.5rem 0rem;
}

.offset-left-3 {
  margin: 0rem 0rem 0rem 1.5rem;
}

.offset-top-4 {
  margin: 2rem 0rem 0rem 0rem;
}

.offset-right-4 {
  margin: 0rem 2rem 0rem 0rem;
}

.offset-bottom-4 {
  margin: 0rem 0rem 2rem 0rem;
}

.offset-left-4 {
  margin: 0rem 0rem 0rem 2rem;
}

.offset-top-5 {
  margin: 2.5rem 0rem 0rem 0rem;
}

.offset-right-5 {
  margin: 0rem 2.5rem 0rem 0rem;
}

.offset-bottom-5 {
  margin: 0rem 0rem 2.5rem 0rem;
}

.offset-left-5 {
  margin: 0rem 0rem 0rem 2.5rem;
}

.offset-top-6 {
  margin: 3rem 0rem 0rem 0rem;
}

.offset-right-6 {
  margin: 0rem 3rem 0rem 0rem;
}

.offset-bottom-6 {
  margin: 0rem 0rem 3rem 0rem;
}

.offset-left-6 {
  margin: 0rem 0rem 0rem 3rem;
}

.offset-top-7 {
  margin: 3.5rem 0rem 0rem 0rem;
}

.offset-right-7 {
  margin: 0rem 3.5rem 0rem 0rem;
}

.offset-bottom-7 {
  margin: 0rem 0rem 3.5rem 0rem;
}

.offset-left-7 {
  margin: 0rem 0rem 0rem 3.5rem;
}

.offset-top-8 {
  margin: 4rem 0rem 0rem 0rem;
}

.offset-right-8 {
  margin: 0rem 4rem 0rem 0rem;
}

.offset-bottom-8 {
  margin: 0rem 0rem 4rem 0rem;
}

.offset-left-8 {
  margin: 0rem 0rem 0rem 4rem;
}

.offset-top-9 {
  margin: 4.5rem 0rem 0rem 0rem;
}

.offset-right-9 {
  margin: 0rem 4.5rem 0rem 0rem;
}

.offset-bottom-9 {
  margin: 0rem 0rem 4.5rem 0rem;
}

.offset-left-9 {
  margin: 0rem 0rem 0rem 4.5rem;
}

.offset-top-10 {
  margin: 5rem 0rem 0rem 0rem;
}

.offset-right-10 {
  margin: 0rem 5rem 0rem 0rem;
}

.offset-bottom-10 {
  margin: 0rem 0rem 5rem 0rem;
}

.offset-left-10 {
  margin: 0rem 0rem 0rem 5rem;
}

.offset-top-11 {
  margin: 5.5rem 0rem 0rem 0rem;
}

.offset-right-11 {
  margin: 0rem 5.5rem 0rem 0rem;
}

.offset-bottom-11 {
  margin: 0rem 0rem 5.5rem 0rem;
}

.offset-left-11 {
  margin: 0rem 0rem 0rem 5.5rem;
}

.offset-top-12 {
  margin: 6rem 0rem 0rem 0rem;
}

.offset-right-12 {
  margin: 0rem 6rem 0rem 0rem;
}

.offset-bottom-12 {
  margin: 0rem 0rem 6rem 0rem;
}

.offset-left-12 {
  margin: 0rem 0rem 0rem 6rem;
}

.offset-top-13 {
  margin: 6.5rem 0rem 0rem 0rem;
}

.offset-right-13 {
  margin: 0rem 6.5rem 0rem 0rem;
}

.offset-bottom-13 {
  margin: 0rem 0rem 6.5rem 0rem;
}

.offset-left-13 {
  margin: 0rem 0rem 0rem 6.5rem;
}

.offset-top-14 {
  margin: 7rem 0rem 0rem 0rem;
}

.offset-right-14 {
  margin: 0rem 7rem 0rem 0rem;
}

.offset-bottom-14 {
  margin: 0rem 0rem 7rem 0rem;
}

.offset-left-14 {
  margin: 0rem 0rem 0rem 7rem;
}

.offset-top-15 {
  margin: 7.5rem 0rem 0rem 0rem;
}

.offset-right-15 {
  margin: 0rem 7.5rem 0rem 0rem;
}

.offset-bottom-15 {
  margin: 0rem 0rem 7.5rem 0rem;
}

.offset-left-15 {
  margin: 0rem 0rem 0rem 7.5rem;
}

.offset-top-16 {
  margin: 8rem 0rem 0rem 0rem;
}

.offset-right-16 {
  margin: 0rem 8rem 0rem 0rem;
}

.offset-bottom-16 {
  margin: 0rem 0rem 8rem 0rem;
}

.offset-left-16 {
  margin: 0rem 0rem 0rem 8rem;
}

.offset-top-17 {
  margin: 8.5rem 0rem 0rem 0rem;
}

.offset-right-17 {
  margin: 0rem 8.5rem 0rem 0rem;
}

.offset-bottom-17 {
  margin: 0rem 0rem 8.5rem 0rem;
}

.offset-left-17 {
  margin: 0rem 0rem 0rem 8.5rem;
}

.offset-top-18 {
  margin: 9rem 0rem 0rem 0rem;
}

.offset-right-18 {
  margin: 0rem 9rem 0rem 0rem;
}

.offset-bottom-18 {
  margin: 0rem 0rem 9rem 0rem;
}

.offset-left-18 {
  margin: 0rem 0rem 0rem 9rem;
}

.offset-top-19 {
  margin: 9.5rem 0rem 0rem 0rem;
}

.offset-right-19 {
  margin: 0rem 9.5rem 0rem 0rem;
}

.offset-bottom-19 {
  margin: 0rem 0rem 9.5rem 0rem;
}

.offset-left-19 {
  margin: 0rem 0rem 0rem 9.5rem;
}

.offset-top-20 {
  margin: 10rem 0rem 0rem 0rem;
}

.offset-right-20 {
  margin: 0rem 10rem 0rem 0rem;
}

.offset-bottom-20 {
  margin: 0rem 0rem 10rem 0rem;
}

.offset-left-20 {
  margin: 0rem 0rem 0rem 10rem;
}

/* Use the variables */
body {
  background-color: #f2f3f9 !important;
  color: #142149;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: "Manrope-Regular" !important;
  font-weight: 500;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600 !important;
}

a {
  color: #004498;
  transition: 0.3s;
  -moz-transition: 0.3s;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  text-decoration: none !important;
}

.transition, .transitionAll, .transitionAll *, a, .btn * {
  transition: all 0.35s ease-out;
  -webkit-transition: all 0.35s ease-out;
}

html, body {
  height: 100%;
  margin: 0;
}

img {
  max-width: 100%;
}

.shiponclk-nav {
  width: 16.563rem;
  padding-bottom: 0;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: 3;
  background-color: #fff;
  transition: all 0.2s ease;
}
.shiponclk-nav.shrinkSidebar {
  max-width: 60px !important;
  min-width: 60px !important;
}
.shiponclk-nav.shrinkSidebar .nav-main ul li .nav-link-text {
  display: none;
}
.shiponclk-nav.shrinkSidebar .nav-main ul li .nav-link .submenu-arrow {
  display: none;
}
.shiponclk-nav.shrinkSidebar .submenu {
  display: none;
}
.shiponclk-nav.shrinkSidebar:hover {
  max-width: 250px !important;
  min-width: 250px !important;
}
.shiponclk-nav.shrinkSidebar:hover .nav-main ul li .nav-link-text {
  display: block;
}
.shiponclk-nav.shrinkSidebar:hover .nav-main ul li .nav-link .submenu-arrow {
  display: block;
}
.shiponclk-nav.shrinkSidebar:hover .submenu.show {
  display: block;
}
.shiponclk-nav.shrinkSidebar .bg-theme .logo {
  width: 50px;
}

.shiponclkNav-body {
  /*   margin-left: 15.883rem; */
  z-index: 0;
  transition: all 0.2s ease;
  height: 100%;
  /*  &.contentFull{margin-left: 2.5rem;} */
}

.header .header-menu {
  background-color: #fff;
}

.header .header-content {
  height: 100%;
  align-items: center;
  display: flex;
}
.header .header-content .mobilemenu-icon {
  font-size: 28px;
}
.header .header-content .menu-icon {
  font-size: 28px;
}
.header .header-content .menu-icon a {
  color: #1f6d70;
}
.header .header-content h1 {
  font-size: 25px;
  margin-bottom: 0px;
  padding-left: 20px;
}
.header .header-content .headerRite .nav-item {
  height: 100%;
  display: flex;
  align-items: center;
}
.header .header-content .headerRite .nav-item::after {
  display: none !important;
}
.header .header-content .headerRite .nav-item .userInfo small {
  display: block;
  font-size: 12px;
}
.header .header-content .headerRite .nav-item .userInfo span {
  display: block;
  font-size: 14px;
  font-weight: bold;
}
.header .header-content .userProfile img {
  width: 35px;
  height: 35px;
  border-radius: 10px;
  border: 2px solid #d0d0d0;
}
.header .header-content .recharge {
  background-color: #fff0ed;
  border-radius: 20px;
  padding: 0px 20px 0px 0px;
  align-items: center;
  justify-content: end;
  font-weight: bold;
  color: #ff6b52;
}
.header .header-content .recharge span {
  background-color: #ff6b52;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  margin-right: 10px;
}
.header .header-content .recharge:hover span {
  background-color: #EE3232;
}
.header .header-content .recharge:hover span i {
  transform: scale(1.3) rotate(-15deg);
}
.header .header-content .phone span {
  background-color: #cfffef;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #11998e;
}
.header .header-content .phone:hover span {
  background-color: #1bd084;
  color: #fff;
}
.header .header-content .phone:hover span i {
  transform: scale(1.3) rotate(-15deg);
}
.header .header-content .amt {
  background-color: #efefef;
  border-radius: 6px;
  height: 40px;
  padding: 0px 12px;
  align-items: center;
  justify-content: end;
  font-weight: bold;
  color: #001126;
}
.header .header-content .amt i.fa-lightbulb-exclamation {
  color: #9f9f9f;
}
.header .header-content .regDemo {
  background-color: #004498;
  border-radius: 100rem;
  height: 40px;
  padding: 0px 12px;
  align-items: center;
  justify-content: end;
  font-weight: 500;
  color: #001126;
}
.header .header-content .regDemo i.fa-lightbulb-exclamation {
  color: #9f9f9f;
}
.header .header-content .regDemo:hover {
  background-color: #1e2b3c;
  color: #fff;
}

.sidebar {
  position: relative;
  min-height: 100vh;
  height: 100%;
  left: 0;
  top: 0;
  font-size: 0.875rem;
  border-right: 1px solid #e7e9ed;
  background-color: #fff;
}

.nav-main {
  width: 100%;
}
.nav-main ul {
  width: 100%;
}
.nav-main ul li.nav-item {
  border-top: 1px solid #ddd;
}
.nav-main ul li .nav-link-text {
  font-size: 17px;
}
.nav-main ul li .nav-link {
  display: flex;
  align-items: center;
  color: #89879f;
  position: relative;
  padding: 0.7rem 1rem;
}
.nav-main ul li .nav-link.active {
  color: #1f6d70;
  background: #deeffe;
  font-weight: 600;
}
.nav-main ul li .nav-link:hover {
  color: #1f6d70;
  background: #deeffe;
  font-weight: 600;
}
.nav-main ul li .nav-link:focus {
  color: #1f6d70;
  background: #deeffe;
  font-weight: 600;
}
.nav-main ul li a[aria-expanded=true] .submenu-arrow {
  transform: rotate(90deg);
  transition: 0.5s;
  color: #1f6d70;
}
.nav-main ul li .nav-link .submenu-arrow {
  position: absolute;
  right: 1rem;
  top: 1.2rem;
  color: #343a40;
  transition: 0.5s;
}
.nav-main ul li .submenu-link {
  color: #5d6778;
  font-size: 0.875rem;
  margin-left: 2rem;
  padding: 0.5rem 1rem;
  padding-left: 1.3rem;
  position: relative;
  display: block;
  margin-bottom: 0;
}
.nav-main ul li .submenu-link:hover {
  color: #004498;
}
.nav-main ul li .submenu-link:before {
  background-color: #e7e9ed;
  content: " ";
  display: inline-block;
  height: inherit;
  left: 0;
  position: absolute;
  width: 2px;
  height: 100%;
  margin-top: -0.5rem;
}
.nav-main .nav-icon {
  margin-right: 15px;
}

.main-content {
  background-color: #f2f3f9;
}

.round {
  border-radius: 0.3rem !important;
}
.round img {
  border-radius: 0.3rem !important;
}

.carousel-indicators [data-bs-target] {
  border-radius: 100%;
  width: 10px !important;
  height: 10px !important;
}

.filter {
  cursor: pointer;
  position: absolute;
  right: 15px;
  top: 8px;
}

.numbering .page-item.active .page-link {
  background-color: #1f6d70;
  color: #fff;
}

.numbering .page-link {
  color: #1f6d70;
}

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

.customScroll {
  max-height: 240px;
  height: 240px;
  overflow-y: auto;
  overflow-x: hidden;
}

label {
  font-size: 13px;
}

.logo {
  width: 130px;
  margin: 0 auto;
}

.bg-theme .logo {
  width: 100px;
}

.login .account-pages {
  align-items: center;
  display: flex;
  min-height: 100vh;
  background-image: url(../images/b2.png);
  background-size: cover;
  background-position: center;
}
.login .account-pages .shape img.img-fluid {
  position: absolute;
  right: 97%;
  bottom: 0;
  overflow: hidden;
  height: -webkit-fill-available;
}
.login .account-pages .bgCircle {
  position: absolute;
  inset: 0px;
  opacity: 0.1;
}
.login .account-pages .bgCircle::before {
  content: " ";
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background-color: rgb(255, 255, 255);
  position: absolute;
  top: 0px;
  right: 0px;
  opacity: 1;
}
.login .account-pages .shape img {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1;
}

.login-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
.login-container .card {
  max-width: 1000px;
  width: 100%;
  border: none;
  border-radius: 15px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}
.login-container .card-left {
  background-color: #1f6d70;
  color: #fff;
  border-top-left-radius: 15px;
  border-bottom-left-radius: 15px;
}
.login-container .form-check-label {
  font-size: 0.9rem;
}

.datepicker table {
  text-align: center;
}

.text-new-primary {
  color: #1f6d70;
}

.btn-primary.btn-new-primary {
  background-color: #1f6d70;
  border-color: #1f6d70;
}
.btn-primary.btn-new-primary:hover {
  background: #144f51;
  color: #fff;
  border-color: #144f51;
}
.btn-primary.btn-new-primary:focus {
  background: #144f51;
  color: #fff;
  border-color: #144f51;
}

.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
  background-color: #144f51;
  border-color: #144f51;
}

.bg-primary-dark {
  background-color: #1f6d70;
}

.icon-avtar {
  width: 40px;
  height: 40px;
}
.icon-avtar .avtar-title {
  align-items: center;
  color: #fff;
  display: flex;
  height: 100%;
  justify-content: center;
  width: 100%;
}

.actionBtn {
  display: flex;
  justify-content: center;
}
.actionBtn .call {
  background: #1f6d70;
  color: #fff;
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
}
.actionBtn .call a {
  color: #fff;
}
.actionBtn .sms {
  background: #004498;
  color: #fff;
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
}
.actionBtn .sms a {
  color: #fff;
}
.actionBtn .trash {
  background: #FF4847;
  color: #fff;
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
}
.actionBtn .trash a {
  color: #fff;
}

#check-group {
  animation: 0.32s ease-in-out 1.03s check-group;
  transform-origin: center;
}
#check-group #check {
  animation: 0.34s cubic-bezier(0.65, 0, 1, 1) 0.8s forwards check;
  stroke-dasharray: 0, 75px;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#check-group #outline {
  animation: 0.38s ease-in outline;
  transform: rotate(0deg);
  transform-origin: center;
}
#check-group #white-circle {
  animation: 0.35s ease-in 0.35s forwards circle;
  transform: none;
  transform-origin: center;
}

@keyframes outline {
  from {
    stroke-dasharray: 0, 345.576px;
  }
  to {
    stroke-dasharray: 345.576px, 345.576px;
  }
}
@keyframes circle {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(0);
  }
}
@keyframes check {
  from {
    stroke-dasharray: 0, 75px;
  }
  to {
    stroke-dasharray: 75px, 75px;
  }
}
@keyframes check-group {
  from {
    transform: scale(1);
  }
  50% {
    transform: scale(1.09);
  }
  to {
    transform: scale(1);
  }
}
/*   .wrapper.container-fluid {
    padding-right: 0;
    overflow: hidden;
} */
.imageUpload .img-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.imageUpload .imgCloseBtn {
  position: absolute;
  right: -10px;
  top: -10px;
  color: #000;
  background: #fff !important;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ddd;
  border-radius: 100%;
  cursor: pointer;
}

.postAds tr td {
  vertical-align: middle;
}

.tooltip {
  pointer-events: none;
} /*******remove flikering effect for tooltip****/
.modal-header .btn-close {
  transition: 0.5s;
}
.modal-header .btn-close:hover {
  transform: rotate(360deg) !important;
  transition: 0.5s;
}

.chat-list {
  height: calc(100vh - 110px);
  background-color: #fff;
  border-right: 1px solid #eaedf0;
}

.chat-messages {
  height: calc(100vh - 110px);
  display: flex;
  flex-direction: column;
  background-color: #eef3ff;
}

.search-container {
  background-color: #f6f7f9;
  border-radius: 8px;
  padding: 8px 16px;
  margin: 10px 15px;
  display: flex;
  align-items: center;
}

.search-input {
  background-color: transparent;
  border: none;
  width: 100%;
  color: #666;
  font-size: 14px;
  margin-left: 8px;
}
.search-input:focus {
  outline: none;
}

.chat-header {
  padding: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header-button {
  border: none;
  background: none;
  color: #666;
  font-size: 14px;
  padding: 5px 10px;
}
.header-button.new {
  color: #333;
  font-weight: 500;
}

.chat-list-item {
  padding: 12px 15px;
  cursor: pointer;
  border-bottom: 1px solid #f6f7f9;
}
.chat-list-item:hover {
  background-color: #f8f9fa;
}
.chat-list-item.active {
  background-color: #f6f7f9;
}

.profile-img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #e9ecef;
  display: flex;
  align-items: center;
  justify-content: center;
}

.message-area {
  flex-grow: 1;
  overflow-y: auto;
  padding: 1rem;
}

.message {
  max-width: 75%;
  margin-bottom: 1rem;
}

.message-received {
  background-color: white;
  border-radius: 0.3rem !important;
  padding: 12px 16px;
  margin-right: auto;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.message-sent {
  background-color: #1f6d70;
  color: white;
  border-radius: 0.3rem !important;
  padding: 12px 16px;
  margin-left: auto;
}

.chat-input-container {
  background-color: #fff;
  padding: 15px;
  border-radius: 0.3rem !important;
  margin: 10px;
}

.chat-tools {
  display: flex;
  gap: 10px;
  padding: 10px;
}

.tool-button {
  background: none;
  border: none;
  color: #666;
  width: 40px;
  height: 40px;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tool-button:hover {
  background-color: #1f6d70;
}
.tool-button:hover svg {
  fill: #fff;
}
.tool-button:hover i {
  color: #fff;
}
.tool-button svg {
  width: 20px;
  height: 20px;
}

.chat-meta, .active-status, .preview-text, .time-text {
  font-size: 13px;
  color: #8e8e93;
}

.preview-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

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

.chat-search.active {
  display: block !important;
  background: #fff;
  padding: 5px 20px;
}

.chat-list.active {
  display: block !important;
}

.dropdown-menu.newDropdownWidth {
  min-width: 280px;
  padding: 0.5rem 0;
}
.dropdown-menu.newDropdownWidth .accordion {
  position: relative;
  z-index: 1056;
}
.dropdown-menu.newDropdownWidth .accordion .accordion-button {
  padding: 0.5rem 1rem;
  font-size: 14px;
  font-weight: normal;
  background-color: transparent;
  box-shadow: none;
  color: #212529;
}
.dropdown-menu.newDropdownWidth .accordion .accordion-button::after {
  margin-left: auto;
}
.dropdown-menu.newDropdownWidth .accordion .accordion-button:not(.collapsed) {
  background-color: transparent;
  color: #212529;
}
.dropdown-menu.newDropdownWidth .accordion .accordion-button:focus {
  box-shadow: none;
  border-color: transparent;
}
.dropdown-menu.newDropdownWidth .accordion .accordion-body {
  padding: 0.5rem;
  font-size: 14px;
}

.userProfile img {
  width: 40px;
  height: 40px;
  -o-object-fit: cover;
     object-fit: cover;
}

.profile-details-card {
  background-color: #f8f9fa;
  border-radius: 8px;
}

.dropdown-item {
  padding: 0.5rem 1rem;
}

.upload-container {
  background: #f5f8ff;
  border-radius: 8px;
  padding: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  margin: 0 auto;
}
.upload-container .upload-area {
  border: 1px dashed #1f6d70;
  border-radius: 6px;
  padding: 12px 10px;
  text-align: center;
  background-color: white;
  cursor: pointer;
  transition: all 0.2s ease;
}
.upload-container .upload-area:hover, .upload-container .upload-area.dragover {
  border-color: #2b5df0;
  background-color: #f0f7ff;
}
.upload-container .upload-area i.main-icon {
  font-size: 28px;
  color: #1f6d70;
  margin-bottom: 5px;
  display: block;
}
.upload-container .upload-area h5 {
  color: #333;
  font-weight: 600;
  margin-bottom: 3px;
  font-size: 14px;
}
.upload-container .upload-area p {
  color: #666;
  font-size: 12px;
  margin-bottom: 8px;
}
.upload-container .divider {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 5px 0;
}
.upload-container .divider::before, .upload-container .divider::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #ddd;
}
.upload-container .divider span {
  padding: 0 8px;
  color: #888;
  font-size: 12px;
}
.upload-container .browse-btn {
  background: #1f6d70;
  color: white;
  border: none;
  padding: 5px 12px;
  border-radius: 15px;
  font-size: 12px;
  font-weight: 500;
  box-shadow: 0 2px 5px rgba(43, 93, 240, 0.2);
  transition: all 0.2s;
}
.upload-container .browse-btn:hover {
  background: #2b70e4;
  box-shadow: 0 3px 8px rgba(43, 93, 240, 0.3);
}
.upload-container .browse-btn i {
  margin-right: 3px;
  font-size: 11px;
}
.upload-container .image-preview-container {
  margin-top: 10px;
}
.upload-container .image-preview-container .preview-card {
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}
.upload-container .image-preview-container .preview-card .preview-img-container {
  padding: 5px;
  background-color: #fafafa;
  text-align: center;
}
.upload-container .image-preview-container .preview-card .preview-img-container .preview-img {
  max-height: 150px;
  border-radius: 4px;
}
.upload-container .image-preview-container .preview-card .preview-actions {
  display: flex;
  justify-content: center;
  gap: 5px;
  padding: 6px;
  background-color: white;
}
.upload-container .image-preview-container .preview-card .preview-actions .action-btn {
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
}
.upload-container .image-preview-container .preview-card .preview-actions .edit-btn {
  background-color: #f0f7ff;
  color: #1f6d70;
  border: 1px solid #1f6d70;
}
.upload-container .image-preview-container .preview-card .preview-actions .edit-btn:hover {
  background-color: #1f6d70;
  color: white;
}
.upload-container .image-preview-container .preview-card .preview-actions .remove-btn {
  background-color: #fff0f0;
  color: #ea4335;
  border: 1px solid #ea4335;
}
.upload-container .image-preview-container .preview-card .preview-actions .remove-btn:hover {
  background-color: #ea4335;
  color: white;
}
.upload-container .file-input {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.otpInpBox input {
  width: 60px;
  height: 60px;
  text-align: center;
  font-size: 2rem;
  font-weight: 500;
}

@media (max-width: 1200px) {
  .mobilemenu-icon.d-none, .menuOpen {
    display: block !important;
  }
  .backgroundBg {
    position: fixed;
    background: rgba(0, 0, 0, 0.5);
    transition: 0.5s;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1020;
  }
  .navbar-nav {
    flex-direction: row !important;
  }
  .header .header-content .headerRite .nav-item {
    padding: 0 5px;
  }
  .header .header-content h1 {
    font-size: 20px;
  }
  .wrapper.container-fluid {
    padding-left: 0;
    padding-right: 0;
  }
}
@media (max-width: 650px) {
  .header-menu.px-4 {
    padding: 0 !important;
  }
  .login-container {
    height: auto;
  }
  .imgAds img {
    width: 60px;
  }
}/*# sourceMappingURL=style.css.map */