/* templates/blocks/button/style.css — v3.1.0 */

.pf-btn-wrapper {
  display: var(--wrap-d, flex) !important;
  width: var(--wrap-w, 100%) !important;
  box-sizing: border-box !important;
  justify-content: var(--btn-jc, flex-start) !important;
  margin: var(--btn-mt, 0) var(--btn-mr, 0) var(--btn-mb, 0) var(--btn-ml, 0);
  vertical-align: middle;
}

.pf-btn {
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box;
  justify-content: var(--btn-jc-inner, center) !important;
  text-align: var(--btn-ta, center) !important;
  
  width: var(--btn-w, auto) !important;
  min-width: var(--btn-minw, 0px);
  padding: var(--btn-py, 10px) var(--btn-px, 16px);
  
  color: var(--btn-c, #ffffff);
  background: var(--btn-bg, #d32f2f);
  border: var(--btn-bw, 1px) solid var(--btn-bc, transparent);
  border-radius: var(--btn-rad, 8px);
  box-shadow: var(--btn-shadow, none);
  
  font-size: var(--btn-fs, inherit);
  font-weight: var(--btn-fw, 600);
  font-style: var(--btn-fst, normal);
  line-height: var(--btn-lh, inherit);
  letter-spacing: var(--btn-ls, normal);
  text-transform: var(--btn-tt, none);
  
  text-decoration: none !important;
  cursor: pointer;
  transition: all 0.25s ease;
}

.pf-btn:hover {
  color: var(--btn-hc, var(--btn-c, #ffffff)) !important;
  background: var(--btn-hbg, var(--btn-bg, #d32f2f)) !important;
  border-color: var(--btn-hbc, var(--btn-bc, transparent)) !important;
}

/* ---------- Icon (font) + SVG fallback ---------- */
.pf-btn .pfb-icon,
.pf-btn .pfb-icon-svg {
  color: var(--i-color, currentColor);
  font-size: var(--i-size, 18px);
  width: var(--i-size, 18px);
  height: var(--i-size, 18px);
  line-height: 1;
  transform: translateY(var(--i-dy, 0px));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: color 0.25s ease;
}

.pf-btn:hover .pfb-icon,
.pf-btn:hover .pfb-icon-svg {
  color: var(--i-hcolor, var(--i-color, currentColor)) !important;
}

.pf-btn .pfb-text + .pfb-icon,
.pf-btn .pfb-text + .pfb-icon-svg { margin-left: var(--i-gap, 8px); }

.pf-btn .pfb-icon + .pfb-text,
.pf-btn .pfb-icon-svg + .pfb-text { margin-left: var(--i-gap, 8px); }