.rules-card-heading {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}

.secondary-button {
  border: 1px solid #9fdceb;
  border-radius: 9px;
  background: #edfbff;
  color: #087c99;
  padding: 10px 13px;
  font: 800 12px inherit;
  white-space: nowrap;
}

.rules-table-card td .rule-name-input {
  display: block;
  width: min(310px, 100%);
  font-weight: 800;
}

.rules-table-card td .rule-code-input { width: 130px; padding: 5px 7px; font-size: 10px; }
.rules-table-card td .rule-condition-input { display: block; width: min(310px, 100%); margin-top: 7px; padding: 7px 8px; font-size: 10px; }
.rule-remove { border: 0; background: transparent; color: #a65a52; font: 700 10px inherit; padding: 6px; cursor: pointer; }
.rule-remove:disabled { opacity: .35; cursor: not-allowed; }

@media (max-width: 600px) {
  .rules-card-heading { align-items: stretch; flex-direction: column; }
  .secondary-button { width: 100%; }
}