:root {
  --green: #5AB058;
  --green-hover: #4A9A48;
  --dark-blue: #0C1729;
  --dark-blue-hover: #0A1321;
  --gray: #A7A9AB;
  --light-gray: #F1F2F2;
  --white: #FFFFFF;
}


.btn {
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.3px;
  padding: 10px 20px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.4;
}


.btn.action {
  background: var(--green);
  color: var(--white);
}
.btn.action:hover {
  background: var(--green-hover);
}


.btn.secondary {
  background: var(--dark-blue);
  color: var(--white);
}
.btn.secondary:hover {
  background: var(--dark-blue-hover);
}


.btn.outlined {
  background: transparent;
  border: 1.5px solid var(--dark-blue);
  color: var(--dark-blue);
}
.btn.outlined:hover {
  background: var(--light-gray);
}


.btn:disabled {
  background: var(--gray);
  color: var(--white);
  cursor: not-allowed;
  opacity: 0.6;
}