/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/

.button_primary,
form input[type=submit],
form .hs-button,
.hs-search-results__next-page,
.hs-search-results__prev-page {
  border: 1px solid;
  border-image-slice: 1;
  border-width: 4px;
  border-image-source: linear-gradient(90deg, var(--primary500), var(--primary100));
  border-color: transparent;

  padding: 12px 16px;

  font-family: Kumbh Sans;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.5px;
  line-height: 1.5;
  text-decoration: none;
  text-transform: uppercase;
  white-space: normal;

  background-color: transparent;
  color: var(--btn-text-color);

  width: fit-content;
  display: inline-block;

  transition: all 0.5s ease-in;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px,
    rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
  
  text-align: center;
}

.button_primary:hover,
form input[type=submit]:hover,
form .hs-button:hover,
.hs-search-results__next-page:hover,
.hs-search-results__prev-page:hover {
  border-image-source: linear-gradient(90deg, var(--primary100), var(--primary500));
}

.button_primary:focus,
.button_primary:active,
form input[type=submit]: focus,
form .hs-button:focus,
form input[type=submit]: active,
form .hs-button:active,
.hs-search-results__next-page:focus,
.hs-search-results__prev-page:focus {
  border-image-source: linear-gradient(90deg, var(--primary100), var(--primary500));
  outline: none;
}

.button_primary:disabled,
.button_primary.button_disabled,
form input[type=submit]: disabled,
form .hs-button:disabled {
  border-image-source: linear-gradient(90deg, var(--gray), var(--spanish-gray));
  background-color: var(--beige-gray);
  cursor: default;
  color: var(--spanish-gray);
  opacity: 0.6;
}

.button_secondary {
  background-color: var(--root-custom-button-secondary-bg);
  color: var(--root-custom-button-secondary-text-color);
  
  font-size: 14px;
  font-family: Kumbh Sans;  
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  white-space: normal; 
  
  padding: var(--root-custom-button-secondary-py) var(--root-custom-button-secondary-px);
  
  letter-spacing: var(--root-custom-button-secondary-letter-spacing);
  transition: background-color 0.3s;
  
  
}

.button_secondary:focus-visible,
.button_secondary:focus,
.button_secondary:hover {
  --root-custom-button-secondary-bg: var(--root-custom-button-secondary-bg_hover);
}

.button_secondary:active {
  --root-custom-button-secondary-text-color: var(--root-custom-button-secondary-text-color_active);
}