.day {
      transition: all 0.2s ease;
      cursor: pointer;
    }
    .day:hover {
      background-color: #f2fdf5;
    }
    .friday {
      background-color: #e5e7eb !important;
      color: #9ca3af !important;
      cursor: not-allowed;
    }
    
    
    .booked {
      background-color: #f44336 !important;
      color: #fff !important;
      cursor: not-allowed;
    }
    .tooltip-slot {
      position: relative;
      cursor: pointer;
    }
    .tooltip-slot:hover::after {
      content: attr(data-bs-title);
      position: absolute;
      bottom: 125%;
      right: 50%;
      transform: translateX(50%);
      /*background: rgba(0, 0, 0, 0.75);*/
      color: #fff;
      font-size: 12px;
      padding: 5px 8px;
      border-radius: 6px;
      white-space: nowrap;
      z-index: 10;
    }
    .selected-slot {
      background-color: #4caf50;
      color: #fff;
      border-radius: 4px;
      padding: 0 3px;
    }
    .finished-slot
    {
        background-color: #a94442;
        color: #fff;
        border-radius: 4px;
        padding: 0 3px;
        text-decoration:line-through;
    }
    .day-selected {
        background-color: #d8f5de !important;
        border: 1px solid #4caf50 !important;
    }
    .day-busy {
        background-color: #ffc107 !important;
        border: 1px solid #ffc107 !important;
        pointer-events: none;
    }
    .day-finished
    {
        background-color: #a9444254 !important;
        border: 1px solid #a94442 !important;
    }
    .calendar-grid {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      gap: 6px;
    }
    
    .disabled-day {
        background-color: #f5f5f5;
        color: #999;
        pointer-events: none;
    }
    
    
    @media (max-width: 768px) {
      /* Styles for tablets and mobile phones */
       .calendar-grid  {
         gap: 0px!important;
      }
    }