/* ALOKE — efg.hwe.sa/addons (2026-10-19). The few shapes «الإضافات المدفوعة»
   adds to the team shell (verify.css + team-ui.css draw everything else). */
.ad-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.ad-grid .vf-card { margin: 0; }
.ad-card { display: flex; flex-direction: column; gap: 8px; }
.ad-card-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ad-card-h h3 { margin: 0; }
.ad-card-h .ic { width: 20px; height: 20px; color: var(--accent); }
.ad-card-f { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: auto; }
.ad-count { margin-inline-end: auto; }
.ad-needs { margin: 2px 0; font-size: 13px; }
.ad-h { margin: 18px 4px 8px; }
.ad-id { font-size: 12px; margin-inline-start: 6px; }
.ad-chips, .ad-hit-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.ad-why { font-size: 12px; margin-top: 4px; }
.ad-why.bad { color: var(--danger); }
.ad-found { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.ad-hit { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; align-items: center;
  padding: 10px 12px; border: 1px solid var(--line, rgba(127, 127, 127, .2)); border-radius: 12px; }
.ad-hit .ad-hit-chips { grid-column: 1 / -1; margin-top: 0; }
.ad-hit .vf-actions { grid-row: 1; grid-column: 2; }
.ad-row { padding: 12px 0; border-top: 1px solid var(--line, rgba(127, 127, 127, .2)); display: flex; flex-direction: column; gap: 6px; }
.ad-row:first-of-type { border-top: 0; }
.ad-row-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ad-row-h .ic { width: 18px; height: 18px; color: var(--accent); }
.ad-nb-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; align-items: end; margin-top: 8px; }
.ad-nb-form .vf-actions { grid-column: 1 / -1; }
.ad-msgs { list-style: none; padding: 0; margin: 8px 0 0; display: flex; flex-direction: column; gap: 6px; }
.ad-msgs li { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
@media (max-width: 640px) {
  .ad-hit { grid-template-columns: 1fr; }
  .ad-hit .vf-actions { grid-row: auto; grid-column: 1; }
}
