/* BirchStreet AI button theme (matches birchstreetai.com Elementor kit) */

:root {
  --bss-btn-accent-bg: #88C2C0;
  --bss-btn-accent-text: #1A202C;
  --bss-btn-accent-border: #88C2C0;
  --bss-btn-hover-bg: #ECDDA0;
  --bss-btn-hover-text: #1A202C;
  --bss-btn-hover-border: #ECDDA0;
  --bss-btn-gold-bg: #B7904A;
  --bss-btn-gold-text: #1A202C;
  --bss-btn-gold-border: #B7904A;
  --bss-btn-taupe-bg: #7D6F69;
  --bss-btn-taupe-text: #FFFFFF;
  --bss-btn-white-bg: #FFFFFF;
  --bss-btn-white-text: #1A202C;
  --bss-btn-white-border: #FFFFFF;
  --bss-btn-radius: 4px;
}

/* Primary / accent buttons (Elementor default) */
.btnmain,
.btn-sub,
.btn-cta,
.btn-action,
.btn-send,
.btn-primary,
.btn-success,
.btn.btn-primary,
.jumbotron .btn-primary,
input.button,
a.button,
.cta-contact button,
.cta-contact #subscribeForm-btn,
.cta-contact button[type="submit"],
.subscribe-form .submit-button,
#trainingForm .action-button,
#trainingForm input.action-button,
#trainingForm button.action-button,
form.serviceForm button[type="submit"],
form.serviceForm input[type="submit"],
.atlas-cta.cta-blue,
.atlas-cta.cta-green {
  background-color: var(--bss-btn-accent-bg) !important;
  border: 1px solid var(--bss-btn-accent-border) !important;
  border-radius: var(--bss-btn-radius) !important;
  box-shadow: none !important;
  color: var(--bss-btn-accent-text) !important;
  cursor: pointer;
  display: inline-block;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.4px;
  line-height: 1.29;
  outline: none;
  padding: 10px 16px;
  text-decoration: none;
  text-transform: none;
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
  vertical-align: middle;
}

.btnmain,
.btn-sub,
.btn-cta {
  padding: 10px 20px;
}

.btnmain:hover,
.btnmain:focus,
.btnmain:active,
.btn-sub:hover,
.btn-sub:focus,
.btn-sub:active,
.btn-cta:hover,
.btn-cta:focus,
.btn-cta:active,
.btn-action:hover,
.btn-action:focus,
.btn-action:active,
.btn-send:hover,
.btn-send:focus,
.btn-primary:hover,
.btn-primary:focus,
.btn-success:hover,
.btn-success:focus,
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.jumbotron .btn-primary:hover,
.jumbotron .btn-primary:focus,
input.button:hover,
input.button:focus,
a.button:hover,
a.button:focus,
.cta-contact button:hover,
.cta-contact button:focus,
.cta-contact #subscribeForm-btn:hover,
.cta-contact #subscribeForm-btn:focus,
.subscribe-form .submit-button:hover,
.subscribe-form .submit-button:focus,
#trainingForm .action-button:hover,
#trainingForm .action-button:focus,
form.serviceForm button[type="submit"]:hover,
form.serviceForm input[type="submit"]:hover,
.atlas-cta.cta-blue:hover,
.atlas-cta.cta-green:hover {
  background-color: var(--bss-btn-hover-bg) !important;
  border-color: var(--bss-btn-hover-border) !important;
  box-shadow: none !important;
  color: var(--bss-btn-hover-text) !important;
  outline: none;
  text-decoration: none;
  transform: none;
}

/* Outline / ghost buttons */
.btn-fill,
.atlas-cta.cta-ghost,
.btn-outline-secondary {
  background-color: var(--bss-btn-white-bg) !important;
  border: 1px solid var(--bss-btn-taupe-bg) !important;
  border-radius: var(--bss-btn-radius) !important;
  color: var(--bss-btn-taupe-bg) !important;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.4px;
  line-height: 1.29;
  padding: 10px 16px;
}

.btn-fill:hover,
.btn-fill:focus,
.atlas-cta.cta-ghost:hover,
.atlas-cta.cta-ghost:focus,
.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
  background-color: var(--bss-btn-hover-bg) !important;
  border-color: var(--bss-btn-hover-border) !important;
  color: var(--bss-btn-hover-text) !important;
}

/* Secondary / muted actions */
#trainingForm .action-button-previous,
.btn-secondary,
.btn-default {
  background-color: var(--bss-btn-taupe-bg) !important;
  border: 1px solid var(--bss-btn-taupe-bg) !important;
  border-radius: var(--bss-btn-radius) !important;
  color: var(--bss-btn-taupe-text) !important;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  padding: 10px 16px;
}

#trainingForm .action-button-previous:hover,
#trainingForm .action-button-previous:focus,
.btn-secondary:hover,
.btn-secondary:focus,
.btn-default:hover,
.btn-default:focus {
  background-color: #5f534e !important;
  border-color: #5f534e !important;
  color: #FFFFFF !important;
}

/* Training wizard progress */
#progressbar li.active:before,
#progressbar li.active:after,
.progress-bar {
  background: var(--bss-btn-accent-bg) !important;
}

#progressbar li:before {
  color: var(--bss-btn-accent-text);
}

/* Modal buttons */
.modal-content .modal-body .btn {
  background-color: var(--bss-btn-accent-bg) !important;
  border: 1px solid var(--bss-btn-accent-border) !important;
  border-radius: var(--bss-btn-radius) !important;
  color: var(--bss-btn-accent-text) !important;
}

.modal-content .modal-body .btn:hover,
.modal-content .modal-body .btn:focus {
  background-color: var(--bss-btn-hover-bg) !important;
  border-color: var(--bss-btn-hover-border) !important;
  color: var(--bss-btn-hover-text) !important;
}

/* Contact form submit */
.cta-contact button,
.cta-contact #subscribeForm-btn,
.cta-contact button[type="submit"],
form.serviceForm button[type="submit"],
#otpForm button[type="submit"],
#otpFormRec button[type="submit"] {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 24px auto 0 !important;
  min-width: 65%;
  max-width: 100%;
  text-align: center !important;
  width: auto !important;
}

@media (max-width: 767px) {
  .btnmain,
  .btn-sub,
  .btn-cta,
  .btn-action,
  .cta-contact button,
  .btn.btn-primary {
    font-size: 16px;
    padding: 8px 16px;
  }
}
