body {
      background-color: #f8f9fa;
    }
    .navbar-custom {
      background: linear-gradient(to right, #ff7e7e, #ffbaba);
    }
    
    .category-icon {
      text-align: center;
      margin-top: 20px;
    }
    .category-icon img {
      width: 60px;
      height: 60px;
    }
    
    
    .offcanvas-start {
      width: 250px;
    }

    .profile-header {
      background-color: #ff7e7e;
      padding: 20px;
      color: white;
      text-align: center;
    }

    .profile-header img {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      background: white;
      padding: 5px;
      margin-bottom: 10px;
    }

    .menu-item {
      padding: 12px 20px;
      display: flex;
      align-items: center;
      cursor: pointer;
    }

    .menu-item i {
      margin-right: 15px;
    }

    .menu-item:hover {
      background-color: #f1f1f1;
    }

    .logout {
      border-top: 1px solid #ccc;
      padding: 12px 20px;
      margin-top: auto;
    }
    
  
  
  
  
.footer-nav {
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #ff7e7e;
  color:white;
  display: flex;
  justify-content: space-between;
  padding: 3px 0;
  font-size: 14px;
  text-align: center;
}


.footer-nav div {
  flex: 1;
  transition: 0.3s;
}


.footer-nav div.active {
  
  font-weight: 600;
}