/* ===================================================================
   responsive.css — 全站 RWD 地基層(2026-06-05 建立)
   只放「全域行動版基礎規則」,全部包在 @media (max-width:768px) 內,
   桌機 >768px 完全不受影響。逐頁斷點之後分批補,不在本檔。

   診斷基線(前夜 RWD 稽核):107 固定大寬 / 137 nowrap / 43 table /
   772 處 ≤11px / flex-wrap 僅兩成 / viewport 正確 / 主斷點 max-width:768px。

   選擇器一律具體(輸入元件 / table / .app-main / .rwd-scroll-x),
   不用會誤傷的萬用選擇器。本檔無任何顏色宣告,不涉 29-1~29-3 配色。

   !important 說明:稽核顯示大量元素帶「行內 style font-size/width」,
   外部 CSS 預設蓋不過行內樣式;地基層的目的是強制壓掉系統性硬傷,
   故僅在必須勝出的宣告上加 !important,且全在行動斷點內,桌機零影響。
   =================================================================== */
@media (max-width: 768px) {

  /* 1. 殺 iOS Safari 輸入 focus 自動放大:輸入類字級須 ≥16px */
  input,
  select,
  textarea {
    font-size: 16px !important;
  }

  /* 1b. 訪談需求表 date 欄手機溢出:iOS 原生 input[type=date] intrinsic 寬撐爆父 grid 1fr 格 → 黑框超出黃卡。appearance:none 讓控制可縮回格內,picker 點擊仍正常 */
  #page-interview input[type="date"] {
    -webkit-appearance: none;
    appearance: none;
    min-width: 0;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }

  /* 1c. 儀表板 BRIEFING|公告 並排排手機收單欄:main.css:2441 無條件 .dv3-toprow{1fr 1fr} 排在 2438 的 @980 收欄規則之後、同 specificity → 所有寬度都贏使斷點失效。!important 蓋過非-important 的 2441,>768 維持原樣零回歸 */
  .dv3 .dv3-toprow { grid-template-columns: 1fr !important; }

  /* 1d. 客戶卡片返回鈕金框手機被裁:.cli-mobile-back inline margin 左/上負邊距(-16px)+ main.css:1971 #cli-detail-view>div{padding:0} → 鈕被推到螢幕外左(left≈-4),body/.page overflow-x:hidden 裁掉金框左/上緣。歸零負邊距讓鈕回內容左緣、金框完整(margin-bottom/right 不動) */
  .cli-mobile-back { margin-left: 0 !important; margin-top: 0 !important; }

  /* 2. 表格可橫向捲動、不撐破版面(43 張 table 系統性溢出) */
  table {
    display: block !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  /* 3. 主內容殼防整頁橫向溢出(107 處固定大寬的最後防線) */
  .app-main {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* 4. 工具 class:之後逐頁套在會超寬的容器上(本批只定義,不套用) */
  .rwd-scroll-x {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

}

/* ===================================================================
   第一批逐頁 RWD(2026-06-20):客戶/專案列表卡片化 + 儀表板我的任務殘修
   金標準:design/mockups/mobile_list_v1.html(緊湊版 A)
   只動版面,全 --lhrm-* token;桌機 >768px 完全不受影響(本檔僅 ≤768/≤560)
   =================================================================== */
@media (max-width: 768px) {

  /* 1. 客戶/專案列表:六格單行 → 堆疊卡片(案名整行 + 階段 badge 絕對右上 + 其餘 meta flex-wrap) */
  .cli-list-row,
  .pm-list-row {
    flex-wrap: wrap !important;
    align-items: center !important;
    position: relative !important;
    row-gap: 7px !important;
    padding: 13px 14px !important;
    min-height: 60px !important;
  }
  .cli-list-row .llr-name,
  .pm-list-row .llr-name {
    flex: 0 0 100% !important;
    font-size: 15px !important;
    padding-right: 100px;
  }
  .cli-list-row .llr-stage,
  .pm-list-row .llr-stage {
    position: absolute !important;
    top: 12px !important;
    right: 14px !important;
    max-width: 96px;
    overflow: hidden;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
  }
  .cli-list-row > div:not(.llr-name):not(.llr-stage),
  .pm-list-row > div:not(.llr-name):not(.llr-stage) {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  /* 2. 儀表板「我的任務」列:名稱+倒數一行,進度條改下方滿寬(原 .mtb 固定 110px 擠右) */
  .dv3 .dv3-mytask .mtr { flex-wrap: wrap !important; }
  .dv3 .dv3-mytask .mtn { flex: 1 1 auto !important; min-width: 0; white-space: normal !important; }
  .dv3 .dv3-mytask .mtp { flex: 0 0 100% !important; margin-left: 0 !important; margin-top: 9px !important; }
  .dv3 .dv3-mytask .mtb { flex: 1 1 auto !important; width: auto !important; }

  /* 3. 觸控:儀表板內小操作鈕點擊區補到 ≥44px(原 padding 6px 13px≈32px) */
  .dv3 button { min-height: 44px !important; }

}

@media (max-width: 560px) {
  /* 每日任務 / 員工卡 窄屏由 2 欄再降 1 欄 */
  .dv3 .dv3-daily,
  .dv3 .dv3-empgrid { grid-template-columns: 1fr !important; }
}

/* ===================================================================
   batch 2 財務群(2026-06-20):fin-tab 溢出捲動 + PnL 損益觸控/版面殘修
   只動版面;桌機 >768px 不受影響。全 --lhrm-* token
   =================================================================== */
@media (max-width: 768px) {

  /* 1. 財務分頁列:單行可左右滑(原 6 分頁不 wrap 被 .app-main overflow-x:hidden 裁掉,點不到專案損益/發票) */
  .fin-tabbar {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }
  .fin-tabbar .fin-tab {
    flex: none !important;
    white-space: nowrap !important;
  }

  /* 2. PnL 操作鈕(鎖/編輯/刪除)觸控常駐(原 opacity:0 列 hover 才顯,觸控點不出) */
  .pnl-row-ops { opacity: 1 !important; }

  /* 3. PnL 詳情外框 padding 縮(原 inline 40px 44px,窄屏吃 88px) */
  #pnl-detail-view { padding: 16px 14px !important; }

  /* 4. KPI 降欄 → 2 欄(彙總 6 卡 3→2、修飾損益 4 卡 → 2) */
  #pnl-summary-cards { grid-template-columns: repeat(2, 1fr) !important; }
  #pnl-detail-view .pnl-kpi4 { grid-template-columns: repeat(2, 1fr) !important; }

}