/* ⚠️ .icard / .icard .nm / .icard .chg 在 mklab-theme.css 也有定義（見該檔開頭註解）。
   目前是互補關係：本檔管文字溢出省略號，mklab-theme.css 管字體大小/粗細，並非真的衝突，可保留。 */

/* 全局阻止水平滑動 */
html {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

/* 手機專屬抽屜 */
@media (max-width: 768px) {
  .drawer {
    position: fixed;
    inset: 0;
    width: 260px;
    max-width: 90%;
    height: 100vh;
    background: var(--bg-elevated);
    box-shadow: 2px 0 16px rgba(0,0,0,0.2);
    z-index: 1001;
    transition: transform 0.3s ease;
    transform: translateX(-100%);
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
  }
  
  .drawer.open { transform: translateX(0); }
  
  .drawer-mask {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 999;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .drawer-mask.open { display: block; opacity: 1; }
  
  .mobile-menu-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 24px;
    color: var(--ink);
    padding: 4px;
    order: 99; /* 排到 search/dark/github 之後，維持在最右邊 */
  }

  /* 手機版已有漢堡選單鍵可開抽屜，Shell.mount() 動態插入的齒輪鍵會重複，故隱藏 */
  #utilbar [data-shell-tools] button[title="設定"] {
    display: none;
  }
}

/* 桌面版：抽屜改為錨定右上角的浮動面板，預設隱藏，點擊設定鍵才淡入顯示 */
@media (min-width: 769px) {
  .mobile-menu-btn { display: none; }
  .drawer {
    position: fixed;
    top: 64px;
    right: 20px;
    left: auto;
    inset: auto 20px auto auto;
    width: 320px;
    max-width: min(90vw, 320px);
    height: auto;
    max-height: calc(100vh - 90px);
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: 0 12px 32px rgba(0,0,0,0.3);
    z-index: 1002;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
    transform: translateY(-8px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
  }
  .drawer.open {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
    pointer-events: auto;
  }
  /* 桌面版不需要暗色全螢幕遮罩，改用透明點擊層：點外面即可關閉面板 */
  .drawer-mask {
    display: none;
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 1001;
  }
  .drawer-mask.open { display: block; }
}

/* Industry card text overflow */
.icard .nm,
.icard .chg {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  max-width: 100%;
}

/* 個股筆記角標（Watchlist 共用） */
.badge-notes { cursor: pointer; font-size: 12px; }

/* 每日摘要頁 RSS 訂閱連結 */
.rss-link { font-size: 12px; }

/* 表單輸入框與主要按鈕（backtest/research 等頁共用，取代散落各處的行內硬寫樣式） */
.field-input {
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
  color: var(--ink);
}
.btn-primary {
  padding: 8px 16px;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}
.btn-primary.mt { margin-top: 14px; }

[data-theme="dark"] input,
[data-theme="dark"] select { color-scheme: dark; }
[data-theme="light"] input,
[data-theme="light"] select { color-scheme: light; }

/* 動態色塊（熱力圖 / 漲跌分布長條）：顏色由 JS 依資料即時運算，
   透過 CSS 自訂屬性帶入，避免 style="background:..." 這種硬寫樣式 */
.heat-cell { background: var(--cell-bg, transparent); text-align: center; }
.breadth-bar-fill { background: var(--bar-fill, var(--muted)); }

/* ===== 補齊 HTML 中使用但缺少定義的樣式（footer/utility/次要按鈕/比較頁移除鍵等） ===== */
.footer-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 6px 14px;
}
.hamburger { line-height: 1; }
.heatmap-table { width: 100%; border-collapse: collapse; }

/* 表格/清單裡的小型移除鍵（Compare 頁比較清單使用） */
.cmp-rm {
  margin-left: 6px;
  cursor: pointer;
  color: var(--muted);
}
.cmp-rm:hover { color: var(--down); }

/* Screener 頁複選條件群組的間距 */
.chk-mb { margin-bottom: 10px; }

/* 通用排版 utility class（各頁面 placeholder / 說明文字共用） */
.text-center { text-align: center; }
.text-sm { font-size: 12px; }
.py-2 { padding-top: 8px; padding-bottom: 8px; }
.py-4 { padding-top: 16px; padding-bottom: 16px; }
.py-6 { padding-top: 24px; padding-bottom: 24px; }
.mt-2 { margin-top: 8px; }

/* 通用次要按鈕（Research K 線工具列等使用；工具列本身有更明確的樣式時以工具列為準） */
.btn {
  padding: 8px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  transition: background var(--transition-fast), border-color var(--transition-fast);
}
.btn:hover { background: var(--row-hover); }
.btn-secondary { background: var(--surface); color: var(--ink); }
.btn-ghost { background: transparent; color: var(--muted); }
.btn-ghost:hover { background: var(--row-hover); color: var(--ink); }