/* ============================================================================
   Radix UI Design System — 原生落地层（叠加在 style.20260827d.css 之上）
   原则：设计令牌(CSS 变量) + 无障碍优先(focus-visible/aria) + 统一圆角/高程/间距。
   仅追加与微调，不重写主样式；移除本文件即可整体回退。
   ============================================================================ */

:root {
  /* 圆角阶梯（Radix 风格统一尺度） */
  --rd-radius-1: 6px;
  --rd-radius-2: 10px;
  --rd-radius-3: 14px;
  --rd-radius-4: 20px;
  --rd-radius-pill: 999px;

  /* 焦点环（Radix 招牌：键盘可见、对比充足） */
  --rd-focus: var(--brand-2, #00e5ff);
  --rd-focus-width: 2px;
  --rd-focus-offset: 2px;

  /* 语义色（与 toast success/error 对齐） */
  --rd-success: #10b981;
  --rd-danger: #ef4444;
  --rd-warning: #f59e0b;

  /* 统一高程（替代散落的 box-shadow） */
  --rd-elevation-1: 0 10px 30px rgba(0, 0, 0, .45);
  --rd-elevation-2: 0 24px 70px rgba(0, 0, 0, .55), 0 8px 24px rgba(0, 0, 0, .4);

  /* 交互反馈时长（尊重 reduced-motion） */
  --rd-motion: 160ms;
}

/* ---------- 无障碍：键盘焦点可见（鼠标点击不显示 outline） ---------- */
:focus { outline: none; }
:focus-visible {
  outline: var(--rd-focus-width) solid var(--rd-focus);
  outline-offset: var(--rd-focus-offset);
  border-radius: var(--rd-radius-1);
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.icon-btn:focus-visible,
.send-btn:focus-visible,
.primary-btn:focus-visible,
.shortcut-pill:focus-visible,
.detail-member:focus-visible,
.agent-item:focus-visible,
.media-card:focus-visible,
.model-select select:focus-visible,
[tabindex]:focus-visible {
  outline: var(--rd-focus-width) solid var(--rd-focus);
  outline-offset: var(--rd-focus-offset);
}

/* ---------- 尊重用户的减少动效偏好（WCAG / Radix 默认行为） ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ---------- 选区与滚动条润色 ---------- */
::selection { background: var(--brand-soft, rgba(0, 229, 224, .22)); color: #fff; }

/* ---------- 通用禁用态（语义一致） ---------- */
button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
[aria-disabled="true"],
.is-disabled {
  opacity: .5 !important;
  cursor: not-allowed !important;
  filter: none !important;
  box-shadow: none !important;
}

/* ---------- 弹窗/抽屉：统一圆角与高程（Radix 卡片质感） ---------- */
.members-drawer,
.gen-panel,
.profile-card,
.drawer {
  border-radius: var(--rd-radius-3);
  box-shadow: var(--rd-elevation-2);
}
.profile-overlay { background: rgba(4, 8, 14, .72); backdrop-filter: blur(10px); }

/* ---------- Tabs（详情面板成员/对话/产物）：聚焦态用 accent 下划线 ---------- */
.detail-tab.active {
  box-shadow: inset 0 -2px 0 var(--brand-2, #00e5ff);
}

/* ---------- 输入框聚焦高亮（替代原生 outline 的细描边） ---------- */
#input:focus-visible,
.model-select select:focus-visible,
textarea:focus-visible,
input:focus-visible {
  border-color: var(--brand-2, #00e5ff) !important;
}

/* ---------- 主按钮/发送按钮：统一过渡节奏 ---------- */
.primary-btn,
.send-btn,
.icon-btn,
.shortcut-pill,
.uc-recharge {
  transition: transform var(--rd-motion) ease, background var(--rd-motion) ease,
    box-shadow var(--rd-motion) ease, color var(--rd-motion) ease, border-color var(--rd-motion) ease;
}

/* ============================================================================
   全局输入框与按钮一致性规范（响应用户 UI 优化需求）
   目标：统一高度/圆角/内边距/边框/状态样式，提升可用性与无障碍体验。
   ============================================================================ */

:root {
  /* 输入框令牌 */
  --rd-input-min-h: 40px;
  --rd-input-radius: 10px;
  --rd-input-pad-y: 9px;
  --rd-input-pad-x: 12px;
  --rd-input-bg: rgba(255, 255, 255, 0.06);
  --rd-input-bg-hover: rgba(255, 255, 255, 0.08);
  --rd-input-bg-focus: rgba(255, 255, 255, 0.07);
  --rd-input-border: var(--stroke-strong, rgba(255,255,255,.14));
  --rd-input-border-hover: rgba(255, 255, 255, 0.24);
  --rd-input-border-focus: var(--brand-2, #00e5ff);
  --rd-input-border-error: rgba(255, 107, 112, 0.65);
  --rd-input-text: var(--text, #e8eef4);
  --rd-input-text-size: 14px;
  --rd-input-line-height: 1.5;
  --rd-input-placeholder: #8a93a6;
  --rd-input-focus-ring: 0 0 0 3px var(--brand-soft, rgba(0, 229, 224, .14));

  /* 按钮令牌 */
  --rd-btn-min-h: 40px;
  --rd-btn-radius: 999px;
  --rd-btn-pad-x: 18px;
  --rd-btn-text: 14px;
}

/* 统一所有文本类输入框（排除特殊控件） */
#input,
.gen-input,
.gen-field textarea,
.gen-field input[type="text"],
.gen-field input[type="number"],
.gen-field input[type="password"],
.s-edit,
.login-field input,
.login-captcha-input,
.model-select select,
input[type="text"]:not(.s-edit):not(.login-captcha-input),
input[type="password"]:not(.login-field input),
input[type="email"],
input[type="tel"],
input[type="search"],
textarea:not(#input):not(.gen-field textarea) {
  min-height: var(--rd-input-min-h);
  border-radius: var(--rd-input-radius);
  padding: var(--rd-input-pad-y) var(--rd-input-pad-x);
  border: 1px solid var(--rd-input-border);
  background: var(--rd-input-bg);
  color: var(--rd-input-text);
  font-size: var(--rd-input-text-size);
  line-height: var(--rd-input-line-height);
  transition: border-color var(--rd-motion) ease, background var(--rd-motion) ease, box-shadow var(--rd-motion) ease;
  box-sizing: border-box;
}

/* placeholder 统一：对比度、字号、不换行抖动修复 */
#input::placeholder,
.gen-input::placeholder,
.gen-field textarea::placeholder,
.gen-field input::placeholder,
.s-edit::placeholder,
.login-field input::placeholder,
.login-captcha-input::placeholder,
.model-select select::placeholder,
input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="email"]::placeholder,
input[type="tel"]::placeholder,
textarea::placeholder {
  color: var(--rd-input-placeholder);
  opacity: 0.9;
  font-size: inherit;
  line-height: inherit;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* hover：边框提亮，背景略深 */
#input:hover,
.gen-input:hover,
.gen-field textarea:hover,
.gen-field input:hover,
.s-edit:hover,
.login-field input:hover,
.login-captcha-input:hover,
.model-select select:hover,
input[type="text"]:hover,
input[type="password"]:hover,
input[type="email"]:hover,
input[type="tel"]:hover,
textarea:hover {
  border-color: var(--rd-input-border-hover);
  background: var(--rd-input-bg-hover);
}

/* focus：品牌色边框 + 外发光，不修改 border-width 避免抖动 */
#input:focus,
.gen-input:focus,
.gen-field textarea:focus,
.gen-field input:focus,
.s-edit:focus,
.login-field input:focus,
.login-captcha-input:focus,
.model-select select:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus {
  outline: none;
  border-color: var(--rd-input-border-focus);
  background: var(--rd-input-bg-focus);
  box-shadow: var(--rd-input-focus-ring);
}

/* 已经由 :focus-visible 处理的，去掉重复发光以保持一致 */
#input:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  box-shadow: var(--rd-input-focus-ring);
}

/* error 状态 */
#input.is-error,
.gen-input.is-error,
.gen-field textarea.is-error,
.s-edit.is-error,
.login-field.is-error input,
.login-captcha-input.is-error,
input.is-error,
textarea.is-error {
  border-color: var(--rd-input-border-error);
  background: rgba(239, 68, 68, 0.08);
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12);
}

/* disabled 状态 */
input:disabled,
textarea:disabled,
select:disabled,
#input:disabled,
.gen-input:disabled,
.login-field input:disabled,
.login-captcha-input:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.08);
}

/* 修复聚焦时文本被裁切：行高与内边距预留 */
#input,
textarea {
  padding-top: max(10px, var(--rd-input-pad-y));
  padding-bottom: max(10px, var(--rd-input-pad-y));
}

/* ============================================================================
   主页登录按钮与全局按钮点击区域、视觉层级一致性
   ============================================================================ */

/* 基础按钮规范：最小高度 40px，统一过渡 */
.lp-link,
.lp-ghost-btn,
.lp-note-link,
.lp-primary,
.lp-secondary,
.login-submit,
.login-tab,
.primary-btn,
.send-btn,
.send-now-btn,
.lp-load-btn,
.lp-agent-exp,
.lp-makesame,
.lp-chip {
  min-height: var(--rd-btn-min-h);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

/* 导航中的 Login 文本链接：改为可点击的按钮区域 */
.lp-link {
  padding: 8px 14px;
  border-radius: var(--rd-radius-2);
  color: var(--text-soft, #c2ccd6);
  font-weight: 600;
  transition: color var(--rd-motion) ease, background var(--rd-motion) ease;
}
.lp-link:hover {
  color: var(--text, #e8eef4);
  background: rgba(255, 255, 255, 0.06);
  cursor: pointer;
}

/* 导航注册按钮与主页次级按钮：确保最小高度与统一圆角 */
.lp-ghost-btn {
  min-height: var(--rd-btn-min-h);
  padding: 9px 20px;
  border-radius: var(--rd-btn-radius);
  border: 1px solid rgba(0, 202, 224, 0.45);
  background: rgba(0, 202, 224, 0.06);
  color: var(--brand, #00cae0);
}
.lp-ghost-btn:hover {
  background: rgba(0, 202, 224, 0.14);
  border-color: rgba(0, 202, 224, 0.65);
}

/* 主页 CTA 主按钮：提升视觉层级 */
.lp-primary,
.lp-cta-section .lp-primary {
  min-height: 46px;
  padding: 12px 32px;
  border-radius: var(--rd-btn-radius);
  font-weight: 800;
  box-shadow: 0 10px 30px rgba(0, 202, 224, 0.28);
}
.lp-primary:hover {
  box-shadow: 0 14px 36px rgba(0, 202, 224, 0.42);
}

/* 主页 CTA 次按钮 */
.lp-secondary {
  min-height: 46px;
  padding: 12px 28px;
  border-radius: var(--rd-btn-radius);
}

/* 登录弹窗提交按钮 */
.login-submit {
  min-height: 48px;
  border-radius: var(--rd-input-radius);
}

/* 登录 Tab 切换 */
.login-tab {
  min-height: 36px;
}

/* 移动端适配：避免输入框字号过小导致 iOS 聚焦放大 */
@media (max-width: 640px) {
  #input,
  .gen-input,
  .login-field input,
  .login-captcha-input,
  input[type="text"],
  input[type="password"],
  textarea {
    font-size: 16px;
  }
}

/* 登录弹窗内特殊控件微调：图标输入框已经自带 padding，避免双重压迫 */
.login-field input {
  padding-left: 4px;
  min-height: 0;
}

/* 验证码输入框：保持居中但应用统一圆角与内边距 */
.login-captcha-input {
  border-radius: var(--rd-input-radius);
  padding: var(--rd-input-pad-y) var(--rd-input-pad-x);
}
