.products { font-family: Arial, sans-serif; margin: 10px; max-width: 1200px; margin-left: auto;
  margin-right: auto; border: 5px solid #ccc; /* 5px border around the container */ padding: 10px;
  /* Padding inside the border */ } .search-container { display: flex; flex-direction: column; gap:
  20px; } .filters { display: flex; flex-wrap: wrap; gap: 15px; } .filters
  input[name="searchQuery"] { width: 50%; /* Double the width of the search input box */ }
  .results-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px; } .result-item { border: 1px solid #ccc; border-radius: 5px; background-color:
  #f9f9f9; /* Light gray background for each item */ text-align: center; display: flex;
  flex-direction: column; justify-content: space-between; padding: 10px; /* Padding inside the item
  */ } .result-item a { text-decoration: none; color: inherit; display: flex; flex-direction:
  column; height: 100%; justify-content: space-between; } .result-item img { width: auto;
  max-width: 100%; height: 200px; /* Fixed height for consistent sizing */ object-fit: contain;
  margin-bottom: 5px; } .result-item &gt; a &gt; div{ display: flex; justify-content:
  space-between; align-items: baseline; margin-top: auto; /* pushes the row to the bottom */ }
  .result-item &gt; a &gt; div p { margin-bottom: 0; } .result-item h3 { text-decoration: none;
  font-size: 14px; color: #FFFFFF; /* White text */ } .result-item card-details { font-color:
  #0000FF; /* White text */ font-weight: bold; /* Bold font */ font-size: 12px; /* Adjust the size
  as needed */ text-align: center; /* Centers the text inside the .card */ } /* Bid Price Styling
  */ bid-price { margin-left: 2px; /* Add a gap from the left edge */ text-align: center; }
  .view-button { background-color: red; color: black; text-align: center; padding: 10px 15px;
  display: block; /* Changed to block */ border-radius: 5px; font-size: 16px; font-weight: bold; }
  .view-button:hover { background-color: #FFC107; } button[type="submit"] { background-color: red;
  color: black; font-weight: bold; border: none; padding: 12px 20px; font-size: 16px; cursor:
  pointer; border-radius: 5px; margin-top: 20px; /* Adds spacing */ margin-bottom: 10px; /* Adds
  margin below the button */ width: 100%; /* Button takes 80% of the container's width */
  text-align: center; /* Left-align the button's text */ } button[type="submit"]:hover {
  background-color: #FFC107; }
