/* [2026-09-27] 目的：三段式匯款提示及買方收款帳戶共用版面，欄位文字保留原值並支援手機閱讀。 */
.remittance-notice { padding: 12px 16px; margin: 12px 0; border: 1px solid #dce5ee; border-radius: 8px; background: #f4f8fc; color: #42566d; font-size: 14px; line-height: 1.7; text-align: left; clear: both; }
.remittance-notice[hidden] { display: none !important; }
.remittance-instructions { margin: 18px 0; padding: 22px; border: 1px solid #dce2e9; border-radius: 12px; background: #fafbfd; color: #263445; text-align: left; font-size: 14px; line-height: 1.6; }
.MyOrders-remittance > .remittance-instructions { margin: 0 20px 20px; }
.remittance-instructions > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.remittance-instructions h3 { margin: 0; font-size: 18px; }
.remittance-instructions p { margin: 10px 0; }
.remittance-amount { display: flex; flex-direction: column; flex-shrink: 0; }
.remittance-amount strong { font-size: 23px; }
.remittance-accounts { display: grid; gap: 12px; }
.remittance-account { background: #fff; padding: 18px; border: 1px solid #e0e5eb; border-radius: 10px; }
.remittance-bank { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.remittance-default { background: #e8f2ec; color: #286245; padding: 2px 8px; border-radius: 4px; font-size: 12px; }
.remittance-account dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; margin: 16px 0 0; }
.remittance-account dt { color: #687688; font-size: 12px; }
.remittance-account dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.remittance-account-number { font-variant-numeric: tabular-nums; letter-spacing: .04em; user-select: text; }
.remittance-copy { border: 1px solid #ccd5df; border-radius: 6px; padding: 6px 10px; background: white; color: #304761; cursor: pointer; font-size: 13px; }
.remittance-copy:focus-visible { outline: 2px solid #3276bd; outline-offset: 2px; }
.remittance-notes { white-space: pre-wrap; overflow-wrap: anywhere; color: #586577; }
.remittance-copy-status { color: #356b47; }
.remittance-copy-status:empty { display: none; }
/* [2026-09-27] 目的：完成頁與買方訂單共用回報表單及歷程，沿用匯款卡片風格並支援窄螢幕。 */
.remittance-report-host { border-top: 1px solid #dce2e9; margin-top: 24px; padding-top: 20px; }
.remittance-report-host h4 { margin: 0; font-size: 18px; }
.remittance-report-host h5 { font-size: 15px; margin: 16px 0 10px; }
.remittance-orders-link { display: inline-block; margin-bottom: 12px; color: #365d7d; text-underline-offset: 3px; }
/* [2026-09-27] 目的：回報與訂單入口使用獨立操作列，避免行內元素黏在一起，手機可自然換行。 */
.remittance-report-entry-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px; margin-top: 16px; }
.remittance-report-entry-actions .remittance-orders-link { margin: 0; padding: 8px 0; }
.remittance-report-host .remittance-report-entry-hint { margin: 10px 0 0; color: #687688; font-size: 13px; line-height: 1.7; }
.remittance-report-history article { background: #fff; border: 1px solid #dce2e9; border-radius: 8px; padding: 16px; margin-bottom: 10px; overflow-wrap: anywhere; }
.remittance-report-history article p { margin: 5px 0; }
.remittance-report-history small { color: #687688; }
/* [2026-09-29] 目的：退回匯款屬於需立即處理的付款狀態，獨立置頂呈現原因，並在歷史紀錄保留醒目標記。 */
.remittance-return-alert { margin: 14px 0 18px; padding: 16px 18px; border: 1px solid #e2bbb7; border-left: 4px solid #a8433b; border-radius: 7px; background: #fff6f5; color: #4e302d; }
.remittance-return-alert > header { display: flex; align-items: center; gap: 10px; }
.remittance-return-alert > header span { padding: 3px 8px; border-radius: 4px; background: #a8433b; color: #fff; font-size: 12px; font-weight: 700; }
.remittance-return-alert h5 { margin: 0; color: #7d302a; font-size: 17px; }
.remittance-return-alert article { margin-top: 12px; padding-top: 12px; border-top: 1px solid #eccdca; }
.remittance-return-alert article p { margin: 5px 0; }
.remittance-return-alert__reason,.remittance-return-reason { color: #7d302a; }
.remittance-return-alert small { color: #795b58; }
.remittance-report-history summary { cursor: pointer; }
.remittance-return-count { display: inline-flex; margin-left: 8px; padding: 2px 7px; border-radius: 4px; background: #f9dfdc; color: #913b33; font-size: 12px; font-weight: 700; }
.remittance-report-history article.is-returned { border-color: #e2bbb7; border-left: 4px solid #a8433b; background: #fffafa; }
.remittance-report-history article.is-returned .remittance-report-status { color: #913b33; }
.remittance-report-primary { border: 0; background: #20252b; color: #fff; border-radius: 8px; padding: 11px 18px; font-size: 14px; cursor: pointer; }
.remittance-report-host [hidden] { display: none !important; }
.remittance-report-form { padding: 18px; border: 1px solid #dce2e9; border-radius: 10px; background: #fff; margin-top: 12px; }
.remittance-report-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.remittance-report-fields label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 400; margin: 0; }
.remittance-report-fields input,.remittance-report-fields select,.remittance-report-fields textarea { box-sizing: border-box; width: 100%; min-width: 0; padding: 10px 12px; border: 1px solid #cdd6df; border-radius: 6px; background: #fff; color: #263445; font: inherit; }
.remittance-report-wide { grid-column: 1 / -1; }
/* [2026-09-27] 目的：已存匯出帳戶以唯讀欄位帶入，新增帳戶才開放輸入，取代記住單一帳號勾選。 */
.remittance-report-fields input[readonly] { background:#f3f5f7; color:#42566d; }
.remittance-report-actions { display: flex; justify-content: flex-end; gap: 10px; }
/* [2026-09-29] 目的：付款視窗底部操作統一同列靠右，關閉置於目前付款方式的送出按鈕左側。 */
.remittance-payment-actions { align-items:center; justify-content:flex-end; flex-wrap:nowrap; margin-top:16px; padding-top:16px; border-top:1px solid #e3e7ec; }
.remittance-report-host :disabled { opacity: .6; cursor: wait; }
.remittance-report-host :focus-visible { outline: 2px solid #365d7d; outline-offset: 3px; }
.remittance-report-feedback { color: #805119; }
/* [2026-09-27] 目的：同一匯款的多筆訂單選擇與分配，桌機左右對齊、手機換行，不另建頁面。 */
.remittance-allocation-list { border: 1px solid #dce2e9; border-radius: 8px; padding: 16px; margin: 18px 0; min-width: 0; }
.remittance-allocation-list legend { float: none; width: auto; font-size: 15px; padding: 0 6px; }
.remittance-allocation-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid #e8edf2; }
.remittance-allocation-choice { display: flex; align-items: flex-start; gap: 10px; margin: 0; font-weight: 400; }
.remittance-allocation-choice input { margin-top: 5px; }
.remittance-allocation-choice small { display: block; color: #687688; }
.remittance-allocation-choice .remittance-allocation-warning { color: #805119; }
/* [2026-09-27] 目的：刪除部分付款輸入框樣式，整單金額改為不可編輯的文字。 */
.remittance-allocation-row > strong { flex-shrink: 0; font-variant-numeric: tabular-nums; }
.remittance-allocation-summary { font-weight: 600; }
.remittance-allocation-list :disabled { cursor: default; }
/* [2026-09-27] 目的：三個入口共用既有 Popup 的視窗版型；樣式只限付款模組，不改其他彈窗。 */
.remittance-center-entry { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:16px 0; }
.remittance-center-entry > span { font-size:13px; color:#687688; }
.remittance-home-entry { position:fixed; right:20px; bottom:24px; z-index:9900; padding:12px; margin:0; border:1px solid #dce2e9; border-radius:12px; background:#fff; box-shadow:0 4px 20px #0002; }
/* [2026-09-29] 目的：付款視窗必須高於 shopMain 的共用遮罩，且只由 #block 反灰背景，避免遮罩連視窗內容一起變暗。 */
#AlertPopup.remittance-modal { position:fixed; inset:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:20px; box-sizing:border-box; background:transparent; z-index:210002 !important; }
#AlertPopup.remittance-modal > .PopupContent { width:820px !important; min-width:0 !important; max-width:100% !important; max-height:calc(100dvh - 40px); overflow:auto; margin:0 !important; padding:0 !important; border:0 !important; border-radius:14px; background:#fff; text-align:left; box-shadow:0 20px 60px #0003; }
#AlertPopup.remittance-modal .PopupTitleTr { position:sticky !important; top:0; z-index:2; display:flex; justify-content:center !important; align-items:center; box-sizing:border-box; width:100%; margin:0; padding:16px 64px; height:auto; background:#fff; border-bottom:1px solid #e3e7ec; font-size:18px; font-weight:600; }
/* [2026-09-27] 目的：覆寫共用關閉鈕的白色圖示，以深色叉號提高對比並統一點擊尺寸。 */
/* [2026-09-29] 目的：付款視窗沿用共用 Popup 關閉鈕，但固定在標題列右上角，避免被全站置中規則帶到標題旁。 */
#AlertPopup.remittance-modal #PopupClose { position:absolute !important; top:12px !important; right:20px !important; display:flex; align-items:center; justify-content:center; flex:0 0 36px; width:36px; height:36px; box-sizing:border-box; margin:0 !important; padding:0; border-radius:8px; background:#edf0f3; color:#334155; font-size:0; cursor:pointer; }
#AlertPopup.remittance-modal #PopupClose::before { content:'×'; display:block; margin:0; color:inherit; font-size:26px; font-weight:600; line-height:1; transform:none; }
#AlertPopup.remittance-modal #PopupClose:hover { background:#dce2e8; color:#111827; }
#AlertPopup.remittance-modal #PopupClose:focus-visible { outline:2px solid #365d7d; outline-offset:3px; }
#AlertPopup.remittance-modal .nipLine { display:none; }
#AlertPopup.remittance-modal .PopupSubContent { margin:0 !important; padding:0; min-width:0 !important; }
#AlertPopup.remittance-modal .remittance-instructions { margin:0; padding:24px; border:0; background:#fff; }
#AlertPopup.remittance-modal .remittance-report-form { border:0; padding:0; }
/* [2026-09-29] 目的：匯款送出時在既有付款視窗上方顯示明確的置中處理狀態，並阻止重複操作。 */
#AlertPopup.remittance-modal .remittance-processing-overlay { position:absolute; z-index:3000; inset:0; display:grid; place-items:center; padding:20px; background:rgba(15,23,42,.34); box-sizing:border-box; }
#AlertPopup.remittance-modal .remittance-processing-card { display:flex; align-items:center; flex-direction:column; width:min(340px,calc(100vw - 48px)); padding:26px 28px; border:1px solid #e1e6ec; border-radius:12px; background:#fff; color:#263445; box-shadow:0 18px 50px rgba(15,23,42,.28); text-align:center; }
#AlertPopup.remittance-modal .remittance-processing-card strong { margin-top:14px; font-size:17px; }
#AlertPopup.remittance-modal .remittance-processing-card p { margin:8px 0 0; color:#687688; font-size:13px; }
#AlertPopup.remittance-modal .remittance-processing-spinner { width:28px; height:28px; border:3px solid #dce3ea; border-top-color:#263445; border-radius:50%; animation:remittance-processing-spin .75s linear infinite; }
@keyframes remittance-processing-spin { to { transform:rotate(360deg); } }
/* [2026-09-27] 目的：共用未付款視窗以卡片顯示店家已啟用付款方式，缺少設定時保留原因但禁止選取。 */
.payment-method-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; padding:0; border:0; min-width:0; }
.payment-method-list legend { grid-column:1/-1; float:none; width:auto; margin-bottom:4px; padding:0; font-size:16px; font-weight:600; }
.payment-method-option { display:flex; align-items:flex-start; gap:10px; min-width:0; margin:0; padding:14px; border:1px solid #cdd6df; border-radius:9px; background:#fff; cursor:pointer; }
.payment-method-option:has(input:checked) { border-color:#263445; box-shadow:0 0 0 1px #263445; background:#f7f9fb; }
.payment-method-option input { flex:0 0 auto; margin-top:4px; }
.payment-method-option span,.payment-method-option small { display:block; min-width:0; }
.payment-method-option small { margin-top:4px; color:#687688; font-weight:400; line-height:1.45; }
.payment-method-option.is-disabled { background:#f3f5f7; color:#7b8794; cursor:not-allowed; }
.payment-method-option.is-disabled small { color:#8b5d26; }
.prepaid-payment-summary { margin:12px 0 18px; padding:16px; border:1px solid #dce2e9; border-radius:9px; background:#f7f9fb; }
.prepaid-payment-summary p { margin:8px 0 0; }
/* [2026-09-27] 目的：短款補款表單置於原回報歷程下，維持同一付款案件的上下文。 */
.remittance-supplement-form { margin:12px 0 18px; padding:16px; border:1px solid #ead5b9; border-radius:9px; background:#fff8ec; }
.remittance-supplement-form h5 { margin:0 0 8px; font-size:16px; }
/* [2026-09-29] 目的：補款送出按鈕與備註欄位保留明確間距，避免操作列緊貼或覆蓋文字區域。 */
.remittance-supplement-form .remittance-report-actions { clear:both; margin-top:16px; }
.remittance-report-history summary { padding:12px 0; cursor:pointer; color:#365d7d; }
.remittance-modal [hidden] { display:none !important; }
@media (max-width: 640px) {
    #AlertPopup.remittance-modal { padding:10px; }
    #AlertPopup.remittance-modal > .PopupContent { max-height:calc(100dvh - 20px); }
    #AlertPopup.remittance-modal .remittance-instructions { padding:16px; }
    .remittance-home-entry { right:12px; bottom:12px; max-width:calc(100% - 24px); }
    .remittance-allocation-row { flex-direction: column; align-items: stretch; }
    .remittance-report-fields { grid-template-columns: 1fr; }
    .payment-method-list { grid-template-columns:1fr; }
    .remittance-instructions { padding: 16px; }
    .remittance-instructions > header { flex-direction: column; gap: 8px; }
    .remittance-account dl { grid-template-columns: 1fr; }
    .MyOrders-remittance > .remittance-instructions { margin: 0 10px 12px; }
}
