/**
 * Commazaar button styles: Commazaar UI kit 3D press effect
 */

.btn,
.btn-press,
.marketing-cta-primary,
.marketing-cta-secondary,
a.marketing-cta-primary,
a.marketing-cta-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.08s ease, border-bottom-width 0.08s ease, background-color 0.15s ease, filter 0.15s ease;
}

/* Green primary */
.btn-secondary,
.btn-press-green {
  background: #58cc02;
  color: #fff;
  font-weight: 800;
  border: 2px solid #58a700;
  border-bottom-width: 4px;
  border-radius: 0.75rem;
}
.btn-secondary:hover,
.btn-press-green:hover { filter: brightness(1.05); }
.btn-secondary:active,
.btn-press-green:active {
  transform: translateY(2px);
  border-bottom-width: 2px;
}

/* Blue primary */
.btn-primary,
.btn-press-blue {
  background: #235390;
  color: #fff;
  font-weight: 800;
  border: 2px solid #0a4a82;
  border-bottom-width: 4px;
  border-radius: 0.75rem;
}
.btn-primary:hover,
.btn-press-blue:hover { filter: brightness(1.08); }
.btn-primary:active,
.btn-press-blue:active {
  transform: translateY(2px);
  border-bottom-width: 2px;
}

/* White outline */
.btn-press-outline {
  background: #fff;
  color: #235390;
  font-weight: 800;
  border: 2px solid #e2e8f0;
  border-bottom-width: 4px;
  border-radius: 0.75rem;
}
.btn-press-outline:active {
  transform: translateY(2px);
  border-bottom-width: 2px;
}

/* Catch-all: any element with Tailwind border-b-4 used as button */
button.border-b-4:active,
a.border-b-4:active,
[type="submit"].border-b-4:active {
  transform: translateY(2px) !important;
  border-bottom-width: 2px !important;
}

/* Marketing CTAs */
.marketing-cta-primary {
  background: #58cc02;
  color: #fff;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border: 2px solid #58a700;
  border-bottom-width: 4px;
  border-radius: 0.75rem;
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
}
.marketing-cta-primary:hover { background: #61e002; }
.marketing-cta-primary:active {
  transform: translateY(2px);
  border-bottom-width: 2px;
}

.marketing-cta-secondary {
  background: #235390;
  color: #fff;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border: 2px solid #042c60;
  border-bottom-width: 4px;
  border-radius: 0.75rem;
  padding: 0.5rem 1rem;
  font-size: 0.75rem;
}
.marketing-cta-secondary:hover { background: #1a4a7a; }
.marketing-cta-secondary:active {
  transform: translateY(2px);
  border-bottom-width: 2px;
}

/* Demo login cards */
.demo-login-card:active {
  transform: translateY(2px);
  border-bottom-width: 2px;
}