/* Reader curriculum: readable bilingual navigation, using the shared lesson theme. */
.ct-reader-page .ct-curriculum {
    background: var(--ct-white);
    border-color: var(--ct-line);
    border-radius: 16px;
    box-shadow: 0 6px 24px color-mix(in srgb, var(--ct-ink) 3%, transparent);
}
.ct-reader-page .ct-course-menu > summary {
    padding: 20px 18px;
    color: var(--ct-ink);
    font-size: 18px;
    line-height: 1.6;
}
.ct-reader-page .ct-course-menu > summary small {
    color: var(--ct-muted);
    font-size: 11.5px;
    line-height: 1.7;
    margin-top: 3px;
}
.ct-reader-page .ct-course-position {
    padding: 16px 18px 14px;
}
.ct-reader-page .ct-course-position > div:first-child,
.ct-reader-page .ct-course-position small {
    color: var(--ct-muted);
    font-size: 12px;
    line-height: 1.7;
}
.ct-reader-page .ct-course-position bdi {
    font-size: 12px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.ct-reader-page .ct-course-track {
    height: 5px;
    margin-block: 10px 8px;
    background: var(--ct-lilac);
}
.ct-reader-page .ct-course-track span {
    background: var(--ct-purple);
}
.ct-reader-page .ct-course-search {
    margin: 0 14px 10px;
}
.ct-reader-page .ct-course-search input {
    min-height: 44px;
    font-size: 13px;
    border-radius: 10px;
    color: var(--ct-ink);
    background: var(--ct-page);
    border-color: var(--ct-line);
}
.ct-reader-page .ct-course-search input::placeholder,
.ct-reader-page .ct-course-search svg,
.ct-reader-page .ct-course-search kbd {
    color: var(--ct-muted);
}
.ct-reader-page .ct-course-search kbd {
    background: var(--ct-white);
    border-color: var(--ct-line);
}
.ct-reader-page .ct-search-status:not(.ct-visually-hidden) {
    padding: 10px 18px 14px;
    font-size: 12px;
    line-height: 1.8;
    color: var(--ct-muted);
}
.ct-reader-page .ct-course-chapters {
    padding: 0 10px 10px;
    min-height: 0;
    max-height: clamp(180px, calc(100dvh - 344px), 620px);
    scrollbar-color: var(--ct-line) transparent;
    overscroll-behavior: contain;
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter {
    border-color: var(--ct-line);
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter:last-child {
    border-bottom: 0;
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter > summary {
    gap: 10px;
    padding: 7px 10px;
    min-height: 48px;
    color: var(--ct-ink);
    font: 700 14px/1.5 Inter, Cairo, sans-serif;
    border-radius: 10px;
}
.ct-reader-page .ct-course-chapters summary::marker,
.ct-reader-page .ct-course-menu > summary::marker {
    content: "";
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter > summary::after {
    content: "";
    flex: 0 0 7px;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    color: var(--ct-muted);
    transform: rotate(45deg);
    margin-inline: auto 3px;
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter[open] > summary::after {
    transform: rotate(225deg);
}
.ct-reader-page .ct-course-chapters .ct-chapter-label,
.ct-reader-page .ct-course-chapters .ct-lesson-label {
    gap: 2px;
    line-height: 1.5;
}
.ct-reader-page .ct-course-chapters .ct-chapter-label bdi[lang="ar"],
.ct-reader-page .ct-course-chapters .ct-lesson-label bdi[lang="ar"] {
    color: var(--ct-muted);
    font: 500 13px/1.65 Cairo, sans-serif;
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter ol {
    display: grid;
    gap: 3px;
    margin-bottom: 10px;
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter li a {
    gap: 9px;
    min-height: 52px;
    padding: 6px 10px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: var(--ct-ink);
    font: 600 13px/1.5 Inter, Cairo, sans-serif;
    transition: background .16s, border-color .16s;
}
.ct-reader-page .ct-course-chapters .ct-lesson-number {
    display: grid;
    place-items: center;
    flex: 0 0 27px;
    width: 27px;
    height: 30px;
    border-radius: 8px;
    border: 1px solid color-mix(in srgb, var(--ct-purple) 32%, var(--ct-line));
    background: color-mix(in srgb, var(--ct-purple) 18%, var(--ct-white));
    color: var(--ct-purple-dark);
    font: 700 11px/1 Inter, sans-serif;
    font-variant-numeric: tabular-nums;
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter li a:hover,
.ct-reader-page .ct-course-chapters .ct-elements-chapter > summary:hover {
    background: var(--ct-page);
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter li a[aria-current] {
    background: var(--ct-lilac);
    color: var(--ct-purple-dark);
    border-color: color-mix(in srgb, var(--ct-purple) 28%, var(--ct-line));
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter li a[aria-current] .ct-lesson-label bdi[lang="ar"] {
    color: inherit;
    font-weight: 600;
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter li a[aria-current] .ct-lesson-number {
    color: var(--ct-white);
    background: var(--ct-purple-dark);
    border-color: var(--ct-purple-dark);
}
.ct-reader-page .ct-course-chapters .ct-elements-chapter li a[aria-current]::after {
    flex-shrink: 0;
    align-self: center;
    padding: 2px 5px;
    color: inherit;
    border-color: color-mix(in srgb, var(--ct-purple) 28%, var(--ct-line));
    font: 600 10px/1.6 Cairo, sans-serif;
}
.ct-reader-page .ct-curriculum :is(summary, a, input):focus-visible {
    outline: 2px solid var(--ct-purple);
    outline-offset: -2px;
}
.ct-reader-page .ct-course-help {
    gap: 8px;
    padding: 13px 16px;
    background: var(--ct-page);
    color: var(--ct-muted);
    border-color: var(--ct-line);
    font-size: 11px;
    line-height: 1.8;
}
@media (min-width: 801px) {
    .ct-reader-page:not(.ct-focus-mode) .ct-workspace {
        grid-template-columns: 268px minmax(0, 1fr);
        gap: 24px;
    }
}
@media (min-width: 801px) and (max-width: 1100px) {
    .ct-reader-page:not(.ct-focus-mode) .ct-workspace {
        grid-template-columns: 240px minmax(0, 1fr);
        gap: 20px;
    }
}
@media (max-width: 800px) {
    .ct-reader-page .ct-course-menu > summary {
        padding: 13px 16px;
        font-size: 16px;
    }
    .ct-reader-page .ct-course-menu > summary > .ct-menu-chevron {
        width: 8px;
        height: 8px;
        flex: 0 0 8px;
        margin-inline-end: 3px;
        font-size: 0;
        color: var(--ct-muted);
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg);
    }
    .ct-reader-page .ct-course-menu[open] > summary > .ct-menu-chevron {
        transform: rotate(225deg);
    }
    .ct-reader-page .ct-course-chapters {
        max-height: min(52dvh, 400px);
    }
    .ct-reader-page .ct-course-search input {
        font-size: 16px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .ct-reader-page .ct-course-chapters .ct-elements-chapter li a,
    .ct-reader-page .ct-course-chapters .ct-elements-chapter > summary::after {
        transition: none;
    }
}
