/* --- General Styles (No Change) --- */
* {
  font-family: 'Rubik', sans-serif;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a, a:visited, a:active {
  text-decoration: none;
  
}


/* --- Navigation Bar (No Change) --- */
.nav {
  justify-content: center;
  min-height: 100px;
  padding: 10px 20px;
  background-color: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
}
.search_icon{
  position: relative;
  right: 45px;
  top:7px;
}
.nav_logo {
  justify-content: center !important;
  margin-bottom: 20px;
}
.nav_logo img{
  height:150px;
}
.nav_links {
  justify-content: space-between;
  width: 100%;
}

.nav_links div a {
  padding: 10px 15px;
  color:black;
}

.links a {
  display: inline-block;
}

/* RENAMED: from .nav_btn to .nav_toggle */
.nav_toggle {
  display: none;
  font-size: 1.5rem;
  cursor: pointer;
  background: none; /* Make background transparent */
  border: none; /* Remove default border */
  color: black; /* Ensure icon has color */
}
.nav_links input{
  
  font-size:18px;
  border-radius:5px;
  border:grey 1px solid;
  padding:3px;
}
/* --- Responsive Styles for Mobile --- */
@media only screen and (max-width: 1050px) {
  /* MODIFIED: Keep this as a row to align search and toggle button */
  .nav_links {
    flex-direction: row;
    justify-content: space-between;
    
  }

  .links {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* Align items to the right */
  }

  /* Hide the links by default */
  .links a {
    display: none;
    width: 100%;
    padding: 12px 0;
    text-align: right; /* Align link text to the right */
  }
  
  /* Show the toggle button */
  .nav_toggle {
    display: block;
  }

  /* When the .links container has the .active class, show the links */
  .links.active a {
    display: block;
  }
}