/* Lune api — billing.css
   tb-*  阶梯计费条件树编辑器（tiered-billing.js）
   pe-*  价格类设置编辑器外壳 / 价格总表 / 工具价格（pricing-editors.js）
   ms-*  模型列表状态条与阶梯明细（model-status.js） */

:root{--ms-green-soft:#8fe5bf;--ms-grey:rgba(var(--line-rgb),.14)}
:root[data-theme='light']{--ms-green-soft:var(--green)}

/* ---------- 分段按钮（按量/按次、表格/JSON） ---------- */
.tb-seg,.pe-seg{display:inline-flex;gap:2px;background:var(--sunken);border:1px solid var(--line);border-radius:10px;padding:3px}
.tb-seg button,.pe-seg button{padding:6px 12px;border-radius:7px;color:var(--dim);font-size:13px;white-space:nowrap;transition:.15s}
.tb-seg button:hover,.pe-seg button:hover{color:var(--text)}
.tb-seg button.on,.pe-seg button.on{background:var(--raised);color:var(--text)}
.pe-seg.sm button{padding:4px 9px;font-size:12px}

/* ---------- 阶梯编辑器 ---------- */
.tb-editor{display:flex;flex-direction:column;gap:14px}
.tb-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.tb-title{flex:1;min-width:0}
.tb-hint{color:var(--faint);font-size:12.5px;line-height:1.6;margin:0}
.tb-notice{color:var(--orange);font-size:12.5px;margin:0}
.tb-label-text{display:block;margin:6px 0 6px;color:var(--faint);font-size:12.5px}
.tb-small{padding:6px 12px;font-size:12.5px}
.tb-visual{display:flex;flex-direction:column;gap:14px}
.tb-tier{border:1px solid var(--line-strong);border-radius:12px;background:var(--card-2);padding:12px 14px}
.tb-tier-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.tb-label{flex:1 1 160px;min-width:120px;max-width:260px}
.tb-unit-note{color:var(--dim);font-size:12.5px}
.tb-price-row{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.tb-price-row label{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:12.5px}
.tb-price-row>span,.tb-price-row em,.tb-price-row label em{color:var(--faint);font-size:12px;font-style:normal}
.tb-price-row code,.tb-extra-item code{color:var(--purple);font-family:"JetBrains Mono",monospace;font-size:11.5px}
.tb-price{width:112px}
.tb-extra{margin-top:10px}
.tb-extra summary{cursor:pointer;color:var(--faint);font-size:12.5px;user-select:none}
.tb-extra-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-top:10px}
.tb-extra-item{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--dim);font-size:12.5px}

.tb-branch{border:1px dashed var(--line-strong);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.tb-if{display:flex;gap:10px;align-items:flex-start}
.tb-if>b,.tb-tag{flex:none;min-width:42px;color:var(--moon);font-size:12.5px;font-weight:700;padding-top:9px}
.tb-if-body,.tb-side-body{flex:1;min-width:0}
.tb-side{display:flex;gap:10px;align-items:flex-start}
.tb-yes .tb-tag{color:var(--green)}
.tb-no .tb-tag{color:var(--orange)}
.tb-branch-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}

.tb-chip{padding:5px 10px;border-radius:8px;background:rgba(var(--line-rgb),.06);border:1px solid var(--line-strong);color:var(--dim);font-size:12px;white-space:nowrap}
.tb-chip:hover{color:var(--text);background:rgba(var(--line-rgb),.1)}
.tb-chip-del{color:var(--red)}

.tb-cmp{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 0}
.tb-cmp .sel-inline{max-width:210px}
.tb-cmp .tb-op,.tb-cmp .tb-vtype{max-width:96px}
.tb-key{flex:1 1 180px;min-width:130px;max-width:260px}
.tb-value{flex:0 1 130px;min-width:80px}
.tb-cmp-actions{display:inline-flex;gap:6px;margin-left:auto}
.tb-group,.tb-not{border-radius:12px;padding:8px 10px 6px;border:1px solid var(--line-strong);background:rgba(10,10,13,.35);margin:4px 0}
:root[data-theme='light'] .tb-group,.tb-not{background:rgba(var(--ink-rgb),.03)}
.tb-g-all{border-left:3px solid var(--blue)}
.tb-g-any{border-left:3px solid var(--purple)}
.tb-not{border-left:3px solid var(--yellow)}
.tb-group-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.tb-group-head b{font-size:12.5px;color:var(--yellow)}
.tb-group-head .sel-inline{max-width:130px}
.tb-group-body{padding-left:6px}

.tb-rules{border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:10px}
.tb-rules-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.tb-rules-head p{color:var(--faint);font-size:12.5px;margin:4px 0 0}
.tb-rule{border:1px solid var(--line-strong);border-radius:12px;padding:10px 12px;background:var(--card-2)}
.tb-rule-title{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.tb-rule-mult{display:inline-flex;align-items:center;gap:6px;margin-left:auto;color:var(--dim);font-size:13px}

.tb-preview{color:var(--dim);background:var(--card);width:100%;line-height:1.6}
.tb-raw{display:flex;flex-direction:column;gap:6px}
.tb-validation{min-height:20px;color:var(--red);font-size:12.5px}
.tb-validation.ok{color:var(--green)}
.tb-sim{border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.tb-sim summary{cursor:pointer;color:var(--dim);font-size:13px;user-select:none}
.tb-sim-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:12px}
.tb-sim-grid label,.tb-sim-ctx label{display:flex;flex-direction:column;gap:5px;color:var(--faint);font-size:12px}
.tb-sim-grid .num-input{width:100%}
.tb-sim-ctx{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:12px}
.tb-sim-result{margin-top:12px;white-space:pre-line;color:var(--text);font-size:13px;line-height:1.7;font-family:"JetBrains Mono",monospace}

/* ---------- 价格编辑器外壳 ---------- */
.pe-shell{display:flex;flex-direction:column;gap:12px;min-width:0}
.pe-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pe-note{color:var(--faint);font-size:12.5px}
.pe-note.bad{color:var(--red)}
.pe-scroll{overflow-x:auto}
.pe-table{min-width:640px}
.pe-actions{display:flex;align-items:center;gap:7px;white-space:nowrap}
.pe-empty{text-align:center;color:var(--faint);padding:26px 16px!important}
.pe-hint{color:var(--faint);font-size:12px;line-height:1.6;margin-left:8px}
.pe-json{width:100%;line-height:1.6}

.pe-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pe-toolbar .input{max-width:260px}
/* 批量栏在列表下方吸底：列表很长时也一直看得到 */
.pe-batch{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--line-strong);border-radius:12px;background:var(--card-2);box-shadow:0 10px 30px rgba(var(--shadow-rgb),calc(.35*var(--shadow-k)))}
.pe-batch-slot{position:sticky;bottom:12px;z-index:2}
.pe-batch-slot:empty{display:none}
.pe-batch .num-input{width:110px}
.pe-finder{border:1px solid var(--line-strong);border-radius:12px;padding:10px 14px;color:var(--dim);font-size:13px}
.pe-finder.bad{color:var(--red)}
.pe-chip{padding:5px 11px;border-radius:999px;background:rgba(var(--line-rgb),.06);border:1px solid var(--line-strong);color:var(--text);font-family:"JetBrains Mono",monospace;font-size:12px}
.pe-chip:hover{background:rgba(var(--line-rgb),.12)}
.pe-more{text-align:center}
.pe-name{white-space:nowrap}

/* ---------- 模型定价：价目单 ---------- */
.pe-grow{flex:1}
.pe-tip{margin:0;color:var(--faint);font-size:12.5px;line-height:1.6}
.pe-list{min-width:620px}
.pe-list td{vertical-align:middle}
/* 复选框占满整格：点在格内任意处都只勾选，不会打开抽屉 */
.pe-sel-cell{cursor:default}
.pe-sel{display:flex;align-items:center;justify-content:center;min-width:28px;min-height:28px;cursor:pointer}
.pe-sel input{width:16px;height:16px;cursor:pointer}
.pe-row{cursor:pointer}
.pe-row:hover td{background:rgba(var(--line-rgb),.035)}
.pe-sum{color:var(--text);font-size:13px;font-variant-numeric:tabular-nums}
.pe-sum-sub{margin-top:3px;max-width:560px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--faint);font-size:12px}
.pe-row-act{text-align:right}
.pe-row-act .btn-gray,.pe-list .pill{white-space:nowrap}
.pe-mode{border:1px solid var(--line-strong)}
.pe-mode-token{color:var(--blue);background:rgba(var(--blue-rgb),.1);border-color:rgba(var(--blue-rgb),.25)}
.pe-mode-request{color:var(--orange);background:rgba(var(--orange-rgb),.1);border-color:rgba(var(--orange-rgb),.25)}
.pe-mode-tiered{color:var(--purple);background:rgba(var(--purple-rgb),.12);border-color:rgba(var(--purple-rgb),.3)}

/* ---------- 模型定价：侧抽屉（低于确认弹窗 .modal-mask 的 150） ---------- */
body.pe-drawer-open{overflow:hidden}
.pe-drawer-mask{position:fixed;inset:0;z-index:120;background:rgba(var(--shadow-rgb),.45);display:flex;justify-content:flex-end}
.pe-drawer{width:min(620px,100vw);height:100%;display:flex;flex-direction:column;background:var(--card-2);border-left:1px solid var(--line-strong);box-shadow:-18px 0 48px rgba(var(--shadow-rgb),calc(.35*var(--shadow-k)))}
.pe-dr-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 20px 12px}
.pe-dr-title{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.pe-dr-title small{color:var(--faint);font-size:12px}
.pe-dr-title h3{font-size:16px;font-weight:700;word-break:break-all}
.pe-dr-modes{margin:0 20px;align-self:flex-start}
.pe-dr-modes button{min-width:76px}
.pe-dr-tip{margin:10px 20px 0;color:var(--dim);font-size:12.5px;line-height:1.6}
.pe-dr-body{flex:1;overflow-y:auto;padding:14px 20px 18px}
.pe-dr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.pe-dr-field{display:flex;flex-direction:column;gap:5px;color:var(--dim);font-size:12.5px}
.pe-dr-field.main>span:first-child{color:var(--text);font-weight:600}
.pe-dr-input{display:flex;align-items:center;gap:8px}
.pe-dr-input .num-input{flex:1;min-width:0}
.pe-dr-input em{color:var(--faint);font-size:12px;font-style:normal;white-space:nowrap}
.pe-dr-ratio{min-height:15px;color:var(--faint);font-size:11.5px;font-family:"JetBrains Mono",monospace}
.pe-dr-example{margin:14px 0 0;color:var(--dim);font-size:12.5px;min-height:18px}
.pe-dr-templates{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:14px;color:var(--faint);font-size:12.5px}
.pe-dr-templates .pe-chip{font-family:inherit}
.pe-dr-foot{border-top:1px solid var(--line);padding:12px 20px max(14px,env(safe-area-inset-bottom))}
.pe-dr-error{min-height:18px;color:var(--red);font-size:12.5px;margin-bottom:8px}
.pe-dr-actions{display:flex;align-items:center;gap:10px}
.pe-dr-note{margin:8px 0 0;color:var(--faint);font-size:12px;text-align:right}
@media (max-width:640px){
  /* 工具栏：搜索与筛选各占一行，筛选可换行，两个按钮平分一行 */
  .pe-toolbar .pe-seg{display:flex;flex-wrap:wrap;width:100%}
  .pe-toolbar .pe-seg button{flex:1 0 auto}
  .pe-toolbar .pe-grow{display:none}
  .pe-toolbar>.btn-gray,.pe-toolbar>.btn-purple{flex:1 1 0;min-width:0}
  /* 批量栏三行：已选 + 取消 / 设置项 / 数值 + 应用 + 删除 */
  .pe-batch{gap:6px;padding:8px 10px}
  .pe-batch>b{flex:1 1 auto;order:0}
  .pe-batch [data-batch="cancel"]{order:1}
  .pe-batch .sel-inline{flex:1 1 100%;max-width:none;order:2}
  .pe-batch .num-input{flex:1 1 0;min-width:0;order:3}
  .pe-batch [data-batch="apply"]{order:4}
  .pe-batch [data-batch="delete"]{order:5}
  .pe-batch .btn-gray{padding:7px 12px}
  .pe-batch-slot{bottom:max(8px,env(safe-area-inset-bottom))}
  /* iOS 聚焦字号小于 16px 的输入框会放大页面 */
  .pe-toolbar .input,.pe-batch .input,.pe-drawer .input,.pe-tools .input{font-size:16px}
}

/* 卡片式价目单 / 工具价格：表格最小宽度 620px，容器窄于它时就切卡片，避免「编辑」列滚出视野 */
@media (max-width:760px){
  /* 价目单：每个模型一张两行卡片（名称 + 方式 / 价格 + 编辑），不再横向滚动 */
  .pe-scroll{overflow:visible}
  .pe-table,.pe-list{min-width:0}
  .pe-list,.pe-list thead,.pe-list tbody{display:block}
  .pe-list thead tr{display:flex;align-items:center;gap:10px;padding:0 12px 8px}
  .pe-list thead th{padding:0;border:none}
  .pe-list thead th:nth-child(n+3){display:none}
  .pe-list thead th:nth-child(2)::after{content:"（全选当前显示）";text-transform:none;letter-spacing:0}
  .pe-list tr.pe-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;grid-template-areas:"sel name mode" ". sum act";gap:6px 10px;align-items:center;padding:12px;border-bottom:1px solid var(--line)}
  .pe-list tr.pe-row td{display:block;padding:0;border:none;min-width:0}
  .pe-list tr.pe-row td:nth-child(1){grid-area:sel;align-self:stretch}
  .pe-list .pe-sel{min-width:32px;min-height:36px}
  .pe-list .pe-sel input{width:20px;height:20px}
  .pe-list tr.pe-row td:nth-child(2){grid-area:name}
  .pe-list tr.pe-row td:nth-child(3){grid-area:mode;justify-self:end}
  .pe-list tr.pe-row td:nth-child(4){grid-area:sum}
  .pe-list tr.pe-row td:nth-child(5){grid-area:act}
  .pe-name{white-space:normal;word-break:break-all;font-size:13px}
  .pe-sum-sub{max-width:none;white-space:normal;overflow-wrap:anywhere}
  .pe-list .pe-empty{display:block}

  /* 工具价格：每条规则一张卡片 */
  .pe-tools,.pe-tools tbody,.pe-tools tfoot{display:block}
  .pe-tools thead{display:none}
  .pe-tools tbody tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:10px;align-items:end;padding:12px;border-bottom:1px solid var(--line)}
  .pe-tools tbody td{display:block;padding:0;border:none;min-width:0}
  .pe-tools tbody td:first-child,.pe-tools tbody td.pe-empty{grid-column:1/-1}
  .pe-tools td[data-label]::before{content:attr(data-label);display:block;margin-bottom:4px;color:var(--faint);font-size:11.5px}
  .pe-tools .input,.pe-tools .num-input{width:100%;min-width:0}
  .pe-tools tfoot tr,.pe-tools tfoot td{display:block;padding:12px 0 0;border:none}
  .pe-tools tfoot .pe-hint{display:block;margin:10px 0 0;overflow-wrap:anywhere}
}

@media (max-width:640px){
  /* 抽屉：整体滚动，底部操作栏吸底，正文区可用高度更大 */
  .pe-drawer{overflow-y:auto;overscroll-behavior:contain}
  .pe-dr-body{flex:1 0 auto;overflow:visible}
  .pe-dr-foot{position:sticky;bottom:0;background:var(--card-2);z-index:1}
  .pe-dr-grid{grid-template-columns:minmax(0,1fr)}
  .pe-dr-head,.pe-dr-body,.pe-dr-foot{padding-left:16px;padding-right:16px}
  .pe-dr-modes,.pe-dr-tip{margin-left:16px;margin-right:16px}
  .pe-dr-modes{align-self:stretch;display:flex}
  .pe-dr-modes button{flex:1;min-width:0}
  .pe-dr-note{text-align:left}
}
/* 横屏手机等矮屏：底栏只留按钮 */
@media (max-height:520px){
  .pe-dr-note{display:none}
  .pe-dr-error{min-height:0}
}

/* ---------- 模型列表：状态条 ---------- */
.ms-cell{display:flex;flex-direction:column;gap:5px;min-width:112px}
.ms-pct{font-family:"JetBrains Mono",monospace;font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums}
.ms-text-excellent{color:var(--green)}
.ms-text-good{color:var(--ms-green-soft)}
.ms-text-warning{color:var(--yellow)}
.ms-text-critical{color:var(--red)}
.ms-text-unknown{color:var(--faint)}
.ms-strip{display:flex;align-items:stretch;gap:1px;height:14px;width:96px}
.ms-bar{display:block;flex:1 1 0;min-width:2px;border-radius:1.5px}
.ms-excellent{background:var(--green)}
.ms-good{background:var(--ms-green-soft)}
.ms-warning{background:var(--yellow)}
.ms-critical{background:var(--red)}
.ms-empty{background:var(--ms-grey)}
.ms-sub{color:var(--faint);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- 模型列表：阶梯明细 ---------- */
.ms-tiers{margin-top:6px;color:var(--dim);font-size:12px;line-height:1.7}
.ms-tier b{color:var(--text);font-weight:600}
.ms-rules{margin-top:2px;color:var(--faint)}

@media (max-width:620px){
  .tb-head,.tb-rules-head{flex-direction:column}
  .tb-head .sel-inline{width:100%;max-width:none}
  .tb-if,.tb-side{flex-direction:column;align-items:stretch;gap:2px}
  .tb-tier{padding:12px}
  .tb-tier-head .tb-label{flex:1 1 100%}
  .tb-extra-item .tb-price{flex:none;width:120px}
  .tb-if>b,.tb-tag{padding-top:0}
  .tb-cmp-actions{margin-left:0}
  .tb-key,.tb-value{flex:1 1 100%;max-width:none}
  .tb-rule-mult{margin-left:0}
  .pe-toolbar .input{max-width:none;flex:1 1 100%}
  /* 档位价格：标签、输入框、单位排成一行，标签不再被挤成竖排 */
  .tb-price-row{flex-direction:column;align-items:stretch;gap:10px}
  .tb-price-row label{width:100%}
  .tb-price-row label>span{flex:none;min-width:52px;white-space:nowrap}
  .tb-price-row label .tb-price{flex:1;min-width:0;width:auto}
  .tb-price-row label em,.tb-price-row>em{white-space:nowrap}
  .tb-price-row>.tb-price{width:100%}
  .tb-label{max-width:none}
  .tb-extra-grid{grid-template-columns:minmax(0,1fr)}
}