.dl-cvc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 15px;
}
.dl-cvc-box {
  border:1px solid #ddd;
  padding:10px;
  background:#fff;
  color:#000;
  border-radius:8px;
  font-size:14px;
}
.dl-cvc-title { font-weight:bold; font-size:16px; margin-bottom:5px; }
.dl-cvc-info { display:inline-block; margin-left:5px; cursor:pointer; color:#0083ff; }
.dl-cvc-meta { margin:3px 0; }
.dl-cvc-btn {
  padding:6px 12px;
  background:#000;
  color:#fff !important;
  border:none;
  border-radius:6px;
  transition:0.2s;
  font-size:13px;
  cursor:pointer;
}
.dl-cvc-btn:hover { background:#444; }
.dl-cvc-search-form { margin:20px 0; text-align:center; }
.dl-cvc-search-form input { padding:6px; width:60%; border:1px solid #ccc; border-radius:5px; }
.dl-cvc-search-form button { padding:6px 10px; border:none; background:#000; color:#fff; border-radius:5px; cursor:pointer; }
.dl-cvc-pagination { text-align:center; margin:20px 0; }
.dl-cvc-pagination a { padding:5px 10px; border:1px solid #ccc; margin:0 3px; text-decoration:none; border-radius:4px; }
.dl-cvc-pagination a.active { background:#000; color:#fff; }
/* Modal centered */
#dl-cvc-modal {
  display:none;
  position:fixed;
  top:0; left:0;
  width:100%; height:100%;
  background:rgba(0,0,0,0.6);
  justify-content:center;
  align-items:center;
  z-index:999999;
}
.dl-cvc-modal-box {
  background:#fff;
  padding:20px;
  border-radius:12px;
  max-width:400px;
  width:80%;
  text-align:center;
  position:relative;
  animation: zoomIn 0.3s ease;
}
@keyframes zoomIn { from {transform:scale(0.8);opacity:0;} to {transform:scale(1);opacity:1;} }
@keyframes zoomOut { from {transform:scale(1);opacity:1;} to {transform:scale(0.8);opacity:0;} }
.dl-cvc-modal-box.hide {
  animation: zoomOut 0.3s ease forwards;
}
.dl-cvc-modal-close {
  position:absolute;
  top:10px; right:15px;
  font-size:20px;
  cursor:pointer;
}
.dl-cvc-modal-content {
  font-size:14px;
  color:#000;
}


/* Responsive grid */
.dl-cvc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 20px;
}
