:root{
  --eye-open: url('https://forestgreen-caterpillar-969003.hostingersite.com/wp-content/uploads/2025/10/mdi_eye.svg');
  --eye-closed: url('https://forestgreen-caterpillar-969003.hostingersite.com/wp-content/uploads/2025/10/basil_eye-closed-solid.svg');
}

#user-popup-icon{cursor:pointer;font-size:28px;color:#222}
#user-popup-modal{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:99999}
#user-popup-modal.hidden{display:none !important}
.popup-content{background:#fff;border-radius:16px;padding:24px 28px;max-width:440px;width:92%;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.25)}
#user-popup-close{position:absolute;right:12px;top:8px;font-size:22px;cursor:pointer;user-select:none}

.tabs{display:flex;gap:10px;margin-bottom:16px}
.tablink{flex:1;padding:12px 14px;border:none;cursor:pointer;background:#e8e8e8;font-weight:800;border-radius:10px;transition:.2s}
.tablink.active{background:#111;color:#fff}

.tab{display:none}
.tab.active{display:block}

.field{margin-bottom:14px;position:relative}
.field input{width:100%;padding:12px 16px;border:2px solid #333;border-radius:12px;font-size:16px}

.password-wrap{position:relative}
.toggle-pass{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border:0;cursor:pointer;background:transparent;
  background-repeat:no-repeat;background-position:center;background-size:22px 22px;
  opacity:.8;border-radius:6px;
}
.toggle-pass:hover{opacity:1}
/*
.toggle-pass.is-closed{background-image:var(--eye-closed)}
.toggle-pass.is-open{background-image:var(--eye-open)}
*/

.extras{display:flex;justify-content:space-between;align-items:center;margin:8px 0 16px;font-size:14px}
.btn-primary{width:100%;padding:14px;background:#111;color:#fff;border:0;border-radius:14px;font-size:17px;font-weight:700;cursor:pointer}
#user-popup-msg{margin-top:10px;font-weight:600}
.profile-note{font-size:13px;margin:8px 0 14px;color:#444}