/* 網站層級的樣式（頁面外框、導覽、主題切換）。元件樣式在 components.css，顏色與字級在 tokens.css。 */
.app-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.app-skip { position: absolute; left: var(--space-4); top: -48px; z-index: 10; padding: var(--space-2) var(--space-3); background: var(--accent); color: var(--on-accent); border-radius: var(--radius-md); text-decoration: none; }
.app-skip:focus { top: var(--space-2); }

.app-topbar { position: sticky; top: 0; z-index: 20; }
.app-brand { color: var(--ink); text-decoration: none; }
.app-theme select { font: inherit; font-size: 12px; height: var(--control-sm); padding: 0 var(--space-2); color: var(--ink); background: var(--surface-raised); border: 1px solid var(--line-strong); border-radius: var(--radius-md); cursor: pointer; }
.app-theme option { background: var(--surface); color: var(--ink); }

.app-footer { max-width: var(--page-max); margin: 0 auto; padding: 0 var(--space-6) var(--space-8); font-size: 12px; line-height: 18px; color: var(--ink-faint); }
.app-footer p { margin: 0 0 var(--space-1); }

/* 策略詳情 / 模擬頁的策略切換下拉 */
.app-select { min-width: 220px; }
.app-select .sl-field__box { height: var(--control-md); }

/* 當日明細的小表格 */
.app-daylist { margin: 0; padding: 0; list-style: none; }
.app-daylist li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--space-3); align-items: center; padding: 8px 0; border-bottom: 1px solid var(--line); }
.app-daylist li:last-child { border-bottom: 0; }
.app-daylist a { color: var(--ink); text-decoration: none; min-width: 0; }
.app-daylist a:hover .sl-strat__name { text-decoration: underline; }
.app-daylist__lev { font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted); }
.app-daylist__empty { color: var(--ink-muted); font-size: 13px; padding: var(--space-3) 0; }
.app-colhead { margin: 0 0 var(--space-1); font-size: 12px; line-height: 16px; font-weight: 500; color: var(--ink-muted); }

/* 模擬頁的策略標頭 */
.app-simhead { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-bottom: var(--space-4); padding-bottom: var(--space-4); border-bottom: 1px solid var(--line); }
.app-simhead__name { font-size: 18px; line-height: 26px; font-weight: 600; margin-right: var(--space-2); }

/* 手機與平板：導覽列改成第二行、可橫向捲動 */
@media (max-width: 960px) {
  .app-topbar { flex-wrap: wrap; height: auto; padding-top: 10px; row-gap: 6px; }
  .app-topbar .sl-nav { display: flex; order: 3; width: 100%; overflow-x: auto; padding-bottom: var(--space-2); }
}
@media (max-width: 640px) {
  .app-footer { padding: 0 var(--space-4) var(--space-6); }
  .app-topbar .sl-topbar__right { gap: var(--space-2); }
  .app-select { min-width: 0; width: 100%; }
  .sl-pagehead__actions { width: 100%; }
  .sl-search { width: 100%; }
  .sl-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
  .sl-stat { padding: var(--space-3) var(--space-4); }
  .sl-stat__value { font-size: 22px; line-height: 28px; }
  .sl-stat__value .sl-pnl--xl { font-size: 22px; line-height: 28px; }
  .sl-stat__label .sl-spark { display: none; }
}
