﻿/* ╔══════════════════════════════════════════════════════════════╗
   ║  صفحة المتجر العامة — تصميم بروفيل (على طراز فيسبوك)            ║
   ║  زكليك · Zklik Marketplace                                     ║
   ║                                                                ║
   ║  ملاحظة: المتغيّرات --p (اللون الأساسي) و --s (الثانوي)         ║
   ║  تُحقَن داخل القالب من إعدادات المتجر:                          ║
   ║      :root{ --p:{{ pc }}; --s:{{ sc }}; }                       ║
   ╚══════════════════════════════════════════════════════════════╝ */

/* ═══════════════ المتغيّرات ═══════════════ */
:root{
  --nav-h:60px;          /* ارتفاع النافبار — لتفادي اختفاء المحتوى تحته */
  --maxw:760px;          /* عرض عمود البروفيل */
  --bodypad:22px;        /* الحشوة الأفقية لجسم البطاقة (تُستعمل أيضاً في حساب الهوامش السالبة) */

  --bg:#f0f2f5;
  --card:#ffffff;
  --soft:#f7f8fa;
  --border:#e3e6ea;
  --line:#eef0f3;

  --ink:#0f172a;
  --ink2:#334155;
  --muted:#65676b;

  --green:#10b981;
  --green-d:#047857;
  --amber:#f59e0b;
  --red:#ef4444;

  /* ألوان ثابتة للعناصر الصغيرة (شارات، أيقونات، أزرار) — لا تتأثر باللون المخصص */
  --pl:#fdf1e3;
  --pl-2:#e7ecff;
  --pb:#f0cf94;

  --r:16px;
  --r-md:14px;
  --r-sm:11px;

  --shadow:0 1px 2px rgba(15,23,42,.05), 0 6px 22px rgba(15,23,42,.06);
  --shadow-lg:0 14px 44px rgba(15,23,42,.16);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}

/* الحاوية الكبرى — تتمركز في الوسط وتعالج هامش النافبار السفلي على الجوال */
.zk{
  direction:rtl;
  background:#fff;
  min-height:100vh;
  padding-bottom:48px;
}
/* سطح المكتب: يُلغي التكرار بين body-padding + navbar-spacer */
@media(min-width:769px){
  .zk{ margin-top:calc(-1 * var(--nav-h)); }
}
.zk a{text-decoration:none;color:inherit;}
.zk img{display:block;}
.zk-wrap{
  max-width:var(--maxw);
  margin:0 auto;
  padding:16px 16px 0;
}

/* ═══════════════ شريط الحالة ═══════════════ */
.zk-status{
  margin-bottom:14px;
  padding:11px 18px;
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:.85rem;font-weight:700;
}
.zk-status svg{width:17px;height:17px;flex-shrink:0;}
.zk-status.pending  {background:#fef3c7;color:#92400e;border:1px solid #fde68a;}
.zk-status.suspended{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5;}

/* ═══════════════ البطاقة الموحّدة (الغلاف + البروفيل) ═══════════════ */
.zk-card{
  background:var(--card);
  border-radius:var(--r);
  box-shadow:var(--shadow);
  overflow:hidden;
  margin-bottom:16px;
}

/* ── الغلاف ── */
.zk-cover{
  position:relative;
  height:300px;
  background:linear-gradient(135deg, var(--p) 0%, var(--s) 100%);
}
.zk-cover-img{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;
}
.zk-cover-grad{
  position:absolute;inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.34) 0%, rgba(0,0,0,.05) 42%, transparent 70%);
}
.zk-cover-deco{
  position:absolute;inset:0;
  background-image:
    radial-gradient(circle at 18% 84%, rgba(255,255,255,.10) 0%, transparent 46%),
    radial-gradient(circle at 82% 16%, rgba(255,255,255,.10) 0%, transparent 46%);
}

/* ── جسم البروفيل ── */
.zk-body{
  position:relative;           /* حاوية لطبقة overlay صورة الخلفية المخصصة أدناه */
  padding:0 var(--bodypad) 20px;
  text-align:right;
  background:#f3edf7;         /* احتياطي */
  background:color-mix(in srgb, var(--p) 18%, #fff);
}
/* [تعديل بطلب المستخدم] عند وجود صورة خلفية مخصّصة للمتجر، تحلّ صورته
   محل تلوين اللون الأساسي أعلاه — كانت الصورة شبه مخفية تماماً بسبب هذه
   الخلفية المعتمة، رغم أن صفحة القالب بأكملها (.zk) كانت تعرضها أصلاً
   خلف كل شيء؛ لم تكن تظهر عملياً إلا في هامش صغير جداً أسفل البطاقة. */
.zk-body--custom-bg{
  background-color:transparent;
  background-size:cover;
  background-position:center;
}
.zk-body-bg-overlay{
  position:absolute;inset:0;
  background:rgba(255,255,255,.82);   /* لضمان بقاء النص والشارات مقروءة فوق أي صورة */
  pointer-events:none;
  z-index:0;
}
.zk-body-inner{
  position:relative;z-index:1;
  display:flow-root;   /* يمنع انهيار الهامش → يتراكب الشعار وحده فقط (نفس دور flow-root المنقول من .zk-body) */
}

/* الشعار — يُسحب للأعلى ليتراكب مع الغلاف، على الجهة اليمنى (بداية RTL) */
.zk-logo{
  width:118px;height:118px;
  margin-top:-62px;margin-bottom:14px;
  border-radius:24px;
  border:4px solid var(--card);
  background:var(--card);
  overflow:hidden;position:relative;z-index:2;
  box-shadow:0 10px 28px rgba(15,23,42,.22);
  display:flex;align-items:center;justify-content:center;
}
.zk-logo img{width:100%;height:100%;object-fit:cover;}
.zk-logo svg{width:50px;height:50px;color:#e69233;}

/* اسم المتجر */
.zk-name{
  font-size:1.75rem;font-weight:900;color:var(--ink);
  line-height:1.2;letter-spacing:-.5px;
  word-break:break-word;margin-bottom:9px;
}

/* الشارات */
.zk-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;}
.zk-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 12px;border-radius:99px;
  font-size:.74rem;font-weight:800;line-height:1;white-space:nowrap;
}
.zk-badge svg{width:12px;height:12px;}
.bg-verified{background:#d1fae5;color:#065f46;}
.bg-featured{background:#fef3c7;color:#92400e;}
.bg-type    {background:#fdf1e3;color:#e69233;border:1px solid #f0cf94;}
.bg-sector  {background:#f0fdf4;color:#15803d;border:1px solid #bbf7d0;}
.bg-loc     {background:#fdf1e3;color:#e69233;border:1px solid #f0cf94;}

/* صف الإحصائيات */
.zk-stats{
  display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;
  margin-bottom:16px;
}
.zk-stat{font-size:.9rem;color:var(--muted);display:inline-flex;align-items:center;gap:5px;}
.zk-stat b{color:var(--ink);font-weight:800;font-size:1rem;}
.zk-dot{width:4px;height:4px;border-radius:50%;background:#cbd2da;flex-shrink:0;}
.zk-rate-stars{display:inline-flex;align-items:center;gap:1px;}
.zk-rate-stars span{font-size:1rem;line-height:1;}
.star-on {color:var(--amber);}
.star-off{color:#d6dbe2;}

/* صف أزرار المتابعة + الرسالة + الإبلاغ — تبقى دائماً في سطر واحد */
.zk-actions{display:flex;gap:10px;align-items:stretch;flex-wrap:nowrap;}
.zk-actions .zk-report-btn{flex-shrink:0;white-space:nowrap;}

/* زر المتابعة */
.zk-follow{
  flex:1;padding:12px;border:none;cursor:pointer;
  border-radius:12px;
  background:linear-gradient(135deg, var(--p), var(--s));
  color:#fff;font-size:.95rem;font-weight:800;font-family:inherit;
  display:flex;align-items:center;justify-content:center;gap:8px;
  box-shadow:0 6px 18px rgba(230,146,51,.32);
  box-shadow:0 6px 18px color-mix(in srgb, var(--p) 34%, transparent);
  transition:transform .15s, opacity .2s, box-shadow .2s;
}
.zk-follow svg{width:17px;height:17px;}
.zk-follow:hover{transform:translateY(-1px);opacity:.96;}
.zk-follow:active{transform:translateY(0);}
.zk-follow:disabled{opacity:.6;cursor:default;}
.zk-follow.following{
  background:var(--card);color:var(--muted);
  border:1.5px solid var(--border);box-shadow:none;
}
.zk-follow.following:hover{border-color:var(--red);color:var(--red);}

/* زر الرسالة */
.zk-msg-btn{
  flex-shrink:0;padding:12px 16px;border-radius:12px;cursor:pointer;
  background:var(--card);border:1.5px solid var(--border);
  color:var(--ink);font-size:.9rem;font-weight:700;font-family:inherit;
  display:flex;align-items:center;justify-content:center;gap:7px;
  transition:background .15s, border-color .15s, transform .12s;
  text-decoration:none;
}
.zk-msg-btn svg{width:16px;height:16px;color:#e69233;}
.zk-msg-btn:hover{background:#fdf1e3;border-color:#e69233;transform:translateY(-1px);}
.zk-msg-btn:active{transform:translateY(0);}

/* ════ Overlay نافذة الرسالة ════ */
.zk-msg-overlay{
  display:none;position:fixed;inset:0;z-index:1200;
  background:rgba(0,0,0,.45);
  align-items:center;justify-content:center;padding:16px;
}
.zk-msg-overlay.open{display:flex;}
.zk-msg-modal{
  background:var(--card,#fff);border-radius:18px;
  width:100%;max-width:480px;
  box-shadow:0 20px 60px rgba(0,0,0,.18);
  overflow:hidden;animation:zkMsgIn .2s ease;
}
@keyframes zkMsgIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}
.zk-msg-hd{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 20px 12px;border-bottom:1px solid var(--border);
}
.zk-msg-hd-title{
  display:flex;align-items:center;gap:8px;
  font-size:.95rem;font-weight:800;color:var(--ink);
}
.zk-msg-hd-title svg{color:#e69233;}
.zk-msg-close{
  width:30px;height:30px;border-radius:8px;border:none;background:transparent;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:var(--muted);transition:background .13s;
}
.zk-msg-close:hover{background:var(--border);}
.zk-msg-body{padding:16px 20px;}
.zk-msg-ta{
  width:100%;box-sizing:border-box;
  padding:11px 14px;border-radius:10px;
  border:1.5px solid var(--border);background:var(--bg,#f8f9fa);
  font-family:inherit;font-size:.9rem;color:var(--ink);
  resize:vertical;min-height:110px;
  transition:border-color .15s;outline:none;
}
.zk-msg-ta:focus{border-color:#e69233;}
.zk-msg-err{
  margin-top:8px;padding:9px 13px;border-radius:8px;
  background:#fff0f0;border:1px solid #fca5a5;color:#dc2626;
  font-size:.82rem;font-weight:600;
}
.zk-msg-ft{
  display:flex;justify-content:flex-end;gap:10px;
  padding:12px 20px 16px;border-top:1px solid var(--border);
}
.zk-msg-cancel{
  padding:9px 18px;border-radius:9px;border:1.5px solid var(--border);
  background:transparent;color:var(--muted);font-size:.88rem;font-weight:700;
  cursor:pointer;font-family:inherit;transition:background .13s;
}
.zk-msg-cancel:hover{background:var(--border);}
.zk-msg-send{
  padding:9px 22px;border-radius:9px;border:none;
  background:linear-gradient(135deg, var(--p), var(--s));
  color:#fff;font-size:.88rem;font-weight:800;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;gap:7px;
  transition:opacity .15s, transform .12s;
}
.zk-msg-send:hover{opacity:.9;transform:translateY(-1px);}
.zk-msg-send:active{transform:translateY(0);}
.zk-msg-send:disabled{opacity:.55;cursor:default;transform:none;}
.zk-msg-spin{
  display:inline-block;width:14px;height:14px;vertical-align:middle;
  border:2px solid rgba(255,255,255,.5);border-top-color:#fff;
  border-radius:50%;animation:zkSpin .65s linear infinite;
}
@keyframes zkSpin{to{transform:rotate(360deg);}}

/* [نُقلت] شارة الموقع كانت هنا سطراً قائماً بذاته (.zk-loc-chip) —
   انتقلت إلى صف .zk-badges أعلى البطاقة (تستعمل .zk-badge + .bg-loc
   مكان شارة نوع الباقة المحذوفة). */

/* بطاقة «نبذة عن المتجر» — تستعمل مكوّنات .sub/.sub-head/.sub-body
   نفسها المُعرَّفة أسفل لبطاقات قسم «تفاصيل أكثر»، حفاظاً على هوية
   موحّدة لأي معلومة معنونة في الصفحة بدل اختراع نمط جديد */
.zk-about-card{margin-top:14px;}

/* الوصف */
.zk-desc{
  color:var(--ink2);font-size:.94rem;line-height:1.85;
  white-space:pre-wrap;word-break:break-word;
}
.sub-body .zk-desc{margin-top:0;}

/* ═══════════════ شريط أيقونات التواصل (سلايدر قابل للسحب) ═══════════════ */
.zk-slider-wrap{position:relative;margin-top:18px;}

.zk-slider{
  display:flex;gap:14px;
  overflow-x:auto;
  padding:4px 2px 8px;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  cursor:grab;
}
.zk-slider::-webkit-scrollbar{display:none;}
.zk-slider.dragging{cursor:grabbing;scroll-behavior:auto;}
.zk-slider.dragging *{pointer-events:none;}

/* تلاشي الأطراف — يظهر فقط حين يكون الشريط قابلاً للتمرير */
.zk-slider-wrap::before,
.zk-slider-wrap::after{
  content:'';position:absolute;top:0;bottom:8px;width:30px;
  pointer-events:none;z-index:2;opacity:0;transition:opacity .25s;
}
.zk-slider-wrap.scrollable::before,
.zk-slider-wrap.scrollable::after{opacity:1;}
.zk-slider-wrap::before{right:0;background:linear-gradient(to left, var(--card), transparent);}
.zk-slider-wrap::after {left:0; background:linear-gradient(to right, var(--card), transparent);}

/* عنصر السلايدر: أيقونة دائرية + تسمية صغيرة */
.zk-ci{
  flex:0 0 auto;width:66px;
  display:flex;flex-direction:column;align-items:center;gap:7px;
  -webkit-user-drag:none;user-select:none;
}
.zk-ci-icon{
  width:54px;height:54px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 4px 12px rgba(15,23,42,.12);
  transition:transform .18s, box-shadow .18s, filter .18s;
}
.zk-ci-icon svg{width:24px;height:24px;}
.zk-ci:hover .zk-ci-icon{transform:translateY(-3px);box-shadow:0 9px 22px rgba(15,23,42,.2);filter:brightness(1.06);}
.zk-ci-cap{font-size:.71rem;font-weight:700;color:var(--muted);white-space:nowrap;}

.ic-phone{background:#2563eb;}
.ic-wa   {background:#25d366;}
.ic-mail {background:#f59e0b;}
.ic-web  {background:linear-gradient(135deg, var(--p), var(--s));}
.ic-fb   {background:#1877f2;}
.ic-ig   {background:linear-gradient(45deg,#f09433,#dc2743,#bc1888);}
.ic-tw   {background:#000;}
.ic-yt   {background:#ff0000;}
.ic-li   {background:#0a66c2;}
.ic-tt   {background:#010101;}

/* ═══════════════ زر «تفاصيل أكثر» ═══════════════ */
.zk-toggle{
  width:100%;margin-top:14px;padding:12px;cursor:pointer;
  border-radius:12px;font-family:inherit;
  background:#fdf1e3;color:#e69233;
  border:1.5px solid #f0cf94;
  font-size:.9rem;font-weight:800;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:background .2s;
}
.zk-toggle:hover{background:#e7ecff;}
.zk-toggle .chev{width:16px;height:16px;transition:transform .35s;}
.zk-toggle.open .chev{transform:rotate(180deg);}

/* ═══════════════ المنطقة القابلة للطي ═══════════════ */
.zk-details{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .4s ease;
}
.zk-details.open{grid-template-rows:1fr;}
.zk-details-inner{overflow:hidden;min-height:0;}
.zk-details-content{
  margin:14px calc(-1 * var(--bodypad)) 0;
  padding:18px var(--bodypad) 6px;
  background:var(--soft);
  border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:14px;
}

/* ── بطاقة فرعية داخل التفاصيل ── */
.sub{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
}
.sub-head{
  display:flex;align-items:center;gap:9px;
  padding:12px 15px;
  border-bottom:1px solid var(--line);
  background:#fafbfc;
}
.sub-head .ic{
  width:30px;height:30px;border-radius:8px;background:#fdf1e3;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.sub-head .ic svg{width:15px;height:15px;color:#e69233;}
.sub-head h4{font-size:.88rem;font-weight:800;color:var(--ink);}
.sub-body{padding:14px 15px;}

/* العنوان */
.addr-row{display:flex;align-items:flex-start;gap:10px;}
.addr-text{flex:1;min-width:0;font-size:.87rem;font-weight:600;color:var(--ink);line-height:1.6;}
.addr-icon{width:32px;height:32px;border-radius:8px;background:#fdf4ff;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.addr-icon svg{width:16px;height:16px;color:#9333ea;}

/* سرعة الاستجابة */
.resp-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.resp-box{border-radius:12px;padding:15px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.rb-speed{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border:1px solid #a7f3d0;}
.rb-rate {background:linear-gradient(135deg,#eff6ff,#dbeafe);border:1px solid #bfdbfe;}
.resp-ic{width:38px;height:38px;border-radius:10px;margin-bottom:8px;display:flex;align-items:center;justify-content:center;}
.resp-ic svg{width:19px;height:19px;}
.resp-val{font-size:1rem;font-weight:800;color:var(--ink);margin-bottom:2px;}
.resp-lbl{font-size:.72rem;color:var(--muted);}
.rate-bar-wrap{width:100%;margin-top:8px;}
.rate-bar-bg{height:6px;background:#cfe0fb;border-radius:99px;overflow:hidden;}
.rate-bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--p),var(--s));width:0;transition:width 1s ease;}

/* أيام الدوام */
.days-grid{display:flex;flex-wrap:wrap;gap:7px;}
.day-pill{padding:7px 14px;border-radius:99px;font-size:.8rem;font-weight:700;background:#fdf1e3;color:#e69233;border:1.5px solid #f0cf94;}

/* معلومات المؤسسة */
.biz-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.biz-cell{text-align:center;padding:14px 6px;background:var(--soft);border:1px solid var(--border);border-radius:12px;transition:border-color .2s, transform .2s;}
.biz-cell:hover{border-color:#e69233;transform:translateY(-2px);}
.biz-ic{width:30px;height:30px;border-radius:8px;background:#fdf1e3;margin:0 auto 7px;display:flex;align-items:center;justify-content:center;}
.biz-ic svg{width:15px;height:15px;color:#e69233;}
.biz-val{font-size:1.2rem;font-weight:900;color:#e69233;display:block;margin-bottom:2px;}
.biz-lbl{font-size:.7rem;color:var(--muted);}

/* الشهادات */
.cert-list{display:flex;flex-direction:column;gap:8px;}
.cert-item{display:flex;align-items:center;gap:11px;padding:10px 14px;background:linear-gradient(90deg,#ecfdf5,#f0fdf4);border:1px solid #a7f3d0;border-right:4px solid var(--green);border-radius:10px;}
.cert-ic{width:30px;height:30px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cert-ic svg{width:15px;height:15px;color:var(--green-d);}
.cert-tx{font-size:.85rem;font-weight:600;color:var(--green-d);}

/* الشركاء */
.partner-card{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1.5px solid var(--border);border-radius:12px;background:var(--soft);margin-bottom:9px;transition:border-color .2s, box-shadow .2s;}
.partner-card:last-child{margin-bottom:0;}
.partner-card:hover{border-color:#e69233;box-shadow:0 4px 14px rgba(230,146,51,.1);}
.partner-logo{width:42px;height:42px;border-radius:10px;background:var(--border);overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.partner-logo img{width:100%;height:100%;object-fit:cover;}
.partner-logo svg{width:19px;height:19px;color:var(--muted);}
.partner-info{flex:1;min-width:0;}
.partner-name{font-weight:700;font-size:.89rem;color:var(--ink);margin-bottom:2px;}
.partner-name:hover{color:#e69233;}
.partner-type{font-size:.73rem;color:var(--muted);}
.partner-arrow{width:18px;height:18px;color:var(--muted);flex-shrink:0;}

/* معرض الصور */
.gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.gal-item{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;cursor:pointer;background:#eef0f3;}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .35s;}
.gal-item:hover img{transform:scale(1.06);}
.gal-ov{position:absolute;inset:0;background:rgba(0,0,0,.36);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .25s;}
.gal-item:hover .gal-ov{opacity:1;}
.gal-ov svg{width:26px;height:26px;color:#fff;}

/* QR + رابط المتجر */
.qr-block{text-align:center;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border);}
.qr-img{width:130px;margin:0 auto 8px;border-radius:10px;border:2px solid var(--border);padding:6px;background:#fff;transition:transform .2s;}
.qr-img:hover{transform:scale(1.04);}
.qr-hint{font-size:.73rem;color:var(--muted);}

.link-label{font-size:.73rem;color:var(--muted);margin-bottom:6px;}
.copy-row{display:flex;align-items:center;gap:8px;}
.link-value{flex:1;font-size:.82rem;font-weight:700;color:var(--ink);word-break:break-all;direction:ltr;text-align:left;padding:9px 11px;background:var(--soft);border-radius:8px;border:1px solid var(--border);}
.copy-btn{flex-shrink:0;padding:8px 11px;border-radius:8px;background:#fdf1e3;color:#e69233;border:1.5px solid #f0cf94;font-size:.73rem;font-weight:700;font-family:inherit;cursor:pointer;transition:all .2s;white-space:nowrap;line-height:1;display:inline-flex;align-items:center;gap:5px;}
.copy-btn:hover{background:#e69233;color:#fff;border-color:#e69233;}
.copy-btn.copied{background:#d1fae5;color:#065f46;border-color:#6ee7b7;}
.copy-btn svg{width:13px;height:13px;}

/* PDF */
.pdf-btn{display:inline-flex;align-items:center;gap:9px;padding:11px 20px;background:linear-gradient(135deg,var(--p),var(--s));color:#fff;border-radius:11px;font-weight:800;font-size:.88rem;}
.pdf-btn svg{width:17px;height:17px;}

/* بطاقة التوثيق */
.verified-card{text-align:center;padding:18px;background:linear-gradient(135deg,#ecfdf5,#d1fae5);border:1.5px solid #6ee7b7;border-radius:var(--r-md);}
.verified-ic{width:48px;height:48px;border-radius:13px;background:#fff;margin:0 auto 9px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(16,185,129,.2);}
.verified-ic svg{width:25px;height:25px;color:var(--green);}
.verified-title{font-weight:800;color:var(--green-d);font-size:.93rem;margin-bottom:3px;}
.verified-sub{font-size:.76rem;color:#047857;}

/* ═══════════════ قسم عام (الإعلانات) ═══════════════ */
.zk-section{
  background:var(--card);border-radius:var(--r);
  box-shadow:var(--shadow);overflow:hidden;margin-bottom:16px;
}
.zk-section-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);}
.zk-section-head .ic{width:34px;height:34px;border-radius:9px;background:#fdf1e3;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.zk-section-head .ic svg{width:17px;height:17px;color:#e69233;}
.zk-section-head h3{font-size:.95rem;font-weight:800;color:var(--ink);}
.zk-section-head .zk-section-count{margin-right:auto;background:#fdf1e3;color:#e69233;
  font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:999px;}
.zk-section-body{padding:16px 18px;}

/* ═══════════════ شريط تصفية المنتجات/الخدمات ═══════════════
   سطر واحد دائماً، حتى على أضيق الشاشات: overflow-x + تمرير أفقي بدل
   الالتفاف لسطر ثانٍ. [FIX-2] أول نسخة كانت تُخفي زر "الأقدم" خارج
   الشاشة بلا أي مؤشر (يبدو معطوباً) — الحل الاحترافي هنا مزدوج:
   (أ) تقليص الأحجام على الجوال (breakpoint أدناه) حتى يقترب المحتوى
       من الاحتواء الكامل بلا أي تمرير في أغلب الهواتف الحديثة،
   (ب) تلاشي (fade) بصري واضح عند حافة الشريط يُشعر المستخدم فوراً
       أن هناك محتوى إضافياً قابلاً للتمرير — نفس أسلوب تبويبات
       تويتر/إنستغرام تماماً، بدل قصّ مفاجئ بلا تفسير. */
.zk-filter-bar{
  display:flex;align-items:center;gap:12px;flex-wrap:nowrap;
  padding:12px 18px;border-bottom:1px solid var(--line);background:var(--soft);
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
  mask-image:linear-gradient(to left, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
  -webkit-mask-image:linear-gradient(to left, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
}
.zk-filter-bar::-webkit-scrollbar{display:none;}

.zk-filter-group{display:flex;gap:6px;flex-shrink:0;scroll-snap-align:start;}
.zk-filter-btn{
  display:inline-flex;align-items:center;gap:5px;
  padding:7px 15px;border-radius:999px;border:1.5px solid var(--border);
  background:var(--card);color:var(--muted);font-size:.79rem;font-weight:700;
  cursor:pointer;transition:all .15s;font-family:inherit;white-space:nowrap;
}
.zk-filter-btn svg{width:13px;height:13px;flex-shrink:0;}
.zk-filter-btn:hover{border-color:var(--p);color:var(--p);}
.zk-filter-btn.active{
  background:linear-gradient(135deg,var(--p),var(--s));
  color:#fff;border-color:transparent;
  /* لون الظل يتبع لون المتجر الفعلي (--p) لا لوناً ثابتاً — rgba احتياطية
     للمتصفحات القديمة بلا دعم color-mix()، تُستبدَل بالسطر التالي حين يتوفر. */
  box-shadow:0 3px 10px rgba(230,146,51,.28);
  box-shadow:0 3px 10px color-mix(in srgb, var(--p) 30%, transparent);
}

/* فاصل رفيع بين مجموعة النوع ومجموعة الترتيب */
.zk-filter-divider{width:1.5px;height:22px;background:var(--border);flex-shrink:0;}

/* أزرار الترتيب (الأحدث/الأقدم) — تحكّم مقسّم (segmented control) بحبّة
   واحدة بدل بطاقتين منفصلتين، أوضح بصرياً كأنهما خياران متقابلان لنفس
   القرار (لا نوعان مختلفان كمجموعة الفلترة أعلاه). */
.zk-filter-sort{
  display:inline-flex;flex-shrink:0;gap:2px;scroll-snap-align:end;
  background:var(--card);border:1.5px solid var(--border);
  border-radius:999px;padding:3px;
}
.zk-sort-btn{
  display:inline-flex;align-items:center;gap:5px;
  padding:6px 14px;border-radius:999px;border:none;
  background:transparent;color:var(--muted);font-size:.79rem;font-weight:700;
  cursor:pointer;transition:all .18s;font-family:inherit;white-space:nowrap;
}
.zk-sort-btn svg{width:13px;height:13px;flex-shrink:0;}
.zk-sort-btn:not(.active):hover{color:var(--p);}
.zk-sort-btn.active{
  background:linear-gradient(135deg,var(--p),var(--s));
  color:#fff;
  box-shadow:0 3px 10px rgba(230,146,51,.28);
  box-shadow:0 3px 10px color-mix(in srgb, var(--p) 30%, transparent);
}

.zk-filter-empty{padding:34px 18px;text-align:center;color:var(--muted);font-size:.85rem;}

/* ═══════════════ شبكة منتجات وخدمات المتجر ═══════════════ */
.sp-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  padding:14px 16px;
}
.sp-item{min-width:0;}
@media(max-width:560px){
  .sp-grid{grid-template-columns:repeat(2,1fr);gap:8px;padding:10px 12px;}
  /* الشريط يبقى سطراً واحداً (overflow-x أعلاه) — هنا فقط نُصغّر الأحجام
     ونحذف أيقونات الترتيب الزخرفية (النص وحده كافٍ ومفهوم) حتى يقترب
     المحتوى من الاحتواء الكامل بلا أي تمرير على أغلب الهواتف. */
  .zk-filter-bar{gap:6px;padding:10px 12px;}
  .zk-filter-btn,.zk-sort-btn{padding:6px 11px;font-size:.72rem;gap:3px;}
  .zk-filter-sort{padding:2px;gap:1px;}
  .zk-sort-btn svg{display:none;}
}

.sp-card{
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
  border-radius:10px;overflow:hidden;background:var(--card);
  border:1.5px solid var(--line);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.sp-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.1);border-color:var(--p);}

.sp-img-wrap{position:relative;aspect-ratio:1/1;overflow:hidden;background:#f3f4f6;}
.sp-img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease;}
.sp-card:hover .sp-img{transform:scale(1.04);}
.sp-img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#d1d5db;}

.sp-badge{
  position:absolute;top:7px;right:7px;
  font-size:.62rem;font-weight:700;padding:2px 7px;border-radius:999px;
}
.sp-badge-new{background:#d1fae5;color:#065f46;}
.sp-badge-used{background:#fef3c7;color:#92400e;}
.sp-badge-rent{
  position:absolute;top:7px;left:7px;
  background:var(--p);color:#fff;
  font-size:.62rem;font-weight:700;padding:2px 7px;border-radius:999px;
}

.sp-info{padding:9px 10px 11px;}
.sp-name{font-size:.78rem;font-weight:600;color:var(--ink);line-height:1.4;margin-bottom:5px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.sp-price-row{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;}
.sp-price,.sp-price-new{font-size:.82rem;font-weight:800;color:var(--p);}
.sp-price-old{font-size:.7rem;color:#9ca3af;text-decoration:line-through;}

/* ── إعلانات المتجر المخصّصة — كاروسيل (نفس آلية apps.promotions/ads.js:
   سحب + تبديل تلقائي + نقاط + أسهم + شريط تقدّم) بدل التكديس الرأسي القديم
   (كل إعلان تحت الآخر بهامش 14px) الذي يتراكم بلا حدّ مع أكثر من إعلانين.
   إعلان واحد فقط → بطاقة ثابتة بلا أي عناصر تحكّم (تُبنى بنفس القالب،
   الجافاسكربت فقط لا يُفعِّل السحب/التبديل حين data-ca-count="1"). ── */
.zk-section-body--ads{padding:0;}

.ca-carousel{position:relative;}
.ca-viewport{
  overflow:hidden;touch-action:pan-y;cursor:grab;
  -webkit-user-select:none;user-select:none;
}
.ca-viewport:active{cursor:grabbing;}
.ca-track{display:flex;direction:ltr;will-change:transform;}
.ca-slide{flex:0 0 100%;min-width:0;}

/* كل الشرائح — أياً كان نوعها — بنفس النسبة (2:1) فلا يحدث أي "قفز" في
   الارتفاع بين إعلان صوري وإعلان نصي أثناء التنقّل بينهما. */
.ca-item{position:relative;width:100%;aspect-ratio:2/1;overflow:hidden;border-radius:var(--r-md);}

/* ── بانر/فيديو: الصورة تظهر كاملة (object-fit:contain) فوق نسخة مموَّهة
   (blur) مكبَّرة منها كخلفية — بدل قصّها بـcover على ارتفاع ثابت عشوائي
   لا علاقة له بأبعادها الحقيقية. صور بلا أبعاد موصى بها (أي مقاس) تظهر
   دائماً كاملة بلا أي جزء مفقود. ── */
.ca-media-link{display:block;height:100%;position:relative;}
.ca-media{position:absolute;inset:0;background:linear-gradient(135deg,var(--p),var(--s));}
.ca-media-blur{
  position:absolute;inset:-12%;background-size:cover;background-position:center;
  filter:blur(26px) brightness(.82) saturate(1.15);transform:scale(1.15);
}
.ca-media-img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;}
.ca-media-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;}
.ca-media-ph svg{width:48px;height:48px;color:rgba(255,255,255,.4);}
.ca-media-ph--video{background:linear-gradient(135deg,#1e1b4b,#1e293b);}

.ca-overlay{
  position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;
  padding:16px 18px;background:linear-gradient(to top,rgba(0,0,0,.75),rgba(0,0,0,.05) 55%,transparent);
}
.ca-overlay-title{color:#fff;font-size:1.02rem;font-weight:800;margin-bottom:4px;text-shadow:0 1px 6px rgba(0,0,0,.55);
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.ca-overlay-desc{color:rgba(255,255,255,.85);font-size:.82rem;margin-bottom:10px;line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ca-cta{display:inline-flex;align-items:center;gap:5px;padding:7px 16px;background:var(--p);color:#fff;
  border-radius:8px;font-size:.8rem;font-weight:700;transition:opacity .2s;width:fit-content;}
.ca-media-link:hover .ca-cta{opacity:.88;}

/* شارة نوع "فيديو": زر تشغيل يتوسّط الشريحة فوق الطبقة */
.ca-overlay--video{justify-content:center;align-items:center;text-align:center;gap:8px;}
.ca-play{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.15);
  border:3px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;
  margin-bottom:6px;backdrop-filter:blur(4px);transition:background .2s,border-color .2s;}
.ca-media-link:hover .ca-play{background:var(--p);border-color:var(--p);}
.ca-play svg{width:22px;height:22px;color:#fff;transform:translateX(-1px);}

/* ── نصي: بلا صورة — يتوسّط بنفس ارتفاع بقية الشرائح ── */
.ca-item--text{
  background:linear-gradient(135deg,#fdf1e3,#fff);border:1px solid #f0cf94;
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  padding:20px 26px;text-align:right;
}
.ca-text-title{font-size:1.05rem;font-weight:800;color:var(--ink);margin-bottom:6px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ca-text-desc{font-size:.87rem;color:var(--ink2);line-height:1.65;margin-bottom:12px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.ca-cta--text{text-decoration:none;}

/* ── عناصر تحكّم الكاروسيل (إعلانان فأكثر فقط) ── */
.ca-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:38px;height:38px;border:0;border-radius:50%;cursor:pointer;display:grid;place-items:center;
  background:rgba(255,255,255,.9);color:var(--ink);box-shadow:0 6px 16px rgba(0,0,0,.2);
  backdrop-filter:blur(6px);transition:transform .2s,background .2s;
}
.ca-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.08);}
.ca-arrow:active{transform:translateY(-50%) scale(.95);}
.ca-arrow svg{width:18px;height:18px;}
.ca-arrow--prev{right:12px;}
.ca-arrow--next{left:12px;}

.ca-progress{position:absolute;inset-inline-start:0;inset-block-end:0;height:3px;width:0;z-index:3;
  background:linear-gradient(90deg,var(--p),var(--s));}

.ca-dots{display:flex;gap:7px;justify-content:center;padding:12px 0 4px;}
.ca-dot{width:7px;height:7px;padding:0;border:0;border-radius:999px;cursor:pointer;
  background:var(--border);transition:width .3s,background .3s;}
.ca-dot.is-active{width:22px;background:var(--p);}

/* ── شريط إعلانات المنصّة ── */
.zk-platform-ads{background:#fafbff;border:1px solid var(--border);border-radius:var(--r);padding:6px;margin-bottom:16px;}

/* ═══════════════ Lightbox ═══════════════ */
.lightbox{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;flex-direction:column;padding:20px;backdrop-filter:blur(6px);}
.lightbox.open{display:flex;}
.lb-close{position:absolute;top:18px;left:18px;width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s;}
.lb-close:hover{background:rgba(255,255,255,.22);}
.lb-close svg{width:20px;height:20px;color:#fff;}
.lb-counter{position:absolute;top:22px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:.82rem;font-weight:600;}
.lb-img{max-width:90vw;max-height:82vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5);object-fit:contain;}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:10px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s;}
.lb-nav:hover{background:rgba(255,255,255,.25);}
.lb-nav svg{width:20px;height:20px;color:#fff;}
.lb-prev{right:14px;}
.lb-next{left:14px;}

/* ═══════════════ تجاوبي ═══════════════ */

/* ── تابلت ── */
@media(max-width:900px){
  .zk{padding-bottom:calc(var(--nav-h) + 28px);}
  .zk-wrap{max-width:100%;}
  .biz-grid{grid-template-columns:repeat(2,1fr);}
}

/* ── موبايل كبير ── */
@media(max-width:640px){
  :root{--bodypad:14px;}
  .zk-wrap{padding:0;}
  .zk-status{margin:0 10px 10px;border-radius:0 0 12px 12px;font-size:.8rem;}
  .zk-card,.zk-section{border-radius:0;box-shadow:none;}
  .zk-cover{height:200px;}
  .zk-logo{width:84px;height:84px;margin-top:-44px;border-radius:18px;border-width:3px;}
  .zk-name{font-size:1.35rem;letter-spacing:-.3px;}
  .zk-badges{gap:5px;}
  .zk-badge{font-size:.7rem;padding:4px 10px;}
  .zk-stats{font-size:.82rem;gap:5px 10px;}
  .zk-actions{gap:8px;}
  .zk-follow{font-size:.88rem;padding:10px;}
  .zk-msg-btn{font-size:.82rem;padding:10px 12px;}
  .zk-report-btn{font-size:11.5px;padding:10px 12px;}
  .resp-grid{grid-template-columns:1fr;}
  .biz-grid{grid-template-columns:repeat(2,1fr);}
  .gal-grid{grid-template-columns:repeat(2,1fr);}
  .ca-item{aspect-ratio:3/2;}
  .ca-overlay{padding:12px 14px;}
  .ca-overlay-title{font-size:.92rem;}
  .ca-item--text{padding:16px 18px;}
  .ca-arrow{width:32px;height:32px;}
  .ca-arrow svg{width:15px;height:15px;}
  .zk-platform-ads{border-radius:0;border-left:none;border-right:none;}
  .zk-msg-modal{border-radius:14px;}
  .sub-head h4{font-size:.82rem;}
  .partner-card{gap:9px;padding:10px 12px;}
  .partner-logo{width:36px;height:36px;}
  .zk-ci{width:56px;}
  .zk-ci-icon{width:46px;height:46px;}
  .zk-ci-icon svg{width:20px;height:20px;}
}

/* ── موبايل صغير جداً ── */
@media(max-width:380px){
  :root{--bodypad:12px;}
  .zk-cover{height:170px;}
  .zk-logo{width:72px;height:72px;margin-top:-38px;border-radius:14px;}
  .zk-name{font-size:1.2rem;}
  .zk-actions{gap:6px;}
  .zk-follow{font-size:.8rem;padding:9px 6px;}
  .zk-msg-btn{font-size:.72rem;padding:9px 8px;}
  .zk-report-btn{font-size:10.5px;padding:9px 8px;}
  .biz-grid{grid-template-columns:1fr 1fr;}
  .gal-grid{grid-template-columns:1fr 1fr;}
  .resp-grid{grid-template-columns:1fr;}
  .zk-stats{flex-wrap:wrap;gap:4px 8px;}
}

/* ── احترام تفضيل تقليل الحركة ── */
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important;}
  html{scroll-behavior:auto;}
}