/**
 * Lesson detail page — dark mode (correct selectors + unified palette)
 */

/* ── Page shell ──────────────────────────────────────── */
html.-dark-mode .eman-lesson-detail,
html.-dark-mode .eman-lesson-detail .content-wrapper,
html.-dark-mode body.eman-lesson-detail {
    background: var(--eman-bg-light, #0f1319);
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail h1,
html.-dark-mode .eman-lesson-detail h2,
html.-dark-mode .eman-lesson-detail h3,
html.-dark-mode .eman-lesson-detail h4 {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail p,
html.-dark-mode .eman-lesson-detail .text-content {
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .text-light-1 {
    color: var(--eman-text-muted, #8d99ae) !important;
}

html.-dark-mode .eman-lesson-detail a:not(.button) {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail a:not(.button):hover {
    color: #e9c4ef;
}

/* ── Hero ────────────────────────────────────────────── */
html.-dark-mode .eman-lesson-detail .eman-lesson-hero,
html.-dark-mode .eman-lesson-detail .lesson-hero-section {
    background: linear-gradient(
        165deg,
        var(--eman-bg-light, #0f1319) 0%,
        var(--eman-bg, #181f2c) 55%,
        var(--eman-bg-subtle, #222a38) 100%
    );
    border-bottom-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-hero::before {
    background: radial-gradient(circle, rgba(212, 165, 224, 0.12) 0%, transparent 70%);
}

html.-dark-mode .eman-lesson-detail .lesson-breadcrumbs {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .lesson-breadcrumbs a {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .lesson-breadcrumbs__sep {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-hero h1 {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-hero__subtitle {
    color: var(--eman-text-light, #c5cdd9);
}

/* Badges */
html.-dark-mode .eman-lesson-detail .eman-lesson-badge {
    background: rgba(106, 27, 154, 0.22);
    color: var(--eman-purple-light, #d4a5e0);
    border-color: rgba(212, 165, 224, 0.28);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-badge--new {
    background: rgba(251, 191, 36, 0.14);
    color: #fcd34d;
    border-color: rgba(251, 191, 36, 0.28);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-badge--enrolled {
    background: rgba(52, 211, 153, 0.14);
    color: #6ee7b7;
    border-color: rgba(52, 211, 153, 0.28);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-badge--students {
    background: rgba(77, 208, 225, 0.14);
    color: #67e8f9;
    border-color: rgba(77, 208, 225, 0.28);
}

/* ── Stats + instructor chip ─────────────────────────── */
html.-dark-mode .eman-lesson-detail .lesson-instructor-info,
html.-dark-mode .eman-lesson-detail .eman-lesson-stats .lesson-stat-item,
html.-dark-mode .eman-lesson-detail .lesson-stat-item {
    background: var(--eman-bg, #181f2c);
    border-color: var(--eman-border-light, #2d3748);
    box-shadow: var(--shadow-card, 0 2px 16px rgba(0, 0, 0, 0.32));
}

html.-dark-mode .eman-lesson-detail .eman-lesson-stats .lesson-stat-item:hover {
    border-color: rgba(212, 165, 224, 0.35);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35);
}

html.-dark-mode .eman-lesson-detail .lesson-instructor-info .instructor-name,
html.-dark-mode .eman-lesson-detail .eman-lesson-stats .lesson-stat-item-content h5 {
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-stats .lesson-stat-item-content p {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-stats .lesson-stat-item .lucide-icon {
    background: rgba(106, 27, 154, 0.2);
    color: var(--eman-purple-light, #d4a5e0);
}

/* ── Purchase / enroll card ──────────────────────────── */
html.-dark-mode .eman-lesson-detail .lesson-purchase-card,
html.-dark-mode .eman-lesson-detail .eman-lesson-enroll {
    background: var(--eman-bg, #181f2c);
    border-color: var(--eman-border-light, #2d3748);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4);
}

html.-dark-mode .eman-lesson-detail .lesson-purchase-card-price .final-price,
html.-dark-mode .eman-lesson-detail .eman-lesson-price__current {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-price__original {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-enroll__features li {
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-enroll__features .lucide-icon {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .lesson-purchase-card-guarantee {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .lesson-purchase-card-guarantee .lucide-icon {
    color: var(--eman-success, #34d399);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-enroll__trust {
    border-top-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-enroll__trust-item {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .lesson-purchase-card-thumbnail .bg-white {
    background: rgba(24, 31, 44, 0.92) !important;
}

html.-dark-mode .eman-lesson-detail .lesson-purchase-card-thumbnail .icon-play {
    color: var(--eman-text-dark, #eef1f6) !important;
}

/* ── Content panels ──────────────────────────────────── */
html.-dark-mode .eman-lesson-detail .eman-lesson-panel,
html.-dark-mode .eman-lesson-detail .lesson-content-box {
    background: var(--eman-bg, #181f2c);
    border-color: var(--eman-border-light, #2d3748);
    box-shadow: var(--shadow-card, 0 2px 16px rgba(0, 0, 0, 0.32));
}

html.-dark-mode .eman-lesson-detail .eman-lesson-panel__head {
    border-bottom-color: rgba(212, 165, 224, 0.18);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-panel__icon {
    background: rgba(106, 27, 154, 0.22);
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-panel h2 {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .lesson-feature-list li {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-empty-notice {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
    color: var(--eman-text-muted, #8d99ae);
}

/* ── Accordion (curriculum) ─────────────────────────── */
html.-dark-mode .eman-lesson-detail .lesson-accordion .accordion__item {
    background: var(--eman-bg, #181f2c);
    border-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .lesson-accordion .accordion__button {
    background: var(--eman-bg, #181f2c);
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail .lesson-accordion .accordion__button.is-active,
html.-dark-mode .eman-lesson-detail .lesson-accordion .accordion__item.is-active .accordion__button {
    background: rgba(106, 27, 154, 0.16);
}

html.-dark-mode .eman-lesson-detail .lesson-accordion .accordion__content__inner {
    background: var(--eman-bg-subtle, #222a38);
    border-top: 1px solid var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .lesson-accordion .content-item {
    color: var(--eman-text-light, #c5cdd9);
    border-bottom-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .lesson-accordion .content-item:hover {
    background: rgba(106, 27, 154, 0.1);
}

html.-dark-mode .eman-lesson-detail .lesson-accordion .content-item .lucide-icon {
    color: var(--eman-purple-light, #d4a5e0);
}

/* ── Instructor card ─────────────────────────────────── */
html.-dark-mode .eman-lesson-detail .lesson-instructor-card {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .lesson-instructor-card img {
    border-color: var(--eman-bg, #181f2c);
}

/* ── Coupon field ────────────────────────────────────── */
html.-dark-mode .eman-lesson-detail .lesson-coupon-field {
    background: rgba(106, 27, 154, 0.14);
    border-color: rgba(212, 165, 224, 0.28);
}

html.-dark-mode .eman-lesson-detail .lesson-coupon-field__label {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .lesson-coupon-field__group {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
    box-shadow: none;
}

html.-dark-mode .eman-lesson-detail .lesson-coupon-field__icon {
    background: rgba(106, 27, 154, 0.18);
    border-color: var(--eman-border-light, #2d3748);
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .lesson-coupon-field__input {
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail .lesson-coupon-field__input::placeholder {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .lesson-coupon-field__btn {
    border-color: var(--eman-border-light, #2d3748);
}

/* ── Rating ──────────────────────────────────────────── */
html.-dark-mode .eman-lesson-detail .lesson-rating-star {
    color: var(--eman-border, #3f4d63);
}

html.-dark-mode .eman-lesson-detail .lesson-rating-star:has(input:checked),
html.-dark-mode .eman-lesson-detail .lesson-rating-star:has(~ .lesson-rating-star input:checked),
html.-dark-mode .eman-lesson-detail .lesson-rating-star:hover,
html.-dark-mode .eman-lesson-detail .lesson-rating-star:hover ~ .lesson-rating-star {
    color: #fbbf24;
}

html.-dark-mode .eman-lesson-detail .lesson-rating-form textarea,
html.-dark-mode .eman-lesson-detail .lesson-rating-form .form-control {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail .lesson-rating-form textarea::placeholder {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .lesson-rating-summary strong {
    color: var(--eman-purple-light, #d4a5e0);
}

/* ── Education + community ───────────────────────────── */
html.-dark-mode .eman-lesson-detail .eman-edu-panel {
    background: var(--eman-bg, #181f2c);
    border-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .eman-edu-panel h3 {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .eman-edu-live-banner {
    background: linear-gradient(135deg, rgba(106, 27, 154, 0.85), rgba(142, 36, 170, 0.75));
    border: 1px solid rgba(212, 165, 224, 0.25);
}

html.-dark-mode .eman-lesson-detail .eman-edu-live-banner strong {
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail .eman-edu-live-banner a {
    background: var(--eman-bg, #181f2c);
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .eman-edu-qa-list li {
    border-bottom-color: var(--eman-border-light, #2d3748);
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .eman-edu-qa-list .answer {
    background: rgba(106, 27, 154, 0.14);
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .eman-edu-path-step {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .eman-edu-path-step__body {
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .eman-edu-path-step__progress {
    background: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .eman-community-panel__sub {
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .eman-community-thread,
html.-dark-mode .eman-lesson-detail .eman-community-reply {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .eman-community-thread__question,
html.-dark-mode .eman-lesson-detail .eman-community-reply__body {
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .eman-community-thread__meta {
    color: var(--eman-purple-light, #d4a5e0);
}

html.-dark-mode .eman-lesson-detail .eman-community-empty,
html.-dark-mode .eman-lesson-detail .eman-community-login-hint {
    background: var(--eman-bg-subtle, #222a38);
    border-color: var(--eman-border-light, #2d3748);
    color: var(--eman-text-muted, #8d99ae);
}

html.-dark-mode .eman-lesson-detail .eman-community-composer textarea,
html.-dark-mode .eman-lesson-detail .eman-community-reply-form textarea {
    background: var(--eman-bg, #181f2c);
    border-color: var(--eman-border-light, #2d3748);
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail .eman-community-badge--student {
    background: rgba(77, 208, 225, 0.14);
    color: #67e8f9;
}

html.-dark-mode .eman-lesson-detail .eman-community-badge--assistant {
    background: rgba(52, 211, 153, 0.14);
    color: #6ee7b7;
}

html.-dark-mode .eman-lesson-detail .eman-community-badge--admin {
    background: rgba(251, 191, 36, 0.14);
    color: #fcd34d;
}

/* ── Related lessons ─────────────────────────────────── */
html.-dark-mode .eman-lesson-detail .eman-lesson-related {
    background: var(--eman-bg-subtle, #222a38);
    border-top-color: var(--eman-border-light, #2d3748);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-related .sectionTitle__title {
    color: var(--eman-purple-light, #d4a5e0) !important;
}

html.-dark-mode .eman-lesson-detail .eman-lesson-related .sectionTitle__text {
    color: var(--eman-text-muted, #8d99ae) !important;
}

html.-dark-mode .eman-lesson-detail .eman-lesson-related .lesson-card,
html.-dark-mode .eman-lesson-detail .related-lesson-card,
html.-dark-mode .eman-lesson-detail .eman-lesson-card-public {
    background: var(--eman-bg, #181f2c);
    border-color: var(--eman-border-light, #2d3748);
    box-shadow: var(--shadow-card, 0 2px 16px rgba(0, 0, 0, 0.32));
}

html.-dark-mode .eman-lesson-detail .eman-lesson-card-public .lesson-card-title {
    color: var(--eman-text-dark, #eef1f6);
}

html.-dark-mode .eman-lesson-detail .eman-lesson-card-public:hover {
    border-color: rgba(212, 165, 224, 0.35);
}

/* ── Error / mismatch card ───────────────────────────── */
html.-dark-mode .eman-lesson-detail .error-card-box {
    background: var(--eman-bg, #181f2c);
    border: 1px solid var(--eman-border-light, #2d3748);
    box-shadow: var(--shadow-elevated, 0 12px 40px rgba(0, 0, 0, 0.4));
}

html.-dark-mode .eman-lesson-detail .error-card-box p {
    color: var(--eman-text-light, #c5cdd9);
}

html.-dark-mode .eman-lesson-detail .error-card-icon {
    color: #fbbf24;
}

/* ── Buttons on lesson page ──────────────────────────── */
html.-dark-mode .eman-lesson-detail .button.-outline-purple-1 {
    color: var(--eman-purple-light, #d4a5e0) !important;
    border-color: rgba(212, 165, 224, 0.5) !important;
}

html.-dark-mode .eman-lesson-detail .button.-outline-purple-1:hover {
    background: rgba(106, 27, 154, 0.2) !important;
    color: var(--eman-text-dark, #eef1f6) !important;
}
