/* ===== BOTÓN JARVIS para el custom_button ===== */
button[data-itemid="custom_button"],
a[data-itemid="custom_button"],
span[data-itemid="custom_button"] > a {
  position: relative !important;
  background: #1e293b !important;
  color: #ffffff !important;
  border: 2px solid #f97316 !important;
  padding: 10px 18px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  border-radius: 8px !important;
  transition: all 0.35s ease !important;
  overflow: hidden !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Barrido de energía */
button[data-itemid="custom_button"]::before,
a[data-itemid="custom_button"]::before,
span[data-itemid="custom_button"] > a::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(249,115,22,0.45) 50%,
    transparent 100%
  ) !important;
  transform: translateX(-120%) !important;
  transition: transform 0.6s ease !important;
}

/* Hover */
button[data-itemid="custom_button"]:hover,
a[data-itemid="custom_button"]:hover,
span[data-itemid="custom_button"] > a:hover {
  background: #0f172a !important;
  box-shadow:
    0 0 10px rgba(249,115,22,0.45),
    0 0 22px rgba(249,115,22,0.25) !important;
  transform: translateY(-2px) !important;
}

/* Animación del barrido */
button[data-itemid="custom_button"]:hover::before,
a[data-itemid="custom_button"]:hover::before,
span[data-itemid="custom_button"] > a:hover::before {
  transform: translateX(120%) !important;
}

/* Click */
button[data-itemid="custom_button"]:active,
a[data-itemid="custom_button"]:active,
span[data-itemid="custom_button"] > a:active {
  transform: translateY(0) !important;
  box-shadow: 0 0 8px rgba(249,115,22,0.35) !important;
}

/* ===== BOTÓN JARVIS para login_button ===== */

button[data-itemid="login_button"],
a[data-itemid="login_button"],
span[data-itemid="login_button"] > a {
  position: relative !important;
  background: #f97316 !important; /* naranja principal */
  color: #ffffff !important;
  border: 2px solid #f97316 !important;
  padding: 10px 18px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  border-radius: 8px !important;
  transition: all 0.35s ease !important;
  overflow: hidden !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Barrido de energía */
button[data-itemid="login_button"]::before,
a[data-itemid="login_button"]::before,
span[data-itemid="login_button"] > a::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(255,255,255,0.45) 50%,
    transparent 100%
  ) !important;
  transform: translateX(-120%) !important;
  transition: transform 0.6s ease !important;
}

/* Hover */
button[data-itemid="login_button"]:hover,
a[data-itemid="login_button"]:hover,
span[data-itemid="login_button"] > a:hover {
  background: #ea580c !important;
  box-shadow:
    0 0 10px rgba(249,115,22,0.45),
    0 0 22px rgba(249,115,22,0.25) !important;
  transform: translateY(-2px) !important;
}

/* Animación del barrido */
button[data-itemid="login_button"]:hover::before,
a[data-itemid="login_button"]:hover::before,
span[data-itemid="login_button"] > a:hover::before {
  transform: translateX(120%) !important;
}

/* Click */
button[data-itemid="login_button"]:active,
a[data-itemid="login_button"]:active,
span[data-itemid="login_button"] > a:active {
  transform: translateY(0) !important;
  box-shadow: 0 0 8px rgba(249,115,22,0.35) !important;
}