/* Unified button sizing across all button variants.
   Goal: Make all buttons visually equal in height and horizontal padding without changing borders or gradients.
   No new borders are added; existing border styles remain untouched.
*/

:where(a.button-frame, button.button-frame,
       a.button, button.button,
       a.sc-cta, button.sc-cta,
       .btn-gradient){
  padding: 14px 27px !important; /* reduced by ~20% from 18px 34px */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important; /* space between label and icon */
  line-height: 1.2 !important;
  min-height: 45px !important; /* reduced by ~20% from 56px */
  box-sizing: border-box !important;
}

/* Preserve original gradient look; do not override colors or border-radius here */
.sc-cta, .btn-gradient { /* intentional no-op to avoid design changes */ }

/* Icon sizing consistency */
:where(.button-frame .icon img, .button .icon img, .sc-cta .icon img, .btn-gradient .icon img){
  width: 20px;
  height: 20px;
  object-fit: contain;
  flex: 0 0 auto;
}

/* Ensure spans inside buttons don't collapse */
:where(.button-frame span, .button span, .sc-cta span, .btn-gradient span){
  display: inline-flex;
  align-items: center;
}

/* UNIFORM FRAME BORDER WIDTH OVERRIDE
   Replace previous variable widths (2.1px / 2.8px) with a single consistent stroke.
   This override intentionally uses :where() for low specificity + !important to out-rank legacy rules.
   If you need a different global width later, change the 3px below only. */
:where(a.button-frame, button.button-frame)::before{ border-width: 3px !important; }
@media (min-width:1600px){ :where(a.button-frame, button.button-frame)::before{ border-width: 3px !important; } }
