.buttons {
  gap: 10px;
}

.button,
button,
button.swal2-styled {
  min-width: 108px;
  height: 38px;
  -webkit-transition: .2s all ease;
  -o-transition: .2s all ease;
  transition: .2s all ease;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 0;
  padding-bottom: 0;
  width: auto;
  font-size: 16px;
}

.button.button_bigger,
button.button_bigger,
button.swal2-styled.button_bigger {
  height: 50px;
  max-width: 200px;
}

.button.link,
button.link,
button.swal2-styled.link {
  display: table;
  width: auto;
  height: auto;
  background: none;
  border: none;
  color: #707070;
}

.button.link:hover,
button.link:hover,
button.swal2-styled.link:hover {
  color: #707070;
  width: auto;
  height: auto;
  background: none;
  border: none;
  text-decoration: underline;
}

.button.link.disabled, .button.link:disabled,
button.link.disabled,
button.link:disabled,
button.swal2-styled.link.disabled,
button.swal2-styled.link:disabled {
  color: #eeeeee;
  background: #ababab;
}

.button.link.disabled:hover, .button.link:disabled:hover,
button.link.disabled:hover,
button.link:disabled:hover,
button.swal2-styled.link.disabled:hover,
button.swal2-styled.link:disabled:hover {
  color: #eeeeee;
  background: #ababab;
}

.button.back-to-home-link,
button.back-to-home-link,
button.swal2-styled.back-to-home-link {
  border-radius: 6px;
  font-weight: 700 !important;
  text-indent: 2px;
  letter-spacing: 0;
  font-size: 16px;
  line-height: 38px;
  color: #fff !important;
  height: 38px;
  padding-left: 20px;
  padding-right: 20px;
  background-color: #0066ff;
  text-decoration: none;
  width: 100%;
  max-width: 182px;
}

.button.back-to-home-link:hover,
button.back-to-home-link:hover,
button.swal2-styled.back-to-home-link:hover {
  text-decoration: none;
  background-color: #3787ff;
}

.button.back-to-home-link:focus,
button.back-to-home-link:focus,
button.swal2-styled.back-to-home-link:focus {
  text-decoration: none;
  background-color: #0051cb;
}

.button.is-primary,
button.is-primary,
.woocommerce button.is-primary,
.woocommerce a.button.is-primary,
.woocommerce .checkout button.button.alt {
  background-color: #219168;
}

.button.is-primary:hover,
button.is-primary:hover,
.woocommerce button.is-primary:hover,
.woocommerce a.button.is-primary:hover,
.woocommerce .checkout button.button.alt:hover {
  background: #37b983;
}

.button.is-primary:focus,
button.is-primary:focus,
.woocommerce button.is-primary:focus,
.woocommerce a.button.is-primary:focus,
.woocommerce .checkout button.button.alt:focus {
  background: #0e744a;
}

.button.is-primary:disabled, .button.is-primary.disabled[disabled],
button.is-primary:disabled,
button.is-primary.disabled[disabled],
.woocommerce button.is-primary:disabled,
.woocommerce button.is-primary.disabled[disabled],
.woocommerce a.button.is-primary:disabled,
.woocommerce a.button.is-primary.disabled[disabled],
.woocommerce .checkout button.button.alt:disabled,
.woocommerce .checkout button.button.alt.disabled[disabled] {
  color: #eeeeee;
  background: #ababab;
}

.button.is-primary:disabled:hover, .button.is-primary.disabled[disabled]:hover,
button.is-primary:disabled:hover,
button.is-primary.disabled[disabled]:hover,
.woocommerce button.is-primary:disabled:hover,
.woocommerce button.is-primary.disabled[disabled]:hover,
.woocommerce a.button.is-primary:disabled:hover,
.woocommerce a.button.is-primary.disabled[disabled]:hover,
.woocommerce .checkout button.button.alt:disabled:hover,
.woocommerce .checkout button.button.alt.disabled[disabled]:hover {
  color: #eeeeee;
  background: #ababab;
}

.woocommerce button.button:disabled:hover,
.woocommerce button.button:disabled[disabled]:hover,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled] {
  color: #eeeeee;
  background: #ababab;
  opacity: 1;
}

.button.is-secondary,
button.is-secondary,
.woocommerce button.is-secondary {
  background-color: #0066ff;
}

.button.is-secondary:hover,
button.is-secondary:hover,
.woocommerce button.is-secondary:hover {
  background: #0051cb;
}

.button.is-secondary:focus,
button.is-secondary:focus,
.woocommerce button.is-secondary:focus {
  background: #0051cb;
}

.button {
  padding: 20px 48px;
  border-radius: 16px;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
  display: flex !important;
}

.page-template a.button {
  padding: 20px 48px;
  border-radius: 16px;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
  display: flex !important;
}

.shop-button {
  padding: 20px 48px !important;
  border-radius: 16px !important;
  justify-content: center !important;
  align-items: center !important;
  font-size: 18px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-transform: uppercase !important;
  display: flex !important;
}

.button.is-tall {
  padding: 21px 20px;
}

.button.is-half {
  /*width: 50%;  */
  width: max-content;
}

.button.fits-content {
  width: fit-content;
}

.button.is-primary {
  background-color: var(--brainbuffet-green)!important;
}

.button.is-primary:hover {
  background-color: var(--brainbuffet-green-dark)!important;
}

.button.is-clear {
  background-color: transparent;
  color: var(--brainbuffet-green) !important;
  border: 2px solid var(--brainbuffet-green);
}

.shop-button.is-clear {
  background-color: transparent !important;
  color: var(--brainbuffet-green) !important;
  border: 2px solid var(--brainbuffet-green) !important;
}

.button.is-clear:hover {
  background-color: transparent;
  color: var(--brainbuffet-green-dark) !important;
  border: 2px solid var(--brainbuffet-green-dark);
}

.button.is-outlined {
  background-color: transparent;
  color: white !important;
  border: 2px solid white;
}

.button.is-outlined:hover {
  background-color: transparent;
  color: #f6f6fa !important;
  border: 2px solid #f6f6fa;
}

.button.is-borderless {
    border: 0;
    gap: 10px;
}

.button.is-borderless:hover {
    border: 0;
    gap: 10px;
    color: var(--brainbuffet-green) !important;
}

.button.is-white {
  background-color: white;
  color: #b50007 !important;
  border: 2px solid white;
}

.button.is-white:hover {
  background-color: transparent;
  color: #f6f6fa !important;
  border: 2px solid #f6f6fa;
}

.button.is-warning {
  background-color: transparent;
  color: var(--brainbuffet-warning) !important;
  border: 2px solid var(--brainbuffet-warning);
}

.button.is-warning:hover {
  background-color: transparent;
  color: var(--brainbuffet-warning-dark) !important;
  border: 2px solid var(--brainbuffet-warning-dark);
}

.button.is-danger:hover {
  background-color: transparent;
  color: var(--brainbuffet-danger-dark) !important;
  border: 2px solid var(--brainbuffet-danger-dark);
}

.button.is-blue {
  background-color: transparent;
  color: var(--brainbuffet-blue) !important;
  border: 2px solid var(--brainbuffet-blue);
}

.button.is-blue:hover {
  background-color: transparent;
  color: var(--brainbuffet-blue-dark) !important;
  border: 2px solid var(--brainbuffet-blue-dark);
}

.button.is-gray {
  background-color: transparent;
  color: var(--brainbuffet-gray) !important;
  border: 2px solid var(--brainbuffet-gray);
}

.button.medium {
  font-size: 16px;
  line-height: 16px;
}

.button.small {
  font-size: 14px;
  line-height: 14px;
}