/* Biological Pathways — KEGG + Reactome */
.pw-wrap { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.pw-header { margin-bottom: 1.1rem; }
.pw-header-title { display: flex; align-items: center; gap: .5rem; font-size: 1.1rem; font-weight: 700; color: #e6edf3; }
.pw-header-sub { font-size: .78rem; color: #8b949e; margin-top: .2rem; }

/* Tabs */
.pw-tabs { display: flex; gap: .3rem; margin-bottom: 1.1rem; border-bottom: 1px solid #21262d; }
.pw-tab { background: none; border: none; border-bottom: 2px solid transparent; padding: .45rem .9rem; font-size: .82rem; color: #8b949e; cursor: pointer; transition: color .15s; }
.pw-tab:hover { color: #e6edf3; }
.pw-tab-active { color: #e6edf3 !important; border-bottom-color: #3fb950 !important; font-weight: 600; }

/* Layout */
.pw-layout { display: grid; grid-template-columns: 240px 1fr; gap: 1rem; align-items: start; }
@media (max-width: 720px) { .pw-layout { grid-template-columns: 1fr; } }

/* Sidebar */
.pw-sidebar { background: #161b22; border: 1px solid #21262d; border-radius: 10px; padding: .85rem; }
.pw-section-label { font-size: .68rem; font-weight: 700; color: #8b949e; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .55rem; }
.pw-path-list { display: flex; flex-direction: column; gap: .2rem; }
.pw-path-item { background: none; border: none; display: flex; align-items: flex-start; gap: .5rem; padding: .45rem .5rem; border-radius: 6px; cursor: pointer; text-align: left; width: 100%; transition: background .15s; }
.pw-path-item:hover { background: #21262d; }
.pw-path-active { background: #21262d !important; }
.pw-path-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: .3rem; }
.pw-path-texts { display: flex; flex-direction: column; }
.pw-path-name { font-size: .82rem; font-weight: 600; color: #e6edf3; }
.pw-path-cat { font-size: .68rem; color: #8b949e; }

/* Search */
.pw-search-input { width: 100%; box-sizing: border-box; background: #0d1117; border: 1px solid #30363d; border-radius: 6px; padding: .38rem .55rem; font-size: .82rem; color: #e6edf3; outline: none; }
.pw-search-input:focus { border-color: #58a6ff; }
.pw-search-item { display: flex; gap: .5rem; align-items: baseline; padding: .32rem .4rem; border-radius: 5px; cursor: pointer; font-size: .78rem; }
.pw-search-item:hover { background: #21262d; }
.pw-search-id { color: #3fb950; font-family: monospace; font-size: .72rem; flex-shrink: 0; }
.pw-search-name { color: #c9d1d9; }
.pw-search-empty { font-size: .75rem; color: #8b949e; padding: .4rem; }
.pw-search-err { font-size: .75rem; color: #8b949e; padding: .4rem; line-height: 1.6; }

/* Gene → pathways */
.pw-gene-row { display: flex; gap: .4rem; align-items: center; margin-bottom: .4rem; }
.pw-select { background: #0d1117; border: 1px solid #30363d; border-radius: 6px; padding: .35rem .5rem; font-size: .78rem; color: #e6edf3; outline: none; }
.pw-select:focus { border-color: #58a6ff; }
.pw-btn { background: #21262d; border: 1px solid #30363d; border-radius: 6px; padding: .35rem .75rem; font-size: .78rem; color: #e6edf3; cursor: pointer; white-space: nowrap; }
.pw-btn:hover { background: #2d333b; }
.pw-gene-result-label { font-size: .72rem; color: #8b949e; margin-bottom: .3rem; }
.pw-gene-path-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
.pw-gene-path-chip { background: #161b22; border: 1px solid #30363d; border-radius: 4px; padding: .15rem .42rem; font-size: .72rem; color: #3fb950; cursor: pointer; font-family: monospace; }
.pw-gene-path-chip:hover { background: #21262d; border-color: #3fb950; }

/* Loading */
.pw-loading { font-size: .78rem; color: #8b949e; padding: .5rem; }

/* Main panel */
.pw-main { background: #161b22; border: 1px solid #21262d; border-radius: 10px; overflow: hidden; min-height: 450px; }
.pw-map-header { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: .5rem; padding: .9rem 1rem .6rem; border-bottom: 1px solid #21262d; }
.pw-map-title { font-size: .95rem; font-weight: 700; color: #e6edf3; }
.pw-map-cat { display: inline-block; font-size: .68rem; font-weight: 700; padding: .12rem .5rem; border-radius: 20px; margin-top: .2rem; }
.pw-map-controls { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.pw-ctrl-btn { background: #21262d; border: 1px solid #30363d; border-radius: 5px; padding: .25rem .55rem; font-size: .82rem; color: #e6edf3; cursor: pointer; font-weight: 700; }
.pw-ctrl-btn:hover { background: #2d333b; }
.pw-ext-link { font-size: .75rem; color: #58a6ff; text-decoration: none; display: inline-flex; align-items: center; gap: .2rem; }
.pw-ext-link:hover { text-decoration: underline; }
.pw-map-desc { font-size: .8rem; color: #8b949e; line-height: 1.7; padding: .6rem 1rem; }
.pw-map-genes { padding: 0 1rem .75rem; display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.pw-genes-label { font-size: .72rem; color: #8b949e; }
.pw-gene-chip { background: #21262d; border: 1px solid #30363d; border-radius: 4px; padding: .1rem .4rem; font-size: .72rem; color: #3fb950; font-family: monospace; }

/* Map scroll area */
.pw-map-scroll { overflow: auto; max-height: 560px; padding: .75rem 1rem; background: #f8f9fa; border-radius: 0 0 10px 10px; }
.pw-map-inner { display: inline-block; transform-origin: top left; transition: transform .15s; }
.pw-map-img { display: block; max-width: none; image-rendering: crisp-edges; }
.pw-map-err { font-size: .8rem; color: #8b949e; padding: 2rem; }

/* Reactome panel */
.pw-reactome-ctrl { display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem; border-bottom: 1px solid #21262d; flex-wrap: wrap; }
.pw-select-label { font-size: .78rem; color: #8b949e; }
.pw-reactome-meta { font-size: .8rem; color: #8b949e; line-height: 1.7; padding: .5rem 1rem; }
.pw-reactome-iframe-wrap { padding: 0 1rem .75rem; }
.pw-reactome-iframe { width: 100%; height: 600px; border: none; border-radius: 8px; background: #0d1117; display: block; }
.pw-reactome-note { font-size: .72rem; color: #484f58; text-align: center; padding: .35rem 1rem .75rem; }
