/* ============================================================
 * LncACTdb 4.0 — ceRNA Network tool (page-specific)
 * Loaded after tools/lncact-tools.css.
 * ============================================================ */

/* focal-gene title chip in the chart header */
#netTitle b{color:var(--la-primary);}
#netTitle .la-role{font:600 11px var(--la-mono);text-transform:uppercase;letter-spacing:.06em;
  padding:3px 9px;border-radius:999px;margin-left:8px;vertical-align:middle;}
#netTitle .la-role--lnc{color:var(--la-lnc);background:rgba(124,58,237,.10);}
#netTitle .la-role--mrna{color:#047857;background:rgba(16,185,129,.12);}
/* dataset-scope chip in the title */
#netTitle .la-scopechip{font:600 11px var(--la-mono);padding:3px 10px;border-radius:999px;
  margin-left:8px;vertical-align:middle;color:var(--la-primary-d);background:var(--la-bg-tint);
  border:1px solid var(--la-line);}
#netTitle .la-scopechip i{margin-right:5px;opacity:.8;}
#netTitle .la-scopechip--global{color:var(--la-muted);}

/* scope hint under the dataset select */
.la-scopehint{margin:9px 0 0;font-size:12px;line-height:1.5;color:var(--la-muted);}
.la-scopehint i{color:var(--la-primary);margin-right:5px;}
.la-scopehint b{color:var(--la-ink-2);}

/* dual-pick: a small "type" select + a wider "value" select on one row */
.la-dualpick{display:grid;grid-template-columns:128px 1fr;gap:8px;align-items:start;}
.la-dualpick .ts-control{min-height:26px;}

/* coloured type-select: the control is tinted by its current category (data-cat),
   so lncRNA/mRNA and each modality read clearly instead of pale grey.
   NB: tom-select puts both .la-dualpick__type and data-cat on the SAME .ts-wrapper. */
.la-dualpick__type[data-cat] .ts-control{font-weight:700;border-width:1.5px;}
.la-dualpick__type[data-cat="lnc"]  .ts-control{color:var(--la-lnc);background:rgba(124,58,237,.10);border-color:rgba(124,58,237,.45);}
.la-dualpick__type[data-cat="gene"] .ts-control{color:#047857;background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.45);}
.la-dualpick__type[data-cat="0"]    .ts-control{color:var(--la-primary-d);background:var(--la-bg-tint);border-color:var(--la-line);}
.la-dualpick__type[data-cat="T"]    .ts-control{color:#0e7490;background:rgba(6,182,212,.12);border-color:rgba(6,182,212,.45);}
.la-dualpick__type[data-cat="s"]    .ts-control{color:#6d28d9;background:rgba(124,58,237,.12);border-color:rgba(124,58,237,.45);}
.la-dualpick__type[data-cat="C"]    .ts-control{color:#b45309;background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.5);}
.la-dualpick__type[data-cat="O"]    .ts-control{color:#047857;background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.45);}
/* coloured dropdown option rows for the type selects */
.la-typopt{font-weight:600;padding:2px 0;}
.la-typopt--lnc,.la-typopt--ds s{color:var(--la-lnc);}
.la-typopt--gene{color:#047857;}
.la-typopt--dsT{color:#0e7490;} .la-typopt--dss{color:#6d28d9;}
.la-typopt--dsC{color:#b45309;} .la-typopt--dsO{color:#047857;}
.la-typitem{font-weight:700;}

/* layout-toggle button in the chart header */
.la-seg-btn{display:inline-flex;align-items:center;gap:7px;cursor:pointer;
  font:600 13px var(--la-font);color:var(--la-primary-d);
  background:var(--la-bg-tint);border:1px solid var(--la-line);border-radius:10px;
  padding:8px 14px;transition:.16s;}
.la-seg-btn:hover{background:var(--la-primary);color:#fff;border-color:var(--la-primary);
  box-shadow:0 6px 16px rgba(var(--la-primary-rgb),.26);}
.la-seg-btn i{font-size:13px;}

/* taller chart — networks need room */
#netChart{height:600px;}

/* partner-table: clickable name in first column */
#netTable td .la-pt-link{font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
#netTable td .la-pt-link i{font-size:10px;opacity:.55;}
#netTable td .la-pt-link:hover{text-decoration:underline;}
#netTable td .la-pt--lnc{color:var(--la-lnc);}
#netTable td .la-pt--mrna{color:#047857;}

/* shared-miRNA mini intensity bar in the table */
.la-mirbar{position:relative;height:8px;border-radius:5px;background:var(--la-line-2);
  min-width:70px;overflow:hidden;}
.la-mirbar__f{position:absolute;inset:0 auto 0 0;border-radius:5px;
  background:linear-gradient(90deg,var(--la-mir),#fbbf24);}
.la-mircount{font:600 12px var(--la-mono);color:var(--la-ink-2);margin-left:8px;}

/* ============================================================
 * dataset 值下拉（#netDataset）— 只加宽下拉浮层（点击框不变宽）+ 美化富信息行
 * 需配合 JSP 给 #netDataset 加 class="… la-dualpick__val--ds"
 * ============================================================ */
.la-dualpick__val--ds .ts-dropdown{width:420px;}      /* ← 只加宽浮层；点击框仍是 1fr(~146px) */

/* “All datasets (global)” 那行的地球图标 */
.la-dualpick__val--ds .ts-dropdown .la-opt > span i{color:var(--la-primary);margin-right:6px;opacity:.85;}

/* 数据集行：名称居左可截断，右侧 condition · species · count */
.la-opt--ds{display:flex;}
.la-ds-name{flex:0 1 auto;min-width:0;font-weight:700;color:var(--la-ink-2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.la-ds-meta{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;}
.la-ds-cond{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font:600 10px var(--la-mono);text-transform:uppercase;letter-spacing:.03em;
  padding:2px 7px;border-radius:5px;color:#b45309;background:rgba(245,158,11,.14);}  /* disease=琥珀 */
.la-ds-cond--norm{color:#047857;background:rgba(16,185,129,.12);}                       /* normal=绿 */
.la-ds-sp{font:italic 600 11px var(--la-font);color:var(--la-muted);}
.la-ds-cnt{font:600 11px var(--la-mono);color:var(--la-primary-d);
  background:var(--la-bg-tint);border:1px solid var(--la-line);padding:2px 8px;border-radius:999px;white-space:nowrap;}
/* 选中后:选中项与光标保持同一行;名称过长则省略号截断,不再把光标挤下去 */
.la-dualpick__val--ds.single .ts-control{flex-wrap:nowrap;}
.la-dualpick__val--ds.single .ts-control > .item{
  min-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* lncact-network.css：追加到文件末尾 */

/* 让左侧筛选卡片及下拉层压过右侧 network div */
.la-tool-grid,
.la-tool-aside,
.la-tool-aside .la-panel,
.la-dualpick,
.la-dualpick .ts-wrapper {
  overflow: visible;
}

.la-tool-aside {

  z-index: 49;
}

.la-tool-main {
  position: relative;
  z-index: 1;
}

.la-dualpick__val--ds .ts-dropdown {
  width: 420px;
  z-index: 9999;
}

/* gene 行:类型框已移除,单个值下拉铺满整行(覆盖默认的 128px 1fr 两列) */
.la-dualpick--solo{grid-template-columns:1fr;}
/* ============================================================
 * 数据集信息条(#netDsInfo)— 图表标题下方,一行多个"标签+值"
 * ============================================================ */
.la-dsinfo{
  display:flex;flex-wrap:wrap;align-items:flex-start;gap:14px 26px;
  margin:2px 0 16px;padding:13px 18px;border-radius:12px;
  background:var(--la-bg-soft);border:1px solid var(--la-line);
}
.la-dsinfo[hidden]{display:none;}

/* 每个信息项:小标签在上,值在下 */
.la-dsinfo__item{display:inline-flex;flex-direction:column;gap:4px;line-height:1.25;min-width:0;}
.la-dsinfo__k{
  font:600 9.5px var(--la-mono);letter-spacing:.08em;text-transform:uppercase;
  color:var(--la-muted);
}
.la-dsinfo__v{font:600 13px var(--la-font);color:var(--la-ink);white-space:nowrap;}
.la-dsinfo__v b{color:var(--la-ink);font-weight:700;}
.la-dsinfo__v i{color:var(--la-muted);font-style:italic;font-weight:500;}

/* 模态彩色 chip:这里给一份基础样式,颜色继续吃全局的 .la-tcos--T/s/C/O */
.la-dsinfo .la-tcos{
  display:inline-block;font:600 11px var(--la-mono);padding:3px 9px;border-radius:6px;
  text-transform:uppercase;letter-spacing:.04em;
}