/* Update  */
  .create-offer-section {
      /* background: white !important; */
      /* background-color: var(--primaryLight) !important; */
  }


  .custom-tabs .nav-link {
      font-weight: 500;
      font-size: 0.875rem;
      /* text-sm */
      border: none;
      border-bottom: 2px solid transparent;
      border-top-left-radius: 0.5rem;
      border-top-right-radius: 0.5rem;
      color: var(--black);
      background-color: transparent;
      padding: 0.5rem 1rem;
      transition: all 0.2s ease;
  }

  .custom-tabs .nav-link:hover {
      color: var(--primary-color);
      background-color: transparent;
      border-color: #d1d5db;
      /* fallback border on hover */
  }

  .custom-tabs .nav-link.active {
      background-color: var(--primaryLight);
      color: var(--primary-color);
      /* color: white; */
      /* background-color: var(--primary-color); */
      border-color: var(--primary-color);
  }

  #myTabContent {
      /* background: var(--primaryLight); */
      /* margin: 20px 0; */
      border-radius: 12px;
      /* padding: 20px; */
  }

  .business-header-image {
      height: 350px;
      border-radius: 12px;
      overflow: hidden;
  }

  .rating-star {
      color: #FFD700 !important;
  }

  .star-button:hover {
      transform: scale(1.1);
  }

  /* .service-badge { */
  /* background-color: var(--primaryLight); */
  /* color: var(--primary-color); */
  /* } */

  .status-badge {
      background-color: var(--primaryLight);
      color: var(--primary-color);
  }

  .offer-card {
      background-color: var(--primaryLight);
      color: var(--primary-color);
  }

  .social-icon {
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
  }

  .gallery-img {
      cursor: pointer;
      transition: transform 0.3s ease;
  }

  .gallery-img:hover {
      transform: scale(1.05);
  }

  .contact-information i,
  .primaryColor {
      color: var(--primary-color) !important;
  }

  .contact-information a {
      color: black;
  }

  :root {
      --secondary-color: #2c3e50;
      --accent-color: #f1c40f;
      --text-dark: #333333;
      --text-light: #777777;
  }

  .rating-star {
      color: var(--accent-color);
  }

  .star-button:hover {
      transform: scale(1.2);
      transition: transform 0.2s ease;
  }

  .service-badge {
      border: 1px solid var(--primary-color);
      font-size: 16px;
      /* background-color: var(--primaryLight); */
      color: var(--primary-color);
      font-weight: 500;
      letter-spacing: 0.5px;
  }

  .service-badge:hover {
      border: 1px solid var(--primaryLight);
      background-color: var(--primary-color);
      cursor: pointer;
      color: white;
  }

  .service-badge:hover i {
      color: white !important;

  }

  .status-badge {
      background-color: var(--primaryLight);
      color: var(--primary-color);
  }

  .offer-card {
      background: linear-gradient(135deg, var(--primaryLight) 0%, #ffffff 100%);
      color: var(--primary-color);
      border-left: 4px solid var(--primary-color);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
  }

  .offer-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  }

  .social-icon {
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all 0.3s ease;
  }

  .social-icon:hover {
      transform: translateY(-3px);
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  }

  .gallery-img {
      cursor: pointer;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      border-radius: 8px !important;
      overflow: hidden;
  }

  .gallery-img:hover {
      transform: scale(1.03);
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
  }

  .hero-image {
      height: 350px;
      position: relative;
      overflow: hidden;
      border-radius: 12px;
      /* box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2); */
  }

  .hero-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.5s ease;
  }

  .hero-image:hover img {
      transform: scale(1.05);
  }

  .logo-container {
      position: relative;
      margin-top: -120px;
      z-index: 2;
  }

  .logo-img {
      width: 150px;
      height: 150px;
      object-fit: cover;
      border: 5px solid white;
      /* box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15); */
      transition: all 0.3s ease;
  }

  .section-card {
      border-radius: 12px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
      background: white;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      border: none;
      overflow: hidden;
  }

  .section-card:hover {
      /*  transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); */
  }

  .contact-icon {
      width: 40px;
      height: 40px;
      background-color: var(--primaryLight);
      color: var(--primary-color);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-right: 15px;
      flex-shrink: 0;
  }

  .floating-label {
      position: absolute;
      top: -10px;
      left: 15px;
      background: white;
      padding: 0 10px;
      font-size: 0.8rem;
      color: var(--primary-color);
      font-weight: 600;
  }

  .nav-pills .nav-link.active {
      background-color: var(--primary-color);
  }

  .nav-pills .nav-link {
      color: var(--secondary-color);
  }

  .text-accent {
      color: var(--accent-color);
  }

  .bg-primaryLight {
      background-color: var(--primaryLight);
  }

  .btn-primary-custom {
      background-color: var(--primary-color);
      border-color: var(--primary-color);
      color: white;
  }

  .btn-primary-custom:hover {
      background-color: #c0392b;
      border-color: #c0392b;
  }

  .section-card i {
      color: var(--primary-color);
  }

  .form-design {
      border-radius: 20px;
      /* padding: 20px; */
      border: 2px solid transparent;
      background-color: var(--primaryLight);
  }

  .form-design:active,
  .form-design:hover,
  .form-design:focus {
      border-color: var(--primary-color);
  }




  /* Upload Header Image  */
  .upload-box {
      border: 2px dashed var(--primary-color);
      border-radius: 10px;
      padding: 40px;
      text-align: center;
      background-color: #f9f9f9;
      cursor: pointer;
      transition: border-color 0.3s ease;
  }

  #previewContainer {
      padding: 20px;
      background-color: #f9f9f9;
  }

  .upload-box.dragover {
      border-color: #0d6efd;
      background-color: #e7f1ff;
  }

  .upload-box input {
      display: none;
  }

  .upload-preview img {
      width: 100%;
      object-fit: cover;
      max-height: 300px;
      border-radius: 10px;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  }

  .remove-btn {
      margin-top: 15px;
  }

  .hidden {
      display: none;
  }



  /* Set Hour  */
  .hours-container {
      margin: 2rem auto;
      padding: 2rem;
      background: white;
      border-radius: 8px;
      box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
  }

  .hours-header {
      margin-bottom: 1.5rem;
      padding-bottom: 1rem;
      border-bottom: 1px solid #eee;
  }

  .hours-table {
      width: 100%;
      margin-bottom: 1.5rem;
  }

  .hours-table th,
  .hours-table td {
      padding: 0.75rem;
      vertical-align: middle;
  }

  .hours-table th {
      text-align: left;
      font-weight: 600;
      color: #495057;
  }

  .hours-table td {
      border-top: 1px solid #eee;
  }

  .time-input-group {
      display: flex;
      align-items: center;
      gap: 0.5rem;
  }

  .time-input {
      width: 100px;
      text-align: center;
  }

  .to-text {
      color: #6c757d;
      font-size: 0.9rem;
  }

  .closed-badge {
      background-color: #f8f9fa;
      color: #6c757d;
      padding: 0.35rem 0.75rem;
      border-radius: 50px;
      font-size: 0.85rem;
      margin-left: 1rem;
  }

  .footer-buttons {
      display: flex;
      justify-content: flex-end;
      gap: 0.75rem;
      margin-top: 1.5rem;
      padding-top: 1.5rem;
      border-top: 1px solid #eee;
  }

  .form-switch .form-check-input {
      cursor: pointer;
  }

  .time-input-group {
      display: none !important;
  }

  .time-input-group.show {
      display: flex !important;
  }

  .day-row {
      height: 70px;
  }

  .form-check-input:checked {
      background-color: var(--primary-color);
      border-color: var(--primary-color);
  }

  .form-check-input:focus {
      border-color: var(--primary-color) !important;

  }

  .form-control:focus {
      border-color: var(--primary-color) !important;
      box-shadow: none;

  }

  .ui-timepicker-standard {
      border-color: var(--primary-color) !important;
  }

  .timepicker.form-control {
      background-color: var(--primary-color);
      color: #ffffff;
      padding: 8px 12px;
      border-radius: 5px;
      font-size: 16px;
  }

  .ui-timepicker-standard .ui-state-hover {
      background-color: var(--primary-color) !important;
      color: white !important;
      border: 1px solid var(--primary-color) !important;
  }


  .ui-timepicker-container.ui-timepicker-standard,
  .ui-timepicker-viewport,
  .ui-menu-item,
  .ui-timepicker.ui-widget.ui-widget-content.ui-menu.ui-corner-all {
      padding: 0 !important;
  }

  .ui-timepicker.ui-widget.ui-widget-content.ui-menu.ui-corner-all,
  .ui-timepicker-viewport,
  .ui-menu-item {
      width: 100% !important;
  }

  .ui-timepicker-container.ui-timepicker-standard {
      margin-top: 5px;
      border-radius: 8px;
      box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  }


  input[type="time"]::-webkit-calendar-picker-indicator {
      filter: invert(1);
      /* Change icon color */
  }


  .form_label {
      margin-bottom: 10px;
  }


  /* Rating System */
  .modal-backdrop-custom {
      background-color: rgba(0, 0, 0, 0.5);
  }

  .star-btn {
      font-size: 1.75rem;
      color: #d1d5db;
      /* gray-300 */
      transition: color 0.2s ease;
      background: none;
      border: none;
  }

  .star-btn.active {
      color: #facc15;
      /* yellow-400 */
  }

  .animate-fade-in {
      animation: fadeIn 0.3s ease-out forwards;
  }

  @keyframes fadeIn {
      from {
          opacity: 0;
          transform: translateY(-10px);
      }

      to {
          opacity: 1;
          transform: translateY(0);
      }
  }

  #ratingModal .modal-header ,
  #viewRatingModel .modal-header {
      background-color: var(--primary-color);
      border-top-left-radius: 30px;
      border-top-right-radius: 30px;
  }

  #viewRatingModel .modal-content ,
  #ratingModal .modal-content {
      border-radius: 30px;
      border: unset;
  }

  .rating-btn {
      border-radius: 30px;
  }

  /* Scrollbar Styles for WebKit Browsers (Chrome, Safari, Edge) */
  .custom-scrollbar::-webkit-scrollbar {
      width: 6px;
  }

  .custom-scrollbar::-webkit-scrollbar-track {
      background: var(--primaryLight);
  }

  .custom-scrollbar::-webkit-scrollbar-thumb {
      background-color: var(--primary-color);
      border-radius: 6px;
  }

  .custom-scrollbar::-webkit-scrollbar-thumb:hover {
      background-color: #0aa31e;
      /* darker green on hover */
  }

  /* Optional: Scrollbar for Firefox */
  .custom-scrollbar {
      scrollbar-width: thin;
      scrollbar-color: var(--primary-color) var(--white);
  }

  .control-prev-icon {
      width: 30px !important;
      height: 30px !important;
      background: var(--primary-color);
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 50%;
      filter: drop-shadow(-1px 0px 2px #00000033);
      right: 0;
      top: 60% !important;
  }

  .control-prev-icon svg {
      width: 50% !important;
      height: 50% !important;
  }

  @media(max-width:400px) {
      .gallery-img {
          height: 200px;
      }

      .hero_section_trending-viral-video {
          height: 260px;
      }

      .hero-image {
          height: 250px;
      }
  }

  /* New Business Profile Page */

  .business-profile-header {
      position: relative;
      height: 390px;
      border-radius: 20px;
      overflow: hidden;
  }

  .new-hero-image {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
  }

  .business-profile-header::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.8);
  }

  .business-details-container {
      position: relative;
      z-index: 30;
      height: 100%;
      color: white;
  }

  .business-logo-container {
      width: 250px;
      height: 275px;
      border-radius: 8px;
      overflow: hidden;
      margin: auto;
  }

  .business-logo-container img {
      width: 100%;
      height: 100%;
      object-fit: cover;
  }

  .business-quick-hero-button {
      width: 100%;
      border-radius: 30px;
      background: var(--primary-color);
      padding: 15px 20px;
      font-size: 18px;
      color: white;
      /*border:2px solid var(--primary-color);*/
      border: none;
  }

  .business-quick-hero-button:hover {
      color: var(--primary-color);
      background: white;
  }

  .business-quick-hero-button:active {
      color: white;
      transform: scale(0.95);
  }

  .buisness-name {
      font-size: 48px;
      font-weight: 600;
      text-transform: capitalize;
  }

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

  .business-address-location-icon {
      font-size: 18px;
  }

  .about-us-detail-description {
      font-size: 22px;
      font-weight: 300;
  }

  .service-icon {
      color: var(--primary-color);
  }

  .service-list {
      font-size: 16px;
      font-weight: 400;
  }

  .business-image-gallery {
      width: 100%;
      height: 250px;
      border-radius: 12px;
      overflow: hidden;
      cursor: pointer;
      transition: all 0.5s ease-in;
  }

  .business-image-gallery:hover {
      transform: scale(0.98)
  }

  .quick-contact-label {
      font-size: 18px;
      font-weight: 400;
  }

  .quick-contact-value {
      font-size: 18px;
      font-weight: 300;
      color: black;

  }


  .review-message{
        background: var(--primaryLight);
        border: none;
        resize: none;
        width: 90%;
        margin: 0 auto;
        padding: 20px;
        border-radius:12px;
        font-weight:300;
    }
    .review-message:focus{
        border:none;
        outline:none;
    }
  .review-card {
      /* background:var(--primaryLight);
                border:2px solid var(--primary-color);
                padding:10px;*/
      border-radius: 12px;
      margin: 10px 5px;
      /* width: 75%; */
          border: 1px solid var(--primary-color);
    border-radius: 12px;
    margin: 10px 5px;
    width: 100%;
    padding: 20px;
  }

  .section-heading {
      border-bottom: none;
  }

  .model-body.view-all-review{
    /* height: 60dvh; */
    height: 80dvh;
    overflow-y:scroll ;
    padding:10px 20px;
  }

  @media (max-width:992px) {
      .business-profile-header {
          padding: 20px;
          height: fit-content;
      }
     
      .business-quick-hero-button {
          width: 50px;
          height: 50px;
          display: flex;
          justify-content: center;
          align-items: center;
      }
  }

  /* Media Query */
  /* 1400px to 1200px */
  @media (min-width: 1400px) {}

  @media (max-width: 1400px) and (min-width: 1201px) {}

  /* 1200px to 992px */
  @media (max-width: 1200px) and (min-width: 993px) {}

  /* 992px to 768px */
  @media (max-width: 992px) and (min-width: 769px) {}

  /* 768px to 577px */
  @media (max-width: 768px) and (min-width: 577px) {
      .business-logo-container {
          width: 100%;
      }

      .buisness-name {
          font-size: 36px;
          font-weight: 400;
          margin-top: 20px;
      }
      .review-card {
        width:100%;
     }
  }

  /* 576px to 481px */
  @media (max-width: 576px) and (min-width: 481px) {
      .business-logo-container {
          width: 100%;
      }

      .buisness-name {
          font-size: 36px;
          font-weight: 400;
          margin-top: 20px;
      }

      .business-address {
          font-size: 16px;
      }
       .about-us-detail-description {
        font-size: 20px;
     }
     .review-card {
        width:100%;
     }
     .section-heading{
        font-size: 28px;
        margin-bottom: 10px;
      }
      .model-body.view-all-review{
        padding: 10px !important;
      }
  }

  /* 480px to 401px */
  @media (max-width: 480px) and (min-width: 401px) {
      .business-logo-container {
          width: 100%;
      }

      .buisness-name {
          font-size: 36px;
          font-weight: 400;
          margin-top: 20px;
      }

      .business-address {
          font-size: 16px;
      }
      .about-us-detail-description {
        font-size: 18px;
     }
     .review-card {
        width:100%;
     }
     .section-heading{
        font-size: 28px;
        margin-bottom: 10px;
      }
       .model-body.view-all-review{
        padding: 10px !important;
      }
  }

  /* 400px and below */
  @media (max-width: 400px) {
      .business-logo-container {
          width: 100%;
      }

      .buisness-name {
          font-size: 36px;
          font-weight: 400;
          margin-top: 20px;
      }

      .business-address {
          font-size: 16px;
      }
      .section-heading{
        font-size: 28px;
        margin-bottom: 10px;
      }
      .about-us-detail-description {
        font-size: 16px;
     }
     .review-card {
        width:100%;
     }
      .model-body.view-all-review{
        padding: 10px !important;
      }
  }

    .hide-button{
    display: none;
  }