.wc-parches-field{margin:10px 0}
.wc-parches-label{margin-bottom:6px}
.wc-parches-options{display:flex;flex-wrap:wrap;gap:10px}
.wc-parche-option{cursor:pointer;display:inline-block}
.wc-parche-option input{display:none}
.wc-parche-card{border:1px solid #ddd;border-radius:6px;padding:6px;min-width:60px;display:inline-block;text-align:center;transition:box-shadow .15s,border-color .15s;background:#fff;width:120px}
.wc-parche-card.is-selected,.wc-parche-option input:checked + .wc-parche-card{border-color:#5b46c6;box-shadow:0 0 0 2px rgba(91,70,198,.12)}
.wc-thumb{margin:0 auto;background:#f8f8f8;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:11px;color:#666}
.wc-name{display:flex;flex-direction:column;align-items:center;gap:2px}
.wc-title{font-size:12px;line-height:1.2;text-align:center;word-wrap:break-word;white-space:normal}
.wc-price{font-size:11px;line-height:1.2;text-align:center;opacity:.9}
.variations_button .wc-parches-field{margin-bottom:12px}
/* margin when placed after PPOM wrapper */
.ppom-rendering-fields + .wc-parches-field{margin-top:8px}

/* 3-column mobile grid */
@media (max-width: 768px){
  .wc-parches-field .wc-parches-options{
    display:grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px 8px;
  }
  .wc-parches-field .wc-parche-option,
  .wc-parches-field .wc-parche-card{
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box;
  }
}
