html,
body {
  height: 100%;
  margin: 0;
}

.sidebar {
  width: 280px;
  transition: width 0.3s;
}

.sidebar .nav-link {
  padding: 10px 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 44px;
  align-items: center;
  align-content: center;
}

.sidebar .nav-link:hover {
  background-color: #66b3ff;
}

.sidebar .nav-link span {
  transition: opacity 0.3s;
}

.sidebar.collapsed {
  width: 70px;
}

.sidebar.collapsed .nav-link span {
  opacity: 0;
  display: none;
}

.sidebar.collapsed .page-title {
  opacity: 0;
}

@media (max-width: 768px) {
  .sidebar-desktop {
    display: none;
  }
  .mobile-toggle {
    display: block;
  }
}

@media (min-width: 768px) {
  .mobile-toggle {
    display: none;
  }
}

.main-content {
  margin-left: 0;
  transition: margin-left 0.3s;
}

@media (min-width: 768px) {
  .main-content {
    margin-left: 280px;
  }
  .main-content.collapsed {
    margin-left: 70px;
  }
}

.no-transition {
  transition: none !important;
}

.icon-btn {
  min-height: 38px;
}

.projects {
  list-style-type: none;
  padding-left: 0;
}

.projects ul {
  list-style-type: none;
}

.projects li {
  width: 100%;
  border: none;
}

.project-div {
  height: 40px !important;
  width: 100% !important;
  align-items: center;
  align-content: center;
}

.project-div .change-favourite:not(.text-warning) {
  display: none;
}

.project-div:hover {
  background-color: #f3f3f3;
}

.project-div:hover .list-buttons {
  display: block !important;
}

.project-div:hover .change-favourite {
  display: inline-block;
}

.tags {
  list-style-type: none;
  padding-left: 0;
}

.tags ul {
  list-style-type: none;
}

.tags li {
  width: 100%;
  border: none;
}

.tag-div {
  height: 40px !important;
  width: 100% !important;
  align-items: center;
  align-content: center;
}

.tag-div .change-favourite:not(.text-warning) {
  display: none;
}

.tag-div:hover {
  background-color: #f3f3f3;
}

.tag-div:hover .list-buttons {
  display: block !important;
}

.tag-div:hover .change-favourite {
  display: inline-block;
}

.tag-group-div {
  height: 40px !important;
  width: 100% !important;
  align-items: center;
  align-content: center;
}

.tag-group-div .change-favourite:not(.text-warning) {
  display: none;
}

.tag-group-div:hover {
  background-color: #f3f3f3;
}

.tag-group-div:hover .list-buttons {
  display: block !important;
}

.tag-group-div:hover .change-favourite {
  display: inline-block;
}