/* =========================================================
   SMB AUTH (Modals + Dropdown + wp-login neutral)
   ========================================================= */

:root{
  --smb-primary:#0073e6;
  --smb-primary-hover:#005fcc;
  --smb-bg:#f5f6fa;
  --smb-text:#111827;
  --smb-muted:#6b7280;
  --smb-border:#e5e7eb;
  --smb-shadow-sm:0 6px 14px rgba(0,0,0,.08);
  --smb-shadow-md:0 10px 22px rgba(0,0,0,.12);
}

/* Prevent scroll behind modal */
body.smb-modal-open{
  overflow:hidden;
}

/* ===== Auth buttons / dropdown ===== */
.smb-auth-buttons{
  display:flex;
  gap:1rem;
  align-items:center;
  flex-wrap:wrap;
}

.smb-account-menu{
  position:relative;
  display:inline-block;
	width: 100%;
}

.auth-button{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.75rem 1.25rem;
  border-radius:999px;
  border:none;
  text-decoration:none;
  cursor:pointer;
  font-weight:700;
  font-size:15px;
  background:var(--smb-primary);
  color:#fff;
  box-shadow:var(--smb-shadow-sm);
  transition:all .2s ease;
}

.auth-button:hover{
  background:var(--smb-primary-hover);
  transform:translateY(-1px);
  box-shadow:var(--smb-shadow-md);
}

.smb-account-menu .acc-toggle{
  background:var(--smb-primary);
  color:#fff;
}

.smb-account-menu .chevron{
  line-height:1;
  transition:transform .2s ease;
}

.smb-account-menu.open .chevron{
  transform:rotate(180deg);
}

.acc-dropdown{
  position:absolute;
  top:calc(100% + 10px);
  min-width:240px;
  background:#fff;
  border:1px solid var(--smb-border);
  border-radius:14px;
  box-shadow:var(--smb-shadow-md);
  padding:.35rem;
  list-style:none;
  margin:0;
  display:none;
  z-index:999999;
}

.smb-account-menu.open .acc-dropdown{
  display:block;
}

.acc-dropdown a{
  display:flex;
  align-items:center;
  gap:.6rem;
  padding:.65rem .75rem;
  border-radius:10px;
  color:var(--smb-text);
  text-decoration:none;
  font-weight:600;
}

.acc-dropdown a:hover{
  background:#f3f4f6;
}

/* =========================================================
   MODAL OVERLAY
   ========================================================= */
.login-overlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:999999;
}

.login-overlay.active{
  display:flex;
}

.login-overlay-backdrop{
  position:absolute;
  inset:0;
  background:rgba(17,24,39,.55);
  z-index:1;
}

.login-overlay-content{
  position:relative;
  z-index:2;
  width:min(520px, 100%);
  background:#fff;
  border-radius:18px;
  border:1px solid var(--smb-border);
  box-shadow:var(--smb-shadow-md);
  padding:22px 18px;
}

.login-close-button{
  position:absolute;
  top:12px;
  right:12px;
  width:40px;
  height:40px;
  border-radius:12px;
  border:1px solid var(--smb-border);
  background:#fff;
  cursor:pointer;
}

.login-title{
  margin:0 0 6px;
  font-size:20px;
  font-weight:800;
  color:var(--smb-text);
  display:flex;
  align-items:center;
  gap:.5rem;
}

.login-subtitle{
  margin:0 0 16px;
  color:var(--smb-muted);
  font-size:14px;
  line-height:1.5;
}

/* Providers */
.auth-providers{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:14px;
}

.auth-provider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding:.85rem 1rem;
  border-radius:14px;
  border:1px solid var(--smb-border);
  text-decoration:none;
  background:#fff;
  color:var(--smb-text);
  font-weight:800;
  cursor:pointer;
  transition:all .15s ease;
}

.auth-provider:hover{
  transform:translateY(-1px);
  box-shadow:var(--smb-shadow-sm);
}

.auth-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--smb-muted);
  font-weight:700;
  font-size:13px;
}

/* Form */
.login-form .form-group{
  margin-bottom:12px;
}

.login-form label{
  display:block;
  font-weight:800;
  color:var(--smb-text);
  font-size:13px;
  margin-bottom:6px;
}

.login-form .input{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid var(--smb-border);
  font-size:15px;
}

.remember-me{
  display:flex;
  align-items:center;
  gap:.5rem;
  color:var(--smb-muted);
  font-weight:700;
}

.form-actions{
  margin-top:12px;
}

.cta-button{
  width:100%;
  padding:12px 14px;
  border-radius:14px;
  border:none;
  background:var(--smb-primary);
  color:#fff;
  font-weight:900;
  font-size:15px;
  cursor:pointer;
  transition:all .15s ease;
}

.cta-button:hover{
  background:var(--smb-primary-hover);
  transform:translateY(-1px);
}

.login-links{
  margin-top:12px;
  text-align:center;
}

.login-links a{
  color:var(--smb-primary);
  text-decoration:none;
  font-weight:800;
  font-size:14px;
}

.login-error,
.registration-error{
  background:#fff1f2;
  border:1px solid #fecdd3;
  color:#9f1239;
  padding:10px 12px;
  border-radius:12px;
  margin-bottom:12px;
  font-weight:800;
}

.registration-success{
  background:#ecfdf5;
  border:1px solid #bbf7d0;
  color:#065f46;
  padding:14px 14px;
  border-radius:14px;
}

.password-input-wrapper{
  display:flex;
  gap:8px;
  align-items:center;
}

.password-input-wrapper .toggle-password{
  flex:0 0 auto;
  width:46px;
  height:46px;
  border-radius:12px;
  border:1px solid var(--smb-border);
  cursor:pointer;
}

.password-strength-meter{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
}

.password-strength-meter .strength-bar{
  height:8px;
  width:0%;
  border-radius:999px;
  background:#e5e7eb;
  flex:1;
  transition:width .2s ease;
}

.password-strength-meter .strength-text{
  font-weight:900;
  font-size:12px;
  color:var(--smb-muted);
  min-width:92px;
  text-align:right;
}

/* Strength color via data attribute on overlay */
#registrationOverlay[data-strength="1"] .strength-bar{ background:#ef4444; }
#registrationOverlay[data-strength="2"] .strength-bar{ background:#f97316; }
#registrationOverlay[data-strength="3"] .strength-bar{ background:#eab308; }
#registrationOverlay[data-strength="4"] .strength-bar{ background:#84cc16; }
#registrationOverlay[data-strength="5"] .strength-bar{ background:#22c55e; }

/* Toast */
.smb-toast{
  position:fixed;
  right:18px;
  bottom:18px;
  background:#111827;
  color:#fff;
  padding:12px 14px;
  border-radius:14px;
  box-shadow:var(--smb-shadow-md);
  display:flex;
  align-items:center;
  gap:10px;
  opacity:0;
  transform:translateY(10px);
  transition:all .2s ease;
  z-index:999999;
}

.smb-toast.show{
  opacity:1;
  transform:translateY(0);
}

.smb-toast.success{ background:#16a34a; }

.smb-toast__icon{
  width:22px;
  height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.18);
  font-weight:900;
}

.smb-toast__text{
  font-weight:900;
}

/* =========================================================
   wp-login neutral panel
   ========================================================= */
.smb-login-neutral{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:var(--smb-bg);
}

.smb-login-neutral__card{
  width:min(520px, 100%);
  background:#fff;
  border:1px solid var(--smb-border);
  border-radius:18px;
  box-shadow:var(--smb-shadow-md);
  padding:22px 18px;
}

.smb-login-neutral__brand{
  font-weight:900;
  font-size:14px;
  letter-spacing:.3px;
  color:var(--smb-primary);
  margin-bottom:8px;
}

.smb-login-neutral__title{
  font-weight:900;
  font-size:20px;
  color:var(--smb-text);
  margin-bottom:8px;
}

.smb-login-neutral__text{
  color:var(--smb-muted);
  font-weight:700;
  line-height:1.55;
  margin-bottom:16px;
}

.smb-login-neutral__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.smb-login-neutral__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid var(--smb-border);
  text-decoration:none;
  font-weight:900;
  color:var(--smb-text);
  background:#fff;
  transition:all .15s ease;
}

.smb-login-neutral__btn.primary{
  background:var(--smb-primary);
  border-color:var(--smb-primary);
  color:#fff;
}

.smb-login-neutral__btn:hover{
  transform:translateY(-1px);
  box-shadow:var(--smb-shadow-sm);
}

/* Mobile */
@media (max-width: 520px){
  .login-overlay-content{
    padding: 14px 14px;
    border-radius:16px;
	left: -15px;
  }
  .auth-button{
    width:50%;
    justify-content:center;
  }
  .smb-auth-buttons{
    width:100%;
  }
	
	.acc-dropdown {
	left: 6.5rem;	
	}
}