/* E-learning (LifterLMS) in de Doortje-stijl */
.llms-student-dashboard, .llms-syllabus-wrapper, .llms-quiz-wrapper, .llms-lesson-navigation, .llms-course-progress, .llms-person-login-form-wrapper, .llms-notice { font-family: var(--wp--preset--font-family--zonder-schreef); }
.wp-site-blocks .llms-student-dashboard, .wp-site-blocks .llms-person-login-form-wrapper { max-width: 1100px; margin-inline: auto; }

/* Knoppen */
.llms-button-action, .llms-button-primary, .llms-button-secondary, .llms-field-button, button.llms-button-action, #llms_start_quiz, #llms_answer_question, .llms-start-quiz-button {
  background: var(--wp--preset--color--logoblauw) !important; color: #1E2B45 !important; border: 0 !important; border-radius: 999px !important;
  padding: 14px 24px !important; font-weight: 600 !important; font-size: 15px !important; text-decoration: none !important;
  box-shadow: 0 5px 0 #6F8DBE !important; transition: transform .2s, box-shadow .2s !important; cursor: pointer; }
.llms-button-action:hover, .llms-button-primary:hover, #llms_start_quiz:hover, #llms_answer_question:hover { transform: translateY(-2px); box-shadow: 0 7px 0 #6F8DBE !important; }
.llms-button-secondary { background: #fff !important; box-shadow: inset 0 0 0 2px #1E2B45 !important; }

/* Voortgangsbalk als treinspoor met treintje */
.llms-progress { position: relative; height: 26px; background: transparent !important; margin: 40px 0 16px !important; }
.llms-progress .llms-progress-bar { position: absolute; left: 0; right: 0; top: 10px; height: 8px; border-radius: 4px; background: repeating-linear-gradient(90deg, #1E2B45 0 14px, transparent 14px 22px) !important; overflow: visible; }
.llms-progress .progress-bar-complete { position: relative; height: 8px; border-radius: 4px; background: var(--wp--preset--color--groen) !important; transition: width 1.2s cubic-bezier(.2,.8,.2,1); }
.llms-progress .progress-bar-complete::after { content: ""; position: absolute; right: -30px; top: -30px; width: 56px; height: 36px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 40'%3E%3Crect x='2' y='8' width='44' height='22' rx='6' fill='%23EC8B48'/%3E%3Crect x='8' y='0' width='9' height='10' rx='2' fill='%231E2B45'/%3E%3Crect x='28' y='12' width='12' height='9' rx='2' fill='%23DDE8F7'/%3E%3Cpath d='M46 14h10l6 8v8H46z' fill='%23EC8B48'/%3E%3Ccircle cx='14' cy='32' r='6' fill='%231E2B45'/%3E%3Ccircle cx='38' cy='32' r='6' fill='%231E2B45'/%3E%3C/svg%3E") center / contain no-repeat; animation: d-chug .5s ease-in-out infinite alternate; }
.llms-progress .progress__indicator { position: absolute; right: 0; top: -26px; font-family: var(--wp--preset--font-family--hand); font-size: 1.4rem; color: var(--wp--preset--color--groen-donker); }

/* Lesoverzicht (syllabus) */
.llms-syllabus-wrapper .llms-section-title { font-family: var(--wp--preset--font-family--schreef) !important; font-weight: 400 !important; font-size: 1.5rem !important; margin: 2rem 0 .8rem !important; padding: 0 !important; background: none !important; color: var(--wp--preset--color--tekst) !important; text-align: left !important; }
.llms-lesson-preview { margin: 0 0 12px !important; border-radius: 20px !important; overflow: hidden; transition: transform .3s cubic-bezier(.3,1.6,.5,1); }
.llms-lesson-preview:hover { transform: translateX(6px) rotate(-.4deg); }
.llms-lesson-preview .llms-lesson-link { background: #fff !important; border: 2px solid #E3E7DC !important; border-radius: 20px !important; padding: 18px 22px !important; display: block; color: inherit !important; text-decoration: none !important; box-shadow: none !important; }
.llms-lesson-preview.is-complete .llms-lesson-link { background: #E0EBCF !important; border-color: #B9D3A9 !important; }
.llms-lesson-preview .llms-lesson-title { font-weight: 600 !important; font-size: 16px !important; }
.llms-lesson-preview .llms-lesson-complete, .llms-lesson-preview .llms-lesson-complete-placeholder { color: var(--wp--preset--color--groen) !important; font-size: 22px !important; }
.llms-lesson-preview .llms-lesson-counter, .llms-lesson-preview .llms-extra { font-size: 13px; color: var(--wp--preset--color--grijs); }

/* Volgende/vorige les */
.llms-course-navigation { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 2rem; }
.llms-course-navigation .llms-lesson-preview .llms-lesson-link { background: var(--wp--preset--color--vlak-blauw) !important; border: 0 !important; }

/* Lesinhoud */
.d-les-intro { margin-bottom: 1.6rem !important; }
.d-les-badge { display: inline-flex !important; align-items: center; gap: 10px; border-radius: 999px; padding: 8px 16px 8px 10px !important; }
.d-les-badge > * { margin: 0 !important; }
.d-les-badge .d-icon { width: 24px; height: 24px; }
.d-les-meta { font-size: 13px !important; font-weight: 600; color: var(--ink); }
.d-les-title { font-size: clamp(2rem, 4vw, 2.8rem) !important; margin: .8rem 0 .6rem !important; }
.single-lesson .d-stickers, .single-lesson .d-flips { margin: 1.6rem 0 2rem !important; }
.single-lesson .d-banner { margin: 1.6rem 0 !important; max-width: none; }
.single-lesson .d-checks { margin: 1rem 0 1.6rem !important; }
.d-board-inline { margin: 1.4rem 0 !important; }
.d-board-inline .d-board { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 700px) { .d-board-inline .d-board { grid-template-columns: 1fr; } }

/* Quiz */
.llms-quiz-wrapper, .llms-quiz-ui { border-radius: 26px !important; }
.llms-quiz-ui { background: var(--wp--preset--color--vlak-blauw) !important; padding: clamp(20px, 4vw, 40px) !important; border: 0 !important; }
.llms-question-wrapper .llms-question-text { font-family: var(--wp--preset--font-family--schreef) !important; font-size: clamp(1.4rem, 2.6vw, 1.9rem) !important; line-height: 1.25 !important; font-weight: 400 !important; margin-bottom: 1.2rem !important; }
.llms-question-wrapper ol.llms-question-choices { list-style: none !important; padding: 0 !important; margin: 0 !important; display: grid; gap: 12px; }
.llms-question-wrapper ol.llms-question-choices li.llms-choice { margin: 0 !important; padding: 0 !important; border: 0 !important; }
.llms-question-wrapper ol.llms-question-choices li.llms-choice label { display: flex !important; align-items: center; gap: 14px; background: #fff; border: 2px solid transparent; border-radius: 18px; padding: 16px 18px !important; cursor: pointer; transition: transform .25s cubic-bezier(.3,1.6,.5,1), border-color .2s, background .2s; box-shadow: 0 6px 0 rgba(30,43,69,.06); }
.llms-question-wrapper ol.llms-question-choices li.llms-choice label:hover { transform: translateY(-2px); border-color: var(--wp--preset--color--logoblauw); }
.llms-question-wrapper ol.llms-question-choices li.llms-choice input:checked + span, .llms-question-wrapper ol.llms-question-choices li.llms-choice label:has(input:checked) { background: #FFF0C2; border-color: var(--wp--preset--color--oranje); }
.llms-question-wrapper .llms-marker { background: var(--wp--preset--color--oranje) !important; color: #fff !important; border-radius: 50% !important; width: 38px !important; height: 38px !important; display: grid !important; place-items: center; flex: none; font-weight: 700; }
.llms-quiz-counter { font-family: var(--wp--preset--font-family--hand); font-size: 1.4rem; color: var(--wp--preset--color--blauw-donker); }
.llms-quiz-results .llms-donut { --d: 1; }
.llms-quiz-results .llms-donut svg path { stroke: var(--wp--preset--color--groen) !important; }
.llms-quiz-results .llms-quiz-results-aside { text-align: center; }

/* Meldingen */
.llms-notice { border-radius: 18px !important; border: 2px dashed var(--wp--preset--color--logoblauw) !important; background: var(--wp--preset--color--vlak-blauw) !important; padding: 16px 20px !important; }
.llms-notice.llms-success { border-color: var(--wp--preset--color--groen) !important; background: #E0EBCF !important; }
.llms-notice.llms-error { border-color: var(--wp--preset--color--oranje) !important; background: #FDE3CF !important; }

/* Medewerkersportaal / dashboard */
.d-portal .llms-person-login-form-wrapper { background: #fff; border-radius: 30px; padding: clamp(24px, 4vw, 44px) !important; box-shadow: 0 30px 60px -36px rgba(30,43,69,.5); border: 3px solid var(--wp--preset--color--logoblauw); max-width: 520px; margin: 0 auto; position: relative; }
.d-portal .llms-person-login-form-wrapper::before { content: "Inloggen"; display: block; font-family: var(--wp--preset--font-family--schreef); font-size: 2rem; margin-bottom: 1rem; }
.d-portal .llms-form-field input[type=text], .d-portal .llms-form-field input[type=password], .d-portal .llms-form-field input[type=email], .llms-form-field input[type=text], .llms-form-field input[type=password], .llms-form-field input[type=email] { border: 2px solid #E3E7DC !important; border-radius: 14px !important; padding: 14px 16px !important; font-size: 16px !important; width: 100%; }
.llms-form-field input:focus { border-color: var(--wp--preset--color--logoblauw) !important; outline: none; }
.llms-form-field label { font-weight: 600; font-size: 14px; }
.llms-sd-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 1.6rem; }
.llms-sd-title { font-family: var(--wp--preset--font-family--schreef) !important; font-weight: 400 !important; }
/* Portaalmenu: nette zijbalk met icoontjes (op de telefoon een rij om te vegen) */
.llms-sd-layout-columns { grid-template-columns: 240px minmax(0, 1fr) !important; column-gap: 2.5rem !important; }
.llms-sd-nav { background: #fff; border: 1.5px solid #E7EAF0; border-radius: 22px; padding: 10px !important; align-self: start; width: auto !important; box-sizing: border-box; }
.llms-sd-nav select { display: none !important; }
.llms-sd-nav .llms-sd-items { display: flex !important; flex-direction: column; gap: 2px; list-style: none; padding: 0 !important; margin: 0 !important; }
.llms-sd-nav .llms-sd-item { margin: 0 !important; padding: 0 !important; border: 0 !important; }
.llms-sd-nav .llms-sd-link { display: flex !important; align-items: center; gap: 12px; padding: 11px 14px !important; border-radius: 14px; text-decoration: none !important; font-weight: 500; font-size: 15px; color: #2E3138 !important; transition: background .2s, color .2s; white-space: nowrap; }
.llms-sd-nav .llms-sd-link::before { content: ""; width: 20px; height: 20px; flex: none; background: currentColor; -webkit-mask: var(--d-sd-ic) center / contain no-repeat; mask: var(--d-sd-ic) center / contain no-repeat; opacity: .75; }
.llms-sd-nav .llms-sd-link:hover { background: var(--wp--preset--color--vlak-blauw, #EEF2FA); }
.llms-sd-nav .llms-sd-item.current .llms-sd-link { background: var(--wp--preset--color--blauw-donker, #496390); color: #fff !important; }
.llms-sd-nav .llms-sd-item.current .llms-sd-link::before { opacity: 1; }
.llms-sd-nav .llms-sd-item.signout { margin-top: 6px !important; padding-top: 6px !important; border-top: 1.5px dashed #E7EAF0 !important; }
.llms-sd-nav .llms-sd-item.signout .llms-sd-link { color: #8a5a3c !important; font-size: 14px; }
.llms-sd-nav .llms-sep { display: none !important; }
.llms-sd-nav .llms-sd-item.dashboard .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E"); }
.llms-sd-nav .llms-sd-item.view-courses .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5a2 2 0 0 1 2-2h13v16H6a2 2 0 0 0-2 2z'/%3E%3Cpath d='M4 19V5'/%3E%3Cpath d='M9 7h6'/%3E%3C/svg%3E"); }
.llms-sd-nav .llms-sd-item.my-grades .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10'/%3E%3Cpath d='M10 20V4'/%3E%3Cpath d='M16 20v-7'/%3E%3Cpath d='M22 20H2'/%3E%3C/svg%3E"); }
.llms-sd-nav .llms-sd-item.view-certificates .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='6'/%3E%3Cpath d='M8.5 14l-1.5 7 5-3 5 3-1.5-7'/%3E%3C/svg%3E"); }
.llms-sd-nav .llms-sd-item.notifications .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9a6 6 0 0 1 12 0c0 6 3 7 3 7H3s3-1 3-7'/%3E%3Cpath d='M10 20a2 2 0 0 0 4 0'/%3E%3C/svg%3E"); }
.llms-sd-nav .llms-sd-item.edit-account .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E"); }
.llms-sd-nav .llms-sd-item.signout .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E"); }
@media (max-width: 782px) {
	.llms-sd-layout-columns { grid-template-columns: minmax(0, 1fr) !important; }
	.llms-sd-nav { min-width: 0; padding: 6px !important; border-radius: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
	.llms-sd-nav::-webkit-scrollbar { display: none; }
	.llms-sd-nav .llms-sd-items { flex-direction: row; gap: 4px; }
	.llms-sd-nav .llms-sd-link { padding: 9px 12px !important; font-size: 14px; }
	.llms-sd-nav .llms-sd-item.signout { margin: 0 0 0 4px !important; padding: 0 0 0 4px !important; border-top: 0 !important; border-left: 1.5px dashed #E7EAF0 !important; }
}
.llms-loop-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; list-style: none; padding: 0 !important; }
.llms-loop-item { margin: 0 !important; width: auto !important; }
.llms-loop-item-content { background: #fff; border-radius: 24px !important; overflow: hidden; border: 2px solid #E3E7DC; padding-bottom: 16px !important; transition: transform .3s cubic-bezier(.3,1.6,.5,1); }
.llms-loop-item-content:hover { transform: translateY(-6px) rotate(-1deg); }
.llms-loop-item-content .llms-loop-title { font-family: var(--wp--preset--font-family--schreef) !important; font-weight: 400 !important; font-size: 1.3rem !important; padding: 0 18px !important; }

/* Certificaat */
.llms-certificate-container, .certificate-content, .llms-certificate-wrapper { position: relative; }
.single-llms_my_certificate .wp-block-post-content, .llms-certificate-container { background: #fff; border: 14px solid var(--wp--preset--color--logoblauw); outline: 4px dashed var(--wp--preset--color--oranje); outline-offset: -26px; border-radius: 24px; padding: clamp(40px, 6vw, 80px) !important; text-align: center; max-width: 900px; margin: 30px auto !important; box-shadow: 0 30px 60px -36px rgba(30,43,69,.6); }
.d-cert-label { font-size: 12px !important; letter-spacing: .3em; text-transform: uppercase; font-weight: 600; color: var(--wp--preset--color--oranje); }
.d-cert-title { font-size: clamp(1.8rem, 4vw, 2.6rem) !important; margin: .4rem 0 1.4rem !important; }
.d-cert-name { font-family: var(--wp--preset--font-family--hand); font-size: clamp(2rem, 5vw, 3rem) !important; color: var(--wp--preset--color--blauw-donker); margin: .4rem 0 !important; }
.d-cert-small { color: var(--wp--preset--color--grijs); }
.d-cert-date { font-weight: 600; margin-top: 1.4rem !important; }
.d-cert-quote { font-family: var(--wp--preset--font-family--schreef); font-style: italic; color: var(--wp--preset--color--groen-donker); margin-top: 1.6rem !important; }
.d-cert-quote::before { content: ""; display: block; width: 110px; height: 110px; margin: 0 auto 10px; border-radius: 50%; border: 4px solid var(--wp--preset--color--oranje); background: radial-gradient(circle, #FFF0C2 0 58%, transparent 59%); transform: rotate(-12deg); }

/* Confetti bij geslaagd */
.d-confetti { position: fixed; inset: 0; pointer-events: none; z-index: 9999; overflow: hidden; }
.d-confetti i { position: absolute; top: -20px; width: 10px; height: 16px; border-radius: 3px; animation: d-confettiFall linear forwards; }
@keyframes d-confettiFall { to { transform: translateY(110vh) rotate(720deg); } }

/* Losse cursus-, les- en quizpagina's */
.d-single { padding-top: var(--wp--preset--spacing--50) !important; }
.d-single-title { font-size: clamp(2.2rem, 5vw, 3.4rem) !important; margin-bottom: 1.2rem !important; }
.single-course .d-single-title::before, .single-lesson .d-single-title::before, .single-llms_quiz .d-single-title::before { display: block; font: 600 12px/1 var(--wp--preset--font-family--zonder-schreef); letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--oranje); margin-bottom: .8rem; }
.single-course .d-single-title::before { content: "Inwerkcursus"; }
.single-lesson .d-single-title::before { content: "Les"; }
.single-llms_quiz .d-single-title::before { content: "Quiz"; }
.single-lesson .d-les-intro .d-les-title { display: none; }
.d-portal .llms-person-login-form-wrapper::before { content: none; }
.llms-meta-info, .llms-instructor-info, .llms-course-categories, .llms-course-tags, .llms-course-tracks, .llms-meta-title, .llms-instructor-info + * { display: none !important; }
.llms-lesson-preview .llms-lesson-complete-placeholder { color: #D9DEE8 !important; }
.llms-lesson-preview .llms-lesson-complete { color: var(--wp--preset--color--groen) !important; }
.llms-lesson-preview .llms-extra { display: flex; justify-content: space-between; margin-top: 6px; }

/* Antwoordtegels (LifterLMS 10: fieldset + div.llms-choice) */
.llms-question-wrapper .llms-question-choices { border: 0; padding: 0; margin: 0; display: grid; gap: 12px; }
.llms-question-wrapper .llms-choice { margin: 0 !important; padding: 0 !important; border: 0 !important; position: relative; }
.llms-question-wrapper .llms-choice input { position: absolute; opacity: 0; pointer-events: none; }
.llms-question-wrapper .llms-choice label { display: flex !important; align-items: center; gap: 14px; background: #fff; border: 2px solid transparent; border-radius: 18px; padding: 14px 18px !important; cursor: pointer; transition: transform .25s cubic-bezier(.3,1.6,.5,1), border-color .2s, background .2s; box-shadow: 0 6px 0 rgba(30,43,69,.06); }
.llms-question-wrapper .llms-choice label::before { content: attr(data-marker); flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--wp--preset--color--vlak-blauw); color: var(--wp--preset--color--blauw-donker); font-weight: 700; transition: background .2s, color .2s, transform .3s cubic-bezier(.3,1.6,.5,1); }
.llms-question-wrapper .llms-choice label:hover { transform: translateY(-2px); border-color: var(--wp--preset--color--logoblauw); }
.llms-question-wrapper .llms-choice input:checked + label { background: #FFF0C2; border-color: var(--wp--preset--color--oranje); }
.llms-question-wrapper .llms-choice input:checked + label::before { background: var(--wp--preset--color--oranje); color: #fff; transform: rotate(-10deg) scale(1.1); }
.llms-question-wrapper .llms-choice input:focus-visible + label { outline: 3px solid var(--wp--preset--color--oranje); outline-offset: 3px; }
.llms-question-wrapper .llms-choice-text { margin: 0 !important; font-size: 16px; font-weight: 500; }

/* Lesbouwstenen: stappenplan en citaat */
.d-stappen { list-style: none; counter-reset: stap; padding: 0 !important; margin: 1.2rem 0 1.8rem !important; display: grid; gap: 10px; }
.d-stappen li { counter-increment: stap; position: relative; background: #fff; border: 2px solid #E3E7DC; border-radius: 18px; padding: 14px 18px 14px 66px; font-size: 14.5px; color: var(--wp--preset--color--grijs); }
.d-stappen li::before { content: counter(stap); position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--wp--preset--color--oranje); color: #fff; font-family: var(--wp--preset--font-family--schreef); font-size: 1.2rem; }
.d-stappen li:not(:last-child)::after { content: ""; position: absolute; left: 32px; bottom: -12px; width: 2px; height: 12px; background: var(--wp--preset--color--oranje); }
.d-stappen li strong { display: block; color: var(--wp--preset--color--tekst); font-size: 15px; margin-bottom: 2px; }
.d-les-quotebox { background: var(--wp--preset--color--vlak-groen); border-radius: 22px; padding: 22px 26px !important; margin: 1.4rem 0 !important; position: relative; }
.d-les-quotebox::before { content: "\201C"; position: absolute; right: 18px; top: -14px; font: 400 6rem/1 var(--wp--preset--font-family--schreef); color: var(--wp--preset--color--groen); opacity: .35; }
.d-les-quote { font-family: var(--wp--preset--font-family--schreef); font-size: 1.3rem !important; line-height: 1.35; margin: 0 0 .4rem !important; }
.d-les-quote-by { font-size: 13px !important; color: var(--wp--preset--color--grijs); margin: 0 !important; }

.d-bron { display: inline-block; font-size: 12px; font-weight: 600; background: #FFF0C2; border: 1.5px dashed #E0B44A; border-radius: 99px; padding: 6px 14px; margin-bottom: 1rem !important; }

/* Cursuskaarten: geen grijze plaatshouder maar een gekleurde tegel met nummer */
.llms-loop-list { counter-reset: kaart; }
.llms-loop-item { counter-increment: kaart; }
.llms-loop-item-content img.llms-featured-image[src*="placeholder"], .llms-loop-item-content img[src*="placeholder"] { display: none !important; }
.llms-loop-item-content .llms-loop-link::before { content: counter(kaart); display: grid; place-items: center; height: 120px; font-family: var(--wp--preset--font-family--schreef); font-size: 3.4rem; color: #fff; background: var(--wp--preset--color--oranje); border-radius: 0 0 50% 50% / 0 0 18% 18%; margin-bottom: 14px; }
.llms-loop-item:nth-child(6n+2) .llms-loop-link::before { background: var(--wp--preset--color--logoblauw); }
.llms-loop-item:nth-child(6n+3) .llms-loop-link::before { background: var(--wp--preset--color--groen); }
.llms-loop-item:nth-child(6n+4) .llms-loop-link::before { background: #E5675A; }
.llms-loop-item:nth-child(6n+5) .llms-loop-link::before { background: var(--wp--preset--color--blauw-donker); }
.llms-loop-item:nth-child(6n+6) .llms-loop-link::before { background: #E0B44A; }
.llms-loop-item-content .llms-author, .llms-loop-item-content .llms-author-info { display: none !important; }
.llms-loop-item-content .llms-meta { padding: 0 18px !important; font-size: 13px; color: var(--wp--preset--color--grijs); margin: 4px 0 !important; }

/* Wat je leert (cursuspagina) */
.d-watleer { background: var(--wp--preset--color--vlak-blauw); border-radius: 26px; padding: clamp(20px, 3vw, 32px) !important; margin: 1.6rem 0 !important; }
.d-wl-meta { font-family: var(--wp--preset--font-family--hand); font-size: 1.4rem !important; color: var(--wp--preset--color--blauw-donker); margin: .2rem 0 1rem !important; }
.d-wl { list-style: none; padding: 0 !important; margin: 0 !important; display: grid; gap: 10px; counter-reset: none; }
.d-wl li { background: #fff; border-radius: 18px; padding: 14px 18px; font-size: 14px; color: var(--wp--preset--color--grijs); line-height: 1.5; position: relative; }
.d-wl li strong { display: block; color: var(--wp--preset--color--tekst); font-size: 15.5px; margin-bottom: 3px; padding-right: 70px; }
.d-wl-min { position: absolute; right: 16px; top: 14px; font-size: 12px; font-weight: 600; background: #FFF0C2; color: #9A6A00; border-radius: 99px; padding: 3px 10px; }
.d-wl-top { display: block; margin-top: 6px; font-size: 12.5px; font-weight: 600; color: var(--wp--preset--color--groen-donker); }
.d-wl-top::before { content: "Onderwerpen: "; font-weight: 400; color: var(--wp--preset--color--grijs); }
/* In deze les (lespagina) */
.d-inles { border: 2px dashed var(--wp--preset--color--logoblauw); border-radius: 18px; padding: 12px 18px !important; margin: 0 0 1.6rem !important; }
.d-inles > * { margin: 0 !important; }
.d-inles-topics { font-weight: 600; font-size: 14.5px; color: var(--wp--preset--color--blauw-donker); }
/* Lesoverzicht: beschrijving, geen hartjes, juiste vinkjes */
.llms-lesson-excerpt { font-size: 13.5px; color: var(--wp--preset--color--grijs); margin-top: 4px; line-height: 1.5; }
.llms-favorite-wrapper, .llms-lesson-meta .llms-favorite-action, .llms-heart-btn { display: none !important; }
.llms-lesson-preview:not(.is-complete) .llms-extra i, .llms-lesson-preview:not(.is-complete) .llms-lesson-complete i { color: #D9DEE8 !important; }
.llms-lesson-meta { font-size: 12.5px; color: var(--wp--preset--color--grijs); padding: 4px 6px 0; }

/* ===== Portaal: inwerktraject en jaarlijkse scholing als twee blokken ===== */
.d-portaal-blokken { display: grid; gap: 1.4rem; margin: 0 0 2rem; }
.d-portaal-blok { border-radius: 22px; padding: 1.4rem 1.5rem 1.2rem; background: var(--wp--preset--color--vlak-blauw, #EEF2FA); }
.d-portaal-blok.is-scholing { background: var(--wp--preset--color--vlak-groen, #EEF1E6); }
.d-portaal-blok header { display: flex; gap: 1rem; justify-content: space-between; align-items: flex-start; margin-bottom: .8rem; }
.d-portaal-blok h3 { margin: 0 0 .2rem; font-size: 1.45rem; }
.d-portaal-blok header p { margin: 0; font-size: .92rem; opacity: .8; }
.d-portaal-teller { flex: none; background: #fff; border-radius: 99px; padding: .3rem .9rem; font-weight: 600; font-size: .85rem; color: var(--wp--preset--color--blauw-donker, #496390); }
.is-scholing .d-portaal-teller { color: var(--wp--preset--color--groen-donker, #496B3D); }
.d-portaal-lijst { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.d-portaal-lijst li { display: grid; grid-template-columns: 2.2rem 1fr 7rem 5.5rem; gap: .8rem; align-items: center; background: #fff; border-radius: 14px; padding: .6rem .9rem; }
.d-portaal-nr { width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; font-weight: 600; background: var(--wp--preset--color--logoblauw, #8EAAD5); color: #fff; }
.is-scholing .d-portaal-nr { background: var(--wp--preset--color--groen, #729A47); }
.d-portaal-lijst li.is-klaar .d-portaal-nr { background: var(--wp--preset--color--oranje, #EC8B48); }
.d-portaal-lijst a { font-weight: 600; text-decoration: none; color: inherit; }
.d-portaal-lijst a small { font-weight: 400; opacity: .6; }
.d-portaal-balk { height: 8px; border-radius: 99px; background: #eceff4; overflow: hidden; }
.d-portaal-balk i { display: block; height: 100%; border-radius: 99px; background: var(--wp--preset--color--groen, #729A47); }
.d-portaal-status { font-size: .85rem; text-align: right; opacity: .8; }
.d-portaal-leeg { margin: 0; background: #fff; border-radius: 14px; padding: .9rem 1rem; font-size: .92rem; }
@media (max-width: 640px) {
	.d-portaal-blok header { flex-direction: column; }
	.d-portaal-lijst li { grid-template-columns: 2.2rem 1fr; }
	.d-portaal-balk, .d-portaal-status { grid-column: 2; }
	.d-portaal-status { text-align: left; }
}

/* Geen Engelse pop-ups van LifterLMS (inschrijven, les/quiz afgerond, certificaat). Felicitaties doen we zelf. */
.llms-notification, .llms-notifications { display: none !important; }


/* ===== Mijn cursussen: tegels zonder avatar en status, met voortgang ===== */
.llms-loop-item .llms-author, .llms-loop-item .llms-enroll-status { display: none !important; }

/* ===== Certificaat ===== */
.llms-certificate-container p, .llms-certificate-container h2 { white-space: normal !important; overflow-wrap: break-word; }
.llms-certificate-container .d-cert-small { max-width: 34em; margin-left: auto !important; margin-right: auto !important; }
.d-cert-quote::before { background: url("../img/logo-doortje.png") center 52% / 70% auto no-repeat, radial-gradient(circle, #FFF6DA 0 64%, transparent 65%) !important; }
.llms-certificate-actions, .llms-print-certificate { text-align: center; }
.llms-certificate-actions .llms-button-secondary, .llms-certificate-actions button, .llms-certificate-actions a { border-radius: 999px !important; }

/* ===== Mijn certificaten: kaarten, eindcertificaat uitgelicht ===== */
.llms-certificates-loop { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; list-style: none; padding: 0 !important; margin: 0 !important; }
.llms-certificates-loop .llms-certificate-loop-item { width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important; }
.llms-certificates-loop .llms-certificate { display: block; height: 100%; box-sizing: border-box; padding: 18px 18px 16px 62px !important; border-radius: 18px; border: 1.5px solid #E7EAF0 !important; background: #fff; text-decoration: none !important; position: relative; transition: transform .2s, box-shadow .2s; min-height: 0 !important; }
.llms-certificates-loop .llms-certificate::before { content: ""; position: absolute; left: 16px; top: 18px; width: 32px; height: 32px; border-radius: 50%; background: #FFF6DA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23EC8B48' d='M12 2.5l2.9 6.1 6.6.8-4.9 4.6 1.3 6.6L12 17.3l-5.9 3.3 1.3-6.6-4.9-4.6 6.6-.8z'/%3E%3C/svg%3E") center / 20px no-repeat; }
.llms-certificates-loop .llms-certificate:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(73, 99, 144, .12); }
.llms-certificates-loop .llms-certificate-title { margin: 0 0 4px !important; font-family: var(--wp--preset--font-family--schreef) !important; font-weight: 400 !important; font-size: 1.1rem !important; color: #2E3138; text-align: left !important; }
.llms-certificates-loop .llms-certificate-date { font-size: .85rem; color: #6B6F78; text-align: left !important; }
.llms-certificates-loop .d-cert-eind { grid-column: 1 / -1; }
.llms-certificates-loop .d-cert-eind .llms-certificate { background: var(--wp--preset--color--vlak-oranje, #FCF0E6); border-color: #F3C9A6 !important; padding: 22px 22px 20px 76px !important; }
.llms-certificates-loop .d-cert-eind .llms-certificate::before { width: 42px; height: 42px; background-size: 26px; background-color: #fff; top: 22px; left: 20px; }
.llms-certificates-loop .d-cert-eind .llms-certificate-title { font-size: 1.45rem !important; }
.llms-certificates-loop .d-cert-eind .llms-certificate-title::after { content: "Eindcertificaat"; display: inline-block; margin-left: 10px; vertical-align: middle; font: 600 11px/1 var(--wp--preset--font-family--poppins, Poppins), sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: var(--wp--preset--color--oranje, #EC8B48); border-radius: 99px; padding: 5px 9px; }

/* ===== Quiz: startkaart ===== */
.llms-quiz-meta-title { font-size: 1.3rem !important; margin: 0 0 .6rem !important; }
.llms-quiz-meta-info { list-style: none; padding: 0 !important; margin: 0 0 1.2rem !important; display: flex; flex-wrap: wrap; gap: 8px; }
.llms-quiz-meta-info .llms-quiz-meta-item, .single-llms_quiz ul.llms-quiz-meta-info li { margin: 0 !important; background: var(--wp--preset--color--vlak-blauw, #EEF2FA); border-radius: 999px; padding: 7px 16px !important; font-size: .92rem; line-height: 1.35; }
/* onder de ring: labels gecentreerd onder elkaar */
.llms-quiz-results-aside .llms-quiz-meta-info { flex-direction: column; align-items: center; margin-top: 14px !important; }
.llms-quiz-results-aside .llms-quiz-meta-item { text-align: center; text-wrap: balance; max-width: 100%; }
.llms-quiz-meta-info .llms-quiz-meta-item span { font-weight: 600; }

/* ===== Cursuspagina: één lessenlijst (die van ons, klikbaar) ===== */
.d-syllabus-samen .llms-syllabus-wrapper { display: none !important; }
.d-wl li.d-wl-link { cursor: pointer; position: relative; transition: transform .2s, box-shadow .2s; }
.d-wl li.d-wl-link:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(73, 99, 144, .12); }
.d-wl li.d-wl-link strong a { color: inherit; text-decoration: none; }
.d-wl li.is-klaar .d-wl-min { background: #EEF1E6 !important; color: #496B3D !important; }
.d-wl li.is-klaar .d-wl-min::before { content: "✓ "; }

/* ===== Quiz: voortgangsbalk bovenin als echte balk (was een los streepje) ===== */
.llms-quiz-header .llms-progress { height: 8px !important; background: #E7EAF0 !important; border-radius: 99px; overflow: hidden; margin: 0 0 1rem !important; }
.llms-quiz-header .llms-progress::before, .llms-quiz-header .llms-progress::after { display: none !important; }
.llms-quiz-header .progress-bar-complete { height: 100% !important; min-width: 8px; background: var(--wp--preset--color--groen, #729A47) !important; border-radius: 99px; transition: width .4s; }

/* Quizuitslag op de telefoon: vraag over de volle breedte, punten en vinkje eronder */
@media (max-width: 600px) {
	.llms-quiz-attempt-question-header .toggle-answer { display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px 10px; text-align: left; }
	.llms-quiz-attempt-question-header .llms-question-title { flex: 1 1 100% !important; width: 100% !important; font-size: 1.05rem !important; line-height: 1.35; }
	.llms-quiz-attempt-question-header .llms-points { margin-right: auto; font-size: 13px; }
}

/* Ander thema actief: kop, menu, voettekst en paginatitel van dat thema verbergen; eigen kop en voet */
body.doortje-leer-los .wp-site-blocks > header, body.doortje-leer-los .wp-site-blocks > footer,
body.doortje-leer-los header.wp-block-template-part, body.doortje-leer-los footer.wp-block-template-part,
body.doortje-leer-los .wp-block-post-title, body.doortje-leer-los .wp-block-post-featured-image,
body.doortje-leer-los .wp-block-post-date, body.doortje-leer-los .wp-block-post-author-name,
body.doortje-leer-los .wp-block-post-terms, body.doortje-leer-los .wp-block-comments,
body.doortje-leer-los .wp-block-post-navigation-link, body.doortje-leer-los .wp-block-post-author,
body.doortje-leer-los .taxonomy-category, body.doortje-leer-los .wp-block-post-meta { display: none !important; }
body.doortje-leer-los main, body.doortje-leer-los .wp-site-blocks > main { margin-top: 0 !important; padding-top: 0 !important; }
body.doortje-leer-los .wp-site-blocks { padding-top: 0 !important; }
body.doortje-leer-los { background: #FBF8F2; }
.d-leer-kop { display: flex; align-items: center; gap: 16px; padding: 14px max(16px, calc((100% - 1100px) / 2)); background: #fff; border-bottom: 1px solid #E3E7DC; position: sticky; top: 0; z-index: 50; }
.admin-bar .d-leer-kop { top: 32px; }
@media (max-width: 782px) { .admin-bar .d-leer-kop { top: 46px; } }
.d-leer-logo img { display: block; width: 110px; height: auto; }
.d-leer-naam { font: 600 13px/1.2 Poppins, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #496390; }
.d-leer-uit { margin-left: auto; font: 600 14px Poppins, system-ui, sans-serif; color: #C8661F !important; text-decoration: none; }
.d-leer-voet { text-align: center; padding: 28px 16px 36px; font: 13px/1.6 Poppins, system-ui, sans-serif; color: #6B6F78; }
.d-leer-voet a { color: #496390; }
.d-portaal-beheer { background: #FFF3CF; border-radius: 16px; padding: 14px 18px; margin: 0 0 18px; font-size: 14.5px; line-height: 1.55; }
.d-portaal-beheer a { color: #496390; font-weight: 600; }

/* Eigen pagina-opbouw bij een ander thema (templates/leer.php) */
body.doortje-leer-los { margin: 0; font-family: Poppins, system-ui, sans-serif; font-size: 16px; line-height: 1.65; color: #333; }
.d-leer-main { min-height: 60vh; }
.d-leer-titelblok { max-width: 820px; margin: 0 auto; padding: 44px 20px 8px; }
.d-leer-soort { color: var(--wp--preset--color--oranje, #EC8B48) !important; margin: 0 0 .4rem !important; }
.d-leer-titel { font-family: Fraunces, Georgia, serif; font-weight: 400; font-size: clamp(2rem, 5vw, 3rem); line-height: 1.12; margin: 0; color: #2E3138; }
.d-leer-inhoud { max-width: 820px; margin: 0 auto; padding: 16px 20px 40px; }
.d-leer-inhoud.is-portaal { max-width: none; padding: 0 0 20px; }
.d-leer-inhoud.is-portaal > .alignfull { width: 100%; }
.d-leer-inhoud.is-portaal .d-portal .lifterlms, .d-leer-inhoud.is-portaal .d-section > * { max-width: 1100px; margin-left: auto !important; margin-right: auto !important; padding-left: 20px; padding-right: 20px; box-sizing: border-box; }
.d-leer-inhoud img { max-width: 100%; height: auto; }

body.doortje-leer-los .d-crumbs { display: none !important; }

/* ------------------------------------------------------------------ Beleidsbibliotheek */
.d-bieb-intro { max-width: 760px; color: var(--wp--preset--color--grijs, #4C5568); }
.d-bieb-vakken { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; margin-top: 1.2rem; }
.d-bieb-vak { border-radius: 22px; padding: 1.2rem 1.3rem 1rem; background: var(--wp--preset--color--vlak-blauw, #EEF2FA); }
.d-bieb-vak:nth-child(3n+2) { background: var(--wp--preset--color--vlak-groen, #EEF1E6); }
.d-bieb-vak:nth-child(3n+3) { background: #FFF3E3; }
.d-bieb-vak h3 { margin: 0 0 .6rem !important; font-size: 1.15rem !important; }
.d-bieb-vak ul { list-style: none; margin: 0 !important; padding: 0 !important; display: grid; gap: 6px; }
.d-bieb-vak li { display: flex; align-items: center; gap: 10px; background: #fff; border-radius: 14px; padding: 10px 12px; }
.d-bieb-vak li a { flex: 1; text-decoration: none; color: inherit; display: grid; }
.d-bieb-naam { font-weight: 600; }
.d-bieb-meta { font-size: 13px; color: var(--wp--preset--color--grijs, #4C5568); }
.d-bieb-nieuw, .d-bieb-gelezen { font-size: 12px; font-weight: 600; border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.d-bieb-nieuw { background: var(--wp--preset--color--oranje, #EC8B48); color: #fff; }
.d-bieb-gelezen { background: #E3EEDB; color: #3F6B2E; }
.d-bieb-kop { margin: .4rem 0 1rem; }
.d-bieb-kop h2 { margin: .2rem 0 .3rem !important; }
.d-bieb-cat { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--groen-donker, #3F6B2E); }
.d-bieb-terug { text-decoration: none; font-weight: 600; }
.d-bieb-paginas { display: grid; gap: 18px; justify-items: center; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.d-bieb-pagina { margin: 0; width: 100%; max-width: 900px; position: relative; }
.d-bieb-pagina img { width: 100%; height: auto; display: block; border-radius: 6px; box-shadow: 0 14px 34px -20px rgba(30,43,69,.5); background: #fff; pointer-events: none; }
.d-bieb-pagina::after { content: ""; position: absolute; inset: 0; } /* geen 'afbeelding opslaan' via rechtsklik/lang drukken */
.d-bieb-pagina figcaption { text-align: center; font-size: 12px; color: #8A93A6; margin-top: 4px; }
.d-bieb-afsluiten { display: flex; justify-content: center; margin: 1.6rem 0 .4rem; }
.d-bieb-gelezen-tekst { color: #3F6B2E; font-weight: 600; }
.d-bieb-print { display: none; }
.d-bieb-melding { border-radius: 18px; background: #FFF3E3; border: 2px dashed var(--wp--preset--color--oranje, #EC8B48); padding: 1rem 1.2rem; margin: 0 0 1.2rem; }
.d-bieb-melding ul { margin: .4rem 0 0 !important; }
@media print {
	.d-bieb-paginas, .d-bieb-afsluiten { display: none !important; }
	.d-bieb-print { display: block !important; font-size: 18pt; }
}
.llms-sd-nav .llms-sd-item.beleidsbibliotheek .llms-sd-link { --d-sd-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h4v16H4z'/%3E%3Cpath d='M10 4h4v16h-4z'/%3E%3Cpath d='m16.5 5.2 3.8-1 3 15.4-3.8 1z'/%3E%3C/svg%3E"); }
/* Telefoon: tik op een pagina om in te zoomen (dan horizontaal schuiven) */
@media (max-width: 781px) {
	.d-bieb-paginas { overflow-x: auto; justify-items: start; }
	.d-bieb-pagina { cursor: zoom-in; }
	.d-bieb-pagina.is-groot { width: 230%; max-width: none; cursor: zoom-out; }
	.d-bieb-lezen .d-bieb-kop::after { content: "Tik op een pagina om in te zoomen."; display: block; font-size: 13px; color: #8A93A6; margin-top: .3rem; }
}

/* Mascotte Doortje in de leeromgeving (beelden in ../img/mascotte/):
   lezen bij het begin van een les, wijzen bij tips, nadenken bij de quiz, juichen bij geslaagd en op het certificaat, oeps bij nog niet geslaagd */
.single-lesson .d-les-intro { position: relative; padding-right: clamp(0px, 20%, 160px); min-height: 200px; }
.single-lesson .d-les-intro::after { content: ""; position: absolute; right: 0; top: 0; width: clamp(100px, 15%, 132px); aspect-ratio: 375 / 560; background: url(../img/mascotte/lezen.webp) center / contain no-repeat; pointer-events: none; }
.single-lesson .d-banner { position: relative; padding-right: 96px !important; }
.single-lesson .d-banner::after { content: ""; position: absolute; right: 12px; bottom: -6px; width: 72px; aspect-ratio: 301 / 560; background: url(../img/mascotte/wijzen.webp) center bottom / contain no-repeat; pointer-events: none; }
.llms-quiz-ui { position: relative; }
.llms-quiz-ui::after { content: ""; position: absolute; right: clamp(10px, 3vw, 30px); bottom: 100%; margin-bottom: -16px; width: 76px; aspect-ratio: 251 / 560; background: url(../img/mascotte/nadenken.webp) center / contain no-repeat; pointer-events: none; }
.llms-quiz-results-aside::before { content: ""; display: block; width: 120px; aspect-ratio: 343 / 560; margin: 0 auto 10px; background: center / contain no-repeat; }
.llms-quiz-results-aside:has(.llms-donut.pass)::before, .llms-quiz-results-aside:has(.llms-donut.passing)::before { background-image: url(../img/mascotte/juichen.webp); }
.llms-quiz-results-aside:has(.llms-donut.fail)::before, .llms-quiz-results-aside:has(.llms-donut.failing)::before { background-image: url(../img/mascotte/oeps.webp); width: 96px; aspect-ratio: 253 / 560; }
.d-cert-quote::before { background: url(../img/mascotte/juichen.webp) center 85% / auto 88% no-repeat, #FFF6E0 !important; }
@media (max-width: 700px) {
	.single-lesson .d-les-intro { padding-right: 0; min-height: 0; }
	.single-lesson .d-les-intro::after { position: static; display: block; translate: none; width: 96px; margin-top: .6rem; }
	.single-lesson .d-banner { padding-right: 20px !important; }
	.single-lesson .d-banner::after { display: none; }
	.llms-quiz-ui::after { width: 58px; }
}

/* Vraag het Doortje: vast rechtsonder in de leeromgeving (assets/js/vraag-doortje.js) */
.d-vraag { position: fixed; z-index: 9990; right: max(14px, env(safe-area-inset-right, 0px)); bottom: max(10px, env(safe-area-inset-bottom, 0px)); font-family: var(--wp--preset--font-family--body, Poppins, system-ui, sans-serif); }
.d-vraag-knop { display: flex; align-items: flex-end; gap: 4px; background: none; border: 0; padding: 0; cursor: pointer; }
.d-vraag-knop img { width: 60px; height: auto; display: block; filter: drop-shadow(0 8px 10px rgba(30,43,69,.25)); transition: transform .25s cubic-bezier(.3,1.6,.5,1); }
.d-vraag-knop:hover img, .d-vraag-knop:focus-visible img { transform: translateY(-4px) rotate(-3deg); }
.d-vraag-knop:focus-visible { outline: 3px solid var(--wp--preset--color--oranje, #EC8B48); outline-offset: 4px; border-radius: 12px; }
.d-vraag-ballon { margin-bottom: 64px; background: #fff; color: var(--wp--preset--color--blauw-donker, #496390); font: 600 13px/1.2 inherit; padding: 8px 12px; border-radius: 14px 14px 4px 14px; box-shadow: 0 8px 20px -10px rgba(30,43,69,.45); white-space: nowrap; }
.d-vraag.is-open .d-vraag-ballon { display: none; }
.d-vraag-paneel { position: absolute; right: 0; bottom: calc(100% + 10px); width: min(380px, calc(100vw - 28px)); max-height: min(72vh, 620px); overflow: auto; background: #fff; color: #333; border-radius: 22px; border: 2px solid var(--wp--preset--color--logoblauw, #8EAAD5); box-shadow: 0 24px 60px -24px rgba(30,43,69,.55); padding: 16px 16px 12px; }
.d-vraag-kop { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.d-vraag-kop img { width: 34px; height: auto; flex: none; }
.d-vraag-kop > div { flex: 1; min-width: 0; }
.d-vraag-titel { margin: 0 !important; font: 600 1.15rem/1.2 var(--wp--preset--font-family--schreef, Georgia, serif); color: #2B2F38; }
.d-vraag-sub { margin: 2px 0 0 !important; font-size: 13px; color: #6B6F78; }
.d-vraag-dicht { flex: none; width: 34px; height: 34px; border-radius: 50%; border: 0; background: var(--wp--preset--color--vlak-blauw, #EEF2FA); color: #496390; font-size: 22px; line-height: 1; cursor: pointer; }
.d-vraag-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.d-vraag-rij { display: flex; gap: 8px; }
.d-vraag-rij input { flex: 1; min-width: 0; border: 2px solid #E0E4EC; border-radius: 12px; padding: 10px 12px; font: 15px inherit; }
.d-vraag-rij input:focus { outline: none; border-color: var(--wp--preset--color--logoblauw, #8EAAD5); }
.d-vraag-rij button { flex: none; border: 0; border-radius: 12px; padding: 10px 14px; background: var(--wp--preset--color--blauw-donker, #496390); color: #fff; font: 600 14px inherit; cursor: pointer; }
.d-vraag-uit { margin-top: 12px; display: grid; gap: 10px; }
.d-vraag-uit:empty { display: none; }
.d-vraag-intro, .d-vraag-denk { margin: 0 !important; font-size: 13px; color: #6B6F78; }
.d-vraag-hit { background: var(--wp--preset--color--vlak-blauw, #EEF2FA); border-radius: 14px; padding: 10px 12px; }
.d-vraag-waar { margin: 0 0 4px !important; font-size: 12px; font-weight: 600; color: #496390; }
.d-vraag-stuk { margin: 0 0 6px !important; font-size: 14px; line-height: 1.5; }
.d-vraag-stuk mark { background: #FFE08A; color: inherit; border-radius: 3px; padding: 0 2px; }
.d-vraag-link { font-size: 13px; font-weight: 600; color: var(--wp--preset--color--oranje, #D9742F); text-decoration: none; }
.d-vraag-link span { font-weight: 400; color: #6B6F78; }
.d-vraag-link:hover { text-decoration: underline; }
.d-vraag-leeg { display: flex; gap: 10px; align-items: center; margin: 0; font-size: 14px; }
.d-vraag-leeg img { width: 40px; height: auto; flex: none; }
.d-vraag-leeg p { margin: 0 !important; }
.d-vraag-voet { margin: 12px 0 0 !important; font-size: 11.5px; color: #8A8F99; }
@media (max-width: 600px) {
	.d-vraag-knop img { width: 48px; }
	.d-vraag-ballon { display: none; }
	.d-vraag-paneel { position: fixed; left: max(10px, env(safe-area-inset-left, 0px)); right: max(10px, env(safe-area-inset-right, 0px)); bottom: calc(max(10px, env(safe-area-inset-bottom, 0px)) + 96px); width: auto; max-height: 70vh; }
}
@media (prefers-reduced-motion: reduce) { .d-vraag-knop img { transition: none; } }
@media print { .d-vraag { display: none; } }

/* Quizuitslag: niet geslaagd in oranje (groen = goed), met Doortje die iets zegt (leer.js) */
.llms-quiz-results .llms-donut.failing svg path, .llms-quiz-results .llms-donut.fail svg path { stroke: var(--wp--preset--color--oranje, #EC8B48) !important; }
.llms-quiz-results .llms-donut.failing .percentage, .llms-quiz-results .llms-donut.failing .caption { color: #B85A1B !important; }
.llms-quiz-results .llms-donut.passing .percentage, .llms-quiz-results .llms-donut.passing .caption { color: var(--wp--preset--color--groen-donker, #496B3D) !important; }
.d-quiz-ballon { position: relative; margin: 0 auto 18px; max-width: 300px; background: #fff; border: 2px solid var(--wp--preset--color--logoblauw, #8EAAD5); border-radius: 18px; padding: 12px 14px; font-size: 14.5px; line-height: 1.5; text-align: center; box-shadow: 0 10px 24px -16px rgba(30,43,69,.45); }
.d-quiz-ballon::before { content: ""; position: absolute; left: 50%; top: -9px; width: 16px; height: 16px; background: #fff; border-left: 2px solid var(--wp--preset--color--logoblauw, #8EAAD5); border-top: 2px solid var(--wp--preset--color--logoblauw, #8EAAD5); transform: translateX(-50%) rotate(45deg); }
.d-quiz-ballon.is-niet { border-color: var(--wp--preset--color--oranje, #EC8B48); }
.d-quiz-ballon.is-niet::before { border-color: var(--wp--preset--color--oranje, #EC8B48); }
.d-quiz-ballon p { margin: 0 0 10px !important; }
.d-quiz-ballon .d-quiz-knoppen { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.d-quiz-ballon button { border: 0; border-radius: 999px; padding: 8px 14px; font: 600 13.5px inherit; cursor: pointer; background: var(--wp--preset--color--blauw-donker, #496390); color: #fff; }
.d-quiz-ballon button.is-licht { background: var(--wp--preset--color--vlak-blauw, #EEF2FA); color: var(--wp--preset--color--blauw-donker, #496390); }

/* Lesnavigatie onderaan: geen los wit vlak in "Terug naar de cursus" */
.llms-course-navigation .llms-main, .llms-lesson-navigation .llms-main { background: transparent !important; padding: 0 !important; }

/* Vijf kaartjes (samenvatting in de afrondingsles): 3 boven, 2 onder, even breed verdeeld */
.single-lesson .d-stickers.d-n5 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.single-lesson .d-stickers.d-n5 > :nth-child(-n+3) { grid-column: span 2; }
.single-lesson .d-stickers.d-n5 > :nth-child(n+4) { grid-column: span 3; }
@media (max-width: 700px) { .single-lesson .d-stickers.d-n5 { grid-template-columns: minmax(0, 1fr); } .single-lesson .d-stickers.d-n5 > * { grid-column: auto !important; } }

/* Inlog medewerkers: personeelspasje aan een keycord, met zwaaiende mascotte */
.d-portal .llms-person-login-form-wrapper { position: relative; max-width: 440px; margin: 70px auto 0 !important; padding: 0 !important; border: 0; border-radius: 26px; background: #fff; box-shadow: 0 24px 50px -24px rgba(30,43,69,.45); overflow: visible; }
.d-portal .llms-person-login-form-wrapper::before { content: ""; position: absolute; left: 50%; top: -84px; width: 34px; height: 74px; margin-left: -17px; background: repeating-linear-gradient(90deg, #EC8B48 0 6px, #F2A46C 6px 12px); border-radius: 4px 4px 0 0; z-index: 0; }
.d-portal .llms-person-login-form-wrapper::after { content: ""; position: absolute; right: -150px; bottom: 10px; width: 150px; height: 220px; background: url(../img/mascotte/zwaaien.webp) bottom center / contain no-repeat; transform-origin: 50% 100%; animation: d-pas-zwaai 3.5s ease-in-out infinite; pointer-events: none; }
@keyframes d-pas-zwaai { 0%, 70%, 100% { transform: rotate(0); } 78% { transform: rotate(-4deg); } 86% { transform: rotate(3deg); } 94% { transform: rotate(-2deg); } }
.d-portal .llms-login { position: relative; padding: 0 0 1.6rem; }
.d-portal .llms-login::before { content: ""; position: absolute; left: 50%; top: -18px; width: 46px; height: 30px; margin-left: -23px; border-radius: 8px; background: linear-gradient(#C9CFDA, #9AA2B1); box-shadow: inset 0 -3px 0 rgba(0,0,0,.12); z-index: 2; }
.d-portal .llms-login .llms-form-heading { margin: 0 !important; padding: 2rem 1.8rem 1.1rem !important; border-radius: 26px 26px 0 0; background: #496390; color: #fff !important; font-family: var(--wp--preset--font-family--schreef); font-size: 1.7rem !important; text-align: left; position: relative; }
.d-portal .llms-login .llms-form-heading::before { content: "Teampas · Kinderdagverblijf Doortje"; display: block; margin-bottom: .2rem; font-family: var(--wp--preset--font-family--zonder-schreef); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #FFC94D; }
.d-portal .llms-login .llms-form-heading::after { content: "♥"; position: absolute; right: 1.8rem; top: 50%; margin-top: -14px; color: #FFC94D; font-size: 1.4rem; }
.d-portal .llms-login .llms-form-fields { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start !important; gap: .9rem 1rem; padding: 1.5rem 1.8rem 0; }
.d-portal .llms-login .llms-form-fields > .clear, .d-portal .llms-login .llms-form-fields::before, .d-portal .llms-login .llms-form-fields::after { display: none !important; }
.d-portal .llms-login .llms-form-field { float: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; position: relative; }
.d-portal .llms-login .llms-form-field label { display: block; margin-bottom: .35rem; color: #1E2B45; }
.d-portal .llms-login .llms-required { color: #EC8B48; margin-left: 2px; }
.d-portal .llms-login .llms-visibility-toggle { position: absolute; right: 0; top: 0; }
.d-portal .llms-login .llms-visibility-toggle button { padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; color: #496390 !important; font-size: .82rem !important; font-weight: 600; cursor: pointer; white-space: nowrap; }
.d-portal .llms-login .type-submit { order: 5; }
.d-portal .llms-login .type-checkbox { order: 3; width: auto !important; flex: 1; display: flex; align-items: center; gap: .45rem; }
.d-portal .llms-login .type-checkbox label { margin: 0 !important; padding: 0 !important; white-space: nowrap; font-weight: 500; font-size: .9rem; }
.d-portal .llms-login .type-checkbox input { flex: none; width: 18px; height: 18px; accent-color: #496390; margin: 0 !important; position: static !important; }
.d-portal .llms-login .type-html { order: 4; width: auto !important; text-align: right; }
.d-portal .llms-login .type-html a { color: #C8661F; font-weight: 600; font-size: .9rem; }
.d-portal .llms-login #llms_login_button { width: 100%; margin-top: .3rem; background: #EC8B48 !important; color: #fff !important; box-shadow: 0 5px 0 #C8661F !important; font-size: 16px !important; }
.d-portal .llms-login #llms_login_button:hover { box-shadow: 0 7px 0 #C8661F !important; }
@media (max-width: 960px) { .d-portal .llms-person-login-form-wrapper::after { display: none; } }
@media (max-width: 480px) { .d-portal .llms-login .llms-form-heading, .d-portal .llms-login .llms-form-fields { padding-left: 1.2rem !important; padding-right: 1.2rem !important; } .d-portal .llms-login .llms-form-heading::after { display: none; } }

/* Wachtwoord vergeten / nieuw wachtwoord: dezelfde teampas aan een keycord */
.d-portal .llms-lost-password-form { position: relative; max-width: 440px; margin: 70px auto 0 !important; padding: 0 0 1.6rem !important; border-radius: 26px; background: #fff; box-shadow: 0 24px 50px -24px rgba(30,43,69,.45); display: flex; flex-wrap: wrap; gap: .9rem 0; }
.d-portal .llms-lost-password-form:not(:has(.llms-form-field)) { display: none; }
.d-portal .llms-lost-password-form::before { content: ""; position: absolute; left: 50%; top: -84px; width: 34px; height: 74px; margin-left: -17px; background: repeating-linear-gradient(90deg, #EC8B48 0 6px, #F2A46C 6px 12px); border-radius: 4px 4px 0 0; z-index: 0; }
.d-portal .llms-lost-password-form::after { content: ""; position: absolute; left: 50%; top: -18px; width: 46px; height: 30px; margin-left: -23px; border-radius: 8px; background: linear-gradient(#C9CFDA, #9AA2B1); box-shadow: inset 0 -3px 0 rgba(0,0,0,.12); z-index: 2; }
.d-portal .llms-lost-password-form > .clear { display: none !important; }
.d-portal .llms-lost-password-form .llms-form-field { float: none !important; width: 100% !important; margin: 0 !important; padding: 0 1.8rem !important; position: relative; }
.d-portal .llms-lost-password-form .llms-form-field.type-html { order: -1; padding: 2rem 1.8rem 1.3rem !important; margin-bottom: .4rem !important; border-radius: 26px 26px 0 0; background: #496390; color: #fff; }
.d-portal .llms-lost-password-form .type-html::before { content: "Teampas · Kinderdagverblijf Doortje"; display: block; margin-bottom: .2rem; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #FFC94D; }
.d-portal .llms-lost-password-form .type-html::after { content: "♥"; position: absolute; right: 1.8rem; top: 2rem; color: #FFC94D; font-size: 1.4rem; }
.d-portal .llms-lost-password-form .llms-field-html { font-size: .95rem; line-height: 1.5; color: #fff; }
.d-portal .llms-lost-password-form .llms-field-html::before { content: "Wachtwoord vergeten?"; display: block; margin-bottom: .4rem; font-family: var(--wp--preset--font-family--schreef); font-size: 1.7rem; line-height: 1.2; }
/* Stap 2 (nieuw wachtwoord): de html-regel is hier de sterktemeter, dus de kop komt op het eerste veld */
.d-portal .llms-lost-password-form:has(input[type="password"]) .llms-form-field.type-html { order: 0; padding: 0 1.8rem !important; margin: 0 !important; border-radius: 0; background: none; color: inherit; }
.d-portal .llms-lost-password-form:has(input[type="password"]) .type-html::before, .d-portal .llms-lost-password-form:has(input[type="password"]) .type-html::after { display: none; }
.d-portal .llms-lost-password-form:has(input[type="password"]) .llms-description { font-size: .85rem; color: #5B6478; }
.d-portal .llms-lost-password-form:has(input[type="password"]) > .llms-form-field:first-child::before { content: "Teampas · Kinderdagverblijf Doortje"; display: block; margin: 0 -1.8rem 1.1rem; padding: 2rem 1.8rem 3.6rem; border-radius: 26px 26px 0 0; background: #496390; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #FFC94D; }
.d-portal .llms-lost-password-form:has(input[type="password"]) > .llms-form-field:first-child::after { content: "♥"; position: absolute; right: 1.8rem; top: 2rem; color: #FFC94D; font-size: 1.4rem; }
.d-portal .llms-lost-password-form:has(input[type="password"]) > .llms-form-field:first-child label::before { content: "Kies je wachtwoord"; position: absolute; left: 1.8rem; top: 3.2rem; color: #fff; font-family: var(--wp--preset--font-family--schreef); font-size: 1.7rem; line-height: 1.2; }
.d-portal .llms-lost-password-form label { display: block; margin-bottom: .35rem; color: #1E2B45; }
.d-portal .llms-lost-password-form .llms-required { color: #EC8B48; margin-left: 2px; }
.d-portal .llms-lost-password-form .type-submit button { width: 100%; margin-top: .3rem; background: #EC8B48 !important; color: #fff !important; box-shadow: 0 5px 0 #C8661F !important; font-size: 16px !important; }
.d-portal .llms-lost-password-form .type-submit button:hover { box-shadow: 0 7px 0 #C8661F !important; }
.d-portal .llms-student-dashboard > .llms-notice { max-width: 440px; margin: 0 auto 1rem; border-radius: 16px; }
@media (max-width: 480px) { .d-portal .llms-lost-password-form .llms-form-field { padding-left: 1.2rem !important; padding-right: 1.2rem !important; } .d-portal .llms-lost-password-form .type-html::after, .d-portal .llms-lost-password-form > .llms-form-field:first-child::after { display: none; } .d-portal .llms-lost-password-form:has(input[type="password"]) > .llms-form-field:first-child::before { margin-left: -1.2rem; margin-right: -1.2rem; padding-left: 1.2rem; padding-right: 1.2rem; } .d-portal .llms-lost-password-form:has(input[type="password"]) > .llms-form-field:first-child label::before { left: 1.2rem; } }