/* Button.css — component helpers only
   btn-12 canonical definition lives in globals.css; keep only component helpers here.
*/

/* Uiverse.io animated underline effect */
.btn-underline {
  position: relative;
  color: white;
  background: none;
  border: none;
  font-size: 25px;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  text-decoration: none;
  overflow: hidden;
}

.btn-underline::before,
.btn-underline::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: #f44336;
  width: 0%;
  transition: width 0.5s;
}

.btn-underline::before {
  top: 0;
}

.btn-underline::after {
  bottom: 0;
}

.btn-underline:hover::before,
.btn-underline:hover::after {
  width: 100%;
}

/* Preserve your old helpers */
.button-reset { -webkit-tap-highlight-color: transparent; border: 0; background: transparent; padding: 0; margin: 0; font: inherit; }

.btn-variant-primary { background: var(--accent-blue); color: #fff; border-radius: 0.5rem; font-weight:700; }
.btn-variant-secondary { background: #fff; color: var(--primary); border:1px solid var(--primary); }

.btn-glow { transition: box-shadow .18s ease, transform .18s ease; }