/* 合作夥伴專區（對外）— 2026-10-31
   只給合作方看：手機優先、單欄、不需要教學。
   刻意不 import 門店系統的樣式（那是給員工看的介面，按鈕多、資訊密）。 */

:root{
  --green:#0f5132; --green-2:#1a6b47; --ink:#1b2520; --muted:#6b7570;
  --line:#e3e7e4; --bg:#f5f7f5; --card:#fff; --warn:#b45309; --danger:#b91c1c;
  --r:14px;
}
*{box-sizing:border-box}
/* ★ 一定要有這一行（2026-10-31 截圖抓到）：
   `.wrap-login{display:flex}` 這種「作者樣式」會蓋掉瀏覽器預設的 `[hidden]{display:none}`，
   所以 JS 設了 `el.hidden = true` 根本不會藏起來 —— 登入成功後登入卡還留在畫面上，
   而且整頁被它的 100vh 撐開，看起來像壞掉。 */
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink);
  font:15px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  -webkit-text-size-adjust:100%;
}
a{color:var(--green-2)}
h2{margin:0;font-size:15.5px;font-weight:700}
.muted{color:var(--muted);font-size:12.5px}
.tiny{color:var(--muted);font-size:11.5px}
.err{color:var(--danger);font-size:13px;margin:6px 0}

/* ---------- 登入 ---------- */
.wrap-login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.login-card{
  width:100%;max-width:380px;background:var(--card);border:1px solid var(--line);
  border-radius:18px;padding:26px 22px 18px;box-shadow:0 10px 30px rgba(15,81,50,.07)
}
.brand{text-align:center;margin-bottom:14px}
.brand-mark{
  display:inline-block;background:var(--green);color:#fff;font-size:20px;font-weight:800;
  letter-spacing:.12em;padding:8px 14px;border-radius:10px
}
.brand-sub{margin-top:8px;color:var(--muted);font-size:12.5px;letter-spacing:.04em}
.login-hint{color:var(--muted);font-size:13px;text-align:center;margin:0 0 16px;line-height:1.7}
.fld{display:block;margin-bottom:12px}
.fld>span{display:block;font-size:12.5px;color:var(--muted);margin-bottom:5px}
input,textarea,select{
  width:100%;font:inherit;color:inherit;background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:10px 12px;outline:none
}
input:focus,textarea:focus{border-color:var(--green-2);box-shadow:0 0 0 3px rgba(26,107,71,.10)}
textarea{resize:vertical}
.btn{
  font:inherit;border:1px solid var(--line);background:#fff;color:var(--ink);
  padding:9px 14px;border-radius:10px;cursor:pointer
}
.btn.primary{background:var(--green);border-color:var(--green);color:#fff;font-weight:600}
.btn.primary:active{background:var(--green-2)}
.btn.ghost{background:transparent}
.btn.sm{padding:6px 10px;font-size:13px}
.btn.block{width:100%;margin-top:6px}
.btn:disabled{opacity:.55;cursor:default}

/* ---------- 主畫面 ---------- */
.top{
  position:sticky;top:0;z-index:5;background:var(--green);color:#fff;
  display:flex;align-items:center;gap:10px;padding:12px 16px
}
.top-l{flex:1;min-width:0}
.top-name{font-weight:700;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-sub{font-size:11.5px;opacity:.75;margin-top:1px}
.top .btn.ghost{color:#fff;border-color:rgba(255,255,255,.32)}
#main{max-width:720px;margin:0 auto;padding:14px 14px 40px}

.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:11px 12px}
.kpi b{display:block;font-size:19px;line-height:1.25;font-variant-numeric:tabular-nums}
.kpi span{display:block;color:var(--muted);font-size:11.5px;margin-top:2px}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin-bottom:14px;overflow:hidden}
.card-h{display:flex;align-items:baseline;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line)}
.card-h h2{flex:1}
.card-b{padding:12px 14px}
.card-b.tight{padding:0}

/* 案源 */
.cs{border:1px solid var(--line);border-radius:12px;padding:11px 12px;margin-bottom:10px}
.cs:last-child{margin-bottom:0}
.cs-t{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.cs-t b{font-size:14.5px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tag{font-size:11.5px;padding:2px 8px;border-radius:999px;background:#eef4f0;color:var(--green);white-space:nowrap}
.tag.won{background:#e7f6ec;color:#0f7b3a}
.tag.lost{background:#f3f4f4;color:#6b7280}
.tag.quoted{background:#fff4e5;color:#b45309}
.cs-meta{color:var(--muted);font-size:12.5px;margin-top:2px}
.cs-num{display:flex;gap:16px;margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.cs-num div{font-size:12px;color:var(--muted)}
.cs-num b{display:block;font-size:14.5px;color:var(--ink);font-variant-numeric:tabular-nums}
.cs-num b.paid{color:#0f7b3a}
.cs-num b.due{color:var(--warn)}

/* 討論 */
.talk{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.talk:last-child{border-bottom:0}
.talk-d{width:58px;flex:none;text-align:center}
.talk-d b{display:block;font-size:13px}
.talk-d span{display:block;font-size:11px;color:var(--muted)}
.talk-t{flex:1;min-width:0;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 檔案 */
.file{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.file:last-child{border-bottom:0}
.file-i{flex:1;min-width:0}
.file-n{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-m{font-size:11.5px;color:var(--muted)}

/* 對話 */
.msgs{max-height:46vh;overflow:auto;padding:12px 14px;display:flex;flex-direction:column;gap:8px;background:#fbfcfb}
.msg{max-width:82%;padding:8px 11px;border-radius:12px;font-size:13.5px;white-space:pre-wrap;word-break:break-word}
.msg.them{background:#fff;border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.msg.me{background:var(--green);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.msg .t{display:block;font-size:10.5px;opacity:.65;margin-top:3px}
.chat-in{display:flex;gap:8px;padding:10px 14px 14px;border-top:1px solid var(--line);align-items:flex-end}
.chat-in textarea{flex:1;min-height:42px;max-height:120px}
.chat-in .btn{flex:none;height:42px}
.empty{color:var(--muted);font-size:13px;text-align:center;padding:14px 0}
.foot{text-align:center;color:var(--muted);font-size:11.5px;margin-top:6px}

@media (max-width:420px){
  .kpis{grid-template-columns:repeat(3,1fr);gap:8px}
  .kpi b{font-size:17px}
  #main{padding:12px 10px 32px}
}