/* ===== SocialLoginButton Sub-Component =====
 * PRODUCT register — neutral surface, restrained. No brass (not a primary action).
 * ≥44px tap target via min-height. Brass focus ring for keyboard accessibility.
 */

.cc_4vBO1nbhag_login .kombos-social-login-btn, .cc_4vBO1nbhag_register .kombos-social-login-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  width: 100%;
  padding: 0.6875rem 1.25rem;
  min-height: 2.75rem; /* 44px tap target */
  border: 1px solid var(--kombos-rule);
  border-radius: var(--kombos-radius);
  background: var(--kombos-white);
  color: var(--kombos-gray-700);
  cursor: pointer;
  font-family: var(--kombos-font-ui);
  font-size: 1rem;
  letter-spacing: var(--kombos-tracking-caps);
  transition:
    border-color var(--kombos-duration-fast) var(--kombos-ease),
    background-color var(--kombos-duration-fast) var(--kombos-ease);
}

.cc_4vBO1nbhag_login .kombos-social-login-btn:hover, .cc_4vBO1nbhag_register .kombos-social-login-btn:hover {
  border-color: var(--kombos-gray-400);
  background: var(--kombos-gray-50);
}

.cc_4vBO1nbhag_login .kombos-social-login-btn:focus-visible, .cc_4vBO1nbhag_register .kombos-social-login-btn:focus-visible {
  outline: 2px solid var(--kombos-accent);
  outline-offset: 2px;
}