/* Custom css */
.navbar {
  background-color: #F7FBF2;
}
.nav-link {
  color: #171D1E;
  padding: 8px 16px !important;
  border-radius: 12px;
}
.nav-link:hover {
  color: var(--brand-primary-dark);
  border-bottom: 1px var(--brand-primary-dark) solid;
}
.nav-link .active {
  color: var(--brand-primary);
  border-bottom: 1px var(--brand-primary) solid;
}
.dropdown-item {
  padding-top: 10px;
  padding-bottom: 10px;
  border-radius: 4px;
}
.dropdown-item:hover {
  background-color: var(--brand-primary);
  color: white;
}
.dropdown-menu {
  background-color: #F7FBF2;
  border: unset;
}
.navbar-toggler {
  background-color: var(--brand-surface-bg);
  border: none;
}
.navbar-toggler:focus, .navbar-toggler:active, .navbar-toggler:hover {
  border: 1px var(--brand-surface) solid;
  /* border: none; */
}
.logo-img {
  height: 8vh;
}
@media (max-width: 798px) {
  .navbar {
      background-color: #fff;
  }
}
/* custom test */
@media (max-width: 990px) {
  .custom-navbar {
    position: fixed;
    top: 0;
    right: -100%;  /* Start off-screen */
    width: 75%;  /* Adjust width as needed */
    height: 100vh;
    background-color: white; /* Ensure visibility */
    box-shadow: -4px 0 10px rgba(0, 0, 0, 0.1);
    transition: right 0.4s ease-in-out;
    z-index: 1050;
    padding: 20px;
    overflow-y: auto;
  }
  
  /* Show navbar when toggled */
  .custom-navbar.show {
    right: 0;
  }
  
  /* Style the toggler button */
  #custom-toggler {
    border: 2px solid #4A90E2;
    padding: 8px;
    border-radius: 5px;
  }
  
  /* Optional: Style for close button inside the navbar */
  .close-btn {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 25px;
    cursor: pointer;
  }
}

footer h5 {
  font-weight: 700;
}

footer .col {
  margin-top: 15px;
}

footer a {
  color: #171D1E;
  text-decoration: none;
}

/* .collapsing {
  height: auto;
  overflow: hidden;
  transform: translateX(100%);
  transition: transform 1700ms ease;
}

.navbar-collapse {
  transform: translateX(0);
} */
/* @include transition($transition-collapse); */

  /* &.collapse-horizontal {
    width: 0;
    height: auto;
    @include transition($transition-collapse-width);
  } */