/* Grid layout for merchant details */
#merchantDetails {
    display: grid; /* Makes it a grid container */
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); /* Adjusts the number of columns */
    gap: 20px; /* Space between grid items */
    padding: 20px; /* Padding around the entire grid */
    justify-content: center; /* Centers the items in the grid container */
}

/* Styles for each merchant (now as grid items) */
.merchant {
    border: 1px solid #ddd; /* A light border for visual separation */
    padding: 10px; /* Padding inside each merchant div */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Optional: adds a subtle shadow for depth */
    background: #fff; /* White background for each merchant */
}

/* Style adjustments for merchant item lists */
.merchant ul {
    list-style-type: none; /* Removes default list styling */
    padding: 0; /* Removes default padding */
    margin: 0; /* Removes default margin */
}

/* Style for individual items in the merchant list */
.merchant ul li {
    padding: 5px 0; /* Adds some padding to each item for readability */
    border-bottom: 1px solid #eee; /* A light bottom border to each item */
}

/* Removes the bottom border for the last item in each list for cleanliness */
.merchant ul li:last-child {
    border-bottom: none;
}

/* Styles for out of stock items */
.out-of-stock {
    color: grey; /* Grey out the item */
    font-style: italic; /* Italicize the text */
}

/* Basic styles for the rest of the document */
body {
    font-family: Arial, sans-serif; /* Change as preferred */
    line-height: 1.6; /* Adjusts line height for readability */
    background: #f7f7f7; /* Light grey background for body */
    color: #333; /* Primary text color */
    padding: 20px; /* Padding around the entire document */
}

h1, h2 {
    color: #333; /* Dark grey color for headings */
}

/* Style for the category selection dropdown */
#categorySelect {
    padding: 10px;
    margin-bottom: 20px; /* Adds some margin below the dropdown */
    width: 200px; /* Sets a standard width for the dropdown */
}
