.base-button.base-button--small,
.base-button.base-button--medium,
.base-button.base-button--large {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: none;
  border-radius: 10px;
  font-family: "Geologica", sans-serif;
  font-style: normal;
  font-weight: 200;
  line-height: 1.28;
  text-decoration: none !important;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.1s ease;
}

.base-button .base-button__text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
}

.base-button.base-button--small:focus,
.base-button.base-button--medium:focus,
.base-button.base-button--large:focus,
.base-button.base-button--small:hover,
.base-button.base-button--medium:hover,
.base-button.base-button--large:hover {
  outline: none;
  box-shadow: none;
  transform: none;
}

.base-button.base-button--small:focus-visible,
.base-button.base-button--medium:focus-visible,
.base-button.base-button--large:focus-visible {
  outline: 2px solid #5691c8;
  outline-offset: 2px;
}

.base-button.base-button--small {
  padding: 8px 16px;
  font-size: 13px;
  border-radius: 8px;
}

.base-button.base-button--medium {
  padding: 12px 22px;
  font-size: 16px;
  border-radius: 10px;
}

.base-button.base-button--large {
  padding: 14px 26px;
  font-size: 17px;
  border-radius: 12px;
}

.base-button.base-button--primary {
  background: #5691c8;
  color: #fff;
}

.base-button.base-button--secondary {
  background: #d3eaff;
  color: #24394b;
}

.base-button.base-button--error {
  background: #ff6262;
  color: #fff;
}

.base-button.base-button--dark {
  background: #051c2b;
  color: #fff;
}

.base-button.base-button--light {
  background: #fff;
  color: #051c2b;
}