/* HTNS v293 — fix notification toggle alignment in mobile/profile view.
   Remove scale-based shrinking and give the switch its own fixed right column,
   so all toggles line up evenly and the knob stays centered inside the track. */

#view-profile #notificationsCard .me-pref-item{
  grid-template-columns:36px minmax(0,1fr) 46px !important;
  align-items:center !important;
}

#view-profile #notificationsCard .toggle{
  width:46px !important;
  height:28px !important;
  min-width:46px !important;
  justify-self:end !important;
  align-self:center !important;
  margin:0 !important;
  display:block !important;
  transform:none !important;
  transform-origin:center center !important;
}

#view-profile #notificationsCard .toggle-ui{
  inset:0 !important;
  width:46px !important;
  height:28px !important;
  border-radius:999px !important;
  box-sizing:border-box !important;
}

#view-profile #notificationsCard .toggle-ui:before{
  width:22px !important;
  height:22px !important;
  left:2px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  box-sizing:border-box !important;
}

#view-profile #notificationsCard .toggle input:checked + .toggle-ui:before{
  left:22px !important;
  transform:translateY(-50%) !important;
}

@media (max-width:390px){
  #view-profile #notificationsCard .me-pref-item{
    grid-template-columns:32px minmax(0,1fr) 44px !important;
  }
  #view-profile #notificationsCard .toggle,
  #view-profile #notificationsCard .toggle-ui{
    width:44px !important;
    height:26px !important;
    min-width:44px !important;
  }
  #view-profile #notificationsCard .toggle-ui:before{
    width:20px !important;
    height:20px !important;
    left:2px !important;
  }
  #view-profile #notificationsCard .toggle input:checked + .toggle-ui:before{
    left:22px !important;
  }
}