/* ============================================================
   المعهد السعودي — Saudi Institute
   ------------------------------------------------------------
   Direction: two stacked planes. The banner ends on a diagonal
   and the search card straddles the cut.
   ============================================================ */

body.theme-saudi { --sa-ink: #10261a; --sa-line: #dfe6e1; }

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

body.theme-saudi .courselisting,
body.theme-saudi .card {
    border-radius: 14px !important; border: 0 !important;
    box-shadow: 0 14px 34px rgba(16, 38, 26, .12) !important;
}

body.theme-saudi .sa-hero { padding: 0 0 60px; background: #fff; }

body.theme-saudi .sa-hero-plate {
    /*
     * النسيج تحت، ولون المعهد فوقه.
     *
     * الصورة أغمق وأبرد من أخضر المعهد، فلو اتحطت لوحدها الشريط
     * بيبقى صورة جميلة مالهاش علاقة بهوية الموقع. الطبقة اللي
     * فوقها بلون المعهد بتخلي النقشة تبان من ورا اللون بدل ما
     * تحل محله — الشريط يفضل أخضر سعودي، بس بسطح مش مسطّح.
     *
     * التدرّج فيه شفافية أكتر ناحية الجنب اللي فيه الكلام أقل،
     * فالنقشة بتبان أوضح بعيد عن العنوان.
     */
    background:
        linear-gradient(to right,
            color-mix(in srgb, var(--site-primary, #006233) 88%, transparent) 0%,
            color-mix(in srgb, var(--site-primary, #006233) 88%, transparent) 30%,
            color-mix(in srgb, var(--site-primary, #006233) 62%, transparent) 100%),
        image-set(
            url('../../images/institutes/art/saudi-bg.webp') type('image/webp'),
            url('../../images/institutes/art/saudi-bg.jpg')  type('image/jpeg'))
        center / cover no-repeat,
        var(--site-primary, #006233);
    color: #fff;
    /* الهيدر ثابت والصفحة بتعوّض ارتفاعه، فالحشو هنا تنفّس بس —
       165 كان بيسيب فراغ أخضر فاضي فوق العنوان. */
    padding: 58px 0 150px;
    clip-path: polygon(0 0, 100% 0, 100% 76%, 0 100%);
    /* relative عشان الصورة تتموضع على الشريط، وoverflow عشان تتقص
       مع القطر بدل ما تخرج من تحته. */
    position: relative;
    overflow: hidden;
}

/* ارتفاع يدّي النقشة مساحة تبان فيها. على الموبايل بيتحدد بالمحتوى. */
@media (min-width: 992px) {
    body.theme-saudi .sa-hero-plate { min-height: 420px; }
}

/* المتصفح اللي مش فاهم color-mix أو image-set بيرمي القاعدة كلها،
   فبيفضل عنده اللون الصافي اللي فوق — وده سلوك مقبول: شريط أخضر
   من غير نقشة، مش شريط بغير لون. */

/* clip-path مالهاش نسخة منطقية زي inset-inline، فالقطر لازم يتعكس
   بإيدينا. من غير كدا البرج بيتنقل شمال في العربي والقطر يفضل
   مكانه، فيقعد عايم فوق حافة الشريط بدل ما يقف عليها. */
body.theme-saudi[dir="rtl"] .sa-hero-plate {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 76%);

    /* والتدرّج كمان: الأخضر التقيل لازم يبقى على الجنب اللي فيه
       الكلام. في العربي الكلام على اليمين، فمن غير القلب دا النقشة
       بتبقى أوضح حاجة تحت العنوان بالظبط. */
    background:
        linear-gradient(to left,
            color-mix(in srgb, var(--site-primary, #006233) 88%, transparent) 0%,
            color-mix(in srgb, var(--site-primary, #006233) 88%, transparent) 30%,
            color-mix(in srgb, var(--site-primary, #006233) 62%, transparent) 100%),
        image-set(
            url('../../images/institutes/art/saudi-bg.webp') type('image/webp'),
            url('../../images/institutes/art/saudi-bg.jpg')  type('image/jpeg'))
        center / cover no-repeat,
        var(--site-primary, #006233);
}

body.theme-saudi .sa-hero-plate .container { position: relative; z-index: 1; }

body.theme-saudi .sa-hero-plate h1 {
    font-size: 3rem; line-height: 1.15; font-weight: 800; color: #fff;
    margin: 0 0 14px; max-width: 22ch;
}
body.theme-saudi .sa-hero-plate p { font-size: 1.1rem; opacity: .92; margin: 0; max-width: 56ch; }

/* --- بطاقة البحث المتداخلة مع الحافة --- */
body.theme-saudi .sa-hero-card {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 22px 50px rgba(16, 38, 26, .18);
    padding: 26px;
    margin-top: -70px;
    position: relative;
    z-index: 2;
}

body.theme-saudi .sa-hero-card form { display: flex; gap: 10px; }

body.theme-saudi .sa-hero-card input {
    flex: 1; min-width: 0; border: 2px solid var(--sa-line);
    padding: 14px 18px; font-size: 1rem;
}
body.theme-saudi .sa-hero-card input:focus {
    outline: none; border-color: var(--site-primary, #006233);
}

body.theme-saudi .sa-hero-card button {
    border: 0; background: var(--site-primary, #006233); color: #fff;
    padding: 0 26px; border-radius: 12px; font-size: 1.1rem;
}
body.theme-saudi .sa-hero-card button:hover { background: var(--site-accent, #f7c608); color: var(--sa-ink); }

body.theme-saudi .sa-hero-card-foot {
    display: flex; justify-content: space-between; align-items: center;
    flex-wrap: wrap; gap: 12px; margin-top: 16px; font-size: .92rem;
}

body.theme-saudi .sa-hero-card-foot > a { color: var(--site-primary, #006233); text-decoration: underline; }

body.theme-saudi .sa-hero-card-actions { display: flex; flex-wrap: wrap; gap: 10px; }

body.theme-saudi .sa-hero-card-actions a {
    background: var(--site-accent, #f7c608); color: var(--sa-ink);
    padding: 9px 18px; border-radius: 999px; font-weight: 700; text-decoration: none;
}
/* _brand.css بيفرض --site-primary على أي رابط عند الوقوف بـ !important،
   وهو نفس الأخضر اللي الزرار بيتملي بيه — فالكلام كان بيختفي جواه.
   الزرار بيقول حبر وقوفه بالمتغيّر، فالقاعدة الجامعة بتقراه هي نفسها. */
body.theme-saudi .sa-hero-card-actions a:hover {
    background: var(--site-primary, #006233);
    --link-hover-ink: #fff;
}

@media (max-width: 991px) {
    body.theme-saudi .sa-hero-plate { padding: 30px 0 90px; clip-path: polygon(0 0, 100% 0, 100% 88%, 0 100%); }

    body.theme-saudi .sa-hero-plate h1 { font-size: 1.95rem; }
    body.theme-saudi .sa-hero-card { margin-top: -46px; padding: 18px; }
    body.theme-saudi .sa-hero-card form { flex-direction: column; }
    body.theme-saudi .sa-hero-card button { padding: 14px; }
}

/* ── الأقسام ── (.inst-tile* اتشالت: saudi بقى ليه sa-tiles-*
   خاصة بيه — .inst-tiles-grid القديمة مبقتش بتترسم هنا خالص) */
body.theme-saudi .inst-values { background: #fff; }
body.theme-saudi .inst-values-list li { background: #f6faf7; border-radius: 14px; padding: 20px; align-items: center; }
body.theme-saudi .inst-assoc { background: #f6faf7; }
body.theme-saudi .inst-assoc-link { border-radius: 999px; padding: 14px 32px; }

/* ── الصور: مستديرة وناعمة بتدرّج أخضر خفيف ── */
body.theme-saudi .widget-icon,
body.theme-saudi .common-banner-image,
body.theme-saudi .course-image { border-radius: 16px; }
body.theme-saudi .widget-icon::after,
body.theme-saudi .common-banner-image::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(200deg, transparent 55%, rgba(0,98,51,.42));
}
/* ── القائمة: حالة نشطة مستديرة ── */
body.theme-saudi .navbar-nav .nav-link.active { border-radius: 12px !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-saudi .common-banner-icon { order: 2; margin-inline-start: auto; }
body.theme-saudi .common-banner-text { order: 1; }
body.theme-saudi .common-banner-icon { border-radius: 20px; box-shadow: 0 16px 38px rgba(0,0,0,.24); flex-basis: 124px; width: 124px; height: 124px; }
body.theme-saudi .common-banner-text h1 { font-weight: 800; }

/* ── الشريط العلوي: شريحة تواصل مستديرة ثم الروابط ── */
body.theme-saudi .sa-topbar { background: var(--site-primary, #006233); color: #e8f2ec; font-size: .8rem; }
body.theme-saudi .sa-topbar-inner { display: flex; align-items: center; gap: 22px; min-height: 40px; }
body.theme-saudi .sa-topbar-chip {
    display: flex; gap: 16px; background: rgba(255,255,255,.14);
    padding: 5px 16px; border-radius: 999px; font-weight: 600;
}
body.theme-saudi .sa-topbar-links { gap: 20px; margin-inline-start: auto; }
body.theme-saudi .sa-topbar-links li.active a { color: var(--site-accent, #f7c608); }

/* ── الشريط العلوي: اختر مدينتك أولاً ── */
body.theme-saudi .sa-topbar { background: var(--site-primary, #006233); color: #dcece3; }
body.theme-saudi .sa-topbar-row { min-height: 46px; font-size: .84rem; }
body.theme-saudi .sa-topbar-picker {
    display: flex; align-items: center;
    background: rgba(255,255,255,.14); padding: 5px; border-radius: 999px;
}
body.theme-saudi .sa-topbar-picker select {
    background: var(--site-accent, #f7c608); color: #10261a; border: 0;
    /* !important لازم: body.theme-saudi select{border-radius:12px!important}
       (سطر 13، تصفير عام لكل select في الموقع) بتغلبها من غيرها —
       فالشريحة الصفراء كانت بزوايا شبه-مربعة (12px) بدل كبسولة كاملة،
       بعكس زرار Online (نفس الشكل المقصود) اللي كان بيطلع كبسولة صح. */
    border-radius: 999px !important;
    padding: 5px 14px; font: inherit; font-weight: 700; cursor: pointer;
}
body.theme-saudi .sa-topbar-mail { font-weight: 600; }
/* رابط "Online" — طلب صريح، بنفس شكل شريحة اختيار المدينة الصفراء. */
body.theme-saudi .sa-topbar-online {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-inline-start: auto;
    background: var(--site-accent, #f7c608);
    color: #10261a !important;
    border-radius: 999px;
    padding: 5px 14px;
    font-weight: 700;
}
body.theme-saudi .sa-topbar-online:hover { filter: brightness(1.08); }

/* طلب صريح: على الموبايل الإيميل يطلع سطر لوحده فوق، والكبسولتين
   (اختيار المدينة وOnline) جنب بعض في سطر تحته — بدل ما يتقسموا
   حسب المساحة الفاضية (كان بيطلع المدينة+الإيميل فوق، وOnline لوحدها
   تحت). order:-1 يقدّم الإيميل بصرياً قبل الاتنين مهما كان ترتيبه في
   الـHTML، وflex-basis:100% يخليه ياخد سطر كامل لوحده فيدفع الكبسولتين
   لسطر جديد يبقوا فيه جنب بعض. */
@media (max-width: 575.98px) {
    body.theme-saudi .sa-topbar-mail {
        order: -1;
        flex-basis: 100%;
        text-align: center;
    }
}

/* ══════════════════════════════════════════════════════════
   القائمة الرئيسية — الروابط داخل حاوية مستديرة
   The links sit inside one rounded container and the active
   one is a filled pill within it.
   ══════════════════════════════════════════════════════════ */
body.theme-saudi nav.navbar { background: #fff; }
body.theme-saudi .navbar-nav {
    background: #f1f6f2; border-radius: 999px; padding: 5px; gap: 2px;
}
body.theme-saudi .navbar-nav > li > .nav-link {
    padding: 7px 15px !important; border-radius: 999px !important;
    font-size: .83rem; font-weight: 600;
}
body.theme-saudi .navbar-nav > li > .nav-link.active {
    background: var(--site-primary, #006233) !important; color: #fff !important;
}

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

/* نفس علة المورد: البند الفعّال على بلوك أخضر غامق وحبر الشريط غامق زيه.
   القاعدة الجامعة فيها ID فبتكسب أي color هنا — فبنعيد تعريف المتغيّر. */
body.theme-saudi #dt-header-section .navbar-nav > li > .nav-link.active {
    --nav-ink: #fff;
}

/* ── لوحة الدورات: كروت بحافة ذهبية ────────────────────────── */
body.theme-saudi .inst-mega { --inst-mega-line: #dfe6e0; }

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

body.theme-saudi .inst-mega-card {
    flex-direction: row;
    border: 1px solid var(--inst-mega-line);
    border-top: 3px solid var(--site-accent, #f7c608);
    border-radius: 0;
    background: #fff;
    padding: 7px 13px;
}

/* حشو اللوحة نفسه من فوق/تحت (26px/22px من _institute.css المشترك)
   اتقلل هنا لـsaudi بس، عشان اللوحة بعدد التخصصات الكبير
   مابقاش محتاج سكرول. */
body.theme-saudi #dt-header-section .megamenu { padding: 14px 0 10px; }

body.theme-saudi .inst-mega-card:hover {
    background: #f4f8f4;
    border-top-color: var(--site-primary, #006233);
}

/* العدد قرص ذهبي مستدير بالكامل. */
body.theme-saudi .inst-mega-n {
    width: 26px; height: 26px;
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0;
    border-radius: 50%;
    background: var(--site-accent, #f7c608);
    color: #3a2f00;
}

/* "عربي"/"اللغة العربية" طالعة أعلى شوية من باقي بنود المنيو —
   فرق ارتفاع حروف الخط العربي عن اللاتيني. نزول بسيط بمقدار ثابت،
   على النص العربي بس (صفحة الإنجليزي، مش "ENGLISH" في صفحة العربي). */
body.theme-saudi:not([dir="rtl"]) .navbar-nav > li > .nav-link.custom-languagenew {
    position: relative;
    top: 5px;
}

/* ═══════════════════════════════════════════════════════════
   التذييل — نفس القطع القطري بتاع البنر، بطاقة عايمة تركب عليه
   ------------------------------------------------------------
   المراجعة الأولى هنا كانت حبّات دائرية (chips) زي smart وplus
   بالظبط — طلب صريح ("كل دول شبة بعض") صحّح كده. saudi.css نفسه
   بيوصف الاتجاه بجملتين: "two stacked planes. The banner ends on
   a diagonal and the search card straddles the cut." نفس القطع
   القطري ده (.sa-hero-plate's clip-path) بالظبط هو اللي بيميّز
   الموقع ده — مش الحبّات المستديرة (لغة smart) ولا الأعمدة
   العادية. هنا بيتكرر في آخر الصفحة: لوح أخضر بقطع قطري، والبطاقة
   البيضا العايمة بتاعة التواصل راكبة على القطع بنفس طريقة البنر
   بالظبط، وتحته قوائم نص عادي (مش حبّات) بلون أبيض/دهبي. */
body.theme-saudi #dt-home-footer-section {
    background: #fff;
    padding-bottom: 0 !important;
    overflow: hidden;
}

body.theme-saudi .sa-footer-card {
    position: relative;
    z-index: 2;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 22px 50px rgba(16, 38, 26, .18);
    padding: 26px 30px;
    margin-bottom: -86px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
}

/* اللوح نفسه: زي .sa-hero-plate بالظبط بس مقلوب — القطع هنا فوق
   (بدل تحت)، فالبطاقة اللي قبله بتوقف على القطر وهي طالعة منه،
   نفس ما بيحصل في البنر مقلوب. */
body.theme-saudi .sa-footer-plate {
    position: relative;
    z-index: 1;
    background:
        linear-gradient(155deg, var(--site-primary, #006233) 0%, #0a3d24 100%);
    padding: 150px 0 50px;
    margin-inline: calc(50% - 50vw);
    padding-inline: calc(50vw - 50%);
    clip-path: polygon(0 26%, 100% 0, 100% 100%, 0 100%);
}
body.theme-saudi[dir="rtl"] .sa-footer-plate {
    clip-path: polygon(0 0, 100% 26%, 100% 100%, 0 100%);
}

body.theme-saudi .sa-footer-card-logo-img { max-width: 150px; height: auto; }

body.theme-saudi .sa-footer-card-contact {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
}
body.theme-saudi .sa-footer-card-contact a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--sa-ink, #10261a);
    font-weight: 700;
    text-decoration: none;
}
body.theme-saudi .sa-footer-card-contact a i { color: var(--site-primary, #006233); font-size: 1.05rem; }
body.theme-saudi .sa-footer-card-contact a:hover { color: var(--site-primary, #006233); }

body.theme-saudi .sa-footer-groups {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 34px;
}
body.theme-saudi .sa-footer-label {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 700;
    color: var(--site-accent, #f7c608);
    margin: 0 0 16px;
}

body.theme-saudi .sa-footer-list { list-style: none; margin: 0; padding: 0; }
body.theme-saudi .sa-footer-list li { border-top: 1px solid rgba(255, 255, 255, .16); }
body.theme-saudi .sa-footer-list li:first-child { border-top: 0; }
body.theme-saudi .sa-footer-list a {
    display: block;
    padding: 10px 0;
    color: rgba(255, 255, 255, .9);
    font-size: .92rem;
    text-decoration: none;
    transition: padding-inline-start .16s ease, color .16s ease;
}
body.theme-saudi .sa-footer-list a:hover {
    color: var(--site-accent, #f7c608);
    padding-inline-start: 8px;
}

@media (max-width: 767px) {
    body.theme-saudi .sa-footer-plate { clip-path: none; padding-top: 46px; }
    body.theme-saudi .sa-footer-card { padding: 20px; justify-content: center; text-align: center; margin-top: 0; }
    body.theme-saudi .sa-footer-card-contact { justify-content: center; }
    body.theme-saudi .sa-footer-groups { grid-template-columns: 1fr; gap: 10px; }
}

/* ═══════════════════════════════════════════════════════════
   المدن المتاحة — نفس القطع القطري، الطبعة التالتة
   ------------------------------------------------------------
   طلب صريح بصورة مرجعية (kcacademyuk.com، "WORLDWIDE VENUES"):
   كارت صورة بقطع قطري في القاع، اسم المدينة تحته بحروف كبيرة،
   ورابط صغير. هنا المرجع والهوية الأصلية لـsaudi نفس الفكرة
   بالظبط — القطع القطري ده مستخدم مرتين فعلاً (.sa-hero-plate،
   .sa-footer-plate)، فبيتكرر هنا تالت مرة على مقاس الكارت، بنفس
   نسبة القطع (76% تقريبًا) مش نسبة مخترعة. */
body.theme-saudi .sa-cities { padding: 64px 0; background: #f6faf7; }

body.theme-saudi .sa-cities-head { margin: 0 0 34px; }
body.theme-saudi .sa-cities-head h2 {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--sa-ink, #10261a);
    margin: 0;
}

body.theme-saudi .sa-cities-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}

body.theme-saudi .sa-cities-card {
    display: block;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 10px 26px rgba(16, 38, 26, .10);
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}
body.theme-saudi .sa-cities-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 38px rgba(16, 38, 26, .18);
}

/* نفس نسبة قطع .sa-hero-plate (100% 76%) بالظبط، بس على مساحة
   صورة الكارت بدل شريط البنر الكامل. */
body.theme-saudi .sa-cities-photo {
    display: block;
    height: 150px;
    background-size: cover;
    background-position: center;
    clip-path: polygon(0 0, 100% 0, 100% 82%, 0 100%);
}
body.theme-saudi[dir="rtl"] .sa-cities-photo {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 82%);
}

body.theme-saudi .sa-cities-name {
    display: block;
    padding: 14px 16px 4px;
    font-size: 1rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
    color: var(--sa-ink, #10261a);
}

body.theme-saudi .sa-cities-link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 16px 16px;
    font-size: .8rem;
    font-weight: 700;
    color: var(--site-primary, #006233);
}
body.theme-saudi .sa-cities-card:hover .sa-cities-link { color: var(--site-accent, #f7c608); }

@media (max-width: 991px) {
    body.theme-saudi .sa-cities-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575px) {
    body.theme-saudi .sa-cities-grid { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------
   الفئات — محاولة تالتة. أول محاولة: شبكة بلاطات نصية بزاوية
   مقصوصة صغيرة. تانية: عمود ألواح full-width بلون صلب وقطع قطري.
   الاتنين "مش عجبتوش". طلب صريح تالت: صور حقيقية، ومنوّعة، مش
   نفس المعاملة بالظبط في كل كارت — site_category_photo() بترجع
   صورة حقيقية مختلفة لكل تصنيف (مش أيقونة، ومش نفس الصورة
   مكررة). هنا شبكة كروت: صورة فوق مقطوعة بنفس نسبة القطع
   المستخدمة فعلاً في .sa-hero-plate (76%)، تحتها شريط لون صلب
   بيحمل الاسم — أخضر/دهبي بالتبادل، واتجاه القطع بيتبدّل هو
   كمان كل كارت تاني، فمفيش صفين متطابقين. ------------------------------------------------------------ */
body.theme-saudi .sa-categories { padding: 64px 0; background: #f6faf7; }

body.theme-saudi .sa-categories-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 30px;
}
body.theme-saudi .sa-categories-head h2 {
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--sa-ink, #10261a);
    margin: 0;
}
body.theme-saudi .sa-categories-all {
    font-size: .85rem;
    font-weight: 700;
    color: var(--site-primary, #006233);
    text-decoration: underline;
    white-space: nowrap;
}
body.theme-saudi .sa-categories-all:hover { color: var(--site-accent, #f7c608); }

body.theme-saudi .sa-categories-grid {
    display: grid;
    /* كان 3 أعمدة وكل كارت واخد مساحة كبيرة — 4 أعمدة بكارت أصغر. */
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

body.theme-saudi .sa-categories-card {
    display: block;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 10px 26px rgba(16, 38, 26, .10);
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}
body.theme-saudi .sa-categories-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 38px rgba(16, 38, 26, .18);
}

/* نفس نسبة قطع .sa-hero-plate (100% 76%) بالظبط. فردي: القطع
   لحد تحت-يمين. زوجي: معكوس (تحت-شمال) — نفس فكرة التعرّج اللي
   استُخدمت في محاولة الألواح، بس على مقاس الصورة هنا. */
body.theme-saudi .sa-categories-photo {
    display: block;
    height: 120px;
    background: var(--sa-line, #dfe6e1);
    clip-path: polygon(0 0, 100% 0, 100% 76%, 0 100%);
}
body.theme-saudi .sa-categories-photo img {
    display: block; width: 100%; height: 100%; object-fit: cover;
}
body.theme-saudi .sa-categories-card:nth-child(even) .sa-categories-photo {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 76%);
}
body.theme-saudi[dir="rtl"] .sa-categories-card:nth-child(odd) .sa-categories-photo {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 76%);
}
body.theme-saudi[dir="rtl"] .sa-categories-card:nth-child(even) .sa-categories-photo {
    clip-path: polygon(0 0, 100% 0, 100% 76%, 0 100%);
}

/* لو مفيش صورة حقيقية للتصنيف ده (site_category_photo() رجّعت
   فاضي)، الأيقونة بتتحط بدل الصورة على خلفية فاتحة بدل ما تتقص
   زي الصورة — الأيقونة صغيرة والقطع كان هيقصّها. */
body.theme-saudi .sa-categories-photo--icon {
    clip-path: none;
    display: flex; align-items: center; justify-content: center;
    background: #eef3ef;
}
body.theme-saudi .sa-categories-photo--icon img { width: 46px; height: 46px; object-fit: contain; }

/* الشريط: فردي أخضر بكتابة بيضا، زوجي دهبي بكتابة كحلية — نفس
   لوني الهوية بالتبادل، بدل ما كل الكروت تبقى بنفس اللون. */
body.theme-saudi .sa-categories-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 11px 14px;
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
}
body.theme-saudi .sa-categories-card:nth-child(odd) .sa-categories-strip {
    background: var(--site-primary, #006233);
    color: #fff;
}
body.theme-saudi .sa-categories-card:nth-child(even) .sa-categories-strip {
    background: var(--site-accent, #f7c608);
    color: var(--sa-ink, #10261a);
}

body.theme-saudi .sa-categories-go { flex: none; font-size: 1.2rem; line-height: 1; opacity: .85; }

@media (max-width: 991px) {
    body.theme-saudi .sa-categories-grid { grid-template-columns: repeat(2, 1fr); }
}
/* ── قسم الكروت الخدمية. مفيش قطع قطري تالت — الشكل هنا لوحة
   خضراء صلبة برواز 12px (نفس تدوير الأزرار/الحقول العام في
   الموقع)، بدل تكرار البنر/الكروت. عمود نص جنب اللوحة، مش فوقها. */
body.theme-saudi .sa-tiles { padding: 56px 0; }
body.theme-saudi .sa-tiles-grid {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 44px;
    align-items: center;
}
body.theme-saudi .sa-tiles-copy h2 {
    font-size: 1.7rem;
    font-weight: 800;
    color: var(--sa-ink, #10261a);
    margin: 0 0 14px;
}
body.theme-saudi .sa-tiles-copy p {
    color: #4d5c53;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
    max-width: 42ch;
}

body.theme-saudi .sa-tiles-panel {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    background: var(--site-primary, #006233);
    border-radius: 20px;
    padding: 18px;
}
body.theme-saudi .sa-tiles-chip {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border-radius: 12px;
    padding: 16px 14px;
    text-decoration: none;
    transition: transform .16s ease, box-shadow .16s ease;
}
body.theme-saudi .sa-tiles-chip:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(0,0,0,.14); }

body.theme-saudi .sa-tiles-icon { width: 34px; height: 34px; object-fit: contain; flex: none; }
/* التاني والتالت ملهومش ملف أيقونة خاص بـ saudi (زي almawred بس) —
   جلايف Bootstrap Icons بنفس مقاس ولون أيقونات الـ svg التانية. */
body.theme-saudi .sa-tiles-icon--glyph {
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem; color: var(--site-primary, #006233); line-height: 1;
}
body.theme-saudi .sa-tiles-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
body.theme-saudi .sa-tiles-label { font-weight: 800; font-size: .92rem; color: var(--sa-ink, #10261a); }
body.theme-saudi .sa-tiles-more {
    font-size: .74rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .04em; color: var(--site-primary, #006233);
}

@media (max-width: 767px) {
    body.theme-saudi .sa-tiles-grid { grid-template-columns: 1fr; gap: 28px; }
    body.theme-saudi .sa-tiles-panel { grid-template-columns: 1fr; }
}

@media (max-width: 575px) {
    body.theme-saudi .sa-categories-grid { grid-template-columns: 1fr; }
    body.theme-saudi .sa-categories-head { flex-direction: column; align-items: flex-start; gap: 6px; }
}

/* ═══ التخصصات: كروت أصغر (طلب صريح 2026-09-05: "صغّر كروت الأقسام") ═══
   نفس الكارت ونفس القطع المائل، بس 6 أعمدة بدل 4، صورة أقصر، وحشو وخط أصغر. */
body.theme-saudi .sa-categories-grid { grid-template-columns: repeat(6, 1fr); gap: 12px; }
body.theme-saudi .sa-categories-card { border-radius: 10px; box-shadow: 0 6px 16px rgba(16, 38, 26, .08); }
body.theme-saudi .sa-categories-photo { height: 84px; }
body.theme-saudi .sa-categories-photo--icon img { width: 34px; height: 34px; }
body.theme-saudi .sa-categories-strip { padding: 8px 10px; font-size: .72rem; line-height: 1.25; gap: 6px; letter-spacing: 0; }
body.theme-saudi .sa-categories-go { font-size: 1rem; }
@media (max-width: 991px) { body.theme-saudi .sa-categories-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575px) { body.theme-saudi .sa-categories-grid { grid-template-columns: repeat(2, 1fr); } }

/* الشريط الملوّن يوصل لآخر الكارت: الكارت عمود flex والشريط بياخد الباقي، فالأخضر/الأصفر بيملى المساحة تحت العنوان مهما كان طوله. */
body.theme-saudi .sa-categories-card { display: flex; flex-direction: column; }
body.theme-saudi .sa-categories-photo { flex: 0 0 auto; }
body.theme-saudi .sa-categories-strip { flex: 1 1 auto; align-items: center; }

/* طلب صريح (2026-09-05، السعودي بس): خط الشريط أصغر ومش بولد. */
body.theme-saudi .sa-categories-strip { font-size: .68rem; font-weight: 400; letter-spacing: .01em; text-transform: uppercase; }

/* ═══ الدورات القادمة — السعودي: كروت أجندة (طلب صريح 2026-09-05) ═══
   3 كروت في الصف، شريط أصفر فوق كل كارت فيه مدى التاريخ، العنوان غامق،
   شرائح معلومات بإطار أخضر (المدينة، الأيام، اللغة)، وزر أخضر. عند التحويم
   ظل أخضر والشريط بيبقى أخضر. */
body.theme-saudi .inst-upcoming-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
body.theme-saudi .inst-upcoming-list li { border: 0 !important; }
body.theme-saudi .inst-upcoming-list a { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 8px 22px rgba(16,38,26,.08); height: 100%; transition: box-shadow .18s, transform .18s; }
body.theme-saudi .inst-upcoming-list a:hover { background: #fff; transform: translateY(-3px); box-shadow: 0 16px 32px rgba(0,98,51,.18); }
body.theme-saudi .inst-upcoming-date { width: 100%; height: auto; flex-direction: row; justify-content: flex-start; gap: 8px; padding: 10px 16px; background: var(--site-accent, #f7c608); color: var(--sa-ink, #10261a); align-items: baseline; transition: background .18s, color .18s; }
body.theme-saudi .inst-upcoming-list a:hover .inst-upcoming-date { background: var(--site-primary, #006233); color: #fff; }
body.theme-saudi .inst-upcoming-day { font-size: 1.4rem; }
body.theme-saudi .inst-upcoming-month { font-size: .8rem; opacity: 1; font-weight: 700; }
body.theme-saudi .inst-upcoming-body { padding: 16px 16px 18px; gap: 10px; }
body.theme-saudi .inst-upcoming-title { color: var(--sa-ink, #10261a); min-height: 2.8em; }
body.theme-saudi .inst-upcoming-meta { flex-wrap: wrap; white-space: normal; }
body.theme-saudi .inst-upcoming-meta2 { display: flex; flex-wrap: wrap; gap: 8px; }
body.theme-saudi .inst-upcoming-meta2 span { font-size: .74rem; padding: 4px 10px; border: 1px solid var(--site-primary, #006233); color: var(--site-primary, #006233); border-radius: 999px; }
body.theme-saudi .inst-upcoming-meta2 i { margin-inline-end: 4px; }
body.theme-saudi .inst-upcoming-book { display: inline-block; align-self: flex-start; margin-top: 4px; padding: 8px 18px; border-radius: 6px; background: var(--site-primary, #006233); color: #fff; font-size: .8rem; font-weight: 700; }
@media (max-width: 991px) { body.theme-saudi .inst-upcoming-list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { body.theme-saudi .inst-upcoming-list { grid-template-columns: 1fr; } }

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

/* أيقونات بيانات الكارت الخاصة بالمعهد (طلب 2026-09-07): calendar-date / chat-dots / display / map-fill / door-open-fill */
body.theme-saudi.pg-training-courses .course-date .bi-calendar-check-fill::before{content:"\f1e4"}
body.theme-saudi.pg-training-courses .course-language .bi-flag-fill::before{content:"\f24a"}
body.theme-saudi.pg-training-courses .course-language .bi-bookmarks-fill::before{content:"\f302"}
body.theme-saudi.pg-training-courses .course-location .bi-signpost-split-fill::before{content:"\f47e"}
body.theme-saudi.pg-training-courses .course-time .bi-signpost-split-fill::before{content:"\f307"}

/* --- training-courses fix dd74a301eaf1f6f0e5286bf2ea40f7be --- */

/* أيقونات بيانات الكارت الخاصة بالمعهد (طلب 2026-09-07): calendar-date / chat-dots / display / map-fill / door-open-fill */
body.theme-saudi.pg-training-courses .course-date .bi-calendar-check-fill::before{content:"\f1e4"}
body.theme-saudi.pg-training-courses .course-language .bi-flag-fill::before{content:"\f24a"}
body.theme-saudi.pg-training-courses .course-language .bi-bookmarks-fill::before{content:"\f302"}
body.theme-saudi.pg-training-courses .course-location .bi-signpost-split-fill::before{content:"\f47e"}
body.theme-saudi.pg-training-courses .course-time .bi-signpost-split-fill::before{content:"\f307"}

/* --- training-courses fix 2cb02d36b856b26fc80dec3e43890d66 --- */
/* ===== /training-courses — السعودي (مرجع anderson.ae — إعادة 2026-09-07): صفحة رمادية فاتحة، فلتر جانبي أبيض بعنوان FILTERS متباعد الحروف وشرطة خضراء وحقول كصفوف أكورديون، كتلة CTA داكنة، صفوف بيضاء بلا حدود بفواصل عمودية والتاريخ عريض وزر تسجيل أخضر مربّع ===== */
body.theme-saudi.pg-training-courses #common-banner-section-image{background:#fff;border-bottom:1px solid #e1e6e3}
body.theme-saudi.pg-training-courses #common-banner-section-image::before{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-section-box{padding:22px 0;align-items:center}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-image,body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text p,body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text .space15,body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text .space5,body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text form{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text{max-width:none}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text h1{color:#10261a;margin:0;font-size:1.5rem;letter-spacing:.12em;text-transform:uppercase;padding-inline-start:26px;position:relative}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text h1::before{content:'';position:absolute;inset-inline-start:0;top:50%;width:16px;height:3px;background:#006233}
body.theme-saudi.pg-training-courses .inst-tc{background:#f3f5f4}
body.theme-saudi.pg-training-courses .inst-tc-side{background:#fff;box-shadow:0 1px 3px rgba(16,38,26,.06)}
body.theme-saudi.pg-training-courses .inst-tc-side-head{padding:16px;border-bottom:0}
body.theme-saudi.pg-training-courses .inst-tc-side-title{text-transform:uppercase;letter-spacing:.22em;font-size:.76rem;color:#10261a;padding-inline-start:18px;position:relative}
body.theme-saudi.pg-training-courses .inst-tc-side-title::before{content:'';position:absolute;inset-inline-start:0;top:50%;width:10px;height:2px;background:#006233}
body.theme-saudi.pg-training-courses .inst-tc-side-reset{color:#9aa39e;text-decoration:none;text-transform:uppercase;letter-spacing:.16em;font-size:.64rem}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .box2{padding:0}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one form{gap:0}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .filter-courselist-wrap > .col-md-12{gap:0}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .form-control{border:0;border-top:1px solid #e1e6e3;border-radius:0;height:48px;padding:0 16px;color:#10261a;font-weight:600;font-size:.9rem;background:#fff}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .form-control:focus{box-shadow:none;background:#f3f5f4}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .menu-two.purple-color{background:#006233!important;border:0!important;color:#fff!important;border-radius:0;padding:13px;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:700}
body.theme-saudi.pg-training-courses .inst-tc-cta{margin:0;background:#10261a;color:#fff;border-radius:0;padding:20px 18px}
body.theme-saudi.pg-training-courses .inst-tc-cta-kicker{color:#7fcf9a}
body.theme-saudi.pg-training-courses .inst-tc-cta-text{text-transform:uppercase;letter-spacing:.14em;font-size:.72rem}
body.theme-saudi.pg-training-courses .inst-tc-head{color:#8a938e;font-size:.68rem;letter-spacing:.18em;padding:4px 16px 8px}
body.theme-saudi.pg-training-courses .inst-tc #course_list > .courselisting-col + .courselisting-col{margin-top:8px}
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting,body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting.virtual{background:#fff;border:0;padding:0;gap:0;box-shadow:0 1px 2px rgba(16,38,26,.05);transition:box-shadow .2s}
body.theme-saudi.pg-training-courses .inst-tc .courselisting:hover{box-shadow:0 8px 20px rgba(16,38,26,.1)}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > *{padding:16px 14px;align-self:stretch;display:flex;align-items:center}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-title{display:-webkit-box;padding:16px}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-date,body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-language,body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-location,body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-time{border-inline-start:1px solid #eef0ef}
body.theme-saudi.pg-training-courses .inst-tc .course-title{color:#10261a;font-weight:500}
body.theme-saudi.pg-training-courses .inst-tc .course-date{font-weight:700;color:#10261a}
body.theme-saudi.pg-training-courses .inst-tc .course-language,body.theme-saudi.pg-training-courses .inst-tc .course-location,body.theme-saudi.pg-training-courses .inst-tc .course-time{color:#5a655f}
body.theme-saudi.pg-training-courses .inst-tc .courselisting form{padding:8px}
body.theme-saudi.pg-training-courses .inst-tc .courselisting .btn-primary{background:#006233!important;border-color:#006233!important;color:#fff!important;border-radius:0;text-transform:uppercase;letter-spacing:.1em;font-size:.66rem;padding:10px 6px}
body.theme-saudi.pg-training-courses .inst-tc .courselisting:hover .btn-primary{background:#10261a!important;border-color:#10261a!important}

/* --- training-courses fix fc5ffa00221c84ce4957841ddb9ffb1b --- */
/* قاعدة الخلايا (> *) كانت بتظهر الصورة وفواصل المسافات المخفية */
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-image,body.theme-saudi.pg-training-courses .inst-tc .courselisting > .space5,body.theme-saudi.pg-training-courses .inst-tc .courselisting > .space15{display:none}

/* --- training-courses fix c88ba06dd38699a1e169780771238429 --- */
/* (2026-09-07) "الفلتر لازق في بعضه": الثيم بيفرض على الحقول حدود خضراء مدوّرة، فالحقول بقت متباعدة 10px جوّه اللوحة بدل صفوف ملتصقة */
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .box2{padding:12px 14px 14px}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one form{gap:10px}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .filter-courselist-wrap > .col-md-12{gap:12px}
body.theme-saudi.pg-training-courses .inst-tc #common-filter-box-modal-one .form-control{border-top:0;height:44px}
body.theme-saudi.pg-training-courses .inst-tc-side-head{padding-bottom:6px}

/* --- btn-secondary = btn-primary (2026-09-07) --- */
/* صفحة الأونلاين بنفس تصميم الحضوري: زر الدورات الافتراضية (.btn-secondary) بنفس تنسيق الزر العادي */
body.theme-saudi.pg-training-courses .inst-tc .courselisting .btn-secondary{background:#006233!important;border-color:#006233!important;color:#fff!important;border-radius:0;text-transform:uppercase;letter-spacing:.1em;font-size:.66rem;padding:10px 6px}
body.theme-saudi.pg-training-courses .inst-tc .courselisting:hover .btn-secondary{background:#10261a!important;border-color:#10261a!important}

/* --- training-courses fix 6c6c6cee3f3831e6376b486818078c38 --- */
/* بانر الأونلاين نصه في .common-banner (مش .common-banner-text) فكان أبيض على أبيض */
body.theme-saudi.pg-training-courses.page-online #common-banner-section-image .common-banner h1{color:#10261a;font-size:1.5rem;letter-spacing:.12em;text-transform:uppercase;padding-inline-start:26px;position:relative;margin:0 0 10px}
body.theme-saudi.pg-training-courses.page-online #common-banner-section-image .common-banner h1::before{content:'';position:absolute;inset-inline-start:0;top:50%;width:16px;height:3px;background:#006233}
body.theme-saudi.pg-training-courses.page-online #common-banner-section-image .common-banner p{color:#4a5a50}

/* --- training-courses fix 9dbd4983b35b4c786fdb7b51c35e1929 --- */
/* (2026-09-07) زر REGISTER NOW كان بيتقص في عمود الجدول (nowrap + تباعد حروف) → يتلف على سطرين لو ضاق وبتباعد أقل */
body.theme-saudi.pg-training-courses .inst-tc .courselisting .btn-primary,body.theme-saudi.pg-training-courses .inst-tc .courselisting .btn-secondary{white-space:normal!important;letter-spacing:.04em!important;padding:8px 6px!important;line-height:1.25!important;width:100%}

/* --- training-courses fix 3ba075c85bafd72c34deca6291e6fec0 --- */
/* (2026-09-07) "انت غيرت الصفحة": بانر السعودي رجع بالوصف وزر طلب الدورة الداخلية زي باقي المواقع (كانوا مخفيين في تصميم anderson) */
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text p,body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text .space15,body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text .space5,body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text form{display:block}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text p{color:#4a5a50;font-size:.9rem;margin:10px 0 0}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text form{margin-top:12px}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-section-box{padding:26px 0 22px}

/* --- training-courses fix 0829e3ad4eaa0fcad7987f8b75ccd750 --- */
/* (2026-09-07) طلب: تصميم مختلف لبانر السعودي + نص الزر يبان عند المرور (كان أصفر على أصفر من _brand) */
body.theme-saudi.pg-training-courses #common-banner-section-image{background:#006233 repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 14px,transparent 14px 28px);border-bottom:6px solid #f7c608}
body.theme-saudi.pg-training-courses #common-banner-section-image::before{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-section-box{padding:36px 0 32px}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text{max-width:900px}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text h1,body.theme-saudi.pg-training-courses.page-online #common-banner-section-image .common-banner h1{color:#fff;font-size:2rem;letter-spacing:0;text-transform:none;padding:0 0 12px;margin:0 0 14px;position:relative;border:0;display:block}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text h1::before,body.theme-saudi.pg-training-courses.page-online #common-banner-section-image .common-banner h1::before{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text h1::after,body.theme-saudi.pg-training-courses.page-online #common-banner-section-image .common-banner h1::after{content:'';position:absolute;inset-inline-start:0;bottom:0;width:64px;height:4px;background:#f7c608;border-radius:2px}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text p,body.theme-saudi.pg-training-courses.page-online #common-banner-section-image .common-banner p{color:#e6f1ea;font-size:.92rem;line-height:1.7;margin:0}
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text form{margin-top:16px}
body.theme-saudi.pg-training-courses #searresultscourses-btn2{background:#f7c608!important;border:1px solid #f7c608!important;color:#10261a!important;border-radius:30px;padding:9px 24px;font-weight:600!important;box-shadow:0 6px 16px rgba(0,0,0,.18);transition:background .2s,color .2s}
body.theme-saudi.pg-training-courses #searresultscourses-btn2:hover,body.theme-saudi.pg-training-courses #searresultscourses-btn2:focus{background:#10261a!important;border-color:#10261a!important;color:#fff!important}

/* --- training-courses fix 74eb91c414cbfe347a44eff3abc27912 --- */
/* (2026-09-07) عناوين الأعمدة فوق خاناتها بالظبط: صف العناوين ياخد نفس فراغات الصفوف (بدون gap وبنفس الحشو الداخلي للخلايا) */
body.theme-saudi.pg-training-courses .inst-tc-head{gap:0;padding:0 0 6px}
body.theme-saudi.pg-training-courses .inst-tc-head span{padding:4px 14px}
body.theme-saudi.pg-training-courses .inst-tc-head .inst-tc-h-title{padding:4px 16px}

/* --- training-courses fix efa53ed641eb2869311b1ab33b3de247 --- */
/* ===== الدورات الداخلية — السعودي: خط زمني رأسي أخضر بدوائر، المزايا في لوح أخضر بعلامات صفراء، زر أصفر (2026-09-07) ===== */
body.theme-saudi .inst-ih{background:#f3f5f4}
body.theme-saudi .inst-ih-steps{background:transparent;border:0;box-shadow:none;padding:0 0 0 8px}
body.theme-saudi .inst-ih-h{text-transform:uppercase;letter-spacing:.14em;font-size:1rem;color:#10261a;padding-inline-start:22px;padding-bottom:0}
body.theme-saudi .inst-ih-h::after{width:14px;height:3px;top:50%;bottom:auto;background:#006233;transform:translateY(-50%)}
body.theme-saudi .inst-ih-list{position:relative;gap:26px;margin-top:8px}
body.theme-saudi .inst-ih-list::before{content:'';position:absolute;top:8px;bottom:8px;inset-inline-start:20px;width:2px;background:#dfe6e1}
body.theme-saudi .inst-ih-num{background:#006233;width:42px;height:42px;position:relative;z-index:1;box-shadow:0 0 0 6px #f3f5f4}
body.theme-saudi .inst-ih-benefits{background:#006233;color:#fff;border:0;border-radius:6px;border-bottom:6px solid #f7c608}
body.theme-saudi .inst-ih-benefits .inst-ih-h{color:#fff;padding-inline-start:0}
body.theme-saudi .inst-ih-benefits .inst-ih-h::after{display:none}
body.theme-saudi .inst-ih-checks li{color:#fff}
body.theme-saudi .inst-ih-checks li .bi{color:#f7c608}
body.theme-saudi .inst-ih-cta{background:#f7c608!important;border-color:#f7c608!important;color:#10261a!important;border-radius:4px;text-transform:uppercase;letter-spacing:.08em;font-size:.82rem}

/* --- training-courses fix 5b9393fbc92089bba92eca3ea2f5f703 --- */
/* لمسة فنية: السعودي — دوائر الخط الزمني بحلقة صفراء عند المرور، اللوح الأخضر بنقشة مائلة خفيفة وظل، زر بظل أصفر */
body.theme-saudi .inst-ih-num{transition:box-shadow .25s}
body.theme-saudi .inst-ih-list li:hover .inst-ih-num{box-shadow:0 0 0 6px #f3f5f4,0 0 0 9px #f7c608}
body.theme-saudi .inst-ih-benefits{background:#006233 repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 14px,transparent 14px 28px);box-shadow:0 14px 34px rgba(0,98,51,.25)}
body.theme-saudi .inst-ih-checks li{transition:transform .2s}
body.theme-saudi .inst-ih-checks li:hover{transform:translateX(6px)}
body[dir="rtl"].theme-saudi .inst-ih-checks li:hover{transform:translateX(-6px)}
body.theme-saudi .inst-ih-cta{box-shadow:0 8px 20px rgba(247,198,8,.4)}

/* --- banner-icon = banner-image (2026-09-07) --- */
/* صفحة التخصص بانرها #common-banner-section-icon بنفس بنية بانر الصورة → نفس تصميم بانر الثيم */
body.theme-saudi.pg-training-courses #common-banner-section-icon{background:#fff;border-bottom:1px solid #e1e6e3}
body.theme-saudi.pg-training-courses #common-banner-section-icon::before{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-section-box{padding:22px 0;align-items:center}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-image,body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text p,body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text .space15,body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text .space5,body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text form{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text{max-width:none}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text h1{color:#10261a;margin:0;font-size:1.5rem;letter-spacing:.12em;text-transform:uppercase;padding-inline-start:26px;position:relative}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text h1::before{content:'';position:absolute;inset-inline-start:0;top:50%;width:16px;height:3px;background:#006233}
body.theme-saudi.pg-training-courses.page-online #common-banner-section-icon .common-banner h1{color:#10261a;font-size:1.5rem;letter-spacing:.12em;text-transform:uppercase;padding-inline-start:26px;position:relative;margin:0 0 10px}
body.theme-saudi.pg-training-courses.page-online #common-banner-section-icon .common-banner h1::before{content:'';position:absolute;inset-inline-start:0;top:50%;width:16px;height:3px;background:#006233}
body.theme-saudi.pg-training-courses.page-online #common-banner-section-icon .common-banner p{color:#4a5a50}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text p,body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text .space15,body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text .space5,body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text form{display:block}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text p{color:#4a5a50;font-size:.9rem;margin:10px 0 0}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text form{margin-top:12px}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-section-box{padding:26px 0 22px}
body.theme-saudi.pg-training-courses #common-banner-section-icon{background:#006233 repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 14px,transparent 14px 28px);border-bottom:6px solid #f7c608}
body.theme-saudi.pg-training-courses #common-banner-section-icon::before{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-section-box{padding:36px 0 32px}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text{max-width:900px}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text h1,body.theme-saudi.pg-training-courses.page-online #common-banner-section-icon .common-banner h1{color:#fff;font-size:2rem;letter-spacing:0;text-transform:none;padding:0 0 12px;margin:0 0 14px;position:relative;border:0;display:block}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text h1::before,body.theme-saudi.pg-training-courses.page-online #common-banner-section-icon .common-banner h1::before{display:none}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text h1::after,body.theme-saudi.pg-training-courses.page-online #common-banner-section-icon .common-banner h1::after{content:'';position:absolute;inset-inline-start:0;bottom:0;width:64px;height:4px;background:#f7c608;border-radius:2px}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text p,body.theme-saudi.pg-training-courses.page-online #common-banner-section-icon .common-banner p{color:#e6f1ea;font-size:.92rem;line-height:1.7;margin:0}
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text form{margin-top:16px}

/* --- training-courses fix fcdeb705baffafa39834bd018b64aa60 --- */
/* ===== الصفحات الداخلية — السعودي: صفحة رمادية فاتحة، بطاقات بيضاء بلا حدود بحافة صفراء علوية، عناوين متباعدة الحروف بشرطة خضراء، الأسئلة بلوح أخضر للمفتوح ===== */
body.theme-saudi .inst-about,body.theme-saudi .inst-faq,body.theme-saudi .inst-pub,body.theme-saudi .inst-clients{background:#f3f5f4}
body.theme-saudi .inst-about-h,body.theme-saudi .inst-faq-h,body.theme-saudi .inst-pub-h,body.theme-saudi .inst-clients-h{text-transform:uppercase;letter-spacing:.14em;font-size:1rem;color:#10261a;padding:0 0 0 22px}
body.theme-saudi .inst-about-h::after,body.theme-saudi .inst-faq-h::after,body.theme-saudi .inst-pub-h::after,body.theme-saudi .inst-clients-h::after{width:14px;height:3px;top:50%;bottom:auto;transform:translateY(-50%);background:#006233}
body.theme-saudi .inst-about-pillar,body.theme-saudi .inst-pub-feat,body.theme-saudi .inst-about-offer,body.theme-saudi .inst-pub-terms,body.theme-saudi .inst-clients-grid li{border:0;border-top:4px solid #f7c608;border-radius:4px;box-shadow:0 1px 3px rgba(16,38,26,.06)}
body.theme-saudi .inst-about-pillar .bi,body.theme-saudi .inst-pub-feat .bi,body.theme-saudi .inst-about-offer > .bi,body.theme-saudi .inst-clients-grid li .bi{color:#006233}
body.theme-saudi .inst-about-pillar h2{color:#006233}
body.theme-saudi .inst-about-offer-arrow{color:#f7c608}
body.theme-saudi .inst-faq-item{border:0;border-radius:4px;box-shadow:0 1px 3px rgba(16,38,26,.06)}
body.theme-saudi .inst-faq-item[open]{background:#006233}
body.theme-saudi .inst-faq-item[open] summary,body.theme-saudi .inst-faq-item[open] .inst-faq-a{color:#fff}
body.theme-saudi .inst-faq-item[open] summary .bi{color:#f7c608}
body.theme-saudi .inst-faq-item summary .bi{color:#006233}

/* --- training-courses fix cdd63ddc363c719e42e8e8dbd1a7d68e --- */
/* ===== السعودي: صفحة رمادية فاتحة، بطاقات بيضاء بلا حدود بحافة صفراء علوية، 6 أعمدة مضغوطة للتخصصات، المدن بصورة وشريط أخضر ===== */
body.theme-saudi.pg-training-courses #categorymain-listing-section,body.theme-saudi.pg-training-courses #citymain-listing-section,body.theme-saudi.pg-training-courses #common-listing-section{background:#f3f5f4;padding:26px 0}
body.theme-saudi.pg-training-courses #categorymain-listing-section .row.text-left{grid-template-columns:repeat(6,1fr);gap:12px}
body.theme-saudi.pg-training-courses .categorymain-listing-wrap-box > .box2{flex-direction:column;align-items:flex-start;gap:10px;padding:14px}
body.theme-saudi.pg-training-courses .categorymain-listing-wrap-box > .box2,body.theme-saudi.pg-training-courses .citymain-listing-wrap-box .box2,body.theme-saudi.pg-training-courses .common-listing-wrap-box > .box2{border:0!important;border-top:4px solid #f7c608!important;border-radius:4px!important;box-shadow:0 1px 3px rgba(16,38,26,.06)!important;transition:transform .2s}
body.theme-saudi.pg-training-courses .categorymain-listing-wrap-box > .box2:hover,body.theme-saudi.pg-training-courses .citymain-listing-wrap-box .box2:hover,body.theme-saudi.pg-training-courses .common-listing-wrap-box > .box2:hover{transform:translateY(-3px)}
body.theme-saudi.pg-training-courses .categorypage-icon{width:44px;height:44px!important;flex-basis:44px}
body.theme-saudi.pg-training-courses .categorypage-content h6{font-size:.82rem}
body.theme-saudi.pg-training-courses .categorypage-content a,body.theme-saudi.pg-training-courses .widget-content a{color:#006233;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;font-weight:600}
body.theme-saudi.pg-training-courses .widget-content h6{color:#006233}
body.theme-saudi.pg-training-courses .common-listing-wrap-box .btn{background:#006233!important;border-color:#006233!important;color:#fff!important;border-radius:0;text-transform:uppercase;letter-spacing:.08em;font-size:.7rem}

/* --- training-courses fix 5f0ad92a1a346ceea7895fd475a94d44 --- */
/* ===== السعودي: صفحة رمادية فاتحة، بطاقات بلا حدود بحافة صفراء علوية، عناوين متباعدة الحروف ===== */
body.theme-saudi .inst-dl,body.theme-saudi.pg-training-courses #common-listing-section.common-listing-section-wrap{background:#f3f5f4}
body.theme-saudi .inst-dl-item,body.theme-saudi .inst-dl-request,body.theme-saudi .inst-contact-card,body.theme-saudi .inst-cra,body.theme-saudi .inst-contact-form .box4{border:0!important;border-top:4px solid #f7c608!important;border-radius:4px!important;box-shadow:0 1px 3px rgba(16,38,26,.06)!important}
body.theme-saudi .inst-dl-h,body.theme-saudi .inst-contact-h{text-transform:uppercase;letter-spacing:.14em;font-size:1rem;color:#10261a;padding:0 0 0 22px}
body.theme-saudi .inst-dl-h::after{width:14px;height:3px;top:50%;bottom:auto;transform:translateY(-50%);background:#006233}
body.theme-saudi .inst-dl-item > .bi,body.theme-saudi .inst-cra-head > .bi{color:#006233}
body.theme-saudi .inst-contact-list li .bi{background:#006233;color:#fff}
body.theme-saudi .inst-dl-arrow,body.theme-saudi .inst-cra-list li .bi{color:#f7c608}

/* --- category lists = course_list (2026-09-07) --- */
/* صفحة التخصص: نفس شبكة/تصميم #course_list على #category_course_list و#category_course_list_by_name */
body.theme-saudi.pg-training-courses .inst-tc #category_course_list > .courselisting-col + .courselisting-col{margin-top:8px}
body.theme-saudi.pg-training-courses .inst-tc #category_course_list_by_name > .courselisting-col + .courselisting-col{margin-top:8px}

/* --- training-courses fix 025acd1e2c25fccd44394e8d8347d3c4 --- */
/* ===== السعودي: صندوق فاتح بحدود خضراء وحافة صفراء علوية، زر أخضر مربّع ===== */
body.theme-saudi.pg-training-courses #fc-search .search-wrap{background:#f6faf7;border:1px solid #dfe6e1;border-top:4px solid #f7c608;border-radius:4px;box-shadow:none}
body.theme-saudi.pg-training-courses #fc-search .form-control,body.theme-saudi.pg-training-courses #fc-search .chosen-choices,body.theme-saudi.pg-training-courses #fc-search select{border:1px solid #006233!important;border-radius:4px!important;background:#fff!important}
body.theme-saudi.pg-training-courses #fc-search .search-btns{background:#006233!important;border-color:#006233!important;color:#fff!important;border-radius:4px}

/* --- finder results = course_list (2026-09-07) --- */
body.theme-saudi.pg-training-courses .inst-tc #coursefinder_list_courses > .courselisting-col + .courselisting-col{margin-top:8px}

/* --- training-courses fix 4b8c22c14f8b946d90ebc15e2347b330 --- */
/* ===== السعودي: شبكة مضغوطة 6 أعمدة، بطاقات بحافة صفراء ونص في المنتصف ===== */
body.theme-saudi.pg-training-courses .categorymain-listing-wrap-box > .box2{flex-direction:column;align-items:center;text-align:center;padding:18px 12px;gap:8px}
body.theme-saudi.pg-training-courses .categorypage-content{text-align:center}
body.theme-saudi.pg-training-courses .categorymain-listing-wrap-box > .box2::before{content:counter(instcat,decimal-leading-zero);counter-increment:instcat;font-size:.72rem;letter-spacing:.2em;color:#006233;font-weight:700}

/* --- training-courses fix 461be5042402ece7e0b444d57a5fe0cd --- */
/* ===== السعودي: رؤوس خضراء بحافة صفراء وعناوين متباعدة الحروف، حقول مربّعة بحد أخضر ===== */
body.theme-saudi.pg-training-courses #register-section .tabHead{background:#006233;border-bottom:4px solid #f7c608;border-radius:4px 4px 0 0;text-transform:uppercase;letter-spacing:.1em;font-size:.9rem}
body.theme-saudi.pg-training-courses #register-section .tabContent{border:1px solid #dfe6e1;border-radius:0 0 4px 4px;background:#fff}
body.theme-saudi.pg-training-courses #register-section .form-control{border:1px solid #006233;border-radius:4px}
body.theme-saudi.pg-training-courses .inst-form-side-card{border:0;border-top:4px solid #f7c608;border-radius:4px;box-shadow:0 1px 3px rgba(16,38,26,.06)}
body.theme-saudi.pg-training-courses .inst-form-side-list li .bi{background:#006233;color:#fff}

/* --- training-courses fix 156787b55ffdfffc283502eea8819637 --- */
body.theme-saudi.pg-training-courses #register-section .tabHead{background:#006233!important;border-bottom:4px solid #f7c608!important;border-radius:4px 4px 0 0!important;text-transform:uppercase!important;letter-spacing:.1em!important;font-size:.9rem!important}

/* --- training-courses fix 2cc62fc6c2a94ce99814814ef3493b6a --- */
body.theme-saudi.pg-training-courses #register-section .tabContent{border:1px solid #dfe6e1!important;border-radius:0 0 4px 4px!important;background:#fff!important}

/* --- training-courses fix 8448f5db342761f19c9f59287b8470fe --- */
/* ===== السعودي: صفحة رمادية فاتحة، بطاقة بحافة صفراء علوية وعنوان متباعد الحروف بشرطة خضراء ===== */
body.theme-saudi.pg-post-page{background:#f3f5f4}
body.theme-saudi.pg-post-page .blog-webinar-articles-details-left .box,body.theme-saudi.pg-post-page .blog-webinar-articles-details-right .box2{border:0;border-top:4px solid #f7c608;border-radius:4px;box-shadow:0 1px 3px rgba(16,38,26,.06)}
body.theme-saudi.pg-post-page .blog-webinar-articles-details-left .box h1{font-size:1.4rem;letter-spacing:.06em;text-transform:uppercase;color:#10261a}
body.theme-saudi.pg-post-page .custom-related-head{text-transform:uppercase;letter-spacing:.14em;font-size:.85rem;color:#006233}

/* --- training-courses fix 965a2bd47581de38faacd11f7e751512 --- */
/* ===== السعودي: تبويبات متباعدة الحروف بحافة صفراء للنشط، محتوى بحافة صفراء علوية ===== */
body.theme-saudi.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link{border-radius:4px 4px 0 0;background:#f3f5f4;color:#10261a;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem}
body.theme-saudi.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link.active{background:#006233;color:#fff;box-shadow:inset 0 -4px 0 #f7c608}
body.theme-saudi.pg-training-courses #coursedetails-content-section .tab-content{border-radius:0 4px 4px 4px;border-top:4px solid #f7c608}
body.theme-saudi.pg-training-courses .session-card{border-radius:4px!important;border-top:4px solid #f7c608!important}

/* --- training-courses fix e308ae8d9e5591ef07ca919dee176665 --- */
body.theme-saudi.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link{border-radius:4px 4px 0 0!important;background:#f3f5f4!important;color:#10261a!important;text-transform:uppercase!important;letter-spacing:.08em!important;font-size:.78rem!important}

/* --- training-courses fix 2bd2b487173c9df1d32c145c8acb43f2 --- */
body.theme-saudi.pg-training-courses #coursedetails-content-section .nav-tabs .nav-link.active{background:#006233!important;color:#fff!important;box-shadow:inset 0 -4px 0 #f7c608!important}

/* --- training-courses fix 72b691bd4f80157ee8a9f7c304173d40 --- */
html.theme-saudi{background:#006233}

/* ============================================================
   (2026-09-08) السعودي — تفاصيل الدورة: أكورديون بدل التبويبات
   ------------------------------------------------------------
   الفكرة: الصفحة بقت عمود واحد من صفوف مطويّة، الصف المفتوح
   أخضر بخط ذهبي تحته، والزوايا كلها قايمة. العناوين حروفها
   متباعدة وكابيتال — بس في العربي بنلغي التباعد عشان الحروف
   العربية موصولة والتباعد بيكسّر الكلمة.
   ============================================================ */

/* شريط التواصل بقى شريحة كاملة العرض فوق الأكورديون بدل ما يكون
   عايم جنب التبويبات (التبويبات نفسها اختفت). */
body.theme-saudi.pg-training-courses .sa-acc-wrap .inst-cra--desktop{
    max-width:none;width:100%;margin:0 0 18px;border-radius:0!important;
    border:1px solid #dfe6e1!important;border-top:3px solid #f7c608!important;
    box-shadow:none!important;padding:14px 20px
}
body.theme-saudi.pg-training-courses .sa-acc-wrap .inst-cra-list{margin-inline-start:auto}

/* ---- هيكل الأكورديون ---- */
body.theme-saudi.pg-training-courses .sa-acc{width:100%;border-top:1px solid #dfe6e1}
body.theme-saudi.pg-training-courses .sa-acc-item{
    display:block;background:#fff;border:1px solid #dfe6e1;border-top:0;border-radius:0
}
body.theme-saudi.pg-training-courses .sa-acc-head{
    display:flex;align-items:center;gap:14px;padding:15px 20px;cursor:pointer;
    background:#f4f7f5;color:#10261a;
    -webkit-user-select:none;user-select:none;
    border-bottom:3px solid transparent;
    transition:background .18s ease,color .18s ease
}
body.theme-saudi.pg-training-courses .sa-acc-head:hover{background:#e9efeb}
body.theme-saudi.pg-training-courses .sa-acc-head:focus-visible{outline:2px solid #f7c608;outline-offset:-2px}
body.theme-saudi.pg-training-courses .sa-acc-item.is-open > .sa-acc-head{
    background:#006233;color:#fff;border-bottom-color:#f7c608
}

body.theme-saudi.pg-training-courses .sa-acc-num{
    font-size:.68rem;font-weight:700;letter-spacing:.1em;color:#9aa39e;
    min-width:20px;line-height:1
}
body.theme-saudi.pg-training-courses .sa-acc-item.is-open .sa-acc-num{color:#f7c608}

body.theme-saudi.pg-training-courses .sa-acc-ico{
    font-size:1.05rem;line-height:1;color:#006233!important;flex:0 0 auto
}
body.theme-saudi.pg-training-courses .sa-acc-item.is-open .sa-acc-ico{color:#f7c608!important}

body.theme-saudi.pg-training-courses .sa-acc-label{
    flex:1 1 auto;font-weight:700;font-size:.82rem;
    text-transform:uppercase;letter-spacing:.16em;color:inherit
}
body.theme-saudi.pg-training-courses .sa-acc-chev{
    font-size:.85rem;line-height:1;color:inherit;flex:0 0 auto;
    transition:transform .25s ease
}
body.theme-saudi.pg-training-courses .sa-acc-item.is-open .sa-acc-chev{transform:rotate(180deg)}

/* الطي: صف grid من 0fr لـ 1fr — بيدّي حركة سلسة من غير حساب ارتفاع. */
body.theme-saudi.pg-training-courses .sa-acc-body{
    display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease
}
body.theme-saudi.pg-training-courses .sa-acc-item.is-open > .sa-acc-body{grid-template-rows:1fr}
body.theme-saudi.pg-training-courses .sa-acc-inner{overflow:hidden;min-height:0}

/* الـ panes جاية من الفيوهات المشتركة بكلاس tab-pane fade — بيتخبّى
   بالـ bootstrap. جوّه الأكورديون بيبقى ظاهر دايمًا والطي فوق هو
   اللي بيتحكّم. الحشو على الـ pane نفسه مش على .sa-acc-inner عشان
   ميفضلش باين وهو مطوي. */
body.theme-saudi.pg-training-courses .sa-acc .tab-pane{
    display:block!important;opacity:1!important;padding:26px 24px 30px
}

/* ---- تنسيق المحتوى جوّه الصف ---- */
body.theme-saudi.pg-training-courses .sa-acc .tab-pane h6,
body.theme-saudi.pg-training-courses .sa-acc .tab-pane h4{
    font-weight:700;font-size:.82rem;color:#10261a;
    text-transform:uppercase;letter-spacing:.13em;
    margin:0 0 12px;padding-inline-start:16px;position:relative
}
body.theme-saudi.pg-training-courses .sa-acc .tab-pane h6::before,
body.theme-saudi.pg-training-courses .sa-acc .tab-pane h4::before{
    content:'';position:absolute;inset-inline-start:0;top:.42em;
    width:8px;height:2px;background:#f7c608
}
body.theme-saudi.pg-training-courses .sa-acc .tab-pane p{color:#3d4a42;line-height:1.75}
body.theme-saudi.pg-training-courses .sa-acc .tab-pane ul li{line-height:1.8;color:#3d4a42}
body.theme-saudi.pg-training-courses .sa-acc .tab-pane .col-md-12 + .col-md-12{
    border-top:1px solid #eef1ef;padding-top:22px
}
body.theme-saudi.pg-training-courses .sa-acc .ouline-area ul{padding-inline-start:18px}

/* الجدول والرسوم: كروت قايمة الزوايا بشريط أخضر علوي. */
body.theme-saudi.pg-training-courses .sa-acc .year-heading{
    font-size:.8rem;font-weight:700;color:#006233;
    text-transform:uppercase;letter-spacing:.14em
}
body.theme-saudi.pg-training-courses .sa-acc .session-card{
    border-radius:0!important;border:1px solid #dfe6e1!important;
    border-top:3px solid #006233!important;box-shadow:none!important
}
body.theme-saudi.pg-training-courses .sa-acc .price-tag{
    border-radius:0!important;background:#f4f7f5!important;border:1px solid #dfe6e1!important
}
body.theme-saudi.pg-training-courses .sa-acc .feestoggle-select{border-radius:0!important}
body.theme-saudi.pg-training-courses .sa-acc .alert{border-radius:0}
body.theme-saudi.pg-training-courses .sa-acc .courselisting-normal{border-radius:0!important}

/* أزرار الصفحة: نفس الزوايا القايمة عشان الصفحة تبان قطعة واحدة. */
body.theme-saudi.pg-training-courses #coursedetails-buttons-section .box2{
    border-radius:0!important;border:1px solid #dfe6e1!important;
    border-top:3px solid #f7c608!important;box-shadow:none!important
}

/* العربي: الحروف موصولة، فالتباعد بيفكّ الكلمة. */
body.theme-saudi.pg-training-courses[dir="rtl"] .sa-acc-label,
body.theme-saudi.pg-training-courses[dir="rtl"] .sa-acc .tab-pane h6,
body.theme-saudi.pg-training-courses[dir="rtl"] .sa-acc .tab-pane h4,
body.theme-saudi.pg-training-courses[dir="rtl"] .sa-acc .year-heading{
    letter-spacing:0;text-transform:none
}
body.theme-saudi.pg-training-courses[dir="rtl"] .sa-acc-label{font-size:.95rem}

/* --- accordion polish (2026-09-08) --- */
body.theme-saudi.pg-training-courses .sa-acc-wrap .inst-cra{justify-content:space-between}
body.theme-saudi.pg-training-courses .sa-acc-wrap .inst-cra-head span{white-space:nowrap}
body.theme-saudi.pg-training-courses .sa-acc-num{color:#6f7a74;font-size:.72rem}
body.theme-saudi.pg-training-courses .sa-acc-head{padding:16px 20px}
/* آخر صف مفتوح: خط ذهبي رفيع تحت المحتوى كمان يقفل الكتلة. */
body.theme-saudi.pg-training-courses .sa-acc-item.is-open{box-shadow:inset 0 -2px 0 #f7c608}
/* tabs_schedule بيحقن #coursedetails-content-section ul{width:100%!important}
   عالميًا، فقايمة التواصل كانت بتفرد على العرض كله وبنودها تفضل ملزوقة
   في البداية. بنرجّعها لعرضها الطبيعي وندفعها لآخر الشريط. */
body.theme-saudi.pg-training-courses #coursedetails-content-section .sa-acc-wrap .inst-cra-list{
    width:auto!important;flex:0 0 auto;justify-content:flex-end
}

/* سطر بعرض 1385 بيبقى ~180 حرف — طويل على القراية. بنحدّد عرض
   القراية في "نظرة عامة" بس؛ الجدول والكروت محتاجين العرض كله. */
body.theme-saudi.pg-training-courses .sa-acc #nav-overview p,
body.theme-saudi.pg-training-courses .sa-acc #nav-overview li{max-width:1040px}
/* علامة ذهبية بتطلع عند الوقوف على صف مقفول — تلميح إنه بيتفتح. */
body.theme-saudi.pg-training-courses .sa-acc-item:not(.is-open) > .sa-acc-head{
    position:relative
}
body.theme-saudi.pg-training-courses .sa-acc-item:not(.is-open) > .sa-acc-head::before{
    content:'';position:absolute;inset-inline-start:0;top:0;bottom:0;width:0;
    background:#f7c608;transition:width .18s ease
}
body.theme-saudi.pg-training-courses .sa-acc-item:not(.is-open) > .sa-acc-head:hover::before{width:4px}

/* --- training-courses fix 6e5ab912ae803e910662ef9f7268a47b --- */
/* (2026-09-08) طلب صريح: قوائم الدورات في الموقع ده صفوف بلا صور، فالصور اتشالت
   من كل كروت الدورات في الموقع كله عشان الشكل يبقى واحد — الدورات ذات الصلة،
   نتائج البحث، وقائمة الدورات القادمة في الرئيسية. صور البانرات والشرائح فاضلة زي ما هي. */
body.theme-saudi .course-image,
body.theme-saudi .courselisting .course-image,
body.theme-saudi .common-slider .course-image,
body.theme-saudi .search-standardview-content .course-image,
body.theme-saudi .inst-upcoming-thumb{display:none!important}
/* الكارت من غير صورة محتاج حشو من فوق بدل ما النص يلزق في الحافة */
body.theme-saudi .common-slider .courselisting,
body.theme-saudi .search-standardview-content .courselisting{padding-top:14px}

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

   البادئة .sa-ds- جديدة بالكامل، فقواعد .inst-* اللي فوق (المشتركة
   في _institute.css والخاصة بالسعودي هنا) ما بتلمسش الصفحات دي
   أصلًا؛ مافيش قاعدة اتشالت ولا اتنقلت.

   كل الحواف منطقية (border-inline-start/end) عشان العربي RTL،
   والسهم بيتقلب من الـPHP (bi-arrow-left في العربي).
   ============================================================ */

body.theme-saudi .sa-ds {
    background: #f3f5f4;
    padding: 34px 0 46px;
    /* لون النص الأساسي للصفحة كلها — الخانات بتورث منه. */
    color: #10261a;
}

/* --- الورقة نفسها: إطار شعري + خط أخضر فوق، زوايا قايمة --- */
body.theme-saudi .sa-ds-sheet {
    background: #fff;
    border: 1px solid #cfd9d3;
    border-top: 3px solid #006233;
    border-radius: 0;
    margin: 0 0 26px;
}
body.theme-saudi .sa-ds-sheet-plain { border-top-color: #f7c608; }

/* --- شريط عنوان القسم --- */
body.theme-saudi .sa-ds-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #006233;
    color: #fff;
    padding: 13px 22px;
}
body.theme-saudi .sa-ds-hd h2 {
    margin: 0;
    font-size: .84rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .18em;
    color: #fff;
    line-height: 1.4;
}
body.theme-saudi .sa-ds-hd-n {
    font-size: .78rem;
    letter-spacing: .16em;
    color: #f7c608;
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
}

/* --- الصف: خانة ضيّقة + خانة واسعة --- */
body.theme-saudi .sa-ds-row {
    display: grid;
    grid-template-columns: 268px 1fr;
    border-top: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-sheet > .sa-ds-row:first-child { border-top: 0; }

body.theme-saudi .sa-ds-cell { padding: 22px 24px; }

body.theme-saudi .sa-ds-cell-lab {
    background: #f6f9f7;
    border-inline-end: 1px solid #dfe6e1;
    display: flex;
    align-items: center;
    gap: 13px;
}
/* الخانة الواسعة بتتوسّط رأسيًا مع خانة العنوان عشان الصف يبان سطر
   واحد في جدول، مش عمودين طالعين من فوق. */
body.theme-saudi .sa-ds-cell-val { display: flex; align-items: center; }
body.theme-saudi .sa-ds-cell-lab .bi {
    font-size: 1.65rem;
    line-height: 1;
    color: #006233;
}
body.theme-saudi .sa-ds-n {
    font-size: .7rem;
    letter-spacing: .2em;
    color: #93a09a;
    font-variant-numeric: tabular-nums;
}
body.theme-saudi .sa-ds-lab {
    margin: 0;
    font-size: .84rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .15em;
    color: #10261a;
    line-height: 1.5;
}
body.theme-saudi .sa-ds-cell-val p {
    margin: 0;
    color: #43514a;
    line-height: 1.8;
    font-size: .97rem;
    max-width: 74ch;
}

/* --- صف قابل للنقر: رقم | أيقونة | نص | سهم --- */
body.theme-saudi .sa-ds-row-link {
    grid-template-columns: 66px 66px 1fr 62px;
    align-items: stretch;
    text-decoration: none !important;
    color: #10261a;
    transition: background .18s ease;
}
body.theme-saudi .sa-ds-row-link:hover { background: #f6f9f7; }
body.theme-saudi .sa-ds-cell-n,
body.theme-saudi .sa-ds-cell-ico,
body.theme-saudi .sa-ds-cell-arw {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 6px;
}
body.theme-saudi .sa-ds-cell-n {
    border-inline-end: 1px solid #dfe6e1;
    font-size: .78rem;
    letter-spacing: .12em;
    color: #93a09a;
    font-variant-numeric: tabular-nums;
}
body.theme-saudi .sa-ds-cell-ico {
    border-inline-end: 1px solid #dfe6e1;
    background: #f6f9f7;
    color: #006233;
    font-size: 1.4rem;
}
body.theme-saudi .sa-ds-cell-body {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 17px 22px;
    justify-content: center;
}
body.theme-saudi .sa-ds-cell-body strong {
    font-size: .84rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .13em;
    color: #10261a;
}
body.theme-saudi .sa-ds-cell-body > span {
    font-size: .9rem;
    line-height: 1.65;
    color: #5b6a62;
}
body.theme-saudi .sa-ds-cell-arw {
    border-inline-start: 1px solid #dfe6e1;
    color: #006233;
    font-size: 1.15rem;
    transition: background .18s ease, color .18s ease;
}
body.theme-saudi .sa-ds-row-link:hover .sa-ds-cell-arw { background: #f7c608; color: #10261a; }

/* --- شريط ختامي بزرار --- */
body.theme-saudi .sa-ds-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #cfd9d3;
    border-top: 3px solid #f7c608;
    padding: 17px 22px;
}
body.theme-saudi .sa-ds-foot p { margin: 0; }
body.theme-saudi .sa-ds-foot-tag {
    font-size: .74rem;
    text-transform: uppercase;
    letter-spacing: .2em;
    color: #93a09a;
}
body.theme-saudi .sa-ds-foot-txt {
    font-size: .95rem;
    color: #43514a;
    line-height: 1.7;
    max-width: 62ch;
}
body.theme-saudi .sa-ds .btn,
body.theme-saudi .sa-ds-btn {
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: .11em;
    font-size: .78rem;
    font-weight: 700;
    padding: 12px 26px;
    border-width: 1px;
}
body.theme-saudi .sa-ds-btns { display: flex; gap: 10px; flex-wrap: wrap; }

/* --- مقدمة البانر: خانة مواصفات على الشريط الأخضر --- */
body.theme-saudi .sa-ds-lede {
    display: block;
    max-width: 860px;
    padding: 15px 20px;
    border: 1px solid rgba(255, 255, 255, .3);
    background: rgba(255, 255, 255, .07);
}
body.theme-saudi .sa-ds-lede-bar {
    display: block;
    width: 30px;
    height: 3px;
    background: #f7c608;
    margin-bottom: 11px;
}
body.theme-saudi .sa-ds-lede-txt { display: block; font-size: .95rem; line-height: 1.85; }

/* --- العربي: الحروف موصولة فالتباعد بيفكّ الكلمة --- */
body.theme-saudi[dir="rtl"] .sa-ds-lab,
body.theme-saudi[dir="rtl"] .sa-ds-hd h2,
body.theme-saudi[dir="rtl"] .sa-ds-cell-body strong,
body.theme-saudi[dir="rtl"] .sa-ds-foot-tag,
body.theme-saudi[dir="rtl"] .sa-ds .btn,
body.theme-saudi[dir="rtl"] .sa-ds-btn {
    letter-spacing: 0;
    text-transform: none;
}
body.theme-saudi[dir="rtl"] .sa-ds-lab,
body.theme-saudi[dir="rtl"] .sa-ds-cell-body strong { font-size: 1rem; }
body.theme-saudi[dir="rtl"] .sa-ds-hd h2 { font-size: .98rem; }
body.theme-saudi[dir="rtl"] .sa-ds .btn,
body.theme-saudi[dir="rtl"] .sa-ds-btn { font-size: .88rem; }

/* --- الشاشات الصغيرة: الصف بيتفكّ لعمود --- */
@media (max-width: 991px) {
    body.theme-saudi .sa-ds-row { grid-template-columns: 200px 1fr; }
    body.theme-saudi .sa-ds-row-link { grid-template-columns: 54px 54px 1fr 52px; }
}
@media (max-width: 767px) {
    body.theme-saudi .sa-ds-row { grid-template-columns: 1fr; }
    body.theme-saudi .sa-ds-cell-lab {
        border-inline-end: 0;
        border-bottom: 1px solid #dfe6e1;
        flex-direction: row;
        align-items: center;
        gap: 12px;
    }
    body.theme-saudi .sa-ds-cell { padding: 16px 18px; }
    body.theme-saudi .sa-ds-row-link { grid-template-columns: 46px 1fr 46px; }
    body.theme-saudi .sa-ds-row-link .sa-ds-cell-ico { display: none; }
    body.theme-saudi .sa-ds-cell-body { padding: 14px 16px; }
}

/* --- شريط عنوان بديل (أسود المعهد) للأقسام الثانوية --- */
body.theme-saudi .sa-ds-hd-alt { background: #10261a; }
body.theme-saudi .sa-ds-hd h5,
body.theme-saudi .sa-ds-hd h6 {
    margin: 0;
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    line-height: 1.45;
}
body.theme-saudi .sa-ds-hd-n .bi { font-size: 1.05rem; }
body.theme-saudi .sa-ds-foot-end { justify-content: flex-end; }

/* --- فهرس القطاعات: صفوف مرقّمة في عمودين --- */
body.theme-saudi .sa-ds-index {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
body.theme-saudi .sa-ds-index-row {
    display: grid;
    grid-template-columns: 56px 56px 1fr;
    align-items: stretch;
    border-top: 1px solid #dfe6e1;
}
/* الخط الرأسي بين العمودين — حافة منطقية فبتتقلب لوحدها في العربي. */
body.theme-saudi .sa-ds-index-row:nth-child(even) { border-inline-start: 1px solid #dfe6e1; }
body.theme-saudi .sa-ds-index-row:nth-child(1),
body.theme-saudi .sa-ds-index-row:nth-child(2) { border-top: 0; }
body.theme-saudi .sa-ds-index-n,
body.theme-saudi .sa-ds-index-ico {
    display: flex;
    align-items: center;
    justify-content: center;
    border-inline-end: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-index-n {
    font-size: .74rem;
    letter-spacing: .12em;
    color: #93a09a;
    font-variant-numeric: tabular-nums;
}
body.theme-saudi .sa-ds-index-ico { background: #f6f9f7; color: #006233; font-size: 1.2rem; }
body.theme-saudi .sa-ds-index-t {
    display: flex;
    align-items: center;
    padding: 15px 18px;
    font-size: .93rem;
    line-height: 1.5;
    color: #10261a;
}

/* --- الأسئلة الشائعة: كل سؤال صف في الجدول --- */
body.theme-saudi .sa-ds-q { border-top: 1px solid #dfe6e1; }
body.theme-saudi .sa-ds-q > summary {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: 56px 1fr 56px;
    align-items: stretch;
}
body.theme-saudi .sa-ds-q > summary::-webkit-details-marker { display: none; }
body.theme-saudi .sa-ds-q-n {
    display: flex;
    align-items: center;
    justify-content: center;
    border-inline-end: 1px solid #dfe6e1;
    font-size: .74rem;
    letter-spacing: .12em;
    color: #93a09a;
    font-variant-numeric: tabular-nums;
}
body.theme-saudi .sa-ds-q-t {
    display: flex;
    align-items: center;
    padding: 16px 20px;
    font-weight: 600;
    font-size: .96rem;
    line-height: 1.55;
    color: #10261a;
}
body.theme-saudi .sa-ds-q-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    border-inline-start: 1px solid #dfe6e1;
    color: #006233;
    transition: background .18s ease, color .18s ease;
}
body.theme-saudi .sa-ds-q-mark .bi { transition: transform .22s ease; }
body.theme-saudi .sa-ds-q[open] .sa-ds-q-mark { background: #f7c608; color: #10261a; }
body.theme-saudi .sa-ds-q[open] .sa-ds-q-mark .bi { transform: rotate(45deg); }
body.theme-saudi .sa-ds-q:not([open]) > summary:hover { background: #f6f9f7; }
body.theme-saudi .sa-ds-q-a {
    margin-inline-start: 56px;
    border-inline-start: 1px solid #dfe6e1;
    padding: 4px 22px 20px;
}
body.theme-saudi .sa-ds-q-a p {
    margin: 0;
    color: #43514a;
    line-height: 1.85;
    font-size: .94rem;
    max-width: 84ch;
}

/* --- بلوك "اطلب نسخة" في التنزيلات --- */
body.theme-saudi .sa-ds-req {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    padding: 20px 24px;
}
body.theme-saudi .sa-ds-req p { margin: 0; color: #43514a; font-size: .95rem; line-height: 1.7; }

/* --- شروط التسجيل: قائمة تعريف بصفوف --- */
body.theme-saudi .sa-ds-dl { margin: 0; }
body.theme-saudi .sa-ds-dl-row {
    display: grid;
    grid-template-columns: 268px 1fr;
    border-top: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-dl dt {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin: 0;
    padding: 20px 24px;
    background: #f6f9f7;
    border-inline-end: 1px solid #dfe6e1;
    font-weight: 700;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    line-height: 1.6;
    color: #10261a;
}
body.theme-saudi .sa-ds-dl-n {
    flex: 0 0 auto;
    color: #93a09a;
    font-size: .7rem;
    letter-spacing: .2em;
    padding-top: .18em;
}
body.theme-saudi .sa-ds-dl dd {
    margin: 0;
    padding: 20px 24px;
    color: #43514a;
    line-height: 1.8;
    font-size: .95rem;
}

/* --- خطوات "كيف نعمل" --- */
body.theme-saudi .sa-ds-row-step { grid-template-columns: 88px 1fr; }
body.theme-saudi .sa-ds-cell-step {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #006233;
    color: #fff;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: .08em;
    font-variant-numeric: tabular-nums;
    padding: 18px 10px;
}
body.theme-saudi .sa-ds-row-step .sa-ds-cell-val {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
}
body.theme-saudi .sa-ds-row-step .sa-ds-lab { display: block; }
body.theme-saudi .sa-ds-row-step p { margin: 0; }

/* --- نقاط "لماذا الدورات الداخلية؟" --- */
body.theme-saudi .sa-ds-checks { list-style: none; margin: 0; padding: 0; }
body.theme-saudi .sa-ds-checks li {
    display: grid;
    grid-template-columns: 56px 56px 1fr;
    align-items: stretch;
    border-top: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-check-n {
    display: flex;
    align-items: center;
    justify-content: center;
    border-inline-end: 1px solid #dfe6e1;
    font-size: .74rem;
    letter-spacing: .12em;
    color: #93a09a;
    font-variant-numeric: tabular-nums;
}
body.theme-saudi .sa-ds-check-box {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #006233;
    color: #fff;
    font-size: 1rem;
}
body.theme-saudi .sa-ds-check-t {
    display: flex;
    align-items: center;
    padding: 16px 20px;
    color: #10261a;
    font-size: .95rem;
    line-height: 1.65;
}

/* --- اتصل بنا: الفورم بزوايا قايمة + بطاقة البيانات جدول --- */
body.theme-saudi .sa-ds-contact-form .box4 {
    background: #fff;
    border: 1px solid #cfd9d3 !important;
    border-top: 3px solid #006233 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding-top: 6px;
}
body.theme-saudi .sa-ds-contact-form .form-control,
body.theme-saudi .sa-ds-contact-form input:not([type="checkbox"]):not([type="radio"]),
body.theme-saudi .sa-ds-contact-form textarea { border-radius: 0 !important; }
body.theme-saudi .sa-ds-contact-form h5 {
    font-size: .84rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: #10261a;
    margin: 0;
    line-height: 1.5;
}
body.theme-saudi .sa-ds-contact-lead {
    margin: 0;
    padding: 20px 24px;
    color: #43514a;
    line-height: 1.8;
    font-size: .96rem;
}
body.theme-saudi .sa-ds-kv { list-style: none; margin: 0; padding: 0; }
body.theme-saudi .sa-ds-kv li {
    display: grid;
    grid-template-columns: 220px 1fr;
    border-top: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-kv-k {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 24px;
    background: #f6f9f7;
    border-inline-end: 1px solid #dfe6e1;
    font-size: .74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .15em;
    color: #10261a;
}
body.theme-saudi .sa-ds-kv-k .bi { color: #006233; font-size: 1rem; letter-spacing: 0; }
body.theme-saudi .sa-ds-kv-v {
    display: flex;
    align-items: center;
    padding: 15px 24px;
    font-size: .95rem;
    color: #10261a;
    word-break: break-word;
}
body.theme-saudi .sa-ds-kv-v a { color: #10261a; text-decoration: none; }
body.theme-saudi .sa-ds-kv-v a:hover { color: #006233; text-decoration: underline; }
body.theme-saudi .sa-ds-contact-links { padding: 20px 24px; border-top: 1px solid #dfe6e1; }

/* --- العمود الجانبي للنماذج --- */
body.theme-saudi .sa-ds-side-sheet {
    background: #fff;
    border: 1px solid #cfd9d3;
    border-top: 3px solid #006233;
    border-radius: 0;
}
body.theme-saudi .sa-ds-side .sa-ds-hd { padding: 11px 16px; }
body.theme-saudi .sa-ds-side-list { list-style: none; margin: 0; padding: 0; }
body.theme-saudi .sa-ds-side-list li {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 16px;
    border-top: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-side-list li:first-child { border-top: 0; }
body.theme-saudi .sa-ds-side-k {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .67rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .17em;
    color: #6f7a74;
}
body.theme-saudi .sa-ds-side-k .bi { color: #006233; font-size: .95rem; letter-spacing: 0; }
body.theme-saudi .sa-ds-side-v {
    font-size: .89rem;
    color: #10261a;
    text-decoration: none;
    word-break: break-word;
}
body.theme-saudi .sa-ds-side-v:hover { color: #006233; text-decoration: underline; }
body.theme-saudi .sa-ds-side-steps { list-style: none; margin: 0; padding: 0; }
body.theme-saudi .sa-ds-side-steps li {
    display: grid;
    grid-template-columns: 42px 1fr;
    align-items: stretch;
    border-top: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-side-steps li:first-child { border-top: 0; }
body.theme-saudi .sa-ds-side-n {
    display: flex;
    align-items: center;
    justify-content: center;
    border-inline-end: 1px solid #dfe6e1;
    color: #93a09a;
    font-size: .72rem;
    letter-spacing: .1em;
    font-variant-numeric: tabular-nums;
}
body.theme-saudi .sa-ds-side-steps li > span:last-child {
    padding: 12px 14px;
    font-size: .87rem;
    line-height: 1.65;
    color: #43514a;
}

/* --- العربي: فكّ التباعد عن الحروف الموصولة --- */
body.theme-saudi[dir="rtl"] .sa-ds-dl dt,
body.theme-saudi[dir="rtl"] .sa-ds-kv-k,
body.theme-saudi[dir="rtl"] .sa-ds-side-k,
body.theme-saudi[dir="rtl"] .sa-ds-hd h5,
body.theme-saudi[dir="rtl"] .sa-ds-hd h6,
body.theme-saudi[dir="rtl"] .sa-ds-contact-form h5 {
    letter-spacing: 0;
    text-transform: none;
}
body.theme-saudi[dir="rtl"] .sa-ds-dl dt { font-size: .98rem; }
body.theme-saudi[dir="rtl"] .sa-ds-kv-k,
body.theme-saudi[dir="rtl"] .sa-ds-side-k { font-size: .84rem; }
body.theme-saudi[dir="rtl"] .sa-ds-hd h5,
body.theme-saudi[dir="rtl"] .sa-ds-hd h6,
body.theme-saudi[dir="rtl"] .sa-ds-contact-form h5 { font-size: .98rem; }

@media (max-width: 991px) {
    body.theme-saudi .sa-ds-index { grid-template-columns: 1fr; }
    body.theme-saudi .sa-ds-index-row:nth-child(even) { border-inline-start: 0; }
    body.theme-saudi .sa-ds-index-row:nth-child(2) { border-top: 1px solid #dfe6e1; }
    body.theme-saudi .sa-ds-dl-row { grid-template-columns: 200px 1fr; }
    body.theme-saudi .sa-ds-kv li { grid-template-columns: 180px 1fr; }
}
@media (max-width: 767px) {
    body.theme-saudi .sa-ds-dl-row { grid-template-columns: 1fr; }
    body.theme-saudi .sa-ds-dl dt { border-inline-end: 0; border-bottom: 1px solid #dfe6e1; }
    body.theme-saudi .sa-ds-kv li { grid-template-columns: 1fr; }
    body.theme-saudi .sa-ds-kv-k { border-inline-end: 0; border-bottom: 1px solid #dfe6e1; }
    body.theme-saudi .sa-ds-q > summary { grid-template-columns: 44px 1fr 44px; }
    body.theme-saudi .sa-ds-q-a { margin-inline-start: 44px; padding: 4px 16px 18px; }
    body.theme-saudi .sa-ds-checks li,
    body.theme-saudi .sa-ds-index-row { grid-template-columns: 44px 44px 1fr; }
    body.theme-saudi .sa-ds-row-step { grid-template-columns: 62px 1fr; }
}

/* --- الزر الثانوي على الأصفر: النص أبيض في _brand.css (تباين ضعيف على
       #f7c608)، فبنرجّعه لأسود المعهد داخل صفحات ورقة المواصفات بس. --- */
body.theme-saudi .sa-ds .btn-secondary,
body.theme-saudi .sa-ds-side .btn-secondary { color: #10261a !important; }
body.theme-saudi .sa-ds .btn-secondary:hover,
body.theme-saudi .sa-ds .btn-secondary:focus,
body.theme-saudi .sa-ds .btn-secondary:active,
body.theme-saudi .sa-ds-side .btn-secondary:hover {
    background: #10261a !important;
    border-color: #10261a !important;
    color: #fff !important;
}

/* --- اتصل بنا: عنوان الفورم بقى شريط زي شريط الورقة اللي جنبه.
       .box4 حشوها 20px (assets/css/*.css)، فبنشيل الحشو من فوق ونمدّ أول
       .form-padding على العرض كله بنفس الـ20 على الجنبين. --- */
body.theme-saudi .sa-ds-contact-form .box4 { padding: 0 20px 20px !important; }
body.theme-saudi .sa-ds-contact-form .form-group > .form-padding:first-child {
    background: #006233;
    /* .row جوّه .box4 هوامشها -15px، و.form-padding حشوها 10px، فالـ-5
       والـ+10 دول بيوصّلوا الشريط لحافة البطاقة بالظبط من الجهتين. */
    margin: 0 -5px 6px;
    padding: 13px 20px !important;
    width: calc(100% + 10px);
    max-width: none;
    flex: 0 0 auto;
}
body.theme-saudi .sa-ds-contact-form .form-group > .form-padding:first-child h5 { color: #fff; }

/* عدّاد الشريط (01 / 03): أرقام لاتينية جوّه فقرة عربية — الشرطة محايدة
   فالـbidi كانت بتقلب الترتيب لـ"03 / 01". العزل بيثبّت القراءة. */
body.theme-saudi .sa-ds-hd-n { direction: ltr; unicode-bidi: isolate; }

/* ============================================================
   (2026-09-08) "ماذا نقدّم" — جدول حقيقي بصف ترويسة
   ------------------------------------------------------------
   المراجعة المستقلة لقت خمس مواقع بنفس الصف (رقم + أيقونة + عنوان
   بحروف كبيرة في عمود ضيّق، والوصف جنبه، وسهم في الآخر). الصفوف
   دي هنا بقت <table> بصف ترويسة (الصيغة / ما هي / أين) — الترويسة
   هي الفرق. صفوف .sa-ds-row-link القديمة لسه مستعملة في صفحة
   التحميلات فقواعدها فوق ما اتلمستش.

   كل الحواف منطقية (border-inline-*) و text-align:start عشان العربي.
   ============================================================ */

/* حاوية بتلفّ الجدول لوحده لو الشاشة أضيق من الأعمدة — الصفحة نفسها
   عمرها ما بتعمل سكرول أفقي. */
body.theme-saudi .sa-ds-tw { overflow-x: auto; }

body.theme-saudi .sa-ds-tbl {
    width: 100%;
    min-width: 520px;
    margin: 0;
    border-collapse: collapse;
    table-layout: auto;
}
body.theme-saudi .sa-ds-tbl th,
body.theme-saudi .sa-ds-tbl td {
    text-align: start;
    vertical-align: middle;
    padding: 18px 22px;
    border-top: 1px solid #dfe6e1;
    border-inline-end: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ds-tbl th:last-child,
body.theme-saudi .sa-ds-tbl td:last-child { border-inline-end: 0; }

/* صف الترويسة: خط رفيع بحروف متباعدة على أرضية فاتحة وخط أصفر تحته. */
body.theme-saudi .sa-ds-tbl thead th {
    background: #eef3f0;
    border-top: 0;
    border-bottom: 2px solid #f7c608;
    padding: 12px 22px;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .17em;
    color: #43514a;
    white-space: nowrap;
}

/* عمود "الصيغة": الأيقونة والاسم في سطر واحد. */
body.theme-saudi .sa-ds-tbl tbody th {
    background: #f6f9f7;
    width: 34%;
    font-weight: 700;
}
body.theme-saudi .sa-ds-tbl tbody th > .bi {
    font-size: 1.35rem;
    line-height: 1;
    color: #006233;
    margin-inline-end: 11px;
    vertical-align: -2px;
}
body.theme-saudi .sa-ds-tbl tbody th > span {
    font-size: .84rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: #10261a;
}
body.theme-saudi .sa-ds-tbl tbody td {
    color: #5b6a62;
    font-size: .93rem;
    line-height: 1.7;
}
body.theme-saudi .sa-ds-tbl tbody tr:hover th,
body.theme-saudi .sa-ds-tbl tbody tr:hover td { background: #f1f6f3; }

/* عمود "أين": الرابط الوحيد في الصف. */
body.theme-saudi .sa-ds-tbl .sa-ds-tbl-go { white-space: nowrap; width: 1%; }
body.theme-saudi .sa-ds-tbl td.sa-ds-tbl-go a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #006233;
    text-decoration: none;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .11em;
    border-bottom: 2px solid transparent;
    padding-bottom: 2px;
}
body.theme-saudi .sa-ds-tbl td.sa-ds-tbl-go a:hover { border-bottom-color: #f7c608; }
body.theme-saudi .sa-ds-tbl td.sa-ds-tbl-go .bi { font-size: .95rem; }

/* العربي: الحروف موصولة فالتباعد بيفكّ الكلمة. */
body.theme-saudi[dir="rtl"] .sa-ds-tbl thead th,
body.theme-saudi[dir="rtl"] .sa-ds-tbl tbody th > span,
body.theme-saudi[dir="rtl"] .sa-ds-tbl td.sa-ds-tbl-go a {
    letter-spacing: 0;
    text-transform: none;
}
body.theme-saudi[dir="rtl"] .sa-ds-tbl thead th { font-size: .86rem; }
body.theme-saudi[dir="rtl"] .sa-ds-tbl tbody th > span { font-size: .98rem; }
body.theme-saudi[dir="rtl"] .sa-ds-tbl td.sa-ds-tbl-go a { font-size: .88rem; }

@media (max-width: 991px) {
    body.theme-saudi .sa-ds-tbl th,
    body.theme-saudi .sa-ds-tbl td { padding: 14px 16px; }
    body.theme-saudi .sa-ds-tbl thead th { padding: 11px 16px; }
}

/* --- training-courses fix a9639507b3835b2069d09afa21f61a15 --- */
/* السعودي: جدول بحدود ظاهرة، خانات مربّعة */
body.theme-saudi .inst-logos{background:#fff}
body.theme-saudi .inst-logos-h{text-transform:uppercase;letter-spacing:.14em;font-size:.95rem;color:#006233}
body.theme-saudi .inst-logos-grid{gap:0;border:2px solid #006233}
body.theme-saudi .inst-logos-item{border-inline-end:1px solid #cfe0d6;border-bottom:1px solid #cfe0d6;min-height:110px;border-radius:0}
body.theme-saudi .inst-logos-item img{max-height:56px}

/* --- training-courses fix e3430b23a4bb6ca690998b251692f8b1 --- */
/* السعودي: تذكرة مقسومة بخط متقطّع رأسي — البيانات ناحية، السعر والزر ناحية. */
body.theme-saudi.pg-training-courses .session-card{display:grid!important;grid-template-columns:1fr 200px;align-items:center;padding:0!important;border-radius:4px!important;overflow:hidden;position:relative}
body.theme-saudi.pg-training-courses .session-card > ul{grid-column:1;width:100%!important;margin:0!important;padding:16px 18px!important}
body.theme-saudi.pg-training-courses .session-card .price-box{position:static!important;grid-column:2;grid-row:1;border:0!important;border-inline-start:2px dashed #cfd8d2!important;border-radius:0!important;background:transparent!important;padding:14px 12px 6px!important;text-align:center}
body.theme-saudi.pg-training-courses .session-card > form{grid-column:2;grid-row:2;padding:0 12px 14px;text-align:center}

/* ============================================================
   السعودي: صفحات القوائم المشتركة (/categories، /cities، /articles، /blogs)
   بلغة واحدة: "جدول بيانات".

   جدول حقيقي بحدود ظاهرة، صف ترويسة بحروف كبيرة متباعدة على أرضية خضراء
   وخط ذهبي تحته، صفوف مخطّطة (zebra)، وزوايا مربّعة. لا بطاقات ولا صور.
   الترقيم عدّاد CSS مش جافاسكريبت، عشان يفضل صح بعد "تحميل المزيد" والفرز
   وكمان لو جافاسكريبت مقفولة.
   كل الحواف منطقية (border-inline-*) و text-align:start عشان العربي RTL.
   ============================================================ */

body.theme-saudi .sa-lt-sec { background: #f3f5f4; }

/* الحاوية بتلفّ الجدول لوحده لو الشاشة أضيق منه — الصفحة نفسها عمرها ما بتسكرول أفقي */
body.theme-saudi .sa-lt-wrap {
    overflow-x: auto;
    background: #fff;
    border: 2px solid #006233;
    border-radius: 0;
    -webkit-overflow-scrolling: touch;
}

body.theme-saudi table.sa-lt {
    width: 100%;
    min-width: 560px;
    margin: 0;
    border-collapse: collapse;
    border-radius: 0;
    counter-reset: sa-lt-row;
    background: #fff;
}

body.theme-saudi table.sa-lt th,
body.theme-saudi table.sa-lt td {
    text-align: start;
    vertical-align: middle;
    padding: 14px 18px;
    border-radius: 0;
    border-inline-end: 1px solid #dfe6e1;
    border-bottom: 1px solid #dfe6e1;
}
body.theme-saudi table.sa-lt th:last-child,
body.theme-saudi table.sa-lt td:last-child { border-inline-end: 0; }
body.theme-saudi table.sa-lt tbody tr:last-child th,
body.theme-saudi table.sa-lt tbody tr:last-child td { border-bottom: 0; }

/* صف الترويسة: أخضر، حروف كبيرة متباعدة، خط ذهبي تحته */
body.theme-saudi table.sa-lt thead th {
    background: #006233;
    color: #fff;
    border-bottom: 3px solid #f7c608;
    border-inline-end-color: rgba(255,255,255,.22);
    padding: 12px 18px;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .16em;
    white-space: nowrap;
}

/* صفوف مخطّطة */
body.theme-saudi table.sa-lt tbody tr:nth-child(odd) th,
body.theme-saudi table.sa-lt tbody tr:nth-child(odd) td { background: #fff; }
body.theme-saudi table.sa-lt tbody tr:nth-child(even) th,
body.theme-saudi table.sa-lt tbody tr:nth-child(even) td { background: #f2f7f4; }
body.theme-saudi table.sa-lt tbody tr:hover th,
body.theme-saudi table.sa-lt tbody tr:hover td { background: #e8f1ec; }

/* عمود الرقم: عدّاد CSS (01، 02، ...) */
body.theme-saudi table.sa-lt .sa-lt-n {
    width: 1%;
    white-space: nowrap;
    text-align: center;
}
body.theme-saudi table.sa-lt thead th.sa-lt-n { text-align: center; }
body.theme-saudi table.sa-lt tbody tr { counter-increment: sa-lt-row; }
body.theme-saudi table.sa-lt tbody tr.sa-lt-empty { counter-increment: none; }
body.theme-saudi table.sa-lt tbody td.sa-lt-n::before {
    content: counter(sa-lt-row, decimal-leading-zero);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .12em;
    color: #006233;
}

/* عمود الاسم */
body.theme-saudi table.sa-lt tbody th.sa-lt-name {
    font-weight: 700;
    color: #10261a;
    font-size: .95rem;
    line-height: 1.45;
}
body.theme-saudi table.sa-lt tbody th.sa-lt-name a.sa-lt-t {
    color: #10261a;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
body.theme-saudi table.sa-lt tbody th.sa-lt-name a.sa-lt-t:hover {
    color: #006233;
    border-bottom-color: #f7c608;
}
body.theme-saudi table.sa-lt .sa-lt-eyebrow {
    display: block;
    font-size: .66rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: #6d7d74;
    margin-bottom: 3px;
}
body.theme-saudi table.sa-lt .sa-lt-x {
    display: block;
    margin-top: 5px;
    font-size: .83rem;
    font-weight: 400;
    line-height: 1.6;
    color: #5b6a62;
}

/* عمود التاريخ */
body.theme-saudi table.sa-lt .sa-lt-date { width: 1%; white-space: nowrap; }
body.theme-saudi table.sa-lt tbody td.sa-lt-date {
    font-size: .8rem;
    font-weight: 600;
    color: #5b6a62;
}

/* عمود الرابط: الرابط الوحيد المتكرّر في الصف */
body.theme-saudi table.sa-lt .sa-lt-go { width: 1%; white-space: nowrap; }
body.theme-saudi table.sa-lt tbody td.sa-lt-go a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #006233;
    text-decoration: none;
    font-size: .74rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .11em;
    border-bottom: 2px solid transparent;
    padding-bottom: 2px;
}
body.theme-saudi table.sa-lt tbody td.sa-lt-go a:hover { border-bottom-color: #f7c608; }
body.theme-saudi table.sa-lt tbody td.sa-lt-go .bi { font-size: 1rem; }

/* حالة "مفيش نتايج" */
body.theme-saudi table.sa-lt tbody tr.sa-lt-empty td {
    text-align: center;
    padding: 26px 18px;
    color: #5b6a62;
    font-size: .95rem;
}

/* العربي: الحروف موصولة، فالتباعد والحروف الكبيرة بيفكّوا الكلمة */
body.theme-saudi[dir="rtl"] table.sa-lt thead th,
body.theme-saudi[dir="rtl"] table.sa-lt .sa-lt-eyebrow,
body.theme-saudi[dir="rtl"] table.sa-lt tbody td.sa-lt-go a {
    letter-spacing: 0;
    text-transform: none;
}
body.theme-saudi[dir="rtl"] table.sa-lt thead th { font-size: .84rem; }
body.theme-saudi[dir="rtl"] table.sa-lt tbody td.sa-lt-go a { font-size: .85rem; }
body.theme-saudi[dir="rtl"] table.sa-lt .sa-lt-eyebrow { font-size: .74rem; }
body.theme-saudi[dir="rtl"] table.sa-lt tbody th.sa-lt-name { font-size: 1rem; }
body.theme-saudi[dir="rtl"] table.sa-lt .sa-lt-x { font-size: .88rem; }

@media (max-width: 991px) {
    body.theme-saudi table.sa-lt th,
    body.theme-saudi table.sa-lt td { padding: 12px 14px; }
    body.theme-saudi table.sa-lt thead th { padding: 10px 14px; }
}

/* الموبايل: من غير عرض أدنى — الجدول بيتقلّص جوّه الشاشة بدل ما يعمل سكرول */
@media (max-width: 767px) {
    body.theme-saudi table.sa-lt { min-width: 0; }
    body.theme-saudi table.sa-lt th,
    body.theme-saudi table.sa-lt td { padding: 10px 8px; }
    body.theme-saudi table.sa-lt thead th {
        padding: 9px 8px;
        font-size: .6rem;
        letter-spacing: .08em;
        white-space: normal;
    }
    body.theme-saudi[dir="rtl"] table.sa-lt thead th { font-size: .74rem; }
    body.theme-saudi table.sa-lt tbody th.sa-lt-name { font-size: .87rem; }
    body.theme-saudi table.sa-lt .sa-lt-x { font-size: .78rem; }
    body.theme-saudi table.sa-lt .sa-lt-date { white-space: normal; width: 4.5rem; }
    body.theme-saudi table.sa-lt tbody td.sa-lt-date { font-size: .72rem; }
    body.theme-saudi table.sa-lt tbody td.sa-lt-go a {
        font-size: .66rem;
        letter-spacing: .06em;
        white-space: normal;
    }
    body.theme-saudi[dir="rtl"] table.sa-lt tbody td.sa-lt-go a { font-size: .78rem; }
    body.theme-saudi table.sa-lt .sa-lt-go { width: 4.5rem; white-space: normal; }
    body.theme-saudi table.sa-lt tbody td.sa-lt-n::before { font-size: .7rem; letter-spacing: .04em; }
}

/* ── (2026-09-09) صفحة الدورة على الموبايل ──────────────────────
   الأصل بيخبّي كتلة الديسكتوب ويرجّع أكورديون بوتستراب العام، فبيضيع
   شكل الثيم ويتخبّى المحتوى. تخطيط الثيم ده عمود واحد وعنده قواعده
   للشاشات الصغيرة، فبنعرضه هو. متقيّد بالثيم — المعهد زي ما هو.
   ───────────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    body.theme-saudi.pg-training-courses #coursedetails-content-section .coursedetails-content-section-desktop { display: block; }
    body.theme-saudi.pg-training-courses #coursedetails-content-section .coursedetails-content-section-mobile { display: none; }
    body.theme-saudi.pg-training-courses .coursedetails-content-section-desktop { margin-inline: 0; }
}

/* (2026-09-09) صف بيانات التواصل مرصوص على اليمين بعرض تلقائي — كويس
   على الديسكتوب، بس على التليفون بيخرج برّه الشاشة بعد ما بقى المحتوى
   المتصل هو المعروض. بيلفّ ويملا العرض على الشاشات الصغيرة. */
@media (max-width: 767px) {
    body.theme-saudi.pg-training-courses #coursedetails-content-section .sa-acc-wrap .inst-cra-list {
        width: 100% !important; flex: 1 1 100%;
        justify-content: flex-start; flex-wrap: wrap;
    }
    body.theme-saudi.pg-training-courses .sa-acc-wrap .inst-cra-list { margin-inline-start: 0; }
}

/* ═══ (2026-09-09) /categories — السعودي: شبكة بطاقات بأيقونة ═══
   الجدول القديم كان بيتقري زي قوايم ليدرز والزمالة. أداة التمييز هنا
   الأيقونة: كل قسم أيقونة بتخدم معناه، في بطاقة بشريط أخضر علوي.
   ───────────────────────────────────────────────────────────── */
body.theme-saudi .sa-cg-sec { padding: 8px 0 12px; }
body.theme-saudi .sa-cg {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
}
body.theme-saudi .sa-cg-card {
    display: flex; flex-direction: column; gap: 10px;
    padding: 20px 18px 16px;
    background: #fff; border: 1px solid #dfe6e2;
    border-top: 4px solid var(--site-primary, #157347);
    text-decoration: none; color: #1f2a26;
    transition: box-shadow .18s, transform .18s, border-color .18s;
}
body.theme-saudi .sa-cg-card:hover,
body.theme-saudi .sa-cg-card:focus-visible {
    text-decoration: none; transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(21,115,71,.14);
    border-top-color: var(--site-accent, #f7c608);
}
body.theme-saudi .sa-cg-ico {
    width: 46px; height: 46px; display: inline-flex;
    align-items: center; justify-content: center;
    background: #eef6f1; color: var(--site-primary, #157347);
    border-radius: 50%; font-size: 1.35rem; flex: 0 0 auto;
}
body.theme-saudi .sa-cg-card:hover .sa-cg-ico { background: var(--site-primary, #157347); color: #fff; }
body.theme-saudi .sa-cg-name { font-weight: 700; font-size: 1rem; line-height: 1.45; }
body.theme-saudi .sa-cg-go {
    margin-top: auto; padding-top: 8px;
    font-size: .82rem; font-weight: 700; letter-spacing: .04em;
    text-transform: uppercase; color: var(--site-primary, #157347);
    display: inline-flex; align-items: center; gap: 7px;
}
body.theme-saudi[dir="rtl"] .sa-cg-go { letter-spacing: 0; text-transform: none; }
@media (max-width: 991px) { body.theme-saudi .sa-cg { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) { body.theme-saudi .sa-cg { grid-template-columns: 1fr; } }
/* /cities بنفس لغة البطاقات: سطر تمهيدي صغير فوق اسم المدينة. */
body.theme-saudi .sa-cg-eyebrow {
    font-size: .72rem; letter-spacing: .06em; text-transform: uppercase;
    color: #6b7f75; margin-top: 2px;
}
body.theme-saudi[dir="rtl"] .sa-cg-eyebrow { letter-spacing: 0; text-transform: none; font-size: .8rem; }
body.theme-saudi .sa-cg-eyebrow + .sa-cg-name { margin-top: -6px; }

/* ═══ (2026-09-09) /contact-us — السعودي: بطاقات وسائل التواصل + لوحة فورم ═══
   التخطيط الافتراضي (فورم ثلث + بطاقة بيانات ثلثين) كان بيطلع نفس شكل باقي
   المعاهد. هنا البيانات بقت ثلاث بطاقات بنفس لغة .sa-cg بتاعة /categories
   و/cities، والفورم نزل تحتيهم بعرض كامل عشان ياخد وزنه كهدف الصفحة.
   ──────────────────────────────────────────────────────────────────────── */
body.theme-saudi .sa-ct-sec { background: #f3f5f4; padding: 8px 0 12px; }

/* بطاقات التواصل مش روابط تصفّح: القيمة (رقم/بريد) هي البطل، فبتكبر
   وتاخد اتجاه LTR ثابت حتى في الواجهة العربية عشان الرقم ميتقلبش. */
body.theme-saudi .sa-ct-val {
    font-size: 1.05rem; color: #10261a; word-break: break-word; text-align: start;
}
body.theme-saudi .sa-ct-val bdi { unicode-bidi: isolate; }
body.theme-saudi .sa-ct-card { border-top-color: #f7c608; }
body.theme-saudi .sa-ct-card:hover,
body.theme-saudi .sa-ct-card:focus-visible { border-top-color: #006233; }

/* شريط ساعات العمل: سطر واحد خفيف، منفصل عن البطاقات بحد علوي رفيع. */
body.theme-saudi .sa-ct-hours {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
    margin: 16px 0 0; padding: 12px 16px;
    background: #fff; border: 1px solid #dfe6e2; border-radius: 4px;
    font-size: .9rem; color: #3d4a44;
}
body.theme-saudi .sa-ct-hours .bi { color: #006233; font-size: 1rem; }
body.theme-saudi .sa-ct-hours b {
    color: #10261a; text-transform: uppercase; letter-spacing: .1em;
    font-size: .74rem; margin-inline-end: 4px;
}
body.theme-saudi[dir="rtl"] .sa-ct-hours b { text-transform: none; letter-spacing: 0; font-size: .84rem; }

/* اللوحة: الحدّ الأخضر العلوي بيميّزها عن البطاقات ذات الحدّ الذهبي،
   فالعين تعرف إن دي منطقة الإجراء مش منطقة المعلومة. */
body.theme-saudi .sa-ct-panel {
    margin-top: 24px; padding: 24px;
    background: #fff; border: 1px solid #dfe6e2;
    border-top: 4px solid #006233; border-radius: 4px;
    box-shadow: 0 1px 3px rgba(16, 38, 26, .06);
}
body.theme-saudi .sa-ct-panel-h {
    margin: 0 0 6px; font-size: 1.05rem; font-weight: 700; color: #10261a;
    text-transform: uppercase; letter-spacing: .12em;
}
body.theme-saudi[dir="rtl"] .sa-ct-panel-h { text-transform: none; letter-spacing: 0; font-size: 1.2rem; }
body.theme-saudi .sa-ct-panel-lead {
    margin: 0 0 20px; max-width: 68ch; color: #3d4a44; font-size: .95rem; line-height: 1.7;
}

/* شبكة عمودين للفورم. حقول Salesforce المخفية type="hidden" مش بتتحسب
   كخلايا شبكة (display:none من المتصفح)، فترتيب الـdivs ثابت:
   1 = #message_contact، 2..5 = الاسم/العائلة/البريد/الهاتف، 6 = الرسالة،
   7 = زر الإرسال. الاختيار بالترتيب مش بالكلاس عشان ممنوع تعديل form.php. */
body.theme-saudi .sa-ct-panel .inst-cform {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px;
}
body.theme-saudi .sa-ct-panel .inst-cform > div { grid-column: auto; }
body.theme-saudi .sa-ct-panel .inst-cform > div:nth-of-type(1),
body.theme-saudi .sa-ct-panel .inst-cform > div:nth-of-type(6),
body.theme-saudi .sa-ct-panel .inst-cform > div:nth-of-type(7) { grid-column: 1 / -1; }
body.theme-saudi .sa-ct-panel .inst-cform .form-control {
    border: 1px solid #c5d2cb; border-radius: 4px; padding: 11px 14px;
    background: #fff; color: #10261a; font-size: .95rem;
}
/* التباين: #667b71 على أبيض = 4.6:1، فوق الحد المطلوب للـplaceholder. */
body.theme-saudi .sa-ct-panel .inst-cform .form-control::placeholder { color: #667b71; opacity: 1; }
body.theme-saudi .sa-ct-panel .inst-cform .form-control:focus {
    border-color: #006233; box-shadow: 0 0 0 3px rgba(0, 98, 51, .16); outline: 0;
}
body.theme-saudi .sa-ct-panel .inst-cform textarea.form-control { min-height: 130px; }
body.theme-saudi .sa-ct-panel .inst-cform-actions { margin-top: 4px; }
body.theme-saudi .sa-ct-panel #submit_contact {
    background: #006233; border: 1px solid #006233; color: #fff;
    border-radius: 4px; padding: 11px 34px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .1em; font-size: .8rem;
}
body.theme-saudi[dir="rtl"] .sa-ct-panel #submit_contact { text-transform: none; letter-spacing: 0; font-size: .92rem; }
body.theme-saudi .sa-ct-panel #submit_contact:hover { background: #004d28; border-color: #004d28; }

/* روابط ثانوية كنص: مفيش زر تاني ينافس زر الإرسال. */
body.theme-saudi .sa-ct-more {
    display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 20px;
}
body.theme-saudi .sa-ct-more a {
    display: inline-flex; align-items: center; gap: 8px;
    color: #005229; font-weight: 700; font-size: .9rem; text-decoration: none;
    border-bottom: 2px solid transparent; padding-bottom: 2px;
}
body.theme-saudi .sa-ct-more a:hover { border-bottom-color: #f7c608; }

@media (max-width: 767px) {
    body.theme-saudi .sa-ct-panel { padding: 18px 16px; }
    /* عمود واحد على التليفون: عمودين بيخنقوا الحقول ويسببوا تجاوز أفقي. */
    body.theme-saudi .sa-ct-panel .inst-cform { grid-template-columns: 1fr; }
    body.theme-saudi .sa-ct-panel .inst-cform > div { grid-column: 1 / -1; }
    body.theme-saudi .sa-ct-panel #submit_contact { width: 100%; }
}

/* بطاقة بلا رابط (ساعات العمل): من غير رفع ولا ظل عند المرور، وسطر
   "الإجراء" فيها بيتحوّل لملاحظة رمادية عشان ما يبانش إنه قابل للضغط.
   #5a6f66 على #fff = 4.9:1، فوق الحد المطلوب. */
body.theme-saudi .sa-ct-card--static:hover {
    transform: none; box-shadow: none; border-top-color: #f7c608;
}
body.theme-saudi .sa-ct-card--static:hover .sa-cg-ico { background: #eef6f1; color: #006233; }
body.theme-saudi .sa-ct-card--static .sa-cg-go {
    color: #5a6f66; font-weight: 600; letter-spacing: 0; text-transform: none; font-size: .8rem;
}

/* تباين: اللون الافتراضي للسطر التمهيدي في بطاقات /categories (#6b7f75)
   بيدّي 4.27:1 على الأبيض — تحت الحد. هنا هو اسم وسيلة التواصل نفسها
   (مش سطر زخرفي) فلازم يعدّي 4.5:1، فبيتغمّق لـ#5a6f66 = 5.3:1.
   التغميق مقصور على بطاقات صفحة اتصل بنا عشان /categories ما يتأثرش. */
body.theme-saudi .sa-ct-ways .sa-cg-eyebrow { color: #5a6f66; }

/* (2026-09-09) لوحة فورم اتصل بنا كانت بعرض الحاوية كلها، فمربّع الرسالة
   طلع 1360px — سطر طويل قوي على القراية والكتابة. بنحدّ اللوحة نفسها. */
body.theme-saudi #common-listing-section form#contact,
body.theme-saudi #common-listing-section .sa-cu-panel { max-width: 980px; margin-inline: auto; }

/* ═══ (2026-09-09) /training-courses — السعودي: كروت بشريط أخضر ═══
   وضع الكروت (inst-tc--cards) مشترك، بس الشكل هنا خاص بالسعودي:
   ثلاثة أعمدة، شريط أخضر فوق كل كارت وحد رفيع، والتاريخ في رقاقة
   ذهبية. مختلف عن كروت العربي (كريمي، عمودين، مشجّر).
   ───────────────────────────────────────────────────────────── */
body.theme-saudi .inst-tc--cards #course_list {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
body.theme-saudi .inst-tc--cards .inst-tc-head { display: none; }
body.theme-saudi .inst-tc--cards .courselist-style-inside .courselisting,
body.theme-saudi .inst-tc--cards .courselist-style-inside .courselisting.virtual {
    display: flex !important;
    flex-direction: column;
    gap: 8px;
    padding: 18px 16px 16px !important;
    background: #fff;
    border: 1px solid #dfe6e2 !important;
    border-top: 4px solid var(--site-primary, #006233) !important;
    border-radius: 0;
}
body.theme-saudi .inst-tc--cards .courselisting.virtual { border-top-color: var(--site-accent, #f7c608) !important; }
body.theme-saudi .inst-tc--cards .course-title {
    font-size: .97rem; font-weight: 700; line-height: 1.45;
    -webkit-line-clamp: 3; min-height: 0;
}
@media (max-width: 1199px) { body.theme-saudi .inst-tc--cards #course_list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px)  { body.theme-saudi .inst-tc--cards #course_list { grid-template-columns: 1fr; } }

/* ═══ (2026-09-09) /downloads — السعودي: شبكة بطاقات مربّعة بأيقونة ═══
   التخطيط القديم (.sa-ds-sheet + صفوف مرقّمة بسهم) كان بيتقري زي صفحة
   التنزيلات في باقي المعاهد. هنا اتبنى بلغة السعودي نفسه: البطاقة بالأيقونة
   اللي في /categories و/cities — بس مربّعة، والأيقونة كبيرة فوق، والإجراء
   (زرار التحميل) جوّه البطاقة بعرضها كله.

   قواعد .sa-ds-* القديمة فوق ما اتلمستش لأن contact_content.php و
   about_content.php لسه بيستعملوها؛ الصفحة دي بقت على بادئة .sa-dl- جديدة.
   كل الحواف والمسافات منطقية (inline/block) عشان العربي RTL.
   ───────────────────────────────────────────────────────────────────── */
body.theme-saudi .sa-dl {
    background: #f3f5f4;
    padding: 32px 0 48px;
    color: #10261a;
}

/* سطر التوضيح: خفيف ومحدود العرض عشان ما يتقريش كشريط عنوان قسم. */
body.theme-saudi .sa-dl-note {
    display: flex; align-items: flex-start; gap: 10px;
    max-width: 1040px; margin: 0 auto 22px;
    font-size: .95rem; line-height: 1.6;
    color: #3d4f47;                       /* على #f3f5f4 = 8.4:1 */
}
body.theme-saudi .sa-dl-note .bi { color: #006233; font-size: 1.1rem; line-height: 1.45; flex: 0 0 auto; }

/* ثلاثة أعمدة × صفّين = الستة كلهم في شاشة واحدة من غير تمرير.
   العرض محدود بـ1040px لأن البطاقة مربّعة: لو العمود بقى 440px يبقى
   طولها 440px وجواها فراغ ميّت. عند 1040 البطاقة ~325px وده مقاس
   بيخلّي الأيقونة والعنوان والزرار يملوها. */
body.theme-saudi .sa-dl-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    max-width: 1040px;
    margin-inline: auto;
}

/* البطاقة مربّعة: aspect-ratio بيخلّي الطول = العرض، والمحتوى قصير
   (أيقونة + عنوان سطرين + وصف) فمابيعدّيش. تحت 576px بترجع طبيعية
   عشان العمود الواحد ما يطلعش مربّع ضخم على الموبايل. */
body.theme-saudi .sa-dl-card {
    position: relative;                   /* لرقاقة PDF في الركن */
    aspect-ratio: 1 / 1;
    display: flex; flex-direction: column;
    padding: 24px 22px 22px;
    background: #fff;
    border: 1px solid #cfd9d3;
    border-top: 4px solid #006233;        /* شريط السعودي الأخضر */
    border-radius: 4px;                   /* زوايا 4px زي نظام الموقع */
    transition: box-shadow .18s, border-top-color .18s;
}
body.theme-saudi .sa-dl-card:hover { box-shadow: 0 10px 26px rgba(0,98,51,.13); }
body.theme-saudi .sa-dl-card:focus-within { border-top-color: #f7c608; }

/* الأيقونة كبيرة وفوق: هي أول حاجة العين تشوفها في البطاقة. */
body.theme-saudi .sa-dl-ico {
    width: 68px; height: 68px; margin-bottom: 18px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #eaf3ee; color: #006233;
    border-radius: 4px; flex: 0 0 auto;
}
body.theme-saudi .sa-dl-ico .bi { font-size: 1.85rem; line-height: 1; }

/* رقاقة PDF: علامة بصرية إن للبطاقة ملف — ذهبي على حبر غامق (12.6:1). */
body.theme-saudi .sa-dl-tag {
    position: absolute; inset-block-start: 18px; inset-inline-end: 18px;
    padding: 3px 9px; border-radius: 3px;
    background: #10261a; color: #f7c608;
    font-size: .68rem; font-weight: 700; letter-spacing: .12em;
}

body.theme-saudi .sa-dl-t { margin: 0 0 8px; font-size: 1.05rem; line-height: 1.45; font-weight: 700; }
body.theme-saudi .sa-dl-t a { color: #10261a; text-decoration: none; }
body.theme-saudi .sa-dl-t a:hover,
body.theme-saudi .sa-dl-t a:focus-visible { color: #006233; text-decoration: underline; }

body.theme-saudi .sa-dl-d {
    margin: 0; font-size: .9rem; line-height: 1.6;
    color: #4a5b53;                       /* على أبيض = 7.3:1 */
}

/* الإجراء ملزوق في قاع البطاقة عشان كل الأزرار تبقى على خط واحد في الصف. */
body.theme-saudi .sa-dl-act {
    margin-block-start: auto; padding-block-start: 16px;
    border-block-start: 1px solid #e6ece9;   /* رفّ بيربط الإجراء بقاع البطاقة */
}
body.theme-saudi .sa-dl-card--list .sa-dl-act { border-block-start-color: #e2e7e4; }

/* الزرار بطل البطاقة: عرض كامل، أخضر مصمت. اللون متكتوب صريح مش
   var(--site-accent) لأن الـhover المشترك في _institute.css بيحط الذهبي
   خلف نص أبيض (1.7:1) — هنا الذهبي بياخد حبر غامق بدل الأبيض. */
body.theme-saudi .sa-dl-cta {
    width: 100%; justify-content: center;
    margin-top: 0; padding: 11px 16px;
    background: #006233; color: #fff;
    border-radius: 4px; font-size: .9rem; letter-spacing: .01em;
}
body.theme-saudi .sa-dl-cta:hover,
body.theme-saudi .sa-dl-cta:focus-visible {
    background: #f7c608; color: #10261a; transform: none;
}

/* ─── البطاقة اللي مالهاش ملف: قائمة حيّة مش تنزيل ───
   الفرق مقصود إنه يتقري من غير قراية — حد متقطّع باهت، بلا شريط أخضر،
   أيقونة رمادية، وخلفية أهدأ، ومن غير زرار خالص. */
body.theme-saudi .sa-dl-card--list {
    background: #fafbfa;
    border: 1px dashed #c3cec8;
    border-top: 1px dashed #c3cec8;
    box-shadow: none;
}
body.theme-saudi .sa-dl-card--list:hover { box-shadow: none; border-color: #9fb3a9; }
body.theme-saudi .sa-dl-card--list .sa-dl-ico { background: #ecefed; color: #56685f; } /* 5.6:1 */
body.theme-saudi .sa-dl-card--list .sa-dl-d { color: #55665e; }

body.theme-saudi .sa-dl-browse {
    display: inline-block;
    font-size: .9rem; font-weight: 700; color: #006233;
    text-decoration: none;
    border-block-end: 2px solid #f7c608; padding-block-end: 2px;
}
body.theme-saudi .sa-dl-browse:hover,
body.theme-saudi .sa-dl-browse:focus-visible { color: #10261a; border-block-end-color: #006233; }

@media (max-width: 991px) {
    body.theme-saudi .sa-dl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 575px) {
    /* عمود واحد: المربّع بيبقى طويل بلا داعي، فالطول بيرجع للمحتوى. */
    body.theme-saudi .sa-dl-grid { grid-template-columns: 1fr; }
    body.theme-saudi .sa-dl-card { aspect-ratio: auto; padding: 20px 18px 18px; }
    body.theme-saudi .sa-dl-ico { width: 56px; height: 56px; margin-bottom: 14px; }
    body.theme-saudi .sa-dl-ico .bi { font-size: 1.55rem; }
    body.theme-saudi .sa-dl-t { font-size: 1rem; }
}

/* ═══ (2026-09-09) /about-saudi — لوحة حقائق + جدول صفّين + بطاقتَي ختام ═══
   البادئة .sa-ab- جديدة بالكامل ومقصورة على صفحة "عن المعهد"، فمفيش قاعدة
   قديمة اتعدّلت ولا اتشالت — قواعد .sa-ds-* اللي فوق لسه مستعملة في صفحات
   اتصل بنا والعملاء وبتفضل زي ما هي. الصفحة بتستعمل .sa-ds كخلفية الصفحة بس.

   ليه الشكل ده: هوية السعودي "جداول بحدود ورؤوس أعمدة، كل شيء مصفوف على
   شبكة". فلوحة الحقائق شبكة بخطوط شعرية (الفواصل جاية من gap:1px فوق خلفية
   رمادية — كده الخط بيفضل مظبوط مهما لفّت الخانات على الموبايل)، والجدول
   له رأس أعمدة مصمت وخط رأسي بين العمودين.
   ───────────────────────────────────────────────────────────────────────── */

/* عناوين الأقسام: حروف كبيرة متباعدة (خط السعودي للعناوين الصغيرة).
   العربي مالوش حروف كبيرة، فالتباعد بيترفع والحجم بيكبر بدلها. */
body.theme-saudi .sa-ab-h {
    margin: 34px 0 12px;
    font-size: 1rem; font-weight: 800; line-height: 1.4;
    letter-spacing: .14em; text-transform: uppercase; color: #10261a;
}
body.theme-saudi .sa-ab-h-first { margin-top: 0; }
body.theme-saudi[dir="rtl"] .sa-ab-h {
    letter-spacing: 0; text-transform: none; font-size: 1.15rem;
}

/* --- 1) لوحة الحقائق --- */
body.theme-saudi .sa-ab-facts {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px; background: #cfd9d3;
    border: 1px solid #cfd9d3; border-top: 4px solid #006233; border-radius: 4px;
    overflow: hidden;   /* عشان الزوايا تقص الخانات البيضا */
}
body.theme-saudi .sa-ab-fact { background: #fff; padding: 22px 20px 20px; }
body.theme-saudi .sa-ab-fact-n {
    display: block; font-size: 2.4rem; font-weight: 800; line-height: 1;
    color: #006233;   /* 7.7:1 على الأبيض */
}
/* الشرطة الذهبية: زخرفة تفصل الرقم عن وصفه، مش حاملة معنى. */
body.theme-saudi .sa-ab-fact-n::after {
    content: ""; display: block; width: 28px; height: 3px;
    background: #f7c608; margin-block: 12px 10px;
}
body.theme-saudi .sa-ab-fact-l {
    display: block; font-size: .78rem; font-weight: 700; line-height: 1.5;
    letter-spacing: .1em; text-transform: uppercase;
    color: #55665e;   /* 5.6:1 على الأبيض */
}
body.theme-saudi[dir="rtl"] .sa-ab-fact-l {
    letter-spacing: 0; text-transform: none; font-size: .9rem; font-weight: 600;
}
body.theme-saudi .sa-ab-note {
    margin: 10px 0 0; font-size: .82rem; line-height: 1.7;
    color: #55665e; max-width: 70ch;
}

/* --- 2) شريط التواصل --- */
/* أبيض على #006233 = 7.7:1. الشريط الذهبي على البداية بيربطه بلغة الصفحة
   من غير ما يضيف زرار تاني ينافس زرار الإجراء. */
body.theme-saudi .sa-ab-act {
    margin-top: 26px; padding: 18px 22px;
    background: #006233; color: #fff; border-radius: 4px;
    border-inline-start: 4px solid #f7c608;
    display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px;
}
body.theme-saudi .sa-ab-act-t {
    margin: 0; flex: 1 1 300px; max-width: 60ch;
    font-size: .98rem; line-height: 1.7;
}
body.theme-saudi .sa-ab-act-links { display: flex; flex-wrap: wrap; gap: 8px 22px; }
body.theme-saudi .sa-ab-act-links a {
    display: inline-flex; align-items: center; gap: 8px;
    color: #fff; font-size: .92rem; font-weight: 600; text-decoration: none;
    border-block-end: 1px solid rgba(255, 255, 255, .45); padding-block-end: 2px;
}
body.theme-saudi .sa-ab-act-links a:hover,
body.theme-saudi .sa-ab-act-links a:focus-visible {
    color: #f7c608; border-block-end-color: #f7c608;   /* ذهبي على أخضر = 4.8:1 */
}
body.theme-saudi .sa-ab-act-links .bi { font-size: 1rem; }
body.theme-saudi .sa-ab-act-links bdi { unicode-bidi: isolate; }
/* زرار الإجراء الوحيد في الصفحة: ذهبي بنص فحمي = 9.9:1. */
body.theme-saudi a.sa-ab-btn {
    display: inline-block; padding: 11px 28px; border-radius: 4px;
    background: #f7c608; color: #10261a; text-decoration: none;
    font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
    border: 1px solid #f7c608;
}
body.theme-saudi a.sa-ab-btn:hover,
body.theme-saudi a.sa-ab-btn:focus-visible { background: #fff; border-color: #fff; color: #10261a; }
body.theme-saudi[dir="rtl"] a.sa-ab-btn { letter-spacing: 0; text-transform: none; font-size: .92rem; }

/* --- 3) جدول الصيغتين --- */
body.theme-saudi .sa-ab-tbl {
    width: 100%; border-collapse: collapse; background: #fff;
    border: 1px solid #cfd9d3; border-top: 3px solid #006233;
}
body.theme-saudi .sa-ab-tbl thead th {
    background: #10261a; color: #fff;   /* 16.5:1 */
    padding: 12px 20px; text-align: start;
    font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] .sa-ab-tbl thead th {
    letter-spacing: 0; text-transform: none; font-size: .88rem;
}
body.theme-saudi .sa-ab-tbl tbody th,
body.theme-saudi .sa-ab-tbl tbody td {
    padding: 20px; text-align: start; vertical-align: top;
    border-block-start: 1px solid #e3eae6;
}
body.theme-saudi .sa-ab-tbl tbody tr:first-child th,
body.theme-saudi .sa-ab-tbl tbody tr:first-child td { border-block-start: 0; }
body.theme-saudi .sa-ab-tbl tbody th {
    width: 32%; font-size: 1rem; font-weight: 700; line-height: 1.5; color: #10261a;
}
body.theme-saudi .sa-ab-tbl tbody th .bi {
    color: #006233; font-size: 1.15rem; margin-inline-end: 10px; vertical-align: -2px;
}
body.theme-saudi .sa-ab-tbl tbody td { border-inline-start: 1px solid #e3eae6; }
body.theme-saudi .sa-ab-tbl tbody td p {
    margin: 0; max-width: 62ch; color: #3d4a44; font-size: .95rem; line-height: 1.8;
}
body.theme-saudi .sa-ab-lnks { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 14px; }
body.theme-saudi a.sa-ab-lnk {
    display: inline-flex; align-items: center; gap: 7px;
    color: #005229; font-size: .88rem; font-weight: 700; text-decoration: none;
    border-block-end: 2px solid transparent; padding-block-end: 2px;
}
body.theme-saudi a.sa-ab-lnk:hover,
body.theme-saudi a.sa-ab-lnk:focus-visible { border-block-end-color: #f7c608; color: #10261a; }
body.theme-saudi a.sa-ab-lnk .bi { font-size: .8rem; }

/* --- 4) بطاقتا الختام --- */
body.theme-saudi .sa-ab-close {
    margin-top: 30px;
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px;
}
body.theme-saudi .sa-ab-card {
    background: #fff; border: 1px solid #dfe6e2; border-top: 4px solid #006233;
    border-radius: 4px; padding: 24px 22px;
    display: flex; flex-direction: column; gap: 12px;
}
body.theme-saudi .sa-ab-card h2 {
    margin: 0; font-size: .95rem; font-weight: 800; line-height: 1.4;
    letter-spacing: .12em; text-transform: uppercase; color: #10261a;
}
body.theme-saudi[dir="rtl"] .sa-ab-card h2 {
    letter-spacing: 0; text-transform: none; font-size: 1.1rem;
}
body.theme-saudi .sa-ab-card p {
    margin: 0; max-width: 60ch; color: #3d4a44; font-size: .95rem; line-height: 1.85;
}
/* القيم الخمسة: قائمة داخل بطاقة، مش خمس بطاقات. المربّع الذهبي علامة بند. */
body.theme-saudi .sa-ab-vals {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px;
}
body.theme-saudi .sa-ab-vals li {
    position: relative; padding-inline-start: 18px;
    font-size: .94rem; line-height: 1.6; color: #10261a;
}
body.theme-saudi .sa-ab-vals li::before {
    content: ""; position: absolute; inset-inline-start: 0; top: .5em;
    width: 8px; height: 8px; background: #f7c608;
}

@media (max-width: 991px) {
    body.theme-saudi .sa-ab-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.theme-saudi .sa-ab-fact-n { font-size: 2.1rem; }
}
@media (max-width: 767px) {
    /* عمود واحد: بطاقتان جنب بعض بيخنقوا النص تحت 70 حرف. */
    body.theme-saudi .sa-ab-close { grid-template-columns: 1fr; }
    body.theme-saudi .sa-ab-act { gap: 12px 18px; }
    body.theme-saudi a.sa-ab-btn { width: 100%; text-align: center; }
}
@media (max-width: 575px) {
    /* الجدول بيتفكّ لكتل: عمودين على 390px بيدّوا سطر من كلمتين.
       رأس الأعمدة بيتخفي بصريًا وبيفضل مقروء للقارئ الصوتي. */
    /* لما الـtable بتبقى display:block الـcaption بترجع صندوق بعرض
       محتواها بس، فالشريط الأخضر كان بيطلع نصّ عرض الجدول. */
    body.theme-saudi .sa-fq-cap { display: block; }
    body.theme-saudi .sa-ab-tbl thead {
        position: absolute; width: 1px; height: 1px;
        overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
    }
    body.theme-saudi .sa-ab-tbl,
    body.theme-saudi .sa-ab-tbl tbody,
    body.theme-saudi .sa-ab-tbl tbody tr,
    body.theme-saudi .sa-ab-tbl tbody th,
    body.theme-saudi .sa-ab-tbl tbody td { display: block; width: auto; }
    body.theme-saudi .sa-ab-tbl tbody tr + tr { border-block-start: 1px solid #e3eae6; }
    body.theme-saudi .sa-ab-tbl tbody th { padding: 18px 16px 10px; }
    body.theme-saudi .sa-ab-tbl tbody td {
        border-inline-start: 0; border-block-start: 0; padding: 0 16px 18px;
    }
    body.theme-saudi .sa-ab-fact { padding: 18px 16px; }
    body.theme-saudi .sa-ab-vals { grid-template-columns: 1fr; }
    body.theme-saudi .sa-ab-act { padding: 16px; }
}

/* ═══ (2026-09-09) /faq — السعودي: سؤالان بارزان + جدول مسطّح ═══
   ليه اتغيّر: صفحة الأسئلة كانت بنفس معمار المعلومات بتاع العشرة معاهد
   التانيين — تلات مجموعات بنفس العناوين والترتيب، وأكورديون مقفول بترقيم
   وعلامة +، وشريط "لم تجد إجابتك؟" ختامي. اللون بس كان بيفرق بينهم.

   المعمار هنا: طبقتان بوزن بصري غير متساوٍ عن قصد —
   (أ) سؤالان بس في بطاقتين كبيرتين بكلاسات .sa-cg الموجودة (أداة تمييز
       السعودي في DESIGN-SYSTEMS.md)، مش نسخة منها عشان أي تعديل عليها
       يمشي على الصفحة دي كمان؛
   (ب) الباقي في جدول واحد برأس أعمدة، وده سطر السعودي بالحرف: "جداول
       بحدود ورؤوس أعمدة، كل شيء مصفوف على شبكة".
   كل الإجابات ظاهرة، فمفيش JS ولا details/summary أصلاً.

   ملاحظة: قواعد .sa-ds-q* اللي فوق بقت غير مستعملة بعد إعادة الكتابة دي
   (مكانتش مستعملة غير في صفحة الأسئلة)، وسِبناها زي ما هي عشان مانلمسش
   قواعد قديمة من غير داعي — مفيش قاعدة اتشالت ولا اتعدّلت.
   ──────────────────────────────────────────────────────────────────── */
body.theme-saudi .sa-fq { background: #f3f5f4; padding: 34px 0 52px; color: #10261a; }
/* عمود مقيّد: الحاوية بتوصل ~1360px، والإجابة على العرض ده بتبقى سطر
   طويل قوي. التقييد هنا بيخلي أوسع خانة إجابة ≈ 70 حرف. */
body.theme-saudi .sa-fq-wrap { max-width: 1120px; margin-inline: auto; }

/* --- عنوان الطبقة الأولى: سطر صغير بحروف متباعدة، مش شريط ملوّن،
       عشان البطاقتين نفسهم يفضلوا هم أتقل حاجة في الشاشة. --- */
body.theme-saudi .sa-fq-eyebrow {
    margin: 0 0 14px;
    font-size: .78rem; font-weight: 700; line-height: 1.4;
    letter-spacing: .18em; text-transform: uppercase; color: #10261a;
}
body.theme-saudi[dir="rtl"] .sa-fq-eyebrow {
    letter-spacing: 0; text-transform: none; font-size: .98rem;
}

/* سطر تمهيدي تحت عنوان الطبقة الأولى — مقيّد بـ68 حرف عشان يفضل سطر قراءة
   مش شريط عرض الصفحة. #3d4a44 على #f3f5f4 = 8.7:1. */
body.theme-saudi .sa-fq-lede {
    margin: 0 0 18px; max-width: 68ch;
    color: #3d4a44; font-size: .96rem; line-height: 1.8;
}

body.theme-saudi .sa-fq-top {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px;
}
/* البطاقة هنا مش رابط، فبنلغي الرفع والظل بتوع بطاقات التصفّح —
   نفس منطق .sa-ct-card--static في صفحة اتصل بنا. */
body.theme-saudi .sa-fq-lead { padding: 30px 26px 28px; gap: 16px; cursor: default; }
body.theme-saudi .sa-fq-lead:hover {
    transform: none; box-shadow: none;
    border-top-color: var(--site-primary, #006233);
}
body.theme-saudi .sa-fq-lead:hover .sa-cg-ico { background: #eef6f1; color: #006233; }
/* السؤال البارز أكبر بـ~40% من سؤال الجدول (.95rem) — الفرق ده هو اللي
   بيخلّي الطبقتين غير متساويتين في الوزن من غير ما نلوّن أو نزخرف. */
body.theme-saudi .sa-fq-lead-q {
    margin: 0; font-size: 1.32rem; font-weight: 800; line-height: 1.4; color: #10261a;
}
/* 60 حرف: البطاقة نص العمود، فالسطر بيفضل مريح من غير ما يتخنق. */
body.theme-saudi .sa-fq-lead-a {
    margin: 0; max-width: 60ch;
    color: #3d4a44;            /* على #fff = 9.3:1 */
    font-size: .97rem; line-height: 1.85;
}

/* --- الجدول: نفس لغة جداول الموقع (حدود شعرية، خانة سؤال رمادية
       فاتحة على البداية، زوايا قايمة). --- */
body.theme-saudi .sa-fq-tbl {
    width: 100%; margin-top: 30px;
    border-collapse: collapse; table-layout: fixed;
    background: #fff; border: 1px solid #cfd9d3;
}
body.theme-saudi .sa-fq-cap {
    caption-side: top; text-align: start;
    background: #006233; color: #fff;   /* أبيض على #006233 = 7.9:1 */
    padding: 13px 22px;
    font-size: .84rem; font-weight: 700; line-height: 1.4;
    letter-spacing: .18em; text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] .sa-fq-cap {
    letter-spacing: 0; text-transform: none; font-size: 1rem;
}
/* رأس الأعمدة فاتح مش مصمت: شريط تاني غامق تحت العنوان الأخضر كان
   هيتقل الجدول ويسحب العين من البطاقتين. */
body.theme-saudi .sa-fq-tbl thead th {
    background: #f6f9f7; color: #10261a; text-align: start;
    padding: 10px 20px; border-block-end: 1px solid #cfd9d3;
    font-size: .72rem; font-weight: 700;
    letter-spacing: .12em; text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] .sa-fq-tbl thead th {
    letter-spacing: 0; text-transform: none; font-size: .86rem;
}
/* مع table-layout:fixed المتصفح بياخد عرض الأعمدة من أول صف (صف الرأس)،
   فلازم النسبة تتحط هنا مش على خلايا الجسم — من غير كده الجدول بينقسم
   نصين متساويين وخانة السؤال تطلع أوسع من اللازم. */
body.theme-saudi .sa-fq-tbl thead th:first-child { width: 34%; }
body.theme-saudi .sa-fq-tbl tbody th,
body.theme-saudi .sa-fq-tbl tbody td {
    padding: 18px 20px; text-align: start; vertical-align: top;
}
body.theme-saudi .sa-fq-tbl tbody th {
    background: #f6f9f7;
    font-size: .95rem; font-weight: 700; line-height: 1.55; color: #10261a;
}
body.theme-saudi .sa-fq-tbl tbody td { border-inline-start: 1px solid #e3eae6; }
body.theme-saudi .sa-fq-tbl tbody td p {
    margin: 0; max-width: 62ch;
    color: #3d4a44; font-size: .94rem; line-height: 1.8;
}
body.theme-saudi .sa-fq-tbl tbody tr + tr th,
body.theme-saudi .sa-fq-tbl tbody tr + tr td { border-block-start: 1px solid #e3eae6; }

@media (max-width: 767px) {
    /* بطاقتان جنب بعض على التابلت/الموبايل بيخنقوا سطر الإجابة. */
    body.theme-saudi .sa-fq-top { grid-template-columns: 1fr; }
    body.theme-saudi .sa-fq-lead { padding: 22px 18px 20px; }
    body.theme-saudi .sa-fq-lead-q { font-size: 1.08rem; }

    /* الجدول بيتفكّ لكتل: عمودين على 390px بيدّوا سطر من كلمتين.
       رأس الأعمدة بيتخفي بصريًا وبيفضل مقروء للقارئ الصوتي. */
    body.theme-saudi .sa-fq-tbl thead {
        position: absolute; width: 1px; height: 1px;
        overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
    }
    body.theme-saudi .sa-fq-tbl,
    body.theme-saudi .sa-fq-tbl tbody,
    body.theme-saudi .sa-fq-tbl tbody tr,
    body.theme-saudi .sa-fq-tbl tbody th,
    body.theme-saudi .sa-fq-tbl tbody td { display: block; width: auto; }
    body.theme-saudi .sa-fq-tbl tbody th { padding: 16px 16px; }
    body.theme-saudi .sa-fq-tbl tbody td {
        background: #fff; border-inline-start: 0; border-block-start: 0;
        padding: 14px 16px 18px;
    }
    body.theme-saudi .sa-fq-tbl tbody tr + tr th { border-block-start: 1px solid #e3eae6; }
}

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

   ليه بادئتين مختلفتين: الصفحتين لازم يبقوا مختلفين عن بعض —
   الداخلية = شريط أرقام + لوحة نموذج بعرض الصفحة،
   العامة   = بطاقة شرط واحدة + جدول عمودين + فقرة نثرية.

   كل الحواف والحشو منطقية (inline-start/end) عشان العربي RTL.
   ============================================================ */

/* ------------------------------------------------------------
   1) /services/in-house-courses
   ------------------------------------------------------------ */

body.theme-saudi .sa-ih {
    background: #f3f5f4;
    padding: 34px 0 48px;
    color: #10261a;                 /* على #f3f5f4 = 13.9:1 */
}

/* --- شريط الحقائق: أرقام حقيقية على اليسار/البداية والنثر على النهاية.
       شريط واحد مش شبكة كروت — الأرقام بيانات مش مزايا. --- */
body.theme-saudi .sa-ih-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px 40px;
    background: #fff;
    border: 1px solid #cfd9d3;
    border-inline-start: 4px solid #006233;
    border-radius: 4px;             /* السعودي: زوايا 4px وحدود ظاهرة */
    padding: 22px 26px;
    margin-block-end: 26px;
}

body.theme-saudi .sa-ih-stats {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0;
    margin: 0;
    /* 0 1 auto مش 0 0 auto: مع flex-basis ثابت الشريط كان بيرفض ينكمش
       فيخرج بره الشاشة على 390px بدل ما ينزل سطر. */
    flex: 0 1 auto;
    min-width: 0;
}
body.theme-saudi .sa-ih-stat { padding-inline-end: 26px; }
/* الفاصل بين رقم ورقم بدل ما كل رقم يبقى كارت مستقل */
body.theme-saudi .sa-ih-stat + .sa-ih-stat {
    border-inline-start: 1px solid #dfe6e1;
    padding-inline-start: 26px;
}
body.theme-saudi .sa-ih-stat-n {
    display: block;
    margin: 0;
    font-size: 2.1rem;
    font-weight: 800;
    line-height: 1.1;
    color: #006233;                 /* على #fff = 7.9:1 */
    font-variant-numeric: tabular-nums;
}
body.theme-saudi .sa-ih-stat-l {
    display: block;
    margin: 4px 0 0;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #3d4a44;                 /* على #fff = 9.3:1 */
}
/* العربي مالوش حروف كبيرة، والتباعد بيفكّك الكلمة */
body.theme-saudi[dir="rtl"] .sa-ih-stat-l {
    letter-spacing: 0; text-transform: none; font-size: .88rem;
}

/* المزايا الأربع مدموجة في سطر نثري — 68 حرف عشان القراءة تفضل مريحة */
body.theme-saudi .sa-ih-why {
    flex: 1 1 340px;
    margin: 0;
    max-width: 68ch;
    color: #3d4a44;
    font-size: .95rem;
    line-height: 1.85;
}

/* --- اللوحة: النموذج بعرض الصفحة --- */
body.theme-saudi .sa-ih-panel {
    background: #fff;
    border: 1px solid #cfd9d3;
    border-radius: 4px;
    /* الرابط في البانر بينط هنا، والهيدر اللاصق كان بيغطي أول اللوحة */
    scroll-margin-block-start: 90px;
}
body.theme-saudi .sa-ih-panel-hd {
    background: #006233;
    border-block-end: 4px solid #f7c608;
    border-radius: 4px 4px 0 0;
    padding: 14px 24px;
}
body.theme-saudi .sa-ih-panel-hd h2 {
    margin: 0;
    font-size: .9rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #fff;                    /* على #006233 = 7.9:1 */
    line-height: 1.45;
}
body.theme-saudi[dir="rtl"] .sa-ih-panel-hd h2 {
    letter-spacing: 0; text-transform: none; font-size: 1.06rem;
}
body.theme-saudi .sa-ih-panel-bd { padding: 26px 24px 30px; }

/* الشرح جملة واحدة فوق النموذج — مش كتلة بنود */
body.theme-saudi .sa-ih-lede {
    margin: 0 0 26px;
    max-width: 70ch;
    color: #3d4a44;
    font-size: 1rem;
    line-height: 1.85;
}

/* --- النموذج: خانات بعناوين ظاهرة مصفوفة على شبكة ثلاثية --- */
body.theme-saudi .sa-ihf-set {
    border: 0;
    padding: 0;
    margin: 0 0 28px;
    min-width: 0;                   /* fieldset بيرفض ينكمش جوّه grid من غيرها */
}
body.theme-saudi .sa-ihf-set:last-of-type { margin-block-end: 22px; }

body.theme-saudi .sa-ihf-leg {
    display: block;
    float: none;
    width: 100%;
    padding: 0 0 10px;
    margin: 0 0 18px;
    border-block-end: 2px solid #006233;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #10261a;                 /* على #fff = 15.8:1 */
    line-height: 1.5;
}
body.theme-saudi[dir="rtl"] .sa-ihf-leg {
    letter-spacing: 0; text-transform: none; font-size: 1rem;
}
/* مفتاح الترجمة نفسه فيه <span>الخطوة ١</span> — بنخليها شارة بدل نص سايب */
body.theme-saudi .sa-ihf-leg span {
    display: inline-block;
    background: #006233;
    color: #fff;
    border-radius: 4px;
    padding: 3px 10px;
    margin-inline-end: 10px;
    font-size: .72rem;
    letter-spacing: .08em;
}
body.theme-saudi[dir="rtl"] .sa-ihf-leg span { letter-spacing: 0; font-size: .8rem; }

body.theme-saudi .sa-ihf-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 18px;
}
body.theme-saudi .sa-ihf-w2 { grid-column: span 2; }
body.theme-saudi .sa-ihf-w3 { grid-column: span 3; }

body.theme-saudi .sa-ihf-f { min-width: 0; }
body.theme-saudi .sa-ihf-lab {
    display: block;
    margin: 0 0 6px;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #3d4a44;                 /* على #fff = 9.3:1 */
    line-height: 1.4;
}
body.theme-saudi[dir="rtl"] .sa-ihf-lab {
    letter-spacing: 0; text-transform: none; font-size: .88rem;
}
/* النجمة كانت ملزوقة في الـplaceholder؛ بقت abbr بعنوان، والأخضر
   (7.9:1) أوضح من الذهبي اللي مالوش تباين على الأبيض. */
body.theme-saudi .sa-ihf-req {
    color: #006233;
    text-decoration: none;
    border: 0;
    font-weight: 700;
}

/* السطر 11 في الملف ده بيدّي كل .form-control زوايا 12px بـ!important —
   القاعدة دي مالهاش لازمة تتغيّر (كل الموقع عليها)، فبنستثني النموذج ده
   بس عشان يمشي مع زوايا الـ4px بتاعة صفحة "ورقة المواصفات". */
body.theme-saudi .sa-ihf .form-control {
    border: 1px solid #cfd9d3 !important;
    border-radius: 4px !important;
    height: 44px;
    padding: 0 14px;
    width: 100%;
    background: #fff;
    color: #10261a;
    font-size: .95rem;
    box-shadow: none;
}
body.theme-saudi .sa-ihf textarea.form-control {
    height: auto;
    min-height: 120px;
    padding: 12px 14px;
    line-height: 1.7;
}
body.theme-saudi .sa-ihf .form-control:focus {
    border-color: #006233 !important;
    outline: 2px solid rgba(0, 98, 51, .28);
    outline-offset: 1px;
}

body.theme-saudi .sa-ihf-act {
    border-block-start: 1px solid #dfe6e1;
    padding-block-start: 22px;
}
body.theme-saudi .sa-ihf-btn {
    background: #006233 !important;
    border: 1px solid #006233 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 12px 34px;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] .sa-ihf-btn {
    letter-spacing: 0; text-transform: none; font-size: .95rem;
}
body.theme-saudi .sa-ihf-btn:hover,
body.theme-saudi .sa-ihf-btn:focus {
    background: #10261a !important;
    border-color: #10261a !important;
}

/* رسالة النجاح/الخطأ بتتحقن من inhouse.js فوق النموذج */
body.theme-saudi .sa-ihf #message_inhouse:not(:empty) { margin-block-end: 20px; }

@media (max-width: 991px) {
    body.theme-saudi .sa-ihf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.theme-saudi .sa-ihf-w2,
    body.theme-saudi .sa-ihf-w3 { grid-column: span 2; }
}
@media (max-width: 575px) {
    body.theme-saudi .sa-ih-bar { padding: 18px 16px; gap: 18px 24px; }
    /* على 390px الشريط بيبقى شبكة تلات خانات بعرض الكارت: الفلكس كان
       بيخلّي الأرقام تفضل في سطر واحد وتخرج بره الشاشة. */
    body.theme-saudi .sa-ih-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }
    body.theme-saudi .sa-ih-stat { padding-inline-end: 10px; }
    body.theme-saudi .sa-ih-stat + .sa-ih-stat { padding-inline-start: 10px; }
    body.theme-saudi .sa-ih-stat-n { font-size: 1.6rem; }
    body.theme-saudi .sa-ih-stat-l { font-size: .68rem; letter-spacing: .04em; }
    body.theme-saudi[dir="rtl"] .sa-ih-stat-l { font-size: .8rem; letter-spacing: 0; }
    body.theme-saudi .sa-ih-panel-bd { padding: 20px 16px 24px; }
    body.theme-saudi .sa-ihf-grid { grid-template-columns: minmax(0, 1fr); }
    body.theme-saudi .sa-ihf-w2,
    body.theme-saudi .sa-ihf-w3 { grid-column: span 1; }
    body.theme-saudi .sa-ihf-btn { width: 100%; padding-inline: 12px; }
}

/* ------------------------------------------------------------
   2) /services/public-courses
   ------------------------------------------------------------ */

body.theme-saudi .sa-pc {
    background: #f3f5f4;
    padding: 34px 0 48px;
    color: #10261a;
}

/* --- البطاقة الوحيدة: الشرط الأهم. الحد الذهبي على البداية بيميّزها عن
       اللوحة الخضراء بتاعة صفحة الدورات الداخلية. --- */
body.theme-saudi .sa-pc-key {
    background: #fff;
    border: 1px solid #cfd9d3;
    border-inline-start: 6px solid #f7c608;
    border-radius: 4px;
    padding: 28px 30px 26px;
    margin-block-end: 30px;
    /* نفس نسبة عمودَي الجدول تحت (32% / الباقي) عشان البطاقة والجدول
       يبانوا على شبكة واحدة — ده اللي بيمنع البطاقة تبقى صندوق فاضي عريض. */
    display: grid;
    grid-template-columns: 32% minmax(0, 1fr);
    gap: 0 30px;
    align-items: start;
}
body.theme-saudi .sa-pc-key-l { min-width: 0; }
body.theme-saudi .sa-pc-key-r { min-width: 0; }
body.theme-saudi .sa-pc-key-kick {
    margin: 0 0 8px;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #006233;                 /* على #fff = 7.9:1 */
}
body.theme-saudi[dir="rtl"] .sa-pc-key-kick {
    letter-spacing: 0; text-transform: none; font-size: .9rem;
}
body.theme-saudi .sa-pc-key-h {
    margin: 0 0 12px;
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.35;
    color: #10261a;
}
body.theme-saudi .sa-pc-key-p {
    margin: 0 0 22px;
    max-width: 68ch;
    color: #3d4a44;
    font-size: 1rem;
    line-height: 1.85;
}
body.theme-saudi .sa-pc-key-act {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 22px;
    margin: 0;
}
/* زر رئيسي واحد + رابط نصي — مش زرارين متساويين */
body.theme-saudi .sa-pc-btn {
    background: #006233 !important;
    border: 1px solid #006233 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 11px 28px;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] .sa-pc-btn {
    letter-spacing: 0; text-transform: none; font-size: .95rem;
}
body.theme-saudi .sa-pc-btn:hover,
body.theme-saudi .sa-pc-btn:focus {
    background: #10261a !important;
    border-color: #10261a !important;
}
body.theme-saudi .sa-pc-link {
    color: #006233;                 /* على #fff = 7.9:1 */
    font-weight: 700;
    font-size: .95rem;
    text-decoration: underline;
    text-underline-offset: 4px;
}
body.theme-saudi .sa-pc-link:hover,
body.theme-saudi .sa-pc-link:focus { color: #10261a; }

/* --- الجدول: أداة الموقع في عرض القوائم (حدود ظاهرة، خانة عنوان
       رمادية فاتحة على البداية، زوايا قايمة). --- */
body.theme-saudi .sa-pc-tbl {
    width: 100%;
    margin: 0 0 26px;
    border-collapse: collapse;
    table-layout: fixed;
    background: #fff;
    border: 1px solid #cfd9d3;
}
body.theme-saudi .sa-pc-cap {
    caption-side: top;
    text-align: start;
    background: #006233;
    color: #fff;
    padding: 13px 22px;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    line-height: 1.4;
}
body.theme-saudi[dir="rtl"] .sa-pc-cap {
    letter-spacing: 0; text-transform: none; font-size: 1rem;
}
body.theme-saudi .sa-pc-tbl thead th {
    background: #f6f9f7;
    color: #10261a;
    text-align: start;
    padding: 10px 20px;
    border-block-end: 1px solid #cfd9d3;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] .sa-pc-tbl thead th {
    letter-spacing: 0; text-transform: none; font-size: .86rem;
}
/* مع table-layout:fixed العرض بيتاخد من صف الرأس، فالنسبة لازم تتحط هنا */
body.theme-saudi .sa-pc-tbl thead th:first-child { width: 32%; }
body.theme-saudi .sa-pc-tbl tbody th,
body.theme-saudi .sa-pc-tbl tbody td {
    padding: 18px 20px;
    text-align: start;
    vertical-align: top;
}
body.theme-saudi .sa-pc-tbl tbody th {
    background: #f6f9f7;
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.55;
    color: #10261a;
}
body.theme-saudi .sa-pc-tbl tbody td { border-inline-start: 1px solid #e3eae6; }
body.theme-saudi .sa-pc-tbl tbody td p {
    margin: 0;
    max-width: 64ch;
    color: #3d4a44;
    font-size: .95rem;
    line-height: 1.8;
}
body.theme-saudi .sa-pc-tbl tbody tr + tr th,
body.theme-saudi .sa-pc-tbl tbody tr + tr td { border-block-start: 1px solid #e3eae6; }

/* الشرطان الباقيان نص جارٍ — مش بنود ولا كروت */
body.theme-saudi .sa-pc-fine {
    margin: 0;
    max-width: 72ch;
    color: #3d4a44;
    font-size: .95rem;
    line-height: 1.9;
}

@media (max-width: 767px) {
    /* عمود واحد: 32% للعنوان على موبايل بيدّي سطر من كلمة */
    body.theme-saudi .sa-pc-key {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px 0;
        padding: 22px 18px 20px;
    }
    body.theme-saudi .sa-pc-key-h { font-size: 1.22rem; margin-block-end: 0; }

    /* عمودين على 390px بيدّوا سطر من كلمتين — الجدول بيتفكّ لكتل،
       ورأس الأعمدة بيفضل مقروء للقارئ الصوتي بس. */
    body.theme-saudi .sa-pc-tbl thead {
        position: absolute; width: 1px; height: 1px;
        overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
    }
    /* لازم البلوك يشمل الـcaption كمان: مع table بلوك والـcaption سايبة
       table-caption المتصفح بيعمل صندوق جدول مجهول وبيطلّع الشريط الأخضر
       بعرض الكلمة بس. */
    body.theme-saudi .sa-pc-cap { display: block; }
    body.theme-saudi .sa-pc-tbl,
    body.theme-saudi .sa-pc-tbl tbody,
    body.theme-saudi .sa-pc-tbl tbody tr,
    body.theme-saudi .sa-pc-tbl tbody th,
    body.theme-saudi .sa-pc-tbl tbody td { display: block; width: auto; }
    body.theme-saudi .sa-pc-tbl tbody th { padding: 16px 16px; }
    body.theme-saudi .sa-pc-tbl tbody td {
        background: #fff;
        border-inline-start: 0;
        border-block-start: 0;
        padding: 14px 16px 18px;
    }
    body.theme-saudi .sa-pc-tbl tbody tr + tr th { border-block-start: 1px solid #e3eae6; }
    body.theme-saudi .sa-pc-btn { width: 100%; text-align: center; padding-inline: 12px; }
}

/* ═══ (2026-09-09) /clients — السعودي: بطاقتان + جدول عائلتين ═══
   ليه: كتلة القطاعات كانت عشرة بنود متساوية الوزن — نفس عدد وترتيب باقي
   المعاهد، فالصفحة كانت بتفضح إن اللي صممها هو اللي صمم الباقي. المعمار
   الجديد بيدّي وزنًا بصريًا غير متساوٍ عمدًا: قطاعان في بطاقتين كبيرتين
   بلغة .sa-cg (نفس بطاقات /categories و/cities و/contact-us عشان السعودي
   يفضل متماسك جوّه نفسه)، والثمانية الباقية قيم داخل جدول من صفّين.

   البادئة .sa-cl- جديدة بالكامل ومافيش قاعدة قديمة اتغيّرت؛ اللي بيتّاخد
   من القديم هو .sa-cg-* و.sa-ds-foot زي ما هم، والتعديلات عليهم كلها
   مقصورة على .sa-cl-card (أي جوّه صفحة العملاء بس).
   ───────────────────────────────────────────────────────────── */

/* سطر التعريف: خط ذهبي قصير بدل شريط أخضر بعرض الحاوية — الشريط الأخضر
   لغة "عنوان قائمة" وإحنا بنتجنّبها هنا بالذات. */
body.theme-saudi .sa-cl-kicker {
    margin: 0 0 14px;
    padding-inline-start: 14px;
    border-inline-start: 4px solid #f7c608;
    color: #10261a;                 /* على #f3f5f4 = 14:1 */
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    line-height: 1.5;
}
body.theme-saudi[dir="rtl"] .sa-cl-kicker {
    letter-spacing: 0; text-transform: none; font-size: 1rem;
}

body.theme-saudi .sa-cl-lead {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 0 0 30px;
}

/* البطاقة هنا معلومة مش رابط: الأيقونة جنب النص (مش فوقه) عشان تاخد
   عرض النص الكبير، ومن غير رفع ولا ظل عند المرور لأنها مش قابلة للضغط. */
body.theme-saudi .sa-cl-card {
    flex-direction: row;
    align-items: center;
    gap: 20px;
    padding: 34px 28px;
    border-top-color: #006233;
    border-radius: 4px;             /* زوايا 4px = شكل الموقع */
}
body.theme-saudi .sa-cl-card:hover,
body.theme-saudi .sa-cl-card:focus-visible {
    transform: none;
    box-shadow: none;
    border-top-color: #006233;
}
body.theme-saudi .sa-cl-card:hover .sa-cg-ico { background: #eef6f1; color: #006233; }
body.theme-saudi .sa-cl-card .sa-cg-ico { width: 66px; height: 66px; font-size: 1.9rem; }
body.theme-saudi .sa-cl-body { display: block; }
/* السطر العلوي هنا اسم عائلة، فلازم يعدّي 4.5:1: #5a6f66 على #fff = 5.3:1 */
body.theme-saudi .sa-cl-card .sa-cg-eyebrow { display: block; margin: 0 0 2px; color: #5a6f66; }
body.theme-saudi .sa-cl-card .sa-cg-name { display: block; font-size: 1.42rem; line-height: 1.35; }

/* --- جدول العائلتين: نفس لغة جداول الموقع (حدود ظاهرة، خانة عنوان
       رمادية فاتحة على البداية، زوايا قايمة). رأس الجدول فحمي مش أخضر
       عشان الأخضر فضل للبطاقتين، فالعين تفرّق بين المستويين. --- */
body.theme-saudi .sa-cl-tbl {
    width: 100%;
    margin: 0 0 26px;
    border-collapse: collapse;
    table-layout: fixed;
    background: #fff;
    border: 1px solid #cfd9d3;
}
body.theme-saudi .sa-cl-cap {
    caption-side: top;
    text-align: start;
    background: #10261a;            /* أبيض عليه = 15:1 */
    color: #fff;
    padding: 13px 22px;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    line-height: 1.4;
}
body.theme-saudi[dir="rtl"] .sa-cl-cap {
    letter-spacing: 0; text-transform: none; font-size: 1rem;
}
body.theme-saudi .sa-cl-tbl thead th {
    background: #f6f9f7;
    color: #10261a;
    text-align: start;
    padding: 10px 20px;
    border-block-end: 1px solid #cfd9d3;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] .sa-cl-tbl thead th {
    letter-spacing: 0; text-transform: none; font-size: .86rem;
}
/* مع table-layout:fixed العرض بيتاخد من صف الرأس */
body.theme-saudi .sa-cl-tbl thead th:first-child { width: 30%; }
body.theme-saudi .sa-cl-tbl tbody th,
body.theme-saudi .sa-cl-tbl tbody td {
    padding: 18px 20px;
    text-align: start;
    vertical-align: top;
}
body.theme-saudi .sa-cl-tbl tbody th {
    background: #f6f9f7;
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.55;
    color: #10261a;
}
body.theme-saudi .sa-cl-tbl tbody td { border-inline-start: 1px solid #e3eae6; }
body.theme-saudi .sa-cl-tbl tbody tr + tr th,
body.theme-saudi .sa-cl-tbl tbody tr + tr td { border-block-start: 1px solid #e3eae6; }

/* القطاعات جوّه الخانة نص متتابع بفواصل نقطية — مش بنود ولا رقاقات،
   عشان ما يرجعش نمط "بند لكل قطاع" اللي بنهرب منه. الفاصل قبل البند
   التالي (مش بعد السابق) فبيتقلب صح في RTL من غير قواعد اتجاه. */
body.theme-saudi .sa-cl-tags {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 10px;
}
body.theme-saudi .sa-cl-tags li {
    color: #26332d;                 /* على #fff = 11:1 */
    font-size: .98rem;
    line-height: 1.9;
}
/* الفاصل جوّه البند السابق (::after) مش قبل التالي: كده النقطة بتفضل
   لازقة في آخر الاسم وما تقدرش تبتدي بيها سطر لما القائمة تلفّ على
   التليفون. في RTL بتروح تلقائيًا لنهاية البند المنطقية (الشمال). */
body.theme-saudi .sa-cl-tags li:not(:last-child)::after {
    content: "·";
    color: #93a89e;
    margin-inline-start: 10px;
}

@media (max-width: 767px) {
    /* عمود واحد للبطاقتين، والجدول بيتفكّ لكتل: صفّان × عمودين على 390px
       بيخنقوا قائمة القطاعات ويسببوا تجاوز أفقي. رأس الأعمدة بيفضل
       موجودًا للقارئ الصوتي بس. */
    body.theme-saudi .sa-cl-lead { grid-template-columns: 1fr; }
    body.theme-saudi .sa-cl-card { padding: 20px 18px; gap: 14px; }
    body.theme-saudi .sa-cl-card .sa-cg-name { font-size: 1.12rem; }
    body.theme-saudi .sa-cl-tbl thead {
        position: absolute; width: 1px; height: 1px;
        overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
    }
    /* لازم الـcaption تبقى بلوك مع الجدول، وإلا المتصفح بيعمل صندوق
       جدول مجهول ويطلّع الشريط بعرض الكلمة بس. */
    body.theme-saudi .sa-cl-cap { display: block; }
    body.theme-saudi .sa-cl-tbl,
    body.theme-saudi .sa-cl-tbl tbody,
    body.theme-saudi .sa-cl-tbl tbody tr,
    body.theme-saudi .sa-cl-tbl tbody th,
    body.theme-saudi .sa-cl-tbl tbody td { display: block; width: auto; }
    body.theme-saudi .sa-cl-tbl tbody th { padding: 14px 16px; }
    body.theme-saudi .sa-cl-tbl tbody td {
        background: #fff;
        border-inline-start: 0;
        border-block-start: 0;
        padding: 12px 16px 16px;
    }
    body.theme-saudi .sa-cl-tbl tbody tr + tr th { border-block-start: 1px solid #e3eae6; }
}

/* (2026-09-09) زرار "Clear" في الفلتر الجانبي كان #9aa39e على أبيض —
   تباين 2.59:1، تحت الحد. بلون المعهد الأخضر بقى فوق 6:1. */
body.theme-saudi .inst-tc-side-reset { color: var(--site-primary, #006233) !important; }
body.theme-saudi .inst-tc-side-reset:hover { color: #0a3b22 !important; }


/* ============================================================
   صفحات النماذج الثلاثة — المعهد السعودي (2026-09-09)
   ------------------------------------------------------------
   إضافة في آخر الملف فقط. مافيش قاعدة قديمة اتعدّلت ولا اتشالت.

   ليه تلات بادئات مختلفة: التلات صفحات لازم يبقوا مختلفين عن بعض،
   مش نسخ بألوان واحدة:
     .sa-rg-  /register        شريط أرقام أخضر ← لوحة بعرض الصفحة بحدّ
                               أخضر علوي وشبكة حقول عمودين ← جدول إرشاد صفّين.
     .sa-ip-  /in-house-...    بطاقتان بأيقونة ← لوحة **أضيق** وحقول
                               صفوف [عنوان | خانة] وترتيب مقلوب (المستفسر أولاً).
     .sa-cf-  /course-finder   شريط عنوان أخضر ← لوحة صفوف للباحث ←
                               نتايج ← شبكة بطاقات التخصصات كطريق تاني.

   الرفع في التخصيص (#register-section.sa-rg …) مقصود: القواعد المشتركة
   في _brand.css و_institute.css بتلوّن .tabHead و.nav-link و.fees-box
   بـ!important، فمن غير كده كانت هتغلب.

   كل الحواف والحشو منطقية (inline-start/end) عشان العربي RTL.
   ============================================================ */

/* ------------------------------------------------------------
   1) /register
   ------------------------------------------------------------ */

body.theme-saudi #register-section.sa-rg {
    background: #f3f5f4;
    padding: 26px 0 48px;
    color: #10261a;                       /* على #f3f5f4 = 13.9:1 */
}

/* --- شريط الأرقام: شريط أخضر مصمت بخط ذهبي سفلي، الأرقام جنب بعض
       بفواصل رفيعة. مش شبكة كروت — دي بيانات مش "مزايا". --- */
body.theme-saudi .sa-rg-nums {
    display: flex;
    flex-wrap: wrap;
    background: #006233;
    border-block-end: 4px solid #f7c608;
    border-radius: 4px 4px 0 0;
    padding: 16px 24px;
    gap: 10px 0;
}
body.theme-saudi .sa-rg-num {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding-inline-end: 26px;
}
body.theme-saudi .sa-rg-num + .sa-rg-num {
    padding-inline-start: 26px;
    border-inline-start: 1px solid rgba(255, 255, 255, .28);
}
body.theme-saudi .sa-rg-num-n {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.1;
    color: #f7c608;                       /* على #006233 = 5.1:1، فوق حد 3:1 للنص الكبير */
}
body.theme-saudi .sa-rg-num-l {
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #fff;                          /* على #006233 = 7.5:1 */
}
/* العربي: الحروف موصولة، فالتباعد والحروف الكبيرة بيفكّوا الكلمة. */
body.theme-saudi[dir="rtl"] .sa-rg-num-l {
    letter-spacing: 0; text-transform: none; font-size: .88rem;
}

body.theme-saudi #register-section.sa-rg .sa-rg-h1 {
    margin: 26px 0 14px;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #10261a;
    line-height: 1.4;
}
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rg-h1 {
    letter-spacing: 0; text-transform: none; font-size: 1.7rem;
}

/* --- اللوحة: بعرض الحاوية كلها، حدّ أخضر علوي (مش شريط عنوان مصمت زي
       لوحة /services/in-house-courses — لازم يفرقوا). --- */
body.theme-saudi .sa-rg-panel {
    background: #fff;
    border: 1px solid #cfd9d3;
    border-block-start: 5px solid #006233;
    border-radius: 4px;
}
body.theme-saudi .sa-rg-panel-bd { padding: 24px; }

/* --- عناوين المجموعات: خط أخضر تحت سطر صغير — مش شريط ملوّن. --- */
body.theme-saudi .sa-rgf-set {
    border: 0;
    padding: 0;
    margin: 0 0 30px;
    min-width: 0;                         /* fieldset بيرفض ينكمش من غيرها */
}
body.theme-saudi .sa-rgf-set:last-of-type { margin-block-end: 0; }
body.theme-saudi .sa-rgf-leg {
    display: block;
    float: none;
    width: 100%;
    padding: 0 0 10px;
    margin: 0 0 20px;
    border-block-end: 2px solid #006233;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #10261a;                       /* على #fff = 15.9:1 */
    line-height: 1.5;
}
body.theme-saudi[dir="rtl"] .sa-rgf-leg {
    letter-spacing: 0; text-transform: none; font-size: 1rem;
}

/* --- شبكة عمودين --- */
body.theme-saudi .sa-rgf-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 20px;
}
body.theme-saudi .sa-rgf-w2 { grid-column: span 2; }
body.theme-saudi .sa-rgf-f  { min-width: 0; }

body.theme-saudi .sa-rgf-lab {
    display: block;
    margin: 0 0 6px;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #3d4a44;                       /* على #fff = 9.3:1 */
    line-height: 1.4;
}
body.theme-saudi[dir="rtl"] .sa-rgf-lab {
    letter-spacing: 0; text-transform: none; font-size: .88rem;
}
body.theme-saudi .sa-rgf-req {
    color: #006233; text-decoration: none; border: 0; font-weight: 700;
}

/* الخانات: نفس زوايا الـ4px بتاعة الموقع. التخصيص عالي عشان يغلب
   body.pg-training-courses #register-section .form-control{border-radius:6px}. */
body.theme-saudi #register-section.sa-rg .sa-rgf .form-control {
    height: 44px;
    padding: 0 12px;
    width: 100%;
    background: #fff;
    border: 1px solid #cfd9d3;
    border-radius: 4px;
    color: #10261a;
    font-size: .95rem;
    box-shadow: none;
}
body.theme-saudi #register-section.sa-rg .sa-rgf .form-control:focus {
    border-color: #006233;
    outline: 2px solid rgba(0, 98, 51, .28);
    outline-offset: 1px;
}
body.theme-saudi #register-section.sa-rg .sa-rgf .form-control::placeholder { color: #667b71; }

/* بطاقة الرسوم: _brand.css بيصبغ .fees-box ذهبي بـ!important — بنسيب
   الذهبي (علامة الموقع) وبنظبط الحبر عليه: #10261a على #f7c608 = 10.7:1. */
body.theme-saudi #register-section.sa-rg .sa-rgf .fees-box {
    border-radius: 4px !important;
    padding: 10px 14px;
    min-height: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #10261a !important;
}
body.theme-saudi #register-section.sa-rg .sa-rgf .fees-box h4,
body.theme-saudi #register-section.sa-rg .sa-rgf .fees-box h6,
body.theme-saudi #register-section.sa-rg .sa-rgf .fees-box p {
    margin: 0; color: #10261a !important;
}
body.theme-saudi #register-section.sa-rg .sa-rgf .fees-box h6 { font-size: .72rem; font-weight: 700; }
body.theme-saudi #register-section.sa-rg .sa-rgf .fees-box h4 { font-size: 1.2rem; font-weight: 700; }
body.theme-saudi #register-section.sa-rg .sa-rgf #register_fees .row { margin: 0; }
body.theme-saudi #register-section.sa-rg .sa-rgf #register_fees .col-md-12 { padding: 0; }

/* جدول المواعيد: بيلفّ لوحده لو ضاق — الصفحة نفسها عمرها ما بتسكرول أفقي. */
body.theme-saudi .sa-rgf #no-more-tables { overflow-x: auto; }
body.theme-saudi #register-section.sa-rg .sa-rgf #schedule {
    width: 100%;
    border: 1px solid #dfe6e1;
    font-size: .9rem;
}
body.theme-saudi #register-section.sa-rg .sa-rgf #schedule th {
    background: #eef3f0;
    color: #10261a;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 8px 10px;
}
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rgf #schedule th {
    letter-spacing: 0; text-transform: none; font-size: .85rem;
}
body.theme-saudi #register-section.sa-rg .sa-rgf #schedule td { padding: 8px 10px; }

/* --- التبويبان: _brand.css بيصبغ .nav-link ذهبي بـ!important، فبنغلبه
       عشان التبويب النشط يبقى الأخضر والباقي رمادي فاتح. --- */
body.theme-saudi #register-section.sa-rg .sa-rgf-tabs {
    border-block-end: 2px solid #006233;
    gap: 4px;
    flex-wrap: wrap;
}
body.theme-saudi #register-section.sa-rg .sa-rgf-tabs .nav-link {
    background: #eef3f0 !important;
    color: #10261a !important;
    border: 0 !important;
    border-radius: 4px 4px 0 0 !important;
    padding: 10px 16px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rgf-tabs .nav-link {
    letter-spacing: 0; text-transform: none; font-size: .92rem;
}
body.theme-saudi #register-section.sa-rg .sa-rgf-tabs .nav-link.active {
    background: #006233 !important;
    color: #fff !important;               /* على #006233 = 7.5:1 */
    box-shadow: inset 0 -4px 0 #f7c608;
}

body.theme-saudi .sa-rgf-panes { padding-block-start: 20px; }
/* company_tab بيجي من الملف المشترك بماركب bootstrap — بنظبطه بالـCSS بس
   لأن register.js بيحقن المشاركين بنفس الماركب ده. */
body.theme-saudi #register-section.sa-rg .sa-rgf .search-inner-box h5 {
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #006233;                       /* على #fff = 7.5:1 */
    margin: 0 0 14px;
}
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rgf .search-inner-box h5 {
    letter-spacing: 0; text-transform: none; font-size: .95rem;
}
body.theme-saudi #register-section.sa-rg .sa-rgf #participants,
body.theme-saudi #register-section.sa-rg .sa-rgf #participants + .col-md-12 {
    background: transparent;
}
body.theme-saudi #register-section.sa-rg .sa-rgf .addmore-participents,
body.theme-saudi #register-section.sa-rg .sa-rgf .remove-participents {
    background: #fff !important;
    color: #006233 !important;
    border: 1px solid #006233 !important;
    border-radius: 4px !important;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rgf .addmore-participents,
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rgf .remove-participents {
    letter-spacing: 0; text-transform: none; font-size: .92rem;
}

/* --- منطقة الإجراء --- */
body.theme-saudi .sa-rgf-act {
    border-block-start: 1px solid #dfe6e1;
    margin-block-start: 22px;
    padding-block-start: 20px;
}
body.theme-saudi .sa-rgf-check {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0 0 10px;
    font-weight: 400;
    font-size: .88rem;
    line-height: 1.7;
    color: #3d4a44;                       /* على #fff = 9.3:1 */
    max-width: 74ch;
}
body.theme-saudi .sa-rgf-check input { margin-block-start: 5px; flex: 0 0 auto; }
body.theme-saudi .sa-rgf-check a { color: #006233; text-decoration: underline; }

body.theme-saudi .sa-rgf-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-block-start: 18px;
}
/* زر رئيسي واحد مصمت + زر ثانوي بإطار: القيمتان (other/cc) مسارا دفع
   مختلفان فلازم يفضلوا الاتنين، بس الأولوية البصرية لواحد. */
body.theme-saudi #register-section.sa-rg .sa-rgf-btn {
    background: #006233 !important;
    border: 1px solid #006233 !important;
    color: #fff !important;               /* 7.5:1 */
    border-radius: 4px !important;
    padding: 12px 28px;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}
body.theme-saudi #register-section.sa-rg .sa-rgf-btn2 {
    background: #fff !important;
    border: 1px solid #006233 !important;
    color: #006233 !important;            /* 7.5:1 */
    border-radius: 4px !important;
    padding: 12px 28px;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rgf-btn,
body.theme-saudi[dir="rtl"] #register-section.sa-rg .sa-rgf-btn2 {
    letter-spacing: 0; text-transform: none; font-size: .95rem;
}
body.theme-saudi #register-section.sa-rg .sa-rgf-btn:hover,
body.theme-saudi #register-section.sa-rg .sa-rgf-btn:focus {
    background: #10261a !important; border-color: #10261a !important;
}
body.theme-saudi #register-section.sa-rg .sa-rgf-btn2:hover,
body.theme-saudi #register-section.sa-rg .sa-rgf-btn2:focus {
    background: #eef3f0 !important;
}

body.theme-saudi .sa-rgf-note,
body.theme-saudi .sa-rgf-privacy {
    margin: 14px 0 0;
    max-width: 74ch;
    font-size: .82rem;
    line-height: 1.75;
    color: #3d4a44;
}
body.theme-saudi .sa-rgf-privacy a { color: #006233; text-decoration: underline; }
body.theme-saudi .sa-rgf #message_register:not(:empty) { margin-block-end: 18px; }

/* --- جدول الإرشاد: صفّان بس (الرسوم / التواصل). جدول لأن أداة عرض
       المعلومات في الموقع ده جدول بحدود ظاهرة ورأس صف — مش كروت. --- */
body.theme-saudi .sa-rg-guide {
    width: 100%;
    margin-block-start: 22px;
    background: #fff;
    border: 1px solid #cfd9d3;
    border-radius: 4px;
    border-collapse: collapse;
}
body.theme-saudi .sa-rg-guide th,
body.theme-saudi .sa-rg-guide td {
    padding: 14px 18px;
    vertical-align: top;
    font-size: .88rem;
    line-height: 1.75;
    text-align: start;
}
body.theme-saudi .sa-rg-guide th {
    width: 22%;
    background: #eef3f0;
    color: #10261a;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    white-space: nowrap;
}
body.theme-saudi[dir="rtl"] .sa-rg-guide th {
    letter-spacing: 0; text-transform: none; font-size: .9rem;
}
body.theme-saudi .sa-rg-guide td { color: #3d4a44; }
body.theme-saudi .sa-rg-guide tr + tr th,
body.theme-saudi .sa-rg-guide tr + tr td { border-block-start: 1px solid #e3eae6; }
body.theme-saudi .sa-rg-guide a { color: #006233; text-decoration: underline; }
/* الفاصل نقطة نصية، فلازم يعدّي 4.5:1: #667b71 على #fff = 4.6:1
   (#9aa8a1 كان 2.6:1). */
body.theme-saudi .sa-rg-guide-sep { color: #667b71; padding: 0 6px; }

@media (max-width: 767px) {
    body.theme-saudi .sa-rgf-grid { grid-template-columns: minmax(0, 1fr); }
    body.theme-saudi .sa-rgf-w2 { grid-column: span 1; }
    body.theme-saudi .sa-rg-panel-bd { padding: 18px 14px 22px; }
    body.theme-saudi .sa-rg-nums { padding: 14px 16px; }
    body.theme-saudi .sa-rg-num { padding-inline-end: 14px; }
    body.theme-saudi .sa-rg-num + .sa-rg-num { padding-inline-start: 14px; }
    body.theme-saudi .sa-rg-num-n { font-size: 1.15rem; }
    body.theme-saudi .sa-rg-num-l { font-size: .64rem; letter-spacing: .04em; }
    body.theme-saudi[dir="rtl"] .sa-rg-num-l { font-size: .76rem; letter-spacing: 0; }
    /* الجدول بيتحوّل لصفوف مكدّسة عشان ما يخرجش بره الشاشة */
    body.theme-saudi .sa-rg-guide,
    body.theme-saudi .sa-rg-guide tbody,
    body.theme-saudi .sa-rg-guide tr,
    body.theme-saudi .sa-rg-guide th,
    body.theme-saudi .sa-rg-guide td { display: block; width: auto; }
    body.theme-saudi .sa-rg-guide th { white-space: normal; }
    body.theme-saudi #register-section.sa-rg .sa-rgf-btn,
    body.theme-saudi #register-section.sa-rg .sa-rgf-btn2 { width: 100%; padding-inline: 10px; }
}

/* ------------------------------------------------------------
   2) /in-house-training-proposal
   ------------------------------------------------------------ */

body.theme-saudi #register-section.sa-ip {
    background: #f3f5f4;
    padding: 30px 0 48px;
    color: #10261a;
}
body.theme-saudi #register-section.sa-ip .sa-ip-h1 {
    margin: 0 0 20px;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #10261a;
    line-height: 1.4;
}
body.theme-saudi[dir="rtl"] #register-section.sa-ip .sa-ip-h1 {
    letter-spacing: 0; text-transform: none; font-size: 1.7rem;
}

/* بطاقتان بس — بيستعملوا لغة .sa-cg (أداة التمييز بتاعة الموقع) بس
   بعمودين مش تلاتة، ومن غير سطر "GO" لأنهم مش روابط تصفّح. */
body.theme-saudi .sa-ip-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-block-end: 24px;
}
body.theme-saudi .sa-ip-card { cursor: default; }
body.theme-saudi .sa-ip-card-list {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: grid;
    gap: 9px;
    font-size: .9rem;
    line-height: 1.65;
    color: #3d4a44;                       /* على #fff = 9.3:1 */
}
body.theme-saudi .sa-ip-card-list li { display: flex; align-items: center; gap: 9px; }
body.theme-saudi .sa-ip-card-list .bi { color: #006233; flex: 0 0 auto; }
body.theme-saudi .sa-ip-card-list a { color: #10261a; text-decoration: none; }
body.theme-saudi .sa-ip-card-list a:hover { color: #006233; text-decoration: underline; }
/* البطاقة التانية معلومات مش روابط، فالبنود بشرطة ذهبية بدل أيقونة. */
body.theme-saudi .sa-ip-card-list--plain li { padding-inline-start: 14px; position: relative; }
body.theme-saudi .sa-ip-card-list--plain li::before {
    content: ""; position: absolute; inset-inline-start: 0; inset-block-start: .68em;
    width: 7px; height: 2px; background: #f7c608;
}

/* --- اللوحة: **أضيق** من عرض الحاوية (عمود قراءة) — ده أول فرق شكلي
       عن لوحة /register اللي بعرض الصفحة. --- */
body.theme-saudi .sa-ip-panel {
    max-width: 820px;
    background: #fff;
    border: 1px solid #cfd9d3;
    border-inline-start: 6px solid #f7c608;
    border-radius: 4px;
    padding: 26px 26px 30px;
}
body.theme-saudi .sa-ipf-leg {
    margin: 0 0 16px;
    padding: 0 0 8px;
    border-block-end: 2px solid #f7c608;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #10261a;
    line-height: 1.5;
}
body.theme-saudi[dir="rtl"] .sa-ipf-leg {
    letter-spacing: 0; text-transform: none; font-size: 1rem;
}
body.theme-saudi .sa-ipf-rows { margin-block-end: 28px; }

/* الصف: خانة عنوان ضيّقة + خانة واسعة. ده شكل "ورقة المواصفات" —
   مختلف عن شبكة العمودين في /register وعن شبكة التلاتة في صفحة الخدمات. */
body.theme-saudi .sa-ipf-row {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 9px 0;
}
body.theme-saudi .sa-ipf-row + .sa-ipf-row { border-block-start: 1px solid #eef2f0; }
body.theme-saudi .sa-ipf-row--block { align-items: start; }
body.theme-saudi .sa-ipf-k {
    margin: 0;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #3d4a44;                       /* على #fff = 9.3:1 */
    line-height: 1.45;
}
body.theme-saudi[dir="rtl"] .sa-ipf-k {
    letter-spacing: 0; text-transform: none; font-size: .9rem;
}
body.theme-saudi .sa-ipf-v { min-width: 0; }
body.theme-saudi .sa-ipf-req {
    color: #006233; text-decoration: none; border: 0; font-weight: 700;
}

body.theme-saudi #register-section.sa-ip .sa-ipf .form-control {
    height: 42px;
    padding: 0 12px;
    width: 100%;
    background: #fff;
    border: 1px solid #cfd9d3;
    border-radius: 4px;
    color: #10261a;
    font-size: .95rem;
    box-shadow: none;
}
body.theme-saudi #register-section.sa-ip .sa-ipf textarea.form-control {
    height: auto; min-height: 110px; padding: 10px 12px; line-height: 1.7;
}
body.theme-saudi #register-section.sa-ip .sa-ipf .form-control:focus {
    border-color: #006233;
    outline: 2px solid rgba(0, 98, 51, .28);
    outline-offset: 1px;
}

body.theme-saudi .sa-ipf-act {
    border-block-start: 1px solid #dfe6e1;
    padding-block-start: 20px;
}
body.theme-saudi #register-section.sa-ip .sa-ipf-btn {
    background: #006233 !important;
    border: 1px solid #006233 !important;
    color: #fff !important;               /* 7.5:1 */
    border-radius: 4px !important;
    padding: 12px 32px;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
body.theme-saudi[dir="rtl"] #register-section.sa-ip .sa-ipf-btn {
    letter-spacing: 0; text-transform: none; font-size: .95rem;
}
body.theme-saudi #register-section.sa-ip .sa-ipf-btn:hover,
body.theme-saudi #register-section.sa-ip .sa-ipf-btn:focus {
    background: #10261a !important; border-color: #10261a !important;
}
body.theme-saudi .sa-ipf #message_inhouse:not(:empty) { margin-block-end: 18px; }

@media (max-width: 767px) {
    body.theme-saudi .sa-ip-cards { grid-template-columns: minmax(0, 1fr); }
    body.theme-saudi .sa-ip-panel { padding: 18px 14px 22px; border-inline-start-width: 5px; }
    body.theme-saudi .sa-ipf-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: 6px;
    }
    body.theme-saudi #register-section.sa-ip .sa-ipf-btn { width: 100%; padding-inline: 10px; }
}

/* ------------------------------------------------------------
   3) /course-finder
   ------------------------------------------------------------
   find-my-course.css بيتحمّل قبل ملف الثيم وبيحط صورة خلفية من صفحة
   المعهد الترويجية على #fc-banner، ويرفع #fc-search فوق بـ-64px، ويثبّت
   عرض .chosen-container بـcalc(100% - 60px)!important. القواعد اللي
   تحت بتلغي التلاتة عشان الصفحة تبقى بلغة المعهد ومن غير تمرير أفقي.
   ------------------------------------------------------------ */

body.theme-saudi #fc-banner.sa-cf-hero {
    background: #006233;
    background-image: none;
    border-block-end: 4px solid #f7c608;
    min-height: 0;
    height: auto;
    padding: 34px 0 30px;
}
body.theme-saudi #fc-banner.sa-cf-hero .sa-cf-h1 {
    padding: 0;
    margin: 0;
    font-family: inherit;
    font-size: 1.7rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #fff;                          /* على #006233 = 7.5:1 */
    line-height: 1.35;
}
body.theme-saudi #fc-banner.sa-cf-hero .sa-cf-sub {
    padding: 10px 0 0;
    margin: 0;
    max-width: 66ch;
    font-size: .98rem;
    line-height: 1.7;
    color: #e6f0ea;                       /* على #006233 = 6.4:1 */
}
body.theme-saudi[dir="rtl"] #fc-banner.sa-cf-hero .sa-cf-h1 {
    letter-spacing: 0; text-transform: none;
}

body.theme-saudi #fc-search.sa-cf-searchsec {
    margin: 0;
    padding: 26px 0 0;
    background: #f3f5f4;
}
body.theme-saudi .sa-cf-panel {
    background: #fff;
    border: 1px solid #cfd9d3;
    border-block-start: 5px solid #006233;
    border-radius: 4px;
    box-shadow: none;
    padding: 22px 24px 24px;
    max-width: 760px;
}
body.theme-saudi .sa-cf-panel-h {
    margin: 0 0 18px;
    padding: 0 0 12px;
    border-block-end: 1px solid #e3eae6;
    max-width: 62ch;
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.65;
    color: #10261a;                       /* على #fff = 15.9:1 */
}

/* صفوف [عنوان | خانة] — الباحث مش سطر قوائم مرصوصة. */
body.theme-saudi .sa-cf-row {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    padding: 10px 0;
}
body.theme-saudi .sa-cf-row + .sa-cf-row { border-block-start: 1px solid #eef2f0; }
body.theme-saudi .sa-cf-k {
    margin: 0;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #3d4a44;                       /* على #fff = 9.3:1 */
}
body.theme-saudi[dir="rtl"] .sa-cf-k { letter-spacing: 0; text-transform: none; font-size: .9rem; }
body.theme-saudi .sa-cf-v { min-width: 0; }

body.theme-saudi .sa-cf-form .form-select,
body.theme-saudi .sa-cf-form select.custom-form {
    width: 100% !important;
    float: none !important;
    height: 42px;
    padding: 0 12px;
    border: 1px solid #cfd9d3;
    border-radius: 4px !important;
    background: #fff;
    color: #10261a;
    font-size: .95rem;
}
body.theme-saudi .sa-cf-form .form-select:focus {
    border-color: #006233;
    outline: 2px solid rgba(0, 98, 51, .28);
    outline-offset: 1px;
}
/* chosen بيولّد الحاوية دي بعرض ثابت calc(100% - 60px) وfloat — الاتنين
   بيكسّروا الصف ويعملوا تمرير أفقي على 390px. */
body.theme-saudi .sa-cf-form .chosen-container {
    width: 100% !important;
    float: none !important;
    max-width: 100% !important;
}
body.theme-saudi .sa-cf-form .chosen-container-multi .chosen-choices {
    border: 1px solid #cfd9d3 !important;
    border-radius: 4px !important;
    min-height: 42px !important;
}
body.theme-saudi .sa-cf-form .chosen-container-active .chosen-choices {
    border: 1px solid #006233 !important;
}
body.theme-saudi .sa-cf-form .chosen-container-multi .chosen-choices li.search-choice {
    background: #006233; border: 1px solid #006233; color: #fff; border-radius: 4px;
}

body.theme-saudi .sa-cf-act { padding-block-start: 18px; }
body.theme-saudi .sa-cf-btn {
    width: auto !important;
    float: none !important;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    height: auto;
    background: #006233 !important;
    border: 1px solid #006233 !important;
    color: #fff !important;               /* 7.5:1 */
    border-radius: 4px !important;
    padding: 12px 30px;
    font-family: inherit;
    font-size: .84rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    box-shadow: none;
}
body.theme-saudi[dir="rtl"] .sa-cf-btn { letter-spacing: 0; text-transform: none; font-size: .95rem; }
body.theme-saudi .sa-cf-btn:hover,
body.theme-saudi .sa-cf-btn:focus {
    background: #10261a !important; border-color: #10261a !important; color: #fff !important;
}

body.theme-saudi .sa-cf-results { background: #f3f5f4; padding: 26px 0 46px; }
body.theme-saudi .sa-cf-results .search-resultwrap {
    margin: 0; padding: 0; background: transparent;
}
body.theme-saudi .sa-cf-results #coursefinder_list_courses:empty { display: none; }

/* الطريق التاني: بطاقات التخصصات — نفس .sa-cg بتاعة /categories. */
body.theme-saudi .sa-cf-alt-h {
    margin: 26px 0 16px;
    padding-block-end: 10px;
    border-block-end: 2px solid #006233;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #10261a;
}
body.theme-saudi[dir="rtl"] .sa-cf-alt-h { letter-spacing: 0; text-transform: none; font-size: 1rem; }
body.theme-saudi .sa-cf-cats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.theme-saudi .sa-cf-cats .sa-cg-name { font-size: .92rem; }

@media (max-width: 1199px) {
    body.theme-saudi .sa-cf-cats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    body.theme-saudi .sa-cf-panel { padding: 18px 14px 20px; }
    body.theme-saudi .sa-cf-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: 6px;
    }
    body.theme-saudi .sa-cf-btn { width: 100% !important; justify-content: center; padding-inline: 10px; }
    body.theme-saudi .sa-cf-cats { grid-template-columns: minmax(0, 1fr); }
    body.theme-saudi #fc-banner.sa-cf-hero .sa-cf-h1 { font-size: 1.35rem; }
    body.theme-saudi #fc-banner.sa-cf-hero .sa-cf-sub { font-size: .92rem; }
}


/* ------------------------------------------------------------
   ضبط بعد القياس (2026-09-09) — صفحات النماذج الثلاثة، السعودي
   ------------------------------------------------------------ */

/* 1) الزوايا: السطر 13 في نفس الملف بيدّي كل input/select/‏.form-control
      زوايا 12px بـ!important (قاعدة عامة لكل الموقع ما تتغيّرش). سطر
      المعهد في DESIGN-SYSTEMS.md بيقول "زوايا 4px، حدود ظاهرة"، فبنستثني
      الصفحات التلاتة دي بس. الحدّ الأخضر جاي من _brand.css بـ!important
      وسايبينه: هو "الحدود الظاهرة" بتاعة الموقع. */
body.theme-saudi #register-section.sa-rg .sa-rgf .form-control,
body.theme-saudi #register-section.sa-rg .sa-rgf input:not([type="checkbox"]):not([type="radio"]),
body.theme-saudi #register-section.sa-rg .sa-rgf select,
body.theme-saudi #register-section.sa-ip .sa-ipf .form-control,
body.theme-saudi #register-section.sa-ip .sa-ipf input:not([type="checkbox"]):not([type="radio"]),
body.theme-saudi #register-section.sa-ip .sa-ipf select,
body.theme-saudi .sa-cf-form .form-control,
body.theme-saudi .sa-cf-form input:not([type="checkbox"]):not([type="radio"]),
body.theme-saudi .sa-cf-form select { border-radius: 4px !important; }

/* الحدّ الأخضر مكتوب صريح هنا كمان عشان قيمتي في القاعدة اللي فوق (رمادي
   بدون !important) ما تبقاش مضلّلة — _brand.css بيغلبها على أي حال. */
body.theme-saudi #register-section.sa-rg .sa-rgf .form-control,
body.theme-saudi #register-section.sa-ip .sa-ipf .form-control,
body.theme-saudi .sa-cf-form .form-control { border-color: #006233; }

/* 2) company_tab بيجي بماركب bootstrap: .row بهوامش سالبة -15px جوّه
      حاوية مالهاش حشو مقابل، فكان بيطلع 15px بره عرض النموذج. تصفير
      الهوامش والحشو بيخلّي كل الخانات مصفوفة على 15px من حافة اللوحة. */
body.theme-saudi #register-section.sa-rg .sa-rgf .search-inner-box > .row { margin-inline: 0; }
body.theme-saudi #register-section.sa-rg .sa-rgf .search-inner-box > .row > .padding-2 { padding-inline: 0; }

/* 3) /in-house-training-proposal: البطاقتان واللوحة بنفس العرض المحدود —
      الصفحة عمود قراءة واحد. (كانت البطاقات بعرض الحاوية واللوحة أضيق،
      فالنص الفاضي على الجنب كان بيبان غلط مش اختيار.) */
body.theme-saudi .sa-ip-cards,
body.theme-saudi .sa-ip-panel { max-width: 900px; }

/* 4) /course-finder: اللوحة بعرض الحاوية والحقول **شبكة تلات أعمدة
      بعناوين فوقها** — مش صفوف [عنوان | خانة] زي صفحة الدورة الداخلية.
      لازم الصفحتان يفرقوا عن بعض، مش يفرقوا عن باقي المعاهد بس.
      الحشو بـ!important لأن ورقة find-my-course.css بتصفّر padding
      على #fc-search. */
body.theme-saudi #fc-search.sa-cf-searchsec {
    margin: 0 !important;
    padding: 28px 0 0 !important;
}
body.theme-saudi .sa-cf-panel { max-width: none; }
body.theme-saudi .sa-cf-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 18px;
    align-items: end;
}
body.theme-saudi .sa-cf-row {
    display: block;
    padding: 0;
}
body.theme-saudi .sa-cf-row + .sa-cf-row { border-block-start: 0; }
body.theme-saudi .sa-cf-k { display: block; margin: 0 0 6px; }
body.theme-saudi .sa-cf-act { grid-column: 1 / -1; padding-block-start: 6px; }

@media (max-width: 767px) {
    body.theme-saudi .sa-cf-form { grid-template-columns: minmax(0, 1fr); }
}

/* 5) (2026-09-09) محاذاة تبويب "Company Paid" مع شبكة الحقول فوقه:
      .tab-content في الأوراق المشتركة بيدّي الـpane حشو 30px، وbootstrap
      بيدّي كل .col- حشو 15px — فخانات المرشِّح كانت داخلة 45px عن أول
      "COURSE TYPE". تصفير حشو الـpane وسحب .search-inner-box 15px بيرجّع
      كل الخانات على نفس الخط. */
body.theme-saudi #register-section.sa-rg .sa-rgf-panes,
body.theme-saudi #register-section.sa-rg .sa-rgf .tab-pane { padding-inline: 0; }
body.theme-saudi #register-section.sa-rg .sa-rgf .search-inner-box {
    margin-inline: -15px;
    width: auto;
}

/* 6) /in-house-training-proposal: العمود متوسّط بدل ما يكون ملزوق في
      البداية — الترويسة والتذييل بعرض الشاشة، فعمود ملزوق في جنب واحد
      كان بيتقري غلط مش اختيار. */
body.theme-saudi #register-section.sa-ip .sa-ip-h1,
body.theme-saudi .sa-ip-cards,
body.theme-saudi .sa-ip-panel { max-width: 940px; margin-inline: auto; }

/* 5-ب) additional.css فيه `.tab-content{padding:50px 30px 30px!important}`
       — القاعدة اللي فوق مكانتش بتغلبها، فالخانات فضلت داخلة 45px.
       بـ!important الحشو بقى صفر والخلفية شفافة (اللوحة نفسها بيضا أصلاً)
       فالتبويب بقى جزء من اللوحة مش صندوق تاني جوّها. */
body.theme-saudi #register-section.sa-rg .sa-rgf-panes {
    padding: 20px 0 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
}

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

   المشكلة اللي بنحلّها: الصفحتين كانوا بيتقروا نفس القراءة في الـ11 معهد
   (بلوك شعار فوق ← عنوان ← تاريخ ← نص بعرض العمود ← ريل يمين فيه ٤ كروت).
   الحل مش لون تاني — التسلسل نفسه وأداة العرض نفسها اتغيّروا:

     المقال : شريط خانات مفصولة فوق ← عنوان ← عمود قراية 68ch ← جدول صفوف
              برأس أعمدة أخضر بعرض الصفحة.
     المدونة: عنوان ← بطاقة موضوع واحدة بأيقونة ← عمود قراية 64ch ← ٣ بطاقات.

   ومفيش ريل جانبي في الاتنين، فالنص مالوش منافس بصري.
   كل الحواف والمسافات منطقية (inline-start/end) عشان العربي RTL يشتغل زي الإنجليزي.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── صفحة المقال ────────────────────────────────────────────────────── */

body.theme-saudi .sa-ad-sec { padding: 18px 0 8px; background: #fff; }

/* شريط البيانات: منطق رأس الجدول عند السعودي بس أفقي — حدّ أخضر سميك،
   خط ذهبي تحت، وخانات مفصولة بحدود رفيعة. ده أول حاجة العين تشوفها،
   فالتسلسل المشترك (لوجو ← عنوان ← تاريخ) مبقاش موجود. */
body.theme-saudi .sa-ad-rec {
    margin: 14px 0 22px;
    border: 2px solid var(--site-primary, #006233);
    border-bottom: 3px solid var(--site-accent, #f7c608);
    background: #fff;
}
body.theme-saudi .sa-ad-meta { display: flex; flex-wrap: wrap; margin: 0; }
body.theme-saudi .sa-ad-cell {
    flex: 1 1 200px;
    min-width: 0;
    padding: 12px 18px;
    border-inline-end: 1px solid #dfe6e1;
}
body.theme-saudi .sa-ad-cell:last-child { border-inline-end: 0; }
body.theme-saudi .sa-ad-cell dt {
    margin: 0 0 4px;
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--site-primary, #006233);
}
body.theme-saudi[dir="rtl"] .sa-ad-cell dt { letter-spacing: 0; text-transform: none; font-size: .8rem; }
body.theme-saudi .sa-ad-cell dd {
    margin: 0;
    font-size: .98rem;
    font-weight: 700;
    color: var(--sa-ink, #10261a);
    overflow-wrap: anywhere;
}

/* العنوان بعد الشريط. خط ذهبي قصير تحته بدل الظل — الموقع كله بحدود مش ظلال. */
body.theme-saudi .sa-ad-title {
    margin: 0 0 6px;
    font-size: 2rem;
    line-height: 1.25;
    font-weight: 800;
    color: var(--sa-ink, #10261a);
    text-align: start;
}
body.theme-saudi .sa-ad-title::after {
    content: "";
    display: block;
    width: 72px;
    height: 4px;
    margin-top: 14px;
    background: var(--site-accent, #f7c608);
}

/* العرض بالبكسل مش بالـch: الـch بتتحسب من خط العنصر نفسه، فلو العنوان أخد
   نفس الرقم كان هيطلع ضِعف عرض النص. 585px ≈ 74 حرف على خط الموقع. */
body.theme-saudi .sa-ad-body {
    max-width: 585px;
    margin: 24px 0 0;
    text-align: start;
    font-size: 1.02rem;
    line-height: 1.85;
    color: #23302a;
}
body.theme-saudi .sa-ad-body p { margin: 0 0 18px; }
body.theme-saudi .sa-ad-body h2,
body.theme-saudi .sa-ad-body h3,
body.theme-saudi .sa-ad-body h4 {
    margin: 30px 0 10px;
    font-size: 1.18rem;
    font-weight: 800;
    color: var(--sa-ink, #10261a);
}
body.theme-saudi .sa-ad-body ul,
body.theme-saudi .sa-ad-body ol { margin: 0 0 18px; padding-inline-start: 22px; }
body.theme-saudi .sa-ad-body li { margin-bottom: 8px; }
body.theme-saudi .sa-ad-body a { color: var(--site-primary, #006233); text-decoration: underline; }
body.theme-saudi .sa-ad-body img { max-width: 100%; height: auto; }
body.theme-saudi .sa-ad-body table { max-width: 100%; }

/* المرتبطة: جدول بعرض الصفحة تحت النص — مش ريل. */
body.theme-saudi .sa-ad-rel { padding: 34px 0 40px; }
body.theme-saudi .sa-ad-rel-h {
    margin: 0 0 14px;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--site-primary, #006233);
}
body.theme-saudi[dir="rtl"] .sa-ad-rel-h { letter-spacing: 0; text-transform: none; font-size: 1.05rem; }

@media (max-width: 767px) {
    body.theme-saudi .sa-ad-title { font-size: 1.5rem; }
    body.theme-saudi .sa-ad-cell { flex: 1 1 100%; border-inline-end: 0; border-bottom: 1px solid #dfe6e1; }
    body.theme-saudi .sa-ad-cell:last-child { border-bottom: 0; }
    body.theme-saudi .sa-ad-body { font-size: .98rem; line-height: 1.8; }
}

/* ── صفحة المدونة ───────────────────────────────────────────────────── */
/* مقصود إنها تختلف عن صفحة المقال: العنوان أول حاجة (مش شريط بيانات)،
   وبعده بطاقة موضوع واحدة بأيقونة، وعمود القراية أضيق شوية، والمرتبطة بطاقات. */

body.theme-saudi .sa-bd-sec { padding: 18px 0 8px; background: #fff; }

/* عمود المدونة متمركز (margin-inline: auto) بينما عمود المقال ملزوق ببداية
   السطر — ده بيدّي الصفحتين شكل مختلف من أول نظرة حتى قبل قراءة أي كلمة. */
body.theme-saudi .sa-bd-title,
body.theme-saudi .sa-bd-subject,
body.theme-saudi .sa-bd-body { max-width: 530px; margin-inline: auto; }

body.theme-saudi .sa-bd-title {
    margin-block: 16px 18px;
    font-size: 2rem;
    line-height: 1.25;
    font-weight: 800;
    color: var(--sa-ink, #10261a);
    text-align: start;
}

/* بطاقة الموضوع: الأيقونة جنب النص، حدّ علوي ذهبي عشان تتفرق عن بطاقات
   المرتبطة (حدّها أخضر) — العين تعرف إن دي معلومة مش وجهة تصفّح. */
body.theme-saudi .sa-bd-subject {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 20px;
    background: #fff;
    border: 1px solid #dfe6e2;
    border-top: 4px solid var(--site-accent, #f7c608);
}
body.theme-saudi .sa-bd-subject-txt { min-width: 0; }
body.theme-saudi .sa-bd-subject-name {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.4;
    color: var(--sa-ink, #10261a);
}
body.theme-saudi .sa-bd-subject-name a { color: var(--site-primary, #006233); text-decoration: underline; }
body.theme-saudi .sa-bd-subject-x {
    margin: 6px 0 0;
    font-size: .92rem;
    line-height: 1.65;
    color: #4a5952;
}
body.theme-saudi .sa-bd-subject-date {
    margin: 10px 0 0;
    font-size: .92rem;
    color: var(--sa-ink, #10261a);
}
body.theme-saudi .sa-bd-subject-date span {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--site-primary, #006233);
    margin-inline-end: 6px;
}
body.theme-saudi[dir="rtl"] .sa-bd-subject-date span { letter-spacing: 0; text-transform: none; font-size: .8rem; }

/* 530px ≈ 67 حرف — أضيق من عمود المقال، فإيقاع الصفحتين مختلف. */
body.theme-saudi .sa-bd-body {
    margin-block: 26px 0;
    text-align: start;
    font-size: 1.02rem;
    line-height: 1.85;
    color: #23302a;
}
body.theme-saudi .sa-bd-body p { margin: 0 0 18px; }
body.theme-saudi .sa-bd-body h2,
body.theme-saudi .sa-bd-body h3,
body.theme-saudi .sa-bd-body h4 {
    margin: 30px 0 10px;
    font-size: 1.18rem;
    font-weight: 800;
    color: var(--sa-ink, #10261a);
}
body.theme-saudi .sa-bd-body ul,
body.theme-saudi .sa-bd-body ol { margin: 0 0 18px; padding-inline-start: 22px; }
body.theme-saudi .sa-bd-body li { margin-bottom: 8px; }
body.theme-saudi .sa-bd-body a { color: var(--site-primary, #006233); text-decoration: underline; }
body.theme-saudi .sa-bd-body img { max-width: 100%; height: auto; }

/* المرتبطة: ٣ بطاقات بأيقونة على خلفية رمادية فاتحة — عدد وأداة مختلفين
   عن جدول صفحة المقال، فالصفحتين مش نسختين. */
/* حدّ أخضر علوي بيفصل شريط المرتبطة عن النص — خلفية القسم زي خلفية الصفحة،
   فمن غير الحدّ ده الفصل مش هيبان. */
body.theme-saudi .sa-bd-rel {
    padding: 30px 0 40px; margin-top: 34px;
    background: #f3f5f4; border-top: 2px solid var(--site-primary, #006233);
}
body.theme-saudi .sa-bd-rel-h {
    margin: 0 0 16px;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--site-primary, #006233);
}
body.theme-saudi[dir="rtl"] .sa-bd-rel-h { letter-spacing: 0; text-transform: none; font-size: 1.05rem; }
body.theme-saudi .sa-bd-rel-x {
    font-size: .88rem;
    line-height: 1.65;
    color: #4a5952;
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    body.theme-saudi .sa-bd-title { font-size: 1.5rem; }
    body.theme-saudi .sa-bd-subject { flex-direction: column; gap: 12px; }
    body.theme-saudi .sa-bd-body { font-size: .98rem; line-height: 1.8; }
}

/* (2026-09-09) tlb: "saghghar at-tasmeem wa tala3 as-si3r barra al-murabba3".
   al-kart kan 437x227 was-si3r gowwa murabba3 bi-hudud wa khalfiya. */
body.theme-saudi.pg-training-courses .sa-acc .price-tag{
    background:transparent!important;border:0!important;padding:0!important;
}
body.theme-saudi.pg-training-courses .session-card{grid-template-columns:1fr 168px}
body.theme-saudi.pg-training-courses .session-card > ul{padding:11px 14px!important}
body.theme-saudi.pg-training-courses .session-card li{margin-bottom:0!important;font-size:.82rem}
body.theme-saudi.pg-training-courses .session-card .price-box{padding:10px 10px 4px!important}
body.theme-saudi.pg-training-courses .session-card .price-tag .clearfix{display:none}
body.theme-saudi.pg-training-courses .session-card .fee-usd{font-size:.98rem;color:#006233}
body.theme-saudi.pg-training-courses .session-card > form{padding:0 10px 10px}
body.theme-saudi.pg-training-courses .session-card > .text-end{
    grid-column:2;grid-row:2;padding:0 10px 10px;margin-top:0!important;text-align:center
}
body.theme-saudi.pg-training-courses .session-card .btn{padding:7px 14px!important;font-size:.8rem!important}
body.theme-saudi.pg-training-courses .session-card li:first-child{white-space:nowrap}

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

/* نافذة السعودي: لوح أخضر في الرأس وشريط ذهبي تحته، حقول قائمة
   الزوايا، وزرار أخضر بعرض النافذة — نفس انضباط الشبكة. */
body.theme-saudi .modal-content{border:0;border-radius:0}
body.theme-saudi .modal-header{background:#006233;border:0;border-bottom:4px solid #f7c608;padding:15px 22px}
body.theme-saudi .modal-title{color:#fff;font-weight:700;font-size:1.04rem}
body.theme-saudi .modal-header .close svg{fill:#fff}
body.theme-saudi .modal-content > p{padding:14px 22px 0;color:#5d6b62;font-size:.86rem}
body.theme-saudi .modal-body .form-control{border:1px solid #cfd8d2!important;border-radius:0!important}
body.theme-saudi .modal-body .form-control:focus{border-color:#006233!important;box-shadow:none!important}
body.theme-saudi .modal-body .btn-primary{border-radius:0!important;background:#006233!important;border-color:#006233!important;font-weight:700}

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

/* السعودي — بطاقات: كل بند بحد كامل ومربّع أخضر قبل عنوانه. */
body.theme-saudi.pg-policy-page .common-listing-section-wrap .box4 h5{
    display:flex;align-items:center;gap:10px;margin:32px 0 8px;
    padding:10px 14px;border:1px solid #cfd8d2;border-top:3px solid #006233;
    color:#0d3b22;font-size:.98rem;background:#f7faf8}
body.theme-saudi.pg-policy-page .common-listing-section-wrap .box4 h5::before{
    content:"";width:10px;height:10px;background:#f7c608;flex:0 0 auto}
body.theme-saudi.pg-policy-page .common-listing-section-wrap .box4 p{padding-inline:14px;line-height:1.8}

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

/* السعودي — بطاقات: كل مجموعة جوّه إطار كامل بشريط أخضر فوقه،
   وثلاث أعمدة. */
body.theme-saudi.page-sitemap h5.no-margin{
    margin:28px 0 0;padding:10px 14px;background:#f7faf8;
    border:1px solid #cfd8d2;border-top:3px solid #006233;
    border-bottom:0;color:#0d3b22;font-size:.95rem}
body.theme-saudi.page-sitemap .sitemap-list{
    column-count:3;column-gap:30px;margin:0 0 6px!important;
    border:1px solid #cfd8d2;border-top:0;padding:12px 14px}

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

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

/* السعودي — ختم: دائرة ذهبية بحلقة خضرا. */
body.theme-saudi h2:not([class]),
body.theme-saudi h2.inst-logos-h{display:flex;align-items:center;gap:13px}
body.theme-saudi h2:not([class])::before,
body.theme-saudi h2.inst-logos-h::before{
    content:"";flex:0 0 auto;width:13px;height:13px;border-radius:50%;
    background:#f7c608;box-shadow:0 0 0 3px rgba(0,98,51,.28)}

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

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

/* السعودي — كروت بأيقونات: كانت صفوف جدول زي جلوبال والقادة.
   بقت شبكة كروت بشريط ذهبي وحد أخضر — أداتها في DESIGN-SYSTEMS. */
/* الشبكة بتتحدّد بمحدّد فيه id (#category_course_list / #course_list)
   فلازم نفس التخصيص هنا، وإلا القاعدة القديمة بتغلب. */
body.theme-saudi.pg-training-courses #category_course_list,
body.theme-saudi.pg-training-courses #course_list{
    display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:18px}
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting{
    display:block!important;border:1px solid #cfd8d2!important;border-top:4px solid #006233!important;
    border-radius:0!important;box-shadow:none!important;padding:16px!important;height:100%}
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting .course-image{display:none!important}
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting .course-title{
    font-size:.95rem;line-height:1.45;padding-bottom:10px;
    border-bottom:2px solid #f7c608;margin-bottom:10px}
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting .course-date,
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting .course-language,
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting .course-location{
    display:block;font-size:.78rem;margin-bottom:4px}

/* في بعض الثيمات فيه قاعدة أخصّ فيها .inst-tc كمان، فلازم نسخة
   بنفس التخصيص وإلا بتغلب. */
body.theme-saudi.pg-training-courses .inst-tc #category_course_list,
body.theme-saudi.pg-training-courses .inst-tc #course_list{
    display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:18px}
/* الزرار كان بياخد عرض الكرت كله ويطوّله على الفاضي */
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting .btn,
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting #searresultscourses-btn2{
    width:auto!important;display:inline-block;padding:7px 18px!important;font-size:.8rem!important}
body.theme-saudi.pg-training-courses .courselist-style-inside .courselisting > form{margin-top:10px}

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

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

/* السعودي — بطاقات: المتن جوّه إطار كامل بشريط أخضر فوقه وذهبي تحته،
   فالصفحة بقت بطاقة مش عمود سايب. */
body.theme-saudi.pg-post-page .blog-webinar-articles-details-left,
body.theme-saudi.pg-post-page .container > .row > [class*="col-"]:first-child{
    border:1px solid #cfd8d2;border-top:4px solid #006233;border-bottom:4px solid #f7c608;
    padding:26px 30px;background:#fff}

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

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

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

/* ─────────────────────────────
   (2026-09-10) سجل المقالات والمدونات من غير تاريخ

   نص التاريخ اتشال من القالب، والغلاف الفاضي بيتخفي هنا عشان
   ما يسيبش فراغ (ولا أيقونة نتيمة في حالة القادة، ولا عمود
   فاضي في جدول السعودي).
   ───────────────────────────── */
/* نفس الكلاس على رأس العمود وخلاياه، فالعمود بيختفي كله. */
body.theme-saudi .sa-lt-date{display:none}

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

   المراجعة الشاملة طلّعت إن الصفحة دي هي الوحيدة اللي لسه بنفس
   التخطيط بالحرف في الـ11 موقع — نفس الكرت ونفس ترتيب البيانات،
   والفرق لون الزرار والحدّ بس. كل موقع بياخد أداته.
   ───────────────────────────── */
/* السعودي — شريط أخضر برأس السنة وخط ذهبي تحته وزوايا قايمة. */
body.theme-saudi.pg-search-page .courselisting{
    background:#fff!important;border:1px solid #cfd8d2!important;border-radius:0!important;
    border-top:4px solid #006233!important;box-shadow:none!important;
    padding:18px 22px!important;margin-bottom:20px}
body.theme-saudi.pg-search-page .course-title h6 a{color:#0b3a24!important;font-weight:700}
body.theme-saudi.pg-search-page .custom-head-additional{
    background:#006233!important;color:#fff!important;border-radius:0!important;
    border-bottom:4px solid #f7c608!important}
body.theme-saudi.pg-search-page .course-details-wrap{
    background:#f4f8f5!important;border-radius:0!important}


/* (2026-09-11) سهم الرجوع لفوق: كان نفس الزرار في الـ11 موقع (مربع 31px
   بأيقونة دايرة). كل موقع بقى له شكله؛ السهم مرسوم بـCSS بدل الأيقونة. */
body.theme-saudi #back-to-top{box-sizing:border-box;padding:0;overflow:visible}
body.theme-saudi #back-to-top i{display:none}
body.theme-saudi #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-saudi #back-to-top{width:56px;height:36px;border:0!important;border-radius:18px!important;
    background:var(--site-primary,#006c35)!important;color:#fff;box-shadow:0 6px 14px rgba(0,0,0,.15)}
body.theme-saudi #back-to-top:hover{background:var(--site-accent,#0096d4)!important}

/* ─────────────────────────────
   (2026-09-11) قائمة الدورات: بطاقات بشريط تاريخ — اختيار صريح
   صف العناوين (Course Title | Date | ...) كان فوق شبكة بطاقات بياناتها
   متراصّة عمودي، فالعناوين مش راكبة على حاجة. اتشال، وكل بطاقة بقت:
   شريط أخضر فوق فيه التاريخ، العنوان، اللغة والنوع والمدينة في سطر
   واحد كبسولات، وزر تسجيل بعرض البطاقة. مفيش خطوط 1px.
   ───────────────────────────── */
body.theme-saudi.pg-training-courses .inst-tc-head{display:none!important}
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside > .row{gap:22px!important;align-items:stretch}
body.theme-saudi.pg-training-courses .inst-tc .courselisting-col{margin:0!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting-col > a{height:100%;text-decoration:none}
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting,
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting.virtual{
    flex:1;display:flex!important;flex-wrap:wrap;align-content:flex-start;gap:8px;
    padding:0 0 16px!important;border:0!important;border-radius:10px!important;overflow:hidden;
    background:#fff!important;box-shadow:0 4px 14px rgba(16,38,26,.08)!important;transition:transform .2s,box-shadow .2s}
body.theme-saudi.pg-training-courses .inst-tc .courselisting:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(16,38,26,.14)!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > *{border:0!important;padding:0!important;display:none}

/* الشريط: التاريخ */
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-date{
    order:-1;flex:1 1 100%;display:flex!important;align-items:center;gap:10px;
    padding:14px 18px!important;background:#006233;color:#fff!important;font-weight:700;font-size:.95rem;
    box-shadow:inset 0 -4px 0 #f7c608}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-date i{color:#f7c608!important;margin:0!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting.virtual > .course-date{background:#10261a}

/* العنوان */
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-title{
    flex:1 1 100%;display:block!important;padding:10px 18px 4px!important;
    color:#10261a!important;font-weight:700;font-size:1rem;line-height:1.45;border:0!important;text-decoration:none;
    text-align:center!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting:hover > .course-title{color:#006233!important}

/* اللغة/النوع/المدينة: كبسولات في سطر */
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-language,
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-location{
    flex:0 0 auto;display:inline-flex!important;align-items:center;gap:6px;
    padding:5px 11px!important;border-radius:20px;background:#eef5f0;color:#2f4a3a!important;font-size:.78rem;font-weight:600}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-language:nth-child(7){margin-inline-start:18px}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-language i,
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-location i{color:#006233!important;margin:0!important;font-size:.85rem}

/* زر التسجيل بعرض البطاقة، دايمًا في الآخر */
body.theme-saudi.pg-training-courses .inst-tc .courselisting > form{
    flex:1 1 100%;display:flex!important;margin-top:auto;padding:12px 18px 0!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > form .btn{width:100%;border-radius:8px!important;padding:11px!important;font-size:.78rem!important;letter-spacing:.08em!important}

@media (max-width:1199px){body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside > .row{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media (max-width:767px){body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside > .row{grid-template-columns:1fr!important}}
/* تصحيح بعد الصور: قاعدة قديمة على id الشبكة كانت بتصفّر المسافة وبتثبّت
   3 أعمدة حتى على الموبايل، والزر كان بعرض كلمته بس (الفورم flex). */
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #category_course_list,
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #category_course_list_by_name,
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #course_list,
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #coursefinder_list_courses{
    display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:22px!important}
@media (max-width:1199px){
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #category_course_list,
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #category_course_list_by_name,
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #course_list,
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #coursefinder_list_courses{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:767px){
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #category_course_list,
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #category_course_list_by_name,
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #course_list,
    body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside #coursefinder_list_courses{grid-template-columns:1fr!important}
}
/* الحشوة الجانبية على البطاقة نفسها، والشريط بيطلع لبرّه بهامش سالب —
   كده الكبسولات لما تلفّ لسطر تاني بتفضل على نفس الحافة. */
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting,
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting.virtual{padding:0 18px 18px!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-date{margin:0 -18px 4px!important;flex-basis:calc(100% + 36px)}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-title{padding:6px 0 2px!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-language:nth-child(7){margin-inline-start:0}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > form{padding:12px 0 0!important}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > form .btn{flex:1 1 auto!important;width:100%!important;max-width:none!important}
/* زراير التسجيل في نفس المستوى: البطاقة كانت flex بيلفّ، وmargin-top:auto
   بيدفع الزر جوّه سطره بس — فالبطاقة اللي عنوانها سطرين زرّها بينزل.
   بقت grid بصفوف ثابتة: تاريخ | عنوان | كبسولات | فراغ مرن | زر، فالزر
   دايمًا في قاع البطاقة، والبطاقات في الصف الواحد بنفس الطول. */
/* (2026-09-12) "ليسوا في مستوى واحد" — الكبسولات كانت في الصف اللي بعد العنوان على طول،
   والعنوان سطر أو سطرين أو تلاتة، فكانت بتنزل مع طول العنوان. الفراغ المرن اتنقل من تحت
   الكبسولات لفوقها: تاريخ | عنوان | فراغ مرن | كبسولات | زر — فالكبسولات والزر الاتنين
   ملزوقين في قاع البطاقة وعلى نفس الخط في الصف كله. */
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting,
body.theme-saudi.pg-training-courses .inst-tc .courselist-style-inside .courselisting.virtual{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) max-content max-content minmax(0,1fr);
    grid-template-rows:auto auto 1fr auto auto;
    column-gap:8px;row-gap:8px;align-content:stretch;height:100%}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-date{grid-column:1/-1;grid-row:1}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-title{grid-column:1/-1;grid-row:2}
/* (2026-09-18) طلب صريح: العنوان والكبسولات (لغة/نوع) في نص الكارت مش
   على الشمال. عمودين فارغين (1fr) على الطرفين بياخدوا أي مساحة زيادة،
   فالكبسولتين في النص بينهم بالظبط. */
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-language{grid-row:4;grid-column:2;justify-self:center}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-language ~ .course-language{grid-column:3}
body.theme-saudi.pg-training-courses .inst-tc .courselisting > form{grid-column:1/-1;grid-row:5;margin-top:0!important}
/* (2026-09-11) شارة في شريط التاريخ بتفرّق الحضوري عن الأونلاين — طلب صريح.
   الحضوري: شارة صفرا "Face-to-Face/حضوري". الأونلاين: شارة بيضا بنقطة حمرا
   زي علامة البث "Online/أونلاين". الكلاس .virtual موجود أصلاً على كروت الأونلاين. */
body.theme-saudi.pg-training-courses .inst-tc .courselisting > .course-date::after{
    content:'Face-to-Face';margin-inline-start:auto;flex:0 0 auto;
    padding:4px 10px;border-radius:12px;background:#f7c608;color:#10261a;
    font-size:.68rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:1.3}
body.theme-saudi.pg-training-courses .inst-tc .courselisting.virtual > .course-date::after{
    content:'Online';background:#fff radial-gradient(circle at 11px 50%,#e5322d 0 4px,transparent 4.5px) no-repeat;
    padding-inline-start:22px;color:#10261a}
body.theme-saudi[dir="rtl"].pg-training-courses .inst-tc .courselisting > .course-date::after{content:'حضوري';letter-spacing:normal;font-size:.76rem}
body.theme-saudi[dir="rtl"].pg-training-courses .inst-tc .courselisting.virtual > .course-date::after{
    content:'أونلاين';background:#fff radial-gradient(circle at calc(100% - 11px) 50%,#e5322d 0 4px,transparent 4.5px) no-repeat}
/* (2026-09-11) الفلتر اللي على الجنب كان لازق: الحاوية اللي فيها الحقول
   وزر الكتيب و"فئات أخرى/ذات صلة" حشوتها صفر، فالحقول لازقة في حرف
   العمود، وآخر حقل لازق في زر الكتيب (0px). قواعد الحشوة القديمة كانت
   على .box2 ودي مش الحاوية الفعلية. */
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0{
    display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;
    padding:8px 16px 16px!important;gap:0}
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0 > form{flex:1 1 100%;gap:10px!important}
body.theme-saudi.pg-training-courses .inst-tc-side select.form-control{
    height:42px!important;border-radius:8px!important;padding:0 12px!important}
body.theme-saudi.pg-training-courses .inst-tc-side #download_brochure_category{
    flex:1 1 100%;display:block!important;width:100%;float:none!important;margin:14px 0 0!important;
    height:auto;padding:11px 12px!important;border-radius:8px!important;
    background:#006233!important;border:0!important;color:#fff!important;font-weight:700}
body.theme-saudi.pg-training-courses .inst-tc-side #download_brochure_category:hover{background:#10261a!important}
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0 > .courselist-filter-btn,
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0 > .filter-area-courselist-desktop{
    float:none!important;margin-top:14px!important}
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0 > .courselist-filter-btn{padding-inline:0!important}
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0 > .filter-area-courselist-desktop > a{padding-inline:0!important}
/* "فئات أخرى" و"ذات صلة" في سطر واحد: قاعدة تانية بتدّي الرابط الأول
   العرض كله فالتاني بينزل سطر. كل واحد بعرض محتواه، والأول على البداية. */
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0 > .courselist-filter-btn{
    flex:0 0 auto!important;width:auto!important;max-width:none!important;display:inline-block!important;text-align:start!important}
body.theme-saudi.pg-training-courses .inst-tc-side > .col-md-12.p-0 > .filter-area-courselist-desktop{
    flex:0 0 auto!important;width:auto!important}

/* (2026-09-12) فلتر صفحة كل الدورات (/training-courses) تحت 1200px — طلب صريح.
   الخانات (desktop-filter) كانت بتستخبى من 1199 ولتحت، وزرار "Filter" بتاع
   الموبايل كمان مستخبي في الصفحة دي، فمكانش فيه أي طريقة تفلتر (صفحة
   التخصص كانت سليمة). الخمس خانات بالاسم بتظهر؛ "نوع الدورة" المستخبية
   بقصد في الصفحة دي بتفضل مستخبية. */
@media (max-width:1199px){
    body.theme-saudi.pg-training-courses aside.inst-tc-side #sort_cat,
    body.theme-saudi.pg-training-courses aside.inst-tc-side #sort_city,
    body.theme-saudi.pg-training-courses aside.inst-tc-side #sort_lang,
    body.theme-saudi.pg-training-courses aside.inst-tc-side #sort_month,
    body.theme-saudi.pg-training-courses aside.inst-tc-side #sort_course_year{display:block!important;width:100%!important}
}

/* ─────────────────────────────
   (2026-09-12) طلب صريح: "اعمل للفلتر دا من فوق ترويسة".
   رأس الفلتر كان سطر نص على أبيض، والكروت جنبه فوقها شرايط خضرا — فالفلتر
   كان مالوش رأس واضح. هنا شريط أخضر بعرض اللوحة: العنوان أبيض و"Clear"
   عليه بحواف مدوّرة من فوق زي الكروت.
   ───────────────────────────── */
body.theme-saudi.pg-training-courses .inst-tc-side{overflow:hidden;border-radius:8px}
body.theme-saudi.pg-training-courses .inst-tc-side-head{
    background:#006233;padding:13px 16px!important;border-bottom:3px solid #c9a227;
    display:flex;align-items:center;justify-content:space-between;gap:10px}
body.theme-saudi.pg-training-courses .inst-tc-side-title{color:#fff;font-weight:700;font-size:.82rem}
body.theme-saudi.pg-training-courses .inst-tc-side-title::before{background:#c9a227;width:12px;height:2px}
body.theme-saudi[dir="rtl"].pg-training-courses .inst-tc-side-title{letter-spacing:normal;font-size:.95rem}
body.theme-saudi.pg-training-courses .inst-tc-side-head .inst-tc-side-reset,
body.theme-saudi .inst-tc-side-head .inst-tc-side-reset{color:#e8f2ec!important;font-weight:700}
body.theme-saudi.pg-training-courses .inst-tc-side-head .inst-tc-side-reset:hover,
body.theme-saudi .inst-tc-side-head .inst-tc-side-reset:hover{color:#fff!important;text-decoration:underline}


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

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

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

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

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

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

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

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

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

body.theme-saudi #main-search-popup .modal-dialog{max-width:720px!important}
body.theme-saudi .modal .form-group.row > .course-type{flex:0 0 33.333%!important;max-width:33.333%!important}
body.theme-saudi .modal .form-group.row > .category-id{flex:0 0 33.334%!important;max-width:33.334%!important}
body.theme-saudi .modal .form-group.row > .city-id{flex:0 0 100%!important;max-width:100%!important}
body.theme-saudi .modal .form-group.row > .lang-id{flex:0 0 50%!important;max-width:50%!important}
body.theme-saudi .modal .form-group.row > .month-search{flex:0 0 33.333%!important;max-width:33.333%!important}
body.theme-saudi .modal .form-group.row > .year-search{flex:0 0 50%!important;max-width:50%!important}
@media (max-width:575px){
    /* (2026-09-12) طلب صريح: شكل بوب-أب البحث على الموبايل يتنوّع زي الديسكتوب.
       كان كل المواقع بتسطّح الست خانات لـ100% فطلعوا 8 صفوف متطابقة.
       العروض موزّعة حسب الترتيب المرئي لهذا الموقع تحديدًا (الترتيب مختلف
       من موقع لموقع) عشان كل صف يملا عرضه من غير فراغات.
       الاسم فوق وزرار البحث تحت زي ما اتفقنا. ليدرز ليه شكله الخاص أصلًا. */
    body.theme-saudi .modal .form-group.row > .course-type{flex:0 0 100%!important;max-width:100%!important}
    body.theme-saudi .modal .form-group.row > .month-search{flex:0 0 50%!important;max-width:50%!important}
    body.theme-saudi .modal .form-group.row > .category-id{flex:0 0 50%!important;max-width:50%!important}
    body.theme-saudi .modal .form-group.row > .year-search{flex:0 0 33.333%!important;max-width:33.333%!important}
    body.theme-saudi .modal .form-group.row > .lang-id{flex:0 0 33.333%!important;max-width:33.333%!important}
    body.theme-saudi .modal .form-group.row > .city-id{flex:0 0 33.334%!important;max-width:33.334%!important}
}

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

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



/* (2026-09-12) طلب صريح: كلام بنر /training-courses ياخد عرض الصفحة كله عشان عدد السطور يقل.
   الخلفية هنا لون/زخرفة كاملة العرض، فمافيش شكل على اليمين الكلام يدخل تحته. */
body.theme-saudi.pg-training-courses #common-banner-section-image .common-banner-text{max-width:none}

/* (2026-09-12) طلب صريح: نفس فرد الكلام في بنر صفحات الأقسام
   (#common-banner-section-icon) زي ما اتعمل في /training-courses. */
body.theme-saudi.pg-training-courses #common-banner-section-icon .common-banner-text{max-width:none}

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

body.theme-saudi.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. */
/* هيكل: الخانات في مجموعتين بعنوان لكل مجموعة (العناوين في نسخة الثيم:
   app/Views/themes/saudi/search/.../modify_search_desktop.php).
   الترتيب بقيم بينها فراغ عشان عنوان كل مجموعة يقع قبل خاناتها بالظبط. */
body.theme-saudi.pg-search-page .search-results-wrap-left .box{background:#fff!important;border:1px solid #d9e2dc;border-radius:12px;padding:16px;row-gap:8px}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .sa-grp{order:20;font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#006233;padding:6px 0 4px;border-bottom:2px solid #f5c518;margin-bottom:2px}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .search-input-main:first-child{order:5}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .search-input-main:not(:first-child){order:10}
/* العنوان التاني لازم ياخد قيمته بنفسه: من غيرها الاتنين بياخدوا order:20
   فبيتجمّعوا فوق قبل كل الخانات. و:nth-of-type مابتنفعش هنا لأنها بتعد كل
   الـdiv الإخوة مش الـ.sa-grp بس — فبنمسك التاني بـ.sa-grp ~ .sa-grp. */
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .sa-grp ~ .sa-grp{order:50}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .category-id{order:30}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .course-type{order:40}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .city-id{order:60}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .lang-id{order:70}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .year-search{order:80}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .month-search{order:90}
body.theme-saudi.pg-search-page .search-results-wrap-left .form-group > .search-btn-main{order:100;margin-top:10px}

/* (2026-09-12) في النمط ده الصندوق الداكن اتشال، والعنوان كان بكلاس color-white
   فبقى أبيض على رمادي فاتح ومش مقروء — فبياخد لون المعهد الغامق. */
body.theme-saudi.pg-search-page .search-results-wrap-left .box h5,body.theme-saudi.pg-search-page .search-results-wrap-left .box h5.color-white{color:#10261a!important;font-size:1rem;letter-spacing:.02em}

/* (2026-09-12) طلب صريح: تغيير أيقونات صفحة نتايج البحث، وكل معهد بثلاثي مختلف.
   الـmask متطبّق على الـ<svg> نفسه مش على عنصر أب: نسخ الموبايل بتقع جوّه <span>
   بلا كلاس فمفيش أب أعلّق عليه — وكده محدِّد واحد بيغطي الديسكتوب والموبايل.
   خط bootstrap-icons مش محمّل في الصفحة (fonts.check=false) فطريق كودات الخط مقفول.
   الرسمة الأصلية بتتلغي بـfill:transparent واللون بيجي من background-color.
   bi-x (قفل المودال) وزراري العرض برّه المحدِّدات دي. */
body.theme-saudi.pg-search-page svg.bi-calendar-check-fill,body.theme-saudi.pg-search-page svg.bi-flag-fill,body.theme-saudi.pg-search-page svg.bi-clock-fill,body.theme-saudi.pg-search-page svg.bi-signpost-split-fill{fill:transparent!important;background-color:#006233;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-saudi.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='M2 2v13.5a.5.5 0 0 0 .74.439L8 13.069l5.26 2.87A.5.5 0 0 0 14 15.5V2a2 2 0 0 0-2-2H4a2 2 0 0 0-2 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='M2 2v13.5a.5.5 0 0 0 .74.439L8 13.069l5.26 2.87A.5.5 0 0 0 14 15.5V2a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2z'/></svg>")}
body.theme-saudi.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 8c0 3.866-3.582 7-8 7a9.06 9.06 0 0 1-2.347-.306c-.584.296-1.925.864-4.181 1.234-.2.032-.352-.176-.273-.362.354-.836.674-1.95.77-2.966C.744 11.37 0 9.76 0 8c0-3.866 3.582-7 8-7s8 3.134 8 7z'/></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 8c0 3.866-3.582 7-8 7a9.06 9.06 0 0 1-2.347-.306c-.584.296-1.925.864-4.181 1.234-.2.032-.352-.176-.273-.362.354-.836.674-1.95.77-2.966C.744 11.37 0 9.76 0 8c0-3.866 3.582-7 8-7s8 3.134 8 7z'/></svg>")}
body.theme-saudi.pg-search-page svg.bi-clock-fill,body.theme-saudi.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) طلب صريح: "تصميم أيقونات صفحة المدن مش حلوة". الأيقونات السياحية
   اتشالت من الفيو واتحطّ مكانها أول حرف من اسم المدينة (سبب إضافي: bi-bridge
   لإسطنبول مش موجود في بيلد الأيقونات فكانت دايرة فاضية).
   الدايرة نفسها زي ما هي (46px، #eef6f1، وبتتقلب خضرا عند المرور) — اللي اتغيّر
   هو محتواها: حرف بخط ثقيل ومتمركز، ومقاس ثابت عشان العربي والإنجليزي يتساووا. */
body.theme-saudi .sa-cg-ico--letter{
    font-size:1.15rem;font-weight:800;line-height:1;
    font-family:inherit;letter-spacing:0;text-transform:uppercase}
/* (2026-09-12) المدن اللي بتتشارك نفس الحرف الأول بتاخد حرفين عشان تتفرّق
   (الدمام/دبي = دم/دب، Dammam/Dubai = Da/Du). حرفين في دايرة 46px بيزنقوا
   على الحواف، فالخط بيصغّر شوية والتاني بيبقى small-caps عشان العلامة تفضل
   قريبة من شكل الحرف الواحد مش تقرا ككلمة مقصوصة. */
body.theme-saudi .sa-cg-ico--pair{
    font-size:.95rem;letter-spacing:-.01em;text-transform:none}

/* ─────────────────────────────
   (2026-09-18) بطاقة الجدول والرسوم على الموبايل: عمودين (تفاصيل | سعر ١٦٨px)
   على ٣٢٠px بيسيبوا للتفاصيل ~١٥٠px فخانة المدينة بتنكمش لـ"C" والزرار بيتحشر.
   تحت ٧٦٨px: عمود واحد — التفاصيل، بعدها السعر والزرار في صف بخط متقطع
   فاصل. الـul عليه style="width:50% !important" inline من القالب فـmin-width.
   ───────────────────────────── */
@media (max-width:767px){
    html body.theme-saudi.pg-training-courses .session-card{
        grid-template-columns:minmax(0,1fr) auto!important}
    html body.theme-saudi.pg-training-courses .session-card > ul{
        grid-column:1/-1!important;grid-row:1!important;min-width:100%!important;box-sizing:border-box}
    html body.theme-saudi.pg-training-courses .session-card .price-box{
        grid-column:1!important;grid-row:2!important;border-inline-start:0!important;
        border-top:2px dashed #cfd8d2!important;padding:12px 16px!important;text-align:start!important;
        align-self:stretch}
    html body.theme-saudi.pg-training-courses .session-card > form,
    html body.theme-saudi.pg-training-courses .session-card > .text-end{
        grid-column:2!important;grid-row:2!important;padding:0 16px!important;margin:0!important;
        border-top:2px dashed #cfd8d2;align-self:stretch;display:flex;align-items:center}
}


/* ═════════════════════════════════════════════════════════════
   (2026-09-18) صفحة "عن المعهد" — بنية مختلفة لكل معهد (طلب صريح: صفحات الموبايل
   شبه بعضها). الـHTML واحد (about_vmv.php: رؤية/رسالة/وعد/قيم) والبنية بتتغيّر
   بالـCSS: عدد الأعمدة، مكان الصورة، الترتيب، شكل العنوان — مش الألوان بس.
   ═════════════════════════════════════════════════════════════ */
body.theme-saudi.page-about #common-listing-section .box4{background:transparent;box-shadow:none;padding:0;display:grid;gap:16px}
body.theme-saudi.page-about #common-listing-section .aboutus-section-card{background:#fff;border:1px solid #cfd8d2;border-radius:0;padding:0;margin:0;overflow:hidden}
body.theme-saudi.page-about #common-listing-section .aboutus-section-card .row{display:flex;flex-direction:column;margin:0}
body.theme-saudi.page-about #common-listing-section .aboutus-section-card .col-md-6{max-width:100%;width:100%;padding:0}
body.theme-saudi.page-about #common-listing-section .aboutus-section-card .col-md-6:has(> img){order:2;padding:6px 18px 18px}
body.theme-saudi.page-about #common-listing-section .aboutus-section-card .col-md-12{display:none}
body.theme-saudi.page-about #common-listing-section .aboutus-vision img,body.theme-saudi.page-about #common-listing-section .aboutus-mission img,body.theme-saudi.page-about #common-listing-section .aboutus-brand img{width:100%;max-height:150px;object-fit:cover;border:0;border-radius:0;box-shadow:none}
body.theme-saudi.page-about #common-listing-section .aboutus-section-card h4{background:#006233;color:#fff;margin:0;padding:11px 18px;font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;border-inline-start:6px solid #f7c608}
body.theme-saudi.page-about #common-listing-section .aboutus-section-card p{padding:14px 18px 6px;margin:0;color:#10261a}
body.theme-saudi.page-about #common-listing-section .aboutus-values .aboutus-section-row{background:none;border:0;box-shadow:none;padding:0}
body.theme-saudi.page-about #common-listing-section .aboutus-values .aboutus-section-row .row{display:grid;grid-template-columns:repeat(2,1fr);gap:0;margin:0;padding:12px 18px 18px}
body.theme-saudi.page-about #common-listing-section .aboutus-values .aboutus-col-5{flex:none;max-width:none;margin:-1px 0 0 -1px;padding:8px;border:1px solid #e0e6e2}
body.theme-saudi.page-about #common-listing-section .aboutus-values img{border:0;box-shadow:none}
@media (min-width:992px){body.theme-saudi.page-about #common-listing-section .aboutus-values .aboutus-section-row .row{grid-template-columns:repeat(5,1fr)}body.theme-saudi.page-about #common-listing-section .aboutus-section-card .row{flex-direction:row;align-items:stretch}body.theme-saudi.page-about #common-listing-section .aboutus-section-card .col-md-6{flex:1 1 50%;width:auto}body.theme-saudi.page-about #common-listing-section .aboutus-section-card .col-md-6:has(> img){order:2;padding:18px}}

body.theme-saudi.page-about #common-listing-section .aboutus-values .aboutus-section-row .row{grid-template-columns:repeat(3,1fr)}
@media (min-width:992px){body.theme-saudi.page-about #common-listing-section .aboutus-values .aboutus-section-row .row{grid-template-columns:repeat(5,1fr)}}