/**
 * PSB Auth Button — Elementor-safe
 * Neutralizes Elementor on .psb-auth-btn, then reapplies Figma-exact styles.
 */

/* 1) Hard reset ONLY for our buttons to stop Elementor bleed */
.elementor a.psb-auth-btn,
.elementor button.psb-auth-btn,
a.psb-auth-btn,
button.psb-auth-btn {
  all: unset;                  /* wipe Elementor/button defaults */
  box-sizing: border-box;      /* restore layout sanity */
  display: inline-flex;        /* we’ll control layout explicitly */
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
}

/* 2) Base button styles – Figma exact, with anti-override guards */
.psb-auth-btn.psb-auth-btn {
  /* Layout */
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  vertical-align: middle;
  min-height: 44px; /* Accessibility minimum */

  /* Visuals */
  background: #2B3186 !important;
  border-radius: 7.04px !important;
  padding: 11.44px 36.08px !important;
  border: none !important;
  box-shadow: none !important;      /* kill Elementor shadows */
  text-shadow: none !important;

  /* Typography */
  font-family: 'Poppins', sans-serif !important;
  font-style: normal;
  font-weight: 600 !important;
  font-size: 14.08px !important;
  line-height: 21px !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  color: #FFFFFF !important;
  text-align: center !important;

  /* Behavior */
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

/* Text wrapper for better control */
.psb-auth-btn__text {
  display: inline-block;
  vertical-align: middle;
}

/* Hover */
.psb-auth-btn:hover {
  background: #1e2159 !important;
  color: #FFFFFF !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(43, 49, 134, 0.3) !important;
  text-decoration: none !important;
}

/* Active */
.psb-auth-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(43, 49, 134, 0.2) !important;
}

/* Focus states (accessibility) */
.psb-auth-btn:focus,
.psb-auth-btn:focus-visible {
  outline: 2px solid #2B3186 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px rgba(43, 49, 134, 0.1) !important;
}

/* Loading */
.psb-auth-btn.loading {
  opacity: .7;
  pointer-events: none;
  position: relative;
}
.psb-auth-btn.loading::after {
  content: '';
  position: absolute;
  width: 16px; height: 16px;
  top: 50%; left: 50%;
  margin: -8px 0 0 -8px;
  border: 2px solid #fff;
  border-radius: 50%;
  border-top-color: transparent;
  animation: psb-spin .8s linear infinite;
}

/* With icon */
.psb-auth-btn--with-icon { padding-left: 28px !important; }
.psb-auth-btn__icon { display: inline-flex; align-items: center; margin-right: 8px; }
.psb-auth-btn__icon svg { width: 16px; height: 16px; fill: currentColor; }

/* Outline variant */
.psb-auth-btn--outline {
  background: transparent !important;
  border: 2px solid #2B3186 !important;
  color: #2B3186 !important;
  box-shadow: none !important;
}
.psb-auth-btn--outline:hover {
  background: #2B3186 !important;
  color: #FFFFFF !important;
  border-color: #2B3186 !important;
}

/* Minimal variant */
.psb-auth-btn--minimal {
  background: transparent !important;
  color: #2B3186 !important;
  padding: 8px 16px !important;
  min-height: auto !important;
  box-shadow: none !important;
  transform: none !important;
}
.psb-auth-btn--minimal:hover {
  background: rgba(43, 49, 134, .1) !important;
  color: #2B3186 !important;
}

/* Elementor-specific kill switches (if used alongside .elementor-button) */
.elementor .elementor-button.psb-auth-btn {
  /* ensure Elementor’s .elementor-button doesn’t win */
  background: #2B3186 !important;
  border: none !important;
  border-radius: 7.04px !important;
  padding: 11.44px 36.08px !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

/* Optional placements */
.site-header .psb-auth-btn,
.header-menu .psb-auth-btn,
.main-navigation .psb-auth-btn { margin: 0 10px; vertical-align: middle; }
.widget .psb-auth-btn { display: inline-block; margin: 10px 0; }

/* Responsive */
@media (max-width: 768px) {
  .psb-auth-btn { font-size: 13px !important; padding: 10px 25px !important; min-height: 40px !important; }
}
@media (max-width: 480px) {
  .psb-auth-btn { font-size: 12px !important; padding: 8px 20px !important; border-radius: 5px !important; min-height: 36px !important; }
  .psb-auth-btn--mobile-full { display: block !important; width: 100% !important; text-align: center !important; }
}

/* Animations */
@keyframes psb-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}