/*
 * ================================================================
 * KotasCrypto — MemberPress Courses Classroom Override
 * Matches: Figma nodes 1-9533, 1-9624, 1-9704
 * ================================================================
 */

/* ── 0. Reset all framework colours ── */
*, *::before, *::after {
    --primary-color: #ffff01 !important;
}

/* ── 1. Global / body ── */
body.single-mpcs-course,
body.single-mpcs-lesson,
body.single-mpcs-quiz,
body.single-mpcs-assignment {
    background: #000 !important;
    color: #fff !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
}

/* Dark scrollbar */
body.single-mpcs-course ::-webkit-scrollbar,
body.single-mpcs-lesson ::-webkit-scrollbar,
body.single-mpcs-quiz ::-webkit-scrollbar,
body.single-mpcs-assignment ::-webkit-scrollbar {
    width: 6px;
}
body.single-mpcs-course ::-webkit-scrollbar-track,
body.single-mpcs-lesson ::-webkit-scrollbar-track,
body.single-mpcs-quiz ::-webkit-scrollbar-track,
body.single-mpcs-assignment ::-webkit-scrollbar-track {
    background: #1a1a1a;
}
body.single-mpcs-course ::-webkit-scrollbar-thumb,
body.single-mpcs-lesson ::-webkit-scrollbar-thumb,
body.single-mpcs-quiz ::-webkit-scrollbar-thumb,
body.single-mpcs-assignment ::-webkit-scrollbar-thumb {
    background: #444;
    border-radius: 3px;
}

/* Kill any leftover white backgrounds from Spectre.css */
body.single-mpcs-course .entry,
body.single-mpcs-course .entry-content,
body.single-mpcs-course .columns,
body.single-mpcs-course .column,
body.single-mpcs-lesson .entry,
body.single-mpcs-lesson .entry-content,
body.single-mpcs-lesson .columns,
body.single-mpcs-lesson .column,
body.single-mpcs-quiz .entry,
body.single-mpcs-quiz .entry-content,
body.single-mpcs-quiz .columns,
body.single-mpcs-quiz .column,
body.single-mpcs-assignment .entry,
body.single-mpcs-assignment .entry-content,
body.single-mpcs-assignment .columns,
body.single-mpcs-assignment .column {
    background: transparent !important;
}

/* ── 2. Handle the MemberPress classroom navbar — fixed top + translucent ── */
#mpcs-navbar {
    display: block !important;
    background: rgba(0, 0, 0, 0.7) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    min-height: 64px !important;
    height: auto !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.mpcs-classroom #mpcs-navbar,
body.single-mpcs-course #mpcs-navbar,
body.single-mpcs-lesson #mpcs-navbar,
body.single-mpcs-quiz #mpcs-navbar,
body.single-mpcs-assignment #mpcs-navbar {
    background: rgba(0, 0, 0, 0.7) !important;
}

/* Push content below fixed navbar */
body.mpcs-classroom .entry-content,
body.single-mpcs-course .entry-content,
body.single-mpcs-lesson .entry-content,
body.single-mpcs-quiz .entry-content,
body.single-mpcs-assignment .entry-content {
    padding-top: 64px !important;
}

/* Hide all default MemberPress header content — our #kc-classroom-nav is the only child */
#mpcs-navbar > * {
    display: none !important;
}
#mpcs-navbar > #kc-classroom-nav {
    display: flex !important;
}

/* ── 3. Navbar nav element — inline styles handle everything, just backup ── */
#kc-classroom-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
}

/* Constrain avatar/small icons inside navbar, but not the brand logo */
#mpcs-navbar img:not([alt="Komunitas Crypto"]),
#kc-classroom-nav img:not([alt="Komunitas Crypto"]) {
    max-width: 64px !important;
    max-height: 64px !important;
}

/* Brand logo — honor its inline height and let width auto from aspect ratio */
#mpcs-navbar img[alt="Komunitas Crypto"],
#kc-classroom-nav img[alt="Komunitas Crypto"] {
    max-width: none !important;
    max-height: none !important;
    height: 28px !important;
    width: auto !important;
    object-fit: contain !important;
    display: block !important;
}

/* Hide sidebar toggle on desktop */
#kc-classroom-nav .sidebar-open {
    display: none !important;
}

/* ── 4. Layout wrapper — sidebar + main side by side ── */
.entry-content {
    min-height: calc(100vh - 64px);
    background: #000 !important;
    display: flex !important;
}

.entry-content > .columns,
.columns.col-gapless {
    display: flex !important;
    width: 100% !important;
    flex-wrap: nowrap !important;
}

/* Force sidebar width — override Spectre col-3 flex-basis */
#mpcs-sidebar,
#mpcs-sidebar.column,
aside#mpcs-sidebar.column.col-3,
aside#mpcs-sidebar.column.col-3.col-md-4 {
    flex: 0 0 360px !important;
    max-width: 360px !important;
    width: 360px !important;
}

/* Force main to take remaining width — override Spectre col-9 flex-basis */
#mpcs-main,
#mpcs-main.column,
main#mpcs-main.column.col-9,
main#mpcs-main.column.col-9.col-md-8 {
    flex: 1 1 0% !important;
    max-width: calc(100% - 360px) !important;
    min-width: 0 !important;
    width: auto !important;
}

/* ── 4b. Course Curriculum heading ── */
#mpcs-main > h1,
#mpcs-main > h2 {
    font-size: 30px !important;
    font-weight: 700 !important;
    color: #fff !important;
    letter-spacing: -0.9px !important;
    margin: 0 0 18px 0 !important;
}

/* ── 5. Sidebar ── */
#mpcs-sidebar {
    background: #101010 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.07) !important;
    width: 360px !important;
    min-width: 280px;
    position: sticky;
    top: 64px;
    height: calc(100vh - 64px);
    overflow-y: auto;
}

.mpcs-sidebar-wrapper {
    background: #101010 !important;
    border-right: none !important;
    height: 100%;
}

/* Sidebar header (lesson page) — override plugin's default flex row layout */
#mpcs-sidebar-header {
    display: block !important;
    padding: 0 !important;
    align-items: initial !important;
}

#mpcs-sidebar-header > .kc-course-thumbnail,
#mpcs-sidebar-header > figure {
    width: 100% !important;
    flex: none !important;
    margin: 0 !important;
}

#mpcs-sidebar-header > .course-progress {
    width: 100% !important;
    margin-left: 0 !important;
    flex: none !important;
    padding: 10px !important;
}

/* Sidebar header: course thumbnail */
#mpcs-sidebar .figure,
#mpcs-sidebar-header figure,
.kc-course-thumbnail {
    width: 100% !important;
    margin: 0 !important;
    overflow: hidden;
    background: transparent !important;
    position: relative;
}

#mpcs-sidebar .figure img,
#mpcs-sidebar-header figure img,
.kc-course-thumbnail img {
    width: 100% !important;
    height: 224px !important;
    object-fit: cover !important;
    max-height: none !important;
    /* Yellow hue overlay via filter */
    filter: sepia(0.35) saturate(2) hue-rotate(5deg);
    display: block;
}

/* Course title in sidebar */
#mpcs-sidebar-header h1,
.mpcs-sidebar-wrapper h1 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #fff !important;
    padding: 10px 15px !important;
    margin: 0 !important;
    letter-spacing: -0.4px;
}

/* ── 6. Progress bar ── */
.course-progress {
    padding: 10px !important;
    background: transparent !important;
}

.course-progress .progress-bar,
.course-progress [class*="progress"]>span:first-child {
    background: #555 !important;
    border-radius: 1000px !important;
    height: 13px !important;
    overflow: hidden;
}

.course-progress .user-progress,
.course-progress [class*="progress-fill"],
.course-progress .mepr-progress-bar>span {
    background: #ffff01 !important;
    border-radius: 1000px !important;
    height: 13px !important;
}

.course-progress .progress-text,
.course-progress h2,
.course-progress p {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-align: center !important;
    letter-spacing: -0.28px;
    margin-top: 6px !important;
}

/* ── 7. Sidebar menu items (Course Overview link) ── */
#mpcs-sidebar .mpcs-sidebar-menu a,
#mpcs-sidebar .mpcs-sidebar-menu .tile {
    border-left: none !important;
    background: transparent !important;
    color: #fff !important;
    padding: 10px 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

#mpcs-sidebar .mpcs-sidebar-menu a.is-active,
#mpcs-sidebar .mpcs-sidebar-menu .tile.is-active {
    background: rgba(255, 255, 255, 0.06) !important;
    border-left: 5px solid #ffff01 !important;
    color: #fff !important;
}

#mpcs-sidebar .mpcs-sidebar-menu a:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* ── 8. Section title (accordion header — "Daftar Modul") ── */
.mpcs-section {
    background: transparent !important;
    margin-bottom: 16px !important;
}

.mpcs-section-title {
    background: transparent !important;
    padding: 0 !important;
}

.mpcs-section-header,
button.mpcs-section-header {
    background: #101010 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
    /* border-radius: 8px 8px 0 0 !important; */
    border-radius: 8px !important;
    padding: 8.5px 15px !important;
    height: 58px;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #fff !important;
    box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.1), 0px 4px 6px 0px rgba(0, 0, 0, 0.05) !important;
    width: 100%;
}

.mpcs-section-title-text {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #fff !important;
    letter-spacing: -1.08px !important;
    flex: 1;
}

/* Chevron arrow on section header */
.mpcs-section-header::after {
    border-top: 6px solid #fff !important;
    border-left: 6px solid transparent !important;
    border-right: 6px solid transparent !important;
}

.mpcs-section-header.active::after {
    border-bottom: 6px solid #fff !important;
    border-top: none !important;
}

/* ── 9. Lesson rows ── */
.mpcs-lesson {
    background: transparent !important;
    border-bottom: none !important;
}

.mpcs-lesson:hover {
    background: rgba(255, 255, 255, 0.04) !important;
}

.mpcs-lesson .mpcs-lesson-row-link {
    border-bottom: none !important;
    color: #fff !important;
    padding: 10px 19px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.mpcs-lesson .mpcs-lesson-row-link:hover {
    text-decoration: none !important;
}

.mpcs-lesson-link {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #fff !important;
    letter-spacing: -0.48px !important;
    margin-left: 0 !important;
}

/* ── 10. Lesson status icons ── */
.mpcs-lesson .mpcs-check-circle-regular,
.mpcs-lesson .mpcs-ok-circled,
.mpcs-lesson .mpcs-circle-regular,
.mpcs-lesson i {
    color: #fff !important;
    font-size: 18px !important;
}

.mpcs-lesson.completed .mpcs-ok-circled,
.mpcs-lesson.completed i.mpcs-ok-circled {
    color: #ffff01 !important;
}

/* ── 11. Start / View buttons ── */
.mpcs-lesson .btn,
.mpcs-lesson .btn-green,
.mpcs-lesson .btn.is-outline,
.mpcs-lesson span.btn {
    font-size: 14px !important;
    font-weight: 500 !important;
    height: 29px !important;
    padding: 0 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    letter-spacing: -0.42px !important;
    white-space: nowrap;
    line-height: 1 !important;
    text-decoration: none !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0px 10px 15px 0px rgba(0, 0, 0, 0.1), 0px 4px 6px 0px rgba(0, 0, 0, 0.05) !important;
}

/* "Start" button — yellow */
.mpcs-lesson span.btn.btn-green,
.mpcs-lesson span.btn.is-purple,
.mpcs-lesson .btn-green {
    background: #ffff01 !important;
    color: #3d2901 !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

/* "View" button — outline dark */
.mpcs-lesson span.btn.is-outline,
.mpcs-lesson .btn.is-outline {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* ── 12. Main content area ── */
#mpcs-main,
.mpcs-classroom-container #mpcs-main,
body.single-mpcs-course #mpcs-main,
body.single-mpcs-lesson #mpcs-main,
body.single-mpcs-quiz #mpcs-main,
body.single-mpcs-assignment #mpcs-main {
    background: #000 !important;
    color: #fff !important;
    padding: 27px 60px !important;
    flex: 1 1 0% !important;
    max-width: calc(100% - 360px) !important;
    min-width: 0 !important;
    min-height: calc(100vh - 64px);
    visibility: visible !important;
    display: block !important;
}

#mpcs-main h2,
#mpcs-main .entry-title,
#mpcs-main .mpcs-section-title-text,
#mpcs-main h1,
#mpcs-main h3,
#mpcs-main h4,
#mpcs-main h5,
#mpcs-main h6,
#mpcs-main p,
#mpcs-main div:not(.kc-lesson-nav-bar),
#mpcs-main span:not(.btn):not(.btn-green):not(.kc-btn-next span),
#mpcs-main a:not(.btn):not(.btn-green):not(#bookmark a):not(.kc-btn-next):not(#mpcs-quiz-continue-bottom),
#mpcs-main li,
#mpcs-main ol,
#mpcs-main ul,
#mpcs-main td,
#mpcs-main th,
#mpcs-main blockquote,
#mpcs-main pre,
#mpcs-main code,
#mpcs-main label,
#mpcs-main figcaption,
#mpcs-main strong,
#mpcs-main em,
#mpcs-main small {
    color: #fff !important;
    visibility: visible !important;
}

/* ── 12b. Comprehensive white text for lesson content ── */
#mpcs-main .mpcs-main-content,
#mpcs-main .mpcs-main-content * {
    color: #fff;
}

#mpcs-main .mpcs-main-content a {
    color: #ffff01 !important;
}

#mpcs-main .mpcs-main-content a:hover {
    color: #e6e600 !important;
}

/* Force dark text on yellow buttons everywhere */
#mpcs-main #bookmark a,
#mpcs-main #bookmark a:visited,
#mpcs-main #bookmark a:hover,
.mpcs-lesson span.btn.btn-green,
.mpcs-lesson span.btn.is-purple,
.mpcs-lesson .btn-green,
#mpcs-main .btn-green,
body.mpcs-classroom .btn-green {
    color: #3d2901 !important;
}

/* Fix curriculum specific items */
#mpcs-main .mpcs-section-header,
.mpcs-section-header {
    background: #111 !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

#mpcs-main .mpcs-lesson-row-link,
.mpcs-lesson-row-link {
    color: #fff !important;
    background: transparent !important;
}

#mpcs-main .mpcs-lesson-link,
.mpcs-lesson-link {
    color: #fff !important;
}

#mpcs-main .mpcs-lesson:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* ── 13. "Start Next Lesson" bar ── */
#mpcs-main .mpcs-course-bookmark,
#mpcs-main #bookmark {
    background: #131818 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 10px !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    margin-bottom: 22px !important;
}

#mpcs-main #bookmark a,
#mpcs-main #bookmark a.btn,
#mpcs-main #bookmark a.btn-green,
#mpcs-main .mpcs-course-bookmark a {
    background: #ffff01 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 8px !important;
    padding: 8.5px 10px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #3d2901 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    letter-spacing: -0.48px !important;
    box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.1), 0px 4px 6px rgba(0, 0, 0, 0.05) !important;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Force dark text on bookmark button children */
#mpcs-main #bookmark a span,
#mpcs-main #bookmark a i,
#mpcs-main #bookmark a.btn span,
#mpcs-main #bookmark a.btn i,
#mpcs-main #bookmark a.btn-green span,
#mpcs-main #bookmark a.btn-green i {
    color: #3d2901 !important;
}

#mpcs-main #bookmark .mpcs-bookmark-link-title,
#mpcs-main .mpcs-course-bookmark .bookmark-title {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #fff !important;
    letter-spacing: -0.48px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── 14. No purple / teal tones left ── */
.mpcs-lesson.current {
    background: rgba(255, 255, 1, 0.06) !important;
    border-left: 3px solid #ffff01 !important;
}

.mpcs-lesson.completed:not(.current) i,
.mpcs-lesson.completed:not(.current) a {
    color: #888 !important;
}

.mpcs-lesson.locked:not(.current) i,
.mpcs-lesson.locked:not(.current) a {
    color: #555 !important;
}

/* ── 15. Comments (if enabled) ── */
#mpcs-main #comments .comments-title,
#mpcs-main #respond {
    background: #111 !important;
    color: #fff !important;
}

#mpcs-main #comments>ol li {
    background: #111 !important;
}

/* ── 16. Lesson navigation buttons (Prev / Next at top — backward compat) ── */
#mpcs-lesson-navigation a,
#mpcs-lesson-navigation button,
div#mpcs-lesson-navigation a,
div#mpcs-lesson-navigation button,
.mpcs-classroom div#mpcs-lesson-navigation a:not(#previous_lesson_link),
.mpcs-classroom div#mpcs-lesson-navigation button:not(#previous_lesson_link),
.mpcs-classroom #mpcs-navbar #mpcs-lesson-navigation > a:not(#mpcs-classroom-previous-lesson-link),
#mpcs-navbar button:not(#mpcs-classroom-previous-lesson-link):not(.sidebar-open):not(.kc-cr-avatar):not(.kc-cr-sidebar-toggle),
.mpcs-classroom #mpcs-quiz-navigation a,
.mpcs-classroom #mpcs-quiz-navigation button {
    background: #ffff01 !important;
    color: #3d2901 !important;
    border: none !important;
    font-weight: 600 !important;
    padding: 12px 25px !important;
    font-size: 14px !important;
    cursor: pointer !important;
}

div#mpcs-lesson-navigation a#previous_lesson_link,
div#mpcs-lesson-navigation button#previous_lesson_link,
div#mpcs-lesson-navigation a#mpcs-classroom-previous-lesson-link,
div#mpcs-lesson-navigation button#mpcs-classroom-previous-lesson-link,
#mpcs-navbar button#mpcs-classroom-previous-lesson-link,
.mpcs-classroom a#previous_lesson_link,
.mpcs-classroom a#mpcs-classroom-previous-lesson-link {
    background: #1a1a1a !important;
    color: #fff !important;
}

/* ── 17. Mobile sidebar trigger button ── */
.sidebar-open {
    background: transparent !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 6px !important;
}

/* ── 18. Responsive tweaks ── */
@media (max-width: 840px) {
    #mpcs-sidebar {
        width: 250px !important;
    }

    #mpcs-main {
        padding: 20px !important;
    }

    #mpcs-main h2 {
        font-size: 24px !important;
    }
}

@media (max-width: 600px) {
    #kc-classroom-nav {
        padding: 0 10px !important;
        gap: 8px !important;
    }

    .kc-nav-link {
        font-size: 13px !important;
    }

    .kc-nav-upgrade {
        display: none !important;
    }

    .kc-nav-discord {
        display: none !important;
    }
}

/* ── 19. Lessons container ── */
.mpcs-lessons {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
}

/* ── 20. Link resets ── */
body.single-mpcs-course a,
body.single-mpcs-lesson a,
body.single-mpcs-quiz a,
body.single-mpcs-assignment a {
    color: #fff;
    text-decoration: none;
}

body.single-mpcs-course a:hover,
body.single-mpcs-lesson a:hover,
body.single-mpcs-quiz a:hover,
body.single-mpcs-assignment a:hover {
    color: #ffff01;
}

/* ── 21. Resources / Certificate / Instructor sidebar items ── */
.mpcs-sidebar-resources a,
#mpcs-sidebar .tile {
    color: #fff !important;
}

.mpcs-sidebar-resources a:hover,
#mpcs-sidebar .tile:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

.mpcs-sidebar-resources .tile-icon i,
#mpcs-sidebar .tile-icon i {
    color: #aaa !important;
}

/* ── 22. Section lessons panel border ── */
.mpcs-section .mpcs-lessons {
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-top: none !important;
    border-radius: 0 0 8px 8px !important;
}

/* ── 23. Lesson row bottom separator ── */
.mpcs-lesson + .mpcs-lesson {
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* ── 24. Lesson sidebar (when on a lesson page) ── */
#mpcs-sidebar .mpcs-section,
#mpcs-sidebar .mpcs-section-header {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

#mpcs-sidebar .mpcs-lesson {
    padding: 0 !important;
}

#mpcs-sidebar .mpcs-lesson a {
    padding: 8px 16px !important;
    font-size: 14px !important;
}

#mpcs-sidebar .mpcs-lesson.current {
    background: rgba(255, 255, 1, 0.08) !important;
    border-left: 3px solid #ffff01 !important;
}

/* ── 25. Lesson page content ── */
body.single-mpcs-lesson #mpcs-main .entry-content,
body.single-mpcs-lesson #mpcs-main article,
body.single-mpcs-lesson #mpcs-main .wp-block-post-content,
body.single-mpcs-quiz #mpcs-main .entry-content,
body.single-mpcs-quiz #mpcs-main article,
body.single-mpcs-quiz #mpcs-main .wp-block-post-content,
body.single-mpcs-assignment #mpcs-main .entry-content,
body.single-mpcs-assignment #mpcs-main article,
body.single-mpcs-assignment #mpcs-main .wp-block-post-content {
    color: #fff !important;
}

body.single-mpcs-lesson #mpcs-main h1,
body.single-mpcs-lesson #mpcs-main h2,
body.single-mpcs-lesson #mpcs-main h3,
body.single-mpcs-lesson #mpcs-main h4,
body.single-mpcs-lesson #mpcs-main p,
body.single-mpcs-lesson #mpcs-main li,
body.single-mpcs-lesson #mpcs-main td,
body.single-mpcs-lesson #mpcs-main th,
body.single-mpcs-quiz #mpcs-main h1,
body.single-mpcs-quiz #mpcs-main h2,
body.single-mpcs-quiz #mpcs-main h3,
body.single-mpcs-quiz #mpcs-main h4,
body.single-mpcs-quiz #mpcs-main p,
body.single-mpcs-quiz #mpcs-main li,
body.single-mpcs-quiz #mpcs-main td,
body.single-mpcs-quiz #mpcs-main th,
body.single-mpcs-assignment #mpcs-main h1,
body.single-mpcs-assignment #mpcs-main h2,
body.single-mpcs-assignment #mpcs-main h3,
body.single-mpcs-assignment #mpcs-main h4,
body.single-mpcs-assignment #mpcs-main p,
body.single-mpcs-assignment #mpcs-main li,
body.single-mpcs-assignment #mpcs-main td,
body.single-mpcs-assignment #mpcs-main th {
    color: #fff !important;
}

/* Video embeds full width */
body.single-mpcs-lesson #mpcs-main iframe,
body.single-mpcs-lesson #mpcs-main video,
body.single-mpcs-quiz #mpcs-main iframe,
body.single-mpcs-quiz #mpcs-main video,
body.single-mpcs-assignment #mpcs-main iframe,
body.single-mpcs-assignment #mpcs-main video {
    max-width: 100% !important;
    border-radius: 8px;
}

/* ── 26. Complete lesson / Mark complete button ── */
#mpcs-main .mpcs-lesson-complete-form button,
#mpcs-main button.mpcs-complete-lesson,
#mpcs-main input[type="submit"].mpcs-complete-lesson {
    background: #ffff01 !important;
    color: #3d2901 !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 10000px !important;
    padding: 12px 28px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1), 0px 4px 6px -2px rgba(0,0,0,0.05) !important;
    transition: opacity 0.2s, transform 0.2s !important;
}

#mpcs-main .mpcs-lesson-complete-form button:hover,
#mpcs-main button.mpcs-complete-lesson:hover {
    opacity: 0.92 !important;
    transform: translateY(-1px) !important;
}

/* Already completed badge */
#mpcs-main .mpcs-lesson-completed-badge,
#mpcs-main .mpcs-lesson-complete-message {
    color: #ffff01 !important;
    font-weight: 600 !important;
}

/* ── 27. Sidebar mobile overlay ──
   The mobile layout (sidebar → slide-in drawer, main full width, backdrop) lives in the
   critical inline <style> in functions.php (wp_head priority 999). It has to: that block
   sets the desktop 360px layout with !important, so the mobile counter must sit in the same
   cascade layer to win. Toggle is wired by the vanilla drawer script next to #kc-classroom-nav
   (body.kc-drawer-open). Don't re-add mobile sidebar rules here — they'd be dead weight. */

/* ── 28. "Course Overview" button on sidebar uses mpcs icon font ── */
#mpcs-sidebar .tile-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    color: #aaa !important;
}

/* ── 29. Breadcrumbs on lesson pages ── */
.mpcs-breadcrumbs {
    color: #888 !important;
    font-size: 13px !important;
    margin-bottom: 12px !important;
}

.mpcs-breadcrumbs a {
    color: #aaa !important;
}

.mpcs-breadcrumbs a:hover {
    color: #ffff01 !important;
}

/* ── 30. Top Lesson Navigation Bar ── */
.kc-lesson-nav-bar {
    display: flex !important;
    width: 100% !important;
    gap: 0 !important;
    margin-bottom: 24px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Single button — full width */
.kc-nav-one-button {
    flex-direction: row !important;
}

.kc-nav-one-button .kc-lesson-btn {
    width: 100% !important;
    flex: 1 1 100% !important;
}

/* Two buttons — 50:50 */
.kc-nav-two-buttons {
    flex-direction: row !important;
}

.kc-nav-two-buttons .kc-lesson-btn {
    flex: 1 1 50% !important;
    width: 50% !important;
}

/* Base button styles */
.kc-lesson-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 14px 24px !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: opacity 0.2s ease, transform 0.15s ease !important;
    border: none !important;
    white-space: nowrap !important;
    min-height: 52px !important;
    box-sizing: border-box !important;
}

.kc-lesson-btn:hover {
    opacity: 0.88 !important;
    transform: translateY(-1px) !important;
}

.kc-lesson-btn:active {
    transform: translateY(0) !important;
}

.kc-lesson-btn svg {
    flex-shrink: 0 !important;
}

/* Previous button — dark/subtle */
.kc-btn-prev {
    background: #1a1a1a !important;
    color: #fff !important;
    border-right: 1px solid rgba(255,255,255,0.07) !important;
    border-radius: 12px 0 0 12px !important;
}

.kc-btn-prev:hover {
    background: #252525 !important;
    color: #fff !important;
}

/* Next / Complete button — yellow CTA (high specificity to override #mpcs-main blanket white) */
#mpcs-main .kc-lesson-nav-bar .kc-btn-next,
#mpcs-main a.kc-btn-next,
a.kc-btn-next,
.kc-btn-next {
    background: #ffff01 !important;
    color: #3d2901 !important;
    border-radius: 0 12px 12px 0 !important;
}

#mpcs-main .kc-lesson-nav-bar .kc-btn-next span,
#mpcs-main a.kc-btn-next span,
a.kc-btn-next span,
.kc-btn-next span {
    color: #3d2901 !important;
}

/* When it's the only button, full rounded */
.kc-nav-one-button .kc-btn-next {
    border-radius: 12px !important;
}

#mpcs-main .kc-lesson-nav-bar .kc-btn-next:hover,
#mpcs-main a.kc-btn-next:hover,
a.kc-btn-next:hover,
.kc-btn-next:hover {
    background: #e6e600 !important;
    color: #3d2901 !important;
}

#mpcs-main .kc-lesson-nav-bar .kc-btn-next:hover span,
#mpcs-main a.kc-btn-next:hover span {
    color: #3d2901 !important;
}

#mpcs-main .kc-lesson-nav-bar .kc-btn-next svg,
#mpcs-main a.kc-btn-next svg,
a.kc-btn-next svg,
.kc-btn-next svg {
    stroke: #3d2901 !important;
}

.kc-btn-prev svg {
    stroke: #fff !important;
}

/* ── 30b. Responsive lesson nav ── */
@media (max-width: 640px) {
    .kc-lesson-nav-bar {
        margin-bottom: 16px !important;
        border-radius: 10px !important;
    }

    .kc-nav-two-buttons {
        flex-direction: column !important;
    }

    .kc-nav-two-buttons .kc-lesson-btn {
        width: 100% !important;
        flex: 1 1 100% !important;
    }

    .kc-btn-prev {
        border-radius: 10px 10px 0 0 !important;
        border-right: none !important;
        border-bottom: 1px solid rgba(255,255,255,0.07) !important;
    }

    .kc-btn-next {
        border-radius: 0 0 10px 10px !important;
    }

    .kc-nav-one-button .kc-btn-next {
        border-radius: 10px !important;
    }

    .kc-lesson-btn {
        padding: 12px 16px !important;
        font-size: 14px !important;
        min-height: 48px !important;
    }
}

/* ── 31. Quiz page overrides ── */

/* Quiz navigation — submit / next buttons */
#mpcs-quiz-navigation,
.mpcs-classroom #mpcs-quiz-navigation {
    margin-top: 24px !important;
    display: flex !important;
    gap: 12px !important;
}

#mpcs-quiz-navigation button,
#mpcs-quiz-navigation a,
.mpcs-classroom #mpcs-quiz-navigation button,
.mpcs-classroom #mpcs-quiz-navigation a,
#mpcs-main #mpcs-quiz-navigation button,
#mpcs-main #mpcs-quiz-navigation a,
body.mpcs-classroom #mpcs-main #mpcs-quiz-navigation button,
body.mpcs-classroom #mpcs-main #mpcs-quiz-navigation a,
body.mpcs-classroom div#mpcs-quiz-navigation button,
body.mpcs-classroom div#mpcs-quiz-navigation a, 
#mpcs-quiz-continue-bottom {
    background: #ffff01 !important;
    color: #3d2901 !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 25px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
    transition: opacity 0.2s, transform 0.15s !important;
}

#mpcs-quiz-navigation button:hover,
#mpcs-quiz-navigation a:hover,
.mpcs-classroom #mpcs-quiz-navigation button:hover,
.mpcs-classroom #mpcs-quiz-navigation a:hover,
#mpcs-main #mpcs-quiz-navigation button:hover,
#mpcs-main #mpcs-quiz-navigation a:hover, 
#mpcs-quiz-continue-bottom:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px) !important;
    background: #e6e600 !important;
    color: #3d2901 !important;
}

/* Quiz score display */
.mpcs-quiz-score,
#mpcs-main .mpcs-quiz-score {
    color: #ffff01 !important;
    font-weight: 700 !important;
}

/* Quiz question blocks */
.mpcs-quiz-question,
#mpcs-main .mpcs-quiz-question {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 10px !important;
    padding: 20px !important;
    margin-bottom: 16px !important;
}

.mpcs-quiz-question-text,
#mpcs-main .mpcs-quiz-question-text,
.mpcs-quiz-question label,
#mpcs-main .mpcs-quiz-question label,
.mpcs-quiz-question-label {
    color: #fff !important;
    font-size: 15px !important;
}

/* Quiz answer options */
.mpcs-quiz-question input[type="radio"],
.mpcs-quiz-question input[type="checkbox"] {
    accent-color: #ffff01 !important;
}

.mpcs-quiz-question .mpcs-quiz-option,
#mpcs-main .mpcs-quiz-question .mpcs-quiz-option {
    color: #fff !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    margin-bottom: 6px !important;
    cursor: pointer !important;
}

.mpcs-quiz-question .mpcs-quiz-option:hover {
    background: rgba(255, 255, 255, 0.06) !important;
}

/* Quiz feedback messages */
.mpcs-quiz-question-feedback,
#mpcs-main .mpcs-quiz-question-feedback {
    border-top-color: #ffff01 !important;
    border-bottom-color: #ffff01 !important;
    color: #fff !important;
    background: rgba(255, 255, 1, 0.05) !important;
    padding: 12px !important;
    border-radius: 8px !important;
    margin-top: 8px !important;
}

/* Quiz textarea / text inputs / select */
.mpcs-quiz-question textarea,
.mpcs-quiz-question input[type="text"],
.mpcs-quiz-question select,
#mpcs-main .mpcs-quiz-question textarea,
#mpcs-main .mpcs-quiz-question input[type="text"],
#mpcs-main .mpcs-quiz-question select,
.mpcs-quiz-question-field,
#mpcs-main .mpcs-quiz-question-field {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
    font-size: 14px !important;
}

.mpcs-quiz-question textarea:focus,
.mpcs-quiz-question input[type="text"]:focus,
.mpcs-quiz-question select:focus,
.mpcs-quiz-question-field:focus {
    border-color: #ffff01 !important;
    outline: none !important;
}

/* Quiz retake button */
.mpcs-quiz-retake button,
#mpcs-main .mpcs-quiz-retake button,
.mpcs-quiz-retake a,
#mpcs-main .mpcs-quiz-retake a {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 8px !important;
    padding: 10px 20px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}

.mpcs-quiz-retake button:hover,
.mpcs-quiz-retake a:hover {
    background: #252525 !important;
}

/* Quiz character count */
.mpcs-quiz-question .mpcs-character-count,
#mpcs-main .mpcs-character-count {
    color: #888 !important;
    font-size: 12px !important;
}

/* Sortable quiz items */
.mpcs-quiz-question .mpcs-sort-item,
#mpcs-main .mpcs-sort-item,
.mpcs-quiz-question-sort-list-item,
#mpcs-main .mpcs-quiz-question-sort-list-item,
.mpcs-quiz-question-sort-list .mpcs-quiz-question-sort-list-item,
.mpcs-quiz-question-sort-list-item-a {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    margin-bottom: 6px !important;
    cursor: grab !important;
}

.mpcs-quiz-question .mpcs-sort-item:active,
.mpcs-quiz-question-sort-list-item:active {
    cursor: grabbing !important;
}

/* Likert scale */
.mpcs-quiz-question .mpcs-likert-scale,
#mpcs-main .mpcs-likert-scale {
    color: #fff !important;
}

/* Quiz progress indicator */
.mpcs-quiz-progress,
#mpcs-main .mpcs-quiz-progress {
    color: #888 !important;
    font-size: 13px !important;
    margin-bottom: 16px !important;
}

/* ── 32. Sidebar — Grades menu item ── */
.mpcs-sidebar-grades,
#mpcs-sidebar .mpcs-sidebar-grades {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: transparent !important;
}

.mpcs-sidebar-grades a,
.mpcs-sidebar-grades .tile,
.mpcs-sidebar-grades .mpcs-grades-menu,
#mpcs-sidebar .mpcs-sidebar-grades a {
    background: transparent !important;
    color: #fff !important;
    padding: 12px 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border: none !important;
}

.mpcs-sidebar-grades a:hover,
.mpcs-sidebar-grades .tile:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

.mpcs-sidebar-grades .tile-icon,
.mpcs-sidebar-grades .tile-icon i {
    color: #aaa !important;
    font-size: 16px !important;
}

.mpcs-sidebar-grades .tile-content,
.mpcs-sidebar-grades .tile-title {
    color: #fff !important;
}

/* ── 33. Quiz icon color in sidebar ── */
.mpcs-lesson .mpcs-quiz-icon,
#mpcs-sidebar .mpcs-quiz-icon,
#mpcs-main .mpcs-quiz-icon {
    color: #aaa !important;
}

.mpcs-lesson.current .mpcs-quiz-icon {
    color: #ffff01 !important;
}

/* ── 34. Quiz entry title ── */
#mpcs-main .entry-title .mpcs-quiz-icon {
    color: #ffff01 !important;
    margin-right: 8px;
}

/* ── 35. Assignment page overrides ── */

/* Assignment navigation — submit button */
#mpcs-assignment-navigation,
.mpcs-classroom #mpcs-assignment-navigation {
    margin-top: 24px !important;
    display: flex !important;
    gap: 12px !important;
}

#mpcs-assignment-navigation button,
#mpcs-assignment-navigation a,
.mpcs-classroom #mpcs-assignment-navigation button,
.mpcs-classroom #mpcs-assignment-navigation a,
#mpcs-main #mpcs-assignment-navigation button,
#mpcs-main #mpcs-assignment-navigation a,
body.mpcs-classroom #mpcs-main #mpcs-assignment-navigation button,
body.mpcs-classroom #mpcs-main #mpcs-assignment-navigation a {
    background: #ffff01 !important;
    color: #3d2901 !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 25px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
    transition: opacity 0.2s, transform 0.15s !important;
}

#mpcs-assignment-navigation button:hover,
#mpcs-assignment-navigation a:hover {
    opacity: 0.9 !important;
    transform: translateY(-1px) !important;
    background: #e6e600 !important;
    color: #3d2901 !important;
}

/* Disabled submit button */
#mpcs-assignment-navigation button.disabled-link-css,
#mpcs-assignment-navigation button[disabled] {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* Assignment icon in entry title */
#mpcs-main .entry-title .mpcs-assignment-icon {
    color: #ffff01 !important;
    margin-right: 8px;
}

/* Drag-and-drop upload area */
#mpcs-drag-drop-area,
.mpcs-submission #mpcs-drag-drop-area {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 2px dashed rgba(255, 255, 255, 0.15) !important;
    border-radius: 12px !important;
    padding: 40px 20px !important;
    text-align: center !important;
    transition: border-color 0.2s, background 0.2s !important;
}

#mpcs-drag-drop-area:hover,
#mpcs-drag-drop-area.drag-over {
    border-color: #ffff01 !important;
    background: rgba(255, 255, 1, 0.04) !important;
}

.mpcs-drag-drop-inside p,
#mpcs-drag-drop-area p {
    color: #aaa !important;
    font-size: 14px !important;
}

.mpcs-drag-drop-info {
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    margin-bottom: 8px !important;
}

/* Browse button */
#mpcs-plupload-browse-button,
.mpcs-drag-drop-buttons .button {
    background: #ffff01 !important;
    color: #3d2901 !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: pointer !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
}

#mpcs-plupload-browse-button:hover {
    opacity: 0.9 !important;
}

/* URL paste area */
#mpcs-url-paste-area {
    margin-top: 16px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border: 2px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 12px !important;
    padding: 16px !important;
    display: block !important;
    
}

#mpcs-url-paste-area label {
    color: #aaa !important;
    font-size: 13px !important;
    display: block !important;
    margin-bottom: 6px !important;
}

#mpcs-url-paste-area input[type="url"],
#mpcs-upload-url {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
    margin-left: 0 !important;
}

#mpcs-upload-url:focus {
    border-color: #ffff01 !important;
    outline: none !important;
}

/* Upload preview */
.mpcs-submission-upload-preview {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 10px !important;
    padding: 16px !important;
    margin-top: 16px !important;
}

.mpcs-submission-upload-preview-title {
    color: #fff !important;
    font-weight: 500 !important;
}

.mpcs-submission-upload-preview-error {
    color: #ff6467 !important;
}

/* Upload progress bar */
#plupload-upload-progress-bar {
    background: #ffff01 !important;
    border-radius: 4px !important;
    height: 4px !important;
}

.plupload-upload-progress {
    background: #333 !important;
    border-radius: 4px !important;
    height: 4px !important;
    margin: 12px 0 !important;
    overflow: hidden !important;
}

/* Delete link */
#mpcs-submission-upload-delete,
.mpcs-assignment-link {
    color: #ff6467 !important;
    background: transparent !important;
    border: none !important;
    cursor: pointer !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 0 !important;
}

#mpcs-submission-upload-delete:hover {
    color: #ff4444 !important;
    text-decoration: underline !important;
}

/* Upload error */
#mpcs-assignment-upload-error {
    color: #ff6467 !important;
    font-size: 13px !important;
    margin-top: 8px !important;
}

/* Assignment submission wrapper */
.mpcs-submission,
.mpcs-upload-submission {
    margin-top: 20px !important;
}

/* Assignment icon in sidebar */
.mpcs-lesson .mpcs-assignment-icon,
#mpcs-sidebar .mpcs-assignment-icon {
    color: #aaa !important;
}

.mpcs-lesson.current .mpcs-assignment-icon {
    color: #ffff01 !important;
}

/* ── 36. Comprehensive quiz form dark styling ── */

/* Select dropdown options (browser native) */
.mpcs-quiz-question select option,
#mpcs-main .mpcs-quiz-question select option {
    background: #1a1a1a !important;
    color: #fff !important;
}

/* Short answer — extra specificity for plugin default override */
.mpcs-quiz-question-field-short-answer,
#mpcs-main .mpcs-quiz-question-field-short-answer,
input.mpcs-quiz-question-field-short-answer,
#mpcs-main input.mpcs-quiz-question-field-short-answer {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Match matrix — container + items */
.mpcs-quiz-question-matrix-options,
.mpcs-quiz-question-matrix-list,
#mpcs-main .mpcs-quiz-question-matrix-options,
#mpcs-main .mpcs-quiz-question-matrix-list {
    background: transparent !important;
}

.mpcs-quiz-question-matrix-item,
#mpcs-main .mpcs-quiz-question-matrix-item {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    margin-bottom: 8px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.mpcs-quiz-question-match-matrix-option-value,
.mpcs-quiz-question-match-matrix-option-value label,
#mpcs-main .mpcs-quiz-question-match-matrix-option-value label {
    color: #fff !important;
    font-weight: 500 !important;
}

.mpcs-quiz-question-match-matrix-option-answer select,
.mpcs-quiz-question-field-match-matrix,
#mpcs-main .mpcs-quiz-question-field-match-matrix,
select.mpcs-quiz-question-field-match-matrix {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    font-family: 'Glancyr', 'Inter', -apple-system, sans-serif !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    cursor: pointer !important;
    min-width: 160px !important;
}

/* Sort values list + items */
.mpcs-quiz-question-sort-options,
.mpcs-quiz-question-sort-list,
#mpcs-main .mpcs-quiz-question-sort-options,
#mpcs-main .mpcs-quiz-question-sort-list {
    background: transparent !important;
}

.mpcs-quiz-question-sort-option-value,
#mpcs-main .mpcs-quiz-question-sort-option-value {
    color: #fff !important;
}

/* Likert scale labels */
.mpcs-likert-scale-low-label,
.mpcs-likert-scale-high-label,
#mpcs-main .mpcs-likert-scale-low-label,
#mpcs-main .mpcs-likert-scale-high-label {
    color: #aaa !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

/* Quiz question option rows */
.mpcs-quiz-question-option,
#mpcs-main .mpcs-quiz-question-option {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 8px !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
}

.mpcs-quiz-question-option:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

.mpcs-quiz-question-option-label,
#mpcs-main .mpcs-quiz-question-option-label {
    color: #fff !important;
    font-size: 14px !important;
    cursor: pointer !important;
}

/* Radio/checkbox custom icons */
.mpcs-quiz-question-option i,
#mpcs-main .mpcs-quiz-question-option i {
    color: #888 !important;
    font-size: 18px !important;
}

/* Checked state icons */
.mpcs-quiz-question-option input:checked + label i.mpcs-radio-checked,
.mpcs-quiz-question-option input:checked + label i.mpcs-checkbox-checked {
    color: #ffff01 !important;
}

/* Fieldset reset — remove white bg from browser default */
fieldset.mpcs-quiz-question,
#mpcs-main fieldset.mpcs-quiz-question {
    border: none !important;
    margin: 0 !important;
    padding: 20px !important;
    background: rgba(255, 255, 255, 0.04) !important;
    border-radius: 10px !important;
}

fieldset.mpcs-quiz-question legend,
#mpcs-main fieldset.mpcs-quiz-question legend {
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    padding: 0 4px !important;
}

/* Quiz question required asterisk */
.mpcs-quiz-question-required {
    color: #ff6467 !important;
}

/* Fill in the blank — inputs inside content */
.mpcs-quiz-question-fill-blank .mpcs-quiz-question-input input,
#mpcs-main .mpcs-quiz-question-fill-blank input {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 6px !important;
    padding: 6px 10px !important;
    font-size: 14px !important;
}

/* "Drag and Drop" instruction text */
.mpcs-quiz-question-sort-values .mpcs-quiz-question-input > p,
#mpcs-main .mpcs-quiz-question-sort-values p {
    color: #aaa !important;
    font-size: 13px !important;
}

/* Hide native radio/checkbox — plugin uses icon fonts */
.mpcs-quiz-question-option input[type="radio"],
.mpcs-quiz-question-option input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* QUIZ: Error message container */
.mpcs-lesson-question-error-inner,
.mpcs-quiz-question-error-inner,
.mpcs-assignment-error-inner {
    background-color: #851900 !important;
}


/*  */
.mpcs-submission-display__warning {
    background-color: rgba(255, 255, 255, 0.04) !important;
    color: #fff !important;
    padding: 12px !important;
    border-radius: 12px !important;
    margin-bottom: 16px !important;
    border: 2px solid rgba(255, 255, 255, 0.15) !important;
}

.mpcs-upload-info a {
    color: #ffff01 !important;
    text-decoration: underline !important;
    font-weight: 500 !important;
    cursor: pointer;
}

/*  */
div.ets-discord-connection-wrapper>label.ets-connection-lbl {
    display: none !important;
}