/* =========================================
   الشجرة الطيبة — CSS هجينة (Fallback + حديث)
   ملاحظات:
   - بلا متغيرات CSS لضبط أخطاء أدوات التصغير القديمة.
   - تم توفير fallbacks لكل خاصية حديثة مهمة.
   ========================================= */

/* الخط والخلفية الافتراضية */
body{
  background:#f6f7f9;          /* fallback */
  color:#0f172a;               /* fallback */
  font-family:"Cairo","Segoe UI",Tahoma,sans-serif;
}

/* عند التحويل إلى LTR نستخدم Inter */
html.lang-ltr body{
  font-family:"Inter","Segoe UI",Tahoma,sans-serif;
}

/* شريط التنقّل */
.navbar{
  background:#ffffff;
  border-bottom:1px solid #e7edf3;
  box-shadow:0 2px 12px rgba(0,0,0,.04);
}
[data-theme="dark"] .navbar{ background:#0f1317; }

/* نص الشعار بتدرّج ذهبي (قد تعطي الأدوات القديمة تحذيرًا من background-clip) */
.brand-text{
  font-weight:800;
  letter-spacing:.2px;
  background:linear-gradient(180deg,#fff7d1,#f4c84e 40%,#d7a52a 60%,#9a6d14);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-stroke:.3px rgba(154,109,20,.45);
}

/* =========================
   HERO
   ========================= */
.hero{
  /* Fallback قديم: Flex */
  display:flex;
  align-items:center;
  justify-content:center;

  /* تحسين حديث: Grid (إن دُعم) */
  display:grid;              /* قد يتجاهله القديم */
  /* مركزية العناصر في Grid (تحسين حديث) */
  place-items:center;        /* قد يولّد تحذير، لكن لدينا Flex فوق */

  position:relative;
  min-height:78vh;
  text-align:center;
  overflow:hidden;
  color:#ffffff;
  background:#0a0a0a url('/assets/hero.jpg') center/cover no-repeat;
}
.hero::after{
  content:"";
  position:absolute;
  /* استبدال inset:0; لتوافق أوسع */
  top:0; right:0; bottom:0; left:0;
  background:
    radial-gradient(900px 500px at 80% 10%, rgba(10,138,123,.18), transparent 55%),
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
}
.hero-inner{ position:relative; z-index:2; max-width:900px; padding:32px; }

/* حجم الخط مع fallback قبل clamp() */
.hero h1{
  font-size:28px;                 /* fallback ثابت */
  font-size:clamp(28px,4.5vw,48px);
  margin-bottom:12px;
}
.hero p.lead{
  color:#e7ecef;
  font-size:16px;                 /* fallback ثابت */
  font-size:clamp(15px,2.4vw,18px);
}
.hero-cta .btn{
  border-radius:999px;
  padding:.75rem 1.25rem;
  font-weight:700;
}

/* زر العلامة (بدون متغيرات) */
.btn-brand{
  background:#0a8a7b;            /* fallback */
  border-color:#0a8a7b;          /* fallback */
  color:#fff;
}
.btn-brand:hover{
  background:#0f6c63;            /* fallback */
  border-color:#0f6c63;          /* fallback */
  color:#fff;
}

/* بطاقات اللمحات أعلى الصفحة */
.info-cards{ margin-top:-64px; position:relative; z-index:3; }
.info-cards .card{
  border:1px solid #e7edf3;
  box-shadow:0 10px 30px rgba(16,20,24,.08);
}

/* المقاطع العامة */
section{ padding:64px 0; }
.section-title{ font-weight:800; margin-bottom:8px; }
.section-sub{ color:#64748b; margin-bottom:24px; }

/* بطاقات المنتجات */
.product-card{
  border:1px solid #e7edf3;
  box-shadow:0 10px 30px rgba(16,20,24,.08);
  transition:transform .2s ease;
}
.product-card:hover{ transform:translateY(-4px); }
.price{ font-weight:800; color:#0a8a7b; }

/* تبويبات الفئات */
.nav-pills .nav-link{
  border:1px solid #e7edf3;
  color:#0f172a;
  font-weight:600;
}
/* gap قد يتجاهله القديم — لا ضرر */
.nav-pills{ gap:.5rem; }
.nav-pills .nav-link.active{
  background:#0a8a7b;
  border-color:#0a8a7b;
  color:#ffffff;
}

/* أيقونات الخدمات */
.service-icon{
  width:48px; height:48px;

  /* Fallback: Flex */
  display:flex;
  align-items:center;
  justify-content:center;

  /* تحسين حديث: Grid */
  display:grid;
  place-items:center;

  border-radius:12px;
  background:rgba(10,138,123,.08);
  color:#0a8a7b;
}

/* الأحداث — دعم RTL/LTR بدون خصائص منطقية */
.event{
  /* افتراضي RTL */
  border-right:3px solid #0a8a7b;
  padding-right:16px;
}
html[dir="ltr"] .event,
.lang-ltr .event{
  border-right:0;
  padding-right:0;
  border-left:3px solid #0a8a7b;
  padding-left:16px;
}
.event time{ color:#64748b; font-size:.95rem; }

/* مربعات الاشتراك/المعلومات */
.subscribe-box{
  border:1px solid #e7edf3;
  box-shadow:0 10px 30px rgba(16,20,24,.08);
  background:#ffffff;
  border-radius:16px;
}

/* تحسين تركيز الحقول */
.form-control:focus{
  border-color:#0a8a7b;
  box-shadow:0 0 0 .2rem rgba(10,138,123,.25);
}

/* أنيميشن دخول العناصر */
[data-animate]{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .5s ease, transform .5s ease;
}
[data-animate].in{ opacity:1; transform:none; }

/* الفوتر */
footer{ background:#ffffff; border-top:1px solid #e7edf3; }
[data-theme="dark"] footer{ background:#0f1317; }

/* أيقونات الشبكات */
.social a{
  width:36px; height:36px;

  /* Fallback: Flex */
  display:flex;
  align-items:center;
  justify-content:center;

  /* تحسين حديث: Grid */
  display:grid;
  place-items:center;

  border-radius:8px;
  border:1px solid #e7edf3;
}

/* زر تبديل الثيم */
.theme-toggle{ border-radius:999px; }

/* =========================
   ثيم داكن (بدون متغيرات)
   ========================= */
[data-theme="dark"] body{
  background:#0f1317;
  color:#e7ecef;
}
[data-theme="dark"] .section-sub{ color:#9aa6b2; }
[data-theme="dark"] .info-cards .card,
[data-theme="dark"] .product-card,
[data-theme="dark"] .subscribe-box{
  background:#13181d;
  border-color:#222a33;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
[data-theme="dark"] .nav-pills .nav-link{
  color:#e7ecef;
  border-color:#222a33;
}
[data-theme="dark"] .social a{ border-color:#222a33; }
[data-theme="dark"] .event time{ color:#9aa6b2; }

/* =========================
   تحسينات الموبايل
   ========================= */
@media (max-width: 576px){
  .hero{ min-height:64vh; }
  .hero-inner{ padding:20px; }
  .info-cards{ margin-top:-28px; }
  section{ padding:40px 0; }
  .navbar .btn{ padding:.45rem .75rem; }
  .card .card-body{ padding:0.75rem 0.75rem 1rem; }
  .brand-text{ font-size:1rem; }

  /* تبويبات قابلة للتمرير أفقياً */
  .nav-pills{
    gap:.5rem;                       /* قد يُتجاهل في القديم */
    flex-wrap:nowrap; 
    overflow-x:auto; 
    -webkit-overflow-scrolling:touch;
  }
  .nav-pills::-webkit-scrollbar{ display:none; }
}