@import url('theme.css');

body 
{
    padding-top: 3%;
    padding-bottom: 3%;
    font-size: 1.25em;
    background-color: var(--theme-color-bg);
    color: var(--theme-color-text);
}

img {
    border-radius: 25px;
}
.card 
{
    transition: all 0.3s ease-in-out;
    background-color: var(--theme-color-bg-lighter);
    color: var(--theme-color-text);
}

.card-header, .card-footer {
    background-color: var(--theme-color-bg-lightest);
    color: var(--theme-color-text);
    transition: all 0.3s ease-in-out;
}

.card:hover {
    transform: scale(1.05);
    background-color: var(--theme-color-bg-lightest);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.card:hover .card-header, .card:hover .card-footer
{
    background-color: var(--theme-color-bg-lightest);
}

.small-text 
{
    font-size: 0.75em;
    font-family: 'Verdana';
}

.book-thumbnail
{
    border-radius: 2%;
}

.input-box {
    background-color: var(--theme-color-bg-lightest);
    color: var(--theme-color-text);
    border-radius: 25px;
    border: 1px solid var(--theme-color-bg-lightest);
}