/* ============================================================================
   Valify — signed-in header state (Dashboard link + profile avatar/menu)
   Relies on the --orange/--blue/--surface-raised/--border-strong/--text/
   --muted/--body custom properties already declared in each page's :root.
   ============================================================================ */

.nav-profile{position:relative;}

.nav-avatar-btn{
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg, var(--orange), var(--blue));
  color:#fff;font-family:var(--body);font-weight:700;font-size:13px;
  display:flex;align-items:center;justify-content:center;
  border:none;cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
}
.nav-avatar-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px -6px rgba(255,107,43,.5);}

.nav-profile-menu{
  position:absolute;top:calc(100% + 10px);right:0;
  min-width:210px;
  background:var(--surface-raised);
  border:1px solid var(--border-strong);
  border-radius:12px;
  padding:8px;
  box-shadow:0 20px 40px -20px rgba(0,0,0,.6);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .15s ease, transform .15s ease, visibility .15s ease;
  z-index:1100;
}
.nav-profile-menu.open{opacity:1;visibility:visible;transform:translateY(0);}

.nav-profile-email{
  padding:10px 12px 8px;
  font-size:12px;color:var(--muted);
  border-bottom:1px solid var(--border, rgba(255,255,255,.08));
  margin-bottom:6px;
  word-break:break-all;
}

.nav-profile-menu button{
  width:100%;text-align:left;background:none;border:none;
  color:var(--text);font-family:var(--body);font-size:13.5px;font-weight:600;
  padding:10px 12px;border-radius:8px;cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.nav-profile-menu button:hover{background:rgba(255,255,255,.05);color:var(--orange);}