/* ==== Custom Button styling ==== */

:root{
    /* background: var(--global-palette-btn-bg);
    color: var(--global-palette-btn); */
  --btn-primary:var(--global-palette-btn-bg);
  /* --btn-primary:red; */
  --btn-secondary:var(--global-palette-btn-sec-bg);
  --btn-outline:var(--global-palette-btn-out);
  --btn-bluetext:var(--global-palette-btn);
  --btn-blacktext:var(--btntext);
  --r-lg: 16px;
  --r-md:10px;
  --white:#fff;
  --ease-out:cubic-bezier(.16,1,.3,1);
}


/* ===== buttons ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:var(--pl-btn-h);padding:0 var(--pl-btn-px);border-radius:999px;
  font-size:var(--pl-btn-fs);font-weight:600;line-height:1.2;letter-spacing:0;
  transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),background .2s;
  will-change:transform;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-solid{background:var(--btn-primary);color:var(--btn-bluetext) }
.btn-solid:hover{color:var(--btn-bluetext)}
.faq-cta.panel-dark .btn.btn-accent {
    background:var(--white);
    color:var(--btn-bluetext)
}
.faq-cta.panel-dark .btn.btn-accent:hover {
    background:var(--btn-primary);
    color:var(--btn-bluetext)
}
.btn-accent{background:var(--btn-primary);color:var(--btn-bluetext) }
.btn-accent:hover{color:var(--btn-bluetext) }
.btn-ghost{border:1.5px solid var(--line);background:transparent;color:var(--pl-blue)}
.mhs-button-group .btn-ghost:hover, .btn-ghost:hover{ /* outline buttons: hover only darkens the border (2026-10-09) */
  background:transparent;
  border-color:var(--pl-line-strong);
  color:var(--btn-bluetext);
}
.btn-sm{min-height:var(--pl-btn-h-sm);padding:0 var(--pl-btn-px-sm);font-size:var(--pl-btn-fs-sm)}
.btn .arr{transition:transform .35s var(--ease-out)}
.btn:hover .arr{transform:translateX(3px)}
.btn-block{width:100%;justify-content:center}

.btn.btn-solid:hover{
    color:var(--btn-bluetext);
}
.cat .go ,
.cat .go:hover {
    background: var(--btn-primary);
    color: var(--btn-blacktext);
}
.hero-in .btn-accent {
    background: var(--btn-primary);
}

.hero-in .btn-accent, 
.hero-in .btn-accent:hover {
     color: var(--btn-bluetext);
}

.pill{
  border:1.5px solid var(--line);
  color:var(--btntext);
}
.pill.on {
  background:var(--btn-primary);
  color:var(--btn-bluetext);
  border-color:var(--btn-primary);
}
.filters .pill:focus:not(.on), .pill:hover:not(.on) { /* outline pills: hover only darkens the border */
  background:transparent;
  border-color:var(--pl-line-strong);
  color:var(--btn-bluetext);
}

.mhs-learn .cats-row {
    padding-top: 5px;
}

.wc-block-cart__submit-button:hover, 
.wc-block-cart__submit-container a:hover {
    color:var(--btn-bluetext);
}
body:not(.woocommerce-block-theme-has-button-styles) .wc-block-components-button:not(.is-link):focus {
    box-shadow: 0 0 0 2px var(--btn-bluetext);
    box-shadow: inset 0 0 0 1px var(--white), 0 0 0 2px var(--btn-bluetext);
    outline: 3px solid transparent;
}
.mp-add:hover {
    background: var(--btn-primary);
    color: var(--btn-bluetext);
}

/* ---- Moved from Additional CSS (Redline Round 1, 2026-09-30) ---- */
/* hard-coded greens */
html body .faq-cta.panel-dark .btn.btn-accent {
  color: var(--pl-blue);
}