<!-- badge on cart icon -->
         <div class="badge-container">
             <button class="btn badge-icon-btn-lg">
                 <i class="fas fa-shopping-cart"><span class="badge-on-icon">2</span></i>
             </button>
         </div>

         <!-- badge on envelope/mail icon -->
         <div class="badge-container">
             <button class="btn badge-icon-btn-lg">
                 <i class="fas fa-envelope"><span class="badge-on-icon">12</span></i>
             </button>
         </div>

         <!-- badge on envelope/mail icon -->
         <div class="badge-container">
             <button class="btn badge-icon-btn-lg">
                 <i class="fas fa-envelope"><span class="badge-on-icon">25+</span></i>
             </button>
         </div>

         <!-- badge on envelope/mail icon -->
         <div class="badge-container">
             <button class="btn badge-icon-btn-lg">
                 <i class="fas fa-envelope"><span class="badge-on-icon">215+</span></i>
             </button>
         </div>