.canario-form-btn-disabled {
 opacity: 0.3;
 filter: grayscale(65%);
 cursor: not-allowed;
}

/* ==== Botão com “borda IA” (aurora) – plug & play =========================
   Use: class="btn btn-aurora"
   Personalize via CSS vars:
   --aurora-ring: 2px;        espessura da borda
   --aurora-radius: 20px;     raio
   --aurora-grad: linear-gradient(90deg,#3b82f6,#8b5cf6,#ec4899,#f59e0b,#3b82f6);
   --aurora-bg: #000;         fundo normal
   --aurora-color: #fff;      cor do texto/ícone
=========================================================================== */
.btn-aurora {
 --aurora-ring: 2px;
 --aurora-radius: 10px;
 --aurora-grad: linear-gradient(90deg,#3b82f6,#8b5cf6,#ec4899,#f59e0b,#3b82f6);
 --aurora-bg: #000;
 --aurora-color: #fff;
 position: relative;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: .5rem;
 min-width: 160px;
 height: 50px;
 padding: 0 24px;
 border: none;
 border-radius: var(--aurora-radius);
 background: var(--aurora-bg);
 color: var(--aurora-color);
 font-weight: 600;
 text-decoration: none;
 z-index: 0;
 overflow: visible;
}

/* Borda animada “recortada” */
.btn-aurora::before {
 content: "";
 position: absolute;
 inset: calc(var(--aurora-ring) * -1);
 padding: var(--aurora-ring);
 border-radius: calc(var(--aurora-radius) + var(--aurora-ring));
 background: var(--aurora-grad);
 background-size: 300% 100%;
 z-index: -2;
 -webkit-mask: linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
 -webkit-mask-composite: xor;
 mask: linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
 mask-composite: exclude;
 animation: aurora-wave 4s linear infinite;
}

/* Glow de fundo no hover */
.btn-aurora::after {
 content: "";
 position: absolute;
 inset: 0;
 border-radius: var(--aurora-radius);
 background: var(--aurora-grad);
 background-size: 300% 100%;
 z-index: -1;
 opacity: 0;
 transition: opacity .25s ease, filter .25s ease;
 animation: aurora-wave 4s linear infinite;
}

.btn-aurora:hover {
 background: transparent;
 color: #fff;
 text-shadow: 0 0 6px rgba(255,255,255,.6);
 box-shadow: 0 0 14px rgba(236,72,153,.35),
    0 0 20px rgba(59,130,246,.25),
    0 0 26px rgba(251,191,36,.2);
}

.btn-aurora:hover::after {
 opacity: 1;
 filter: brightness(1.08) saturate(1.1);
}

/* Animação do gradiente */
@keyframes aurora-wave {
 0% {
  background-position: 0% 0;
 }

 100% {
  background-position: 300% 0;
 }
}

/* Variantes rápidas (opcional) */
.btn-aurora.is-light {
 --aurora-bg: #fff;
 --aurora-color: #111;
}

.btn-aurora.is-pill {
 --aurora-radius: 999px;
}

.btn-aurora.is-sm {
 height: 40px;
 padding: 0 16px;
}

.btn-aurora.is-lg {
 height: 56px;
 padding: 0 28px;
}

.btn-aurora.btn-canarin-online {
 background-color: #ffffff95;
 color: #111;
 height: 40px;
}

.btn-aurora.btn-canarin-online:hover {
 color: #fff;
} 
