/* ==========================================================================
   BOOKS
   ========================================================================== */

.sv_books {
    width: 100%;
    min-width: 0;
}

.sv_books_header {
    width: 100%;
}


/* ==========================================================================
   BOOKS LIST
   ========================================================================== */

.sv_books_list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: var(--space_3);
    width: 100%;
    min-width: 0;
}


/* ==========================================================================
   BOOK
   ========================================================================== */

.sv_book {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    align-items: stretch;
    gap: var(--space_3);
    width: 100%;
    min-width: 0;
    padding: var(--space_2);
}


/* ==========================================================================
   BOOK COVER
   ========================================================================== */

.sv_book_cover {
    position: relative;
    min-width: 0;
    margin: 0;
}

    .sv_book_cover img {
        display: block;
        width: 100%;
        height: auto;
        max-width: 100%;
        object-fit: contain;
        object-position: top center;
    }


/* ==========================================================================
   BOOK DETAILS
   ========================================================================== */

.sv_book_details {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 100%;
}


/* ==========================================================================
   BOOK FACTS
   ========================================================================== */

.sv_book_facts {
    display: grid;
    gap: var(--space_3);
    width: 100%;
    min-width: 0;
    margin: 0;
    font-family: var(--font_BovinoLight);
}

.sv_book_fact {
    min-width: 0;
}

    .sv_book_fact dt,
    .sv_book_fact dd {
        margin: 0;
    }

    .sv_book_fact dt {
        font-weight: 400;
    }

    .sv_book_fact dd {
        padding-top: var(--space_1);
        font-weight: 700;
    }

        .sv_book_fact dd a.spa-link {
            display: block;
            width: fit-content;
        }

            .sv_book_fact dd a.spa-link + a.spa-link {
                margin-top: var(--space_0_5);
            }


    /* ==========================================================================
   LINKS IN BOOK FACTS
   ========================================================================== */

    .sv_book_fact a {
        color: var(--color_Green);
        font-family: var(--font_BovinoMedium);
        font-weight: 700;
        text-decoration: none;
        border-bottom: var(--space_0_25) dotted currentColor;
        transition: color 200ms ease, background-color 200ms ease;
    }

        .sv_book_fact a:hover,
        .sv_book_fact a:focus-visible {
            color: var(--color_LunarGreen);
            background-color: var(--color_RockBlue_25);
        }


/* ==========================================================================
   BOOK DOWNLOADS
   ========================================================================== */

.sv_book_downloads {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: var(--space_2);
    width: 100%;
    /*
        Potisne download gumbe na dno desnega stolpca.
    */
    margin-top: auto;
    padding-top: var(--space_3);
}


/* ==========================================================================
   BOOK DOWNLOAD
   ========================================================================== */

.sv_book_download {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: var(--space_4);
    min-height: var(--space_4);
    color: var(--color_LunarGreen);
    text-decoration: none;
    cursor: pointer;
    transition: color 200ms ease, transform 200ms ease;
}

    .sv_book_download span {
        display: none;
    }

    .sv_book_download .svg_icon {
        display: block;
        width: var(--space_4);
        height: var(--space_8);
        fill: currentColor;
    }


    /* ==========================================================================
   BOOK DOWNLOAD STATES
   ========================================================================== */

    .sv_book_download:hover,
    .sv_book_download:focus-visible {
        color: var(--color_Green);
        transform: translateY( calc(var(--space_0_25) * -1) );
    }


/* ==========================================================================
   RESPONSIVE - TABLET
   ========================================================================== */

@media only screen and (max-width: 64em) {

    .sv_books_list {
        grid-template-columns: 1fr;
    }

    .sv_book {
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    }
}


/* ==========================================================================
   RESPONSIVE - MOBILE
   ========================================================================== */

@media only screen and (max-width: 40em) {

    .sv_book {
        grid-template-columns: 1fr;
        gap: var(--space_2);
    }

    .sv_book_cover {
        width: min(70%, 20rem);
        margin-inline: auto;
    }

    .sv_book_details {
        min-height: 0;
    }

    .sv_book_downloads {
        justify-content: flex-start;
        margin-top: 0;
        padding-top: var(--space_2);
    }
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    .sv_book_fact a,
    .sv_book_download {
        transition: none;
    }
}
