/* FS Portal · Avatar corporativo padrao
   Referencia mestre: Gestao de Colaboradores.
   Escopo propositalmente restrito ao avatar de usuario em cabecalhos. */
:root{
  --fs-avatar-size:38px;
  --fs-avatar-radius:13px;
  --fs-avatar-border:#d7e7df;
  --fs-avatar-bg:#087a52;
  --fs-avatar-fg:#ffffff;
}

/* Contrato visual unico para todos os modulos atuais. */
.fs-standard-avatar,
.header-account-avatar,
.header-account > .avatar,
.header-account .avatar#avatar,
.header-account .avatar#loggedUserAvatar,
.chat-account .chat-avatar,
.account > summary .account-avatar,
.header-profile-avatar,
.topbar .account-btn.portal-profile-avatar{
  width:var(--fs-avatar-size)!important;
  min-width:var(--fs-avatar-size)!important;
  max-width:var(--fs-avatar-size)!important;
  height:var(--fs-avatar-size)!important;
  min-height:var(--fs-avatar-size)!important;
  max-height:var(--fs-avatar-size)!important;
  flex:0 0 var(--fs-avatar-size)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  border-radius:var(--fs-avatar-radius)!important;
  border:2px solid var(--fs-avatar-border)!important;
  background:var(--fs-avatar-bg)!important;
  color:var(--fs-avatar-fg)!important;
  box-shadow:none!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  line-height:1!important;
  position:relative!important;
  vertical-align:middle!important;
}

.fs-standard-avatar img,
.header-account-avatar img,
.header-account > .avatar img,
.chat-account .chat-avatar img,
.account > summary .account-avatar img,
.header-profile-avatar img,
.topbar .account-btn.portal-profile-avatar img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  border:0!important;
  border-radius:calc(var(--fs-avatar-radius) - 2px)!important;
  background:#fff!important;
  padding:0!important;
  margin:0!important;
}

.fs-standard-avatar img[hidden],
.header-account-avatar img[hidden],
.header-account > .avatar img[hidden],
.chat-account .chat-avatar img[hidden],
.account > summary .account-avatar img[hidden],
.header-profile-avatar img[hidden],
.topbar .account-btn.portal-profile-avatar img[hidden]{display:none!important}

.fs-avatar-fallback,
.fs-standard-avatar > span:not(.fs-avatar-photo),
.fs-standard-avatar > b,
.fs-standard-avatar > svg,
.header-account-avatar > svg,
.header-account > .avatar > span,
.chat-account .chat-avatar > span,
.account > summary .account-avatar > b,
.header-profile-avatar .profile-avatar-initials,
.topbar .account-btn.portal-profile-avatar .account-avatar-fallback{
  width:100%!important;
  height:100%!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:inherit!important;
  color:var(--fs-avatar-fg)!important;
  background:var(--fs-avatar-bg)!important;
  font:900 11px/1 Inter,Montserrat,Arial,sans-serif!important;
  text-transform:uppercase!important;
  box-sizing:border-box!important;
}

.fs-standard-avatar.fs-has-photo > :not(img),
.header-account-avatar.fs-has-photo > :not(img),
.header-account > .avatar.fs-has-photo > :not(img),
.chat-account .chat-avatar.fs-has-photo > :not(img),
.account > summary .account-avatar.fs-has-photo > :not(img),
.header-profile-avatar.fs-has-photo > :not(img),
.topbar .account-btn.portal-profile-avatar.fs-has-photo > :not(img){
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Avatar injetado apenas em modulos que ainda nao tinham foto no cabecalho. */
.fs-avatar-injected{display:inline-grid!important;align-self:center!important}
.fs-avatar-injected[hidden]{display:none!important}

/* Mantem o mesmo contrato em tablet/mobile sem deformar a foto. */
@media(max-width:760px){
  :root{--fs-avatar-size:38px;--fs-avatar-radius:13px}
}