/* ═══════════════════════════════════════════════════════════════════════
   fill-ui-auth.css ＝ 授權書 next 版（fill-ui-auth.js）專用樣式（2026-10-19）
   與 fill-ui.css 一起載入；只用 .fu-* 類別。理賠／契約變更頁不需要載入這支。
   ═══════════════════════════════════════════════════════════════════════ */

/* ── ① 繳費方式（信用卡／轉帳）── */
.fu-pay{margin:0 0 14px}
.fu-pay-lb{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:0 0 8px}
.fu-pay-lb b{font-size:13.5px;font-weight:800;color:var(--fx-hd)}
.fu-pay-lb span{font-size:12px;color:var(--fx-soft);line-height:1.5}
.fu-seg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fu-seg-b{position:relative;display:flex;align-items:center;gap:12px;padding:12px 44px 12px 14px;min-height:62px;border:1.5px solid var(--fx-line);border-radius:14px;background:var(--fx-card);cursor:pointer;text-align:left;font-family:inherit;color:var(--fx-text);transition:border-color .15s,background .15s,box-shadow .15s}
.fu-seg-b:hover{border-color:var(--fx-gold)}
.fu-seg-b::after{content:"";position:absolute;right:14px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;border:2px solid var(--fx-inb);background:transparent;box-sizing:border-box}
.fu-seg-b.on{background:var(--fx-acc-bg);border-color:var(--fx-gold);box-shadow:0 10px 22px -16px rgba(232,160,32,.95)}
.fu-seg-b.on::after{border-color:var(--fx-gold);background:radial-gradient(circle,var(--fx-gold) 0 4px,transparent 5px)}
.fu-seg-i{font-size:26px;line-height:1;flex:0 0 auto}
.fu-seg-t{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.fu-seg-t b{font-size:15.5px;font-weight:800}
.fu-seg-t small{font-size:11.5px;color:var(--fx-soft);font-weight:500}
.fu-seg-b.on .fu-seg-t b{color:var(--fx-hd)}
.fu-pay-hid{margin:2px 0 10px;font-size:12px;color:var(--fx-soft);line-height:1.55}
.fu-dg-hint{border-left:3px solid var(--fu-need-bar);padding:4px 10px;background:var(--fu-need-bg);border-radius:0 8px 8px 0;color:var(--fx-text)}

/* ── 授權人區：引擎帶來的「同法定代理人」「戶名帶入」小控制 ── */
.fu-grid .fu-hold-sw{display:flex;align-items:center;gap:12px;margin-top:2px}
.fu-grid .fu-hold-lg{font-size:12.5px!important;color:var(--fx-muted)!important;font-weight:600;cursor:pointer}
.fu-grid .fu-hold-lg input{width:16px;height:16px;margin:0}
.fu-grid #acOwnRow{flex-wrap:wrap;padding:2px 11px 0}
.fu-grid #acOwnRow>span{font-size:12px;color:var(--fx-muted)!important}
.fu-grid #acOwnRow #acOwnSelf{display:none}
.fu-grid #acOwnRow button{min-height:30px}

/* ── 郵局帳戶：引擎內建的黃底框配合明暗 ── */
.fu-grid #stampPostBlock{background:var(--fu-need-bg)!important;border-color:var(--fu-need-line)!important;color:var(--fx-text)}
.fu-grid label:has(#f_isPost){font-size:13px;color:var(--fx-text)!important;font-weight:600;padding:2px 4px}
.fu-grid #f_isPost{width:16px!important;height:16px;margin:0}

/* ── 結構式地址、卡號、有效期限等引擎小工具在新版容器內的對齊 ── */
.fu-grid [data-fk] .flex-wrap{gap:4px}
.fu-grid [data-fk=cardNo] input{text-align:center;letter-spacing:.04em}
.fu-grid [data-fk=cardNo] .flex{flex-wrap:wrap}
.fu-grid [data-fk=cardExp] input{text-align:center;width:64px}

/* ── 提示氣泡（切換繳費方式後換票的說明）── */
.fu-toast{position:fixed;left:50%;bottom:104px;transform:translateX(-50%);z-index:100003;max-width:min(560px,90vw);padding:10px 18px;border-radius:12px;background:#1e293b;color:#fff;font-size:13px;line-height:1.6;white-space:pre-line;box-shadow:0 10px 30px rgba(15,23,42,.35);opacity:1;transition:opacity .35s}
.fu-toast.out{opacity:0}

/* ── 右欄：僅文字開關 ── */
.fu-rv-ov{display:flex;align-items:flex-start;gap:8px;margin:2px 16px 8px;padding:8px 10px;border-radius:10px;background:var(--fx-card2);border:1px solid var(--fx-line);font-size:12.5px;color:var(--fx-muted);line-height:1.5}
.fu-rv-ov label{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--fx-text);cursor:pointer;white-space:nowrap}
.fu-rv-ov small{font-size:11.5px;color:var(--fx-soft)}
.fu-rv-ov.on{background:var(--fx-acc-bg);border-color:var(--fx-gold)}

/* ── 保單號碼區（SPEC 9b）：每家一列旁的「新契約編號」、區塊底部的「要保時間」 ── */
.fu-prow .fu-pes{display:flex;flex-direction:column;gap:6px;flex:1 1 230px;min-width:0}
.fu-pe{display:flex;flex-direction:column;gap:2px;min-width:0}
.fu-pe small{font-size:11.5px;font-weight:600;color:var(--fx-soft);line-height:1.3}
body .fu-pe input,body .fu-pf input{width:100%;height:38px;font-size:14px;padding:0 10px;border:1px dashed var(--fx-inb);border-radius:10px;border-left:3px solid var(--fu-opt-line);background:var(--fx-field)}
body .fu-pe.ok input,body .fu-pf.ok input{border-style:solid;border-left:3px solid var(--fu-ok-bar);background:var(--fu-ok-bg)}
body .fu-pe.need input,body .fu-pf.need input{border-style:solid;border-left:3px solid var(--fu-need-bar);background:var(--fu-need-bg)}
.fu-pfoot{display:flex;flex-wrap:wrap;gap:8px 16px;padding:8px 0 2px;margin-top:4px;border-top:1px dashed var(--fx-line2)}
.fu-pfoot:first-child{border-top:0;margin-top:0}
.fu-pf{display:flex;flex-direction:column;gap:2px;flex:1 1 220px;min-width:0;max-width:340px}
.fu-pf-lb{display:flex;flex-wrap:wrap;align-items:baseline;gap:1px 8px}
.fu-pf-lb b{font-size:12.5px;font-weight:700;color:var(--fx-hd)}
.fu-pf-pr{font-size:11px;color:var(--fx-soft)}
@media (max-width:640px){
  body .fu-pe input,body .fu-pf input{height:42px;font-size:16px}
  .fu-prow .fu-pes{flex:1 1 100%}
  .fu-pf{max-width:none;flex:1 1 100%}
}

@media (max-width:1000px){
  .fu-rv.open .fu-rv-ov{display:flex}
  .fu-rv .fu-rv-ov{display:none}
}
@media (max-width:640px){
  .fu-seg{grid-template-columns:1fr 1fr;gap:8px}
  .fu-seg-b{padding:10px 36px 10px 12px;gap:9px;min-height:58px}
  .fu-seg-b::after{right:11px}
  .fu-seg-i{font-size:22px}
  .fu-seg-t b{font-size:14.5px}
  .fu-toast{bottom:92px}
}

/* ── 選文件格：寬一點、公司名可換行（同公司有多份時名稱會帶括號）── */
.fu-pick-grid{grid-template-columns:repeat(auto-fill,minmax(204px,1fr))}
.fu-doc .fu-dn b{white-space:normal;line-height:1.25}
.fu-rv-ov{flex-direction:column;gap:4px}
@media (max-width:640px){.fu-pick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ── 上傳底稿版本不符警示（2026-10-19）：比一般 warn（琥珀色）更醒目的紅色；選文件格右上角徽章同色 ── */
.fu-notice.fu-nt-bad{border-color:#e9a3a3;border-left-color:#d93636;background:#fff0f0}
.fu-notice.fu-nt-bad .fu-nt-t{color:#a61b1b}
.fu-notice.fu-nt-bad .fu-nt-l{color:#7a1f1f;font-weight:600}
.fu-doc .fu-up.fu-ver{background:#fff0f0;border-color:#d93636;color:#a61b1b}
html[data-rex-theme="dark"] .fu-notice.fu-nt-bad{border-color:rgba(248,113,113,.45);border-left-color:#f87171;background:rgba(248,113,113,.12)}
html[data-rex-theme="dark"] .fu-notice.fu-nt-bad .fu-nt-t{color:#fecaca}
html[data-rex-theme="dark"] .fu-notice.fu-nt-bad .fu-nt-l{color:#fecaca}
html[data-rex-theme="dark"] .fu-doc .fu-up.fu-ver{background:rgba(248,113,113,.16);border-color:#f87171;color:#fecaca}