/* 
    NOTE: 
    All the following classes have been moved here temporarily from main.less.
    This is to allow for easier management and isolation of styles related to the Edit Mobile or Email feature on Owner Officer.
    As Blazor's scoped CSS for Razor components requires additional keywords (such as ::deep) for deep selectors,
    and since this approach can be cumbersome or inconsistent, we are avoiding scoped CSS for now.
    These styles will remain global until a better solution is found.
*/
/* #region - Owner Officer Edit Mobile and Email - Target only adornment icon inside the specific field */
.edit-field .mud-input-adornment .mud-icon-root {
  color: rgba(0, 0, 0, 0.54);
  /* default grey */
  transition: color 0.2s ease, background-color 0.2s ease, border-radius 0.2s ease;
  border-radius: 50%;
  padding: 4px;
}
.edit-field .mud-input-adornment .mud-icon-root:hover {
  color: var(--mud-palette-primary);
  background-color: rgba(var(--mud-palette-primary-rgb), 0.12);
  cursor: pointer;
}
/* #endregion Owner Officer Edit Mobile and Email */
/* #region - Hide unnecessary adornment html tag in Mud Code */
.mud-code .mud-input-adornment {
  display: none;
}
/* #endregion Hide unnecessary adornment html tag in Mud Code */