/* =========================================================
   GLOBAL: Add border + shadow WITHOUT changing colors
   (prevents white text from disappearing)
   ========================================================= */

/* Real buttons / inputs */
button,
input[type="submit"],
input[type="button"],
input[type="reset"]{
  border: 2px solid rgba(0,0,0,0.25) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.22) !important;
  border-radius: 10px !important;
  padding: 10px 18px !important;
  font-weight: 700 !important;
}

/* WA buttons that are links (keep existing background + text colors) */
.WaGadgetButton a,
a.button,
a.btn,
a[class*="button"],
a[class*="btn"],
a[role="button"]{
  border: 2px solid rgba(0,0,0,0.25) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.22) !important;
  border-radius: 10px !important;
  padding: 10px 18px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  display: inline-block !important;
}

/* Hover feels clickable (no color changes) */
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
.WaGadgetButton a:hover,
a.button:hover,
a.btn:hover,
a[class*="button"]:hover,
a[class*="btn"]:hover,
a[role="button"]:hover{
  box-shadow: 0 4px 16px rgba(0,0,0,0.30) !important;
  transform: translateY(-1px);
}