/* ============================================================
   图漾文档中心 · sphinx_rtd_theme 品牌色覆盖
   原则：主题结构与版式保持原生（与 percipiodc、ucvedc 同一主题），
   只把颜色换成品牌色表。
   色值出处：spec\00-通用规范.md 第 5 节「视觉与品牌规范」。
   ============================================================ */

:root {
  --pc-red:      #BE3C1E;  /* 强调色（图漾红）：只作强调，不作大面积底色 */
  --pc-red-deep: #87281E;  /* 深红强调态 */
  --pc-topbar:   #F5F5F5;  /* 顶栏底色（也用于侧栏搜索区） */
  --pc-border:   #E1E4E5;  /* 分隔线 */
  --pc-gray:     #C9CACA;  /* 标准灰 */
  --pc-muted:    #898989;  /* 辅助说明 */
  --pc-text-2:   #595757;  /* 次要文字 */
  --pc-text:     #241916;  /* 正文近黑 */
  --pc-bg-soft:  #FAFAFA;  /* 浅背景（悬停态、当前项） */
}

/* ---------- 自定义顶栏（A16：侧栏右侧、正文正上方） ---------- */

.percipio-header {
  position: fixed;
  top: 0;
  left: 300px;                 /* 与主题侧栏同宽，侧栏通顶 */
  right: 0;
  height: 56px;
  z-index: 250;
  display: flex;
  align-items: center;
  gap: 26px;
  padding: 0 24px;
  background: var(--pc-topbar);
  border-bottom: 1px solid var(--pc-border);
}

.percipio-header .ph-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--pc-text);
}
.percipio-header .ph-brand svg { width: 16px; height: 16px; }
.percipio-header .ph-brand:hover { color: var(--pc-red); }

/* 顶栏西文（品牌字样 + 导航链接）与 home 图标光学对齐：
   行盒居中 / 基线对齐都会让西文视觉中心比图标高约 2px，两处一起下移补偿 */
.percipio-header .ph-brand span,
.percipio-header .ph-nav a { position: relative; top: 2px; }

/* 组间竖线分隔符（1px 灰线隔开产品链接与外部链接） */
.percipio-header .ph-sep {
  width: 1px;
  height: 16px;
  background: var(--pc-border);
}

/* 基线对齐：中/西文链接行盒高度不同（中文约21px、西文约17px），
   按盒子居中会让西文（Robot Vision Suite）基线偏高，改基线对齐保证同一行 */
.percipio-header .ph-nav { display: flex; align-items: baseline; gap: 35px; }
.percipio-header .ph-nav .ph-sep { margin: 0 -17.5px; align-self: center; }  /* 竖线无文字基线，单独垂直居中；负边距抵消其作为 flex 子项吃掉的两侧 gap，使整体间距均匀 */
.percipio-header .ph-nav a { font-size: 14px; color: var(--pc-text-2); }
.percipio-header .ph-nav a:hover { color: var(--pc-red); }
.percipio-header { overflow-x: auto; }
.percipio-header .ph-brand,
.percipio-header .ph-nav { flex-shrink: 0; white-space: nowrap; }
.percipio-header .ph-nav a.ph-external::after {
  content: "↗";
  font-size: 11px;
  margin-left: 3px;
  color: var(--pc-muted);
}

/* 正文下移避开顶栏；页内锚点跳转不被顶栏遮住 */
.wy-nav-content-wrap { padding-top: 56px; }
.rst-content [id] { scroll-margin-top: 64px; }

@media screen and (max-width: 768px) {
  .percipio-header { left: 0; }
}

/* ---------- 全局文字与链接 ---------- */

body { color: var(--pc-text); }

/* ---------- 下载中心 ---------- */

.rst-content table.dc-download-table { width: 100%; table-layout: fixed; }
.rst-content table.dc-download-table th,
.rst-content table.dc-download-table td {
  white-space: normal;
  overflow-wrap: anywhere;
  padding: 16px 12px;
  border: 0;
  border-bottom: 1px solid var(--pc-border);
  background: #ffffff;
  vertical-align: middle;
}
.rst-content table.dc-download-table { border: 0; font-size: 14px; }
.rst-content table.dc-download-table th { color: var(--pc-text-2); font-weight: 400; padding-top: 8px; padding-bottom: 8px; }
.rst-content table.dc-download-table td:first-child { font-weight: 600; }
.rst-content table.dc-download-table th:last-child,
.rst-content table.dc-download-table td:last-child { padding-right: 0; }
.rst-content table.dc-download-table td p { margin-bottom: 0; }

/* 表格内链接沿用全局规则：默认亮红、悬停深红 */

.dc-download-tabs { display: flex; align-items: baseline; gap: 28px; margin-bottom: 28px; border-bottom: 1px solid var(--pc-border); }
.rst-content .dc-download-tabs a {
  font-family: inherit;
  font-size: 16px;
  line-height: 24px;
  padding: 12px 0;
  border-bottom: 3px solid transparent;
  color: var(--pc-text-2);
  white-space: nowrap;
}
.rst-content .dc-download-tabs a[aria-current="page"] { color: var(--pc-red); border-bottom-color: var(--pc-red); font-weight: 600; }
.dc-download-tabs a:focus-visible { outline: 2px solid var(--pc-red); outline-offset: 3px; }
.rst-content #software[hidden],
.rst-content #sdk[hidden],
.rst-content #documents[hidden],
.rst-content #history[hidden] { display: none !important; }

.rst-content img.dc-software-logo { width: 32px; height: 32px; object-fit: contain; vertical-align: middle; margin-right: 10px; }
.dc-download-pending { color: var(--pc-muted); font-size: 13px; }
.dc-format-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 5px;
  border-radius: 3px;
  background: var(--pc-topbar);
  color: var(--pc-text-2);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.5;
  vertical-align: 1px;
  white-space: nowrap;
}

/* ---------- 历史标签：小节标题做成可点击的浅灰条，默认折叠 ---------- */

.dc-collapsible > h2,
.dc-collapsible > h3 {
  position: relative;
  margin: 24px 0 12px;
  padding: 10px 44px 10px 14px;
  background: var(--pc-topbar);
  border: 1px solid var(--pc-border);
  border-radius: 4px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  user-select: none;
  transition: background .15s ease, border-color .15s ease;
}
.dc-collapsible > h2::after,
.dc-collapsible > h3::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid var(--pc-text-2);
  border-bottom: 1.5px solid var(--pc-text-2);
  transform: translateY(-70%) rotate(45deg);
  transition: transform .15s ease;
}
.dc-collapsible.is-collapsed > h2::after,
.dc-collapsible.is-collapsed > h3::after {
  transform: translateY(-70%) rotate(-45deg);
}
.dc-collapsible.is-collapsed > :not(h2):not(h3) {
  display: none;
}
.dc-collapsible > h2:hover,
.dc-collapsible > h3:hover {
  background: #EFEFEF;
  border-color: var(--pc-gray);
}
.dc-collapsible > h2:focus-visible,
.dc-collapsible > h3:focus-visible {
  outline: 2px solid var(--pc-red);
  outline-offset: 3px;
}

/* 正文链接：默认亮图漾红（品牌感强，主页卡片等零散链接最好看），
   悬停加深为深红；已访问保持亮红不变（抵消主题紫色 visited 色） */
a { color: var(--pc-red); }
a:hover { color: var(--pc-red-deep); }
a:visited { color: var(--pc-red); }

.wy-breadcrumbs li:not(.wy-breadcrumbs-aside),
.wy-breadcrumbs li:not(.wy-breadcrumbs-aside) a,
.wy-breadcrumbs li:not(.wy-breadcrumbs-aside) a:visited,
.wy-breadcrumbs li:not(.wy-breadcrumbs-aside) a:hover,
.wy-breadcrumbs li:not(.wy-breadcrumbs-aside) a:focus,
.wy-breadcrumbs li:not(.wy-breadcrumbs-aside) a:active,
.wy-breadcrumbs li:not(.wy-breadcrumbs-aside) a.icon::before {
  color: var(--pc-red) !important;
}

/* 链接密集的页面统一用深红：正文区存在 ≥15 条项、且条目本身就是链接的
   紧密列表时（如 RVS 步骤参考、Camport4 SDK 的 API 一览表），
   整页正文链接统一为深红，避免同页亮红/深红混排；
   纯文字的步骤/清单列表不触发。悬停提亮回图漾红作反馈。
   浏览器不支持 :has() 时回退为全亮红。 */
.rst-content:has(li:nth-last-child(n+15) a) a,
.rst-content:has(li:nth-last-child(n+15) a) a:visited {
  color: var(--pc-red-deep);
}
.rst-content:has(li:nth-last-child(n+15) a) a:hover {
  color: var(--pc-red);
}

/* ---------- 内容区与侧栏统一为白底（去掉主题浅灰底） ---------- */

.wy-nav-content-wrap,
.wy-nav-content {
  background: #ffffff;
}

/* 正文区加宽：主题默认 800px 限宽是首页右侧大片空白的根源。
   放宽到 1000px。
   排法沿用主题默认：≥1100px 贴左、更窄居中。页脚在下方照抄同一套排法对齐。 */
.wy-nav-content {
  max-width: 1000px;
}

.wy-nav-side {
  background: #ffffff;
  color: var(--pc-text-2);
  border-right: 1px solid var(--pc-border);
}

/* 侧栏 logo 搜索区：用浅灰与正文区分（保留品牌色 #F5F5F5） */
.wy-side-nav-search {
  background: var(--pc-topbar);
  color: var(--pc-text);
  border-bottom: 1px solid var(--pc-border);
}

.wy-side-nav-search .wy-dropdown > a,
.wy-side-nav-search > a { color: var(--pc-text); }

.wy-side-nav-search input[type="text"] {
  background: #ffffff;
  border-color: var(--pc-border);
  color: var(--pc-text);
}
.wy-side-nav-search input[type="text"]:focus {
  border-color: var(--pc-red);
  outline: none;
}

/* ---------- 侧栏选择器（版本 / 语言 / 产品）
   行布局：左侧名称标签，右侧当前值 + 下拉箭头 ---------- */

.dc-selectors {
  display: flex;
  flex-direction: column;
  margin: 16px 2px 8px;
}
.dc-select-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 2px;
  border-bottom: 1px solid var(--pc-border);
}
.dc-select-row:last-child { border-bottom: none; }

.dc-select-label {
  font-size: 14px;
  color: var(--pc-text-2);
  white-space: nowrap;
}

/* 下拉值：去掉原生框体，只保留文字与右侧箭头 */
.dc-select-field { position: relative; }
.dc-select-field::after {
  content: "";
  position: absolute;
  right: 2px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid var(--pc-text-2);
  border-bottom: 1.5px solid var(--pc-text-2);
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}
.dc-selectors select.dc-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  max-width: 150px;
  padding: 0 16px 0 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 14px;
  color: var(--pc-text);
  text-align-last: right;
  cursor: pointer;
}
/* 去掉点击/聚焦时浏览器画的框（各状态全清） */
.dc-selectors select.dc-select:hover,
.dc-selectors select.dc-select:focus,
.dc-selectors select.dc-select:active,
.dc-selectors select.dc-select:focus-visible {
  border: 0;
  outline: none;
  box-shadow: none;
  background: transparent;
}
.dc-selectors select.dc-select:hover { color: var(--pc-red); }
.dc-selectors select.dc-select:focus { color: var(--pc-red); }

/* ---------- 目录树 ---------- */

.wy-menu-vertical a { color: var(--pc-text-2); }
.wy-menu-vertical a:hover {
  background: var(--pc-bg-soft);
  color: var(--pc-red);
}
.wy-menu-vertical a:hover button.toctree-expand { color: var(--pc-red); }

/* 当前页：浅底 + 左侧红色标记 */
.wy-menu-vertical li.on a,
.wy-menu-vertical li.current > a {
  color: var(--pc-text);
  font-weight: 700;
  background: var(--pc-bg-soft);
  border-left: 2px solid var(--pc-red);
}
.wy-menu-vertical li.current > a button.toctree-expand { color: var(--pc-text); }

.wy-menu-vertical li.toctree-l1.current > a {
  border-top: 1px solid var(--pc-border);
  border-bottom: 1px solid var(--pc-border);
}

/* ---------- 移动端顶条 ---------- */

.wy-nav-top {
  background: var(--pc-topbar);
  color: var(--pc-text);
  border-bottom: 1px solid var(--pc-border);
}
.wy-nav-top a { color: var(--pc-text); }

/* ---------- 首页卡片（与相机域同一款 sphinx_design 卡片） ---------- */

.sd-card {
  border: 1px solid var(--pc-border);
  border-radius: 6px;
  box-shadow: none;
}
.sd-card:hover { border-color: var(--pc-red); }

/* 两张卡片等高 */
.sd-card.dc-card {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.sd-card.dc-card .sd-card-body { flex: 1; }

/* 配图统一为同一高度、完整显示（contain，不裁切，保证 RVS 图中文字可见） */
.sd-card.dc-card img.sd-card-img-top {
  width: 100%;
  height: 200px;
  object-fit: contain;
  background: #ffffff;
}

/* RVS 图为正方形 logo（内容占满整块），同高下视觉块面明显大于相机横幅图；
   保持图片框 200px 高（两卡片等高）不变，靠上下内边距把 logo 缩到约 120px，
   与相机图视觉重量接近 */
.sd-card.dc-card-rvs img.sd-card-img-top {
  padding: 40px 0;
}

/* 标题明显大于正文 */
.sd-card.dc-card .sd-card-title {
  font-size: 19px;
  font-weight: 600;
  color: var(--pc-text);
  margin-bottom: 10px;
}
.sd-card.dc-card .sd-card-body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--pc-text-2);
}

/* 悬停动效过渡（上浮、阴影、描边变色统一渐变） */
.sd-card.dc-card {
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

/* 方案 D（图片垫底）配图同样等高完整显示 */
.sd-card.dc-card img.sd-card-img-bottom {
  width: 100%;
  height: 200px;
  object-fit: contain;
  background: #ffffff;
}

/* ---------- 卡片备选样式（demo-cards 演示页专用，选定后只保留选中项） ---------- */
/* 注：docutils 会把 class 名转为小写，选择器必须用小写 .vb/.vc/.ve */

/* 方案 B 极简留白：无边框，悬停上浮 + 柔和阴影 + 标题变红 */
.sd-card.vb { border: none; border-radius: 0; }
.sd-card.vb:hover {
  border: none;
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(36, 25, 22, .08);
}
.sd-card.vb:hover .sd-card-title { color: var(--pc-red); }

/* 方案 C 轻阴影：常驻小阴影，悬停阴影加深 + 微浮 */
.sd-card.vc { box-shadow: 0 1px 3px rgba(36, 25, 22, .10); }
.sd-card.vc:hover {
  box-shadow: 0 8px 20px rgba(36, 25, 22, .16);
  transform: translateY(-2px);
  border-color: var(--pc-gray);
}

/* 方案 E 左红条：左缘品牌红竖条，悬停变深红（整卡描边不变红） */
.sd-card.ve { border-left: 3px solid var(--pc-red); }
.sd-card.ve:hover {
  border-color: var(--pc-border);
  border-left-color: var(--pc-red-deep);
}

/* 方案 F：通栏 + 标题条 + 常驻中等阴影 + 正文小图
   标题条按品牌规范用浅灰 #F5F5F5 底 + 近黑字（图漾红不作大面积底色） */
.sd-card.vf {
  border: none;
  box-shadow: 0 4px 8px rgba(36, 25, 22, .10);
}
.sd-card.vf:hover {
  border: none;
  box-shadow: 0 8px 16px rgba(36, 25, 22, .16);
  transform: translateY(-2px);
}
.sd-card.vf .sd-card-header {
  background: var(--pc-topbar);
  border-bottom: 1px solid var(--pc-border);
  font-size: 17px;
  font-weight: 700;
  color: var(--pc-text);
}

/* ---------- 页脚（白底方案：符合 VI，黑字灰链接细线分隔） ---------- */

/* 关键：主题把 .wy-grid-for-nav 设为 position:absolute + height:100%
   （脱离文档流且虚高），导致其后的页脚飘到页面顶部。
   改为相对定位、高度自适应，页脚才会被推到内容下方。 */
.wy-grid-for-nav {
  position: relative;
  height: auto;
}

.pc-footer {
  margin-left: 300px;            /* 避开左侧栏，只占内容列 */
  background: #ffffff;
  border-top: 1px solid var(--pc-border);
  color: var(--pc-text);
}
.pc-footer-inner {
  max-width: 1000px;             /* 与正文同宽 */
  margin: 0 auto;                /* 照抄正文区排法：<1100px 时主题让正文居中 */
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 24px 28px;
  /* 左右缩进与上方卡片列精确对齐：
     正文区内边距 3.236em（51.776px）+ 卡片栅格自身缩进 12px。
     实测对齐过，勿随意改动。 */
  padding: 22px calc(3.236em + 12px) 26px;
}
.pc-footer-col {
  display: flex;
  flex-direction: column;        /* 标题在上一行，条目在下一行 */
  align-items: flex-start;
  gap: 10px;
}
.pc-footer-title {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  color: var(--pc-text);
}
.pc-footer-title a { color: inherit; }
.pc-footer-title a:hover { color: var(--pc-red); }
.pc-footer-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;            /* 条目横排 */
  align-items: center;
  gap: 14px;
  font-size: 13px;
}
.pc-footer-links a { color: var(--pc-text-2); }     /* 次要文字，悬停变品牌红 */
.pc-footer-links a:hover { color: var(--pc-red); }

/* 外部链接小箭头 */
.pc-footer-links a.pc-ext::after {
  content: "↗";
  font-size: 11px;
  margin-left: 3px;
  opacity: .7;
}

/* 微信二维码：悬停文字时在上方弹出小图（正方形，白底描边） */
.pc-wechat {
  position: relative;
  color: var(--pc-text-2);
  cursor: pointer;
}
.pc-wechat:hover { color: var(--pc-red); }
.pc-wechat .pc-qr {
  display: none;
  position: absolute;
  left: 0;
  bottom: calc(100% + 10px);
  width: 120px;
  height: 120px;
  max-width: none;               /* 抵消主题全局 img{max-width:100%}：
                                     该规则参照悬停文字的宽度，会把弹图压成窄条 */
  padding: 4px;
  background: #ffffff;
  border: 1px solid var(--pc-border);
  border-radius: 4px;
  box-shadow: 0 4px 16px rgba(36, 25, 22, .18);
  object-fit: contain;           /* 正方形完整显示，不压缩 */
}
.pc-wechat:hover .pc-qr { display: block; }

/* 桌面端三列保持同一行：空间不足时由第一列内部换行，
   避免免责声明被挤到第二行。 */
@media screen and (min-width: 960px) {
  .pc-footer-inner { flex-wrap: nowrap; }
  .pc-footer-col:first-child { min-width: 0; }
  .pc-footer-col:first-child .pc-footer-links { flex-wrap: wrap; row-gap: 6px; }
}

/* 宽屏(≥1100px)时主题把正文区改为贴左(margin:0)，
   页脚照抄，两边的左缘才能在任何窗口宽度都对齐。 */
@media screen and (min-width: 1100px) {
  .pc-footer-inner { margin: 0; }
}

@media screen and (max-width: 768px) {
  .pc-footer { margin-left: 0; }
  .pc-footer-inner {
    gap: 40px;
    padding-left: calc(1.618em + 12px);   /* 移动端正文内边距为 1.618em，同样对齐 */
    padding-right: calc(1.618em + 12px);
  }
}
