/* ──────────────────────────────────────────────────────────
   ASTRO — صفحة التصنيف
   ──────────────────────────────────────────────────────────
   شبكة منتجات التصنيف وكروت الأقسام في الصفحة الرئيسية.
   تنسيق التصنيفات الفرعية والفلاتر في css/features/catalog.css
────────────────────────────────────────────────────────── */

        /* ── Category page ── */
    #categoryPage .products-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
      gap: 22px;
    }

        /* ── Category cards ── */
    .browse-link {
      margin-top: 14px;
      font-family: 'Orbitron', sans-serif;
      font-size: 0.68rem;
      letter-spacing: 2px;
      color: var(--pl);
      transition: color 0.2s;
    }
    .category-card:hover .browse-link { color: #fff; }
    .category-card:hover { border-color: rgba(138,77,255,0.6) !important; }

    /* ── عناصر الفلاتر ──
       الكلاسين دول بتستخدمهم لوحة الفلاتر في css/features/catalog.css
       (.cat-filter-bar القديم اتشال — مكانش مستخدم في أي مكان) */
    .cat-filter-title {
      font-family: 'Orbitron', sans-serif;
      font-size: 0.75rem;
      font-weight: 700;
      color: var(--pl);
      letter-spacing: 2px;
    }
    .cat-clear-btn {
      padding: 7px 18px;
      background: rgba(138,77,255,0.15);
      border: 1px solid rgba(138,77,255,0.3);
      border-radius: 20px;
      color: var(--pl);
      font-family: 'Orbitron', sans-serif;
      font-size: 0.65rem;
      letter-spacing: 1px;
      cursor: pointer;
      transition: background 0.2s;
    }
    .cat-clear-btn:hover { background: rgba(138,77,255,0.3); color: #fff; }

    
    .lang-btn {
      /* ارتفاع كافي للضغط بالإصبع من غير ما الشكل يكبر */
      min-height: 36px;
      display: inline-flex; align-items: center; justify-content: center;
      padding: 7px 14px;
      background: rgba(138,77,255,0.12);
      border: 1px solid rgba(138,77,255,0.3);
      border-radius: 4px;
      color: var(--pl);
      font-family: 'Orbitron', sans-serif;
      font-size: 0.68rem;
      font-weight: 700;
      letter-spacing: 1px;
      cursor: pointer;
      transition: background 0.2s;
    }
    .lang-btn:hover { background: rgba(138,77,255,0.25); }

    

/* ══════════════════════════════════
   شاشة اختيار القسم
   (لابتوب جديد ولا استيراد — js/shop/category-page.js)
══════════════════════════════════ */
.cat-choice-q{
  text-align:center;font-family:'Orbitron',sans-serif;font-size:0.72rem;
  letter-spacing:3px;color:var(--pl);margin:10px 0 26px;text-transform:uppercase;
}
.cat-choices{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:20px;max-width:820px;margin:0 auto;
}
.cat-choice{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;
  padding:38px 26px;border:1px solid rgba(138,77,255,0.28);border-radius:12px;
  background:rgba(14,14,30,0.6);cursor:pointer;font-family:'Cairo',sans-serif;
  transition:border-color 0.2s,background 0.2s,transform 0.2s,box-shadow 0.2s;
}
.cat-choice:hover{
  border-color:var(--pm);background:rgba(138,77,255,0.1);
  transform:translateY(-4px);box-shadow:0 10px 34px rgba(138,77,255,0.28);
}
.cat-choice-ico{font-size:2.6rem;line-height:1}
.cat-choice-name{font-size:1.15rem;font-weight:700;color:var(--wh)}
.cat-choice-desc{font-size:0.85rem;line-height:1.7;color:rgba(242,242,247,0.55)}
.cat-choice-n{
  margin-top:4px;font-family:'Orbitron',sans-serif;font-size:0.64rem;letter-spacing:2px;
  color:var(--pl);background:rgba(138,77,255,0.14);border-radius:20px;padding:5px 14px;
}
.cat-choice-all{
  display:block;margin:30px auto 10px;background:none;border:none;cursor:pointer;
  font-family:'Cairo',sans-serif;font-size:0.9rem;color:rgba(242,242,247,0.55);
  text-decoration:underline;text-underline-offset:4px;transition:color 0.2s;
}
.cat-choice-all:hover{color:var(--pl)}

@media(max-width:600px){
  .cat-choices{grid-template-columns:1fr;gap:14px}
  .cat-choice{padding:28px 20px}
  .cat-choice-ico{font-size:2.2rem}
}
