/* Card variant UI */
.czv-wrap{
  margin-top: 10px;
  text-align: center;
}

.czv-buttons{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
  margin: 10px 0 8px;
}

.czv-btn{
  border:1px solid #111;
  background:#fff;
  color:#111;
  padding:8px 12px;
  border-radius:8px;
  cursor:pointer;
  font-weight:700;
  font-size:14px;
  line-height:1;
  transition:transform .15s ease, background .15s ease, color .15s ease, opacity .15s ease;
}

.czv-btn:hover{ transform:translateY(-1px); }
.czv-btn.is-active{ background:#111; color:#fff; }
.czv-btn[disabled]{ opacity:.45; cursor:not-allowed; }

.czv-price{
  font-weight:800;
  margin: 6px 0 10px;
}

.czv-add{
  width:100%;
  max-width:320px;
  background:#111 !important;
  color:#fff !important;
  border-radius:10px !important;
  padding:12px 14px !important;
  font-weight:900 !important;
  letter-spacing:.4px;
}

.czv-add:disabled{
  opacity:.55;
  cursor:not-allowed;
}


.czv-label-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:8px;
}

.czv-label{
  font-weight:800;
  font-size:14px;
  text-align:left;
}

.czv-clear{
  border:none;
  background:transparent;
  color:#6b7280;
  font-weight:700;
  cursor:pointer;
  font-size:12px;
  padding:4px 6px;
  text-decoration:underline;
}

.czv-clear:hover{ color:#111; }