/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body,
html {
  overflow-x: hidden;
  font-family: "MadaniArabic";
}
p {
  font-weight: 400;
}
a {
  color: #000;
  text-decoration: none;
  transition: 0.5s all;
}
a:hover {
  color: #000000;
  text-decoration: none;
}
html,
body {
  scroll-behavior: smooth;
  padding: 0 !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "MadaniArabic";
}
/*--------------------------------------------------------------
# Fonts
--------------------------------------------------------------*/

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-ExtraLight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-Bold.woff2") format("woff2");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-ExtraBold.woff2") format("woff2");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-Regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-Thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabicVariable";
  src: url("../fonts/MadaniArabicVariable.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "MadaniArabic";
  src: url("../fonts/MadaniArabic-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Outfit";
  src: url("../fonts/Outfit-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Outfit";
  src: url("../fonts/Outfit-Regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Outfit";
  src: url("../fonts/Outfit-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Login Alerts */
.is-invalid {
  border: 1px solid red !important;
}
.text-danger {
  font-size: 12px;
  color: red;
}


/* Login  */
.authpages {
  background: #fef2f7;
  height: 100vh;
  overflow: hidden;
  padding: 20px;
}
.authleft {
  height: calc(100vh - 40px);
  width: 50%;
}
.authinner {
  display: flex;
}
.formpart {
  max-width: 500px;
  margin: 0 auto;
  /* padding: 60px 0; */
}
.authright {
  width: 50%;
  height: calc(100vh - 40px);
  overflow-y: auto;
}
.authright::-webkit-scrollbar {
  display: none;
}
.logoauth img {
  max-width: 148px;
}
.formhead h1 {
  font-weight: 500;
  font-size: 30px;
  margin: 0 0 8px;
  color: #272727;
}
.formhead p {
  font-weight: 400;
  font-size: 19px;
  margin: 0;
}
.labelinput {
  font-size: 16px;
  font-weight: 500;
  color: #272727;
  margin-bottom: 10px;
}
.formauth .form-group .form-control {
  backdrop-filter: blur(112px);
  border: 1px solid #bd6789 !important;
  height: 50px;
  border-radius: 10px;
  box-shadow: none !important;
  font-weight: 500;
  outline: 0 !important;
  font-size: 13px;
  padding-left: 40px;
}
.formauth .form-group .form-control::placeholder {
  color: #797979;
}
.formauth .form-group .numberinput .form-control {
  padding-left: 74px;
}
.formauth .form-group .numberinput .form-select {
  position: absolute;
  top: 14px;
  left: 15px;
  z-index: 1;
  padding: 0;
  width: 55px;
  background-color: transparent;
  border: 0;
  font-weight: 500;
  color: #272727;
  font-size: 13px;
  border-right: 1px solid !important;
  border-radius: 0;
  height: 18px;
  padding-right: 20px;
  background-position: 35px;
  box-shadow: unset !important;
}

.formauth .form-group .numberinput .form-select option{
   text-align: center;
  padding: 8px 12px;
}
.inputicon {
  position: absolute;
  left: 13px;
  top: 16px;
  max-width: 22px;
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
  padding-right: 60px; /* give extra space on the right */
  background-position: right 2.5rem center; /* move the red ⓘ left */
  background-size: 20px 20px;
}
.eyebtn {
  position: absolute;
  border: 0;
  padding: 0;
  background-color: transparent;
  right: 14px;
  top: 10px;
}

.eyebtn img {
  width: 20px;   /* adjust to match your design */
  height: 20px;  /* same height for both icons */
  object-fit: contain;
}



/* .authbtn {
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #bd6789;
  color: #fff !important;
  font-size: 20px;
  font-weight: 500;
  border-radius: 8px;
  cursor: pointer;
}  */

.authbtn {
  border: none;
  outline: none;
  background: #bd6789;
  color: #fff !important;
  height: 60px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 500;
  border-radius: 8px;
  cursor: pointer;
}


.forgotpassword {
  color: #10181e;
  font-size: 14px;
  font-weight: 500;
  font-size: 16px;
}

.custom-checkbox {
  display: flex;
  align-items: center;
  cursor: pointer;
  line-height: 21px;
  color: #10181e;
  font-size: 14px;
  font-weight: 500;
  font-size: 16px;
}
.custom-checkbox input {
  display: none;
}
.custom-checkbox .checkmark {
  width: 19px;
  height: 19px;
  border: 1px solid #bd6789;
  background-color: #fff;
  display: inline-block;
  position: relative;
  border-radius: 0;
  border-radius: 4px;
  margin-right: 12px;
}
.custom-checkbox input:checked + .checkmark {
  background-color: #bd6789;
  border-color: #fff;
}
.custom-checkbox input:checked + .checkmark::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 6px;
  height: 12px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.donthave {
  font-weight: 500;
  font-size: 18px;
}
.donthave a {
  color: #bd6789;
}

/* Container for profile upload */

.profileupload:hover {
  border-color: #bd6789;
}

/* Camera icon (default) */
/* .profileupload img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0.6;
  display: block;
} */

/* Uploaded preview image */
/* .profile-preview {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 50%;
  display: block;
}

.profileupload {
  height: 140px;
  width: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #bd6789;
  border-radius: 50%;
  cursor: pointer;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
} */
/* .profileupload img {
  max-width: 60px;
} */
/* Container */
/* Wrapper to center the circle */
.profileupload-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Circle container */
.profileupload {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  border: 1px;
  cursor: pointer;
  overflow: hidden;
  background: #bd6789;
  transition: border-color 0.3s;
  position: relative;
}

.profileupload:hover {
  border-color: #bd6789;
}

/* Camera icon (default state) */
.profileupload img.camera-icon {
  width: 50px;
  height: 50px;
  object-fit: contain;
  opacity: 0.7;
  z-index: 1; /* stays visible when no preview */
}

/* Uploaded preview */
.profile-preview {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.otpinputs .form-control {
  width: 60px !important;
  height: 50px !important;
  border-radius: 15px !important;
  font-size: 18px !important;
}
.notrecived {
  font-size: 16px;
  font-weight: 500;
}
.resend {
  font-weight: 400;
  color: #797979;
  font-size: 14px;
}
.resend a {
  font-weight: 600;
  color: #272727;
  font-size: 14px;
  border-bottom: 1px solid;
}
.custom-select {
  border: 0;
  padding: 0;
  background-color: transparent;
  color: #ffffff;
  font-weight: 600;
  font-size: 14px;
  outline: 0;
  width: auto;
  display: inline-flex;
  padding-right: 10px;
  background-image: url(../img/Down_Arrow_3_.png);
  background-position: 97%;
  background-repeat: no-repeat;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
.custom-select option {
  background-color: #2d2d2d;
}
.container {
  /* max-width: 1278px; */
  max-width: 90%
}
.topheader {
  height: 52px;
  display: flex;
  align-items: center;
  background: #bd6897;
}
.contantus {
  color: #fff !important;
  font-weight: 600;
  font-size: 14px;
}
.mapbox {
  display: flex;
  align-items: center;
  color: #fff !important;
  font-weight: 600;
  line-height: 18px;
  font-size: 14px;
}
.mapbox span {
  height: 24px;
  width: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #d9eddf;
  border-radius: 50%;
  margin-right: 10px;
}
.mapbox span img {
  max-width: 12px;
}

.storebar {
  background: #fef2f7;
  height: 75px;
  display: flex;
  align-items: center;
}
.storetxt {
  font-weight: 400;
  font-size: 18px;
  color: #bc6896;
}
.storebtn {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #bd6789;
  border-radius: 8px;
  height: 36px;
  padding: 0 10px;
  font-weight: 500;
  font-size: 14px;
}
.storebtn img {
  max-width: 23px;
  margin-right: 7px;
}
.header {
  height: 60px;
  display: flex;
  align-items: center;
  background-color: #fff;
}
.headerlogo img {
  max-width: 98px;
}
.loginregistration {
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #bd6897;
  border-radius: 7px;
  padding: 8px 8px;
  font-weight: 500;
  font-size: 14px;
  line-height: 22px;
}
.loginregistration span {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  height: 23px;
  width: 23px;
  margin-right: 8px;
}
.loginregistration span img {
  max-width: 100%;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.headericons {
  border: 0.92px solid #bd6897;
  height: 42px;
  width: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  transition: all 0.3s ease;
  background-color: #fff;
}
.headericons:hover {
  background-color: #bd68970d;
  border-color: #bd6897;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(189, 104, 151, 0.15);
}
.headericons img {
  max-width: 24px;
  transition: transform 0.3s ease;
}
.headericons:hover img {
  transform: scale(1.05);
}
.headerserchbox {
  width: 710px;
  display: flex;
  align-items: center;
  height: 40px;
  border: 1px solid #bd6789;
  background: #bd68971a;
  border-radius: 20px;
  position: relative;
  margin: 0 auto;
  padding: 11px 14px;
}
.headerserchbox .form-select {
  background-color: transparent;
  font-size: 12px;
  font-weight: 500;
  color: #bd6789;
  border: 0.1px solid #bd6789;
  border-radius: 50px;
  height: 22px;
  padding: 0px 10px 0;
  width: 52px;
  background-position: 29px;
  background-image: url(../img/dropdownarrow.png);
  background-size: 11px;
  box-shadow: unset;
}

.headerserchbox .form-control {
  margin-left: 30px;
  background-color: transparent;
  border: 0;
  height: 28px;
  color: #272727;
  font-size: 14px;
  font-weight: 500;
  box-shadow: unset;
  border: 0;
  background-image: url(../img/search.png);
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 17px;
}
.headerserchbox .form-control::placeholder {
  color: #272727;
}
.footermain {
  padding: 80px 0;
  border-top: 1px solid #ecb6cb;
}
.footerlogo {
  /* text-align: left !important; */
  align-self: flex-start; /* Align only this item to left */
  margin-left: 0; /* Remove auto margins if any */
  margin-right: auto; /* Push to left */

}
.footerlogo img {
  width: 170px;
}
/* .footermenus {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
} */
.footermenus a {
  color: #272727;
  font-size: 16px;
  /* width: 33.3%; */
  width: auto;
  font-weight: 500;
  margin: 15px 0;
}
.socialicons a {
  margin-left: 15px;
}

.socialicons a img {
  max-width: 45px;
  transition: 0.3s ease-in-out;
}
.footermenus a:hover {
  color: #bd6789;
}
.socialicons a:hover img {
  transform: rotateY(380deg);
}
.padding {
  padding: 20px 0;
}
.whychoosebox {
  border: 1px solid #ef95c6;
  background: #fef2f7;
  position: relative;
  border-radius: 25px;
  padding: 60px 40px 40px;
  text-align: center;
  width: 370px !important;
}
.whychoosebox h3 {
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 9px;
}
.whychoosebox p {
  font-weight: 400;
  font-size: 14px;
  margin-bottom: 0;
  color: #797979;
}
.whychoosebox span {
  width: 60px;
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0.5px solid #ef95c6;
  background-color: #fff;
  border-radius: 10px;
  position: absolute;
  top: -23px;
  left: -10px;
}
.commanheading h2 {
  font-weight: 600;
  font-size: 48px;
  /* margin-bottom: 15px; */
  line-height: 58px;
}
.commanheading p {
  color: #797979;
  font-size: 18px;
  margin: 0;
  font-weight: 400;
}
/* .commanheading {
  margin-bottom: 70px;
} */
.bg-1 {
  background-color: #fef2f7;
}
.bg-2 {
  background-color: #fffbfd;
}
.serviceimg {
  border: 1px solid #bd6789;
  overflow: hidden;
  border-radius: 15px;
  height: 249px;
  width: 100%;
}
.serviceimg img {
  max-width: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.servicename {
  background: #ffffff;
  border: 1px solid #ecb6cb;
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 26px;
  padding: 0 0 5px;
  border-radius: 4px;
  margin-bottom: 25px;
}
.ourservicesbox {
  margin: 0 18px;
  display: block;
}
.slick-prev span,
.slick-next span {
  position: absolute;         /* 👈 add this */
  top: 50%;                   /* center vertically */
  transform: translateY(-50%);
  height: 49px;
  width: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  text-indent: -999999px;     /* hide text */
}

.slick-prev span {
  background-image: url(../img/leftarrow.png);
  left: -60px; /* adjust as needed */
}

.slick-next span {
  background-image: url(../img/Rightarrow.png);
  right: -60px; /* adjust as needed */
}

/* .slick-prev span {
  background-image: url(../img/leftarrow.png);
  height: 49px;
  width: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  text-indent: -999999999999999999999999999999999px;
}
.slick-next span {
  background-image: url(../img/Rightarrow.png);
  height: 49px;
  width: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  text-indent: -999999999999999999999999999999999px;
} */
.ourservicesslider .owl-nav {
  display: flex;
  justify-content: space-between;
  width: 100%;
  position: absolute;
  top: 53%;
  z-index: 1;
}
.ourservicesslider .owl-nav .owl-prev {
  margin-left: -42px;
}
.ourservicesslider .owl-nav .owl-next {
  margin-right: -42px;
}
.ourservicesslider .owl-stage-outer {
  z-index: 3;
}
.joinus{
  padding: 10px;
  padding-top: 30px;
  padding-bottom: 60px;
}
.joinuscontent {
  text-align: center;
}
.joinuscontent span {
  color: #0A142F;
  font-size: 14px;
  font-weight: 400;
  /* text-transform: uppercase; */
  display: block;
  margin-bottom: 10px;
}
.joinuscontent h1 {
  font-weight: 400;
  color: #0a142f;
  margin: 0;
  font-size: 55px;
  /* text-transform: uppercase; */
  margin: 20px 0 30px;
  line-height: 54px;
}
.joinuscontent p {
  font-size: 18px;
  font-weight: 400;
  color: #0a142f;
  margin: 0 0 30px;
}
.btnadesign {
  box-shadow: 0px 4px 6px 0px #bc689614;
  background: #bc6896;
  color: #fff !important;
  font-weight: 500;
  height: 60px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  padding: 0 46px;
  font-size: 16px;
  font-weight: 400;
}
.bannertext h1 {
  font-size: 65px;
  color: #000;
  font-weight: 600;
  line-height: 75px;
  margin-bottom: 40px;
}
.bannertext p {
  font-size: 24px;
  margin: 0;
  max-width: 610px;
  font-weight: 500;
}
.productbox {
  box-shadow: 0px 4px 4px 0px #bd689740;
  border: 1px solid #fef2f7;
  background: #ffffff;
  padding: 5px;
  border-radius: 20px;
  margin-bottom: 50px;
}
.producttop {
  height: 279px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  border-radius: 20px;
}
.producttop .imgproduct {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.favrtico {
  background: #f2f2f2;
  height: 48px;
  width: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  position: absolute;
  z-index: 1;
  bottom: 20px;
  right: 20px;
}
.favrtico img {
  max-width: 20px;
}
.ratingbox {
  height: 37px;
  border-radius: 21px;
  background: #ffffff;
  position: absolute;
  left: 20px;
  bottom: 26px;
  color: #000000;
  font-weight: 500;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 3px;
  width: 77px;
}
.ratingbox img {
  margin-right: 5px;
}
.wishlisthead h1 {
  font-size: 32px;
  font-weight: 500;
  margin: 0;
  color: #272727;
}
.producnamebox a {
  font-weight: 600;
  font-size: 24px;
  display: block;
  margin-bottom: 10px;
}
.productcategory {
  font-size: 16px;
  font-weight: 500;
}
.producnamebox {
  padding: 20px 25px 20px;
}
.pricebottom {
  padding: 10px 25px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.privebox {
  font-size: 28px;
  font-weight: 600;
  color: #272727;
}
.productbtmicons img {
  max-width: 48px;
}
.wishlistpage {
  background: #fffbfd;
}
.servicesfilter {
  width: 19.5%;
}
.servicesmain {
  width: 80.5%;
}
.servicespage {
  display: flex;
}
.smhead {
  display: flex;
  align-items: center;
  margin-bottom: 60px;
}
.smhead h2 {
  font-weight: 600;
  font-size: 36px;
  margin: 0;
}
.headimg {
  margin-left: 10px;
  max-width: 40px;
}



.cancellationbtn {
  border: 1px solid #bd6789;
  height: 33px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  color: #272727;
  padding: 0 20px 3px;
}
.servicedetails h3 {
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 12px;
}
.servicedetails span {
  color: #797979;
  display: block;
  font-size: 16px;
}
/* Add or update these styles */
.slick-prev,
.slick-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  width: 40px;
  height: 40px;
  cursor: pointer;
  border: none;
  background: transparent;
  padding: 0;
}

.slick-prev {
  left: -50px;
}

.slick-next {
  right: -50px;
}

.slick-prev img,
.slick-next img {
  width:49px;
  height: 49px;
  object-fit: contain;
}

/* Update the servicenewslider class */
.servicenewslider {
  position: relative;
  padding: 0 60px; /* Add padding to make room for arrows */
}

.servicenewslider .slick-list {
  margin: 0 -15px;
}

.servicenewslider .slick-slide {
  padding: 0 15px;
}

/* Add hover effect */
.slick-prev:hover,
.slick-next:hover {
  opacity: 0.8;
}

/* Ensure arrows are visible on light backgrounds */
.slick-prev:before,
.slick-next:before {
  display: none; /* Remove default slick arrows */
}


.servicenewslider .servicebox {
  margin: 0 15px;
}
.servicenewslider {
  padding: 0 50px;
}

.filtertop {
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background: linear-gradient(135deg, #bd6789 0%, #d084a8 100%);
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  padding: 0 25px;
  border-radius: 15px 15px 0 0;
  box-shadow: 0 2px 8px rgba(189, 103, 137, 0.2);
  margin-bottom: 0;
}
.servicesfilter {
  width: 19.5%;
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  position: sticky;
  top: 20px;
  height: fit-content;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
}

.servicesfilter::-webkit-scrollbar {
  width: 6px;
}

.servicesfilter::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 10px;
}

.servicesfilter::-webkit-scrollbar-thumb {
  background: #bd6789;
  border-radius: 10px;
}

.servicesfilter::-webkit-scrollbar-thumb:hover {
  background: #a3567a;
}

.filtertop img {
  max-width: 22px;
  margin-right: 12px;
  filter: brightness(0) invert(1);
}

.filter-box {
  padding: 25px 20px;
  background: #fafafa;
}

.sort-section {
  background: #fff;
  border-radius: 15px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  margin-top: 20px;
}

.sort-box {
  padding: 25px 20px;
  background: #fafafa;
}

.accordion-item {
  margin-bottom: 12px;
  border: 0;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
}

.accordion-item:hover {
  box-shadow: 0 4px 12px rgba(189, 103, 137, 0.15);
  transform: translateY(-2px);
}

.accordion-header {
  width: 100%;
  text-align: left;
  background: linear-gradient(135deg, #fff 0%, #fef7ed 100%);
  border: none;
  outline: none;
  padding: 15px 18px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #333;
  transition: all 0.3s ease;
}

.accordion-header:hover {
  background: linear-gradient(135deg, #fef7ed 0%, #fedbea 100%);
}

.accordion-header.active {
  background: linear-gradient(135deg, #bd6789 0%, #d084a8 100%);
  color: #fff;
}

.accordion-header .arrow {
  transition: transform 0.3s ease;
  display: inline-flex;
  align-items: center;
}

.accordion-header.active .arrow {
  transform: rotate(-180deg);
}

.accordion-header.active .arrow img {
  filter: brightness(0) invert(1);
}

.accordion-content {
  display: none;
  padding: 15px 18px;
  font-size: 14px;
  color: #555;
  background: #fff;
}

.accordion-content.show {
  display: block;
  animation: slideDown 0.3s ease;
}

@keyframes slideDown {
  from {
    opacity: 0;
    max-height: 0;
  }
  to {
    opacity: 1;
    max-height: 500px;
  }
}

.accordion-content label {
  display: flex;
  align-items: center;
  padding: 8px 0;
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 500;
  color: #333;
}

.accordion-content label:hover {
  color: #bd6789;
  padding-left: 5px;
}

.accordion-content input[type="checkbox"] {
  margin-right: 10px;
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #bd6789;
  border-radius: 4px;
}

.apply-btn {
  background: linear-gradient(135deg, #bd6789 0%, #d084a8 100%);
  color: #fff;
  border: none;
  padding: 12px 24px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(189, 103, 137, 0.3);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.apply-btn:hover {
  background: linear-gradient(135deg, #a3567a 0%, #bd6789 100%);
  box-shadow: 0 6px 16px rgba(189, 103, 137, 0.4);
  transform: translateY(-2px);
}

.apply-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(189, 103, 137, 0.3);
}

.clear-filters-btn {
  background: #fff;
  color: #bd6789;
  border: 2px solid #bd6789;
  padding: 12px 24px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.clear-filters-btn:hover {
  background: #bd6789;
  color: #fff;
  box-shadow: 0 4px 12px rgba(189, 103, 137, 0.3);
  transform: translateY(-2px);
}

.clear-filters-btn:active {
  transform: translateY(0);
}

.innerpageheading {
  margin-bottom: 70px;
}
.innerpageheading h2 {
  color: #272727;
  font-size: 40px;
  line-height: 50px;
  font-weight: 600;
  margin-bottom: 10px;
}
.innerpageheading p {
  color: #797979;
  font-size: 18px;
  font-weight: 400;
  max-width: 700px;
  margin: 0 auto;
  line-height: 28px;
}
.teammemberimg {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  overflow: hidden;
  width: 298px;
  height: 298px;
  border-radius: 50%;
}
.teammemberimg img {
  max-width: 100%;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.teammemberdetails h3 {
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 10px;
}
.teammemberdetails span {
  display: block;
  font-size: 16px;
  font-weight: 400;
  color: #bd6789;
}
.offerbox {
  background: #fef7ed;
  border: 1px solid #f3d5aa;
  padding: 24px 30px;
  border-radius: 15px;
  text-align: center;
}
.viewnowbtn {
  background: #bd6789;
  border-radius: 15px;
  color: #fff !important;
  padding: 8px 22px 10px;
  display: inline-flex;
  font-size: 18px;
  font-weight: 500;
}
.offerbox h3 {
  color: #272727;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 20px;
}
.offerbox h4 {
  color: #272727;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 25px;
}
.reviewhead h2 {
  font-size: 32px;
  font-weight: 600;
  margin: 0;
  color: #272727;
}
.reviewhead {
  padding-bottom: 25px;
  border-bottom: 1px solid #ecb6cb;
}
.ratinguser {
  height: 124px;
  width: 124px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  overflow: hidden;
}
.ratinguser img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.ratingdetails h3 {
  color: #272727;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 8px;
}
.ratingmainpart {
  display: flex;
  color: #272727;
  font-size: 18px;
  font-weight: 500;
  align-items: center;
  margin-bottom: 20px;
  line-height: 16px;
}
.ratingmainpart img {
  margin-right: 3px;
}
.ratingdetails p {
  color: #272727;
  font-size: 14px;
  margin: 0;
  font-weight: 400;
}
.ratingreview {
  margin: 0 0;
  background-color: #fff;
  margin-top: 20px;
  padding: 14px 10px;
  border-radius: 10px;
}
.scrollerpart {
  height: 530px;
  overflow-y: auto;
}
.scrollerpart::-webkit-scrollbar {
  display: none;
}
.topworkbox {
  height: 516px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid #ecb6cb;
  /* margin: 0 18px; */
  border-radius: 20px;
  position: relative;
}
.topworkbox img {
  max-width: 100%;
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: 0.3s ease-in-out;
}
.cateoryslidebx {
  background: #bd6789;
  height: 48px;
  border-radius: 15px;
  font-size: 20px;
  font-weight: 500;
  color: #fff;
  display: flex !important; 
  align-items: center;
  justify-content: center;
  /* margin: 0 18px; */
}
/* .topcategory .owl-stage-outer {
  padding: 0 100px;
  position: relative;
  z-index: 2;
}
.topcategory {
  margin: 60px auto 0;
  width: 880px;
}
.ourtopworkslider {
  position: absolute;
  display: flex;
  justify-content: space-between;
  width: 82%;
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: -108px;
} */

.topcategory {
  margin: 60px auto 0;
  width: 880px;
}

.topcategory .slick-slide {
  padding: 0 15px; /* spacing between items */
}

.ourtopworkslider {
  width: 100%;
  overflow: hidden;
  display: flex;
  justify-content: space-evenly;
  /* margin: ; */
}

.ourtopworkslider .slick-slide {
  padding: 0 20px;
  box-sizing: border-box;
}

.topworkbox {
  position: relative;
  overflow: hidden;
}

.parahove {
  position: absolute;
  bottom: 0;
  background: rgba(0,0,0,0.6);
  color: #fff;
  padding: 10px;
  font-size: 14px;
  transition: all 0.3s ease;
  opacity: 0;
}

.topworkbox:hover .parahove {
  opacity: 1;
}

.serviceprovideprofile {
  background: #fedbea1a;
  padding: 70px 0;
}
.profileimgg {
  margin: 0 auto;
  height: 294px;
  width: 294px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-bottom: 30px;
  overflow: hidden;
}
.profileimgg img {
  max-width: 100%;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
/* .qrbtn {
  background: #bd6789;
  border: 1px solid #bd6789;
  font-size: 22px;
  font-weight: 500;
  color: #ffffff !important;
  height: 55px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 20px;
  padding: 10px 20px 12px;
} */
.qrcodemodal .modal-content {
  background-color: transparent;
  border: 0;
  padding: 0;
}
.providename {
  font-weight: 500;
  font-size: 42px;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.providename img {
  margin-left: 15px;
  max-width: 68px;
}
.providerate {
  font-size: 32px;
  color: #797979;
  font-weight: 400;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  line-height: 23px;
  gap: 7px;
}
.providerate img {
  max-width: 32px;
  /* margin-left: 7px; */
  margin-bottom: 2px;
}
.dtlsbox {
  display: flex;
  align-items: center;
  font-size: 20px;
  font-weight: 500;
  color: #bd6789;
}
.dtlsbox span {
  color: #272727;
  margin-left: 10px;
}
.dtlsbox img {
  margin-right: 10px;
}
.serviceproviderdetails p {
  font-size: 20px;
  font-weight: 400;
  color: #272727;
  margin-bottom: 25px;
  margin-top: 30px;
  text-align: left;
}
.qrcodemodal .modal-dialog {
  max-width: 500px;
}
.qrcodemainbox {
  border-radius: 20px;
  text-align: center;
  background-color: #fff;
  padding: 30px 0;
}
.qrcodemainbox img {
  max-width: 500px;
}
.qrcodemainbox h3 {
  font-weight: 500;
  font-size: 32px;
  margin: 0;
}
.qrcodeactions {
  background: #ffffff;
  margin-top: 30px;
  border-radius: 20px;
  padding: 14px 50px;
  display: flex;
  justify-content: center;
}
.actionsbtns span {
  height: 80px;
  width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #bc6896;
  border-radius: 50px;
  margin: 0 30px 10px;
}
.actionsbtns span img {
  max-width: 41px;
}
.actionsbtns {
  display: block;
  text-align: center;
}
.parahove {
  background: #fffbfd;
  height: 100%;
  width: 100%;
  transition: 0.3s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 30px;
  font-weight: 400;
  font-size: 16px;
  color: #272727;
  line-height: 26px;
  transform: scale(0);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
/* .topworkbox:hover img {
  transform: scale(0);
}
.topworkbox:hover .parahove {
  transform: scale(1);
} */
.breadcrumb-item + .breadcrumb-item::before {
  float: left;
  padding-right: 0.5rem;
  color: #272727;
  content: ">";
}
.breadcrumb .breadcrumb-item a,
.breadcrumb .breadcrumb-item.active {
  color: #272727;
  font-size: 16px;
  font-weight: 500;
}
.productleft {
  border-radius: 20px;
  overflow: hidden;
}
.productimgbox {
  height: 453px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.thumnailimg {
  width: 31%;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.productimgsmain {
  margin-bottom: 25px;
}
.productimgbox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.thumnailimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.productthumbnail {
  display: flex;
  justify-content: space-between;
}
.productdetailsmain {
  padding: 50px 50px 0;
}
.servicedetilname {
  font-weight: 500;
  font-size: 40px;
  margin-bottom: 10px;
  line-height: 50px;
  color: #272727;
}
.ratinggbox {
  color: #ff7308;
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 500;
}
.ratinggbox img {
  max-width: 38px;
  margin-left: 10px;
}
.servicencompany {
  font-size: 32px;
  color: #272727;
  line-height: 42px;
  margin-bottom: 15px;
}
.timer {
  display: flex;
  align-items: center;
  color: #272727;
  font-size: 14px;
  font-weight: 500;
}
.timer img {
  margin-right: 10px;
}
.serviveprice {
  font-weight: 600;
  color: #272727;
  font-size: 32px;
  line-height: 32px;
  margin-bottom: 45px;
}
.bookbtns {
  height: 51px;
  background: #bd6789;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  color: #fff !important;
  font-weight: 500;
  font-size: 16px;
  width: 67%;
}
.detailsinner {
  padding: 15px 0px;
}
.detailsinner p {
  font-weight: 500;
  font-size: 15px;
  color: #272727;
  line-height: 26px;
  margin-bottom: 15px;
}
.detailsinner ul li img {
  margin-right: 10px;
  max-width: 21px;
}
.detailsinner ul li {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}
.detailsinner ul li p {
  margin: 0;
}
.viewdetailstbn {
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: 15px;
  color: #272727;
  border-bottom: 1px solid #ecb6cb;
  padding-bottom: 10px;
  cursor: pointer;
}
.viewdetailstbn img {
  margin-left: 7px;
  margin-bottom: -5px;
}

.detailsinner {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: all 0.4s ease;
}

.detailsinner.show {
  max-height: 500px;
  opacity: 1;
}
.bookservicetabs {
  background: #ffffff;
  border: 1px solid #ecb6cb;
  border-radius: 26px;
  overflow: hidden;
  display: flex;
}
.bookservicetabs nav {
  width: 35.5%;
  background: #fef2f7;
  border-radius: 25px;
  padding: 80px 60px;
}
.bookservicetabs nav .nav-tabs {
  display: block;
}
.bookservicetabs nav .nav-tabs .nav-link {
  width: 100%;
  height: 82px;
  border: 0;
  border-radius: 8px;
  font-weight: 500;
  color: #272727;
  font-size: 18px;
  background-color: #fff;
  margin-bottom: 35px;
}
.bookservicetabs nav .nav-tabs .nav-link.active {
  background-color: #bd6789;
  color: #ffffff;
}
.bookservicetabs nav .nav-tabs .nav-link:last-child {
  margin-bottom: 0;
}
.bookservicetabs .tab-content {
  width: 64.5%;
}
.bokkingform {
  padding: 70px 50px;
}
.bokkingform .form-group label {
  font-size: 18px;
  color: #272727;
  margin-bottom: 12px;
  font-weight: 500;
}
.bokkingform .form-select {
  border: 1px solid #ecb6cb;
  box-shadow: 0px 9px 13px 0px #00000040 !important;
  height: 53px;
  border-radius: 8px;
  padding: 0 18px;
  font-size: 16px;
}
.continuebtns,
.backbtns {
  height: 53px;
  background: #bd6789;
  border-radius: 8px;
  color: #fff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  padding: 0 40px;
  font-weight: 500;
  width: 100%;
  cursor: pointer;
}
.weeksrow .col-auto {
  width: 14.28%;
  text-align: center;
}
.daysrow .col-auto {
  width: 14.28%;
  text-align: center;
}
.daynames {
  font-size: 18px;
  font-weight: 500;
  color: #272727;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}
.daysbox {
  height: 50px;
  background: #2727273b;
  border-radius: 10px;
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: center;
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 12px;
}
.specialday {
  background-color: #fef2f7;
}
.timerboxx {
  border: 1px solid #bd6789;
  height: 35px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  font-weight: 500;
  padding: 0 8px;
  margin-right: 14px;
}
.timetable {
  display: flex;
  overflow-x: auto;
  white-space: nowrap;
  margin: 25px -50px 0px;
  border-top: 1px solid #fef2f7;
  padding: 30px 20px 0;
}
.timetable::-webkit-scrollbar {
  display: none;
}
.bookingsummrybox {
  width: 470px;
  border-radius: 25px;
  background: #fef2f7;
  padding: 36px 30px;
}
.bookingsummrymain {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  /* padding: 100px 0; */
}
.bookingsummrybox h3 {
  color: #000000;
  font-weight: 600;
  font-size: 30px;
  margin-bottom: 30px;
}
.quantitybox {
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #ecb6cb;
  border-radius: 4px;
  width: 160px;
}
.quantitybox span {
  color: #17183b;
  font-weight: 500;
  font-size: 32px;
  width: 25%;
  text-align: center;
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 0 0 5px;
  cursor: pointer;
}
.quantitybox .form-control {
  background-color: transparent;
  border: 0;
  box-shadow: unset !important;
  text-align: center;
  font-weight: 600;
  font-size: 18px;
  width: 50%;
}
.bokingservicerate span {
  font-size: 25px;
  font-weight: 600;
  color: #404040;
}
.bookingsummrybox .bookbtns {
  border-radius: 10px;
  width: 80%;
  font-size: 20px;
  /* padding-bottom: 7px; */
}
.pricedetails {
  border: 1px solid #ecb6cb;
  border-radius: 5px;
  padding: 24px;
}
.pricedetailsinner span {
  color: #797979;
  font-size: 14px;
  font-weight: 400;
}
.pricedetailsinner strong {
  color: #272727;
  font-size: 16px;
  font-weight: 500;
}
.pricedetails h2 {
  font-weight: 600;
  font-size: 20px;
  margin: 0;
}
.promobox .form-control {
  border: 1px solid #f4f4f4;
  border-radius: 10px;
  height: 48px;
  font-size: 16px;
  padding: 0 20px 2px;
  box-shadow: unset !important;
  width: 280px;
}
.Applybtns {
  background: #f3fbf4;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  padding: 0 20px;
  margin-left: 10px;
  font-size: 14px;
}
.noteee {
  font-size: 14px;
  font-weight: 400;
  color: #797979;
  margin-bottom: 20px;
}
.noteee span {
  color: #bc6896;
}
.bottombar {
  border-top: 1px solid #f4f4f4;
  margin-top: 20px;
  padding-top: 15px;
}
.checkoutbtn {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #bc6896;
  border-radius: 10px;
  color: #fff !important;
  font-weight: 500;
  cursor: pointer;
  border: none !important;
}
.checkoutbtn img {
  margin-left: 10px;
}
.bookedforbox {
  border: 1px solid #ecb6cb;
  border-radius: 10px;
  padding: 10px 20px;
}
.bookedaddress {
  color: #818588;
  font-size: 14px;
  font-weight: 400;
  margin-top: 6px;
}
.bookedforuser {
  display: flex;
  align-items: center;
  color: #818588;
  font-size: 12px;
}
.bookedforuser span {
  color: #1b1718;
  margin-left: 5px;
  font-weight: 500;
}
.achange {
  font-size: 12px;
  font-weight: 500;
  color: #e31d1c;
  position: absolute;
  right: 20px;
  top: 10px;
}
.yourbooking > h2 {
  font-size: 20px;
  font-weight: 500;
  color: #1b1718;
  margin-bottom: 10px;
}
.producttable {
  border: 1px solid #ecb6cb;
  overflow: hidden;
  border-radius: 10px;
}
.producttable tr th {
  background-color: #bc6896;
  text-align: center;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  text-transform: uppercase;
  padding: 8px 40px;
}

.producttable tr td {
  color: #1b1718;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  padding: 10px 30px;
  vertical-align: middle;
  border: 0;
}
.table > :not(:first-child) {
  border-top: 0;
}
.producttable thead tr th:first-child {
  text-align: left;
}
.tableprofile {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  height: 86px;
  width: 86px;
}
.tableprofile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tableservicename {
  color: #1b1718;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 2px;
}
.tableservicecategory {
  color: #8b8b8b;
  font-weight: 500;
  font-size: 14px;
}
.datetimeboxx {
  /* height: 26px;
  width: 100%;
  background: #bd6789;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  padding: 0 10px 2px;
  margin-top: 7px; */
  min-height: 26px;
  background: #bd6789;
  border-radius: 10px;
  display: flex;
  align-items: center;
  color: #fff;
  font-size: 11px; /* Reduced from 12px */
  font-weight: 500;
  padding: 4px 12px; /* Adjusted padding */
  margin-top: 7px;
  gap: 12px; /* Adjusted gap */
  white-space: nowrap; /* Prevent wrapping */
  flex-shrink: 0; /* Prevent shrinking */
  width: max-content; /* Fit to content */
  max-width: 100%; /* But don't exceed parent */

}
.addanote {
  border: 1px solid #ecb6cb;
  height: 71px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
  font-size: 14px;
  font-weight: 400;
  color: #1b1718;
}
.addressmodal .modal-dialog {
  max-width: 704px;
}
.addressmodal .modal-content {
  border-radius: 20px;
  border: 0 !important;
}
.addressmodalmainn {
  padding: 30px 40px;
}

.addressmodalmainn h3 {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 35px;
  color: #1b1718;
}
.editadd {
  font-size: 16px;
  font-weight: 600;
  color: #17183b;
  margin-left: 15px;
}
.removeadd {
  font-size: 16px;
  font-weight: 600;
  color: #bd6789;
  margin-left: 15px;
  border-left: 2px solid #f2f2f2;
  padding-left: 15px;
}
.addressname {
  color: #17183b;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 15px;
  display: flex;
  line-height: 17px;
  align-items: center;
}
.addressname span {
  font-size: 12px;
  color: #bd6789;
  margin-left: 10px;
  text-transform: uppercase;
}
.location {
  font-size: 16px;
  font-weight: 400;
  color: #17183b;
  margin-bottom: 5px;
}
.contactno {
  font-size: 14px;
  color: #17183b;
  font-weight: 500;
}
.contactno a {
  font-weight: 300;
}
.circleradio {
  border: 2px solid #bd6789;
  height: 20px;
  width: 20px;
  border-radius: 50px;
  margin-right: 10px;
}
.circleradio span {
  background: #bd6789;
  height: 10px;
  width: 10px;
  border-radius: 50px;
  transition: 0.3s ease-in-out;
  transform: scale(0);
}
.addressradio label {
  display: flex;
}
.addressradio input:checked ~ label .circleradio span {
  transform: scale(1);
}
.addressmodal .btn-close {
  background-image: unset;
  opacity: 1;
  position: absolute;
  top: -50px;
  right: 20px;
}
.commanbox {
  border: 1px solid #bd6789;
  border-radius: 15px;
  padding: 20px;
  width: 100%;
}
.commanform {
  /* border: 1px solid #bd6789; */
  padding: 30px;
}
.commanform .form-group label {
  font-weight: 500;
  font-size: 15px;
  margin-bottom: 8px !important;
}
.commanform .form-group .form-control {
  background: #f7f7f7;
  backdrop-filter: blur(112px);
  border: 1px solid #fef2f7;
  border-radius: 10px;
  height: 38px;
  font-size: 14px;
  font-weight: 400;
  padding: 0 24px 3px;
  box-shadow: unset !important;
}
.commanform .form-group textarea.form-control {
  background: transparent;
  backdrop-filter: blur(112px);
  border: 1px solid #fef2f7;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 400;
  padding: 14px 20px 3px;
  box-shadow: unset !important;
}
.commanform .form-group .form-select {
  background: #f7f7f7;
  backdrop-filter: blur(112px);
  border: 1px solid #fef2f7;
  border-radius: 10px;
  height: 48px;
  font-size: 14px;
  font-weight: 400;
  padding: 0 24px;
  background-image: url(../img/arrowfaq.png);
  box-shadow: unset !important;
  background-repeat: no-repeat;
  background-position: 94%;
}
.countrycode .form-select {
  padding: 0 29px 0 15px !important;
  background-position: 86% !important;
}
.adresstype a {
  height: 30px;
  border-radius: 6px;
  border: 1px solid #bd6789;
  padding: 0 10px 3px 10px;
  font-size: 14px;
  font-weight: 500;
  margin-right: 10px;
}
.commanheader {
  font-size: 20px;
  font-weight: 500;
  color: #1b1718;
  margin-bottom: 10px;
}
.payemnttabs nav {
  width: 40%;
}
.payemnttabs {
  display: flex;
}
.payemnttabs .tab-content {
  width: 60%;
}
.payemnttabs .nav-tabs .nav-link {
  border: 0;
  height: 60px;
  padding: 0 20px;
  width: 100%;
  text-align: left;
  background-color: #f1f1f1;
  color: #797979;
  border-left: 4px solid #f1f1f1;
  border-radius: 0;
}
.payemnttabs .nav-tabs .nav-link.active {
  background-color: #fff;
  border-left: 4px solid #272727;
  color: #272727;
}
.shippingbox h3 {
  font-size: 14px;
  color: #797979;
  font-weight: 400;
  margin-bottom: 20px;
}
.shippingbox {
  padding: 10px 40px;
}
.cardname {
  font-size: 14px;
  font-weight: 500;
  line-height: 18px;
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.cardno {
  font-size: 14px;
  font-weight: 400;
  color: #1b1718;
}
.checkoutbox {
  width: 663px;
  margin: 0 auto;
  border-radius: 20px;
  padding: 25px;
  border: 1px solid #bd6789;
  background: #fef2f7;
}
.checkouttop img {
  max-width: 80px;
  margin-bottom: 16px;
}
.checkouttop h2 {
  font-weight: 600;
  font-size: 26px;
  color: #272727;
  margin: 0 0 15px;
}
.checkouttop p {
  color: #797979;
  margin: 0;
  font-size: 16px;
  font-weight: 400;
}
.bookingnumber {
  font-weight: 600;
  color: #272727;
  font-size: 20px;
  margin-bottom: 5px;
}
.orderdate {
  font-size: 14px;
  color: #797979;
  margin-bottom: 8px;
}
.trackorder {
  /* border: 1px solid #272727; */
  background-color: #bd6789;
  color: #fff;
  height: 40px;
  display: inline-flex;
  padding: 0 13px 3px;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 500;
  border-radius: 10px;
  margin-top: 10px;
  border: none !important; 
}
.bookingdetailsbox h3 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 10px;
}
.bookingdetailsbox a {
  font-size: 14px;
  font-weight: 400;
  display: block;
  margin-bottom: 7px;
}
.bookingdetailsbox p {
  font-size: 14px;
  font-weight: 400;
  display: block;
  margin-bottom: 0;
}
.profilesidebar {
  width: 23%;
  border-right: 1px solid #fef2f7;
  padding: 60px 20px;
}
.profilesidebar a {
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border-radius: 8px;
  margin-bottom: 5px;
  color: #2e2e2e;
  font-size: 16px;
  font-weight: 500;
  padding: 0 15px;
}
.profilesidebar a span {
  width: 24px;
  margin-right: 10px;
}
.profilesidebar a span img {
  max-width: 24px;
}
.profilesidebar a.active {
  background-color: #bd6897;
  color: #ffffff;
}
.profilesidebar a.active span img {
  filter: invert(1) brightness(20.5);
}
.profiletopbar {
  background-color: #bd6789;
  height: 45px;
  padding: 0 40px;
  display: flex;
  align-items: center;
}
.dropbutton {
  display: flex;
  align-items: center;
  color: #fff !important;
  font-weight: 500;
  font-size: 14px;
  border-right: 1px solid #fff;
  padding-right: 15px;
  margin-right: 15px;
}
.menusprofile {
  color: #fff !important;
  font-weight: 400;
  font-size: 14px;
  display: block;
  line-height: 19px;
}
.profilecotent {
  width: 77%;
  padding: 60px 20px;
}
.profilebtns {
  height: 44px;
  background: #bd6789;
  border-radius: 8px;
  color: #fff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  padding: 0 40px;
  font-weight: 500;
  width: 100%;
  cursor: pointer;
}
.profilebtnsdownload{
  height: 44px;
  background: #bd6789;
  border-radius: 8px;
  color: #fff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  padding: 0 40px;
  font-weight: 500;
  /* width: 100%; */
  cursor: pointer;
}
.profilebtnsdiscount{
  height: 44px;
  background: #bd6789;
  border-radius: 8px;
  color: #fff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  padding: 0 40px;
  font-weight: 500;
  /* width: 100%; */
  cursor: pointer;
}
.profilebtns1 {
  height: 44px;
  background: transparent;
  border-radius: 8px;
  border: 1px solid #bd6789;
  color: #2d2d2d !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  padding: 0 40px;
  font-weight: 500;
  width: 100%;
}
.profilehead h2 {
  color: #2e2e2e;
  font-size: 20px;
  margin: 0 0 4px;
  font-weight: 600;
}
.profilehead p {
  font-size: 14px;
  margin: 0;
  color: #2e2e2e;
  font-weight: 400;
}
.profilehead {
  border-bottom: 1px solid #fef2f7;
  padding-bottom: 15px;
  margin-bottom: 15px;
}
.profileic {
  height: 60px;
  width: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 2.25px solid #bd6789;
  border-radius: 50px;
}
.profileic img {
  max-width: 100%;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.profileedit {
  position: absolute;
  bottom: -5px;
  right: 10px;
}
.profliupload {
  border: 1px solid #fef2f7;
  border-radius: 15px;
  margin: 0;
  padding: 15px 8px;
}
.profiledetailss span {
  color: #797979;
  font-size: 12px;
  display: block;
  font-weight: 500;
}
.profiledetailss h3 {
  font-size: 24px;
  font-weight: 500;
  margin: 0;
  color: #2e2e2e;
}
.bookinghead {
  padding: 19px 24px;
}
.bokkingdetailstable tr td {
  font-weight: 400;
  font-size: 15px;
  padding: 10px 24px;
  border: 0;
  white-space: nowrap;
}
.bokkingdetailstable tr td span {
  color: #bd6897;
}
.bokkingdetailstable tr th {
  font-weight: 500;
  font-size: 12px;
  padding: 10px 24px;
  border: 0;
  color: #797979;
  background: #fef2f7;
  border-top: 1px solid #bd6789;
  border-bottom: 1px solid #bd6789;
}
.viewdetailsbtn {
  font-weight: 500;
  color: #bd6897;
  font-size: 14px;
}
.filterselect .form-select {
  border: 0;
  padding: 0 33px 0 0;
  font-size: 12px;
  color: #797979;
  font-weight: 600;
  line-height: 18px;
  box-shadow: unset;
}
.mybookingpage {
  border-radius: 10px;
}
.countnumber {
  height: 40px;
  width: 40px;
  background: #ffffff;
  border: 1px solid #797979;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  color: #bc6896;
  font-size: 14px;
  padding-bottom: 3px;
}
.countnumber.active {
  background-color: #bc6896;
  color: #fff;
  border-color: #bc6896;
}
.logoutmodal .modal-dialog {
}
.logoutmodal .modal-content {
  border: 1px solid #000000;
  border-radius: 20px;
}
.logoutinner h3 {
  font-size: 30px;
  font-weight: 600;
  color: #231c26;
  margin-bottom: 10px;
}
.logoutinner p {
  font-size: 18px;
  font-weight: 400;
}
.logoutinner {
  padding: 40px 30px;
}
.logoutinner img {
  margin-bottom: 18px;
}
.modalbtns1 {
  height: 50px;
  background: #bd6789;
  border-radius: 8px;
  color: #fff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  padding: 0 30px;
  font-weight: 500;
  width: 100%;
}
.modalbtns2 {
  height: 50px;
  background: #fff;
  border: 1px solid #bd6789;
  border-radius: 8px;
  color: #1b1718 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  padding: 0 30px;
  font-weight: 500;
  width: 100%;
}
.bk_details {
  border: 1px solid #fef2f7;
  background: #fffbfd;
  padding: 30px;
}
.bkdetailstops {
  background: #ffffff;
  border: 1px solid #bd6789;
  border-radius: 14px;
  padding: 15px 30px;
}
.serviceid {
  font-size: 24px;
  font-weight: 500;
  color: #272727;
  margin-bottom: 10px;
  line-height: 24px;
}
.bokingplaced {
  font-size: 14px;
  font-weight: 400;
  display: block;
}
.bookingprice {
  color: #1b1718;
  font-weight: 600;
  font-size: 28px;
  line-height: 28px;
}
.myprofilemain .producttable {
  background-color: #fff;
}
.bokingbotmdetails {
  background: #ffffff;
  border: 1px solid #bd6789;
  border-radius: 10px;
  padding: 20px 30px;
}
.bokingbotmleft h3 {
  color: #1b1718;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 15px;
}
.bokingbotmleft strong {
  color: #1b1718;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 15px;
  display: block;
}

.bokingbotmleft span {
  color: #1b1718;
  font-size: 14px;
  font-weight: 500;
  display: block;
}
.bokingbotmright h3 {
  color: #1b1718;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 15px;
}
.bookingaddressbox p {
  color: #818588;
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
  margin-top: 5px;
  margin-bottom: 0;
}
.bookingaddressbox strong {
  font-size: 14px;
  font-weight: 600;
  display: block;
}
.bookingcontact {
  color: #1b1718;
  font-weight: 500;
  font-size: 14px;
  margin-bottom: 5px;
}
.bookingcontact a {
  font-size: 14px;
  color: #818588;
  font-weight: 400;
}
.ratinghead {
  font-size: 16px;
  font-weight: 600;
  line-height: 18px;
}
.selectreatingbox {
  background: #ffffff;
  border: 1px solid #bd6789;
  border-radius: 10px;
  padding: 20px 30px;
}
.writerevicebtn {
  border: 1px solid #ecb6cb;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 400;
  height: 71px;
  border-radius: 10px;
}
.addressactions a {
  height: 48px;
  border: 1px solid #bc6896;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  font-size: 15px;
  font-weight: 600;
  color: #bc6896;
  padding-bottom: 4px;
}
.border-theme {
  border: 1px solid #ecb6cb !important;
}
.langcheckbox label {
  position: absolute;
  height: 22px;
  width: 22px;
  display: block;
  right: 15px;
  top: 12px;
}
.langcheckbox label::after {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  bottom: 0;
  height: 20px;
  width: 20px;
  background-color: #fff;
  border: 1.25px solid #ecb6cb;
  border-radius: 3px;
}
.langcheckbox input:checked ~ label::after {
  background-color: #bd6789;
}
.langcheckbox input:checked ~ label::before {
  transform: scale(1);
}
.langcheckbox label::before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  bottom: 0;
  height: 20px;
  width: 20px;
  background-image: url(../img/check.png);
  transform: scale(0);
  transition: 0.3s ease-in-out;
  z-index: 1;
  background-size: 12px;
  background-repeat: no-repeat;
  background-position: center;
}
.langcheckbox span {
  font-size: 14px;
  font-weight: 400;
  position: absolute;
  top: 11px;
  left: 22px;
}
.walletbox {
  padding: 16px;
  border-radius: 14px;
  border: 1px solid #bd6897;
  position: relative;
  background-color: #fff;
}
.walletbox h3 {
  color: #1d2127;
  font-size: 14px;
  margin-bottom: 20px;
}
.walletbox h4 {
  margin: 0;
  color: #1d2127;
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 20px;
}
.walletbox span {
  width: 60px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 22px;
  border: 1px solid #bd6789;
  position: absolute;
  right: 20px;
  top: 20px;
}
.amoutwithdraw {
  border: 2px dashed #bd6789;
  border-radius: 16px;
  padding: 15px;
  text-align: center;
}
.walleticons {
  display: block;
  margin: 0 auto 10px;
  max-width: 44px;
}
.amoutwithdraw a img {
  margin-right: 8px;
}
.amoutwithdraw a {
  background: #bc6896;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  color: #fff;
  font-size: 13px;
  font-weight: 400;
}
.loyaltypointsbox {
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid #bc6896;
  padding: 15px;
  display: flex;
  align-items: center;
}
.loyalty_txt h3 {
  font-size: 14px;
  font-weight: 600;
  color: #1b1718;
  margin-bottom: 4px;
}
.loyalty_txt span {
  display: block;
  font-size: 12px;
  color: #818588;
  font-weight: 500;
  margin-bottom: 3px;
}
.loyalty_txt strong {
  font-size: 12px;
  font-weight: 600;
  color: #1b1718;
  display: block;
}
.loyalty_txt a {
  font-size: 14px;
  font-weight: 500;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #bc6896;
  height: 35px;
  border-radius: 10px;
  color: #fff;
  margin-top: 10px;
}
.loyaltyicons {
  width: 33%;
}
.loyalty_txt {
  width: 77%;
}
.loyaltyicons img {
  max-width: 90%;
}
.loginmain {
  border: 1px solid #ecb6cb;
  padding: 30px 40px;
  background: #fffbfd;
  border-radius: 20px;
}

.notification .dropdown-menu {
  box-shadow: 0px 4px 26px 0px #00000040;
  border-radius: 20px;
  border: 0;
  width: 505px;
  right: 0;
  left: auto;
  overflow: hidden;
  top: 53px !important;
  transform: unset !important;
  padding: 0;
}
.notificationhead {
  background: #fef2f7;
  height: 68px;
  padding: 0 25px;
  display: flex;
  align-items: center;
  color: #272727;
  font-size: 18px;
  font-weight: 600;
}
.notificationinner {
  padding: 20px 20px;
}
.notificationlink {
  border: 1px solid #ecb6cb;
  display: flex;
  border-radius: 20px;
  padding: 14px 2px;
}
.notificationimg {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
  width: 80px;
  overflow: hidden;
  border-radius: 50px;
}
.notificationimg img {
  max-width: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.notificationtxt h2 {
  color: #272727;
  font-size: 16px;
  margin-bottom: 4px;
  font-weight: 600;
  line-height: 20px;
}
.notificationtxt p {
  font-size: 12px;
  font-weight: 400;
  color: #272727;
  margin: 0;
}
.notificationtime {
  font-size: 13px;
  font-weight: 400;
  color: #272727;
  margin: 0;
}
.notificationinner {
  padding: 20px 20px;
  height: 360px;
  overflow-y: auto;
  margin-bottom: 20px;
}
.viewallbtns {
  background: #f7f7f7;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  font-weight: 500;
  font-size: 14px;
  color: #272727;
  height: 35px;
  padding: 0 18px;
  margin: 0 20px 0;
  display: inline-flex;
  align-items: center;
}
.viewallbtns img {
  margin-left: 8px;
}
.notificationhead a {
  color: #797979;
  font-size: 14px;
  font-weight: 400;
}
.commancss {
  border: 1px solid #bd6789;
  background: #fff;
  border-radius: 16px;
  padding: 20px;
}

.helpresources {
  border: 1px solid #fef2f7;
  background: #fffbfd;
  border-radius: 10px;
  padding: 16px;
  display: flex;
  align-items: center;
}
.helpcontent h3 {
  color: #272727;
  font-size: 16px;
  margin: 0;
  font-weight: 500;
}
.helpcontent p {
  color: #272727;
  font-size: 14px;
  font-weight: 400;
  margin: 0;
}
.suppottopbpoxs {
  border: 1px solid #bd6789;
  background: #fff;
  border-radius: 16px;
}
.commanform .accordion-item {
  border: 1px solid #ecb6cb !important;
  border-radius: 12px !important;
  overflow: hidden;
}
.commanform .accordion-button {
  color: #272727;
  font-weight: 500;
  padding: 0px 20px 4px;
  height: 56px;
}
.commanform .accordion-button:not(.collapsed) {
  color: #272727;
  background-color: #fffbfd;
  box-shadow: unset;
}
.commanform .accordion-button:not(.collapsed)::after {
  filter: brightness(0.5);
}
.uploadimg {
  backdrop-filter: blur(112px);
  border: 2px dashed #bd6789 !important;
  height: 50px;
  border-radius: 10px;
  box-shadow: none !important;
  font-weight: 500;
  outline: 0 !important;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  color: #797979;
  cursor: pointer;
}
.uploadimg img {
  margin-right: 10px;
}
.addimg {
  border: 1px solid #bd6789 !important;
}
.choosefiles {
  backdrop-filter: blur(112px);
  border: 1px solid #bd6789 !important;
  height: 50px;
  border-radius: 10px;
  box-shadow: none !important;
  font-weight: 500;
  outline: 0 !important;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #fff;
  color: #797979;
  cursor: pointer;
  text-align: left;
  padding: 0 20px;
}
.formauth .langcheckbox span {
  font-size: 14px;
  top: 13px;
  left: 22px;
}
.account-verify {
  background: #ffffff;
  border: 1px solid #bd6789;
  border-radius: 16px;
  padding: 32px;
}
.account-verify h2 {
  font-size: 24px;
  font-weight: 600;
  margin: 20px 0 20px;
}
.account-verify p {
  font-size: 16px;
  line-height: 24px;
  color: #797979;
  margin-bottom: 16px;
}
.account-verify span {
  font-weight: 500;
  font-size: 14px;
  color: #6b7280;
}
.totalerning {
  padding: 16px;
  border-radius: 14px;
  border: 1px solid #bd6897;
  position: relative;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.totalerning span {
  font-size: 18px;
  font-weight: 600;
}
.totalerning strong {
  font-size: 24px;
  font-weight: 500;
  color: #272727;
}
.serviceprovidewallet tr td {
  border-top: 1px solid #bd6789;
}
.filtersrow .form-control {
  height: 30px;
  border: 1px solid #bd6789;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  color: #797979;
  padding: 0 7px 2px;
  box-shadow: unset !important;
  width: 290px;
}
.filtersrow .form-select {
  height: 30px;
  border: 1px solid #bd6789;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  color: #797979;
  padding: 0 7px 2px;
  box-shadow: unset !important;
  width: 190px;
}
.filtersrow label {
  font-size: 14px;
  font-weight: 500;
  color: #000000;
  white-space: nowrap;
}
.applyfilters {
  background-color: #bd6789;
  color: #fff;
  border: none;
  padding: 3px 12px;
  border-radius: 4px;
  width: 100%;
  font-size: 12px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
}
.Calendarbtn {
  color: #272727;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  border: 0.5px solid #bd6789;
  border-radius: 10px;
  padding: 0 16px;
  font-size: 15px;
  color: #272727;
  background-color: #fff;
}
.Calendarbtn img {
  margin-right: 10px;
}

.bookingstats {
  background: #ffffff;
  border: 1px solid #ecb6cb;
  border-radius: 14px;
  padding: 14px 24px;
}
.bookingstats span {
  font-weight: 600;
  color: #797979;
  font-size: 14px;
  display: block;
  margin-bottom: 10px;
}
.bookingstats strong {
  font-weight: 500;
  color: #272727;
  font-size: 12px;
  display: block;
  margin-bottom: 0;
}
.bookingstats h2 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 14px;
}
.headsearch .form-control {
  height: 40px;
  border: 0.5px solid #bd6789;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  padding: 0 10px 2px 40px;
  width: 170px;
  background-image: url(../img/Magnifyingglass.png);
  background-position: 8px;
  background-repeat: no-repeat;
}
.bookignoverviewbox {
  background: #ffffff;
  border: 1px solid #bc6896;
  border-radius: 16px;
  padding: 21px;
  display: block;
}
.bookingiddd {
  font-size: 14px;
  font-weight: 500;
}
.bokkingrate {
  font-size: 16px;
  color: #bd6789;
  font-weight: 600;
}
.bookingmiddetails h3 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}
.bookingmiddetails span {
  color: #797979;
  font-size: 14px;
  display: block;
  font-weight: 500;
  margin-bottom: 8px;
}
.bookingmiddetails p {
  color: #797979;
  font-size: 14px;
  display: block;
  font-weight: 500;
  margin-bottom: 0;
}
.bookinguiser {
  border: 1px solid #bc6896;
  font-size: 11px;
  border-radius: 3px;
  padding: 0 4px;
  height: 22px;
  display: flex;
  align-items: center;
  padding-bottom: 2px;
  font-weight: 500;
}
.bookigtimeer {
  font-size: 13px;
  font-weight: 600;
  color: #797979;
}
.bookingbadge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  background-color: #000;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  height: 25px;
  padding-bottom: 3px;
  border-radius: 4px;
}
.upcomingbg {
  background-color: #bc6896;
}
.completedbg {
  background-color: #22c55e;
}
.cancleedbg {
  background-color: #ef4444;
}
.pendingbg {
  background-color: #fbbf24;
  color: #000;
}
.bookingoverhead {
  font-size: 16px;
  font-weight: 500;
}
.bookingdetailsbox {
  border: 1px solid #ecb6cb;
  border-radius: 16px;
  padding: 30px;
  background-color: #fff;
}
.detailsboxdata span {
  font-size: 14px;
  display: block;
  font-weight: 500;
  color: #797979;
  margin-bottom: 4px;
}
.detailsboxdata strong {
  font-size: 16px;
  display: block;
  font-weight: 600;
  color: #1f2937;
}
.noteesdetails {
  border-top: 1px solid #bc6896;
  padding-top: 13px;
}
.noteesdetails span {
  font-size: 14px;
  display: block;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 5px;
}
.noteesdetails p {
  color: #797979;
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}
.bookingdetailsbox .markcompleted {
  height: 40px;
  border-radius: 8px;
  background: #3b82f6;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0px 20px 2px;
  font-weight: 500;
  color: #fff;
  font-size: 14px;
  cursor: pointer;
}
.bookingdetailsbox .markcompleted img {
  margin-right: 6px;
  margin-bottom: -2px;
}
.bookingdetailsbox .bookcancel {
  height: 40px;
  border-radius: 8px;
  background: #ef4444;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0px 20px 2px;
  font-weight: 500;
  color: #fff;
  font-size: 14px;
  cursor: pointer;
}
.bookingdetailsbox .bookcancel img {
  margin-right: 6px;
  margin-bottom: -2px;
}
.bookingdetailsbox .editbook {
  color: #1f2937;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 18px;
  padding: 0 20px;
  font-size: 14px;
}
.bookingdetailsbox .editbook img {
  margin-right: 6px;
}
.staffbox {
  background: #ffffff;
  border: 1px solid #bc6896;
  border-radius: 16px;
  position: relative;
  padding: 25px;
}
.staffprofile {
  height: 80px;
  display: flex;
  width: 80px;
  margin: 0 auto 10px;
  border-radius: 50px;
  overflow: hidden;
}
.staffname {
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 8px;
}
.staffposition {
  color: #797979;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
}
.staffservices {
  color: #797979;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
  line-height: 22px;
}
.staffbtns a {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  width: 50%;
  font-weight: 600;
  font-size: 14px;
  color: #fff;
  padding: 0 0 3px;
}
.staffbtns img {
  margin-right: 6px;
}
.staffbtns a:first-child {
  background-color: #bc6896;
  margin-right: 5px;
}
.staffbtns a:last-child {
  background-color: #ef4444;
  margin-left: 5px;
}

.toggle-container {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: center;
}

.toggle-switch {
  position: relative;
  width: 40px;
  height: 24px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #bc6896;
  cursor: pointer;
  transition: all 0.3s ease;
}

.toggle-switch.enabled {
  background: #bc6896;
  border: 1px solid rgba(233, 30, 99, 0.3);
}

.toggle-circle {
  position: absolute;
  top: 3px;
  left: 4px;
  width: 16px;
  height: 16px;
  background: #bc6896;
  border-radius: 50%;
  transition: all 0.3s ease;
}

.toggle-switch.enabled .toggle-circle {
  left: 18px;
  background: #fff;
}

.toggle-label {
  font-size: 14px;
  font-weight: 500;
  color: #272727;
  user-select: none;
  line-height: 18px;
}
/* Hover effects */

/* Animation for demonstration */
.toggle-switch:active .toggle-circle {
  transform: scale(0.9);
}

.staffmain {
  overflow-y: auto;
  height: 710px;
}

::-webkit-scrollbar {
  width: 10px;
  border-radius: 0;
}

/* Track */
/* ::-webkit-scrollbar-track {
  background: #ecb6cb;
} */

/* Handle */
/* ::-webkit-scrollbar-thumb {
  background: #bd6789;
} */

/* Handle on hover */
/* ::-webkit-scrollbar-thumb:hover {
  background: #bd6789;
} */


.staffviewdetails {
  border: 1px solid #bc6896;
}
.staffviewdetails .profiledetailss h3 {
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 3px;
}
.servicesboxxx {
  background: #fef2f7;
  border-radius: 10px;
  padding: 22px 24px;
}
.servicesimggg {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  height: 204px;
  border-radius: 10px;
}
.servicesimggg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.serviceinnner h3 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 0;
}
.priceeservice {
  color: #bc6896;
  font-size: 14px;
  font-weight: 500;
}
.serviceeetimmer {
  font-size: 14px;
  font-weight: 600;
  color: #272727;
}
.paraservices {
  font-size: 14px;
  color: #272727;
  font-weight: 400;
}

.servicesboxxx .staffbtns a {
  padding: 0 18px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}
.slotsdelete {
  position: absolute;
  top: 10px;
  right: 20px;
}
.slotinputs .toggle-container {
  position: absolute;
  right: 50px;
  top: 12px;
}
.addslot {
  height: 38px;
  background: #bd6789;
  border-radius: 8px;
  color: #fff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  padding: 0 10px;
  font-weight: 500;
  width: 100%;
}

.slotaloted {
    min-height: 380px;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    border: 1px solid #BC6896;
    border-radius: 16px;
    padding: 25px;
}
.slotaloted > div {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.slotaloted-actions {
    margin-top: auto;
}
.slothead {
    color: #272727;
    font-weight: 600;
    font-size: 18px;
    margin-bottom: 12px;
}
.slotlist {
    padding-left: 25px;
}
.slotlist span{
    font-weight: 400;
    font-size: 14px;
    display: block;
}
.lastupdate {
    font-weight: 500;
    font-size: 15px;
    text-align: right;
}
.profilecommaanbox { 
    border: 1px solid #ECB6CB;
    background-color: #fff;
    border-radius: 14px;
    padding: 20px;
}
.headdd {
    font-weight: 600;
    color: #797979;
    margin-bottom: 20px;
    font-size: 16px;
}
.progressinner p {
    margin: 0;
    font-size: 12px;
    color: #797979;
    padding-left: 14px;
}
.progressinner {
    display: flex;
    align-items: center;
}
.progressinner strong {
    font-size: 28px;
    font-weight: 700;
    color: #1D2127;
}
.progressbtm {
    display: flex;
    align-items: center;
    color: #272727;
    font-size: 14px;
    font-weight: 500;
}
.progressbtm span{
    color: #BC6896;
    margin-left: 10px;
    margin-right: 10px;
}
.ffeaturedinner h3 {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
}
.ffeaturedinner {
    border: 1px solid #ECB6CB;
    background: #FEF2F7;
    border-radius: 48px;
    display: inline-flex;
    align-items: center;
    height: 39px;
    padding: 0 14px;
}
.ffeaturedinner img{
    margin-right: 8px;
}
.hawaafeatured p {
    font-size: 12px;
    font-weight: 500;
    color: #272727;
    margin: 0;
}
.keymetrixbox {
    border: 1px solid #ECB6CB;
    border-radius: 10px;
    padding: 10px;
}
.keymetrixbox span{
    font-size: 11px;
    font-weight: 500;
    display: block;
    color: #272727;
}
.keymetrixbox strong{
    font-size: 18px;
    font-weight: 700;
     display: block;
    color: #272727;
}
.head1{
    font-weight: 500;
    font-size: 20px;
    margin-bottom: 20px;
}
.Personalizedprofifile {
    display: flex;
    align-items: center;
    height: 84px;
    width: 84px;
    overflow: hidden;
    border-radius: 50px;
    margin-right: 15px;
}
.Personalizedprofifile img{
    max-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.editbtn a {
    border: 1px solid #BD6789;
    border-radius: 7px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
}
.contactinforr span {
    margin-bottom: 4px;
    color: #797979;
    font-size: 13px;
    display: block;
    font-weight: 500;
}
.contactinforr strong { 
    color: #1A1A1A;
    font-size: 13px;
    font-weight: 600;
    display: block;
}
.qrbox img {
    max-width: 65px;
    margin-right: 12px;
}
.qrbox span{
    color: #797979;
    font-size: 13px;
    margin-top: 10px;
    display: block;
}
.qrbox strong{
    font-weight: 600;
    font-size: 16px;
    color: #272727;
}
.documentupdated {
    color: #272727;
    font-weight: 500;
    display: flex;
    align-items: center;
    font-size: 14px;
}
.documentupdated img{
    margin-right: 5px;
}
.viewdocuments {
    color: #797979;
    font-size: 14px;
    font-weight: 500;
}
.uploadedservices {
    /* width: 31%; */
    height: 102px;
    border-radius: 8px;
    /* border: 1px solid #BD6789; */
    overflow: hidden;
}
.uploadedservices img{
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.radiobtn label {
    position: relative;
    display: inline-block;
    padding-left: 32px;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
}

.radiobtn label::after{
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    height: 20px;
    border: 1px solid #BC6896;
    width: 20px;
    border-radius: 50px;
}

.radiobtn label::before {
    position: absolute;
    content: '';
    top: 4px;
    left: 4px;
    height: 12px;
    background-color: #BC6896;
    width: 12px;
    border-radius: 50px;
    transform: scale(0);
    transition: 0.3s ease-in-out;
}
.radiobtn input:checked ~ label::before{
    transform: scale(1);
}
/* Slick arrows */

.slick-arrow {
  background: transparent;
  height: 49px;
  width: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  outline: none;
  cursor: pointer;
  z-index: 2;
}

.slick-prev-owl {
  left: -60px;
  background-image: url("/assets/img/Leftarrow.png");
}

.slick-next-owl {
  right: -60px;
  background-image: url("/assets/img/Rightarrow.png");
}

/* Override default slick dots completely */
.authslider .slick-dots,
.authslider .slick-dots * {
  box-sizing: border-box !important;
}

/* Custom styling for react-slick dots to match owl-carousel */
.authslider .slick-dots {
  bottom: 175px !important;
  position: absolute !important;
  display: flex !important;
  z-index: 2 !important;
  height: 10px !important;
  width: 100% !important;
  left: 50px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.authslider .slick-dots li {
  margin-right: 3px !important;
  display: inline-block !important;
}

.authslider .slick-dots li button {
  width: 20px !important;
  height: 10px !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  opacity: 0.5 !important;
  transition: 0.3s ease-in-out !important;
  border: none !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  cursor: pointer !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
}

.authslider .slick-dots li button:before {
  display: none !important;
}

.authslider .slick-dots li.slick-active button {
  opacity: 1 !important;
  width: 26px !important;
}

/* Responsive styles for react-slick dots */
@media (max-width: 1200px) {
  .authslider .slick-dots {
    bottom: 120px !important;
    left: 30px !important;
  }
}

@media (max-width: 1023px) {
  .authslider .slick-dots {
    bottom: 30px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    justify-content: center !important;
  }
}

@media (max-width: 767px) {
  .authslider .slick-dots {
    bottom: 22px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    justify-content: center !important;
  }

  .authslider .slick-dots li button {
    width: 15px !important;
    height: 8px !important;
  }

  .authslider .slick-dots li.slick-active button {
    width: 25px !important;
  }
}

@media (max-width: 480px) {
  .authslider .slick-dots {
    bottom: 15px !important;
  }

  .authslider .slick-dots li button {
    width: 12px !important;
    height: 6px !important;
  }

  .authslider .slick-dots li.slick-active button {
    width: 20px !important;
  }
}

/* iPad Pro and Nest Hub class devices: ensure dots are bottom-centered */
@media (min-width: 1024px) and (max-width: 1366px) {
  .authslider .slick-dots {
    bottom: 30px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    justify-content: center !important;
  }
}

/* Service Slider Responsive Fixes */
.servicesslider {
  /* position: relative;
  padding: 0 60px;
  overflow: hidden; */
  min-height: 300px; /* Prevent layout shift */
}

.servicesslider .slick-list {
  margin: 0 -15px;
  overflow: visible;
}

.servicesslider .slick-slide {
  padding: 0 15px;
}

.servicesslider .slick-track {
  display: flex !important;
  align-items: stretch;
}

.servicesslider .slick-slide {
  height: auto;
}

.servicesslider .slick-slide > div {
  height: 100%;
  display: block !important;
}
/* Service box responsive fixes */
.servicebox {
  max-width: 100%;
  /* border: 1px solid #ecb6cb; */
  padding: 30px;
  border-radius: 16px;
  margin: 0 auto;
  display: block;
  background: #f8f8f8;
  height: 100%;
  transition: all 0.3s ease;
}

.servicebox:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.serviceboximg {
  height: 128px;
  width: 128px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 2px solid #bd6789;
  overflow: hidden;
  margin: 0 auto 15px;
}

.serviceboximg img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.servicedetails h3 {
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 12px;
  color: #272727;
}

.servicedetails span {
  color: #797979;
  display: block;
  font-size: 16px;
}

/* Arrow positioning fixes */
.servicesslider .slick-prev {
  left: -50px;
}

.servicesslider .slick-next {
  right: -50px;
}

.servicesslider .slick-prev,
.servicesslider .slick-next {
  width: 49px;
  height: 49px;
  z-index: 10;
}

.servicesslider .slick-prev img,
.servicesslider .slick-next img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Mobile Responsiveness for Services Slider */
@media (max-width: 1400px) {
  .servicesslider {
    padding: 0 50px;
  }
}

@media (max-width: 1200px) {
  .servicesslider {
    padding: 0 40px;
  }
  
  .servicebox {
    padding: 20px 15px;
  }
  
  .serviceboximg {
    height: 110px;
    width: 110px;
  }
}

@media (max-width: 992px) {
  .servicesslider {
    padding: 0 20px;
  }
  
  .servicesslider .slick-prev,
  .servicesslider .slick-next {
    display: none !important;
  }
  
  .servicebox {
    padding: 20px 15px;
    max-width: 100%;
  }
  
  .serviceboximg {
    height: 100px;
    width: 100px;
  }
  
  .servicedetails h3 {
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  .servicesslider {
    padding: 0 15px;
  }
  
  .servicesslider .slick-slide {
    padding: 0 10px;
  }
  
  .servicebox {
    padding: 15px 10px;
    margin: 0 5px;
  }
  
  .serviceboximg {
    height: 90px;
    width: 90px;
  }
  
  .servicedetails h3 {
    font-size: 16px;
  }
  
  .servicedetails span {
    font-size: 14px;
  }
}

@media (max-width: 576px) {
  .servicesslider {
    padding: 0 10px;
  }
  
  .servicebox {
    padding: 15px;
    max-width: 90%;
    margin: 0 auto;
  }
  
  .serviceboximg {
    height: 100px;
    width: 100px;
  }
  
  .servicedetails h3 {
    font-size: 16px;
  }
}

@media (max-width: 480px) {
  .servicesslider {
    padding: 0 5px;
  }
  
  .servicebox {
    padding: 15px 10px;
    max-width: 100%;
  }
  
  .serviceboximg {
    height: 170px !important;
    width: 170px !important;
  }
  
  .servicedetails h3 {
    font-size: 15px;
  }
  
  .servicedetails span {
    font-size: 13px;
  }
}
/* Ensure slick slider responsive settings work */
.servicesslider .slick-slider {
  /* position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; */
  width: 100%
}

.servicesslider .slick-list {
  /* position: relative;
  display: block; */
  overflow: hidden;
  /* margin: 0;
  padding: 0; */
}

.servicesslider .slick-list:focus {
  outline: none;
}

.servicesslider .slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.servicesslider .slick-slider .slick-track,
.servicesslider .slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.servicesslider .slick-track {
  /* position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto; */
    display: flex;
  align-items: stretch;
}

.servicesslider .slick-track:before,
.servicesslider .slick-track:after {
  display: table;
  content: '';
}

.servicesslider .slick-track:after {
  clear: both;
}

.servicesslider .slick-loading .slick-track {
  visibility: hidden;
}

.servicesslider .slick-slide {
  /* display: none;
  float: left;
  height: 100%;
  min-height: 1px; */

height: auto;}

.servicesslider .slick-slide > div {
  height: 100%;
}

.servicesslider .slick-slide img {
  display: block;
}

.servicesslider .slick-slide.slick-loading img {
  display: none;
}

.servicesslider .slick-slide.dragging img {
  pointer-events: none;
}

.servicesslider .slick-initialized .slick-slide {
  display: block;
}

.servicesslider .slick-loading .slick-slide {
  visibility: hidden;
}

.servicesslider .slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.servicesslider .slick-arrow.slick-hidden {
  display: none;
}

/* RTL CSS */
/* RTL Specific Styles */
[dir="rtl"] body,
[dir="rtl"] html {
  direction: rtl;
  text-align: right;
}

/* Form inputs */
[dir="rtl"] .formauth .form-group .form-control {
  padding-right: 40px;
  padding-left: 12px;
}

[dir="rtl"] .formauth .form-group .numberinput .form-control {
  padding-right: 74px;
  padding-left: 12px;
}

[dir="rtl"] .formauth .form-group .numberinput .form-select {
  right: 15px;
  left: auto;
  border-right: 0 !important;
  border-left: 1px solid !important;
  padding-left: 20px;
  padding-right: 0;
  background-position: 5px;
}

[dir="rtl"] .inputicon {
  right: 13px;
  left: auto;
}

[dir="rtl"] .eyebtn {
  left: 14px;
  right: auto;
}

/* Form validation */
[dir="rtl"] .form-control.is-invalid,
[dir="rtl"] .was-validated .form-control:invalid {
  padding-left: 60px;
  padding-right: 12px;
  background-position: left 0.75rem center;
}

/* Checkbox */
[dir="rtl"] .custom-checkbox .checkmark {
  margin-left: 12px;
  margin-right: 0;
}

/* Search box */
[dir="rtl"] .headerserchbox {
  padding: 11px 14px;
}

[dir="rtl"] .headerserchbox .form-control {
  margin-right: 30px;
  margin-left: 0;
  background-position: 0;
}

/* Footer */
/* [dir="rtl"] .footerlogo {
  margin-right: 0;
  margin-left: auto;
  align-self: flex-end;
} */

[dir="rtl"] .socialicons a {
  margin-right: 15px;
  margin-left: 0;
}

/* Why choose box */
[dir="rtl"] .whychoosebox span {
  right: -10px;
  left: auto;
}

/* Slider arrows */
[dir="rtl"] .slick-prev {
  right: -60px;
  left: auto;
}

[dir="rtl"] .slick-next {
  left: -60px;
  right: auto;
}

[dir="rtl"] .slick-prev span {
  background-image: url(../img/Rightarrow.png);
  right: -60px;
  left: auto;
}

[dir="rtl"] .slick-next span {
  background-image: url(../img/leftarrow.png);
  left: -60px;
  right: auto;
}

/* Service slider */
[dir="rtl"] .servicenewslider .slick-prev {
  right: -50px;
  left: auto;
}

[dir="rtl"] .servicenewslider .slick-next {
  left: -50px;
  right: auto;
}

/* Head image */
[dir="rtl"] .headimg {
  margin-right: 10px;
  margin-left: 0;
}

/* Filter section */
[dir="rtl"] .servicesfilter {
  border-left: 1px solid #ecb6cb;
  border-right: 0;
}

[dir="rtl"] .filtertop img {
  margin-left: 11px;
  margin-right: 0;
}

/* Breadcrumb */
[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
  float: right;
  padding-left: 0.5rem;
  padding-right: 0;
  content: "<";
}

/* Product rating */
[dir="rtl"] .ratingbox img {
  margin-left: 5px;
  margin-right: 0;
}

/* Details inner */
[dir="rtl"] .detailsinner ul li img {
  margin-left: 10px;
  margin-right: 0;
}

[dir="rtl"] .viewdetailstbn img {
  margin-right: 7px;
  margin-left: 0;
  transform: rotate(180deg);
}

/* Booking tabs */
[dir="rtl"] .bookservicetabs nav {
  border-radius: 0 25px 25px 0;
}

/* Time table */
[dir="rtl"] .timerboxx {
  margin-left: 14px;
  margin-right: 0;
}

/* Quantity box */
[dir="rtl"] .quantitybox span:first-child {
  order: 1;
}

[dir="rtl"] .quantitybox span:last-child {
  order: -1;
}

/* Apply button */
[dir="rtl"] .Applybtns {
  margin-right: 10px;
  margin-left: 0;
}

/* Checkout button */
[dir="rtl"] .checkoutbtn img {
  margin-right: 10px;
  margin-left: 0;
  transform: rotate(180deg);
}

/* Booked for user */
[dir="rtl"] .bookedforuser span {
  margin-right: 5px;
  margin-left: 0;
}

/* Table alignment */
[dir="rtl"] .producttable thead tr th:first-child {
  text-align: right;
}

/* Address modal */
[dir="rtl"] .editadd {
  margin-right: 15px;
  margin-left: 0;
}

[dir="rtl"] .removeadd {
  border-right: 2px solid #f2f2f2;
  border-left: 0;
  padding-right: 15px;
  padding-left: 0;
  margin-right: 15px;
  margin-left: 0;
}

[dir="rtl"] .addressname span {
  margin-right: 10px;
  margin-left: 0;
}

[dir="rtl"] .circleradio {
  margin-left: 10px;
  margin-right: 0;
}

[dir="rtl"] .addressmodal .btn-close {
  left: 20px;
  right: auto;
}

/* Address type */
[dir="rtl"] .adresstype a {
  margin-left: 10px;
  margin-right: 0;
}

/* Payment tabs */
[dir="rtl"] .payemnttabs .nav-tabs .nav-link {
  border-right: 4px solid #f1f1f1;
  border-left: 0;
}

[dir="rtl"] .payemnttabs .nav-tabs .nav-link.active {
  border-right: 4px solid #272727;
  border-left: 0;
}

/* Profile sidebar */
[dir="rtl"] .profilesidebar {
  border-left: 1px solid #fef2f7;
  border-right: 0;
}

[dir="rtl"] .profilesidebar a span {
  margin-left: 10px;
  margin-right: 0;
}

[dir="rtl"] .profileedit {
  left: 10px;
  right: auto;
}

/* Language checkbox */
[dir="rtl"] .langcheckbox label {
  left: 15px;
  right: auto;
}

[dir="rtl"] .langcheckbox span {
  right: 22px;
  left: auto;
}

/* Wallet box */
[dir="rtl"] .walletbox span {
  left: 20px;
  right: auto;
}

/* Loyalty points */
[dir="rtl"] .loyalty_txt a img {
  margin-left: 8px;
  margin-right: 0;
}

/* Notification */
[dir="rtl"] .viewallbtns img {
  margin-right: 8px;
  margin-left: 0;
  transform: rotate(180deg);
}

/* Upload image */
[dir="rtl"] .uploadimg img {
  margin-left: 10px;
  margin-right: 0;
}

/* Calendar button */
[dir="rtl"] .Calendarbtn img {
  margin-left: 10px;
  margin-right: 0;
}

/* Head search */
[dir="rtl"] .headsearch .form-control {
  padding-right: 40px;
  padding-left: 10px;
  background-position: right 8px center;
}

/* Booking badges */
[dir="rtl"] .staffbtns a:first-child {
  margin-left: 5px;
  margin-right: 0;
}

[dir="rtl"] .staffbtns a:last-child {
  margin-right: 5px;
  margin-left: 0;
}

[dir="rtl"] .staffbtns img {
  margin-left: 6px;
  margin-right: 0;
}

/* Toggle switch */
[dir="rtl"] .toggle-circle {
  right: 4px;
  left: auto;
}

[dir="rtl"] .toggle-switch.enabled .toggle-circle {
  right: 18px;
  left: auto;
}

/* Slot delete */
[dir="rtl"] .slotsdelete {
  left: 20px;
  right: auto;
}

[dir="rtl"] .slotinputs .toggle-container {
  left: 50px;
  right: auto;
}

/* Slot list */
[dir="rtl"] .slotlist {
  padding-right: 25px;
  padding-left: 0;
}

[dir="rtl"] .progressinner p {
  padding-right: 14px;
  padding-left: 0;
}

/* Progress bottom */
[dir="rtl"] .progressbtm span {
  margin-right: 10px;
  margin-left: 0;
}

/* Featured inner */
[dir="rtl"] .ffeaturedinner img {
  margin-left: 8px;
  margin-right: 0;
}

/* Personalized profile */
[dir="rtl"] .Personalizedprofifile {
  margin-left: 15px;
  margin-right: 0;
}

/* QR box */
[dir="rtl"] .qrbox img {
  margin-left: 12px;
  margin-right: 0;
}

/* Document updated */
[dir="rtl"] .documentupdated img {
  margin-left: 5px;
  margin-right: 0;
}

/* Radio button */
[dir="rtl"] .radiobtn label {
  padding-right: 32px;
  padding-left: 0;
}

[dir="rtl"] .radiobtn label::after {
  right: 0;
  left: auto;
}

[dir="rtl"] .radiobtn label::before {
  right: 4px;
  left: auto;
}

/* Slick arrows */
[dir="rtl"] .slick-prev-owl {
  right: -60px;
  left: auto;
  background-image: url("/assets/img/Rightarrow.png");
}

[dir="rtl"] .slick-next-owl {
  left: -60px;
  right: auto;
  background-image: url("/assets/img/Leftarrow.png");
}

/* Auth slider dots */
[dir="rtl"] .authslider .slick-dots {
  right: 50px;
  left: auto;
}

[dir="rtl"] .authslider .owl-dots {
  right: 40px;
  left: auto;
}

[dir="rtl"] .authslider .owl-dot {
  margin-left: 5px;
  margin-right: 0;
}

/* Service provider details */
[dir="rtl"] .providename img {
  margin-right: 15px;
  margin-left: 0;
}

[dir="rtl"] .providerate img {
  margin-right: 7px;
  margin-left: 0;
}

[dir="rtl"] .dtlsbox span {
  margin-right: 10px;
  margin-left: 0;
}

[dir="rtl"] .dtlsbox img {
  margin-left: 10px;
  margin-right: 0;
}

[dir="rtl"] .serviceproviderdetails p {
  text-align: right;
}

/* Rating box alignment */
[dir="rtl"] .ratinggbox img {
  margin-right: 10px;
  margin-left: 0;
}

[dir="rtl"] .timer img {
  margin-left: 10px;
  margin-right: 0;
}

/* Product thumbnail */
[dir="rtl"] .productthumbnail {
  flex-direction: row-reverse;
}

/* Days and weeks */
[dir="rtl"] .weeksrow .col-auto,
[dir="rtl"] .daysrow .col-auto {
  float: right;
}

/* Booking summary */
[dir="rtl"] .bokingservicerate {
  text-align: left;
}

/* Address actions */
[dir="rtl"] .achange {
  left: 20px;
  right: auto;
}

/* Booking details table */
[dir="rtl"] .bokkingdetailstable tr td,
[dir="rtl"] .bokkingdetailstable tr th {
  text-align: right;
}

/* Mark completed/edit buttons */
[dir="rtl"] .bookingdetailsbox .markcompleted img,
[dir="rtl"] .bookingdetailsbox .bookcancel img,
[dir="rtl"] .bookingdetailsbox .editbook img {
  margin-left: 6px;
  margin-right: 0;
}

/* Filters row */
[dir="rtl"] .filtersrow label {
  margin-left: 10px;
  margin-right: 0;
}

/* Booking overview */
[dir="rtl"] .bookinguiser {
  float: left;
}

/* Last update */
[dir="rtl"] .lastupdate {
  text-align: left;
}

/* Profile buttons */
[dir="rtl"] .dropbutton {
  border-left: 1px solid #fff;
  border-right: 0;
  padding-left: 15px;
  padding-right: 0;
  margin-left: 15px;
  margin-right: 0;
}

/* Service page layout */
[dir="rtl"] .servicespage {
  flex-direction: row-reverse;
}

[dir="rtl"] .servicesfilter {
  order: 2;
}

[dir="rtl"] .servicesmain {
  order: 1;
}

/* Store button */
[dir="rtl"] .storebtn img {
  margin-left: 7px;
  margin-right: 0;
}

/* Login registration */
[dir="rtl"] .loginregistration span {
  /* margin-left: 8px; */
  margin-right: 0;
}

/* Map box */
[dir="rtl"] .mapbox span {
  margin-left: 10px;
  margin-right: 0;
}

/* Our services slider */
[dir="rtl"] .ourservicesslider .owl-nav .owl-prev {
  margin-right: -42px;
  margin-left: 0;
}

[dir="rtl"] .ourservicesslider .owl-nav .owl-next {
  margin-left: -42px;
  margin-right: 0;
}

/* Top category slider */
[dir="rtl"] .ourtopworkslider {
  flex-direction: row-reverse;
}

/* QR code actions */
[dir="rtl"] .actionsbtns span {
  margin: 0 30px 10px;
}

/* Details inner show */
[dir="rtl"] .detailsinner.show {
  text-align: right;
}

/* Product table responsive */
@media (max-width: 768px) {
  [dir="rtl"] .producttable thead tr th:first-child {
    text-align: right;
  }
}

/* Form select background position */
[dir="rtl"] .form-select {
  background-position: left 0.75rem center;
}

[dir="rtl"] .countrycode .form-select {
  background-position: left 0.75rem center !important;
}

[dir="rtl"] .commanform .form-group .form-select {
  background-position: left 2% center;
}

/* Float utilities for RTL */
[dir="rtl"] .float-start {
  float: right !important;
}

[dir="rtl"] .float-end {
  float: left !important;
}

[dir="rtl"] .text-start {
  text-align: right !important;
}

[dir="rtl"] .text-end {
  text-align: left !important;
}

/* Margin and padding utilities for RTL */
[dir="rtl"] .ms-1 { margin-right: 0.25rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-2 { margin-right: 0.5rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-3 { margin-right: 1rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-4 { margin-right: 1.5rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-5 { margin-right: 3rem !important; margin-left: 0 !important; }
[dir="rtl"] .me-1 { margin-left: 0.25rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-2 { margin-left: 0.5rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-3 { margin-left: 1rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-4 { margin-left: 1.5rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-5 { margin-left: 3rem !important; margin-right: 0 !important; }
[dir="rtl"] .ps-1 { padding-right: 0.25rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-2 { padding-right: 0.5rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-3 { padding-right: 1rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-4 { padding-right: 1.5rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-5 { padding-right: 3rem !important; padding-left: 0 !important; }
[dir="rtl"] .pe-1 { padding-left: 0.25rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-2 { padding-left: 0.5rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-3 { padding-left: 1rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-4 { padding-left: 1.5rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-5 { padding-left: 3rem !important; padding-right: 0 !important; }

/* Flex order for RTL */
[dir="rtl"] .order-1 { order: 2 !important; }
[dir="rtl"] .order-2 { order: 1 !important; }
[dir="rtl"] .order-3 { order: 4 !important; }
[dir="rtl"] .order-4 { order: 3 !important; }
[dir="rtl"] .order-5 { order: 6 !important; }
[dir="rtl"] .order-6 { order: 5 !important; }

/* Justify content for RTL */
[dir="rtl"] .justify-content-start {
  justify-content: flex-end !important;
}

[dir="rtl"] .justify-content-end {
  justify-content: flex-start !important;
}

/* Align items for RTL */
/* [dir="rtl"] .align-items-start {
  align-items: flex-end !important;
} */

[dir="rtl"] .align-items-end {
  align-items: flex-start !important;
}


[dir="rtl"] .notification .dropdown-menu {
  right: -100px ;
  left: 0;
}

/* Enhanced Notification Badge Styles */
.notification-badge {
    animation: pulse-badge 2.5s ease-in-out infinite;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.notification-badge:hover {
    animation: none;
    transform: scale(1.1) !important;
}

@keyframes pulse-badge {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 3px 8px rgba(255, 71, 87, 0.4), 0 1px 3px rgba(0, 0, 0, 0.12);
    }
    50% {
        transform: scale(1.08);
        box-shadow: 0 4px 12px rgba(255, 71, 87, 0.6), 0 2px 6px rgba(0, 0, 0, 0.15);
    }
}

.notification .headericons {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

.notification .headericons img {
    display: block;
    max-width: 100%;
    height: auto;
}

[dir="rtl"] .badge-rtl {
    left: 0 !important;
    right: auto !important;
    transform: translate(-50%, -50%) !important;
}

[dir="ltr"] .badge-rtl {
    right: 0 !important;
    left: auto !important;
    transform: translate(50%, -50%) !important;
}

/* RTL Notification Styles */
[dir="rtl"] .notificationhead {
  padding: 0 25px;
  text-align: right;
}

[dir="rtl"] .notificationlink {
  flex-direction: row-reverse;
  padding: 14px 2px;
}

[dir="rtl"] .notificationimg {
  margin-left: 15px;
  margin-right: 0;
}

[dir="rtl"] .notificationtxt h2 {
  text-align: right;
}

[dir="rtl"] .notificationtxt p {
  text-align: right;
}

[dir="rtl"] .notificationtime {
  text-align: right;
}

[dir="rtl"] .viewallbtns {
  margin: 0 0 0 20px;
  padding: 0 18px;
}

[dir="rtl"] .viewallbtns img {
  margin-left: 0;
  margin-right: 8px;
  transform: rotate(180deg);
}

[dir="rtl"] .notificationhead a {
  text-align: right;
}

/* If you have additional notification text alignment */
[dir="rtl"] .notificationtxt {
  text-align: right;
}

/* For the notification layout if using flex row */
[dir="rtl"] .notificationlink > *:first-child {
  order: 2;
}

[dir="rtl"] .notificationlink > *:last-child {
  order: 1;
}

/* If you have specific padding/margin on text container */
[dir="rtl"] .notificationtxt {
  padding-right: 0;
  padding-left: 15px;
}

/* For any icons inside notification */
[dir="rtl"] .notificationlink .icon {
  transform: scaleX(-1); /* Flip icon horizontally if needed */
}

/* For close buttons or action buttons in notification */
[dir="rtl"] .notification-actions {
  left: 10px;
  right: auto;
}

.rtl-header {
  flex-direction: row-reverse;
  /* text-align: right; */
}

.rtl-header .modal-title {
  text-align: right;
  margin-left: 0.5rem;
  margin-right: 0;
}

.ltr-header .modal-title {
  text-align: left;
  margin-right: 0.5rem;
  margin-left: 0;
}

[dir="rtl"] .modal-header .btn-close {
    margin: 0;
}