/*!***********************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[3]!./blocks/src/common/custom-button/style.scss ***!
  \***********************************************************************************************************************************************************************************************************/
.custom-button {
  color: var(--default-button-primary-color);
  background-color: var(--default-button-primary-bg);
  border-color: transparent;
}
.custom-button.forced {
  color: var(--default-button-primary-color) !important;
  background-color: var(--default-button-primary-bg) !important;
  border-color: transparent !important;
}
.custom-button {
  padding: var(--default-button-padding-md) !important;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--default-button-gap);
  min-height: var(--default-button-height-md);
  border: 1px solid;
  text-decoration: none;
  font-family: var(--default-button-font-family);
  font-size: var(--default-button-font-size);
  font-weight: var(--default-button-font-weight);
  line-height: var(--default-button-line-height);
  border-radius: var(--default-button-radius-md) !important;
  width: auto;
  cursor: pointer;
  transition: background-color var(--quazaar-transition-base), color var(--quazaar-transition-base), border-color var(--quazaar-transition-base), box-shadow var(--quazaar-transition-base);
  text-align: center;
  white-space: nowrap;
}
.custom-button.align-center {
  margin: 0 auto;
}
.custom-button.align-right {
  margin: 0 0 0 auto;
}
.custom-button:hover {
  color: var(--default-button-primary-bg);
  background-color: var(--default-button-white-background);
  border-color: var(--default-button-primary-bg);
}
.custom-button:hover.forced {
  color: var(--default-button-primary-bg) !important;
  background-color: var(--default-button-white-background) !important;
  border-color: var(--default-button-primary-bg) !important;
}
.custom-button:hover {
  text-decoration: none;
}
.custom-button.disabled {
  cursor: default;
}
.custom-button.slim {
  min-height: var(--default-button-height-sl);
  padding: var(--default-button-padding-sl) !important;
  border-radius: var(--default-button-radius-sm) !important;
}
.custom-button.large {
  min-height: var(--default-button-height-lg);
  padding: var(--default-button-padding-lg) !important;
  border-radius: var(--default-button-radius-lg) !important;
}
.custom-button.small {
  min-height: var(--default-button-height-sm);
  padding: var(--default-button-padding-sm) !important;
  border-radius: var(--default-button-radius-sm) !important;
}
.custom-button.transparent {
  color: var(--default-button-transparent-color);
  background-color: var(--default-button-transparent-background);
  border-color: var(--default-button-transparent-border-color);
}
.custom-button.transparent.forced {
  color: var(--default-button-transparent-color) !important;
  background-color: var(--default-button-transparent-background) !important;
  border-color: var(--default-button-transparent-border-color) !important;
}
.custom-button.transparent:hover {
  color: var(--default-button-primary-bg);
  background-color: var(--default-button-white-background);
  border-color: var(--default-button-primary-bg);
}
.custom-button.transparent:hover.forced {
  color: var(--default-button-primary-bg) !important;
  background-color: var(--default-button-white-background) !important;
  border-color: var(--default-button-primary-bg) !important;
}
.custom-button.white {
  border: 1px solid transparent;
  color: var(--default-button-primary-bg);
}
.custom-button.white:hover {
  background-color: var(--default-button-primary-bg);
  border: 1px solid var(--default-button-text-inverse);
  color: var(--default-button-text-inverse);
}
.custom-button.light-blue {
  background-color: var(--theme-light-blue);
  border: 1px solid transparent;
  color: var(--theme-blue);
}
.custom-button.light-blue:hover {
  box-shadow: inset 100px 100px rgba(0, 0, 0, 0.1);
  border-color: transparent;
  background-color: var(--default-button-primary-bg);
  border: 1px solid var(--default-button-text-inverse);
  color: var(--theme-light-blue);
}
.custom-button.white-transparent {
  background-color: transparent;
  border: 1px solid transparent;
  color: var(--theme-white);
}
.custom-button.white-transparent:hover {
  border: 1px solid var(--default-button-primary-bg);
  background: var(--default-button-primary-bg);
}
.custom-button.secondary {
  background-color: var(--theme-secondary-color);
  border: 1px solid var(--theme-secondary-color);
  color: var(--theme-white);
}
.custom-button.secondary:hover {
  color: var(--theme-secondary-color);
  background: var(--theme-white);
}
.custom-button.third {
  background-color: var(--theme-third-color);
  border: 1px solid var(--theme-third-color);
  color: var(--theme-white);
}
.custom-button.third:hover {
  color: var(--theme-third-color);
  background: var(--theme-white);
}
.custom-button.fourth {
  background-color: var(--theme-fourth-color);
  border: 1px solid var(--theme-fourth-color);
  color: var(--theme-white);
}
.custom-button.fourth:hover {
  color: var(--theme-fourth-color);
  background: var(--theme-white);
}
.custom-button.light-grey {
  color: var(--theme-black-color);
  background-color: var(--theme-light-grey-color);
  border-color: transparent;
}
.custom-button.light-grey.forced {
  color: var(--theme-black-color) !important;
  background-color: var(--theme-light-grey-color) !important;
  border-color: transparent !important;
}
.custom-button.light-grey:hover {
  color: var(--theme-light-grey-color);
  background-color: var(--default-button-white-background);
  border-color: var(--theme-light-grey-color);
}
.custom-button.light-grey:hover.forced {
  color: var(--theme-light-grey-color) !important;
  background-color: var(--default-button-white-background) !important;
  border-color: var(--theme-light-grey-color) !important;
}
.custom-button.grey {
  color: var(--theme-white-color);
  background-color: var(--theme-grey-color);
  border-color: transparent;
}
.custom-button.grey.forced {
  color: var(--theme-white-color) !important;
  background-color: var(--theme-grey-color) !important;
  border-color: transparent !important;
}
.custom-button.grey:hover {
  color: var(--theme-grey-color);
  background-color: var(--default-button-white-background);
  border-color: var(--theme-grey-color);
}
.custom-button.grey:hover.forced {
  color: var(--theme-grey-color) !important;
  background-color: var(--default-button-white-background) !important;
  border-color: var(--theme-grey-color) !important;
}
.custom-button.dark-grey {
  color: var(--theme-white-color);
  background-color: var(--theme-dark-grey-color);
  border-color: transparent;
}
.custom-button.dark-grey.forced {
  color: var(--theme-white-color) !important;
  background-color: var(--theme-dark-grey-color) !important;
  border-color: transparent !important;
}
.custom-button.dark-grey:hover {
  color: var(--theme-dark-grey-color);
  background-color: var(--default-button-white-background);
  border-color: var(--theme-dark-grey-color);
}
.custom-button.dark-grey:hover.forced {
  color: var(--theme-dark-grey-color) !important;
  background-color: var(--default-button-white-background) !important;
  border-color: var(--theme-dark-grey-color) !important;
}