/* ImEDA Documentation - Dark Theme */
*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#0d1117;--bg2:#161b22;--bg3:#21262d;--border:#30363d;--text:#c9d1d9;--text2:#8b949e;--text-bright:#f0f6fc;--blue:#58a6ff;--purple:#a78bfa;--purple-dim:#7c3aed;--green:#3fb950;--orange:#d29922;--red:#f85149;--sidebar-w:280px}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}

/* ===== Sidebar ===== */
.sidebar{position:sticky;top:0;height:100vh;background:var(--bg2);border-right:1px solid var(--border);overflow-y:auto;overflow-x:hidden;flex-shrink:0;width:var(--sidebar-w);min-width:var(--sidebar-w);transition:width .2s ease,min-width .2s ease;display:flex;flex-direction:column;position:relative}
.sidebar.collapsed{width:0!important;min-width:0!important;border-right:none;overflow:hidden;padding:0}

/* Sidebar header */
.sidebar-header{display:flex;align-items:center;gap:8px;padding:16px 16px 12px;border-bottom:1px solid var(--border);flex-shrink:0}
.sidebar-header-text{flex:1;min-width:0;overflow:hidden}
.sidebar-header h2{font-size:1.1rem;color:var(--text-bright);white-space:nowrap}
.sidebar-header h2 .ai{background:linear-gradient(135deg,#7c3aed,#2563eb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sidebar-header p{font-size:.72rem;color:var(--text2);margin-top:2px;white-space:nowrap}
.sidebar-collapse-btn{background:none;border:none;color:var(--text2);cursor:pointer;padding:4px;font-size:1rem;line-height:1;flex-shrink:0;border-radius:4px;transition:color .15s,background .15s}
.sidebar-collapse-btn:hover{color:var(--text-bright);background:var(--bg3)}

/* Sidebar expand button (visible when collapsed) */
.sidebar-expand-btn{position:fixed;top:10px;left:10px;z-index:200;background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:6px 10px;color:var(--text2);cursor:pointer;font-size:1rem;display:none;transition:color .15s}
.sidebar-expand-btn:hover{color:var(--text-bright);border-color:var(--text2)}
.sidebar-expand-btn.show{display:block}

/* Nav content */
.sidebar-nav{flex:1;padding:8px 0;overflow-y:auto}

/* Section headers - clickable to collapse */
.nav-section{padding:10px 16px 6px;font-size:.7rem;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:1px;cursor:pointer;display:flex;align-items:center;user-select:none;transition:color .15s}
.nav-section:hover{color:var(--text)}
.nav-section-arrow{margin-left:auto;font-size:.55rem;transition:transform .2s;color:var(--text2)}
.nav-section.collapsed .nav-section-arrow{transform:rotate(-90deg)}

/* Nav group (collapsible) */
.nav-group{overflow:hidden;transition:max-height .25s ease;max-height:600px}
.nav-group.collapsed{max-height:0}

/* Nav links */
.nav-link{display:block;padding:5px 16px 5px 28px;font-size:.88rem;color:var(--text2);transition:all .12s;border-left:2px solid transparent;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-link:hover{color:var(--text);background:var(--bg3);text-decoration:none}
.nav-link.active{color:var(--blue);border-left-color:var(--blue);background:rgba(88,166,255,.06);font-weight:600}
.nav-link.sub{padding-left:40px;font-size:.84rem}

/* Resize handle */
.sidebar-resize-handle{position:absolute;top:0;right:0;width:4px;height:100%;cursor:col-resize;z-index:10;background:transparent;transition:background .15s}
.sidebar-resize-handle:hover,.sidebar-resize-handle.active{background:var(--blue);opacity:.4}

/* ===== Main Content ===== */
.main{flex:1;min-width:0;padding:48px 72px;max-width:960px}
.main h1{font-size:2rem;color:var(--text-bright);margin-bottom:8px;letter-spacing:-.5px}
.main .subtitle{color:var(--text2);font-size:1.05rem;margin-bottom:32px;line-height:1.6}
.main h2{font-size:1.4rem;color:var(--text-bright);margin:36px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.main h3{font-size:1.1rem;color:var(--text-bright);margin:24px 0 12px}
.main p{line-height:1.7;margin-bottom:14px}
.main ul,.main ol{margin:0 0 16px 24px;line-height:1.8}
.main li{margin-bottom:4px}

/* Cards */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin:20px 0}
.card{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:24px;transition:border-color .2s}
.card:hover{border-color:var(--blue)}
.card h4{color:var(--text-bright);margin-bottom:8px;font-size:1rem}
.card p{color:var(--text2);font-size:.9rem;line-height:1.6;margin:0}
.card .icon{font-size:1.6rem;margin-bottom:10px}
.card .tag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:.7rem;background:var(--bg3);color:var(--text2);margin-top:8px}
.card .tag.ai{background:rgba(124,58,237,.15);color:var(--purple)}

/* Code blocks */
.code-block{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:16px 20px;margin:12px 0 20px;overflow-x:auto;font-family:'Cascadia Code','Fira Code',monospace;font-size:.85rem;line-height:1.6;color:#e6edf3}
code{background:var(--bg3);padding:2px 6px;border-radius:4px;font-family:'Cascadia Code','Fira Code',monospace;font-size:.85rem}

/* Tables */
table{width:100%;border-collapse:collapse;margin:12px 0 20px;font-size:.9rem}
th{background:var(--bg2);color:var(--text-bright);text-align:left;padding:10px 14px;border:1px solid var(--border);font-weight:600}
td{padding:8px 14px;border:1px solid var(--border);color:var(--text)}
tr:hover td{background:var(--bg2)}

/* Diagram boxes */
.diagram{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:24px;margin:16px 0 24px;overflow-x:auto}
.diagram-row{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.diagram-box{background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:10px 16px;text-align:center;font-size:.82rem;flex:1;min-width:120px}
.diagram-box.highlight{border-color:var(--purple-dim);background:rgba(124,58,237,.08);color:var(--purple)}
.diagram-box.blue{border-color:rgba(88,166,255,.4);background:rgba(88,166,255,.06);color:var(--blue)}
.diagram-box.green{border-color:rgba(63,185,80,.4);background:rgba(63,185,80,.06);color:var(--green)}
.diagram-arrow{text-align:center;color:var(--text2);font-size:1.2rem;margin:4px 0}
.diagram-label{font-size:.75rem;color:var(--text2);text-align:center;margin-bottom:6px}

/* Badges */
.badge{display:inline-block;padding:3px 10px;border-radius:12px;font-size:.75rem;border:1px solid;margin-right:6px;margin-bottom:4px}
.badge.purple{background:rgba(124,58,237,.12);color:var(--purple);border-color:rgba(124,58,237,.3)}
.badge.blue{background:rgba(88,166,255,.12);color:var(--blue);border-color:rgba(88,166,255,.3)}
.badge.green{background:rgba(63,185,80,.12);color:var(--green);border-color:rgba(63,185,80,.3)}
.badge.orange{background:rgba(210,153,34,.12);color:var(--orange);border-color:rgba(210,153,34,.3)}

/* Info box */
.info-box{background:rgba(88,166,255,.06);border:1px solid rgba(88,166,255,.2);border-radius:8px;padding:16px 20px;margin:16px 0}
.info-box.ai{background:rgba(124,58,237,.06);border-color:rgba(124,58,237,.2)}
.info-box h4{color:var(--blue);margin-bottom:6px;font-size:.95rem}
.info-box.ai h4{color:var(--purple)}

/* Breadcrumb */
.breadcrumb{font-size:.85rem;color:var(--text2);margin-bottom:20px}
.breadcrumb a{color:var(--text2)}
.breadcrumb a:hover{color:var(--blue)}
.breadcrumb span{margin:0 6px}

/* Mobile */
.menu-toggle{display:none;position:fixed;top:12px;left:12px;z-index:100;background:var(--bg2);border:1px solid var(--border);border-radius:6px;padding:8px 12px;color:var(--text);cursor:pointer;font-size:1.1rem}
@media(max-width:768px){
  .sidebar{position:fixed;left:-300px;z-index:99;transition:left .3s;width:280px!important;min-width:280px!important}
  .sidebar.open{left:0}
  .sidebar.collapsed{left:-300px}
  .menu-toggle{display:block}
  .sidebar-expand-btn{display:none!important}
  .main{padding:20px 16px;padding-top:56px}
}

/* Footer */
.page-footer{margin-top:48px;padding-top:20px;border-top:1px solid var(--border);color:var(--text2);font-size:.8rem}

/* Legacy class compat */
.sidebar-logo{display:none}
.sidebar-resize{display:none}
.sidebar-expand{display:none}
.sidebar-toggle{display:none}
