/*Dialog menu and toggles. */
.preferences {
    margin-right: 1rem;
    color: white;
    cursor: pointer;
  }
  .preferences-menu {
    display: none;
  }
  .w-72 {
    width: 15rem !important;
}
  
  .form {
    margin-top: 10px;
  }
  .preferences-menu {
    cursor: pointer;
    content: '';
    position: absolute;
    top: 40px;
    /* Adjust this value if needed to move the arrow up or down */
    right: 62px;
    /* Adjust this to center the arrow relative to the dialog */
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #ffffff transparent;
    /* This creates the upward pointing arrow with the color of the dialog box */
  }

  .preferences-menu::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid white;
    top: -10px;
    right: 20px;
  }

  .toggle-checkbox:checked {
    right: 0 !important; 
    border-color: rgb(255, 255, 255) !important;
    background-color: #4caf50 !important ;
  }

  .toggle-checkbox:checked+.toggle-label {
    background-color: #4caf50 !important;
  }

  .toggle-checkbox {
    width: 19px !important;
  }

  .toggle-checkbox:checked {
    /* ...previous styles... */
    right: 1px !important;
    /* Adjust for smaller toggle */
    height: 18px !important;
    width: 18px !important;
  }

  .toggle-label {
    background-color: #e2e8f0 !important;
  }

  .toggle-label,
  .toggle-checkbox {
    height: 18px !important;
  }

  .select-none {
    width: 40px !important;
  }


.logo {
    max-width: 100%;
    height: auto;
    width: 420px;
}
.moblogo {
    max-width: 85%;
    height: auto;
    margin: 2rem auto 0 auto;
}
.loginbutton:hover{
    background-color: grey;
}
.googlebutton{
    outline: black;
    border-color: black;
}
@media (max-width: 768px) {
    .logo {
        width: 300px;
        margin-top: 1rem;
    }
}

.user-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%; 
    object-fit: cover; 
}

#clear-search {
    right: -145%; /* Adjust this if you want the button closer or farther from the edge */
   
}.font-bold {
    font-weight: bold !important;
  }
  #search-results div {
    padding: 10px;
    cursor: pointer;
    border-width: 0px;
}

#search-results div:hover {
    background-color: #edf2f7; /* light gray */
}

#search-results div:first-child {
  border-width: 1px;
}