/* AFUS Social Login — self-contained UI that follows the AFUS login visual language. */
.afus-social-login{
  width:100%;
  max-width:300px;
  margin:20px auto 0;
  box-sizing:border-box
}
.afus-social-divider{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  margin:16px 0;
  color:#8a96a6;
  font-size:12px;
  font-weight:700;
  text-align:center
}
.afus-social-divider:before,
.afus-social-divider:after{
  content:"";
  height:1px;
  background:#e7e7e9;
  flex:1
}
.afus-social-divider span{white-space:nowrap}
.afus-social-buttons{display:flex;flex-direction:column;gap:10px;width:100%}
.afus-social-btn,
.afus-social-preview-google{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:50px;
  padding:0 42px;
  border:1px solid transparent;
  border-radius:14px;
  box-sizing:border-box;
  font-size:14px;
  font-weight:700;
  line-height:1.25;
  text-align:center;
  text-decoration:none!important;
  box-shadow:0 1px 1px rgba(0,0,0,.18);
  transition:opacity .18s ease,transform .18s ease,box-shadow .18s ease
}
.afus-social-btn:hover{
  opacity:.9;
  transform:translateY(-1px);
  box-shadow:0 5px 14px rgba(0,0,0,.12)
}
.afus-social-icon{
  position:absolute;
  inset-inline-start:15px;
  top:50%;
  display:flex;
  width:22px;
  height:22px;
  align-items:center;
  justify-content:center;
  transform:translateY(-50%)
}
.afus-social-icon svg{display:block;width:22px;height:22px}
.afus-social-facebook{background:#3b5998;color:#fff!important;border-color:#3b5998}
.afus-social-apple{background:#1d1d1f;color:#fff!important;border-color:#1d1d1f}
.afus-social-microsoft{background:#fff;color:#1d1d1f!important;border-color:#e7e7e9}

.afus-social-disabled{
  cursor:not-allowed;
  opacity:.68;
  pointer-events:none;
  filter:saturate(.72)
}
.afus-social-login[data-preview="1"] .afus-social-disabled{box-shadow:none}
.afus-social-google-button{
  display:flex;
  justify-content:center;
  width:100%;
  min-height:44px;
  overflow:hidden;
  border-radius:14px
}

/* Header login modal integration. The theme remains untouched. */
#loginmodal .afus-modal-form .afus-social-login{width:100%;max-width:300px;margin:18px auto 0}
#loginmodal .afus-modal-form .afus-social-buttons{width:100%}
#loginmodal .afus-modal-form .afus-social-btn{width:100%;max-width:300px}
#loginmodal .afus-modal-form .afus-social-google-button{width:100%;max-width:300px}

/* Social-only mode. It is enabled only when at least one provider is actually configured. */
.afus-social-only-modal #loginmodal .afus-modal-form>form,
.afus-social-only-modal #loginmodal .afus-modal-footer{display:none!important}
.afus-social-only-modal #loginmodal .afus-modal-form{padding-top:8px}
.afus-social-only-modal #loginmodal .afus-social-login{margin-top:0}
.afus-social-only-login.afus-template-login .afus-part-form{display:none!important}
.afus-social-only-register.afus-template-register .afus-part-form{display:none!important}

/* Admin preview — deliberately mirrors AFUS's current login modal. */
.afus-social-admin-note{
  padding:14px 16px;
  border:1px solid #dce6f2;
  border-radius:12px;
  background:#f7fbff;
  line-height:1.7
}
.afus-social-preview-wrap{margin:10px 0 2px}
.afus-social-preview-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.afus-social-preview-toggle{
  appearance:none;
  border:0;
  border-radius:12px;
  background:#17342f;
  color:#fff;
  min-height:40px;
  padding:0 16px;
  font:inherit;
  font-weight:800;
  cursor:pointer
}
.afus-social-preview-toggle:hover{opacity:.9}
.afus-social-preview-note{color:#71817d;font-size:12px}
.afus-social-preview-stage{display:none;padding:18px;border:1px solid #e6eee9;border-radius:18px;background:#f7faf8}
.afus-social-preview-stage.is-open{display:block}
.afus-social-preview-card{
  width:min(100%,440px);
  margin:0 auto;
  padding:25px 0 20px;
  overflow:hidden;
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 15px rgba(0,0,0,.14)
}
.afus-social-preview-title{margin:0 0 8px;text-align:center;color:#233044;font-size:18px;font-weight:800}
.afus-social-preview-form{width:min(100% - 36px,300px);margin:0 auto}
.afus-social-preview-native{display:block}
.afus-social-preview-input{
  height:34px;
  margin:5px 0 10px;
  padding:4px 8px;
  border:2px solid #e7e7e9;
  border-radius:14px;
  background:#fff;
  color:#8894a3;
  box-sizing:border-box;
  font-size:13px;
  font-weight:700;
  line-height:24px
}
.afus-social-preview-submit{
  height:50px;
  margin-top:10px;
  border-radius:14px;
  background:#f70047;
  color:#fff;
  font-size:13px;
  font-weight:800;
  line-height:50px;
  text-align:center
}
.afus-social-preview-stage[data-mode="social_only"] .afus-social-preview-native,
.afus-social-preview-stage[data-mode="social_only"] .afus-social-divider{display:none}
.afus-social-preview-stage .afus-social-login{margin-top:12px}
.afus-social-preview-provider{pointer-events:none;user-select:none}
.afus-social-preview-google{
  background:#fff;
  color:#1d1d1f!important;
  border-color:#dadce0
}
.afus-social-preview-google .afus-social-icon{width:20px;height:20px}
.afus-social-preview-google .afus-social-icon svg{width:20px;height:20px}

@media(max-width:600px){
  .afus-social-login{max-width:100%;margin-top:16px}
  .afus-social-btn,.afus-social-preview-google{min-height:50px}
  .afus-social-preview-stage{padding:12px}
  .afus-social-preview-card{width:100%}
}
