:root { --wvc-accent:#7c3aed; --wvc-cols:3; --wvc-radius:14px; --wvc-gap:12px; }

.wvc-group { margin-bottom:1.5rem; }

.wvc-step-header { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.wvc-step-num { width:36px; height:36px; border-radius:50%; background:var(--wvc-accent); color:#fff; font-weight:700; font-size:1rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.wvc-step-title { font-size:1.2rem; font-weight:700; color:var(--wvc-accent); }

.wvc-cards-wrap { display:grid; grid-template-columns:repeat(var(--wvc-cols),1fr); gap:var(--wvc-gap); }

.wvc-card { position:relative; padding:16px 12px; border:2px solid rgba(255,255,255,0.15); border-radius:var(--wvc-radius); cursor:pointer; text-align:center; background:rgba(255,255,255,0.06); transition:border-color .2s,background .2s,box-shadow .2s,opacity .2s; display:flex; flex-direction:column; align-items:center; gap:8px; }
.wvc-card:hover { border-color:var(--wvc-accent); box-shadow:0 4px 16px rgba(124,58,237,0.25); }
.wvc-card.active { border-color:var(--wvc-accent); background:rgba(124,58,237,0.15); box-shadow:0 4px 18px rgba(124,58,237,0.3); }

.wvc-card .wvc-check { position:absolute; top:-10px; right:-10px; width:26px; height:26px; background:var(--wvc-accent); border-radius:50%; display:none; align-items:center; justify-content:center; color:#fff; font-size:.75rem; }
.wvc-card.active .wvc-check { display:flex; }

.wvc-card img { width:64px; height:64px; object-fit:cover; border-radius:8px; }
.wvc-card .wvc-label { font-weight:600; font-size:.95rem; }
.wvc-card.active .wvc-label { color:var(--wvc-accent); }

/* *** الفلترة: إخفاء الخيارات غير المتاحة *** */
.wvc-card.hidden { display:none !important; }
.wvc-card.disabled { opacity:.3; pointer-events:none; }

@media (max-width:600px) { .wvc-cards-wrap { grid-template-columns:repeat(2,1fr); } }
@media (max-width:380px) { .wvc-cards-wrap { grid-template-columns:1fr; } }