body {
     font-family: "Mona Sans", sans-serif;
     font-style: normal;
     background-color: #F9FAFB;
overflow-x: hidden;
 }


 html,
 body {
     margin: 0;
     padding: 0;
     width: 100%;
     overflow-x: hidden;
     box-sizing: border-box;
     background-color: #F9FAFB;
 }

 *,
 *::before,
 *::after {
     box-sizing: border-box;

 }

 .content-wrapper {
     padding: 15px;
 }


 .small {
     font-size: 13px;
 }

 .btn-gradient {
     background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);
     border: none;
 }

 .btn-gradient:hover {
     opacity: 0.95;
 }


 .form-control {
     opacity: 1;
     padding: 12px;
     gap: 8px;
     border-radius: 6px;
     border-width: 1px;
 }

 .form-label {
     font-weight: 500;
     color: #333333;
     font-size: 13px;
 }

 .required {
     font-weight: 700;
     color: #dc3545;
 }

 .btn {
     font-size: 15px;
     font-weight: 500;
     padding: 12px 0px;
 }

 .form-control:focus {
     border-color: #922f9e;
     outline: 0;
     box-shadow: unset;
 }

 input::placeholder {
     color: #b0b0b0 !important;

 }




 /*
|--------------------------------------------------------------------------
|header section
|--------------------------------------------------------------------------
*/

 .logo img {
     height: 38px;
 }


 .header-home {
     position: absolute;
     top: 0;
     width: 100%;
     z-index: 1111;
 }

 .header-home .header-inner {
     height: 72px;
     border: 1px solid #E5E7EB;
     background: #fff;
     border-radius: 12px;
     padding: 0 24px;
     margin-top: 30px;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .home-actions a {

     border-radius: 8px;
     font-size: 15px;
     border-radius: 8px;
     padding: 11px 18px;
     text-decoration: none;
 }

 .btn-outline {
     border: 1px solid #d5d5d5;
     color: #333;
 }

 .btn-primary {
     background: #5C2396;
     color: #fff;
     margin-left: 12px;
 }

 /*
|--------------------------------------------------------------------------
|stiky section
|--------------------------------------------------------------------------
*/
 .header-sticky {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     background: #fff;
     border-bottom: 1px solid #EAEBEB;
     box-shadow: 0px 1px 2px 0px #0000000D;
     display: none;
     z-index: 2000;
 }

 .header-sticky .header-inner {
     height: 72px;
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .main-nav a {
     font-size: 14px;
     margin: 0 14px;
     color: #282232;
     font-weight: 500;
     text-decoration: none;
 }

 .main-nav {
     justify-content: center;
     display: flex;
     align-items: center;
 }

 .main-nav a:hover {
     color: #5C2396;
 }

 .profile img {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     margin-left: 18px;
     cursor: pointer;
 }


 .menu-toggle {
     font-size: 22px;
     background: none;
     border: none;
 }

 .mobile-menu {
     display: none;
     background: #fff;
     padding: 16px;
     border-top: 1px solid #eee;
 }

 .mobile-menu a {
     display: block;
     padding: 12px 0;
     color: #333;
     text-decoration: none;
     font-weight: 500;
 }



 .select2-container--default .select2-selection--single {
     height: 45px !important;
     padding: 10px 15px;
     border: 1px solid #ccc !important;
     border-radius: 8px !important;
     font-size: 14px;
     outline: none;

 }

 .select2-container--default .select2-selection--single .select2-selection__arrow b {
     top: 40%;
 }

 .select2-search--dropdown {
     display: block;
     padding: 0px;
 }

 .select2-container--default .select2-selection--single .select2-selection__rendered {
     color: #444;
     line-height: 24px !important;
 }

 .select2-container--default .select2-selection--single .select2-selection__placeholder {
     color: #b0b0b0 !important;
     font-family: "Mona Sans", sans-serif !important;
     font-weight: 400;
     font-size: 15px;
 }

 .select2-selection__clear {
     display: none;
 }

 .select2-container--default .select2-selection--single .select2-selection__arrow {

     top: 11px !important;
 }

 .select2-selection__arrow {
     border: none !important;
     width: 13px;
     height: 8px;
     margin-top: -3px;
     background: url('../images/icon/bottom-arrow.svg') center right / contain no-repeat;
 }

 .select2-container--default .select2-selection--single .select2-selection__arrow {
     height: 26px;
     position: absolute;
     top: 1px;
     right: 8px !important;

 }

 .select2-container--default .select2-selection--single .select2-selection__arrow {
     width: 13px !important;
 }

 .select2-container--default .select2-selection--single {
     height: 48px;
     border-radius: 10px;
     border: 1px solid #ddd;
 }

 .select2-selection__arrow {
     height: 100%;
     right: 14px;
 }

 .select2-selection__arrow b {
     display: none;
 }

 /*
|--------------------------------------------------------------------------
|footer section
|--------------------------------------------------------------------------
*/


 .site-footer {
     background: #ffffff;
     padding: 60px 0 20px;
     border-top: 1px solid #eee;

 }

 .footer-top {
     display: grid;
     grid-template-columns: 2.5fr 3.2fr 1.2fr 1fr;
     gap: 40px;
     padding-bottom: 40px;
 }

 .footer-logo img {
     height: 42px;
     margin-bottom: 16px;
 }

 .footer-brand p {
     font-size: 14px;
     color: #666;
     line-height: 1.6;
     max-width: 260px;
 }

 .app-buttons img {
     height: 40px;
     margin-right: 10px;
     margin-top: 5px;
 }

 .footer-col h4 {
     font-size: 15px;
     font-weight: 600;
     margin-bottom: 16px;
     color: #111827;
 }

 .footer-col ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .footer-col ul li {
     font-size: 14px;
     color: #4B5563;
     margin-bottom: 10px;
     cursor: pointer;
 }

 .footer-col ul li:hover {
     color: #6f2dbd;
 }

 .view-all {
     color: #6f2dbd !important;
     font-weight: 500;
 }

 .contact-list li {
     display: flex;
     align-items: flex-start;
     gap: 10px;
 }

 .contact-list i {
     color: #382A58;
     margin-top: 4px;
 }

 /* Social */
 .social-icons a {
     display: inline-flex;
     align-items: center;

     width: 28px;
     height: 36px;
     border-radius: 50%;
     text-decoration: none;
     color: #382A58;
     font-size: 19px;
 }



 .footer-bottom {
     border-top: 1px solid #eee;
     padding-top: 16px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     font-size: 13px;
     color: #777;
 }

 .footer-links a {
     margin-left: 18px;
     color: #777;
     text-decoration: none;
 }

 .footer-links a:hover {
     color: #6f2dbd;
 }



 /*
|--------------------------------------------------------------------------
|home section
|--------------------------------------------------------------------------
*/

 p {
     color: #4B5563;
     font-size: 13px;
 }



 .hero-section {
     position: relative;
     min-height: 560px;
     background: url('../images/hero-bg.png') center right / cover no-repeat;
     border-radius: 18px;

     overflow: hidden;
 }

 .btn-accepted {
     background: #E8E8FF;
     color: #5C2396;
     border: 1px solid #A4B0FF !important;
 }

 .btn-rejected {
     background: #FFEAFF;
     color: #C1409A;
     border: 1px solid #FFA7E4 !important;

 }

 .btn-pending {
     background: #FFF4E6;
     color: #D97706;
     border: 1px solid #FED7AA !important;
 }

  .btn-in-process {
     background: #EFF6FF;
    color: #0369a1;
    border: 1px solid #0369a1 !important;
 }
 
 .hero-section .container {
     position: relative;
     z-index: 2;

 }

 /* Content Box */
 .hero-content {
     max-width: 536px;

     color: #fff;
 }

 .hero-content h1 {
     font-size: 48px;
     font-weight: 700;
     line-height: 1.2;
     margin-bottom: 16px;
 }

 .hero-content h1 span {
     color: #CC3F94;
     font-weight: 600;
 }

 .hero-content p {
     font-size: 26px;
     line-height: 1.6;
     opacity: 0.9;
     color: #E5E7EB;
 }

 .hero-container {
     height: 930px;
     display: flex;
     align-items: center;
     text-align: left;
 }



 .moments-section {
     padding: 40px 0px;
     text-align: center;
 }

 .moments-section h2 {
     font-size: 32px;
     font-weight: 700;
     color: #0C1E21;
 }

 .moments-section p {
     color: #666;
     margin-top: 8px;
 }


 .moments-wrapper {
     display: flex;
     justify-content: center;
     align-items: center;

     gap: 28px;
     margin-top: 60px;
 }



 .moment-card {
     position: relative;
     overflow: hidden;
     background: #000;
     flex-shrink: 0;
 }


 .moment-card:nth-child(1),
 .moment-card:nth-child(3),
 .moment-card:nth-child(5) {
     margin-top: -80px;
 }


 .moment-card:nth-child(2),
 .moment-card:nth-child(4) {

     margin-top: 80px;
 }


 .moment-card img {
     width: 220px;
     height: 100%;
     object-fit: cover;
     transition: transform 0.45s ease;
 }



 .bottom-overlay {
     position: absolute;
     left: 0;
     right: 0;
     bottom: 0;
     height: 40%;
     background: linear-gradient(to top,
             rgba(0, 0, 0, 0.55),
             rgba(0, 0, 0, 0));
     opacity: 1;
     transition: opacity 0.35s ease;
     z-index: 1;
 }


 .moment-card span {
     position: absolute;
     bottom: 16px;
     left: 0;
     right: 0;
     text-align: center;
     color: #fff;
     font-size: 17px;
     font-weight: 500;
     z-index: 2;
 }

 .moment-card span {
     position: absolute;
     bottom: 18px;
     left: 0;
     right: 0;
     text-align: center;
     color: #fff;
     font-size: 17px;
     font-weight: 500;
     z-index: 2;
 }


 .moment-card:hover img {
     transform: scale(1.08);
 }



 @media (max-width: 768px) {
     .moments-wrapper {
         overflow-x: auto;
         justify-content: flex-start;
         padding: 0 20px;
     }

     .moment-card {
         flex-shrink: 0;
     }

     .moments-wrapper::-webkit-scrollbar {
         display: none;
     }
 }

 .moments-marquee {
     overflow: hidden;
     width: 100%;
 }

 .moments-wrapper {
     display: flex;
     gap: 28px;
     animation: marquee 22s linear infinite;
     width: max-content;
 }

 /* Animation */
 @keyframes marquee {
     from {
         transform: translateX(0);
     }

     to {
         transform: translateX(-50%);
     }
 }


 .moments-marquee:hover .moments-wrapper {
     animation-play-state: paused;
 }


 .moment-card {
     position: relative;
     overflow: hidden;
     background: #000;
     flex-shrink: 0;
 }

 .moment-card img {
     width: 220px;
     height: 100%;
     object-fit: cover;
     transition: transform 0.45s ease;
 }

 .moment-card:hover img {
     transform: scale(1.08);
 }


 .moment-card:nth-child(odd) {
     margin-top: -80px;
 }

 .moment-card:nth-child(even) {
     margin-top: 80px;
 }

 /* Mobile speed slower */
 @media (max-width: 768px) {
     .moments-wrapper {
         animation-duration: 35s;
     }
 }



 .tr-camp-section {
     padding: 40px 0px;

 }

 .tr-camp-live {
     padding: 40px 0px;
 }

 .tr-camp-container {

     margin: 0 auto;
     text-align: center;
 }

 .tr-camp-title {
     font-size: 32px;
     font-weight: 700;
     color: #1c1c1c;
     margin-bottom: 10px;
 }

 .tr-camp-subtitle {
     font-size: 16px;
     color: #6b7280;
     margin-bottom: 10px;
 }


 .tr-camp-line img {
     max-width: 100%;

 }

 .tr-camp-features {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 30px;
 }

 .tr-camp-item {
     padding: 0 10px;
 }

 .tr-camp-icon {
     width: 64px;
     height: 64px;
     background: #f3e8ff;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 20px;
 }

 .tr-camp-icon img {
     width: 28px;
     height: 28px;
 }

 .tr-camp-item h4 {
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 8px;
     color: #1c1c1c;
 }

 .tr-camp-item p {
     font-size: 14px;
     color: #6b7280;
     line-height: 1.6;
 }





 .tr-camp-live-wrap {

     margin: auto;
     background: linear-gradient(90.48deg, #89328C 1.16%, #BAA3C4 99.59%);

     border-radius: 28px;
     padding: 0px 60px;
     display: grid;
     grid-template-columns: 1.2fr 1fr;
     gap: 40px;
     align-items: center;
     color: #fff;
 }


 .tr-camp-live-content h2 {
     font-size: 36px;

     font-weight: 700;
     margin-bottom: 14px;
 }

 .tr-camp-live-content p {
     font-size: 15px;
     line-height: 1.7;
     opacity: 0.95;
     margin-bottom: 24px;
     color: #fefefe;
 }

 .tr-camp-live-content {
     padding: 64px 0px;
 }

 .tr-camp-marquee {
     animation: trCampScroll 14s linear infinite;
 }

 .tr-camp-live-feed:hover .tr-camp-marquee {
     animation-play-state: paused;
 }

 .tr-camp-btn {
     display: inline-block;
     padding: 12px 26px;
     border: 1px solid rgba(255, 255, 255, 0.6);
     border-radius: 8px;
     color: #fff;
     text-decoration: none;
     font-size: 14px;
 }


 .tr-camp-live-feed {
     height: 332px;
     overflow: hidden;
     position: relative;
 }

 .tr-camp-marquee {
     display: flex;
     flex-direction: column;
     gap: 18px;
     animation: trCampScroll 14s linear infinite;
     padding: 16px;
 }


 .tr-camp-card {
     background: #fff;
     color: #1f2937;
     padding: 18px 22px;
     display: flex;
     align-items: center;
     gap: 16px;
     /* box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18); */
     max-width: 420px;
 }


 .tr-camp-card img {
     width: 80px;
     height: 56px;
     border-radius: 10px;
     object-fit: cover;
 }


 .tr-camp-card p {
     font-size: 16px;
     line-height: 1.4;
     margin: 0;
     font-weight: 500;
 }


 .tr-camp-card:nth-child(odd) {
     margin-left: 0;
     margin-right: auto;
     border-radius: 20px 28px 28px 20px;
 }


 .tr-camp-card:nth-child(even) {
     margin-left: auto;
     margin-right: 0;
     border-radius: 28px 20px 20px 28px;
 }

 .tr-camp-card {
     transition: transform 0.3s ease;
 }

 .tr-camp-card:nth-child(odd) {
     transform: translateX(-12px);
     border-top-right-radius: 0px;

 }

 .tr-camp-card:nth-child(even) {
     transform: translateX(12px);
     border-top-left-radius: 0px;
 }



 @keyframes trCampScroll {
     0% {
         transform: translateY(0);
     }

     100% {
         transform: translateY(-50%);
     }
 }




 /* trv-mt */

 .trv-mt-section {
     padding: 40px 0;
     text-align: center;
 }

 .trv-mt-section h2 {
     font-size: 32px;
     font-weight: 700;
     margin-bottom: 14px;
 }

 .trv-mt-subtitle {
     font-size: 16px;
     color: #6b7280;
     margin-bottom: 56px;
 }

 /* CARD */
 .trv-mt-card {
     background: #fff;
     border-radius: 22px;
     padding: 14px;
     box-shadow: 0px 10px 40px #DEE6ED66;
     border: 1px solid #F0F6FD;
     text-align: left;
     height: 100%;
 }

 .trv-mt-card-header {
     display: flex;
     justify-content: space-between;

     padding-bottom: 12px;
 }

 .trv-mt-card-title {
     display: flex;
     gap: 10px;
     overflow: hidden;
 }

 .main-contain-trv {
     word-wrap: break-word;
     display: -webkit-box;
     -webkit-line-clamp: 7;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }

 .trv-mt-avatar {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     border: 1px solid #999;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
 }

 .trv-mt-avatar img {
     max-width: 80%;
 }
 .user h6 {margin-bottom: 0px;
    margin-top: 12px;

 }

 .trv-mt-title-text {
     font-size: 14px;
     font-weight: 600;
         word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
 }
 .moment-card span{
     word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
 }
 .trv-mt-title-sub {
     font-size: 12px;
     color: #76777E;
         word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
 }

 .cm-prf-left .cm-prf-msg-btn {
     filter: unset !important;
 }

 .slick-slide img {
     word-wrap: break-word;
     display: -webkit-box;
     -webkit-line-clamp: 1;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }

 .desc {
     word-wrap: break-word;
     display: -webkit-box;
     -webkit-line-clamp: 7;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }

 .trv-mt-card-desc {
     word-wrap: break-word;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
     margin-top: 14px;
     font-size: 14px;
 }

 /* 🔹 SLICK FIX */
 .trv-mt-cards.slick-slider {
     display: block;
 }

 .trv-mt-card {
     margin: 0 12px;
 }

 .trv-mt-cards .slick-track {
     display: flex;
 }

 .trv-mt-cards .slick-slide {
     height: auto;
 }

 .trv-mt-card {
     height: 100%;
     display: flex;
     flex-direction: column;
 }

 .trv-mt-cards {
     padding: 0 12px;
 }




 /* FIX slick dots visibility */
 /* Slick dots - visible & centered */
 .trv-mt-cards .slick-dots {
     position: relative;
     bottom: 0;
     margin-top: 28px;
     display: flex !important;
     justify-content: center;
 }

 .trv-mt-cards .slick-dots li {
     margin: 0 5px;
 }

 .trv-mt-cards .slick-dots li button {
     width: 10px;
     height: 10px;
     padding: 0;
     background: transparent !important;
 }

 .trv-mt-cards .slick-dots li button:before {
     font-size: 10px;
     color: #CBD5E1;
     /* inactive */
     opacity: 1;
 }

 .trv-mt-cards .slick-dots li.slick-active button:before {
     color: #1B1D28;
     /* active */
 }




 .trv-exp-section {

     margin: 40px auto;
     padding: 37px 24px 0px;
     border-radius: 28px;

     background: url('../images/stored-dt.png') center right / cover no-repeat;
     background-size: cover;
     background-position: center;
     color: #ffffff;
     position: relative;
     overflow: hidden;
 }



 .trv-exp-content {

     margin: 0 auto;
     text-align: center;
 }


 .trv-exp-title {
     font-size: 34px;
     font-weight: 700;
     margin-bottom: 12px;
     line-height: 1.25;
 }


 .trv-exp-subtitle {
     font-size: 15px;
     color: rgba(255, 255, 255, 0.9);
     margin-bottom: 26px;
 }



 .trv-exp-stores {
     display: flex;
     justify-content: center;
     gap: 14px;
     flex-wrap: wrap;
 }


 .trv-exp-stores img {
     height: 44px;
     width: auto;
     cursor: pointer;
 }




 .h-dt-mbr {
     padding: 40px 0;
     background: #f9f9fb;
 }


 .left-image {
     position: relative;
     min-height: 480px;
     background: url("../images/couple.jpg") center/cover no-repeat;
     border-radius: 24px;
 }


 .satisfied-card {
     position: absolute;
     bottom: 40px;
     left: 40px;
     background: #fff;
     padding: 16px 22px;
     border-radius: 14px;
     display: flex;
     align-items: center;
     gap: 14px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
 }

 .avatars img {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     border: 2px solid #fff;
     margin-left: -10px;
 }

 .avatars img:first-child {
     margin-left: 0;
 }

 .satisfied-card h6 {
     margin: 0;
     font-size: 14px;
     font-weight: 600;
 }

 .satisfied-card .count {
     background: #8e44ad;
     color: #fff;
     padding: 4px 12px;
     border-radius: 20px;
     font-size: 13px;
     font-weight: 600;
     display: inline-block;
     margin-top: 4px;
 }

 /* RIGHT CONTENT */
 .right-content {
     padding: 0 80px;
 }

 .testimonial-slider h3 {
     font-weight: 700;
     margin-bottom: 20px;
 }

 .testimonial-slider .desc {
     font-size: 15px;
     color: #555;
     line-height: 1.7;
     max-width: 420px;
 }

 .user {
     display: flex;
     align-items: center;
     gap: 12px;
     margin-top: 24px;
 }

 .user img {
     width: 48px;
     height: 48px;
     border-radius: 50%;
 }

 .rating {
     color: #f1c40f;
     font-size: 14px;
 }

 /* SLIDER BUTTONS */
 .nav-btns {
     margin-top: 30px;
 }

 .nav-btns button {
     width: 42px;
     height: 42px;
     border-radius: 50%;
     border: 1px solid #5C2396;
     background: #fff;
     color: #5C2396;
     margin-right: 10px;
 }

 .nav-btns button:hover {
     background: #5C2396;
     color: #fff;
 }




 .testimonial-swiper {
     max-width: 480px;
 }

 .swiper-slide {
     padding-right: 20px;
 }


 .left-image-wrap {
     position: relative;
     border-radius: 28px;
     overflow: hidden;
     min-height: 480px;
 }


 .left-bg-img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
 }


 .satisfied-card {
     position: absolute;
     left: 32px;
     bottom: 121px;
     background: #ffffff;
     padding: 16px 22px;
     border-radius: 16px;
     display: flex;
     align-items: center;
     gap: 14px;
     box-shadow: 0 14px 40px rgba(0, 0, 0, 0.15);
     z-index: 5;
 }

 .satisfied-card .text {
     text-align: center;
 }

 .avatars {
     display: flex;
 }

 .avatars img {
     width: 38px;
     height: 38px;
     border-radius: 50%;
     border: 2px solid #fff;
     margin-left: -12px;
 }

 .avatars img:first-child {
     margin-left: 0;
 }


 .satisfied-card h6 {
     font-size: 14px;
     font-weight: 600;
     margin: 0;
 }

 .satisfied-card .count {
     display: inline-block;
     margin-top: 4px;
     background: #A4429A;
     color: #fff;
     padding: 4px 25px;
     border-radius: 20px;
     font-size: 13px;
     font-weight: 600;
 }




 .mmt-dt {
     box-shadow: 0px 3px 13.1px 0px #0000000A;
     background: #FFFFFF;
     border-radius: 60px;
     opacity: 1;


 }

 .swiper-slide h3 {
     color: #1E293B;
     font-weight: 700;
     font-size: 31px;
     line-height: 42px;
 }


 .swiper-slide .desc {
     margin-top: 25px;
 }

 .browse-campanion:hover {
     border: 1px solid #c492bd;
     color: #dfd5e1 !important;
 }

 .desktop-line {
     display: block;
 }

 .mobile-line {
     display: none;
 }

 .sld-ttl {
     color: #1E293B;
     font-weight: 700;
     font-size: 31px;
     line-height: 42px;
 }

 .nav-link-badge {
     position: relative;
     display: inline-flex;
     align-items: center;
     gap: 6px;
 }

 /* Red badge */
 .nav-badge {
     min-width: 18px;
     height: 18px;
     padding: 0 6px;
     background: #C00B80;
     color: #fff;
     font-size: 11px;
     font-weight: 600;
     border-radius: 999px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     line-height: 1;
 }

 /* Desktop positioning tweak */
 @media (min-width: 768px) {
     .main-nav .nav-badge {
         position: absolute;
         top: -9px;
         right: -18px;
     }
 }

 /* Mobile menu alignment */
 .mobile-menu .nav-link-badge {
     justify-content: space-between;
 }

 .mobile-menu .nav-badge {
     position: static;
 }


 /* left sidebar */
 .left-sidebar {
     width: 260px;
     background: #fff;
     border-right: 1px solid #eee;
     padding: 20px;
     transition: all .3s ease;
 }

 .sidebar-profile {
     margin-top: 70px;

 }

 .profile-card {
     display: flex;
     border: 1px solid #E6E7EC;
     align-items: center;
     gap: 12px;
     background: #fff;
     border-radius: 14px;
     padding: 12px 14px;

 }

 .profile-card img {
     width: 46px;
     height: 46px;
     border-radius: 50%;
     object-fit: cover;
 }

 .profile-info {
     line-height: 1.2;
 }

 .profile-name {
     font-size: 16px;
     font-weight: 600;
     color: #1f2937;
 }

 .profile-role {
     font-size: 13px;
     color: #6b7280;
 }
.calender-cm{
    zoom:85%
}

 .left-sidebar-user h6 {
     margin: 0;
     font-size: 14px;
 }

 .left-sidebar-user span {
     font-size: 12px;
     color: #888;
 }

 .left-sidebar-menu {
     list-style: none;
     padding: 0;
     margin-top: 20px;
 }

 .left-sidebar-item {
     margin-bottom: 6px;
 }

 .left-sidebar-link {
     display: flex;
     align-items: center;
     gap: 12px;
     padding: 10px 14px;
     border-radius: 8px;
     color: #0A1B39;
     font-weight: 500;
     font-size: 14px;
     text-decoration: none;
     transition: all .2s ease;
 }

 .left-sidebar-link:hover {
     background: #f5f6f8;
     color: #0A1B39;
     font-weight: 700;
 }

 .left-sidebar-item.active .left-sidebar-link {
     border: 1px solid var(--Base-Line, #E6E7EC);
     background: #f5f6f8;
     color: #0A1B39;
     font-weight: 700;
 }

 .left-sidebar-badge {
     margin-left: auto;
     background: #c00b80;
     color: #fff;
     font-size: 10px;
     padding: 2px 6px;
     border-radius: 10px;
 }

 .left-sidebar-logout .left-sidebar-link {
     color: #c00b80;
 }



 .dashboard-layout {
     display: flex;
     align-items: stretch;
     width: 100%;
 }

 .left-sidebar {
     flex: 0 0 260px;
     max-width: 260px;
     height: auto;
 }

#availability-calendar{
opacity:0;
}

 .dashboard-content {
     flex: 1;
     padding: 24px 15px;
     background: #f6f8fc;
     min-width: 0;
     padding-top: 100px;
 }


 .left-sidebar,
 .dashboard-content {
     float: none !important;
 }

 .prfr {
     color: #83899F;
     font-size: 15px;
 }

 /* dashbord */


 .dash-container {
     max-width: 100%;
 }

 .dash-welcome-card {
     background: #fff;
     border-radius: 10px;
     padding: 20px;
     display: flex;
     justify-content: space-between;
     flex-wrap: wrap;
     margin-bottom: 20px;
     border: 1px solid #E5E7EB;
     box-shadow: 0px 1px 2px 0px #0000000D;

 }

 .dash-welcome-stats {
     display: flex;
     gap: 30px;
     justify-content: center;
     align-items: center;
 }

 .dash-stat {
     text-align: center;
 }

 .dash-stat h6 {
     font-weight: 700;
     font-size: 21px;
     margin: 0;
     color: #641EBF;
 }

 .dash-stat span {
     font-size: 13px;
     color: #0A1B39;
     font-weight: 400;
 }

 .success h6 {
     color: #28a745;
     font-weight: 700;
 }

 .warning h6 {
     color: #ff9800;
     font-weight: 700;
 }

 .dash-grid .recent-msg {
     height: 422px;
     overflow-y: auto;
 }

 .note-validation {
     display: flex;
     align-items: center;
     gap: 10px;

     background: #fffaf7;
     border: 1px solid #cea11a;
     color: #cea11a;
     margin-bottom: 10px;
     padding: 5px 14px;
     border-radius: 5px;

     font-size: 12px;
     font-weight: 500;
 }

 .note-validation i {
     font-size: 16px;
     color: #cea11a;
 }

 .dash-grid {
     display: grid;
     grid-template-columns: 2fr 1fr;
     gap: 20px;
 }

 .dash-profile-card {
     padding: 24px;
     border-radius: 14px;
     background: #fff;
 }

 /* Header */
 .dash-profile-header {
     display: flex;
     gap: 22px;
     align-items: flex-start;
 }

 .dash-profile-header img {
     width: 96px;
     height: 96px;
     border-radius: 50%;
     object-fit: cover;
 }

 .dash-profile-title h5 {
     font-size: 17px;
     font-weight: 700;
     margin-bottom: 6px;
 }

 .text-muted {
     color: #D1D5DB !important;
 }

 /* Rating */
 .dash-rating {
     display: flex;
     align-items: center;
     gap: 4px;
     margin-bottom: 12px;
     color: #f5b301;
     font-size: 14px;
 }

 .dash-profile-title .dash-rating {
     top: 0px !important;
 }

 .dash-rating span {
     color: #6b7280;
     margin-left: 6px;
     font-size: 11px;
 }

 /* Info text */
 .dash-profile-title p {
     margin: 3px 0;
     font-size: 14px;
     color: #374151;
 }

 .dash-profile-title strong {
     font-weight: 600;
 }

 .dash-location {
     display: flex;
     align-items: center;
     gap: 8px;
     color: #6b7280;
 }

 .dash-location i {
     color: #6f2da8;
 }

 /* Stats boxes */
 .dash-profile-stats {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;
     margin-top: 22px;
 }

 .dash-stat-box {
     border: 1px solid #E5E7EB;
     background: #F9FAFB;
     border-radius: 12px;
     padding: 16px;
 }

 .dash-stat-box span {
     font-size: 15px;
     color: #111827;
     font-weight: 600;
 }

 .dash-stat-box h6 {
     margin: 0px;
     font-size: 18px;
     font-weight: 700;
     color: #5C2396;
     margin-top: 3px;
 }

 /* Footer boxes */
 .dash-profile-footer {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;
     margin-top: 16px;
 }

 .dash-footer-box {
     border: 1px solid #E5E7EB;
     background: #F9FAFB;
     border-radius: 12px;
     padding: 16px;
 }

 .dash-footer-box span {
     font-size: 15px;
     color: #111827;
     font-weight: 600;
 }

 .dash-footer-box p {
     margin-top: 4px;
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 0px;
 }




 .dash-message {
     display: flex;
     /* align-items: center; */
     gap: 12px;
     padding: 12px 0px;
     padding-right: 20px;
     border-bottom: 1px solid #eee;
 }

 .dash-message img {
     width: 50px;
     height: 50px;
     border-radius: 50%;
 }

 .dash-btn {
     height: 32px;
     margin-left: auto;
     background: #5C2396;
     color: #fff;
     padding: 6px 14px;
     border-radius: 6px;
     font-size: 13px;
     text-decoration: none;
     font-weight: 500;
 }

 .dash-card {
     padding: 24px;
     border-radius: 14px;
     background: #fff;
     border: 1px solid #E5E7EB;
 }

 .dash-card-title {
     padding-bottom: 6px;
     color: #111827;
     font-weight: 600;
 }

 .trv-mt-card {
     margin: 22px 12px;
 }

 .dash-message p,
 .dash-message h6 {
     margin-bottom: 0px;
 }

 .dash-message small {
     color: #9CA3AF;
 }

 .booking-body {
     padding: 10px 20px;
 }

 hr {
     margin: 1rem 0;

     border-top: 1px solid #eeeeee !important;

     opacity: 1 !important;
 }

 .dash-booking-card .dash-card-header {
     background: linear-gradient(90deg, #641E9C 0%, #993EB3 100%);
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
     color: #fff;
     padding: 16px 12px;
     margin-bottom: 15px;
     font-weight: 500;
     font-size: 17px;
 }

 .dash-booking {
     display: flex;
     gap: 12px;
     padding: 12px 0;

 }

 .dash-booking img {
     width: 71px;
     height: 71px;
     border-radius: 50%;
 }

 .dash-booking span {
     margin-left: auto;
     font-size: 10px;
 }

 .dash-view-link {
     display: block;
     text-align: center;
     margin-top: 15px;
     margin-bottom: 15px;

     color: #5c2396;
     font-weight: 600;
     text-decoration: none;
 }




 .dash-welcome-left strong {
     color: #111827;
 }

 .dash-welcome-left h5 {
     font-size: 19px;
 }

 .dash-welcome-left p {
     font-size: 14px;
 }

 .dash-rating {
     position: absolute;
     top: 10px;
     right: 0;
 }

 .dash-profile-header {
     position: relative;
 }

 .dash-booking h6 {
     color: #111827;
     font-weight: 700;
 }

 .dash-booking p {

     color: #374151;
     margin-bottom: 0px;
     font-size: 13px;
     font-weight: 500;
 }

 .dash-booking small {
     color: #4B5563;
     font-size: 12px;
 }

 .dash-booking .fa-map-marker-alt {
     color: #6f2da8;
 }

 .dash-booking {
     position: relative;
 }

 .dash-booking .dash-rating {
     font-size: 11px;
 }

 .campilist-fav .fa-solid {
     color: #E51D1D !important;
 }

 /* campanion list */


 .campilist-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     flex-wrap: wrap;

 }

 .campilist-title {
     font-size: 24px;
     font-weight: 700;
     margin: 0;
 }

 .campilist-subtitle {
     color: #6b7280;
     font-size: 14px;
     margin-top: 4px;
 }

 .campilist-search-filter {
     display: flex;
     gap: 12px;
 }

 .campilist-search input {
     height: 40px;
     width: 220px;
     padding: 0 14px;
     border-radius: 8px;
     border: 1px solid #ddd;
 }

 .dash-actions .btn {
     padding: 8px 14px;
 }

 .campilist-filter-btn {
     background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);
     font-size: 14px;

     color: #fff;
     border: none;
     padding: 0 18px;
     height: 42px;
     border-radius: 8px;
     cursor: pointer;
 }

 /* GRID */
 .campilist-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 22px;
 }

 /* CARD */
 .campilist-card {
     background: #fff;
     position: relative;
     border-radius: 14px;
     overflow: hidden;
     /* box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05); */
     transition: 0.3s;
     box-shadow: 0px 4px 6px 0px #0000001A;

 }

 .campilist-card:hover {
     transform: translateY(-6px);
 }

 .campilist-cover {
     width: 100%;
     height: 220px;
     object-fit: cover;
 }

 .campilist-card-body {
     padding: 16px;
 }

 /* USER */
 .campilist-user {
     display: flex;

     gap: 12px;
 }

 .campilist-user-info {
     flex: 1;
 }

 .campilist-inline-rating {
     /* display: flex;
     align-items: center; */
     gap: 4px;
     font-size: 10px;
     font-weight: 600;
 }

 .campilist-inline-rating i {
     color: #FBBF24;
 }

 .campilist-inline-rating span {
     color: #111827;
 }

 .campilist-inline-rating small {
     color: #6B7280;
     font-weight: 500;
 }

 .img-wrapper {
     width: 44px;
     height: 44px;
     border-radius: 50%;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .img-wrapper img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     border-radius: 50%;
 }


 .campilist-user h4 {
     margin: 0;
     font-size: 15px;
     color: #111827;
     font-weight: 600;
 }

 .campilist-user p {
     margin: 0;
     font-size: 12px;
     color: #4B5563;
     font-weight: 500;
     margin-top: 4px;
 }

 /* TAGS */
 .campilist-tags {
     display: flex;
     gap: 8px;
     margin: 14px 0;
     overflow-x: auto;
     white-space: nowrap;


     scrollbar-width: none;
     -ms-overflow-style: none;


     scroll-behavior: smooth;
 }

 .campilist-tags::-webkit-scrollbar {
     display: none;
 }



 .campilist-tags {
     scroll-behavior: smooth;
 }



 .campilist-tags span {
     flex-shrink: 0;
 }

 .campilist-tags span {
     font-size: 10px;
     background: #F1F0FB;
     color: #5C2396;
     padding: 4px 7px;
     border-radius: 20px;
     font-weight: 600;
     border: 1px solid #E5E7EB;
 }

 /* FOOTER */
 .campilist-footer {
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .campilist-rating {
     font-size: 13px;
     color: #f59e0b;
 }

 .campilist-rating span {
     color: #6b7280;
     font-size: 12px;
 }

 .campilist-btn {
     background: #5C2396;
     color: #fff;
     text-decoration: none;
     font-size: 13px;
     padding: 8px 14px;
     border-radius: 6px;
     font-weight: 500;
 }



 .campilist-search {
     position: relative;
     max-width: 100%;
 }

 .campilist-search input {
     width: 100%;
     height: 42px;
     padding: 0 20px 0 56px;
     border: 1px solid #E5E7EB;

     font-size: 15px;
     color: #111827;
     outline: none;
     background: #fff;
 }

 .campilist-search input::placeholder {
     color: #9CA3AF;
     font-weight: 500;
 }

 .campilist-search input:focus {
     border-color: #D1D5DB;
 }

 /* Icon */
 .campilist-search .search-icon {
     position: absolute;
     left: 20px;
     top: 50%;
     transform: translateY(-50%);
     font-size: 18px;
     color: #9CA3AF;
     pointer-events: none;
 }

 /* Favourite Heart */
 .campilist-fav {
     position: absolute;
     top: 11px;
     right: 14px;
     width: 30px;
     height: 30px;
     background: #FFFFFF;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
     transition: 0.3s;
     z-index: 5;
 }

 .campilist-fav i {
     color: #000000;
     font-size: 20px;
     transition: 0.3s;
     padding: 4px;
 }

 .campilist-fav.active {
     background: #FFFFFF;
 }

 .campilist-fav.active i {
     color: #E51D1D;
 }

 /* Top Rating Badge */
 .campilist-top-rating {
     position: absolute;
     top: 14px;
     left: 14px;
     background: rgba(0, 0, 0, 0.65);
     color: #fff;
     font-size: 12px;
     padding: 6px 10px;
     border-radius: 20px;
     display: flex;
     align-items: center;
     gap: 5px;
     z-index: 5;
 }

 .campilist-top-rating i {
     color: #FBBF24;
 }

 /* Footer price */
 .campilist-price small {
     display: block;
     font-size: 12px;
     color: #4B5563;
     font-weight: 500;

     margin-bottom: 2px;
 }

 .campilist-price strong {
     font-size: 15px;
     color: #5C2396;
     font-weight: 700;
 }

 /* Button hover */
 .campilist-btn:hover {
     background: #4A1C7C;
 }

 /* Card hover polish */
 .campilist-card:hover {
     transform: translateY(-6px);
     box-shadow: 0 14px 30px rgba(0, 0, 0, 0.12);
 }

 .campilist-img-count {
     position: absolute;
     top: 14px;
     left: 14px;
     background: rgba(0, 0, 0, 0.55);
     color: #fff;
     font-size: 12px;
     padding: 3px 9px;
     border-radius: 20px;
     display: flex;
     align-items: center;
     gap: 6px;
     z-index: 6;
 }

 .campilist-img-count i {
     font-size: 13px;
 }




 /* filter sidebar  */
 .filter-body {
     padding: 22px;
     overflow-y: auto;
     height: 70vh;
     padding-bottom: 160px;
 }

 .filter-section {
     margin-bottom: 22px;
 }

 .filter-section h6 {
     font-size: 15px;
     font-weight: 600;
     margin-bottom: 12px;
 }

 /* Grid system */
 .filter-grid {
     display: grid;
     gap: 14px;
     margin-bottom: 18px;
 }

 .filter-grid.two {
     grid-template-columns: 1fr 1fr;
 }

 .filter-grid.three {
     grid-template-columns: 1fr 1fr 1fr;
 }

 .filter-footer {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 16px 0px;
     border-top: 1px solid #E5E7EB;
     background: #fff;
 }

 /* Clear All */
 .clear-filter {
     height: 44px;
     padding: 0 18px;
     border-radius: 10px;
     border: 1px solid #E5E7EB;
     box-shadow:
         0px 3px 6px #07006E08,
         inset 0px 4px 6px #FFFFFF66,
         inset 0px -2px 2px #1B235512;



     background: #fff;
     color: #9CA3AF;
     font-size: 15px;
     font-weight: 500;
     display: inline-flex;
     align-items: center;
     gap: 10px;
     cursor: pointer;
 }

 /* Apply Filters */
 .apply-filter {
     height: 44px;
     padding: 0 26px;
     border-radius: 10px;
     border: none;
     background: #5C2396;
     color: #fff;
     font-size: 15px;
     font-weight: 600;
     cursor: pointer;
 }

 /* Hover polish */
 .clear-filter:hover {
     background: #F9FAFB;
 }

 .apply-filter:hover {
     background: #4A1C7C;
 }

 .field label {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 6px;
     display: block;
 }

 .field select,
 .field input {
     width: 100%;
     padding: 11px 12px;
     border-radius: 8px;
     border: 1px solid #ddd;
     font-size: 14px;
 }

 /* Range */
 .range-values {
     display: flex;
     justify-content: space-between;
     font-size: 12px;
     margin-top: 6px;
     color: #999;
 }

 /* Ratings */
 .ratings-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 10px;
 }

 .ratings-grid label {
     display: flex;
     align-items: center;
     gap: 6px;
     font-size: 14px;
 }

 /* Footer */
 .filter-footer {

     border-top: 1px solid #eee;
 }

 .apply-filter {
     width: 100%;
     background: #5C2396;
     color: #fff;
     border-radius: 10px;
     padding: 14px;
     font-weight: 500;
     border: none;
 }

 /* Mobile */
 @media(max-width: 576px) {

     .filter-grid.two,
     .filter-grid.three {
         grid-template-columns: 1fr;
     }

     .ratings-grid {
         grid-template-columns: 1fr 1fr;
     }
 }

 .filter-sidebar {
     position: fixed;
     top: 0;
     right: -605px;
     width: 600px;
     height: 100vh;
     background: #fff;
     z-index: 9999;
     transition: 0.35s ease;
 }

 .filter-sidebar.active {
     right: 0;
 }

 .flatpickr-calendar {
     border: 1px solid #dddddd;
     border-radius: 5px;
 }

 .filter-overlay {
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.4);
     opacity: 0;
     visibility: hidden;
     z-index: 1000;
     transition: 0.3s;
 }

 .filter-overlay.active {
     opacity: 1;
     visibility: visible;
 }


 .ratings-grid .fa {
     font-size: 13px;
     color: #f59e0b;
 }

 .filter-header {
     padding: 50px 20px;
 }

 .close-filter {
     background: white;
     border: unset;
 }

 .fa-times {
     font-size: 20px;
     color: #8b8b8b;
 }


 .form-control:focus {

     border-color: #922f9e;
     outline: 0;

 }

 input:focus,
 textarea:focus,
 select:focus,
 .select2-selection:focus {
     outline: none;


 }

 input:focus-visible,
 textarea:focus-visible,
 select:focus-visible {
     outline: none;
 }

 input::placeholder {
     color: #b0b0b0 !important;

 }


 .form-range::-webkit-slider-thumb {
     background-color: #6f2dbd;
     border: 2px solid #6f2dbd;
 }

 .form-range::-moz-range-thumb {
     background-color: #6f2dbd;
     border: 2px solid #6f2dbd;
 }

 .form-range {
     accent-color: #6f2dbd;
 }

 .distance-range {
     --fill-percent: 0%;
 }


 .distance-range::-webkit-slider-runnable-track {
     height: 8px;
     border-radius: 10px;
     background: linear-gradient(to right,
             #6f2dbd var(--fill-percent),
             #e0e0e0 var(--fill-percent));
 }

 .distance-range::-moz-range-track {
     height: 8px;
     border-radius: 10px;
     background: #e0e0e0;
 }


 .distance-range::-webkit-slider-thumb {
     appearance: none;
     margin-top: -6px;
     width: 20px;
     height: 20px;
     border-radius: 50%;
     background: #6f2dbd;
     border: 2px solid #6f2dbd;
     cursor: pointer;
 }

 .distance-range::-moz-range-thumb {
     width: 20px;
     height: 20px;
     border-radius: 50%;
     background: #6f2dbd;
     border: 2px solid #6f2dbd;
     cursor: pointer;
 }


 /* bank details */
 /* SECTION */
 .bank-dtl-section {
     padding: 24px;
 }

 /* GRID */
 .bank-dtl-grid {
     display: grid;
     grid-template-columns: 2fr 1fr;
     gap: 24px;
 }

 /* CARD */
 .bank-dtl-card {
     background: #ffffff;
     border-radius: 12px;
     padding: 24px;
     box-shadow: 0px 1px 8px 0px #19213D0F;
     border: 1px solid #F1F2F9;

 }

 /* TITLE */
 .bank-dtl-title {
     font-size: 16px;
     font-weight: 600;
     margin-bottom: 20px;
     color: #1f2937;
 }

 /* FORM */
 .bank-dtl-form .bank-dtl-row {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 20px;
     margin-bottom: 16px;
 }

 /* FORM GROUP */
 .form-group {
     display: flex;
     flex-direction: column;
 }

 .form-group label {
     font-size: 13px;
     font-weight: 500;
     margin-bottom: 6px;
     color: #374151;
 }

 .form-group label span {
     color: #ef4444;
 }

 /* INPUT */
 .form-control {
     height: 44px;
     padding: 0 12px;
     border-radius: 8px;
     border: 1px solid #e5e7eb;
     font-size: 14px;
     transition: all 0.2s ease;
 }

 .form-control:focus {
     outline: none;
     border-color: #7c3aed;
     box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.1);
 }

 /* ACTIONS */
 .bank-dtl-actions {
     display: flex;
     justify-content: flex-end;
     margin-top: 16px;
 }


 /* BUTTON */
 .bank-dtl-btn {
     background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);


     color: #ffffff;
     border: none;
     height: 40px;
     padding: 0 28px;
     border-radius: 6px;
     font-size: 14px;
     font-weight: 500;
     cursor: pointer;
 }

 .bank-dtl-btn.full {
     width: 100%;
     margin-top: 16px;
 }

 /* QR SECTION */
 .bank-dtl-qr {
     display: flex;
     flex-direction: column;
     align-items: center;
 }

 .bank-dtl-qr-box {
     width: 180px;
     height: 180px;

     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: #fafafa;
     cursor: pointer;
 }

 .bank-dtl-qr-box img {
     width: 100%;
     height: 100%;
     object-fit: contain;
     border-radius: 10px;
 }

 .qr-icon {
     font-size: 48px;
     color: #b0b0b0;
 }



 /* RESPONSIVE */
 @media (max-width: 992px) {
     .bank-dtl-grid {
         grid-template-columns: 1fr;
     }

     .bank-dtl-form .bank-dtl-row {
         grid-template-columns: 1fr;
     }

     /* 
     .bank-dtl-actions {
         justify-content: center;
     } */
 }


 .qr-dt {
     /* border: 2px dashed #d1d5db; */
     width: 100%;
     justify-content: center;
     display: flex;
     padding: 10px;
 }



 /* profile data */
 .prfle-dt-card {
     display: flex;
     gap: 24px;
     background: #fff;
     border-radius: 14px;
     padding: 24px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
 }


 /* LEFT */
 .prfle-dt-left {
     width: 300px;
     flex-shrink: 0;
 }

 .prfle-dt-main-img img {
     width: 100%;
     height: 360px;
     object-fit: cover;
     border-radius: 12px;
 }

 /* Thumbnails */
 .prfle-dt-thumb-wrapper {
     margin-top: 12px;
     overflow-x: auto;
 }

 .prfle-dt-thumb-scroll {
     display: flex;
     gap: 10px;
 }

 .prfle-dt-thumb {
     width: 70px;
     height: 70px;
     object-fit: cover;
     border-radius: 8px;
     cursor: pointer;
     opacity: 0.6;
     border: 2px solid transparent;
     transition: 0.3s;
 }

 .prfle-dt-thumb.active,
 .prfle-dt-thumb:hover {
     opacity: 1;
     border-color: #4f46e5;
 }

 /* RIGHT */
 .prfle-dt-right {
     flex: 1;
 }

 .prfle-dt-name {
     font-size: 22px;
     font-weight: 600;
     margin-bottom: 8px;
 }

 .prfle-dt-contact p {
     margin: 4px 0;
     color: #555;
 }

 .prfle-dt-location {
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .prfle-dt-section {
     margin-top: 16px;
 }

 .prfle-dt-section h4 {
     font-size: 15px;
     margin-bottom: 8px;
 }

 .prfle-dt-desc {
     font-size: 14px;
     color: #666;
 }

 .prfle-dt-meta {
     display: flex;
     gap: 30px;
     margin-top: 10px;
     font-size: 14px;
 }

 /* Tags */
 .prfle-dt-tags {
     display: flex;
     flex-wrap: wrap;
     gap: 8px;
 }

 .prfle-dt-tags span {
     background: #f1f3f9;
     padding: 6px 12px;
     border-radius: 20px;
     font-size: 13px;
     color: #333;
 }



 /* Thumbnail Slider */
 .prfle-dt-thumb-wrapper {
     display: flex;
     align-items: center;
     gap: 8px;
     margin-top: 12px;
 }

 .prfle-dt-thumb-viewport {
     width: 240px;
     overflow: hidden;
 }

 .prfle-dt-thumb-track {
     display: flex;
     gap: 10px;
     transition: transform 0.4s ease;
 }

 .prfle-dt-thumb {
     width: 70px;
     height: 70px;
     object-fit: cover;
     border-radius: 8px;
     cursor: pointer;
     opacity: 0.5;
     border: 2px solid transparent;
     flex-shrink: 0;
 }

 .prfle-dt-thumb.active {
     opacity: 1;
     border-color: #4f46e5;
 }

 /* Navigation Buttons */
 .prfle-dt-nav {
     width: 32px;
     height: 32px;
     border-radius: 50%;
     border: none;
     background: #eef0f7;
     cursor: pointer;
     font-size: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .prfle-dt-nav:hover {
     background: #4f46e5;
     color: #fff;
 }


 /* my booking */

 .booking-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 20px;
     margin-top: 10px;
 }


 .my-booking-card {
     background: #fff;
     border-radius: 18px;
     padding: 22px 24px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
     border: 1px solid #E5E7EB;
 }


 .my-booking-header {
     display: flex;
     gap: 16px;
 }


 .my-booking-avatar {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     object-fit: cover;
     flex-shrink: 0;
 }


 .my-booking-info {
     flex: 1;
 }


 .my-booking-name {
     font-size: 15px;
     font-weight: 600;
     margin: 0;
     color: #111827;
 }


 .my-booking-rating {
     display: flex;
     align-items: center;
     gap: 3px;
     float: right;
     margin-top: -22px;
 }

 .my-booking-rating i {
     font-size: 14px;
     color: #d1d5db;
 }

 .my-booking-rating i.active {
     color: #facc15;
 }

 .my-booking-rating span {
     font-size: 13px;
     color: #6b7280;
     margin-left: 6px;
 }


 .my-booking-info p {
     font-size: 13px;
     color: #374151;
     margin: 6px 0;
 }


 .my-booking-location {
     display: flex;
     align-items: center;
     gap: 6px;
     color: #6b7280;
 }

 .my-booking-location i {
     color: #5C2396;
 }


 .my-booking-actions {
     display: flex;
     gap: 5px !important;
     margin-top: 12px;
 }


 .my-booking-btn {
     padding: 10px 22px;
     font-size: 14px;
     border-radius: 12px;
     border: none;
     cursor: pointer;
     font-weight: 500;
 }

 .my-booking-view {
     background: #fff;
     color: #170F49;
     font-weight: 600;
     border: 1px solid #e5e7eb;
 }

 .my-booking-accept {
     background: #662699;
     color: #fff;
 }

 .my-booking-reject {
     background: #bc4a96;
     color: #fff;
 }

 .my-booking-actions {
     padding: 24px;

     margin-top: 18px;
     width: 100%;
     max-width: 100%;

     bottom: 16px;
     position: absolute;
     bottom: 0px;
     left: 0px;
     right: 16px;
     display: flex;

 }

 .my-booking-card {
     min-height: 250px;
     position: relative;
 }

 .my-booking-btn {
     width: 100%;
     padding: 9px 0;
     font-size: 14px;
     border-radius: 8px;
     cursor: pointer;
     font-weight: 500;
     text-align: center;
 }








 .booking-list-table {
     background: #f6f8fc;
     padding: 2px;
     border-radius: 0px;
 }

 .booking-table {
     width: 100% !important;
     background: #fff;
     /* border-radius: 10px; */
     overflow: hidden;
     border: 1px solid #e7e9f1;
     font-size: 13px;
 }

 .booking-table thead {
     background: #F1F0FB;
 }

 .booking-table th {
     padding: 14px;
     text-align: left;
     font-weight: 600;
     color: #282232;
 }

 .booking-table td {
     padding: 14px;
     border-top: 1px solid #eef0f6;
 }

 .booking-table tbody tr:hover {
     background: #fafbff;
 }

 /* Status */
 .booking-status {
     padding: 5px 14px;
     font-size: 12px;
     border-radius: 20px;
     font-weight: 500;
 }

 .booking-status.completed {
     background: #dff7e6;
     color: #1f9d55;
 }

 /* Action */
 .booking-view-btn {
     background: #F5F5F5;
     color: #8A4ED8;
     text-decoration: none;
     display: inline-flex;
     gap: 6px;
     padding: 5px 14px;
     font-size: 12px;
     border-radius: 20px;
     font-weight: 500;
 }

 .booking-view-btn:hover {
     text-decoration: underline;
 }


 .dt-paging nav {
     margin-top: 20px;
     justify-content: end;
     display: flex;
 }


 .dt-paging .current {
     color: white !important;
     background: #903c9a !important;
 }



 .dt-container .dt-paging .dt-paging-button:active {
     color: white !important;
     background: linear-gradient(to bottom, #c14e95 0%, #c24f95 100%);
     box-shadow: inset 0 0 3px #c14e95;
 }

 .dt-container .dt-paging .dt-paging-button:hover {
     color: white !important;
     border: 1px solid #bd4c98 !important;
     background: #bd4c98 !important;
 }

 div.dt-container .dt-paging .dt-paging-button:hover {
     color: white !important;
     border: 1px solid #bd4c98 !important;
     background: linear-gradient(to bottom, #bc4b96 0%, #c24f95 100%);
 }

 .my-booking-actions a {
     text-decoration: none;
 }

 .bd-booking-actions a {
     text-decoration: none;
 }

 .modal-title {
     color: #282232;
     font-weight: 600;
     font-size: 17px;
 }

 .booking-status.open {
     background: #FFEDD5;
     color: #E07D00;
 }

 .booking-status.inreview {
     background: #FFF4D8;
     color: #BE9B44;
 }

 .admin-modal {
     border-radius: 14px;
     padding: 8px;
 }

 .admin-modal .modal-body {
     font-size: 14px;
     line-height: 1.6;
 }

 .text-purple {
     color: #6f42c1;
 }

 .text-purple:hover {
     text-decoration: underline;
 }

 .modal-body .text-muted {
     color: #354259 !important;
 }



 /* wallet */
 .wallet-card {
     display: flex;
     justify-content: space-between;
     align-items: center;
     background: #ffffff;
     border-radius: 10px;
     padding: 25px 22px;
     /* box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.06); */
     border: 1px solid #f1f1f1;
     margin-bottom: 30px;
 }

 /* LEFT */
 .wallet-left {
     display: flex;
     align-items: center;
     gap: 14px;
 }

 .wallet-icon {
     width: 56px;
     height: 56px;
     background: #5C2396;
     border-radius: 8px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .wallet-icon i {
     color: #fff;
     font-size: 18px;
 }

 .wallet-info .wallet-label {
     font-size: 13px;
     color: #8a8a8a;
     display: block;
 }

 .wallet-amount {
     font-size: 20px;
     font-weight: 700;
     color: #282232;
     margin: 0;
     margin-top: 5px;
 }


 .wallet-right {
     display: flex;
     align-items: center;
     gap: 16px;
 }


 .wallet-status {
     width: 56px;
     height: 56px;
     background: linear-gradient(180deg, #22c55e, #16a34a);
     border-radius: 8px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .check-circle {
     width: 30px;
     height: 30px;
     background: #ffffff;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .check-circle i {
     font-size: 14px;
     color: #22c55e;
     font-weight: 700;
 }

 /* TEXT */
 .wallet-settled {
     display: flex;
     flex-direction: column;
 }

 .wallet-label {
     font-size: 14px;
     color: #6b7280;
     font-weight: 500;
     margin-bottom: 4px;
 }

 .wallet-amount-sm {
     font-size: 20px;
     font-weight: 700;
     color: #282232;
     margin: 0;
     margin-top: 5px;
 }



 /* time availabiliti */
 .availability-container {
     max-width: 1200px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: 1fr 1fr;
     align-items: center;
     gap: 48px;

 }


 .availability-image {
     text-align: center;
 }

 .availability-image img {
     max-width: 100%;

     height: auto;
 }

 .mdtp__wrapper {
     top: 25%;
     bottom: unset !important;
 }

 .mdtp__wrapper {
     bottom: unset !important;
 }

 .avail-card-image-captiont {
     margin-top: 18px;
     font-size: 16px;
     font-weight: 500;
     color: #c7bddf;
 }


 .availability-card {
     max-width: 460px;
     margin-left: auto;
     background: #ffffff;
     border-radius: 12px;
     padding: 24px;
     box-shadow: 0px 1px 8px 0px #19213D0F;
     border: 1px solid #F1F2F9;
 }


 .avail-card-title {
     font-size: 22px;
     font-weight: 600;
     color: #1f1f3a;
     margin-bottom: 8px;
 }

 .avail-card-subtitle {
     font-size: 14px;
     color: #6f6f8f;
     margin-bottom: 22px;
 }


 .availability-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     gap: 14px;
 }

 .avail-card-row-text h4 {
     font-size: 15px;
     font-weight: 600;
     margin: 0;
     color: #1f1f3a;
 }

 .avail-card-row-text p {
     font-size: 13px;
     color: #8b8ba5;
     margin-top: 4px;
     margin-bottom: 0px;
 }

 hr {
     border: none;
     border-top: 1px solid #eee;
     margin: 14px 0;
 }


 .avail-card-form-group {
     margin-top: 18px;
     width: 100%;
 }

 .avail-card-form-group label {
     font-size: 13px;
     font-weight: 500;
     color: #2c2c4d;
     margin-bottom: 6px;
     display: block;
 }

 .avail-card-form-group input {
     width: 100%;
     height: 44px;
     padding: 0 12px;
     border-radius: 8px;
     border: 1px solid #ddd;
     font-size: 14px;
 }

 .avail-card-form-group input:focus {
     outline: none;
     border-color: #7a3db8;
 }


 .avail-card-time-row {
     display: flex;
     gap: 16px;
 }


 .avail-card-switch {
     position: relative;
     width: 44px;
     height: 22px;
 }

 .avail-card-switch input {
     opacity: 0;
 }

 .avail-card-slider {
     position: absolute;
     inset: 0;
     background: #cfcfcf;
     border-radius: 50px;
     transition: 0.3s;
 }

 .avail-card-slider:before {
     content: "";
     position: absolute;
     width: 18px;
     height: 18px;
     left: 2px;
     top: 2px;
     background: #ffffff;
     border-radius: 50%;
     transition: 0.3s;
 }

 .avail-card-switch input:checked+.avail-card-slider {
     background: #6f2dbd;
 }

 .avail-card-switch input:checked+.avail-card-slider:before {
     transform: translateX(22px);
 }


 .avail-card-save-btn {
     width: 100%;
     margin-top: 26px;
     height: 48px;
     border: none;
     border-radius: 10px;
     font-size: 16px;
     font-weight: 600;
     color: #ffffff;
     cursor: pointer;
     background: linear-gradient(90deg, #6f2dbd, #c94a8a);
 }

 .avail-card-save-btn:hover {
     opacity: 0.95;
 }




 .availability-wrapper {
     background: #ffffff;
     border-radius: 12px;
     padding: 35px;
     box-shadow: 0px 1px 8px 0px #19213D0F;
     border: 1px solid #F1F2F9;
 }


 /* campanion details  */
 .cm-prf-card {
     display: grid;
     grid-template-columns: 290px 1fr 290px;
     gap: 20px;
     background: #fff;
     border-radius: 16px;
     padding: 20px;
 }

 /* LEFT */
 .cm-prf-main-img {
     height: 315px;
     border-radius: 6px;
     overflow: hidden;
 }

 .cm-prf-main-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 .cm-prf-thumb {
     width: 64px;
     height: 64px;
     border-radius: 10px;
     object-fit: cover;
     flex-shrink: 0;
     background: #eee;
 }

 .cm-prf-thumbs img {
     width: 65px;
     height: 65px;
     border-radius: 6px;
     cursor: pointer;
 }

 .cm-prf-thumbs img.active {
     outline: 2px solid #6a2ca3;
 }

 .cm-prf-msg-btn,
 .cm-prf-book-btn {
     width: 100%;
     padding: 10px;
     margin-top: 12px;
     border-radius: 8px;
     border: none;
     cursor: pointer;
 }

 .cm-prf-msg-btn {
     background: #fff;
     border: 1px solid #ddd;
 }

 .cm-prf-book-btn {
     background: #5C2396;
     color: #fff;
 }

 .cm-prf-thumb-wrap {
     display: grid;
     grid-template-columns: 36px 1fr 36px;
     align-items: center;
     gap: 8px;
     margin-top: 10px;
 }

 .cm-prf-services p {
     margin-bottom: 0px;
 }

 .cm-prf-services strong {
     color: #5C2396;
 }

 .cm-prf-nav {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     background: #b34d8a;
     border: 1px solid #973d9c;
     color: #fff;
     font-size: 18px;
     cursor: pointer;
 }

 .cm-prf-thumb.active {
     outline: 2px solid #6a2ca3;
     outline-offset: 2px;
 }


 .cm-prf-nav:hover {
     background: #6a2ca3;
     color: #fff;
 }

 .cm-prf-thumbs {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 18px;
     overflow-x: auto;
     scroll-behavior: smooth;
     padding: 6px 0;
 }

 .cm-prf-thumbs::-webkit-scrollbar {
     display: none;
 }

 .flatpickr-monthDropdown-months {
     font-size: 15px !important;
     font-weight: 500 !important;
 }

 .flatpickr-current-month input.cur-year {
     font-size: 15px;
     font-weight: 500;
 }

 .cm-prf-thumbs::-webkit-scrollbar {
     display: none;
 }

 /* CENTER */
 .cm-prf-head {
     display: flex;
     justify-content: space-between;
 }

 .cm-prf-rating span {
     font-size: 13px;
     color: #777;
 }

 .cm-prf-center p,
 .cm-prf-center strong,
 .cm-prf-center span {
     font-size: 13px;
 }

 .cm-prf-tags span,
 .cm-prf-slots span {
     display: inline-block;
     padding: 6px 12px;
     background: #f1f3f7;
     border-radius: 20px;
     margin: 5px 5px 0 0;
     font-size: 13px;
 }

 .cm-prf-services {
     display: flex;

 }

 .cm-prf-services .serv-div {
     background: #f6f7fb;
     padding: 12px;
     border-radius: 10px;
     margin-bottom: 10px;


 }

 .cm-prf-services {
     overflow-y: auto;
     height: 165px;
 }


 /* RIGHT PANEL */
 .cm-prf-right {
     max-width: 360px;
 }


 .cm-prf-box {
     background: #fff;
     border-radius: 12px;
     padding: 14px;
     margin-bottom: 15px;
     border: 1px solid #eee;
 }


 .cm-prf-head {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: 10px;
 }

 .cm-prf-head h4 {
     font-size: 16px;
     font-weight: 600;
 }

 .edit-link {
     font-size: 12px;
     color: #a855f7;
     text-decoration: none;
 }

 .calendar-input {
     width: 100%;
     border: none;
     padding: 0;
 }

 .contact-list li {
     cursor: default !important;
 }

 .notification-card {
     margin-top: 15px;
 }

 .flatpickr-calendar {
     box-shadow: none;

 }

 .flatpickr-day {
     border-radius: 6px;
 }

 .flatpickr-day.selected,
 .flatpickr-day.startRange,
 .flatpickr-day.endRange {
     background: #ede9fe;
     color: #6d28d9;
     border: none;
 }


 .cm-prf-box .flatpickr-calendar {
     position: static !important;
     /* width: 100% !important;
     max-width: 100%; */
     margin: 0 auto;
 }


 .cm-prf-box .flatpickr-rContainer {
     width: 100%;
 }


 .cm-prf-box .flatpickr-days {
     width: 100%;
 }




 .cm-prf-slots {
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
 }

 .cm-prf-slots span {
     padding: 8px 12px;
     border-radius: 8px;
     border: 1px solid #e5e7eb;
     font-size: 13px;
     cursor: pointer;
     background: #fff;
 }

 .cm-prf-slots span.active {
     background: #ede9fe;
     color: #6d28d9;
     border-color: #c4b5fd;
 }


 .cm-prf-slots span.active {
     background: #6a2ca3;
     color: #fff;
 }

 .cm-prf-center .dash-profile-title h5 {
     font-size: 16px;
 }

 .cm-prf-center .dash-profile-title p {
     font-size: 13px;
 }

 .cm-prf-center .dash-rating {
     gap: 0px;
     margin-bottom: 12px;
     color: #f5b301;
     font-size: 13px;
 }

 .all-heder {
     display: none;
 }


 .cm-prf-box h4,
 .cm-prf-left h4,
 .cm-prf-center h4 {
     color: #111827;
     font-size: 16px;
     font-weight: 600;
 }


 .cm-prf-box input:read-only {
     background-color: #dfdfe0;
     color: #6b7280;
     cursor: not-allowed;
 }

 .cm-prf-book-companion {
     max-width: 100%;

 }

 .cm-prf-book-companion .form-buttons {
     justify-content: space-between;
 }

 .book-companion-card {
     border: 1px solid #eeeeee;
     background: #fff;
     border-radius: 10px;
     padding: 20px;
     box-shadow: 0px 1px 2px 0px #0000000D;

 }

 .bd-rate-btn {
     text-decoration: none;
 }

 .form-buttons a {
     text-decoration: none;
 }

 .cm-prf-book-btn img {
     width: 17px;
 }

 .book-companion-card h3 {
     margin-bottom: 15px;
     font-size: 16px;
     color: #282232;
     font-weight: 600;
 }


 .cm-prf-card .form-group label {
     display: block;
     margin-bottom: 5px;
     font-weight: 500;
 }

 .cm-prf-card .required {
     color: red;
 }

 .cm-prf-card .form-group input[type="text"],
 .cm-prf-card .form-group select {
     width: 100%;
     padding: 8px 10px;
     border-radius: 6px;
     border: 1px solid #ccc;
     font-size: 14px;
 }

 .cm-prf-card .checkbox-group label {
     display: flex;
     align-items: center;
     gap: 5px;
     margin-bottom: 5px;
     font-size: 14px;
 }

 .cm-prf-card .cm-prf-book-companion .form-buttons {
     display: flex;

     gap: 10px;
     margin-top: 20px;
 }

 .btn-cancel {
     padding: 8px 15px;
     border: 1px solid #ccc;
     border-radius: 6px;
     background: #fff;
     cursor: pointer;
 }

 .btn-submit {
     padding: 8px 15px;
     border: none;
     border-radius: 6px;
     background: linear-gradient(90deg, #7926A0, #D34699);
     color: #fff;
     cursor: pointer;
 }

 .cm-rate-companion-btn {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     padding: 8px 12px;
     font-size: 13px;
     font-weight: 500;
     color: #170F49;
     background: #FBFBFB;

     border: 1px solid #cfd6ff;
     border-radius: 6px;
     cursor: pointer;
     line-height: 1;
 }

 .cm-rate-companion-btn .star {
     font-size: 13px;
     color: #2f2f8f;
 }

 .cm-rate-companion-btn:hover {
     background: #f5f6ff;
 }

 /* raise tickits */
 .bd-booking-layout {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 24px;
 }

 .bd-card {
     background: #fff;
     border-radius: 8px;
     padding: 20px;
     background: #FFFFFF;

     box-shadow: 0px 1px 2px 0px #0000000D;
     border: 1px solid #E5E7EB
 }

 .bd-review-header h5 {
     color: #354259;
     font-size: 14px;
     font-weight: 600;
     margin-bottom: 0px;
 }

 .bd-review-header span {
     color: #354259;
     font-size: 12px;
 }


 /* PROFILE */
 .bd-profile-header {
     display: flex;
     gap: 16px;
     align-items: flex-start;
     position: relative;
 }

 .bd-profile-header img {
     width: 80px;
     height: 80px;
     border-radius: 50%;
     object-fit: cover;
 }

 .bd-profile-info h4 {
     font-size: 17px;
     font-weight: 700;
     margin-bottom: 6px;
 }

 .bd-profile-info p {
     margin: 6px 0;
     font-size: 14px;
     color: #374151;
 }

 .bd-location {
     color: #666;
 }

 .bd-rate-btn {
     position: absolute;
     right: 0;
     top: 0;
     background: #FBFBFB;
     border: 1px solid #D4D4D8;
     color: #170F49;
     padding: 6px 14px;
     border-radius: 8px;
     cursor: pointer;
     font-size: 12px;
     font-weight: 600;
 }

 /* BOOKING */
 .bd-booking-card h5 {
     margin-bottom: 12px;
 }

 .bd-booking-list {
     list-style: none;
     padding: 0;
 }

 .bd-booking-list li {
     display: flex;
     justify-content: space-between;
     padding: 10px 0;
     border-bottom: 1px solid #eee;
 }

 .bd-booking-list .bd-total {
     font-weight: bold;
 }

 .bd-status.bd-completed {
     color: green;
 }

 .bd-booking-actions {
     display: flex;
     gap: 12px;
     margin-top: 16px;
 }

 .bd-btn {
     flex: 1;
     padding: 12px;
     border-radius: 8px;
     border: none;
     cursor: pointer;
 }

 .bd-btn.bd-danger {
     background: #6a1b9a;
     color: #fff;
 }

 .bd-btn.bd-sos {
     background: #d81b60;
     color: #fff;
 }

 /* REVIEWS */
 .bd-review-header {
     display: flex;
     justify-content: space-between;
 }

 .bd-review-card p {
     color: #354259;
     font-size: 13px;
     margin-bottom: 0px;
 }

 .bd-review-card {
     margin-bottom: 10px;
 }

 .bd-stars {
     color: #fbc02d;
     margin: 7px 0;
     font-size: 13px;
 }

 .bd-help-card {
     background: #F1F0FB;
     border: 1px solid #c9c3ff;
     border-radius: 14px;
     padding: 16px 18px;
 }

 .bd-help-header {
     display: flex;
     align-items: center;
     gap: 10px;
     margin-bottom: 6px;
 }

 .bd-help-icon {
     width: 20px;
     height: 20px;
     border-radius: 20px;
     background: #5C2396;
     color: #fff;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 14px;
 }

 .bd-help-header strong {
     font-size: 16px;
     color: #5C2396;
 }

 .bd-help-text {
     font-size: 14px;
     color: #7A42C3;
     line-height: 1.6;
     margin-left: 36px;
     margin-bottom: 0px;
 }

 .bd-help-text a {
     color: #5C2396;
     font-weight: 500;
     text-decoration: none;
 }

 .bd-help-text a:hover {
     text-decoration: underline;
 }

 .bd-stars .text-muted {
     color: #DFDFDF !important;
 }

 /* RESPONSIVE */


 .bd-booking-card {
     padding: 24px;
 }

 .bd-booking-title {
     font-size: 17px;
     font-weight: 600;
     margin-bottom: 18px;
 }

 .bd-booking-item {
     display: flex;
     align-items: flex-start;
     gap: 14px;
     padding: 10px 0;
 }

 .bd-booking-icon {
     width: 23px;
     height: 23px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 11px;
     flex-shrink: 0;
 }

 .bd-icon-success {
     background: #16a34a;
 }

 .bd-icon-purple {
     color: #5C2396;
 }

 .bd-booking-text {
     display: flex;
     flex-direction: column;
     gap: 4px;
 }

 .bd-label {
     font-size: 15px;
     color: #4B5563;
     font-weight: 500;
 }

 .bd-value {
     font-size: 15px;
     font-weight: 600;
     color: #282232;
 }


 .bd-status-completed {
     color: #16a34a;
     font-weight: 600;
 }

 .bd-price {
     font-weight: 700;
 }

 .bd-divider {
     height: 1px;
     background: #e5e7eb;
     margin: 10px 0;
 }

 /* Buttons */
 .bd-booking-actions {
     display: flex;
     gap: 18px;
     margin-top: 24px;
 }
.received p {
     word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

 .bd-btn {
     flex: 1;
     padding: 12px;
     border-radius: 8px;
     font-size: 15px;
     font-weight: 600;
     border: none;
     color: #fff;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 10px;
 }

 .bd-btn-complaint {
     background: #5C2396;
 }

 .bd-btn-sos {
     background: #C00B80;
 }

 .raise-comp-card {
     background: #fff;
     border-radius: 14px;
     padding: 24px;
     border: 1px solid #E6E7EA;
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
 }

 .raise-comp-title {
     font-size: 20px;
     font-weight: 600;
     margin-bottom: 20px;
 }

 .raise-comp-row {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;
     margin-bottom: 16px;
 }

 .raise-comp-field {
     display: flex;
     flex-direction: column;
 }

 .raise-comp-field label {
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 6px;
 }

 .raise-comp-field input,
 .raise-comp-field select,
 .raise-comp-field textarea {
     border: 1px solid #ddd;
     border-radius: 8px;
     padding: 10px 12px;
     font-size: 14px;
 }

 .raise-comp-field textarea {
     resize: none;
     min-height: 90px;
 }

 .raise-comp-upload {
     margin-top: 16px;
 }

 .raise-comp-dropzone {
     border: 2px dashed #b97adf;
     border-radius: 12px;
     padding: 22px;
     text-align: center;
     cursor: pointer;
     /* background: #faf7fd; */
 }

 .raise-comp-drop-content p {
     font-size: 14px;
     margin: 6px 0;
 }

 .raise-comp-drop-content span {
     color: #7a2fa4;
     font-weight: 600;
     cursor: pointer;
 }

 .raise-comp-drop-content small {
     color: #777;
     font-size: 12px;
 }

 .raise-comp-upload-icon {
     font-size: 26px;
     color: #7a2fa4;
 }

 .raise-comp-file {
     display: flex;
     align-items: center;
     gap: 10px;
     background: #f6f6f6;
     border-radius: 8px;
     padding: 10px 12px;
     margin-top: 12px;
 }

 .raise-comp-file-name {
     font-size: 14px;
     font-weight: 500;
 }

 .raise-comp-file-size {
     font-size: 12px;
     color: #666;
 }

 .raise-comp-remove {
     margin-left: auto;
     border: none;
     background: none;
     font-size: 18px;
     cursor: pointer;
     color: #999;
 }

 .raise-comp-action {
     text-align: right;
     margin-top: 24px;
 }

 .raise-comp-action button {

     border: none;
     color: #fff;
     padding: 10px 28px;

     font-size: 14px;
     font-weight: 600;
     cursor: pointer;
 }



 .raise-comp-upload label {
     font-size: 14px;
     font-weight: 500;
     margin-bottom: 6px;
 }

 .compaint-raise .bd-booking-layout {
     gap: 70px;
 }


 .terms-page-wrapper {
     margin: 0px auto;

 }

 .fa-map-marker-alt {
     color: #5C2396;
 }


 .terms-page-wrapper {

     margin: 40px auto;
     padding: 0 16px;
 }


 .terms-card {
     background: #ffffff;
     border: 1px solid #e6e9ef;
     box-shadow: 0px 1px 8px 0px #19213D0F;

     border-radius: 14px;
     padding: 28px;
 }


 .terms-card h1 {
     font-size: 24px;
     font-weight: 600;
     color: #1b1b5e;
     margin-bottom: 12px;
 }


 .terms-card hr {
     border: none;
     border-top: 1px solid #e6e9ef;
     margin-bottom: 16px;
 }


 .terms-meta {
     font-size: 13px;
     color: #6b7280;
     margin-bottom: 14px;
 }


 .terms-text {
     font-size: 14px;
     line-height: 1.7;
     color: #4b5563;
     margin-bottom: 16px;
 }


 .terms-card h2 {
     font-size: 14.5px;
     font-weight: 600;
     color: #111827;
     margin: 18px 0 6px;
 }

 /* 
 .select2-container {
     width: 100% !important;
 } */

 .filter-footer {

     display: flex;
 }

 .apply-filter {
     width: auto;
     padding: 12px 40px;

 }

 .filter-footer {
     position: absolute;
     bottom: 0px;
     width: 100%;
     padding: 20px;
 }


 .form-check-input:checked {
     background-color: #5C2396;
     border-color: #5C2396;
 }

 .form-check-input:focus {
     box-shadow: 0 0 0 0.15rem rgba(189, 77, 150, 0.25);
 }

 .cm-price-range {
     max-width: 420px;
     font-family: Mona Sans, sans-serif;
 }

 .cm-price-values {
     display: flex;
     justify-content: space-between;
     font-weight: 600;
     margin-bottom: 10px;
     font-size: 12px;
     margin-top: 6px;
     color: #999;
 }

 .cm-slider {
     position: relative;
     height: 32px;
 }

 .cm-track {
     position: absolute;
     top: 45%;
     transform: translateY(-50%);
     height: 4px;
     width: 100%;
     background: #d9d9d9;
     border-radius: 10px;
 }

 .cm-slider input {
     position: absolute;
     width: 100%;
     appearance: none;
     background: none;
     /* pointer-events: none; */
     top: 7px;
 }

 .cm-slider input::-webkit-slider-thumb {
     appearance: none;
     width: 14px;
     height: 14px;
     background: #BD4D96;
     border-radius: 50%;
     /* pointer-events: auto; */
     cursor: pointer;
 }

 #maxR::-webkit-slider-thumb {
     box-shadow: 0 0 0 8px #c23a9636;
 }

 .cm-slider input::-moz-range-thumb {
     width: 14px;
     height: 14px;
     background: #BD4D96;
     border-radius: 50%;
     border: none;
 }

 .cm-price-labels {
     display: flex;
     justify-content: space-between;
     font-size: 13px;
     color: #BD4D96;
     margin-top: 8px;
 }

 .iti__flag-container .iti__country-list {
     z-index: 1111 !important;
 }

 .iti__country-list {
     max-width: 270px !important;
 }

 .iti__country-list {
     overflow-x: hidden;
 }

 .iti {
     width: 100%;
 }



 /* services */
 /* GRID */
 .service-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 40px;
 }

 /* CARD */
 .service-card {

     overflow: hidden;

     transition: all 0.3s ease;
 }

 .serve-list-section {
     padding: 40px 20px;

 }

 .serve-list-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     gap: 20px;
     flex-wrap: wrap;
     margin-bottom: 30px;
 }

 .serve-list-header h2 {
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 6px;
 }

 .serve-list-header p {
     color: #666;
     font-size: 14px;
 }

 .serve-list-search input {
     padding: 10px 14px;
     border-radius: 8px;
     border: 1px solid #ddd;
     min-width: 240px;
     font-size: 12px;
 }

 /* IMAGE */
 .service-card img {
     width: 100%;
     height: 180px;
     object-fit: cover;
     display: block;
     border-radius: 8px;
 }

 /* CONTENT */
 .service-content {
     display: flex;
     gap: 14px;
     padding: 16px 18px 20px;
     border-left: 10px solid #ba4997;
     border-radius: 8px;
     margin-top: 10px;
         border-top: 1px solid #f0d7e8;
    border-right: 1px solid #f0d7e8;
    border-bottom: 1px solid #f0d7e8;



 }

 .service-content p {
     margin-bottom: 0px;
 }

 /* LEFT COLOR BAR */
 .service-bar {
     width: 6px;
     border-radius: 6px;
     background: linear-gradient(115.15deg, #7926A0 2.36%, #D34699 41.76%);
 }

 /* TEXT */
 .service-content h4 {
     font-size: 16px;
     font-weight: 600;
     margin-bottom: 6px;
     color: #111827;
 }

 .service-content p {
     font-size: 13px;
     color: #6B7280;
     line-height: 1.5;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
     overflow: hidden;
 }


 /* RESPONSIVE */
 @media (max-width: 1200px) {
     .service-grid {
         grid-template-columns: repeat(3, 1fr);
     }
 }

 @media (max-width: 992px) {
     .service-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 @media (max-width: 576px) {
     .service-grid {
         grid-template-columns: 1fr;
     }
 }




 /* contact us */
 .contact-section {
     padding: 40px 20px;
     background: #f7f9ff;
 }

 .contact-container {
     max-width: 1100px;
     margin: auto;
     background: #fff;
     border-radius: 18px;
     display: flex;
     overflow: hidden;
     box-shadow: 0 15px 40px rgba(0, 0, 0, .08);
 }

 /* LEFT */
 .contact-info {
     width: 40%;
     padding: 40px;
     color: #fff;
     background-image:

         url("../images/contact-us.png");

     background-size: cover;
     background-position: center;
     position: relative;
     justify-content: space-between;
     display: flex;
     flex-direction: column;
 }

 .contact-info h2 {
     margin-bottom: 8px;
     font-size: 24px;
 }

 .contact-info p {
     font-size: 14px;
     opacity: .9;
     margin-bottom: 35px;
     color: #ffffff;
 }

 .contact-details {
     list-style: none;
     padding: 0;
     margin: 0 0 40px;
 }

 .contact-details li {
     display: flex;
     gap: 12px;
     align-items: center;
     margin-bottom: 18px;
     font-size: 15px;
 }

 .contact-details i {
     font-size: 16px;
 }

 .contact-social {
     display: flex;
     gap: 14px;
 }

 .contact-social a {
     width: 34px;
     height: 34px;
     border-radius: 50%;
     background: rgba(255, 255, 255, .2);
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     text-decoration: none;
     transition: .3s;
 }

 .contact-social a:hover {
     background: #fff;
     color: #6a1b9a;
 }

 /* RIGHT */
 .contact-form {
     width: 60%;
     padding: 40px;
 }


 .contact-field textarea {
     height: 110px;
     resize: none;
 }

 .contact-field input:focus,
 .contact-field textarea:focus {
     border-color: #8e24aa;
 }

 .contact-btn {
     width: 100%;
     border: none;
     padding: 14px;
     font-size: 15px;
     border-radius: 10px;
     cursor: pointer;
     color: #fff;
     background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);
 }

 .contact-field textarea {
     width: 100%;
     padding: 12px 14px;
     border-radius: 8px;
     border: 1px solid #ddd;
     font-size: 14px;
     outline: none;
 }

 .contact-field {
     margin-bottom: 18px;
 }



 /* =========================
   CHAT WRAPPER
========================= */
 .chat-wrapper {
     display: flex;
     height: calc(100vh - 120px);
     background: #f7f8fc;
     border-radius: 14px;
     overflow: hidden;
     border: 1px solid #E4E6EA;
 }

 /* =========================
   SIDEBAR
========================= */
 .chat-sidebar {
     width: 320px;
     background: #ffffff;
     border-right: 1px solid #e5e7eb;
     display: flex;
     flex-direction: column;
 }

 .chat-sidebar-header {
     padding: 16px;
 }

 .chat-sidebar-header h3 {
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 12px;
 }

 .chat-search {
     width: 100%;
     padding: 10px 12px;
     border-radius: 10px;
     border: 1px solid #e5e7eb;
     font-size: 14px;
 }

 /* =========================
   USER LIST
========================= */
 .chat-user-list {
     flex: 1;
     overflow-y: auto;
 }

 .chat-user {
     display: flex;
     align-items: center;
     gap: 12px;
     padding: 14px 16px;
     cursor: pointer;
     border-bottom: 1px solid #f1f1f1;
 }

 .chat-user.active {
     background: #f4ebff;
 }

 .chat-user img {
     width: 44px;
     height: 44px;
     border-radius: 50%;
 }

 .chat-user-info {
     flex: 1;
 }

 .chat-user-info h4 {
     font-size: 14px;
     font-weight: 600;
     margin: 0;
 }

 .chat-user-info p {
     font-size: 12px;
     color: #6b7280;
     margin-top: 3px;
 }

 .chat-badge {
     background: #7c3aed;
     color: #ffffff;
     width: 22px;
     height: 22px;
     font-size: 11px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 /* =========================
   CHAT CONTENT
========================= */
 .chat-content {
     flex: 1;
     display: flex;
     flex-direction: column;
     background: #fafafa;
 }

 /* =========================
   HEADER
========================= */
 .chat-header {
     padding: 18px 22px;
     background: #ffffff;
     border-bottom: 1px solid #e5e7eb;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .chat-user-details {
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .chat-user-details img {
     width: 42px;
     height: 42px;
     border-radius: 50%;
 }

 .chat-user-details h4 {
     font-size: 15px;
     font-weight: 600;
     margin: 0;
 }

 .chat-user-details .online {
     font-size: 12px;
     color: #22c55e;
     display: block;
     margin-top: 2px;
 }

 .chat-meta span {
     font-size: 12px;
     color: #6b7280;
     margin-left: 14px;
     white-space: nowrap;
 }

 /* =========================
   MESSAGES AREA
========================= */
 .chat-messages {
     flex: 1;
     padding: 26px 30px;
     overflow-y: auto;
 }

 .message {
     max-width: 50%;
     padding: 14px 16px;
     font-size: 14px;
     line-height: 1.5;
     border-radius: 14px;

 }

 /* =========================
   RECEIVED MESSAGE ROW
========================= */
 .message-row {
     display: flex;
     align-items: flex-start;
     margin-bottom: 18px;
 }

 .message-row.received {
     justify-content: flex-start;
 }

 /* Avatar */
 .message-row .avatar {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     margin-right: 10px;
 }



 /* Bubble */
 .message.received {
     background: #f3f4f6;
     color: #1f2937;
     padding: 10px 15px;
     border-radius: 8px;
     border-top-left-radius: 0px;
     font-size: 16px;
     line-height: 1.6;
 }

 /* Time */
 .message-wrap .time {
     display: block;
     font-size: 10px;
     color: #9ca3af;
     margin-top: 6px;
     margin-left: 6px;
 }

 /* =========================
   SENT MESSAGE ROW
========================= */
 .message-row {
     display: flex;
     margin-bottom: 18px;
 }

 /* RIGHT SIDE */
 .message-row.sent {
     justify-content: flex-end;
 }

 /* Wrapper */
 .message-row.sent .message-wrap {
     max-width: 560px;
     display: flex;
     flex-direction: column;
     align-items: flex-end;
 }

 /* Bubble */
 .message.sent {
     background: #5b2aa6;
     color: #ffffff;
     padding: 10px 15px;
     border-radius: 8px;
     border-bottom-right-radius: 0px;
     font-size: 18px;
     line-height: 1.6;
     width: fit-content;

 }

 /* Time */
 .message-row.sent .time {
     font-size: 13px;
     color: #9ca3af;
     margin-top: 6px;
     margin-right: 6px;
 }


 .message .time {
     display: block;
     font-size: 11px;
     margin-top: 6px;
     opacity: 0.6;
 }

 .sent p {
     color: #FFFFFF !important;
     margin: 0px;
     font-size: 13px;

 }

 .received p {
     color: #4B5563;
     margin: 0px;
     font-size: 13px;
 }

 /* =========================
   CHAT INPUT AREA
========================= */
 .chat-input {
     position: relative;
     display: flex;
     align-items: center;
     padding: 12px;
     background: #ffffff;
     border-top: 1px solid #e5e7eb;
     gap: 10px;
 }

 /* Text input */
 .message-input {
     flex: 1;
     padding: 12px 14px 12px 44px;
     /* LEFT space for icon */
     border-radius: 10px;
     border: 1px solid #e5e7eb;
     font-size: 14px;
 }

 /* Upload icon inside input */
 .input-icon {
     position: absolute;
     left: 22px;
     cursor: pointer;
     display: flex;
     align-items: center;
 }

 .input-icon img {
     width: 20px;
     height: 20px;
     opacity: 0.7;
 }

 /* Send button */
 .send-btn {
     background: #5C2396;
     border: none;
     padding: 10px 14px;
     border-radius: 10px;
     cursor: pointer;
     display: flex;
     align-items: center;
 }

 .send-btn img {
     width: 18px;
 }


 /* =========================
   CHAT USER ROW (SIDEBAR)
========================= */
 .chat-user {
     position: relative;
     display: flex;
     align-items: center;
     padding: 14px 16px;
     gap: 12px;
     cursor: pointer;
     border-bottom: 1px solid #f1f1f1;
 }

 .chat-user.active {
     background: #F9F4FF;
 }

 /* Avatar */
 .chat-user img {
     width: 46px;
     height: 46px;
     border-radius: 50%;
 }

 /* Body */
 .chat-user-body {
     flex: 1;
     display: flex;
     flex-direction: column;
 }

 /* Top row (name + time) */
 .chat-user-top {
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .chat-user-top h4 {
     font-size: 15px;
     font-weight: 600;
     margin: 0;
 }

 .chat-time {
     font-size: 11px;
     color: #9ca3af;
     position: absolute;
     right: 10px;
 }

 .chat-preview {
     font-size: 13px;
     color: #6b7280;
     margin: 2px 0;
 }


 .chat-status {
     font-size: 11px;
     color: #16A34A;
     font-weight: 500;
 }


 .chat-badge {
     background: #BD4C96;
     color: #ffffff;
     width: 17px;
     height: 17px;
     font-size: 9px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
 }





 /* =========================
   META INFO STRIP
========================= */
 .chat-meta-strip {
     background: #f5f5f6;
     padding: 10px 22px;
     border-bottom: 1px solid #e5e7eb;
     display: flex;
     gap: 28px;
     align-items: center;
     font-size: 13px;
     color: #6b7280;
 }

 .chat-meta-strip span {
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .chat-meta-strip i {
     color: #5b2aa6;
     font-size: 14px;
 }


 .rating-stars {
     display: flex;
     gap: 6px;
     cursor: pointer;
 }

 .rating-stars i {
     font-size: 18px;
     color: #D1D5DB;

     transition: color 0.2s ease;
 }


 .rating-stars i.active {
     color: #FBBF24;
 }


 .header-inner {
     margin: 0px auto;
     max-width: 1320px;
 }

 .fa-map-marker-alt {
     color: #5C2396;
 }


 .campilist-tags {
     width: 100%;
     margin: 14px 0;
 }

 .campilist-tags .swiper-slide {
     width: auto !important;

 }

 .campilist-tags span {
     display: inline-block;
     font-size: 10px;
     background: #F1F0FB;
     color: #5C2396;
     padding: 4px 8px;
     border-radius: 20px;
     font-weight: 600;
     border: 1px solid #E5E7EB;
     white-space: nowrap;
 }

 .campilist-tags .swiper-slide {
     padding-right: 0px;
 }

 .filter-btn-wrap {
     display: flex;
     gap: 14px;
     align-items: center;
     flex-wrap: wrap;
     margin-bottom: 30px;
     margin-top: 10px;
 }


 .filter-btn-dt {
     height: 35px;
     font-size: 13px;
     padding: 0 18px;
     border-radius: 8px;
     border: 1px solid #E5E7EB;
     background: #fff;
     color: #9CA3AF;
     font-weight: 500;
     display: inline-flex;
     align-items: center;
     gap: 10px;
     cursor: pointer;
     transition: 0.25s ease;
 }


 .filter-btn-dt.clear-btn {
     color: #9CA3AF;
     background: #fff;
 }


 .filter-btn-dt.active {
     background: #C1409A;
     color: #fff;
     border-color: #C1409A;
 }


 .filter-btn-dt .close {
     font-size: 18px;
     line-height: 1;
     cursor: pointer;
     opacity: 0.9;
 }


 .filter-btn-dt:hover {
     transform: translateY(-1px);
 }



 /* VISIBILITY CONTROL */
 .desktop-view {
     display: block;
 }

 .mobile-view {
     display: none;
 }

 @media (max-width: 991px) {
     .desktop-view {
         display: none;
     }

     .mobile-view {
         display: block;
     }
 }

 /* CARD DESIGN */
 .bk-card {
     background: #fff;
     border-radius: 10px;
     overflow: hidden;
     margin-bottom: 16px;
     box-shadow: 0 6px 18px rgba(0, 0, 0, .06);
     border: 1px solid #E5E7EB;
 }

 .bk-card-header {
     padding: 14px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     background: #F8F7FD;
     border-bottom: 1px solid #E5E7EB;
 }

 .bk-id {
     font-weight: 600;
     color: #333;
 }

 .bk-view-btn {
     background: #5C2396;
     color: #fff;
     padding: 6px 14px;
     font-size: 12px;
     border-radius: 20px;
     text-decoration: none;
 }

 .bk-card-body {
     padding: 14px;

     position: relative;
 }

 .bk-name {
     font-size: 15px;
     font-weight: 600;
     margin-bottom: 2px;
 }

 .bk-price {
     font-weight: 700;
     color: #111;
 }

 .bk-meta {
     display: flex;
     gap: 12px;
     font-size: 12px;
     color: #777;
     margin: 6px 0;
 }

 .bk-tags {
     display: flex;
     gap: 8px;
     flex-wrap: wrap;
     margin-top: 10px;
 }

 .bk-tags .tag {
     background: #f2ecfb;
     color: #6a1b9a;
     padding: 4px 10px;
     border-radius: 20px;
     font-size: 11px;
 }

 /* STATUS */
 .bk-card-footer {
     padding: 14px;
     margin-top: 10px;
 }

 .bk-status {
     padding: 4px 10px;
     border-radius: 20px;
     font-size: 11px;
     display: inline-block;
     position: absolute;
     top: 10px;
     right: 10px;
     font-weight: 600;
 }

 .bk-status.waiting {
     background: #FFEDE2;
     color: #BA6045;
 }

 .bk-status.accept {
     background: #E8E8FF;
     color: #5C2396;
 }

 .bk-status.reject {
     background: #FFEAFF;
     color: #C1409A;
 }

 /* notification */
 /* NOTIFY ICON */
 .notify-wrap {
     position: relative;
 }

 .notify-btn {
     background: none;
     border: 0;
     position: relative;
     cursor: pointer;
     font-size: 18px;
     color: #333;
 }

 .notify-badge {
     position: absolute;
     top: -6px;
     right: -6px;
     background: #c00b80;
     color: #ffffff;
     font-size: 11px;
     padding: 2px 6px;
     border-radius: 50%;
     font-weight: 600;
 }

 /* DROPDOWN */
 .notify-dropdown {
     position: absolute;
     top: 51px;
     right: 0;
     width: 360px;
     background: #fff;
     border-radius: 16px;
     box-shadow: 0 20px 50px rgba(0, 0, 0, .15);
     display: none;
     z-index: 999;
 }

 .notify-wrap.active .notify-dropdown {
     display: block;
 }

 .notify-header {
     padding: 16px;
     font-weight: 600;
     border-bottom: 1px solid #eee;
 }

 .notify-list {
     max-height: 360px;
     overflow-y: auto;
 }

 .notify-item {
     display: flex;
     gap: 12px;
     padding: 14px 16px;
     border-bottom: 1px solid #f2f2f2;
 }

 .notify-item.notify-empty {
     flex-direction: column;
     align-items: center;
     justify-content: center;
     text-align: center;
     border-bottom: none;
     padding: 40px 20px;
     min-height: 200px;
 }

 .notify-item.notify-empty .notify-icon {
     margin-bottom: 15px;
     width: 50px;
     height: 50px;
     font-size: 24px;
 }

 .notify-item.notify-empty .notify-content h6 {
     color: #666;
     font-size: 16px;
 }

 .notify-icon {
     flex-shrink: 0;
     width: 38px;
     height: 38px;
     background: #FFEAFF;
     color: #C1409A;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
 }

 .trv-mt-section {
     padding-bottom: 0px;
 }

 .slick-dotted.slick-slider {
     margin-bottom: 0px;
 }

 .left-sidebar-link .fa-regular {
     font-size: 16px;
 }

 .notify-content h6 {
     margin: 0;
     font-size: 14px;
     font-weight: 600;
 }

 .notify-content p {
     margin: 4px 0 0;
     font-size: 12px;
     color: #191E3E;
 }

 .notify-time {
     font-size: 11px;
     color: #191E3E;
     text-align: right;
     white-space: nowrap;
 }

 .notify-footer {
     padding: 12px;
     padding-bottom: 16px;
     text-align: center;
 }

 .notify-footer a {
     color: #191E3E;
     font-size: 13px;
     text-decoration: none;
     font-weight: 500;
 }

 .fav-camp {
     grid-template-columns: repeat(4, 1fr);
 }

 .note-success {
     background: #EAF7F0;
     color: #1B7F4A;
     border: 1px solid #1B7F4A;
 }

 .note-success i {
     font-size: 16px;
     color: #1B7F4A;
 }

 .note-error {
     background: #FDECEC;
     color: #e7185f;
     border: 1px solid #e7185f;
 }

 .note-error i {
     font-size: 16px;
     color: #e7185f;
 }

 .note-info {
     background: #EFF6FF;
     color: #0369a1;
     border: 1px solid #0369a1;
 }

 .note-info i {
     font-size: 16px;
     color: #0369a1;
 }

 .select2-container {
     max-width: 100%;

 }


 /* dashbord */

 /* Buttons auto adjust */
 .status-btn {

     min-width: 0;
     text-align: center;
     padding: 6px 8px;
     border-radius: 6px;
     font-size: 11px;
     font-weight: 600;
     border: 1px solid transparent;
     white-space: nowrap;
 }


 .status-btn.pending {
     background: #FFFFFF;
     color: #170f496e;
     border-color: #e0dede;
     cursor: default;
 }

 .dash-card-header img {
     width: 17px;
 }

 .status-btn.accepted {
     background: #E8E8FF;
     color: #5C2396;
     border-color: #A4B0FF;
 }

 .status-btn.reject {
     background: #ffe8ff;
     color: #c00b806e;
     border-color: #ffa7e44d;
     cursor: default;
 }

 .status-btn.rejected {
     background: #FFEAFF;
     color: #C1409A;
     border-color: #FFA7E4;
     width: 100%;

 }

 .dash-view-link {
     font-size: 15px;
 }

 .status-btn.m-pending {
     background: #FFFFFF;
     color: #170F49;
     border-color: #A6A6A6;
     cursor: default;
     width: 100%;
 }

 .status-btn.m-accepted {
     background: #5C2396;
     color: #FFFFFF;
     border-color: #5C2396;
     width: 50%;
 }

 .status-btn.accept {
     background: #d4c4e3;
     color: #FFFFFF;
     border-color: #d4c4e3;
     width: 50%;
 }


 .status-btn.m-reject {
     background: #C1409A;
     color: #FFFFFF;
     border-color: #C1409A;
     width: 50%;
 }

 @media (max-width: 480px) {
     .status-btn {
         font-size: 11px;
         padding: 8px 6px;
     }
 }




 .section-title-1 {
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 12px;
 }

 .cm-prf-services-1 {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 14px;
 }

 .service-box-1 {
     background: #f6f6fb;
     border-radius: 10px;
     padding: 14px 16px;
 }

 .service-box-1 p {
     margin: 0 0 6px;
     font-size: 14px;
     color: #333;
     font-weight: 500;
 }

 .service-box-1 .price-1 {
     font-size: 16px;
     font-weight: 600;
     color: #6f2dbd;
     /* purple tone */
 }

 .service-box-1 .price-1 small {
     font-size: 12px;
     font-weight: 400;
     color: #666;
 }

 @media (max-width: 576px) {
     .cm-prf-services-1 {
         grid-template-columns: 1fr;
     }
 }

 .bk-user {
     display: flex;
     align-items: center;
     gap: 12px;
     margin-bottom: 8px;
 }

 .bk-avatar {
     width: 48px;
     height: 48px;
     border-radius: 50%;
     overflow: hidden;
     flex-shrink: 0;
 }

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

 .bk-user-info .bk-name {
     margin: 0;
     font-weight: 600;
     font-size: 14px;
 }

 .bk-user-info .bk-price {
     margin: 0;
     font-size: 13px;
     color: #000;
     margin-top: 4px;
 }

 .td-prfl .profile-img {
     width: 40px;
     height: 40px;
     border-radius: 50%;
     object-fit: cover;
     margin-right: 10px;
     border: 1px solid #e2e3e5;
 }


 /* booking confirmation popup */
 /* Modal animation */
 /* Modal base */
 .confirm-pp-content {
     border-radius: 16px;
     overflow: hidden;
     border: none;
     padding: 25px 0px;
 }

 /* Top icon */
 .confirm-pp-icon-wrap {
     display: flex;
     justify-content: center;

 }

 .confirm-pp-icon {
     padding: 10px;
     width: 75px;
     height: 75px;
     background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);


     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 24px;
     animation: confirm-pp-pulse 1.8s infinite;
 }

 /* Pulse animation */
 @keyframes confirm-pp-pulse {
     0% {
         box-shadow: 0 0 0 0 rgba(123, 44, 191, .5);
     }

     70% {
         box-shadow: 0 0 0 14px rgba(123, 44, 191, 0);
     }

     100% {
         box-shadow: 0 0 0 0 rgba(123, 44, 191, 0);
     }
 }

 /* Body */
 .confirm-pp-body {
     padding: 15px 20px 10px;
 }

 .confirm-pp-title {
     font-weight: 600;
     margin-bottom: 6px;
 }

 .confirm-pp-sub {
     font-size: 13px;
     color: #6c757d;
 }

 /* Mini box */
 .confirm-pp-mini-box {
     background: #f8f9fd;
     border-radius: 10px;
     padding: 12px;
     display: flex;
     justify-content: space-between;
     margin: 15px 0;
 }

 .confirm-pp-mini-box span {
     font-size: 11px;
     color: #999;
 }

 .confirm-pp-mini-box strong {
     font-size: 14px;
 }

 /* Note */
 .confirm-pp-note {
     font-size: 12px;
     color: #ff8800;
 }

 /* Footer */
 .confirm-pp-footer {
     display: flex;
     justify-content: space-between;
     gap: 24px;
     /* padding: 12px 16px 16px; */
 }

 .confirm-pp-footer .btn {
     padding: 8px 14px;
     width: 100%;
 }

 .confirm-pp-confirm {
     background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);
     border: 1px solid #ce44996e !important;
 }

 .btn-light {
     border: 1px solid #f1efef !important;
 }

 /* Fade + scale */
 .confirm-pp-modal .modal-dialog {
     transform: scale(0.85);
     transition: 0.25s ease;
 }

 .confirm-pp-modal.show .modal-dialog {
     transform: scale(1);
 }

 /* Companion */
 .confirm-pp-companion {
     display: flex;
     align-items: center;
     gap: 10px;
     background: #f8f9fc;
     padding: 10px;
     border-radius: 10px;
     margin: 12px 0;
 }

 .confirm-pp-companion img {
     width: 42px;
     height: 42px;
     border-radius: 50%;
     object-fit: cover;
 }

 .confirm-pp-companion span {
     display: block;
     font-size: 12px;
     color: #ffb703;
 }

 /* Detail list */
 .confirm-pp-detail-list {
     background: #fff;
     border-radius: 10px;
     overflow: hidden;
     margin-top: 10px;
 }

 .confirm-pp-detail-row {
     display: flex;
     justify-content: space-between;
     padding: 8px 10px;
     font-size: 14px;
     border-bottom: 1px dashed #eee;
 }

 .confirm-pp-detail-row:last-child {
     border-bottom: none;
 }

 .confirm-pp-detail-row span {
     color: #777;
 }

 .confirm-pp-detail-row.highlight {
     background: #f1eaff;
     color: #6b299a;
     font-weight: 600;
 }


 .chat .fa-comments {

     color: #4191d0;
 }

 .sos .fa-triangle-exclamation {

     color: #e8ae51 !important;
 }

 .sos {
     background: #fcd7af85 !important;
 }

 .chat {
     background: #4ca3e829;
 }

 .notify-icon .fa-bell {
     background: #f3e8ff !;
     color: #C1409A;
 }

 /* Booking Details Info Card */
 .bd-info-card {
     background: #f9fafb;
     padding: 20px;
     border-radius: 8px;
     margin-bottom: 20px;
 }

 .bd-info-item {
     margin-bottom: 15px;
 }

 .bd-info-item:last-child {
     margin-bottom: 0;
 }

 .bd-info-item strong {
     display: block;
     font-size: 14px;
     color: #6b7280;
     margin-bottom: 5px;
 }

 .bd-info-item span,
 .bd-info-item p {
     font-size: 15px;
     color: #1f2937;
     margin: 0;
 }

 .bd-icon-warning {
     background: #f59e0b;
 }

 .bd-icon-danger {
     background: #ef4444;
 }

 .bd-icon-secondary {
     background: #6b7280;
 }

 .bd-icon-info {
     background: #0369a1;
 }

 .bd-booking-icons {
     width: 23px;
     height: 23px;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
 }

 .bd-booking-icons img {
     width: 18px;
     height: 18px;
 }

 /* Review Placeholder */
 .bd-review-placeholder {
     padding: 40px 20px;
     text-align: center;
     background: #f9fafb;
 }

 .bd-review-placeholder p {
     margin: 0;
     font-size: 15px;
 }

 /* Empty Reviews State */
 .bd-empty-reviews {
     background: #ffffff;
     border: 2px dashed #e5e7eb;
     border-radius: 12px;
     padding: 50px 30px;
     text-align: center;
     margin-bottom: 24px;
 }

 .bd-empty-icon {
     width: 70px;
     height: 70px;
     background: #f3f4f6;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin: 0 auto 20px;
 }

 .bd-empty-icon i {
     font-size: 32px;
     color: #9ca3af;
 }

 .bd-empty-title {
     font-size: 18px;
     font-weight: 600;
     color: #374151;
     margin-bottom: 8px;
 }

 .bd-empty-text {
     font-size: 14px;
     color: #6b7280;
     margin: 0;
     line-height: 1.5;
 }

 .bd-reviews-list {
     overflow-y: auto;
     height: 49vh;
 }

 .main-header {
     /* min-height: 150px; */
 }

 .instruction-item span {
     flex-shrink: 0;
 }

 @-moz-document url-prefix() {
     .cm-track {
         position: absolute;
         top: 53% !important;
     }
 }
 .load-more-data{
    padding-top:40px;
        text-align: center;
 }
 .user{
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
 

 .load-more-btn {
   
    padding: 8px 14px;
     background: transperent;
     border: none;
     border-radius: 5px;
     color: #111827;
     cursor: pointer;
     border:1px solid #111827;
     font-size: 14px;
     text-decoration: none;
     display: inline-block;
 }
 .load-more-btn:hover{
        background: #5C2396;
    color: #fff;
    border:1px solid  #5C2396;
 }

 .cm-prf-center{
  word-wrap: break-word;
    display: -webkit-box;
    
    -webkit-box-orient: vertical;
    overflow: hidden;
}
 

 /* booking pages  */
 .no-data {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    text-align: center;
}

.no-data-icon {
    font-size: 64px;
    color: #9CA3AF;
    margin-bottom: 20px;
        width: 180px;
}

.no-data-title {
    font-size: 20px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 10px;
}

.no-data-text {
    font-size: 14px;
    color: #6B7280;
}




/* booking by me  */
/* Cancel Booking Modal Styles */
.cancel-booking-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    transition: background-color 0.3s ease;
}

.cancel-booking-modal.show {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.5);
}

.cancel-booking-content {
    background-color: #ffffff;
    padding: 30px;
   
    width: 90%;
    max-width: 500px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    transform: scale(0.7) translateY(-50px);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.cancel-booking-modal.show .cancel-booking-content {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.cancel-booking-header {
    font-size: 20px;
    font-weight: 600;
    color: #6f2da8;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

.cancel-booking-header i {
    color: #dc3545;
    font-size: 24px;
}

.cancel-booking-header .btn-close {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0;
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.3s;
}

.cancel-booking-header .btn-close:hover {
    opacity: 1;
}

.cancel-booking-header .btn-close::before,
.cancel-booking-header .btn-close::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 2px;
    background-color: #6b7280;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.cancel-booking-header .btn-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.cancel-booking-header .btn-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.cancel-booking-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group label {
    font-weight: 600;
    color: #374151;
    font-size: 14px;
}

.form-group label .text-danger {
    color: #dc3545;
    margin-left: 2px;
}

.form-group textarea {
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-family: inherit;
    font-size: 14px;
    resize: vertical;
    min-height: 120px;
    transition: all 0.3s;
    color: #111827;
}

.form-group textarea::placeholder {
    color: #9ca3af;
}

.form-group textarea:focus {
    outline: none;
    border-color: #6f2da8;
    box-shadow: 0 0 0 3px rgba(111, 45, 168, 0.1);
}

.form-group textarea.is-invalid {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

.form-error {
    color: #dc3545;
    font-size: 13px;
    display: none;
    margin-top: 4px;
}

.form-error.show {
    display: block;
}

.form-char-count {
    font-size: 12px;
    color: #9ca3af;
    text-align: right;
    margin-top: 4px;
}

.cancel-booking-actions {
    display: flex;
    gap: 12px;
    margin-top: 25px;
}

.cancel-booking-actions button {
    flex: 1;
    padding: 12px 16px;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s;
}

.btn-cancel-submit {
    background: linear-gradient(135deg, #bc4a96 0%, #a83d7f 100%);
    color: white;
}

.btn-cancel-submit:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(188, 74, 150, 0.3);
}

.btn-cancel-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-cancel-close {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #e5e7eb;
}

.btn-cancel-close:hover {
    background: #e5e7eb;
    border-color: #d1d5db;
}

/* Responsive Design */
@media (max-width: 640px) {
    .cancel-booking-content {
        width: 95%;
        padding: 24px;
    }
    
    .cancel-booking-header {
        font-size: 18px;
        margin-bottom: 16px;
    }
    
    .cancel-booking-actions {
        flex-direction: column;
        gap: 10px;
    }
    
    .cancel-booking-actions button {
        width: 100%;
    }
}

.my-booking-card {
    min-height: auto !important;
}

.my-booking-actions {
    position: unset;
    padding: 0px;
}

.note-validation {
    margin-bottom: 0px;
}

/* Empty State Styles */
.empty-state-container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 500px;
    padding: 40px 20px;
    width: 100%;
    grid-column: 1 / -1;
}

.empty-state-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 50px 40px;
    max-width: 600px;
    width: 100%;
    text-align: center;
    border: 1px solid #E5E7EB;

    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.empty-state-icon {
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
    animation: float 3s ease-in-out infinite;
}

.empty-state-icon img {
    display: block;
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

.empty-state-title {
    font-size: 28px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 15px;
}

.empty-state-description {
    font-size: 16px;
    color: #6B7280;
    line-height: 1.6;
    margin-bottom: 30px;
}

.empty-state-actions {
    display: flex;
    gap: 15px;
    justify-content: center;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.empty-state-btn {
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
}

.empty-state-btn.primary {
    background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);
    color: #ffffff;
   
}

.empty-state-btn.primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(111, 45, 168, 0.4);
    color: #ffffff;
}

.empty-state-btn.secondary {
    background: #F3F4F6;
    color: #374151;
    border: 1px solid #E5E7EB;
}

.empty-state-btn.secondary:hover {
    background: #E5E7EB;
    border-color: #D1D5DB;
    transform: translateY(-2px);
    color: #374151;
}

.empty-state-tips {
    background: #F9FAFB;
    border-radius: 12px;
    padding: 25px;
    text-align: left;
    border: 1px solid #E5E7EB;
}

.tips-title {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.tips-title i {
    color: #F59E0B;
    font-size: 18px;
}

.tips-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.tips-list li {
    padding: 8px 0;
    color: #6B7280;
    font-size: 14px;
    position: relative;
    padding-left: 25px;
}

.tips-list li:before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #10B981;
    font-weight: bold;
    font-size: 16px;
}

@media (max-width: 768px) {
    .empty-state-card {
        padding: 40px 25px;
    }
    
    .empty-state-title {
        font-size: 24px;
    }
    
    .empty-state-description {
        font-size: 14px;
    }
    
    .empty-state-actions {
        flex-direction: column;
    }
    
    .empty-state-btn {
        width: 100%;
        justify-content: center;
    }
    
    .empty-state-icon svg {
        width: 100px;
        height: 100px;
    }
}
.dash-rating {
    position: absolute;
    top: 18px;
    right: 25px;
}


/* Completed Button Style */
.btn-completed {
  background-color: #eaf7f0 !important;
    border: 1px solid #1b7f4a !important;
    color: #2e814a !important;
    padding: 10px 16px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
    transition: all 0.3s ease !important;
}

.btn-completed:hover {
  background-color: #eaf7f0 !important;
    opacity: 1 !important;
   
}

/* My Booking Button Styles - Matching Dashboard */
.my-booking-btn {
    padding: 10px 22px;
    font-size: 14px;
   
    border: none;
    cursor: pointer;
    font-weight: 500;
    width: 100%;
    text-align: center;
    transition: all 0.3s ease;
}

.my-booking-btn:disabled {
    cursor: not-allowed;
    opacity: 0.8;
}

.my-booking-btn.my-booking-view {
    background: #fff;
    color: #170F49;
    border: 1px solid #e5e7eb;
    font-weight: 600;
}

.my-booking-btn.my-booking-view:hover:not(:disabled) {
    background: #f3f4f6;
}

.my-booking-btn.my-booking-accept {
    background: #662699;
    color: #fff;
}

.my-booking-btn.my-booking-accept:hover:not(:disabled) {
    background: #5a1f8a;
    transform: translateY(-2px);
}

.my-booking-btn.my-booking-reject {
    background: #bc4a96;
    color: #fff;
}

.my-booking-btn.my-booking-reject:hover:not(:disabled) {
    background: #a83d7f;
    transform: translateY(-2px);
}

.my-booking-btn.btn-accepted {
    background: #E8E8FF;
    color: #5C2396;
}

.my-booking-btn.btn-rejected {
    background: #FFEAFF;
    color: #C1409A;
}



/* booked by me  */

/* .cancel-booking-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0);
    transition: background-color 0.3s ease;
}

.cancel-booking-modal.show {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.5);
}

.cancel-booking-content {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 12px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    transform: scale(0.7) translateY(-50px);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.cancel-booking-modal.show .cancel-booking-content {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.cancel-booking-header {
    font-size: 20px;
    font-weight: 600;
    color: #6f2da8;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

.cancel-booking-header i {
    color: #dc3545;
    font-size: 24px;
}

.cancel-booking-header .btn-close {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0;
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.3s;
}

.cancel-booking-header .btn-close:hover {
    opacity: 1;
}

.cancel-booking-header .btn-close::before,
.cancel-booking-header .btn-close::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 2px;
    background-color: #6b7280;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.cancel-booking-header .btn-close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.cancel-booking-header .btn-close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.cancel-booking-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group label {
    font-weight: 600;
    color: #374151;
    font-size: 14px;
}

.form-group label .text-danger {
    color: #dc3545;
    margin-left: 2px;
}

.form-group textarea {
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-family: inherit;
    font-size: 14px;
    resize: vertical;
    min-height: 120px;
    transition: all 0.3s;
    color: #111827;
}

.form-group textarea::placeholder {
    color: #9ca3af;
}

.form-group textarea:focus {
    outline: none;
    border-color: #6f2da8;
    box-shadow: 0 0 0 3px rgba(111, 45, 168, 0.1);
}

.form-group textarea.is-invalid {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

.form-error {
    color: #dc3545;
    font-size: 13px;
    display: none;
    margin-top: 4px;
}

.form-error.show {
    display: block;
}

.form-char-count {
    font-size: 12px;
    color: #9ca3af;
    text-align: right;
    margin-top: 4px;
}

.cancel-booking-actions {
    display: flex;
    gap: 12px;
    margin-top: 25px;
}

.cancel-booking-actions button {
    flex: 1;
    padding: 12px 16px;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s;
}

.btn-cancel-submit {
    background: linear-gradient(135deg, #bc4a96 0%, #a83d7f 100%);
    color: white;
}

.btn-cancel-submit:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(188, 74, 150, 0.3);
}

.btn-cancel-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-cancel-close {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #e5e7eb;
}

.btn-cancel-close:hover {
    background: #e5e7eb;
    border-color: #d1d5db;
}


@media (max-width: 640px) {
    .cancel-booking-content {
        width: 95%;
        padding: 24px;
    }
    
    .cancel-booking-header {
        font-size: 18px;
        margin-bottom: 16px;
    }
    
    .cancel-booking-actions {
        flex-direction: column;
        gap: 10px;
    }
    
    .cancel-booking-actions button {
        width: 100%;
    }
}


.empty-state-container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 500px;
    padding: 40px 20px;
    width: 100%;
    grid-column: 1 / -1;
}

.empty-state-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 50px 40px;
    max-width: 600px;
    width: 100%;
    border: 1px solid #E5E7EB;
    text-align: center;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.empty-state-icon {
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
    animation: float 3s ease-in-out infinite;
}

.empty-state-icon img {
    display: block;
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

.empty-state-title {
    font-size: 28px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 15px;
}

.empty-state-description {
    font-size: 16px;
    color: #6B7280;
    line-height: 1.6;
    margin-bottom: 30px;
}

.empty-state-actions {
    display: flex;
    gap: 15px;
    justify-content: center;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.empty-state-btn {
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
}

.empty-state-btn.primary {
       background: linear-gradient(90.48deg, #7926A0 1.16%, #D34699 99.59%);
    color: #ffffff;
  
}

.empty-state-btn.primary:hover {
    transform: translateY(-2px);
   
    color: #ffffff;
}

.empty-state-btn.secondary {
    background: #F3F4F6;
    color: #374151;
    border: 1px solid #E5E7EB;
}

.empty-state-btn.secondary:hover {
    background: #E5E7EB;
    border-color: #D1D5DB;
    transform: translateY(-2px);
    color: #374151;
}

.empty-state-tips {
    background: #F9FAFB;
    border-radius: 12px;
    padding: 25px;
    text-align: left;
    border: 1px solid #E5E7EB;
}

.tips-title {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.tips-title i {
    color: #F59E0B;
    font-size: 18px;
}

.tips-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.tips-list li {
    padding: 8px 0;
    color: #6B7280;
    font-size: 14px;
    position: relative;
    padding-left: 25px;
}

.tips-list li:before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #10B981;
    font-weight: bold;
    font-size: 16px;
}

@media (max-width: 768px) {
    .empty-state-card {
        padding: 40px 25px;
    }
    
    .empty-state-title {
        font-size: 24px;
    }
    
    .empty-state-description {
        font-size: 14px;
    }
    
    .empty-state-actions {
        flex-direction: column;
    }
    
    .empty-state-btn {
        width: 100%;
        justify-content: center;
    }
    
    .empty-state-icon svg {
        width: 100px;
        height: 100px;
    }
}
.dash-rating {
    position: absolute;
    top: 18px;
    right: 25px;
}

.btn-completed {
    background-color: #eaf7f0 !important;
    border: 1px solid #1b7f4a !important;
    color: #2e814a !important;
    padding: 10px 16px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
    transition: all 0.3s ease !important;
}

.btn-completed:hover {
    background-color: #059669 !important;
    color:white !important;
    opacity: 1 !important;
}


.my-booking-btn {
    padding: 10px 22px;
    font-size: 14px;
  
    border: none;
    cursor: pointer;
    font-weight: 500;
    width: 100%;
    text-align: center;
    transition: all 0.3s ease;
}

.my-booking-btn:disabled {
    cursor: not-allowed;
    opacity: 0.8;
}

.my-booking-btn.my-booking-view {
    background: #fff;
    color: #170F49;
    border: 1px solid #e5e7eb;
    font-weight: 600;
}

.my-booking-btn.my-booking-view:hover:not(:disabled) {
    background: #f3f4f6;
}

.my-booking-btn.my-booking-accept {
    background: #662699;
    color: #fff;
}

.my-booking-btn.my-booking-accept:hover:not(:disabled) {
    background: #5a1f8a;
    transform: translateY(-2px);
}

.my-booking-btn.my-booking-reject {
    background: #bc4a96;
    color: #fff;
}

.my-booking-btn.my-booking-reject:hover:not(:disabled) {
    background: #a83d7f;
    transform: translateY(-2px);
}

.my-booking-btn.btn-accepted {
    background: #E8E8FF;
    color: #5C2396;
}

.my-booking-btn.btn-rejected {
    background: #FFEAFF;
    color: #C1409A;
}
  */

  /* bookings-list */

  
/* Status Button Colors */
.booking-status {
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    display: inline-block;
    text-align: center;
    min-width: 100px;
}

/* Pending - Yellow/Orange */
.booking-status.waiting {
    background-color: #FEF3C7;
    color: #92400E;
}

/* Confirmed - Green */
.booking-status.accept {
    background-color: #D1FAE5;
    color: #065F46;
}

/* Rejected - Red */
.booking-status.reject {
    background-color: #FEE2E2;
    color: #991B1B;
}

/* Cancelled - Gray */
.booking-status.cancelled {
    background-color: #F3F4F6;
    color: #374151;
}

/* Completed - Blue/Green */
.booking-status.completed {
    background-color: #DBEAFE;
    color: #1E40AF;
}

/* Mobile view status */
.bk-status {
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    display: inline-block;
    text-align: center;
    min-width: 100px;
}

.bk-status.waiting {
    background-color: #FEF3C7;
    color: #92400E;
}
.cancel-booking-btn{
   padding: 5px 16px !important;
    background-color: #fee2e2ad !important;
    color: #991B1B;
    border: none;
    border-radius: 24px !important;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s; 
}

.bk-status.accept {
    background-color: #D1FAE5;
    color: #065F46;
}

.bk-status.reject {
    background-color: #FEE2E2;
    color: #991B1B;
}

.bk-status.cancelled {
    background-color: #F3F4F6;
    color: #374151;
}

.bk-status.completed {
    background-color: #DBEAFE;
    color: #1E40AF;
}

.bk-status.in-process {
    background-color: #E8E8FF;
    color: #5C2396;
}


.bd-empty-icon .fa-star{
 color: #FFC107 !important;   
}

.app-buttons a{
    text-decoration:none;
}

.chat-disabled-message {
border: 1px solid #e5e7eb;

}

.swal2-title{
     font-size: 18px !important;   
}
.swal2-html-container{
      font-size: 16px !important;  
}
.swal2-styled{
 font-size: 13px !important;   
}
.swal2-confirm{
        --swal2-confirm-button-background-color: #5C2396 !important;
}

.swal2-cancel{
  --swal2-cancel-button-background-color: #bd4b96 !important;  
}

.bd-btn-sos button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    background: #9B7BB5 ;
}

.bd-btn-sos button:disabled:hover {
    opacity: 0.6;
    background: #9B7BB5 ;
}

.btn-disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}


.select2-container .select2-selection--multiple .select2-search__field {
    margin-top:0px !important;
}
.select2-container--default .select2-selection--multiple {

    padding: 10px 15px;
    border: 1px solid #ccc !important;
    border-radius: 8px !important;
    font-size: 14px;
    outline: none;
}


.select2-container{
    width:100% !important;
}

.select2-container--default .select2-selection--multiple {
 align-items: center;
    flex-wrap: wrap;
    padding: 4px;
    border-width: 2px;
       border-radius: 6px !important;
           border: 1px solid #cccccc !important;
           overflow: hidden;
   
   
}

/* Selected tags */
.select2-container--default .select2-selection__choice {
    background-color: #f1f1f1;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 2px 8px;
    margin: 3px;
    font-size: 13px;
}
.select2-selection__rendered{
    margin-bottom: 0px !important;
}
.select2-search__field{
    height:20px !important;
}
.select2-container .select2-selection--multiple .select2-selection__rendered {
    text-overflow: inherit !important;
    white-space: inherit !important;
}
/* Remove ugly focus border */
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 1px solid #ccc !important;
    box-shadow: none !important;
}
.select2-container .select2-search--inline {
    float: unset !important;
    
}
/* .select2-search--inline{
        height: 16px !important;
} */
 .select2-container--default .select2-selection--multiple .select2-selection__choice {
    display: inline-flex;
    align-items: center;   
    white-space: normal;   
    word-break: break-word;
    max-width: 100%;
        padding-left: 5px;
}
.select2-container textarea{
 min-height:20px !important; 
 height:20px !important;
}
.select2-selection--multiple{
    display:flex !important;
}
/* Fix input field inside */
.select2-container--default .select2-search--inline .select2-search__field {
   
    margin-top: 3px;
    border: none !important;
    outline: none !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__display {
    cursor: default;
    /* padding-left: 19px; */
    padding-right: 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    background-color: transparent;
    border: none;
    border-right: 1px solid #cccccc;

}

.select2-container .select2-selection--multiple .select2-selection__rendered {
    display: block;
    overflow: inherit;
}

.select2-container .select2-selection--multiple {
    min-height: 44px !important;
}
 .select2-dropdown {
     z-index: 99999 !important;
 }
  .select2-dropdown {
    background-color: white;
    border: 1px solid #cccccc;
 }