/* ============================================================
   KOMANDO ACADEMY — the dark skin
   Loads on the Academy dashboard and on every MemberPress Courses
   screen (course, lesson, quiz, assignment, archive), keyed on the
   kc-academy-screen body class from KcAcademyController::bodyClass().

   Tokens are local (--kca-*) with literal values: this bundle must
   stand on its own if Classroom Mode ever strips the main stylesheet,
   and the palette is the dashboard mock's (page 82300 on local,
   2026-09-15), not the club's navy. Fonts fall back to the club's
   --kc-font-* tokens, then to system stacks.

   Two halves: 1) .kc-acad* — our own markup (dashboard, offer card);
   2) body.kc-academy-screen — a repaint of MemberPress Courses' own
   .mpcs-* markup inside the club chrome. The chrome (BuddyPanel,
   header) is left alone; only the content column goes dark.
   ============================================================ */

:root {
    --kca-bg: #0A0E17;
    --kca-bg-deep: #05070C;
    --kca-panel: #10141F;
    --kca-panel-2: #0B0F18;
    --kca-line: rgba(228, 233, 242, 0.08);
    --kca-text: #E6E9F0;
    --kca-muted: #5B6472;
    --kca-muted-2: rgba(91, 100, 114, 0.75);
    --kca-cyan: #07D7FC;
    --kca-amber: #F5A623;
    --kca-teal: #14C8A6;
    --kca-coral: #FF6B5D;
    --kca-display: var(--kc-font-display, 'Sora', system-ui, sans-serif);
    --kca-body: var(--kc-font-body, 'Inter', system-ui, sans-serif);
    --kca-mono: var(--kc-font-mono, 'IBM Plex Mono', ui-monospace, monospace);
    /* Text on an accent-coloured button. */
    --kca-on-accent: #05070C;
}

/* ---- shared atoms ---------------------------------------- */
.kc-acad, .kc-acad-offer {
    font-family: var(--kca-body);
    color: var(--kca-text);
    font-size: 15px;
    line-height: 1.5;
    box-sizing: border-box;
}
.kc-acad *, .kc-acad-offer * { box-sizing: border-box; }
.kc-acad a, .kc-acad-offer a { text-decoration: none; border-bottom: 0 !important; }

.kc-acad__kicker {
    font-family: var(--kca-mono);
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--kca-cyan);
    font-weight: 600;
    margin: 0 0 8px !important;
}
.kc-acad__kicker--amber { color: var(--kca-amber); }
.kc-acad__mono { font-family: var(--kca-mono); }

.kc-acad-btn,
#buddypress .kc-acad-btn,
.kc-acad-redeem button,
#buddypress .kc-acad-redeem button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 999px;
    font-family: var(--kca-body);
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    border: 1px solid transparent;
    text-decoration: none;
    white-space: nowrap;
    transition: transform 0.15s ease, background 0.15s ease;
}
.kc-acad-btn--primary,
#buddypress .kc-acad-btn--primary,
.kc-acad-redeem button,
#buddypress .kc-acad-redeem button {
    background: var(--kca-cyan);
    color: var(--kca-on-accent, var(--kca-bg-deep));
}
.kc-acad-btn--primary:hover, .kc-acad-redeem button:hover { transform: translateY(-1px); color: var(--kca-on-accent, var(--kca-bg-deep)); }
.kc-acad-btn--ghost,
#buddypress .kc-acad-btn--ghost {
    background: transparent;
    color: var(--kca-text);
    border-color: rgba(228, 233, 242, 0.25);
}
.kc-acad-btn--ghost:hover { border-color: var(--kca-cyan); color: var(--kca-cyan); }
.kc-acad-btn.is-disabled { opacity: 0.5; cursor: default; }
.kc-acad-redeem { display: inline-block; margin: 0; }

.kc-acad__notice {
    padding: 12px 16px;
    border-radius: 12px;
    margin: 0 0 22px;
    font-size: 14.5px;
    border: 1px solid var(--kca-line);
    background: var(--kca-panel);
}
.kc-acad__notice--ok { border-color: rgba(20, 200, 166, 0.5); color: var(--kca-teal); }
.kc-acad__notice--error { border-color: rgba(255, 107, 93, 0.5); color: var(--kca-coral); }

.kc-acad__progress { display: flex; align-items: center; gap: 14px; margin: 0 0 20px; }
.kc-acad__progress--small { margin: 6px 0 0; gap: 10px; }
.kc-acad__progress-track {
    flex: 1 1 auto;
    height: 8px;
    border-radius: 100px;
    background: rgba(228, 233, 242, 0.08);
    overflow: hidden;
    display: block;
}
.kc-acad__progress--small .kc-acad__progress-track { height: 5px; }
.kc-acad__progress-fill { display: block; height: 100%; border-radius: 100px; background: var(--kca-cyan); }
.kc-acad__progress strong { color: #fff; font-size: 14px; flex: 0 0 auto; }

/* ---- dashboard shell ------------------------------------- */
.kc-acad {
    background: var(--kca-bg);
    min-height: 100vh;
}
/* The dashboard page is chrome-free (fullscreen-no-title), so .site-main's
   30px top padding is the only thing between the header shell and us. */
.site-main > .kc-acad:first-child { margin-top: -30px; }
.kc-acad__shell { display: flex; align-items: stretch; min-height: 100vh; }

.kc-acad__sidebar {
    width: 300px;
    flex: 0 0 300px;
    background: var(--kca-bg-deep);
    border-right: 1px solid var(--kca-line);
    padding: 28px 24px;
    display: flex;
    flex-direction: column;
    gap: 28px;
}
.kc-acad__brand { display: flex; align-items: center; gap: 12px; color: #fff; }
.kc-acad__brand-bars { display: inline-flex; align-items: flex-end; gap: 3px; height: 24px; }
.kc-acad__brand-bars i { display: block; width: 4px; border-radius: 2px; background: var(--kca-cyan); }
.kc-acad__brand-bars i:nth-child(1) { height: 40%; }
.kc-acad__brand-bars i:nth-child(2) { height: 60%; }
.kc-acad__brand-bars i:nth-child(3) { height: 82%; }
.kc-acad__brand-bars i:nth-child(4) { height: 100%; }
.kc-acad__brand-text { display: flex; flex-direction: column; line-height: 1.15; }
.kc-acad__brand-the { font-family: var(--kca-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kca-cyan); font-weight: 600; }
.kc-acad__brand-academy { font-family: var(--kca-display); font-size: 20px; font-weight: 800; color: #fff; text-transform: uppercase; }

.kc-acad__nav { display: flex; flex-direction: column; gap: 4px; }
.kc-acad__nav-item,
#buddypress .kc-acad__nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 10px;
    color: var(--kca-muted);
    font-size: 14.5px;
    font-weight: 600;
    border-left: 3px solid transparent;
}
.kc-acad__nav-item:hover { color: var(--kca-text); }
.kc-acad__nav-item.is-active { background: rgba(7, 215, 252, 0.12); color: var(--kca-cyan); border-left-color: var(--kca-cyan); }

.kc-acad__benefit {
    background: var(--kca-panel);
    border: 1px solid var(--kca-line);
    border-radius: 18px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: auto;
}
.kc-acad__benefit h3 { font-family: var(--kca-display); font-size: 17px; font-weight: 700; color: #fff; margin: 0 !important; }
.kc-acad__benefit h3 span { color: var(--kca-muted); font-weight: 500; }
.kc-acad__benefit p { font-size: 13.5px; color: var(--kca-muted); margin: 0 !important; }
.kc-acad__benefit-link { font-size: 14px; font-weight: 700; color: #fff; margin-top: 4px; }
.kc-acad__benefit-link:hover { color: var(--kca-cyan); }

.kc-acad__member { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid var(--kca-line); color: inherit; }
.kc-acad__avatar {
    width: 38px; height: 38px; border-radius: 50%;
    background: var(--kca-cyan); color: var(--kca-panel);
    font-family: var(--kca-display); font-weight: 800; font-size: 15px;
    display: flex; align-items: center; justify-content: center; flex: 0 0 auto; overflow: hidden;
}
.kc-acad__avatar img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 50%; }
.kc-acad__member-text { display: flex; flex-direction: column; min-width: 0; }
.kc-acad__member-text strong { color: #fff; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kc-acad__member-text span { color: var(--kca-muted-2); font-size: 12.5px; }

.kc-acad__main { flex: 1 1 auto; min-width: 0; padding: 36px 40px 60px; }

.kc-acad__welcome { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 34px; }
.kc-acad__welcome h1,
#buddypress .kc-acad__welcome h1 { font-family: var(--kca-display); font-size: clamp(26px, 3vw, 36px); font-weight: 800; color: #fff; margin: 0 0 10px; line-height: 1.15; }
.kc-acad__welcome p { color: var(--kca-muted); font-size: 15.5px; margin: 0 !important; }
.kc-acad__stat {
    display: flex; flex-direction: column; align-items: flex-end;
    background: var(--kca-panel); border: 1px solid var(--kca-line);
    border-radius: 16px; padding: 14px 22px; flex: 0 0 auto; white-space: nowrap;
}
.kc-acad__stat strong { color: #fff; font-size: 28px; line-height: 1; }
.kc-acad__stat small { color: var(--kca-amber); font-size: 12.5px; font-weight: 600; margin-top: 4px; }

.kc-acad__continue {
    background: var(--kca-panel);
    border: 1px solid var(--kca-line);
    border-radius: 20px;
    padding: 36px;
    margin-bottom: 44px;
    display: flex;
    align-items: center;
    gap: 40px;
}
.kc-acad__continue-copy { flex: 1 1 auto; min-width: 0; }
.kc-acad__continue-copy h2,
#buddypress .kc-acad__continue-copy h2 { font-family: var(--kca-display); font-size: 28px; font-weight: 800; color: #fff; margin: 0 0 10px; line-height: 1.2; }
.kc-acad__meta { color: var(--kca-muted); font-size: 14.5px; margin: 0 0 16px !important; }
.kc-acad__continue-art {
    width: 200px; height: 200px; flex: 0 0 200px; border-radius: 24px;
    background: radial-gradient(circle, #132030 0%, #0B1420 70%) center / cover no-repeat;
    position: relative;
}
.kc-acad__continue-art--rings { border-radius: 50%; }
.kc-acad__continue-art--rings i { position: absolute; inset: 0; margin: auto; border-radius: 50%; border: 1px solid rgba(20, 200, 166, 0.35); display: block; }
.kc-acad__continue-art--rings i:nth-child(1) { width: 200px; height: 200px; }
.kc-acad__continue-art--rings i:nth-child(2) { width: 150px; height: 150px; }
.kc-acad__continue-art--rings i:nth-child(3) { width: 100px; height: 100px; background: #0F2230; }

.kc-acad__section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.kc-acad__section-heading h2,
#buddypress .kc-acad__section-heading h2 { font-family: var(--kca-display); font-size: 26px; font-weight: 800; color: #fff; margin: 0; }
.kc-acad__view-all { color: var(--kca-cyan); font-weight: 700; font-size: 14.5px; white-space: nowrap; }

.kc-acad__filters { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }
.kc-acad__filter,
#buddypress .kc-acad__filter {
    background: var(--kca-panel); border: 1px solid var(--kca-line); color: var(--kca-muted);
    border-radius: 100px; padding: 10px 20px; font-size: 14px; font-weight: 600; cursor: pointer;
    font-family: var(--kca-body);
}
.kc-acad__filter.is-selected,
#buddypress .kc-acad__filter.is-selected { background: var(--kca-cyan); border-color: var(--kca-cyan); color: var(--kca-on-accent, var(--kca-bg-deep)); }

.kc-acad__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; margin-bottom: 48px; }
.kc-acad__card {
    background: var(--kca-panel);
    border: 1px solid var(--kca-line);
    border-radius: 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.kc-acad__card.is-open { border-color: rgba(7, 215, 252, 0.35); }
.kc-acad__card-visual {
    display: flex; flex-direction: column; justify-content: flex-end; gap: 10px;
    min-height: 118px; padding: 22px 20px; position: relative; color: #fff;
    background: linear-gradient(160deg, #1B7A78 0%, #123A55 100%) center / cover no-repeat;
}
.kc-acad__card-visual span { font-family: var(--kca-mono); font-size: 12px; letter-spacing: 0.1em; font-weight: 600; text-transform: uppercase; text-shadow: 0 1px 2px rgba(0,0,0,0.5); }
.kc-acad__card-visual em {
    position: absolute; top: 16px; right: 16px; font-style: normal;
    background: rgba(5, 7, 12, 0.6); color: #fff; font-size: 11px; font-weight: 700;
    padding: 4px 10px; border-radius: 100px; letter-spacing: 0.04em;
}
.kc-acad__card-body { padding: 22px; display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; }
.kc-acad__card-body h3,
#buddypress .kc-acad__card-body h3 { font-family: var(--kca-display); font-size: 18px; font-weight: 700; margin: 0; line-height: 1.3; }
.kc-acad__card-body h3 a { color: #fff; }
.kc-acad__card-body h3 a:hover { color: var(--kca-cyan); }
.kc-acad__card-body p { font-size: 13.5px; color: var(--kca-muted); margin: 0 !important; flex: 1 1 auto; }
.kc-acad__card-footer {
    display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 14px;
    padding-top: 14px; border-top: 1px solid var(--kca-line);
    color: var(--kca-muted-2); font-size: 12.5px;
}
.kc-acad__card-cta { margin-left: auto; }
.kc-acad__card-footer .kc-acad-btn, .kc-acad__card-footer .kc-acad-redeem button { padding: 9px 16px; font-size: 13px; }
.kc-acad__price { color: var(--kca-text); font-weight: 600; }
.kc-acad__price s { color: var(--kca-muted-2); margin-right: 4px; }
.kc-acad__empty { color: var(--kca-muted); }

.kc-acad__cert {
    display: flex; align-items: center; gap: 32px;
    background: var(--kca-panel); border: 1px solid var(--kca-line);
    border-radius: 20px; padding: 36px;
}
.kc-acad__cert-seal {
    width: 96px; height: 96px; border-radius: 50%; flex: 0 0 96px;
    border: 1px dashed rgba(228, 233, 242, 0.3);
    display: flex; align-items: center; justify-content: center; color: var(--kca-amber);
    font-family: var(--kca-mono); font-weight: 700; font-size: 20px;
}
.kc-acad__cert-copy { flex: 1 1 auto; min-width: 0; }
.kc-acad__cert-copy h2,
#buddypress .kc-acad__cert-copy h2 { font-family: var(--kca-display); font-size: 26px; font-weight: 800; color: #fff; margin: 0 0 10px; }
.kc-acad__cert-copy p { color: var(--kca-muted); font-size: 14.5px; margin: 0 !important; max-width: 60ch; }

/* ---- My certificates (dashboard ?view=certificates) ------- */
/* template-parts/academy/certificates.php. One row per certificate: seal, class,
   dates, actions. Headings at #fff like every other .kc-acad heading; the HC
   block further down repaints them through the generic :where(h1…) rule. */
.kc-acad--certs .kc-acad__welcome { align-items: flex-start; }
.kc-acad-certs { margin-bottom: 44px; }
.kc-acad-certs__list { list-style: none; margin: 0 !important; padding: 0 !important; display: flex; flex-direction: column; gap: 16px; }
.kc-acad-certs__item {
    display: flex; align-items: center; gap: 24px;
    background: var(--kca-panel); border: 1px solid var(--kca-line);
    border-radius: 18px; padding: 22px 26px; margin: 0 !important;
}
.kc-acad-certs__item.is-expired { opacity: 0.8; }
.kc-acad-certs__seal { width: 64px; height: 64px; flex: 0 0 64px; font-size: 15px; }
.kc-acad-certs__body { flex: 1 1 auto; min-width: 0; }
.kc-acad-certs__body .kc-acad__kicker { margin-bottom: 6px !important; }
.kc-acad-certs__body h3,
#buddypress .kc-acad-certs__body h3 { font-family: var(--kca-display); font-size: 19px; font-weight: 700; margin: 0 0 6px; line-height: 1.3; }
.kc-acad-certs__body h3 a { color: #fff; }
.kc-acad-certs__body h3 a:hover { color: var(--kca-cyan); }
.kc-acad-certs__dates { color: var(--kca-muted); font-size: 13px; margin: 0 !important; }
.kc-acad-certs__note { color: var(--kca-amber); font-size: 13.5px; margin: 6px 0 0 !important; }
.kc-acad-certs__item--progress .kc-acad__progress { max-width: 420px; }
.kc-acad-certs__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; flex: 0 0 auto; }
.kc-acad-certs__empty {
    display: flex; align-items: center; gap: 24px;
    background: var(--kca-panel); border: 1px dashed var(--kca-line);
    border-radius: 18px; padding: 26px;
}
.kc-acad-certs__empty p { color: var(--kca-muted); font-size: 14.5px; margin: 0 0 14px !important; max-width: 60ch; }
.kc-acad-certs__empty p:last-child { margin-bottom: 0 !important; }
@media (max-width: 700px) {
    .kc-acad-certs__item, .kc-acad-certs__empty { flex-direction: column; align-items: flex-start; padding: 20px; }
    .kc-acad-certs__actions { justify-content: flex-start; }
}

@media (max-width: 1000px) {
    .kc-acad__shell { flex-direction: column; min-height: 0; }
    .kc-acad__sidebar { width: auto; flex: none; border-right: 0; border-bottom: 1px solid var(--kca-line); gap: 18px; }
    .kc-acad__benefit { margin-top: 0; }
    .kc-acad__nav { flex-direction: row; flex-wrap: wrap; }
    .kc-acad__nav-item { border-left: 0; }
    .kc-acad__nav-item.is-active { border-left: 0; }
    .kc-acad__main { padding: 28px 18px 48px; }
    .kc-acad__welcome, .kc-acad__continue, .kc-acad__cert { flex-direction: column; align-items: flex-start; }
    .kc-acad__continue-art { display: none; }
    .kc-acad__stat { align-items: flex-start; }
}

/* ---- course offer card (single course, club chrome) ------- */
.kc-acad-offer {
    background: var(--kca-panel);
    border: 1px solid var(--kca-line);
    border-radius: 18px;
    padding: 24px 28px;
    margin: 0 0 28px;
}
.kc-acad-offer.is-open { border-color: rgba(7, 215, 252, 0.35); }
.kc-acad-offer__row { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.kc-acad-offer__text { margin: 0 !important; color: var(--kca-text); font-size: 15px; max-width: 60ch; }
.kc-acad-offer__actions { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex: 0 0 auto; }
.kc-acad-offer__alt, .kc-acad-offer__signin { font-size: 13px; color: var(--kca-muted); }
.kc-acad-offer__alt:hover, .kc-acad-offer__signin:hover { color: var(--kca-cyan); }
@media (max-width: 700px) {
    .kc-acad-offer__row { flex-direction: column; align-items: flex-start; }
    .kc-acad-offer__actions { align-items: flex-start; }
}

/* ---- MemberPress Courses screens, repainted ---------------- */
/* Only the content column: the BuddyPanel and header keep the club look, so a
   club member taking a class never loses their navigation. */
body.kc-academy-screen .site-content,
body.kc-academy-screen #primary.content-area,
body.kc-academy-screen .site-main {
    background: var(--kca-bg);
}
body.kc-academy-screen .site-main,
body.kc-academy-screen .entry-content {
    color: var(--kca-text);
}
/* Contrast audit 2026-10-07: body text is NOT set on p/li any more — it
   inherits from .site-main (the parent theme has no bare p/li colour rule, so
   inheritance reaches every plain lesson). Lessons that paint their own white
   cards set colour on the card container and expect inheritance too; an
   explicit p rule here, at any specificity, broke that (light text on white).
   Headings DO need a rule (BuddyBoss and the club set bare h1-h6 colours), so
   it goes in at (0,0,2): beats a bare `h3`, loses to an authored `.card h3`. */
html :where(body.kc-academy-screen .site-main) :is(h1, h2, h3, h4),
body.kc-academy-screen .entry-title,
body.kc-academy-screen .mpcs-section-title,
body.kc-academy-screen .mpcs-section-title-text {
    color: #fff;
    font-family: var(--kca-display);
}
/* Block buttons (.wp-block-button__link) are excluded: on the landing they sit on
   a gold gradient and this rule was painting their text gold too. */
body.kc-academy-screen .site-main a:not(.kc-acad-btn):not(.mpcs-button):not(.button):not(.kc-acad-nav a):not(.wp-block-button__link) { color: var(--kca-cyan); }
body.kc-academy-screen .site-main a:not(.kc-acad-btn):not(.kc-acad-nav a):not(.wp-block-button__link):hover { color: #fff; }

/* Curriculum: sections and lesson rows. */
body.kc-academy-screen .mpcs-section,
body.kc-academy-screen .mpcs-sidebar-wrapper,
body.kc-academy-screen .mpcs-main-content .card,
body.kc-academy-screen .tile,
body.kc-academy-screen .mpcs-instructor {
    background: var(--kca-panel) !important;
    border: 1px solid var(--kca-line) !important;
    border-radius: 16px;
    color: var(--kca-text);
}
body.kc-academy-screen .mpcs-section-header {
    background: var(--kca-panel-2) !important;
    border-bottom: 1px solid var(--kca-line);
    border-radius: 16px 16px 0 0;
    color: #fff;
}
body.kc-academy-screen .mpcs-section-description { color: var(--kca-muted); }
body.kc-academy-screen .mpcs-lesson,
body.kc-academy-screen .mpcs-lesson-row-link {
    background: transparent !important;
    border-color: var(--kca-line) !important;
    color: var(--kca-text) !important;
}
body.kc-academy-screen .mpcs-lesson:hover,
body.kc-academy-screen .mpcs-lesson-row-link:hover { background: rgba(7, 215, 252, 0.06) !important; }
body.kc-academy-screen .mpcs-lesson-current { background: rgba(7, 215, 252, 0.1) !important; }
body.kc-academy-screen .mpcs-lesson-link,
body.kc-academy-screen .mpcs-lesson-link a { color: var(--kca-text) !important; }
body.kc-academy-screen .mpcs-lesson-complete .mpcs-lesson-icon,
body.kc-academy-screen .mpcs-ok-circled { color: var(--kca-teal); }
body.kc-academy-screen .mpcs-lesson-locked .mpcs-lesson-icon,
body.kc-academy-screen .mpcs-lesson-locked-tooltip { color: var(--kca-muted); }
body.kc-academy-screen .mpcs-lesson-locked-message,
body.kc-academy-screen .mpcs-lesson-locked-header { color: var(--kca-text); }

/* Progress */
body.kc-academy-screen .mpcs-progress-bar,
body.kc-academy-screen .progress {
    background: rgba(228, 233, 242, 0.08) !important;
    border-radius: 100px;
}
body.kc-academy-screen .mpcs-progress-bar .progress-bar,
body.kc-academy-screen .progress .progress-bar,
body.kc-academy-screen .mpcs-progress-ring circle:last-child { background: var(--kca-cyan) !important; stroke: var(--kca-cyan); }
body.kc-academy-screen .mpcs-progress-bar-title { color: var(--kca-muted); font-family: var(--kca-mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }

/* Buttons (Start / Continue / Complete lesson / Previous / Next) */
body.kc-academy-screen .mpcs-button,
body.kc-academy-screen .btn.btn-primary,
body.kc-academy-screen .mpcs-main-content .btn,
body.kc-academy-screen #buddypress .mpcs-button {
    background: var(--kca-cyan) !important;
    color: var(--kca-on-accent, var(--kca-bg-deep)) !important;
    border: 0 !important;
    border-radius: 999px !important;
    font-weight: 700;
    padding: 12px 20px;
}
body.kc-academy-screen .mpcs-button:hover { filter: brightness(1.08); }
/* .mpcs-lesson-button is the row's WRAPPER div in every template (BuddyBoss Pro's and the
   plugin's own), never the button — see the curriculum block at the end of this file. */
body.kc-academy-screen .btn.btn-link { color: var(--kca-cyan) !important; background: transparent !important; }

/* Locked-course overlay and breadcrumb */
body.kc-academy-screen .locked-course-overlay { background: rgba(5, 7, 12, 0.85) !important; color: var(--kca-text); border-radius: 16px; }
body.kc-academy-screen .mpcs-breadcrumb,
body.kc-academy-screen .mpcs-breadcrumb a { color: var(--kca-muted) !important; font-family: var(--kca-mono); font-size: 12.5px; }
body.kc-academy-screen .mpcs-breadcrumb a:hover { color: var(--kca-cyan) !important; }

/* Course archive cards */
body.kc-academy-screen .mpcs-card-wrapper .card,
body.kc-academy-screen .mpcs-card-wrapper .card-body,
body.kc-academy-screen .mpcs-card-wrapper .card-footer {
    background: var(--kca-panel) !important;
    border-color: var(--kca-line) !important;
    color: var(--kca-text);
}
body.kc-academy-screen .mpcs-card-wrapper .card-title,
body.kc-academy-screen .mpcs-card-wrapper .card-title a { color: #fff !important; }
body.kc-academy-screen .mpcs-course-filter .form-input,
body.kc-academy-screen .mpcs-course-filter select,
body.kc-academy-screen .mpcs-dropdown-search {
    background: var(--kca-panel) !important;
    border: 1px solid var(--kca-line) !important;
    color: var(--kca-text) !important;
}

/* Quiz / assignment forms */
body.kc-academy-screen .mpcs-main-content input[type="text"],
body.kc-academy-screen .mpcs-main-content textarea,
body.kc-academy-screen .mpcs-main-content select {
    background: var(--kca-panel-2) !important;
    border: 1px solid var(--kca-line) !important;
    color: var(--kca-text) !important;
}
body.kc-academy-screen .mpcs-main-content .form-radio,
body.kc-academy-screen .mpcs-main-content .form-checkbox { color: var(--kca-text); }


/* ============================================================
   THE "KOMANDO ACADEMY" PAGE TEMPLATE (page-academy.php)
   Chrome-free, and re-tokened to the Academy LANDING page's
   palette (page 65485's in-page CSS): charcoal surfaces, gold
   accent, Inter/Sora. Everything .kc-acad* already reads the
   --kca-* tokens, so the dashboard shell, the offer card and the
   MemberPress form all follow with one override block. The light
   "High contrast" mode below is a second override.
   ============================================================ */
body.kc-academy-template {
    --kca-bg: #0A1220;
    --kca-bg-deep: #0C1017;
    --kca-panel: #111A28;
    --kca-panel-2: #0F1A2B;
    --kca-line: #1E2836;
    --kca-text: #E8EDF5;
    --kca-muted: #9BA8B9;
    --kca-muted-2: #7C8899;
    --kca-cyan: #F5A623;          /* the accent slot: gold here */
    --kca-on-accent: #20160A;
    --kca-gold: #F5A623;
    --kca-gold-2: #FFC45C;
}
body.kc-academy-template,
body.kc-academy-template #page,
body.kc-academy-template #content,
body.kc-academy-template .site-content,
body.kc-academy-template .content-area,
body.kc-academy-template .site-main {
    background: var(--kca-bg);
    color: var(--kca-text);
    font-family: var(--kca-body);
}
body.kc-academy-template .site-main { padding-bottom: 72px; }
body.kc-academy-template .kc-acad-btn--primary,
body.kc-academy-template .kc-acad-redeem button,
body.kc-academy-template .kc-acad__filter.is-selected {
    background: linear-gradient(180deg, var(--kca-gold-2), var(--kca-gold));
    box-shadow: 0 8px 26px -10px rgba(245, 166, 35, 0.65);
    border-radius: 10px;
}

/* ---- the nav (mirrors .kc-nav on the landing) ------------- */
.kc-acad-nav {
    background: var(--kca-bg-deep);
    border-bottom: 1px solid #1A222F;
    font-family: var(--kca-body);
}
.site-main > .kc-acad-nav:first-child { margin-top: -30px; }
.kc-acad-nav__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px 32px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px 30px;
}
.kc-acad-nav a { text-decoration: none; border-bottom: 0 !important; }
.kc-acad-nav__logo { flex: 0 0 70px; width: 70px; line-height: 0; }
.kc-acad-nav__logo img { display: block; width: 70px; height: auto; }
.kc-acad-nav__links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 34px; }
.kc-acad-nav__links a,
#buddypress .kc-acad-nav__links a { color: #D2DAE6; font-size: 16px; font-weight: 500; }
.kc-acad-nav__links a:hover { color: #fff; }
.kc-acad-nav__cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 22px; }
.kc-acad-nav__ghost,
#buddypress .kc-acad-nav__ghost { color: #D2DAE6; font-size: 16px; font-weight: 500; }
.kc-acad-nav__ghost:hover { color: #fff; }
.kc-acad-nav__enroll,
#buddypress .kc-acad-nav__enroll {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, var(--kca-gold-2, #FFC45C), var(--kca-gold, #F5A623));
    color: #20160A !important;
    font-weight: 700;
    font-size: 16px;
    padding: 14px 26px;
    border-radius: 10px;
    white-space: nowrap;
    box-shadow: 0 8px 26px -10px rgba(245, 166, 35, 0.65);
    transition: transform 150ms ease, box-shadow 150ms ease;
}
.kc-acad-nav__enroll:hover { transform: translateY(-1px); box-shadow: 0 12px 30px -8px rgba(245, 166, 35, 0.8); }
.kc-contrast-toggle,
#buddypress .kc-contrast-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 13px;
    border: 1px solid #526174;
    border-radius: 8px;
    background: #111A28;
    color: #fff;
    font-family: var(--kca-body);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: none;
}
.kc-contrast-toggle:hover { background: #172233; border-color: #6B7A8F; }
.kc-contrast-toggle:focus-visible { outline: 3px solid #FFC857; outline-offset: 3px; }
.kc-contrast-toggle__icon { font-size: 17px; line-height: 1; }
.kc-contrast-toggle__state { color: #AEB9C8; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; }

/* ---- the page column ------------------------------------- */
.kc-acad-page { max-width: 760px; margin: 0 auto; padding: 56px 24px 0; font-family: var(--kca-body); }
.kc-acad-page__kicker {
    font-family: var(--kca-mono);
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--kca-gold, var(--kca-cyan));
    margin: 0 0 10px !important;
}
.kc-acad-page__title,
body.kc-academy-template .site-main h1.kc-acad-page__title {
    font-family: var(--kca-display);
    font-size: clamp(30px, 4vw, 44px);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.12;
    color: #fff;
    margin: 0 0 28px;
}
.kc-acad-page > .kc-acad { max-width: none; }
body.kc-academy-dashboard .kc-acad-page { max-width: none; padding: 0; }
/* Same reasoning as the .site-main rules above: the block-built landing lives
   inside .kc-acad-page and styles its own badges and copy, so headings are a
   (0,0,2) default and p/li inherit. Labels keep a rule (the parent theme
   colours bare labels; nothing authored uses them). */
html :where(.kc-acad-page, body.kc-academy-template .site-main) :is(h1, h2, h3) { color: #fff; font-family: var(--kca-display); letter-spacing: -0.02em; }
html :where(.kc-acad-page) label { color: var(--kca-text); }
.kc-acad-page a:not(.kc-acad-btn):not(.wp-block-button__link) { color: var(--kca-gold, var(--kca-cyan)); }
@media (max-width: 800px) {
    .kc-acad-nav__inner { padding: 14px 18px; }
    .kc-acad-page { padding-top: 32px; }
}

/* ---- MemberPress checkout, in the landing's card style ------ */
body.kc-academy-screen .mp_wrapper,
body.kc-academy-screen .mepr-signup-form,
body.kc-academy-screen .mepr-checkout-container { color: var(--kca-text); font-family: var(--kca-body); }
body.kc-academy-template .kc-acad-page .mp_wrapper {
    background: var(--kca-panel);
    border: 1px solid var(--kca-line);
    border-radius: 20px;
    padding: 32px 28px;
}
body.kc-academy-screen .mp_wrapper .mp_price_str,
body.kc-academy-screen .mp_wrapper .mepr_price,
body.kc-academy-screen .mp_wrapper table,
body.kc-academy-screen .mp_wrapper .mepr-invoice,
body.kc-academy-screen .mp_wrapper .mepr-price-box {
    background: var(--kca-panel-2) !important;
    border: 1px solid var(--kca-line) !important;
    border-radius: 12px;
    color: var(--kca-text) !important;
}
body.kc-academy-screen .mp_wrapper table td,
body.kc-academy-screen .mp_wrapper table th { border-color: var(--kca-line) !important; color: var(--kca-text) !important; background: transparent !important; }
body.kc-academy-screen .mp_wrapper .mp-form-row { margin-bottom: 18px; }
body.kc-academy-screen .mp-form-label,
body.kc-academy-screen .mp-form-label label,
body.kc-academy-screen .mp_wrapper label {
    color: var(--kca-muted) !important;
    font-family: var(--kca-mono);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
body.kc-academy-screen .mp_wrapper .mepr-form-input,
body.kc-academy-screen .mp_wrapper input[type="text"],
body.kc-academy-screen .mp_wrapper input[type="email"],
body.kc-academy-screen .mp_wrapper input[type="password"],
body.kc-academy-screen .mp_wrapper input[type="tel"],
body.kc-academy-screen .mp_wrapper select,
body.kc-academy-screen .mp_wrapper textarea,
#buddypress body.kc-academy-screen .mp_wrapper .mepr-form-input {
    background: var(--kca-bg) !important;
    border: 1px solid #26313F !important;
    color: var(--kca-text) !important;
    border-radius: 10px !important;
    padding: 13px 14px !important;
    font-size: 16px !important;
    box-shadow: none !important;
}
body.kc-academy-screen .mp_wrapper .mepr-form-input:focus,
body.kc-academy-screen .mp_wrapper select:focus { border-color: var(--kca-gold, var(--kca-cyan)) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(245, 166, 35, 0.2) !important; }
body.kc-academy-screen .mp_wrapper ::-moz-placeholder { color: var(--kca-muted-2); }
body.kc-academy-screen .mp_wrapper ::placeholder { color: var(--kca-muted-2); }
body.kc-academy-screen .mp_wrapper .mepr-submit,
body.kc-academy-screen .mp_wrapper input[type="submit"],
body.kc-academy-screen .mp_wrapper button[type="submit"],
#buddypress body.kc-academy-screen .mp_wrapper .mepr-submit {
    background: linear-gradient(180deg, var(--kca-gold-2, #FFC45C), var(--kca-gold, #F5A623)) !important;
    color: #20160A !important;
    border: 0 !important;
    border-radius: 10px !important;
    padding: 14px 28px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    font-family: var(--kca-body);
    box-shadow: 0 8px 26px -10px rgba(245, 166, 35, 0.65);
    cursor: pointer;
    transition: transform 150ms ease;
}
body.kc-academy-screen .mp_wrapper .mepr-submit:hover { transform: translateY(-1px); }
body.kc-academy-screen .mp_wrapper .mepr_error,
body.kc-academy-screen .mp_wrapper .mepr-form-has-errors { color: var(--kca-coral) !important; background: rgba(255, 107, 93, 0.1) !important; border-color: rgba(255, 107, 93, 0.4) !important; }
body.kc-academy-screen .mp_wrapper a { color: var(--kca-gold, var(--kca-cyan)); }
body.kc-academy-screen .mepr-unauthorized-message { background: var(--kca-panel); border: 1px solid var(--kca-line); border-radius: 16px; padding: 18px 22px; color: var(--kca-text); }
body.kc-academy-screen .mepr-unauthorized-message p { color: var(--kca-text); margin: 0 !important; }

/* ---- High contrast (light) — the landing's toggle, same key ---- */
body.kc-academy-template.kc-high-contrast {
    color-scheme: light;
    --kca-bg: #FFFFFF;
    --kca-bg-deep: #FFFFFF;
    --kca-panel: #FFFFFF;
    --kca-panel-2: #FFFFFF;
    --kca-line: #000000;
    --kca-text: #000000;
    --kca-muted: #222222;
    --kca-muted-2: #333333;
    --kca-cyan: #000000;
    --kca-gold: #000000;
    --kca-gold-2: #000000;
    --kca-on-accent: #FFFFFF;
    --kca-teal: #0B6B48;
    --kca-coral: #B3261E;
}
body.kc-academy-template.kc-high-contrast .kc-acad-nav { border-bottom: 2px solid #000; }
body.kc-academy-template.kc-high-contrast .kc-acad-nav__logo img { filter: brightness(0); }
body.kc-academy-template.kc-high-contrast .kc-acad-nav__links a,
body.kc-academy-template.kc-high-contrast .kc-acad-nav__ghost { color: #003F9E !important; text-decoration: underline !important; text-decoration-thickness: 2px; text-underline-offset: 3px; }
body.kc-academy-template.kc-high-contrast .kc-acad-nav__enroll,
body.kc-academy-template.kc-high-contrast .kc-acad-btn--primary,
body.kc-academy-template.kc-high-contrast .kc-acad-redeem button,
body.kc-academy-template.kc-high-contrast .mp_wrapper .mepr-submit,
body.kc-academy-template.kc-high-contrast .mp_wrapper input[type="submit"] {
    background: #000 !important;
    color: #fff !important;
    border: 2px solid #000 !important;
    box-shadow: none !important;
}
body.kc-academy-template.kc-high-contrast .kc-acad-btn--ghost { color: #000; border: 2px solid #000; }
body.kc-academy-template.kc-high-contrast .kc-contrast-toggle { background: #fff !important; color: #000 !important; border: 2px solid #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-contrast-toggle * { color: #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-acad-page a:not(.kc-acad-btn):not(.wp-block-button__link),
body.kc-academy-template.kc-high-contrast .mp_wrapper a { color: #003F9E !important; text-decoration: underline; }
body.kc-academy-template.kc-high-contrast .kc-acad-page .mp_wrapper,
body.kc-academy-template.kc-high-contrast .kc-acad__card,
body.kc-academy-template.kc-high-contrast .kc-acad__continue,
body.kc-academy-template.kc-high-contrast .kc-acad__cert,
body.kc-academy-template.kc-high-contrast .kc-acad__benefit,
body.kc-academy-template.kc-high-contrast .kc-acad-certs__item,
body.kc-academy-template.kc-high-contrast .kc-acad-certs__empty,
body.kc-academy-template.kc-high-contrast .kc-acad-offer,
body.kc-academy-template.kc-high-contrast .mepr-unauthorized-message { border: 2px solid #000 !important; box-shadow: none !important; }
body.kc-academy-template.kc-high-contrast .mp_wrapper .mepr-form-input,
body.kc-academy-template.kc-high-contrast .mp_wrapper select { border: 2px solid #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-acad__sidebar { border-right: 2px solid #000; }
body.kc-academy-template.kc-high-contrast .kc-acad__card-visual { background: #fff !important; color: #000; border-bottom: 2px solid #000; }
body.kc-academy-template.kc-high-contrast .kc-acad__card-visual span,
body.kc-academy-template.kc-high-contrast .kc-acad__card-visual em { color: #000; text-shadow: none; background: #fff; border: 1px solid #000; }
body.kc-academy-template.kc-high-contrast .kc-acad__progress-track { background: #D1D5DB; }
body.kc-academy-template.kc-high-contrast .kc-acad__progress-fill { background: #9A4D00; }
body.kc-academy-template.kc-high-contrast .kc-acad-certs__item.is-expired { opacity: 1; }
body.kc-academy-template.kc-high-contrast .kc-acad-certs__note { color: #7A3E00; }
body.kc-academy-template.kc-high-contrast .kc-acad__cert-seal { color: #000; border-color: #000; }
body.kc-academy-template.kc-high-contrast :where(h1, h2, h3, h4, p, li, span, strong, em, label) { color: #000; text-shadow: none; }
body.kc-academy-template.kc-high-contrast :where(a, button):focus-visible { outline: 4px solid #005FCC !important; outline-offset: 4px !important; }

/* Second pass after the first screenshot (2026-09-17): the parent theme gives
   MemberPress's <form class="mepr-signup-form"> its own white card, and the
   .site-main link repaint above (0,2,2) outranked the nav's link colour. */
body.kc-academy-template .mp_wrapper form,
body.kc-academy-template .mepr-signup-form,
body.kc-academy-template #mepr_signup_form,
body.kc-academy-template .mp_wrapper .mepr-form,
body.kc-academy-template .mp_wrapper > div:not(.mp-form-row) {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}
body.kc-academy-template .site-main .kc-acad-nav__links a,
body.kc-academy-template .site-main .kc-acad-nav__ghost { color: #D2DAE6; }
body.kc-academy-template .site-main .kc-acad-nav__links a:hover,
body.kc-academy-template .site-main .kc-acad-nav__ghost:hover { color: #fff; }
body.kc-academy-template.kc-high-contrast .site-main .kc-acad-nav__links a,
body.kc-academy-template.kc-high-contrast .site-main .kc-acad-nav__ghost { color: #003F9E; }
/* The white card is BuddyBoss's own wrapper around the fields
   (assets/css/memberpress.css: .bb-mp-checkout-details), not the form. */
body.kc-academy-template .bb-mp-checkout-details,
body.kc-academy-template .bb-mp-checkout-details > div,
body.kc-academy-template .mp_wrapper .mepr-checkout-container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}
/* High contrast: the heading rules above set #fff with real specificity, which
   the zero-specificity :where() reset cannot beat. */
body.kc-academy-template.kc-high-contrast .site-main h1,
body.kc-academy-template.kc-high-contrast .site-main h2,
body.kc-academy-template.kc-high-contrast .site-main h3,
body.kc-academy-template.kc-high-contrast .kc-acad-page__title,
body.kc-academy-template.kc-high-contrast .kc-acad-page__kicker,
body.kc-academy-template.kc-high-contrast .kc-acad__kicker,
body.kc-academy-template.kc-high-contrast .kc-acad__brand-the,
body.kc-academy-template.kc-high-contrast .kc-acad__brand-academy { color: #000 !important; }

/* ---- form details after Charles's second look (2026-09-17) ---- */
/* Selects: the parent theme fixes their height, so a 16px face with our padding
   clipped the text. Height follows the padding, native arrow replaced. */
body.kc-academy-screen .mp_wrapper select,
body.kc-academy-screen .mp_wrapper .mepr-form-input,
body.kc-academy-screen .mp_wrapper input[type="text"],
body.kc-academy-screen .mp_wrapper input[type="email"],
body.kc-academy-screen .mp_wrapper input[type="password"],
body.kc-academy-screen .mp_wrapper input[type="tel"] {
    height: auto !important;
    min-height: 50px !important;
    line-height: 1.3 !important;
    width: 100%;
}
/* (0,4,1): the input block above sets the background SHORTHAND with !important at
   (0,3,1), and the minifier does not keep source order between the two. */
body.kc-academy-screen .mp_wrapper .mp-form-row select,
body.kc-academy-screen .mp_wrapper select.mepr-form-input {
    -webkit-appearance: none;
    -moz-appearance: none;
         appearance: none;
    padding-right: 44px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23F5A623' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    background-size: 14px 9px !important;
    cursor: pointer;
}
body.kc-academy-screen .mp_wrapper select option { background: #0A1220; color: #E8EDF5; }
body.kc-academy-template.kc-high-contrast .mp_wrapper .mp-form-row select,
body.kc-academy-template.kc-high-contrast .mp_wrapper select.mepr-form-input {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}
body.kc-academy-template.kc-high-contrast .mp_wrapper select option { background: #fff; color: #000; }

/* The submit row. MemberPress's JS disables the button and .show()s an old
   wp-admin loading.gif beside it on submit; the gif goes, and the disabled
   button carries its own spinner instead. */
body.kc-academy-screen .mp_wrapper .mp-form-submit {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 8px;
}
body.kc-academy-screen .mp_wrapper img.mepr-loading-gif { display: none !important; }
body.kc-academy-screen .mp_wrapper .mepr-submit:disabled,
body.kc-academy-screen .mp_wrapper input[type="submit"]:disabled {
    opacity: 0.75;
    cursor: progress;
    transform: none !important;
}
body.kc-academy-screen .mp_wrapper .mp-form-submit:has(.mepr-submit:disabled)::after {
    content: "";
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 3px solid rgba(245, 166, 35, 0.25);
    border-top-color: var(--kca-gold, #F5A623);
    animation: kc-acad-spin 0.8s linear infinite;
    flex: 0 0 auto;
}
body.kc-academy-template.kc-high-contrast .mp_wrapper .mp-form-submit:has(.mepr-submit:disabled)::after {
    border-color: #D1D5DB;
    border-top-color: #000;
}
body.kc-academy-screen .mp_wrapper .mepr-form-has-errors { flex-basis: 100%; }
@keyframes kc-acad-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    body.kc-academy-screen .mp_wrapper .mp-form-submit:has(.mepr-submit:disabled)::after { animation: none; border-top-color: transparent; border-right-color: var(--kca-gold, #F5A623); }
}

/* ---- the Academy footer (mirrors .kc-footer on the landing) -- */
.kc-acad-footer {
    background: #070C14;
    border-top: 1px solid #141D2B;
    padding: 40px 32px;
    margin-top: 72px;
    font-family: var(--kca-body);
    text-align: center;
}
body.kc-academy-template .site-main { padding-bottom: 0; }
.kc-acad-footer__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding-bottom: 26px;
    border-bottom: 1px solid #141D2B;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 20px 32px;
}
.kc-acad-footer a { text-decoration: none; border-bottom: 0 !important; }
.kc-acad-footer__logo { flex: 0 0 60px; width: 60px; line-height: 0; }
.kc-acad-footer__logo img { display: block; width: 60px; height: auto; }
.kc-acad-footer__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; }
.kc-acad-footer__links a,
body.kc-academy-template .site-main .kc-acad-footer__links a { color: #9BA8B9; font-size: 14.5px; white-space: nowrap; }
.kc-acad-footer__links a:hover { color: #fff; }
.kc-acad-footer__fine { margin: 24px 0 0 !important; font-size: 13.5px; color: #9BA8B9; } /* was #5D6979 (3.5:1) — only ever looked right because the old .site-main p rule overrode it */
body.kc-academy-template.kc-high-contrast .kc-acad-footer { background: #fff; border-top: 2px solid #000; }
body.kc-academy-template.kc-high-contrast .kc-acad-footer__inner { border-bottom-color: #000; }
body.kc-academy-template.kc-high-contrast .kc-acad-footer__logo img { filter: brightness(0); }
body.kc-academy-template.kc-high-contrast .kc-acad-footer__links a { color: #003F9E; text-decoration: underline; }
body.kc-academy-template.kc-high-contrast .kc-acad-footer__fine { color: #000; }
/* The Sign Up control is an <input type="submit">: the parent theme's fixed
   height plus our padding pushed the label off centre. An input centres its
   label when line-height equals height, so set both and drop the padding. */
body.kc-academy-screen .mp_wrapper .mp-form-submit .mepr-submit,
body.kc-academy-screen .mp_wrapper .mp-form-submit input[type="submit"] {
    height: 50px !important;
    line-height: 50px !important;
    padding: 0 28px !important;
    margin: 0 !important;
    vertical-align: middle;
}

/* ---- club-shaped nav: current link, avatar menu (2026-09-17) ---- */
.kc-acad-nav__links a.is-current,
body.kc-academy-template .site-main .kc-acad-nav__links a.is-current { color: #fff; }
.kc-acad-user { position: relative; }
.kc-acad-user__btn,
#buddypress .kc-acad-user__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 8px 3px 3px;
    border: 1px solid #526174;
    border-radius: 999px;
    background: #111A28;
    color: #fff;
    cursor: pointer;
    line-height: 0;
}
.kc-acad-user__btn:hover { border-color: #fff; }
.kc-acad-user__btn:focus-visible { outline: 3px solid #FFC857; outline-offset: 3px; }
.kc-acad-user__avatar { width: 36px; height: 36px; border-radius: 50%; overflow: hidden; display: block; background: #0A1220; }
.kc-acad-user__avatar img { width: 36px; height: 36px; display: block; border-radius: 50%; -o-object-fit: cover; object-fit: cover; }
.kc-acad-user__caret { font-size: 12px; line-height: 1; color: #AEB9C8; }
.kc-acad-user__menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 220px;
    background: #111A28;
    border: 1px solid #26313F;
    border-radius: 14px;
    padding: 8px;
    box-shadow: 0 24px 60px -20px rgba(0, 0, 0, 0.7);
    z-index: 60;
    display: flex;
    flex-direction: column;
}
.kc-acad-user__menu[hidden] { display: none; }
.kc-acad-user__who { padding: 8px 12px 10px; border-bottom: 1px solid #1E2836; margin-bottom: 6px; display: flex; flex-direction: column; }
.kc-acad-user__who strong { color: #fff; font-size: 14.5px; }
.kc-acad-user__who span { color: #9BA8B9; font-size: 12.5px; }
.kc-acad-user__menu a[role="menuitem"],
body.kc-academy-template .site-main .kc-acad-user__menu a[role="menuitem"] {
    display: block;
    padding: 10px 12px;
    border-radius: 9px;
    color: #E8EDF5;
    font-size: 14.5px;
    font-weight: 500;
}
.kc-acad-user__menu a[role="menuitem"]:hover { background: #1A2637; color: #fff; }
.kc-acad-user__logout,
body.kc-academy-template .site-main .kc-acad-user__menu a.kc-acad-user__logout { color: #FFC45C; margin-top: 4px; border-top: 1px solid #1E2836; border-radius: 0 0 9px 9px; }
body.kc-academy-template.kc-high-contrast .kc-acad-user__btn { background: #fff; border: 2px solid #000; }
body.kc-academy-template.kc-high-contrast .kc-acad-user__menu { background: #fff; border: 2px solid #000; box-shadow: none; }
body.kc-academy-template.kc-high-contrast .kc-acad-user__menu a[role="menuitem"] { color: #003F9E !important; text-decoration: underline; }
body.kc-academy-template.kc-high-contrast .kc-acad-user__who strong,
body.kc-academy-template.kc-high-contrast .kc-acad-user__who span,
body.kc-academy-template.kc-high-contrast .kc-acad-user__caret { color: #000; }

/* ---- dashboard without the sidebar --------------------------- */
.kc-acad { min-height: 0; }
.kc-acad__main { max-width: 1200px; margin: 0 auto; padding: 40px 32px 60px; }
.kc-acad__welcome { align-items: stretch; }
.kc-acad__welcome-copy { flex: 1 1 auto; min-width: 0; }
.kc-acad__welcome .kc-acad__benefit { flex: 0 0 320px; max-width: 320px; margin: 0; }
@media (max-width: 1000px) {
    .kc-acad__main { padding: 28px 18px 48px; }
    .kc-acad__welcome .kc-acad__benefit { flex-basis: auto; max-width: none; width: 100%; }
}

/* ---- MemberPress account inside the Academy template --------- */
body.kc-academy-template .kc-acad-page .bb-mp-account-settings,
body.kc-academy-template .kc-acad-page .mp_wrapper.mp_wrapper_nav,
body.kc-academy-template .kc-acad-page .mp_wrapper.mp_invoice,
body.kc-academy-template .kc-acad-page .mepr-account-table {
    background: var(--kca-panel) !important;
    border-color: var(--kca-line) !important;
    color: var(--kca-text) !important;
    box-shadow: none !important;
}
body.kc-academy-template .kc-acad-page .mepr-nav-item a,
body.kc-academy-template .site-main .mepr-nav-item a { color: var(--kca-muted); font-weight: 600; }
body.kc-academy-template .kc-acad-page .mepr-nav-item a:hover,
body.kc-academy-template .kc-acad-page .mepr-nav-item.mepr-active-nav-tab a,
body.kc-academy-template .site-main .mepr-nav-item.mepr-active-nav-tab a { color: var(--kca-gold, var(--kca-cyan)); }
body.kc-academy-template .kc-acad-page .mepr-account-table th,
body.kc-academy-template .kc-acad-page .mepr-account-table td { border-color: var(--kca-line) !important; background: transparent !important; color: var(--kca-text) !important; }
body.kc-academy-template .kc-acad-page .mepr-alt-row td { background: var(--kca-panel-2) !important; }
body.kc-academy-template .kc-acad-page .mepr-no-active-subscriptions,
body.kc-academy-template .kc-acad-page .mp-no-subs { color: var(--kca-muted); }
/* Wider column for the account tables than for the checkout form. */
body.kc-academy-template.kc-academy-account .kc-acad-page { max-width: 980px; }

/* ---- the account page, second pass (Charles: "cards need a gap", the MemberPress
   nav stacked as grey rows with an invisible active item, Forum Profile pointing
   at the club profile). Tabs become pills, the two club-facing items go. ---- */
body.kc-academy-account .kc-acad-page > .mp_wrapper + .mp_wrapper,
body.kc-academy-account .kc-acad-page .mp_wrapper + .mp_wrapper { margin-top: 24px !important; }
body.kc-academy-account .kc-acad-page .mp_wrapper.mp_wrapper_nav {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}
body.kc-academy-account #mepr-account-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}
body.kc-academy-account #mepr-account-nav .mepr-nav-item {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    list-style: none;
}
body.kc-academy-account #mepr-account-nav .mepr-nav-item a,
body.kc-academy-template .site-main #mepr-account-nav .mepr-nav-item a {
    display: inline-block;
    padding: 10px 18px;
    border-radius: 999px;
    border: 1px solid #26313F;
    background: var(--kca-panel);
    color: var(--kca-muted);
    font-size: 14.5px;
    font-weight: 600;
    text-decoration: none;
}
body.kc-academy-account #mepr-account-nav .mepr-nav-item a:hover { color: #fff; border-color: #3E4C5E; }
body.kc-academy-account #mepr-account-nav .mepr-nav-item.mepr-active-nav-tab a,
body.kc-academy-template .site-main #mepr-account-nav .mepr-active-nav-tab a {
    background: linear-gradient(180deg, var(--kca-gold-2, #FFC45C), var(--kca-gold, #F5A623));
    border-color: transparent;
    color: #20160A;
}
/* "Forum Profile" is the BuddyPress profile (forbidden here); "Log Out" lives in
   the avatar menu. */
body.kc-academy-account #mepr-account-nav .mepr_bbpress_subscriptions,
body.kc-academy-account #mepr-account-nav .mepr-nav-item:has(#mepr-account-logout) { display: none !important; }

/* Tables: a card each, header row in mono caps, no zebra bleed. */
body.kc-academy-account .kc-acad-page .mp_wrapper-table-wrapper { overflow-x: auto; }
body.kc-academy-account .kc-acad-page .mepr-account-table,
body.kc-academy-template .kc-acad-page .mepr-account-table {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0;
    background: var(--kca-panel) !important;
    border: 1px solid var(--kca-line) !important;
    border-radius: 16px !important;
    overflow: hidden;
    margin: 0 !important;
}
body.kc-academy-account .kc-acad-page .mepr-account-table th {
    font-family: var(--kca-mono);
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--kca-muted) !important;
    background: var(--kca-panel-2) !important;
    padding: 14px 18px !important;
    border-bottom: 1px solid var(--kca-line) !important;
    text-align: left;
}
body.kc-academy-account .kc-acad-page .mepr-account-table td {
    padding: 16px 18px !important;
    vertical-align: top;
    border-bottom: 1px solid var(--kca-line) !important;
}
body.kc-academy-account .kc-acad-page .mepr-account-table tr:last-child td { border-bottom: 0 !important; }
body.kc-academy-account .kc-acad-page .mepr-account-product { color: #fff; font-weight: 700; }
body.kc-academy-account .kc-acad-page .mepr-account-subscr-id { font-family: var(--kca-mono); font-size: 12px; color: var(--kca-muted-2); margin-top: 4px; }
body.kc-academy-account .kc-acad-page .mepr-active { color: var(--kca-teal); font-weight: 700; }
body.kc-academy-account .kc-acad-page .mepr-account-actions a { color: var(--kca-gold, var(--kca-cyan)); }
/* MemberPress's own form (Home tab) inside the card style. */
body.kc-academy-account .kc-acad-page .mp_wrapper:not(.mp_wrapper_nav) {
    background: var(--kca-panel);
    border: 1px solid var(--kca-line);
    border-radius: 20px;
    padding: 24px 28px;
}
body.kc-academy-account .kc-acad-page .mp_wrapper.mp_wrapper_subscriptions,
body.kc-academy-account .kc-acad-page .mp_wrapper.mp_wrapper_payments { background: transparent; border: 0; padding: 0; }
body.kc-academy-template.kc-high-contrast #mepr-account-nav .mepr-nav-item a { background: #fff; color: #003F9E; border: 2px solid #000; text-decoration: underline; }
body.kc-academy-template.kc-high-contrast #mepr-account-nav .mepr-active-nav-tab a { background: #000; color: #fff; }
body.kc-academy-template.kc-high-contrast .kc-acad-page .mepr-account-table,
body.kc-academy-template.kc-high-contrast .kc-acad-page .mp_wrapper:not(.mp_wrapper_nav) { border: 2px solid #000 !important; }

/* ---- the block-built landing on the Academy template (2026-09-17) ----
   Page 65485 carries its own nav (.kc-nav) and footer (.kc-footer) as blocks,
   with a static "Log in / Enroll now". On this template the live nav and
   footer print around it, so the block copies are hidden and the column runs
   full width. The WPCode toggle snippet injects into the hidden block nav,
   which is harmless; ours is the one that shows. */
body.kc-academy-landing .kc-acad-page { max-width: none; padding: 0; }
body.kc-academy-landing .kc-academy > .kc-nav,
body.kc-academy-landing .kc-academy .kc-nav.kc-nav__inner,
body.kc-academy-landing .kc-academy > .kc-footer { display: none !important; }
/* The landing's sections already paint their own backgrounds; keep the page
   behind them the same charcoal so nothing peeks through between sections. */
body.kc-academy-landing .site-main { background: #0A1220; }
body.kc-academy-landing .kc-acad-footer { margin-top: 0; }

/* ---- shell fixes from the landing (2026-09-17) ---------------------
   1. The parent theme's overflow-x:hidden on body/#page computes overflow-y to
      auto and makes #page a second scroll container (the club landing hits the
      same thing — docs/page-templates.md). clip does not do that.
   2. The -30px pull-ups above assumed .site-main's 30px top padding; the landing's
      own :has() rules zero it, so the nav was clipped. Zero the padding on the
      template instead and stop pulling. */
body.kc-academy-template,
body.kc-academy-template #page {
    overflow-x: clip !important;
    overflow-y: visible !important;
}
body.kc-academy-template .content-area,
body.kc-academy-template .site-main { padding-top: 0 !important; }
body.kc-academy-template .site-main > .kc-acad-nav:first-child,
body.kc-academy-template .site-main > .kc-acad:first-child { margin-top: 0; }

/* ---- card legibility (Charles's screenshot, 2026-09-17) ------------
   The ghost button is an <a>, so the parent theme's link colour (a .site-main
   rule with more weight than one class) painted "Buy · $29.00" navy on navy. */
body.kc-academy-screen .kc-acad-btn--ghost,
body.kc-academy-screen .site-main a.kc-acad-btn--ghost,
body.kc-academy-template .site-main a.kc-acad-btn--ghost,
#buddypress .kc-acad-btn--ghost {
    color: var(--kca-text) !important;
    border-color: rgba(245, 166, 35, 0.55) !important;
    background: rgba(245, 166, 35, 0.08) !important;
}
body.kc-academy-screen .kc-acad-btn--ghost:hover,
body.kc-academy-template .site-main a.kc-acad-btn--ghost:hover { color: var(--kca-gold, #F5A623) !important; border-color: var(--kca-gold, #F5A623) !important; }
body.kc-academy-screen .kc-acad-btn--ghost.is-disabled { color: var(--kca-muted) !important; border-color: var(--kca-line) !important; background: transparent !important; }
/* The card's visual is the featured image when the course has one; without one,
   a placeholder — charcoal with a gold hairline, not the mock's teal. */
body.kc-academy-template .kc-acad__card-visual {
    background: linear-gradient(160deg, #1E2836 0%, #0F1A2B 100%) center / cover no-repeat;
    border-bottom: 2px solid rgba(245, 166, 35, 0.6);
}
body.kc-academy-template .kc-acad__card-visual[style*="background-image"] { border-bottom: 0; }

/* ---- /courses on the Academy shell (archive-mpcs-course.php, 2026-09-18) ----
   The dashboard's library partial, full width, under the shared nav. */
body.kc-academy-library .kc-acad--library .kc-acad__main { padding-top: 40px; }
body.kc-academy-library .kc-acad__welcome { margin-bottom: 26px; }
body.kc-academy-library .kc-acad__welcome h1 { font-size: clamp(30px, 3.6vw, 44px); }

/* ---- the course curriculum vs BuddyBoss Pro's LMS integration (2026-09-22) ----
   The curriculum on a course page is NOT MemberPress Courses' own template: BuddyBoss
   Platform Pro's "MemberPress LMS" integration swaps the view paths (mepr_view_paths,
   PHP_INT_MAX) and ships meprlms-frontend.css, whose selectors run four and five classes
   deep and read BuddyBoss's --bb-* theme colours. Three things it beat us on, all from
   Charles's K4dev screenshots:
   1. The lesson/quiz row button is TWO spans — <span class="mpcs-button"><span class="btn
      btn-green is-purple">Start</span></span> (quiz rows nest .mpcs-button inside
      .mpcs-button). We painted the outer one as the accent pill; BB's
      `.mpcs-section .mpcs-lessons .mpcs-lesson-button .mpcs-button>span` (0,5,1) painted
      the inner one BuddyBoss primary-button blue — the "rectangle inside the button".
      Now only the innermost span is the pill and the outer is transparent.
   2. The module title: `.mpcs-main .mpcs-section .mpcs-section-header .mpcs-section-title-text`
      (0,4,0) sets --bb-headings-color, navy — on our dark header. Ours was (0,2,1).
   3. "Start Next Lesson" (`.course-curriculum:has(a)`) is BB's white bar with a blue pill;
      in high contrast our :where(span){color:#000} blackened the pill's label on the pill.
   Every rule here carries !important and at least one more class than BB's. */
body.kc-academy-screen .mpcs-lesson .mpcs-lesson-button,
body.kc-academy-screen .mpcs-lessons .mpcs-lesson-button,
body.kc-academy-screen .mpcs-lesson-button .mpcs-button,
body.kc-academy-screen .mpcs-section .mpcs-lessons .mpcs-lesson-button .mpcs-button {
    display: inline-block;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    line-height: 1;
}
body.kc-academy-screen .mpcs-section .mpcs-lessons .mpcs-lesson-button .mpcs-button > span,
body.kc-academy-screen .mpcs-lesson-button .mpcs-button > .btn,
body.kc-academy-screen .mpcs-lesson-button .mpcs-button > .mpcs-button {
    display: inline-block !important;
    height: auto !important;
    background: var(--kca-cyan) !important;
    color: var(--kca-on-accent, #05070C) !important;
    border: 0 !important;
    border-radius: 999px !important;
    padding: 9px 18px !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0;
    text-decoration: none !important;
    white-space: nowrap;
}
/* "View" on a completed row: a ghost pill, not a second accent one. */
body.kc-academy-screen .mpcs-section .mpcs-lessons .mpcs-lesson-button .mpcs-button > span.is-outline,
body.kc-academy-screen .mpcs-lesson-button .mpcs-button > .is-outline {
    background: transparent !important;
    color: var(--kca-text) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28) !important;
}
body.kc-academy-screen .mpcs-lesson-row-link:hover .mpcs-lesson-button .mpcs-button > span { filter: brightness(1.08); }

/* Module (section) titles. */
body.kc-academy-screen .mpcs-section-header,
body.kc-academy-screen .mpcs-section-header .mpcs-section-title,
body.kc-academy-screen .mpcs-section-header .mpcs-section-title-text,
body.kc-academy-screen .mpcs-main .mpcs-section .mpcs-section-header .mpcs-section-title-text {
    color: #fff !important;
}
body.kc-academy-screen .mpcs-main .mpcs-section .mpcs-section-header .mpcs-section-title-text {
    font-family: var(--kca-display);
    font-size: 16px !important;
    font-weight: 700 !important;
}
body.kc-academy-screen .mpcs-section.mpcs-section-lessons .mpcs-section-header.active .mpcs-section-title { border-bottom-color: var(--kca-line) !important; }
body.kc-academy-screen .mpcs-section-header::after { border-top-color: var(--kca-muted) !important; border-bottom-color: var(--kca-muted) !important; }

/* "Start Next Lesson" bar. */
body.kc-academy-screen .course-curriculum:has(a) {
    background: var(--kca-panel) !important;
    color: var(--kca-text) !important;
    border: 1px solid var(--kca-line) !important;
}
body.kc-academy-screen .course-curriculum .mpcs-bookmark-link-title { color: var(--kca-text) !important; }
body.kc-academy-screen .course-curriculum:has(a) > a,
body.kc-academy-screen .site-main .course-curriculum:has(a) > a,
body.kc-academy-screen .course-curriculum:has(a) > a span,
body.kc-academy-screen .course-curriculum:has(a) > a i {
    background: var(--kca-cyan) !important;
    color: var(--kca-on-accent, #05070C) !important;
    text-decoration: none !important;
    font-weight: 700;
}
body.kc-academy-screen .course-curriculum:has(a) > a { padding: 8px 16px !important; }
body.kc-academy-screen .course-curriculum:has(a) > a span,
body.kc-academy-screen .course-curriculum:has(a) > a i { background: transparent !important; }
body.kc-academy-screen .course-curriculum:has(a) > a:hover { filter: brightness(1.08); }

/* ---- the course head card (.kc-course-header) --------------
   Jarett's block-editor group at the top of each course (reusable block 79971,
   "Komando Academy Head Card"; the copies in course content are DETACHED, so this
   CSS — not the block — is the single source of the look). Until 2026-10-06 it was
   painted from the Customizer's Additional CSS in the club's navy (#002664 gradient,
   cyan border, violet labels, 20px radius, drop shadow), which fought the Academy
   page it sits on. Now it is the Academy card recipe: --kca-panel, a --kca-line
   border, 18px radius, mono cyan kicker. Scoped to body.kc-academy-screen so it
   outranks the Customizer copy on any box where that field has not been cleared
   yet (the Customizer prints after enqueued styles, so equal specificity would
   lose), and every child rule repeats .kc-course-header as an ancestor, (0,3,0),
   because the screen repaint above — `body.kc-academy-screen .site-main p`,
   (0,2,1) — otherwise beats a lone (0,2,0) class and paints the kicker and the
   stat labels --kca-text. ⚠ On the Academy TEMPLATE the accent slot --kca-cyan
   is GOLD (the body.kc-academy-template token block), so the kicker, the stripe's
   first stop and the time label are gold there and cyan in club chrome; the
   version label is --kca-muted so it does not double the accent. The high-contrast block further down repaints it white on black.
   Gutenberg: the group is layout:constrained, the logo is a float-right figure
   (irrelevant — it is positioned absolutely) and the stats are a core columns
   block, which core stacks below 782px with flex-basis:100% !important; the
   paragraph margins carry !important because the theme's global p rule does. */
body.kc-academy-screen .kc-course-header {
    position: relative;
    overflow: hidden;
    background: var(--kca-panel);
    border: 1px solid var(--kca-line);
    border-radius: 18px;
    box-shadow: none;
    padding: 34px 36px 30px;
    margin: 0 0 32px;
    max-width: none;
    color: var(--kca-text);
    font-family: var(--kca-body);
}
body.kc-academy-screen .kc-course-header::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--kca-cyan), var(--kca-teal), var(--kca-coral));
}
body.kc-academy-screen .kc-course-header .kc-course-header__logo {
    position: absolute;
    top: 30px;
    right: 32px;
    width: 110px;
    height: auto;
    float: none;
    margin: 0;
}
body.kc-academy-screen .kc-course-header .kc-course-header__logo img { max-width: 100%; height: auto; display: block; }
body.kc-academy-screen .kc-course-header .kc-course-header__eyebrow {
    font-family: var(--kca-mono);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--kca-cyan);
    margin: 0 0 10px !important;
    padding-right: 140px;
}
body.kc-academy-screen .kc-course-header .kc-course-header__title {
    font-family: var(--kca-display);
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    margin: 0 0 8px;
    padding-right: 140px;
}
body.kc-academy-screen .kc-course-header .kc-course-header__tagline {
    font-family: var(--kca-body);
    font-size: 15px;
    line-height: 1.5;
    color: rgba(230, 233, 240, 0.72);
    margin: 0 0 24px !important;
    padding-right: 140px;
    max-width: 60ch;
}
body.kc-academy-screen .kc-course-header .kc-course-header__stats {
    display: flex;
    gap: 12px;
    margin: 0;
}
body.kc-academy-screen .kc-course-header .kc-course-header__stat {
    flex: 1 1 0;
    min-width: 0;
    background: var(--kca-panel-2);
    border: 1px solid var(--kca-line);
    border-radius: 14px;
    padding: 16px 18px;
}
body.kc-academy-screen .kc-course-header .kc-course-header__stat-label {
    display: block;
    font-family: var(--kca-mono);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--kca-cyan);
    margin: 0 0 6px !important;
}
body.kc-academy-screen .kc-course-header .kc-course-header__stat--time .kc-course-header__stat-label { color: var(--kca-cyan); }
body.kc-academy-screen .kc-course-header .kc-course-header__stat--quiz .kc-course-header__stat-label { color: var(--kca-teal); }
body.kc-academy-screen .kc-course-header .kc-course-header__stat--version .kc-course-header__stat-label { color: var(--kca-muted); }
body.kc-academy-screen .kc-course-header .kc-course-header__stat-value {
    font-family: var(--kca-display);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    color: #fff;
    margin: 0 !important;
}
body.kc-academy-screen .kc-course-header .kc-course-header__stat--quiz .kc-course-header__stat-value { display: inline-flex; align-items: center; gap: 6px; }
body.kc-academy-screen .kc-course-header .kc-course-header__badge {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--kca-teal);
}
@media (max-width: 640px) {
    body.kc-academy-screen .kc-course-header { padding: 26px 20px 22px; }
    body.kc-academy-screen .kc-course-header .kc-course-header__logo { position: static; width: 84px; margin: 0 0 14px; }
    body.kc-academy-screen .kc-course-header .kc-course-header__eyebrow,
    body.kc-academy-screen .kc-course-header .kc-course-header__title,
    body.kc-academy-screen .kc-course-header .kc-course-header__tagline { padding-right: 0; }
    body.kc-academy-screen .kc-course-header .kc-course-header__title { font-size: 24px; }
    body.kc-academy-screen .kc-course-header .kc-course-header__stats { flex-direction: column; }
}

/* High contrast: black pills with white labels, black titles, and the block-built head
   card (.kc-course-header, base rules just above) goes white with a
   black border — the :where(){color:#000} sweep had made its text black on navy. */
body.kc-academy-template.kc-high-contrast .mpcs-section .mpcs-lessons .mpcs-lesson-button .mpcs-button > span,
body.kc-academy-template.kc-high-contrast .mpcs-lesson-button .mpcs-button > .btn,
body.kc-academy-template.kc-high-contrast .mpcs-lesson-button .mpcs-button > .mpcs-button,
body.kc-academy-template.kc-high-contrast .site-main .course-curriculum:has(a) > a,
body.kc-academy-template.kc-high-contrast .site-main .course-curriculum:has(a) > a span,
body.kc-academy-template.kc-high-contrast .site-main .course-curriculum:has(a) > a i {
    background: #000 !important;
    color: #fff !important;
}
body.kc-academy-template.kc-high-contrast .site-main .course-curriculum:has(a) > a span,
body.kc-academy-template.kc-high-contrast .site-main .course-curriculum:has(a) > a i { background: transparent !important; }
body.kc-academy-template.kc-high-contrast .mpcs-section .mpcs-lessons .mpcs-lesson-button .mpcs-button > span.is-outline,
body.kc-academy-template.kc-high-contrast .mpcs-lesson-button .mpcs-button > .is-outline {
    background: #fff !important;
    color: #000 !important;
    box-shadow: inset 0 0 0 2px #000 !important;
}
body.kc-academy-template.kc-high-contrast .mpcs-section-header,
body.kc-academy-template.kc-high-contrast .mpcs-section-header .mpcs-section-title,
body.kc-academy-template.kc-high-contrast .mpcs-section-header .mpcs-section-title-text,
body.kc-academy-template.kc-high-contrast .mpcs-main .mpcs-section .mpcs-section-header .mpcs-section-title-text { color: #000 !important; }
body.kc-academy-template.kc-high-contrast .mpcs-section-header::after { border-top-color: #000 !important; border-bottom-color: #000 !important; }
body.kc-academy-template.kc-high-contrast .course-curriculum:has(a) { border: 2px solid #000 !important; }
body.kc-academy-template.kc-high-contrast .mpcs-section.mpcs-section-lessons .mpcs-section-header.active .mpcs-section-title { border-bottom-color: #000 !important; }

body.kc-academy-template.kc-high-contrast .kc-course-header {
    background: #fff !important;
    border: 2px solid #000 !important;
    box-shadow: none !important;
}
body.kc-academy-template.kc-high-contrast .kc-course-header::before { background: #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-course-header__eyebrow,
body.kc-academy-template.kc-high-contrast .kc-course-header__title,
body.kc-academy-template.kc-high-contrast .kc-course-header__tagline,
body.kc-academy-template.kc-high-contrast .kc-course-header__stat-label,
body.kc-academy-template.kc-high-contrast .kc-course-header__stat-value,
body.kc-academy-template.kc-high-contrast .kc-course-header__stat .kc-course-header__stat-label { color: #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-course-header__stat {
    background: #fff !important;
    border: 2px solid #000 !important;
}
body.kc-academy-template.kc-high-contrast .kc-course-header__badge { background: #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-course-header__logo img { filter: brightness(0); }

/* ---- lessons and quizzes on the Academy template (Charles's K4dev screenshots, 2026-09-28) ----
   Body carries kc-academy-screen + kc-academy-template + mpcs-classroom (the classroom
   class appears with Classroom Mode OFF, and MemberPress Courses prints an inline
   <style> against it — Classroom.php classroom_theme_customize(): teal (progress
   colour) on `.mpcs-classroom div#mpcs-lesson-navigation a:not(#previous_lesson_link)`,
   (2,1,2), and `color !important` on `.mpcs-classroom #next_lesson_link`). So every
   rule here that repaints a plugin control carries an id AND !important.
   Verified against the live DOM: the nav is <div id=mpcs-lesson-navigation> with bare
   <a id=previous_lesson_link|next_lesson_link class=""> (the link-css options are
   empty); a quiz is <fieldset.mpcs-quiz-question> › <legend.mpcs-quiz-question-label>
   (plugin colour #000, which is why the questions vanished on navy) › white
   .mpcs-quiz-question-option and .mpcs-quiz-question-sort-list-item cards (the plugin's
   `-a` suffix is its alternate state, NOT the live class -- styling only `-a` left the
   sort rows white with light text on K4dev, 2026-09-29; the drag handle is the row's
   ::before, coloured by BuddyBoss Pro's meprlms-frontend.css); a match-matrix question
   is .mpcs-quiz-question-matrix-item › .mpcs-quiz-question-match-matrix-option-value
   > label (BuddyBoss Pro paints it --mpcs-body-text-color, navy) + a white <select>; Submit is a
   bare <button> in a classless div after the last fieldset; Retake is
   .mpcs-retake-container a.btn.btn-primary inside .mpcs-quiz-submission-error. */

/* The High-contrast toggle: the parent theme's `button:hover, button:focus` (0,1,1)
   paints --bb-primary-button-background-hover (cyan) and a dark text colour, and
   both beat the base rule (0,1,0). A clicked button KEEPS :focus, so after one
   click the toggle sat bright cyan as if that were its resting state (Charles,
   2026-10-07: "should be dark with only a subtle change on mouseover"). Every
   state is restated here at (0,2,0); hover comes last so it still shows on a
   focused button. Keyboard focus is the :focus-visible outline above. */
.kc-contrast-toggle:focus,
.kc-contrast-toggle:active {
    background: #111A28;
    border-color: #526174;
    color: #fff;
    box-shadow: none;
}
.kc-contrast-toggle:hover {
    background: #172233;
    border-color: #6B7A8F;
    color: #fff;
    box-shadow: none;
}
body.kc-academy-template.kc-high-contrast .kc-contrast-toggle:hover,
body.kc-academy-template.kc-high-contrast .kc-contrast-toggle:focus { background: #000 !important; color: #fff !important; }
body.kc-academy-template.kc-high-contrast .kc-contrast-toggle:hover *,
body.kc-academy-template.kc-high-contrast .kc-contrast-toggle:focus * { color: #fff !important; }

/* Lesson callouts: block-editor tables with a translucent tint (style="background-color:#7bdbb536")
   and, on some, .has-black-color — Gutenberg's `.has-black-color{color:…!important}` made
   the text black on the tint over navy. Keep the author's tint, light the text. */
body.kc-academy-template:not(.kc-high-contrast) .kc-acad-page .wp-block-table table.has-background {
    color: var(--kca-text) !important;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 10px;
    overflow: hidden;
}
body.kc-academy-template:not(.kc-high-contrast) .kc-acad-page .wp-block-table table.has-background td,
body.kc-academy-template:not(.kc-high-contrast) .kc-acad-page .wp-block-table table.has-background th,
body.kc-academy-template:not(.kc-high-contrast) .kc-acad-page .wp-block-table table.has-background.has-black-color,
body.kc-academy-template:not(.kc-high-contrast) .kc-acad-page .wp-block-table table.has-background.has-black-color td {
    color: var(--kca-text) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    padding: 14px 16px;
}
body.kc-academy-template:not(.kc-high-contrast) .kc-acad-page .wp-block-table table.has-background strong { color: #fff; }
body.kc-academy-template:not(.kc-high-contrast) .kc-acad-page .wp-block-table table.has-background a { color: var(--kca-cyan) !important; }

/* Previous / Next lesson: pills, not the plugin's flush teal block and the
   high-contrast sweep's blue underline on a navy box. */
body.kc-academy-screen div#mpcs-lesson-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 40px 0 8px;
}
body.kc-academy-screen div#mpcs-lesson-navigation::after { display: none; }
body.kc-academy-screen div#mpcs-lesson-navigation a#previous_lesson_link,
body.kc-academy-screen div#mpcs-lesson-navigation a#next_lesson_link {
    float: none !important;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    width: auto !important;
    padding: 12px 22px !important;
    border-radius: 999px !important;
    font-family: var(--kca-body);
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}
body.kc-academy-screen div#mpcs-lesson-navigation a#next_lesson_link {
    margin-left: auto;
    background: var(--kca-cyan) !important;
    color: var(--kca-on-accent, #05070C) !important;
    border: 0 !important;
}
body.kc-academy-screen div#mpcs-lesson-navigation a#previous_lesson_link {
    background: transparent !important;
    color: var(--kca-text) !important;
    border: 1px solid rgba(255, 255, 255, 0.28) !important;
}
body.kc-academy-screen div#mpcs-lesson-navigation a#next_lesson_link:hover { filter: brightness(1.08); }
body.kc-academy-screen div#mpcs-lesson-navigation a#previous_lesson_link:hover { border-color: #fff !important; }
body.kc-academy-screen div#mpcs-lesson-navigation a i { color: inherit !important; }
body.kc-academy-template.kc-high-contrast div#mpcs-lesson-navigation a#next_lesson_link { background: #000 !important; color: #fff !important; }
body.kc-academy-template.kc-high-contrast div#mpcs-lesson-navigation a#previous_lesson_link { background: #fff !important; color: #000 !important; border: 2px solid #000 !important; }

/* Quiz: questions, answer cards, sort rows. */
body.kc-academy-screen .mpcs-quiz-question { margin: 34px 0 0; }
body.kc-academy-screen .mpcs-quiz-question-label,
body.kc-academy-screen .mpcs-quiz-question legend,
body.kc-academy-screen .mpcs-quiz-question-sort-values p {
    color: var(--kca-text) !important;
    font-family: var(--kca-display);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.35;
}
body.kc-academy-screen .mpcs-quiz-question-required { color: var(--kca-coral, #FF6B6B); }
body.kc-academy-screen .mpcs-quiz-question-option,
body.kc-academy-screen .mpcs-quiz-question-sort-list-item,
body.kc-academy-screen .mpcs-quiz-question-sort-list-item-a {
    background: var(--kca-panel) !important;
    border: 1px solid var(--kca-line) !important;
    border-radius: 10px !important;
    color: var(--kca-text) !important;
}
body.kc-academy-screen .mpcs-quiz-question-option:hover,
body.kc-academy-screen .mpcs-quiz-question-sort-list-item:hover,
body.kc-academy-screen .mpcs-quiz-question-sort-list-item-a:hover { border-color: rgba(255, 255, 255, 0.35) !important; }
body.kc-academy-screen .mpcs-quiz-question-option label,
body.kc-academy-screen .mpcs-quiz-question-option-label,
body.kc-academy-screen .mpcs-quiz-question-sort-option-value,
body.kc-academy-screen .mpcs-quiz-question-match-matrix-option-value,
body.kc-academy-screen .mpcs-quiz-question-match-matrix-option-value label { color: var(--kca-text) !important; font-size: 15px; }
body.kc-academy-screen .mpcs-quiz-question-option i,
body.kc-academy-screen .mpcs-quiz-question-sort-list-item::before,
body.kc-academy-screen .mpcs-quiz-question-sort-list-item-a::before { color: var(--kca-cyan) !important; }
body.kc-academy-template.kc-high-contrast .mpcs-quiz-question-option,
body.kc-academy-template.kc-high-contrast .mpcs-quiz-question-sort-list-item,
body.kc-academy-template.kc-high-contrast .mpcs-quiz-question-sort-list-item-a { border: 2px solid #000 !important; }

/* Submit (a bare <button> after the last question) and the post-pass Continue link. */
body.kc-academy-screen.single-mpcs-quiz .kc-acad-page button,
body.kc-academy-screen #mpcs-quiz-navigation a,
body.kc-academy-screen #mpcs-quiz-navigation button,
body.kc-academy-screen a#mpcs-quiz-continue-bottom {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    margin: 28px 0 0;
    padding: 12px 24px !important;
    background: var(--kca-cyan) !important;
    color: var(--kca-on-accent, #05070C) !important;
    border: 0 !important;
    border-radius: 999px !important;
    font-family: var(--kca-body);
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    cursor: pointer;
}
body.kc-academy-screen.single-mpcs-quiz .kc-acad-page button:hover,
body.kc-academy-screen #mpcs-quiz-navigation a:hover { filter: brightness(1.08); }
body.kc-academy-screen.single-mpcs-quiz .kc-acad-page button:disabled,
body.kc-academy-screen.single-mpcs-quiz .kc-acad-page button[disabled] { opacity: 0.45; cursor: not-allowed; filter: none; }
body.kc-academy-template.kc-high-contrast.single-mpcs-quiz .kc-acad-page button,
body.kc-academy-template.kc-high-contrast #mpcs-quiz-navigation a,
body.kc-academy-template.kc-high-contrast a#mpcs-quiz-continue-bottom { background: #000 !important; color: #fff !important; }

/* The failed-attempt notice and its Retake pill (a.btn.btn-primary — the high-contrast
   link sweep had underlined it in blue on a black pill). */
body.kc-academy-screen .mpcs-quiz-submission-error-inner { padding: 16px 18px; }
body.kc-academy-screen .mpcs-retake-container { margin-top: 12px; display: flex; align-items: center; gap: 10px; }
body.kc-academy-screen .mpcs-retake-container a.btn,
body.kc-academy-screen .kc-acad-page .mpcs-retake-container a.btn.btn-primary {
    display: inline-flex !important;
    padding: 10px 20px !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
}
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-retake-container a.btn.btn-primary { background: #000 !important; color: #fff !important; }
body.kc-academy-screen .mpcs-retake-limit { color: var(--kca-muted); font-family: var(--kca-mono); font-size: 13px; }

/* Core's Tabs block in lesson content (WP 6.9: div.wp-block-tabs › div.wp-block-tab-list
   [role=tablist] › button[role=tab], the selected one aria-selected="true"). Core pads the
   buttons inside :where() (0,0,0), so the child bundle's preflight `button { padding: 0 }`
   wiped it; the parent theme's `button` gave them its cyan pill border, and its
   `button:hover, button:focus` (0,1,1) painted them primary-button cyan — and a clicked tab
   keeps :focus, so the current tab sat cyan. Core's selected marker is a 2px underline
   (`[aria-selected=true]:before`), which read as a stray rule under a pill. Every state is
   restated at (0,3,2)+ as Academy pills: hover a subtle lift, selected the accent fill. */
body.kc-academy-screen .wp-block-tab-list { gap: 8px; margin: 24px 0 16px; }
body.kc-academy-screen .wp-block-tab-list button[role="tab"],
body.kc-academy-screen .wp-block-tab-list button[role="tab"]:focus,
body.kc-academy-screen .wp-block-tab-list button[role="tab"]:active {
    padding: 8px 18px;
    border: 1px solid #2A3646;
    border-radius: 999px;
    background: var(--kca-panel, #111A28);
    color: var(--kca-muted, #9BA8B9);
    font-family: var(--kca-body, 'Inter', system-ui, sans-serif);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    box-shadow: none;
    outline: 0;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
body.kc-academy-screen .wp-block-tab-list button[role="tab"] * { color: inherit; font-weight: inherit; }
body.kc-academy-screen .wp-block-tab-list button[role="tab"]::before { content: none; }
body.kc-academy-screen .wp-block-tab-list button[role="tab"]:hover {
    background: #172233;
    border-color: #526174;
    color: var(--kca-text, #E8EDF5);
}
body.kc-academy-screen .wp-block-tab-list button[role="tab"][aria-selected="true"],
body.kc-academy-screen .wp-block-tab-list button[role="tab"][aria-selected="true"]:hover,
body.kc-academy-screen .wp-block-tab-list button[role="tab"][aria-selected="true"]:focus {
    background: var(--kca-cyan, #F5A623);
    border-color: var(--kca-cyan, #F5A623);
    color: var(--kca-on-accent, #20160A);
}
body.kc-academy-screen .wp-block-tab-list button[role="tab"]:focus-visible { outline: 3px solid #FFC857; outline-offset: 3px; }

body.kc-academy-template.kc-high-contrast .wp-block-tab-list button[role="tab"],
body.kc-academy-template.kc-high-contrast .wp-block-tab-list button[role="tab"]:focus { background: #fff !important; color: #000 !important; border: 2px solid #000 !important; }
body.kc-academy-template.kc-high-contrast .wp-block-tab-list button[role="tab"]:hover { background: #E6E6E6 !important; color: #000 !important; }
body.kc-academy-template.kc-high-contrast .wp-block-tab-list button[role="tab"][aria-selected="true"] { background: #000 !important; color: #fff !important; }
body.kc-academy-template.kc-high-contrast .wp-block-tab-list button[role="tab"] * { color: inherit !important; }
body.kc-academy-template.kc-high-contrast .wp-block-tab-list button[role="tab"]:focus-visible { outline-color: #000; }

/* The attempt result box, both shapes the quiz add-on prints above a submitted quiz:
   FAILED = .mpcs-quiz-submission-error › …-error-inner (feedback + Retake), PASSED =
   .mpcs-quiz-submission-dark › …-dark-inner (h2.mpcs-quiz-score + Retake). The add-on
   paints the inner box #F9FAFB, and our heading repaint lights the score white on it
   (Charles's screenshots, 2026-10-07: "Score: 18/20 (90%)", then "Score: 5/5 (100%)"
   on a pass). Both become an Academy panel; a pass gets a teal edge to answer the red
   one on a fail. The Retake pill and the "(0/1)" counter keep their rules above. */
body.kc-academy-screen .kc-acad-page :is(.mpcs-quiz-submission-error, .mpcs-quiz-submission-dark),
body.kc-academy-screen .kc-acad-page :is(.mpcs-quiz-submission-error-inner, .mpcs-quiz-submission-dark-inner) {
    background: var(--kca-panel, #111A28) !important;
    color: var(--kca-text, #E8EDF5) !important;
}
body.kc-academy-screen .kc-acad-page :is(.mpcs-quiz-submission-error, .mpcs-quiz-submission-dark) {
    margin: 24px 0;
    border: 1px solid var(--kca-line, #1E2836) !important;
    border-radius: 14px;
    overflow: hidden;
}
body.kc-academy-screen .kc-acad-page .mpcs-quiz-submission-dark { border-left: 4px solid var(--kca-teal, #14C8A6) !important; }
body.kc-academy-screen .kc-acad-page .mpcs-quiz-submission-dark-inner { padding: 16px 18px !important; }
body.kc-academy-screen .kc-acad-page :is(.mpcs-quiz-submission-error, .mpcs-quiz-submission-dark) :is(h1, h2, h3, h4, h5, h6, p, strong, b, div, span):not(.mpcs-retake-limit) {
    color: var(--kca-text, #E8EDF5) !important;
    background: transparent !important;
}
body.kc-academy-screen .kc-acad-page :is(.mpcs-quiz-submission-error, .mpcs-quiz-submission-dark) :is(h1, h2, h3, h4, h5, h6) { margin: 0; font-size: 20px; }
body.kc-academy-template.kc-high-contrast .kc-acad-page :is(.mpcs-quiz-submission-error, .mpcs-quiz-submission-dark),
body.kc-academy-template.kc-high-contrast .kc-acad-page :is(.mpcs-quiz-submission-error-inner, .mpcs-quiz-submission-dark-inner) { background: #fff !important; color: #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-acad-page :is(.mpcs-quiz-submission-error, .mpcs-quiz-submission-dark) { border: 2px solid #000 !important; }
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-quiz-submission-dark { border-left-width: 6px !important; }
body.kc-academy-template.kc-high-contrast .kc-acad-page :is(.mpcs-quiz-submission-error, .mpcs-quiz-submission-dark) :is(h1, h2, h3, h4, h5, h6, p, strong, b, div, span):not(.mpcs-retake-limit) { color: #000 !important; }

/* Member grades — the course page with ?action=gradebook (memberpress-course-gradebook,
   app/views/course-grades.php): <h1>Grades</h1>, then per kind (Quizzes, Assignments) a
   .mpcs-section.mpcs-resource-section › .mpcs-lessons › table.mp-table, rows
   tr.mpcs-lesson.mpcs-gradebook-lesson, the Action cell holding .mpcs-lesson-button
   icons (i.mpcs-ccw retake, i.mpcs-chat feedback). BuddyBoss Pro's
   `table.mp-table thead tr th` / `tbody tr td` (0,1,4) set #0B1220 text — invisible on
   our panel — and a white header bar. The triple render is fixed in PHP
   (KcAcademyCourses::gradebookBuffer*). */
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table {
    width: 100%;
    border-collapse: collapse;
    background: transparent;
    margin: 0;
}
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table thead tr,
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table thead tr th {
    background: var(--kca-bg-deep, #0C1017) !important;
    color: var(--kca-muted, #9BA8B9) !important;
}
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table thead tr th {
    padding: 10px 16px;
    font-family: var(--kca-mono, 'IBM Plex Mono', ui-monospace, monospace);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: left;
    border-bottom: 1px solid var(--kca-line, #1E2836);
}
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td {
    padding: 14px 16px;
    color: var(--kca-text, #E8EDF5) !important;
    background: transparent !important;
    border-bottom: 1px solid var(--kca-line, #1E2836);
    font-size: 15px;
    vertical-align: middle;
}
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr:last-child td { border-bottom: 0; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr:hover td { background: rgba(255, 255, 255, 0.03) !important; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td:nth-child(n+2) { white-space: nowrap; font-variant-numeric: tabular-nums; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td:nth-child(2) { font-weight: 700; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td:nth-child(3),
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td:nth-child(4) { color: var(--kca-muted, #9BA8B9) !important; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody td a.mpcs-lesson-row-link {
    color: var(--kca-text, #E8EDF5) !important;
    border: 0 !important;
    text-decoration: none !important;
    font-weight: 600;
}
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody td a.mpcs-lesson-row-link:hover { color: var(--kca-cyan, #F5A623) !important; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody td .mpcs-lesson-button,
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody td .mpcs-lesson-button span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: var(--kca-cyan, #F5A623) !important;
}
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody td .mpcs-lesson-button i,
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody td .mpcs-lesson-button i::before { color: var(--kca-cyan, #F5A623) !important; font-size: 18px; margin: 0; }
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table tbody td .mpcs-lesson-button i,
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table tbody td .mpcs-lesson-button i::before { color: #000 !important; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody td .flex { gap: 12px; }
body.kc-academy-screen .kc-acad-page .mpcs-resource-section + h1,
body.kc-academy-screen .kc-acad-page .mpcs-resource-section + .mpcs-resource-section { margin-top: 24px; }
@media (max-width: 640px) {
    body.kc-academy-screen .kc-acad-page .mpcs-resource-section .mpcs-lessons { overflow-x: auto; }
    body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td,
    body.kc-academy-screen .kc-acad-page .mpcs-resource-section table.mp-table thead tr th { padding: 10px 12px; }
}
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table thead tr,
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table thead tr th { background: #000 !important; color: #fff !important; }
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td,
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table tbody td a.mpcs-lesson-row-link,
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table tbody td .mpcs-lesson-button span { color: #000 !important; background: #fff !important; }
body.kc-academy-template.kc-high-contrast .kc-acad-page .mpcs-resource-section table.mp-table tbody tr td { border-bottom-color: #000; }

/* Course outline (Charles's screenshot, 2026-10-07): a passed quiz's row prints
   span.mpcs-lesson-list-quiz-score "(Score: 100%)", which BuddyBoss Pro's
   `.mpcs-section .mpcs-lessons .mpcs-lesson-list-quiz-score` (0,3,0) paints #0B1220 —
   invisible on the panel. And every LESSON row's type icon is BB's
   `.mpcs-section .mpcs-lessons .mpcs-lesson-link.mpcs-lesson::before` in
   --mpcs-headings-color (club navy #002664), the dark blob before each title. */
body.kc-academy-screen .mpcs-section .mpcs-lessons .mpcs-lesson-list-quiz-score {
    color: var(--kca-teal, #14C8A6) !important;
    font-family: var(--kca-mono, 'IBM Plex Mono', ui-monospace, monospace);
    font-size: 12px;
    font-weight: 600;
    margin-left: 8px;
}
body.kc-academy-screen .mpcs-section .mpcs-lessons .mpcs-lesson-link.mpcs-lesson::before {
    color: var(--kca-muted, #9BA8B9) !important;
    opacity: 1;
}
body.kc-academy-template.kc-high-contrast .mpcs-section .mpcs-lessons .mpcs-lesson-list-quiz-score { color: #0B6B48 !important; }
body.kc-academy-template.kc-high-contrast .mpcs-section .mpcs-lessons .mpcs-lesson-link.mpcs-lesson::before { color: #000 !important; }

