/*
Theme Name: SoalSekolah GeneratePress Child
Theme URI: https://soalsekolah.my.id/
Description: Child theme GeneratePress untuk SoalSekolah dengan tampilan khusus Materi dan Bank Soal.
Author: SoalSekolah
Template: generatepress
Version: 1.0.0
Text Domain: soalsekolah-gp
*/

/* =========================================================
   SoalSekolah - Bank Soal
   ========================================================= */

.single-soal .site-content,
.post-type-archive-soal .site-content,
.single-materi .site-content,
.post-type-archive-materi .site-content {
    max-width: 1180px;
}

.single-soal .entry-content {
    font-size: 17px;
    line-height: 1.7;
}

.single-soal .entry-content > h2:first-child {
    margin-bottom: 12px;
}

/* Container from the HTML bank-soal template */
.single-soal .bank-soal-ipas {
    max-width: 900px;
    margin: 0 auto;
}

.single-soal .bank-soal-ipas .intro {
    margin-bottom: 28px;
}

/* Each question */
.single-soal .bank-soal-ipas .soal-item {
    margin: 0 0 30px;
    padding: 0 0 28px;
    border-bottom: 1px solid #e5e7eb;
}

.single-soal .bank-soal-ipas .nomor-soal {
    display: inline-block;
    background: #1976d2;
    color: #fff;
    font-size: 18px;
    line-height: 1.35;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 7px;
    margin-bottom: 10px;
}

.single-soal .bank-soal-ipas .pertanyaan {
    font-size: 18px;
    line-height: 1.6;
    font-weight: 700;
    margin: 5px 0 14px;
}

/* A-B-C-D options */
.single-soal .bank-soal-ipas .pilihan {
    margin: 0;
    padding: 0;
    list-style: none !important;
    border: 1px solid #dfe5eb;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.single-soal .bank-soal-ipas .pilihan li {
    display: flex !important;
    align-items: center;
    gap: 12px;
    margin: 0 !important;
    padding: 10px 12px;
    list-style: none !important;
    border-bottom: 1px solid #dfe5eb;
    background: #fff;
}

.single-soal .bank-soal-ipas .pilihan li:last-child {
    border-bottom: 0;
}

.single-soal .bank-soal-ipas .huruf {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 2px solid #1683e8;
    border-radius: 7px;
    color: #1769c2;
    font-weight: 700;
    font-size: 15px;
    line-height: 1;
}

/* Answer / explanation */
.single-soal .bank-soal-ipas details {
    margin-top: 10px;
    border-radius: 10px;
    background: #eef5ff;
    overflow: hidden;
}

.single-soal .bank-soal-ipas summary {
    cursor: pointer;
    padding: 11px 13px;
    color: #1769c2;
    font-weight: 700;
    list-style-position: inside;
}

.single-soal .bank-soal-ipas summary:hover {
    background: #e4efff;
}

.single-soal .bank-soal-ipas .jawaban-box {
    margin: 0 10px 10px;
    padding: 13px;
    background: #fff;
    border: 1px solid #dce7f5;
    border-radius: 8px;
}

.single-soal .bank-soal-ipas .jawaban {
    margin: 0 0 9px;
    font-weight: 700;
    color: #176f35;
}

.single-soal .bank-soal-ipas .pembahasan {
    margin: 0;
}

.single-soal .bank-soal-ipas .pembahasan strong {
    color: #174d7a;
}

/* Prevent theme/editor styles from turning the options back into a list */
.single-soal .bank-soal-ipas ul.pilihan li::before {
    content: none !important;
}

/* =========================================================
   Materi
   ========================================================= */

.single-materi .entry-content {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    font-size: 17px;
    line-height: 1.8;
}

.single-materi .entry-content h2 {
    margin-top: 34px;
    scroll-margin-top: 100px;
}

.single-materi .entry-content h3 {
    margin-top: 26px;
    scroll-margin-top: 100px;
}

.single-materi .entry-content img {
    border-radius: 10px;
}

/* Generic anchor links used in Materi */
.single-materi .entry-content a[href^="#"] {
    text-decoration: none;
}

.single-materi .entry-content a[href^="#"]:hover {
    text-decoration: underline;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 768px) {
    .single-soal .entry-content,
    .single-materi .entry-content {
        font-size: 16px;
    }

    .single-soal .bank-soal-ipas .pertanyaan {
        font-size: 17px;
    }

    .single-soal .bank-soal-ipas .pilihan li {
        padding: 9px 10px;
        gap: 10px;
    }

    .single-soal .bank-soal-ipas .huruf {
        flex-basis: 27px;
        width: 27px;
        height: 27px;
    }
}

@media (max-width: 480px) {
    .single-soal .bank-soal-ipas .nomor-soal {
        font-size: 16px;
        padding: 5px 12px;
    }

    .single-soal .bank-soal-ipas .pertanyaan {
        font-size: 16px;
    }

    .single-soal .bank-soal-ipas .pilihan li {
        align-items: flex-start;
    }

    .single-soal .bank-soal-ipas .huruf {
        margin-top: 1px;
    }
}