/* raw.pub 增补样式：旧界面（styles.css）一字不动，这里只放这次新加的东西。
   1) 公共空间的地球图标 / 语言按钮
   2) 链接列表：操作图标悬停才出现（触屏常驻）
   3) 有效期悬停下划线
   4) 身份悬停提示（code 一行、别名一行）
   5) code 列首字符留 1px 余量，避免被自身裁剪边缘吃掉笔画
   6) 链接列表列宽：窄列给固定宽度、内容列吃掉剩余宽度，避免中间空一大块 */

/* 1) 公共空间前面的地球表示「公共」；语言按钮跟 API 令牌按钮同一套外观；
   下拉菜单挂在 body 上，所以不受页头高度/裁切影响 */
.space-tab-globe { vertical-align: -2px; margin-right: 4px; }
.lang-button svg { flex: none; }
.lang-button .lang-chevron { margin-left: -1px; opacity: .6; }
.lang-menu { position: fixed; z-index: 4000; display: flex; flex-direction: column; padding: 4px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--surface-strong); box-shadow: var(--shadow); }
.lang-menu[hidden] { display: none; }
.lang-menu button { display: flex; align-items: center; justify-content: space-between; padding: .4rem .55rem; border: 0; border-radius: 6px; background: none; color: var(--ink); font-size: .78rem; text-align: left; }
.lang-menu button:hover { background: var(--accent-soft); color: var(--accent-strong); }
.lang-menu button.is-current::after { content: '✓'; margin-left: 12px; color: var(--accent-strong); }
@media (max-width: 720px) { .lang-button .lang-chevron { display: none; } }

/* 2) 操作图标平时藏起来，鼠标停在这一行（或键盘焦点进入）才出现；触屏没有 hover，一直显示 */
.data-table tr .row-icon { opacity: 0; transition: opacity .12s ease; }
.data-table tr:hover .row-icon, .data-table tr:focus-within .row-icon { opacity: 1; }
/* 操作图标自己的列：图标是这一列的普通内容，列宽由 fitListColumns 算（所有行共用），
   所以不管这一行有没有别名、别名多长，图标都落在同一个位置。 */
.management-table .cell-row-actions, .history-table .cell-row-actions { overflow: visible; }
/* 窄屏是固定表头布局，格子得自己声明宽度，不然这一格会和 code 平分剩下的宽度。
   5.8rem 正好放下手机上最大的一组图标（5 个 × 18px）。 */
@media (max-width: 720px) { .data-table .cell-row-actions { width: 5.8rem; max-width: 5.8rem; } }
/* 有口令的链接：口令图标常驻，否则用户根本看不出这条链接要口令 */
.data-table tr .passcode-actions.has-passcode > .passcode-trigger { opacity: 1; }
/* 已连接的地址：管理入口常驻，并靠绿色底提示当前隧道在线 */
.data-table tr .row-icon.is-online { opacity: 1; }

/* 5) code 是等宽字，第一个字的笔画正好压在裁剪边缘上：窗口宽度不同时会整笔消失，留出 1px */
.data-table .link-identifier { padding-left: 1px; }

/* 6) 桌面端：列表是一行行 flex，列宽由 app.js 的 fitListColumns 按「内容宽度、够不够砍」
   直接写在每个格子的 flex-basis 上（所有行共用，所以列对齐）。宽度规则与字段无关，
   只区分保护列（.col-protected）和普通列；行里剩下的宽度留在最后一格之后 */
@media (min-width: 1101px) {
  .data-table, .data-table tbody, .data-table td { display: block; }
  .data-table .cell-expiry-mobile { display: none; } /* 只有窄屏才显示的格子，桌面端不占位 */
  /* 分割线归整行：格子各画各的线会因为每格高度不同而错开（时间格 43px、内容格 34px…） */
  .data-table td { border-bottom: 0; }
  .data-table tr:not([hidden]) { display: flex; align-items: center; border-bottom: 1px solid rgba(220,227,220,.7); }
  /* 别名/code 直接参与这一行的 flex 排布（ident-cell 只是包装），
     长别名会自己收缩并省略，而不是把操作图标顶出单元格 */
  .data-table .ident-cell { display: contents; }
  .data-table .link-identifier { width: auto; min-width: 0; max-width: none; flex: 0 1 auto; }
}

@media (hover: none), (pointer: coarse) { .data-table tr .row-icon { opacity: 1; } }

/* 3) 有效期和别名（code）都可以点着改：悬停给下划线提示 */
.expiry-button:hover, .link-identifier.alias-trigger:hover { text-decoration: underline; text-underline-offset: 2px; }

/* 悬停提示的样式由 tip.js 自带（全站一个来源，隧道页不加载本文件也能用） */