/* diaspora.ro — account controls polish
   Shared by the legacy topbar pages. Source stylesheet, no runtime injection. */
.topbar .tb-user-menu {
  gap: 8px !important;
  padding: 4px !important;
  border: 1px solid var(--border) !important;
  border-radius: 17px !important;
  background: var(--bg2) !important;
  box-shadow: 0 3px 12px rgba(15, 23, 42, .08) !important;
}
.topbar .tb-user-menu > a,
.topbar .tb-user-menu > a:hover {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  width: auto !important;
  min-width: 0 !important;
  height: 40px !important;
  padding: 3px 12px 3px 4px !important;
  border: 1px solid rgba(24, 119, 242, .18) !important;
  border-radius: 13px !important;
  background: rgba(24, 119, 242, .07) !important;
  color: var(--text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  transition: background .15s, border-color .15s, transform .15s !important;
}
.topbar .tb-user-menu > a:hover {
  background: rgba(24, 119, 242, .13) !important;
  border-color: rgba(24, 119, 242, .38) !important;
  transform: translateY(-1px) !important;
}
.topbar .tb-user-menu .mh-ava {
  display: inline-flex !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #dbeafe, #bfdbfe) !important;
  box-shadow: 0 1px 5px rgba(15, 23, 42, .20) !important;
  overflow: hidden !important;
  flex: 0 0 34px !important;
}
.topbar .tb-user-menu .mh-ava img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 50% !important;
  display: block !important;
}
.topbar .tb-user-menu > button,
.topbar .tb-user-menu > button:hover {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 36px !important;
  min-width: 68px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(100, 116, 139, .28) !important;
  border-radius: 11px !important;
  background: var(--bg) !important;
  color: var(--text2) !important;
  font: 700 12px/1 var(--font) !important;
  cursor: pointer !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .08) !important;
  transition: background .15s, border-color .15s, color .15s, transform .15s !important;
}
.topbar .tb-user-menu > button:hover {
  background: #fff !important;
  border-color: rgba(220, 38, 38, .38) !important;
  color: #b91c1c !important;
  transform: translateY(-1px) !important;
}
@media (max-width: 640px) {
  .topbar .tb-user-menu { gap: 6px !important; padding: 3px !important; border-radius: 15px !important; }
  .topbar .tb-user-menu > a {
    width: 40px !important;
    height: 40px !important;
    padding: 2px !important;
    justify-content: center !important;
    border-radius: 12px !important;
    font-size: 0 !important;
  }
  .topbar .tb-user-menu .mh-ava { width: 34px !important; height: 34px !important; flex-basis: 34px !important; }
  .topbar .tb-user-menu > button { min-width: 58px !important; height: 36px !important; padding: 0 11px !important; }
}


/* ── Avatar header: un singur cadru pătrat cu colțuri rotunjite ── */
body .topbar .tb-user-menu > .tb-profile-link .mh-ava {
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
  border: 0 !important;
  border-radius: 9px !important;
  clip-path: none !important;
  background: #eef2ff !important;
  box-shadow: 0 1px 5px rgba(15, 23, 42, .18) !important;
  overflow: hidden !important;
}
body .topbar .tb-user-menu > .tb-profile-link .mh-ava img,
body .topbar .tb-user-menu > .tb-profile-link .mh-avatar-image {
  width: 100% !important;
  height: 100% !important;
  border-radius: 9px !important;
  clip-path: none !important;
  object-fit: contain !important;
  display: block !important;
}
@media (max-width: 640px) {
  body .topbar .tb-user-menu > .tb-profile-link .mh-ava {
    width: 34px !important;
    height: 34px !important;
    flex-basis: 34px !important;
  }
}

/* ── Mobile profile controls: avatar-only profile + compact logout ── */
@media (max-width: 640px) {
  .topbar .tb-user-menu {
    gap: 8px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    flex-shrink: 0 !important;
  }
  .topbar .tb-user-menu > a,
  .topbar .tb-user-menu > a:hover {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 1px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }
  .topbar .tb-user-menu #tb-user-ava {
    display: inline-flex !important;
    width: 34px !important;
    height: 34px !important;
    border: 2px solid #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 1px 5px rgba(15, 23, 42, .20) !important;
    flex: 0 0 34px !important;
  }
  .topbar .tb-user-menu > button,
  .topbar .tb-user-menu > button:hover {
    min-width: 56px !important;
    height: 32px !important;
    padding: 0 9px !important;
    border-radius: 9px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
    transform: none !important;
  }
}
/* ── Extra-small authenticated header: keep account controls inside 320px ── */
@media (max-width: 360px) {
  .topbar .tb-user-menu > button,
  .topbar .tb-user-menu > button:hover {
    width: 40px !important;
    min-width: 40px !important;
    padding: 0 !important;
    font-size: 0 !important;
  }
  .topbar .tb-user-menu > button::after {
    content: 'Ieșire';
    font-size: 10px;
    line-height: 1;
  }
}