/* ═══════════════════════════════════════════════════════════════
   天讯 API · 全站视觉统一层 (tx-site.css)
   作用：把首页的「玻璃拟态 + 蓝青渐变」延伸到 new-api 内页
        （导航条 / 按钮 / 卡片 / 输入框 / 表格 / 菜单 / 弹窗 / 页脚）
   原则：只改视觉，不动布局与交互；全部用 !important 温和覆盖
        以对抗 new-api 的 Tailwind 原子类；出问题删本文件即恢复
   2026-09-11 初版
   ═══════════════════════════════════════════════════════════════ */

:root{
  --txs-brand:#2563eb;
  --txs-brand2:#06b6d4;
  --txs-violet:#7c3aed;
  --txs-line:rgba(15,23,42,.09);
  --txs-glass:rgba(255,255,255,.62);
  --txs-glass-brd:rgba(255,255,255,.75);
  --txs-radius:16px;
  --txs-shadow:0 8px 28px rgba(23,37,84,.08);
}

/* ── 全局底色：淡蓝青渐变（与首页同源） ── */
html:not(.dark) body{
  background:
    radial-gradient(1200px 700px at 4% -6%, #e8f1ff 0%, rgba(232,241,255,0) 60%),
    radial-gradient(1000px 620px at 98% 2%, #e0f7fd 0%, rgba(224,247,253,0) 58%),
    radial-gradient(1100px 760px at 52% 48%, #eef0ff 0%, rgba(238,240,255,0) 62%),
    linear-gradient(180deg,#f7faff 0%,#f0f5fd 45%,#f6f9fd 100%) !important;
  background-attachment:fixed !important;
}

/* ── 站点导航条：玻璃化（贴合首页头部） ── */
html:not(.dark) header,
html:not(.dark) nav[class*="sticky"],
html:not(.dark) .navbar{
  background:rgba(255,255,255,.62) !important;
  backdrop-filter:blur(20px) saturate(190%) !important;
  -webkit-backdrop-filter:blur(20px) saturate(190%) !important;
  border-bottom:1px solid rgba(255,255,255,.6) !important;
  box-shadow:0 1px 0 rgba(15,23,42,.04), 0 6px 22px rgba(23,37,84,.05) !important;
}

/* ── 卡片类容器：玻璃 + 更圆的角 + 柔和阴影 ──
   注意：必须排除 button —— 按钮常带 rounded-lg+border 类，会被这条规则
   涂成白玻璃从而盖掉渐变主按钮（2026-09-11 踩坑） */
html:not(.dark) .rounded-lg.border:not(button):not(a),
html:not(.dark) .rounded-xl.border:not(button):not(a),
html:not(.dark) [class*="rounded-"][class*="border"][class*="bg-white"]:not(button):not(a),
html:not(.dark) [class*="rounded-"][class*="border"][class*="bg-card"]:not(button):not(a){
  background:var(--txs-glass) !important;
  border-color:var(--txs-glass-brd) !important;
  backdrop-filter:blur(16px) saturate(170%) !important;
  -webkit-backdrop-filter:blur(16px) saturate(170%) !important;
  box-shadow:var(--txs-shadow), inset 0 1px 0 rgba(255,255,255,.85) !important;
}

/* ── 主按钮：蓝青渐变（与首页 CTA 同款） ── */
html:not(.dark) button[class*="bg-blue"],
html:not(.dark) button[class*="bg-primary"],
html:not(.dark) a[class*="bg-blue"],
html:not(.dark) a[class*="bg-primary"],
html:not(.dark) [role="button"][class*="bg-blue"]{
  background-image:linear-gradient(135deg,var(--txs-brand),var(--txs-brand2)) !important;
  border-color:transparent !important;
  box-shadow:0 6px 18px rgba(37,99,235,.26), inset 0 1px 0 rgba(255,255,255,.22) !important;
  transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s !important;
}
html:not(.dark) button[class*="bg-blue"]:hover,
html:not(.dark) button[class*="bg-primary"]:hover,
html:not(.dark) a[class*="bg-blue"]:hover,
html:not(.dark) a[class*="bg-primary"]:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(37,99,235,.34) !important;
}

/* ── 输入框 / 下拉：玻璃边的圆角风格 ── */
html:not(.dark) input:not([type="checkbox"]):not([type="radio"]),
html:not(.dark) textarea,
html:not(.dark) select{
  background:rgba(255,255,255,.72) !important;
  border-color:rgba(255,255,255,.9) !important;
  box-shadow:inset 0 1px 2px rgba(23,37,84,.04) !important;
  border-radius:12px !important;
}
html:not(.dark) input:focus,
html:not(.dark) textarea:focus,
html:not(.dark) select:focus{
  border-color:rgba(37,99,235,.5) !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.12), inset 0 1px 2px rgba(23,37,84,.04) !important;
}

/* ── 表格：更轻的分隔线与悬停高亮 ── */
html:not(.dark) table{ border-collapse:separate !important; border-spacing:0 !important; }
html:not(.dark) th{ background:rgba(240,246,255,.7) !important; font-weight:650 !important; }
html:not(.dark) tbody tr:hover{ background:rgba(37,99,235,.045) !important; }

/* ── 侧边栏 / 菜单：玻璃 ── */
html:not(.dark) aside,
html:not(.dark) [class*="sidebar"]{
  background:rgba(255,255,255,.55) !important;
  backdrop-filter:blur(18px) saturate(180%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(180%) !important;
}

/* ── 弹窗 / 抽屉：玻璃 ── */
html:not(.dark) [role="dialog"],
html:not(.dark) [class*="DialogContent"],
html:not(.dark) [class*="SheetContent"]{
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:blur(26px) saturate(190%) !important;
  -webkit-backdrop-filter:blur(26px) saturate(190%) !important;
  border:1px solid rgba(255,255,255,.85) !important;
  box-shadow:0 24px 64px rgba(23,37,84,.18) !important;
}

/* ── 徽标 / 标签：统一色系 ── */
html:not(.dark) [class*="bg-blue-"][class*="rounded"],
html:not(.dark) .badge{
  border-radius:9px !important;
}

/* ── 滚动条：细、圆、低干扰 ── */
html:not(.dark) ::-webkit-scrollbar{ width:10px; height:10px; }
html:not(.dark) ::-webkit-scrollbar-thumb{
  background:rgba(37,99,235,.22); border-radius:6px; border:2px solid transparent; background-clip:content-box;
}
html:not(.dark) ::-webkit-scrollbar-thumb:hover{ background:rgba(37,99,235,.36); background-clip:content-box; }
html:not(.dark) ::-webkit-scrollbar-track{ background:transparent; }

/* ── 品牌 logo 统一尺寸（导航内） ── */
header img[src*="logo"], nav img[src*="logo"], a[href="/"] img{
  height:28px !important; width:auto !important; object-fit:contain;
}

/* ── 暗色模式：保持克制的玻璃（不强行改底色，避免与站点主题打架） ── */
html.dark header, html.dark nav[class*="sticky"]{
  background:rgba(15,23,42,.62) !important;
  backdrop-filter:blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter:blur(20px) saturate(180%) !important;
}
html.dark [role="dialog"]{
  backdrop-filter:blur(26px) saturate(180%) !important;
  -webkit-backdrop-filter:blur(26px) saturate(180%) !important;
}

/* ── 动效偏好 ── */
@media (prefers-reduced-motion:reduce){
  html:not(.dark) button, html:not(.dark) a{ transition:none !important; }
}