/*
Theme Name:   Cosmos Child
Description:  القالب الفرعي لمركز كوسموس للتدريب — الهوية البصرية، خط Tajawal المحلي، RTL.
Template:     astra
Version:      0.25.2
Author:       Cosmos Training Center
Text Domain:  cosmos-child
Domain Path:  /languages
Requires PHP: 8.2
*/

/* ==========================================================================
   Tajawal — مستضاف محلياً (AGENTS.md قاعدة 6). تحميله من CDN كان يحجب رسم
   الصفحة حين يتعثّر الرابط الدولي. نفس ملفات جوجل، بنفس تقسيم unicode-range.
   ========================================================================== */
@font-face {
	font-family: 'Tajawal';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('fonts/tajawal-400-arabic.woff2') format('woff2');
	unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
	font-family: 'Tajawal';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('fonts/tajawal-400-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Tajawal';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('fonts/tajawal-500-arabic.woff2') format('woff2');
	unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
	font-family: 'Tajawal';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('fonts/tajawal-500-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Tajawal';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('fonts/tajawal-700-arabic.woff2') format('woff2');
	unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
	font-family: 'Tajawal';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('fonts/tajawal-700-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ==========================================================================
   Design tokens — الألوان نفسها في inc/cosmos-tokens.php (المصدر الوحيد،
   AGENTS.md §3)، تُطبع هناك كمتغيرات CSS على :root، وتُحوَّل إلى قيم فعلية
   في رسائل البريد لأن عملاء البريد لا يدعمون المتغيرات. هنا ما ليس لوناً فقط.
   ========================================================================== */
:root {
	--radius-sm: 8px;
	--radius:    12px;
	--font: 'Tajawal', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ==========================================================================
   الأساس
   ========================================================================== */
body,
button,
input,
select,
textarea {
	font-family: var(--font);
}

body {
	background-color: var(--pg);
	color: var(--ink);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font);
	color: var(--bld);
}

a {
	color: var(--bl);
}

.cosmos-badge {
	display: inline-block;
	padding-block: 2px;
	padding-inline: 10px;
	border-radius: var(--radius-sm);
	font-size: 0.8125rem;
	font-weight: 500;
	line-height: 1.6;
}
.cosmos-badge--free { background: var(--badge-free-bg); color: var(--badge-free-ink); }
.cosmos-badge--paid { background: var(--badge-paid-bg); color: var(--badge-paid-ink); }
.cosmos-badge--live { background: var(--badge-live-bg); color: var(--badge-live-ink); }

/* ==========================================================================
   ربط Astra و Tutor بالتوكنز — لوحة Astra الافتراضية (#F0F5FA وأزرق #046bd2)
   كانت تغطي --pg في الحاويات. القيم من التوكنز وحدها.
   ========================================================================== */
:root {
	--ast-global-color-0: var(--bl);
	--ast-global-color-1: var(--bld);
	--ast-global-color-2: var(--bld);
	--ast-global-color-3: var(--ink);
	--ast-global-color-4: var(--sf);
	--ast-global-color-5: var(--pg);
	--ast-global-color-6: var(--ink);
	--ast-global-color-7: var(--ln);
	--ast-global-color-8: var(--ink);

	--tutor-color-primary: var(--bl);
	--tutor-color-primary-hover: var(--bld);
	--tutor-body-color: var(--ink);
	--tutor-border-color: var(--ln);

	--radius-btn: 9px;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
}

a:hover,
a:focus {
	color: var(--bld);
}

/* ==========================================================================
   الأزرار
   ========================================================================== */
.ast-button,
.wp-block-button__link,
button[type="submit"],
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit,
.wc-block-components-button,
.tutor-btn-primary {
	background-color: var(--bl);
	color: var(--sf);
	border: none;
	border-radius: var(--radius-btn);
	font-weight: 700;
}

.ast-button:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.wc-block-components-button:hover,
.tutor-btn-primary:hover {
	background-color: var(--bld);
	color: var(--sf);
}

/* الزر الثانوي — إطار تركواز، مثل «ابدأ مجاناً» */
.cosmos-btn-secondary {
	background: var(--sf);
	color: var(--tl);
	border: 1px solid var(--tl);
	border-radius: var(--radius-btn);
	font-weight: 700;
}

.cosmos-btn-secondary:hover {
	background: var(--badge-free-bg);
	color: var(--badge-free-ink);
}

/* ==========================================================================
   البطاقات
   ========================================================================== */
.cosmos-card,
.tutor-course-card,
.tutor-card,
.woocommerce ul.products li.product {
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: var(--radius);
	overflow: hidden;
}

.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post {
	background: var(--sf);
}

.cosmos-icon {
	display: inline-block;
	flex-shrink: 0;
	vertical-align: middle;
}

/* ==========================================================================
   الهيدر — هيدر Astra بهوية كوسموس
   ========================================================================== */
#masthead {
	position: sticky;
	inset-block-start: 0;
	z-index: 999;
	background: var(--sf);
}

.admin-bar #masthead {
	inset-block-start: var(--wp-admin--admin-bar--height, 32px);
}

.ast-primary-header-bar,
.main-header-bar {
	background: var(--sf);
	border-block-end: 0.5px solid var(--ln);
}

/* Astra يضع مسافة اللوغو على اليمين (جهة LTR) فيلتصق بالاسم في العربية */
.ast-site-identity .site-logo-img {
	padding-inline-start: 0;
	padding-inline-end: 12px;
}

/* اللوغو: دائري، 48px (44 تابلت، 40 جوال) */
.site-logo-img img,
.custom-logo-link img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
}

.main-header-menu .menu-link {
	color: var(--ink);
	font-size: 15px;
}

.main-header-menu .menu-item:hover > .menu-link,
.main-header-menu .current-menu-item > .menu-link {
	color: var(--bl);
}

.main-header-menu .current-menu-item > .menu-link {
	font-weight: 700;
}

/* أزرار الحساب للزائر: دخول (إطار) + حساب جديد (ممتلئ) */
.cosmos-hbtn-item {
	display: flex;
	align-items: center;
}

/* زر اللغة EN / ع في آخر القائمة (م5.17، ق-057). */
.cosmos-lang-item {
	display: flex;
	align-items: center;
}

.cosmos-lang,
.main-header-menu .cosmos-lang {
	display: inline-grid;
	place-items: center;
	min-width: 38px;
	height: 38px;
	padding-inline: 8px;
	margin-inline-start: 6px;
	border: 1px solid var(--ln);
	border-radius: 999px;
	background: var(--sf);
	color: var(--bld);
	font-size: 13px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: 0.02em;
}

.cosmos-lang:hover,
.cosmos-lang:focus {
	border-color: var(--bl);
	color: var(--bl);
}

.cosmos-hbtn,
.main-header-menu .cosmos-hbtn {
	display: inline-flex;
	align-items: center;
	border-radius: var(--radius-sm);
	padding-block: 8px;
	padding-inline: 18px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.6;
	text-decoration: none;
	white-space: nowrap;
	margin-inline-start: 8px;
}

.cosmos-hbtn--login {
	color: var(--bl);
	border: 1px solid var(--bl);
	background: transparent;
}

.cosmos-hbtn--login:hover,
.cosmos-hbtn--login:focus {
	background: var(--tint);
	color: var(--bl);
}

.cosmos-hbtn--register,
.cosmos-hbtn--register:focus {
	background: var(--bl);
	color: var(--sf);
	border: 1px solid var(--bl);
}

.cosmos-hbtn--register:hover {
	background: var(--bld);
	border-color: var(--bld);
	color: var(--sf);
}

/* المستخدم المسجّل: دائرة الصورة + قائمة منسدلة */
.cosmos-user-item {
	position: relative;
	display: flex;
	align-items: center;
}

.cosmos-user-btn,
.cosmos-user-btn:hover,
.cosmos-user-btn:focus {
	width: 38px;
	height: 38px;
	padding: 0;
	margin-inline-start: 8px;
	border-radius: 50%;
	border: 1px solid var(--ln);
	background: var(--tint);
	color: var(--bl);
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	cursor: pointer;
}

.cosmos-user-btn:hover,
.cosmos-user-btn:focus-visible {
	border-color: var(--bl);
}

.cosmos-user-btn img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.cosmos-user-menu {
	position: absolute;
	inset-block-start: calc(100% + 8px);
	inset-inline-end: 0;
	z-index: 1200;
	display: none;
	min-width: 180px;
	padding: 6px;
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: 10px;
	box-shadow: 0 6px 20px var(--shadow);
}

.cosmos-user-item.open .cosmos-user-menu {
	display: block;
}

.cosmos-user-menu a {
	display: block;
	padding-block: 9px;
	padding-inline: 12px;
	border-radius: 7px;
	font-size: 14px;
	color: var(--ink);
	text-decoration: none;
}

.cosmos-user-menu a:hover {
	background: var(--tint);
	color: var(--bl);
}

/* قائمة الجوال: الأزرار مدمجة، والقائمة المنسدلة قائمة ثابتة */
.ast-mobile-header-content .cosmos-hbtn-item,
.ast-mobile-popup-content .cosmos-hbtn-item,
.ast-mobile-header-content .cosmos-user-item,
.ast-mobile-popup-content .cosmos-user-item {
	display: block;
	padding-block: 8px;
	padding-inline: 20px;
}

.ast-mobile-header-content .cosmos-hbtn,
.ast-mobile-popup-content .cosmos-hbtn {
	margin-inline-start: 0;
}

.ast-mobile-header-content .cosmos-user-btn,
.ast-mobile-popup-content .cosmos-user-btn {
	display: none;
}

.ast-mobile-header-content .cosmos-user-menu,
.ast-mobile-popup-content .cosmos-user-menu {
	position: static;
	display: block;
	padding: 0;
	border: none;
	box-shadow: none;
}

@media (max-width: 921px) {
	.site-logo-img img,
	.custom-logo-link img {
		width: 44px;
		height: 44px;
	}
}

@media (max-width: 544px) {
	.site-logo-img img,
	.custom-logo-link img {
		width: 40px;
		height: 40px;
	}
}

/* ==========================================================================
   الفوتر
   ========================================================================== */
.cosmos-footer {
	background: var(--ft-bg);
	color: var(--ft-ink);
	padding-block: 40px 22px;
	padding-inline: 24px;
}

.cosmos-footer__inner {
	max-width: 1200px;
	margin-inline: auto;
}

.cosmos-footer__cols {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	justify-content: space-between;
}

.cosmos-footer__brand {
	max-width: 300px;
}

.cosmos-footer__brandrow {
	display: flex;
	align-items: center;
	gap: 10px;
}

.cosmos-footer__brandrow img {
	border-radius: 50%;
}

.cosmos-footer__wm {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--sf);
}

.cosmos-footer__wm b {
	color: var(--ft-acc);
}

.cosmos-footer__brand p {
	margin-block: 12px 0;
	font-size: 13px;
	line-height: 1.9;
	color: var(--ft-ink);
}

.cosmos-footer__col h4 {
	margin-block: 0 12px;
	font-size: 15px;
	font-weight: 700;
	color: var(--sf);
}

.cosmos-footer__col a {
	display: flex;
	align-items: center;
	gap: 7px;
	margin-block-end: 9px;
	font-size: 13px;
	color: var(--ft-ink);
	text-decoration: none;
}

.cosmos-footer__col a:hover,
.cosmos-footer__col a:focus {
	color: var(--sf);
}

.cosmos-footer__soc {
	display: flex;
	gap: 12px;
	margin-block-start: 8px;
}

.cosmos-footer__soc a {
	display: inline-flex;
	margin: 0;
	color: var(--ft-ink);
}

.cosmos-footer__soc a:hover,
.cosmos-footer__soc a:focus {
	color: var(--ft-acc);
}

.cosmos-footer__cr {
	margin-block-start: 28px;
	padding-block-start: 16px;
	border-block-start: 0.5px solid var(--ft-ln);
	font-size: 12px;
	text-align: center;
	color: var(--ft-mut);
}

/* ==========================================================================
   زر رابط عام
   ========================================================================== */
.cosmos-btn,
.cosmos-btn:visited {
	display: inline-block;
	padding-block: 10px;
	padding-inline: 22px;
	border-radius: var(--radius-btn);
	background: var(--bl);
	color: var(--sf);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
}

.cosmos-btn:hover,
.cosmos-btn:focus {
	background: var(--bld);
	color: var(--sf);
}

/* ==========================================================================
   الصفحة الرئيسية — أقسام منقولة من الموقع القديم (ق-022)
   كل قسم بعرض الشاشة، ومحتواه بعرض 1200px كحد أقصى.
   ========================================================================== */
.cosmos-sec {
	padding-block: 56px;
	padding-inline: 24px;
}

.cosmos-sec > *,
.cosmos-hero > *,
.cosmos-stats {
	max-width: 1200px;
	margin-inline: auto;
}

.cosmos-sec--white {
	background: var(--sf);
	border-block-start: 0.5px solid var(--ln);
}

/* Astra: قالب «page-builder» يجعل الخلفية بيضاء، ويحشو المقال 20px وكل مجموعة بلوكات
   بحشوه الافتراضي — الأقسام تضبط حشوها بنفسها. */
.cosmos-sections.ast-page-builder-template {
	background-color: var(--pg);
}

/* #primary: قاعدة Astra لحشو المقال على الجوال أخصّ من الأصناف وحدها */
.cosmos-sections #primary article.page {
	margin: 0;
	padding: 0;
}

.cosmos-sections .entry-content > * {
	margin-block: 0;
}

.cosmos-sections .entry-content > .wp-block-group.cosmos-sec,
.cosmos-sections .entry-content > .wp-block-group.cosmos-hero {
	padding-block: 56px;
	padding-inline: 24px;
}

.cosmos-sections .entry-content > .wp-block-group.cosmos-stats {
	padding: 0;
}

.cosmos-h2 {
	margin-block: 0 8px;
	font-size: 28px;
	font-weight: 700;
	text-align: center;
	color: var(--bld);
}

.cosmos-lead {
	margin-block: 0 32px;
	font-size: 15px;
	text-align: center;
	color: var(--mut);
}

.cosmos-sec__more {
	margin-block-start: 24px;
	text-align: center;
}

/* الهيرو */
.cosmos-hero {
	padding-block: 56px;
	padding-inline: 24px;
}

.cosmos-hero__in {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 36px;
}

.cosmos-hero__txt {
	flex: 1.4;
	min-width: 280px;
}

.cosmos-hero__txt h1 {
	margin-block: 0 16px;
	font-size: 38px;
	line-height: 1.55;
	color: var(--bld);
}

.cosmos-hero__txt h1 em {
	font-style: normal;
	color: var(--tl);
}

.cosmos-hero__txt > p {
	margin-block: 0 22px;
	font-size: 17px;
	line-height: 1.9;
}

.cosmos-hero .wp-block-buttons {
	gap: 10px;
}

.cosmos-trust {
	margin-block-start: 16px;
	font-size: 14px;
	color: var(--mut);
}

.cosmos-trust b {
	color: var(--bld);
}

.cosmos-hero__viz {
	flex: 1;
	min-width: 260px;
	aspect-ratio: 4 / 3;
	border-radius: 16px;
	overflow: hidden;
	background: var(--tint);
}

.cosmos-hero__viz img,
.cosmos-about__img img,
.cosmos-trk__img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* الزر الثانوي في بلوك الأزرار: إطار تركواز */
.cosmos-b2 .wp-block-button__link {
	background: var(--sf);
	color: var(--tl);
	border: 1px solid var(--tl);
}

.cosmos-b2 .wp-block-button__link:hover {
	background: var(--badge-free-bg);
	color: var(--badge-free-ink);
}

/* شريط الأرقام */
.cosmos-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1px;
	max-width: none;
	background: var(--ln);
	border-block: 0.5px solid var(--ln);
}

.cosmos-stat {
	padding-block: 22px;
	padding-inline: 10px;
	text-align: center;
	background: var(--sf);
}

.cosmos-stat .num {
	margin: 0;
	font-size: 28px;
	font-weight: 700;
	color: var(--bld);
}

.cosmos-stat .lbl {
	margin: 0;
	font-size: 13px;
	color: var(--mut);
}

/* من نحن */
.cosmos-about {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 28px;
}

.cosmos-about__img {
	flex: 1;
	min-width: 250px;
	max-width: 420px;
	aspect-ratio: 1 / 1;
	border-radius: 14px;
	overflow: hidden;
	background: var(--tint);
}

.cosmos-about__txt {
	flex: 1.4;
	min-width: 280px;
}

.cosmos-kick {
	margin-block: 0 8px;
	font-size: 14px;
	font-weight: 700;
	color: var(--tl);
}

.cosmos-quote {
	margin-block: 0 14px;
	padding-inline-start: 14px;
	border-inline-start: 3px solid var(--tl);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.7;
	color: var(--bld);
}

.cosmos-about__txt > p:not(.cosmos-kick):not(.cosmos-quote) {
	margin-block: 0 18px;
	font-size: 15px;
	line-height: 1.9;
}

/* الشبكات */
.cosmos-g4,
.cosmos-g3 {
	display: grid;
	gap: 16px;
}

.cosmos-g4 {
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.cosmos-g3 {
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

/* المسارات: خمسة في صف على الشاشة الواسعة */
.cosmos-g5 {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 16px;
}

/* مزايا «لماذا كوسموس» */
.cosmos-vp {
	padding: 24px;
	text-align: center;
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: var(--radius);
}

.cosmos-ic {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	margin-block: 0 12px;
	margin-inline: auto;
	border-radius: 12px;
	background: var(--tint);
	color: var(--bl);
}

.cosmos-vp--usp .cosmos-ic {
	background: var(--badge-free-bg);
	color: var(--tl);
}

.cosmos-vp h3 {
	margin-block: 0 6px;
	font-size: 16px;
}

.cosmos-vp p {
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
	color: var(--mut);
}

/* بطاقات المسارات */
.cosmos-trk {
	overflow: hidden;
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: var(--radius);
}

.cosmos-trk__img {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 160px;
	overflow: hidden;
	background: var(--tint);
	color: var(--bl);
}

.cosmos-trk__bd {
	padding-block: 18px 22px;
	padding-inline: 24px;
}

.cosmos-trk h3 {
	margin-block: 0 6px;
	font-size: 17px;
}

.cosmos-trk p {
	margin-block: 0 10px;
	font-size: 13px;
	color: var(--mut);
}

.cosmos-trk a {
	font-size: 14px;
	font-weight: 500;
}

/* الخطوات */
.cosmos-steps {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 16px;
}

.cosmos-step {
	padding: 8px;
	text-align: center;
}

.cosmos-step .n {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-block: 0 12px;
	margin-inline: auto;
	border-radius: 50%;
	background: var(--bl);
	color: var(--sf);
	font-size: 18px;
	font-weight: 700;
}

.cosmos-step h3 {
	margin-block: 0 4px;
	font-size: 16px;
}

.cosmos-step p {
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
	color: var(--mut);
}

/* بانر «اسأل الأستاذ» */
.cosmos-askband {
	padding-block: 40px;
	padding-inline: 28px;
	border-radius: 14px;
	text-align: center;
	background: var(--bld);
	color: var(--sf);
}

.cosmos-ask-ic {
	color: var(--band-acc);
}

.cosmos-askband h3 {
	margin-block: 10px 8px;
	font-size: 24px;
	color: var(--sf);
}

.cosmos-askband p {
	margin-block: 0 20px;
	font-size: 15px;
	line-height: 1.9;
	color: var(--band-ink);
}

.cosmos-askband .wp-block-button__link {
	background: var(--tl);
}

.cosmos-askband .wp-block-button__link:hover {
	background: var(--tl-d);
}

/* التقييمات */
.cosmos-testi {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 16px;
}

.cosmos-tc {
	padding: 22px;
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: var(--radius);
}

.cosmos-stars {
	margin-block: 0 10px;
	font-size: 15px;
	color: var(--star);
}

.cosmos-tc .txt {
	margin-block: 0 14px;
	font-size: 14px;
	line-height: 1.8;
	color: var(--ink);
}

.cosmos-who {
	display: flex;
	align-items: center;
	gap: 10px;
}

.cosmos-ava {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--tint);
	color: var(--bl);
	font-size: 13px;
	font-weight: 700;
}

.cosmos-who .nm {
	margin: 0;
	font-size: 14px;
	font-weight: 700;
	color: var(--ink);
}

.cosmos-who .rl {
	margin: 0;
	font-size: 12px;
	color: var(--mut);
}

/* الدعوة الختامية */
.cosmos-final {
	padding-block: 48px;
	padding-inline: 24px;
	border-radius: 14px;
	text-align: center;
	background: var(--tint);
}

.cosmos-final h2 {
	margin-block: 0 8px;
	font-size: 26px;
}

.cosmos-final p {
	margin-block: 0 20px;
	font-size: 15px;
}

@media (max-width: 544px) {
	.cosmos-sec,
	.cosmos-hero,
	.cosmos-sections .entry-content > .wp-block-group.cosmos-sec,
	.cosmos-sections .entry-content > .wp-block-group.cosmos-hero {
		padding-block: 40px;
		padding-inline: 16px;
	}

	.cosmos-hero__txt h1 {
		font-size: 28px;
	}

	.cosmos-h2 {
		font-size: 23px;
	}
}

/* ==========================================================================
   بطاقة الكورس — مكوّن مشترك
   ========================================================================== */
.cosmos-course-card {
	display: flex;
	flex-direction: column;
}

.cosmos-course-card__thumb {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 140px;
	overflow: hidden;
	text-decoration: none;
	background: var(--tint);
	color: var(--bl);
}

.cosmos-course-card--free .cosmos-course-card__thumb {
	background: var(--tint-free);
	color: var(--tl-d);
}

.cosmos-course-card--live .cosmos-course-card__thumb {
	background: var(--tint-live);
	color: var(--live-d);
}

.cosmos-course-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cosmos-course-card__badges {
	position: absolute;
	inset-block-start: 10px;
	inset-inline-start: 10px;
	display: flex;
	gap: 6px;
}

.cosmos-course-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 8px;
	padding-block: 14px 15px;
	padding-inline: 16px;
}

.cosmos-course-card__body h3 {
	margin: 0;
	font-size: 16px;
	line-height: 1.45;
}

.cosmos-course-card__body h3 a {
	color: var(--bld);
	text-decoration: none;
}

.cosmos-course-card__inst {
	font-size: 13px;
	color: var(--ink);
}

.cosmos-course-card__meta {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 12px;
	color: var(--mut);
}

.cosmos-course-card__rating .cosmos-icon {
	color: var(--star);
}

.cosmos-course-card__feat {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	color: var(--badge-free-ink);
}

.cosmos-course-card--live .cosmos-course-card__feat {
	color: var(--badge-live-ink);
}

.cosmos-course-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-block-start: auto;
	padding-block-start: 12px;
	border-block-start: 0.5px solid var(--ln);
}

.cosmos-card__price {
	font-size: 17px;
	font-weight: 700;
	line-height: 1;
	color: var(--bld);
}

.cosmos-card__free {
	font-size: 15px;
	font-weight: 700;
	color: var(--tl);
}

.cosmos-course-card__cta,
.cosmos-course-card__cta:visited {
	padding-block: 8px;
	padding-inline: 15px;
	border-radius: var(--radius-sm);
	background: var(--bl);
	color: var(--sf);
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
}

.cosmos-course-card__cta:hover,
.cosmos-course-card__cta:focus {
	background: var(--bld);
	color: var(--sf);
}

.cosmos-course-card--free .cosmos-course-card__cta {
	background: var(--tl);
}

.cosmos-course-card--free .cosmos-course-card__cta:hover {
	background: var(--tl-d);
}

.cosmos-course-card--live .cosmos-course-card__cta {
	background: var(--live-d);
}

.cosmos-course-card--live .cosmos-course-card__cta:hover {
	background: var(--badge-live-ink);
}

/* ==========================================================================
   صفحة الكورسات وصفحات المسارات — منقولة من الموقع القديم (ق-022)
   ========================================================================== */
.cosmos-courses {
	max-width: 1200px;
	margin-inline: auto;
	padding-block: 32px 24px;
}

/* Astra يضيف حشواً علوياً ~58px لمنطقة المحتوى — مع حشونا فراغ كبير تحت الهيدر */
.cosmos-courses-page #primary {
	margin-block-start: 0;
	padding-block-start: 0;
}

.cosmos-courses__hero {
	display: flex;
	align-items: center;
	gap: 20px;
}

.cosmos-courses__hero h1 {
	margin: 0;
	font-size: 30px;
	color: var(--bld);
}

.cosmos-courses__hero p {
	margin-block: 6px 0;
	font-size: 15px;
	color: var(--mut);
}

.cosmos-courses__heroimg {
	flex-shrink: 0;
	width: 140px;
	aspect-ratio: 4 / 3;
	border-radius: var(--radius);
	overflow: hidden;
	background: var(--tint);
}

.cosmos-courses__heroimg img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cosmos-courses__back {
	display: inline-block;
	margin-block-end: 6px;
	font-size: 13px;
	text-decoration: none;
}

.cosmos-courses__filters {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-block: 22px 18px;
}

.cosmos-courses__search {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding-block: 10px;
	padding-inline: 14px;
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: var(--radius-btn);
	color: var(--mut);
}

.cosmos-courses__search:focus-within {
	border-color: var(--bl);
}

.cosmos-courses__search input[type="search"] {
	width: 100%;
	min-height: 0;
	padding: 0;
	border: none;
	outline: none;
	background: transparent;
	box-shadow: none;
	font-family: inherit;
	font-size: 14px;
	color: var(--ink);
}

/* الشرائح تلتفّ على الشاشة الواسعة، وتتمرّر أفقياً داخل صفها على الجوال — لا تمرير للصفحة */
.cosmos-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

@media (max-width: 768px) {
	.cosmos-chips {
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-block-end: 4px;
		scrollbar-width: none;
	}

	.cosmos-chips::-webkit-scrollbar {
		display: none;
	}
}

.cosmos-chip,
.cosmos-chip:visited {
	flex-shrink: 0;
	padding-block: 7px;
	padding-inline: 16px;
	border: 0.5px solid var(--ln);
	border-radius: 20px;
	background: var(--sf);
	color: var(--ink);
	font-size: 14px;
	text-decoration: none;
	white-space: nowrap;
}

.cosmos-chip:hover,
.cosmos-chip:focus-visible {
	border-color: var(--bl);
	color: var(--bl);
}

.cosmos-chip.on {
	border-color: var(--bl);
	background: var(--bl);
	color: var(--sf);
}

.cosmos-courses__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 16px;
	padding-block: 4px 8px;
}

.cosmos-pagination {
	padding-block: 20px 4px;
	text-align: center;
}

.cosmos-pagination .page-numbers {
	display: inline-block;
	margin-inline: 3px;
	padding-block: 7px;
	padding-inline: 13px;
	border: 0.5px solid var(--ln);
	border-radius: var(--radius-sm);
	background: var(--sf);
	color: var(--ink);
	font-size: 14px;
	text-decoration: none;
}

.cosmos-pagination .page-numbers.current {
	border-color: var(--bl);
	background: var(--bl);
	color: var(--sf);
}

.cosmos-empty {
	padding-block: 48px;
	padding-inline: 20px;
	text-align: center;
	color: var(--mut);
}

.cosmos-empty .cosmos-icon {
	color: var(--ln);
}

.cosmos-empty p {
	margin-block: 12px 18px;
	font-size: 15px;
}

.cosmos-courses__trust {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding-block: 20px 8px;
	font-size: 13px;
	color: var(--mut);
}

.cosmos-courses__trust .cosmos-icon {
	color: var(--bl);
}

.cosmos-courses__trust b {
	color: var(--bld);
}

@media (max-width: 544px) {
	/* حاوية Astra تترك 8px فقط على الجوال */
	.cosmos-courses {
		padding-inline: 8px;
	}

	.cosmos-courses__hero h1 {
		font-size: 24px;
	}

	.cosmos-courses__heroimg {
		width: 96px;
	}
}

/* ==========================================================================
   غلاف الكورس المولَّد (ق-024) — لون نوع الكورس، شبكة خطوط، اسم قصير
   ========================================================================== */
.cosmos-cover {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: 12px;
	background-color: var(--tint);
	background-image:
		linear-gradient(color-mix(in srgb, currentColor 12%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, currentColor 12%, transparent) 1px, transparent 1px);
	background-size: 22px 22px;
	color: var(--bld);
}

.cosmos-cover--free {
	background-color: var(--tint-free);
	color: var(--tl-d);
}

.cosmos-cover--live {
	background-color: var(--tint-live);
	color: var(--live-d);
}

.cosmos-cover__label {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
}

/* ==========================================================================
   صفحة الكورس المفرد — قالب Tutor بهوية كوسموس
   ========================================================================== */
.cosmos-single__badges {
	display: flex;
	gap: 6px;
	margin-block-end: 10px;
}

/* صورة Tutor الافتراضية الرمادية تُخفى — مكانها الغلاف المولَّد (الصنف من cosmos_single_no_thumb_class) */
.cosmos-no-thumb .tutor-course-thumbnail {
	display: none;
}

.cosmos-single__cover {
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: var(--radius);
}

.cosmos-single__cover .cosmos-cover__label {
	font-size: 44px;
}

.tutor-single-course-sidebar {
	position: sticky;
	inset-block-start: 96px;
}

.tutor-card {
	border: 0.5px solid var(--ln);
	border-radius: var(--radius);
}

/* جلسات اللايف (م5.13): بطاقة واحدة في لوحة الطالب ورأس منطقة التعلّم ولوحة المدير */
.cm-live {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr) auto;
	gap: 14px;
	align-items: center;
	padding: 12px 0;
	border-top: 1px solid var(--ln);
}

.cm-live:first-of-type {
	border-top: 0;
}

.cm-live b {
	display: block;
	font-size: 15px;
	color: var(--ink);
}

.cm-live small {
	font-size: 13px;
	color: var(--mut);
}

.cm-date {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 62px;
	border-radius: 14px;
	background: var(--tint-live);
	color: var(--live-d);
	font-weight: 800;
	line-height: 1.15;
}

.cm-live .cm-date b {
	font-size: 22px;
	color: inherit;
}

.cm-live .cm-date small {
	font-size: 12px;
	font-weight: 700;
	color: inherit;
}

.cd-btn--live {
	background: var(--live-d);
	color: var(--on-dk);
}

.cd-btn--live:hover {
	background: var(--ink);
	color: var(--on-dk);
}

.cl-live {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-block-start: 16px;
	padding: 6px 16px;
	border: 1px solid var(--badge-live-bg);
	border-radius: 14px;
	background: var(--sf);
}

.cl-live .cm-live {
	flex: 1;
	border: 0;
}

.cl-live__tag {
	flex: none;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--badge-live-bg);
	color: var(--badge-live-ink);
	font-size: 12.5px;
	font-weight: 800;
}

@media (max-width: 544px) {
	.cm-live {
		grid-template-columns: 52px minmax(0, 1fr);
	}

	.cm-live > :last-child {
		grid-column: 1 / -1;
		justify-self: start;
	}

	.cl-live {
		flex-direction: column;
		align-items: stretch;
	}
}

/* كارت الالتحاق لحساب المدرّب (م5.12): لا شراء — رابط لوحته */
.cosmos-teach-box b {
	display: block;
	font-size: 16px;
	color: var(--bld);
}

.cosmos-teach-box p {
	margin: 4px 0 14px;
	font-size: 14px;
	color: var(--mut);
}

/* مدرّبو الكورس في الشريط الجانبي (م5.12، س12) — بدل «A course by» من Tutor */
.cosmos-teachers {
	margin-block-start: 20px;
	padding: 18px;
	border: 0.5px solid var(--ln);
	border-radius: var(--radius);
	background: var(--sf);
}

.cosmos-teachers h3 {
	margin: 0 0 12px;
	font-size: 16px;
	font-weight: 800;
	color: var(--bld);
}

.cosmos-teacher {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	gap: 12px;
	align-items: start;
}

.cosmos-teacher + .cosmos-teacher {
	margin-block-start: 14px;
	padding-block-start: 14px;
	border-block-start: 1px solid var(--ln);
}

.cosmos-teacher .cd-ava {
	width: 56px;
	height: 56px;
	margin: 0;
	border-radius: 16px;
	background: var(--tint-free);
	color: var(--tl);
	display: grid;
	place-items: center;
	overflow: hidden;
	font-weight: 800;
	font-size: 20px;
}

.cosmos-teacher .cd-ava img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cosmos-teacher b {
	display: block;
	font-size: 15.5px;
	color: var(--ink);
}

.cosmos-teacher small {
	display: block;
	font-size: 13px;
	color: var(--tl);
	font-weight: 700;
}

.cosmos-teacher p {
	margin: 6px 0 0;
	font-size: 14px;
	line-height: 1.75;
	color: var(--mut);
}

.tutor-sidebar-card .woocommerce-Price-amount {
	font-size: 26px;
	font-weight: 700;
	color: var(--bld);
}

.tutor-sidebar-card .woocommerce-Price-currencySymbol {
	font-size: 13px;
	color: var(--mut);
}

.tutor-btn {
	border-radius: var(--radius-btn);
	font-family: inherit;
	font-weight: 700;
}

.tutor-btn-primary {
	border-color: var(--bl);
	background: var(--bl);
}

.tutor-btn-primary:hover {
	border-color: var(--bld);
	background: var(--bld);
}

.tutor-accordion-item {
	margin-block-end: 10px;
	overflow: hidden;
	border: 0.5px solid var(--ln);
	border-radius: 10px;
	background: var(--sf);
}

.tutor-accordion-item-header {
	background: var(--pg);
	font-weight: 700;
	color: var(--bld);
}

.tutor-accordion-item-header.is-active {
	border-block-end: 0.5px solid var(--ln);
}

.tutor-icon-lock-line {
	color: var(--mut);
}

.tutor-icon-eye-line {
	color: var(--tl);
}

.tutor-ratings-stars,
.tutor-star-rating-group {
	color: var(--star);
}

.cosmos-anchor {
	display: block;
	/* المرساة 32px داخل الكارت، والهيدر الثابت ~87px على الجوال: 130 يُظهر حافة الكارت كاملة */
	scroll-margin-block-start: 130px;
}

/* سطر الدفع السوداني وزر «اسأل قبل الشراء» */
.cosmos-paycard {
	margin-block-start: 14px;
	text-align: center;
}

.cosmos-paycard__note {
	margin-block: 0 10px;
	font-size: 13px;
	color: var(--mut);
}

.cosmos-btn-wa,
.cosmos-btn-wa:visited {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	width: 100%;
	padding: 11px;
	border: 1px solid var(--wa-ln);
	border-radius: var(--radius-btn);
	background: var(--sf);
	color: var(--wa-d);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
}

.cosmos-btn-wa:hover,
.cosmos-btn-wa:focus {
	background: var(--wa-bg);
	color: var(--wa-d);
}

.cosmos-single__trust {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-block: 14px 0;
	font-size: 13px;
	color: var(--mut);
}

.cosmos-single__trust .cosmos-icon {
	color: var(--bl);
}

/* عنوان صغير فوق العناوين (ق-024) */
.cosmos-eyebrow {
	margin-block: 0 6px;
	font-size: 13px;
	font-weight: 700;
	color: var(--tl);
}

/* بطاقة «اسأل الأستاذ» بصورة محادثة (ق-024) */
.cosmos-qa {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 24px;
	align-items: center;
	margin-block-start: 28px;
	padding: 24px;
	border-radius: 14px;
	background: var(--bld);
	color: var(--sf);
}

.cosmos-qa .cosmos-eyebrow {
	color: var(--band-acc);
}

.cosmos-qa h3 {
	margin-block: 0 8px;
	font-size: 20px;
	line-height: 1.5;
	color: var(--sf);
}

.cosmos-qa__txt > p:not(.cosmos-eyebrow) {
	margin-block: 0 16px;
	font-size: 14px;
	line-height: 1.9;
	color: var(--band-ink);
}

.cosmos-qa__cta,
.cosmos-qa__cta:visited {
	display: inline-block;
	padding-block: 9px;
	padding-inline: 18px;
	border-radius: var(--radius-sm);
	background: var(--tl);
	color: var(--sf);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.cosmos-qa__cta:hover,
.cosmos-qa__cta:focus {
	background: var(--tl-d);
	color: var(--sf);
}

.cosmos-qa__chat {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.cosmos-qa__msg {
	max-width: 88%;
	margin: 0;
	padding-block: 10px;
	padding-inline: 14px;
	border-radius: 14px;
	font-size: 13px;
	line-height: 1.8;
}

.cosmos-qa__msg--student {
	align-self: flex-start;
	border-end-start-radius: 4px;
	background: var(--sf);
	color: var(--ink);
}

.cosmos-qa__msg--teacher {
	align-self: flex-end;
	border-end-end-radius: 4px;
	background: var(--badge-free-bg);
	color: var(--badge-free-ink);
}

@media (max-width: 768px) {
	.cosmos-qa {
		grid-template-columns: 1fr;
	}

	.cosmos-single__cover .cosmos-cover__label {
		font-size: 32px;
	}

	.tutor-single-course-sidebar {
		position: static;
	}
}

/* ==========================================================================
   رأس الصفحات الداخلية (من نحن، تواصل، المسارات) — منقول من الموقع القديم
   ========================================================================== */
.cosmos-pagehead {
	text-align: center;
}

.cosmos-pagehead h1 {
	margin: 0;
	font-size: 32px;
	color: var(--bld);
}

.cosmos-pagehead p {
	margin-block: 8px 0;
	font-size: 15px;
	color: var(--mut);
}

.cosmos-narrow {
	max-width: 820px;
	margin-inline: auto;
	text-align: center;
}

/* ==========================================================================
   صفحة التواصل — القنوات والنموذج
   ========================================================================== */
.cosmos-contact {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 18px;
	align-items: start;
}

.cosmos-contact__info {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.cosmos-chan,
.cosmos-chan:visited {
	display: flex;
	align-items: center;
	gap: 13px;
	padding-block: 15px;
	padding-inline: 17px;
	border-radius: 11px;
	color: var(--sf);
	text-decoration: none;
}

.cosmos-chan b {
	display: block;
	font-size: 16px;
}

.cosmos-chan span span {
	font-size: 12px;
	opacity: 0.9;
}

.cosmos-chan--wa {
	background: var(--wa);
}

.cosmos-chan--wa:hover,
.cosmos-chan--wa:focus {
	background: var(--wa-d);
	color: var(--sf);
}

.cosmos-chan--tg {
	background: var(--tg);
}

.cosmos-chan--tg:hover,
.cosmos-chan--tg:focus {
	background: var(--tg-d);
	color: var(--sf);
}

.cosmos-infobox {
	padding-block: 6px;
	padding-inline: 17px;
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: 11px;
}

.cosmos-infobox:empty {
	display: none;
}

.cosmos-infobox__row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-block: 9px;
	font-size: 14px;
	color: var(--ink);
}

.cosmos-infobox__row .cosmos-icon {
	color: var(--bl);
}

.cosmos-infobox__row small {
	display: block;
	font-size: 12px;
	color: var(--mut);
}

.cosmos-contact__form {
	padding: 24px;
	background: var(--sf);
	border: 0.5px solid var(--ln);
	border-radius: 14px;
}

.cosmos-contact__form h2 {
	margin-block: 0 4px;
	font-size: 19px;
}

.cosmos-contact__form > p {
	margin-block: 0 16px;
	font-size: 13px;
	color: var(--mut);
}

.cosmos-field {
	margin-block-end: 14px;
}

.cosmos-field label {
	display: block;
	margin-block-end: 6px;
	font-size: 13px;
	font-weight: 500;
	color: var(--ink);
}

.cosmos-field input,
.cosmos-field textarea {
	width: 100%;
	padding-block: 10px;
	padding-inline: 12px;
	border: 0.5px solid var(--ln);
	border-radius: var(--radius-btn);
	background: var(--field);
	color: var(--ink);
	font-family: inherit;
	font-size: 14px;
}

.cosmos-field input:focus,
.cosmos-field textarea:focus {
	border-color: var(--bl);
	outline: 2px solid var(--tint);
}

.cosmos-field textarea {
	min-height: 110px;
	resize: vertical;
}

/* حقل الفخ — خارج الشاشة لا display:none (بعض البرامج تتخطى المخفي) */
.cosmos-hp {
	position: absolute;
	inset-inline-start: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.cosmos-form__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 12px;
	font-size: 15px;
	cursor: pointer;
}

.cosmos-notice {
	margin-block-end: 16px;
	padding-block: 12px;
	padding-inline: 14px;
	border-radius: var(--radius-sm);
	font-size: 14px;
}

.cosmos-notice--ok {
	background: var(--badge-free-bg);
	color: var(--badge-free-ink);
}

.cosmos-notice--err {
	background: var(--danger-bg);
	color: var(--danger);
}

.cosmos-anchor-target {
	scroll-margin-block-start: 110px;
}

@media (max-width: 768px) {
	.cosmos-contact {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   م5.8 — التصميم الجديد (ق-024، المقترح المعتمد)
   ========================================================================== */

/* ── الهيدر: «cosmos.» واسم المركز تحته، و«دخول» رابطاً نصياً ── */
.site-title a {
	display: inline-flex;
	flex-direction: column;
	line-height: 1.1;
	text-decoration: none;
}

.cosmos-wm {
	font-size: 24px;
	font-weight: 800;
	letter-spacing: 0.5px;
	color: var(--bld);
}

.cosmos-wm b {
	color: var(--tl);
}

.cosmos-wm__sub {
	margin-block-start: 3px;
	font-size: 11px;
	font-weight: 500;
	color: var(--mut);
}

.cosmos-hbtn--login,
.main-header-menu .cosmos-hbtn--login {
	border-color: transparent;
	background: transparent;
	color: var(--mut);
	font-weight: 500;
}

.cosmos-hbtn--login:hover,
.cosmos-hbtn--login:focus {
	background: transparent;
	color: var(--bl);
}

.cosmos-hbtn--register,
.main-header-menu .cosmos-hbtn--register {
	padding-block: 10px;
	padding-inline: 20px;
	border-radius: 10px;
}

/* ── رأس القسم: عنوان صغير + عنوان + تمهيد، ورابط جانبي ── */
.cosmos-sec-h {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
	margin-block-end: 24px;
}

.cosmos-sec-h .cosmos-h2 {
	margin-block: 6px 0;
	font-size: clamp(22px, 3vw, 30px);
	font-weight: 800;
	text-align: start;
}

.cosmos-sec-h .cosmos-lead {
	margin-block: 4px 0;
	text-align: start;
}

.cosmos-sec-h__link {
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.cosmos-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 13px;
	font-weight: 700;
	color: var(--tl);
}

.cosmos-eyebrow::before {
	content: "";
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
}

/* ── الهيرو ── */
.cosmos-sections .entry-content > .wp-block-group.cosmos-hero {
	padding-block: 46px 72px;
	background: linear-gradient(180deg, var(--sf) 0%, var(--pg) 100%);
}

.cosmos-hero__txt h1 {
	margin-block: 10px 14px;
	font-size: clamp(30px, 4.6vw, 46px);
	font-weight: 800;
	line-height: 1.35;
}

.cosmos-checks {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	margin-block-start: 18px;
	font-size: 13.5px;
	color: var(--mut);
}

.cosmos-checks span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.cosmos-checks .cosmos-icon {
	color: var(--tl);
}

.cosmos-hero__viz {
	position: relative;
	overflow: visible;
}

.cosmos-hero__viz figure {
	height: 100%;
	margin: 0;
	border-radius: 16px;
	overflow: hidden;
}

.cosmos-hero__viz .cosmos-chip {
	position: absolute;
	z-index: 2;
	padding-block: 10px;
	padding-inline: 14px;
	border-radius: 12px;
	background: var(--sf);
	box-shadow: 0 10px 30px -18px var(--shadow), 0 1px 2px var(--shadow);
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--ink);
}

.cosmos-hero__viz .cosmos-chip b {
	display: block;
	font-size: 14px;
	color: var(--bld);
}

.cosmos-hero__viz .cosmos-chip--a {
	inset-block-start: 16px;
	inset-inline-start: 16px;
}

.cosmos-hero__viz .cosmos-chip--b {
	inset-block-end: 16px;
	inset-inline-end: 16px;
	background: var(--bld);
	color: var(--band-ink);
}

.cosmos-hero__viz .cosmos-chip--b b {
	color: var(--sf);
}

/* ── شريط المجالات تحت الهيرو ── */
.cosmos-sections .entry-content > .cosmos-strip {
	position: relative;
	z-index: 3;
	max-width: 1152px;
	margin-block: -40px 0;
	margin-inline: auto;
}

.cosmos-strip {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border: 1px solid var(--strip-ln);
	border-radius: 16px;
	background: var(--tint-free);
}

.cosmos-strip__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-block: 20px;
	padding-inline: 22px;
}

.cosmos-strip__item + .cosmos-strip__item {
	border-inline-start: 1px solid var(--strip-ln);
}

.cosmos-strip__item .cosmos-icon {
	color: var(--tl);
}

.cosmos-strip__item b {
	display: block;
	font-size: 15px;
	color: var(--bld);
}

.cosmos-strip__item small {
	font-size: 12.5px;
	color: var(--mut);
}

/* ── بطاقات المسارات بأيقونة (بدل الصور) ── */
.cosmos-trk,
.cosmos-trk:visited {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 18px;
	border: 1px solid var(--ln);
	border-radius: var(--radius);
	background: var(--sf);
	color: var(--ink);
	text-decoration: none;
	overflow: visible;
}

.cosmos-trk:hover,
.cosmos-trk:focus-visible {
	border-color: var(--bl);
	color: var(--ink);
}

.cosmos-trk__ic {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	margin-block-end: 4px;
	border-radius: 10px;
	background: var(--tint);
	color: var(--bl);
}

.cosmos-trk b {
	font-size: 15px;
	color: var(--bld);
}

.cosmos-trk small {
	flex: 1;
	font-size: 12.5px;
	color: var(--mut);
}

.cosmos-trk__go {
	font-size: 13px;
	font-weight: 700;
	color: var(--bl);
}

/* ── الخطوات و«اسأل الأستاذ» جنباً إلى جنب ── */
.cosmos-duo {
	display: grid;
	grid-template-columns: 1fr 1.05fr;
	gap: 28px;
	align-items: stretch;
}

.cosmos-duo__steps h2 {
	margin-block: 8px 18px;
	font-size: clamp(22px, 3vw, 30px);
	font-weight: 800;
	line-height: 1.45;
}

.cosmos-duo .cosmos-step {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 2px 16px;
	padding-block: 12px;
	padding-inline: 0;
	border-block-end: 1px solid var(--ln);
	text-align: start;
}

.cosmos-duo .cosmos-step:last-child {
	border-block-end: 0;
}

.cosmos-duo .cosmos-step .n {
	grid-row: span 2;
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	border-radius: 0;
	background: none;
	color: var(--tl);
	font-size: 28px;
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	line-height: 1.2;
}

.cosmos-duo .cosmos-step h3 {
	margin: 0;
	font-size: 16px;
}

.cosmos-duo .cosmos-step p:not(.n) {
	margin: 0;
	font-size: 13px;
}

.cosmos-ask {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 28px;
	border-radius: 16px;
	background: var(--bld);
	color: var(--band-ink);
}

.cosmos-ask .cosmos-eyebrow {
	color: var(--band-acc);
}

.cosmos-ask h2 {
	margin: 0;
	font-size: clamp(24px, 3.2vw, 34px);
	font-weight: 800;
	line-height: 1.35;
	color: var(--sf);
}

.cosmos-ask > p {
	margin: 0;
	font-size: 14.5px;
}

.cosmos-ask .cosmos-qa__msg {
	font-size: 13.5px;
}

.cosmos-ask .cosmos-qa__msg small {
	display: block;
	margin-block-end: 2px;
	font-size: 11.5px;
	opacity: 0.8;
}

.cosmos-ask .wp-block-buttons {
	margin: 0;
}

.cosmos-ask .wp-block-button__link {
	background: var(--tl);
}

.cosmos-ask .wp-block-button__link:hover {
	background: var(--tl-d);
}

/* محتوى رؤوس الصفحات بعرض 1200 كبقية الأقسام */
.cosmos-abhero > *,
.cosmos-cthead > *,
.cosmos-sections .entry-content > .cosmos-strip {
	max-width: 1200px;
}

.cosmos-abhero > *,
.cosmos-cthead > * {
	margin-inline: auto;
}

/* ── من نحن ── */
.cosmos-sections .entry-content > .wp-block-group.cosmos-abhero {
	padding-block: 48px;
	background: var(--sf);
}

.cosmos-abhero__in {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 34px;
	align-items: center;
}

.cosmos-abhero h1 {
	margin-block: 10px 14px;
	font-size: clamp(28px, 4.2vw, 42px);
	font-weight: 800;
	line-height: 1.4;
}

.cosmos-abhero__img {
	position: relative;
}

.cosmos-abhero__img figure {
	margin: 0;
	aspect-ratio: 4 / 3.4;
	border-radius: 16px;
	overflow: hidden;
}

.cosmos-abhero__img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cosmos-since {
	position: absolute;
	z-index: 2;
	inset-block-end: 18px;
	inset-inline-start: 18px;
	padding-block: 12px;
	padding-inline: 16px;
	border-radius: 14px;
	background: var(--tl);
	color: var(--sf);
	text-align: center;
	line-height: 1.3;
}

.cosmos-since b {
	display: block;
	font-size: 26px;
	font-weight: 800;
}

.cosmos-since small {
	font-size: 12px;
}

.cosmos-markets {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-block-start: 14px;
}

.cosmos-markets span {
	padding-block: 5px;
	padding-inline: 14px;
	border: 1px solid var(--ln);
	border-radius: 999px;
	background: var(--sf);
	font-size: 13px;
	color: var(--bld);
}

.cosmos-mission {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 20px;
	align-items: center;
	padding-block: 26px;
	padding-inline: 28px;
	border-radius: 16px;
	background: var(--tint);
}

.cosmos-mission__ic {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: var(--sf);
	color: var(--bl);
}

.cosmos-mission h2 {
	margin-block: 6px;
	font-size: 22px;
	font-weight: 800;
}

.cosmos-mission p:not(.cosmos-eyebrow) {
	margin: 0;
}

.cosmos-vals .cosmos-vp {
	text-align: start;
}

.cosmos-vals .cosmos-ic {
	margin-inline: 0;
	background: var(--tint-free);
	color: var(--tl-d);
}

.cosmos-vals .cosmos-vp p {
	font-size: 13.5px;
	line-height: 1.8;
}

.cosmos-band {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 28px;
	border: 1px solid var(--strip-ln);
	border-radius: 16px;
	background: var(--tint-free);
}

.cosmos-band h2 {
	margin: 0;
	font-size: clamp(20px, 2.8vw, 28px);
	font-weight: 800;
}

.cosmos-band p {
	margin: 0;
	font-size: 14px;
	color: var(--mut);
}

.cosmos-band .wp-block-buttons {
	margin: 0;
}

/* ── تواصل ── */
.cosmos-sections .entry-content > .wp-block-group.cosmos-cthead {
	padding-block: 46px 26px;
	border-block-end: 1px solid var(--ln);
	background: var(--sf);
}

.cosmos-cthead h1 {
	margin-block: 8px 6px;
	font-size: clamp(28px, 4.2vw, 42px);
	font-weight: 800;
}

.cosmos-cthead p:not(.cosmos-eyebrow) {
	margin: 0;
	color: var(--mut);
}

.cosmos-quick {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
}

.cosmos-q,
.cosmos-q:visited {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 20px;
	border: 1px solid var(--ln);
	border-radius: 16px;
	background: var(--sf);
	color: var(--ink);
	text-decoration: none;
}

.cosmos-q:hover,
.cosmos-q:focus-visible {
	border-color: var(--bl);
	color: var(--ink);
}

.cosmos-q__ic {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: var(--bl);
	color: var(--sf);
}

.cosmos-q__tag {
	align-self: flex-start;
	padding-block: 2px;
	padding-inline: 10px;
	border-radius: 999px;
	background: var(--tint);
	color: var(--bld);
	font-size: 11.5px;
	font-weight: 700;
}

.cosmos-q b {
	font-size: 17px;
	color: var(--bld);
	text-align: start;
}

.cosmos-q small {
	font-size: 13px;
	color: var(--mut);
}

.cosmos-q--wa {
	border-color: var(--wa-ln);
	background: var(--wa-bg);
}

.cosmos-q--wa .cosmos-q__ic {
	background: var(--wa);
}

.cosmos-q--wa .cosmos-q__tag {
	background: var(--wa-ln);
	color: var(--wa-d);
}

.cosmos-q--tg .cosmos-q__ic {
	background: var(--tg);
}

.cosmos-q--tg .cosmos-q__tag {
	background: var(--tint);
	color: var(--tg-d);
}

.cosmos-ctgrid {
	display: grid;
	grid-template-columns: 1.35fr 1fr;
	gap: 18px;
	align-items: start;
}

.cosmos-ctside {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.cosmos-topics {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-block: 0 14px;
	margin-inline: 0;
	padding: 0;
	border: 0;
}

.cosmos-topics label {
	position: relative;
	cursor: pointer;
}

.cosmos-topics input {
	position: absolute;
	opacity: 0;
}

.cosmos-topics span {
	display: inline-block;
	padding-block: 7px;
	padding-inline: 14px;
	border: 1px solid var(--ln);
	border-radius: 999px;
	background: var(--pg);
	font-size: 13.5px;
}

.cosmos-topics input:checked + span {
	border-color: var(--bl);
	background: var(--bl);
	color: var(--sf);
}

.cosmos-topics input:focus-visible + span {
	outline: 2px solid var(--bl);
	outline-offset: 2px;
}

.cosmos-row2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.cosmos-row2 > * {
	min-width: 0;
}

.cosmos-faq {
	padding-block: 6px;
	padding-inline: 18px;
	border: 1px solid var(--ln);
	border-radius: 16px;
	background: var(--sf);
}

.cosmos-faq h2 {
	margin-block: 12px 4px;
	font-size: 15px;
	text-align: start;
}

.cosmos-faq .wp-block-details {
	padding-block: 10px;
	border-block-end: 1px solid var(--ln);
}

.cosmos-faq .wp-block-details:last-child {
	border-block-end: 0;
}

.cosmos-faq summary {
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	color: var(--ink);
}

.cosmos-faq .wp-block-details p {
	margin-block: 6px 0;
	font-size: 13.5px;
	color: var(--mut);
}

@media (max-width: 921px) {
	.cosmos-duo,
	.cosmos-abhero__in,
	.cosmos-ctgrid {
		grid-template-columns: 1fr;
	}

	.cosmos-strip {
		grid-template-columns: 1fr 1fr;
	}

	.cosmos-sections .entry-content > .cosmos-strip {
		margin-inline: 16px;
	}

	.cosmos-strip__item:nth-child(3) {
		border-inline-start: 0;
	}

	.cosmos-strip__item:nth-child(n+3) {
		border-block-start: 1px solid var(--strip-ln);
	}

	.cosmos-quick {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 544px) {
	.cosmos-strip {
		grid-template-columns: 1fr;
	}

	.cosmos-strip__item + .cosmos-strip__item {
		border-inline-start: 0;
		border-block-start: 1px solid var(--strip-ln);
	}

	.cosmos-row2,
	.cosmos-mission {
		grid-template-columns: 1fr;
	}

	.site-title .cosmos-wm {
		font-size: 20px;
	}
}

/* ── صقل م5.8 بعد المعاينة ── */

/* Astra يلغي max-width لأبناء أي عنصر في المحتوى ليس wp-block-group — أقسام الشورتكود (المسارات، الكورسات المميّزة)
   كانت تمتد بعرض الشاشة. قاعدة أخصّ تعيد حدّ 1200. */
.cosmos-sections.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .cosmos-sec > * {
	max-width: 1200px;
	margin-inline: auto;
}

/* ونفس قاعدة Astra تعطي أبناءه هوامش auto — عناصر شريط المجالات كانت تنكمش في وسط خلاياها. */
.cosmos-sections .entry-content[data-ast-blocks-layout] > .cosmos-strip > .cosmos-strip__item {
	margin-inline: 0;
}

/* Astra يضع خطاً تحت كل رابط في محتوى الصفحة — البطاقات روابط كاملة لا تحتاجه. */
.cosmos-sections .entry-content :is(.cosmos-trk, .cosmos-q, .cosmos-sec-h__link, .cosmos-course-card a) {
	text-decoration: none;
}

/* رأس القسم داخل مجموعة بلوكات (آراء المتدرّبين، مزايا من نحن): العنوان الصغير بعرض الحاوية والعنوان بمحاذاته،
   كرأس أقسام الشورتكود. */
.cosmos-sec > .cosmos-eyebrow {
	display: flex;
}

.cosmos-sec > .cosmos-eyebrow + .cosmos-h2 {
	margin-block: 6px 28px;
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 800;
	text-align: start;
}

.cosmos-sec-h .cosmos-h2,
.cosmos-duo__steps h2 {
	font-size: clamp(24px, 3vw, 32px);
}

/* مساحات أوسع بين الأقسام (ق-024 بند 3) */
.cosmos-sections .entry-content > .wp-block-group.cosmos-sec,
.cosmos-sections .entry-content > .cosmos-sec {
	padding-block: 72px;
}

/* الهيرو: عنوان أكبر وأثقل، وصورة أطول بزاوية كبيرة وإطار مُزاح كالمقترح */
.cosmos-sections .entry-content > .wp-block-group.cosmos-hero {
	padding-block: 64px 96px;
}

.cosmos-hero__txt h1 {
	font-size: clamp(32px, 4.6vw, 56px);
	line-height: 1.3;
	letter-spacing: -0.5px;
	text-wrap: balance;
}

.cosmos-hero__txt h1 em {
	white-space: nowrap;
}

.cosmos-hero__viz {
	aspect-ratio: auto;
	min-height: 420px;
	padding-block-end: 22px;
	padding-inline-end: 22px;
	background: none;
}

.cosmos-hero__viz::before {
	content: "";
	position: absolute;
	inset-block: 30px 0;
	inset-inline: 22px 0;
	border: 1px solid var(--strip-ln);
	border-radius: 16px;
	border-start-end-radius: 96px;
}

.cosmos-hero__viz figure {
	position: relative;
	height: 100%;
	border-start-end-radius: 96px;
}

.cosmos-hero__viz figure img {
	min-height: 398px;
}

.cosmos-hero__viz .cosmos-chip--b {
	inset-block-end: 48px;
	inset-inline-end: 0;
}

/* بطاقات قابلة للنقر: ترتفع قليلاً عند المرور */
.cosmos-trk,
.cosmos-q {
	transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.cosmos-trk:hover,
.cosmos-q:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px -20px var(--shadow);
}

.cosmos-trk__ic {
	width: 48px;
	height: 48px;
	margin-block-end: 10px;
}

@media (prefers-reduced-motion: reduce) {
	.cosmos-trk,
	.cosmos-q {
		transition: none;
	}

	.cosmos-trk:hover,
	.cosmos-q:hover {
		transform: none;
	}
}

@media (max-width: 921px) {
	.cosmos-sections .entry-content > .wp-block-group.cosmos-sec,
	.cosmos-sections .entry-content > .cosmos-sec {
		padding-block: 48px;
	}

	.cosmos-sections .entry-content > .wp-block-group.cosmos-hero {
		padding-block: 40px 72px;
	}

	.cosmos-hero__viz {
		min-height: 0;
	}

	.cosmos-hero__viz figure img {
		min-height: 0;
		aspect-ratio: 4 / 3;
	}
}

@media (max-width: 544px) {
	/* الجوال: الإطار المُزاح يترك فراغاً تحت الصورة — يُخفى، والمجالات الأربعة في عمودين بدل أربعة صفوف. */
	.cosmos-hero__viz {
		padding: 0;
	}

	.cosmos-hero__viz::before {
		content: none;
	}

	.cosmos-hero__viz .cosmos-chip--b {
		inset-block-end: 16px;
		inset-inline-end: 16px;
	}

	/* المسارات في عمودين كالمقترح — عمود واحد يجعل خمس بطاقات قصيرة تملأ ثلاث شاشات. */
	.cosmos-g5 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}

	.cosmos-trk {
		padding: 14px;
	}

	/* الفواصل من فجوة الشبكة لا من حدود كل عنصر — تبقى مستقيمة مهما اختلف طول النص. */
	.cosmos-strip {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1px;
		overflow: hidden;
		background: var(--strip-ln);
	}

	.cosmos-strip__item,
	.cosmos-strip__item + .cosmos-strip__item,
	.cosmos-strip__item:nth-child(n+3) {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px;
		padding: 16px;
		border: 0;
		background: var(--tint-free);
	}
}

/* ── ق-026: ألوان مريحة للعين وتباين لا يقل عن 4.5 ── */

/* رماديات Tutor الثابتة (#757C8E بتباين 3.9) — بلون النص الثانوي. */
body {
	--tutor-color-muted: var(--mut);
}

.tutor-color-muted,
.tutor-color-hints,
.tutor-meta,
.tutor-btn-link-gray,
.tutor-course-details-page .tutor-btn-ghost {
	color: var(--mut);
}

/* Astra يعطي كل فقرة في المحتوى هامشاً سفلياً 1.6em — العنوان الصغير يلتصق بعنوانه. */
.entry-content p.cosmos-eyebrow {
	margin-block: 0;
}

/* ==========================================================================
   م5.4 — الدخول والتسجيل: بطاقة مقسومة (ق-028)
   النموذج من Tutor أو WooCommerce كما هو، وبجانبه لوحة المزايا. التنسيق المضمَّن في قوالب Tutor
   (width:520px; margin:70px auto) لا يُغلب إلا بـ !important — محصور داخل .cosmos-auth.
   ========================================================================== */
.cosmos-auth {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	max-width: 980px;
	margin-block: 48px 72px;
	margin-inline: auto;
	overflow: hidden;
	border: 1px solid var(--ln);
	border-radius: 20px;
	background: var(--sf);
	box-shadow: 0 24px 48px -36px var(--shadow);
}

.cosmos-auth__form {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-block: 40px;
	padding-inline: 44px;
}

/* بطاقة الإضافة داخلها تفقد إطارها وعرضها الثابت — البطاقة الخارجية هي الإطار. */
.cosmos-auth .tutor-page-wrap,
.cosmos-auth .tutor-login-wrap,
.cosmos-auth #tutor-registration-wrap,
.cosmos-auth form.woocommerce-form-login {
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.cosmos-auth .tutor-login-form-wrapper,
.cosmos-auth #tutor-registration-form {
	padding: 0 !important;
}

/* العناوين */
.cosmos-auth .tutor-login-form-wrapper > .tutor-h3,
.cosmos-auth__head h1,
.cosmos-auth--login .woocommerce > h2,
.cosmos-auth--login > .cosmos-auth__form > h2 {
	margin-block: 0 22px;
	font-size: clamp(24px, 3vw, 30px);
	font-weight: 800;
	line-height: 1.35;
	color: var(--bld);
}

.cosmos-auth__head {
	margin-block-end: 22px;
}

.cosmos-auth__head h1 {
	margin-block-end: 6px;
}

.cosmos-auth__head p {
	margin: 0;
	font-size: 15px;
	color: var(--mut);
}

/* الدخول بحساب Google (ق-053): زر جوجل الرسمي فوق النموذج، ثم فاصل «أو». */
.cosmos-google {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin-block-end: 22px;
}

.cosmos-google__btn {
	display: flex;
	justify-content: center;
	width: 100%;
	min-height: 44px;
}

.cosmos-google.is-busy .cosmos-google__btn {
	opacity: 0.5;
	pointer-events: none;
}

.cosmos-google__msg {
	margin: 0;
	font-size: 14px;
	text-align: center;
	color: var(--danger);
}

.cosmos-google__or {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	font-size: 13px;
	color: var(--mut);
}

.cosmos-google__or::before,
.cosmos-google__or::after {
	content: "";
	flex: 1;
	border-block-start: 1px solid var(--ln);
}

/* الحقول */
.cosmos-auth label {
	font-size: 14px;
	font-weight: 500;
	color: var(--ink);
}

.cosmos-auth .tutor-form-control,
.cosmos-auth .woocommerce-Input {
	min-height: 48px;
	border: 1px solid var(--ln);
	border-radius: 10px;
	background: var(--field);
	color: var(--ink);
	font-family: inherit;
	font-size: 16px; /* 16 فما فوق: iOS لا يكبّر الصفحة عند لمس الحقل */
}

.cosmos-auth .tutor-form-control:focus,
.cosmos-auth .woocommerce-Input:focus {
	border-color: var(--bl);
	box-shadow: 0 0 0 3px var(--tint);
	outline: 0;
}

.cosmos-auth .tutor-form-control::placeholder {
	color: var(--mut);
	opacity: 1;
}

.cosmos-auth .tutor-input-field.tutor-mb-8,
.cosmos-auth .tutor-input-field.tutor-mb-7 {
	margin-block-end: 16px !important;
}

/* التسجيل: الاسم الأول والأخير في صف واحد */
.cosmos-auth #tutor-registration-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	column-gap: 12px;
}

.cosmos-auth #tutor-registration-form > * {
	grid-column: 1 / -1;
}

.cosmos-auth #tutor-registration-form > .tutor-form-group:has(input[name="first_name"]),
.cosmos-auth #tutor-registration-form > .tutor-form-group:has(input[name="last_name"]) {
	grid-column: auto;
}

.cosmos-auth #tutor-registration-form label.tutor-block {
	margin-block-end: 6px !important;
}

/* «نسيت كلمة السر؟» رمادي Tutor بتباين 4.3، ونجمة الحقل الإلزامي في WooCommerce أحمر 3.8 (ق-026). */
.cosmos-auth a.tutor-btn-link-gray {
	color: var(--mut);
}

.cosmos-auth .required {
	color: var(--danger);
}

/* حقل الجوال (ق-029) */
.cosmos-phone-field {
	margin-block-end: 16px;
}

.cosmos-phone-field input[type="tel"] {
	text-align: start;
}

.cosmos-phone-field__hint {
	margin-block: 6px 0;
	font-size: 13px;
	line-height: 1.6;
	color: var(--mut);
}

/* الأزرار والروابط */
.cosmos-auth .tutor-btn-primary,
.cosmos-auth .woocommerce-form-login__submit {
	min-height: 48px;
	font-size: 16px;
}

.cosmos-auth a.tutor-btn-link,
.cosmos-auth .woocommerce-LostPassword a {
	color: var(--bl);
	font-weight: 700;
	text-decoration: none;
}

.cosmos-auth .woocommerce-form-login__submit {
	width: 100%;
	margin-block-start: 8px;
}

/* اللوحة */
.cosmos-auth__panel {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-block: 44px;
	padding-inline: 40px;
	background-color: var(--bld);
	background-image:
		/* 4% لكل خط: عند تقاطع الخطين يبقى تباين نص اللوحة ≥ 4.5 (Codex م5.4). */
		linear-gradient(color-mix(in srgb, var(--band-ink) 4%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, var(--band-ink) 4%, transparent) 1px, transparent 1px);
	background-size: 26px 26px;
	color: var(--band-ink);
}

.cosmos-auth__panel .cosmos-wm {
	font-size: 30px;
	color: var(--sf);
}

.cosmos-auth__panel .cosmos-wm b {
	color: var(--band-acc);
}

.cosmos-auth__title {
	margin: 0;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.5;
	color: var(--sf);
}

.cosmos-auth__list {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cosmos-auth__list li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 15px;
	line-height: 1.7;
}

.cosmos-auth__list .cosmos-icon {
	flex: none;
	margin-block-start: 3px;
	color: var(--band-acc);
}

.cosmos-auth__help,
.cosmos-auth__help:visited {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-block-start: auto;
	padding-block-start: 18px;
	border-block-start: 1px solid color-mix(in srgb, var(--band-ink) 25%, transparent);
	color: var(--sf);
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
}

.cosmos-auth__help:hover,
.cosmos-auth__help:focus-visible {
	color: var(--band-acc);
}

@media (max-width: 921px) {
	.cosmos-auth {
		grid-template-columns: 1fr;
		margin-block: 24px 48px;
		margin-inline: 16px;
	}

	.cosmos-auth__form {
		padding-block: 28px;
		padding-inline: 20px;
	}

	/* الجوال: النموذج أولاً، واللوحة شريط مختصر تحته بلا عنوان. */
	.cosmos-auth__panel {
		gap: 12px;
		padding-block: 22px;
		padding-inline: 20px;
	}

	.cosmos-auth__panel .cosmos-wm,
	.cosmos-auth__title {
		display: none;
	}

	.cosmos-auth__list li {
		font-size: 14px;
	}
}

@media (max-width: 340px) {
	.cosmos-auth #tutor-registration-form {
		grid-template-columns: 1fr;
	}

	.cosmos-auth #tutor-registration-form > .tutor-form-group:has(input[name="first_name"]),
	.cosmos-auth #tutor-registration-form > .tutor-form-group:has(input[name="last_name"]) {
		grid-column: 1 / -1;
	}
}

/* ==========================================================================
   م5.5 — لوحة الطالب (ق-034). التصميم المعتمد: docs/m5-5/dashboard-prototype.html
   ========================================================================== */
.entry-content .cd a {
	text-decoration: none;
}

.cd {
	width: 100%;
	margin-block: 28px 72px;
	display: grid;
	grid-template-columns: 250px minmax(0,1fr);
	gap: 24px;
	align-items: start;
}

.cd>* {
	min-width: 0;
}

.cd-side {
	position: sticky;
	top: 96px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 18px 14px;
	border-radius: 18px;
	color: var(--band-ink);
	background-color: var(--bld);
	background-image: linear-gradient(color-mix(in srgb,var(--band-ink) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--band-ink) 4%,transparent) 1px,transparent 1px);
	background-size: 26px 26px;
}

.cd-user {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 4px;
	padding: 6px 0 14px;
	border-bottom: 1px solid color-mix(in srgb,var(--band-ink) 22%,transparent);
}

.cd-ava {
	width: 56px;
	height: 56px;
	border-radius: 16px;
	background: var(--tint-free);
	color: var(--tl);
	display: grid;
	place-items: center;
	font-weight: 800;
	font-size: 20px;
	margin-block-end: 4px;
}

.cd-user b {
	font-size: 16px;
	color: var(--sf);
}

.cd-user small {
	font-size: 13px;
}

.cd-nav {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cd-nav a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-radius: 12px;
	color: var(--band-ink);
	font-size: 15px;
}

.cd-nav a:hover {
	background: color-mix(in srgb,var(--sf) 10%,transparent);
	color: var(--sf);
}

.cd-nav a[aria-current] {
	background: var(--tint-free);
	color: var(--bld);
	font-weight: 700;
}

.cd-nav .cd-count {
	margin-inline-start: auto;
	background: var(--badge-live-bg);
	color: var(--badge-live-ink);
	border-radius: 999px;
	padding: 0 8px;
	font-size: 12px;
	font-weight: 700;
}

.cd-nav .cd-out {
	margin-block-start: 6px;
	border-top: 1px solid color-mix(in srgb,var(--band-ink) 22%,transparent);
	border-radius: 0;
	padding-top: 14px;
}

.cd-tip {
	padding: 14px;
	border-radius: 14px;
	background: color-mix(in srgb,var(--sf) 8%,transparent);
}

.cd-tip b {
	display: block;
	color: var(--sf);
	font-size: 15px;
	margin-block-end: 4px;
}

.cd-tip p {
	margin: 0 0 8px;
	font-size: 13.5px;
	line-height: 1.7;
}

.cd-tip a {
	color: var(--band-acc);
	font-weight: 700;
	font-size: 14px;
}

.cd-main {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.cd-top .cosmos-eyebrow {
	margin-block-end: 6px;
}

.cd-top h1 {
	margin: 0 0 4px;
	font-size: clamp(24px,3vw,34px);
	font-weight: 800;
	color: var(--bld);
	line-height: 1.35;
}

.cd-top p {
	margin: 0;
	color: var(--mut);
	font-size: 15px;
}

.cd-stats {
	display: grid;
	grid-template-columns: repeat(4,minmax(0,1fr));
	gap: 14px;
}

.cd-stat {
	background: var(--sf);
	border: 1px solid var(--ln);
	border-radius: 16px;
	padding: 16px 18px;
}

.cd-stat .cd-ic {
	width: 34px;
	height: 34px;
	border-radius: 10px;
	display: grid;
	place-items: center;
	background: var(--tint);
	color: var(--bl);
	margin-block-end: 10px;
}

.cd-stat b {
	display: block;
	font-size: 28px;
	font-weight: 800;
	color: var(--bld);
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
}

.cd-stat span {
	font-size: 13.5px;
	color: var(--mut);
}

.cd-grid {
	display: grid;
	grid-template-columns: minmax(0,1.6fr) minmax(0,1fr);
	gap: 20px;
	align-items: start;
}

.cd-col {
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-width: 0;
}

/* بيانات الطالب (ق-055): سؤال الموافقة في اللوحة، وحقلا الميلاد والموافقة في التسجيل و«ملفي». */
.cd-consent-ask__btns {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.cd-consent-ask__btns form {
	margin: 0;
}

.cosmos-sd-field {
	margin-block-end: 16px;
}

.cosmos-sd-consent label {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-weight: 400;
	line-height: 1.6;
}

.cosmos-sd-consent input {
	margin-block-start: 5px;
}

/* «ملفي»: ربط حساب Google (ق-053). */
.cosmos-google-row {
	margin-block-end: 22px;
	padding: 14px 18px;
	border: 1px solid var(--ln);
	border-radius: var(--radius-sm);
}

.cosmos-google-row p {
	margin-block: 4px 10px;
	font-size: 14px;
	color: var(--mut);
}

.cosmos-google-row .cosmos-google {
	align-items: flex-start;
	margin: 0;
}

/* شريط «أضف رقم جوالك» — حساب بلا جوال (ق-053). */
.cd-phone-ask {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-block-end: 20px;
	padding: 14px 18px;
	border: 1px solid var(--ln);
	border-inline-start: 4px solid var(--bl);
	border-radius: var(--radius-sm);
	background: var(--tint);
	font-size: 15px;
	color: var(--ink);
}

.cd-card {
	background: var(--sf);
	border: 1px solid var(--ln);
	border-radius: 18px;
	padding: 20px 22px;
}

.cd-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-block-end: 12px;
}

.cd-head h2 {
	margin: 0;
	font-size: 19px;
	font-weight: 800;
	color: var(--bld);
}

.cd-head a {
	font-size: 14px;
	font-weight: 700;
	color: var(--bl);
}

.cd-head small {
	font-size: 13px;
	color: var(--mut);
}

.cd-resume {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	gap: 22px;
	padding: 26px;
	border-radius: 20px;
	color: var(--band-ink);
	background: linear-gradient(135deg,var(--bld),color-mix(in srgb,var(--bld) 70%,var(--tl)));
}

.cd-resume::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: linear-gradient(color-mix(in srgb,var(--band-ink) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--band-ink) 5%,transparent) 1px,transparent 1px);
	background-size: 26px 26px;
}

.cd-resume>* {
	position: relative;
}

.cd-resume .cosmos-eyebrow {
	color: var(--band-acc);
}

.cd-resume h2 {
	margin: 6px 0;
	font-size: clamp(20px,2.4vw,26px);
	font-weight: 800;
	color: var(--sf);
	line-height: 1.4;
}

.cd-resume p:not(.cosmos-eyebrow) {
	margin: 0 0 16px;
	font-size: 14.5px;
}

.cd-ring {
	flex: none;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	text-align: center;
	background: conic-gradient(var(--band-acc) calc(var(--p)*1%),color-mix(in srgb,var(--band-ink) 18%,transparent) 0);
}

.cd-ring span {
	width: 76px;
	height: 76px;
	border-radius: 50%;
	display: grid;
	place-content: center;
	background: var(--bld);
	color: var(--sf);
	font-weight: 800;
	font-size: 20px;
	line-height: 1.1;
}

.cd-ring small {
	font-size: 11.5px;
	font-weight: 500;
	color: var(--band-ink);
}

.cd-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-radius: var(--radius-btn);
	background: var(--bl);
	color: var(--sf);
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
}

.cd-btn:hover {
	background: var(--bld);
	color: var(--sf);
}

.cd-btn--light {
	background: var(--tint-free);
	color: var(--bld);
}

.cd-btn--light:hover {
	background: var(--sf);
	color: var(--bld);
}

.cd-btn--wa {
	background: var(--wa-d);
	color: var(--sf);
}

.cd-btn--wa:hover {
	background: color-mix(in srgb, var(--wa-d) 85%, var(--ink));
	color: var(--sf);
}

.cd-course {
	display: grid;
	grid-template-columns: 76px minmax(0,1fr) auto;
	gap: 14px;
	align-items: center;
	padding: 14px 0;
	border-top: 1px solid var(--ln);
	color: var(--ink);
}

.cd-course:first-of-type {
	border-top: 0;
	padding-top: 4px;
}

.cd-thumb {
	width: 76px;
	height: 56px;
	border-radius: 12px;
	overflow: hidden;
}

.cd-thumb .cosmos-cover {
	padding: 4px;
}

.cd-thumb .cosmos-cover__label {
	font-size: 13px;
}

.cd-cat {
	display: block;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--tl);
}

.cd-course b {
	display: block;
	margin: 2px 0 8px;
	font-size: 15.5px;
}

.cd-prog {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	color: var(--mut);
	font-variant-numeric: tabular-nums;
}

.cd-bar {
	flex: 1;
	height: 7px;
	border-radius: 99px;
	background: var(--tint);
	overflow: hidden;
}

.cd-bar span {
	display: block;
	height: 100%;
	border-radius: 99px;
	background: var(--bl);
}

.cd-bar.done span {
	background: var(--tl);
}

.cd-go {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	border: 1px solid var(--ln);
	color: var(--bl);
}

.cd-course:hover .cd-go {
	background: var(--tint);
	border-color: var(--tint);
}

.cd-order {
	display: grid;
	grid-template-columns: minmax(0,1fr) auto auto;
	gap: 6px 14px;
	align-items: center;
	padding: 14px 0;
	border-top: 1px solid var(--ln);
}

.cd-order:first-of-type {
	border-top: 0;
	padding-top: 2px;
}

.cd-order b {
	display: block;
	font-size: 15px;
	color: var(--ink);
}

.cd-order small {
	font-size: 13px;
	color: var(--mut);
}

.cd-amt {
	font-weight: 700;
	color: var(--ink);
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.cd-st {
	display: inline-block;
	padding: 3px 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
}

.cd-st--ok {
	background: var(--badge-free-bg);
	color: var(--badge-free-ink);
}

.cd-st--wait {
	background: var(--badge-live-bg);
	color: var(--badge-live-ink);
}

.cd-st--off {
	background: var(--tint);
	color: var(--mut);
}

.cd-wait {
	grid-column: 1/-1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-block-start: 6px;
	padding: 12px 14px;
	border-radius: 12px;
	background: var(--badge-live-bg);
	color: var(--badge-live-ink);
	font-size: 14px;
}

.cd-step {
	display: grid;
	grid-template-columns: 40px minmax(0,1fr) auto;
	gap: 12px;
	align-items: center;
	padding: 12px 0;
	border-top: 1px solid var(--ln);
	color: var(--ink);
}

.cd-step:first-of-type {
	border-top: 0;
	padding-top: 2px;
}

.cd-step .n {
	width: 40px;
	height: 40px;
	border-radius: 12px;
	display: grid;
	place-items: center;
	background: var(--tint);
	color: var(--bl);
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}

.cd-step b {
	display: block;
	font-size: 14.5px;
}

.cd-step small {
	font-size: 12.5px;
	color: var(--mut);
}

.cd-step .cosmos-icon {
	color: var(--mut);
}

.cd-ask {
	background: var(--tint-free);
	border-color: var(--strip-ln);
}

.cd-ask p {
	margin: 0 0 12px;
	font-size: 14.5px;
}

.cd-q {
	padding: 10px 0;
	border-top: 1px solid var(--strip-ln);
}

.cd-q b {
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: var(--ink);
}

.cd-q small {
	font-size: 12.5px;
	color: var(--mut);
}

.cd-help p {
	margin: 0 0 12px;
	font-size: 14.5px;
	color: var(--mut);
}

@media (max-width:1100px) {
	.cd-stats {
		grid-template-columns: repeat(2,minmax(0,1fr));
	}

	.cd-grid {
		grid-template-columns: minmax(0,1fr);
	}
}

@media (max-width:921px) {
	.cd {
		grid-template-columns: minmax(0,1fr);
		margin-block-start: 16px;
		gap: 16px;
	}

	.cd-side {
		position: static;
		padding: 12px;
	}

	.cd-user,.cd-tip {
		display: none;
	}

	.cd-nav {
		flex-direction: row;
		overflow-x: auto;
		gap: 6px;
		scrollbar-width: none;
	}

	.cd-nav a {
		white-space: nowrap;
		padding: 8px 14px;
		border-radius: 999px;
		font-size: 14px;
	}

	.cd-nav .cd-out {
		margin: 0;
		border-top: 0;
		padding-top: 8px;
	}
}

@media (max-width:544px) {
	.cd-stat {
		padding: 12px 14px;
	}

	.cd-stat b {
		font-size: 24px;
	}

	.cd-resume {
		flex-direction: column;
		align-items: flex-start;
		padding: 20px;
	}

	.cd-ring {
		width: 76px;
		height: 76px;
	}

	.cd-ring span {
		width: 60px;
		height: 60px;
		font-size: 17px;
	}

	.cd-card {
		padding: 16px;
	}

	.cd-course {
		grid-template-columns: 60px minmax(0,1fr) auto;
	}

	.cd-thumb {
		width: 60px;
		height: 46px;
	}

	.cd-order {
		grid-template-columns: minmax(0,1fr) auto;
	}

	.cd-order .cd-st {
		grid-column: 1/-1;
		justify-self: start;
	}
}

/* الصفحة: خلفية الموقع ونصه — لا سطح Tutor الداكن (data-tutor-theme) */
body.cosmos-dash,
body.cosmos-dash #content {
	background-color: var(--pg);
	color: var(--ink);
}

.cd {
	color: var(--ink);
}

/* حالات فارغة */
.cd-empty {
	padding-block: 18px;
	text-align: center;
}

.cd-empty p {
	margin: 0 0 14px;
	color: var(--mut);
	font-size: 15px;
}

/* سطر الطلب: الاسم رابط لتفاصيل الطلب */
.cd-order__name {
	color: var(--ink);
}

.cd-order__name:hover b {
	color: var(--bl);
}

/* السؤال كله رابط للكورس */
a.cd-q {
	display: block;
	color: var(--ink);
}

.cd-ask .cd-empty {
	text-align: start;
	padding-block: 6px 0;
}

/* «ملفي»: نموذج تفاصيل الحساب من WooCommerce بشكل حقول كوسموس */
.cd-profile form .form-row {
	margin-block: 0 14px;
	padding: 0;
}

.cd-profile .woocommerce-Input,
.cd-profile input.input-text {
	width: 100%;
	min-height: 46px;
	border: 1px solid var(--ln);
	border-radius: 10px;
	background: var(--field);
	color: var(--ink);
	font-family: inherit;
	font-size: 16px;
}

.cd-profile .woocommerce-Input:focus,
.cd-profile input.input-text:focus {
	border-color: var(--bl);
	box-shadow: 0 0 0 3px var(--tint);
	outline: 0;
}

.cd-profile fieldset {
	margin-block: 18px 0;
	padding: 16px 18px 4px;
	border: 1px solid var(--ln);
	border-radius: 14px;
}

.cd-profile legend {
	padding-inline: 6px;
	font-weight: 700;
	color: var(--bld);
}

.cd-profile em,
.cd-profile .cosmos-phone-field__hint {
	display: block;
	margin-block-start: 4px;
	font-size: 13px;
	font-style: normal;
	color: var(--mut);
}

.cd-profile.woocommerce form .form-row .required,
.cd-profile .required {
	color: var(--danger);
}

.cd-profile button[type="submit"] {
	min-height: 46px;
	padding-inline: 24px;
	font-size: 16px;
}

.cd-profile .woocommerce-message,
.cd-profile .woocommerce-error {
	margin-block: 0 16px;
	border-radius: 12px;
}

/* خطوط Tutor (أسماؤها في متغيراته) = Tajawal المحلي — خط Inter من Google لا يُحمَّل (cosmos_frame_drop_tutor_google_font). */
:root {
	--tutor-font-family-body: "Tajawal";
	--tutor-font-family-heading: "Tajawal";
}

/* لوحة الطالب: Astra يعطي #primary هامشاً علوياً كبيراً — اللوحة تبدأ قرب الهيدر. */
body.cosmos-dash.ast-plain-container.ast-no-sidebar #primary,
body.cosmos-dash #primary {
	margin-block: 0;
}

.cd {
	margin-block-start: 20px;
}

/* «ملفي»: زر «إظهار كلمة المرور» من WooCommerce يأخذ لون أزرار الموقع بلا أيقونته (خط WooCommerce غير محمَّل هنا) —
   يصبح زر عين شفافاً داخل الحقل. */
.cd-profile .password-input {
	position: relative;
	display: block;
}

.cd-profile .show-password-input {
	position: absolute;
	inset-block-start: 50%;
	inset-inline-end: 10px;
	width: 32px;
	height: 32px;
	min-height: 0;
	padding: 0;
	border: 0;
	background: transparent;
	transform: translateY(-50%);
	cursor: pointer;
}

.cd-profile .show-password-input::after {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	margin: auto;
	background-color: var(--mut);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0'/%3E%3Cpath d='M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0'/%3E%3Cpath d='M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.cd-profile .show-password-input.display-password::after {
	background-color: var(--bl);
}

.cd-profile .show-password-input:hover,
.cd-profile .show-password-input:focus {
	background: transparent;
}

.cd-profile .password-input input {
	padding-inline-end: 48px;
}
   صفحة الكورس للطالب الملتحق — بطاقة «تقدّمك» (م5.9، cosmos_learning_enrolled_box)
   ========================================================================== */
.cl-enrolled .cl-eyebrow {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--tl);
	font-weight: 700;
	font-size: 13px;
}

.cl-enrolled .cl-eyebrow::before {
	content: "";
	height: 2px;
	width: 26px;
	background: currentColor;
}

.cl-enrolled__num {
	margin-top: 10px;
}

.cl-enrolled__num b {
	font-size: 32px;
	color: var(--bld);
}

.cl-enrolled__num small {
	font-size: 14px;
	color: var(--mut);
	margin-inline-start: 8px;
}

.cl-enrolled .cl-bar {
	display: block;
	height: 7px;
	border-radius: 9px;
	background: var(--tint);
	margin: 10px 0 8px;
	overflow: hidden;
}

.cl-enrolled .cl-bar > span {
	display: block;
	height: 100%;
	background: var(--tl);
	border-radius: 9px;
}

.cl-enrolled__cert {
	display: block;
	font-size: 12px;
	color: var(--live-d);
}

.cl-enrolled .cl-btn--block {
	display: flex;
	justify-content: center;
	margin-top: 18px;
	padding: 14px 18px;
	border-radius: 12px;
	background: var(--bl);
	color: var(--on-dk);
	font-weight: 700;
	font-size: 16px;
	text-decoration: none;
}

.cl-enrolled .cl-btn--block:hover {
	background: var(--bld);
	color: var(--on-dk);
}

.cl-enrolled__next {
	margin: 10px 0 0;
	font-size: 13px;
	color: var(--mut);
	text-align: center;
}

.cl-enrolled__next b {
	color: var(--ink);
}

/* ==========================================================================
   الشهادات (م5.11) — صفحة التحقق /verify/ و«شهاداتي» في لوحة الطالب
   ========================================================================== */
.cosmos-verify .site-content {
	background: var(--pg);
}

.cv {
	max-width: 760px;
	margin: 0 auto;
	padding: 36px 16px 64px;
}

.cv h1 {
	font-size: clamp(26px, 3vw, 38px);
	color: var(--bld);
	margin: 10px 0 6px;
	letter-spacing: -0.5px;
}

.cv-lead {
	color: var(--mut);
	margin: 0 0 20px;
}

.cv-form {
	display: flex;
	gap: 10px;
	margin-bottom: 22px;
}

.cv-form input {
	flex: 1;
	min-width: 0;
	padding: 12px 14px;
	border: 1px solid var(--ln);
	border-radius: 12px;
	background: var(--field);
	font: inherit;
	text-align: right;
}

.cv-form button,
.cc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: 0;
	border-radius: 12px;
	padding: 12px 22px;
	font-weight: 700;
	font-size: 15px;
	background: var(--bl);
	color: var(--on-dk);
	cursor: pointer;
	font-family: inherit;
	text-decoration: none;
}

.cv-form button:hover,
.cc-btn:hover {
	background: var(--bld);
	color: var(--on-dk);
}

.cc-btn--ghost {
	background: var(--sf);
	color: var(--bld);
	border: 1px solid var(--ln);
}

.cc-btn--ghost:hover {
	background: var(--tint);
	color: var(--bld);
}

.cv-card {
	background: var(--sf);
	border: 1px solid var(--ln);
	border-radius: 20px;
	overflow: hidden;
	margin-bottom: 14px;
}

.cv-status {
	display: flex;
	gap: 14px;
	align-items: center;
	padding: 20px 24px;
}

.cv-status i {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-style: normal;
	font-size: 24px;
	font-weight: 800;
	flex-shrink: 0;
	color: var(--on-dk);
}

.cv-status b {
	font-size: 20px;
	display: block;
}

.cv-status small {
	color: var(--mut);
	font-size: 14px;
}

.cv-ok {
	background: var(--tint-free);
}

.cv-ok i {
	background: var(--tl);
}

.cv-ok b {
	color: var(--tl-d);
}

.cv-bad {
	background: var(--danger-bg);
}

.cv-bad i {
	background: var(--danger);
}

.cv-bad b {
	color: var(--danger);
}

.cv-card dl {
	margin: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.cv-card dl > div {
	padding: 14px 24px;
	border-top: 1px solid var(--ln);
}

.cv-card dl > div:nth-child(odd) {
	border-inline-end: 1px solid var(--ln);
}

.cv-card dt {
	font-size: 12px;
	color: var(--mut);
}

.cv-card dd {
	margin: 2px 0 0;
	font-weight: 700;
}

.cv-card dd[dir="ltr"] {
	text-align: right;
}

.cv-note {
	font-size: 13px;
	color: var(--mut);
	margin-top: 14px;
}

/* «شهاداتي» */
.cc-alert {
	display: flex;
	gap: 14px;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 16px 18px;
	border-radius: 14px;
	background: var(--tint-live);
	color: var(--live-d);
	margin-bottom: 18px;
}

.cc-alert b {
	display: block;
}

.cc-certs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.cc-cert {
	background: var(--sf);
	border: 1px solid var(--ln);
	border-radius: 18px;
	overflow: hidden;
}

.cc-cert__thumb {
	height: 110px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--bld);
	background-image:
		linear-gradient(color-mix(in srgb, var(--on-dk) 6%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, var(--on-dk) 6%, transparent) 1px, transparent 1px);
	background-size: 20px 20px;
	color: var(--on-dk);
	font-weight: 800;
	letter-spacing: 3px;
	font-size: 13px;
}

.cc-cert__thumb span {
	border: 1px solid color-mix(in srgb, var(--on-dk) 35%, transparent);
	padding: 8px 14px;
	border-radius: 6px;
}

.cc-cert--pending {
	border-style: dashed;
}

.cc-cert--pending .cc-cert__thumb,
.cc-cert--revoked .cc-cert__thumb {
	background-color: var(--tint);
	color: var(--mut);
	letter-spacing: 0;
}

.cc-cert--pending .cc-cert__thumb span,
.cc-cert--revoked .cc-cert__thumb span {
	border-color: var(--ln);
}

.cc-cert__body {
	padding: 16px 18px;
}

.cc-cert__body h3 {
	margin: 0;
	font-size: 17px;
	line-height: 1.5;
}

.cc-cert__body small {
	color: var(--mut);
	font-size: 13px;
	display: block;
	margin-top: 2px;
}

.cc-cert__acts {
	display: flex;
	gap: 8px;
	margin-top: 14px;
	flex-wrap: wrap;
}

.cc-cert__acts .cc-btn {
	padding: 9px 14px;
	font-size: 14px;
}

.cc-cert__note {
	color: var(--danger);
	font-size: 13px;
	margin: 10px 0 0;
}

.cc-bar {
	display: block;
	height: 6px;
	border-radius: 9px;
	background: var(--tint);
	margin-top: 10px;
	overflow: hidden;
}

.cc-bar > span {
	display: block;
	height: 100%;
	background: var(--tl);
}

.cc-req {
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	color: var(--mut);
}

.cc-req li::before {
	content: "○ ";
}

.cc-req li.ok {
	color: var(--tl-d);
}

.cc-req li.ok::before {
	content: "✓ ";
	color: var(--tl);
}

@media (max-width: 760px) {
	.cc-certs,
	.cv-card dl {
		grid-template-columns: 1fr;
	}

	.cv-card dl > div:nth-child(odd) {
		border-inline-end: 0;
	}
}

/* ==========================================================================
   الوثائق القانونية — الشروط والأحكام وسياسة الخصوصية (م5.19)
   رأس، تبديل بين الوثيقتين، فهرس ثابت للبنود، وبنود مرقّمة. الفراغات المعلَّمة (cosmos-todo) تظهر حتى تُملأ.
   ========================================================================== */
.cosmos-legal {
	max-width: 1200px;
	margin-inline: auto;
	padding-block: 48px 72px;
	padding-inline: 24px;
}

.cosmos-legal__head {
	margin-block-end: 28px;
}

.cosmos-legal__head h1 {
	margin-block: 8px 6px;
	font-size: clamp(28px, 4.2vw, 42px);
	font-weight: 800;
	color: var(--bld);
}

.cosmos-legal__date {
	margin: 0 0 18px;
	font-size: 14px;
	color: var(--mut);
}

.cosmos-legal__switch {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.cosmos-legal__switch a {
	padding: 8px 18px;
	border: 1px solid var(--ln);
	border-radius: 999px;
	background: var(--sf);
	font-size: 14px;
	font-weight: 600;
	color: var(--ink);
}

.cosmos-legal__switch a[aria-current="page"] {
	border-color: var(--bl);
	background: var(--bl);
	color: var(--sf);
}

.cosmos-legal__grid {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 28px;
	align-items: start;
}

.cosmos-legal__toc {
	position: sticky;
	top: 96px;
	padding: 18px 18px 14px;
	border: 1px solid var(--ln);
	border-radius: 18px;
	background: var(--sf);
}

.cosmos-legal__toc b {
	display: block;
	margin-block-end: 8px;
	font-size: 14px;
	color: var(--bld);
}

.cosmos-legal__toc ol {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: cl;
}

.cosmos-legal__toc li {
	counter-increment: cl;
}

.cosmos-legal__toc a {
	display: flex;
	gap: 8px;
	padding-block: 5px;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--mut);
}

.cosmos-legal__toc a::before {
	content: counter(cl, decimal-leading-zero);
	min-width: 22px;
	font-weight: 700;
	color: var(--tl);
	font-variant-numeric: tabular-nums;
}

.cosmos-legal__toc a:hover {
	color: var(--bl);
}

.cosmos-legal__body {
	padding: 28px 32px;
	border: 1px solid var(--ln);
	border-radius: 20px;
	background: var(--sf);
}

.cosmos-legal__lead {
	margin: 0 0 18px;
	font-size: 16.5px;
	line-height: 1.9;
	color: var(--ink);
}

.cosmos-legal__note {
	margin: 0 0 18px;
	padding: 10px 14px;
	border-radius: 12px;
	background: var(--tint);
	font-size: 14px;
	color: var(--ink);
}

.cosmos-legal__sec {
	padding-block: 22px;
	border-top: 1px solid var(--ln);
	scroll-margin-top: 96px;
}

.cosmos-legal__sec h2 {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 12px;
	font-size: 19px;
	font-weight: 800;
	color: var(--bld);
}

.cosmos-legal__sec h2 span {
	display: inline-grid;
	place-items: center;
	min-width: 36px;
	height: 36px;
	border-radius: 10px;
	background: var(--tint);
	font-size: 14px;
	color: var(--bl);
	font-variant-numeric: tabular-nums;
}

.cosmos-legal__sec p,
.cosmos-legal__sec li {
	font-size: 15.5px;
	line-height: 1.9;
	color: var(--ink);
}

.cosmos-legal__sec p {
	margin: 0 0 10px;
}

.cosmos-legal__sec ul {
	margin: 0 0 10px;
	padding-inline-start: 22px;
}

.cosmos-legal__sec li {
	margin-block-end: 6px;
}

.cosmos-legal__sec li::marker {
	color: var(--tl);
}

.cosmos-todo {
	padding: 1px 6px;
	border: 1px dashed var(--badge-live-ink);
	border-radius: 6px;
	background: var(--badge-live-bg);
	color: var(--badge-live-ink);
	font-weight: 700;
}

.cosmos-legal__ask {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
	margin-block-start: 10px;
	padding: 18px 20px;
	border-radius: 16px;
	background: var(--tint);
}

.cosmos-legal__ask b {
	font-size: 16px;
	color: var(--bld);
}

.cosmos-legal__ask p {
	flex: 1 1 260px;
	margin: 0;
	font-size: 14.5px;
	color: var(--mut);
}

@media (max-width: 900px) {
	.cosmos-legal__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.cosmos-legal__toc {
		position: static;
	}

	.cosmos-legal__body {
		padding: 20px 18px;
	}
}

.cosmos-legal__toc a,
.cosmos-legal__switch a {
	text-decoration: none;
}