/* NeuroArsho — Online Courses (دوره‌های آموزشی)
   ────────────────────────────────────────────────────────────────────────
   Loaded by _CatalogLayout next to the dark storefront stylesheets.
   Two rules, kept deliberately:
     1. Dark palette only (tokens from neuromind-auth.css / user-panel.css)
        — this file used to ship a light theme (#fff cards, #eef1f7 chips)
        that overrode the shared .nc-* catalog styles on every shop page.
     2. Anything that tweaks shared .nc-* markup is scoped under its course
        root (.cc-detail / .cc-learn / .cc-card) so book & article detail
        pages keep the styles defined in user-panel.css. */

/* ── Cards ─────────────────────────────────────────────────────────────── */
.cc-card__level {
    position: absolute;
    top: 8px;
    left: 8px;
    background: rgba(20, 24, 38, .72);
    color: #e7ecf6;
    border: 1px solid rgba(255, 255, 255, .14);
}
.cc-level--0 { background: rgba(22, 101, 52, .85); }
.cc-level--1 { background: rgba(217, 119, 6, .85); }
.cc-level--2 { background: rgba(185, 28, 28, .85); }
.nc-card__duration { color: var(--nm-muted); margin: 4px 0 0; }

/* ── Detail (course root: .cc-detail) ──────────────────────────────────── */
.cc-detail .nc-detail__grid {
    display: grid;
    grid-template-columns: minmax(260px, 400px) 1fr;
    gap: 28px;
    margin: 18px 0 8px;
}
@media (max-width: 860px) {
    .cc-detail .nc-detail__grid { grid-template-columns: 1fr; }
}
.cc-detail .nc-detail__art {
    aspect-ratio: 16 / 9;
    height: auto;
    border-radius: 14px;
    background-color: rgba(0, 212, 255, 0.06);
    background-size: cover;
    background-position: center;
    border: 1px solid var(--nm-border);
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.45);
}
.cc-detail .nc-detail__cover { position: static; }

/* Curriculum accordion */
.nc-curriculum { margin-top: 30px; }
.nc-curriculum__section {
    border: 1px solid var(--nm-border);
    border-radius: 12px;
    margin-bottom: 10px;
    background: var(--nm-card);
    overflow: hidden;
}
.nc-curriculum__section[open] .nc-curriculum__head { border-bottom: 1px solid var(--nm-border); }
.nc-curriculum__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
    color: var(--nm-text);
}
.nc-curriculum__head::-webkit-details-marker { display: none; }
.nc-curriculum__meta { color: var(--nm-muted); font-size: .8rem; }
.nc-curriculum__lessons { margin: 0; padding: 4px 0; list-style: none; }
.nc-curriculum__lessons li { border-top: 1px solid rgba(255, 255, 255, 0.05); }
.nc-curriculum__lessons a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s;
}
.nc-curriculum__lessons a:hover { background: rgba(0, 212, 255, 0.06); }
.nc-curriculum__icon { color: var(--nm-cyan-soft); display: inline-flex; }
.nc-curriculum__title { flex: 1; }
.nc-curriculum__time { color: var(--nm-muted); font-size: .78rem; }

/* ── Learn / player ────────────────────────────────────────────────────── */
.cc-learn__head { padding: 8px 0 18px; }
.cc-learn__title { margin: 6px 0 10px; font-size: 1.35rem; }
.cc-learn__progress { display: flex; align-items: center; gap: 10px; max-width: 380px; }
.cc-learn__progress .np-progress__bar { flex: 1; }

.cc-learn__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 22px;
    align-items: start;
}
@media (max-width: 980px) {
    .cc-learn__layout { grid-template-columns: 1fr; }
}

.cc-player { background: #0b0f1a; border-radius: 14px; overflow: hidden; border: 1px solid var(--nm-border); }
.cc-player__video { display: block; width: 100%; aspect-ratio: 16 / 9; background: #000; }

.cc-lock {
    border: 1px dashed var(--nm-cyan-border);
    border-radius: 14px;
    padding: 48px 24px;
    text-align: center;
    background: rgba(0, 212, 255, 0.04);
}
.cc-lock__icon { font-size: 2.2rem; color: var(--nm-muted); display: inline-block; margin-bottom: 10px; }
.cc-lock__title { margin: 0 0 8px; }
.cc-lock__text { color: var(--nm-muted); }
.cc-lock__actions { margin-top: 16px; }

.cc-lesson__meta { margin-top: 18px; }
.cc-lesson__heading { font-size: 1.1rem; margin: 0 0 8px; }
.cc-lesson__nav { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }

.cc-attach {
    margin-top: 12px;
    border: 1px solid var(--nm-border);
    border-radius: 12px;
    padding: 12px 14px;
    background: var(--nm-card);
}
.cc-attach__title { display: block; margin-bottom: 6px; }
.cc-attach__row { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-top: 1px solid rgba(255, 255, 255, 0.05); }
.cc-attach__name { flex: 1; }

/* Curriculum sidebar */
.cc-side__title { margin: 0 0 10px; font-size: 1rem; }
.cc-side {
    border: 1px solid var(--nm-border);
    border-radius: 14px;
    padding: 14px;
    background: var(--nm-card);
    max-height: 72vh;
    overflow: auto;
    overscroll-behavior: contain;
}
.cc-side__section { margin-bottom: 14px; }
.cc-side__section-title { margin: 0 0 6px; font-size: .85rem; color: var(--nm-muted); }
.cc-side__lessons { list-style: none; margin: 0; padding: 0; }
.cc-side__lesson {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 9px;
    color: inherit;
    text-decoration: none;
    transition: background 0.15s;
}
.cc-side__lesson:hover { background: rgba(255, 255, 255, 0.05); }
.cc-side__lesson.is-on { background: rgba(0, 212, 255, 0.12); color: var(--nm-cyan-soft); }
.cc-side__icon { display: inline-flex; color: var(--nm-muted); }
.cc-side__lesson.is-on .cc-side__icon { color: var(--nm-cyan-soft); }
.cc-side__name { flex: 1; font-size: .85rem; }
.cc-side__time { color: var(--nm-muted); font-size: .72rem; }