/* WOTTT CRM 04.55.2 r16b — explicit account-menu design completion.
   CSS-only, scoped to the existing account dropdown; no menu actions changed. */
.account-popover[role="menu"]{
  --account-border:color-mix(in srgb,var(--ui-accent,#4e7dea) 17%,var(--ui-line,#e4e9f2));
  width:290px;
  max-width:calc(100vw - 18px);
  padding:13px;
  overflow:hidden;
  border:1px solid var(--account-border);
  border-radius:17px;
  background:var(--ui-surface,#fff);
  box-shadow:0 22px 54px rgba(20,39,75,.19),0 2px 8px rgba(20,39,75,.045);
}
.account-popover[role="menu"]::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,#477cf0 0%,#8066d8 54%,#2baa92 100%);
  pointer-events:none;
}
.account-popover[role="menu"] .account-popover-head{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:13px 11px;
  margin:1px 0 12px;
  border:1px solid color-mix(in srgb,#507be7 18%,var(--ui-line,#e4eaf4));
  border-radius:13px;
  background:linear-gradient(110deg,color-mix(in srgb,#507be7 13%,var(--ui-surface,#fff)),color-mix(in srgb,#8d69cf 6%,var(--ui-surface,#fff)) 95%);
}
.account-popover[role="menu"] .account-popover-head .avatar,
.account-popover[role="menu"] .account-popover-head img{
  width:41px;height:41px;min-width:41px;border-radius:50%;
  object-fit:cover;
  box-shadow:0 0 0 2px var(--ui-surface,#fff),0 0 0 4px color-mix(in srgb,#507be7 30%,transparent);
}
.account-popover[role="menu"] .account-popover-head strong{
  font-size:13px;font-weight:800;line-height:1.25;letter-spacing:-.2px;color:var(--ui-ink,#26364b);
  overflow-wrap:anywhere;
}
.account-popover[role="menu"] .account-popover-head span{
  display:inline-block;width:fit-content;
  margin-top:5px;padding:3px 8px;
  border-radius:999px;
  border:1px solid color-mix(in srgb,#8066d8 20%,transparent);
  background:color-mix(in srgb,#8066d8 11%,var(--ui-surface,#fff));
  color:var(--ui-muted,#59677b);
  font-size:10px;font-weight:700;line-height:1.2;
}
.account-popover[role="menu"] > button[role="menuitem"]{
  display:grid;
  grid-template-columns:30px minmax(0,1fr) 15px;
  align-items:center;
  gap:10px;
  width:100%;min-height:47px;
  margin:5px 0;padding:8px 10px;
  border:1px solid var(--account-border);
  border-radius:11px;
  background:color-mix(in srgb,var(--ui-accent,#507be7) 3%,var(--ui-surface,#fff));
  color:var(--ui-ink,#283a50);
  text-align:left;
  transition:border-color .15s ease,background .15s ease,transform .15s ease;
}
.account-popover[role="menu"] > button[role="menuitem"] strong{
  font-size:12px;font-weight:720;letter-spacing:-.1px;
}
.account-popover[role="menu"] > button[role="menuitem"] > .ui-icon:first-child{
  width:29px;height:29px;padding:6px;
  border-radius:9px;
  background:color-mix(in srgb,#477cf0 15%,var(--ui-surface,#fff));
  color:#4276df;
  box-sizing:border-box;
}
.account-popover[role="menu"] > button[role="menuitem"]:nth-child(3) > .ui-icon:first-child{
  color:#9e7531;background:color-mix(in srgb,#d79f4b 15%,var(--ui-surface,#fff));
}
.account-popover[role="menu"] > button[role="menuitem"]:nth-child(4) > .ui-icon:first-child{
  color:#7560d0;background:color-mix(in srgb,#8066d8 15%,var(--ui-surface,#fff));
}
.account-popover[role="menu"] > button[role="menuitem"]:nth-child(5) > .ui-icon:first-child{
  color:#158775;background:color-mix(in srgb,#25ab91 15%,var(--ui-surface,#fff));
}
.account-popover[role="menu"] > button[role="menuitem"]:nth-child(6) > .ui-icon:first-child{
  color:#ba588b;background:color-mix(in srgb,#cd6d9c 15%,var(--ui-surface,#fff));
}
.account-popover[role="menu"] > button[role="menuitem"] > .ui-icon:last-child:not(:first-child){
  width:15px;height:15px;color:var(--ui-muted,#708098);
}
.account-popover[role="menu"] > button[role="menuitem"]:hover,
.account-popover[role="menu"] > button[role="menuitem"]:focus-visible{
  background:color-mix(in srgb,var(--ui-accent,#507be7) 10%,var(--ui-surface,#fff));
  border-color:color-mix(in srgb,var(--ui-accent,#507be7) 39%,var(--ui-line,#e4e9f2));
  outline-offset:1px;
}
.account-popover[role="menu"] .account-popover-divider{
  margin:12px 1px 10px;height:1px;background:var(--ui-line,#e4e9f2);
}
.account-popover[role="menu"] > button[data-action="signout"]{
  grid-template-columns:30px minmax(0,1fr);
  color:var(--ui-danger,#b94b64);
  background:color-mix(in srgb,#d86d83 7%,var(--ui-surface,#fff));
  border-color:color-mix(in srgb,#d86d83 23%,var(--ui-line,#e4e9f2));
}
.account-popover[role="menu"] > button[data-action="signout"] > .ui-icon:first-child{
  color:var(--ui-danger,#b94b64);
  background:color-mix(in srgb,#d86d83 15%,var(--ui-surface,#fff));
}
.account-popover[role="menu"] > button[data-action="signout"]:hover{
  background:color-mix(in srgb,#d86d83 12%,var(--ui-surface,#fff));
}
.account-popover[role="menu"] .menu-version{
  padding:10px 4px 2px;text-align:center;
  color:var(--ui-muted,#718098);font-size:10px;letter-spacing:.015em;
}
@media(max-width:720px){
 .account-popover[role="menu"]{width:290px;right:8px;left:auto;bottom:60px;max-width:calc(100vw - 16px)}
}
@media(prefers-reduced-motion:reduce){.account-popover[role="menu"] > button[role="menuitem"]{transition:none}}
