/*
VGN Review Tools
Main stylesheet
*/


/* ==========================================================
   SCORE OUTPUT
========================================================== */


.vgn-score-output {

    text-align:center;

    margin:20px auto;

}



.vgn-score-image {

    max-width:150px;

    height:auto;

    display:block;

    margin:0 auto;

}





/* ==========================================================
   SCORE BOX
========================================================== */


.vgn-score-box {

    background:#1e1e1e;

    color:#ffffff;

    padding:20px;

    border-radius:12px;

    box-shadow:
    0 4px 12px rgba(0,0,0,.3);

    max-width:800px;

    margin:20px auto;

    text-align:center;

}




.vgn-score-box h2 {

    margin-bottom:15px;

}





.vgn-score-layout {

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    align-items:flex-start;

    gap:25px;

    width:100%;

}




.vgn-score-image-wrapper {

    flex:0 0 auto;

}







/* ==========================================================
   PLATFORM LOGOS
========================================================== */


.vgn-platform-wrapper {

    display:flex;

    flex-direction:column;

    align-items:center;

}



.vgn-platform-grid {

    display:grid;

    grid-template-columns:
    repeat(2,auto);

    gap:10px;

    margin-top:10px;

    justify-items:center;

}




.vgn-platform-logo {

    height:50px;

    width:auto;

    transition:.2s ease;

}




.vgn-platform-logo:hover {

    transform:scale(1.08);

}






/* ==========================================================
   PHYSICAL COPY LOGOS
========================================================== */


.vgn-physical-wrapper {

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:10px;

}



.vgn-physical-logo {

    max-width:50px;

    height:auto;

}






.vgn-disclosure {

    font-style:italic;

    margin-top:15px;

}





.vgn-scoring-link a {

    color:#00d0ff;

    text-decoration:none;

}





.vgn-scoring-link a:hover {

    text-decoration:underline;

}






/* ==========================================================
   REVIEW TABLE
========================================================== */


.vgn-review-table-wrapper {

    margin:20px 0;

}



.vgn-review-table {


    width:100%;

    border-collapse:collapse;

    table-layout:fixed;

    background:#1c1c1c;

    color:#f1f1f1;

    border:1px solid #444;

    border-radius:8px;

    overflow:hidden;

    box-shadow:
    0 2px 6px rgba(0,0,0,.5);

}





.vgn-review-table th {


    background:#2a2a2a;

    padding:10px;

    text-align:center;

}





.vgn-review-table td {


    padding:8px;

    vertical-align:top;

}





.vgn-review-title h4 {


    margin:0;

    color:#f1f1f1;

}




.vgn-boxart-cell {


    width:25%;

    text-align:center;

}



.vgn-boxart {


    max-width:100px;

    height:auto;

}





.vgn-meta-cell {


    width:75%;

    padding-left:16px!important;

}




.vgn-meta-cell p {


    margin:5px 0;

}




.vgn-review-heading th {


    background:#2a2a2a;

}





.vgn-pro {


    color:#00d084;

}




.vgn-con {


    color:#cf2e2e;

}





.vgn-review-footer {


    background:#2a2a2a;

}




.vgn-action-link {


    color:#00d0ff;

    text-decoration:none;

}



.vgn-action-link:hover {


    text-decoration:underline;

}





.vgn-btb-link {


    margin-top:5px;

    font-size:14px;

    text-align:center;

}




.vgn-btb-link a {


    color:#00d0ff;

    text-decoration:none;

}





/* ==========================================================
   COMPILED ARTICLES
========================================================== */


.vgn-compiled-article {


    margin:30px 0;

}



.vgn-compiled-title {


    margin-bottom:15px;

}



.vgn-compiled-title a {


    text-decoration:none;

}



.vgn-featured-image-wrapper {


    margin-bottom:15px;

}




.vgn-featured-img {


    width:100%;

    height:auto;

    display:block;

}





.vgn-author-credit {


    margin-bottom:15px;

}





.vgn-post-content {


    line-height:1.6;

}







/* ==========================================================
   ERROR MESSAGE
========================================================== */


.vgn-error-message {


    padding:10px;

    background:#222;

    border-left:4px solid #cf2e2e;

}







/* ==========================================================
   MOBILE
========================================================== */


@media(max-width:600px){



    .vgn-score-box {


        padding:15px;

    }



    .vgn-score-layout {


        flex-direction:column;

        align-items:center;

    }




    .vgn-platform-grid {


        grid-template-columns:
        repeat(2,1fr);

    }



    .vgn-platform-logo {


        height:40px;

    }




    .vgn-review-table {


        font-size:14px;

    }



    .vgn-review-table td {


        padding:6px;

    }




    .vgn-boxart {


        max-width:80px;

    }



}