/* SOIN TokenHub 全站统一浅色品牌主题（SPA：模型广场/关于/控制台/登录等） [AI 注释]
   依据老板 2026-11-04 指示：所有页面保持与首页落地页一致的配色风格和文字样式，取消深浅模式开关。
   关键发现：rc.47 前端是 Tailwind v4 + shadcn 语义变量体系（工具类直接引用 var(--primary) 等），
   所以本文件只覆盖语义 token + 字体，全站自动生效；旧 Semi 类名覆盖已验证无效，已删除。
   色板 = 落地页 brand/home.html 同源：主蓝 #006ee9 / 墨色 #102943 / 灰蓝 #64748b / 浅底 #f5f7fb / 边框 #e3e9f2
   主题由注入脚本强制 theme-mode=light。如与最新指令冲突，以老板为准。 */

:root,
body {
  /* 核心语义 token */
  --background: #ffffff !important;
  --foreground: #102943 !important;
  --card: #ffffff !important;
  --card-foreground: #102943 !important;
  --popover: #ffffff !important;
  --popover-foreground: #102943 !important;
  --primary: #006ee9 !important;
  --primary-foreground: #ffffff !important;
  --secondary: #f5f7fb !important;
  --secondary-foreground: #102943 !important;
  --muted: #f5f7fb !important;
  --muted-foreground: #64748b !important;
  --accent: #eef6ff !important;
  --accent-foreground: #0057c2 !important;
  --border: #e3e9f2 !important;
  --input: #dbe4f0 !important;
  --ring: #006ee9 !important;

  /* 控制台侧边栏 */
  --sidebar: #fafbfd !important;
  --sidebar-foreground: #102943 !important;
  --sidebar-border: #e3e9f2 !important;
  --sidebar-primary: #006ee9 !important;
  --sidebar-primary-foreground: #ffffff !important;
  --sidebar-accent: #eef6ff !important;
  --sidebar-accent-foreground: #0057c2 !important;
  --sidebar-ring: #006ee9 !important;

  /* 图表色（品牌蓝系） */
  --chart-1: #006ee9 !important;
  --chart-2: #2b86f0 !important;
  --chart-3: #102943 !important;
  --chart-4: #64a8f5 !important;
  --chart-5: #0057c2 !important;

  /* 字体对齐落地页（Arial + 中文回退） */
  --font-sans: Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif !important;
  --font-ui-sans: Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif !important;
}

html, body {
  font-family: Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif !important;
  color: #102943 !important;
  background: #ffffff !important;
}

/* ===== 隐藏顶栏的主题切换 / 语言切换按钮 [AI 注释] 依据老板指示取消深浅模式开关和多国语言切换；多语言 aria-label 兜底由注入脚本处理 */
button[aria-label="切换主题"],
button[aria-label="Toggle theme"],
button[aria-label="切換主題"],
button[aria-label="Changer de thème"],
button[aria-label="テーマを切り替え"],
button[aria-label="Сменить тему"],
button[aria-label="Thay đổi chủ đề"],
button:has(> svg.lucide-sun),
button:has(> svg.lucide-moon),
button:has(> svg.lucide-languages),
button[data-slot="dropdown-menu-trigger"]:has(> svg.lucide-sun),
button[data-slot="dropdown-menu-trigger"]:has(> svg.lucide-moon) { display: none !important; }

/* ===== About 页 markdown 排版（对齐落地页文字风格） [AI 注释] 裸元素选择器，不影响 Tailwind 组件（类选择器优先级更高） */
p, li { color: #2b4463; }
strong { color: #102943; }
hr { border: none; border-top: 1px solid #e3e9f2; }
blockquote {
  border-left: 3px solid #006ee9;
  background: #f5f7fb;
  color: #5b7089;
  margin: 0;
  padding: 8px 16px;
}
pre {
  background: #f6f8fb;
  border: 1px solid #e3e9f2;
  border-radius: 8px;
  padding: 14px;
  overflow-x: auto;
}
pre code { background: transparent; color: #102943; padding: 0; }
code {
  background: rgba(0, 110, 233, .08);
  color: #0057c2;
  border-radius: 4px;
  padding: 2px 6px;
  font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
}
table { border-collapse: collapse; }
th, td { border: 1px solid #e3e9f2; padding: 8px 12px; color: #2b4463; }
th { background: #f5f7fb; color: #102943; }
tr:nth-child(2n) td { background: #fafbfd; }

/* ===== 统一 banner v2 [AI 注释] 依据老板 2026-11-04 指示「/about /docs/ /pricing 每个页面
   都要有 banner 区域，保持一致的 banner 高度，导航要留出来高度」：
   ① 弃用 CSS 移植原生 hero 的老路（原生 hero 与模型网格同容器，无法整体替换），
      改由 soin-nav.js 注入 .soin-banner 组件（/pricing /about），样式数值取自 home.html .hero
      （深蓝渐变 + 双色光晕 + 蓝色 overline + 白色大标题 + 灰蓝副文案）；
   ② 高度统一 320px，其中 padding-top 64px 为固定导航避让，三站同一数值；
   ③ 原生 hero 文字块/装饰层/搜索框隐藏（模型网格在同一容器，不可整块隐藏）。
   话术为 AI 拟稿，如与老板口径冲突以老板为准。 */
body div.relative:has(> div > header > h1) {
  background: #ffffff !important;
}
body div.relative:has(> div > header > h1) > div[aria-hidden="true"] {
  display: none !important;
}
div[class*="max-w-[1800px]"] > header {
  display: none !important;
}
/* banner 注入后，内容容器顶部留 32px 呼吸位（原生 pt-16/pt-20 是给固定导航的，banner 已自带避让） */
body.soin-has-banner div[class*="max-w-[1800px]"],
body.soin-has-banner main.container {
  padding-top: 32px !important;
}
.soin-banner {
  position: relative;
  overflow: hidden;
  height: 320px;
  box-sizing: border-box;
  margin-top: 64px; /* SPA 固定导航悬浮在文档流之上，banner 必须整体下移 64px 从导航下沿开始（文档站导航占流内位置无需此值） */
  /* padding-top 已去掉：banner 已通过 margin-top(SPA)/文档流位置(文档站)避开 64px 导航，
     内部再避让一次会让文字整体偏低 32px、不在垂直居中位 [AI 注释] 依据老板 2026-11-04 反馈 */
  display: flex;
  align-items: center;
  background: linear-gradient(120deg, #081426 0%, #0d2240 55%, #081426 100%);
}
.soin-banner::before {
  content: "";
  position: absolute;
  top: -260px; right: -160px; width: 760px; height: 520px;
  background: radial-gradient(closest-side, rgba(0, 110, 233, .32), transparent);
  pointer-events: none;
}
.soin-banner::after {
  content: "";
  position: absolute;
  bottom: -300px; left: -200px; width: 700px; height: 520px;
  background: radial-gradient(closest-side, rgba(8, 116, 209, .22), transparent);
  pointer-events: none;
}
.soin-banner-inner {
  position: relative; z-index: 1;
  max-width: 1120px; margin: 0 auto; padding: 0 24px;
  width: 100%; box-sizing: border-box;
}
.soin-banner-overline {
  color: #4da3ff; font-size: 14px;
  display: inline-flex; align-items: center; gap: 12px;
}
.soin-banner-overline::before {
  content: ""; width: 28px; height: 2px; background: #4da3ff; display: inline-block;
}
.soin-banner h1 {
  font-size: 44px; line-height: 1.2; font-weight: bold;
  color: #ffffff; margin: 14px 0 0; letter-spacing: 0;
}
.soin-banner-sub {
  max-width: 680px; margin: 16px 0 0;
  color: #b9c9dd; font-size: 16px; line-height: 1.7;
}
@media (max-width: 768px) {
  .soin-banner { height: auto; padding: 96px 0 56px; }
  .soin-banner h1 { font-size: 32px; }
}

/* 强制结束 hero 入场动画 [AI 注释] 实测 JS 内联 style opacity:0/blur(4px) 偶发卡住不结束，
   用 !important 直接锁终态（本就是动画终点值），页面内容不再依赖动画时序 */
div[class*="max-w-[1800px]"] {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

/* 顶栏与落地页头部完全一致：白底全宽条 + 描边 + 墨色文字 + 蓝色登录按钮 [AI 注释]
   依据老板 2026-11-04 指示「导航文字跟首页保持一致、头部统一」；
   实测顶栏结构：header.fixed.pointer-events-none（fixed 全宽透明条）> div > nav.h-16 */
body header.fixed.pointer-events-none {
  background: #ffffff !important;
  border-bottom: 1px solid #e3e9f2 !important;
  pointer-events: auto !important;
}
body header.fixed.pointer-events-none nav a {
  color: #102943 !important;
}
body header.fixed.pointer-events-none nav a:hover {
  color: #006ee9 !important;
}
body header.fixed.pointer-events-none span {
  color: #102943 !important;
}
body header.fixed.pointer-events-none a[href="/sign-in"],
body header.fixed.pointer-events-none a[href*="sign-in"] {
  background: #006ee9 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
}
/* active 导航项 = 蓝底白字胶囊（全站统一，落地页主蓝）；子元素一并强制白色，
   防止链接内部带颜色类的 span 盖过 a 的颜色（实测 active 项深色不可见的根因） */
nav a[data-status="active"],
nav a.active {
  background: #006ee9 !important;
  color: #ffffff !important;
  border-radius: 8px;
}
nav a[data-status="active"] *,
nav a.active * {
  color: #ffffff !important;
}

/* ===== About 页卡片化 [AI 注释] 依据老板 2026-11-04 指示「该加卡片加卡片，大白页面不要裸奔」；
   容器结构（Edge 无头实测）：main.container > div.mx-auto.max-w-6xl > prose div，如与最新指令冲突以老板为准 */
body main.container div.mx-auto.max-w-6xl {
  background: #ffffff !important;
  border: 1px solid #e3e9f2 !important;
  border-radius: 16px !important;
  padding: 36px 40px !important;
  box-shadow: 0 1px 3px rgba(16, 41, 67, .05);
  margin-top: 12px !important;
}
body main.container h1 {
  color: #102943 !important;
  font-size: 26px !important;
  margin-bottom: 14px;
}
body main.container h2 {
  color: #102943 !important;
  font-size: 19px !important;
  margin-top: 30px !important;
  padding-top: 18px !important;
  border-top: 1px solid #e3e9f2 !important;
}
body main.container a { color: #006ee9; }
body main.container a:hover { color: #0057c2; }

/* ===== 用户协议/隐私政策页全局统一 [AI 注释] 依据老板 2026-11-04 指示
   「/user-agreement /privacy-policy 页面样式没有全局统一」：
   部署版实际结构（Edge 无头 dump 实测，与本地 rc.47 源码的 DocumentRenderer 不同）：
   div.max-w-4xl.space-y-6.py-12 容器（896px 窄）+ 原生 h1.text-3xl「用户协议」+
   markdown 裸元素。与全站脱节：无 banner 无页脚、宽度 896px、标题与 banner 重复。
   修复：① 容器压到 1120px 并白卡化（描边/圆角/阴影/内边距对齐关于页）；
   ② 隐藏原生 h1.text-3xl（banner 已有大标题，markdown H1 才是正文标题）；
   ③ markdown h1/h2/h3 品牌化排版。banner/页脚由 soin-nav.js 白名单注入。
   如与最新指令冲突，以老板为准。 */
body div.max-w-4xl.space-y-6 {
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  background: #ffffff !important;
  border: 1px solid #e3e9f2 !important;
  border-radius: 16px !important;
  box-shadow: 0 1px 3px rgba(16, 41, 67, .05);
  padding: 36px 40px !important;
  box-sizing: border-box !important;
}
/* 原生页面标题隐藏：与 banner h1、markdown h1 三层重复（实测非直接子元素，用后代选择器） */
body div.max-w-4xl.space-y-6 h1.text-3xl {
  display: none !important;
}
body div.max-w-4xl.space-y-6 h1:not(.text-3xl) {
  color: #102943 !important;
  font-size: 26px !important;
  font-weight: bold !important;
  margin: 0 0 14px !important;
}
body div.max-w-4xl.space-y-6 h2 {
  color: #102943 !important;
  font-size: 19px !important;
  font-weight: bold !important;
  margin-top: 30px !important;
  padding-top: 18px !important;
  border-top: 1px solid #e3e9f2 !important;
}
body div.max-w-4xl.space-y-6 h3 {
  color: #102943 !important;
  font-size: 16px !important;
  font-weight: bold !important;
}
body div.max-w-4xl.space-y-6 a { color: #006ee9; }
body div.max-w-4xl.space-y-6 a:hover { color: #0057c2; }

/* ===== 认证页（登录/注册/忘记密码）全局统一 [AI 注释] 依据老板 2026-11-04 指示
   「/sign-in /sign-up /forgot-password 页面样式没有全局统一，包括头部导航都要保持一致」：
   原生结构（Edge 无头 dump 实测）：div.relative.grid.h-svh.max-w-none 全屏容器 +
   左上角原生小 logo + 居中 480px 裸表单，无统一导航、无页脚。
   修复：① 隐藏左上角原生 logo（导航里已有统一 logo，重复）；② 放开 100svh 满屏让页脚
   紧跟内容、内容区最小高让表单大致垂直居中；③ 表单容器卡片化（描边/圆角/阴影对齐全站）。
   统一导航由 soin-nav.js 在无 header.fixed 时创建容器注入；页脚由白名单注入。
   不加深蓝 banner：功能页保持表单焦点，避免一屏内看不到表单。如与最新指令冲突，以老板为准。 */
body div.relative.grid.h-svh.max-w-none > a.absolute.top-4 {
  display: none !important;
}
body div.relative.grid.h-svh.max-w-none {
  height: auto !important;
  min-height: 0 !important;
}
body div.relative.grid.h-svh.max-w-none > div.container {
  /* min-height 由 soin-nav.js fixAuthHeight() 动态设为 视口高-页脚高，页脚精确贴底
     [AI 注释] 依据老板 2026-11-04 指示「有底部的页面不要底部再出现大白空白」 */
  align-items: center !important;
  padding-top: 96px !important;
  padding-bottom: 48px !important;
  box-sizing: border-box !important;
}
body div.relative.grid.h-svh.max-w-none div[class*="w-[480px]"] {
  background: #ffffff !important;
  border: 1px solid #e3e9f2 !important;
  border-radius: 16px !important;
  box-shadow: 0 1px 3px rgba(16, 41, 67, .05) !important;
  box-sizing: border-box !important;
}

/* ===== 修正：蓝胶囊白字必须压过白底墨字规则（特异性对齐并置于其后） [AI 注释]
   实测墨色规则 (0,2,5) 压过胶囊规则 (0,1,2) 导致蓝底出现黑字，老板 2026-11-04 指出 */
body header.fixed.pointer-events-none nav a[data-status="active"],
body header.fixed.pointer-events-none nav a.active {
  background: #006ee9 !important;
  color: #ffffff !important;
  border-radius: 8px;
}
body header.fixed.pointer-events-none nav a[data-status="active"] *,
body header.fixed.pointer-events-none nav a.active * {
  color: #ffffff !important;
}
/* ===== logo 三站统一：图标 36px + 18px 粗体（落地页基准） [AI 注释] 老板指出 logo 大小不一致 */
body header.fixed.pointer-events-none div.size-7,
body header.fixed.pointer-events-none img[alt="logo"] {
  width: 36px !important;
  height: 36px !important;
}
body header.fixed.pointer-events-none span[title="SOIN TokenHub"] {
  font-size: 18px !important;
  font-weight: 700 !important;
}

/* ===== 头部整体替换 v2 [AI 注释] 依据老板 2026-11-04 指示「完全 100% 一致的头部导航样式」：
   不再修补原生头部，由 soin-nav.js 注入 .soin-hd（与落地页 brand/home.html 的 nav 同构同源），
   原生头部所有子元素全部隐藏。样式数值取自 home.html：<nav> 白底 + 下边框 #e5ebf1；
   .nav-inner 1120px 容器/64px 高/24px 内边距；
   .nav-links 14px #64748b 间距 32px；.nav-cta 蓝底白字 8px 20px 圆角 4px 粗体。
   html.soin-hd-on 由脚本控制（/console 不接管）。
   实色 [AI 注释] 依据老板 2026-11-04 指示「顶部导航要实色，一滚动就透明」：
   原 rgba(255,255,255,.92)+blur 磨砂改为纯白实色，滚动时内容不再透出。 */
html.soin-hd-on body header.fixed.pointer-events-none {
  background: #ffffff !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: 1px solid #e5ebf1 !important;
  pointer-events: auto !important;
  z-index: 100 !important;
}
html.soin-hd-on body header.fixed.pointer-events-none > *:not(.soin-hd) {
  display: none !important;
}
/* ===== 控制台原生头部实色 [AI 注释] 依据老板 2026-11-04 指示「控制台顶部导航要实色，
   一滚动导航就透明」：控制台（/console 等不接管路径）用原生 sticky 头部
   （web/src/components/layout/headerbar/index.jsx:68），类名 bg-white/75 + backdrop-blur-lg，
   75% 半透明+毛玻璃，滚动时页面内容透出显花。强制纯白实色并关掉模糊；
   公共页头部是 fixed 不受影响。如与最新指令冲突，以老板为准。 */
body header.sticky.top-0 {
  background: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid #e5ebf1 !important;
}
.soin-hd {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 24px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  pointer-events: auto;
}
.soin-hd-logo { display: flex; align-items: center; text-decoration: none; }
.soin-hd-logo img { height: 36px; width: auto; display: block; }
.soin-hd-links { display: flex; align-items: center; gap: 32px; }
.soin-hd-links a { font-size: 14px; color: #64748b; text-decoration: none; }
.soin-hd-links a:hover { color: #006ee9; }
.soin-hd-links a.soin-active,
.soin-hd-links a.soin-hd-cta {
  background: #006ee9;
  color: #ffffff;
  padding: 8px 20px;
  border-radius: 4px;
  font-weight: bold;
}
.soin-hd-links a.soin-active:hover,
.soin-hd-links a.soin-hd-cta:hover { background: #005bc4; color: #ffffff; }

/* ===== 内容宽度统一 1120px（对齐落地页 .container） [AI 注释]
   依据老板 2026-11-04 指示「页面宽度也不一致」：模型广场内容容器（原 max-w-[1800px]）
   与关于页 main.container 一律压到落地页同款 1120px 居中 */
div[class*="max-w-[1800px]"] {
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
body main.container {
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ===== 模型广场卡片网格压成 2 列 [AI 注释] 依据老板 2026-11-04 反馈「卡片样式重做、鬼能看清」：
   1120px 容器下 3 列每卡仅约 250px，价格/状态行挤爆重叠。
   原网格类：grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 → 全宽度强制 2 列（每卡约 400px，
   与全宽时代卡宽相当）。属性选择器避开 Tailwind 冒号类名的转义问题。 */
div[class~="xl:grid-cols-3"] {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* ===== 弹层层级修复 [AI 注释] Semi 弹层（筛选下拉等）抬到导航之上 */
.semi-portal,
.semi-sidesheet,
.semi-sidesheet-mask,
.semi-sidesheet-inner,
.semi-sidesheet-wrapper,
.semi-modal,
.semi-modal-mask {
  z-index: 2000 !important;
}
/* ===== 模型详情侧滑修复 [AI 注释] 依据老板 2026-11-04 反馈「详情弹出被导航压住/看不到，
   往下挪」。真相（主包 idx.js 实测）：该侧滑不是 Semi SideSheet，是 rc.47 的 Tailwind
   Sheet（Base UI，data-slot="sheet-content"，class 含 "fixed z-50 ... inset-y-0 right-0
   h-full"）——z-50 低于注入导航 z-100，顶部 64px 被导航盖住，标题行恰好卡在 64px 分界线
   被切一半。此前针对 .semi-sidesheet 的下移规则全是无效药。修复：面板 top 改 64px 从
   导航下沿开始、bottom:0 收尾；height:auto 防止 height:100% 与 top+bottom 过约束时
   bottom 被忽略导致底部溢出屏幕。如与最新指令冲突，以老板为准。 */
body [data-slot="sheet-content"] {
  top: 64px !important;
  bottom: 0 !important;
  height: auto !important;
}

/* ===== 页脚统一 [AI 注释] 依据老板 2026-11-04 指示「每个页面底部与首页一致」：
   .soin-ft 系列由脚本注入，样式数值逐一取自 home.html 的 footer（#0b1c30 底 /
   #8ea6c0 文字 / #1e3a5c 分隔线 / 1120px 容器 / 三栏 flex） */
.soin-ft { background: #0b1c30; color: #8ea6c0; padding: 56px 0 40px; }
.soin-ft-inner { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.soin-ft-big { font-size: 15px; color: #ffffff; text-align: center; margin-bottom: 34px; font-weight: bold; }
.soin-ft-grid { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 24px; border-top: 1px solid #1e3a5c; padding-top: 30px; font-size: 13px; }
.soin-ft-title { color: #ffffff; font-weight: bold; margin-bottom: 10px; }
.soin-ft-grid a { display: block; margin: 6px 0; color: #8ea6c0; text-decoration: none; }
.soin-ft-grid a:hover { color: #ffffff; }
.soin-ft-copy { margin-top: 30px; font-size: 12px; color: #5f7ea6; text-align: center; }
/* 公共页放开根容器满屏撑高，让页脚紧跟内容（否则短页页脚被顶到折叠线下） [AI 注释]
   控制台不受影响（html.soin-hd-on 仅公共页存在），保持其满屏布局 */
html.soin-hd-on div.min-h-svh { min-height: 0 !important; }

/* ===== 模型广场列表模式合理布局 [AI 注释] 依据老板 2026-11-04 反馈「列表模式下完全都
   看不清」。根因（部署版 dump-dom 实测）：列表是原生 table，列宽 = 百分比 colgroup +
   th 内联 px（合计 1130px），表格区在 1120 布局下仅约 820px——模型列被挤出视野、
   端点徽章 nowrap 挤成一团。修复三件：① 模型列 sticky 吸附左侧始终可见；
   ② 表格最小宽度 1250px 让横向滚动真正生效 + 滚动条可见；③ 端点列加宽、徽章换行排列。
   如与最新指令冲突，以老板为准。 */
html.soin-hd-on div[data-slot="table-container"] {
  overflow-x: auto !important;
}
html.soin-hd-on div[data-slot="table-container"]::-webkit-scrollbar {
  height: 8px;
}
html.soin-hd-on div[data-slot="table-container"]::-webkit-scrollbar-thumb {
  background: #c7d2e0;
  border-radius: 4px;
}
html.soin-hd-on div[data-slot="table-container"]::-webkit-scrollbar-track {
  background: #f1f5f9;
}
html.soin-hd-on div[data-slot="table-container"] table {
  min-width: 1250px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
/* 模型列吸附：横向滚动时模型名始终可见 */
html.soin-hd-on div[data-slot="table-container"] td[data-column-id="model_name"],
html.soin-hd-on div[data-slot="table-container"] th[data-column-id="model_name"] {
  position: sticky !important;
  left: 0 !important;
  z-index: 2 !important;
  background: #ffffff !important;
  border-right: 1px solid #e3e9f2 !important;
  min-width: 200px !important;
  width: 200px !important;
}
html.soin-hd-on div[data-slot="table-container"] thead th[data-column-id="model_name"] {
  background: #f8fafc !important;
}
/* 端点列：加宽 + 徽章换行，不再挤成一团 */
html.soin-hd-on div[data-slot="table-container"] td[data-column-id="supported_endpoint_types"],
html.soin-hd-on div[data-slot="table-container"] th[data-column-id="supported_endpoint_types"] {
  min-width: 210px !important;
  width: 210px !important;
}
html.soin-hd-on div[data-slot="table-container"] td[data-column-id="supported_endpoint_types"] > div,
html.soin-hd-on div[data-slot="table-container"] td[data-column-id="supported_endpoint_types"] > div > div {
  flex-wrap: wrap !important;
  overflow: visible !important;
  row-gap: 4px !important;
  white-space: normal !important;
}
html.soin-hd-on div[data-slot="table-container"] td[data-column-id="supported_endpoint_types"] [data-slot="status-badge"] {
  max-width: 100% !important;
}