/* 页面专属样式（03 §2.1）：今日工作台 .pg-today、空间账单 .pg-bills、账单详情 .pg-bill，以及账单弹窗内容 .dlg-bill（弹窗渲染在
   页面根元素之外，所以用弹窗内容自己的根类）。归属 WP-F4。只用令牌变量；不写颜色值；不写 prefers-color-scheme（主题只由令牌切换）。 */

/* ================================================================ 今日工作台 */
.pg-today .tq-seat-kpi .kpi-sub { display: flex; flex-direction: column; gap: var(--sp-1); }
.pg-today .tq-seat-kpi .kpi-sub > span { overflow-wrap: anywhere; }
.pg-today .tq-seat-kpi .kpi-sub > span:not(:last-child) { color: var(--c-text-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.pg-today .tq-due-heading { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-2); }
.pg-today .tq-due-heading > .el-button { margin-left: auto; }
.pg-today .tq-due-shortcuts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); margin-bottom: var(--sp-4); }
.pg-today .tq-due-shortcut { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-1) var(--sp-3); text-align: left; padding: var(--sp-3) var(--sp-4); font: inherit; color: var(--c-text); background: var(--c-surface); border: 1px solid var(--c-border); border-left: 4px solid var(--c-danger); border-radius: var(--r-md); cursor: pointer; box-shadow: var(--shadow-1); }
.pg-today .tq-due-shortcut.warn { border-left-color: var(--c-warn); }
.pg-today .tq-due-shortcut:hover { background: var(--c-surface-2); border-color: var(--c-border-strong); }
.pg-today .tq-due-shortcut.danger.on { color: var(--c-danger-ink); background: var(--c-danger-soft); border-color: var(--c-danger); }
.pg-today .tq-due-shortcut.warn.on { color: var(--c-warn-ink); background: var(--c-warn-soft); border-color: var(--c-warn); }
.pg-today .tq-due-label { font-size: var(--fs-base); font-weight: 600; align-self: center; }
.pg-today .tq-due-count { font-size: var(--fs-xl); color: var(--c-danger-ink); }
.pg-today .tq-due-shortcut.warn .tq-due-count { color: var(--c-warn-ink); }
.pg-today .tq-due-hint { grid-column: 1 / -1; color: var(--c-text-3); font-size: var(--fs-xs); }
.pg-today .tq-selection { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; padding: var(--sp-2) var(--sp-4); background: var(--c-surface-2); border-bottom: 1px solid var(--c-border); }
.pg-today .c-queue-item.due-today { border-left: 3px solid var(--c-danger); }
.pg-today .c-queue-item.due-tomorrow { border-left: 3px solid var(--c-warn); }
.pg-today .c-queue-item.due-late { border-left: 3px solid var(--c-danger); }
.pg-today .q-actions { flex-wrap: wrap; }
.pg-today .tq-toolbar { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-3); }
.pg-today .tq-filter { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.pg-today .tq-filter::-webkit-scrollbar { display: none; }
.pg-today .tq-filter .seg { width: max-content; }
.pg-today .tq-filter .seg button { white-space: nowrap; flex-shrink: 0; }
.pg-today .tq-col { display: flex; flex-direction: column; min-width: 0; }
.pg-today .tq-section .queue-head h3 { overflow: hidden; text-overflow: ellipsis; }
.pg-today .tq-link { color: var(--c-brand); }

/* 聚合行（QueueCluster）：标题行沿用 .q-item 栅格；代理一级用浅底区分，子项缩进 */
.pg-today .tq-cluster-head { background: var(--c-surface); }
.pg-today .tq-cluster-head.tq-sel { grid-template-columns: 20px 28px minmax(0, 1fr) auto auto; }
.pg-today .tq-agent > .tq-cluster-head { background: var(--c-surface-2); }
.pg-today .tq-nested > .tq-cluster-head { padding-left: 44px; }
.pg-today .tq-cluster-head .q-title .t a { color: var(--c-text); }
.pg-today .tq-cluster-head .q-title { flex-wrap: wrap; }
.pg-today .tq-cluster-head .q-title .t a:hover { color: var(--c-brand); }
.pg-today .tq-toggle {
  border: 0; background: none; padding: 0; margin: 0; width: 18px; height: 18px; flex-shrink: 0;
  display: inline-grid; place-items: center; border-radius: var(--r-sm); color: var(--c-text-3); cursor: pointer;
}
.pg-today .tq-toggle:hover { color: var(--c-text); background: var(--c-surface-3); }
.pg-today .tq-children { border-bottom: 1px solid var(--c-border); }
.pg-today .tq-children > .q-item:last-child,
.pg-today .tq-children > .tq-cluster:last-child > .tq-children { border-bottom: 0; }
.pg-today .tq-more { padding: var(--sp-1) var(--sp-4); border-top: 1px solid var(--c-border); }
.pg-today .tq-hidden-head { padding: 6px 16px; background: var(--c-surface-2); border-bottom: 1px solid var(--c-border); letter-spacing: .02em; }
.pg-today .q-item.muted .q-title,
.pg-today .q-item.muted .q-amount { color: var(--c-text-3); }

/* 右侧窄列（340px）：聚合行的操作换到第二行，与 queue-item 的 stacked 一致 */
.pg-today .grid-main > .tq-col:last-child .tq-cluster-head { grid-template-columns: 28px minmax(0, 1fr) auto; }
.pg-today .grid-main > .tq-col:last-child .tq-cluster-head.tq-sel { grid-template-columns: 20px 28px minmax(0, 1fr) auto; }
.pg-today .grid-main > .tq-col:last-child .tq-cluster-head .q-actions { grid-column: 2 / -1; justify-content: flex-start; flex-wrap: wrap; }
.pg-today .grid-main > .tq-col:last-child .tq-cluster-head.tq-sel .q-actions { grid-column: 3 / -1; }

@media (max-width: 900px) {
  .pg-today .tq-due-shortcuts { gap: var(--sp-2); }
  .pg-today .tq-due-shortcut { padding: var(--sp-2); gap: var(--sp-1); }
  .pg-today .tq-due-count { font-size: var(--fs-lg); }
  .pg-today .tq-due-label { font-size: var(--fs-sm); }
  .pg-today .tq-due-hint { display: none; }
  .pg-today .tq-selection { gap: var(--sp-2); }
  .pg-today .tq-toolbar { gap: var(--sp-2); }
  .pg-today .tq-filter { flex: 1 1 100%; min-width: 0; }
  .pg-today .tq-cluster-head.tq-sel { grid-template-columns: 20px 28px minmax(0, 1fr) auto; }
  .pg-today .tq-cluster-head .q-actions { flex-wrap: wrap; }
  .pg-today .tq-cluster-head.tq-sel .q-actions { grid-column: 3 / -1; }
  .pg-today .tq-nested > .tq-cluster-head { padding-left: 32px; }
}

/* ================================================================ 空间账单 */
.pg-bills .tb-ws, .pg-bills .tb-card { min-width: 0; line-height: 1.4; }
.pg-bills .tb-actions { justify-content: flex-end; }
.pg-bills .tb-cal .toolbar { flex-wrap: wrap; }
.pg-bills .tb-month { margin: 0; min-width: 7.5em; text-align: center; font-size: var(--fs-base); font-weight: 600; }
.pg-bills .tb-month-sum { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pg-bills .cal-item, .tb-cal-pop .cal-item { text-decoration: none; display: flex; align-items: baseline; gap: 4px; min-width: 0; }
.pg-bills .cal-item .tb-ci-name, .tb-cal-pop .cal-item .tb-ci-name { min-width: 0; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg-bills .cal-item .c-money, .tb-cal-pop .cal-item .c-money { flex-shrink: 0; font-size: inherit; color: inherit; }
.pg-bills .tb-cal-legend { display: flex; flex-wrap: wrap; gap: var(--sp-2); padding: var(--sp-2) var(--sp-4); border-top: 1px solid var(--c-border); }
.pg-bills .tb-cal-legend .cal-item { display: inline-flex; }
.pg-bills .cal-day a.cal-item:hover { box-shadow: inset 0 0 0 1px var(--c-border-strong); }
.pg-bills .tb-cal-more {
  border: 0; background: none; padding: 0 6px; margin: 0; text-align: left; cursor: pointer; font: inherit;
  font-size: var(--fs-xs); color: var(--c-brand); border-radius: var(--r-sm);
}
.pg-bills .tb-cal-more:hover { background: var(--c-surface-3); }
.pg-bills .tb-day-total { margin-top: auto; }
.pg-bills .tb-cal-group + .tb-cal-group { border-top: 1px solid var(--c-border); }
.pg-bills .tb-cal-date { margin: 0; padding: 10px 16px 6px; font-size: var(--fs-sm); font-weight: 600; color: var(--c-text-2); background: var(--c-surface-2); }
.pg-bills .tb-cal-date.is-today { color: var(--c-brand-ink); }
.pg-bills .tb-cal-row { grid-template-columns: minmax(0, 1fr) auto; }
.pg-bills a.tb-cal-row:hover { background: var(--c-surface-2); }

/* ================================================================ 账单详情 */
.pg-bill .tb-col { min-width: 0; }
.pg-bill .tb-col > .card + .card { margin-top: 0; }
.pg-bill .tb-seats { width: 100%; border-collapse: collapse; font-size: var(--fs-md); }
.pg-bill .tb-seats th, .pg-bill .tb-seats td { padding: 8px 16px; border-bottom: 1px solid var(--c-border); text-align: left; }
.pg-bill .tb-seats th { color: var(--c-text-3); font-size: var(--fs-sm); font-weight: 500; background: var(--c-surface-2); }
.pg-bill .tb-seats .text-right { text-align: right; }
.pg-bill .tb-seats tfoot td { border-bottom: 0; }
.pg-bill .tb-need { list-style: none; margin: 0; padding: 0; }
.pg-bill .tb-need li { display: flex; align-items: center; gap: var(--sp-2); padding: 6px 0; border-top: 1px solid var(--c-border); font-size: var(--fs-sm); min-width: 0; }
.pg-bill .tb-need li.tb-need-mine { background: var(--c-brand-soft); border-radius: var(--r-sm); padding: 6px 8px; }

/* ================================================================ 账单弹窗内容（bill-confirm / bill-reason / bill-due-date） */
.dlg-bill .dlg-bill-table { max-height: 52vh; overflow: auto; border: 1px solid var(--c-border); border-radius: var(--r-md); }
.dlg-bill .dlg-bill-cards { max-height: 52vh; overflow: auto; border: 1px solid var(--c-border); border-radius: var(--r-md); }
.dlg-bill .dlg-bill-cards .card-row { grid-template-columns: minmax(0, 1fr) auto; }
.dlg-bill .dlg-bill-list { max-height: 240px; overflow: auto; box-shadow: none; }
.dlg-bill .dlg-bill-line { padding: 6px 12px; border-bottom: 1px solid var(--c-border); min-width: 0; }
.dlg-bill .dlg-bill-line:last-child { border-bottom: 0; }
.dlg-bill .dlg-bill-ws { min-width: 0; }
.dlg-bill .dlg-bill-ws .c-product-tag { flex-shrink: 0; }