/* ============================================================
   P7 基础数据模块样式:分类树 / 省市区三列 / 工号预览 / 密钥 / 授权码
   基础设计系统复用 app.css(card、btn、tag、form-row、toolbar …)
   ============================================================ */

/* ---------- 左右分栏(分类树 + 详情)---------- */
.p7-split { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 980px) { .p7-split { grid-template-columns: 1fr; } }
.p7-side .card-body { padding: 14px 14px 16px; }

/* ---------- 分类树 ---------- */
.p7-tree-box { max-height: 60vh; overflow: auto; border-top: 1px solid var(--border); margin-top: 4px; padding-top: 6px; }
.p7-node { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-radius: 6px; padding: 2px 6px; }
.p7-node:hover { background: #f7f8fb; }
.p7-node.on { background: var(--primary-light); }
.p7-node-name { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; padding: 5px 2px; color: var(--text); font-size: 13.5px; }
.p7-node.on .p7-node-name { color: var(--primary); font-weight: 600; }
.p7-caret { width: 12px; color: var(--text-3); font-size: 11px; }
.p7-node-tag { font-size: 11.5px; color: var(--text-3); background: #f1f2f4; border-radius: 10px; padding: 0 7px; }
.p7-mini { font-size: 11px; border-radius: 8px; padding: 0 6px; }
.p7-hintnum { color: var(--text-3); margin-left: 4px; }
.p7-node-ops { display: none; gap: 7px; }
.p7-node:hover .p7-node-ops { display: flex; }
.p7-node-ops a { font-size: 12.5px; color: var(--text-3); }
.p7-node-ops a:hover { color: var(--primary); }
.p7-node-ops a.danger:hover { color: var(--danger); }
.p7-children { border-left: 1px dashed var(--border); margin-left: 8px; }

/* ---------- 区块小标题 ---------- */
.p7-sub-title { display: flex; align-items: center; justify-content: space-between; gap: 10px;
    margin: 20px 0 10px; padding-top: 14px; border-top: 1px solid var(--border);
    font-size: 13.5px; font-weight: 600; }

/* ---------- 省市区三列 ---------- */
.p7-area-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 860px) { .p7-area-cols { grid-template-columns: 1fr; } }
.p7-area-col { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; background: #fff; }
.p7-col-head { display: flex; align-items: center; justify-content: space-between; padding: 9px 12px;
    background: #fafbfc; border-bottom: 1px solid var(--border); font-size: 13px; font-weight: 600; color: var(--text-2); }
.p7-count { font-weight: 400; color: var(--text-3); font-size: 12px; }
.p7-col-body { max-height: 52vh; overflow: auto; padding: 6px; }
.p7-area-item { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 6px; cursor: pointer; font-size: 13.5px; }
.p7-area-item:hover { background: #f7f8fb; }
.p7-area-item.on { background: var(--primary-light); }
.p7-area-item.on .p7-area-name { color: var(--primary); font-weight: 600; }
.p7-area-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p7-area-code { color: var(--text-3); font-size: 12px; font-family: ui-monospace, Menlo, Consolas, monospace; }
.p7-area-ops { display: none; gap: 7px; }
.p7-area-item:hover .p7-area-ops { display: flex; }
.p7-area-ops a { font-size: 12.5px; color: var(--text-3); }
.p7-area-ops a:hover { color: var(--primary); }
.p7-area-ops a.danger:hover { color: var(--danger); }

/* ---------- 公司弹窗里的三级联动 ---------- */
.p7-area-pick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.p7-check { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-2); cursor: pointer; }

/* ---------- 工号 / 预览 ---------- */
.p7-preview { margin-top: 14px; }
.p7-num { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 26px; font-weight: 700;
    color: var(--primary); letter-spacing: 1px; padding: 10px 0 2px; word-break: break-all; }
.p7-code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px;
    background: #f4f5f7; border-radius: 4px; padding: 1px 6px; color: var(--text); }

/* ---------- 密钥明文 / 复制 ---------- */
.p7-copy { display: flex; gap: 8px; align-items: center; }
.p7-copy input { flex: 1; font-family: ui-monospace, Menlo, Consolas, monospace; }

/* ---------- 导入 JSON ---------- */
.p7-json { min-height: 240px; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; line-height: 1.6; }
.p7-result { margin-top: 12px; padding: 10px 12px; border-radius: 6px; background: #e8f8ef;
    border: 1px solid #bfe8d0; color: #14663a; font-size: 13px; }
.p7-result.p7-bad { background: #fdeaea; border-color: #f5c2c2; color: #991b1b; }
.p7-result .hint { color: inherit; opacity: .85; margin-top: 4px; }