/* ============================================================
   معهد سمارت — Smart Institute
   ------------------------------------------------------------
   Direction: a floating card over a colour band. Generous
   rounding throughout; the softest geometry of the set.
   ============================================================ */

body.theme-smart { --sm-ink: #0d2233; --sm-line: #e3ebe0; }

body.theme-smart .btn,
body.theme-smart .form-control,
body.theme-smart input:not([type="checkbox"]):not([type="radio"]),
body.theme-smart select { border-radius: 14px !important; }

body.theme-smart .courselisting,
body.theme-smart .card {
    border-radius: 20px !important; border: 0 !important;
    box-shadow: 0 12px 30px rgba(13, 34, 51, .09) !important;
}

body.theme-smart .sm-hero { position: relative; padding-bottom: 60px; background: #fff; }

body.theme-smart .sm-hero-band {
    height: 300px;
    background:
        radial-gradient(760px 300px at 22% 0%, rgba(255,255,255,.28), transparent 60%),
        linear-gradient(120deg, var(--site-primary, #9ac43a), var(--site-accent, #003452));
}

body.theme-smart .sm-hero-card {
    background: #fff; border-radius: 26px; padding: 40px;
    box-shadow: 0 26px 60px rgba(13, 34, 51, .18);
    margin-top: -140px; position: relative; z-index: 2;
}

body.theme-smart .sm-hero-card h1 {
    font-size: 2.7rem; line-height: 1.18; font-weight: 800;
    color: var(--sm-ink); margin: 0 0 12px; max-width: 24ch;
}

body.theme-smart .sm-hero-card > p { color: #5a6e7d; font-size: 1.05rem; margin: 0 0 28px; max-width: 58ch; }

body.theme-smart .sm-hero-card form { display: flex; gap: 10px; max-width: 640px; }

body.theme-smart .sm-hero-card input {
    flex: 1; min-width: 0; border: 2px solid var(--sm-line);
    padding: 14px 18px; font-size: 1rem; background: #fbfdfa;
}
body.theme-smart .sm-hero-card input:focus { outline: none; border-color: var(--site-primary, #9ac43a); background: #fff; }

body.theme-smart .sm-hero-card button {
    border: 0; background: var(--site-primary, #9ac43a); color: #fff;
    padding: 0 26px; border-radius: 14px; font-size: 1.1rem;
}
body.theme-smart .sm-hero-card button:hover { background: var(--site-accent, #003452); }

body.theme-smart .sm-hero-foot {
    display: flex; justify-content: space-between; align-items: center;
    flex-wrap: wrap; gap: 14px; margin-top: 22px;
}

body.theme-smart .sm-hero-advanced { font-size: .9rem; color: var(--site-accent, #003452); text-decoration: underline; }

body.theme-smart .sm-hero-links { display: flex; flex-wrap: wrap; gap: 10px; }

body.theme-smart .sm-hero-links a {
    background: #f1f7ec; color: var(--sm-ink); padding: 10px 20px;
    border-radius: 999px; font-weight: 700; text-decoration: none; font-size: .9rem;
}
/* _brand.css بيفرض --site-primary على أي رابط عند الوقوف بـ !important،
   وهو نفس اللون اللي الخلفية بتتملي بيه — فالكلام كان بيختفي. */
body.theme-smart .sm-hero-links a:hover { background: var(--site-primary, #9ac43a); --link-hover-ink: #fff; }

@media (max-width: 991px) {
    body.theme-smart .sm-hero-band { height: 230px; }
    body.theme-smart .sm-hero-card { margin-top: -110px; padding: 24px; border-radius: 20px; }
    body.theme-smart .sm-hero-card h1 { font-size: 1.85rem; }
    body.theme-smart .sm-hero-card form { flex-direction: column; }
    body.theme-smart .sm-hero-card button { padding: 14px; }
}

/* ============================================================
   تباين الشريط العلوي
   ------------------------------------------------------------
   The shared repaint puts --site-primary behind the top bar and
   the copyright strip, which works for the darker institutes but
   leaves white text on a light ground here. Those two bands take
   the accent instead, which is the darker of this institute's
   two colours.
   ============================================================ */
body.theme-smart #dt-top-section,
body.theme-smart .dt-top-section-wrap,
body.theme-smart #dt-copyright-section {
    background: var(--site-accent, #003452) !important;
}

/* ── الأقسام: بطاقات طافية شديدة الاستدارة ── */
body.theme-smart .inst-values { background: #f4f9f0; }
body.theme-smart .inst-tile { border: 0; border-radius: 22px; box-shadow: 0 10px 26px rgba(13,34,51,.09); }
body.theme-smart .inst-tile:hover { transform: translateY(-7px); box-shadow: 0 24px 48px rgba(13,34,51,.16); }
body.theme-smart .inst-tile-more { color: var(--site-accent, #003452); }
body.theme-smart .inst-values-list li { background: #fff; border-radius: 18px; padding: 22px; align-items: center; box-shadow: 0 6px 18px rgba(13,34,51,.06); }
body.theme-smart .inst-assoc-link { border-radius: 999px; padding: 14px 34px; }

/* ── الصور: شديدة الاستدارة مع وهج أخضر خفيف ── */
body.theme-smart .widget-icon,
body.theme-smart .common-banner-image,
body.theme-smart .course-image { border-radius: 20px; }
body.theme-smart .widget-icon::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(160deg, rgba(154,196,58,.30), transparent 58%);
}
body.theme-smart .widget-icon img { filter: saturate(1.1); }
/* ── القائمة: كبسولة ناعمة ── */
body.theme-smart .navbar-nav .nav-link.active { border-radius: 999px !important; }

/* ── الداخلية: أيقونة في بطاقة طافية على الجهة النهائية ── */
/* Icon at the far end, text still starting at the container edge.
   row-reverse put the icon right but pushed the text off the start,
   leaving a wide empty band of colour beside it. */
body.theme-smart .common-banner-icon { order: 2; margin-inline-start: auto; }
body.theme-smart .common-banner-text { order: 1; }
body.theme-smart .common-banner-icon {
    border-radius: 24px; box-shadow: 0 18px 42px rgba(0,0,0,.22); flex-basis: 120px; width: 120px; height: 120px;
}
body.theme-smart .common-banner-text h1 { font-weight: 800; }

/* ── الشريط العلوي: روابط ثم شريحة بريد مستديرة ── */
body.theme-smart .sm-topbar { background: var(--site-accent, #003452); color: #dfe9f0; font-size: .8rem; }
body.theme-smart .sm-topbar-inner { display: flex; align-items: center; gap: 22px; min-height: 40px; }
body.theme-smart .sm-topbar-links { gap: 22px; }
body.theme-smart .sm-topbar-links li.active a { color: var(--site-primary, #9ac43a); }
body.theme-smart .sm-topbar-pill {
    margin-inline-start: auto; background: var(--site-primary, #9ac43a); color: #fff !important;
    padding: 6px 18px; border-radius: 999px; font-weight: 700;
}
body.theme-smart .sm-topbar-pill:hover { opacity: 1; filter: brightness(1.08); }

/* ── الشريط العلوي: كبسولتان وقرار ── */
body.theme-smart .sm-topbar { background: var(--site-accent, #003452); color: #cfe0ec; }
body.theme-smart .sm-topbar-row { min-height: 46px; font-size: .82rem; }
body.theme-smart .sm-topbar-mail { color: #9fb9cb; }
body.theme-smart .sm-topbar-ghost {
    margin-inline-start: auto;
    border: 1px solid rgba(255,255,255,.3); padding: 7px 18px; border-radius: 999px; font-weight: 600;
}
body.theme-smart .sm-topbar-solid {
    background: var(--site-primary, #9ac43a); color: #fff;
    padding: 8px 20px; border-radius: 999px; font-weight: 700;
}
body.theme-smart .sm-topbar-ghost:hover,
body.theme-smart .sm-topbar-solid:hover { filter: brightness(1.12); opacity: 1; }
body.theme-smart .sm-topbar-lang { margin-inline-start: 0; }

/* ══════════════════════════════════════════════════════════
   القائمة الرئيسية — كبسولات وحقل بحث في الشريط
   The links are pills and the search is a field rather than an
   icon, so the one thing most visitors want is already open.
   ══════════════════════════════════════════════════════════ */
body.theme-smart nav.navbar { background: #fff; box-shadow: 0 2px 14px rgba(13,34,51,.07); }
body.theme-smart .navbar-nav { gap: 4px; }
body.theme-smart .navbar-nav > li > .nav-link {
    padding: 7px 14px !important; border-radius: 999px !important;
    font-size: .84rem; font-weight: 600;
}
body.theme-smart .navbar-nav > li > .nav-link.active {
    background: #eef6e4 !important; color: #4d7a12 !important;
}
/* كان فيه قاعدة هنا بتستهدف :nth-last-child(2) — بند "قبل الأخير"
   بترتيب معيّن، من قبل ما نضيف/نشيل بنود من منيو smart كذا مرة
   (More، All Cities، Online Courses...). الترتيب اتغيّر، فالقاعدة
   بقت بتضرب "Contact Us" بالغلط وتديله padding عريض (min-width:190px)
   مالوش لزوم لكلمتين قصيرين — فراغ واضح جنب الكلام. اتشالت، وبترجع
   "Contact Us" للشكل العادي لأي بند تاني في المنيو (سطر 162 فوق). */

/* حبر هذا الشريط: يستعمله الرابط ساكناً ومحوَّماً عليه سواء. */
body.theme-smart nav.navbar { --nav-ink: #0d2233; }

/* ── لوحة الدورات: كروت رأسية ──────────────────────────────── */
body.theme-smart .inst-mega { --inst-mega-line: #e4ebdc; }

body.theme-smart .inst-mega-grid {
    grid-template-columns: repeat(auto-fill, minmax(116px, 1fr));
    gap: 8px;
}

/* الأيقونة فوق والاسم تحتها — الكرت رأسي مش صف. */
body.theme-smart .inst-mega-card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 5px;
    padding: 10px 6px 8px;
    border: 1px solid var(--inst-mega-line);
    border-radius: 16px;
    background: #fff;
}

body.theme-smart .inst-mega-icon { width: 22px; height: 22px; }

body.theme-smart .inst-mega-name { flex: 0 0 auto; font-size: .73rem; line-height: 1.24; }

body.theme-smart .inst-mega-card:hover {
    background: #f6faf0;
    border-color: var(--site-primary, #9ac43a);
    box-shadow: 0 8px 20px rgba(90, 130, 30, .12);
}

body.theme-smart .inst-mega-n {
    background: var(--site-primary, #9ac43a);
    color: #23350a;
}

/* زرار اللغة: "عربي"/"ENGLISH" تتشال ويحل محلها علم دائري — طلب
   صريح. نفس تقنية gulf/plus بالحرف: النص يختفي (font-size:0)
   وعلم دائري بديل بـ::before. العلمين نفس ملفات gulf (مش صور
   خاصة بمؤسسة، أعلام دول عادية فمفيش داعي نكرر الملفات). */
body.theme-smart #dt-header-section .navbar-nav > li > .nav-link.custom-languagenew {
    padding-inline: 10px !important;
    display: inline-flex !important;
    align-items: center;
}
body.theme-smart #dt-header-section .navbar-nav > li > .nav-link.custom-languagenew span,
body.theme-smart #dt-header-section .navbar-nav > li > .nav-link.custom-languagenew b {
    font-size: 0 !important;
}
body.theme-smart #dt-header-section .navbar-nav > li > .nav-link.custom-languagenew::before {
    content: "";
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    flex: none;
}
/* صفحة إنجليزي: الرابط بيودّي للعربي — علم السعودية. */
body.theme-smart:not([dir="rtl"]) .navbar-nav > li > .nav-link.custom-languagenew::before {
    background-image: url(../../images/institutes/icons/gulf/flag-ar.png);
}
/* صفحة عربي: الرابط بيودّي للإنجليزي — علم بريطانيا. */
body.theme-smart[dir="rtl"] .navbar-nav > li > .nav-link.custom-languagenew::before {
    background-image: url(../../images/institutes/icons/gulf/flag-en.png);
}

/* بند "New" ياخد آخر مكان في الصف، قبل زرار اللغة مباشرة —
   بترتيب flex مش بتغيير مكانه في الـHTML (المنيو مشتركة مع المعهد). */
body.theme-smart .navbar-nav > li:has(> a > .blink) { order: 5; }
body.theme-smart .navbar-nav > li:has(> .nav-link.custom-languagenew) { order: 6; }

/* ══════════════════════════════════════════════════════════
   التذييل — نفس بنية البنر بالظبط (شريط لون + بطاقة عايمة)،
   بس في آخر الصفحة
   ------------------------------------------------------------
   .sm-hero-band/.sm-hero-card فوق الصفحة هي نفس فكرة "الاتجاه"
   المكتوبة أعلى الملف ده ("بطاقة عايمة فوق شريط لون، استدارة
   سخية"). التذييل بيعيد نفس الميكانيزم تحت الصفحة بدل ما يرجع
   للوحة غامقة بأعمدة زي باقي المعاهد — الصفحة بتفتح وتقفل بنفس
   الفكرة البصرية. الروابط شرائح (chips) مدوّرة زي .sm-hero-links
   بالظبط، مش أعمدة قوائم ولا خطوط فاصلة.
   ═══════════════════════════════════════════════════════════ */
body.theme-smart #dt-home-footer-section {
    padding: 0 0 60px;
    overflow: visible;
    background: #fff;
}

/* شريط اللون بعرض الشاشة كامل رغم إنه جوّه .container — نفس خدعة
   full-bleed اللي .sm-hero-band مستغنية عنها لأنها أصلاً برّه
   .container في البنر؛ هنا لازم نطلعها يدويًا. */
body.theme-smart .sm-footer-band {
    width: 100vw;
    margin-inline-start: calc(50% - 50vw);
    height: 210px;
    background:
        radial-gradient(760px 300px at 22% 0%, rgba(255,255,255,.28), transparent 60%),
        linear-gradient(120deg, var(--site-primary, #9ac43a), var(--site-accent, #003452));
}

body.theme-smart .sm-footer-card {
    background: #fff;
    border-radius: 26px;
    padding: 40px;
    box-shadow: 0 26px 60px rgba(13, 34, 51, .18);
    margin-top: -140px;
    position: relative;
    z-index: 2;
}

body.theme-smart .sm-footer-logo { margin-bottom: 22px; }
body.theme-smart .sm-footer-logo-img { max-width: 150px; height: auto; }

body.theme-smart .sm-footer-label {
    font-size: .74rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    font-weight: 700;
    color: #8598a3;
    margin: 26px 0 10px;
}
body.theme-smart .sm-footer-label:first-of-type { margin-top: 0; }

body.theme-smart .sm-footer-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
}

body.theme-smart .sm-footer-chip {
    background: #f1f7ec;
    color: var(--sm-ink, #0d2233);
    padding: 9px 18px;
    border-radius: 999px;
    font-weight: 700;
    font-size: .85rem;
    text-decoration: none;
    transition: background .16s ease, color .16s ease;
}
/* _brand.css بيفرض --site-primary على أي رابط عند الوقوف بـ!important
   وهو نفس لون الخلفية اللي هتتملي بيه الشريحة، فالكلام كان هيختفي —
   نفس الملاحظة الموجودة أصلاً في .sm-hero-links a:hover. */
body.theme-smart .sm-footer-chip:hover { background: var(--site-primary, #9ac43a); --link-hover-ink: #fff; }

body.theme-smart .sm-footer-chip--solid {
    background: var(--site-accent, #003452);
    color: #fff !important;
}
body.theme-smart .sm-footer-chip--solid:hover { background: var(--site-primary, #9ac43a); --link-hover-ink: #fff; }

@media (max-width: 767px) {
    body.theme-smart .sm-footer-band { height: 150px; }
    body.theme-smart .sm-footer-card { margin-top: -90px; padding: 24px; border-radius: 20px; }
}

/* ── المدن المتاحة — دوائر صور قابلة للتمرير ─────────────────
   مرجع: aztechtraining.com — صف أفقي بيتمرّر، كل مدينة دايرة
   صورة كاملة. أقصى درجة من لغة smart نفسها ("generous rounding...
   softest geometry"). تمرير أفقي عادي (overflow-x:auto)، مفيش
   جافاسكريبت مخصّص. */
body.theme-smart .sm-cities-row {
    display: flex;
    gap: 26px;
    overflow-x: auto;
    padding: 6px 2px 18px;
    scroll-snap-type: x proximity;
}
body.theme-smart .sm-cities-item {
    flex: none;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    text-decoration: none;
    width: 140px;
}
body.theme-smart .sm-cities-circle {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    box-shadow: 0 14px 28px rgba(13, 34, 51, .18);
    transition: transform .2s ease;
}
body.theme-smart .sm-cities-item:hover .sm-cities-circle { transform: scale(1.05); }
body.theme-smart .sm-cities-name { font-weight: 700; color: var(--sm-ink, #0d2233); font-size: .92rem; }
body.theme-smart .sm-cities-go { font-size: .78rem; color: var(--site-primary, #9ac43a); }

body.theme-smart .sm-cities-row::-webkit-scrollbar { height: 6px; }
body.theme-smart .sm-cities-row::-webkit-scrollbar-thumb { background: var(--sm-line, #e3ebe0); border-radius: 99px; }

/* ═══════════════════════════════════════════════════════════
   Categories — aztechtraining.com reference: a grid of rounded
   icon cards with a soft shadow, an "Explore Courses" caption.
   Reuses this theme's own floating-card recipe (22-26px radius,
   soft shadow, lift on hover — same as .inst-tile) instead of
   the shared site's flat red-circle-icon rows.
   ═══════════════════════════════════════════════════════════ */
body.theme-smart .sm-categories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}
body.theme-smart .sm-categories-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    background: #fff;
    border-radius: 22px;
    padding: 30px 20px;
    text-decoration: none;
    box-shadow: 0 10px 26px rgba(13, 34, 51, .09);
    transition: transform .2s ease, box-shadow .2s ease;
}
body.theme-smart .sm-categories-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 24px 48px rgba(13, 34, 51, .16);
}
body.theme-smart .sm-categories-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 999px;
    background: #f1f7ec;
}
body.theme-smart .sm-categories-badge img { width: 32px; height: 32px; object-fit: contain; }
body.theme-smart .sm-categories-title {
    font-weight: 700;
    color: var(--sm-ink, #0d2233);
    font-size: .98rem;
    line-height: 1.3;
}
body.theme-smart .sm-categories-go {
    font-size: .78rem;
    font-weight: 700;
    color: var(--site-primary, #9ac43a);
    text-transform: uppercase;
    letter-spacing: .04em;
}

@media (max-width: 991px) {
    body.theme-smart .sm-categories-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
    body.theme-smart .sm-categories-grid { grid-template-columns: 1fr; }
    body.theme-smart .sm-categories-card { padding: 24px 18px; }
}

/* ── التبويلز (الكروت الخدمية الثلاثة): شريط لوني بالتدرّج الأخضر
   للكحلي، عنوان جنبه، والكروت التلاتة عايمة عليه بيضا مستديرة —
   نفس لغة "كارت عايم فوق شريط لون" بتاعة سمارت (.sm-hero-card)،
   بس هنا الشريط نفسه ملوّن مش رمادي، وده جديد عن الكاتيجوريز
   (شبكة بيضا) والسيتيز (صف دوائر بيتمرر). ── */
body.theme-smart .sm-tiles { padding: 54px 0; }

body.theme-smart .sm-tiles-band {
    background: linear-gradient(120deg, var(--site-primary, #9ac43a) 0%, var(--site-accent, #003452) 100%);
    border-radius: 28px;
    padding: 44px 40px;
    display: flex;
    align-items: center;
    gap: 40px;
    flex-wrap: wrap;
}

body.theme-smart .sm-tiles-heading {
    flex: 1 1 220px;
    color: #fff;
    font-size: 1.7rem;
    font-weight: 800;
    margin: 0;
}

body.theme-smart .sm-tiles-grid {
    flex: 2 1 420px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

body.theme-smart .sm-tiles-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    background: #fff;
    border-radius: 18px;
    padding: 20px 18px;
    text-decoration: none;
    box-shadow: 0 10px 22px rgba(13, 34, 51, .16);
    transition: transform .18s ease, box-shadow .18s ease;
}
body.theme-smart .sm-tiles-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 30px rgba(13, 34, 51, .22);
}

body.theme-smart .sm-tiles-icon { width: 34px; height: 34px; object-fit: contain; }

/* أيقونتين من الأربعة (Online Training / New Training Courses) مالهاش
   ملف SVG مخصص لأي معهد غير المورد، فبتستخدم Bootstrap Icons (محمّلة
   أصلاً في templates/header.php) بدل ما نخترع أيقونة. i مش img، فمحتاجة
   عرض/مقاس مختلف عشان تتساوى بصريًا مع الأيقونتين التانيين. */
body.theme-smart .sm-tiles-icon--glyph {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--site-primary, #9ac43a);
    font-size: 1.05rem;
    color: #fff;
}

body.theme-smart .sm-tiles-label {
    font-weight: 700;
    font-size: .92rem;
    line-height: 1.3;
    color: var(--sm-ink, #0d2233);
}

body.theme-smart .sm-tiles-more {
    font-size: .74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--site-primary, #9ac43a);
}

@media (max-width: 767px) {
    body.theme-smart .sm-tiles-band { padding: 30px 22px; border-radius: 20px; }
    body.theme-smart .sm-tiles-grid { grid-template-columns: 1fr; }
}

/* ═══ التخصصات: كروت أصغر (طلب صريح 2026-09-05: "صغّر كروت الأقسام") ═══
   نفس الكارت الأبيض بالدايرة، بس 4 أعمدة بدل 3، حشو ودايرة وخط أصغر. */
body.theme-smart .sm-categories-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
body.theme-smart .sm-categories-card { padding: 16px 12px; gap: 7px; border-radius: 14px; box-shadow: 0 6px 16px rgba(13, 34, 51, .07); }
body.theme-smart .sm-categories-card:hover { transform: translateY(-4px); }
body.theme-smart .sm-categories-badge { width: 44px; height: 44px; }
body.theme-smart .sm-categories-badge img { width: 22px; height: 22px; }
body.theme-smart .sm-categories-title { font-size: .84rem; }
body.theme-smart .sm-categories-go { font-size: .7rem; }
@media (max-width: 991px) { body.theme-smart .sm-categories-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { body.theme-smart .sm-categories-grid { grid-template-columns: 1fr 1fr; } body.theme-smart .sm-categories-card { padding: 14px 10px; } }

/* ═══ الدورات القادمة (افتراضية) — سمارت: بلاطات زجاجية (طلب صريح 2026-09-05) ═══
   3 بلاطات في الصف، صورة الدورة فوق وعليها بادج تاريخ ليموني، جسم أبيض
   بزوايا كبيرة، عنوان كحلي، شرائح تفاصيل ليموني فاتحة، وزر كحلي. عند التحويم
   البلاطة بتعلى وظل ليموني. */
body.theme-smart .inst-upcoming-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
body.theme-smart .inst-upcoming-list li { border: 0 !important; }
body.theme-smart .inst-upcoming-list a { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 8px 24px rgba(13,34,51,.08); height: 100%; position: relative; transition: transform .18s, box-shadow .18s; }
body.theme-smart .inst-upcoming-list a:hover { background: #fff; transform: translateY(-5px); box-shadow: 0 18px 36px rgba(154,196,58,.35); }
body.theme-smart .inst-upcoming-thumb { display: block; height: 140px; background-size: cover; background-position: center; }
body.theme-smart .inst-upcoming-date { position: absolute; top: 12px; inset-inline-start: 12px; width: auto; height: auto; padding: 6px 12px; border-radius: 999px; flex-direction: row; gap: 6px; align-items: baseline; background: var(--site-primary, #9ac43a); color: #0d2233; }
body.theme-smart .inst-upcoming-day { font-size: 1.05rem; }
body.theme-smart .inst-upcoming-month { opacity: 1; font-weight: 700; }
body.theme-smart .inst-upcoming-body { padding: 16px 18px 18px; gap: 8px; }
body.theme-smart .inst-upcoming-title { color: var(--sm-ink, #0d2233); min-height: 2.8em; }
body.theme-smart .inst-upcoming-city { color: var(--site-accent, #003452); }
body.theme-smart .inst-upcoming-meta2 { display: flex; flex-wrap: wrap; gap: 6px; }
body.theme-smart .inst-upcoming-meta2 span { font-size: .72rem; padding: 4px 10px; border-radius: 999px; background: #f1f7ec; color: var(--site-accent, #003452); }
body.theme-smart .inst-upcoming-meta2 i { margin-inline-end: 4px; }
body.theme-smart .inst-upcoming-book { display: inline-block; align-self: flex-start; margin-top: 4px; padding: 8px 18px; border-radius: 999px; background: var(--site-accent, #003452); color: #fff; font-size: .78rem; font-weight: 700; }
@media (max-width: 991px) { body.theme-smart .inst-upcoming-list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { body.theme-smart .inst-upcoming-list { grid-template-columns: 1fr; } }

/* الدورات القادمة: كروت أصغر (طلب صريح 2026-09-06) */
body.theme-smart .inst-upcoming-list { grid-template-columns: repeat(4, 1fr); gap: 14px; }
body.theme-smart .inst-upcoming-thumb { height: 104px; }
body.theme-smart .inst-upcoming-list a { border-radius: 14px; }
body.theme-smart .inst-upcoming-body { padding: 12px 14px 14px; gap: 6px; }
body.theme-smart .inst-upcoming-title { font-size: .88rem; min-height: 2.6em; }
body.theme-smart .inst-upcoming-meta { font-size: .78rem; }
body.theme-smart .inst-upcoming-meta2 span { font-size: .66rem; padding: 3px 8px; }
body.theme-smart .inst-upcoming-book { padding: 6px 14px; font-size: .74rem; }
@media (max-width: 991px) { body.theme-smart .inst-upcoming-list { grid-template-columns: repeat(2, 1fr); } }

/* ===== /training-courses — سمارت: بانر مقسوم كحلي/أخضر بصورة على الجنب، شريط فلتر أخضر، كروت أفقية 3 أعمدة (صورة على الجنب) (2026-09-07) ===== */
body.theme-smart.pg-training-courses #common-banner-section-image .background-listing{background:linear-gradient(112deg,#003452 0,#003452 62%,#9ac43a 62.2%);color:#fff;border-radius:0}
body.theme-smart.pg-training-courses #common-banner-section-image .background-listing:before{display:none}
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-section-box{display:flex;align-items:center;gap:40px}
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-image{position:static;float:none;order:2;flex:none;width:280px;padding:0;border:5px solid #fff;border-radius:16px;overflow:hidden;box-shadow:0 16px 36px rgba(0,0,0,.25);margin:0;background:#fff}
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text{float:none;width:auto;flex:1;max-width:760px;text-align:start}
body.theme-smart.pg-training-courses #common-banner-section-image h1{color:#fff;font-size:34px}
body.theme-smart.pg-training-courses #common-banner-section-image p{color:#dbe6ea;text-align:start}
body.theme-smart.pg-training-courses #searresultscourses-btn2{background:#9ac43a;border-color:#9ac43a;color:#0d2233;border-radius:30px;font-weight:700;padding:8px 22px}
body.theme-smart.pg-training-courses #common-filter-box-modal-one{margin-top:0;padding:0}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .box2{background:#9ac43a;border-radius:0;box-shadow:none;padding:12px 16px}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .form-control{background:#fff;border:0;border-inline-start:4px solid #003452;border-radius:0;height:36px;color:#0d2233}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two{background:transparent;border:1px solid #0d2233;color:#0d2233;border-radius:0}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two:hover{background:#0d2233;color:#fff}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two.purple-color{background:#003452;border-color:#003452;color:#fff}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting,body.theme-smart.pg-training-courses .courselist-style-inside .courselisting.virtual{display:grid;grid-template-columns:42% 1fr;column-gap:14px;background:#fff;border:1px solid #e3ebe0;border-radius:14px;padding:0;overflow:hidden;box-shadow:none;transition:box-shadow .25s,border-color .25s}
body.theme-smart.pg-training-courses .courselisting:hover{box-shadow:0 14px 30px rgba(0,52,82,.14);border-color:#9ac43a}
body.theme-smart.pg-training-courses .courselisting .space5,body.theme-smart.pg-training-courses .courselisting .space15{display:none}
body.theme-smart.pg-training-courses .course-image{grid-row:1/8;border:0;border-radius:0;height:100%;min-height:190px;background:#f1f7ec}
body.theme-smart.pg-training-courses .course-image img{height:100%;object-fit:cover;transition:transform .4s}
body.theme-smart.pg-training-courses .courselisting:hover .course-image img{transform:scale(1.05)}
body.theme-smart.pg-training-courses .course-image-vl-icon{background:#003452}
body.theme-smart.pg-training-courses .course-title{font-size:15px;line-height:20px;min-height:40px;color:#003452;padding:14px 12px 6px 0}
body[dir="rtl"].theme-smart.pg-training-courses .course-title{padding:14px 0 6px 12px}
body.theme-smart.pg-training-courses .course-date,body.theme-smart.pg-training-courses .course-language,body.theme-smart.pg-training-courses .course-location,body.theme-smart.pg-training-courses .course-time{padding-inline-end:12px;color:#4a5a50;font-size:12.5px;line-height:20px}
body.theme-smart.pg-training-courses .courselisting i.bi{color:#9ac43a!important}
body.theme-smart.pg-training-courses .courselisting form{padding:10px 12px 12px 0}
body[dir="rtl"].theme-smart.pg-training-courses .courselisting form{padding:10px 0 12px 12px}
body.theme-smart.pg-training-courses .courselisting .btn-primary{background:#9ac43a;border-color:#9ac43a;color:#0d2233;border-radius:30px;font-weight:700}
body.theme-smart.pg-training-courses .courselisting:hover .btn-primary{background:#003452;border-color:#003452;color:#fff}
@media (min-width:992px){body.theme-smart.pg-training-courses #course_list{grid-template-columns:repeat(3,1fr);gap:20px}}
@media (max-width:991px){body.theme-smart.pg-training-courses #course_list{grid-template-columns:1fr}}
@media (max-width:767px){body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-section-box{flex-direction:column}body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-image{order:0;width:100%}}

/* --- training-courses fix 158d300cc6dd889a8ca51cc05e7bae60 --- */
body.theme-smart.pg-training-courses #common-banner-section-image{background:linear-gradient(112deg,#003452 0,#003452 62%,#9ac43a 62.2%)}
body.theme-smart.pg-training-courses #common-banner-section-image::before{display:none}
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-section-box{align-items:center;gap:40px;padding:30px 0}
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text{max-width:760px}
body.theme-smart.pg-training-courses #searresultscourses-btn2{background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two.purple-color{background:#003452!important;border-color:#003452!important;color:#fff!important}
body.theme-smart.pg-training-courses .courselisting .btn-primary{background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important}
body.theme-smart.pg-training-courses .courselisting:hover .btn-primary{background:#003452!important;border-color:#003452!important;color:#fff!important}

/* --- training-courses fix 464e8d0de9c36da3223140511c637ab0 --- */
body[dir="rtl"].theme-smart.pg-training-courses #common-banner-section-image{background:linear-gradient(248deg,#003452 0,#003452 62%,#9ac43a 62.2%)}
/* الصورة تملأ ارتفاع الكارت الأفقي، والعنوان ما يتداخلش مع التاريخ */
body.theme-smart.pg-training-courses .course-image{position:relative;height:auto;min-height:0}
body.theme-smart.pg-training-courses .course-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body.theme-smart.pg-training-courses .course-title{padding-bottom:0;margin-bottom:6px;min-height:0;max-height:40px}

/* --- training-courses fix 768b2419de98c997952c1e553cf1fefc --- */
/* العنوان سطرين كاملين (max-height كان بيحسب مع الـpadding العلوي) */
body.theme-smart.pg-training-courses .course-title{max-height:none}

/* --- training-courses fix e6ae24f33f2811ef5126c0f85ae5140d --- */
/* أيقونات بيانات الكارت الخاصة بالمعهد (طلب 2026-09-07): calendar4-event / chat-left-text / laptop / pin-angle-fill / cup-hot */
body.theme-smart.pg-training-courses .course-date .bi-calendar-check-fill::before{content:"\f215"}
body.theme-smart.pg-training-courses .course-language .bi-flag-fill::before{content:"\f252"}
body.theme-smart.pg-training-courses .course-language .bi-bookmarks-fill::before{content:"\f456"}
body.theme-smart.pg-training-courses .course-location .bi-signpost-split-fill::before{content:"\f4ea"}
body.theme-smart.pg-training-courses .course-time .bi-signpost-split-fill::before{content:"\f7eb"}

/* --- training-courses fix b57a69d618c587d8a8531c3dfdff6a93 --- */
/* (2026-09-07) "الصورة صغيرة ولو كبرت هتبكسل": صور الدورات الأصلية 237×158 فقط، فالكارت اتضغط لارتفاع ≈160px عشان الصورة تملاه بالكامل بدون تكبير يذكر؛ .img-responsive في fullcss بتفرض height:auto!important فلزم !important */
body.theme-smart.pg-training-courses .course-image img{height:100%!important}
body.theme-smart.pg-training-courses .course-title{font-size:.88rem;line-height:18px;min-height:0;max-height:none;padding:10px 12px 4px 0;margin:0}
body[dir="rtl"].theme-smart.pg-training-courses .course-title{padding:10px 0 4px 12px}
body.theme-smart.pg-training-courses .course-date,body.theme-smart.pg-training-courses .course-language,body.theme-smart.pg-training-courses .course-location{font-size:.78rem;line-height:17px}
body.theme-smart.pg-training-courses .courselisting .course-time{display:none}
body.theme-smart.pg-training-courses .courselisting form{padding:6px 12px 10px 0}
body[dir="rtl"].theme-smart.pg-training-courses .courselisting form{padding:6px 0 10px 12px}
body.theme-smart.pg-training-courses .courselisting .btn-primary{padding:4px 8px;font-size:.78rem}

/* --- training-courses fix 8c1d47d9c12f40498b8d6af547eb1f95 --- */
/* padding سفلي مع line-clamp بيكشف جزء من السطر الثالث → margin بدل padding */
body.theme-smart.pg-training-courses .course-title{padding-bottom:0;margin-bottom:4px}

/* --- training-courses fix d44b5e0bfcc90145fdc149da740878f6 --- */
/* (2026-09-07) "اسم الدورة مش ظاهر كله": العنوان 3 سطور بدل 2 ومن غير padding سفلي */
body.theme-smart.pg-training-courses .course-title{-webkit-line-clamp:3;max-height:none;padding-bottom:0;margin-bottom:4px;font-size:.86rem;line-height:18px}

/* --- training-courses fix 60260130ac3cf64ee313e42d7a6d9a81 --- */
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two.darkblue-color{background:#fff!important;border:0!important;border-inline-start:4px solid #003452!important;color:#0d2233!important;border-radius:0;padding:0 14px}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two.darkblue-color:hover{background:#003452!important;color:#fff!important}

/* --- btn-secondary = btn-primary (2026-09-07) --- */
/* صفحة الأونلاين بنفس تصميم الحضوري: زر الدورات الافتراضية (.btn-secondary) بنفس تنسيق الزر العادي */
body.theme-smart.pg-training-courses .courselisting .btn-secondary{background:#9ac43a;border-color:#9ac43a;color:#0d2233;border-radius:30px;font-weight:700}
body.theme-smart.pg-training-courses .courselisting:hover .btn-secondary{background:#003452;border-color:#003452;color:#fff}
body.theme-smart.pg-training-courses .courselisting .btn-secondary{background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important}
body.theme-smart.pg-training-courses .courselisting:hover .btn-secondary{background:#003452!important;border-color:#003452!important;color:#fff!important}
body.theme-smart.pg-training-courses .courselisting .btn-secondary{padding:4px 8px;font-size:.78rem}

/* --- training-courses fix fac629c65c947fb568388f4f9dee7496 --- */
/* ===== /training-courses — سمارت (2026-09-07): الفلتر لوحة جانبية (رأس كحلي Filter/Clear وحقول بحدود خضراء) والكروت الأفقية زي ما هي في عمودين جنبها ===== */
body.theme-smart.pg-training-courses .inst-tc{padding:26px 0 30px}
body.theme-smart.pg-training-courses .inst-tc-side{background:#fff;border:1px solid #e3ebe0;border-radius:6px;overflow:hidden}
body.theme-smart.pg-training-courses .inst-tc-side-head{background:#003452;color:#fff;border-bottom:0;padding:14px 16px}
body.theme-smart.pg-training-courses .inst-tc-side-title{font-size:1rem;color:#fff;padding:0}
body.theme-smart.pg-training-courses .inst-tc-side-title::before{display:none}
body.theme-smart.pg-training-courses .inst-tc-side-reset{color:#dbe6ea;text-decoration:underline;text-transform:none;letter-spacing:0;font-size:.78rem}
body.theme-smart.pg-training-courses .inst-tc #common-filter-box-modal-one{padding:0}
body.theme-smart.pg-training-courses .inst-tc #common-filter-box-modal-one .box2{padding:12px;background:#fff}
body.theme-smart.pg-training-courses .inst-tc #common-filter-box-modal-one form{gap:8px}
body.theme-smart.pg-training-courses .inst-tc #common-filter-box-modal-one .filter-courselist-wrap > .col-md-12{gap:8px}
body.theme-smart.pg-training-courses .inst-tc #common-filter-box-modal-one .form-control{width:100%;height:42px;border:1px solid #9ac43a!important;border-inline-start:1px solid #9ac43a!important;border-radius:4px;background:#fff;color:#0d2233;padding:0 12px;font-size:.95rem!important}
body.theme-smart.pg-training-courses .inst-tc #common-filter-box-modal-one .menu-two.purple-color{background:#003452!important;border:0!important;color:#fff!important;border-radius:4px;width:100%;padding:10px}
body.theme-smart.pg-training-courses .inst-tc-cta{margin:0 12px 12px;background:#9ac43a;color:#0d2233;border-radius:4px}
body.theme-smart.pg-training-courses .inst-tc-cta-kicker{color:#0d2233;opacity:.7}
body.theme-smart.pg-training-courses .inst-tc-head{display:none}
body.theme-smart.pg-training-courses .inst-tc #course_list{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting,body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting.virtual{display:grid;grid-template-columns:42% 1fr;column-gap:14px;padding:0;border:1px solid #e3ebe0;border-radius:14px;background:#fff;overflow:hidden;align-items:stretch}
body.theme-smart.pg-training-courses .inst-tc .courselisting .course-image{display:block;grid-row:1/8}
body.theme-smart.pg-training-courses .inst-tc .courselisting i.bi{display:inline-block}
body.theme-smart.pg-training-courses .inst-tc .courselisting form{grid-column:auto;padding:6px 12px 10px 0;align-self:end}
body[dir="rtl"].theme-smart.pg-training-courses .inst-tc .courselisting form{padding:6px 0 10px 12px}
body.theme-smart.pg-training-courses .inst-tc .courselisting .btn-primary,body.theme-smart.pg-training-courses .inst-tc .courselisting .btn-secondary{width:100%;padding:4px 8px}
body.theme-smart.pg-training-courses .inst-tc .course-title{padding:10px 12px 0 0;margin-bottom:4px}
body[dir="rtl"].theme-smart.pg-training-courses .inst-tc .course-title{padding:10px 0 0 12px}
@media (max-width:1199px){body.theme-smart.pg-training-courses .inst-tc #course_list{grid-template-columns:1fr}}

/* --- training-courses fix 3a8bd9b40cdae5e07e94ac61ebb2ac6c --- */
/* ===== الدورات الداخلية — سمارت: الخطوات بطاقات أفقية عريضة بعمود أخضر على الجنب فيه الرقم (زي كروت دوراته الأفقية)، المزايا شرائح خضراء فاتحة، زر أخضر كبسولي (2026-09-07) ===== */
body.theme-smart .inst-ih-grid{grid-template-columns:1fr;gap:26px}
body.theme-smart .inst-ih-steps,body.theme-smart .inst-ih-benefits{background:transparent;border:0;box-shadow:none;padding:0}
body.theme-smart .inst-ih-h{color:#003452}
body.theme-smart .inst-ih-h::after{background:#9ac43a}
body.theme-smart .inst-ih-list{grid-template-columns:repeat(3,1fr);gap:18px}
body.theme-smart .inst-ih-list li{gap:0;background:#fff;border:1px solid #e3ebe0;border-radius:14px;overflow:hidden}
body.theme-smart .inst-ih-num{flex:0 0 64px;width:64px;height:auto;align-self:stretch;border-radius:0;background:#9ac43a;color:#0d2233;font-size:1.5rem}
body.theme-smart .inst-ih-body{padding:16px}
body.theme-smart .inst-ih-checks{display:flex;flex-wrap:wrap;gap:10px}
body.theme-smart .inst-ih-checks li{background:#f1f7ec;border-radius:30px;padding:8px 16px;font-size:.88rem}
body.theme-smart .inst-ih-checks li .bi{color:#003452;font-size:1rem}
body.theme-smart .inst-ih-cta{background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important;border-radius:30px;margin-top:10px}

/* --- training-courses fix 0cca97be4d92ea3f71ecf7410625a7f9 --- */
/* لمسة فنية: سمارت — البطاقات الأفقية ترتفع بظل وحد أخضر عند المرور، الرقم يتحوّل كحلي، الشرائح تتلوّن أخضر */
body.theme-smart .inst-ih-list li{transition:transform .25s,box-shadow .25s,border-color .25s}
body.theme-smart .inst-ih-list li:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(0,52,82,.14);border-color:#9ac43a}
body.theme-smart .inst-ih-num{transition:background .25s,color .25s}
body.theme-smart .inst-ih-list li:hover .inst-ih-num{background:#003452;color:#fff}
body.theme-smart .inst-ih-checks li{transition:background .2s,color .2s}
body.theme-smart .inst-ih-checks li:hover{background:#9ac43a;color:#0d2233}
body.theme-smart .inst-ih-cta{box-shadow:0 8px 20px rgba(154,196,58,.4)}

/* --- banner-icon = banner-image (2026-09-07) --- */
/* صفحة التخصص بانرها #common-banner-section-icon بنفس بنية بانر الصورة → نفس تصميم بانر الثيم */
body.theme-smart.pg-training-courses #common-banner-section-icon .background-listing{background:linear-gradient(112deg,#003452 0,#003452 62%,#9ac43a 62.2%);color:#fff;border-radius:0}
body.theme-smart.pg-training-courses #common-banner-section-icon .background-listing:before{display:none}
body.theme-smart.pg-training-courses #common-banner-section-icon .common-banner-section-box{display:flex;align-items:center;gap:40px}
body.theme-smart.pg-training-courses #common-banner-section-icon .common-banner-image{position:static;float:none;order:2;flex:none;width:280px;padding:0;border:5px solid #fff;border-radius:16px;overflow:hidden;box-shadow:0 16px 36px rgba(0,0,0,.25);margin:0;background:#fff}
body.theme-smart.pg-training-courses #common-banner-section-icon .common-banner-text{float:none;width:auto;flex:1;max-width:760px;text-align:start}
body.theme-smart.pg-training-courses #common-banner-section-icon h1{color:#fff;font-size:34px}
body.theme-smart.pg-training-courses #common-banner-section-icon p{color:#dbe6ea;text-align:start}
body.theme-smart.pg-training-courses #common-banner-section-icon{background:linear-gradient(112deg,#003452 0,#003452 62%,#9ac43a 62.2%)}
body.theme-smart.pg-training-courses #common-banner-section-icon::before{display:none}
body.theme-smart.pg-training-courses #common-banner-section-icon .common-banner-section-box{align-items:center;gap:40px;padding:30px 0}
body.theme-smart.pg-training-courses #common-banner-section-icon .common-banner-text{max-width:760px}
body[dir="rtl"].theme-smart.pg-training-courses #common-banner-section-icon{background:linear-gradient(248deg,#003452 0,#003452 62%,#9ac43a 62.2%)}

/* --- training-courses fix 0d023764cbc8c5a5ff36b8ab5e62b432 --- */
/* ===== الصفحات الداخلية — سمارت: بطاقات أفقية بعمود أخضر على الجنب فيه الأيقونة (زي كروته)، الأسئلة بحد أخضر جانبي، العملاء شرائح خضراء فاتحة ===== */
body.theme-smart .inst-about-pillar,body.theme-smart .inst-pub-feat{display:grid;grid-template-columns:64px 1fr;column-gap:16px;padding:0;overflow:hidden;border-radius:14px;border-color:#e3ebe0;box-shadow:none}
body.theme-smart .inst-about-pillar .bi,body.theme-smart .inst-pub-feat .bi{grid-row:1/3;background:#9ac43a;color:#0d2233;display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin:0;height:100%}
body.theme-smart .inst-about-pillar h2,body.theme-smart .inst-pub-feat h2{padding:16px 16px 0 0;color:#003452}
body[dir="rtl"].theme-smart .inst-about-pillar h2,body[dir="rtl"].theme-smart .inst-pub-feat h2{padding:16px 0 0 16px}
body.theme-smart .inst-about-pillar p,body.theme-smart .inst-pub-feat p{padding:0 16px 16px 0}
body[dir="rtl"].theme-smart .inst-about-pillar p,body[dir="rtl"].theme-smart .inst-pub-feat p{padding:0 0 16px 16px}
body.theme-smart .inst-about-h::after,body.theme-smart .inst-faq-h::after,body.theme-smart .inst-pub-h::after,body.theme-smart .inst-clients-h::after{background:#9ac43a}
body.theme-smart .inst-about-h,body.theme-smart .inst-faq-h,body.theme-smart .inst-pub-h,body.theme-smart .inst-clients-h{color:#003452}
body.theme-smart .inst-about-offer,body.theme-smart .inst-pub-terms{border-radius:14px;border-color:#e3ebe0}
body.theme-smart .inst-about-offer > .bi{color:#9ac43a}
body.theme-smart .inst-about-offer-arrow{color:#003452}
body.theme-smart .inst-faq-item{border-radius:14px;border-color:#e3ebe0;border-inline-start:5px solid #9ac43a}
body.theme-smart .inst-faq-item summary .bi{color:#003452}
body.theme-smart .inst-clients-grid{display:flex;flex-wrap:wrap}
body.theme-smart .inst-clients-grid li{flex-direction:row;background:#f1f7ec;border:0;border-radius:30px;padding:10px 18px;gap:8px}
body.theme-smart .inst-clients-grid li .bi{font-size:1.1rem;color:#003452}

/* --- training-courses fix 1622a31c40e1c7121b295c5ae0dbb270 --- */
/* ===== سمارت: بطاقات أفقية بعمود أخضر فيه الأيقونة/الصورة على الجنب (زي كروته)، شرائح خضراء فاتحة ===== */
body.theme-smart.pg-training-courses #categorymain-listing-section .row.text-left,body.theme-smart.pg-training-courses #citymain-listing-section .row.text-left,body.theme-smart.pg-training-courses #common-listing-section .row.text-left{grid-template-columns:repeat(3,1fr)}
body.theme-smart.pg-training-courses .categorymain-listing-wrap-box > .box2,body.theme-smart.pg-training-courses .citymain-listing-wrap-box .box2,body.theme-smart.pg-training-courses .common-listing-wrap-box > .box2{border:1px solid #e3ebe0!important;border-radius:14px!important;overflow:hidden;transition:box-shadow .25s,border-color .25s}
body.theme-smart.pg-training-courses .categorymain-listing-wrap-box > .box2:hover,body.theme-smart.pg-training-courses .citymain-listing-wrap-box .box2:hover,body.theme-smart.pg-training-courses .common-listing-wrap-box > .box2:hover{box-shadow:0 14px 30px rgba(0,52,82,.14);border-color:#9ac43a!important}
body.theme-smart.pg-training-courses .categorymain-listing-wrap-box > .box2{padding:0;gap:0}
body.theme-smart.pg-training-courses .categorypage-icon{flex-basis:72px;width:72px;height:auto!important;align-self:stretch;background:#9ac43a;padding:14px;border-radius:0}
body.theme-smart.pg-training-courses .categorypage-content{padding:14px}
body.theme-smart.pg-training-courses .citymain-listing-wrap-box .box2{flex-direction:row;align-items:stretch}
body.theme-smart.pg-training-courses .citymain-listing-wrap-box .widget-icon{width:42%;flex:0 0 42%;height:auto;min-height:120px}
body.theme-smart.pg-training-courses .common-listing-wrap-box > .box2{flex-direction:row;flex-wrap:wrap}
body.theme-smart.pg-training-courses .common-listing-wrap-box > .box2 > a:first-child{width:42%;flex:0 0 42%;align-self:stretch}
body.theme-smart.pg-training-courses .common-listing-wrap-box > .box2 > a:first-child img{height:100%;min-height:150px}
body.theme-smart.pg-training-courses .common-listing-wrap-box .common-content,body.theme-smart.pg-training-courses .common-listing-wrap-box .course-person,body.theme-smart.pg-training-courses .common-listing-wrap-box .course-date,body.theme-smart.pg-training-courses .common-listing-wrap-box .btn{width:58%;flex:0 0 58%;margin-inline:0}
body.theme-smart.pg-training-courses .common-listing-wrap-box .common-content{padding:12px}
body.theme-smart.pg-training-courses .common-listing-wrap-box .course-person,body.theme-smart.pg-training-courses .common-listing-wrap-box .course-date{padding:0 12px}
body.theme-smart.pg-training-courses .common-listing-wrap-box .btn{margin:6px 12px 12px;width:auto;flex:none;background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important;border-radius:30px}
body.theme-smart.pg-training-courses .categorypage-content a,body.theme-smart.pg-training-courses .widget-content a{color:#003452;font-weight:600}

/* --- training-courses fix d0b93e6d12441dcedd2f145461aff25d --- */
/* ===== سمارت: أيقونات في عمود أخضر على الجنب (زي كروته)، زوايا 14px ===== */
body.theme-smart .inst-dl-item,body.theme-smart .inst-dl-request,body.theme-smart .inst-contact-card,body.theme-smart .inst-cra{border-radius:14px;border-color:#e3ebe0}
body.theme-smart .inst-dl-item{padding:0;overflow:hidden;gap:0}
body.theme-smart .inst-dl-item > .bi{background:#9ac43a;color:#0d2233;width:64px;align-self:stretch;display:flex;align-items:center;justify-content:center;font-size:1.5rem}
body.theme-smart .inst-dl-body{padding:16px}
body.theme-smart .inst-dl-arrow{margin-inline-end:16px;color:#003452}
body.theme-smart .inst-dl-h,body.theme-smart .inst-contact-h{color:#003452}
body.theme-smart .inst-dl-h::after{background:#9ac43a}
body.theme-smart .inst-contact-list li .bi{background:#9ac43a;color:#0d2233;border-radius:12px}
body.theme-smart .inst-cra-head > .bi,body.theme-smart .inst-cra-list li .bi{color:#003452}

/* --- category lists = course_list (2026-09-07) --- */
/* صفحة التخصص: نفس شبكة/تصميم #course_list على #category_course_list و#category_course_list_by_name */
@media (min-width:992px){body.theme-smart.pg-training-courses #category_course_list{grid-template-columns:repeat(3,1fr);gap:20px}}
@media (min-width:992px){body.theme-smart.pg-training-courses #category_course_list_by_name{grid-template-columns:repeat(3,1fr);gap:20px}}
@media (max-width:991px){body.theme-smart.pg-training-courses #category_course_list{grid-template-columns:1fr}}
@media (max-width:991px){body.theme-smart.pg-training-courses #category_course_list_by_name{grid-template-columns:1fr}}
body.theme-smart.pg-training-courses .inst-tc #category_course_list{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
body.theme-smart.pg-training-courses .inst-tc #category_course_list_by_name{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
@media (max-width:1199px){body.theme-smart.pg-training-courses .inst-tc #category_course_list{grid-template-columns:1fr}}
@media (max-width:1199px){body.theme-smart.pg-training-courses .inst-tc #category_course_list_by_name{grid-template-columns:1fr}}

/* --- training-courses fix 5c97ed7076f156f679cd01987f54fd23 --- */
/* ===== سمارت: شريط أخضر بحقول بيضاء بخط كحلي جانبي، زر كحلي ===== */
body.theme-smart.pg-training-courses #fc-search .search-wrap{background:#9ac43a;border-radius:0;box-shadow:none;color:#0d2233}
body.theme-smart.pg-training-courses #fc-search .form-control,body.theme-smart.pg-training-courses #fc-search .chosen-choices,body.theme-smart.pg-training-courses #fc-search select{background:#fff!important;border:0!important;border-inline-start:4px solid #003452!important;border-radius:0!important}
body.theme-smart.pg-training-courses #fc-search .search-btns{background:#003452!important;border-color:#003452!important;color:#fff!important;border-radius:0}

/* --- finder results = course_list (2026-09-07) --- */
@media (min-width:992px){body.theme-smart.pg-training-courses #coursefinder_list_courses{grid-template-columns:repeat(3,1fr);gap:20px}}
@media (max-width:991px){body.theme-smart.pg-training-courses #coursefinder_list_courses{grid-template-columns:1fr}}
body.theme-smart.pg-training-courses .inst-tc #coursefinder_list_courses{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
@media (max-width:1199px){body.theme-smart.pg-training-courses .inst-tc #coursefinder_list_courses{grid-template-columns:1fr}}

/* --- training-courses fix 9cff9d6b5b51b072460d97b89947e346 --- */
/* ===== سمارت: بطاقات أفقية بعمود أخضر على الجنب فيه الرقم (زي كروته)، 3 أعمدة ===== */
body.theme-smart.pg-training-courses .categorymain-listing-wrap-box > .box2::before{content:counter(instcat);counter-increment:instcat;flex:0 0 64px;width:64px;align-self:stretch;background:#9ac43a;color:#0d2233;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.3rem}
body.theme-smart.pg-training-courses .categorypage-content{padding:16px 14px}

/* --- training-courses fix 7c28c017fc92b5b612d1582440c5532a --- */
/* ===== سمارت: رؤوس خضراء بنص كحلي وخط كحلي جانبي، حقول بخط كحلي جانبي، لوحات مدوّرة 14px ===== */
body.theme-smart.pg-training-courses #register-section .tabHead{background:#9ac43a;color:#0d2233;border-radius:14px 14px 0 0;border-inline-start:6px solid #003452}
body.theme-smart.pg-training-courses #register-section .tabContent{border:1px solid #e3ebe0;border-radius:0 0 14px 14px}
body.theme-smart.pg-training-courses #register-section .form-control{border:1px solid #e3ebe0;border-inline-start:4px solid #003452;border-radius:0}
body.theme-smart.pg-training-courses .inst-form-side-card{border-radius:14px;border-color:#e3ebe0}
body.theme-smart.pg-training-courses .inst-form-side-list li .bi{background:#9ac43a;color:#0d2233;border-radius:12px}

/* --- training-courses fix fd1f4ee06bbbfedb64786fa7e13650af --- */
body.theme-smart.pg-training-courses #register-section .tabHead{background:#9ac43a!important;color:#0d2233!important;border-radius:14px 14px 0 0!important;border-inline-start:6px solid #003452!important}

/* --- training-courses fix c27c2798c0dc7474bcd4bd59fc1029a3 --- */
body.theme-smart.pg-training-courses #register-section .tabContent{border:1px solid #e3ebe0!important;border-radius:0 0 14px 14px!important}

/* --- training-courses fix 495e39a4b6b0c91e2804855768514929 --- */
/* ===== سمارت: بطاقة بزوايا 14px وخط أخضر جانبي سميك للعنوان، المرتبطة بعمود أخضر ===== */
body.theme-smart.pg-post-page .blog-webinar-articles-details-left .box,body.theme-smart.pg-post-page .blog-webinar-articles-details-right .box2{border-radius:14px;border-color:#e3ebe0}
body.theme-smart.pg-post-page .blog-webinar-articles-details-left .box{border-inline-start:8px solid #9ac43a}
body.theme-smart.pg-post-page .blog-webinar-articles-details-left .box h1{color:#003452}
body.theme-smart.pg-post-page .blog-webinar-articles-details-right .box2{border-inline-start:5px solid #9ac43a}
body.theme-smart.pg-post-page .blog-webinar-articles-details-right .box2 .btn{border-radius:30px}

/* --- training-courses fix e7b3c6a1b9b78f89b1042af2bbf49da6 --- */
/* ===== سمارت: تبويبات بخط كحلي جانبي ونشاط أخضر، محتوى مدوّر 14px ===== */
body.theme-smart.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link{border-radius:0;background:#fff;border:1px solid #e3ebe0;border-inline-start:4px solid #003452;color:#003452}
body.theme-smart.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link.active{background:#9ac43a;color:#0d2233;border-color:#9ac43a #9ac43a #9ac43a #003452}
body.theme-smart.pg-training-courses #coursedetails-content-section .tab-content{border-radius:14px;border-color:#e3ebe0}
body.theme-smart.pg-training-courses .session-card{border-radius:14px!important;border-inline-start:6px solid #9ac43a!important}

/* --- training-courses fix 53adee09fe4309d1b895a529ccbff0df --- */
body.theme-smart.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link{border-radius:0!important;background:#fff!important;border:1px solid #e3ebe0!important;border-inline-start:4px solid #003452!important;color:#003452!important}

/* --- training-courses fix 11ae92d41759cb9f86a8ac136e3012d3 --- */
body.theme-smart.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link.active{background:#9ac43a!important;color:#0d2233!important;border-color:#9ac43a #9ac43a #9ac43a #003452!important}

/* --- training-courses fix ba490ad1e92d5ae0e6164d47bebaa5cb --- */
html.theme-smart{background:#003452}

/* --- training-courses fix 6acf9994cc96be92734f1883025c8940 --- */
/* نفس شبكة الكروت بتاعة /training-courses (عمودين) */
body.theme-smart.pg-training-courses .inst-tc #category_course_list,body.theme-smart.pg-training-courses .inst-tc #category_course_list_by_name{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:20px!important}
@media (max-width:1199px){body.theme-smart.pg-training-courses .inst-tc #category_course_list,body.theme-smart.pg-training-courses .inst-tc #category_course_list_by_name{grid-template-columns:1fr!important}}

/* --- training-courses fix a3c30b0790b1a1f1987eb566be3ae1cb --- */
/* شريط تبويبَي "حسب الجدول / حسب الاسم" في صفحة التخصص كان بياخد الخلفية الخضرا
   بتاعة صندوق الفلتر (قاعدة .box2 عامة في الثيم) فبقى مستطيل أخضر بدل الكبسولات.
   بنرجّعه لتصميم الكبسولات المشترك: خلفية بيضا والكبسولة المختارة بلون الموقع. */
body.theme-smart.pg-category-page #common-filter-box-modal-one .box2.custom-radio{background:#fff!important;border:1px solid rgba(0,0,0,.08)!important;border-radius:40px!important;padding:6px!important;display:inline-flex!important;gap:4px!important;box-shadow:0 4px 14px rgba(0,0,0,.06)!important;width:auto!important}
body.theme-smart.pg-category-page #common-filter-box-modal-one .form-check-label{color:#0d2233!important;background:transparent!important;border-radius:30px!important;padding:8px 18px!important}
body.theme-smart.pg-category-page #common-filter-box-modal-one .form-check-input:checked + .form-check-label{background:#9ac43a!important;color:#0d2233!important}

/* --- training-courses fix sm-cd-longform-floating-card --- */
/* ============================================================
   سمارت — تفاصيل الدورة: صفحة طولية + بطاقة جدول عائمة
   ------------------------------------------------------------
   الأقسام كلها ظاهرة تحت بعضها في كروت بيضا نصف قطرها 14px،
   وشريط كبسولات خضرا ثابت فوق بينطّ للأقسام، وعلى الجنب بطاقة
   جدول عائمة (رأس أخضر + حرف كحلي على الجنب) وتحتها كتلة التواصل.
   الماركب في app/Views/themes/smart/courses/course_details/**.
   ============================================================ */

/* خلفية الشريط: أخضر فاتح جدًا بدل الرمادي المشترك */
body.theme-smart.pg-training-courses #coursedetails-buttons-section,
body.theme-smart.pg-training-courses #coursedetails-content-section,
body.theme-smart.pg-training-courses #common-section.section-grey{background:#f2f7ec!important}

/* شريط الأزرار فوق: كارت أبيض 14px بحرف أخضر */
body.theme-smart.pg-training-courses #coursedetails-buttons-section .box2{background:#fff!important;border:1px solid #e3ebe0!important;border-inline-start:6px solid #9ac43a!important;border-radius:14px!important;box-shadow:0 8px 24px rgba(13,34,51,.06)!important}

/* الأقسام كلها ظاهرة — الـ tab-pane بتتخبى بـ fade في البوتستراب */
body.theme-smart.pg-training-courses .sm-cd .tab-pane{display:block!important;opacity:1!important;visibility:visible!important;transition:none!important}
/* الكارت الأبيض العملاق المشترك حوالين .tab-content بيتلغي — كل قسم بقى كارت لوحده */
body.theme-smart.pg-training-courses .sm-cd .tab-content{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin:0!important}

/* شريط الكبسولات */
body.theme-smart.pg-training-courses .sm-cd-chips{display:flex;flex-wrap:wrap;gap:8px;position:sticky;top:0;z-index:30;padding:14px 0 12px;margin:0 0 20px;background:#f2f7ec;border-bottom:1px solid #e2ecd6}
body.theme-smart.pg-training-courses .sm-chip{display:inline-flex;align-items:center;gap:8px;background:#9ac43a;border:1px solid #9ac43a;color:#0d2233!important;border-radius:999px;padding:9px 18px;font-size:.85rem;font-weight:700;line-height:1.2;text-decoration:none!important;box-shadow:0 2px 8px rgba(13,34,51,.06);transition:background .18s,border-color .18s,color .18s}
body.theme-smart.pg-training-courses .sm-chip i{color:#0d2233!important;font-size:1rem;line-height:1}
body.theme-smart.pg-training-courses .sm-chip:hover,
body.theme-smart.pg-training-courses .sm-chip:focus{background:#003452;border-color:#003452;color:#fff!important}
body.theme-smart.pg-training-courses .sm-chip:hover i,
body.theme-smart.pg-training-courses .sm-chip:focus i{color:#fff!important}

/* الشبكة: عمود طويل + عمود جانبي */
body.theme-smart.pg-training-courses .sm-cd-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:26px}
body.theme-smart.pg-training-courses .sm-cd-main{min-width:0}
body.theme-smart.pg-training-courses .sm-cd-side{min-width:0}
body.theme-smart.pg-training-courses .sm-cd-sticky{position:sticky;top:88px;display:flex;flex-direction:column;gap:16px}
@media (max-width:1199px){body.theme-smart.pg-training-courses .sm-cd-grid{grid-template-columns:1fr}body.theme-smart.pg-training-courses .sm-cd-sticky{position:static}}

/* كارت القسم */
body.theme-smart.pg-training-courses .sm-sec{background:#fff;border:1px solid #e3ebe0;border-radius:14px;padding:26px 30px;margin:0 0 22px;box-shadow:0 8px 24px rgba(13,34,51,.06)}
body.theme-smart.pg-training-courses .sm-sec:last-child{margin-bottom:0}
body.theme-smart.pg-training-courses .sm-sec-h{font-size:1.22rem;font-weight:800;color:#003452;margin:0 0 20px;padding-inline-start:14px;border-inline-start:5px solid #9ac43a;line-height:1.35}
body.theme-smart.pg-training-courses .sm-cd .tab-pane{scroll-margin-top:150px}
body.theme-smart.pg-training-courses .sm-cd .tab-content h6,
body.theme-smart.pg-training-courses .sm-cd .tab-content h4,
body.theme-smart.pg-training-courses .sm-cd .year-heading{color:#003452!important;font-weight:700}
body.theme-smart.pg-training-courses .sm-cd .tab-content h6:first-child{margin-top:0}

/* جدول الجلسات جوه العمود الطويل: صف كامل لكل جلسة */
body.theme-smart.pg-training-courses .sm-cd .session-card-wrapper > [class*="col-"]{flex:0 0 100%!important;max-width:100%!important}
body.theme-smart.pg-training-courses .sm-cd .session-card{border:1px solid #e3ebe0!important;border-inline-start:6px solid #9ac43a!important;border-radius:14px!important;box-shadow:0 4px 14px rgba(13,34,51,.05)}
body.theme-smart.pg-training-courses .sm-cd .price-tag{background:#f4f9ee!important;border:1px solid #dbe7cd!important;border-radius:12px!important}
body.theme-smart.pg-training-courses .sm-cd .session-card .icon-style{color:#9ac43a!important}

/* البطاقة العائمة */
body.theme-smart.pg-training-courses .sm-float{background:#fff;border:1px solid #e3ebe0;border-inline-start:6px solid #003452;border-radius:14px;overflow:hidden;box-shadow:0 14px 34px rgba(13,34,51,.10)}
body.theme-smart.pg-training-courses .sm-float-head{display:flex;align-items:center;gap:10px;background:#9ac43a;color:#0d2233;font-weight:800;font-size:1rem;padding:14px 18px}
body.theme-smart.pg-training-courses .sm-float-head i{font-size:1.1rem}
body.theme-smart.pg-training-courses .sm-float-body{padding:18px}
body.theme-smart.pg-training-courses .sm-float-fee{background:#f4f9ee;border:1px solid #dbe7cd;border-radius:12px;padding:12px 14px;margin:0 0 16px;text-align:center}
body.theme-smart.pg-training-courses .sm-float-fee strong{display:block;font-size:1.4rem;line-height:1.25;color:#003452;margin:2px 0}
body.theme-smart.pg-training-courses .sm-float-kicker{display:block;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:#6b7f8c;font-weight:700}
body.theme-smart.pg-training-courses .sm-float-kicker--list{margin:0 0 4px}
body.theme-smart.pg-training-courses .sm-float-note{font-size:.75rem;color:#6b7f8c}
body.theme-smart.pg-training-courses .sm-float-list{list-style:none;margin:0;padding:0}
body.theme-smart.pg-training-courses .sm-float-list li{display:flex;flex-direction:column;gap:2px;padding:10px 0;border-top:1px solid #eef2ea}
body.theme-smart.pg-training-courses .sm-float-list li:first-child{border-top:0;padding-top:4px}
body.theme-smart.pg-training-courses .sm-float-date{font-weight:700;font-size:.9rem;color:#0d2233}
body.theme-smart.pg-training-courses .sm-float-list li.is-next .sm-float-date{color:#003452}
body.theme-smart.pg-training-courses .sm-float-meta{font-size:.78rem;color:#6b7f8c}
body.theme-smart.pg-training-courses .sm-float-meta i{font-style:normal;padding:0 5px;color:#9ac43a}
body.theme-smart.pg-training-courses .sm-float-more{font-size:.78rem;color:#6b7f8c;padding-top:9px;border-top:1px solid #eef2ea}
body.theme-smart.pg-training-courses .sm-float-empty{margin:0;font-size:.85rem;color:#6b7f8c}
body.theme-smart.pg-training-courses .sm-float-form{margin:16px 0 0}
body.theme-smart.pg-training-courses .sm-float-btn{display:block;width:100%;background:#9ac43a!important;border:1px solid #9ac43a!important;color:#0d2233!important;font-weight:800!important;border-radius:12px!important;padding:11px 12px!important;font-size:.95rem!important}
body.theme-smart.pg-training-courses .sm-float-btn:hover{background:#003452!important;border-color:#003452!important;color:#fff!important}
body.theme-smart.pg-training-courses .sm-float-link{display:block;margin:12px 0 0;text-align:center;font-size:.82rem;font-weight:700;color:#003452!important;text-decoration:none!important}
body.theme-smart.pg-training-courses .sm-float-link:hover{color:#7aa62b!important}

/* كتلة التواصل جوه العمود الجانبي: عمودية بدل الصف */
body.theme-smart.pg-training-courses .sm-cd-side .inst-cra--desktop{position:static;flex-direction:column;align-items:flex-start;gap:12px;width:100%;max-width:none;margin:0;border:1px solid #e3ebe0;border-inline-start:6px solid #9ac43a;border-radius:14px;padding:16px 18px;box-shadow:0 8px 24px rgba(13,34,51,.06)}
body.theme-smart.pg-training-courses .sm-cd-side .inst-cra-head{padding-inline-end:0;border-inline-end:0;padding-bottom:12px;border-bottom:1px solid #eef2ea;width:100%}
body.theme-smart.pg-training-courses .sm-cd-side .inst-cra-head > .bi{color:#9ac43a}
body.theme-smart.pg-training-courses .sm-cd-side .inst-cra-list{flex-direction:column;gap:9px;width:100%}
body.theme-smart.pg-training-courses .sm-cd-side .inst-cra-list li .bi{color:#003452}

/* --- training-courses fix sm-cd-chips-align --- */
/* شريط الكبسولات عنصر nav، و_institute.css بيديه justify-content:space-between فبيتفرّق */
body.theme-smart.pg-training-courses #coursedetails-content-section nav.sm-cd-chips{justify-content:flex-start!important;align-items:center!important;gap:8px!important;margin-bottom:20px!important}

/* --- training-courses fix sm-cd-session-rows --- */
/* كارت الجلسة جوه العمود الطويل: صف أفقي (بيانات | السعر | زرار) بدل عمود طويل فاضي */
body.theme-smart.pg-training-courses .sm-cd .session-card{display:flex!important;align-items:center;gap:22px;padding:18px 22px!important}
body.theme-smart.pg-training-courses .sm-cd .session-card > ul{order:1;flex:1 1 auto;width:auto!important;margin:0!important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 20px;padding:0!important}
body.theme-smart.pg-training-courses .sm-cd .session-card > ul > li{margin:0!important}
body.theme-smart.pg-training-courses .sm-cd .session-card .price-box{order:2;position:static!important;flex:0 0 auto;text-align:center!important}
body.theme-smart.pg-training-courses .sm-cd .session-card .price-tag{padding:10px 12px!important}
body.theme-smart.pg-training-courses .sm-cd .session-card .text-end{order:3;flex:0 0 auto;margin:0!important}
body.theme-smart.pg-training-courses .sm-cd .session-card .text-end .alert{margin:0!important}
body.theme-smart.pg-training-courses .sm-cd .session-card .text-end .btn{border-radius:12px!important;padding:10px 20px!important}

/* شرائح "الرسوم + الضريبة" بلون الثيم بدل الأزرق */
body.theme-smart.pg-training-courses .sm-cd #nav-schedulefees .alert-info{background:#f4f9ee!important;border:1px solid #dbe7cd!important;color:#28414f!important;border-radius:12px!important}
body.theme-smart.pg-training-courses .sm-cd #nav-schedulefees .discount-link{color:#003452!important}
body.theme-smart.pg-training-courses .sm-cd .fees-box-right2-2022{font-size:.85rem;color:#5a6e7d}

/* --- training-courses fix sm-cd-vl-grid --- */
/* كاروسيل "التعلم الافتراضي" جوه عمود أضيق كان بيطلع كروت 130px؛
   بنحوّله شبكة 3 أعمدة ثابتة (loop:false فمفيش نسخ مكررة) */
body.theme-smart.pg-training-courses .sm-cd .owl-carousel .owl-stage-outer{overflow:visible!important}
body.theme-smart.pg-training-courses .sm-cd .owl-carousel .owl-stage{width:auto!important;transform:none!important;transition:none!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
body.theme-smart.pg-training-courses .sm-cd .owl-carousel .owl-item{width:auto!important;float:none!important;margin:0!important}
body.theme-smart.pg-training-courses .sm-cd .owl-carousel .owl-nav{display:none!important}
body.theme-smart.pg-training-courses .sm-cd .owl-carousel .courselisting-normal{border-radius:14px!important;height:100%}

/* الشريط الرفيع بين قسم المحتوى وقسم الدورات المرتبطة */
body.theme-smart.pg-training-courses #coursedetails-content-section + .space10{background:#f2f7ec}

/* --- training-courses fix sm-cd-noschedule-box --- */
/* صندوق "مفيش جلسات السنة دي" كان بنفسجي فاتح (#F2F3FD) — بنرجّعه لأخضر الثيم */
body.theme-smart.pg-training-courses .sm-cd .fee-box-wrap-2022{background:#f4f9ee;border:1px solid #dbe7cd;border-inline-start:5px solid #9ac43a;border-radius:12px;padding:18px 20px}
body.theme-smart.pg-training-courses .sm-cd .fee-box-wrap-2022 .schedulehead-h4{color:#003452;margin-bottom:6px}
body.theme-smart.pg-training-courses .sm-cd .custom-text-no-course p{margin:0;color:#5a6e7d}
body.theme-smart.pg-training-courses .sm-cd .custom-head-additional{margin:0}

/* كروت "التعلم الافتراضي / القاعات" جوه الشبكة: حدود الثيم */
body.theme-smart.pg-training-courses .sm-cd .courselisting-normal{border:1px solid #e3ebe0!important;box-shadow:0 6px 18px rgba(13,34,51,.06)!important}
body.theme-smart.pg-training-courses .sm-cd .courselisting-normal .course-title{color:#003452!important}

/* --- training-courses fix sm-cd-noschedule-head --- */
/* رأس صندوق "مفيش جلسات" (#F6F7FE في additional.css) بلون الثيم */
body.theme-smart.pg-training-courses .sm-cd #nav-schedulefees .custom-head-additional{background:#e9f2dd;border-bottom:1px solid #dbe7cd;border-radius:8px 8px 0 0;margin-inline:-20px;margin-top:-18px;margin-bottom:16px;padding:12px 20px}

/* --- training-courses fix sm-cd-band-seam --- */
/* margin-bottom:20px على قسم الأزرار كان بيسيب شريط رمادي بين البلوكين المصبوغين */
body.theme-smart.pg-training-courses #coursedetails-buttons-section{margin-bottom:0!important;padding-bottom:20px!important}

/* ============================================================
   سمارت — الصفحات الداخلية المشتركة: "لوحات مقسّمة" (2026-09-08)
   ------------------------------------------------------------
   فكرة واحدة على كل الصفحات: شريط كبسولات مقسّم (أو صف شرائح)
   فوق لوحة بيضاء زواياها 14px، فيها عمود أخضر جانبي فيه الأيقونة.
   الأخضر #9ac43a والكحلي #003452 — نفس ألوان الثيم.
   الماركب في app/Views/themes/smart/institute/** — بدون أي جافاسكربت.
   ============================================================ */

/* --- مقدمة البانر (عن المعهد / العملاء) --- */
body.theme-smart .sm-sp-intro{display:block;text-align:start;max-width:70ch}
body.theme-smart .sm-sp-intro-lead{display:block;font-size:1.06rem;line-height:1.75;color:#fff;font-weight:600}
body.theme-smart .sm-sp-intro-sub{display:block;margin-top:12px;padding-inline-start:14px;border-inline-start:3px solid #9ac43a;font-size:.95rem;line-height:1.7;color:#c6d8e0;font-weight:400}

/* --- القسم والعناوين --- */
body.theme-smart .sm-sp{background:#f4f8f0;padding:46px 0 58px}
body.theme-smart .sm-sp-block{margin-bottom:36px}
body.theme-smart .sm-sp-block:last-of-type{margin-bottom:26px}
body.theme-smart .sm-sp-h{font-size:1.32rem;font-weight:800;color:#003452;margin:0 0 18px;display:flex;align-items:center;gap:14px}
body.theme-smart .sm-sp-h::after{content:'';flex:1 1 auto;height:5px;border-radius:3px;background:repeating-linear-gradient(90deg,#9ac43a 0 14px,transparent 14px 22px);opacity:.5}

/* --- الشريط المقسّم --- */
body.theme-smart .sm-sp-seg{display:flex;width:100%;gap:0;padding:6px;background:#fff;border:1px solid #dbe7cd;border-radius:999px;box-shadow:0 10px 26px rgba(13,34,51,.07);margin-bottom:16px;max-width:100%}
body.theme-smart .sm-sp-seg-btn{position:relative;appearance:none;-webkit-appearance:none;border:0;background:transparent;color:#003452;font-weight:700;font-size:.98rem;line-height:1.2;padding:14px 22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s,border-color .2s}
body.theme-smart .sm-sp-seg > .sm-sp-seg-btn{flex:1 1 0;min-width:0}
body.theme-smart .sm-sp-seg > .sm-sp-seg-btn + .sm-sp-seg-btn::before{content:'';position:absolute;inset-inline-start:0;top:24%;bottom:24%;width:1px;background:#e3ecd8;transition:opacity .2s}
body.theme-smart .sm-sp-seg > .sm-sp-seg-btn.is-on::before,body.theme-smart .sm-sp-seg > .sm-sp-seg-btn.is-on + .sm-sp-seg-btn::before{opacity:0}
body.theme-smart .sm-sp-seg-btn .bi{font-size:1.05rem;color:#7ea82c;transition:color .2s}
body.theme-smart .sm-sp-seg-btn:focus-visible{outline:3px solid #9ac43a;outline-offset:2px}
body.theme-smart .sm-sp-seg .sm-sp-seg-btn:hover{background:#eef5e2}
body.theme-smart .sm-sp-seg .sm-sp-seg-btn.is-on{background:#003452;color:#fff;box-shadow:0 6px 16px rgba(0,52,82,.3)}
body.theme-smart .sm-sp-seg .sm-sp-seg-btn.is-on .bi{color:#9ac43a}

/* --- صف الشرائح (نفس الأزرار بس منفصلة) --- */
body.theme-smart .sm-sp-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
body.theme-smart .sm-sp-chip{background:#fff;border:1px solid #dbe7cd;padding:11px 20px;box-shadow:0 6px 16px rgba(13,34,51,.05)}
body.theme-smart .sm-sp-chip:hover{border-color:#9ac43a;background:#f6fbef}
body.theme-smart .sm-sp-chip.is-on{background:#9ac43a;border-color:#9ac43a;color:#0d2233;box-shadow:0 8px 20px rgba(154,196,58,.45)}
body.theme-smart .sm-sp-chip.is-on .bi{color:#003452}

/* --- اللوحة --- */
body.theme-smart .sm-sp-panel{display:grid;grid-template-columns:120px minmax(0,1fr) auto;align-items:stretch;background:#fff;border:1px solid #dbe7cd;border-radius:14px;overflow:hidden;box-shadow:0 16px 36px rgba(13,34,51,.08)}
body.theme-smart .sm-sp-rail{background:linear-gradient(155deg,#a6cd4c,#84b02c);display:flex;align-items:center;justify-content:center;color:#0d2233;min-height:118px}
body.theme-smart .sm-sp-rail .bi{font-size:2.6rem;line-height:1}
body.theme-smart .sm-sp-body{padding:32px 38px;display:flex;flex-direction:column;gap:10px;min-width:0}
body.theme-smart .sm-sp-body h2,body.theme-smart .sm-sp-body > strong{font-size:1.42rem;font-weight:800;color:#003452;margin:0;line-height:1.3}
body.theme-smart .sm-sp-body p,body.theme-smart .sm-sp-body > span{margin:0;color:#54687a;font-size:1.06rem;line-height:1.85;max-width:62ch}
body.theme-smart .sm-sp-mark{display:flex;align-items:center;justify-content:center;min-width:132px;padding-inline:26px;background:#fbfdf8;border-inline-start:1px solid #eef3e7;font-weight:800;font-size:3rem;line-height:1;color:#e4eed6;white-space:nowrap;letter-spacing:-.02em}
body.theme-smart .sm-sp-mark i{display:none}

/* اللوحة كرابط (ماذا نقدّم / التنزيلات) */
body.theme-smart .sm-sp-panel--go{text-decoration:none!important;color:inherit;transition:box-shadow .25s,border-color .25s,transform .25s}
body.theme-smart .sm-sp-panel--go:hover{border-color:#9ac43a;box-shadow:0 22px 44px rgba(0,52,82,.16);transform:translateY(-3px)}
body.theme-smart .sm-sp-panel--go:hover .sm-sp-body > strong{color:#003452!important}
body.theme-smart .sm-sp-go{display:flex;align-items:center;justify-content:center;min-width:96px;padding-inline:26px;background:#fbfdf8;border-inline-start:1px solid #eef3e7;font-size:1.4rem;color:#003452;transition:color .25s,background .25s}
body.theme-smart .sm-sp-panel--go:hover .sm-sp-go{color:#0d2233;background:#9ac43a}

/* --- أزرار الدعوة --- */
body.theme-smart .sm-sp-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:8px}
body.theme-smart .sm-sp-cta{margin-top:22px}
body.theme-smart .sm-sp-cta .btn{border-radius:999px!important;padding:14px 34px;font-size:1rem;font-weight:700;border-width:2px!important}
body.theme-smart .sm-sp-cta .btn-primary{background:#003452!important;border-color:#003452!important;color:#fff!important}
body.theme-smart .sm-sp-cta .btn-primary:hover{background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important}
body.theme-smart .sm-sp-cta .btn-secondary{background:#fff!important;border-color:#9ac43a!important;color:#003452!important}
body.theme-smart .sm-sp-cta .btn-secondary:hover{background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important}

/* --- الشاشات الصغيرة --- */
@media (max-width:767px){
    body.theme-smart .sm-sp{padding:32px 0 40px}
    body.theme-smart .sm-sp-seg{display:flex;border-radius:20px;flex-direction:column;align-items:stretch}
    body.theme-smart .sm-sp-seg-btn{justify-content:flex-start;width:100%}
    body.theme-smart .sm-sp-panel{grid-template-columns:72px minmax(0,1fr);grid-template-rows:auto auto}
    body.theme-smart .sm-sp-rail{min-height:0}
    body.theme-smart .sm-sp-rail .bi{font-size:1.7rem}
    body.theme-smart .sm-sp-body{padding:20px 18px}
    body.theme-smart .sm-sp-mark{display:none}
    body.theme-smart .sm-sp-go{grid-column:2;padding:0 18px 18px}
    body.theme-smart .sm-sp-h{flex-wrap:wrap}
}

/* --- خانات ملتصقة بخطوط شعرة (القطاعات / مزايا الدورات الداخلية) --- */
body.theme-smart .sm-sp-cells{list-style:none;margin:0 0 28px;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:#e6efdb;border:1px solid #dbe7cd;border-radius:14px;overflow:hidden;box-shadow:0 16px 36px rgba(13,34,51,.07)}
body.theme-smart .sm-sp-cells--2{grid-template-columns:repeat(2,minmax(0,1fr))}
body.theme-smart .sm-sp-cell{background:#fff;display:flex;flex-direction:column;align-items:flex-start;gap:13px;padding:22px 20px;color:#0d2233;font-size:.95rem;font-weight:600;line-height:1.5;transition:background .2s}
body.theme-smart .sm-sp-cell--wide{flex-direction:row;align-items:center;gap:16px;padding:20px 24px}
body.theme-smart .sm-sp-cell:hover{background:#f6fbef}
body.theme-smart .sm-sp-cell-icon{width:44px;height:44px;border-radius:14px;background:#9ac43a;color:#0d2233;display:inline-flex;align-items:center;justify-content:center;font-size:1.25rem;flex:0 0 auto}
body.theme-smart .sm-sp-cell-label{display:block}

/* --- شريط كحلي (سؤال + زر) --- */
body.theme-smart .sm-sp-band{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px 26px;background:linear-gradient(115deg,#003452,#02486f);border-radius:14px;padding:26px 32px;box-shadow:0 18px 40px rgba(0,52,82,.2)}
body.theme-smart .sm-sp-band p{margin:0;color:#d3e3ea;font-size:1.05rem;font-weight:600;line-height:1.7}
body.theme-smart .sm-sp-band .btn{border-radius:999px!important;padding:13px 30px;font-weight:700;background:#9ac43a!important;border:2px solid #9ac43a!important;color:#0d2233!important}
body.theme-smart .sm-sp-band .btn:hover{background:#fff!important;border-color:#fff!important;color:#003452!important}
body.theme-smart .sm-sp-band .btn-secondary{background:transparent!important;border-color:#7fa7bd!important;color:#fff!important}
body.theme-smart .sm-sp-band .btn-secondary:hover{background:#fff!important;border-color:#fff!important;color:#003452!important}
body.theme-smart .sm-sp-band--request{align-items:center;padding:30px 32px}
body.theme-smart .sm-sp-band-text h2{margin:0 0 8px;font-size:1.28rem;font-weight:800;color:#fff}
body.theme-smart .sm-sp-band-actions{display:flex;flex-wrap:wrap;gap:12px}
body.theme-smart .sm-sp-band-actions .bi{margin-inline-end:7px}

/* --- لوحة الأسئلة (details/summary زي الأصل) --- */
body.theme-smart .sm-sp-list{background:#fff;border:1px solid #dbe7cd;border-radius:14px;overflow:hidden;box-shadow:0 16px 36px rgba(13,34,51,.08)}
body.theme-smart .sm-sp-list-h{display:flex;align-items:center;gap:12px;margin:0;padding:20px 28px;font-size:1.1rem;font-weight:800;color:#fff;background:linear-gradient(115deg,#003452,#02486f)}
body.theme-smart .sm-sp-list-h .bi{color:#9ac43a;font-size:1.2rem}
body.theme-smart .sm-sp-q{border-top:1px solid #eef3e7}
body.theme-smart .sm-sp-q summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:17px 28px;font-weight:700;color:#0d2233;font-size:1rem;transition:background .2s,color .2s}
body.theme-smart .sm-sp-q summary::-webkit-details-marker{display:none}
body.theme-smart .sm-sp-q summary:hover{background:#f6fbef}
body.theme-smart .sm-sp-q summary .bi{flex:0 0 auto;width:30px;height:30px;border-radius:10px;background:#eef5e2;color:#003452;display:inline-flex;align-items:center;justify-content:center;font-size:.88rem;transition:transform .25s,background .25s,color .25s}
body.theme-smart .sm-sp-q[open] summary{color:#003452}
body.theme-smart .sm-sp-q[open] summary .bi{transform:rotate(45deg);background:#9ac43a;color:#0d2233}
body.theme-smart .sm-sp-q-a{background:#f8fbf4;padding:2px 28px 20px}
body.theme-smart .sm-sp-q-a p{margin:0;color:#54687a;line-height:1.85;font-size:1rem;padding-inline-start:16px;border-inline-start:3px solid #9ac43a}

/* --- لوحة ثلاث خانات (مزايا الدورات العامة) --- */
body.theme-smart .sm-sp-tri{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#e6efdb;border:1px solid #dbe7cd;border-radius:14px;overflow:hidden;box-shadow:0 16px 36px rgba(13,34,51,.08);margin-bottom:38px}
body.theme-smart .sm-sp-tri-cell{background:#fff;padding:28px 28px 30px;display:flex;flex-direction:column;gap:12px;transition:background .2s}
body.theme-smart .sm-sp-tri-cell:hover{background:#f8fbf4}
body.theme-smart .sm-sp-tri-cell h2{margin:0;font-size:1.14rem;font-weight:800;color:#003452}
body.theme-smart .sm-sp-tri-cell p{margin:0;color:#54687a;line-height:1.75;font-size:.98rem}

/* --- عنصر dl جوه اللوحة (شروط التسجيل) --- */
body.theme-smart .sm-sp-body dt{margin:0;font-size:1.42rem;font-weight:800;color:#003452;line-height:1.3}
body.theme-smart .sm-sp-body dd{margin:0;color:#54687a;font-size:1.06rem;line-height:1.85;max-width:62ch}

/* --- رقم الخطوة داخل الكبسولة (الدورات الداخلية) --- */
body.theme-smart .sm-sp-seg-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#eef5e2;color:#003452;font-size:.84rem;font-weight:800;flex:0 0 auto;transition:background .2s,color .2s}
body.theme-smart .sm-sp-seg .sm-sp-seg-btn.is-on .sm-sp-seg-num{background:#9ac43a;color:#0d2233}

/* --- بطاقة بيانات المعهد (اتصل بنا + جانب النماذج) --- */
body.theme-smart .sm-sp-card{background:#fff;border:1px solid #dbe7cd;border-radius:14px;overflow:hidden;box-shadow:0 16px 36px rgba(13,34,51,.08)}
body.theme-smart .sm-sp-card-head{background:linear-gradient(115deg,#003452,#02486f);padding:24px 28px}
body.theme-smart .sm-sp-card-head h2{margin:0 0 10px;font-size:1.45rem;font-weight:800;color:#fff}
body.theme-smart .sm-sp-card-head h5{margin:0;font-size:1.08rem;font-weight:800;color:#fff}
body.theme-smart .sm-sp-card-head p{margin:0;color:#c5d8e2;line-height:1.75;font-size:.97rem}
body.theme-smart .sm-sp-rows{list-style:none;margin:0;padding:0}
body.theme-smart .sm-sp-rows li{display:flex;align-items:center;gap:14px;padding:15px 26px;border-top:1px solid #eef3e7}
body.theme-smart .sm-sp-rows li:first-child{border-top:0}
body.theme-smart .sm-sp-row-body{display:flex;flex-direction:column;gap:3px;min-width:0}
body.theme-smart .sm-sp-row-body b{font-size:.71rem;text-transform:uppercase;letter-spacing:.09em;color:#7d8f9c;font-weight:700}
body.theme-smart .sm-sp-row-body a{color:#003452;font-weight:700;text-decoration:none;word-break:break-word}
body.theme-smart .sm-sp-row-body a:hover{color:#7ea82c!important}
body.theme-smart .sm-sp-row-body > span{color:#54687a;font-weight:600;font-size:.95rem}
body.theme-smart .sm-sp-card-sub{margin:0;padding:18px 26px 12px;font-size:.76rem;letter-spacing:.09em;text-transform:uppercase;color:#7d8f9c;font-weight:700;border-top:1px solid #eef3e7}
body.theme-smart .sm-sp-steps{list-style:none;margin:0;padding:0 26px 24px;display:grid;gap:13px}
body.theme-smart .sm-sp-steps li{display:flex;gap:12px;align-items:flex-start;color:#54687a;font-size:.94rem;line-height:1.6}
body.theme-smart .sm-sp-step-n{flex:0 0 auto;width:26px;height:26px;border-radius:9px;background:#eef5e2;color:#003452;font-weight:800;font-size:.82rem;display:inline-flex;align-items:center;justify-content:center}
body.theme-smart .sm-sp-cta--card{margin:0;padding:4px 26px 26px}
body.theme-smart .sm-sp-cta--card .btn{padding:12px 24px;font-size:.93rem}

/* --- الشاشات الصغيرة --- */
@media (max-width:1199px){
    body.theme-smart .sm-sp-cells{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:991px){
    body.theme-smart .sm-sp-cells,body.theme-smart .sm-sp-cells--2{grid-template-columns:repeat(2,minmax(0,1fr))}
    body.theme-smart .sm-sp-tri{grid-template-columns:1fr}
}
@media (max-width:575px){
    body.theme-smart .sm-sp-cells,body.theme-smart .sm-sp-cells--2{grid-template-columns:1fr}
    body.theme-smart .sm-sp-band{padding:22px}
    body.theme-smart .sm-sp-list-h,body.theme-smart .sm-sp-q summary,body.theme-smart .sm-sp-q-a{padding-inline:18px}
}

/* --- اتصل بنا: نفس أرضية باقي الصفحات الداخلية + الفورم كلوحة --- */
body.theme-smart .sm-sp-contact{background:#f4f8f0;padding:34px 0 42px}
body.theme-smart .sm-sp-contact + .space30{background:#f4f8f0}
body.theme-smart .sm-sp-contact .box4{background:#fff;border:1px solid #dbe7cd;border-radius:14px;box-shadow:0 16px 36px rgba(13,34,51,.08);padding:26px 14px 20px;margin:0}
body.theme-smart .sm-sp-contact .box4 h5{font-size:1.2rem;font-weight:800;color:#003452;margin:0}
body.theme-smart .sm-sp-contact #submit_contact{background:#003452!important;border:2px solid #003452!important;color:#fff!important;border-radius:999px!important;padding:12px 34px;font-weight:700}
body.theme-smart .sm-sp-contact #submit_contact:hover{background:#9ac43a!important;border-color:#9ac43a!important;color:#0d2233!important}
body.theme-smart .sm-sp-contact .inst-contact-info{display:flex}
body.theme-smart .sm-sp-contact .sm-sp-card{width:100%;display:flex;flex-direction:column}
body.theme-smart .sm-sp-contact .sm-sp-rows{flex:1 1 auto}

/* --- شريط طلب الكتيب: النص التابع أهدأ من العنوان --- */
body.theme-smart .sm-sp-band--request p{font-weight:500;font-size:.99rem;color:#bad2de}

/* --- الروابط جوه اللوحات ما تاخدش لون الهوفر العام (a:hover في _brand.css) --- */
body.theme-smart .sm-sp-panel--go:hover .sm-sp-body > strong,body.theme-smart .sm-sp-panel--go:hover .sm-sp-body > span{color:#003452!important}
body.theme-smart .sm-sp-panel--go:hover .sm-sp-body > span{color:#54687a!important}

@media (max-width:991px){
    body.theme-smart .sm-sp-contact .sm-sp-card{margin-top:22px}
}

/* --- لمسات أخيرة --- */
/* سطر الإجابة الطويل في الأسئلة الشائعة: حد أقصى للعرض عشان يفضل مقروء */
body.theme-smart .sm-sp-q-a p{max-width:100ch}
/* أيقونة الإرسال اتجاهية: بتتقلب في RTL */
body[dir="rtl"].theme-smart .sm-sp-rail .bi-send{transform:scaleX(-1)}

/* --- الشريط المقسّم على الشاشات المتوسطة: بنود تحت بعض بدل ما الكلام يتزاحم --- */
@media (min-width:992px) and (max-width:1199px){
    body.theme-smart .sm-sp-seg-btn{padding:12px 14px;font-size:.9rem;gap:7px}
}
@media (max-width:991px){
    body.theme-smart .sm-sp-seg{flex-wrap:wrap;border-radius:24px}
    body.theme-smart .sm-sp-seg > .sm-sp-seg-btn{flex:1 1 100%;justify-content:flex-start;white-space:normal;text-align:start}
    body.theme-smart .sm-sp-seg > .sm-sp-seg-btn + .sm-sp-seg-btn::before{display:none}
    body.theme-smart .sm-sp-chip{white-space:normal}
    body.theme-smart .sm-sp-panel{grid-template-columns:88px minmax(0,1fr) auto}
    body.theme-smart .sm-sp-mark{min-width:96px;font-size:2.2rem;padding-inline:16px}
    body.theme-smart .sm-sp-body{padding:24px 22px}
    body.theme-smart .sm-sp-body h2,body.theme-smart .sm-sp-body > strong,body.theme-smart .sm-sp-body dt{font-size:1.22rem}
}

/* ============================================================
   سمارت — تصحيح 2026-09-08: الشريط بقى تنقّل واللوحات كلها ظاهرة
   ------------------------------------------------------------
   قبل كده كان فيه لوحة واحدة ظاهرة والباقي hidden بجافاسكربت.
   دلوقتي كل اللوحات مرسومة فوق بعض، وكبسولات الشريط روابط <a>
   بتنطّ للوحة. كل المسافات منطقية (inline) عشان العربي RTL.
   ============================================================ */

/* اللوحات: رصّ رأسي بدل التبديل */
body.theme-smart .sm-sp-panels{display:grid;gap:14px}
body.theme-smart .sm-sp-panels > *{scroll-margin-top:24px}
body.theme-smart .sm-sp-panels > *:focus{outline:none}
body.theme-smart .sm-sp-panel-wrap{display:block;min-width:0}
body.theme-smart .sm-sp-panels > .sm-sp-list{scroll-margin-top:24px}

/* التمرير الناعم لما تدوس على كبسولة */
@media (prefers-reduced-motion:no-preference){
    html:has(body.theme-smart .sm-sp){scroll-behavior:smooth}
}

/* كبسولات الشريط بقت روابط مش أزرار */
body.theme-smart a.sm-sp-seg-btn{text-decoration:none!important}
body.theme-smart a.sm-sp-seg-btn,body.theme-smart a.sm-sp-seg-btn:hover,body.theme-smart a.sm-sp-seg-btn:focus{color:#003452}

/* اللوحة المقصودة بعد النطّ: تعليم بسيط من غير أي سكربت */
body.theme-smart .sm-sp-panels > *:target{outline:2px solid #9ac43a;outline-offset:3px;border-radius:14px}

/* فاصل بسيط بين مجموعات الأسئلة لما بقت كلها ظاهرة */
body.theme-smart .sm-sp-panels > .sm-sp-list + .sm-sp-list{margin-top:4px}

/* الشريط مايفضلش ملصوق في أول لوحة */
body.theme-smart .sm-sp-chips{margin-bottom:16px}

/* --- training-courses fix e77d32898ea74285b0f5d2cc97b9dc49 --- */
/* سمارت: رقاقات كبسولية بحافة خضرا تلتف في سطور */
body.theme-smart .inst-logos{background:#fff}
body.theme-smart .inst-logos-h{color:#003452;font-weight:700}
body.theme-smart .inst-logos-grid{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
body.theme-smart .inst-logos-item{flex:0 0 auto;width:auto;min-width:0;background:#fff;border:1px solid #e3ebe0;border-inline-start:4px solid #9ac43a;border-radius:40px;padding:12px 22px;min-height:74px}
body.theme-smart .inst-logos-item img{max-height:40px}

/* --- training-courses fix 902b1099af0552e0069fa94a260e7c9d --- */
/* الشعار كان تايه جوّه الكبسولة — نكبّره ونوسّع الحد الأدنى للعرض. */
body.theme-smart .inst-logos-item{min-width:172px;min-height:88px;padding:14px 26px}
body.theme-smart .inst-logos-item img{max-height:52px}

/* --- training-courses fix b5a90e88ece0351f58afc67ddd0279d1 --- */
/* سمارت: نصفين — البيانات ناحية، ونصف أخضر فاتح فيه السعر والزر. */
body.theme-smart.pg-training-courses .session-card{display:grid!important;grid-template-columns:1fr 210px;align-items:stretch;padding:0!important;overflow:hidden;border-radius:14px!important;border-inline-start:6px solid #003452!important}
body.theme-smart.pg-training-courses .session-card > ul{grid-column:1;width:100%!important;margin:0!important;padding:16px 18px!important;align-self:center}
body.theme-smart.pg-training-courses .session-card .price-box{position:static!important;grid-column:2;grid-row:1;background:#f2f7e9!important;border:0!important;border-radius:0!important;padding:16px 12px 8px!important;text-align:center;display:flex;flex-direction:column;justify-content:center}
body.theme-smart.pg-training-courses .session-card > form{grid-column:2;grid-row:2;background:#f2f7e9;padding:0 12px 14px;text-align:center}
body.theme-smart.pg-training-courses .session-card .btn{width:100%;border-radius:30px!important}

/* ============================================================
   سمارت — صفحات القوايم المشتركة: "فهرس أبجدي" (2026-09-08)
   ------------------------------------------------------------
   التخصصات / المدن / المقالات / المدوّنات كلها بنفس اللغة:
   شريط حروف لاصق فوق (روابط #hash بتنطّ بس)، وتحته مجموعات
   محرفية مرسومة كلها في الـHTML — مفيش أي حاجة متخبّية ورا
   جافاسكربت. البنود صفوف من سطرين مضغوطة.
   الماركب في app/Views/themes/smart/** — الأخضر #9ac43a
   والكحلي #003452 نفس ألوان الثيم.
   ============================================================ */

body.theme-smart .sm-az { background: #f4f8f0; padding: 26px 0 46px; }
body.theme-smart .sm-az + .space30 { background: #f4f8f0; }
body.theme-smart .sm-az-inner { min-width: 0; }

/* --- شريط الحروف --- */
body.theme-smart .sm-az-bar {
    position: sticky; top: 0; z-index: 6;
    display: flex; flex-wrap: wrap; gap: 6px;
    background: #fff; border: 1px solid #dbe7cd; border-radius: 18px;
    padding: 10px 12px; margin-bottom: 18px;
    box-shadow: 0 10px 26px rgba(13, 34, 51, .09);
}
body.theme-smart .sm-az-key {
    flex: 0 0 auto;
    min-width: 34px; height: 34px; padding: 0 7px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 11px; background: #f1f7ec; color: #003452;
    font-weight: 800; font-size: .95rem; line-height: 1;
    text-decoration: none !important;
    transition: background .18s, color .18s, transform .18s;
}
body.theme-smart a.sm-az-key:hover,
body.theme-smart a.sm-az-key:focus { background: #9ac43a; color: #0d2233 !important; transform: translateY(-2px); }
body.theme-smart a.sm-az-key:focus-visible { outline: 3px solid #003452; outline-offset: 2px; }
body.theme-smart .sm-az-key.is-off { background: #f3f6f1; color: #5f7168; font-weight: 700; }

/* --- المجموعات --- */
body.theme-smart .sm-az-groups { display: grid; gap: 14px; }
body.theme-smart .sm-az-group {
    background: #fff; border: 1px solid #dbe7cd; border-radius: 14px;
    overflow: hidden; box-shadow: 0 14px 32px rgba(13, 34, 51, .07);
    scroll-margin-top: 74px;
}
body.theme-smart .sm-az-gh {
    display: flex; align-items: center; gap: 12px; margin: 0;
    padding: 12px 20px; background: linear-gradient(115deg, #003452, #02486f);
}
body.theme-smart .sm-az-gl {
    width: 34px; height: 34px; flex: 0 0 auto; border-radius: 11px;
    background: #9ac43a; color: #0d2233;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.02rem; font-weight: 800; line-height: 1;
}
body.theme-smart .sm-az-gc {
    font-size: .78rem; font-weight: 700; letter-spacing: .09em;
    color: #c2d8e2; line-height: 1;
}

/* --- الصفوف --- */
body.theme-smart .sm-az-list { list-style: none; margin: 0; padding: 0; }
body.theme-smart .sm-az-row + .sm-az-row { border-top: 1px solid #eef3e7; }
body.theme-smart .sm-az-link {
    --link-hover-ink: #003452;
    display: grid; grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center; column-gap: 16px;
    padding: 12px 20px; text-decoration: none !important; color: #0d2233;
    transition: background .18s;
}
body.theme-smart .sm-az-link--media { grid-template-columns: auto minmax(0, 1fr) auto auto; }
body.theme-smart .sm-az-link:hover,
body.theme-smart .sm-az-link:focus { background: #f6fbef; }
body.theme-smart .sm-az-link:focus-visible { outline: 3px solid #9ac43a; outline-offset: -3px; }

body.theme-smart .sm-az-thumb {
    flex: 0 0 auto; width: 46px; height: 46px; border-radius: 13px;
    background: #f1f7ec; border: 1px solid #e7f0dd;
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden;
}
body.theme-smart .sm-az-thumb img { max-width: 28px; max-height: 28px; object-fit: contain; }
body.theme-smart .sm-az-thumb--photo { border: 0; }
body.theme-smart .sm-az-thumb--photo img { width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; }

body.theme-smart .sm-az-text { min-width: 0; display: flex; flex-direction: column; gap: 3px; text-align: start; }
body.theme-smart .sm-az-t { color: #003452; font-weight: 700; font-size: 1.02rem; line-height: 1.35; }
body.theme-smart .sm-az-m { color: #5a6e7d; font-weight: 400; font-size: .88rem; line-height: 1.55; }
body.theme-smart .sm-az-link:hover .sm-az-t { color: #0d2233; }
body.theme-smart .sm-az-link:hover .sm-az-m { color: #54687a; }

body.theme-smart .sm-az-stamp {
    color: #7d8f9c; font-size: .8rem; font-weight: 700;
    white-space: nowrap; letter-spacing: .01em;
}
body.theme-smart .sm-az-go {
    flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 10px;
    background: #eef5e2; color: #003452; font-size: 1.35rem; line-height: 1;
    transition: background .18s, color .18s;
}
body.theme-smart .sm-az-link:hover .sm-az-go { background: #9ac43a; color: #0d2233; }
body.theme-smart .sm-az-go .bi { line-height: 1; }
body.theme-smart .sm-az-sr {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
body.theme-smart .sm-az-empty {
    background: #fff; border: 1px solid #dbe7cd; border-radius: 14px;
    padding: 26px 24px; color: #54687a; font-size: 1rem;
    box-shadow: 0 14px 32px rgba(13, 34, 51, .07);
}

/* --- شريط الفلترة فوق قوايم المقالات والمدوّنات ---
   الصفحتين بياخدوا كلاس pg-training-courses، وقواعد صفحة الدورات بتصبغ
   الشريط أخضر — ورابط "المدوّنات/المقالات" جوّاه أخضر كمان من _brand.css
   (بـ!important وبمُعرِّف)، فكان كلام أخضر على أخضر. القواعد دي بتاخد نفس
   المُعرِّف عشان توزن أعلى، وبترجّع اللوحة بيضا والكلام كحلي. */
body.theme-smart .sm-az-filterwrap { background: #f4f8f0; padding-top: 22px; }
body.theme-smart .sm-az-filterwrap #common-filter-box-modal-one { padding: 0; }
body.theme-smart.pg-training-courses .sm-az-filterwrap #common-filter-box-modal-one .box2,
body.theme-smart .sm-az-filterwrap #common-filter-box-modal-one .filter-courselist-wrap {
    background: #fff; border: 1px solid #dbe7cd; border-radius: 18px;
    box-shadow: 0 10px 26px rgba(13, 34, 51, .07);
    padding: 12px 14px; margin: 0;
}
body.theme-smart .sm-az-filterwrap #common-filter-box-modal-one .selectbox {
    border: 1px solid #dbe7cd !important; background: #fbfdf8 !important;
    color: #003452 !important; font-weight: 600; height: auto; padding: 9px 12px;
}
body.theme-smart.pg-training-courses .sm-az-filterwrap #common-filter-box-modal-one .menu-two,
body.theme-smart .sm-az-filterwrap #common-filter-box-modal-one .menu-two {
    background: #f1f7ec !important; border: 1px solid #dbe7cd !important;
    color: #003452 !important; font-weight: 700; border-radius: 999px !important;
    padding: 8px 18px !important;
}
body.theme-smart.pg-training-courses .sm-az-filterwrap #common-filter-box-modal-one .menu-two:hover,
body.theme-smart .sm-az-filterwrap #common-filter-box-modal-one .menu-two:hover {
    background: #9ac43a !important; border-color: #9ac43a !important; color: #0d2233 !important;
}

/* الشريط بيلتف لسطرين على الشاشات المتوسطة، فمسافة النطّ بتكبر معاه */
@media (min-width: 768px) and (max-width: 1199px) {
    body.theme-smart .sm-az-group { scroll-margin-top: 122px; }
}

/* --- التحميل (سبينر الفلترة) --- */
body.theme-smart .sm-az-load { padding: 26px 0; }

/* --- المتوسط والصغير --- */
@media (max-width: 767px) {
    body.theme-smart .sm-az { padding: 18px 0 34px; }
    /* الشريط بيلتف على 3 سطور في الموبايل — لو فضل لاصق هياكل ربع الشاشة،
       فبيبقى عادي هنا والنطّ بيوصل لعنوان المجموعة على طول. */
    body.theme-smart .sm-az-bar { position: static; border-radius: 14px; padding: 8px 9px; gap: 5px; }
    body.theme-smart .sm-az-key { min-width: 30px; height: 30px; font-size: .86rem; border-radius: 9px; padding: 0 5px; }
    body.theme-smart .sm-az-group { scroll-margin-top: 14px; }
    body.theme-smart .sm-az-gh { padding: 10px 15px; }
    body.theme-smart .sm-az-link { padding: 11px 15px; column-gap: 11px; grid-template-columns: minmax(0, 1fr) auto; }
    body.theme-smart .sm-az-link > .sm-az-text { grid-column: 1; grid-row: 1; }
    body.theme-smart .sm-az-link > .sm-az-stamp { grid-column: 1; grid-row: 2; justify-self: start; margin-top: 5px; }
    body.theme-smart .sm-az-link > .sm-az-go { grid-column: 2; grid-row: 1 / span 2; }
    body.theme-smart .sm-az-link--media { grid-template-columns: auto minmax(0, 1fr) auto; }
    body.theme-smart .sm-az-link--media > .sm-az-thumb { grid-column: 1; grid-row: 1; }
    body.theme-smart .sm-az-link--media > .sm-az-text { grid-column: 2; grid-row: 1; }
    body.theme-smart .sm-az-link--media > .sm-az-go { grid-column: 3; grid-row: 1; }
    body.theme-smart .sm-az-thumb { width: 40px; height: 40px; border-radius: 11px; }
    body.theme-smart .sm-az-thumb img { max-width: 24px; max-height: 24px; }
    body.theme-smart .sm-az-t { font-size: .97rem; }
    body.theme-smart .sm-az-m { font-size: .84rem; }
    body.theme-smart .sm-az-stamp { font-size: .74rem; }
    body.theme-smart .sm-az-go { width: 26px; height: 26px; font-size: 1.15rem; }
}

/* الأيقونة السهم بتاعة الصف اتجاهية أصلاً (bi-arrow-left-short في العربي) */


/* ============================================================
   سمارت — تفاصيل الدورة: مفتاح مقسّم + شريط إجراء ملتصق (2026-09-08)
   ------------------------------------------------------------
   • مفتاح مقسّم (.sm-sp-seg) تحت العنوان بينطّ للأقسام بـanchor بس.
   • النص في عمود قراءة مريح (~68 حرف)، والجدول والكروت بعرض الصفحة.
   • الجدول صف رقاقات مواعيد مضغوطة بتلتف (.sm-dates / .sm-dc).
   • الإجراء الرئيسي الوحيد: شريط ملتصق أسفل الشاشة (.sm-bar).
   الماركب في app/Views/themes/smart/courses/course_details/**.
   البطاقة الجانبية القديمة (.sm-cd / .sm-float) اتشالت — قواعدها فوق
   بقت بدون ماركب، سايبينها زي ما هي عشان الملف append-only.
   ============================================================ */

/* --- الشريط والقسم: نفس الأخضر الفاتح بتاع الثيم --- */
body.theme-smart.pg-training-courses .sm-crs { padding-bottom: 6px; }

/* الأقسام كلها ظاهرة — .tab-pane بتتخبى بـfade في البوتستراب */
body.theme-smart.pg-training-courses .sm-crs .tab-pane {
    display: block !important; opacity: 1 !important; visibility: visible !important; transition: none !important;
}
/* الكارت الأبيض العملاق المشترك حوالين .tab-content بيتلغي — كل قسم كارت لوحده */
body.theme-smart.pg-training-courses .sm-crs .tab-content {
    background: transparent !important; border: 0 !important; border-radius: 0 !important;
    box-shadow: none !important; padding: 0 !important; margin: 0 !important;
}

/* --- المفتاح المقسّم --- */
body.theme-smart.pg-training-courses .sm-crs-seg {
    position: sticky; top: 0; z-index: 30; margin: 0 0 24px;
    overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch;
}
body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn {
    flex: 1 1 auto; text-decoration: none !important; color: #003452 !important;
    padding: 12px 18px; font-size: .92rem;
}
body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn.is-on { color: #fff !important; }
body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn.is-on .bi { color: #9ac43a !important; }
body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn:hover { color: #003452 !important; }
body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn.is-on:hover { color: #fff !important; }

/* --- القسم الواحد --- */
body.theme-smart.pg-training-courses .sm-crs-sec {
    background: #fff; border: 1px solid #dbe7cd; border-radius: 14px;
    padding: 32px 36px; margin: 0 0 24px; box-shadow: 0 12px 30px rgba(13, 34, 51, .07);
}
body.theme-smart.pg-training-courses .sm-crs-sec:last-child { margin-bottom: 0; }
body.theme-smart.pg-training-courses .sm-crs-h { font-size: 1.28rem; margin: 0 0 24px; }
body.theme-smart.pg-training-courses .sm-crs .tab-pane { scroll-margin-top: 96px; }

/* --- عمود القراءة --- */
body.theme-smart.pg-training-courses .sm-crs-prose { max-width: 68ch; }
body.theme-smart.pg-training-courses .sm-crs-prose .row { margin: 0; }
body.theme-smart.pg-training-courses .sm-crs-prose [class*="col-"] { padding: 0; }
body.theme-smart.pg-training-courses .sm-crs-prose p,
body.theme-smart.pg-training-courses .sm-crs-prose li { color: #3d5464; line-height: 1.8; }
body.theme-smart.pg-training-courses .sm-crs-prose h6 {
    color: #003452 !important; font-weight: 800; font-size: 1.02rem; margin: 0 0 8px;
    padding-inline-start: 12px; border-inline-start: 4px solid #9ac43a; line-height: 1.4;
}
/* المخطط: العمودين بتوع الجافاسكربت فوق بعض جوه عمود القراءة */
body.theme-smart.pg-training-courses .sm-crs-prose .ouline-area { max-width: none; }
body.theme-smart.pg-training-courses .sm-crs-prose #outlineCol1,
body.theme-smart.pg-training-courses .sm-crs-prose #outlineCol2,
body.theme-smart.pg-training-courses .sm-crs-prose #outlineCol3,
body.theme-smart.pg-training-courses .sm-crs-prose #outlineCol4 { width: 100%; }
body.theme-smart.pg-training-courses .sm-crs-prose .col-md-6 { flex: 0 0 100%; max-width: 100%; }
body.theme-smart.pg-training-courses .sm-crs-prose #outlineCol2:empty { display: none; }
body.theme-smart.pg-training-courses .sm-crs-sec--wide .sm-crs-prose { max-width: none; }

/* --- رقاقات المواعيد --- */
body.theme-smart.pg-training-courses .sm-dates-year { margin: 0 0 28px; }
body.theme-smart.pg-training-courses .sm-dates-year:last-of-type { margin-bottom: 20px; }
body.theme-smart.pg-training-courses .sm-crs .year-heading {
    font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
    color: #5a7183; margin: 0 0 14px; text-align: start;
}
body.theme-smart.pg-training-courses .sm-dates {
    display: flex; flex-wrap: wrap; gap: 12px; margin: 0;
}
body.theme-smart.pg-training-courses .sm-dc {
    flex: 1 1 264px; max-width: 340px; min-width: 0;
    display: flex; flex-direction: column; gap: 8px;
    background: #fff; padding: 16px 18px 14px;
    border: 1px solid #dbe7cd !important;
    border-inline-start: 5px solid #9ac43a !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 14px rgba(13, 34, 51, .05);
    transition: box-shadow .2s, border-color .2s, transform .2s;
}
body.theme-smart.pg-training-courses .sm-dc:hover {
    box-shadow: 0 12px 26px rgba(13, 34, 51, .1); transform: translateY(-2px);
}
body.theme-smart.pg-training-courses .sm-dc.virtual { border-inline-start-color: #003452 !important; }
body.theme-smart.pg-training-courses .sm-dc-date {
    display: flex; align-items: baseline; gap: 8px; margin: 0;
    font-size: 1rem; font-weight: 800; color: #003452; line-height: 1.35;
}
body.theme-smart.pg-training-courses .sm-dc-date .bi { color: #7ea82c; font-size: .95rem; }
body.theme-smart.pg-training-courses .sm-dc-flag {
    align-self: flex-start; margin: 0; padding: 3px 10px; border-radius: 999px;
    background: #eef5e2; color: #46603a; font-size: .72rem; font-weight: 700;
}
body.theme-smart.pg-training-courses .sm-dc-meta { list-style: none; margin: 0; padding: 0; width: 100% !important; }
body.theme-smart.pg-training-courses .sm-dc-meta li {
    display: flex; align-items: flex-start; gap: 8px; margin: 0 0 4px;
    font-size: .84rem; line-height: 1.5; color: #55697a;
}
body.theme-smart.pg-training-courses .sm-dc-meta li:last-child { margin-bottom: 0; }
body.theme-smart.pg-training-courses .sm-dc-meta .bi { color: #94a9b6; font-size: .84rem; line-height: 1.6; flex: 0 0 auto; }
body.theme-smart.pg-training-courses .sm-dc-meta a.link { color: #7ea82c; }

body.theme-smart.pg-training-courses .sm-dc-foot {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    margin-top: auto; padding-top: 12px; border-top: 1px solid #eef2ea;
}
body.theme-smart.pg-training-courses .sm-dc .price-box { min-width: 0; }
body.theme-smart.pg-training-courses .sm-dc .price-tag { display: block; }
body.theme-smart.pg-training-courses .sm-dc-per {
    display: block; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase;
    color: #7d90a0; font-weight: 700; margin-bottom: 1px;
}
body.theme-smart.pg-training-courses .sm-dc-select { position: relative; display: inline-block; }
body.theme-smart.pg-training-courses .sm-dc .feestoggle-select {
    appearance: none; -webkit-appearance: none; -moz-appearance: none;
    border: 0 !important; background: transparent !important; box-shadow: none !important;
    height: auto !important; padding: 0 !important; padding-inline-end: 16px !important;
    font-size: 1.02rem !important; font-weight: 800 !important; color: #003452 !important;
    line-height: 1.25 !important; cursor: pointer; width: auto; border-radius: 0 !important;
}
body.theme-smart.pg-training-courses .sm-dc .select-caret {
    position: absolute; inset-inline-end: 0; top: 50%; transform: translateY(-50%);
    font-size: .6rem; color: #7ea82c; pointer-events: none;
}
body.theme-smart.pg-training-courses .sm-dc-form { margin: 0; flex: 0 0 auto; }
body.theme-smart.pg-training-courses .sm-dc-btn {
    background: #fff !important; border: 2px solid #9ac43a !important; color: #003452 !important;
    border-radius: 999px !important; padding: 7px 16px !important;
    font-size: .82rem !important; font-weight: 700 !important; white-space: nowrap;
}
body.theme-smart.pg-training-courses .sm-dc-btn:hover { background: #9ac43a !important; color: #0d2233 !important; }
body.theme-smart.pg-training-courses .sm-dc-closed {
    margin: 0; font-size: .78rem; font-weight: 700; color: #9c2f2f;
    background: #fbeeee; border-radius: 999px; padding: 6px 12px; white-space: nowrap;
}
body.theme-smart.pg-training-courses .sm-dates-empty,
body.theme-smart.pg-training-courses .sm-dates-year--empty .sm-dates-empty {
    margin: 0; padding: 16px 20px; color: #55697a; font-size: .92rem;
    background: #f4f9ee; border: 1px solid #dbe7cd; border-inline-start: 5px solid #9ac43a; border-radius: 14px;
}
body.theme-smart.pg-training-courses .sm-dates-note .alert { border-radius: 14px; }
body.theme-smart.pg-training-courses .sm-dates-foot { display: block; margin-top: 20px; }
body.theme-smart.pg-training-courses .sm-dates-foot .alert-info {
    background: #f4f9ee !important; border: 1px solid #dbe7cd !important; color: #28414f !important; border-radius: 14px !important;
}
body.theme-smart.pg-training-courses .sm-dates-foot .discount-link { color: #003452 !important; }
body.theme-smart.pg-training-courses .fees-box-right2-2022 { font-size: .84rem; color: #5a6e7d; max-width: 78ch; }
body.theme-smart.pg-training-courses .fees-box-right2-2022 p { margin: 0 0 6px; }

/* --- كروت "التعلم الافتراضي / القاعات": شبكة بدل الكاروسيل --- */
body.theme-smart.pg-training-courses .sm-crs .owl-carousel .owl-stage-outer { overflow: visible !important; }
body.theme-smart.pg-training-courses .sm-crs .owl-carousel .owl-stage {
    width: auto !important; transform: none !important; transition: none !important;
    display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
}
body.theme-smart.pg-training-courses .sm-crs .owl-carousel .owl-item { width: auto !important; float: none !important; margin: 0 !important; }
body.theme-smart.pg-training-courses .sm-crs .owl-carousel .owl-nav,
body.theme-smart.pg-training-courses .sm-crs .owl-carousel .owl-dots { display: none !important; }
body.theme-smart.pg-training-courses .sm-crs .courselisting-normal {
    border: 1px solid #dbe7cd !important; border-radius: 14px !important; height: 100%;
    box-shadow: 0 6px 18px rgba(13, 34, 51, .06) !important;
}
body.theme-smart.pg-training-courses .sm-crs .courselisting-normal .course-title { color: #003452 !important; }

/* --- صف الإجراءات الثانوية فوق --- */
body.theme-smart.pg-training-courses .sm-crs-acts {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
    background: #fff; border: 1px solid #dbe7cd; border-inline-start: 6px solid #9ac43a;
    border-radius: 14px; padding: 14px 18px; box-shadow: 0 8px 24px rgba(13, 34, 51, .06);
}
body.theme-smart.pg-training-courses .sm-crs-acts form { margin: 0; }
body.theme-smart.pg-training-courses .sm-crs-acts .btn {
    margin: 0 !important; float: none !important; border-radius: 999px !important;
    padding: 9px 20px !important; font-size: .86rem !important; font-weight: 700 !important;
    background: #fff !important; border: 2px solid #dbe7cd !important; color: #003452 !important;
}
body.theme-smart.pg-training-courses .sm-crs-acts .btn:hover { border-color: #9ac43a !important; background: #f6fbef !important; }

/* --- كتلة التواصل تحت الأقسام --- */
body.theme-smart.pg-training-courses .sm-crs .inst-cra {
    position: static; margin: 24px 0 0; width: 100%; max-width: none;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 26px;
    background: #fff; border: 1px solid #dbe7cd; border-inline-start: 6px solid #003452;
    border-radius: 14px; padding: 18px 24px; box-shadow: 0 8px 24px rgba(13, 34, 51, .06);
}
body.theme-smart.pg-training-courses .sm-crs .inst-cra-head { padding: 0; border: 0; }
body.theme-smart.pg-training-courses .sm-crs .inst-cra-head > .bi { color: #9ac43a; }
body.theme-smart.pg-training-courses .sm-crs .inst-cra-list { gap: 10px 22px; }
body.theme-smart.pg-training-courses .sm-crs .inst-cra-list li .bi { color: #003452; }

/* ============================================================
   شريط الإجراء الملتصق أسفل الشاشة
   ============================================================ */
body.theme-smart.pg-training-courses { padding-bottom: 84px; }

body.theme-smart.pg-training-courses .sm-bar {
    position: fixed; inset-inline: 0; bottom: 0; z-index: 1030;
    background: #003452; border-top: 3px solid #9ac43a;
    box-shadow: 0 -10px 30px rgba(13, 34, 51, .22);
}
body.theme-smart.pg-training-courses .sm-bar-in {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px 28px; padding-top: 10px; padding-bottom: 10px; min-height: 68px;
}
body.theme-smart.pg-training-courses .sm-bar-facts { display: flex; align-items: center; gap: 28px; min-width: 0; }
body.theme-smart.pg-training-courses .sm-bar-fact { display: flex; flex-direction: column; min-width: 0; }
body.theme-smart.pg-training-courses .sm-bar-fact--fee {
    padding-inline-start: 28px; border-inline-start: 1px solid rgba(255, 255, 255, .18);
}
body.theme-smart.pg-training-courses .sm-bar-k {
    font-size: .68rem; letter-spacing: .1em; text-transform: uppercase;
    font-weight: 700; color: #9ac43a; line-height: 1.5;
}
body.theme-smart.pg-training-courses .sm-bar-fact strong {
    font-size: 1.02rem; font-weight: 800; color: #fff; line-height: 1.35;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body.theme-smart.pg-training-courses .sm-bar-fact .sm-bar-none { font-size: .9rem; font-weight: 600; color: #d6e3ea; }
body.theme-smart.pg-training-courses .sm-bar-sub { font-size: .74rem; color: #b9cdd8; line-height: 1.4; }
body.theme-smart.pg-training-courses .sm-bar-act { display: flex; align-items: center; gap: 18px; flex: 0 0 auto; }
body.theme-smart.pg-training-courses .sm-bar-link {
    font-size: .84rem; font-weight: 700; color: #cfe0e8 !important; text-decoration: none !important;
    border-bottom: 1px solid rgba(207, 224, 232, .45); padding-bottom: 1px;
}
body.theme-smart.pg-training-courses .sm-bar-link:hover { color: #9ac43a !important; border-bottom-color: #9ac43a; }
body.theme-smart.pg-training-courses .sm-bar-form { margin: 0; }
body.theme-smart.pg-training-courses .sm-bar-btn {
    background: #9ac43a !important; border: 2px solid #9ac43a !important; color: #0d2233 !important;
    border-radius: 999px !important; padding: 11px 30px !important;
    font-size: .95rem !important; font-weight: 800 !important; white-space: nowrap;
}
body.theme-smart.pg-training-courses .sm-bar-btn:hover { background: #fff !important; border-color: #fff !important; color: #003452 !important; }

/* --- تابلت --- */
@media (max-width: 991px) {
    body.theme-smart.pg-training-courses .sm-crs-sec { padding: 24px 22px; }
    body.theme-smart.pg-training-courses .sm-crs-seg { border-radius: 18px; justify-content: flex-start; }
    body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn { flex: 0 0 auto; }
    body.theme-smart.pg-training-courses .sm-crs .owl-carousel .owl-stage { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- موبايل --- */
@media (max-width: 767px) {
    body.theme-smart.pg-training-courses { padding-bottom: 132px; }
    body.theme-smart.pg-training-courses .sm-crs-sec { padding: 20px 16px; border-radius: 14px; }
    body.theme-smart.pg-training-courses .sm-crs-h { font-size: 1.12rem; margin-bottom: 18px; }
    body.theme-smart.pg-training-courses .sm-crs-seg { padding: 5px; gap: 4px; }
    body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn { padding: 10px 14px; font-size: .85rem; }
    body.theme-smart.pg-training-courses .sm-crs-seg > .sm-sp-seg-btn + .sm-sp-seg-btn::before { display: none; }
    body.theme-smart.pg-training-courses .sm-dc { flex: 1 1 100%; max-width: none; }
    body.theme-smart.pg-training-courses .sm-crs .owl-carousel .owl-stage { grid-template-columns: minmax(0, 1fr); }
    body.theme-smart.pg-training-courses .sm-crs .inst-cra { flex-direction: column; align-items: flex-start; }

    body.theme-smart.pg-training-courses .sm-bar-in {
        flex-wrap: wrap; gap: 10px 16px; padding-top: 12px; padding-bottom: 12px;
    }
    body.theme-smart.pg-training-courses .sm-bar-facts { flex: 1 1 100%; gap: 18px; }
    body.theme-smart.pg-training-courses .sm-bar-fact--fee { padding-inline-start: 18px; }
    body.theme-smart.pg-training-courses .sm-bar-fact strong { font-size: .95rem; }
    body.theme-smart.pg-training-courses .sm-bar-act { flex: 1 1 100%; justify-content: space-between; gap: 12px; }
    body.theme-smart.pg-training-courses .sm-bar-btn { padding: 11px 24px !important; }
}

/* --- الشاشات الضيقة جدًا --- */
@media (max-width: 400px) {
    body.theme-smart.pg-training-courses .sm-bar-link { font-size: .78rem; }
    body.theme-smart.pg-training-courses .sm-bar-btn { padding: 10px 18px !important; font-size: .88rem !important; }
}


/* --- training-courses fix sm-dc-beats-listing-card --- */
/* رقاقات المواعيد كانت واقعة تحت قواعد كارت الجلسة بتاع صفحة القوايم
   (‎.session-card display:grid!important) وتحت قواعد قديمة بالـID
   (‎#coursedetails-content-section #nav-schedulefees p{color:#fff}).
   القواعد دي بترجّع تخطيط الرقاقة بوزن أعلى. الملف append-only فالتصحيح
   بيتكتب هنا مش فوق. */

body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc {
    display: flex !important; flex-direction: column !important;
    grid-template-columns: none !important; align-items: stretch !important;
    gap: 8px !important; padding: 16px 18px 14px !important; overflow: visible !important;
    border: 1px solid #dbe7cd !important; border-inline-start: 5px solid #9ac43a !important;
    border-radius: 14px !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc.virtual {
    border-inline-start-color: #003452 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc > .sm-dc-date {
    color: #003452 !important; font-size: 1rem !important; font-weight: 800 !important;
    margin: 0 !important; line-height: 1.35 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc > .sm-dc-flag {
    color: #46603a !important; margin: 0 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc > .sm-dc-meta {
    grid-column: auto !important; width: auto !important;
    margin: 0 !important; padding: 0 !important; align-self: stretch !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .sm-dc-meta li {
    color: #55697a !important; line-height: 1.5 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .price-box {
    grid-area: auto !important; position: static !important;
    display: block !important; text-align: start !important;
    background: transparent !important; border: 0 !important;
    border-radius: 0 !important; padding: 0 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .price-tag {
    background: transparent !important; border: 0 !important; padding: 0 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .sm-dc-per {
    color: #7d90a0 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .feestoggle-select {
    height: auto !important; width: auto !important; font-size: 1.02rem !important;
    border: 0 !important; border-radius: 0 !important; background: transparent !important;
    padding: 0 !important; padding-inline-end: 16px !important;
    color: #003452 !important; font-weight: 800 !important; line-height: 1.25 !important;
    text-align: start !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc > .sm-dc-foot {
    grid-column: auto !important; background: transparent !important;
    padding: 12px 0 0 !important; margin-top: auto !important; text-align: start !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .sm-dc-form {
    grid-column: auto !important; grid-row: auto !important;
    background: transparent !important; padding: 0 !important; margin: 0 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .btn {
    width: auto !important; border-radius: 999px !important;
    background: #fff !important; border: 2px solid #9ac43a !important; color: #003452 !important;
    padding: 7px 16px !important; font-size: .82rem !important; font-weight: 700 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .btn:hover {
    background: #9ac43a !important; color: #0d2233 !important;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc-closed { color: #9c2f2f !important; }
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dates-empty,
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dates-foot p { color: #55697a !important; }
body.theme-smart.pg-training-courses #coursedetails-content-section .year-heading {
    font-size: .78rem !important; font-weight: 800 !important; color: #5a7183 !important;
    letter-spacing: .1em; margin: 0 0 14px !important;
}


/* --- training-courses fix sm-crs-one-responsive-copy --- */
/* النسخة الطولية بقت النسخة الوحيدة (سمارت مش بيطبع بلوك الموبايل خالص)،
   فلازم تفضل ظاهرة تحت 992px كمان — الأصل بيخبيها هناك. */
body.theme-smart.pg-training-courses #coursedetails-content-section .coursedetails-content-section-desktop {
    display: block !important;
}

/* --- training-courses fix sm-dates-even-grid --- */
/* شبكة متساوية بدل flex-grow: الرقاقات في الصف الواحد بنفس العرض. */
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dates {
    display: grid !important; grid-template-columns: repeat(auto-fill, minmax(252px, 1fr));
    gap: 12px; align-items: stretch;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc { max-width: none !important; }
@media (max-width: 575px) {
    body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dates {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* --- training-courses fix sm-crs-reading-column --- */
/* عمود قراءة مركزي لأقسام النص، والأقسام اللي فيها بيانات (الجدول/الكروت)
   بتاخد عرض الصفحة كله — إيقاع "نص ضيّق / بيانات عريضة". */
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-crs-sec:not(.sm-crs-sec--wide) {
    max-width: 840px; margin-inline: auto;
}
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-crs-prose { max-width: 70ch; }

/* --- training-courses fix sm-crs-seg-scroll-mobile --- */
/* الشريط المقسّم المشترك بيتقلب عمود تحت 768px — هنا لازم يفضل صف واحد
   بيتزحلق أفقيًا، لأنه لاصق فوق ومينفعش ياكل الشاشة. */
@media (max-width: 767px) {
    body.theme-smart.pg-training-courses #coursedetails-content-section .sm-crs-seg {
        flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important;
    }
    body.theme-smart.pg-training-courses #coursedetails-content-section .sm-crs-seg > .sm-sp-seg-btn {
        flex: 0 0 auto !important; width: auto !important; justify-content: center !important;
    }
}

/* --- training-courses fix sm-dates-4-up --- */
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dates {
    grid-template-columns: repeat(auto-fill, minmax(284px, 1fr));
}

/* --- training-courses fix sm-crs-acts-secondary --- */
/* أزرار الصف العلوي كلها ثانوية: الإجراء الرئيسي الوحيد في الشريط الملتصق.
   ‎#searresultscourses-btn2 قاعدة بالـID فمحتاجين ID في المحدّد عشان نغلبها. */
body.theme-smart.pg-training-courses #coursedetails-buttons-section .sm-crs-acts .btn,
body.theme-smart.pg-training-courses #coursedetails-buttons-section .sm-crs-acts #searresultscourses-btn2 {
    background: #fff !important; border: 2px solid #dbe7cd !important; color: #003452 !important;
    border-radius: 999px !important; padding: 9px 20px !important;
    font-size: .86rem !important; font-weight: 700 !important; width: auto !important;
}
body.theme-smart.pg-training-courses #coursedetails-buttons-section .sm-crs-acts .btn:hover,
body.theme-smart.pg-training-courses #coursedetails-buttons-section .sm-crs-acts #searresultscourses-btn2:hover {
    background: #f6fbef !important; border-color: #9ac43a !important; color: #003452 !important;
}


/* --- training-courses fix sm-crs-contrast --- */
/* رفع تباين النصوص الصغيرة والأيقونات لحد 4.5:1 على الأبيض. */
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .sm-dc-per { color: #5a6e7d !important; }
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dc .sm-dc-meta .bi { color: #7e94a3; }
body.theme-smart.pg-training-courses #coursedetails-content-section .year-heading { color: #4d6273 !important; }
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dates-empty,
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-dates-foot p { color: #4d6273 !important; }


/* --- training-courses fix sm-bar-slim-mobile --- */
/* الشريط كان بياخد 135px من شاشة الموبايل. بنرصّه في صف واحد:
   سطرين مضغوطين (الموعد / الرسوم) وجنبهم الزر، والرابط بيتشال لأن
   المفتاح المقسّم فيه بند "الجدول الزمني والرسوم" أصلاً. */
@media (max-width: 767px) {
    body.theme-smart.pg-training-courses { padding-bottom: 80px; }
    body.theme-smart.pg-training-courses .sm-bar-in {
        flex-wrap: nowrap; gap: 14px; padding-top: 10px; padding-bottom: 10px; min-height: 0;
    }
    body.theme-smart.pg-training-courses .sm-bar-facts {
        flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0;
    }
    body.theme-smart.pg-training-courses .sm-bar-fact {
        flex-direction: row; align-items: baseline; gap: 8px; flex-wrap: nowrap; min-width: 0;
    }
    body.theme-smart.pg-training-courses .sm-bar-fact--fee {
        padding-inline-start: 0; border-inline-start: 0;
    }
    body.theme-smart.pg-training-courses .sm-bar-k { flex: 0 0 auto; font-size: .62rem; letter-spacing: .06em; }
    body.theme-smart.pg-training-courses .sm-bar-fact strong { font-size: .9rem; }
    body.theme-smart.pg-training-courses .sm-bar-sub { flex: 0 1 auto; font-size: .68rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    body.theme-smart.pg-training-courses .sm-bar-link { display: none; }
    body.theme-smart.pg-training-courses .sm-bar-act { flex: 0 0 auto; }
    body.theme-smart.pg-training-courses .sm-bar-btn { padding: 10px 20px !important; font-size: .88rem !important; }
}
@media (max-width: 400px) {
    body.theme-smart.pg-training-courses .sm-bar-in { gap: 10px; }
    body.theme-smart.pg-training-courses .sm-bar-btn { padding: 10px 16px !important; font-size: .84rem !important; }
}

/* --- training-courses fix sm-bar-date-fits --- */
/* "أقرب موعد" كان بيتقص على 390px بسبب اسم المدينة جنبه — المدينة موجودة
   في رقاقة الموعد نفسها، فبنشيلها من الشريط على الموبايل بس. */
@media (max-width: 767px) {
    body.theme-smart.pg-training-courses .sm-bar-fact:not(.sm-bar-fact--fee) .sm-bar-sub { display: none; }
    body.theme-smart.pg-training-courses .sm-bar-fact { gap: 6px; }
}


/* ============================================================
   سمارت — صفحة اتصل بنا (2026-09-09)
   ------------------------------------------------------------
   شريطان مكدّسان بعرض الصفحة بدل عمودين متجاورين: القارئ بياخد
   قرار واحد في كل شريط — تواصل فوري فوق، رسالة مكتوبة تحت.
   المحدّد ‎.page-contact مقصود: الكنترولر بيدّي الصفحة دي كلاس
   ‎pg-training-courses كمان، وقواعد صفحة الدورات في الملف ده كتيرة —
   الحصر على ‎.page-contact بيمنع أي تسرّب في الاتجاهين.
   ============================================================ */

/* ── الشريط الغامق: طرق التواصل الفورية ── */
/* الحد الأخضر فوق ضروري: بانر الصفحة كحلي كمان، ومن غير الفاصل ده
   الكتلتين بيقروا ككتلة داكنة واحدة طولها نص الشاشة. */
body.theme-smart.page-contact .sm-cu-reach {
    background: #0d2233; border-top: 5px solid #9ac43a;
    padding: 56px 0 60px; color: #fff;
}

body.theme-smart.page-contact .sm-cu-head { max-width: 68ch; margin: 0 0 40px; }
body.theme-smart.page-contact .sm-cu-head h2 {
    font-size: 2.2rem; line-height: 1.2; font-weight: 800; color: #fff; margin: 0 0 12px;
}
body.theme-smart.page-contact .sm-cu-head p { color: #c3d3dd; font-size: 1rem; line-height: 1.7; margin: 0; }

/* "المفتاح المقسّم": ثلاث خانات في إطار واحد بخطوط رفيعة بينها —
   نفس النمط المستخدم في صفحة تفاصيل الدورة عند سمارت. */
body.theme-smart.page-contact .sm-cu-keys {
    display: grid; grid-template-columns: repeat(3, 1fr);
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(154, 196, 58, .3); border-radius: 20px; overflow: hidden;
}
body.theme-smart.page-contact .sm-cu-key {
    padding: 26px 28px; min-width: 0;
    border-inline-start: 1px solid rgba(154, 196, 58, .3);
}
body.theme-smart.page-contact .sm-cu-key:first-child { border-inline-start: 0; }

body.theme-smart.page-contact .sm-cu-ico {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 14px;
    background: #9ac43a; color: #0d2233; font-size: 1.15rem; margin-bottom: 14px;
}
body.theme-smart.page-contact .sm-cu-k {
    display: block; font-size: .72rem; font-weight: 700; letter-spacing: .12em;
    text-transform: uppercase; color: #9ac43a; margin-bottom: 6px;
}
body.theme-smart.page-contact .sm-cu-v {
    display: block; font-size: 1.06rem; font-weight: 700; line-height: 1.45;
    color: #fff; text-decoration: none; overflow-wrap: anywhere;
}
body.theme-smart.page-contact .sm-cu-sub {
    display: block; margin-top: 6px; font-size: .86rem; line-height: 1.5; color: #c3d3dd;
}

/* رقاقة واتساب: نفس رقم التليفون لكن إجراء مختلف، فبتفضل تابعة لخانته */
body.theme-smart.page-contact .sm-cu-chip {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 16px;
    padding: 9px 18px; border-radius: 999px;
    background: #9ac43a; color: #0d2233; font-weight: 700; font-size: .84rem; text-decoration: none;
}
/* ‎_brand.css بيفرض لون الروابط عند الوقوف بـ!important وهو نفس الأخضر
   اللي الرقاقة مليانة بيه — فبنعلن حبر الوقوف بنفسنا. */
body.theme-smart.page-contact .sm-cu-chip:hover { background: #fff; --link-hover-ink: #0d2233; }

body.theme-smart.page-contact .sm-cu-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
body.theme-smart.page-contact .sm-cu-links a {
    display: inline-flex; align-items: center; gap: 9px; padding: 11px 22px;
    border-radius: 999px; border: 2px solid rgba(255, 255, 255, .3);
    color: #fff; font-weight: 700; font-size: .9rem; text-decoration: none;
}
body.theme-smart.page-contact .sm-cu-links a:hover { border-color: #9ac43a; background: rgba(154, 196, 58, .14); }

/* ── الشريط الفاتح: الرسالة المكتوبة ── */
body.theme-smart.page-contact .sm-cu-write { background: #f4f9ee; padding: 56px 0 64px; }
body.theme-smart.page-contact .sm-cu-whead { max-width: 68ch; margin: 0 0 26px; }
body.theme-smart.page-contact .sm-cu-whead h2 {
    font-size: 1.9rem; line-height: 1.25; font-weight: 800; color: #003452; margin: 0 0 10px;
}
body.theme-smart.page-contact .sm-cu-whead p { color: #4d6273; font-size: .98rem; line-height: 1.7; margin: 0; }

body.theme-smart.page-contact .sm-cu-card {
    background: #fff; border: 1px solid #e3ebe0; border-radius: 20px;
    padding: 32px; box-shadow: 0 14px 34px rgba(13, 34, 51, .08);
}

/* الفورم شبكة عمودين: الاسم/اللقب صف، البريد/الهاتف صف،
   والاستفسار وزر الإرسال بعرض الشبكة. الصفوف جايّة من
   institute/contact/form زي ما هي — التقسيم كله بالـCSS. */
body.theme-smart.page-contact .sm-cu-card .inst-cform {
    display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px;
}
body.theme-smart.page-contact .sm-cu-card .inst-cform-row { margin: 0; min-width: 0; }
body.theme-smart.page-contact .sm-cu-card #message_contact { grid-column: 1 / -1; }
/* الخانة دي فاضية لحد ما contact.js يحط فيها رسالة — من غير الإخفاء
   بتاخد فجوة الشبكة فوق الفورم بدون سبب. */
body.theme-smart.page-contact .sm-cu-card #message_contact:empty { display: none; }
/* صف الاستفسار هو اللي بعد صف (كود الدولة + الهاتف) — من غير :has */
body.theme-smart.page-contact .sm-cu-card .inst-cform-row--split + .inst-cform-row { grid-column: 1 / -1; }
body.theme-smart.page-contact .sm-cu-card .inst-cform-actions { grid-column: 1 / -1; text-align: start; }

body.theme-smart.page-contact .sm-cu-card .form-control {
    height: auto !important; border: 2px solid #dbe7cd !important; background: #fbfdfa;
    color: #0d2233; padding: 13px 18px; font-size: .95rem; line-height: 1.5;
}
body.theme-smart.page-contact .sm-cu-card textarea.form-control { min-height: 150px; resize: vertical; }
/* الرمادي الافتراضي للـplaceholder بيقع تحت 4.5:1 على الخلفية الفاتحة */
body.theme-smart.page-contact .sm-cu-card .form-control::placeholder { color: #5a6e7d; opacity: 1; }
body.theme-smart.page-contact .sm-cu-card .form-control:focus {
    outline: none; border-color: #9ac43a !important; background: #fff;
    box-shadow: 0 0 0 4px rgba(154, 196, 58, .18);
}

/* الإجراء الرئيسي الوحيد في الصفحة */
body.theme-smart.page-contact .sm-cu-card #submit_contact {
    background: #9ac43a !important; border: 0 !important; color: #0d2233 !important;
    border-radius: 999px !important; padding: 14px 44px !important;
    font-size: 1rem !important; font-weight: 800 !important;
    width: auto !important; height: auto !important; min-width: 200px;
}
body.theme-smart.page-contact .sm-cu-card #submit_contact:hover {
    background: #003452 !important; color: #fff !important;
}

@media (max-width: 991px) {
    body.theme-smart.page-contact .sm-cu-keys { grid-template-columns: 1fr; }
    body.theme-smart.page-contact .sm-cu-key {
        border-inline-start: 0; border-top: 1px solid rgba(154, 196, 58, .3);
    }
    body.theme-smart.page-contact .sm-cu-key:first-child { border-top: 0; }
}

@media (max-width: 767px) {
    body.theme-smart.page-contact .sm-cu-reach { padding: 36px 0 40px; }
    body.theme-smart.page-contact .sm-cu-head { margin-bottom: 28px; }
    body.theme-smart.page-contact .sm-cu-head h2 { font-size: 1.7rem; }
    body.theme-smart.page-contact .sm-cu-key { padding: 22px 20px; }
    body.theme-smart.page-contact .sm-cu-links a { flex: 1 1 100%; justify-content: center; }
    body.theme-smart.page-contact .sm-cu-write { padding: 36px 0 44px; }
    body.theme-smart.page-contact .sm-cu-whead h2 { font-size: 1.5rem; }
    body.theme-smart.page-contact .sm-cu-card { padding: 20px; border-radius: 16px; }
    body.theme-smart.page-contact .sm-cu-card .inst-cform { grid-template-columns: 1fr; gap: 14px; }
    body.theme-smart.page-contact .sm-cu-card #submit_contact { width: 100% !important; min-width: 0; }
}

/* --- contact fix sm-cu-measure --- */
/* ‎.container على الموقع ده عرضه 100% (مش مقاس بوتستراب)، فالحقول كانت
   بتوصل 550px للحقل الواحد على 1440 — أعرض من اللازم لقراءة مريحة.
   الحد الأقصى مربوط بحافة البداية (margin-inline-end:auto) عشان يفضل
   مصفوف مع عنوان البانر فوقه في الاتجاهين. */
body.theme-smart.page-contact .sm-cu-keys,
body.theme-smart.page-contact .sm-cu-links,
body.theme-smart.page-contact .sm-cu-card { max-width: 1200px; margin-inline-end: auto; }

/* خلفية الصفحة بلون الشريط الفاتح: أي فرجة بين آخر الشريط وبداية الفوتر
   كانت بتبان رمادية (‎#e9ebee من الـbody) وتقطع الشريط. */
body.theme-smart.page-contact { background: #f4f9ee; }

/* --- contact fix sm-cu-cc-readable --- */
/* على 390px كان عرض خانة كود الدولة (33% من عمود واحد) بيقص الـplaceholder
   لـ"Country C". بنوسّعها ونقلّل الحشو الأفقي عشان النص يبان كامل. */
@media (max-width: 767px) {
    body.theme-smart.page-contact .sm-cu-card .inst-cform-cc { flex: 0 0 46%; max-width: 46%; }
    body.theme-smart.page-contact .sm-cu-card .form-control { padding-inline: 14px; font-size: .92rem; }
}

/* (2026-09-09) مربّع الرسالة كان بيمتد على عرض الشبكة كله (1134px).
   بنحدّه لعرض قراية معقول ويفضل في نص البطاقة. */
body.theme-smart #comments_contact { max-width: 760px; }

/* ═══ (2026-09-09) سمارت — /downloads: رقاقتين + شبكة بطاقات مدمجة ═══════
   الصفحة القديمة كانت قائمة رأسية بأوصاف وأسهم — نفس إيقاع باقي المعاهد.
   النظام هنا هو نظام سمارت نفسه: رقاقات كبسولية، مجموعات بشريط تنقّل،
   وبطاقات مدمجة بفعل واحد لكل بطاقة. كل الكلاسات جديدة (.sm-dlg-*) فمفيش
   قاعدة قديمة اتلمست. */

body.theme-smart .sm-dlg { background: #f4f8f0; padding: 40px 0 56px; }

/* شريط الرقاقات: كبسولة واحدة جوّاها رقاقتين — بيقرا كمفتاح تبديل بصري
   (لغة "المفاتيح المقسّمة" بتاعة سمارت) من غير أي جافاسكربت؛ دول روابط نطّ. */
body.theme-smart .sm-dlg-chips {
    display: flex; flex-wrap: wrap; gap: 6px;
    width: fit-content; max-width: 100%;
    margin: 0 0 30px; padding: 6px;
    background: #fff; border: 1px solid #dbe7cd; border-radius: 999px;
    box-shadow: 0 8px 22px rgba(13, 34, 51, .06);
}
body.theme-smart .sm-dlg-chip {
    display: inline-flex; align-items: center; gap: 9px;
    padding: 11px 24px; border-radius: 999px;
    font-size: .93rem; font-weight: 700; line-height: 1.2;
    color: #003452; text-decoration: none !important;
    transition: background .18s, color .18s;
}
body.theme-smart .sm-dlg-chip .bi { font-size: 1.06rem; color: #6f9a24; transition: color .18s; }
body.theme-smart .sm-dlg-chip:hover,
body.theme-smart .sm-dlg-chip:focus-visible { background: #003452; color: #fff; }
body.theme-smart .sm-dlg-chip:hover .bi,
body.theme-smart .sm-dlg-chip:focus-visible .bi { color: #9ac43a; }
body.theme-smart .sm-dlg-chip:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }

/* عنوان المجموعة: وسم صغير على حافة البداية — مش شريط بعرض الصفحة.
   العلامة الخضرا بتشتغل مؤشر مكان لما الرقاقة تنطّ للمجموعة (:target). */
body.theme-smart .sm-dlg-group { margin-bottom: 34px; outline: 0; }
body.theme-smart .sm-dlg-group:last-of-type { margin-bottom: 0; }
body.theme-smart .sm-dlg-tag {
    display: flex; align-items: center; gap: 10px;
    margin: 0 0 14px; padding: 0;
    font-size: .82rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
    color: #3d566b;
}
body.theme-smart .sm-dlg-tag::before {
    content: ''; flex: 0 0 auto; width: 10px; height: 10px;
    border-radius: 3px; background: #9ac43a; transition: transform .2s;
}
body.theme-smart .sm-dlg-group:target .sm-dlg-tag { color: #003452; }
body.theme-smart .sm-dlg-group:target .sm-dlg-tag::before { transform: scale(1.5); }
/* العربي مالوش uppercase، فالتباعد الحرفي بيبوّظ اتصال الحروف */
html[lang="ar"] body.theme-smart .sm-dlg-tag { text-transform: none; letter-spacing: 0; font-size: .95rem; }

/* الشبكة: تلات أعمدة، فجوة ضيقة — الكثافة هي المقصودة. */
body.theme-smart .sm-dlg-grid {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px;
}

/*
 * (2026-09-17) المجموعتين في النص: الأربعة في صف واحد، والاتنين تحتهم.
 *
 * المجموعة الأولى بقت أربع بطاقات (العامة/عن بُعد/بالعربية/بالإنجليزية)
 * بعد ما "بالإنجليزية" رجعت لمكانها الصح، فعلى تلات أعمدة كانت بتطلع
 * تلاتة وواحدة يتيمة تحتهم. والتانية بطاقتين.
 *
 * الاتنين بيتوسّطوا بـmargin تلقائي على عرض محسوب من عدد الأعمدة، عشان
 * ما يفضلوش مزنوقين ناحية وسايبين خانة فاضية.
 *
 * وبتتحصر في الشاشات الكبيرة: المحدِّد بالـid أقوى من قاعدة العمودين
 * اللي في media query تحت، فمن غير الحصر ده كان هيفرض أربع أعمدة على
 * الموبايل كمان.
 */
@media (min-width: 992px) {
    body.theme-smart #sm-dlg-files .sm-dlg-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        max-width: 1120px; margin-inline: auto;
    }
    body.theme-smart #sm-dlg-live .sm-dlg-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 560px; margin-inline: auto;
    }
}
body.theme-smart .sm-dlg-card {
    display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
    min-height: 136px; padding: 18px 18px 16px;
    background: #fff; border: 1px solid #dbe7cd; border-radius: 14px;
    transition: border-color .18s, box-shadow .18s;
}
body.theme-smart .sm-dlg-card:hover { border-color: #9ac43a; box-shadow: 0 12px 26px rgba(13, 34, 51, .08); }
body.theme-smart .sm-dlg-t {
    margin: 0; font-size: 1.02rem; font-weight: 800; line-height: 1.35;
    color: #003452; max-width: 22ch;
}

/* الكبسولة: فعل واحد لكل بطاقة، دايماً في الأسفل عشان الصف يفضل مصفوف.
   .inst-dl-btn الأساسي زواياه 4px ومستطيل — بنعيد صبغه بلغة سمارت. */
body.theme-smart .sm-dlg-pill,
body.theme-smart .sm-dlg-card .inst-dl-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    margin-top: auto; padding: 10px 20px;
    font-size: .86rem; font-weight: 700; line-height: 1.2;
    border: 2px solid transparent; border-radius: 999px;
    text-decoration: none !important; cursor: pointer;
    transition: background .18s, color .18s, border-color .18s;
}
/* تحميل: أخضر مصمت + كحلي غامق = تباين 8.6:1 */
body.theme-smart .sm-dlg-card .inst-dl-btn {
    background: #9ac43a; border-color: #9ac43a; color: #0d2233; transform: none;
}
body.theme-smart .sm-dlg-card .inst-dl-btn:hover,
body.theme-smart .sm-dlg-card .inst-dl-btn:focus-visible {
    background: #003452; border-color: #003452; color: #fff; transform: none;
}
/* تصفّح: مفرّغة بحدّ كحلي — الفرق ده هو اللي بيفصل المجموعتين لو الزائر
   نزل تحت وفات شريط الرقاقات */
body.theme-smart .sm-dlg-pill--ghost { background: #fff; border-color: #003452; color: #003452; }
body.theme-smart .sm-dlg-pill--ghost:hover,
body.theme-smart .sm-dlg-pill--ghost:focus-visible { background: #003452; color: #fff; }
body.theme-smart .sm-dlg-pill:focus-visible,
body.theme-smart .sm-dlg-card .inst-dl-btn:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }

@media (max-width: 991px) {
    body.theme-smart .sm-dlg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    body.theme-smart .sm-dlg { padding: 28px 0 40px; }
    /* الرقاقتين بيتقسموا العرض بالتساوي — بيفضلوا مفتاح مقسّم مش كبسولتين تايهين */
    body.theme-smart .sm-dlg-chips { width: 100%; margin-bottom: 24px; flex-wrap: nowrap; }
    body.theme-smart .sm-dlg-chip { flex: 1 1 0; min-width: 0; justify-content: center; padding: 10px 8px; font-size: .84rem; gap: 6px; }
    body.theme-smart .sm-dlg-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    /* عمودين بردو على 390px: العناوين قصيرة والكبسولة بتاخد عرض البطاقة،
       فالكثافة بتتحافظ من غير أي تجاوز أفقي */
    body.theme-smart .sm-dlg-grid { gap: 10px; }
    body.theme-smart .sm-dlg-card { min-height: 118px; padding: 14px 13px; gap: 12px; }
    body.theme-smart .sm-dlg-t { font-size: .93rem; }
    body.theme-smart .sm-dlg-pill,
    body.theme-smart .sm-dlg-card .inst-dl-btn { width: 100%; padding: 9px 10px; font-size: .78rem; }
}

/* --- سمارت /downloads: ضبط الكثافة بعد القياس على 1440 ---------------
   .container على الموقع ده عرضه 100%، فالتلات أعمدة طلعوا ~470px للبطاقة
   والعنوان القصير ساب فراغ نص البطاقة — عكس المقصود (كثافة وسرعة قراية).
   بنحدّ الشبكة بعرض قراية ونثبّتها على حافة البداية زي بقية صفحات سمارت
   (نفس أسلوب .sm-cu-* في صفحة اتصل بنا) عشان تفضل مصفوفة مع عنوان البانر. */
body.theme-smart .sm-dlg-chips,
body.theme-smart .sm-dlg-group { max-width: 1120px; margin-inline-end: auto; }
body.theme-smart .sm-dlg-grid { gap: 12px; }
body.theme-smart .sm-dlg-card { min-height: 112px; padding: 16px 16px 14px; gap: 12px; }

/* ============================================================
   سمارت — /about-smart (إعادة بناء 2026-09-09)
   ------------------------------------------------------------
   الصفحة بقت تلات كتل **مختلفة الشكل** بدل ست لوحات متطابقة:
     .sm-ab-lede  فقرة واحدة كبيرة (أكبر نص في الصفحة)
     .sm-ab-keys  لوحة واحدة مقسومة لأربع خانات صغيرة عالية الكثافة
     .sm-ab-pills صف رقاقات + جملة وصف واحدة
   الفرق بين الكتل في الوزن والكثافة، مش في اللون — عشان محدش يقدر يقول
   "دي نفس الصفحة بلون تاني" لما يحطها جنب معهد تاني.
   الكلاسات جديدة بالكامل (sm-ab-*) وما لمستش أي قاعدة قديمة: قواعد
   .sm-sp-* لسه بتخدم صفحات سمارت التانية (اتصل بنا، الأسئلة، العملاء...).
   ============================================================ */

body.theme-smart .sm-ab { background: #f4f8f0; padding: 44px 0 56px; }

/* .container على المعاهد عرضه 100%، فبنحدّ عرض القراية ونثبّته على حافة
   البداية عشان يفضل مصفوف مع عنوان البانر (نفس أسلوب باقي صفحات سمارت) */
body.theme-smart .sm-ab-wrap { max-width: 1120px; margin-inline-end: auto; }

/* عنوان صغير كعلامة قسم مش كترويسة — الصفحة مكثّفة والعناوين الكبيرة
   كانت بتاخد نص الشاشة من غير معلومة */
body.theme-smart .sm-ab-eyebrow {
    display: flex; align-items: center; gap: 10px;
    margin: 0 0 12px; font-size: .82rem; font-weight: 800;
    letter-spacing: .1em; text-transform: uppercase; color: #003452;
}
body.theme-smart .sm-ab-eyebrow::before {
    content: ''; flex: 0 0 auto; width: 20px; height: 3px;
    border-radius: 2px; background: #9ac43a;
}

/* --- شريط الرقاقات: مفتاح واحد مقسّم بخطوط شعرة (أداة سمارت المميّزة) --- */
body.theme-smart .sm-ab-jump {
    display: inline-flex; padding: 5px; margin-bottom: 30px;
    background: #fff; border: 1px solid #dbe7cd; border-radius: 999px;
    box-shadow: 0 10px 26px rgba(13, 34, 51, .07); max-width: 100%;
}
body.theme-smart .sm-ab-jump-key {
    position: relative; padding: 10px 22px; border-radius: 999px;
    font-size: .92rem; font-weight: 700; line-height: 1.25; color: #003452;
    text-decoration: none !important; text-align: center;
    transition: background .18s, color .18s;
}
/* الخط الشعرة بين المفاتيح — هو اللي بيخلّيه "مفتاح مقسّم" مش تلات كبسولات */
body.theme-smart .sm-ab-jump-key + .sm-ab-jump-key::before {
    content: ''; position: absolute; inset-inline-start: 0; top: 22%; bottom: 22%;
    width: 1px; background: #e3ecd8;
}
/* _brand.css بيفرض لون الموقع الأخضر على أي a:hover بـ!important،
   فلازم نغلبه هنا عشان النص يفضل مقروء على الخلفية الكحلي */
body.theme-smart .sm-ab-jump-key:hover { background: #003452; color: #fff !important; }
body.theme-smart .sm-ab-jump-key:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }

/* --- 1) الفقرة: أكبر نص في الصفحة، بعرض قراية محدود --- */
body.theme-smart .sm-ab-lede { margin-bottom: 34px; }
body.theme-smart .sm-ab-lede p {
    margin: 0; max-width: 62ch;
    padding-inline-start: 18px; border-inline-start: 4px solid #9ac43a;
    font-size: 1.24rem; line-height: 1.75; font-weight: 500; color: #0d2233;
}

/* --- 2) أربع نقاط: لوحة واحدة مقسومة، خط أصغر وكثافة أعلى من الفقرة --- */
body.theme-smart .sm-ab-how { margin-bottom: 34px; }
body.theme-smart .sm-ab-keys {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px;
    background: #e6efdb; border: 1px solid #dbe7cd; border-radius: 14px;
    overflow: hidden; box-shadow: 0 16px 36px rgba(13, 34, 51, .07);
}
body.theme-smart .sm-ab-key {
    background: #fff; padding: 18px 18px 20px;
    display: flex; flex-direction: column; gap: 7px;
}
body.theme-smart .sm-ab-key strong {
    font-size: .95rem; font-weight: 800; color: #003452; line-height: 1.35;
}
body.theme-smart .sm-ab-key span { font-size: .88rem; line-height: 1.65; color: #54687a; }

/* --- 3) رقاقات أنواع الدورات + جملة وصف واحدة --- */
body.theme-smart .sm-ab-pills { display: flex; flex-wrap: wrap; gap: 10px; }
body.theme-smart .sm-ab-pill {
    display: inline-flex; align-items: center; gap: 9px;
    padding: 11px 20px; background: #fff;
    border: 1px solid #dbe7cd; border-radius: 999px;
    font-size: .95rem; font-weight: 700; color: #003452;
    text-decoration: none !important;
    box-shadow: 0 6px 16px rgba(13, 34, 51, .05);
    transition: background .18s, border-color .18s, color .18s;
}
body.theme-smart .sm-ab-pill .bi { font-size: 1.05rem; color: #7ea82c; transition: color .18s; }
body.theme-smart .sm-ab-pill:hover { background: #003452; border-color: #003452; color: #fff !important; }
body.theme-smart .sm-ab-pill:hover .bi { color: #9ac43a; }
body.theme-smart .sm-ab-pill:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }
/* الجملة دي هي كل وصف الأنواع الثلاثة (مفيش كارت بيشرحهم)، فمحتاجة تباين
   أعلى من نص ثانوي عادي: #47596a على #f4f8f0 = 6.3:1 */
body.theme-smart .sm-ab-note {
    margin: 16px 0 0; max-width: 72ch;
    font-size: .95rem; line-height: 1.8; color: #47596a;
}

/* --- الخاتمة: سطر تواصل بأرقام حقيقية، مش زرار وحيد --- */
body.theme-smart .sm-ab-reach {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px;
    margin: 34px 0 0; padding-top: 18px; border-top: 2px solid #dbe7cd;
    font-size: .95rem; color: #0d2233;
}
body.theme-smart .sm-ab-reach a {
    font-weight: 700; color: #003452;
    text-decoration: underline; text-underline-offset: 3px;
}
body.theme-smart .sm-ab-reach a:hover { color: #0d2233 !important; }

/* روابط القفز بتودّي التركيز للقسم — نشيل الإطار الافتراضي ونسيب
   إطار الكيبورد بس */
body.theme-smart .sm-ab section:focus { outline: none; }
body.theme-smart .sm-ab section:focus-visible { outline: 3px solid #9ac43a; outline-offset: 6px; }
body.theme-smart .sm-ab section[id] { scroll-margin-block-start: 90px; }

@media (max-width: 991px) {
    body.theme-smart .sm-ab-keys { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.theme-smart .sm-ab-lede p { font-size: 1.12rem; }
}
@media (max-width: 575px) {
    body.theme-smart .sm-ab { padding: 30px 0 40px; }
    /* المفتاح بياخد عرض الشاشة والتلات أقسام بيتقسموه بالتساوي — يفضل
       "مفتاح مقسّم" ومايعملش تجاوز أفقي مهما طال النص الإنجليزي */
    body.theme-smart .sm-ab-jump { display: flex; width: 100%; margin-bottom: 24px; }
    body.theme-smart .sm-ab-jump-key { flex: 1 1 0; min-width: 0; padding: 9px 6px; font-size: .8rem; }
    body.theme-smart .sm-ab-keys { grid-template-columns: minmax(0, 1fr); }
    body.theme-smart .sm-ab-key { padding: 15px 16px 16px; }
    body.theme-smart .sm-ab-lede p { font-size: 1.06rem; padding-inline-start: 14px; }
    body.theme-smart .sm-ab-pill { padding: 10px 16px; font-size: .9rem; }
}

/* ===== سمارت — الأسئلة الشائعة: لوحة رقاقات + شبكة خلايا مكشوفة (2026-09-09) =====
   إضافة في آخر الملف فقط. مفيش أي قاعدة قديمة اتعدّلت.
   قواعد ‎.sm-sp-list / .sm-sp-q / .sm-sp-panels‎ اللي فوق كانت لأكورديون الأسئلة
   القديم وبقت غير مستعملة بعد إعادة المعمار — سيبتها زي ما هي عشان مااكسرش أي
   صفحة تانية ممكن تكون بتستعملها مستقبلًا، والصفحة الجديدة بكلاسات ‎.sm-fq-*‎ خاصة بيها.

   ليه الشكل ده؟ أداة سمارت في DESIGN-SYSTEMS: رقاقات وكبسولات وكثافة بدون زخرفة.
   فالإجابات كلها ظاهرة، والخلايا ملتصقة بفواصل شعرة 1px في لوح واحد بدل كروت طايرة. */

/* شريط الرقاقات: مراحل رحلة المتدرّب. روابط تنقّل، مش أزرار — عشان تشتغل بدون JS */
body.theme-smart .sm-fq-rail{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}
body.theme-smart .sm-fq-chip{display:inline-flex;align-items:center;gap:10px;padding:11px 10px 11px 20px;background:#fff;border:1px solid #dbe7cd;border-radius:999px;color:#003452;font-weight:700;font-size:.98rem;line-height:1.2;text-decoration:none;box-shadow:0 6px 16px rgba(13,34,51,.05);transition:background .2s,border-color .2s,box-shadow .2s}
body.theme-smart .sm-fq-chip:hover,body.theme-smart .sm-fq-chip:focus-visible{background:#9ac43a;border-color:#9ac43a;color:#0d2233;box-shadow:0 8px 20px rgba(154,196,58,.42)}
body.theme-smart .sm-fq-chip:focus-visible{outline:3px solid #003452;outline-offset:2px}
/* الرقم داخل كبسولة تانية جوّه الرقاقة — كبسولة جوّه كبسولة هي توقيع سمارت */
body.theme-smart .sm-fq-chip-n{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding-inline:8px;border-radius:999px;background:#003452;color:#fff;font-size:.8rem;font-weight:800;line-height:1}
body.theme-smart .sm-fq-chip:hover .sm-fq-chip-n,body.theme-smart .sm-fq-chip:focus-visible .sm-fq-chip-n{background:#0d2233}
/* الحشو غير المتماثل فوق لازم ينقلب في العربي — خصائص منطقية بدل left/right */
body.theme-smart .sm-fq-chip{padding-inline:20px 10px}

/* اللوح: الفواصل الشعرة هي لون الخلفية بين الخلايا (gap:1px)، فمفيش حدود مكرّرة */
body.theme-smart .sm-fq-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#e2ecd5;border:1px solid #dbe7cd;border-radius:14px;overflow:hidden;box-shadow:0 16px 36px rgba(13,34,51,.08)}
body.theme-smart .sm-fq-cell{background:#fff;padding:20px 22px 22px;min-width:0;scroll-margin-top:24px}
/* أول خلية في كل مرحلة: خلفية أفتح + وسم، فالخلايا مش كلها بنفس الوزن */
body.theme-smart .sm-fq-cell--head{background:#f8fbf4}
body.theme-smart .sm-fq-tag{display:inline-block;margin:0 0 10px;padding:5px 14px;border-radius:999px;background:#9ac43a;color:#0d2233;font-size:.76rem;font-weight:800;line-height:1.3;letter-spacing:.02em}
body.theme-smart .sm-fq-q{margin:0 0 8px;font-size:1rem;font-weight:800;line-height:1.45;color:#003452;overflow-wrap:anywhere}
body.theme-smart .sm-fq-a{margin:0;font-size:.92rem;line-height:1.72;color:#4f6274;max-width:46ch;overflow-wrap:anywhere}
/* لما ترقاقة تنطّ لخلية، تتعلّم بإطار داخلي — من غير ما يزيح التخطيط */
body.theme-smart .sm-fq-cell:target{background:#eef5e2;box-shadow:inset 0 0 0 3px #9ac43a}

/* خلية التواصل: مقلوبة كحلي عشان تقفل الشبكة بدل شريط خاتمة تحتها */
body.theme-smart .sm-fq-cell--ask{background:#003452}
body.theme-smart .sm-fq-cell--ask .sm-fq-q{color:#fff}
body.theme-smart .sm-fq-cell--ask .sm-fq-a{color:#c6d8e0}
body.theme-smart .sm-fq-ask-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px}
body.theme-smart .sm-fq-ask-links a{color:#9ac43a;font-weight:700;font-size:.92rem;line-height:1.5;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
body.theme-smart .sm-fq-ask-links a:hover{color:#fff}
body.theme-smart .sm-fq-ask-links a:focus-visible{outline:3px solid #9ac43a;outline-offset:2px}

@media (max-width:991.98px){
    body.theme-smart .sm-fq-board{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767.98px){
    /* عمود واحد على الموبايل: اللوح يفضل ملتصق، بس الخلايا بقت فوق بعض */
    body.theme-smart .sm-fq-board{grid-template-columns:minmax(0,1fr)}
    body.theme-smart .sm-fq-cell{padding:18px}
    body.theme-smart .sm-fq-a{max-width:none}
    body.theme-smart .sm-fq-rail{gap:8px}
    body.theme-smart .sm-fq-chip{flex:1 1 auto;justify-content:space-between;font-size:.92rem;padding-inline:16px 8px}
}

/* ===== سمارت — صفحتا الخدمات: الداخلية والعامة (2026-09-09) =====
   إضافة في آخر الملف فقط، وبكلاسات جديدة (.sm-ih-* / .sm-pc-*). ولا قاعدة قديمة
   اتعدّلت: قواعد ‎.sm-sp-*‎ اللي فوق لسه بتخدم صفحات تانية (اتصل بنا / من نحن /
   عملاؤنا / تفاصيل الدورة)، فسيبتها زي ما هي بالحرف.

   ليه معمار جديد أصلًا؟ الصفحتين القديمتين كانتا "٣ خطوات + ٤ نقاط + زرار" و
   "٣ مزايا + ٣ شروط + زرارين" — نفس هيكل باقي المعاهد، فكانوا بيتقروا نفس القراءة
   مهما اتغيّر اللون. الأعداد والتسلسل اتغيّروا هنا، مش الرسم بس.
   توقيع سمارت (رقاقات وكبسولات وكثافة بلا زخرفة) هو اللي ماسك الصفحتين مع باقي الموقع. */

/* ── /services/in-house-courses ────────────────────────────────
   دورين في رقاقتين، وتحتهم لوح واحد: الملخّص جنب النموذج مباشرةً.
   مفيش شريط CTA خاتمة — الفعل نفسه (النموذج) جوّه اللوح. */
body.theme-smart .sm-ih{background:#f4f8f0;padding:46px 0 58px}

/* الرقاقتان: عرضهما مختلف عمداً (7/5) عشان مايبقوش صفّ متساوي */
body.theme-smart .sm-ih-roles{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;margin-bottom:18px}
body.theme-smart .sm-ih-role{grid-column:span 7;display:flex;flex-wrap:wrap;align-items:baseline;gap:14px 18px;background:#fff;border:1px solid #dbe7cd;border-radius:26px;padding:20px 26px;box-shadow:0 10px 26px rgba(13,34,51,.06);min-width:0}
body.theme-smart .sm-ih-role--2{grid-column:span 5}
/* العنوان كبسولة جوّه رقاقة — كبسولة جوّه كبسولة هي توقيع سمارت */
body.theme-smart .sm-ih-role-t{flex:0 0 auto;margin:0;padding:7px 20px;border-radius:999px;background:#003452;color:#fff;font-size:.95rem;font-weight:800;line-height:1.3}
/* الدور التاني بلون تاني: اللي بيميّز الرقاقتين هو الدور نفسه مش رقم خطوة */
body.theme-smart .sm-ih-role--2 .sm-ih-role-t{background:#9ac43a;color:#0d2233}
body.theme-smart .sm-ih-role-d{flex:1 1 260px;margin:0;min-width:0;max-width:70ch;color:#4f6274;font-size:1rem;line-height:1.75}

/* اللوح: عمودان ملتصقان بفاصل شعرة 1px (لون الخلفية بين الخانتين) */
body.theme-smart .sm-ih-panel{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr);gap:1px;background:#e2ecd5;border:1px solid #dbe7cd;border-radius:18px;overflow:hidden;box-shadow:0 16px 36px rgba(13,34,51,.08)}
body.theme-smart .sm-ih-sum{background:#fff;display:flex;flex-direction:column;min-width:0}
body.theme-smart .sm-ih-sum-cell{flex:1 1 auto;padding:16px 22px;border-block-end:1px solid #eef3e7}
body.theme-smart .sm-ih-sum-cell:last-child{border-block-end:0}
body.theme-smart .sm-ih-sum-t{display:block;margin-bottom:5px;color:#003452;font-size:.95rem;font-weight:800;line-height:1.4}
body.theme-smart .sm-ih-sum-d{display:block;color:#54687a;font-size:.89rem;line-height:1.68;max-width:48ch}

/* النموذج: مقلوب كحلي عشان يبان إنه الفعل، من غير ما يبقى شريط تحت الصفحة */
body.theme-smart .sm-ih-form{background:#003452;padding:26px 28px;display:flex;flex-direction:column;justify-content:center;gap:12px;min-width:0}
body.theme-smart .sm-ih-form-t{margin:0;color:#fff;font-size:1.15rem;font-weight:800;line-height:1.35}
body.theme-smart .sm-ih-input{width:100%;padding:13px 18px;border-radius:999px;border:1px solid #cfe0ec;background:#fff;color:#0d2233;font-size:.98rem;line-height:1.4}
body.theme-smart .sm-ih-input::placeholder{color:#5b6b78;opacity:1}
body.theme-smart .sm-ih-input:focus{outline:3px solid #9ac43a;outline-offset:2px;border-color:#9ac43a}
body.theme-smart .sm-ih-go{align-self:flex-start;border:0;border-radius:999px;background:#9ac43a;color:#0d2233;font-size:.98rem;font-weight:800;line-height:1.3;padding:13px 30px;cursor:pointer;transition:background .2s,color .2s}
body.theme-smart .sm-ih-go:hover{background:#fff;color:#003452}
body.theme-smart .sm-ih-go:focus-visible{outline:3px solid #fff;outline-offset:2px}
body.theme-smart .sm-ih-form-n{margin:0;color:#c6d8e0;font-size:.86rem;line-height:1.65;max-width:52ch}
/* لابل مخفي بصريًا بس موجود للقارئ الشاشي — الـplaceholder لوحده مش لابل */
body.theme-smart .sm-ih-vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media (max-width:991.98px){
    body.theme-smart .sm-ih{padding:32px 0 40px}
    body.theme-smart .sm-ih-role,body.theme-smart .sm-ih-role--2{grid-column:span 12}
    body.theme-smart .sm-ih-panel{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:575.98px){
    body.theme-smart .sm-ih-role{padding:18px 20px;border-radius:22px}
    body.theme-smart .sm-ih-sum-d{max-width:none}
    body.theme-smart .sm-ih-form{padding:22px 20px}
    body.theme-smart .sm-ih-go{align-self:stretch;text-align:center}
}

/* ── /services/public-courses ─────────────────────────────────
   فسيفساء واحدة: الميزة والشرط والفعل كلهم رقاقات في نفس الشبكة، وكل صفّ بنمط
   عرض مختلف (4+8 · 3+5+4 · 6+3+3) عشان مايتقروش كصفوف تلاتات متساوية،
   ومن غير أي ترويسة قسم بينهم. */
body.theme-smart .sm-pc{background:#f4f8f0;padding:46px 0 58px}
body.theme-smart .sm-pc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
body.theme-smart .sm-pc-chip{grid-column:span 12;min-width:0;background:#fff;border:1px solid #dbe7cd;border-radius:18px;padding:18px 22px;box-shadow:0 8px 20px rgba(13,34,51,.05)}
body.theme-smart .sm-pc-c3{grid-column:span 3}
body.theme-smart .sm-pc-c4{grid-column:span 4}
body.theme-smart .sm-pc-c5{grid-column:span 5}
body.theme-smart .sm-pc-c6{grid-column:span 6}
body.theme-smart .sm-pc-c8{grid-column:span 8}
body.theme-smart .sm-pc-t{margin:0 0 6px;color:#003452;font-size:1rem;font-weight:800;line-height:1.42;overflow-wrap:anywhere}
body.theme-smart .sm-pc-d{margin:0;color:#4f6274;font-size:.92rem;line-height:1.72;max-width:62ch;overflow-wrap:anywhere}
/* رقاقتان من الستة نص جارٍ: العنوان جوّه الجملة بفاصل شرطة، مش سطر فوقها — عشان
   مايبقاش كل بند في الشبكة "عنوان + سطر وصف" بنفس النمط. الفاصل من CSS عشان النص
   في الـHTML يفضل عنوان وفقرة مستقلين للقارئ الشاشي. */
body.theme-smart .sm-pc-chip--run .sm-pc-t{display:inline;margin:0}
body.theme-smart .sm-pc-chip--run .sm-pc-t::after{content:' — ';font-weight:400;color:#4f6274}
body.theme-smart .sm-pc-chip--run .sm-pc-d{display:inline}

/* رقاقتا الفعل: مقلوبتان وواقفتان آخر صفّين مختلفين — مش شريط خاتمة تحت الصفحة */
body.theme-smart .sm-pc-chip--go{display:flex;align-items:center;justify-content:center;text-align:center;background:#003452;border-color:#003452;text-decoration:none;transition:background .2s,border-color .2s}
body.theme-smart .sm-pc-chip--go .sm-pc-t{margin:0;color:#fff}
/* _brand.css بيفرض --site-primary على أي رابط عند الوقوف بـ!important،
   فالحبر بيتحدّد بالمتغيّر ده بدل ما القاعدة تتغلب عليه */
body.theme-smart .sm-pc-chip--go:hover,body.theme-smart .sm-pc-chip--go:focus-visible{background:#9ac43a;border-color:#9ac43a;--link-hover-ink:#0d2233}
body.theme-smart .sm-pc-chip--go:hover .sm-pc-t,body.theme-smart .sm-pc-chip--go:focus-visible .sm-pc-t{color:#0d2233}
body.theme-smart .sm-pc-chip--go:focus-visible{outline:3px solid #003452;outline-offset:2px}

@media (max-width:991.98px){
    body.theme-smart .sm-pc{padding:32px 0 40px}
    body.theme-smart .sm-pc-c3,body.theme-smart .sm-pc-c4,body.theme-smart .sm-pc-c5,body.theme-smart .sm-pc-c6{grid-column:span 6}
    body.theme-smart .sm-pc-c8{grid-column:span 12}
}
@media (max-width:575.98px){
    body.theme-smart .sm-pc-c3,body.theme-smart .sm-pc-c4,body.theme-smart .sm-pc-c5,body.theme-smart .sm-pc-c6,body.theme-smart .sm-pc-c8{grid-column:span 12}
    body.theme-smart .sm-pc-chip{padding:16px 18px}
    body.theme-smart .sm-pc-d{max-width:none}
}

/* ============================================================
   العملاء — سيل رقاقات القطاعات (2026-09-09)
   بديل .sm-sp-cells (شبكة الخمس أعمدة) في صفحة /clients: العشر خانات المتساوية
   اتحوّلت لسيل واحد يلتفّ، عرض كل رقاقة من طول اسمها، ومقسوم من جوّه برقاقتَي
   عائلة كحليتين. السبب: الشبكة المتساوية كانت واحدة عند الـ11 معهد فالصفحات
   كانت بتبان من إيد واحدة. قواعد .sm-sp-* القديمة متغيّرتش — لسه بتستعملها صفحات
   سمارت التانية (about / faq / public-courses).
   ============================================================ */
body.theme-smart .sm-secflow{background:#f4f8f0;padding:44px 0 56px}

/* العنوان الدلالي للقارئ الشاشي بس: وجوده كشريط فوق قائمة هو نفسه العلامة
   المشتركة اللي بنهرب منها، وشيله من الـDOM بيضيّع بنية الصفحة */
body.theme-smart .sm-secflow-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* الجملة الجارية بتنوب عن العنوان: نقطتان في آخرها بتربطها بالسيل تحتها */
body.theme-smart .sm-secflow-lead{margin:0 0 18px;max-width:60ch;color:#003452;font-size:1.06rem;font-weight:700;line-height:1.7}

/* سيل واحد: flex-wrap مع flex:0 0 auto — يعني مفيش أعمدة ومفيش عرض موحّد */
body.theme-smart .sm-secflow-row{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:10px 8px}

/* رقاقة العائلة: كحلي مصمت وسط الرقاقات البيضا — هي الفاصل، مش عنوان فوق كتلة */
body.theme-smart .sm-secflow-fam{flex:0 0 auto;max-width:100%;background:#003452;color:#fff;border-radius:999px;padding:11px 22px;font-size:.9rem;font-weight:800;line-height:1.45;letter-spacing:.01em}
body.theme-smart .sm-secflow-fam::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:#9ac43a;margin-inline-end:10px;vertical-align:middle}

/* رقاقة القطاع: الاسم لوحده — بدون أيقونة وبدون سطر وصف تحته */
body.theme-smart .sm-secflow-item{flex:0 0 auto;max-width:100%;background:#fff;border:1px solid #dbe7cd;border-radius:999px;padding:10px 18px;color:#0d2233;font-size:.95rem;font-weight:600;line-height:1.45}

/* السؤال والزر على سطر واحد في نهاية السيل: لو الزر نزل لوحده تحت بيبقى شريط خاتمة زي باقي
   المواقع، والمطلوب إنه يفضل جزء من الجملة */
body.theme-smart .sm-secflow-ask{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:24px 0 0;color:#3f5566;font-size:1rem;font-weight:600;line-height:1.7}
body.theme-smart .sm-secflow-go{display:inline-flex;align-items:center;background:#9ac43a;color:#0d2233;border-radius:999px;padding:9px 22px;font-size:.93rem;font-weight:800;text-decoration:none;transition:background .2s,color .2s}
/* _brand.css بيفرض لون الرابط عند الوقوف بـ!important عن طريق المتغيّر ده */
body.theme-smart .sm-secflow-go:hover,body.theme-smart .sm-secflow-go:focus-visible{background:#003452;color:#fff;--link-hover-ink:#fff}
body.theme-smart .sm-secflow-go:focus-visible{outline:3px solid #003452;outline-offset:2px}

@media (max-width:575.98px){
    body.theme-smart .sm-secflow{padding:32px 0 40px}
    body.theme-smart .sm-secflow-lead{font-size:1rem;max-width:none}
    body.theme-smart .sm-secflow-row{gap:8px 6px}
    body.theme-smart .sm-secflow-fam,body.theme-smart .sm-secflow-item{font-size:.9rem;padding:9px 16px}
    body.theme-smart .sm-secflow-ask{gap:10px 12px}
}

/* ============================================================
   سمارت — نماذج التسجيل والدورة الداخلية والباحث (2026-09-09)
   ------------------------------------------------------------
   المشكلة اللي بتتعالج هنا: التلات صفحات (/register و
   /in-house-training-proposal و/course-finder) كانت بتتقري نفس
   الصفحة عند الأحد عشر معهدًا — شريطان ملوّنان "Step 1 / Step 2"
   فوق كل قسم، وعمود جانبي فيه بيانات المعهد و"ماذا يحدث بعد
   الإرسال؟" بثلاثة بنود، وسطر قوائم منسدلة وحيد في الباحث.

   الحل هنا معماري مش لوني — كل صفحة من التلاتة بقت تخطيطًا مختلفًا
   عن التانيتين وعن باقي المعاهد:
     /register  → عمود واحد بعرض الصفحة، شريط رقاقات مرقّم فوق،
                  عناوين أقسام سطور رفيعة، شبكة حقول تلات أعمدة.
     /inhouse   → لوحة واحدة: عمود عناوين ضيّق على جهة البداية،
                  حقول عمودين، وشريط أرقام حقيقية على جهة النهاية.
     /finder    → لوحة واحدة: رأس كحلي، شريط أدوات، ورقاقات
                  تخصصات مضغوطة — كلها في نفس الشبكة.

   الشكل نفسه بيفضل شكل سمارت: كبسولات، زوايا 14px، أخضر #9ac43a
   وكحلي #003452، وخط كحلي رفيع على جهة بداية الحقل.
   ============================================================ */

/* ---------- /register ---------- */

body.theme-smart #register-section.sm-reg { background: #f7faf4; padding-block: 26px 48px; }

/* الرأس: العنوان ثم شريط الرقاقات. الترقيم اتنقل من أشرطة "الخطوة N"
   الملوّنة لهنا — رقاقة واحدة لكل محطة، وهي أداة سمارت الأساسية. */
body.theme-smart .sm-reg-head { margin: 0 0 18px; }
body.theme-smart .sm-reg-head h1 { font-size: 1.9rem; font-weight: 800; color: #0d2233; margin: 0 0 14px; padding: 0; }
body.theme-smart .sm-reg-rail { display: flex; flex-wrap: wrap; gap: 8px; }
body.theme-smart .sm-reg-chip {
    display: inline-flex; align-items: center; gap: 9px;
    background: #fff; border: 1px solid #dbe7cd; border-radius: 999px;
    padding-block: 6px; padding-inline: 6px 18px;
    font-size: .88rem; font-weight: 700; color: #0d2233; text-decoration: none;
    transition: background .18s, color .18s, border-color .18s;
}
body.theme-smart .sm-reg-chip b {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; border-radius: 50%;
    background: #9ac43a; color: #0d2233; font-size: .8rem; font-weight: 800;
}
/* _brand.css بيفرض لون الرابط عند الوقوف بـ!important عن طريق المتغيّر ده */
body.theme-smart .sm-reg-chip:hover, body.theme-smart .sm-reg-chip:focus-visible {
    background: #003452; border-color: #003452; color: #fff; --link-hover-ink: #fff;
}
body.theme-smart .sm-reg-chip:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }

/* ورقة واحدة للنموذج كله بدل كارت لكل قسم */
body.theme-smart .sm-reg-sheet {
    background: #fff; border: 1px solid #e3ebe0; border-radius: 14px;
    box-shadow: none !important; padding: 22px 24px;
}
body.theme-smart .sm-reg .tabContent .box4 { padding: 0; background: transparent; box-shadow: none; }

/* عنوان القسم: سطر رفيع بخط أخضر تحته بدل شريط ملوّن.
   الـspan جوّه نص الترجمة هو "الخطوة N" — اتشال لأن الترقيم بقى في الرقاقات. */
body.theme-smart #register-section.sm-reg .tabHead {
    background: transparent !important; color: #003452 !important;
    border: 0 !important; border-block-end: 2px solid #9ac43a !important;
    border-radius: 0 !important; padding: 0 0 6px !important; margin: 0 0 16px;
    font-size: .72rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
}
body.theme-smart #register-section.sm-reg .tabHead span { display: none; }
body.theme-smart #register-section.sm-reg .tabContent {
    border: 0 !important; border-radius: 0 !important; padding: 0 !important;
    background: transparent !important; margin: 0 0 26px;
}

/* كثافة: فواصل المسافات الجاهزة (.spaceN بعرض 100% وبتكسر السطر) بتتشال
   جوّه النموذج — هي اللي كانت بتخلي كل حقلين في سطر لوحدهم. */
body.theme-smart .sm-reg .tabContent .space5,
body.theme-smart .sm-reg .tabContent .space10,
body.theme-smart .sm-reg .tabContent .space15,
body.theme-smart .sm-reg .tabContent .space20,
body.theme-smart .sm-reg .tabContent .space30 { display: none; }

/* شبكة تلات أعمدة: بعد ما الفواصل اتشالت، النوع والتخصص واسم الدورة
   بيقعوا في سطر واحد. الجدول (col-md-12 من غير form-group) بيفضل بعرض كامل. */
@media (min-width: 768px) {
    body.theme-smart .sm-reg .tabContent .box4 > .row > .col-md-6,
    body.theme-smart .sm-reg .tabContent .box4 > .row > .col-md-12.form-group { flex: 0 0 33.3333%; max-width: 33.3333%; }
}

body.theme-smart #register-section.sm-reg .form-control { height: 38px; padding-block: 5px; padding-inline: 12px; font-size: .9rem; }
body.theme-smart #register-section.sm-reg textarea.form-control { height: auto; }
body.theme-smart .sm-reg .form-group { margin-bottom: 12px; }
body.theme-smart .sm-reg h6 { font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #5a6e7d; margin: 0 0 5px; }
body.theme-smart .sm-reg h5 { font-size: .95rem; font-weight: 800; color: #003452; margin: 0 0 12px; }

/* التبويبان (شركة/شخصي): مفتاح مقسّم — كبسولة واحدة جوّاها نصّان،
   وهو شكل سمارت المعروف، مش شريط تبويبات بحدود. */
body.theme-smart .sm-reg .nav-tabs {
    border: 0 !important; display: inline-flex !important; flex-wrap: wrap;
    max-width: 100%; gap: 4px; background: #f1f7ec; border-radius: 999px; padding: 4px; margin: 0 0 18px;
}
body.theme-smart .sm-reg .nav-tabs .nav-link {
    border: 0 !important; border-radius: 999px !important; padding: 8px 18px;
    font-size: .86rem; font-weight: 700; color: #0d2233 !important;
    display: inline-flex; align-items: center; gap: 8px;
}
body.theme-smart .sm-reg .nav-tabs .nav-link.active { background: #003452 !important; color: #fff !important; }

/* كتلة المشاركين: الغلاف الرمادي (#f9f9f9 بستايل سطري) بيبقى أخضر فاتح بزوايا الثيم */
body.theme-smart .sm-reg div:has(> #participants) {
    background: #f7faf4 !important; border: 1px solid #dbe7cd !important;
    border-radius: 14px !important; padding-block: 4px !important;
}
body.theme-smart .sm-reg .addmore-participents,
body.theme-smart .sm-reg .remove-participents {
    background: #fff !important; border: 1px solid #003452 !important; color: #003452 !important;
    border-radius: 999px !important; font-weight: 700; font-size: .85rem; padding: 8px 18px;
}

/* شريط الإرسال: زر واحد مصمت (رئيسي) وزر محدَّد (ثانوي) — مش زرّان متساويان */
body.theme-smart .sm-reg .tabContent-btn {
    border-top: 0 !important; background: #f7faf4; border: 1px solid #dbe7cd;
    border-radius: 14px; padding: 16px !important; margin-top: 6px;
}
body.theme-smart .sm-reg .tabContent-btn .btn-primary {
    background: #9ac43a !important; border-color: #9ac43a !important; color: #0d2233 !important;
    font-weight: 800; border-radius: 999px !important; padding: 9px 26px;
}
body.theme-smart .sm-reg .tabContent-btn .btn-secondary {
    background: #fff !important; border: 2px solid #003452 !important; color: #003452 !important;
    font-weight: 700; border-radius: 999px !important; padding: 8px 24px;
}

@media (max-width: 767.98px) {
    body.theme-smart .sm-reg-head h1 { font-size: 1.45rem; }
    body.theme-smart .sm-reg-chip { font-size: .82rem; padding-inline: 5px 14px; }
    body.theme-smart .sm-reg-sheet { padding: 16px 14px; }
    body.theme-smart .sm-reg .nav-tabs .nav-link { padding: 7px 12px; font-size: .8rem; }
}

/* ---------- /in-house-training-proposal ---------- */

body.theme-smart #register-section.sm-ihp { background: #f7faf4; padding-block: 26px 48px; }

/* لوحة واحدة: الفورم + شريط الأرقام جوّه نفس الحد، مش كارتين منفصلين */
body.theme-smart .sm-ihp-panel {
    background: #fff; border: 1px solid #e3ebe0; border-radius: 14px;
    display: grid; grid-template-columns: minmax(0, 1fr) 258px; align-items: stretch;
}
body.theme-smart .sm-ihp-main { flex: none; max-width: none; width: auto; padding: 24px 26px; }
body.theme-smart .sm-ihp-sheet { background: transparent; box-shadow: none !important; padding: 0; border-radius: 0; }
body.theme-smart .sm-ihp-title h1 { font-size: 1.7rem; font-weight: 800; color: #0d2233; margin: 0 0 6px; padding: 0; }
body.theme-smart .sm-ihp-title .space20 { display: none; }

/* عمود العناوين: اسم القسم في عمود ضيّق على جهة البداية والحقول جنبه.
   ده الفرق المعماري عن /register (رقاقات فوق + شبكة تلات أعمدة). */
body.theme-smart .sm-ihp-sec { border-block-start: 1px solid #e3ebe0; padding-block-start: 18px; margin-block-start: 18px; }
@media (min-width: 992px) {
    body.theme-smart .sm-ihp-sec { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 0 22px; align-items: start; }
}
body.theme-smart #register-section.sm-ihp .tabHead {
    background: transparent !important; color: #003452 !important;
    border: 0 !important; border-radius: 0 !important; padding: 2px 0 10px !important;
    font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; line-height: 1.55;
}
body.theme-smart #register-section.sm-ihp .tabHead span { display: none; }
body.theme-smart #register-section.sm-ihp .tabContent {
    border: 0 !important; border-radius: 0 !important; padding: 0 !important; background: transparent !important;
}
body.theme-smart .sm-ihp .tabContent .box4 { padding: 0; background: transparent; box-shadow: none; }
body.theme-smart .sm-ihp .tabContent .space5,
body.theme-smart .sm-ihp .tabContent .space10,
body.theme-smart .sm-ihp .tabContent .space20 { display: none; }

/* حقول عمودين (مش تلاتة زي /register) */
@media (min-width: 768px) {
    body.theme-smart .sm-ihp .tabContent .box4 > .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
    body.theme-smart .sm-ihp .tabContent .box4 > .row > [class*="col-md-"] { flex: none; max-width: none; width: auto; padding-inline: 0; }
    body.theme-smart .sm-ihp .tabContent .box4 > .row > .col-md-12 { grid-column: 1 / -1; }
    body.theme-smart .sm-ihp .tabContent .box4 > .row > .col-md-12:empty { display: none; }
}
body.theme-smart #register-section.sm-ihp .form-control { height: 38px; padding-block: 5px; padding-inline: 12px; font-size: .9rem; }
body.theme-smart #register-section.sm-ihp textarea.form-control { height: auto; }
body.theme-smart .sm-ihp .form-group { margin-bottom: 12px; }
body.theme-smart .sm-ihp .tabContent-btn { border-top: 0 !important; padding-top: 8px !important; }
body.theme-smart .sm-ihp .tabContent-btn .btn-secondary {
    background: #9ac43a !important; border-color: #9ac43a !important; color: #0d2233 !important;
    font-weight: 800; border-radius: 999px !important; padding: 10px 30px;
}

/* شريط الأرقام: أرقام حقيقية من site_totals، خانات صغيرة مرصوصة */
body.theme-smart .sm-ihp-rail {
    flex: none; max-width: none; width: auto; padding: 24px 22px;
    background: #f7faf4; border-inline-start: 1px solid #e3ebe0;
    border-start-end-radius: 14px; border-end-end-radius: 14px;
}
body.theme-smart .sm-ihp-rail-lead { font-size: .82rem; font-weight: 600; color: #3f5566; line-height: 1.6; margin: 0 0 12px; }
body.theme-smart .sm-ihp-rail-lead-2 { margin-block-start: 22px; padding-block-start: 18px; border-block-start: 1px solid #e3ebe0; }
body.theme-smart .sm-ihp-stats { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
body.theme-smart .sm-ihp-stats li {
    display: flex; align-items: baseline; gap: 9px;
    background: #fff; border: 1px solid #dbe7cd; border-radius: 12px; padding: 9px 12px;
}
body.theme-smart .sm-ihp-stats b { font-size: 1.25rem; font-weight: 800; color: #003452; line-height: 1.1; }
body.theme-smart .sm-ihp-stats span { font-size: .78rem; font-weight: 600; color: #3f5566; }
body.theme-smart .sm-ihp-rail-link { display: inline-block; margin-block-start: 12px; font-size: .82rem; font-weight: 800; color: #003452; text-decoration: underline; }
body.theme-smart .sm-ihp-reach { display: grid; gap: 5px; margin: 0; font-size: .85rem; }
body.theme-smart .sm-ihp-reach a { color: #0d2233; font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
body.theme-smart .sm-ihp-reach a:hover { text-decoration: underline; }

@media (max-width: 991.98px) {
    body.theme-smart .sm-ihp-panel { grid-template-columns: minmax(0, 1fr); }
    body.theme-smart .sm-ihp-rail {
        border-inline-start: 0; border-block-start: 1px solid #e3ebe0;
        border-start-end-radius: 0; border-end-end-radius: 14px; border-end-start-radius: 14px;
    }
    body.theme-smart .sm-ihp-main { padding: 20px 16px; }
    body.theme-smart .sm-ihp-title h1 { font-size: 1.35rem; }
}

/* ---------- /course-finder ---------- */

/* الباحث والرقاقات في لوحة واحدة، والبانر المصوّر اتشال (شوف primary_banner) */
body.theme-smart .sm-cf { padding-block: 26px 0; }
body.theme-smart .sm-cf-panel { background: #fff; border: 1px solid #e3ebe0; border-radius: 14px; overflow: hidden; }
body.theme-smart .sm-cf-top {
    background: #003452; color: #fff; padding: 15px 22px;
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px;
}
body.theme-smart .sm-cf-h1 { margin: 0; padding: 0; font-size: 1.35rem; font-weight: 800; color: #fff; }
body.theme-smart .sm-cf-sub { margin: 0; font-size: .85rem; color: #d8e6dd; }

body.theme-smart .sm-cf-bar {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .85fr) minmax(0, 1.7fr) auto;
    gap: 10px; align-items: center; padding: 16px 22px;
    background: #f7faf4; border-block-end: 1px solid #e3ebe0;
}
body.theme-smart .sm-cf-field { min-width: 0; }
body.theme-smart .sm-cf-bar select {
    width: 100%; height: 40px; padding-block: 5px; padding-inline: 12px; font-size: .9rem;
    background: #fff; color: #0d2233; border: 1px solid #dbe7cd;
    border-inline-start: 4px solid #003452; border-radius: 12px;
}
/* chosen بيبني حاوية بديلة مكان الـselect المتعدّد */
body.theme-smart .sm-cf-field .chosen-container { width: 100% !important; }
body.theme-smart .sm-cf-field .chosen-choices {
    background: #fff !important; border: 1px solid #dbe7cd !important;
    border-inline-start: 4px solid #003452 !important; border-radius: 12px !important;
    min-height: 40px; padding-block: 4px;
}
body.theme-smart .sm-cf-go {
    background: #9ac43a !important; border: 0 !important; color: #0d2233 !important;
    font-weight: 800; border-radius: 999px !important; padding: 10px 26px; white-space: nowrap;
}
body.theme-smart .sm-cf-go:hover { background: #003452 !important; color: #fff !important; }

/* رقاقات التخصصات: شبكة صغيرة كثيفة جوّه نفس اللوحة — مش قائمة سطور */
body.theme-smart .sm-cf-chips { padding: 16px 22px 18px; }
body.theme-smart .sm-cf-chips-lead { display: block; font-size: .68rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #5a6e7d; margin: 0 0 10px; }
body.theme-smart .sm-cf-chips-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 6px; }
body.theme-smart .sm-cf-chip {
    display: block; background: #f4f9f0; border: 1px solid #e3ebe0; border-radius: 10px;
    padding: 8px 12px; font-size: .83rem; font-weight: 600; color: #0d2233;
    text-decoration: none; line-height: 1.35; overflow-wrap: anywhere;
    transition: background .18s, color .18s, border-color .18s;
}
body.theme-smart .sm-cf-chip:hover, body.theme-smart .sm-cf-chip:focus-visible {
    background: #003452; border-color: #003452; color: #fff; --link-hover-ink: #fff;
}
body.theme-smart .sm-cf-chip:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }

/* كتلة النتايج: الـmargin السالب كان بيسحبها تحت البانر المتشال */
body.theme-smart #fc-search { margin-top: 0 !important; margin-bottom: 44px !important; }
body.theme-smart #fc-search .search-resultwrap { background: transparent; border: 0; padding-block: 18px 0; }

@media (max-width: 991.98px) {
    body.theme-smart .sm-cf-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    body.theme-smart .sm-cf-field-wide { grid-column: 1 / -1; }
    body.theme-smart .sm-cf-go { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
    body.theme-smart .sm-cf-bar { grid-template-columns: minmax(0, 1fr); padding: 14px; }
    body.theme-smart .sm-cf-top { padding: 14px; }
    body.theme-smart .sm-cf-h1 { font-size: 1.15rem; }
    body.theme-smart .sm-cf-chips { padding: 14px; }
    body.theme-smart .sm-cf-chips-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

/* --- سمارت: تصحيحات بعد القياس (2026-09-09) --- */

/* _brand.css بيصبغ ‎#register-section .nav-link‎ بالكحلي بـ!important، وبيخلي
   النشط أخضر على كحلي — يعني التبويب غير النشط كان بيطلع نص غامق على كحلي
   (تباين ساقط). لازم selector بنفس قوة الـid عشان يغلبه. */
body.theme-smart #register-section.sm-reg .nav-tabs .nav-link {
    background: transparent !important; color: #0d2233 !important;
    border: 0 !important; border-radius: 999px !important; margin: 0 !important;
    padding: 8px 18px !important;
}
body.theme-smart #register-section.sm-reg .nav-tabs .nav-link.active {
    background: #003452 !important; color: #fff !important;
}
body.theme-smart #register-section.sm-reg .nav-tabs .nav-link svg { color: currentColor; }

/* لوحة التبويب: كانت كارت أبيض بظل جوّه الورقة البيضا — كارت جوّه كارت */
body.theme-smart #register-section.sm-reg #nav-tabContent {
    background: transparent !important; box-shadow: none !important;
    padding: 0 !important; border-radius: 0 !important;
}
body.theme-smart .sm-reg .search-inner-box .padding-2 { padding: 0 !important; }

/* فقرة الخصوصية: سطر بعرض الصفحة كلها صعب القراءة (القاعدة: ≈70 حرف) */
body.theme-smart .sm-reg .tabContent .box4 > .row > .col-md-12 > p { max-width: 74ch; }

/* حقول الباحث: الخط الكحلي على جهة البداية كان بيتقوّس مع الـradius فيطلع
   شكل قوس غريب — الجهة دي بقت مربّعة والجهة التانية مدوّرة. */
body.theme-smart .sm-cf-bar select,
body.theme-smart .sm-cf-field .chosen-choices {
    border-start-start-radius: 0 !important; border-end-start-radius: 0 !important;
}

/* الموافقتان (الشروط + الرسائل التسويقية): كل واحدة سطر لوحدها — بعد ما الورقة
   بقت بعرض الصفحة الاتنين كانوا بيقعوا في سطر واحد فيبقى صعب تفرّق بينهم. */
body.theme-smart .sm-reg .tabContent-btn label.toolstoggle { display: block; margin-bottom: 6px; }

/* ==========================================================================
   سمارت — تفاصيل المقال والمدونة (2026-09-09)

   المعمار الجديد: عمود قراية واحد بلا ريل جانبي في الاتنين، بس بنظامين مختلفين:
     .sm-art  (المقال)  = رقاقة تخصص فوق عنوان كحلي على أبيض + شبكة تلات بطاقات.
     .sm-blg  (المدونة) = شريط كحلي العنوان جوّاه + ذيل كبسولات.
   الكلاسات دي جديدة بالكامل، فقواعد body.pg-post-page في _institute.css
   (اللي كانت بتعمل الكارت + الريل 75/25) ما بتنطبقش عليها أصلًا.
   ========================================================================== */

/* --- المقال --- */
body.theme-smart .sm-art { background: #fff; padding: 26px 0 60px; }
body.theme-smart .sm-art > .container { max-width: 1040px; }

body.theme-smart .sm-art-crumb { font-size: .85rem; margin-bottom: 26px; }

/* عمود القراية: 30em ≈ 68 حرف (مقاس بالفعل بمتوسط عرض الحرف، مش تقدير) — الرأس والنص على نفس العرض عشان يقروا ككتلة واحدة */
/* بالـrem مش الـem: الرأس والنص فونتاتهم مختلفة، والـem كان بيدي الاتنين عرضين
   مختلفين فيطلع الرأس مزحزح عن أول سطر في النص. */
body.theme-smart .sm-art-head,
body.theme-smart .sm-art-text { max-width: 30.6rem; margin-inline: auto; }

/* رقاقة التخصص: كبسولة سمارت — النص كحلي غامق على أخضر فاتح (تباين عالي) */
body.theme-smart a.sm-art-chip {
    display: inline-block; background: #f1f7ec; color: #0d2233;
    border: 1px solid #d8e6cc; border-radius: 999px;
    padding: 6px 18px; font-size: .8rem; font-weight: 600;
    letter-spacing: .02em; text-decoration: none; line-height: 1.4;
}
body.theme-smart a.sm-art-chip:hover,
body.theme-smart a.sm-art-chip:focus-visible {
    background: #003452; border-color: #003452; color: #fff; --link-hover-ink: #fff;
}
body.theme-smart a.sm-art-chip:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }

body.theme-smart h1.sm-art-title {
    font-size: 2rem; line-height: 1.25; font-weight: 800;
    color: #003452; margin: 16px 0 8px; text-align: start;
}
body.theme-smart .sm-art-date { font-size: .85rem; color: #5a6e7d; margin: 0; }

/* الخط الأخضر: فاصل بين الرأس والنص بدل ما نحط الاتنين في كارت (سمارت بلا زخرفة) */
body.theme-smart .sm-art-rule {
    width: 64px; height: 6px; border: 0; border-radius: 999px;
    background: #9ac43a; opacity: 1; margin: 20px 0 26px;
    margin-inline-end: auto; margin-inline-start: 0;
}

body.theme-smart .sm-art-text { font-size: 1.02rem; line-height: 1.85; color: #2b3440; text-align: start; }
body.theme-smart .sm-art-text p { margin: 0 0 1.15em; }
/* عناوين النص الجاي من قاعدة البيانات: المقالات بتستعمل h6 كعنوان فرعي، وده
   بيطلع أصغر من النص نفسه بالافتراضي — فبيتساوى مع h2/h3/h4 في القراية. */
body.theme-smart .sm-art-text h2,
body.theme-smart .sm-art-text h3,
body.theme-smart .sm-art-text h4,
body.theme-smart .sm-art-text h5,
body.theme-smart .sm-art-text h6 { color: #003452; font-weight: 700; margin: 1.6em 0 .5em; }
body.theme-smart .sm-art-text h2 { font-size: 1.25rem; }
body.theme-smart .sm-art-text h3 { font-size: 1.1rem; }
body.theme-smart .sm-art-text h4,
body.theme-smart .sm-art-text h5,
body.theme-smart .sm-art-text h6 { font-size: 1.02rem; }
body.theme-smart .sm-art-text ul,
body.theme-smart .sm-art-text ol { padding-inline-start: 1.3em; margin: 0 0 1.15em; }
body.theme-smart .sm-art-text li { margin-bottom: .45em; }
body.theme-smart .sm-art-text img,
body.theme-smart .sm-blg-text img { max-width: 100%; height: auto; }
body.theme-smart .sm-art-text table,
body.theme-smart .sm-blg-text table { max-width: 100%; }

/* المرتبطة: أعرض من عمود القراية عن قصد — كتلة "بعد ما تخلص"، مش هامش جنبه */
/* أوسع من عمود القراية بس مش بعرض الحاوية: الكتلة لازم تبان إنها "بعد النص"
   من غير ما تسيب العمود المركزي معلّق لوحده وسط بياض. */
body.theme-smart .sm-art-more {
    max-width: 880px; margin: 48px auto 0;
    padding-top: 26px; border-top: 1px solid #e3ebe0;
}
body.theme-smart h2.sm-art-more-head {
    font-size: .95rem; font-weight: 700; color: #003452;
    margin: 0 0 16px; letter-spacing: .02em;
}
body.theme-smart .sm-art-grid {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px;
}
/* بطاقة بعنوان بس: شريط أخضر فوق بدل صورة — الصورة كانت شعار المعهد مكرّر ٤ مرات */
body.theme-smart a.sm-art-card {
    display: block; background: #fff; border: 1px solid #e3ebe0;
    border-top: 5px solid #9ac43a; border-radius: 14px;
    padding: 16px 18px; text-decoration: none;
    transition: background .18s, border-color .18s, box-shadow .18s;
}
body.theme-smart a.sm-art-card:hover,
body.theme-smart a.sm-art-card:focus-visible {
    background: #f7fbf2; border-color: #9ac43a; box-shadow: 0 4px 14px rgba(0,52,82,.07);
}
body.theme-smart a.sm-art-card:focus-visible { outline: 3px solid #003452; outline-offset: 2px; }
body.theme-smart .sm-art-card-title {
    font-size: .95rem; font-weight: 600; line-height: 1.45;
    color: #0d2233; margin: 0; overflow-wrap: anywhere;
}

/* --- المدونة --- */
body.theme-smart .sm-blg { background: #fff; padding: 24px 0 60px; }
body.theme-smart .sm-blg > .container { max-width: 1040px; }

/* الشريط الكحلي: العنوان جوّاه — ده الفرق الأول عن صفحة المقال */
body.theme-smart .sm-blg-band {
    background: #003452; border-radius: 14px;
    border-bottom: 6px solid #9ac43a;
    padding: 30px 34px; margin: 0 0 18px;
}
body.theme-smart .sm-blg-kicker {
    color: #cfe4b6; font-size: .78rem; font-weight: 600;
    letter-spacing: .08em; text-transform: uppercase;
    margin: 0 0 10px; text-align: start;
}
body.theme-smart h1.sm-blg-title {
    color: #fff; font-size: 1.95rem; line-height: 1.3; font-weight: 800;
    margin: 0; max-width: 26ch; text-align: start;
}

body.theme-smart .sm-blg-crumb { font-size: .85rem; margin: 0 0 28px; }

/* 32em ≈ 74 حرف: أوسع من المقال شوية، ومصفوف على بداية السطر مش مضبوط لطرفين */
body.theme-smart .sm-blg-text {
    max-width: 32.6rem; font-size: 1.02rem; line-height: 1.85;
    color: #2b3440; text-align: start;
}
body.theme-smart .sm-blg-text p { margin: 0 0 1.15em; }
body.theme-smart .sm-blg-text h2,
body.theme-smart .sm-blg-text h3,
body.theme-smart .sm-blg-text h4,
body.theme-smart .sm-blg-text h5,
body.theme-smart .sm-blg-text h6 { color: #003452; font-weight: 700; margin: 1.6em 0 .5em; }
body.theme-smart .sm-blg-text h2 { font-size: 1.25rem; }
body.theme-smart .sm-blg-text h3 { font-size: 1.1rem; }
body.theme-smart .sm-blg-text h4,
body.theme-smart .sm-blg-text h5,
body.theme-smart .sm-blg-text h6 { font-size: 1.02rem; }
body.theme-smart .sm-blg-text ul,
body.theme-smart .sm-blg-text ol { padding-inline-start: 1.3em; margin: 0 0 1.15em; }
body.theme-smart .sm-blg-text li { margin-bottom: .45em; }

/* الذيل: شريط كبسولات في سطر واحد يلفّ — مش شبكة بطاقات زي صفحة المقال */
body.theme-smart .sm-blg-tail {
    margin-top: 44px; padding-top: 22px; border-top: 1px solid #e3ebe0;
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
}
body.theme-smart h2.sm-blg-tail-lead {
    font-size: .78rem; font-weight: 700; color: #003452;
    letter-spacing: .08em; text-transform: uppercase;
    margin: 0; margin-inline-end: 6px; flex-basis: 100%;
}
body.theme-smart a.sm-blg-chip {
    display: inline-block; max-width: 100%;
    background: #f1f7ec; border: 1px solid #d8e6cc; border-radius: 999px;
    padding: 9px 18px; font-size: .85rem; line-height: 1.35;
    color: #0d2233; text-decoration: none; overflow-wrap: anywhere;
    transition: background .18s, border-color .18s, color .18s;
}
body.theme-smart a.sm-blg-chip:hover,
body.theme-smart a.sm-blg-chip:focus-visible {
    background: #003452; border-color: #003452; color: #fff; --link-hover-ink: #fff;
}
body.theme-smart a.sm-blg-chip:focus-visible { outline: 3px solid #9ac43a; outline-offset: 2px; }
/* رقاقة التخصص: مفرّغة بحدّ كحلي عشان تتميّز عن رقاقات المدونات */
body.theme-smart a.sm-blg-chip-cat { background: #fff; border-color: #003452; color: #003452; font-weight: 600; }

/* --- الموبايل --- */
@media (max-width: 767.98px) {
    body.theme-smart .sm-art { padding: 18px 0 44px; }
    body.theme-smart h1.sm-art-title { font-size: 1.5rem; }
    body.theme-smart .sm-art-grid { grid-template-columns: minmax(0, 1fr); }
    body.theme-smart .sm-art-more { margin-top: 34px; }

    body.theme-smart .sm-blg { padding: 16px 0 44px; }
    body.theme-smart .sm-blg-band { padding: 20px 20px; border-radius: 14px; }
    body.theme-smart h1.sm-blg-title { font-size: 1.42rem; max-width: none; }
    body.theme-smart .sm-blg-tail { margin-top: 34px; }
}

/* (2026-09-09) tlb: "ifrid al-kalam bi-3ard as-safha inta mukaddisa wa da
   mikhalliha wahda sutur kiteer". al-3amud kan 68ch = 529px gowwa lawh 768px
   fal-nass kan 3amud rafee3 wal-yimeen fadi. al-lawh nafso hu al-hadd. */
body.theme-smart.pg-training-courses #coursedetails-content-section .sm-crs-prose,
body.theme-smart.pg-training-courses .sm-crs-prose { max-width: none; }

/* ─────────────────────────────
   (2026-09-09) نوافذ الاستفسار والاتصال: كانت بنفس الشكل بالحرف
   في كل المواقع (رأس رمادي، حقول صناديق، زرار بعرض النافذة) —
   والفرق لون بس. الاختلاف هنا في المعمار: مكان العنوان، شكل
   الحقل، واستدارة الزرار وعرضه. الـmarkup ومعرّفات الحقول
   (سيلزفورس) ما اتلمستش.
   ملحوظة تانية: العلامة على h2 بلا كلاس (+ .inst-logos-h) بس.
   كانت على كل h2 فنزلت على حاجات مش عناوين أقسام: تسمية حقل
   (PHONE)، سطر مسار (ARCHIVE / DOWNLOADS)، سؤال في الأسئلة
   الشائعة، وعنوان تمهيدي ارتفاعه 17px. العناوين المشتركة للأقسام
   بتتكتب <h2> بلا كلاس، واللي ليه كلاس عنده تنسيقه في ثيمه.
   ───────────────────────────── */

/* نافذة سمارت: رقاقة خضرا قبل العنوان، حقول ممتلئة بزوايا مستديرة،
   وزرار مستدير — نفس نظام الرقائق. */
body.theme-smart .modal-content{border:0;border-radius:14px;overflow:hidden}
body.theme-smart .modal-header{background:#fff;border:0;padding:20px 22px 4px;align-items:center;gap:10px}
body.theme-smart .modal-title{color:#003452;font-weight:700;font-size:1.1rem;display:flex;align-items:center;gap:10px}
body.theme-smart .modal-title::before{content:"";width:26px;height:8px;border-radius:4px;background:#9ac43a;display:inline-block}
body.theme-smart .modal-content > p{padding:6px 22px 0;color:#5a6e7d;font-size:.87rem}
body.theme-smart .modal-body .form-control{
    background:#f2f6f9!important;border:1px solid transparent!important;border-radius:10px!important}
body.theme-smart .modal-body .form-control:focus{background:#fff!important;border-color:#9ac43a!important;box-shadow:none!important}
body.theme-smart .modal-body .btn-primary{border-radius:22px!important;background:#9ac43a!important;border-color:#9ac43a!important;color:#12261a!important;font-weight:700}

/* ─────────────────────────────
   (2026-09-09) صفحة الشروط والخصوصية: كانت بنفس التخطيط بالحرف
   في الـ12 موقع — كتلة نص واحدة بنفس تسلسل البنود، والفرق لون بس.
   النص القانوني ما اتغيّرش ولا حرف؛ اللي اتغيّر طريقة العرض:
   ترقيم البنود، عدد الأعمدة، عرض سطر القراءة، وشكل العنوان.
   ───────────────────────────── */

/* سمارت — رقائق: رقاقة خضرا قبل عنوان البند، والنص في عمودين. */
body.theme-smart.pg-policy-page .common-listing-section-wrap .box4 h5{
    display:flex;align-items:center;gap:10px;margin:32px 0 8px;
    color:#003452;font-size:1rem}
body.theme-smart.pg-policy-page .common-listing-section-wrap .box4 h5::before{
    content:"";width:24px;height:8px;border-radius:4px;background:#9ac43a;flex:0 0 auto}
body.theme-smart.pg-policy-page .common-listing-section-wrap .box4 p{
    column-count:2;column-gap:36px;line-height:1.75;font-size:.92rem}

/* ─────────────────────────────
   (2026-09-09) خريطة الموقع: كانت نفس القائمة بنفس عدد الأعمدة
   في الـ12 موقع. الروابط ما اتغيّرتش — اللي اتغيّر عدد الأعمدة
   وشكل عنوان المجموعة والفواصل.
   ───────────────────────────── */

/* سمارت — رقائق: رقاقة خضرا قبل عنوان المجموعة، وأربع أعمدة. */
body.theme-smart.page-sitemap h5.no-margin{
    display:flex;align-items:center;gap:10px;margin:28px 0 10px;color:#003452;font-size:.96rem}
body.theme-smart.page-sitemap h5.no-margin::before{
    content:"";width:22px;height:7px;border-radius:4px;background:#9ac43a;flex:0 0 auto}
body.theme-smart.page-sitemap .sitemap-list{column-count:4;column-gap:28px;font-size:.86rem}
body.theme-smart.page-sitemap .sitemap-list li{padding:4px 0}

/* ─────────────────────────────
   (2026-09-09) اللمسة الفنية: علامة واحدة مميّزة للموقع

   كل معهد له علامة بتتكرّر على عناوين الأقسام (h2) في كل صفحاته.
   العلامة مشتقّة من أداة الموقع نفسها، فهي بتقوّي الهوية بدل ما
   تكون زينة عشوائية. CSS و::before/::after بس — مفيش تغيير markup.
   ملحوظة: العلامة على عناوين الأقسام (h2) بس. عنوان الصفحة في البنر
   عنده علامته الخاصة في كل ثيم أصلاً بمحدّدات فيها id، ومحاولة
   إضافة علامة تانية فوقها كانت بتتغلب أو تتلخبط معاها.
   ───────────────────────────── */

/* سمارت — رقائق: رقاقتان متراكبتان بطولين مختلفين. */
body.theme-smart h2:not([class]),
body.theme-smart h2.inst-logos-h{position:relative;padding-top:17px}
body.theme-smart h2:not([class])::before,
body.theme-smart h2.inst-logos-h::before{
    content:"";position:absolute;top:0;inset-inline-start:0;
    width:30px;height:6px;border-radius:3px;background:#9ac43a}
body.theme-smart h2:not([class])::after,
body.theme-smart h2.inst-logos-h::after{
    content:"";position:absolute;top:8px;inset-inline-start:0;
    width:15px;height:6px;border-radius:3px;background:#003452;opacity:.55}

/* ─────────────────────────────
   (2026-09-09) قوائم الدورات: فكّ تجمّع التصاميم

   قياس على 11 موقع × صفحة التخصص طلّع تلات عناقيد بس:
     شبكة كروت بصورة 4/صف : الخليج، جلوماك، سمارت، بلَس، أبفا
     صفوف جدول            : جلوبال، القادة، السعودية
     كروت من غير صورة     : المورد، عُمان، عربي
   يعني ستة مواقع بنفس الشكل. كل موقع هنا رجع لأداته.
   ───────────────────────────── */

/* سمارت — رقائق: كروت من غير صور، تلاتة في الصف، وكل كرت عليه شريط
   رقاقة خضرا من فوق. الصورة كانت بتحطّه في عنقود الكروت المصوّرة. */
/* الشبكة بتتحدّد بمحدّد فيه id (#category_course_list / #course_list)
   فلازم نفس التخصيص هنا، وإلا القاعدة القديمة بتغلب. */
body.theme-smart.pg-training-courses #category_course_list,
body.theme-smart.pg-training-courses #course_list{
    display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:16px}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting{
    border:0!important;border-radius:12px!important;
    box-shadow:0 2px 10px rgba(0,52,82,.08)!important;padding:0 16px 16px!important;
    position:relative;overflow:hidden}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting::before{
    content:"";display:block;height:7px;margin:0 -16px 14px;background:#9ac43a}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-image{display:none!important}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-title{font-size:.94rem;line-height:1.45}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-date,
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-language,
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-location{
    display:inline-block;background:#f2f6f9;border-radius:12px;
    padding:3px 10px;margin:0 6px 6px 0;font-size:.76rem}

/* ─────────────────────────────
   (2026-09-12) "تصميم الكروت أسماء الدورات ضيّقة" و"الفلتر لازق في بعضه" — طلب صريح.

   الكرت كان متقسّم عمودين 42%+1fr عشان صورة الدورة (سطر 582 و679). الصور اتشالت من
   زمان، فالـ42% فضلت فاضية والاسم اتزنق في الباقي — كل اسم بيتلفّ 3-4 سطور.
   هنا الكرت عمود واحد: الاسم والكبسولات بعرض الكرت كله.
   والفلتر: الخانات مكانش بينها ولا حواليها أي مسافة.
   ───────────────────────────── */
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting,
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting.virtual,
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting,
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting.virtual{
    grid-template-columns:minmax(0,1fr)!important;column-gap:0!important;
    display:flex!important;flex-direction:column;align-items:stretch}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-title{
    width:100%!important;height:auto!important;min-height:0!important;
    display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;
    overflow:hidden!important;margin:0 0 10px!important;font-size:.95rem;line-height:1.5}
/* الكبسولات جنب بعض في سطر واحد يلفّ لما يحتاج */
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-date,
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-language,
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-location{
    width:auto!important;align-self:flex-start}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting > form{
    width:100%!important;margin-top:auto!important;padding:10px 0 0!important}
/* الفلتر الجانبي: مسافات بين الخانات وحواليها */
body.theme-smart.pg-training-courses .inst-tc-side > .col-md-12.p-0,
body.theme-smart.pg-training-courses .inst-tc-side form{padding:14px!important}
body.theme-smart.pg-training-courses .inst-tc-side form{display:flex;flex-direction:column;gap:12px!important}
body.theme-smart.pg-training-courses .inst-tc-side select.form-control{margin:0!important}
/* (2026-09-12) على الموبايل كانت لسه 3 كروت في الصف بعرض 109px والاسم 77px (21 كرت مقصوص):
   قاعدة العمود الواحد القديمة (سطر 598) من غير !important فكانت بتتغلب. */
@media (max-width:1199px){
    body.theme-smart.pg-training-courses #course_list,
    body.theme-smart.pg-training-courses #category_course_list,
    body.theme-smart.pg-training-courses #category_course_list_by_name,
    body.theme-smart.pg-training-courses .inst-tc #course_list,
    body.theme-smart.pg-training-courses .inst-tc #category_course_list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:767px){
    body.theme-smart.pg-training-courses #course_list,
    body.theme-smart.pg-training-courses #category_course_list,
    body.theme-smart.pg-training-courses #category_course_list_by_name,
    body.theme-smart.pg-training-courses .inst-tc #course_list,
    body.theme-smart.pg-training-courses .inst-tc #category_course_list{grid-template-columns:minmax(0,1fr)!important}
}
/* زرار التسجيل في القاع دايمًا: الكروت اللي معلوماتها أقل كان زرّها بيطلع أعلى */
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-location:last-of-type,
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-language:last-of-type{margin-bottom:auto!important}

/* في بعض الثيمات فيه قاعدة أخصّ فيها .inst-tc كمان، فلازم نسخة
   بنفس التخصيص وإلا بتغلب. */
body.theme-smart.pg-training-courses .inst-tc #category_course_list,
body.theme-smart.pg-training-courses .inst-tc #course_list{
    display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:16px}

/* ─────────────────────────────
   (2026-09-10) صفحة تفاصيل المقال: فكّ التشابه

   تمن مواقع كانت بنفس الشكل — عمود نص واحد في النص بعرض
   490-694px. أسماء الحاويات مختلفة في كل ثيم بس الصورة واحدة.
   اللي بيفرق شكل صفحة نص: عدد الأعمدة، عرض سطر القراءة، ووجود
   إطار أو عمود جانبي. النص نفسه ما اتغيّرش.
   ───────────────────────────── */

/* سمارت — رقائق: المتن عمودين وفاصل رقاقة خضرا بين الأقسام. */
/* المقال جوّه .sm-art-text والمدونة جوّه .sm-blg-text — الاتنين لازم
   ياخدوا نفس المعالجة وإلا صفحة المدونة تفضل عمود واحد. */
body.theme-smart.pg-post-page .sm-art-text p,
body.theme-smart.pg-post-page .sm-art-text ul,
body.theme-smart.pg-post-page .sm-art-text ol,
body.theme-smart.pg-post-page .sm-blg-text p,
body.theme-smart.pg-post-page .sm-blg-text ul,
body.theme-smart.pg-post-page .sm-blg-text ol{
    column-count:2;column-gap:34px;line-height:1.75}
body.theme-smart.pg-post-page h2,
body.theme-smart.pg-post-page h3{position:relative;padding-top:16px}
body.theme-smart.pg-post-page h2::after,
body.theme-smart.pg-post-page h3::after{
    content:"";position:absolute;top:0;inset-inline-start:0;
    width:34px;height:7px;border-radius:4px;background:#9ac43a}

/* ─────────────────────────────
   (2026-09-10) أيقونة الصيغة: الحضوري غير الافتراضي

   الأيقونة كانت واحدة للحالتين — "حضورية" و"افتراضية" بنفس الرمز.
   الصف الافتراضي عليه كلاس `.virtual` فهو اللي بيفرّق.

   الرمز المختار هنا مش مستعمل كأيقونة صيغة في أي معهد تاني، ولا
   بيساوي أيقونة الحضوري بتاعة المعهد ده — عشان الأطقم تفضل
   مختلفة بين المواقع زي ما هي.
   ───────────────────────────── */
body.theme-smart.pg-training-courses .courselisting.virtual .course-language .bi-bookmarks-fill::before{content:"\f6a6"} /* pc-display */

/* ─────────────────────────────
   (2026-09-10) كروت الدورات القادمة من غير صور

   الطلب اتمدّ من الخليج لباقي المواقع. الصورة `.inst-upcoming-thumb`
   span بخلفية CSS مش عنصر img، عشان كده ما ظهرتش في مسح الصور.
   ───────────────────────────── */
/* شريحة التاريخ كانت absolute فوق الصورة — من غير صورة كانت
   هتقع على العنوان. بقت في سياق الكرت في أوّله. */
body.theme-smart .inst-upcoming-thumb{display:none!important}
body.theme-smart .inst-upcoming-date{
    position:static;align-self:flex-start;margin:14px 14px 0}
body.theme-smart .inst-upcoming-body{padding-top:10px}

/* ─────────────────────────────
   (2026-09-10) مكان زر التسجيل موحّد بين الصفوف

   الصف الافتراضي ناقصه عمود المدينة، والكرت grid — فالزرار كان
   بيقع في خانة مختلفة عن باقي الصفوف ويزحّ أفقيًا (قِست 33 مقابل
   97 في بلَس، و16 مقابل 137 في سمارت). التثبيت بتحديد العمود
   بالصريح بدل الترتيب التلقائي.
   ───────────────────────────── */
/* القاعدة الأقدم `.inst-tc .courselisting form{grid-column:auto}`
   أخصّ، فلازم نفس التخصيص عشان تتغلب. */
body.theme-smart.pg-training-courses .inst-tc .courselisting form,
body.theme-smart.pg-training-courses .courselisting > form{grid-column:1/-1}

/* ─────────────────────────────
   (2026-09-11) صفحة نتايج البحث: فكّ التشابه

   المراجعة الشاملة طلّعت إن الصفحة دي هي الوحيدة اللي لسه بنفس
   التخطيط بالحرف في الـ11 موقع — نفس الكرت ونفس ترتيب البيانات،
   والفرق لون الزرار والحدّ بس. كل موقع بياخد أداته.
   ───────────────────────────── */
/* سمارت — رقائق: زوايا مدوّرة وظل ناعم ورأس السنة رقاقة خضرا. */
body.theme-smart.pg-search-page .courselisting{
    background:#fff!important;border:0!important;border-radius:18px!important;
    box-shadow:0 8px 24px rgba(13,34,51,.08)!important;
    padding:20px 24px!important;margin-bottom:20px}
body.theme-smart.pg-search-page .course-title h6 a{color:#0d2233!important;font-weight:700}
body.theme-smart.pg-search-page .custom-head-additional{
    background:#9ac43a!important;color:#0d2233!important;border-radius:999px!important;
    padding-inline:18px!important;font-weight:700}
body.theme-smart.pg-search-page .course-details-wrap{
    background:#f2f6f9!important;border-radius:14px!important}


/* (2026-09-11) سهم الرجوع لفوق: كان نفس الزرار في الـ11 موقع (مربع 31px
   بأيقونة دايرة). كل موقع بقى له شكله؛ السهم مرسوم بـCSS بدل الأيقونة. */
body.theme-smart #back-to-top{box-sizing:border-box;padding:0;overflow:visible}
body.theme-smart #back-to-top i{display:none}
body.theme-smart #back-to-top::before{content:'';position:absolute;left:50%;top:50%;
    width:10px;height:10px;border-top:2px solid currentColor;border-left:2px solid currentColor;
    transform:translate(-50%,-25%) rotate(45deg)}
body.theme-smart #back-to-top{width:40px;height:58px;border:0!important;border-radius:20px!important;
    background:var(--site-primary,#1f3a88)!important;color:#fff}
body.theme-smart #back-to-top::before{top:34%}
body.theme-smart #back-to-top::after{content:'';position:absolute;left:50%;top:32%;width:2px;height:22px;
    background:currentColor;transform:translateX(-50%)}

/* ─────────────────────────────
   (2026-09-12) "ليسوا في مستوى واحد" — طلب صريح، والاختيار: القص زي المعهد.
   الكروت في الصف بنفس الطول، بس العنوان بيطول سطر أو أكتر فينزّل الكلام والزرار
   اللي تحته — فمكانوش على خط واحد. العنوان هنا بارتفاع ثابت زي المعهد بالظبط
   (المعهد: min-height 38px + قص سطرين)، فكل اللي تحته على خط واحد.
   سمارت: العناوين بتوصل 5 أسطر والفاضي في الكرت 26px بس — فالقص على 3 أسطر.
   الارتفاع = 3 × 18.58 (سطر) + 10 (حشوة فوق) ≈ 66px.
   ───────────────────────────── */
body.theme-smart.pg-training-courses #course_list .course-title,
body.theme-smart.pg-training-courses #category_course_list .course-title,
body.theme-smart.pg-training-courses #category_course_list_by_name .course-title,
body.theme-smart.pg-training-courses #coursefinder_list_courses .course-title{
    display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:3;
    overflow:hidden;height:66px!important;box-sizing:border-box}

/* ─────────────────────────────
   (2026-09-12) آخر حاجة في الملف بعد قواعد الشبكة اللي بـ!important (سطر 3115 و3184)،
   لأن قاعدة !important من غير media بتغلب قاعدة !important جوّه media لو جاية بعدها.
   1) الموبايل والتابلت: كانت لسه 3 كروت في الصف على 390 (الكرت 109px والاسم 77px).
   2) زرار التسجيل في القاع: كروت الأونلاين معلوماتها 3 كبسولات والحضوري 4، فالزرار
      كان بيطلع أعلى في صفحة التخصص (فرق 32px).
   ───────────────────────────── */
@media (max-width:1199px){
    body.theme-smart.pg-training-courses #course_list,
    body.theme-smart.pg-training-courses #category_course_list,
    body.theme-smart.pg-training-courses #category_course_list_by_name,
    body.theme-smart.pg-training-courses #coursefinder_list_courses,
    body.theme-smart.pg-training-courses .inst-tc #course_list,
    body.theme-smart.pg-training-courses .inst-tc #category_course_list,
    body.theme-smart.pg-training-courses .inst-tc #category_course_list_by_name{
        grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:767px){
    body.theme-smart.pg-training-courses #course_list,
    body.theme-smart.pg-training-courses #category_course_list,
    body.theme-smart.pg-training-courses #category_course_list_by_name,
    body.theme-smart.pg-training-courses #coursefinder_list_courses,
    body.theme-smart.pg-training-courses .inst-tc #course_list,
    body.theme-smart.pg-training-courses .inst-tc #category_course_list,
    body.theme-smart.pg-training-courses .inst-tc #category_course_list_by_name{
        grid-template-columns:minmax(0,1fr)!important}
}
/* (2026-09-12) صفحة التخصص: الكرت كان لسه grid بعمودين 42%+1fr (سطر 582 و679 بيغلبوا
   قاعدة الـflex اللي فوق)، فالفورم مكانش بيتزق للقاع ودورات الأونلاين (3 كبسولات)
   زرّها كان أعلى من الحضوري (4 كبسولات) بـ32px. هنا عمود مرن بنفس تخصيص .inst-tc. */
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting,
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting.virtual{
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    grid-template-columns:none!important;column-gap:0!important}
/* الكرت جوّه <a> هو اللي بيتمدّد في الصف، والكرت نفسه كان بيقف عند طول محتواه
   (282 للعمود و250 للكرت) — فالفورم مكانش لاقي فراغ يتزق فيه للقاع. */
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting-col > a,
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting-col > a{
    display:flex!important;flex-direction:column;height:100%!important}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting-col > a > .courselisting,
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting-col > a > .courselisting{
    flex:1 1 auto!important;height:auto!important}
/* الكبسولة الأخيرة مالهاش دفع — الفورم هو اللي بيتزق للقاع */
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-location:last-of-type,
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting .course-language:last-of-type{margin-bottom:6px!important}
body.theme-smart.pg-training-courses .courselist-style-inside .courselisting > form,
body.theme-smart.pg-training-courses .inst-tc .courselist-style-inside .courselisting > form{
    margin-top:auto!important;width:100%!important;padding:10px 0 0!important}


/* ─────────────────────────────
   (2026-09-12) ترتيب خانات الفلتر ومحرّك البحث — طلب صريح:
   "ننوّع في ترتيب الخانات مع الاحتفاظ دايمًا بالاسم في مكانه، بحيث ميبقاش
   موقع شبه التاني في الترتيب".

   الترتيب هنا بالـCSS بس (order) — الحقول نفسها ما اتلمستش: نفس الأسماء
   ونفس الـids اللي الفلتر والـJS بيقروها، ونفس الحقول المخفية.
   خانة اسم الدورة (search-input-main) سايبينها في مكانها الأول دايمًا.
   المعهد مستنّى: كل القواعد مربوطة بـbody.theme-smart.
   ───────────────────────────── */

body.theme-smart.pg-training-courses #common-filter-box-modal-one #sort_month{order:1}
body.theme-smart.pg-training-courses #common-filter-box-modal-one #sort_cat{order:2}
body.theme-smart.pg-training-courses #common-filter-box-modal-one #sort_city{order:3}
body.theme-smart.pg-training-courses #common-filter-box-modal-one #sort_lang{order:4}
body.theme-smart.pg-training-courses #common-filter-box-modal-one #sort_course_year{order:5}
body.theme-smart .modal .form-group.row > .search-input-main{order:0}
body.theme-smart .modal .form-group.row > .lang-id{order:1}
body.theme-smart .modal .form-group.row > .category-id{order:2}
body.theme-smart .modal .form-group.row > .month-search{order:3}
body.theme-smart .modal .form-group.row > .course-type{order:4}
body.theme-smart .modal .form-group.row > .city-id{order:5}
body.theme-smart .modal .form-group.row > .year-search{order:6}

/* (2026-09-12) زرار Clear وزرار الكتيب وزرار البحث يفضلوا في مكانهم في الآخر:
   في flex أي عنصر order:0 بيسبق اللي عنده order:1، فلما الخانات اتظبطت 1..5
   الزراير كانت هتقفز لقدّام. هنا بيتثبتوا بعد الخانات. */
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two.darkblue-color{order:90}
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two.purple-color,
body.theme-smart.pg-training-courses #common-filter-box-modal-one #download_brochure_category{order:91}
body.theme-smart .modal .form-group.row > .search-btn-main,
body.theme-smart .modal .form-group.row > [class*="search-btn"],
body.theme-smart .modal .form-group.row > .col-md-12:last-child{order:99}

/* ─────────────────────────────
   (2026-09-12) ترتيب خانات فورمات الاستفسار/الكتيب/اتصل بيا — طلب صريح:
   ننوّع الترتيب بين المواقع مع إبقاء خانات الاسم في مكانها.

   الاسم الأول والأخير ثابتين فوق، وزرار الإرسال ثابت تحت (order:99 فوق)،
   واللي بيتنقل: الشركة / الإيميل / التليفون / الرسالة.
   بالـCSS بس (order + :has) — الحقول وأسماءها وids زي ما هي.
   ───────────────────────────── */

body.theme-smart .modal .form-group.row > div:has(#first_name_qe){order:1}
body.theme-smart .modal .form-group.row > div:has(#last_name_qe){order:2}
body.theme-smart .modal .form-group.row > div:has(#first_name_cb){order:1}
body.theme-smart .modal .form-group.row > div:has(#last_name_cb){order:2}
body.theme-smart .modal .form-group.row > div:has(#first_name_db){order:1}
body.theme-smart .modal .form-group.row > div:has(#last_name_db){order:2}
body.theme-smart .modal .form-group.row > div:has(#comments_qe){order:3}
body.theme-smart .modal .form-group.row > div:has(#company_qe){order:4}
body.theme-smart .modal .form-group.row > div:has(#email_qe){order:5}
body.theme-smart .modal .form-group.row > div:has(#phone_qe){order:6}
body.theme-smart .modal .form-group.row > div:has(#company_cb){order:3}
body.theme-smart .modal .form-group.row > div:has(#phone_cb){order:4}
body.theme-smart .modal .form-group.row > div:has(#phone_cb){order:3}
body.theme-smart .modal .form-group.row > div:has(#email_db){order:4}
body.theme-smart .modal .form-group.row > div:has(#company_db){order:5}

/* ─────────────────────────────
   (2026-09-12) "نوّعت بس في حاجات طويلة وحاجات قصيرة — خلي الشكل قد بعض" — طلب صريح.
   خانات النافذة أصلاً بعرض مختلف (col-md-3 / col-md-2 / col-md-1)، فبعد ما الترتيب
   اتغيّر بقى في خانة طويلة وخانة قصيرة جنب بعض. هنا: اسم الدورة وزرار البحث بعرض
   كامل، والست قوايم كلها نص العرض بالظبط — فالشكل منتظم مهما كان الترتيب.
   ───────────────────────────── */
body.theme-smart .modal .form-group.row > .search-input-main,
body.theme-smart .modal .form-group.row > .search-btn-main{flex:0 0 100%!important;max-width:100%!important}
body.theme-smart .modal .form-group.row > .course-type,
body.theme-smart .modal .form-group.row > .category-id,
body.theme-smart .modal .form-group.row > .city-id,
body.theme-smart .modal .form-group.row > .lang-id,
body.theme-smart .modal .form-group.row > .month-search,
body.theme-smart .modal .form-group.row > .year-search{flex:0 0 50%!important;max-width:50%!important}
@media (max-width:575px){
    body.theme-smart .modal .form-group.row > .course-type,
    body.theme-smart .modal .form-group.row > .category-id,
    body.theme-smart .modal .form-group.row > .city-id,
    body.theme-smart .modal .form-group.row > .lang-id,
    body.theme-smart .modal .form-group.row > .month-search,
    body.theme-smart .modal .form-group.row > .year-search{flex:0 0 100%!important;max-width:100%!important}
}

/* ─────────────────────────────
   (2026-09-12) "الهيكل العام متقارب" — طلب صريح.
   توحيد العرض خلّى كل النوافذ بنفس الهيكل (اسم فوق + تلات صفوف اتنين‑اتنين + زرار).
   هنا كل موقع له شكل شبكة مختلف: عمودين غير متساويين 60/40.
   الاسم فوق دايمًا وزرار البحث تحت، والترتيب اللي اتظبط قبل كده زي ما هو.
   ───────────────────────────── */

body.theme-smart .modal .form-group.row > .course-type{flex:0 0 60%!important;max-width:60%!important}
body.theme-smart .modal .form-group.row > .category-id{flex:0 0 40%!important;max-width:40%!important}
body.theme-smart .modal .form-group.row > .city-id{flex:0 0 50%!important;max-width:50%!important}
body.theme-smart .modal .form-group.row > .lang-id{flex:0 0 60%!important;max-width:60%!important}
body.theme-smart .modal .form-group.row > .month-search{flex:0 0 40%!important;max-width:40%!important}
body.theme-smart .modal .form-group.row > .year-search{flex:0 0 50%!important;max-width:50%!important}
@media (max-width:575px){
    /* (2026-09-12) شكل بوب-أب البحث على الموبايل — خاص بالموقع ده.
       ممنوع 4 خانات في صف على 390: العرض بيطلع ~85px فالكلام بيتقصّ
       (اتكشف بالصور: Language متقطعة وCourse Ty ناقصة). الحد 3 في الصف.
       العروض موزّعة حسب الترتيب المرئي لهذا الموقع عشان الصفوف تملا عرضها. */
    body.theme-smart .modal .form-group.row > .lang-id{flex:0 0 33.333%!important;max-width:33.333%!important}
    body.theme-smart .modal .form-group.row > .category-id{flex:0 0 33.333%!important;max-width:33.333%!important}
    body.theme-smart .modal .form-group.row > .month-search{flex:0 0 33.334%!important;max-width:33.334%!important}
    body.theme-smart .modal .form-group.row > .course-type{flex:0 0 33.333%!important;max-width:33.333%!important}
    body.theme-smart .modal .form-group.row > .city-id{flex:0 0 33.333%!important;max-width:33.333%!important}
    body.theme-smart .modal .form-group.row > .year-search{flex:0 0 33.334%!important;max-width:33.334%!important}
}

/* (2026-09-12) ظبط الصفوف تملا عرضها بالكامل — كانت فيه خانة لوحدها وجنبها فراغ */

/* (2026-09-12) العرض بقى حسب ترتيب العرض الفعلي مش حسب اسم الحقل — الصفوف بتملا بالكامل */



/* ─────────────────────────────
   (2026-09-12) طلب صريح: زرار تحميل الكتيب في الصفحة دي فوق جنب الكلام أقصى اليمين،
   والنسخة اللي في الفلتر تتشال.
   الزرار جوّه .common-banner-text نفسه، فالنص بيتحط في عمود والزرار في عمود تاني —
   كده مستحيل يركبوا على بعض (نفس حل ليدرز).
   ───────────────────────────── */
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
    column-gap:28px;align-items:center}
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text > h1{
    grid-column:1!important;grid-row:1!important}
/* (2026-09-12) طلب صريح: الكلام ياخد عرضه كله عشان السطور تقل — فالفقرة بتفرد على العمودين
   تحت الزرار، والزرار فاضل في الصف الأول جنب العنوان أقصى اليمين. */
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text > p,
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text > .space15,
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text > .space5{
    grid-column:1/-1!important}
body.theme-smart.pg-training-courses #common-banner-section-image .ub-banner-brochure{
    grid-column:2!important;grid-row:1!important;justify-self:end;align-self:center;
    margin:0!important;white-space:nowrap}
/* النسخة اللي في الفلتر الجانبي تتشال — فيه نسخة في البنر دلوقتي */
body.theme-smart.pg-training-courses .inst-tc-side #download_brochure_upcoming,
body.theme-smart.pg-training-courses .inst-tc-side #download_brochure_category,
body.theme-smart.pg-training-courses .inst-tc-side .menu-two.purple-color,
body.theme-smart.pg-training-courses #common-filter-box-modal-one #download_brochure_upcoming,
body.theme-smart.pg-training-courses #common-filter-box-modal-one .menu-two.purple-color{display:none!important}
@media (max-width:767px){
    body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text{
        grid-template-columns:minmax(0,1fr)!important}
    body.theme-smart.pg-training-courses #common-banner-section-image .ub-banner-brochure{
        grid-column:1!important;grid-row:auto!important;justify-self:start;margin-top:12px!important}
}

/* (2026-09-12) طلب صريح + اختيار المستخدم: الكلام ياخد عرض الصفحة كله في البنر.
   الوتد الأخضر (112deg ووقفة 62%) كان قاطع البنر بالطول وياخد ~38% من العرض، وعلى
   الموبايل كان بيعدّي من نص الكلام والكلمات تختفي عليه. فاتشال خالص (طلب صريح)
   والخلفية بقت لون واحد كامل العرض.
   نفس المعاملة في بنر صفحات الأقسام (#common-banner-section-icon). */
body.theme-smart.pg-training-courses #common-banner-section-image,
body.theme-smart.pg-training-courses #common-banner-section-icon,
body[dir="rtl"].theme-smart.pg-training-courses #common-banner-section-image,
body[dir="rtl"].theme-smart.pg-training-courses #common-banner-section-icon{
    background:#003452!important;position:relative;overflow:hidden}
body.theme-smart.pg-training-courses #common-banner-section-image .background-listing,
body.theme-smart.pg-training-courses #common-banner-section-icon .background-listing{
    background:transparent!important}
body.theme-smart.pg-training-courses #common-banner-section-image::after,
body.theme-smart.pg-training-courses #common-banner-section-icon::after{display:none}
body.theme-smart.pg-training-courses #common-banner-section-image .common-banner-text,
body.theme-smart.pg-training-courses #common-banner-section-icon .common-banner-text{
    max-width:none!important}

/* (2026-09-12) طلب صريح: "زر تحميل البروشور مش ظاهر". الزرار كان شغال وموجود، لكن
   خلفيته #003452 — نفس لون خلفية البنر بالظبط بعد ما الوتد الأخضر اتشال، فكان باين
   كأنه نص عادي. الأخضر (#9ac43a) هو لون الوتد اللي اتشال، فبيرجّع اللون للهوية
   وبيدّي تباين واضح على الكحلي. */
body.theme-smart.pg-training-courses #common-banner-section-image .ub-banner-brochure{
    background:#9ac43a!important;border-color:#9ac43a!important;color:#04283f!important}

/* (2026-09-12) طلب صريح: ترتيب خانات محرّك البحث في صفحة نتائج البحث يتنوّع في كل
   معهد. خانة الاسم تفضل أول واحدة بعد العنوان وزرار البحث آخر واحد (نفس القاعدة
   المتفق عليها). الغلاف .form-group.row أصلاً flex فالـorder بتشتغل عليه.
   الفواصل (.space10/.space20) ارتفاعها صفر والمسافة جاية من margin-top بتاعها —
   ولو اتسابت مكانها هتتجمّع فوق لما الخانات تترتّب، فاتشالت والمسافة بقت row-gap.
   المعهد مالوش theme-* ولا pg-search-page على الـbody فمستحيل توصله القاعدة دي. */
body.theme-smart.pg-search-page .search-results-wrap-left .form-group{row-gap:10px}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .space10,body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .space20{display:none}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .search-input-main:first-child{order:0;margin-bottom:6px}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .search-input-main:not(:first-child){order:1}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .lang-id{order:2}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .category-id{order:3}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .course-type{order:4}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .city-id{order:5}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .year-search{order:6}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .month-search{order:7}
body.theme-smart.pg-search-page .search-results-wrap-left .form-group > .search-btn-main{order:9;margin-top:8px}

/* (2026-09-12) طلب صريح: "نوّع في أشكاله وهيكله" — صفحة نتايج البحث كانت
   نسخة واحدة في كل المعاهد (عمود 320px شمال + نتايج يمين) والفرق اللون بس.
   التنويع كله CSS: مفيش لمس للماركب ولا لأسماء الحقول. خانة الاسم أول واحدة
   وزرار البحث آخر واحد زي ما اتفقنا. المعهد مالوش theme-* ولا pg-search-page. */
/* هيكل: العمود الجانبي على الناحية التانية من النتايج */
body.theme-smart.pg-search-page .search-results-wrap-left{order:2}
body.theme-smart.pg-search-page .search-results-wrap-right{order:1}

/* (2026-09-12) طلب صريح: تغيير أيقونات صفحة نتايج البحث، وكل معهد بثلاثي مختلف.
   الـmask متطبّق على الـ<svg> نفسه مش على عنصر أب: نسخ الموبايل بتقع جوّه <span>
   بلا كلاس فمفيش أب أعلّق عليه — وكده محدِّد واحد بيغطي الديسكتوب والموبايل.
   خط bootstrap-icons مش محمّل في الصفحة (fonts.check=false) فطريق كودات الخط مقفول.
   الرسمة الأصلية بتتلغي بـfill:transparent واللون بيجي من background-color.
   bi-x (قفل المودال) وزراري العرض برّه المحدِّدات دي. */
body.theme-smart.pg-search-page svg.bi-calendar-check-fill,body.theme-smart.pg-search-page svg.bi-flag-fill,body.theme-smart.pg-search-page svg.bi-clock-fill,body.theme-smart.pg-search-page svg.bi-signpost-split-fill{fill:transparent!important;background-color:#9ac43a;width:1em;height:1em;display:inline-block;vertical-align:-.125em;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
body.theme-smart.pg-search-page svg.bi-calendar-check-fill{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M1 4h14v11H1zM4 0h2v3H4zM10 0h2v3h-2z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M1 4h14v11H1zM4 0h2v3H4zM10 0h2v3h-2z'/></svg>")}
body.theme-smart.pg-search-page svg.bi-flag-fill{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z'/></svg>")}
body.theme-smart.pg-search-page svg.bi-clock-fill,body.theme-smart.pg-search-page svg.bi-signpost-split-fill{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M2 1h8a1 1 0 0 1 1 1v13H1V2a1 1 0 0 1 1-1zm10 6h2.5a.5.5 0 0 1 .5.5V15h-3V7z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M2 1h8a1 1 0 0 1 1 1v13H1V2a1 1 0 0 1 1-1zm10 6h2.5a.5.5 0 0 1 .5.5V15h-3V7z'/></svg>")}

/* (2026-09-12) نفس الطلب: الشريط كان 999px جوّه لوح 14px. */
body.theme-smart.pg-search-page .custom-head-additional,
body.theme-smart .custom-head-additional{border-radius:14px!important}


/* ═════════════════════════════════════════════════════════════
   (2026-09-18) صفحة "عن المعهد" — بنية مختلفة لكل معهد (طلب صريح: صفحات الموبايل
   شبه بعضها). الـHTML واحد (about_vmv.php: رؤية/رسالة/وعد/قيم) والبنية بتتغيّر
   بالـCSS: عدد الأعمدة، مكان الصورة، الترتيب، شكل العنوان — مش الألوان بس.
   ═════════════════════════════════════════════════════════════ */
body.theme-smart.page-about #common-listing-section .box4{background:transparent;box-shadow:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
body.theme-smart.page-about #common-listing-section .aboutus-section-card{background:#fff;border:2px solid #dfe8c8;border-top:5px solid #9bc53d;border-radius:14px;padding:12px;margin:0}
body.theme-smart.page-about #common-listing-section .aboutus-brand,body.theme-smart.page-about #common-listing-section .aboutus-values{grid-column:1/-1}
body.theme-smart.page-about #common-listing-section .aboutus-section-card .row{display:flex;flex-direction:column;margin:0}
body.theme-smart.page-about #common-listing-section .aboutus-section-card .col-md-6{max-width:100%;width:100%;padding:0}
body.theme-smart.page-about #common-listing-section .aboutus-section-card .col-md-6:has(> img){order:-1;margin-bottom:8px}
body.theme-smart.page-about #common-listing-section .aboutus-section-card .col-md-12{display:none}
body.theme-smart.page-about #common-listing-section .aboutus-vision img,body.theme-smart.page-about #common-listing-section .aboutus-mission img,body.theme-smart.page-about #common-listing-section .aboutus-brand img{width:100%;aspect-ratio:1/1;object-fit:cover;border:0;border-radius:10px;box-shadow:none}
body.theme-smart.page-about #common-listing-section .aboutus-section-card h4{font-size:.95rem;color:#003452;font-weight:800;margin:0 0 4px}
body.theme-smart.page-about #common-listing-section .aboutus-section-card p{font-size:.8rem;line-height:1.45;padding:0;margin:0}
body.theme-smart.page-about #common-listing-section .aboutus-brand .row{flex-direction:row;align-items:center;gap:12px}
body.theme-smart.page-about #common-listing-section .aboutus-brand .col-md-6{width:auto}
body.theme-smart.page-about #common-listing-section .aboutus-brand .col-md-6:has(> img){flex:0 0 84px;margin:0}
body.theme-smart.page-about #common-listing-section .aboutus-brand p{font-size:.9rem}
body.theme-smart.page-about #common-listing-section .aboutus-values .aboutus-section-row{background:none;border:0;box-shadow:none;padding:0}
body.theme-smart.page-about #common-listing-section .aboutus-values .aboutus-section-row .row{display:flex;flex-wrap:wrap;justify-content:center;margin:0}
body.theme-smart.page-about #common-listing-section .aboutus-values .aboutus-col-5{flex:0 0 33.333%;max-width:33.333%;padding:0 4px;margin-bottom:6px}
body.theme-smart.page-about #common-listing-section .aboutus-values img{border:0;box-shadow:none}
@media (min-width:992px){body.theme-smart.page-about #common-listing-section .box4{grid-template-columns:repeat(3,1fr)}body.theme-smart.page-about #common-listing-section .aboutus-brand{grid-column:auto}body.theme-smart.page-about #common-listing-section .aboutus-brand .row{flex-direction:column;align-items:stretch}body.theme-smart.page-about #common-listing-section .aboutus-brand .col-md-6:has(> img){flex:none;margin-bottom:8px}body.theme-smart.page-about #common-listing-section .aboutus-values .aboutus-col-5{flex:0 0 20%;max-width:20%}}

/* القيم: الـ.row العامة فوق عمودية (flex-direction:column) وكانت بتنطبق على صف القيم كمان. */
body.theme-smart.page-about #common-listing-section .aboutus-values .aboutus-section-row .row{flex-direction:row}