/*
 * Final light/dark contrast layer.
 * Loaded after every component stylesheet so legacy hard-coded colours cannot
 * create light-on-light or white cards inside the dark interface.
 */

body.ilc-ui-enhanced.ilc-ui-mode-light,
body.ilc-ui-enhanced.ilc-ui-mode-system {
    --ilc-theme-page: #f2f5f9;
    --ilc-theme-surface-1: #ffffff;
    --ilc-theme-surface-2: #f8fafc;
    --ilc-theme-surface-3: #edf2f7;
    --ilc-theme-surface-4: #e4ebf3;
    --ilc-theme-heading: #101828;
    --ilc-theme-text: #26364d;
    --ilc-theme-muted: #5d6d82;
    --ilc-theme-link: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 58%, #101828 42%);
    --ilc-theme-accent-soft: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 10%, #f8fafc 90%);
    --ilc-theme-accent-soft-strong: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 17%, #edf2f7 83%);
    --ilc-theme-accent-border: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 38%, #bdcad8 62%);
    --ilc-theme-border: #d6e0eb;
    --ilc-theme-border-strong: #bdcad8;
    --ilc-theme-field: #ffffff;
    --ilc-theme-code: #e5ebf2;
    --ilc-theme-code-text: #172033;
    --ilc-theme-info-bg: #e8f1fb;
    --ilc-theme-info-text: #173f68;
    --ilc-theme-success-bg: #e8f6ef;
    --ilc-theme-success-text: #15583a;
    --ilc-theme-warning-bg: #fff4d9;
    --ilc-theme-warning-text: #684708;
    --ilc-theme-error-bg: #fff0f2;
    --ilc-theme-error-text: #792b38;
    --ilc-theme-shadow: 0 12px 34px rgba(15, 23, 42, .07);
    color-scheme: light;
}

body.ilc-ui-enhanced.ilc-ui-mode-dark {
    --ilc-theme-page: #0c1422;
    --ilc-theme-surface-1: #121d30;
    --ilc-theme-surface-2: #18253a;
    --ilc-theme-surface-3: #213149;
    --ilc-theme-surface-4: #2a3c56;
    --ilc-theme-heading: #ffffff;
    --ilc-theme-text: #e5edf8;
    --ilc-theme-muted: #aebbd0;
    --ilc-theme-link: color-mix(in srgb, var(--ilc-ui-accent-2, #60a5fa) 64%, #ffffff 36%);
    --ilc-theme-accent-soft: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 16%, #18253a 84%);
    --ilc-theme-accent-soft-strong: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 24%, #213149 76%);
    --ilc-theme-accent-border: color-mix(in srgb, var(--ilc-ui-accent-2, #60a5fa) 34%, #465b78 66%);
    --ilc-theme-border: #31435e;
    --ilc-theme-border-strong: #465b78;
    --ilc-theme-field: #0f1a2b;
    --ilc-theme-code: #09111f;
    --ilc-theme-code-text: #edf4ff;
    --ilc-theme-info-bg: #1d344d;
    --ilc-theme-info-text: #d8eaff;
    --ilc-theme-success-bg: #19372e;
    --ilc-theme-success-text: #c7f5dc;
    --ilc-theme-warning-bg: #3b321f;
    --ilc-theme-warning-text: #ffe3a3;
    --ilc-theme-error-bg: #3d242b;
    --ilc-theme-error-text: #ffd2d8;
    --ilc-theme-shadow: 0 14px 38px rgba(0, 0, 0, .24);
    color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
    body.ilc-ui-enhanced.ilc-ui-mode-system {
        --ilc-theme-page: #0c1422;
        --ilc-theme-surface-1: #121d30;
        --ilc-theme-surface-2: #18253a;
        --ilc-theme-surface-3: #213149;
        --ilc-theme-surface-4: #2a3c56;
        --ilc-theme-heading: #ffffff;
        --ilc-theme-text: #e5edf8;
        --ilc-theme-muted: #aebbd0;
        --ilc-theme-link: color-mix(in srgb, var(--ilc-ui-accent-2, #60a5fa) 64%, #ffffff 36%);
        --ilc-theme-accent-soft: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 16%, #18253a 84%);
        --ilc-theme-accent-soft-strong: color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 24%, #213149 76%);
        --ilc-theme-accent-border: color-mix(in srgb, var(--ilc-ui-accent-2, #60a5fa) 34%, #465b78 66%);
        --ilc-theme-border: #31435e;
        --ilc-theme-border-strong: #465b78;
        --ilc-theme-field: #0f1a2b;
        --ilc-theme-code: #09111f;
        --ilc-theme-code-text: #edf4ff;
        --ilc-theme-info-bg: #1d344d;
        --ilc-theme-info-text: #d8eaff;
        --ilc-theme-success-bg: #19372e;
        --ilc-theme-success-text: #c7f5dc;
        --ilc-theme-warning-bg: #3b321f;
        --ilc-theme-warning-text: #ffe3a3;
        --ilc-theme-error-bg: #3d242b;
        --ilc-theme-error-text: #ffd2d8;
        --ilc-theme-shadow: 0 14px 38px rgba(0, 0, 0, .24);
        color-scheme: dark;
    }
}

body.ilc-ui-enhanced.ilc-ui-context-frontend {
    background: var(--ilc-theme-page) !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-page {
    --ilc-page-bg: var(--ilc-theme-page);
    --ilc-page-card: var(--ilc-theme-surface-1);
    --ilc-page-text: var(--ilc-theme-text);
    --ilc-page-muted: var(--ilc-theme-muted);
    --ilc-page-line: var(--ilc-theme-border);
    --ilc-page-primary: var(--ilc-theme-link);
    --ilc-page-primary-dark: var(--ilc-theme-link);
    --ilc-page-soft: var(--ilc-theme-surface-3);
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-player-shell,
    .ilc-learning-page-shell,
    .ilc-account-shell,
    .ilc-auth-shell,
    .ilc-project-shell,
    .ilc-projects-shell,
    .ilc-email-gate-shell,
    .ilc-paid-barrier-card,
    .ilc-landing
) {
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-player-shell,
    .ilc-learning-page-shell,
    .ilc-account-shell,
    .ilc-auth-shell,
    .ilc-project-shell,
    .ilc-projects-shell,
    .ilc-email-gate-shell,
    .ilc-paid-barrier-card,
    .ilc-landing
) :where(h1, h2, h3, h4, h5, h6, strong, summary) {
    color: var(--ilc-theme-heading);
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-player-shell,
    .ilc-learning-page-shell,
    .ilc-account-shell,
    .ilc-auth-shell,
    .ilc-project-shell,
    .ilc-projects-shell,
    .ilc-email-gate-shell,
    .ilc-paid-barrier-card,
    .ilc-landing
) a:not(.ilc-primary-button):not(.ilc-account-button):not(.ilc-landing-button):not(.ilc-next-link):not(.ilc-lesson-download__button) {
    color: var(--ilc-theme-link);
}

/* First-level surfaces. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-panel,
    .ilc-learning-page-card,
    .ilc-account-hero,
    .ilc-account-card,
    .ilc-account-identity-card,
    .ilc-auth-card,
    .ilc-project-card,
    .ilc-email-gate-card,
    .ilc-paid-barrier-card,
    .ilc-lesson-video__card,
    .ilc-landing-course-card,
    .ilc-landing-modal__dialog
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-1) !important;
    color: var(--ilc-theme-text) !important;
    box-shadow: var(--ilc-theme-shadow) !important;
}

/* Section containers. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-practice-stage,
    .ilc-practice-stack,
    .ilc-lesson-downloads,
    .ilc-course-progress-details,
    .ilc-learning-page-section,
    .ilc-account-route
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-2) !important;
    color: var(--ilc-theme-text) !important;
}

/* Nested cards. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-practice-block,
    .ilc-lesson-download,
    .ilc-form-group,
    .ilc-choice-question,
    .ilc-gap-text-source,
    .ilc-tariff-card,
    .ilc-ai-usage-metric,
    .ilc-account-list li,
    .ilc-module-progress,
    .ilc-lesson-progress-list li,
    .ilc-landing-lesson-preview article,
    .ilc-landing-payment-card
    ,.ilc-validator-result-list li
    ,.ilc-ai-answer
    ,.ilc-ai-scope-note
    ,.ilc-project-task
    ,.ilc-project-progress-box
    ,.ilc-project-report
    ,.ilc-project-tariff
    ,.ilc-simple-modal-dialog
    ,.ilc-simple-toast
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-3) !important;
    color: var(--ilc-theme-text) !important;
    box-shadow: none !important;
}

/* Interactive rows, fields and chips use a fourth, visibly different level. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-choice-answer,
    .ilc-gap-text-source,
    .ilc-practice-block__meta span,
    .ilc-lesson-download__meta span,
    .ilc-course-status,
    .ilc-simple-progress,
    .ilc-simple-tab,
    .ilc-form-check-option,
    .ilc-account-table th,
    .ilc-account-table td,
    .ilc-payment-mode-note
    ,.ilc-form-table th
    ,.ilc-form-table td
    ,.ilc-mini-button
    ,.ilc-project-step-list li
    ,.ilc-project-checklist li
    ,.ilc-project-validation-list li
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-4) !important;
    color: var(--ilc-theme-text) !important;
}

/* Never tween foreground and background through a low-contrast midpoint. */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-choice-answer {
    transition-property: transform, box-shadow, border-color !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-player-shell,
    .ilc-learning-page-shell,
    .ilc-account-shell,
    .ilc-auth-shell,
    .ilc-project-shell,
    .ilc-email-gate-shell
) :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-field) !important;
    color: var(--ilc-theme-text) !important;
    box-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(input, select, textarea)::placeholder {
    color: var(--ilc-theme-muted) !important;
    opacity: .82;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-auth-page-shell,
    .ilc-project-player,
    .ilc-projects-shell,
    .ilc-simple-modal-dialog
) {
    background: var(--ilc-theme-page) !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-auth-form label,
    .ilc-form-label,
    .ilc-project-field label,
    .ilc-ai-question-label,
    .ilc-simple-toast
) {
    color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-gap-code-source,
    .ilc-theory-code,
    .ilc-runner-console,
    .ilc-artifact-export-output,
    .ilc-editor-pane textarea,
    .ilc-simple-modal-body pre
) {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-code) !important;
    color: var(--ilc-theme-code-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-practice-block__description,
    .ilc-lesson-download__description,
    .ilc-lesson-download__lock-message,
    .ilc-form-group-description,
    .ilc-form-description,
    .ilc-course-stats,
    .ilc-account-list small,
    .ilc-ai-usage-metric span,
    .ilc-tariff-card p,
    .ilc-tariff-card small,
    .ilc-module-progress small,
    .ilc-lesson-progress-list small
) {
    color: var(--ilc-theme-muted) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-lesson-download__title,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-practice-block__title,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-form-group legend {
    color: var(--ilc-theme-heading) !important;
}

/* Status surfaces keep meaning without turning into white islands in dark mode. */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-check-result.is-success,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-choice-question.is-correct,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-account-complete-label,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-attempt-status.is-success {
    border-color: color-mix(in srgb, var(--ilc-ui-success, #18a765) 48%, var(--ilc-theme-border)) !important;
    background: color-mix(in srgb, var(--ilc-ui-success, #18a765) 14%, var(--ilc-theme-surface-3)) !important;
    color: color-mix(in srgb, var(--ilc-ui-success, #18a765) 58%, var(--ilc-theme-heading)) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-check-result.is-error,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-choice-question.is-error,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-attempt-status:not(.is-success):not(.is-partial) {
    border-color: color-mix(in srgb, var(--ilc-ui-error, #df4055) 48%, var(--ilc-theme-border)) !important;
    background: color-mix(in srgb, var(--ilc-ui-error, #df4055) 13%, var(--ilc-theme-surface-3)) !important;
    color: color-mix(in srgb, var(--ilc-ui-error, #df4055) 60%, var(--ilc-theme-heading)) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-check-result.is-partial,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-attempt-status.is-partial,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-payment-mode-note.is-warning {
    border-color: color-mix(in srgb, var(--ilc-ui-warning, #d58b18) 48%, var(--ilc-theme-border)) !important;
    background: color-mix(in srgb, var(--ilc-ui-warning, #d58b18) 14%, var(--ilc-theme-surface-3)) !important;
    color: color-mix(in srgb, var(--ilc-ui-warning, #d58b18) 58%, var(--ilc-theme-heading)) !important;
}

/* Download cards are a frequent source of white-on-white regressions. */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-lesson-download--locked {
    background: var(--ilc-theme-surface-2) !important;
    color: var(--ilc-theme-muted) !important;
    opacity: .82;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-lesson-download--unlocked {
    border-color: color-mix(in srgb, var(--ilc-ui-success, #18a765) 42%, var(--ilc-theme-border)) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-lesson-download__button {
    border: 1px solid var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-surface-3) !important;
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
    box-shadow: var(--ilc-theme-shadow) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-lesson-download__button:is(:hover, :focus-visible) {
    border-color: var(--ilc-theme-link) !important;
    background: var(--ilc-theme-surface-4) !important;
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-lesson-download__button.is-disabled,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-lesson-download__button:disabled {
    background: var(--ilc-theme-surface-4) !important;
    color: var(--ilc-theme-muted) !important;
}

/* Preview frames intentionally remain neutral because they render student HTML. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(.ilc-preview-panel iframe, .ilc-simple-modal iframe) {
    border-color: var(--ilc-theme-border) !important;
    background: #ffffff !important;
}

/* The embedded cabinet owns its appearance and must never show WP chrome. */
body.ilc-account-embedded #wpadminbar,
body.ilc-account-embedded .ilc-theme-switcher,
body.ilc-auth-embedded #wpadminbar,
body.ilc-auth-embedded .ilc-theme-switcher {
    display: none !important;
}

html:has(body.ilc-account-embedded),
html:has(body.ilc-auth-embedded) {
    margin-top: 0 !important;
}

@media (max-width: 782px) {
    body.ilc-account-embedded,
    body.ilc-auth-embedded { padding-top: 0 !important; }
}

/* v0.25.2 exhaustive component bridge. */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-landing {
    --ilc-landing-bg: var(--ilc-theme-page);
    --ilc-landing-surface: var(--ilc-theme-surface-1);
    --ilc-landing-surface-soft: var(--ilc-theme-surface-2);
    --ilc-landing-ink: var(--ilc-theme-heading);
    --ilc-landing-text: var(--ilc-theme-text);
    --ilc-landing-muted: var(--ilc-theme-muted);
    --ilc-landing-border: var(--ilc-theme-border);
    --ilc-landing-primary-soft: var(--ilc-theme-surface-3);
    background: var(--ilc-theme-page) !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing-brandbar,
    .ilc-landing-dashboard-card,
    .ilc-landing-stats article,
    .ilc-landing-benefit-grid article,
    .ilc-landing-path-grid article,
    .ilc-landing-practice-grid article,
    .ilc-landing-course-card,
    .ilc-landing-quality-card,
    .ilc-landing-free-start,
    .ilc-landing-subscription,
    .ilc-landing-final,
    .ilc-landing-modal__dialog,
    .ilc-project-list-hero,
    .ilc-project-player-header,
    .ilc-project-sidebar,
    .ilc-project-main,
    .ilc-ai-coach-panel,
    .ilc-course-card,
    .ilc-learning-page__header,
    .ilc-auth-card,
    .ilc-paid-barrier-card,
    .ilc-email-gate-card
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-1) !important;
    color: var(--ilc-theme-text) !important;
    box-shadow: var(--ilc-theme-shadow) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing-badge,
    .ilc-landing-offer,
    .ilc-landing-trust-row span,
    .ilc-landing-lesson-preview article,
    .ilc-landing-free-start__card,
    .ilc-landing-subscription-card,
    .ilc-landing-payment-card,
    .ilc-landing-quality-list,
    .ilc-project-task,
    .ilc-project-progress-box,
    .ilc-project-report,
    .ilc-project-tariff,
    .ilc-project-recommendations,
    .ilc-ai-answer,
    .ilc-ai-scope-note,
    .ilc-ai-locked,
    .ilc-auth-message
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-2) !important;
    color: var(--ilc-theme-text) !important;
    box-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing-course-card__icon,
    .ilc-landing-course-card__badge,
    .ilc-landing-course-card__level,
    .ilc-landing-course-card__meta span,
    .ilc-landing-course-program__module h4 > span,
    .ilc-landing-lesson-preview article > span,
    .ilc-landing-quality-list span,
    .ilc-project-step-list li,
    .ilc-project-checklist li,
    .ilc-project-validation-list li,
    .ilc-form-table th,
    .ilc-form-table td,
    .ilc-validator-result-list li
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-3) !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing,
    .ilc-player-shell,
    .ilc-learning-page-shell,
    .ilc-account-shell,
    .ilc-auth-shell,
    .ilc-project-shell,
    .ilc-projects-shell,
    .ilc-email-gate-shell,
    .ilc-paid-barrier-card
) :where(h1,h2,h3,h4,h5,h6,strong,legend,summary) {
    color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing-hero__subtitle,
    .ilc-landing-course-card p,
    .ilc-landing-dashboard-top,
    .ilc-landing-payment-card p,
    .ilc-landing-payment-notice,
    .ilc-ai-scope-note,
    .ilc-auth-head p,
    .ilc-project-card-meta
) {
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing-hero__lead,
    .ilc-landing-section-head p:not(.ilc-landing-kicker),
    .ilc-landing-quality-card p,
    .ilc-landing-final p,
    .ilc-landing-free-start p,
    .ilc-landing-subscription p,
    .ilc-ai-badge,
    .ilc-auth-footnote
) {
    color: var(--ilc-theme-muted) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing-link,
    .ilc-landing-link-button,
    .ilc-landing-mini-link,
    .ilc-landing-modal__links a,
    .ilc-project-shell a:not(.ilc-primary-button),
    .ilc-auth-shell a
) {
    color: var(--ilc-theme-link) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(.ilc-landing-button-secondary,.ilc-landing-button-ghost) {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-surface-3) !important;
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
}

/* Header registration is a quiet navigation action, not a dark hero CTA. */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-landing-brandbar nav a.is-primary {
    border: 1px solid var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-surface-3) !important;
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
    box-shadow: none !important;
}

/* v0.35.0 homepage builder appearance bridge.
 *
 * The exhaustive component rules above deliberately use !important to keep
 * legacy landing markup readable in both themes. Builder blocks carry an
 * explicit appearance choice, so that choice must win on the same element.
 * Keeping this override in the integrity layer also guarantees that light and
 * dark palettes continue to use their own semantic surfaces.
 */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-landing .ilc-landing-builder-block.is-surface {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-1) !important;
    box-shadow: var(--ilc-theme-shadow) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-landing .ilc-landing-builder-block.is-soft {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-2) !important;
    box-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-landing .ilc-landing-builder-block.is-accent {
    border-color: color-mix(in srgb, var(--ilc-ui-accent) 36%, var(--ilc-theme-border)) !important;
    background: color-mix(in srgb, var(--ilc-theme-surface-3) 76%, var(--ilc-theme-surface-1)) !important;
    box-shadow: var(--ilc-theme-shadow) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-landing .ilc-landing-builder-block.is-outline {
    border-width: 2px !important;
    border-color: var(--ilc-theme-border-strong) !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(.ilc-landing-button-primary,.ilc-primary-button,.ilc-next-link:not(.is-disabled),.ilc-account-button:not(.is-secondary),.ilc-auth-button) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(.ilc-next-link.is-disabled,.ilc-landing-button[aria-disabled="true"],button:disabled) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-4) !important;
    color: var(--ilc-theme-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-text) !important;
    opacity: 1 !important;
    filter: none !important;
}

/* Complete inventory of legacy component surfaces. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-standalone-lesson-player-page,
    .ilc-standalone-learning-page__main,
    .ilc-account-page,
    .ilc-auth-page-shell,
    .ilc-project-player,
    .ilc-projects-shell
) {
    background: var(--ilc-theme-page) !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-player-header,
    .ilc-learning-hero,
    .ilc-learning-section,
    .ilc-form-trainer-card,
    .ilc-project-barrier,
    .ilc-reset-popover,
    .ilc-account-modal__dialog,
    .ilc-course-catalog-card,
    .ilc-course-catalog-modal__empty,
    .ilc-theme-switcher__panel,
    .ilc-landing-empty,
    .ilc-front-rail__items,
    .ilc-front-rail__menu,
    .ilc-lesson-rail__items,
    .ilc-lesson-rail__toggle
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-1) !important;
    background-image: none !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-front-rail :is(a, button) {
    color: var(--ilc-theme-muted) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-front-rail :is(a, button):is(:hover, :focus-visible),
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-front-rail .ilc-theme-switcher__toggle[aria-expanded="true"] {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-3) !important;
    color: var(--ilc-theme-link) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-summary div,
    .ilc-learning-card,
    .ilc-player-message,
    .ilc-player-empty,
    .ilc-player-locked,
    .ilc-email-gate-bonus-list,
    .ilc-hint-item,
    .ilc-validator-result-list li,
    .ilc-form-score-badge,
    .ilc-project-result,
    .ilc-project-locked,
    .ilc-landing-empty__manager-note,
    .ilc-landing-checkline,
    .ilc-landing-form-message,
    .ilc-auth-message,
    .ilc-account-modal__tabs,
    .ilc-course-catalog-modal__content,
    .ilc-theme-switcher__preview
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-2) !important;
    background-image: none !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-card__meta span,
    .ilc-learning-lesson-row a,
    .ilc-form-field-feedback,
    .ilc-landing-progress,
    .ilc-landing-benefit-grid span,
    .ilc-landing-path-grid strong,
    .ilc-landing-modal__close,
    .ilc-project-badge,
    .ilc-project-status,
    .ilc-form-score-badge,
    .ilc-ai-badge,
    .ilc-course-badge
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-3) !important;
    background-image: none !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-course-catalog-card__cover,
    .ilc-course-catalog-card__meta span
) {
    border-color: var(--ilc-theme-border) !important;
    background: var(--ilc-theme-surface-3) !important;
    color: var(--ilc-theme-link) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-course-catalog-card h3,
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-course-catalog-modal__empty strong {
    color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-course-catalog-card p,
    .ilc-course-catalog-card__meta span,
    .ilc-course-catalog-modal__empty p,
    .ilc-account-modal__dialog > header p
) {
    color: var(--ilc-theme-muted) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-course-catalog-card__body > a {
    background: var(--ilc-ui-accent) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-landing,
    .ilc-learning-page,
    .ilc-account-modal__dialog,
    .ilc-theme-switcher__panel
) :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-field) !important;
    color: var(--ilc-theme-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-text) !important;
    box-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-button--secondary,
    .ilc-learning-button--ghost,
    .ilc-account-button.is-secondary,
    .ilc-secondary-button,
    .ilc-mini-button,
    .ilc-editor-tab:not(.is-active),
    .ilc-simple-tab:not(.is-active)
) {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-surface-3) !important;
    background-image: none !important;
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-button--primary,
    .ilc-course-link,
    .ilc-player-button
) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Course and module pages use theme surfaces for every button. In dark mode
 * this prevents the former almost-white primary pill; in light mode it keeps
 * the same control light with dark, readable text. */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-button--primary {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-surface-3) !important;
    background-image: none !important;
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
    box-shadow: var(--ilc-theme-shadow) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-button--primary:is(:hover, :focus-visible) {
    border-color: var(--ilc-theme-link) !important;
    background: var(--ilc-theme-surface-4) !important;
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-player-header h1,
    .ilc-player-header h2,
    .ilc-player-header p,
    .ilc-player-title-row h1,
    .ilc-learning-page h1,
    .ilc-learning-page h2,
    .ilc-learning-page h3
) {
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-account-hero h1,
    .ilc-account-hero h2,
    .ilc-account-hero p
) {
    color: var(--ilc-theme-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-account-eyebrow,
    .ilc-learning-page__eyebrow,
    .ilc-player-breadcrumbs a,
    .ilc-learning-breadcrumbs a
) {
    color: var(--ilc-theme-link) !important;
    -webkit-text-fill-color: var(--ilc-theme-link) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-player-breadcrumbs,
    .ilc-player-eyebrow,
    .ilc-learning-breadcrumbs,
    .ilc-learning-page__lead,
    .ilc-learning-card p,
    .ilc-learning-empty,
    .ilc-course-card p
) {
    color: var(--ilc-theme-muted) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-editor-status.is-saved,
    .ilc-lesson-status.is-completed
) { color: var(--ilc-theme-success-text) !important; }

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-editor-status.is-dirty,
    .ilc-lesson-video__admin-note
) { color: var(--ilc-theme-warning-text) !important; }

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-editor-status.is-error,
    .ilc-required-mark
) { color: var(--ilc-theme-error-text) !important; }

/* Semantic states use theme-specific opaque surfaces and guaranteed text. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-check-result.is-success,
    .ilc-choice-question.is-correct,
    .ilc-account-complete-label,
    .ilc-attempt-status.is-success,
    .ilc-player-message.is-success,
    .ilc-validator-result-list li.is-success,
    .ilc-auth-message-success,
    .ilc-landing-form-message.is-success,
    .ilc-ai-answer.is-success,
    .ilc-form-field-feedback.is-success,
    .ilc-project-result.is-success,
    .ilc-simple-completion-burst,
    .ilc-lesson-status.is-completed
) {
    border-color: color-mix(in srgb, var(--ilc-theme-success-text) 42%, var(--ilc-theme-border)) !important;
    background: var(--ilc-theme-success-bg) !important;
    background-image: none !important;
    color: var(--ilc-theme-success-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-check-result.is-error,
    .ilc-choice-question.is-error,
    .ilc-attempt-status:not(.is-success):not(.is-partial),
    .ilc-player-message.is-error,
    .ilc-validator-result-list li.is-error,
    .ilc-auth-message-error,
    .ilc-landing-form-message.is-error,
    .ilc-ai-answer.is-error,
    .ilc-project-result.is-error,
    .ilc-editor-tab.has-validation-error
) {
    border-color: color-mix(in srgb, var(--ilc-theme-error-text) 42%, var(--ilc-theme-border)) !important;
    background: var(--ilc-theme-error-bg) !important;
    background-image: none !important;
    color: var(--ilc-theme-error-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-check-result.is-partial,
    .ilc-attempt-status.is-partial,
    .ilc-payment-mode-note.is-warning,
    .ilc-player-message.is-warning,
    .ilc-form-field-feedback:not(.is-success),
    .ilc-theory-warning,
    .ilc-lesson-video__admin-note,
    .ilc-project-locked,
    .ilc-player-locked
) {
    border-color: color-mix(in srgb, var(--ilc-theme-warning-text) 42%, var(--ilc-theme-border)) !important;
    background: var(--ilc-theme-warning-bg) !important;
    background-image: none !important;
    color: var(--ilc-theme-warning-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-auth-message:not(.ilc-auth-message-error):not(.ilc-auth-message-success),
    .ilc-ai-answer.is-loading,
    .ilc-landing-form-message:not(.is-success):not(.is-error),
    .ilc-project-result:not(.is-success):not(.is-error)
) {
    border-color: color-mix(in srgb, var(--ilc-theme-info-text) 38%, var(--ilc-theme-border)) !important;
    background: var(--ilc-theme-info-bg) !important;
    background-image: none !important;
    color: var(--ilc-theme-info-text) !important;
}

/* Blank preview frames follow the active theme; rendered student pages keep their own CSS. */
body.ilc-ui-enhanced.ilc-ui-context-frontend :is(.ilc-preview-panel iframe,.ilc-simple-modal iframe) {
    background: var(--ilc-theme-surface-4) !important;
}

/*
 * Custom lesson HTML may contain inline white cards and pale text. These rules
 * deliberately win over inline visual colours inside the custom-code sandbox,
 * while leaving its layout and JavaScript untouched.
 */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(
    div,section,article,aside,header,footer,main,nav,figure,figcaption,
    ul,ol,li,dl,dt,dd,table,thead,tbody,tfoot,tr,th,td,details,summary,fieldset
) {
    border-color: var(--ilc-theme-border) !important;
    background-color: var(--ilc-theme-surface-3) !important;
    background-image: none !important;
    color: var(--ilc-theme-text) !important;
    text-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel > :is(div,section,article,aside,main,table,details,fieldset) > :is(div,section,article,aside,table,details,fieldset) {
    background-color: var(--ilc-theme-surface-4) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(h1,h2,h3,h4,h5,h6,p,span,strong,b,em,i,small,label,li,dt,dd,th,td) {
    color: var(--ilc-theme-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-text) !important;
    text-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(h1,h2,h3,h4,h5,h6,strong,b) {
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel a:not(.button) {
    color: var(--ilc-theme-link) !important;
    -webkit-text-fill-color: var(--ilc-theme-link) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-field) !important;
    color: var(--ilc-theme-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(button,.button,[role="button"]) {
    border-color: color-mix(in srgb,var(--ilc-ui-accent,#2f6ea6) 62%,var(--ilc-theme-border)) !important;
    background: var(--ilc-ui-accent,#2f6ea6) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(pre,code,kbd,samp) {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-code) !important;
    color: var(--ilc-theme-code-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-code-text) !important;
}

/* Inline lesson HTML often uses a coloured paragraph/blockquote as a card. */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(blockquote,p,div,section,article,aside)[style*="background"],
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel [bgcolor] {
    border-color: var(--ilc-theme-border-strong) !important;
    background: var(--ilc-theme-surface-4) !important;
    background-image: none !important;
    color: var(--ilc-theme-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-text) !important;
    text-shadow: none !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel :is(blockquote,p,div,section,article,aside)[style*="background"] :is(h1,h2,h3,h4,h5,h6,p,span,strong,b,em,i,small,label,a),
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-custom-code-panel [bgcolor] :is(h1,h2,h3,h4,h5,h6,p,span,strong,b,em,i,small,label,a) {
    color: var(--ilc-theme-heading) !important;
    -webkit-text-fill-color: var(--ilc-theme-heading) !important;
    text-shadow: none !important;
}

/*
 * Palette bridge for the intermediate course and module pages.
 * Their original component stylesheet owns --ilc-page-* variables, so the
 * selected frontend palette must be mapped here after the contrast layer.
 * Every fill remains light in light mode and dark in dark mode; palette colour
 * is used only to tint surfaces, borders, controls and navigational accents.
 */
body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-page {
    --ilc-page-primary: var(--ilc-theme-link);
    --ilc-page-primary-dark: var(--ilc-theme-link);
    --ilc-page-soft: var(--ilc-theme-accent-soft);
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-hero {
    border-color: var(--ilc-theme-accent-border) !important;
    background: var(--ilc-theme-surface-1) !important;
    background-image:
        linear-gradient(135deg, var(--ilc-theme-accent-soft) 0%, var(--ilc-theme-surface-1) 48%) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-section,
    .ilc-learning-summary div,
    .ilc-learning-card,
    .ilc-learning-lesson-row a
) {
    border-color: var(--ilc-theme-border) !important;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-summary div {
    border-color: var(--ilc-theme-accent-border) !important;
    background: var(--ilc-theme-accent-soft) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-summary :is(span, small) {
    color: var(--ilc-theme-text) !important;
    -webkit-text-fill-color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-page__eyebrow,
    .ilc-learning-breadcrumbs a,
    .ilc-learning-summary strong,
    .ilc-learning-card__number,
    .ilc-learning-lesson-row__number,
    .ilc-learning-lesson-row__arrow
) {
    color: var(--ilc-theme-link) !important;
    -webkit-text-fill-color: var(--ilc-theme-link) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-card__number,
    .ilc-learning-lesson-row__number
) {
    border: 1px solid var(--ilc-theme-accent-border) !important;
    background: var(--ilc-theme-accent-soft-strong) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-card__meta span {
    border: 1px solid var(--ilc-theme-accent-border) !important;
    background: var(--ilc-theme-accent-soft) !important;
    color: var(--ilc-theme-text) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-button--primary,
    .ilc-learning-button--secondary,
    .ilc-learning-button--ghost
) {
    border-color: var(--ilc-theme-accent-border) !important;
    color: var(--ilc-theme-link) !important;
    -webkit-text-fill-color: var(--ilc-theme-link) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-learning-button--primary {
    background: var(--ilc-theme-accent-soft-strong) !important;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 14%, transparent) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-button--secondary,
    .ilc-learning-button--ghost
) {
    background: var(--ilc-theme-surface-2) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-button--primary,
    .ilc-learning-button--secondary,
    .ilc-learning-button--ghost,
    .ilc-learning-card,
    .ilc-learning-lesson-row a
):is(:hover, :focus-visible) {
    border-color: var(--ilc-theme-link) !important;
    background-color: var(--ilc-theme-accent-soft-strong) !important;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend :is(
    .ilc-learning-button--primary,
    .ilc-learning-button--secondary,
    .ilc-learning-button--ghost,
    .ilc-learning-breadcrumbs a,
    .ilc-learning-lesson-row a
):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ilc-ui-accent, #2f6ea6) 34%, transparent);
    outline-offset: 3px;
}

body.ilc-ui-enhanced.ilc-ui-context-frontend .ilc-rewards-emblem {
    border: 1px solid var(--ilc-theme-accent-border) !important;
    background: var(--ilc-theme-accent-soft-strong) !important;
    color: var(--ilc-theme-link) !important;
    -webkit-text-fill-color: var(--ilc-theme-link) !important;
}
