/* أُعيدت من الملف المشترك: للمحدد أكثر من نسخة في المشروع،
   والمشاركة كانت ستفرض نسخة صفحة أخرى على هذه. */
.lx-card { background:var(--bg-card);border:1.5px solid var(--border); border-radius:var(--r-md);padding:14px;cursor:pointer; transition:box-shadow .3s,transform .3s,border-color .3s; position:relative;text-decoration:none;color:inherit; display:flex;flex-direction:column; }

.srch-page { padding: 0 0 100px; }

/* ════ Hero (موبايل) — نفس تصميم صفحتي الأقسام والمجموعات ════ */
.lx-cat-hero {
    display:none;position:relative;overflow:hidden;
    background:linear-gradient(135deg,var(--brand-dark,#3a2d5c) 0%,var(--brand-primary) 100%);
    min-height:130px;border-radius:0 0 var(--r-lg) var(--r-lg);margin-bottom:14px;
}
.lx-hero-content { position:relative;z-index:2;padding:22px 18px 18px;color:#fff; }
.lx-hero-title { font-family:var(--font-display,'Cormorant Garamond',serif);font-size:26px;font-weight:700;margin-bottom:4px;text-shadow:0 2px 12px rgba(0,0,0,.35); }
.lx-hero-sub   { font-size:12.5px;opacity:.82; }
@media (max-width:968px) { .lx-cat-hero { display:block !important; } }

/* حالة "جاري المسح" لزر الباركود (الآن f-chip) */
.f-chip.scanning { background:rgba(48,216,163,.15);border-color:#30d8a3;color:#1a9a73;animation:pulse-scan 1s infinite; }
@keyframes pulse-scan { 0%,100%{box-shadow:0 0 0 0 rgba(48,216,163,.5)} 50%{box-shadow:0 0 0 6px rgba(48,216,163,0)} }

/* ── مودال ماسح الباركود ── */
.bc-overlay {
  display: none; position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.85); align-items: center; justify-content: center;
}
.bc-overlay.open { display: flex; }
.bc-modal {
  background: #1a1a2e; border-radius: var(--r-lg); padding: 24px;
  width: min(360px, 92vw); position: relative; overflow: hidden;
  border: 1px solid rgba(255,255,255,.1);
}
.bc-modal-title {
  font-family:var(--font-display,'Cormorant Garamond',serif); font-size: 20px;
  color: #fff; text-align: center; margin-bottom: 16px;
}
.bc-video-wrap {
  position: relative; border-radius: var(--r-md); overflow: hidden;
  background: #000; aspect-ratio: 4/3;
}
#bcVideo { width: 100%; height: 100%; object-fit: cover; display: block; }

/* خط الماسح المتحرك */
.bc-scan-line {
  position: absolute; left: 10%; right: 10%; height: 2px;
  background: linear-gradient(90deg, transparent, #30d8a3, transparent);
  border-radius: 2px; animation: scan-move 1.8s ease-in-out infinite;
  box-shadow: 0 0 8px rgba(48,216,163,.8);
}
@keyframes scan-move {
  0%   { top: 15%; opacity: 0 }
  10%  { opacity: 1 }
  90%  { opacity: 1 }
  100% { top: 85%; opacity: 0 }
}

/* زوايا الإطار */
.bc-corner { position: absolute; width: 22px; height: 22px; border-color: #30d8a3; border-style: solid; border-width: 0; }
.bc-corner.tl { top: 10px; left: 10px; border-top-width: 3px; border-left-width: 3px; border-radius: 4px 0 0 0; }
.bc-corner.tr { top: 10px; right: 10px; border-top-width: 3px; border-right-width: 3px; border-radius: 0 4px 0 0; }
.bc-corner.bl { bottom: 10px; left: 10px; border-bottom-width: 3px; border-left-width: 3px; border-radius: 0 0 0 4px; }
.bc-corner.br { bottom: 10px; right: 10px; border-bottom-width: 3px; border-right-width: 3px; border-radius: 0 0 4px 0; }

.bc-status {
  text-align: center; color: rgba(255,255,255,.7); font-size: 13px; margin-top: 12px;
  min-height: 20px; transition: color 200ms;
}
.bc-status.found { color: #30d8a3; font-weight: 700; }
.bc-status.error { color: #f87171; }

.bc-actions {
  display: flex; gap: 10px; margin-top: 16px;
}
.bc-btn {
  flex: 1; padding: 10px; border-radius: var(--r-sm); border: none;
  font-family: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
  transition: all 200ms;
}
.bc-btn.cancel { background: rgba(255,255,255,.1); color: rgba(255,255,255,.7); }
.bc-btn.cancel:hover { background: rgba(255,255,255,.2); }

/* ── بادج الباركود غير الموجود ── */
.bc-not-found-badge {
  background: rgba(239,68,68,.15); border: 1px solid rgba(239,68,68,.3);
  border-radius: var(--r-sm); padding: 12px 16px; margin-top: 12px;
  color: #fca5a5; font-size: 13px; text-align: center; display: flex;
  align-items: center; justify-content: center; gap: 8px;
}

/* Filter chips — نفس تصميم lx-fpill بصفحة الأقسام */
.f-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 7px 14px; border-radius: var(--r-lg);
  border: 1px solid var(--border); background: var(--bg-card);
  color: var(--text-m); font-size: 12.5px; font-weight: 600;
  text-decoration: none; cursor: pointer; transition: all 200ms; white-space: nowrap;
}
.f-chip:hover, .f-chip.active {
  border-color: var(--brand-primary);
  background: var(--brand-primary)15; color: var(--brand-primary);
}

/* الحاوية العامة — نفس lx-page بصفحة الأقسام */
.lx-page { max-width:1400px;margin:20px auto;padding:0 20px;display:flex;gap:22px; }
.lx-sb-body { display:none;padding:4px 0 10px;max-height:260px;overflow-y:auto; }
.lx-sb-cnt { color:var(--text-m);font-size:11px; }
.lx-tree-label {
    display:flex;align-items:center;justify-content:space-between;gap:6px;padding:7px 14px;
    cursor:pointer;font-size:13px;color:var(--text-b);text-decoration:none;transition:background .15s;
}

.lx-bc { display:flex;align-items:center;gap:4px;font-size:12px;flex-wrap:wrap; }

.lx-fpill {
    display:inline-flex;align-items:center;gap:5px;
    padding:7px 14px;border:1px solid var(--border);border-radius:var(--r-lg);
    font-size:12.5px;cursor:pointer;color:var(--text-m);
    background:var(--bg-card);white-space:nowrap;flex-shrink:0;transition:all .2s;
    text-decoration:none;
}
.lx-mob-only-pill { display:none; }
@media (max-width:968px) { .lx-mob-only-pill { display:inline-flex; } }
@media (max-width:968px) { .lx-desktop-only { display:none !important; } }
.lx-sort-opt {
    display:flex;align-items:center;gap:12px;padding:13px 4px;
    border-bottom:1px solid var(--border);cursor:pointer;
    font-size:15px;color:var(--text-b);transition:color .2s;
}
.lx-sort-opt input { width:18px;height:18px;accent-color:var(--brand-primary); }
.lx-sort-opt.selected label { color:var(--brand-primary);font-weight:700; }

.lx-mob-cat-list { max-height:55vh;overflow-y:auto; }
.lx-mob-cat-item {
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:13px 4px;border-bottom:1px solid var(--border);
    font-size:14.5px;color:var(--text-b);text-decoration:none;
}
.lx-mob-cat-item:last-child { border-bottom:none; }
.lx-mob-cat-item.selected { color:var(--brand-primary);font-weight:700; }
.lx-mob-cat-item .cnt { font-size:12px;color:var(--text-m); }

@media (max-width:968px) {
    /* ⚠️ overflow-x:hidden على body يجعله حاوية التمرير، فيفقد الهيدر
       (.m-header, position:sticky) تثبيته في الموبايل. القيمة clip تمنع
       التمرير الأفقي دون إنشاء حاوية تمرير، فيبقى sticky عاملاً.
       hidden أولاً كبديل للمتصفحات التي لا تعرف clip. */
    body, .luxe { overflow-x:hidden; overflow-x:clip; }
    .srch-page { max-width:100vw;overflow-x:hidden; }
    .lx-page { flex-direction:column;padding:0 10px;margin-top:12px;max-width:100%; }
    .lx-sidebar { display:none !important; }
}

/* Product grid */
.srch-grid {
  display: grid; grid-template-columns: repeat(2,1fr); gap: 12px;
}
@media(min-width:480px) { .srch-grid { grid-template-columns: repeat(3,1fr); } }
@media(min-width:768px) { .srch-grid { grid-template-columns: repeat(4,1fr); gap: 16px; } }
@media(min-width:1100px){ .srch-grid { grid-template-columns: repeat(5,1fr); } }

/* ════ LIST-VIEW (شبكة/قائمة) — نفس تصميم صفحة الأقسام ════ */
.srch-grid.list-view { grid-template-columns:1fr !important;gap:12px; }
.srch-grid.list-view .lx-card {
    display:grid;grid-template-columns:100px 1fr auto;gap:0 12px;
    align-items:start;padding:12px;min-height:130px;
}
.srch-grid.list-view .lx-card .lx-img-wrap {
    width:100px;height:100px;margin-bottom:0;grid-row:span 4;grid-column:1;
}
.srch-grid.list-view .lx-card .lx-brand { grid-column:2;grid-row:1;font-size:11px; }
.srch-grid.list-view .lx-card .lx-name  { grid-column:2;grid-row:2;font-size:12px; }
.srch-grid.list-view .lx-card .lx-pricing { grid-column:3;grid-row:1/span 4;flex-direction:column;align-items:stretch;justify-content:center;gap:8px;min-width:95px;margin-top:0; }
/* ⚠️ إصلاح: راجع التعليق بنفس القاعدة بـ collection.blade.php. */
.srch-grid.list-view .lx-card .lx-wish { position:absolute;top:4px;inset-inline-start:4px;inset-inline-end:auto; }

@media (max-width:768px) {
    .srch-grid.list-view .lx-card {
        grid-template-columns: 88px 1fr auto !important;
        gap: 0 10px !important; padding: 10px !important;
        min-height: 100px !important;
    }
    .srch-grid.list-view .lx-card .lx-img-wrap {
        width: 88px !important; height: 88px !important;
        border-radius: var(--r-sm) !important;
    }
    .srch-grid.list-view .lx-card .lx-brand { font-size: 10px !important; margin-bottom: 2px !important; }
    .srch-grid.list-view .lx-card .lx-name {
        font-size: 11.5px !important; min-height: 32px !important;
        -webkit-line-clamp: 2 !important;
    }
    .srch-grid.list-view .lx-card .lx-price { font-size: 15px !important; }
    .lx-view-toggle { display: flex !important; }
}
.lx-brand { font-size:12px;font-weight:800;color:var(--brand-primary);margin-bottom:4px; }
.lx-add-btn:disabled { opacity:.4;cursor:not-allowed;background:var(--bg-soft); }
.lx-add-btn:disabled:hover { color:var(--text-m);border-color:var(--border); }

.srch-empty {
  text-align: center; padding: 80px 20px;
  background: var(--bg-card); border-radius: var(--r-lg); border: 1px solid var(--border);
}

/* ── منتجات تُعرض بدل الشاشة الفارغة ──────────────────────────────
   ⚠️ بلا فاصل ولا عنوان (طلب صاحب المتجر): تُعرض كشبكة منتجات عادية
      تماماً. النسخة الأولى كانت تحمل خطّاً فاصلاً وعنواناً يقول إنها
      ليست نتائج بحث — فبدت الشاشة متناقضة: «لا نتائج» ثم منتجات. */
.srch-sugg { margin-top: 4px; }

/* ══════════════════════════════════════════════
   Pagination — نفس تصميم lx-pagination بصفحة الأقسام
══════════════════════════════════════════════ */
.lx-pagination { display:flex;justify-content:center;align-items:center;gap:6px;margin-top:28px;padding-bottom:10px;flex-wrap:wrap; }
.lx-pg-btn:hover:not(.disabled):not(.active) { border-color:var(--brand-primary);color:var(--brand-primary); }
.lx-pg-btn.disabled { opacity:.35;cursor:not-allowed;pointer-events:none; }

@media (max-width: 480px) {
  .lx-pagination { gap:5px;margin-top:20px; }
  .lx-pg-btn { min-width:34px;height:34px;font-size:12px; }
}