/* Web autopay payment option states, action status and empty states. */
.md-pay-option.is-selected {
  border-color: rgba(76, 130, 255, 0.82);
  background: linear-gradient(145deg, rgba(39, 104, 255, 0.2), rgba(24, 26, 32, 0.98));
}

.md-pay-option strong {
  font-size: 18px;
  overflow-wrap: anywhere;
}

.md-autopay-actions {
  display: grid;
  gap: 10px;
}

.md-autopay-status {
  border: 1px solid rgba(126, 178, 255, 0.28);
  border-radius: 16px;
  padding: 14px;
  background: rgba(40, 89, 185, 0.16);
  color: #dbe7ff;
  font-size: 15px;
  line-height: 1.35;
}

.md-autopay-status.is-error {
  border-color: rgba(255, 91, 111, 0.42);
  background: rgba(190, 43, 67, 0.15);
  color: #ffd6dc;
}

.md-autopay-status.is-success {
  border-color: rgba(75, 211, 146, 0.4);
  background: rgba(42, 150, 101, 0.16);
  color: #d5ffea;
}

.md-autopay-empty {
  display: grid;
  justify-items: center;
  gap: 12px;
  padding: 28px 20px;
  text-align: center;
}

.md-autopay-empty h3 {
  margin: 0;
  font-size: 24px;
}

.md-autopay-empty p {
  margin: 0;
  color: #b7bdc9;
  font-size: 15px;
  line-height: 1.35;
}

.md-soft-btn:disabled,
.md-primary-btn:disabled {
  cursor: default;
  opacity: 0.5;
}

.md-empty-state {
  padding: 18px;
  color: #cfd3de;
  font-size: 16px;
  line-height: 1.35;
}