/* ======================================
   用户入口 UI（基于 uView Avatar 设计规范）
   BOX3 数字工坊 - 2026-08-23 重新设计版

   设计参考：ui-library/components/card/uView-abf68969
   规范来源：uView 官方设计系统
   ====================================== */

/* 订阅独立入口（2026-08-24：头像只负责用户管理/登录，订阅单开按钮） */
.subscribe-entry {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 34px;
  padding: 2px 12px;
  border-radius: 100px;
  background: linear-gradient(135deg, var(--accent, #0ea5e9) 0%, #3b82f6 100%);
  border: 1px solid transparent;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: filter 0.2s ease, transform 0.2s ease;
  box-sizing: border-box;
  animation: none;
  white-space: nowrap; /* 2026-08-25 审查员 P0-3：2 字按钮不折断 */
  flex-shrink: 0;
}

.subscribe-entry:hover {
  filter: brightness(1.12);
  border-color: rgba(255, 255, 255, 0.35);
}

.subscribe-entry:active {
  transform: scale(0.97);
}

.subscribe-entry svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

@media (max-width: 768px) {
  .subscribe-entry {
    padding: 2px 10px;
    font-size: 12px;
  }
}

/* 用户入口容器（BOX3 补丁 2026-08-23：并入导航栏，不再 fixed 浮动） */
.user-entry {
  display: inline-flex;
  align-items: center;
  gap: 6px; /* uView 规范：头像与文字间距 8px，导航栏内紧凑取 6px */
  padding: 2px 10px 2px 2px;
  background: var(--surface-1, #161b22);
  border: 1px solid var(--border-default, #30363d);
  border-radius: 100px; /* 胶囊形状 */
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  box-shadow: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent; /* 移除移动端点击高亮 */
  min-height: 34px; /* 与 header 图标按钮同高 */
  box-sizing: border-box;
}

.user-entry:hover {
  background: var(--surface-2, #1c2128);
  border-color: var(--accent, #0ea5e9);
}

.user-entry:active {
  transform: scale(0.97);
}

/* 头像（导航栏内 24×24px，与 header-icon-btn 高度匹配） */
.user-entry__avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%; /* uView 规范：圆形 = 50% */
  background: linear-gradient(135deg, var(--accent, #0ea5e9) 0%, #3b82f6 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: white;
  flex-shrink: 0;
  overflow: hidden;
  position: relative;
}

.user-entry__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 积分信息容器 */
.user-entry__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 52px;
  line-height: 1.2;
}

/* 积分标签（uView 规范：10px 小字号） */
.user-entry__label {
  font-size: 10px;
  color: var(--text-muted, #8b949e);
  font-weight: 400;
}

/* 积分数值（uView 规范：14px 主字号） */
.user-entry__value {
  font-size: 14px;
  font-weight: 600;
  color: var(--accent, #0ea5e9);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.5px;
}

/* 未登录游客状态 */
.user-entry--guest .user-entry__avatar {
  background: var(--surface-3, #2d333b);
  color: var(--text-muted, #8b949e);
}

.user-entry--guest .user-entry__avatar::after {
  display: none; /* 游客不显示在线状态 */
}

/* 积分不足警告（≤5） */
.user-entry--low-credits .user-entry__value {
  color: #f59e0b;
}

/* 积分耗尽（=0） */
.user-entry--no-credits .user-entry__value {
  color: #ef4444;
}

/* 订阅生效中（2026-08-24 订阅制：绿色高亮 ∞） */
.user-entry--member .user-entry__label {
  color: #22c55e;
  font-weight: 600;
}

.user-entry--member .user-entry__value {
  color: #22c55e;
  font-weight: 700;
}

/* PC 端适配（导航栏内紧凑风格） */
@media (min-width: 769px) {
  .user-entry {
    padding: 2px 12px 2px 2px;
  }

  .user-entry__avatar {
    width: 28px;
    height: 28px;
    font-size: 13px;
  }

  .user-entry__label {
    font-size: 11px;
  }

  .user-entry__value {
    font-size: 15px;
  }
}

/* 移动端安全区适配（导航栏已随 header 固定，无需额外偏移） */
@media (max-width: 768px) {
  .user-entry {
    padding: 2px 8px 2px 2px;
    gap: 5px;
  }

  .user-entry__info {
    min-width: 40px;
  }
}

/* 深色主题下的边框增强 */
@media (prefers-color-scheme: dark) {
  .user-entry {
    border-color: rgba(255, 255, 255, 0.1);
  }
}

/* 触控区优化（移动端：维持导航栏高度，整卡可点击） */
@media (pointer: coarse) {
  .user-entry {
    min-height: 34px;
  }
}

/* 动画：并排进导航栏后去掉入场动画，避免布局跳动 */
@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 并入导航栏后禁用入场动画（避免 header 跳变） */
.user-entry {
  animation: none;
}

/* 2026-08-25 审查员 P0-2：游客芯片 = 实心「登录」按钮（行动召唤非信息条） */
.user-entry--guest {
  border: 1px solid transparent;
  background: linear-gradient(135deg, var(--accent, #0ea5e9) 0%, #3b82f6 100%);
}
.user-entry--guest .user-entry__label,
.user-entry--guest .user-entry__value {
  color: #fff;
}
.user-entry--guest:hover {
  filter: brightness(1.08);
  border-color: rgba(255,255,255,0.35);
}
.user-entry--guest .user-entry__avatar {
  background: rgba(255,255,255,0.18);
  border-radius: 50%;
}
.user-entry--guest .user-entry__avatar::after { display: none; }

/* 2026-08-25 P0-3：防换行（「登录」/「免费额度」不折行） */
.user-entry__label,
.user-entry__value {
  white-space: nowrap;
}
.user-entry__info {
  white-space: nowrap;
}

/* ∞ 提权（P1：会员身份象征加强） */
.user-entry--member .user-entry__value {
  color: #22c55e;
  font-weight: 700;
}
.user-entry--member {
  border-color: rgba(34, 197, 94, 0.5);
}
/* 游客「3 次」小字（P0-2：免费次数降为芯片内小字） */
.user-entry--guest .user-entry__value {
  font-size: 11px;
  font-weight: 500;
  opacity: 0.9;
}
/* 游客态订阅按钮降级：描边次级（蓝只给主行动=登录，2026-08-25 审查员 P0-2） */
.subscribe-entry--secondary {
  background: transparent;
  border: 1px solid var(--accent, #0ea5e9);
  color: var(--accent, #0ea5e9);
}