/* E3MEL BUSINESS — Salla Custom CSS */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@500;600;700;800&display=swap');
/* ===== panel-1-header.html ===== */
.e3p1{font-family:'Cairo',Tahoma,sans-serif;direction:rtl;background:#fff;margin:0}
.e3p1 *{margin:0;padding:0;box-sizing:border-box}
.e3p1 img{display:block;max-width:100%}
.e3p1 a{text-decoration:none}
.e3p1-wrap{max-width:1440px;margin:0 auto;overflow-x:clip}
.e3p1-container{max-width:1240px;margin:0 auto;padding:0 18px;height:137px;display:flex;align-items:center;justify-content:space-between;position:relative}
.e3p1-logo img{width:108px;height:auto}
.e3p1-nav{display:flex;gap:37px;position:absolute;right:50%;transform:translateX(50%)}
.e3p1-nav a{font-size:24px;font-weight:600;color:#383838;line-height:1.4;padding-bottom:6px;border-bottom:3px solid transparent;transition:color .2s}
.e3p1-nav a.e3p1-active{color:#02A34D;border-bottom-color:#02A34D}
.e3p1-nav a:hover{color:#02A34D}
.e3p1-btn{width:178px;height:60px;background:#019F50;color:#fff;font-size:24px;font-weight:600;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;transition:background .2s,transform .2s}
.e3p1-btn:hover{background:#018A45;transform:translateY(-2px)}
@media (max-width:1024px){
  .e3p1-container{height:auto;padding:14px 18px;flex-wrap:wrap;gap:12px}
  .e3p1-nav{position:static;transform:none;order:3;width:100%;justify-content:center;gap:26px}
  .e3p1-nav a{font-size:18px}
  .e3p1-logo img{width:84px}
  .e3p1-btn{width:148px;height:50px;font-size:18px}
}

/* ===== panel-2-hero-stats.html ===== */
.e3p2{font-family:'Cairo',Tahoma,sans-serif;direction:rtl;background:#fff;margin:0}
.e3p2 *{margin:0;padding:0;box-sizing:border-box}
.e3p2 img{display:block;max-width:100%}
.e3p2 a{text-decoration:none}
.e3p2-wrap{margin:0 auto;overflow-x:clip;min-height:765px;
  background:linear-gradient(to left, rgba(244,250,251,.95) 6%, rgba(244,250,251,.55) 30%, rgba(244,250,251,0) 58%),
    #F4FAFB url('https://cdn.e3melbusiness.online/img-upload/hero2.jpg') center top no-repeat;background-size:cover,cover}
.e3p2-container{max-width:1240px;margin:0 auto;padding:0 18px}
.e3p2-container-hero{max-width:none;padding:0 56px}
.e3p2-hero{min-height:602px;display:flex;justify-content:flex-start}
.e3p2-hero-text{padding-top:84px;text-align:right}
.e3p2-badge{display:inline-block;background:rgba(2,160,77,.13);color:#028A46;font-size:19px;
  font-weight:700;padding:7px 22px;border-radius:30px;margin-bottom:18px}
.e3p2-hero-text h1{font-size:62px;font-weight:700;line-height:1.42;color:#1F4085}
.e3p2-hero-text p{font-size:25px;font-weight:600;color:#343637;margin-top:14px}
.e3p2-btn{width:222px;height:64px;background:#019F50;color:#fff;font-size:25px;font-weight:600;
  border-radius:8px;display:inline-flex;align-items:center;justify-content:center;margin-top:28px;
  transition:background .2s,transform .2s}
.e3p2-btn:hover{background:#018A45;transform:translateY(-2px)}
.e3p2-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.e3p2-card{background:#FEFEFE;border:1px solid #ECF0F2;border-radius:17px;height:157px;
  display:flex;align-items:center;justify-content:center;gap:18px;
  box-shadow:0 10px 26px rgba(31,64,133,.08)}
.e3p2-icon{flex-shrink:0}
.e3p2-icon img{height:64px;width:auto}
.e3p2-icon.e3p2-tall img{height:76px}
.e3p2-txt{display:flex;flex-direction:column;align-items:flex-start;text-align:right}
.e3p2-num{font-size:48px;font-weight:700;color:#254180;line-height:1.05;direction:ltr}
.e3p2-label{font-size:24px;font-weight:600;color:#333;margin-top:4px}
@media (max-width:1240px){
  .e3p2-hero-text h1{font-size:48px}
}
@media (max-width:1024px){
  .e3p2-wrap{background:linear-gradient(rgba(244,250,251,.55), rgba(244,250,251,.32)),
    #EFF7F7 url('https://cdn.e3melbusiness.online/img-upload/hero_mobile2.jpg') center top no-repeat;background-size:cover,cover;min-height:0;padding-bottom:40px}
  .e3p2-container-hero{padding:0 18px}
  .e3p2-hero{min-height:0;padding-bottom:46px}
  .e3p2-hero-text h1{text-shadow:0 0 14px rgba(255,255,255,.85)}
  .e3p2-hero-text{padding-top:70px}
  .e3p2-hero-text h1{font-size:40px}
  .e3p2-stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .e3p2-hero-text h1{font-size:30px}
  .e3p2-hero-text p{font-size:18px}
  .e3p2-badge{font-size:15px;padding:5px 16px;margin-bottom:12px}
  .e3p2-btn{width:190px;height:56px;font-size:20px}
  .e3p2-stats{gap:12px}
  .e3p2-card{height:120px;gap:10px}
  .e3p2-icon img{height:46px}
  .e3p2-icon.e3p2-tall img{height:54px}
  .e3p2-num{font-size:30px}
  .e3p2-label{font-size:16px}
}

/* ===== panel-3-specialties.html ===== */
.e3p3{font-family:'Cairo',Tahoma,sans-serif;direction:rtl;background:#fff;margin:0}
.e3p3 *{margin:0;padding:0;box-sizing:border-box}
.e3p3 img{display:block;max-width:100%}
.e3p3-wrap{margin:0 auto;overflow-x:clip;min-height:540px;
  background:
    radial-gradient(620px 300px at 200px 70px, rgba(152,198,214,.85), rgba(152,198,214,0) 70%),
    radial-gradient(480px 380px at -60px 40px, rgba(159,193,221,.9), rgba(159,193,221,0) 70%),
    radial-gradient(900px 420px at 80px 160px, rgba(199,226,237,.55), rgba(199,226,237,0) 72%),
    #fff}
.e3p3-container{max-width:1240px;margin:0 auto;padding:0 18px;display:flex;gap:49px;align-items:flex-start}
.e3p3-testimonial{width:361px;flex-shrink:0;margin-top:65px;background:#fff;border:1px solid #F0F1F1;
  border-radius:16px;padding:9px 9px 18px;
  box-shadow:0 10px 28px rgba(31,64,133,.07);text-align:center}
.e3p3-slider{position:relative;overflow:hidden}
.e3p3-slide{opacity:0;transform:translateX(46px);transition:opacity .55s ease,transform .55s ease;
  position:absolute;inset:0;pointer-events:none;visibility:hidden}
.e3p3-slide.e3p3-on{opacity:1;transform:translateX(0);position:relative;pointer-events:auto;visibility:visible}
.e3p3-slide.e3p3-off{opacity:0;transform:translateX(-46px)}
.e3p3-rev .e3p3-slide{transform:translateX(-46px)}
.e3p3-rev .e3p3-slide.e3p3-on{transform:translateX(0)}
.e3p3-rev .e3p3-slide.e3p3-off{transform:translateX(46px)}
.e3p3-photo{width:100%;height:190px;object-fit:cover;border-radius:10px}
.e3p3-stars{display:flex;justify-content:center;gap:3px;margin-top:14px}
.e3p3-stars svg{width:24px;height:24px;fill:#F8AB20}
.e3p3-quote{font-size:18px;font-weight:500;color:#535353;line-height:1.55;width:308px;margin:8px auto 0}
.e3p3-name{font-size:19px;font-weight:800;color:#24417F;margin-top:10px}
.e3p3-role{font-size:15px;font-weight:600;color:#8A93A6;margin-top:0}
.e3p3-dots{display:flex;justify-content:center;gap:8px;margin-top:14px}
.e3p3-dot{width:9px;height:9px;border-radius:50%;background:#D4DCEA;border:0;cursor:pointer;
  padding:0;transition:background .3s,width .3s}
.e3p3-dot.e3p3-dot-on{background:#019F50;width:24px;border-radius:6px}
.e3p3-grid{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:91px}
.e3p3-card{background:#FEFEFE;border:1px solid #F0F1F1;border-radius:16px;min-height:204px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:20px 8px 16px;text-align:center;box-shadow:0 8px 20px rgba(31,64,133,.05);
  transition:transform .2s,box-shadow .2s}
.e3p3-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(31,64,133,.12)}
.e3p3-card img{height:63px;width:auto}
.e3p3-card h3{font-size:25px;font-weight:600;color:#333;line-height:1.25;margin-top:11px}
.e3p3-num{font-size:26px;font-weight:700;color:#26A05C;margin-top:4px}
@media (max-width:1240px){
  .e3p3-container{gap:28px}
  .e3p3-card h3{font-size:20px}
}
@media (max-width:1024px){
  .e3p3-wrap{background:#fff;min-height:0;padding-bottom:40px}
  .e3p3-container{flex-direction:column-reverse;align-items:center}
  .e3p3-testimonial{margin-top:30px;width:100%;max-width:560px}
  .e3p3-photo{height:230px}
  .e3p3-quote{width:auto;padding:0 18px;font-size:19px}
  .e3p3-grid{width:100%;margin-top:50px}
}
@media (max-width:768px){
  .e3p3-grid{grid-template-columns:repeat(2,1fr);gap:14px}
}
@media (max-width:600px){
  .e3p3-card{min-height:172px;padding:14px 6px 12px}
  .e3p3-card img{height:50px}
  .e3p3-card h3{font-size:17px}
  .e3p3-num{font-size:20px}
  .e3p3-testimonial{max-width:none;padding:10px 10px 18px}
  .e3p3-photo{height:200px}
  .e3p3-quote{font-size:18px;padding:0 8px}
  .e3p3-name{font-size:18px}
}

/* ===== panel-4-offer.html ===== */
.e3p4{font-family:'Cairo',Tahoma,sans-serif;direction:rtl;background:#fff;margin:0}
.e3p4 *{margin:0;padding:0;box-sizing:border-box}
.e3p4 img{display:block;max-width:100%}
.e3p4-wrap{max-width:1440px;margin:0 auto;overflow-x:clip;padding:38px 0 30px}
.e3p4-container{max-width:1240px;margin:0 auto;padding:0 18px;
  display:flex;justify-content:space-between;align-items:flex-start;gap:40px}
.e3p4-right{flex-shrink:0;width:394px}
.e3p4-title{font-size:40px;font-weight:700;color:#2F4C82;line-height:1.3;text-align:right}
.e3p4-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:13px}
.e3p4-card{background:#FEFEFE;border:1px solid #EFF0EF;border-radius:17px;height:129px;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  padding-top:20px;text-align:center;box-shadow:0 8px 20px rgba(31,64,133,.05);
  transition:transform .2s,box-shadow .2s}
.e3p4-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(31,64,133,.12)}
.e3p4-card img{height:48px;width:auto}
.e3p4-card h3{font-size:24px;font-weight:600;color:#303030;margin-top:9px}
.e3p4-photo{width:596px;border-radius:16px}
@media (max-width:1240px){
  .e3p4-photo{width:50%}
  .e3p4-title{font-size:32px}
}
@media (max-width:1024px){
  .e3p4-container{flex-direction:column;align-items:center}
  .e3p4-right{width:100%;max-width:420px}
  .e3p4-title{text-align:center}
  .e3p4-photo{width:100%;max-width:596px}
}
@media (max-width:600px){
  .e3p4-title{font-size:26px}
  .e3p4-card{height:115px;padding-top:16px}
  .e3p4-card img{height:40px}
  .e3p4-card h3{font-size:18px}
}

/* ===== panel-5-pricing.html ===== */
.e3p5{font-family:'Cairo',Tahoma,sans-serif;direction:rtl;background:#F1F6FC;margin:0}
.e3p5 *{margin:0;padding:0;box-sizing:border-box}
.e3p5 a{text-decoration:none}
.e3p5-wrap{max-width:1440px;margin:0 auto;overflow-x:clip;padding:31px 0 64px}
.e3p5-title{font-size:37px;font-weight:700;color:#2F4C82;text-align:center}
.e3p5-plans{display:flex;justify-content:center;align-items:flex-end;gap:17px;margin-top:46px;padding:0 18px}
.e3p5-plan{background:#FEFEFE;border:1px solid #E5EAF3;border-radius:21px;width:386px;
  padding:19px 24px 25px;text-align:center;box-shadow:0 8px 24px rgba(31,64,133,.06)}
.e3p5-plan h3{font-size:38px;font-weight:700;color:#2B4580;line-height:1.4}
.e3p5-price{font-size:30px;font-weight:600;color:#2C2C2C;margin-top:6px;display:flex;align-items:center;justify-content:center;gap:7px}
.e3p5-sar{height:25px;width:auto;fill:#2C2C2C}
.e3p5-note{font-size:24px;font-weight:600;color:#3AA06C;margin-top:10px}
.e3p5-note-muted{color:#6D6D6E;font-weight:500}
.e3p5-btn{width:100%;max-width:330px;height:58px;background:#019F50;color:#fff;font-size:24px;
  font-weight:600;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  margin-top:18px;transition:background .2s,transform .2s}
.e3p5-btn:hover{background:#018A45;transform:translateY(-2px)}
.e3p5-best{border:2px solid #019F50;width:390px;padding:0 24px 21px;overflow:hidden}
.e3p5-badge{background:#019F50;color:#fff;font-size:25px;font-weight:600;height:44px;
  display:flex;align-items:center;justify-content:center;margin:0 -26px 14px;border-radius:18px 18px 0 0}
@media (max-width:1240px){
  .e3p5-plans{flex-wrap:wrap;align-items:center}
  .e3p5-plan{width:100%;max-width:390px}
}
@media (max-width:600px){
  .e3p5-title{font-size:28px}
  .e3p5-plan h3{font-size:30px}
  .e3p5-price{font-size:26px}
  .e3p5-note{font-size:20px}
}

/* ===== panel-6-footer.html ===== */
.e3p6{font-family:'Cairo',Tahoma,sans-serif;direction:rtl;background:#1D3E85;margin:0}
.e3p6 *{margin:0;padding:0;box-sizing:border-box}
.e3p6 img{display:block;max-width:100%}
.e3p6 a{text-decoration:none;color:inherit}
.e3p6-wrap{max-width:1440px;margin:0 auto;overflow-x:clip;min-height:264px;padding:45px 0 40px}
.e3p6-container{max-width:1240px;margin:0 auto;padding:0 18px;
  display:flex;justify-content:space-between;align-items:flex-start;gap:30px}
.e3p6-brand{display:flex;flex-direction:column;align-items:flex-start}
.e3p6-brand img{width:109px;height:auto}
.e3p6-brand p{font-size:24px;font-weight:500;color:#C9D2E5;margin-top:8px;white-space:nowrap}
.e3p6-info{text-align:left;direction:rtl}
.e3p6-info p{font-size:24px;font-weight:500;color:#C5CDDD;line-height:1.48}
.e3p6-info a:hover{text-decoration:underline}
.e3p6-socials{display:flex;justify-content:flex-start;gap:11px;margin-top:18px;direction:ltr}
.e3p6-socials a{width:38px;height:38px;background:#fff;border-radius:50%;display:inline-flex;
  align-items:center;justify-content:center;transition:transform .2s}
.e3p6-socials a:hover{transform:translateY(-3px)}
.e3p6-socials svg{width:20px;height:20px;fill:#1D3E85}
@media (max-width:1024px){
  .e3p6-container{flex-direction:column-reverse;align-items:center;text-align:center}
  .e3p6-brand{align-items:center}
  .e3p6-brand p{white-space:normal}
  .e3p6-info{text-align:center}
  .e3p6-socials{justify-content:center}
}


/* ============================================================
   E3MEL BUSINESS — إخفاء هيدر/فوتر ثيم سلة
   يُلصق في: التصميم > تخصيص > CSS مخصص
   ملاحظة: مفعّل فقط في الصفحات اللي فيها اللاندينج بيدج
   (عن طريق :has على كلاس .e3p2) — باقي صفحات المتجر طبيعية
   ============================================================ */

/* الهيدر */
body:has(.e3p2) header.store-header,
body:has(.e3p2) .store-header,
body:has(.e3p2) salla-header,
body:has(.e3p2) #mainnav,
body:has(.e3p2) .main-nav-container,
body:has(.e3p2) .top-navbar,
/* الفوتر */
body:has(.e3p2) footer.store-footer,
body:has(.e3p2) .store-footer,
body:has(.e3p2) .main-footer,
body:has(.e3p2) salla-footer,
/* عنوان الصفحة + البريدكرمب داخل صفحات سلة التعريفية */
body:has(.e3p2) .breadcrumbs,
body:has(.e3p2) salla-breadcrumb,
body:has(.e3p2) .page-title,
body:has(.e3p2) .page-header {
  display: none !important;
}

/* إزالة الهوامش/الحاويات الضيقة حول محتوى الصفحة */
body:has(.e3p2) main,
body:has(.e3p2) .main-content {
  padding: 0 !important;
  margin: 0 !important;
}
body:has(.e3p2) main .container,
body:has(.e3p2) .main-content .container {
  max-width: 100% !important;
  padding: 0 !important;
}

/* ============================================================
   لو ثيمك يستخدم أسماء كلاسات مختلفة: افتح المتجر، كليك يمين
   على الهيدر > Inspect، خذ اسم الكلاس وأضفه فوق بنفس النمط.
   ============================================================ */

/* ============================================================
   إزالة المسافات الفارغة بين بلوكات سلة (الهامش الافتراضي 64px)
   حتى تلتصق الأقسام ببعضها بدون فراغات أعلى الهيدر أو بينها
   ============================================================ */
body:has(.e3p2) .s-block,
body:has(.e3p2) [class*="s-block-html-content"],
body:has(.e3p2) [class*="s-block--bundle-html-content"] {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ============================================================
   إخفاء فوتر/هيدر الثيم (طبقة احتياطية بالـ CSS — مثل هيلثي كولا)
   ملاحظة: على هذا الثيم الفوتر يضع display:flex !important inline
   لذلك الـ CSS وحده لا يكفي، والجافاسكريبت في script.js هو الحاسم
   ============================================================ */
body:has(.e3p2) .store-footer,
body:has(.e3p2) footer.store-footer,
body:has(.e3p2) .main-footer,
body:has(.e3p2) .site-footer,
body:has(.e3p2) .s-footer,
body:has(.e3p2) .s-block--footer,
body:has(.e3p2) .store-header,
body:has(.e3p2) header.store-header,
body:has(.e3p2) .main-header,
body:has(.e3p2) .site-header,
body:has(.e3p2) .s-block--header {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}