/* ==========================================================================
   EdgeGate 管理台 · 全局自定义样式
   唯一的自定义样式文件：设计 token + 公共组件类，其余一律使用 Tabler 1.4.0 默认。
   各页面模板不得包含私有 <style> 块；需要的自定义效果在此定义后全局引用。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 设计 token：通道状态色语义
    在线 / 已接管 = 绿   异常 = 红   待命 = 黄
    维护 = 蓝           检测中 = 灰
    JS 侧对应 badge 类映射见 dashboard.gohtml 的 channelBadge。
   -------------------------------------------------------------------------- */
:root {
  --eg-state-online-bg: var(--tblr-green-lt);     /* 在线 / 已接管 */
  --eg-state-error-bg: var(--tblr-red-lt);        /* 异常 */
  --eg-state-standby-bg: var(--tblr-yellow-lt);   /* 待命 */
  --eg-state-maint-bg: var(--tblr-blue-lt);       /* 维护 */
  --eg-state-checking-bg: var(--tblr-secondary-lt); /* 检测中（初始态） */
}

/* --------------------------------------------------------------------------
   2. 通道状态组（顶栏右侧）
    结构：<span class="channel-status-item">主通道 <span class="badge bg-…">在线</span></span>
    约束：整体不换行；文字与徽章字号不小于 12px。
   -------------------------------------------------------------------------- */
.channel-status {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .75rem;
  white-space: nowrap;
}
.channel-status-item {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  font-size: .75rem;            /* 12px */
  color: var(--tblr-secondary-color);
}
.channel-status .badge {
  font-size: .75rem;            /* 12px，覆盖 badge 默认的 .857em 相对字号 */
}

/* --------------------------------------------------------------------------
   3. 表单公共类
   -------------------------------------------------------------------------- */

/* 单选项（radio / checkbox）下方提示的缩进，与 form-check-label 文本对齐 */
.check-hint {
  padding-left: 2rem;           /* 与 .form-check 的 padding-left 一致 */
  margin-top: -.5rem;           /* 抵消 .form-check 的下边距，视觉成组 */
}

/* 设备编号等只读展示：等宽字体（原先 class 无定义，收敛为全局类） */
.code-plain {
  font-family: var(--tblr-font-monospace);
  font-weight: var(--tblr-font-weight-medium);
}

/* --------------------------------------------------------------------------
   4. sparkline 折线（原生 SVG，无图表库）
   -------------------------------------------------------------------------- */
.sparkline { display: block; width: 100%; height: 56px; }
.sparkline polyline { fill: none; stroke: currentColor; stroke-width: 1.5;
                      vector-effect: non-scaling-stroke; }

/* --------------------------------------------------------------------------
   5. 零散修正
   -------------------------------------------------------------------------- */

/* 长 ID / 域名换行 */
code { overflow-wrap: anywhere; }

/* toast 挂载点不拦截点击，单条 toast 可交互 */
#toast-container { pointer-events: none; }
#toast-container .toast { pointer-events: auto; }

/* 深色侧栏底部信息可读性 */
#sidebar-menu .mt-auto code { color: inherit; }

/* 打印时仅保留正文 */
@media print { .page-body { padding: 0 !important; } }