/**
 * Google Auth CSS Styles
 * Part of the s8-custom-login-and-registration plugin
 * 
 * Only essential styles that can't be replaced with Tailwind classes
 */

/* Google Auth Divider */
.s8-google-auth-divider {
  display: flex;
  align-items: center;
  margin: 1.25rem 0;
  color: #6b7280;
  font-size: 0.875rem;
  font-weight: 500;
}

.s8-google-auth-divider::before,
.s8-google-auth-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #e5e7eb;
}

.s8-google-auth-divider::before {
  margin-right: 1rem;
}

.s8-google-auth-divider::after {
  margin-left: 1rem;
}

/* Loading Animation */
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.loading-spinner {
  animation: spin 1s linear infinite;
}

/* Button loading state */
.s8-google-auth-button.loading {
  position: relative;
  overflow: hidden;
}

.s8-google-auth-button.loading::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  animation: loading-shimmer 1.5s infinite;
}

@keyframes loading-shimmer {
  0% { left: -100%; }
  100% { left: 100%; }
}