/* ==========================================================================
   大模型管理层（管理员专用）。

   骨架复用 .ov 顶栏（overlay.css），这里只定义模型列表。
   命名前缀 .mdm-（model manager）。

   两条跟着 admin.css 的约定：
     · 只用 tokens.css 里真实存在的令牌。写不存在的 var() CSS 不报错，
       只是静默退化成默认值，表现和「样式表没生效」一模一样。
     · index.html 必须 <link> 这份文件 —— admin.css 上一版难看的实际原因
       就是漏了那一行，样式表在仓库里、页面跑的却是浏览器默认样式。
   ========================================================================== */

/* .ov 默认三行栅格，这一层只有两行。同 admin.css 的 .ov-admin。 */
.ov-models { grid-template-rows: auto 1fr; }

.mdm-scroll {
  overflow-y: auto;
  background: var(--paper);
}

.mdm-inner {
  padding: 0 var(--sp-6) var(--sp-8);
  max-width: 760px;
  margin: 0 auto;
}

/* ---- 表头与条目共用同一套栅格，四列必须对齐 ---- */

.mdm-header,
.mdm-row {
  display: grid;
  grid-template-columns: 1fr 130px 60px 52px;
  gap: 0 var(--sp-3);
  align-items: center;
}

.mdm-header {
  padding: var(--sp-4) var(--sp-2) var(--sp-2);
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-xs);
  color: var(--ink3);
}

.mdm-row {
  padding: var(--sp-2);
  border-bottom: 1px solid var(--line-s);
}

/* 隐藏的条目压暗，但不能压到看不清 —— 管理员要在这里把它改回来 */
/* 隐藏的条目压暗。**class 名不能是 is-hidden** —— base.css:22 那个
   全局工具类是 display:none !important，会把整行从页面上抹掉。
   照 admin.css:258 停用账号的做法用 is-off。 */
.mdm-row.is-off .mdm-name,
.mdm-row.is-off .mdm-tag,
.mdm-row.is-off .mdm-id { opacity: .55; }

.mdm-cell { min-width: 0; }   /* 让长 id 能被 ellipsis 截住 */

/* ---- 可编辑的两格 ---- */

.mdm-name,
.mdm-tag {
  width: 100%;
  padding: var(--sp-1) var(--sp-2);
  font: inherit;
  font-size: var(--fs-sm);
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  outline: none;
}

.mdm-name:focus,
.mdm-tag:focus { border-color: var(--brass); }

.mdm-sub {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-top: 3px;
  padding-left: 2px;
  min-width: 0;
}

/* id 用等宽 —— 它是给管理员核对的标识符，不是给人读的名字 */
.mdm-id {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 描边不填色 —— 填色小标签留给风险等级（同 admin.css 的约定）。
   这是个配置提示，不是风险。 */
.mdm-nokey {
  flex-shrink: 0;
  padding: 1px 6px;
  font-size: var(--fs-xs);
  line-height: 1.5;
  color: var(--high);
  border: 1px solid var(--high);
  border-radius: var(--radius-pill);
  cursor: help;
}

/* ---- 显示 / 隐藏开关 ---- */

.mdm-toggle { display: inline-flex; cursor: pointer; }
.mdm-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }

.mdm-toggle-track {
  display: block;
  width: 34px;
  height: 20px;
  border-radius: var(--radius-pill);
  background: var(--line);
  position: relative;
  transition: background var(--dur) var(--ease);
}

.mdm-toggle-track::after {
  content: '';
  position: absolute;
  left: 3px;
  top: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--paper);
  transition: left var(--dur) var(--ease);
}

.mdm-toggle input:checked + .mdm-toggle-track { background: var(--brass); }
.mdm-toggle input:checked + .mdm-toggle-track::after { left: 17px; }

.mdm-toggle input:focus-visible + .mdm-toggle-track {
  outline: 2px solid var(--brass);
  outline-offset: 2px;
}

.mdm-col-show,
.mdm-col-def { justify-self: center; }

.mdm-col-def input { cursor: pointer; }
.mdm-col-def input:disabled { cursor: not-allowed; opacity: .4; }

/* ---- 底部操作 ---- */

.mdm-foot {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-top: var(--sp-4);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--line);
}

.mdm-save,
.mdm-cancel {
  padding: var(--sp-2) var(--sp-5);
  font: inherit;
  font-size: var(--fs-sm);
  border-radius: var(--radius-sm);
  cursor: pointer;
}

.mdm-save {
  background: var(--brass);
  color: var(--paper);
  border: 1px solid var(--brass);
}

.mdm-save:hover { background: var(--brass-l); border-color: var(--brass-l); }

.mdm-cancel {
  background: none;
  color: var(--ink2);
  border: 1px solid var(--line);
}

.mdm-cancel:hover { color: var(--ink); border-color: var(--ink3); }

.mdm-hint {
  flex: 1;
  font-size: var(--fs-xs);
  color: var(--ink3);
}

.mdm-note {
  margin-top: var(--sp-4);
  font-size: var(--fs-xs);
  color: var(--ink3);
  line-height: 1.7;
}

.mdm-err {
  padding: var(--sp-6) var(--sp-2);
  font-size: var(--fs-sm);
  color: var(--high);
}

/* 窄屏把 id 副行与标签列收掉 —— 管理员多半开着侧栏在笔记本上用。
   同 admin.css 的做法：收列而不是横向滚动。 */
@media (max-width: 620px) {
  .mdm-header,
  .mdm-row { grid-template-columns: 1fr 60px 52px; }
  .mdm-col-tag { display: none; }
}