/**
 * MyOstad Platform — teacher-profile.css  [v1.0]
 * استایل اختصاصی «پروفایل حرفه‌ای تدریس» (mo-views-teacher-profile.js) و
 * پنل «اطلاعات فردی/مدارک/امتیاز ستاره/قیمت‌گذاری» (mo-views-teacher-reputation.js).
 *
 * [FIX] این کلاس‌ها (.mo-teacher-profile, .mo-teacher-reputation, .mo-tp-*, .mo-tr-*)
 * تا این نسخه در هیچ فایل CSS پابلیک تعریف نشده بودند — ظاهر این دو ویو فقط با
 * inline style ساخته می‌شد که اکثراً رنگ hardcode داشت (یا به متغیرهای غلط/ناموجود
 * مثل --mo-bg و --mo-primary اشاره می‌کرد) و در حالت دارک/لایت واکنش درستی نداشت.
 * این فایل با توکن‌های واقعی tokens.css (--mo-bg-card, --mo-bg-surface, --mo-border,
 * --primary, --primary-rgb, --mo-color-danger و ...) نوشته شده تا کاملاً تم‌پذیر باشد.
 *
 * وابسته به @layer cascade تعریف‌شده در tokens.css:
 *   @layer base, theme, accent, layout, components, overrides, utilities;
 * برای همین در همان لایه‌ی components قرار می‌گیرد — دقیقاً مثل components.css.
 */
@layer components {

.mo-teacher-profile,
.mo-teacher-reputation {
    color: var(--mo-text-body, currentColor);
}

.mo-tp-head h2 {
    color: var(--mo-text-high);
}

/* ── بلوک/کارت هر بخش فرم ─────────────────────────────────────── */
.mo-tp-section {
    background: var(--mo-bg-card);
    border: 1px solid var(--mo-border);
    border-radius: var(--mo-radius-lg, 14px);
    padding: 14px;
    margin-bottom: 14px;
}

.mo-tp-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--mo-text-high);
    margin-bottom: 6px;
}

.mo-tp-mini {
    font-size: 11px;
    color: var(--mo-text-low);
}

.mo-tp-empty {
    font-size: 12px;
    color: var(--mo-text-low);
}

.mo-tp-video-status {
    color: var(--mo-text-low);
}

/* ── فیلدهای ورودی (این عناصر هیچ inline style ای ندارند) ────────── */
.mo-tp-input {
    width: 100%;
    padding: 10px 12px;
    background: var(--mo-bg-surface);
    border: 1.5px solid var(--mo-border);
    border-radius: var(--mo-radius-md, 10px);
    color: var(--mo-text-high);
    font-size: 0.9375rem;
    font-family: var(--font-fa, 'Vazirmatn', sans-serif);
    outline: none;
    transition: border-color .18s, box-shadow .18s, background .18s;
    -webkit-appearance: none;
    appearance: none;
}
.mo-tp-input::placeholder { color: var(--mo-text-low); }
.mo-tp-input:focus {
    border-color: var(--primary, var(--mo-accent));
    box-shadow: 0 0 0 3px rgba(var(--primary-rgb, 59, 130, 246), .18);
}
select.mo-tp-input { cursor: pointer; }
textarea.mo-tp-input { resize: vertical; min-height: 72px; }

/* ── تگ‌های درسِ انتخاب‌شده ────────────────────────────────────── */
.mo-tp-tag-x { color: inherit; }

/* ── کارت‌های رسانه (ویدیو/جزوه/نمونه‌سوال) ──────────────────────── */
.mo-tp-card {
    background: var(--mo-bg-surface);
}

/* ── نوار ذخیره‌ی چسبان پایین صفحه ───────────────────────────────── */
.mo-tp-save-bar {
    background: var(--mo-bg-main);
}

/* ── تب‌های پنل «اطلاعات، مدارک و قیمت‌گذاری» ───────────────────── */
.mo-tr-tab.is-active {
    background: var(--primary, var(--mo-accent));
    color: #fff;
}

.mo-tr-cred-row {
    background: var(--mo-bg-card);
}

}
