/* =====================================================================
   الأساس المشترك لكل صفحات الموقع: الخطوط، متغيرات الهوية، إعادة الضبط، شريط التمرير
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Reem+Kufi:wght@400..700&display=swap');

@font-face {
            font-family: 'IWAN ZAZA';
            src: local('IWAN ZAZA'), local('IwanZaza'), url('/fonts/IWAN-ZAZA.woff2') format('woff2');
            font-weight: normal;
            font-style: normal;
        }

:root {
            /* ألوان البراند الأساسية المرفقة بدقة */
            --brand-header-secondary-1: #16574a; /* اللون الثانوي الأول الداكن */
            --brand-header-secondary-2: #25806d; /* اللون الثانوي الثاني المتوسط */
            --brand-header-teal-green: #4da291;   /* الأخضر المائل للتركواز الفاتح */
            
            /* ألوان التفاعل والعمق الفاخر المستوحاة من تدرجات المجمع الطبي */
            --brand-header-dark: #0d3830;
            --brand-header-gold: #e1b12c;         /* اللون الذهبي الفاخر للهافر والتفاعل */
            --brand-header-gold-hover: #f0c242;
    --rq-rgb-dark: 13, 56, 48;
    --rq-rgb-primary: 22, 87, 74;
    --rq-rgb-secondary: 37, 128, 109;
    --rq-rgb-teal: 77, 162, 145;
    --rq-rgb-gold: 225, 177, 44;
            --brand-header-white: #FFFFFF;
            --brand-header-light-gray: rgba(255, 255, 255, 0.85);
            
            /* إعدادات الخط الافتراضي */
            --font-family-primary: 'IWAN ZAZA', 'Cairo', sans-serif;
            
            /* انتقالات حركة ناعمة */
            --transition-header-smooth: all 0.5s cubic-bezier(0.25, 1, 0.2, 1);
            --transition-header-fast: all 0.3s ease;
        }

* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            scroll-behavior: smooth;
        }

body {
            font-family: var(--font-family-primary);
            color: #2d3748;
            overflow-x: hidden;
            line-height: 1.6;
        }

a {
            text-decoration: none;
            color: inherit;
        }

ul {
            list-style: none;
        }

::-webkit-scrollbar {
            width: 8px;
        }

::-webkit-scrollbar-track {
            background: #f1f1f1;
        }

::-webkit-scrollbar-thumb {
            background: var(--brand-header-secondary-1);
            border-radius: 10px;
        }

::-webkit-scrollbar-thumb:hover {
            background: var(--brand-header-secondary-2);
        }

/* بطاقات الأطباء: الصورة والاسم يفتحان صفحة الطبيب (إن وُجدت) — لوحة التحكم ← الأطباء ← صفحة الطبيب */
.doctors-main-section-card-name a, .doctors-section-card-name a { color: inherit; text-decoration: none; }
.doctors-main-section-card-name a:hover, .doctors-section-card-name a:hover { color: var(--brand-header-secondary-2, #25806d); }
.doctors-main-section-card-profile-link, .doctors-section-card-profile-link { display: block; width: 100%; height: 100%; }
/* زر "الملف التعريفي": على سطر واحد وبحجم متناسق مع زر الحجز */
.doctors-section-card-footer:has(.is-profile) > a, .doctors-main-section-card-actions:has(.is-profile) > a { white-space: nowrap; font-size: 0.8rem; gap: 6px; padding-inline: 12px; min-width: 0; }
/* صفحة الأطباء: الزران بعرض محتواهما (البطاقة ضيقة في عرض 4 بطاقات بالصف) */
.doctors-section-card-footer:has(.is-profile) { display: flex; gap: 6px; }
.doctors-section-card-footer:has(.is-profile) > a { flex: 1 1 auto; padding-inline: 8px; gap: 5px; font-size: 0.78rem; }
.doctors-section-card-footer:has(.is-profile) > a.is-profile { flex-grow: 1.3; }
/* سلايدر الأطباء: كل زر بعرض محتواه (لا يخرج النص من الزر) */
.doctors-main-section-card-actions:has(.is-profile) > a { flex: 1 1 auto; justify-content: center; }
/* بانرات الهيرو: صورة خاصة بالجوال (من لوحة التحكم) إن وُجدت، تظهر كاملة بدل قص جانبي صورة الكمبيوتر */
@media (max-width: 768px) {
    .hero-slide-item-image[style*="--hero-m"] { background-image: var(--hero-m) !important; }
}
/* صور البطاقات على الجوال: مقاس موحّد لكل قسم (نفس المقاس المطلوب في لوحة التحكم)
   فتظهر كل صور القسم بنفس الحجم، والصورة المصمّمة على هذا المقاس تظهر كاملة بلا قص */
@media (max-width: 768px) {
    /* مقالات وخدمات: 1536 × 1024 */
    .services-section-image-box,
    .services-section-img-wrapper,
    .services-dental-section-image-wrapper,
    .blogs-section-image-side,
    .our-fou-blogs-section-card-image-box { height: auto !important; aspect-ratio: 1536 / 1024 !important; }
    /* الأجهزة: 1080 × 1440 */
    .devices-section-single-card-img-wrapper { height: auto !important; aspect-ratio: 1080 / 1440 !important; }
    /* الفروع: 1400 × 770 */
    .branches-section-card-image-box { height: auto !important; aspect-ratio: 1400 / 770 !important; }
    /* الصورة لا تكبّر الصندوق (صندوق بطاقة الخدمة يبقى overflow: visible لأيقونة البطاقة) */
    .services-section-image-box { min-height: 0 !important; }
    .services-section-image-wrapper { position: absolute !important; inset: 0; height: auto !important; }
    /* صور داخل المقال: 1536 × 1024 */
    .rq-featured-img { aspect-ratio: 1536 / 1024 !important; height: auto !important; object-fit: cover !important; }
    .services-section-img,
    .devices-section-single-card-img,
    .services-section-card-image,
    .services-dental-section-image,
    .blogs-section-article-image,
    .our-fou-blogs-section-card-image,
    .branches-section-card-image { display: block; width: 100% !important; height: 100% !important; aspect-ratio: auto !important; object-fit: cover !important; object-position: center !important; }
}
/* أحدث المقالات على الجوال: العنوان وزر "عرض جميع المقالات" كلٌّ في سطر واحد بجانب بعض */
@media (max-width: 768px) {
    .our-fou-blogs-section-top-bar { flex-wrap: nowrap !important; gap: 10px; align-items: center; }
    .our-fou-blogs-section-main-heading { font-size: clamp(1.2rem, 5.6vw, 1.5rem) !important; white-space: nowrap; }
    .our-fou-blogs-section-view-all-link { font-size: clamp(0.78rem, 3.4vw, 0.9rem) !important; white-space: nowrap; flex-shrink: 0; }
}
/* أطباء المجمع على الجوال: العنوان وزر "عرض جميع الأطباء" بجانب بعض، والزر في سطر واحد */
@media (max-width: 768px) {
    .doctors-main-section-header-container { flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 10px !important; }
    .doctors-main-section-title-box { min-width: 0; }
    .doctors-main-section-main-title { font-size: clamp(0.98rem, 4.6vw, 1.3rem) !important; }
    .doctors-main-section-view-all-link { white-space: nowrap; flex-shrink: 0; align-self: center !important; font-size: clamp(0.76rem, 3.3vw, 0.9rem) !important; padding: 5px 9px !important; gap: 5px !important; }
    /* صفحة الطبيب: عنوان "احجزي استشارتك مع د. ..." في سطر واحد */
    .dr-cta h2 { font-size: clamp(0.95rem, 4.3vw, 1.2rem) !important; white-space: nowrap; }
}
/* الشاشات الضيقة جداً: عنوان صفحة الطبيب ينكسر بدل أن يخرج عن البطاقة */
@media (max-width: 340px) {
    .dr-cta h2 { white-space: normal; }
    /* الفروع: أزرار البطاقة (احجز الآن، اتصل بنا، الموقع) كلٌّ في سطر واحد */
    .branches-section-action-btn { white-space: nowrap; font-size: clamp(0.74rem, 3.3vw, 0.9rem) !important; gap: 4px !important; }
}
/* صفحة الأطباء (الجوال والكمبيوتر): صورة الطبيب مربعة بنفس الحجم لكل الأطباء، وتُعرض من أعلاها
   (الشعار والوجه والصدر) — يظهر من صورة الطبيب (1086 × 1448) المربع العلوي 1086 × 1086 */
.doctors-section-card-img-holder { height: auto !important; aspect-ratio: 1 / 1; }
.doctors-section-card-img-holder > .doctors-section-card-profile-link { position: absolute; inset: 0; display: block; }
.doctors-section-card-img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center top !important; }
/* سلايدر الأطباء (الرئيسية، عن رونق، الخدمات، صفحات الخدمات) على الجوال: نفس الصورة المربعة من الأعلى */
@media (max-width: 768px) {
    .doctors-main-section-card-image-box { height: auto !important; aspect-ratio: 1 / 1; }
    .doctors-main-section-card-image { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center top !important; }
}

/* قائمة الجوال مفتوحة: زر واتساب العائم لا يغطي روابطها */
body:has(.header-aside-drawer-wrapper.active) .wa-btn { display: none; }
