/* Prevents the "Download" button from moving lower after options are selected. */
.somdn-download-wrap-variable {
    padding-top: 0 !important;
}

/* Forces the Category and Tags lists to be on their own lines on the single product page. */
span.posted_in,
span.tagged_as {
    display: block;
}

/* Add better styling to the Variation <select> drop down menus on single product pages. */
.woocommerce div.product form.cart .variations td {
    display: block !important;
    line-height: 0 !important;
}

.woocommerce div.product form.cart .variations td.value {
    margin-bottom: 10px;
}

/* Adds a white background to the lightbox so transparent PNGs don't look so weird */
.woocommerce img.pswp__img, .woocommerce-page img.pswp__img {
    background-color: white;
}

/* @todo remove after done with testing ad placements */
.flashcards-placeholder {
    background: #dcdcdc;
    padding: 1rem;
    /*margin-bottom: 1rem;*/
    color: #be473d;
    text-align: center;
}

/* Styles for the Preview tab on single product pages */
#variations-preview .row {
    display: flex;
    flex-direction: column;
    width: 100%;
    border-top: 1px;
    border-top-color: #eeeeee;
    border-style: solid;
}

#variations-preview .row .col-1 {
    width: 100%;
    margin: 0;
    padding-top: 1rem;
    text-align: center;
}

#variations-preview .row .col-1 img {
    background-color: white;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    padding: 0.25rem;
    width: 80%;
}

#variations-preview .row .col-2 {
    width: 100%;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

#variations-preview .row .col-2 p {
    margin: 0;
    padding: 0;
}

#variations-preview .row .col-2 .name a {
    font-weight: bold;
}

#variations-preview .row .col-2 .meta {
    margin-bottom: 0.5rem;
}

#variations-preview .row .col-2 .size,
#variations-preview .row .col-2 .page_count {
    color: #888;
    font-size: 80%;
    margin-right: 0.5rem;
}

#variations-preview .row .col-2 .description p {
    margin-bottom: 0.5rem;
}

#variations-preview .row .col-2 .word_list {
    font-size: 80%;
    color: #666;
}

@media (min-width: 450px) {

    #variations-preview .row {
        flex-direction: row;
    }

    #variations-preview .row .col-1 {
        width: 20%;
        padding: 1rem;
    }

    #variations-preview .row .col-2 {
        width: 80%;
        padding: 1rem;
    }

    #variations-preview .row .col-1 img {
        width: 100%;
    }
}