.vapro-grid { 
  display:grid; 
  grid-template-columns: 1fr;  /* по един бутон на ред */
  gap:12px; 
  margin-bottom: 12px;
}

.vapro-card {
  border:1px solid #e5e7eb; 
  border-radius:12px; 
  padding:12px; 
  background:#fff; 
  cursor:pointer; 
  display:flex; 
  flex-direction:column; 
  gap:8px; 
  position:relative; 
  transition: box-shadow .15s ease, border-color .15s ease, transform .05s ease;
}
.vapro-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,.06); }
.vapro-card.vapro-selected { border-color:#111827; box-shadow: 0 0 0 2px #111827 inset; }
.vapro-card.vapro-disabled { opacity:.45; cursor:not-allowed; }
.vapro-head { display:flex; align-items:center; gap:10px; }
.vapro-mini { width:28px; height:28px; object-fit:cover; border-radius:6px; background:#f3f4f6; flex:0 0 28px; }
.vapro-titlewrap { display:flex; flex-direction:column; gap:4px; flex:1 1 auto; min-width:0; }
.vapro-title { font-weight:600; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vapro-attrs { 
  font-size:.9rem; 
  color:#4b5563; 
  line-height:1.4;
  white-space:normal;      /* позволяваме пренасяне */
  overflow:visible;
  text-overflow:clip;
}

.vapro-price-inline { font-size:.95rem; font-weight:600; margin-left:auto; }
.vapro-badge { position:absolute; top:10px; right:10px; font-size:.75rem; background:#f9fafb; border:1px solid #e5e7eb; padding:2px 8px; border-radius:999px; }
.vapro-clear { margin: 0 0 16px; border:1px solid #e5e7eb; background:#fff; padding:8px 12px; border-radius:8px; cursor:pointer; }
form.variations_form table.variations { display:none !important; }

/* Скриваме допълнителния прозорец с variation description,
   защото вече цялата информация е в бутоните */
.single-product .woocommerce-variation-description,
.single-product .woocommerce-variation .woocommerce-variation-description {
  display:none !important;
}

/* --- MOBILE SAFE BUTTON LAYOUT --- */

.vapro-grid {
  width: 100%;
  max-width: 100%;
}

.vapro-card {
  width: 100%;
  box-sizing: border-box;
}

/* Текстът да се пренася коректно */
.vapro-titlewrap,
.vapro-attrs {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: break-word !important;
  line-height: 1.3;
}

/* Картата да се адаптира към малки екрани */
@media (max-width: 480px) {
  .vapro-card {
    padding: 14px;
  }
  .vapro-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .vapro-mini {
    width: 48px;
    height: 48px;
  }
  .vapro-title {
    font-size: 1.05rem;
    white-space: normal !important;
  }
  .vapro-attrs {
    font-size: .95rem;
  }
}