/* ============================================================================
   统一右上角账号菜单（avatar-menu.css）· 2026-11-08
   ----------------------------------------------------------------------------
   一套组件，五套外壳共用：会员端 /u、代理端 /agent、公共资讯壳、律师端、律所端。
   颜色全部写在组件自己的变量里（.avx 上），昼/夜自动跟随 html[data-theme]，
   不依赖任何一端的 tokens，避免互相污染。
   位置口径：右对齐头像右边缘，菜单与头像间距 8px。
   ========================================================================== */

.avx{
  position:relative;display:inline-flex;align-items:center;flex:0 0 auto;
  --avx-bg:#FFFFFF;--avx-line:#E4E2DC;--avx-ink:#17181B;--avx-ink2:#8B8F96;
  --avx-hover:#FBFAF8;--avx-bad:#B02A2A;--avx-av-bg:#FBEDEA;--avx-av-fg:#BE3227;
  --avx-shadow:0 12px 32px rgba(16,18,22,.14);
}
html[data-theme="dark"] .avx{
  --avx-bg:#1A1C21;--avx-line:#2A2D34;--avx-ink:#E8E9EB;--avx-ink2:#767C85;
  --avx-hover:#23262C;--avx-bad:#E0736B;--avx-av-bg:#2E1E1C;--avx-av-fg:#E4584B;
  --avx-shadow:0 12px 32px rgba(0,0,0,.5);
}

/* ── 触发按钮：头像 + 姓名 + 箭头 ── */
.avx-b{
  display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 8px 0 4px;
  border:1px solid transparent;border-radius:4px;background:transparent;
  color:var(--avx-ink);font-family:inherit;font-size:12.5px;line-height:1;
  cursor:pointer;-webkit-appearance:none;appearance:none;
}
.avx-b:hover,.avx-b[aria-expanded="true"]{background:var(--avx-hover);border-color:var(--avx-line)}
.avx-av{
  width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--avx-av-bg);color:var(--avx-av-fg);font-style:normal;font-size:12px;font-weight:500;
  flex:0 0 auto;
}
.avx-nm{white-space:nowrap;max-width:132px;overflow:hidden;text-overflow:ellipsis}
.avx-caret{width:12px;height:12px;flex:0 0 auto;fill:none;stroke:var(--avx-ink2);stroke-width:1.8;
  transition:transform .18s}
.avx-b[aria-expanded="true"] .avx-caret{transform:rotate(180deg)}

/* ── 下拉面板 ── */
.avx-m{
  position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:164px;
  display:flex;flex-direction:column;padding:5px;
  background:var(--avx-bg);border:1px solid var(--avx-line);border-radius:8px;
  box-shadow:var(--avx-shadow);
}
.avx-m[hidden]{display:none}
.avx-i{
  display:flex;align-items:center;gap:9px;height:36px;padding:0 10px;border-radius:4px;
  color:var(--avx-ink);font-size:12.5px;text-decoration:none;white-space:nowrap;
}
.avx-i:hover{background:var(--avx-hover)}
.avx-i svg{width:15px;height:15px;flex:0 0 auto;fill:none;stroke:var(--avx-ink2);stroke-width:1.6}
.avx-i.out{color:var(--avx-bad)}
.avx-i.out svg{stroke:var(--avx-bad)}

/* 顶栏里紧跟文字的场景（律师端 / 律所端），给一点左间距 */
.dk-me > .avx,.me > .avx{margin-left:2px}

/* ── 抗宿主污染 ──
   律师端 .top、律所端 .dk-top 都写了 `.top a{color:#...}` 这类更高优先级的规则，
   组件里的文字色会被继承/覆盖成浅灰。这里只在 .avx 内部钉死颜色，不影响外壳。 */
.avx,.avx .avx-b,.avx .avx-nm{color:var(--avx-ink)!important}
.avx a.avx-i{color:var(--avx-ink)!important;text-decoration:none!important;background:transparent}
.avx a.avx-i:hover{background:var(--avx-hover)}
.avx a.avx-i.out{color:var(--avx-bad)!important}
.avx a.avx-i svg{stroke:var(--avx-ink2)!important;fill:none!important}
.avx a.avx-i.out svg{stroke:var(--avx-bad)!important}

/* 菜单项不许继承宿主的「胶囊链接」样式（律所端 .dk-me a、律师端 .top .me a 都带描边和内距） */
.avx .avx-m a.avx-i{
  display:flex!important;height:36px!important;padding:0 10px!important;border:0!important;
  border-radius:4px!important;background:transparent;box-shadow:none!important;line-height:1;
}
.avx .avx-m a.avx-i:hover{background:var(--avx-hover)!important}