/* LifterLMS in the Kognifi frame (CI-01A colours, BB-02B components). */

/* Buttons: primary = Bright Blue web, hover Navy (same as .kg-btn--primary); secondary = white with blue border. Prefixed with body: since LifterLMS 10.1 buttons also carry .wp-element-button, and the WordPress global button style (#32373c) loads later at equal specificity. */
body .llms-button-primary, body .llms-button-action, body .llms-button-secondary, body .llms-button-success,
body .llms-form-field .llms-button-primary, body .llms-lesson-button-wrapper .llms-button-primary {
	display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 12px 20px;
	border-radius: var(--k-radius-control); font-family: var(--k-font-body); font-weight: 500; font-size: 16px; line-height: 1;
	text-decoration: none; transition: background-color var(--k-ease), color var(--k-ease); border: 1.5px solid var(--k-blue); border-width: 1.5px;
}
body .llms-button-primary, body .llms-button-action { background: var(--k-blue); color: var(--k-white); }
body .llms-button-primary:hover, body .llms-button-primary:focus, body .llms-button-action:hover, body .llms-button-action:focus { background: var(--k-navy); border-color: var(--k-navy); color: var(--k-white); }
body .llms-button-secondary { background: var(--k-white); color: var(--k-blue); }
body .llms-button-secondary:hover, body .llms-button-secondary:focus { background: var(--k-tint-blue); color: var(--k-blue); }
body .llms-button-success { background: var(--k-success); border-color: var(--k-success); color: var(--k-white); }
body .llms-button-primary:focus-visible, body .llms-button-action:focus-visible, body .llms-button-secondary:focus-visible { outline: 3px solid var(--k-navy); outline-offset: 2px; }

/* Progress: Mid-Green (success) on a Light Green track. The wrapper holds the bar and the percentage:
   put the track on .llms-progress-bar, not on the wrapper, or the percentage is cut off. */
.llms-progress { align-items: center; gap: 10px; height: auto; margin: 12px 0; }
.llms-progress .llms-progress-bar { flex: 1 1 auto; top: auto; height: 10px; background: var(--k-tint-green); border-radius: var(--k-radius-pill); overflow: hidden; }
.llms-progress .progress-bar-complete { background: var(--k-success); border-radius: var(--k-radius-pill); }
.llms-progress .progress__indicator { flex: 0 0 auto; float: none; height: auto; line-height: 1.3; margin: 0; font-family: var(--k-font-head); font-weight: 600; font-size: 15px; font-variant-numeric: tabular-nums; color: var(--k-navy); }
/* Quiz progress (no percentage): the wrapper is the track. */
.llms-quiz-ui .llms-progress { gap: 0; height: 10px; margin: 0; background: var(--k-tint-green); border-radius: var(--k-radius-pill); overflow: hidden; }

/* Course syllabus: sections as cards, lessons as rows. */
.llms-syllabus-wrapper .llms-section-title {
	font-family: var(--k-font-head); font-weight: 700; color: var(--k-navy); background: var(--k-tint-blue);
	border-left: 4px solid var(--k-navy); border-radius: 0 var(--k-radius-control) var(--k-radius-control) 0; padding: 12px 16px; margin: 24px 0 8px;
}
.llms-lesson-preview .llms-lesson-link { border-radius: var(--k-radius-control); border: 1px solid var(--k-border); background: var(--k-white); box-shadow: none; }
.llms-lesson-preview .llms-lesson-link:hover { box-shadow: var(--k-shadow); }
.llms-lesson-preview.is-complete .llms-lesson-complete, .llms-lesson-preview.is-complete .llms-lesson-complete-placeholder { color: var(--k-success); }
.llms-lesson-preview .llms-lesson-title { font-family: var(--k-font-head); font-weight: 600; color: var(--k-navy); }
.llms-lesson-preview .llms-lesson-counter { color: var(--k-grey); }

/* Lesson navigation: previous / next as cards. */
.llms-course-navigation .llms-lesson-preview .llms-lesson-link { padding: 16px 20px; }
.llms-course-navigation .llms-pre-text { font-size: 14px; color: var(--k-grey); text-transform: none; }

/* Course information, instructors, meta. */
.llms-meta-info h3, .llms-instructor-info h3, .llms-meta-title { font-family: var(--k-font-head); color: var(--k-navy); }
.llms-meta-info .llms-meta a { color: var(--k-blue); }
.llms-author .avatar { border-color: var(--k-border); }

/* Course and membership catalogue cards. */
.llms-loop-item-content { background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); overflow: hidden; transition: box-shadow var(--k-ease); }
.llms-loop-item-content:hover { box-shadow: var(--k-shadow-hover); }
.llms-loop-item-content .llms-loop-title { font-family: var(--k-font-head); font-weight: 700; color: var(--k-navy); font-size: 18px; line-height: 1.3; padding: 0 16px; }
.llms-loop-item-content .llms-loop-title:hover { color: var(--k-blue); }
.llms-loop-item-content .llms-meta, .llms-loop-item-content .llms-author { padding: 0 16px; font-size: 14px; color: var(--k-grey); }

/* Quizzes. */
.llms-quiz-ui { background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); border-top: var(--k-truth-line) solid var(--k-navy); }
.llms-question-wrapper .llms-question-text { font-family: var(--k-font-head); font-weight: 600; color: var(--k-navy); font-size: 20px; line-height: 1.35; }
.llms-question-wrapper ol.llms-question-choices li.llms-choice label { border-radius: var(--k-radius-control); border: 1px solid var(--k-border); }
.llms-question-wrapper ol.llms-question-choices li.llms-choice input:checked + .llms-marker { background: var(--k-blue); }
.llms-quiz-timer, .llms-quiz-counter { color: var(--k-grey); }
.llms-quiz-results .llms-donut.passing { color: var(--k-success); }
.llms-quiz-results .llms-donut.passing svg path { stroke: var(--k-success); }
.llms-quiz-results .llms-donut.failing { color: var(--k-red); }
.llms-quiz-results .llms-donut.failing svg path { stroke: var(--k-red); }

/* Notices. */
.llms-notice { border-radius: var(--k-radius-control); border: 0; border-left: 4px solid var(--k-blue); background: var(--k-tint-blue); }
.llms-notice.llms-success { border-left-color: var(--k-success); background: var(--k-tint-green); }
.llms-notice.llms-error { border-left-color: var(--k-red); background: #F6E7E4; }
.llms-notice.llms-debug { border-left-color: var(--k-amber); background: var(--k-tint-amber); }

/* Student dashboard. */
.llms-student-dashboard .llms-sd-nav, .llms-sd-items { font-family: var(--k-font-head); }
.llms-sd-items .llms-sd-item a { color: var(--k-navy); font-weight: 600; }
.llms-sd-items .llms-sd-item.current a { color: var(--k-blue); text-decoration: underline; text-underline-offset: 6px; }
.llms-sd-title { color: var(--k-navy); }

/* Certificates and achievements. */
.llms-certificate-loop-item .llms-certificate, .llms-achievement { border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); border: 0; }

/* Forms (login, registration, checkout). */
.llms-form-field input[type="text"], .llms-form-field input[type="email"], .llms-form-field input[type="password"], .llms-form-field input[type="tel"], .llms-form-field select, .llms-form-field textarea {
	border-radius: var(--k-radius-control); border: 1px solid var(--k-border); min-height: 44px; padding: 10px 12px;
}
.llms-form-field label { font-weight: 500; color: var(--k-navy); }

/* ===== Lesson components (BL-PBC template; reused by every course) ===== */
.kgt-lesson { max-width: var(--k-reading); }
/* Eyebrow: Montserrat SemiBold, Bahama Blue, title case as written (BB-02C §5, BC-04). Gold is never text. */
.kgt-eyebrow { font-family: var(--k-font-head); font-weight: 600; font-size: 14px; letter-spacing: .01em; color: #1F4E79; margin-bottom: var(--k-space-2); }
.kgt-lesson .kg-lead { margin-bottom: var(--k-space-6); }
.kgt-figure { margin: var(--k-space-6) 0; background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); padding: var(--k-space-5); }
.kgt-figure svg { display: block; width: 100%; height: auto; }
.kgt-figure figcaption { font-size: 14px; color: var(--k-grey); margin-top: var(--k-space-3); text-align: center; }
.kgt-cols { display: grid; gap: var(--k-gutter); grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--k-space-6) 0; }
@media (max-width: 900px) { .kgt-cols { grid-template-columns: 1fr; } }
.kgt-col { background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); padding: var(--k-space-5); border-top: 4px solid var(--k-navy); display: flex; flex-direction: column; }
.kgt-col--green { border-top-color: var(--k-success); }
.kgt-col--gold { border-top-color: var(--k-amber); } /* class name kept for existing content; Amber, not gold */
.kgt-col h3 { font-size: 20px; margin: 0 0 var(--k-space-3); }
.kgt-col ul { margin: 0 0 var(--k-space-4) 1.1em; }
.kgt-col .kgt-ex--weak { margin-top: auto; }
.kgt-ex { border-radius: var(--k-radius-control); padding: 12px 14px; margin: 0 0 var(--k-space-2); font-size: 16px; line-height: 1.5; }
.kgt-ex b { display: block; font-family: var(--k-font-body); font-weight: 700; font-size: 14px; margin-bottom: 4px; } /* box label: DM Sans Bold, sentence case (BB-02C §4) */
.kgt-ex--weak { background: #F6E7E4; border-left: 4px solid #B43A22; }
.kgt-ex--weak b { color: #B43A22; }
.kgt-ex--strong { background: var(--k-tint-green); border-left: 4px solid var(--k-success); }
.kgt-ex--strong b { color: var(--k-success); }
.kgt-check { background: var(--k-tint-amber); border-radius: var(--k-radius-card); border-left: 4px solid var(--k-amber); padding: var(--k-space-5); margin: var(--k-space-6) 0; }
.kgt-check h3 { margin-top: 0; font-size: 20px; }
.kgt-takeaway { background: var(--k-navy); color: var(--k-white); border-radius: var(--k-radius-card); border-bottom: var(--k-truth-line) solid var(--k-gold); padding: var(--k-space-5) var(--k-space-6); margin: var(--k-space-6) 0; font-family: var(--k-font-head); font-weight: 600; font-size: 20px; line-height: 1.4; }
.kgt-takeaway span { display: block; font-family: var(--k-font-body); font-weight: 700; font-size: 14px; color: var(--k-tint-blue); margin-bottom: 6px; }
.kgt-activity { background: var(--k-white); border: 2px solid var(--k-amber); border-radius: var(--k-radius-card); padding: var(--k-space-5); margin: var(--k-space-6) 0; }
.kgt-activity h3 { margin-top: 0; }
.kgt-activity .kgt-meta { font-size: 14px; color: var(--k-grey); margin-bottom: var(--k-space-3); }
.kgt-scenario { border-left: 3px solid var(--k-border); padding-left: var(--k-space-4); margin-bottom: var(--k-space-4); }
.kgt-scenario p { margin-bottom: 4px; }

/* Rubric: all four levels on CI tints: Not yet = Terracotta, Developing = Amber, Competent = Light Green, Proficient = Bahama Blue. */
.kgt-rubric-wrap { overflow-x: auto; margin: var(--k-space-5) 0; }
.kgt-rubric { width: 100%; min-width: 640px; border-collapse: separate; border-spacing: 0; font-size: 15px; line-height: 1.45; background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); overflow: hidden; }
.kgt-rubric th, .kgt-rubric td { padding: 10px 12px; vertical-align: top; border-bottom: 1px solid var(--k-border); text-align: left; }
.kgt-rubric thead th { background: var(--k-navy); color: var(--k-white); font-family: var(--k-font-head); font-weight: 600; font-size: 14px; }
.kgt-rubric thead th small { display: block; font-weight: 400; opacity: .85; }
.kgt-rubric tbody th { font-family: var(--k-font-head); font-weight: 600; color: var(--k-navy); background: var(--k-cream); width: 16%; }
.kgt-rubric td.l1 { background: #F6E7E4; }
.kgt-rubric td.l2 { background: var(--k-tint-amber); }
.kgt-rubric td.l3 { background: var(--k-tint-green); }
.kgt-rubric td.l4 { background: var(--k-tint-blue); }
.kgt-rubric tfoot td { font-size: 14px; color: var(--k-grey); background: var(--k-cream); }

/* Weak / strong rows (label · weak · strong). */
.kgt-statement { background: var(--k-tint-blue); border-left: 4px solid var(--k-navy); border-radius: 0 var(--k-radius-control) var(--k-radius-control) 0; padding: 12px 16px; margin: var(--k-space-5) 0; font-style: italic; }
.kgt-ws { margin: var(--k-space-5) 0 var(--k-space-6); }
.kgt-ws__head, .kgt-ws__row { display: grid; grid-template-columns: 22% 1fr 1fr; gap: var(--k-space-3); align-items: stretch; }
.kgt-ws__head { font-family: var(--k-font-head); font-weight: 600; font-size: 14px; color: var(--k-grey); margin-bottom: var(--k-space-2); }
.kgt-ws__row { margin-bottom: var(--k-space-3); }
.kgt-ws__label { font-family: var(--k-font-head); font-weight: 700; color: var(--k-navy); padding-top: 12px; }
.kgt-ws__row .kgt-ex { margin: 0; }
.kgt-ws--single .kgt-ws__head, .kgt-ws--single .kgt-ws__row { grid-template-columns: 30% 1fr; }
@media (max-width: 700px) { .kgt-ws__head { display: none; } .kgt-ws__row, .kgt-ws--single .kgt-ws__row { grid-template-columns: 1fr; } .kgt-ws__label { padding-top: 0; } }

/* Worked flow: numbered steps with an example each. */
.kgt-scenario-box { background: var(--k-cream); border: 1px solid var(--k-border); border-radius: var(--k-radius-control); padding: 12px 16px; margin: var(--k-space-5) 0 var(--k-space-4); }
.kgt-scenario-box b { font-family: var(--k-font-head); color: var(--k-navy); }
.kgt-flow { list-style: none; margin: 0 0 var(--k-space-6); padding: 0; counter-reset: kgt-flow; }
.kgt-flow > li { counter-increment: kgt-flow; position: relative; padding: 0 0 var(--k-space-4) 56px; }
.kgt-flow > li::before { content: counter(kgt-flow); position: absolute; left: 0; top: 0; width: 38px; height: 38px; border-radius: 50%; background: var(--k-navy); color: var(--k-white); font-family: var(--k-font-head); font-weight: 700; display: flex; align-items: center; justify-content: center; }
.kgt-flow > li:not(:last-child)::after { content: ""; position: absolute; left: 18px; top: 42px; bottom: 4px; width: 2px; background: var(--k-border); }
.kgt-flow h3 { font-size: 19px; margin: 6px 0 2px; }
.kgt-flow .kgt-flow__what { color: var(--k-grey); font-size: 15px; margin-bottom: var(--k-space-2); }
.kgt-flow--c1 > li:nth-child(1)::before { background: #B43A22; } .kgt-flow--c1 > li:nth-child(2)::before { background: var(--k-amber); color: var(--k-black); } .kgt-flow--c1 > li:nth-child(3)::before { background: #1F4E79; } .kgt-flow--c1 > li:nth-child(4)::before { background: var(--k-success); }

/* Spectrum: a scale with three positions. */
.kgt-spectrum { margin: var(--k-space-5) 0 var(--k-space-6); }
.kgt-spectrum__ends { display: flex; justify-content: space-between; font-family: var(--k-font-head); font-weight: 600; font-size: 14px; color: var(--k-navy); margin-bottom: 6px; gap: 12px; }
.kgt-spectrum__bar { height: 8px; border-radius: 4px; background: linear-gradient(90deg, #B43A22, var(--k-success) 50%, #B43A22); margin-bottom: var(--k-space-4); }
.kgt-spectrum__bar--culture { background: linear-gradient(90deg, #1F4E79, var(--k-amber) 50%, var(--k-success)); }
.kgt-spectrum .kgt-cols { margin-top: 0; }
.kgt-col--terra { border-top-color: #B43A22; }
.kgt-col--bahama { border-top-color: #1F4E79; }
.kgt-col p { font-size: 16px; }

/* Plain data table (same look as the rubric, no level colours). */
.kgt-table { width: 100%; min-width: 560px; border-collapse: separate; border-spacing: 0; font-size: 15px; line-height: 1.45; background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); overflow: hidden; }
.kgt-table th, .kgt-table td { padding: 10px 12px; vertical-align: top; border-bottom: 1px solid var(--k-border); text-align: left; }
.kgt-table thead th { background: var(--k-navy); color: var(--k-white); font-family: var(--k-font-head); font-weight: 600; font-size: 14px; }
.kgt-table tbody th { font-family: var(--k-font-head); font-weight: 600; color: var(--k-navy); background: var(--k-cream); }
.kgt-table tbody tr:nth-child(even) td { background: #FBFBF8; }

/* Score ladder (1–4 with an example). */
.kgt-ladder { list-style: none; margin: var(--k-space-4) 0 var(--k-space-6); padding: 0; display: grid; gap: var(--k-space-2); }
.kgt-ladder li { display: grid; grid-template-columns: 56px 130px 1fr; gap: var(--k-space-3); align-items: center; background: var(--k-white); border-radius: var(--k-radius-control); box-shadow: var(--k-shadow); padding: 10px 14px; }
.kgt-ladder b { font-family: var(--k-font-head); font-size: 24px; color: var(--k-white); background: var(--k-navy); border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
.kgt-ladder li:nth-child(1) b { background: #B43A22; } .kgt-ladder li:nth-child(2) b { background: var(--k-amber); color: var(--k-black); } .kgt-ladder li:nth-child(3) b { background: var(--k-success); } .kgt-ladder li:nth-child(4) b { background: var(--k-navy); }
.kgt-ladder strong { font-family: var(--k-font-head); color: var(--k-navy); }
@media (max-width: 700px) { .kgt-ladder li { grid-template-columns: 48px 1fr; } .kgt-ladder li span { grid-column: 1 / -1; } }

/* Links to external forms (Zoho Survey, TEE) and downloads. */
.kgt-links { display: grid; gap: var(--k-gutter); grid-template-columns: repeat(2, minmax(0, 1fr)); margin: var(--k-space-5) 0; }
@media (max-width: 700px) { .kgt-links { grid-template-columns: 1fr; } }
.kgt-links .kg-card h3 { font-size: 19px; }
.kgt-ex--plain { background: var(--k-tint-blue); border-left: 4px solid #1F4E79; }
.kgt-ex--plain b { color: #1F4E79; }

/* Result band banner on the post-assessment result page. */
.kgt-band { border-radius: var(--k-radius-card); padding: var(--k-space-5) var(--k-space-6); margin: 0 0 var(--k-space-5); border-left: 6px solid var(--k-success); background: var(--k-tint-green); }
.kgt-band span { display: block; font-family: var(--k-font-head); font-weight: 600; font-size: 14px; color: var(--k-grey); }
.kgt-band strong { display: block; font-family: var(--k-font-head); font-size: 24px; color: var(--k-navy); margin: 4px 0 6px; }
.kgt-band p { margin: 0; }
.kgt-band--achievement { border-left-color: var(--k-amber); background: var(--k-tint-amber); }
.kgt-band--needs { border-left-color: #B43A22; background: #F6E7E4; }

/* Course sidebar (left, see inc/lms.php), desktop: content and sidebar are one flex row, the sidebar first.
   The sidebar column is as tall as the content; its inner panel stays in view below the stuck header (65 px).
   A long syllabus scrolls in the panel. Do not put position: sticky on #left-sidebar: the GeneratePress pull-75 offset needs position: relative. */
@media (min-width: 1025px) {
	.left-sidebar:is(.single-course, .single-lesson, .single-llms_quiz) .site-content { display: flex; align-items: stretch; }
	.left-sidebar:is(.single-course, .single-lesson, .single-llms_quiz) .site-content::before,
	.left-sidebar:is(.single-course, .single-lesson, .single-llms_quiz) .site-content::after { content: none; }
	.left-sidebar:is(.single-course, .single-lesson, .single-llms_quiz) #left-sidebar { order: -1; float: none; left: auto; }
	.left-sidebar:is(.single-course, .single-lesson, .single-llms_quiz) #primary { float: none; left: auto; }
	.left-sidebar:is(.single-course, .single-lesson, .single-llms_quiz) .inside-left-sidebar {
		position: sticky; top: 88px; max-height: calc(100vh - 112px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin;
	}
	.admin-bar.left-sidebar:is(.single-course, .single-lesson, .single-llms_quiz) .inside-left-sidebar { top: 120px; max-height: calc(100vh - 144px); }
}

/* ===== Focus Mode (LifterLMS 10, Logga 4 Oct 2026): lessons and quizzes open in LifterLMS's own page
   (no GeneratePress header, footer or theme sidebar). Settings: on, sidebar left, content width 768 px
   (Kognifi reading column, BB-02B §5). This layer brings the page to the CI; layout stays LifterLMS's. ===== */
body.llms-focus-mode { background: var(--k-cream); color: var(--k-black); font-family: var(--k-font-body); }
.llms-focus-mode .kg-mobilebar { display: none; } /* contact bar would cover the mobile Mark Complete bar */
.llms-focus-mode .llms-focus-mode-header { height: 64px; min-height: 64px; padding: 0 24px; background: var(--k-white); border-bottom: 1px solid var(--k-border); }
.llms-focus-mode .llms-focus-mode-body { height: calc(100dvh - 64px); }
.llms-focus-mode .llms-focus-mode-header-left { gap: 16px; }
.llms-focus-mode .llms-focus-mode-header-left::before {
	content: ""; display: block; width: 120px; height: 40px; flex-shrink: 0;
	background: url("img/kognifi-lockup.png") left center / contain no-repeat; /* lockup at the CI minimum width (CI-01 §3.6) */
}
.llms-focus-mode .llms-focus-mode-header-left a, .llms-focus-mode .llms-focus-mode-back-link,
.llms-focus-mode .llms-focus-mode-nav-btn {
	display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; box-sizing: border-box;
	border: 1.5px solid var(--k-blue); border-radius: var(--k-radius-control); background: var(--k-white); color: var(--k-blue);
	font-family: var(--k-font-body); font-weight: 500; font-size: 15px; line-height: 1; text-decoration: none;
}
.llms-focus-mode .llms-focus-mode-header-left a:hover, .llms-focus-mode .llms-focus-mode-back-link:hover,
.llms-focus-mode .llms-focus-mode-nav-btn:hover { background: var(--k-tint-blue); border-color: var(--k-blue); color: var(--k-navy); }
.llms-focus-mode a:focus-visible, .llms-focus-mode button:focus-visible { outline: 3px solid var(--k-navy); outline-offset: 2px; }
.llms-focus-mode .llms-focus-mode-nav-btn.llms-lesson-locked { border-color: var(--k-border); background: var(--k-cream); color: var(--k-grey); cursor: not-allowed; }
.llms-focus-mode .llms-focus-mode-header .llms-progress { max-width: 340px; margin: 0; }
.llms-focus-mode .llms-focus-mode-sidebar { width: 340px; min-width: 340px; background: var(--k-white); border-right: 0; box-shadow: var(--k-shadow); }
.llms-focus-mode .llms-focus-mode-sidebar .llms-focus-mode-sidebar-header { padding: 16px 24px; border-bottom: 1px solid var(--k-border); }
.llms-focus-mode .llms-focus-mode-sidebar .llms-focus-mode-sidebar-header h3 { font-family: var(--k-font-head); font-weight: 600; font-size: 18px; color: var(--k-navy); }
.llms-focus-mode .llms-focus-mode-sidebar .llms-focus-mode-sidebar-content { padding: 16px 24px 24px; }
.llms-focus-mode .llms-focus-mode-sidebar-toggle { right: -16px; width: 32px; height: 32px; border: 1px solid var(--k-border); border-radius: var(--k-radius-control); background: var(--k-white); color: var(--k-navy); box-shadow: var(--k-shadow); }
.llms-focus-mode .llms-focus-mode-sidebar-toggle:hover { background: var(--k-tint-blue); color: var(--k-navy); }
.llms-focus-mode .llms-focus-mode-content { padding: 48px 40px 64px; }
.llms-focus-mode .llms-focus-mode-content .llms-focus-mode-title {
	font-family: var(--k-font-head); font-weight: 700; font-size: 44px; line-height: 1.12; letter-spacing: -0.5px; color: var(--k-navy); margin: 0 auto 24px;
}
.llms-focus-mode.llms-focus-mode-width-768 .llms-focus-mode-content .llms-focus-mode-title { max-width: 768px; } /* core constrains the body only */
.llms-focus-mode .llms-focus-mode-content .llms-lesson-content { font-size: 18px; line-height: 1.6; }
.llms-focus-mode .llms-focus-mode-footer { background: var(--k-white); border-top: 1px solid var(--k-border); }
.llms-focus-mode .llms-focus-mode-footer .llms-lesson-button-wrapper .llms-button-primary,
.llms-focus-mode .llms-focus-mode-footer .llms-lesson-button-wrapper .llms-button-action { min-height: 44px; }
@media (max-width: 768px) {
	.llms-focus-mode .llms-focus-mode-header { padding: 0 16px; gap: 12px; }
	.llms-focus-mode .llms-focus-mode-header-left::before { display: none; } /* phone: the header keeps the course link and navigation only */
	.llms-focus-mode .llms-focus-mode-nav-label { display: none; }
	.llms-focus-mode .llms-focus-mode-sidebar { width: 100%; min-width: 0; box-shadow: none; border-top: 1px solid var(--k-border); }
	.llms-focus-mode .llms-focus-mode-content { padding: 24px 16px 32px; }
	.llms-focus-mode .llms-focus-mode-content .llms-focus-mode-title { font-size: 30px; }
	.llms-focus-mode .llms-focus-mode-content .llms-lesson-content { font-size: 16px; }
}
.llms-focus-mode .llms-lesson-content .llms-parent-course-link, .llms-focus-mode .llms-lesson-content .llms-return { display: none; } /* the header already has Back to Course / Return to Lesson */
/* Focus Mode: one primary action per view (BB-02B §2). The lesson action (Mark Complete / Start Assignment / Take Quiz) stays in the
   Focus Mode footer bar, which is always in view; Previous / Next stay in the header. Hide the copies inside the lesson content. */
.llms-focus-mode .llms-lesson-content .llms-lesson-button-wrapper,
.llms-focus-mode .llms-lesson-content .llms-course-navigation { display: none; }
.llms-focus-mode .llms-focus-mode-footer .llms-lesson-button-wrapper { display: flex; justify-content: center; padding: 12px 24px; }
/* Activity brief: the last line names the one action (Start Assignment), set apart by a rule. */
.kgt-activity .kgt-activity__action { margin: var(--k-space-4) 0 0; padding-top: var(--k-space-3); border-top: 1px solid var(--k-border); font-size: 16px; }
.kgt-activity .kgt-activity__action strong { color: var(--k-navy); }

/* Syllabus widget (Focus Mode sidebar and course sidebar), Logga 4 Oct 2026: lighter. Structure from size, spacing and a soft
   current-lesson band, not from bold black type. Sections Montserrat Medium Navy 15 px; lessons DM Sans Regular Charcoal 15 px,
   no underline until hover; done lessons grey with a Mid-Green tick (no strike-through); current lesson Bright Blue on Bahama tint. */
.llms-widget-syllabus { font-size: 15px; line-height: 1.45; color: var(--k-charcoal); }
.llms-widget-syllabus .llms-course-outline .section-header { margin: 16px 0 6px; color: var(--k-navy); }
.llms-widget-syllabus .llms-course-outline .llms-section:first-child .section-header { margin-top: 4px; }
.llms-widget-syllabus .section-title { font-family: var(--k-font-head); font-weight: 500; font-size: 15px; color: var(--k-navy); }
.llms-widget-syllabus .llms-collapse-caret { color: var(--k-grey); font-size: 13px; }
.llms-widget-syllabus .llms-lesson li { display: flex; align-items: flex-start; gap: 8px; padding: 6px 8px; margin: 0 0 2px; border-radius: var(--k-radius-control); }
.llms-widget-syllabus .llms-lesson a { color: var(--k-charcoal); font-weight: 400; text-decoration: none; }
.llms-widget-syllabus .llms-lesson a:hover, .llms-widget-syllabus .llms-lesson a:focus-visible { color: var(--k-blue); text-decoration: underline; text-underline-offset: 3px; }
.llms-widget-syllabus .llms-lesson-complete { color: var(--k-grey); }
.llms-widget-syllabus .llms-lesson-complete.done { color: var(--k-success); }
.llms-widget-syllabus .llms-lesson li:has(.llms-lesson-complete.done) a { color: var(--k-grey); text-decoration: none; }
.llms-widget-syllabus .llms-lesson li:has(.llms-lesson-complete.done) a:hover { color: var(--k-blue); text-decoration: underline; }
.llms-widget-syllabus .llms-lesson.current-lesson li { background: var(--k-tint-blue); } /* LifterLMS marks the current lesson on ul.llms-lesson */
.llms-widget-syllabus .llms-lesson.current-lesson a { color: var(--k-blue); font-weight: 500; text-decoration: none; }
.llms-widget-syllabus .llms-course-outline-actions, .llms-widget-syllabus .llms-collapse-toggle { font-size: 14px; }

/* H5P knowledge check (component knowledge_check): a white card on the lesson canvas, label above. Styles inside H5P: plugin
   Kognifi Practice, assets/h5p-kognifi.css. */
.kgt-h5p { background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); padding: var(--k-space-5); margin: var(--k-space-6) 0; }
.kgt-h5p__label { font-family: var(--k-font-head); font-weight: 600; font-size: 14px; color: #1F4E79; margin: 0 0 var(--k-space-3); }
.kgt-h5p .h5p-iframe-wrapper, .kgt-h5p iframe.h5p-iframe { border: 0; }
.kgt-h5p__intro { font-size: 16px; color: var(--k-charcoal); margin: 0 0 var(--k-space-3); }

/* Glossary (competency blocks, Concept layer): English term, Bahasa Malaysia, plain meaning. */
.kgt-glossary { background: var(--k-white); border-radius: var(--k-radius-card); box-shadow: var(--k-shadow); padding: var(--k-space-5); margin: var(--k-space-6) 0; }
.kgt-glossary h3 { margin-top: 0; font-size: 20px; }
.kgt-glossary dl { margin: 0; }
.kgt-glossary__row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--k-space-4); padding: var(--k-space-3) 0; border-top: 1px solid var(--k-border); }
.kgt-glossary dt { font-family: var(--k-font-head); font-weight: 600; color: var(--k-navy); }
.kgt-glossary dt span { display: block; font-family: var(--k-font-body); font-weight: 400; font-size: 14px; color: var(--k-grey); }
.kgt-glossary dd { margin: 0; }
@media (max-width: 600px) { .kgt-glossary__row { grid-template-columns: 1fr; gap: 4px; } }

/* Seat requests (plugin Kognifi Practice): card on the course page and on My Dashboard. */
.kgp-seat { margin: var(--k-space-6) 0; }
.kgp-seat h3 { margin-top: 0; }
.kgp-seat form { margin: 0; }
.kgp-seats > h2 { margin-top: 0; }