/*
  Zohi Button Color Fix
  Target: Elementor/Bootstrap-like buttons such as:
  <a class="tg-btn btn btn-primary text-white">...</a>
*/

:root{
  --zohi-btn-bg: #fc656b;
  --zohi-btn-border: #fc656b;
  --zohi-btn-text: #ffffff;
}

/* Primary buttons */
.btn.btn-primary,
a.btn.btn-primary,
button.btn.btn-primary,
.tg-btn.btn.btn-primary,
.elementor a.btn.btn-primary,
.elementor a.tg-btn.btn.btn-primary{
  background-color: var(--zohi-btn-bg) !important;
  border-color: var(--zohi-btn-border) !important;
  color: var(--zohi-btn-text) !important;
}

/* If any inner elements were colored red, force to white */
.btn.btn-primary *,
.tg-btn.btn.btn-primary *,
.elementor a.btn.btn-primary *,
.elementor a.tg-btn.btn.btn-primary *{
  color: var(--zohi-btn-text) !important;
}

/* Hover / focus / active */
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:active,
.btn.btn-primary.active,
.tg-btn.btn.btn-primary:hover,
.tg-btn.btn.btn-primary:focus,
.tg-btn.btn.btn-primary:active{
  background-color: var(--zohi-btn-bg) !important;
  border-color: var(--zohi-btn-border) !important;
  color: var(--zohi-btn-text) !important;
  filter: brightness(0.95);
}

/* Bootstrap CSS variables (covers themes that use CSS vars) */
.btn.btn-primary{
  --bs-btn-bg: var(--zohi-btn-bg) !important;
  --bs-btn-border-color: var(--zohi-btn-border) !important;
  --bs-btn-color: var(--zohi-btn-text) !important;

  --bs-btn-hover-bg: var(--zohi-btn-bg) !important;
  --bs-btn-hover-border-color: var(--zohi-btn-border) !important;
  --bs-btn-hover-color: var(--zohi-btn-text) !important;

  --bs-btn-active-bg: var(--zohi-btn-bg) !important;
  --bs-btn-active-border-color: var(--zohi-btn-border) !important;
  --bs-btn-active-color: var(--zohi-btn-text) !important;
}

/* If your theme still has literal #12715B somewhere on these buttons, ensure it becomes pink */
.btn.btn-primary,
.tg-btn.btn.btn-primary{
  /* explicit fallback */
  background: var(--zohi-btn-bg) !important;
  border: 1px solid var(--zohi-btn-border) !important;
}