.navbar .navbar-brand img {
  max-width: 100px;
}
.navbar form {
  width: 35%;
}

.navbar form input {
  border-radius: 50px;
  height: 3rem;
  border: 1px solid #09476d;
  padding-left: 3rem;
  background: #f2f2f2
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2309476d' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001q.044.06.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1 1 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3E%3C/svg%3E")
    no-repeat 5%;
}
.nav-link {
  color: #000 !important;
  text-decoration: underline !important;
}
@media (min-width: 992px) {
  .nav-link {
    text-decoration: none !important;
    position: relative;
    display: inline-block;
    overflow: hidden;
  }

  .nav-link::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%; /* Start with no underline visible */
    height: 1px; /* Thickness of the underline */
    background-color: currentColor; /* Color of the text */
    transition: width 0.5s ease-in-out;
  }

  .nav-link:hover::after {
    width: 100%; /* Full width on hover */
  }
}

header p,
#shop-categories h2 {
  color: #000;
}
#login-link,
#signup-link,
#logout-link {
  font-size: 1.75rem;
}
@media (max-width: 991px) {
  #cart-link,
  #signup-link {
    color: #0400d5 !important;
  }
}
#login-link,
#logout-link {
  color: #0400d5 !important;
}
.nav-item {
  font-size: 1.75rem;
}
@media (min-width: 992px) {
  #first-nav .container-fluid {
    padding: 0 8rem !important;
  }
}

#second-nav {
  background-color: #a1d8e0;
}

header {
  background-color: #09476d;
}
.card {
  border: none;
}
a.product-name {
  color: #000;
  text-decoration: none;
}
.alert-link:hover,
a.product-name:hover {
  color: #0400d5 !important;
}
.product-image {
  height: 330px; /* Set a fixed height */
  width: 100%; /* Make the image take up the full width of the card */
  object-fit: contain; /* Maintain aspect ratio  */
}
.img-fluid {
  height: 500px !important;
  object-fit: contain;
}
#shop-categories h2 {
  font-size: 3rem;
}

#shop-categories-button {
  background-color: #ce1c2c;
  border-radius: 0;
}
#design-button,
#learn-more-button {
  color: #000;
  text-align: center;
}
#design-button:hover,
#learn-more-button:hover {
  color: #0400d5;
}
#learn-more-button {
  width: 7em;
}
#student-discount,
#newsletter-discount {
  background-color: #ce1c2c;
}
#verify-discount-button {
  border-radius: 0;
  background-color: #09476d;
}
.badge {
  background-color: #0400d5;
  color: #fff !important;
}
.input-button-wrapper {
  display: flex;
  align-items: center; /* Aligns items vertically center in the flex container */
}
#add-to-cart-button {
  background-color: #a1d8e0;
  color: #000;
  padding: 2px 4px;
  border: 1px solid #a1d8e0;
  font-size: 1rem;
  border-radius: 0;
  margin-left: 5px;
}
.quantity-input {
  width: 40px;
  font-size: 1rem;
  padding: 2px 4px;
  border: 1px solid #000;
  background-color: #f8f9fa;
}
#buy-now-button {
  background-color: #a1d8e0;
  color: #000;
  padding: 2px 4px;
  border: 1px solid #a1d8e0;
  font-size: 1rem;
  border-radius: 0;
}
#newsletter-discount__form input {
  border-radius: 0;
  border: none;
}
#subscribe-button {
  background-color: #09476d;
  border-radius: 0;
}
#coming-soon img {
  height: 250px;
}
#shop-categories {
  background-color: #09476d;
}
footer {
  background-color: #a1d8e0;
}

/** sticky sorting form on side **/
@media (min-width: 768px) {
  .sticky-sidebar {
    position: sticky;
    top: 20px;
    height: fit-content;
  }
}