/* ============================================================
   احتياطي مقياس المسافات.
   هذا الملف يستعمل var(--sp-N) في كل الحشو والفجوات، لكن صفحة
   البحث لا تحمّل amtar-design-system.css — فتسقط كل تلك القيم إلى
   صفر: تلتصق أيقونات المواصفات بنصوصها، ويختفي الإطار الغائر حول
   الصورة، وتختنق البطاقة. نعرّفها هنا بنفس القيم كي لا يعتمد الملف
   على ورقة قد لا تُحمَّل.
   ============================================================ */
:root{
  --sp-1:4px;  --sp-2:8px;   --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px;  --sp-8:32px; --sp-10:40px;
  --sp-12:48px; --sp-16:64px;
}

/* amtar-pc.css — تنسيق بطاقة العقار على صفحات التطبيق.
   منقول كما هو من amtar-design-system.css، لأن تلك الورقة لا تُحمَّل
   على صفحات التطبيق (تحمل أنماطاً عامة قد تتعارض مع أنماط التطبيق).
   المتغيّرات (--sp-* و--fs-* والألوان) معرّفة في amtar-rqc.css
   المحمّلة قبلها. نفس أسلوب بطاقة الطلب. */
.card{
  background:var(--background-surface);
  border:1px solid var(--border-light);
  border-radius:var(--radius-lg);
  overflow:hidden;
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.card:hover{border-color:var(--border-default);box-shadow:var(--shadow-sm)}
.card-pad{padding:var(--sp-5)}

/* بطاقة عقار موحّدة */
.property-card .pc-media{position:relative;aspect-ratio:4/3;background:var(--background-muted);
  margin:var(--sp-2);border-radius:var(--radius);overflow:hidden}
/* تعتيم لطيف أسفل الصورة عند المرور ليتضح نص الناشر — نفس أسلوب «استكشف المشاريع» */
.property-card .pc-media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,transparent 45%,rgba(0,0,0,.42) 100%);
  opacity:0;transition:opacity var(--dur) var(--ease)}
.property-card:hover .pc-media::after{opacity:1}
/* شريط ناشر الإعلان: لوح زجاجي بلا حدّ، يظهر عند مرور الفأرة */
.property-card .pc-pub{position:absolute;inset-inline:8px;bottom:8px;z-index:3;
  display:flex;align-items:center;gap:9px;padding:8px 10px;border:none;
  border-radius:var(--radius);
  background:rgba(255,255,255,.13);
  backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);
  opacity:0;transform:translateY(6px);pointer-events:none;
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.property-card:hover .pc-pub{opacity:1;transform:none}
.property-card .pc-pub-img{width:34px;height:34px;border-radius:var(--radius-full);
  object-fit:cover;flex-shrink:0;background:rgba(255,255,255,.92)}
.property-card .pc-pub-ini{display:grid;place-items:center;color:var(--brand-primary);
  font-size:var(--fs-sm);font-weight:700;line-height:1}
.property-card .pc-pub-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.property-card .pc-pub-name{color:#fff;font-size:var(--fs-xs);font-weight:700;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.property-card .pc-pub-type{color:rgba(255,255,255,.82);font-size:var(--fs-2xs);line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* لا يظهر الشريط على الأجهزة اللمسية (لا يوجد مرور فأرة) */
@media (hover:none){.property-card .pc-pub{display:none}.property-card .pc-media::after{display:none}}
.property-card .pc-media img{width:100%;height:100%;object-fit:cover}
.property-card .pc-media .pc-empty{width:100%;height:100%;display:grid;place-items:center;color:var(--text-muted)}
.property-card .pc-media .pc-empty svg{width:34px;height:34px;opacity:.4}
.property-card .pc-badge{position:absolute;top:10px;inset-inline-end:10px;background:var(--brand-secondary);color:#fff;font-size:var(--fs-2xs);font-weight:700;padding:4px 11px;border-radius:var(--radius-full)}
.property-card .pc-tag{position:absolute;top:10px;inset-inline-start:10px;background:rgba(23,63,58,.88);color:#fff;font-size:var(--fs-2xs);font-weight:700;padding:4px 11px;border-radius:var(--radius-full)}
.property-card .pc-body{padding:var(--sp-4);padding-top:var(--sp-3)}
.property-card .pc-title{font-size:var(--fs-base);font-weight:700;color:var(--text-primary);margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.property-card .pc-sub{font-size:var(--fs-xs);color:var(--text-muted);margin-bottom:var(--sp-3);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.property-card .pc-price{font-size:var(--fs-md);font-weight:700;color:var(--brand-secondary)}
.property-card .pc-specs{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:1px solid var(--border-light);font-size:var(--fs-xs);color:var(--text-secondary)}
.property-card .pc-specs span{display:inline-flex;align-items:center;gap:4px}
.property-card .pc-specs svg{width:14px;height:14px;color:var(--text-muted)}

/* شبكة نتائج صفحة البحث: كانت ملاصقة لحافتي الشاشة تماماً.
   الحشو هنا لا مضمّناً ليبقى متجاوباً مع مقاس الشاشة. */
#amtar-search-grid{padding-inline:28px}
@media(max-width:1024px){#amtar-search-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;padding-inline:20px}}
@media(max-width:768px){#amtar-search-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding-inline:16px}}
@media(max-width:520px){#amtar-search-grid{grid-template-columns:1fr!important;padding-inline:14px}}

/* ============================================================
   تنسيق كروت البحث — العقارات والمشاريع
   ١) ٤ أعمدة على الشاشة العريضة تعطي كرتاً بعرض ٢٩٣px، وهو ضيّق
      على محتوى الكرت (شارة + ناشر + عنوان + موقع + سعر + مواصفات)
      فيبدو مزدحماً. ثلاثة أعمدة تعطي ~٤١٠px وتُريح المحتوى.
   ٢) كرت المشروع كانت صورته ملاصقة للحواف بلا إطار، بينما كرت
      العقار له إطار غائر مستدير. وُحّدا.
   ============================================================ */
@media(min-width:1025px){
  #amtar-search-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important}
}

/* إطار الصورة الغائر في كرت المشروع — كما في كرت العقار.
   بقيم صريحة لا بمتغيّرات: --sp-2 غير معرّف على صفحة البحث فتسقط
   القاعدة كلها ويعود الهامش صفراً. */
.amtar-project-card .amtar-card-media{
  margin:8px!important;
  border-radius:12px!important;
  overflow:hidden!important;
  /* كرت العقار صورته 4/3 (مستطيلة) وكرت المشروع 5/4 (شبه مربعة)،
     فيخرج أطول ويبدو مختلفاً. توحيد النسبة يوحّد شكل البطاقتين
     ويقصّر كرت المشروع. */
  aspect-ratio:4/3!important;
}
.amtar-project-card .amtar-card-media img,
.amtar-project-card .amtar-img-grad,
.amtar-project-card .amtar-img-grad-hover{border-radius:12px}

/* الكرتان بحدّ واحد وظلّ خفيف يرفعهما عن الخلفية */
.property-card,
.amtar-project-card{
  border-color:#E9EEEC!important;
  box-shadow:0 1px 3px rgba(22,33,31,.05)!important;
  transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease;
}
.property-card:hover,
.amtar-project-card:hover{
  box-shadow:0 8px 24px rgba(22,33,31,.10)!important;
  border-color:#D6DAD9!important;
  transform:translateY(-2px);
}

/* مساحة تنفّس داخل جسم الكرت */
.property-card .pc-body{padding:8px 16px 16px}

/* كرت المشروع أطول من كرت العقار بصفوفه الإضافية — نضبط الحشو */
.amtar-project-card > h3{margin-top:10px!important;margin-bottom:2px!important}
.amtar-project-card > p{margin-top:2px!important;margin-bottom:8px!important}