/* ══ بطاقةُ الدبّوس على الخرائط — مصدرٌ مشترك بين «الخريطة» و«عقاراتي» (قرارُ المالك 2026-10-16: بطاقةٌ واحدة) ══ */
/* ── Popup المصغّر للعقار ── */
.prop-popup {
    direction: rtl;
    font-family: 'Cairo', sans-serif;
    min-width: 230px;
    max-width: 260px;
    text-align: center;
}
.prop-popup-img {
    width: 100%;
    height: 120px;
    object-fit: cover;
    border-radius: 8px 8px 0 0;
    display: block;
}
/* 🖼️ مشهدُ الدبّوس: **المقاسُ نفسُه** (‏120px) والجديدُ التقليبُ وحدَه */
.prop-popup-gal { width: 100%; height: 120px; border-radius: 8px 8px 0 0 }
.prop-popup-gal .rc-count {
    display: inline-flex; align-items: center; gap: 3px; position: absolute;
    inset-inline-end: 6px; top: 6px; background: rgba(15,23,42,.6); color: #fff;
    font-size: .66rem; font-weight: 700; padding: 1px 6px; border-radius: 999px
}
.prop-popup-gal .rc-dots {
    display: flex; gap: 4px; position: absolute; inset-inline: 0; bottom: 6px; justify-content: center
}
.prop-popup-gal .rc-dots i {
    width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.6);
    box-shadow: 0 0 2px rgba(0,0,0,.5); transition: width .25s, background .25s
}
.prop-popup-gal .rc-dots i.on { width: 14px; border-radius: 3px; background: #fff }
.prop-popup-placeholder {
    width: 100%;
    height: 80px;
    background: linear-gradient(135deg,#e2e8f0,#cbd5e1);
    border-radius: 8px 8px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #94a3b8;
}
.prop-popup-body { padding: 10px 12px 6px; }
.prop-popup-type {
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    background: #1e3a8a;
    border-radius: 50px;
    padding: 3px 12px;
    display: inline-block;
    margin-bottom: 5px;
}
.prop-popup-type.land { background: #16a34a; }
.prop-popup-id { font-size: .95rem; color: #94a3b8; margin-top: 2px; display: block; }
.prop-popup-loc { font-size: 1.05rem; color: #475569; margin: 5px 0; }
.prop-popup-price { font-size: 1.25rem; font-weight: 700; color: #b45309; margin: 4px 0 8px; }
.prop-popup-area { font-size: 1rem; color: #64748b; margin-bottom: 4px; }
.prop-popup-ppm { font-size: .85rem; color: #6b7280; font-weight: 600; margin-bottom: 10px; }
.prop-popup-construction {
    display: inline-flex; align-items: center; gap: 5px;
    margin-bottom: 8px; padding: 2px 9px; border-radius: 999px;
    background: rgba(217,119,6,.10); border: 1px solid rgba(217,119,6,.45);
    color: #92400e; font-size: .78rem; font-weight: 800;
}
.prop-popup-link {
    display: block;
    text-align: center;
    background: #1e3a8a;
    color: #fff !important;
    border-radius: 8px;
    padding: 8px;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 600;
    margin-top: 6px;
}
.prop-popup-link:hover { background: #172554; }

/* 🧭 زرُّ الوصول: ثانويٌّ بصريّاً — «عرض التفاصيل» يبقى الفعلَ الأوّل */
.prop-popup-route {
    display: block;
    text-align: center;
    background: #fff;
    color: #1e3a8a !important;
    border: 1.5px solid #1e3a8a;
    border-radius: 8px;
    padding: 7px;
    text-decoration: none;
    font-size: .95rem;
    font-weight: 700;
    margin-top: 6px;
}
.prop-popup-route:hover { background: #eff6ff; }

/* ── الملكية المشتركة (بيع الحصص على الشيوع) داخل البطاقة ── */
.prop-popup-shared {
    background: #fdf5e8;
    border: 1px solid #d4a574;
    border-radius: 10px;
    padding: 6px 8px;
    margin-top: 6px;
}
.prop-popup-shared-title {
    color: #8a5a2b;
    font-size: .72rem;
    font-weight: 800;
    margin-bottom: 4px;
}
.prop-popup-share {
    display: block;
    background: #fff;
    border: 1px solid #ecd9bd;
    border-radius: 7px;
    padding: 3px 8px;
    margin-top: 3px;
    color: #1e3a8a !important;
    font-size: .74rem;
    font-weight: 700;
    text-decoration: none;
}
a.prop-popup-share:hover { background: #f6ead6; }

/* غلافُ توسيط البطاقة: مُخفىً خارج مقاس الجوال */
#map-popup-host { display: none; }

@media (max-width: 767.98px) {
    /* ══ بطاقةُ العقار تتوسّط الشاشة على الجوال (بلاغ المالك 2026-08-03) ══
       البطاقةُ المنبثقة في Leaflet مرساةٌ فوق الدبوس، فإن كان الدبوسُ قرب
       الحافّة أو كان محتواها طويلاً (حصصُ الشيوع مثلاً) خرج بعضُها عن الشاشة.
       فتُنقَل على الجوال إلى غلافٍ ثابتٍ يتوسّط الشاشة بخلفيّةٍ معتمة، ويُمرَّر
       محتواها داخليّاً مهما طال. والقواعدُ كلُّها داخل @media الجوال فلا يتغيّر
       سلوكُ المكتب البتّة، والنقلُ نفسُه مشروطٌ بمقاس الجوال في الـJS. */
    #map-popup-host {
        position: absolute;   /* داخل حاوية الخريطة — لا الشاشة — فتُصان أنماطُ Leaflet */
        inset: 0;
        z-index: 1200;        /* فوق لوحات Leaflet وأدواتها، وتحت ترويسة المنصّة */
        display: none;
        align-items: center;
        justify-content: center;
        padding: 14px;
        background: rgba(15, 23, 42, .5);
    }
    #map-popup-host.open { display: flex; }
    /* إبطالُ تموضع Leaflet المطلق (يضبطه بنمطٍ سطريٍّ فيلزم `!important`).
       ⚠️ ولا يُفرَض عرضٌ على الصندوق (بلاغ المالك 2026-08-03): فرضُه يُوسّعه
       دون محتواه — والمحتوى في `RTL` يلتصق باليمين فيبقى فراغٌ أبيضُ يساراً.
       فيهجُم الصندوقُ على محتواه بعرضه الطبيعيّ، **ثمّ يُزاح كاملاً** إلى
       الوسط بمحاذاة الغلاف — فتُناصفه البياناتُ بحكم البناء لا بالضبط. */
    #map-popup-host .leaflet-popup {
        position: relative !important;
        left: 0 !important; top: 0 !important; bottom: auto !important;
        transform: none !important;
        margin: 0 !important;
        max-width: min(92vw, 380px);
    }
    #map-popup-host .leaflet-popup-tip-container { display: none !important; }
    #map-popup-host .leaflet-popup-content-wrapper {
        max-height: 80vh;
        overflow-y: auto;
        overscroll-behavior: contain;
        border-radius: 16px;
        box-shadow: 0 18px 50px rgba(0,0,0,.35);
    }
    /* يُترَك عرضُ المحتوى كما يحسبه Leaflet (‏`maxWidth` المعتمد) فلا يتمدّد
       الصندوقُ عنه ولا ينكمش دونه — والفراغُ الجانبيُّ يزول بحكم ذلك. */
    #map-popup-host .leaflet-popup-content { margin: 14px 14px 16px; }
}
