/* "or continue with Google / Apple" (lib/social_login.php buttons) - used on get-started and the seller login page */
.social-login {
  margin: 18px 0 6px;
  font-family: Poppins, sans-serif;
}

.social-login__divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  color: #64748b;
  font-size: 0.85rem;
}

.social-login__divider::before,
.social-login__divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #e2e8f0;
}

.social-login__buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.social-login__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  color: #0f172a;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s, transform 0.15s;
}

.social-login__btn:hover {
  background: #f8fafc;
  transform: translateY(-1px);
}

.social-login__btn img {
  width: 20px;
  height: 20px;
  display: block;
}

/* only one provider switched on: full width */
.social-login__buttons:has(> :only-child) {
  grid-template-columns: 1fr;
}

@media (max-width: 380px) {
  .social-login__buttons {
    grid-template-columns: 1fr;
  }
}