/* Grid */
.wl-cgp-grid{
  display:grid;
  grid-template-columns:repeat(var(--wl-cols,5), minmax(0,1fr));
  gap:var(--wl-gap,16px);
}

/* Card */
.wl-cgp-item{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:160px;
  padding:22px 18px;
  text-decoration:none;
  border-radius:var(--wl-radius,16px);
  background:linear-gradient(180deg, var(--wl-cgp-bg-from,#fff), var(--wl-cgp-bg-to,#f6f8fb));
  border:1px solid var(--wl-cgp-border,#e5e7eb);
  color:var(--wl-cgp-text,#111827);
  box-shadow:0 8px 20px rgba(0,0,0,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

.wl-cgp-item .wl-cgp-name{
  font-weight:800;
  font-size:var(--wl-cgp-title-size,18px);
  color:var(--wl-cgp-title-color,#111827);
  margin-top:10px;
  margin-bottom:6px;
  text-align:center;
}

.wl-cgp-item .wl-cgp-count{
  font-size:14px;
  color:var(--wl-cgp-muted,#6b7280);
}

/* Accent stripe (uses per-term override if present) */
.wl-cgp-item .wl-cgp-accent{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:6px;
  height:100%;
  border-top-left-radius:var(--wl-radius,16px);
  border-bottom-left-radius:var(--wl-radius,16px);
  background:linear-gradient(180deg, var(--wl-cgp-accent-from,#7c3aed), var(--wl-cgp-accent-to,#06b6d4));
}
.wl-cgp-item[style*="--wl-accent-override"] .wl-cgp-accent{
  background: var(--wl-accent-override);
}

/* Thumbnail */
.wl-cgp-thumb{
  width:var(--wl-thumb,72px);
  height:var(--wl-thumb,72px);
  display:flex; align-items:center; justify-content:center;
  background:var(--wl-cgp-ph-bg,#eef2ff);
  overflow:hidden;
  margin-top:6px;
}
.wl-cgp-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }

/* Shape */
.wl-cgp-grid[style*="--wl-thumb-shape: circle"] .wl-cgp-thumb{ border-radius:999px; }
.wl-cgp-grid[style*="--wl-thumb-shape: rounded"] .wl-cgp-thumb{ border-radius:12px; }
.wl-cgp-grid[style*="--wl-thumb-shape: square"] .wl-cgp-thumb{ border-radius:0; }

/* Hover */
.wl-cgp-item:hover{
  border-color:#d1d5db;
  box-shadow:0 16px 32px rgba(0,0,0,.14);
}
@media (hover:hover){
  .wl-cgp-grid[style*="--wl-hover:1"] .wl-cgp-item:hover{ transform:translateY(-4px); }
}

/* Shadow toggle */
.wl-cgp-grid[style*="--wl-shadow:0"] .wl-cgp-item{ box-shadow:none; }

/* Responsive columns */
@media (max-width:1024px){
  .wl-cgp-grid{ grid-template-columns:repeat(var(--wl-cols-tab,3), minmax(0,1fr)); }
}
@media (max-width:768px){
  .wl-cgp-grid{ grid-template-columns:repeat(var(--wl-cols-mob,2), minmax(0,1fr)); }
}

/* Pagination */
.wl-cgp-pagination{
  margin-top:14px;
  display:flex; gap:8px; flex-wrap:wrap; align-items:center; justify-content:center;
}
.wl-cgp-pagination .page-numbers{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:36px; height:36px; padding:0 10px;
  border:1px solid var(--wl-cgp-border,#e5e7eb);
  border-radius:10px; text-decoration:none;
  color:var(--wl-cgp-text,#111827); background:#fff;
}
.wl-cgp-pagination .current{
  background:linear-gradient(180deg, var(--wl-cgp-accent-from,#7c3aed), var(--wl-cgp-accent-to,#06b6d4));
  color:#fff; border-color:transparent;
}
