/*
 * Origin Kudada 产品手册 - 基础样式
 * ------------------------------------------------------------
 * 维护原则：正文页面优先使用 MkDocs Material 原生 Markdown 样式。
 * 本文件只保留全站级别的品牌颜色、图片显示与少量基础调整，
 * 不在这里制作首页卡片、流程图、产品卡片等页面专用组件。
 */

body,
.md-main,
.md-content {
  background: var(--ok-page-bg);
  color: var(--ok-text);
}

/* 顶部导航采用项目主题深色；正文区域保持 Material 默认文档结构。 */
.md-header,
.md-tabs {
  background: var(--ok-header-bg) !important;
  background-color: var(--ok-header-bg) !important;
  color: var(--ok-header-text);
}

.md-header__title,
.md-header__button,
.md-header__topic {
  color: var(--ok-header-text);
}

/* 顶部不再显示企业 Logo，只保留产品标题。隐藏后标题自然左移。 */
.md-header__button.md-logo {
  display: none !important;
}

.md-header__title {
  margin-left: 0;
}

/* 左右目录不铺独立色块，与正文使用同一背景。 */
.md-sidebar--primary,
.md-sidebar--secondary,
.md-sidebar__scrollwrap,
.md-nav {
  background: var(--ok-page-bg);
}

.md-nav__link:hover,
.md-nav__link--active,
.md-nav__item .md-nav__link--active {
  color: var(--ok-link);
}


/* ==================== 标题层级 ====================
 * H1 保持 Material 的字号，仅将灰色略微加深。
 * H2 / H3 统一加粗，H3 明确小于 H2，方便长文档快速扫描。
 */
.md-typeset h1 {
  color: var(--ok-heading-1);
}

.md-typeset h2 {
  color: var(--ok-text-strong);
  font-weight: 700;
}

.md-typeset h3 {
  color: var(--ok-text-strong);
  font-size: 1rem;
  font-weight: 700;
}

/* 正文链接使用信息色，其他排版交给 MkDocs Material。 */
.md-typeset a {
  color: var(--ok-link);
}

.md-typeset a:hover {
  color: var(--ok-link-hover);
}

/* 普通正文图片自动居中。具体显示宽度由 images.js 根据原图比例计算。 */
.md-typeset img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  margin: 1rem auto;
}

.md-typeset img.doc-auto-image {
  width: min(100%, var(--doc-image-width, 760px));
}

/* ==================== Markdown 表格 ====================
 * Material 默认会按内容宽度收缩表格，列数较少时右侧会留下大块空白。
 * 这里仅让普通 Markdown 表格铺满正文宽度，不修改单元格配色和边框，
 * 因此后续新增表格无需额外 class，也不会破坏模板原生文档风格。
 */
.md-typeset__table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

.md-typeset__table > table,
.md-typeset table:not([class]) {
  display: table;
  width: 100% !important;
  min-width: 100%;
  table-layout: auto;
}


.md-footer-meta {
  background: var(--ok-footer-bg);
}


/* V19：可读性与维护性微调
 * 1. 加深全站文字与线框颜色（通过 tokens 变量统一控制）；
 * 2. 页眉标题区域适度增高、增宽，让两行文字上下留白更均衡；
 * 3. 表格字号略大于默认表格，但仍不超过正文大小。
 */
.md-header__inner {
  min-height: 3.15rem;
}

.md-header__title {
  margin-left: 0;
  min-width: 13.6rem;
  padding-top: .34rem;
  padding-bottom: .34rem;
}

.md-header__ellipsis,
.md-header__topic,
.md-header__topic:first-child {
  display: flex;
  align-items: center;
}

.md-header__topic:first-child .md-ellipsis {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.md-typeset,
.md-typeset p,
.md-typeset li,
.md-typeset td,
.md-typeset th,
.md-typeset code {
  color: var(--ok-text);
}

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td,
.md-typeset__table table th,
.md-typeset__table table td {
  font-size: .76rem;
  line-height: 1.55;
  border-color: var(--ok-border-light);
}

.md-typeset table:not([class]) th,
.md-typeset__table table th {
  color: var(--ok-text-strong);
}


/* --------------------------------------------------------------------------
 * 全站页尾古月居链接图
 * 仅显示原始图片，不增加边框、卡片背景、圆角或悬停框。
 * ----------------------------------------------------------------------- */
.ok-page-end-brand {
  display: block;
  width: 100%;
  max-width: 52rem;
  margin: 3rem auto .8rem;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent;
  box-shadow: none;
  text-decoration: none;
}

.ok-page-end-brand img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 !important;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.ok-page-end-brand:hover {
  border: 0;
  box-shadow: none;
}




/* ========================= V27-B 规格参数模块表 ========================= */
.ok-spec-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  margin: .8rem 0 1rem;
}

.ok-spec-table th,
.ok-spec-table td {
  padding: .95rem .9rem;
  vertical-align: top;
  border: 1px solid var(--ok-border-light);
}

.ok-spec-table th {
  text-align: left;
  color: var(--ok-text-strong);
  background: rgba(95, 131, 247, 0.04);
}

.ok-spec-table colgroup col:nth-child(1) { width: 16%; }
.ok-spec-table colgroup col:nth-child(2) { width: 27%; }
.ok-spec-table colgroup col:nth-child(3) { width: 57%; }

.ok-spec-item-title {
  font-weight: 800;
  color: var(--ok-text-strong);
}

.ok-spec-sub {
  color: var(--ok-text);
  line-height: 1.65;
}

.ok-spec-badge {
  display: inline-block;
  margin-top: .36rem;
  padding: .08rem .48rem;
  border-radius: 999px;
  border: 1px solid var(--ok-border-light);
  font-size: .62rem;
  font-weight: 700;
  color: var(--ok-text-muted);
}

.ok-spec-table ul {
  margin: 0;
  padding-left: 1.15rem;
}
.ok-spec-table li {
  margin: .08rem 0;
  line-height: 1.65;
}

/* ========================= V27-B 应用功能模块引导卡 ========================= */
.ok-module-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, .85fr);
  gap: 1.2rem;
  align-items: stretch;
  margin: .7rem 0 1.35rem;
  border: 1px solid var(--ok-border-light);
  background: linear-gradient(90deg, rgba(95,131,247,.035) 0, rgba(95,131,247,.035) 56%, transparent 56%, transparent 100%);
}
.ok-module-hero__copy {
  padding: 1.35rem 1.2rem;
}
.ok-module-hero__copy .ok-kicker {
  margin-bottom: .7rem;
}
.ok-module-hero__copy h2 {
  margin: 0 0 .7rem;
  font-size: 1.18rem;
}
.ok-module-hero__copy p {
  margin: 0 0 .7rem;
  color: var(--ok-text);
  line-height: 1.75;
}
.ok-module-hero__copy ul {
  margin: 0;
  padding-left: 1.1rem;
}
.ok-module-hero__copy li {
  margin: .18rem 0;
}
.ok-module-hero__media {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1.05rem 1rem 1rem 0;
}
.ok-module-hero__frame {
  padding: 1rem;
  border: 1px solid var(--ok-border-light);
  border-radius: .45rem;
  background: var(--ok-card-bg);
}
.ok-module-hero__frame img {
  display: block;
  max-width: 100%;
  max-height: 240px;
  width: auto;
  height: auto;
  margin: 0 auto !important;
}
.ok-module-hero__caption {
  margin: .72rem 0 0;
  color: var(--ok-text-muted);
  font-size: .7rem;
  font-style: italic;
  text-align: center;
}

@media screen and (max-width: 76.1875em) {
  .ok-module-hero { grid-template-columns: 1fr; background: rgba(95,131,247,.035); }
  .ok-module-hero__media { padding: 0 1rem 1rem; }
}


/* ========================= V29 产品与扩展包 ========================= */
.ok-product-pack-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  margin: .8rem 0 1rem;
}
.ok-product-pack-card {
  min-width: 0;
  padding: .95rem 1rem;
  border: 1px solid var(--ok-border-light);
  border-radius: .5rem;
  background: var(--ok-card-bg);
}
.ok-product-pack-card > span {
  display: inline-block;
  color: var(--ok-brand);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .08em;
}
.ok-product-pack-card h3 {
  margin: .38rem 0 .45rem;
  font-size: .96rem;
}
.ok-product-pack-card p,
.ok-product-pack-card li {
  color: var(--ok-text);
  font-size: .72rem;
  line-height: 1.65;
}
.ok-product-pack-card ul {
  margin: .5rem 0 0;
  padding-left: 1.05rem;
}
.ok-product-pack-card.is-developer { border-top: 3px solid var(--ok-text-strong); }
.ok-product-pack-card.is-education { border-top: 3px solid var(--ok-link); }
.ok-product-pack-card.is-ai { border-top: 3px solid var(--ok-brand); }
@media screen and (max-width: 76.1875em) {
  .ok-product-pack-grid { grid-template-columns: 1fr; }
}


/* ========================= V30 产品规格分组 ========================= */
.ok-spec-highlight-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  margin: .75rem 0 1rem;
}
.ok-spec-highlight-grid div {
  min-width: 0;
  padding: .72rem .78rem;
  border: 1px solid var(--ok-border-light);
  border-radius: .38rem;
  background: var(--ok-card-bg);
}
.ok-spec-highlight-grid strong,
.ok-spec-highlight-grid span { display: block; }
.ok-spec-highlight-grid strong {
  color: var(--ok-text-strong);
  font-size: .86rem;
  line-height: 1.35;
}
.ok-spec-highlight-grid span {
  margin-top: .15rem;
  color: var(--ok-text-muted);
  font-size: .64rem;
}
.ok-spec-suite {
  margin: .8rem 0;
  overflow: hidden;
  border: 1px solid var(--ok-border-light);
  border-top: 3px solid var(--ok-text-strong);
  border-radius: .42rem;
  background: var(--ok-card-bg);
}
.ok-spec-suite.is-education { border-top-color: var(--ok-link); }
.ok-spec-suite.is-ai { border-top-color: var(--ok-brand); }
.ok-spec-suite > header {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  gap: .65rem;
  align-items: start;
  padding: .82rem 1rem;
  border-bottom: 1px solid var(--ok-border-light);
  background: var(--ok-page-bg);
}
.ok-spec-suite > header > span {
  color: var(--ok-brand);
  font-size: 1rem;
  font-weight: 900;
}
.ok-spec-suite > header small {
  color: var(--ok-text-muted);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .06em;
}
.ok-spec-suite > header h3 {
  margin: .08rem 0 .12rem;
  white-space: nowrap;
  font-size: .92rem;
}
.ok-spec-suite > header p {
  margin: 0;
  color: var(--ok-text);
  font-size: .7rem;
}
.ok-spec-fact-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  padding: .5rem;
}
.ok-spec-fact-grid div {
  min-height: 76px;
  padding: .65rem .7rem;
  border: 1px solid var(--ok-border-light);
  background: var(--ok-card-bg);
}
.ok-spec-fact-grid span,
.ok-spec-fact-grid strong { display: block; }
.ok-spec-fact-grid span { color: var(--ok-text-muted); font-size: .62rem; }
.ok-spec-fact-grid strong { margin-top: .26rem; color: var(--ok-text-strong); font-size: .72rem; line-height: 1.5; }
.ok-pack-component-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .5rem;
  padding: .55rem;
}
.ok-pack-component-grid.two-up { grid-template-columns: repeat(2, minmax(0,1fr)); }
.ok-pack-component-grid article {
  min-width: 0;
  padding: .72rem .75rem;
  border: 1px solid var(--ok-border-light);
  border-radius: .32rem;
  background: var(--ok-card-bg);
}
.ok-pack-component-grid article > span {
  color: var(--ok-brand);
  font-size: .58rem;
  font-weight: 900;
  letter-spacing: .08em;
}
.ok-pack-component-grid h4 {
  margin: .28rem 0 .24rem;
  font-size: .76rem;
}
.ok-pack-component-grid p {
  margin: 0;
  color: var(--ok-text);
  font-size: .68rem;
  line-height: 1.6;
}
@media screen and (max-width: 760px) {
  .ok-spec-highlight-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .ok-spec-fact-grid,
  .ok-pack-component-grid,
  .ok-pack-component-grid.two-up { grid-template-columns: 1fr; }
  .ok-spec-suite > header h3 { white-space: nowrap; }
}

/* 进阶 AI 应用使用纯文字引导卡，不占用无实际价值的图片区。 */
.ok-module-hero--text-only {
  grid-template-columns: 1fr;
  background: rgba(95,131,247,.035);
}
.ok-module-hero--text-only .ok-module-hero__copy {
  max-width: 56rem;
}


/* V37：规格表第三列项目符号与“详细规格说明”表头左边缘严格对齐。 */
.ok-spec-table th:first-child {
  white-space: nowrap;
}
.ok-spec-table colgroup col:nth-child(1) { width: 18%; }
.ok-spec-table colgroup col:nth-child(2) { width: 27%; }
.ok-spec-table colgroup col:nth-child(3) { width: 55%; }

/* 表头和正文第三列使用完全相同的左内边距。 */
.ok-spec-table th:nth-child(3),
.ok-spec-table td:nth-child(3) {
  padding-left: .9rem;
}

.ok-spec-table td:nth-child(3) > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.ok-spec-table td:nth-child(3) > ul > li {
  position: relative;
  margin-left: 0 !important;
  padding-left: 1.05rem;
}
.ok-spec-table td:nth-child(3) > ul > li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
}
