a.btn-main,
button.btn-main {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  height: 48px;
  border: 0px;
  border-radius: var(--radius-m);
  padding: 16px;
  font-size: 16px;
  font-family: 'Raleway', Arial, sans-serif;
  font-weight: 700;
}

button.btn.active,
button.btn:active {
  box-shadow: unset;
}

a.btn-main:hover,
button.btn-main:hover {
  color: #e43f4a;
  text-decoration: none;
}

a.btn-main:hover svg,
button.btn-main:hover svg,
a.btn-main:focus svg,
button.btn-main:focus svg {
  color: #e43f4a;
}

a.btn-main:focus,
button.btn-main:focus {
  color: #e43f4a;
  outline: 4px solid var(--shade);
}

.enter_link.btn-main {
  background-color: transparent;
  color: var(--black);
}

.enter_link.btn-main:hover {
 color: #e43f4a;
}

.enter_link.btn-main:hover svg {
  stroke: #e43f4a;
}

.btn-primary {
  color: #fff;
}

.btn-main.btn-secondary {
  color: var(--white);
  background-color: var(--green);
}

.btn-main.btn-secondary:focus,
.btn-main.btn-secondary:hover {
  color: var(--white);
  background-color: var(--hover-btn-green);
}

.btn-main.btn-secondary:focus {
  outline: 4px solid var(--shade);
}

a.open-all {
  height: 78px;
  min-width: 200px;
  max-width: 280px;
  font-size: 16px;
  margin: 0 auto;
  font-weight: 700;
  text-decoration: none;
  border: 2px solid var(--shade);
  color: var(--sm-btn-color);
}

button.toggle span::before {
  content: attr(data-active);
}

button.toggle.active span::before {
  content: attr(data-disactive)
}

.prod_buy_btns .pre_order_click {
  color: var(--white);
}

.prod_buy_btns .pre_order_click:hover,
.prod_buy_btns .pre_order_click:focus {
  background-color: var(--hover-btn);
  border-color: var(--hover-btn);
  color: var(--white);
}

@media (min-width: 1600px) {
  a.btn-main,
  button.btn-main {
    height: 56px;
  }
}

@media (max-width: 768px) {
  a.open-all {
    height: 64px;
    max-width: 260px;
    border-radius: 12px;
    font-size: 14px;
  }
}