body {
    font-family: 'Arial', sans-serif;
    margin: 0;
    background-color: #f5f5f5; /* Light background for the entire page */
}

h1 {
    text-align: center;
    margin: 20px 0;
    color: #333; /* Darker color for the main heading */
}

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); /* Responsive grid layout */
    gap: 20px; /* Space between grid items */
    padding: 20px; /* Padding around the grid */
}

.book {
    display: flex; /* Use flexbox to manage layout */
    flex-direction: column; /* Arrange children vertically */
    justify-content: space-between; /* Space between elements */
    height: 100%; /* Ensure flex items stretch to the height of the grid cell */
    background-color: #fff; /* White background for each book entry */
    border: 1px solid #ddd; /* Light border */
    border-radius: 8px; /* Rounded corners */
    padding: 15px; /* Padding inside each book entry */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* Soft shadow for depth */
    transition: transform 0.2s; /* Smooth transition for hover effect */
}

.book h2 {
    font-size: 20px; /* Larger font size for the book title */
    color: #1a1a1a; /* Darker color for the title */
    margin: 0 0 10px; /* Margin below title */
}

.book p {
    color: #555; /* Dark gray for other text */
    margin: 5px 0; /* Margins around paragraph elements */
    flex-grow: 1; /* Allow paragraph to grow and take up space */
}

.book a {
    display: block; /* Make the link a block element */
    margin-top: 10px; /* Space above the link */
    padding: 10px 15px; /* Padding around the link */
    background-color: #007bff; /* Button color */
    color: #fff; /* Text color */
    text-decoration: none; /* No underline */
    border-radius: 5px; /* Rounded corners for button */
    text-align: center; /* Center text in the button */
}

.disabled-link {
    pointer-events: none; /* Prevents clicking */
    text-decoration: none; /* Remove underline */
    opacity: 0.5; /* Make it look faded */
}