.display-collapse {
  width: 90%;
  text-align: center;
}

.social-icons-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}

.social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 90%;
  height: 2em;
  background-color: rgba(255, 255, 255, 0.1);
  color: white;
  border-radius: 8px;
  font-size: 1.3rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.social-icon:hover {
  transform: translateY(-3px);
}

.si-email:hover {
  background-color: #e1306c;
}

.si-phone:hover {
  background-color: #25D366;
}

.si-location:hover {
  background-color: #F6CF65;
}

.si-linkedin:hover {
  background-color: #1da1f2 !important;
}

.si-github:hover {
  background-color: #333;

}

.badge {
  transition: transform 0.2s ease-out;
}

.badge:hover {
  color: #333 !important;
  border-color: #333 !important;
}

.circle i {
  display: inline-block;
  transition: transform 0.2s ease-out;
}

.circle i:hover {
  transform: translateY(-3px);
}

.nav-item {
  transition: transform 0.3s ease-in;
}

.nav-item:hover {
  background-color: #1da1f2;
}

.dark-mode {
  background-color: #121212 !important;
  color: #e5e5e5 !important;
}

.dark-mode .navbar {
  background-color: #1f1f1f !important;
}

.dark-mode .card {
  background-color: #1e1e1e !important;
  color: #e5e5e5 !important;
}

.dark-mode .text-primary {
  color: #90caf9 !important;
}

.dark-mode .bg-primary {
  background-color: #0d47a1 !important;
}

.dark-mode .dropdown-menu {
  background-color: #1f1f1f !important;
  color: #e5e5e5 !important;
}

.dark-mode .dropdown-item {
  color: #e5e5e5 !important;
}

.dark-mode .dropdown-item:hover {
  background-color: #333 !important;
}

.dark-mode .border-primary {
  border-color: #90caf9 !important;
}

.dark-mode .card-body {
  background-color: #222 !important;
  color: #e5e5e5 !important;
}