/* ============================================================
   قلموم — استایل اپلیکیشن (ورود + داشبورد) — همه از توکن‌های --gh-*
   ============================================================ */

/* ---------- ورود ---------- */
.gh-login-body { display: grid; place-items: center; min-height: 100vh; padding: 24px; }
/* حباب «در حال تایپ…» گوشه‌ی بالا-چپ کارت ورود — حباب چت با یک گوشه‌ی چهارگوش (دم به‌سمت کارت)؛
   هر نقطه در چرخه‌ی ۱٫۲ثانیه‌ای در لحظه‌ی ۳۰٪ حدود ۷px بالا می‌پرد و روشن می‌شود،
   بقیه‌ی چرخه پایین و کم‌رنگ می‌ماند؛ تأخیر ۰٫۱۶ثانیه‌ای موج را از چپ به راست می‌برد. */
.gh-login-card { position: relative; }
.gh-typing-bubble {
	position: absolute; top: -17px; left: 20px; z-index: 2;
	display: inline-flex; align-items: flex-end; gap: 5px; direction: ltr;
	background: var(--gh-accent-surface); border: 1px solid var(--gh-accent-border);
	border-radius: var(--gh-r-full); border-bottom-left-radius: 4px;
	padding: 10px 13px; box-shadow: var(--gh-shadow-1);
}
.gh-typing-bubble i {
	width: 7px; height: 7px; border-radius: 50%; background: var(--gh-accent-solid);
	opacity: .35; animation: gh-typing-bubble 1.2s var(--gh-ease-in-out) infinite;
}
.gh-typing-bubble i:nth-child(2) { animation-delay: .16s; }
.gh-typing-bubble i:nth-child(3) { animation-delay: .32s; }
@keyframes gh-typing-bubble {
	0%, 60%, 100% { transform: translateY(0); opacity: .35; }
	30%           { transform: translateY(-7px); opacity: 1; }
}
.gh-login-wrap { display: flex; flex-direction: column; align-items: center; gap: 22px; width: 100%; }
.gh-login-card {
	width: min(400px, 100%); background: var(--gh-bg-raised);
	border: 1px solid var(--gh-border-default); border-radius: var(--gh-r-2xl);
	padding: 32px; box-shadow: var(--gh-shadow-1);
}
.gh-login-card h1 { font-size: 20px; font-weight: 800; margin: 0 0 6px; }
.gh-login-card p { font-size: 13.5px; color: var(--gh-text-secondary); margin: 0 0 18px; }
.gh-login-card .gh-btn { width: 100%; margin-block-start: 14px; }
.gh-login-back { font-size: 13px; color: var(--gh-text-tertiary); text-decoration: none; }
.gh-bd-row select { height: 48px; border-radius: var(--gh-r-sm); border: 1.5px solid var(--gh-border-default); background: var(--gh-bg-surface); color: var(--gh-text-primary); font: inherit; font-size: 14.5px; padding-inline: 14px; width: 100%; }
.gh-bd-row select:focus { outline: none; border-color: var(--gh-accent-solid); box-shadow: var(--gh-focus-ring); }

/* ---------- اسکلت داشبورد ---------- */
/* sticky برای کارکردن به ارتفاع مصنوعیِ والد نیاز ندارد؛ اگر محتوا کوتاه است اصولاً اسکرولی
   وجود ندارد که سایدبار در آن بچسبد. ارتفاع قبلیِ 100vh + 250px در تمام زیرصفحه‌های کم‌محتوا
   یک ناحیه‌ی خالی و اسکرول جعلی می‌ساخت. ارتفاع شبکه اکنون فقط از محتوای واقعی می‌آید. */
.gh-dash-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 26px; align-items: start; padding-block: 28px 64px; min-height: 0; }
.gh-dash-side {
	position: sticky; top: var(--gh-sticky-offset);
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default);
	border-radius: var(--gh-r-lg); padding: 10px; display: flex; flex-direction: column; gap: 4px;
}
.gh-dash-side a {
	display: flex; align-items: center; gap: 11px; font-size: 13.5px; font-weight: 600;
	color: var(--gh-text-secondary); text-decoration: none; padding: 11px 13px;
	border-radius: var(--gh-r-sm); transition: all var(--gh-dur-fast) var(--gh-ease-out);
}
.gh-dash-side a svg { width: 18px; height: 18px; }
.gh-dash-side a:hover { background: var(--gh-bg-sunken); color: var(--gh-text-primary); }
.gh-dash-side a.is-on { background: var(--gh-accent-surface); color: var(--gh-accent-text); }
.gh-dash-side .gh-dash-logout { color: var(--gh-danger-text); margin-block-start: 6px; border-block-start: 1px dashed var(--gh-border-subtle); border-radius: 0 0 var(--gh-r-sm) var(--gh-r-sm); }
.gh-dash-hi { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-block-end: 20px; }
.gh-dash-hi h1 { font-size: 22px; font-weight: 900; margin: 0; }
.gh-dash-hi p { font-size: 13px; color: var(--gh-text-tertiary); margin: 4px 0 0; }

/* ---------- Bento (چیدمان مصوب v1.8) ---------- */
.gh-bento { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.gh-widget {
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default);
	border-radius: var(--gh-r-xl); padding: 20px; display: flex; flex-direction: column; gap: 12px; min-width: 0;
}
.gh-whead { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; color: var(--gh-text-secondary); }
.gh-whead svg { width: 16px; height: 16px; color: var(--gh-accent-text); }
.gh-w-note { font-size: 13px; color: var(--gh-text-secondary); margin: 0; }
.gh-w-gp { grid-column: span 2; grid-row: span 2; }
.gh-w-continue { grid-column: span 2; }
.gh-w-quote { grid-column: span 2; background: linear-gradient(135deg, var(--gh-accent-surface), var(--gh-bg-raised) 75%); }
.gh-w-quote blockquote { font-size: 14px; font-weight: 700; line-height: 1.85; margin: 0; text-wrap: balance; }
.gh-w-quote cite { font-style: normal; font-size: 11.5px; color: var(--gh-text-tertiary); }
.gh-w-reco { grid-column: span 2; }

/* تکمیل پروفایل */
.gh-gp-top { display: flex; align-items: center; gap: 14px; }
.gh-gp-pct { font-size: 22px; font-weight: 900; color: var(--gh-accent-text); font-variant-numeric: tabular-nums; }
.gh-gp-info { flex: 1; min-width: 0; }
.gh-gp-info b { font-size: 13.5px; display: block; }
.gh-gp-info > span, .gh-gp-info span span { font-size: 11.5px; color: var(--gh-text-tertiary); }
.gh-gp-track { height: 8px; background: var(--gh-bg-sunken); border: 1px solid var(--gh-border-subtle); border-radius: var(--gh-r-full); overflow: hidden; }
.gh-gp-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--gh-accent-solid), var(--gh-accent-hover)); transition: width var(--gh-dur-page) var(--gh-ease-out); }
.gh-gp-items { display: flex; flex-direction: column; }
.gh-gp-item { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-block-end: 1px dashed var(--gh-border-subtle); font-size: 13px; font-weight: 600; }
.gh-gp-item:last-child { border-block-end: none; }
.gh-gp-ic {
	width: 26px; height: 26px; border-radius: var(--gh-r-sm); display: grid; place-items: center; flex: none;
	background: var(--gh-bg-sunken); color: var(--gh-text-tertiary); font-weight: 800;
}
.gh-gp-item.is-done { color: var(--gh-text-tertiary); }
.gh-gp-item.is-done .gh-gp-tt { text-decoration: line-through; }
.gh-gp-item.is-done .gh-gp-ic { background: var(--gh-success-surface); color: var(--gh-success-text); }
.gh-gp-item .gh-btn { margin-inline-start: auto; }
.gh-gp-reward {
	font-size: 12px; font-weight: 700; color: var(--gh-accent-text);
	background: var(--gh-accent-surface); border: 1px solid var(--gh-accent-border);
	border-radius: var(--gh-r-sm); padding: 9px 12px;
}

/* ادامه یادگیری (لیست + اسلات خالی + اسکرول داخلی) */
.gh-cl-list { display: flex; flex-direction: column; gap: 10px; max-height: 236px; overflow-y: auto; padding-inline-end: 4px; }
.gh-cl-item { display: flex; align-items: center; gap: 12px; border: 1px solid var(--gh-border-default); border-radius: var(--gh-r-md); padding: 11px 14px; background: var(--gh-bg-surface); flex: none; }
.gh-cl-thumb { width: 42px; height: 42px; border-radius: var(--gh-r-sm); display: grid; place-items: center; color: var(--gh-white); flex: none; }
.gh-cl-thumb svg { width: 17px; height: 17px; }
.gh-cl-info { flex: 1; min-width: 0; }
.gh-cl-info b { font-size: 13.5px; font-weight: 800; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gh-cl-mini { display: flex; align-items: center; gap: 8px; margin-block-start: 6px; }
.gh-cl-track { flex: 1; height: 5px; background: var(--gh-bg-sunken); border-radius: var(--gh-r-full); overflow: hidden; }
.gh-cl-track i { display: block; height: 100%; border-radius: inherit; }
.gh-cl-pct { font-size: 11px; font-weight: 800; color: var(--gh-text-tertiary); font-variant-numeric: tabular-nums; }
.gh-cl-empty { border: 1.5px dashed var(--gh-border-strong); border-radius: var(--gh-r-md); display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; flex-wrap: wrap; flex: none; }
.gh-cl-empty span { font-size: 12.5px; color: var(--gh-text-tertiary); font-weight: 600; }

/* پیشنهادها */
.gh-reco-row { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-block-end: 1px dashed var(--gh-border-subtle); }
.gh-reco-row:last-child { border-block-end: none; }
.gh-reco-info { flex: 1; min-width: 0; }
.gh-reco-info b { font-size: 13px; font-weight: 800; display: block; }
.gh-reco-info span { font-size: 11.5px; color: var(--gh-text-tertiary); }

/* ویجت خلاصه‌ی اعلان‌ها (پیشخوان) */
.gh-whead .gh-count-badge { margin-inline-start: auto; }
.gh-w-notifs-list { display: flex; flex-direction: column; gap: 2px; }
.gh-w-notifs-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-block: 7px; border-block-end: 1px dashed var(--gh-border-subtle); font-size: 12.5px; color: var(--gh-text-secondary); }
.gh-w-notifs-row:last-child { border-block-end: none; }
.gh-w-notifs-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gh-w-notifs-row time { flex: none; font-size: 11px; color: var(--gh-text-tertiary); margin-inline-start: 10px; }
.gh-w-notifs-row.is-new span { color: var(--gh-text-primary); font-weight: 700; }

/* ---------- مرکز اعلان‌ها (صفحه‌ی اختصاصی) ---------- */
.gh-notif-page { display: flex; flex-direction: column; gap: 20px; }
.gh-notif-page-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.gh-notif-page-head h2 { font-size: 19px; font-weight: 800; margin: 0; }
.gh-notif-list { display: flex; flex-direction: column; gap: 10px; }
.gh-notif-item {
	position: relative; display: flex; align-items: flex-start; gap: 12px;
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default);
	border-radius: var(--gh-r-md); padding: 14px 16px;
	transition: background var(--gh-dur-fast) var(--gh-ease-out);
}
/* نوار تأکید با ::before و خواص منطقی — box-shadow جهت منطقی ندارد و «inset 3px» در RTL نوار را
   سمت چپ (انتهای خط) می‌گذاشت نه ابتدای خط (⚠️ همان خانواده‌ی درس padding معکوس در RTL). */
.gh-notif-item.is-new { background: var(--gh-accent-surface); }
.gh-notif-item.is-new::before {
	content: ""; position: absolute; inset-block: 12px; inset-inline-start: -1px;
	width: 3px; border-radius: var(--gh-r-full); background: var(--gh-accent-solid);
}
.gh-notif-ic {
	width: 36px; height: 36px; border-radius: var(--gh-r-sm); display: grid; place-items: center; flex: none;
	background: var(--gh-bg-sunken); color: var(--gh-text-tertiary);
}
.gh-notif-ic svg { width: 18px; height: 18px; }
.gh-notif-item.is-new .gh-notif-ic { background: var(--gh-accent-solid); color: var(--gh-accent-on-solid); }
.gh-notif-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.gh-notif-text { font-size: 13.5px; font-weight: 600; color: var(--gh-text-primary); line-height: 1.8; }
.gh-notif-meta { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--gh-text-tertiary); font-variant-numeric: tabular-nums; }
.gh-notif-cat { font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: var(--gh-r-full); background: var(--gh-bg-sunken); color: var(--gh-text-secondary); }
.gh-notif-dot { position: absolute; top: 14px; inset-inline-end: 14px; width: 8px; height: 8px; border-radius: 50%; background: var(--gh-danger-solid); flex: none; }

/* ---------- صفحه‌ی پیشرفت دوره ---------- */
/* .gh-chapter / .gh-chapter-meta / .gh-lesson / .gh-lesson-dur پایه در base.css تعریف شده‌اند
   (هم صفحه‌ی عمومی دوره و هم اینجا از آن‌ها استفاده می‌کنند)؛ اینجا فقط افزوده‌ی اختصاصی داشبورد. */
.gh-lesson-check {
	width: 26px; height: 26px; border-radius: var(--gh-r-sm); border: 1.5px solid var(--gh-border-strong);
	background: var(--gh-bg-surface); color: transparent; cursor: pointer; display: grid; place-items: center; flex: none;
	transition: all var(--gh-dur-fast) var(--gh-ease-out);
}
/* تیک با پاپ ریز ظاهر می‌شود — همان میکروبازخورد .gh-f-check در base.css */
.gh-lesson-check svg { width: 14px; height: 14px; transform: scale(0); transition: transform var(--gh-dur-fast) var(--gh-ease-out); }
.gh-lesson.is-done .gh-lesson-check svg { transform: scale(1); }
.gh-lesson.is-done .gh-lesson-check { background: var(--gh-success-solid); border-color: var(--gh-success-solid); color: var(--gh-white); }
.gh-lesson.is-done .gh-lesson-title { color: var(--gh-text-tertiary); text-decoration: line-through; }

/* ---------- فرم پروفایل ---------- */
.gh-notice { border-radius: var(--gh-r-md); padding: 12px 18px; font-size: 13.5px; font-weight: 700; margin-block-end: 16px; }
.gh-notice.is-success { background: var(--gh-success-surface); color: var(--gh-success-text); border: 1px solid color-mix(in srgb, var(--gh-success-text) 25%, transparent); }
.gh-profile-form { gap: 20px; }
.gh-pf-avatar-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.gh-file-btn { cursor: pointer; }
.gh-pf-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.gh-bd-row { display: flex; gap: 8px; }
.gh-pf-interests h3 { font-size: 15px; font-weight: 800; margin: 0 0 4px; }
.gh-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-block-start: 10px; }
.gh-chip-check input { position: absolute; opacity: 0; }
.gh-chip-check span {
	display: inline-flex; font-size: 13px; font-weight: 600; padding: 8px 16px;
	border-radius: var(--gh-r-full); border: 1px solid var(--gh-border-default);
	background: var(--gh-bg-surface); color: var(--gh-text-secondary); cursor: pointer;
	transition: all var(--gh-dur-fast) var(--gh-ease-out);
}
.gh-chip-check input:checked + span { background: var(--gh-accent-surface); border-color: var(--gh-accent-border); color: var(--gh-accent-text); }
.gh-chip-check input:focus-visible + span { outline: 2px solid var(--gh-accent-solid); outline-offset: 2px; }

/* ---------- واکنش‌گرایی ---------- */
@media (max-width: 1024px) {
	.gh-dash-layout { grid-template-columns: 1fr; }
	.gh-dash-side { position: static; flex-direction: row; overflow-x: auto; }
	.gh-dash-side a { flex: none; }
	.gh-dash-side .gh-dash-logout { border: none; margin: 0; }
	.gh-bento { grid-template-columns: repeat(2, 1fr); }
	.gh-w-gp { grid-row: auto; }
}
@media (max-width: 640px) {
	.gh-bento { grid-template-columns: 1fr; }
	.gh-w-gp, .gh-w-continue, .gh-w-quote, .gh-w-reco { grid-column: span 1; }
	.gh-pf-grid { grid-template-columns: 1fr; }
}

/* ---------- شبکه‌های اجتماعی کاربر ---------- */
.gh-dash-id { display: flex; align-items: center; gap: 12px; }
.gh-socials { display: inline-flex; gap: 6px; }
.gh-social-ic {
	width: 34px; height: 34px; display: grid; place-items: center;
	border-radius: var(--gh-r-sm); border: 1px solid var(--gh-border-default);
	background: var(--gh-bg-surface); color: var(--gh-text-secondary);
	transition: all var(--gh-dur-fast) var(--gh-ease-out);
}
.gh-social-ic:hover { color: var(--gh-accent-text); border-color: var(--gh-accent-border); transform: translateY(-2px); }

/* ---------- کد عضویت تیمی ---------- */
.gh-redeem-row { display: flex; flex-direction: column; gap: 8px; }
.gh-redeem-row input {
	width: 100%; height: 44px; border-radius: var(--gh-r-sm);
	border: 1.5px solid var(--gh-border-default); background: var(--gh-bg-surface);
	color: var(--gh-text-primary); font: inherit; font-size: 13px; padding-inline: 12px;
}
.gh-redeem-row input:focus { outline: none; border-color: var(--gh-accent-solid); box-shadow: var(--gh-focus-ring); }
.gh-redeem-row [data-redeem-btn] { width: 100%; }
.gh-redeem-msg { min-height: 18px; font-size: 12.5px; font-weight: 700; margin: 0; }
.gh-redeem-msg.is-ok { color: var(--gh-success-text); }
.gh-redeem-msg.is-error { color: var(--gh-danger-text); }
.gh-seat-list { display: flex; flex-direction: column; gap: 8px; max-height: 180px; overflow-y: auto; }
.gh-seat-row { display: flex; align-items: center; gap: 10px; font-size: 12.5px; border: 1px dashed var(--gh-border-default); border-radius: var(--gh-r-sm); padding: 8px 12px; }
.gh-seat-row code { font-weight: 700; }
.gh-seat-row span { flex: 1; color: var(--gh-text-tertiary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gh-seat-row b { color: var(--gh-success-text); font-size: 11.5px; white-space: nowrap; }
.gh-seat-row.is-used { opacity: .55; }
/* شناسه‌ی فنی → ui-monospace طبق Typography System؛ حالا <button> واقعی (نه <code> با onclick) تا کیبورد/فوکوس/توست رایگان از data-copy-link سراسری بگیرد. */
.gh-license-key {
	display: block; width: 100%; background: var(--gh-bg-sunken); border: 1px dashed var(--gh-border-strong);
	border-radius: var(--gh-r-sm); padding: 10px 14px; font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	font-size: 14px; font-weight: 700; color: var(--gh-text-primary); cursor: copy; text-align: start;
	transition: border-color var(--gh-dur-fast) var(--gh-ease-out), background var(--gh-dur-fast) var(--gh-ease-out);
}
.gh-license-key:hover { border-color: var(--gh-accent-border); background: var(--gh-accent-surface); }
.gh-license-key:active { transform: scale(.99); }

/* ========================================================================== */
/* Ghalamoom 2026 — learning workspace redesign                              */
/* ========================================================================== */

.gh-dash-layout {
	grid-template-columns: 252px minmax(0, 1fr);
	gap: 32px;
	padding-block: 42px 80px;
}

.gh-dash-side {
	top: var(--gh-sticky-offset);
	padding: 12px;
	border-radius: var(--gh-r-xl);
	background:
		linear-gradient(155deg, color-mix(in srgb, var(--gh-accent-surface) 42%, transparent), transparent 38%),
		var(--gh-bg-raised);
	box-shadow: var(--gh-shadow-1);
}

.gh-dash-side::before {
	content: 'فضای یادگیری من';
	display: block;
	padding: 12px 13px 16px;
	border-block-end: 1px solid var(--gh-border-subtle);
	margin-block-end: 5px;
	color: var(--gh-text-tertiary);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .04em;
}

.gh-dash-side a {
	min-height: 46px;
	padding: 11px 13px;
	border: 1px solid transparent;
	border-radius: var(--gh-r-md);
	font-weight: 750;
}

.gh-dash-side a svg {
	width: 19px;
	height: 19px;
}

.gh-dash-side a:hover {
	border-color: var(--gh-border-subtle);
	transform: translateX(-2px);
}

.gh-dash-side a.is-on {
	border-color: var(--gh-accent-border);
	background: var(--gh-accent-surface);
	box-shadow: 0 6px 16px color-mix(in srgb, var(--gh-accent-solid) 9%, transparent);
}

.gh-dash-main {
	min-width: 0;
}

.gh-dash-hi {
	position: relative;
	margin-block-end: 26px;
	padding: 24px 26px;
	overflow: hidden;
	border: 1px solid var(--gh-border-default);
	border-radius: var(--gh-r-xl);
	background:
		linear-gradient(120deg, var(--gh-accent-surface), transparent 58%),
		var(--gh-bg-raised);
	box-shadow: var(--gh-shadow-1);
}

.gh-dash-hi::after {
	content: 'ق';
	position: absolute;
	inset-inline-end: 90px;
	inset-block-start: -42px;
	color: var(--gh-accent-text);
	font-size: 150px;
	font-weight: 1000;
	line-height: 1;
	opacity: .055;
	pointer-events: none;
}

.gh-dash-hi h1 {
	font-size: clamp(22px, 2.4vw, 30px);
	letter-spacing: -.035em;
}

.gh-dash-id {
	position: relative;
	z-index: 1;
	padding: 6px;
	border: 1px solid var(--gh-border-subtle);
	border-radius: var(--gh-r-full);
	background: color-mix(in srgb, var(--gh-bg-raised) 80%, transparent);
}

.gh-bento {
	gap: 18px;
}

.gh-widget {
	position: relative;
	padding: 22px;
	overflow: hidden;
	border-radius: var(--gh-radius-card);
	box-shadow: var(--gh-shadow-1);
	transition:
		transform var(--gh-dur-base) var(--gh-ease-out),
		border-color var(--gh-dur-fast) var(--gh-ease-out),
		box-shadow var(--gh-dur-base) var(--gh-ease-out);
}

.gh-widget:hover {
	transform: translateY(-3px);
	border-color: var(--gh-border-strong);
	box-shadow: var(--gh-shadow-2);
}

.gh-widget::before {
	content: '';
	position: absolute;
	inset-inline: 20px;
	inset-block-start: 0;
	height: 3px;
	border-radius: 0 0 var(--gh-r-full) var(--gh-r-full);
	background: var(--gh-accent-solid);
	opacity: .22;
}

.gh-whead {
	font-size: 13.5px;
	font-weight: 900;
}

.gh-whead svg {
	width: 18px;
	height: 18px;
}

.gh-w-gp {
	background:
		linear-gradient(145deg, color-mix(in srgb, var(--gh-accent-surface) 55%, transparent), transparent 50%),
		var(--gh-bg-raised);
}

.gh-gp-pct {
	font-size: 30px;
	letter-spacing: -.04em;
}

.gh-gp-track {
	height: 10px;
	padding: 2px;
}

.gh-gp-track i {
	box-shadow: 0 3px 10px color-mix(in srgb, var(--gh-accent-solid) 32%, transparent);
}

.gh-gp-item {
	min-height: 42px;
}

.gh-cl-item {
	padding: 12px;
	border-radius: var(--gh-radius-control);
	transition: border-color var(--gh-dur-fast) var(--gh-ease-out), background var(--gh-dur-fast) var(--gh-ease-out);
}

.gh-cl-item:hover {
	border-color: var(--gh-accent-border);
	background: var(--gh-bg-raised);
}

.gh-cl-thumb {
	width: 46px;
	height: 46px;
	border-radius: var(--gh-r-md);
	box-shadow: var(--gh-shadow-1);
}

.gh-w-quote {
	justify-content: center;
	min-height: 150px;
	background:
		radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--gh-accent-border) 42%, transparent), transparent 12rem),
		linear-gradient(135deg, var(--gh-accent-surface), var(--gh-bg-raised) 75%);
}

.gh-w-quote blockquote {
	font-size: 16px;
	line-height: 2;
}

.gh-notif-item,
.gh-profile-form .gh-widget,
.gh-course-panel {
	box-shadow: var(--gh-shadow-1);
}

/* هماهنگی فضای یادگیری با سیستم بصری سطح محصول */
.gh-dash-layout {
	grid-template-columns: 270px minmax(0, 1fr);
	gap: 38px;
	padding-block: 54px 64px;
	min-block-size: 0;
}
.gh-dash-layout > * { min-block-size: 0; }
/* خود شبکه 64px فاصله‌ی پایانی دارد؛ margin عمومی 100px فوتر در این مسیر، همان فاصله را
   دوباره اعمال می‌کرد و بعد از صفحات کم‌محتوا یک ناحیه‌ی خالی بزرگ می‌ساخت. */
.gh-main:has(.gh-dash-layout) + .gh-footer { margin-block-start: 0; }
.gh-dash-side { padding: 14px; border-radius: var(--gh-radius-card); border-color: color-mix(in srgb, var(--gh-border-default) 72%, transparent); box-shadow: var(--gh-shadow-2); }
.gh-dash-side a { min-height: 50px; border-radius: var(--gh-radius-control); }
.gh-dash-hi { padding: 30px 32px; border-radius: var(--gh-radius-card); box-shadow: var(--gh-shadow-2); }
.gh-dash-hi h1 { font-size: clamp(26px, 3vw, 38px); }
.gh-bento { gap: 22px; }
.gh-widget { padding: 26px; border-radius: var(--gh-radius-card); }
.gh-widget:hover { transform: translateY(-3px); box-shadow: var(--gh-shadow-2); }
@media (max-width: 900px) { .gh-dash-layout { grid-template-columns: 1fr; gap: 24px; padding-block-start: 34px; } }

.gh-login-body {
	background:
		radial-gradient(circle at 70% 25%, var(--gh-accent-surface), transparent 28rem),
		var(--gh-bg-page);
}

.gh-login-card {
	padding: 36px;
	border-radius: var(--gh-r-xl);
	box-shadow: var(--gh-shadow-3);
}

/* صفحه‌ی مستقل ورود باید تنها به اندازه‌ی محتوای واقعی فرم ارتفاع بگیرد. این قواعد
   عمداً بعد از قواعد عمومی اپلیکیشن آمده‌اند تا موقعیت‌های absolute نسخه‌ی قدیمی
   نتوانند لوگو و لینک بازگشت را از جریان طبیعی صفحه خارج کنند. */
.gh-login-body {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100svh;
	padding: clamp(28px, 6vh, 64px) 20px;
}

.gh-login-body .gh-login-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: min(440px, 100%);
	gap: 0;
}

.gh-login-body .gh-login-logo {
	position: static;
	inset: auto;
	justify-content: center;
	margin: 0 0 clamp(30px, 5vh, 48px);
	font-size: 24px;
}

.gh-login-body .gh-login-logo .gh-logo-mark {
	width: 34px;
}

.gh-login-body .gh-login-card {
	width: 100%;
	height: auto;
	min-height: 0;
	padding: clamp(26px, 4vw, 36px);
}

.gh-login-body .gh-login-back {
	position: static;
	inset: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	margin-top: 22px;
	padding-inline: 16px;
	border: 1px solid var(--gh-border-default);
	border-radius: var(--gh-radius-control);
	background: color-mix(in srgb, var(--gh-bg-raised) 72%, transparent);
	color: var(--gh-text-secondary);
	font-size: var(--gh-font-caption);
	font-weight: 750;
	text-decoration: none;
	transition:
		border-color var(--gh-dur-fast) var(--gh-ease-out),
		background var(--gh-dur-fast) var(--gh-ease-out),
		color var(--gh-dur-fast) var(--gh-ease-out),
		transform var(--gh-dur-fast) var(--gh-ease-out);
}

.gh-login-body .gh-login-back:hover {
	border-color: var(--gh-accent-border);
	background: var(--gh-accent-surface);
	color: var(--gh-accent-text);
	transform: translateY(-2px);
}

@media (max-width: 520px) {
	.gh-login-body {
		align-items: flex-start;
		padding: 28px 16px 32px;
	}

	.gh-login-body .gh-login-logo {
		margin-bottom: 30px;
	}
}

@media (max-width: 1024px) {
	.gh-dash-layout {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.gh-dash-side::before {
		display: none;
	}

	.gh-dash-side {
		position: sticky;
		top: var(--gh-sticky-offset);
		z-index: 20;
		flex-direction: row;
		padding: 7px;
		backdrop-filter: blur(18px);
	}

	.gh-dash-side a:hover {
		transform: translateY(-2px);
	}

	.gh-dash-side a.is-on {
		box-shadow: 0 6px 16px color-mix(in srgb, var(--gh-accent-solid) 9%, transparent);
	}
}

@media (max-width: 640px) {
	.gh-dash-layout {
		padding-block: 26px 64px;
	}

	.gh-dash-hi {
		padding: 20px;
	}

	.gh-dash-hi::after {
		display: none;
	}

	.gh-dash-side a {
		min-height: 42px;
		padding: 9px 11px;
	}

	.gh-widget {
		padding: 18px;
	}
}

/* ---------- مدیریت نمونه‌کارها (داشبورد) ---------- */
/* ---------- بوکمارک‌ها — تب هر نوع محتوا + نمایش کارتی/لیستی ---------- */
.gh-bookmarks-mgr { display: flex; flex-direction: column; gap: 20px; }
.gh-bm-view { display: inline-flex; border: 1px solid var(--gh-border-default); border-radius: var(--gh-r-sm); overflow: hidden; flex: none; }
.gh-bm-view button { display: grid; place-items: center; width: 38px; height: 38px; border: none; background: var(--gh-bg-surface); color: var(--gh-text-tertiary); cursor: pointer; }
.gh-bm-view button + button { border-inline-start: 1px solid var(--gh-border-default); }
.gh-bm-view button svg { width: 17px; height: 17px; }
.gh-bm-view button.is-on { background: var(--gh-accent-surface); color: var(--gh-accent-text); }

.gh-bm-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.gh-bm-card {
	position: relative; display: flex; flex-direction: column;
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default); border-radius: var(--gh-r-lg); overflow: hidden;
	transition: opacity var(--gh-dur-base) var(--gh-ease-out), transform var(--gh-dur-base) var(--gh-ease-out);
}
.gh-bm-card.is-removing { opacity: 0; transform: scale(.95); }
.gh-bm-media { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--gh-bg-sunken); }
.gh-bm-media img { width: 100%; height: 100%; object-fit: cover; }
.gh-bm-media.is-gradient { display: grid; place-items: center; color: var(--gh-text-tertiary); }
.gh-bm-media .gh-card-cover-fallback { font-size: 30px; font-weight: 800; color: var(--gh-text-tertiary); }
.gh-bm-strip { display: flex; width: 100%; height: 100%; }
.gh-bm-strip span { flex: 1; }
.gh-bm-body { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; }
.gh-bm-title { font-size: 14px; font-weight: 700; color: var(--gh-text-primary); text-decoration: none; }
.gh-bm-title:hover { color: var(--gh-accent-text); }
.gh-bm-meta { font-size: 12px; color: var(--gh-text-tertiary); }
.gh-bm-card .gh-bookmark-btn { position: absolute; top: 10px; inset-inline-end: 10px; z-index: 2; background: color-mix(in srgb, var(--gh-white) 94%, transparent); border: none; color: var(--gh-accent-solid); }
.gh-bm-card.is-missing { flex-direction: row; align-items: center; }
.gh-bm-card.is-missing .gh-bm-media { aspect-ratio: unset; width: 64px; height: 64px; flex: none; }
.gh-bm-card.is-missing .gh-bm-body span { color: var(--gh-text-tertiary); font-size: 12px; }

.gh-bm-items.is-list { display: flex; flex-direction: column; gap: 8px; }
.gh-bm-items.is-list .gh-bm-card { flex-direction: row; align-items: center; }
.gh-bm-items.is-list .gh-bm-media { width: 64px; height: 64px; aspect-ratio: unset; flex: none; border-radius: var(--gh-r-sm); }
.gh-bm-items.is-list .gh-bm-body { padding: 8px 14px; flex: 1; min-width: 0; }
.gh-bm-items.is-list .gh-bookmark-btn { position: static; margin-inline-end: 14px; background: none; }

.gh-portfolio-mgr { display: flex; flex-direction: column; gap: 20px; }
.gh-pf-head-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.gh-pf-head-row h2 { font-size: 19px; font-weight: 800; margin: 0 0 4px; }
.gh-pf-public-box { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.gh-pf-list { display: flex; flex-direction: column; gap: 10px; }
.gh-pf-row {
	display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default);
	border-radius: var(--gh-radius-control); padding: 12px 16px;
}
.gh-pf-thumb {
	width: 52px; height: 52px; border-radius: var(--gh-r-sm); overflow: hidden; flex: none;
	background: var(--gh-bg-sunken); display: grid; place-items: center; color: var(--gh-text-tertiary);
}
.gh-pf-thumb img { width: 100%; height: 100%; object-fit: cover; }
.gh-pf-thumb svg { width: 20px; height: 20px; }
.gh-pf-info { flex: 1; min-width: 0; }
.gh-pf-info b { font-size: 14px; font-weight: 800; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gh-pfc-meta { font-size: 12px; color: var(--gh-text-tertiary); }
.gh-pf-status { font-weight: 700; }
.gh-pf-status.is-publish { color: var(--gh-success-text); }
.gh-pf-status.is-pending { color: var(--gh-warning-text); }
.gh-pf-status.is-draft { color: var(--gh-text-tertiary); }
.gh-pf-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.gh-pf-actions form { display: flex !important; margin: 0; }
.gh-pf-actions .gh-btn-icon {
	color: var(--gh-text-secondary);
}
.gh-pf-actions .gh-btn-icon > svg {
	display: block;
	width: 18px;
	height: 18px;
	min-width: 18px;
	min-height: 18px;
	stroke: currentColor;
}
.gh-pf-actions .gh-btn-danger {
	color: var(--gh-danger-text);
}
.gh-pf-empty { padding: 32px; }
.gh-pf-form { display: flex; flex-direction: column; gap: 16px; }
.gh-pf-form h2 { font-size: 18px; font-weight: 800; margin: 0; }
.gh-pf-modal { width: min(560px, calc(100vw - 40px)); max-height: min(88vh, 780px); overflow-y: auto; }
.gh-pf-form textarea { border-radius: var(--gh-r-sm); border: 1.5px solid var(--gh-border-default); background: var(--gh-bg-surface); color: var(--gh-text-primary); font: inherit; font-size: 14px; padding: 12px 14px; resize: vertical; min-height: 76px; }
.gh-pf-form textarea:focus { outline: none; border-color: var(--gh-accent-solid); box-shadow: var(--gh-focus-ring); }
.gh-pf-gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; margin-block-start: 10px; }
.gh-pf-thumb-item {
	position: relative; aspect-ratio: 4 / 3; border-radius: var(--gh-r-sm); overflow: hidden;
	border: 2px solid transparent; cursor: pointer;
	transition: border-color var(--gh-dur-fast) var(--gh-ease-out);
}
.gh-pf-thumb-item:hover { border-color: var(--gh-border-strong); }
.gh-pf-thumb-item:focus-visible { outline: 2px solid var(--gh-accent-solid); outline-offset: 2px; }
.gh-pf-thumb-item.is-cover { border-color: var(--gh-accent-solid); }
.gh-pf-thumb-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gh-pf-cover-badge {
	position: absolute; bottom: 4px; inset-inline-start: 4px; background: var(--gh-accent-solid); color: var(--gh-accent-on-solid);
	font-size: 10px; font-weight: 800; padding: 4px 7px; border-radius: var(--gh-r-full);
}
.gh-pf-thumb-remove {
	position: absolute; top: 4px; inset-inline-end: 4px; width: 20px; height: 20px; border-radius: 50%;
	background: color-mix(in srgb, var(--gh-black) 55%, transparent); color: var(--gh-white); border: none; font-size: 14px; line-height: 1; cursor: pointer;
	display: grid; place-items: center;
}
.gh-pf-thumb-remove:hover { background: color-mix(in srgb, var(--gh-black) 80%, transparent); }
.gh-check-inline { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--gh-text-secondary); margin-block-start: 8px; cursor: pointer; }
.gh-check-inline input { width: 16px; height: 16px; accent-color: var(--gh-accent-solid); }

/* ---------- تیکت‌های پشتیبانی ---------- */
.gh-tickets-page { display: flex; flex-direction: column; gap: 20px; }
.gh-tickets-page > h2 { font-size: 19px; font-weight: 800; margin: 0; }
.gh-faq-gate { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 12px; }
.gh-faq-gate .gh-whead { flex: 1; min-width: 200px; }
.gh-tickets-list { display: flex; flex-direction: column; gap: 14px; }
.gh-ticket-card { background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default); border-radius: var(--gh-r-md); padding: 16px 18px; scroll-margin-top: 90px; }
.gh-ticket-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-block-end: 8px; }
.gh-ticket-head b { font-size: 14.5px; font-weight: 800; }
.gh-ticket-msg { font-size: 13.5px; color: var(--gh-text-secondary); margin: 0 0 10px; }
.gh-imp-urgent { background: var(--gh-danger-surface); color: var(--gh-danger-text); }
.gh-imp-high { background: var(--gh-warning-surface); color: var(--gh-warning-text); }
.gh-imp-normal, .gh-imp-low { background: var(--gh-bg-sunken); color: var(--gh-text-tertiary); }
.gh-status-open { background: var(--gh-info-surface); color: var(--gh-info-text); }
.gh-status-answered { background: var(--gh-success-surface); color: var(--gh-success-text); }
.gh-status-closed { background: var(--gh-bg-sunken); color: var(--gh-text-tertiary); }
.gh-ticket-thread { display: flex; flex-direction: column; gap: 8px; margin-block-end: 10px; }
.gh-ticket-reply { font-size: 13px; background: var(--gh-bg-sunken); border-radius: var(--gh-r-sm); padding: 9px 13px; }
.gh-ticket-reply b { display: block; font-size: 12px; font-weight: 700; margin-block-end: 3px; color: var(--gh-text-tertiary); }
.gh-ticket-reply.is-admin { background: var(--gh-accent-surface); }
.gh-ticket-reply.is-admin b { color: var(--gh-accent-text); }
.gh-ticket-reply-form { display: flex; gap: 8px; align-items: flex-end; }
.gh-ticket-reply-form textarea {
	flex: 1; border-radius: var(--gh-r-sm); border: 1.5px solid var(--gh-border-default);
	background: var(--gh-bg-surface); color: var(--gh-text-primary); font: inherit; font-size: 13px; padding: 10px 12px; resize: vertical;
}
.gh-ticket-form { display: flex; flex-direction: column; gap: 16px; }
.gh-ticket-form h3 { font-size: 15px; font-weight: 800; margin: 0; }
.gh-ticket-form textarea {
	border-radius: var(--gh-r-sm); border: 1.5px solid var(--gh-border-default);
	background: var(--gh-bg-surface); color: var(--gh-text-primary); font: inherit; font-size: 14px; padding: 10px 14px; resize: vertical; width: 100%;
}

/* ---------- صندوق پشتیبانی ادمین (چت‌روم) ---------- */
.gh-inbox-title { font-size: 20px; font-weight: 900; margin: 0 0 14px; }
.gh-inbox-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-block-end: 16px; }
.gh-inbox-tabs .gh-chip { display: inline-flex; align-items: center; gap: 7px; }
.gh-inbox-layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 16px; align-items: start; }
.gh-inbox-list {
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default); border-radius: var(--gh-r-lg);
	display: flex; flex-direction: column; max-height: 70vh; overflow-y: auto;
}
.gh-inbox-item {
	position: relative; display: flex; flex-direction: column; gap: 4px; padding: 13px 15px; text-decoration: none; color: inherit;
	border-block-end: 1px solid var(--gh-border-subtle); transition: background var(--gh-dur-fast) var(--gh-ease-out);
}
.gh-inbox-item:hover { background: var(--gh-bg-sunken); }
/* همان الگوی نوار تأکید منطقیِ .gh-notif-item.is-new */
.gh-inbox-item.is-on { background: var(--gh-accent-surface); }
.gh-inbox-item.is-on::before {
	content: ""; position: absolute; inset-block: 10px; inset-inline-start: 0;
	width: 3px; border-radius: var(--gh-r-full); background: var(--gh-accent-solid);
}
.gh-inbox-item b { font-size: 13.5px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gh-inbox-item-meta { font-size: 11.5px; color: var(--gh-text-tertiary); display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.gh-imp-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--gh-danger-solid); display: inline-block; }
.gh-inbox-thread {
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default); border-radius: var(--gh-r-lg);
	padding: 18px; display: flex; flex-direction: column; gap: 14px;
}
.gh-inbox-thread-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-block-end: 1px dashed var(--gh-border-default); padding-block-end: 12px; }
.gh-inbox-thread-head b { display: block; font-size: 15px; font-weight: 800; }
.gh-inbox-thread-head span { font-size: 12px; color: var(--gh-text-tertiary); }
.gh-chat { display: flex; flex-direction: column; gap: 10px; max-height: 52vh; overflow-y: auto; padding-inline-end: 4px; }
.gh-chat-b {
	max-width: 78%; border-radius: var(--gh-r-md); padding: 10px 14px; font-size: 13.5px;
	display: flex; flex-direction: column; gap: 6px;
}
.gh-chat-b p { margin: 0; white-space: pre-line; }
.gh-chat-b.is-user { align-self: flex-start; background: var(--gh-bg-sunken); border-start-start-radius: 4px; }
.gh-chat-b.is-admin { align-self: flex-end; background: var(--gh-accent-surface); border-start-end-radius: 4px; }
.gh-chat-author { font-size: 11px; font-weight: 800; color: var(--gh-text-tertiary); }
.gh-chat-b.is-admin .gh-chat-author { color: var(--gh-accent-text); }
.gh-chat-b time { font-size: 10.5px; color: var(--gh-text-tertiary); }
.gh-chat-img img { max-width: 220px; border-radius: var(--gh-r-sm); display: block; }
.gh-chat-audio { width: 230px; max-width: 100%; }
.gh-inbox-reply { display: flex; flex-direction: column; gap: 10px; }
.gh-inbox-reply textarea {
	width: 100%; border-radius: var(--gh-r-sm); border: 1.5px solid var(--gh-border-default);
	background: var(--gh-bg-surface); color: var(--gh-text-primary); font: inherit; font-size: 13.5px; padding: 10px 13px; resize: vertical;
}
.gh-inbox-reply-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.gh-file-label { cursor: pointer; }
.gh-file-label span { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
[data-gh-rec].is-rec { background: var(--gh-danger-surface); color: var(--gh-danger-text); border-color: var(--gh-danger-text); }
@media (max-width: 900px) { .gh-inbox-layout { grid-template-columns: 1fr; } .gh-inbox-list { max-height: 300px; } }

/* ---------- لیست تیکت‌ها (v1.2): ردیف جمع‌شده با سریال — کلیک = باز شدن گفتگو ---------- */
.gh-ticket-row { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; user-select: none; }
.gh-ticket-row::-webkit-details-marker { display: none; }
.gh-ticket-code {
	flex: none; font-size: 11.5px; font-weight: 800; letter-spacing: .04em;
	direction: ltr; unicode-bidi: isolate; font-variant-numeric: tabular-nums;
	background: var(--gh-bg-sunken); border: 1px dashed var(--gh-border-strong);
	border-radius: var(--gh-r-xs); padding: 3px 9px; color: var(--gh-text-secondary);
}
.gh-ticket-subject { flex: 1; min-width: 150px; font-size: 14px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gh-ticket-date { font-size: 11.5px; color: var(--gh-text-tertiary); font-variant-numeric: tabular-nums; }
.gh-ticket-chev { width: 16px; height: 16px; flex: none; color: var(--gh-text-tertiary); transition: transform var(--gh-dur-fast) var(--gh-ease-out); }
.gh-ticket-card[open] .gh-ticket-chev { transform: rotate(180deg); }
.gh-ticket-body { border-block-start: 1px dashed var(--gh-border-subtle); margin-block-start: 12px; padding-block-start: 12px; }
.gh-ticket-body .gh-ticket-msg { margin-block-start: 0; }

/* ---------- دوره‌های من ---------- */
.gh-mycourses { display: flex; flex-direction: column; gap: 20px; }
.gh-start-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.gh-start-steps li { display: flex; flex-direction: column; gap: 7px; border: 1.5px dashed var(--gh-border-default); border-radius: var(--gh-r-md); padding: 14px 16px; }
.gh-start-num {
	font-family: ui-monospace, 'SF Mono', 'JetBrains Mono', Menlo, Consolas, monospace;
	font-size: 22px; font-weight: 700; line-height: 1; color: var(--gh-accent-text);
	direction: ltr; unicode-bidi: isolate; letter-spacing: .04em; font-variant-numeric: tabular-nums;
}
.gh-start-steps b { font-size: 13.5px; font-weight: 800; }
.gh-start-steps li > span:not(.gh-start-num) { font-size: 12.5px; color: var(--gh-text-secondary); line-height: 1.85; }
.gh-start-steps .gh-btn { margin-block-start: auto; align-self: flex-start; }
@media (max-width: 760px) { .gh-start-steps { grid-template-columns: 1fr; } }

.gh-mycourse-list { display: flex; flex-direction: column; gap: 12px; }
.gh-mycourse {
	display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
	background: var(--gh-bg-raised); border: 1px solid var(--gh-border-default);
	border-radius: var(--gh-radius-group); padding: 16px 18px;
}
.gh-mycourse-dot {
	width: 46px; height: 46px; border-radius: var(--gh-r-md); flex: none;
	display: grid; place-items: center; font-size: 13px; font-weight: 800; letter-spacing: .2px;
	color: color-mix(in srgb, var(--gh-white) 95%, transparent);
}
.gh-mycourse-main { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 8px; }
.gh-mycourse-top { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.gh-mycourse-top b { font-size: 15px; font-weight: 800; }
.gh-mycourse-meta { font-size: 12px; color: var(--gh-text-tertiary); font-variant-numeric: tabular-nums; }
.gh-mycourse .gh-cl-mini { max-width: 340px; }
.gh-license-inline { font-size: 12.5px; padding: 8px 12px; align-self: flex-start; border: none; font-family: inherit; color: var(--gh-text-primary); }
.gh-mycourse-actions { display: flex; gap: 8px; flex: none; flex-wrap: wrap; align-items: center; }
@media (max-width: 640px) { .gh-mycourse-actions { flex-basis: 100%; } .gh-mycourse-actions .gh-btn { flex: 1; } }

/* داشبورد نیز از همان شبکه‌ی محتوای اصلی + سایدبار و ریتم کارت‌های سایت استفاده می‌کند. */
.gh-dash-layout {
	grid-template-columns: var(--gh-layout-sidebar-sm, 240px) minmax(0, 1fr);
	gap: var(--gh-layout-column-gap, 40px);
	padding-block: var(--gh-page-pad-start, 40px) var(--gh-page-pad-end, 80px);
}

.gh-bento {
	gap: var(--gh-grid-gap, 24px);
}

.gh-bookmarks-mgr,
.gh-portfolio-mgr,
.gh-mycourses,
.gh-notif-page,
.gh-profile-form {
	gap: var(--gh-flow-gap, 32px);
}

@media (max-width: 900px) {
	.gh-dash-layout {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--gh-flow-gap, 24px);
		padding-block: var(--gh-page-pad-start, 32px) var(--gh-page-pad-end, 64px);
	}
}

/* کف خوانایی متادیتا و زمان‌های داشبورد. */
.gh-w-quote cite,
.gh-gp-info > span,
.gh-gp-info span span,
.gh-cl-pct,
.gh-reco-info span,
.gh-w-notifs-row time,
.gh-notif-meta,
.gh-notif-cat,
.gh-seat-row b,
.gh-inbox-item-meta,
.gh-chat-author,
.gh-chat-b time,
.gh-ticket-date {
	font-size: var(--gh-font-micro, 12px);
}

/* شناسه‌ی کاربر در هدر داشبورد:
   شعاع فرزند = شعاع قاب - فاصله‌ی داخلی، تا گوشه‌های آیتم اول و آخر با قاب موازی باشند. */
.gh-dash-id {
	--gh-dash-id-padding: 6px;
	--gh-dash-id-radius: var(--gh-radius-group);
	gap: 8px;
	padding: var(--gh-dash-id-padding);
	border-radius: var(--gh-dash-id-radius);
}

.gh-dash-id .gh-avatar,
.gh-dash-id .gh-social-ic {
	width: 44px;
	height: 44px;
	border-radius: max(0px, calc(var(--gh-dash-id-radius) - var(--gh-dash-id-padding)));
}