/*!
 * SuperAIERP - Demo 示例代码展示 + 测试页通用样式
 * Copyright (c) 2025 SuperAIERP. All rights reserved.
 * https://www.superaierp.com
 *
 * 配套 js/features/11-demo-code.js、12-demo-toc.js
 * 为测试/演示页提供代码展示面板、侧边栏、目录、通用布局
 */
/*!
 * SuperAIERP - Demo 示例代码展示 + 测试页通用样式
 * Copyright (c) 2025 SuperAIERP. All rights reserved.
 * https://www.superaierp.com
 *
 * 配套 js/features/11-demo-code.js、12-demo-toc.js
 * 为测试/演示页提供代码展示面板、侧边栏、目录、通用布局
 */.demo-code-btn{font-size:.68rem;cursor:pointer;vertical-align:middle;background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-muted);border-radius:4px;padding:2px 10px;margin-left:.6rem;transition:all .2s}.demo-code-btn:hover{color:var(--primary);border-color:var(--primary)}.demo-code-btn.open{color:var(--primary);border-color:var(--primary);background:var(--primary-bg-light)}.demo-code-panel{display:none;margin:.5rem 0 .75rem;background:var(--bg-card-solid);border:1px solid var(--border-color);border-radius:var(--radius);overflow:hidden}.demo-code-panel.open{display:block;z-index:10;margin:.5rem 0 .75rem;box-shadow:0 4px 16px #0000004d;border:1px solid var(--primary)}.demo-code-panel.demo-code-panel-modal{display:block;margin:0;border:none;border-radius:0;box-shadow:none}.demo-code-panel.demo-code-panel-modal pre{max-height:60vh}.demo-code-tabs{display:flex;border-bottom:1px solid var(--border-color);background:var(--bg-secondary)}.demo-code-tab{font-size:.7rem;padding:4px 14px;cursor:pointer;background:transparent;border:none;color:var(--text-muted);border-bottom:2px solid transparent;transition:all .15s}.demo-code-tab:hover{color:var(--text-secondary)}.demo-code-tab.active{color:var(--primary);border-bottom-color:var(--primary)}.demo-code-copy,.demo-code-close{font-size:.65rem;cursor:pointer;background:transparent;border:1px solid var(--border-color);color:var(--text-muted);border-radius:3px;margin-right:6px;transition:all .15s;line-height:1}.demo-code-copy{margin-left:auto;padding:2px 10px}.demo-code-close{padding:2px 8px}.demo-code-copy:hover{color:var(--primary);border-color:var(--primary)}.demo-code-copy.copied{color:var(--success);border-color:var(--success)}.demo-code-close:hover{color:var(--danger);border-color:var(--danger)}.demo-code-panel pre{margin:0;padding:.75rem 1rem;font-family:Consolas,Monaco,Courier New,monospace;font-size:.74rem;line-height:1.55;color:var(--text-secondary);max-height:420px;overflow:auto;display:none;white-space:pre;tab-size:2}.demo-code-panel pre.active{display:block}body{background:var(--bg-body);padding:.1rem}.main{max-width:900px;margin:0 auto;padding:1rem}.demo-header{margin-bottom:1.5rem;padding-right:3.5rem}.demo-header h1{color:var(--text-primary);font-size:1.5rem;margin:0 0 .25rem}.demo-header p{color:var(--text-secondary);font-size:.85rem;margin:0}.section{margin-bottom:1.5rem}.section h2{color:var(--text-primary);font-size:1rem;margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.section h3{color:var(--text-secondary);font-size:.8rem;margin:.75rem 0 .5rem}.row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.col{display:flex;flex-direction:column;gap:.5rem}.demo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.demo-grid-center{justify-items:center}.demo-col-wide{grid-column:1 / -1}@media(max-width:768px){.demo-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.demo-grid{grid-template-columns:1fr}}.demo-info{padding:.5rem .8rem;background:var(--bg-secondary);border-radius:6px;font-size:.82rem;color:var(--text-secondary)}.demo-actions{margin-top:.75rem;display:flex;flex-wrap:wrap;gap:.5rem}.demo-actions-inline{display:inline-flex;flex-wrap:wrap;gap:.5rem;align-items:center}.demo-actions-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}.text-warning{color:var(--warning)}body>.theme-toggle-btn{position:fixed;top:1.25rem;right:1.5rem;z-index:1000}#log{background:var(--bg-card-solid);border:1px solid var(--border-color);border-radius:var(--radius);padding:1rem;font-family:Consolas,Monaco,monospace;font-size:.78rem;color:var(--text-secondary);max-height:350px;overflow-y:auto;white-space:pre-wrap;line-height:1.6}#log .pass{color:var(--success)}#log .fail{color:var(--danger)}#log .info{color:var(--primary)}#summary{font-weight:700;margin-bottom:.5rem;color:var(--text-primary);font-size:.9rem}.demo-sidebar-page{display:flex;height:100vh;padding:0;overflow:hidden}.demo-sidebar-page .demo-sidebar{width:220px;min-width:220px;background:var(--bg-card-solid);border-right:1px solid var(--border-color);overflow-y:auto;overflow-x:hidden;padding:1.2rem 0;transition:width .25s,min-width .25s;position:relative;touch-action:pan-y}.demo-toc-page{display:flex;height:100vh;overflow:hidden}.demo-toc-page .demo-toc{width:200px;min-width:200px;background:var(--bg-card-solid);border-right:1px solid var(--border-color);overflow-y:auto;overflow-x:hidden;padding:3.5rem 0 1.2rem;transition:width .25s,min-width .25s;position:relative;flex-shrink:0;touch-action:pan-y}.demo-sidebar-page .demo-sidebar-toggle,.demo-toc-page .demo-toc-toggle{position:absolute;width:24px;height:24px;cursor:pointer;border:none;background:transparent;color:var(--text-muted);border-radius:4px;display:flex;align-items:center;justify-content:center;transition:color .15s;z-index:2;line-height:1}.demo-sidebar-page .demo-sidebar-toggle{top:.35rem;right:.35rem;font-size:.85rem}.demo-toc-page .demo-toc-toggle{top:.5rem;right:.5rem;font-size:.8rem}.demo-sidebar-page .demo-sidebar-toggle:hover,.demo-toc-page .demo-toc-toggle:hover{color:var(--primary);background:var(--bg-secondary)}.demo-sidebar-page .demo-sidebar-title,.demo-toc-page .demo-toc-title{font-size:.85rem;font-weight:700;color:var(--text-primary);padding:0 1rem .75rem;border-bottom:1px solid var(--border-color);margin-bottom:.5rem;white-space:nowrap;overflow:hidden}.demo-sidebar-page .demo-sidebar-title{transition:opacity .2s}.demo-sidebar-page .demo-sidebar-item{display:block;padding:.5rem 1rem;font-size:.78rem;color:var(--text-secondary);text-decoration:none;border-left:3px solid transparent;transition:all .15s;white-space:nowrap;overflow:hidden}.demo-sidebar-page .demo-sidebar-item .num{display:inline-block;width:1.4rem;font-size:.65rem;color:var(--text-muted)}.demo-sidebar-page .demo-sidebar-item .dev-tag{font-size:.65rem;color:var(--text-muted);opacity:.45;margin-left:.15rem}.demo-sidebar-page .demo-sidebar-item .label-icon{margin-right:.35rem;font-size:.7rem}.demo-sidebar-page .demo-sidebar-sep{height:1px;background:var(--border-color);margin:.5rem 1rem;transition:opacity .2s}.demo-toc-page .demo-toc-item{display:block;padding:.35rem 1rem;font-size:.76rem;color:var(--text-secondary);text-decoration:none;cursor:pointer;border-left:3px solid transparent;transition:all .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-sidebar-page .demo-sidebar-item:hover,.demo-toc-page .demo-toc-item:hover{color:var(--primary);background:var(--bg-secondary)}.demo-sidebar-page .demo-sidebar-item.active,.demo-toc-page .demo-toc-item.active{color:var(--primary);border-left-color:var(--primary);background:var(--primary-bg-light);font-weight:600}.demo-sidebar-page .demo-content{flex:1;overflow:hidden;position:relative;touch-action:pan-y}.demo-sidebar-page .demo-content iframe{width:100%;height:100%;border:none;background:var(--bg-body, #f1f5f9)}.demo-toc-page .demo-toc-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:0;touch-action:pan-y}.demo-sidebar-page.sidebar-collapsed .demo-sidebar{width:42px;min-width:42px}.demo-sidebar-page.sidebar-collapsed .demo-sidebar-toggle{right:0;top:.35rem}.demo-sidebar-page.sidebar-collapsed .demo-sidebar-title,.demo-sidebar-page.sidebar-collapsed .demo-sidebar-sep{opacity:0;pointer-events:none}.demo-sidebar-page.sidebar-collapsed .demo-sidebar-item{padding:.5rem 0;text-align:center;font-size:0}.demo-sidebar-page.sidebar-collapsed .demo-sidebar-item .num{width:auto;font-size:.65rem}.demo-sidebar-page.sidebar-collapsed .demo-sidebar-item .label-icon{margin-right:0;font-size:.75rem}.demo-toc-page.toc-collapsed .demo-toc{width:0;min-width:0;overflow:visible}.demo-toc-page.toc-collapsed .demo-toc-toggle{right:auto;top:4rem;left:0;position:fixed;background:var(--bg-card-solid);border:1px solid var(--border-color);border-left:none;border-radius:0 6px 6px 0;box-shadow:2px 0 8px #00000026;width:28px;height:36px;z-index:9999}.demo-toc-page.toc-collapsed .demo-toc-title,.demo-toc-page.toc-collapsed .demo-toc-item{display:none}.demo-card{display:inline-flex;align-items:center;justify-content:center;padding:.55rem 1.1rem;min-width:7.2rem;border-radius:6px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);font-size:.85rem;font-weight:500;transition:background .15s}.demo-card-sm{padding:.35rem .8rem;min-width:6.2rem;font-size:.78rem}.demo-card-clickable{cursor:pointer;user-select:none}.demo-card-clickable:hover{background:var(--bg-secondary)}.demo-card-dashed{border-style:dashed;border-width:2px;padding:1rem;border-radius:8px}.demo-trigger{display:inline-flex;align-items:center;justify-content:center;min-width:7.2rem;padding:.5rem 1rem;border-radius:6px;border:1px solid var(--border-color);background:var(--bg-card-solid);color:var(--text-primary);font-size:.85rem;cursor:pointer;user-select:none;transition:border-color .15s,background .15s}.demo-trigger:hover{border-color:var(--primary);background:var(--bg-hover)}.demo-trigger-sm{min-width:auto;padding:.35rem .8rem;font-size:.78rem}.demo-desc{margin:0 0 .8rem;color:var(--text-secondary);font-size:.85rem}.demo-desc-sm{margin:0 1rem 1rem;color:var(--text-secondary);font-size:.82rem}.demo-hint{margin-left:1rem;color:var(--text-secondary);font-size:.82rem}.demo-badge{margin-top:1rem;padding:.6rem 1.1rem;border:1px dashed var(--success);border-radius:8px;background:color-mix(in srgb,var(--success) 15%,transparent);color:var(--success);display:inline-block;font-weight:600}.demo-spacer{height:80vh;margin-top:1rem}.demo-tag{display:inline-block;padding:2px 8px;margin:0 4px 4px 0;border-radius:4px;background:#ffffff1f;color:#fff;cursor:pointer;transition:background .15s;font-size:.8rem}.demo-tag:hover{background:#ffffff38}.demo-tag-green{background:var(--success)}.demo-tag-orange{background:var(--warning)}.demo-tag-red{background:var(--danger)}.demo-row-label{font-size:.72rem;color:var(--text-muted);margin:12px 0 4px;padding:2px 0;border-bottom:1px dashed var(--border-color)}.demo-placement{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:1rem;width:520px;max-width:100%;padding:2rem 2.2rem;margin:0 auto;border:1px solid var(--border-color);border-radius:10px;background:var(--bg-secondary)}.demo-placement-node{display:flex;align-items:center;justify-content:center;background:var(--primary);color:#fff;font-weight:700;border-radius:6px;padding:.8rem .3rem;font-size:.82rem}.demo-placement-node-success{background:var(--success)}.demo-placement-node-warning{background:var(--warning)}