/* transactions.css — 編輯式交易帳本；保留既有資料與表單元件，只重建頁面層級 */
.transactions-page{
    --paper:#f1efe7;--paper-2:#e5e5da;--white:#fffdf7;--ink:#1d2924;--muted:#6d7972;
    --line:#cfd4c9;--green:#17694c;--green-dark:#123d2e;--green-soft:#d9e9df;
    --gold:#bd8729;--red:#b9484f;--profit:#17694c;--loss:#b9484f;
    --bg:var(--paper);--bg-card:var(--white);--bg-subtle:var(--paper-2);--bg-hover:#e9e9df;
    --text-primary:var(--ink);--text-secondary:#4e5c55;--text-tertiary:var(--muted);
    --border:var(--line);--border-strong:#bfc6b9;--brand:var(--green);
    margin:0;background:var(--paper);color:var(--ink);
    font-family:"Microsoft JhengHei UI","Microsoft JhengHei","Noto Sans TC","Yu Gothic",sans-serif;
    text-rendering:optimizeLegibility;
}
.transactions-page ::selection{color:var(--white);background:var(--green)}
.transactions-page a:focus-visible,.transactions-page button:focus-visible,.transactions-page select:focus-visible,.transactions-page input:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

/* 將舊側欄轉為全站水平導覽 */
.transactions-page .app{display:block;min-height:100vh}
.transactions-page .sidebar{position:sticky;top:0;z-index:30;width:100%;height:64px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:0 clamp(18px,4vw,64px);overflow:visible;background:rgba(241,239,231,.92);border:0;border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}
.transaction-brand{display:flex;align-items:center;gap:9px;width:max-content;color:var(--ink);font-size:.78rem}
.transaction-brand span{width:29px;height:29px;display:grid;place-items:center;color:var(--white);background:var(--green);border-radius:50%;font-size:.62rem}
.transaction-brand strong{font-weight:700}
.transactions-page .nav{display:flex;flex-direction:row;gap:5px}
.transactions-page .nav a{padding:8px 13px;color:var(--muted);border-radius:99px;font-size:.68rem;font-weight:700}
.transactions-page .nav a:hover{color:var(--green);background:var(--green-soft)}
.transactions-page .nav a.active{color:var(--white);background:var(--ink)}
.transactions-page .sidebar-auth{justify-self:end;margin:0;padding:0;border:0;display:flex;flex-direction:row;gap:7px}
.transactions-page .sidebar-auth .btn{min-height:34px;padding:7px 12px;border-radius:8px;font-size:.62rem}
.transactions-page .mobile-header{display:none}

/* 封面不是儀表板標題列，而是進入帳本前的閱讀停頓 */
.transactions-page .main{width:100%;max-width:1500px;margin:0 auto;padding:0 clamp(18px,5vw,82px) 120px}
.transaction-cover{min-height:330px;margin:0;padding:42px 0 34px;display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:end;gap:40px;border-bottom:1px solid var(--ink)}
.cover-copy{min-width:0}
.page-kicker,.panel-kicker{color:var(--green);font:800 .54rem/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase}
.transaction-cover .page-title{max-width:none;margin:20px 0 0;font-size:clamp(3.4rem,5.2vw,6rem);font-weight:730;line-height:.94;letter-spacing:-.055em}
.transaction-cover .page-title span,.transaction-cover .page-title em{display:block;white-space:nowrap}
.transaction-cover .page-title em{color:var(--green);font-family:Georgia,"Noto Serif TC",serif;font-weight:400;font-style:normal}
.cover-note{max-width:340px;padding:20px 0 4px;border-top:1px solid var(--line)}
.cover-note b{display:block;margin-bottom:10px;font-size:.72rem}
.cover-note p{margin:0;color:var(--muted);font-size:.65rem;line-height:1.85}

/* 四項連續摘要帶 */
.transactions-page .stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0 0 64px}
.transactions-page .stat-card{position:relative;min-height:126px;padding:23px 22px;background:transparent;border:0;border-right:1px solid var(--line);border-radius:0;box-shadow:none}
.transactions-page .stat-card:first-child{padding-left:0}.transactions-page .stat-card:last-child{border-right:0;padding-right:0}
.transactions-page .stat-card:hover{box-shadow:none;transform:none;background:rgba(255,253,247,.32)}
.transactions-page .stat-card::before{position:absolute;right:18px;top:23px;color:var(--gold);font:800 .5rem/1 ui-monospace,monospace;letter-spacing:.12em;content:attr(data-index)}
.transactions-page .s-label{margin:0 0 15px;color:var(--muted);font-size:.56rem;letter-spacing:.1em}
.transactions-page .s-value{margin:0 0 9px;color:var(--ink);font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.3rem,2.2vw,2.2rem);font-weight:600;letter-spacing:-.04em}
.transactions-page .s-value.v-profit{color:var(--green)}.transactions-page .s-value.v-loss{color:var(--ink)}
.transactions-page .s-sub{color:var(--muted);font-size:.55rem}

/* 交易原始帳本 */
.transactions-page .panel{padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.transactions-page .panel:hover{box-shadow:none}
.transactions-page .panel-head{align-items:end;margin:0;padding:0 0 18px;border-bottom:1px solid var(--ink)}
.transactions-page .panel-kicker{display:block;margin-bottom:10px;color:var(--gold)}
.transactions-page .panel-title{font-size:clamp(2rem,3.4vw,3.8rem);font-weight:720;letter-spacing:-.055em;line-height:1}
.transactions-page .record-count{padding-bottom:5px;color:var(--muted);font:700 .55rem/1.4 ui-monospace,monospace;letter-spacing:.08em}
.transactions-page .transaction-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0;padding:0;border-bottom:1px solid var(--ink)}
.transactions-page .transaction-tabs .tab-btn{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;color:var(--muted);background:transparent;border:0;border-right:1px solid var(--line);border-radius:0;font-size:.68rem;text-align:left}
.transactions-page .transaction-tabs .tab-btn:last-child{border-right:0}
.transactions-page .transaction-tabs .tab-btn:hover{color:var(--green);background:var(--green-soft)}
.transactions-page .transaction-tabs .tab-btn.active{color:var(--white);background:var(--green)}
.transactions-page .transaction-tabs small{font:700 .46rem/1 ui-monospace,monospace;letter-spacing:.12em;opacity:.65}
.transactions-page .filter-bar{grid-template-columns:repeat(6,minmax(105px,1fr)) auto;gap:12px;margin:0;padding:24px 0;background:transparent;border-bottom:1px solid var(--line);border-radius:0}
.transactions-page .filter-label{color:var(--muted);font-size:.49rem;letter-spacing:.1em}
.transactions-page .filter-select{width:100%;padding:9px 27px 9px 0;background-color:transparent;background-position:right 8px center;border:0;border-bottom:1px solid var(--line);border-radius:0;color:var(--ink);font-size:.65rem}
.transactions-page .filter-select:focus{border-color:var(--green);box-shadow:none}
.transactions-page .filter-actions{display:flex;gap:6px}
.transactions-page .filter-actions .btn{min-height:35px;padding:8px 12px;border-radius:7px;font-size:.56rem}
.transactions-page #tableContainer{margin-top:12px;padding-bottom:30px;border-bottom:1px solid var(--ink)}
.transactions-page #tableContainer table{font-variant-numeric:tabular-nums}
.transactions-page #tableContainer th{position:static;padding:13px 12px;color:var(--muted);background:var(--paper-2);border-bottom:1px solid var(--ink);font-size:.56rem}
.transactions-page #tableContainer td{padding:14px 12px;border-bottom:1px solid var(--line);font-size:.72rem}
.transactions-page #tableContainer tbody tr:hover{background:rgba(217,233,223,.55)}
.transactions-page #tableContainer th:nth-child(n+6),.transactions-page #tableContainer td:nth-child(n+6){text-align:right}
.transactions-page .pagination{justify-content:flex-end;gap:10px;margin:0;padding:18px 0 0;border:0}
.transactions-page .pagination span{min-width:110px;text-align:center;font:700 .56rem/1 ui-monospace,monospace;letter-spacing:.06em}
.transactions-page .pagination .btn{padding:7px 11px;border-radius:7px;font-size:.58rem}

/* Modal 仍沿用成熟表單元件，只調整色彩語言 */
.transactions-page .modal-box{background:var(--white);border:1px solid var(--line);box-shadow:0 28px 80px rgba(29,41,36,.18)}
.transactions-page .modal-box .transaction-tabs{display:flex;margin-bottom:10px;border:0}
.transactions-page .modal-box .transaction-tabs .tab-btn{display:block;padding:8px 12px;border:0;border-radius:8px}
.transactions-page .modal-box .transaction-tabs .tab-btn.active{background:var(--green)}
.transactions-page .dividend-form-intro{grid-template-columns:minmax(150px,.7fr) 1.3fr;gap:24px;align-items:end;margin:2px 0 4px;padding:18px 0;border-top:1px solid var(--green);border-bottom:1px solid var(--green);color:var(--ink)}
.transactions-page .dividend-form-intro div{display:flex;flex-direction:column;gap:7px}
.transactions-page .dividend-form-intro span{color:var(--green);font:700 .5rem/1 ui-monospace,monospace;letter-spacing:.14em}
.transactions-page .dividend-form-intro strong{font-size:1rem;letter-spacing:-.02em}
.transactions-page .dividend-form-intro p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.7}
.transactions-page #addTransactionForm.is-cash-dividend #form-group-net-cashflow{grid-column:1/-1}
.transactions-page #addTransactionForm.is-cash-dividend #form-net_cashflow{min-height:52px;border-color:var(--green);font-size:1.05rem;font-weight:700}

@media(max-width:1050px){
    .transactions-page .filter-bar{grid-template-columns:repeat(3,1fr)}
    .transactions-page .filter-actions{align-self:end}
}
@media(max-width:768px){
    .transactions-page .sidebar{display:none}.transactions-page .mobile-header{display:flex;background:rgba(241,239,231,.95);border-bottom:1px solid var(--line);box-shadow:none}
    .transactions-page .main{padding:64px 18px 95px}
    .transaction-cover{min-height:350px;padding:34px 0 28px;grid-template-columns:1fr;gap:24px}
    .transaction-cover .page-title{font-size:clamp(2.1rem,9.7vw,4rem);line-height:.98;letter-spacing:-.045em}
    .cover-note{max-width:none;padding-top:16px}
    .transactions-page .stat-grid{grid-template-columns:repeat(2,1fr);margin-bottom:52px}
    .transactions-page .stat-card{min-height:132px;border-bottom:1px solid var(--line)}
    .transactions-page .stat-card:nth-child(2){border-right:0}.transactions-page .stat-card:nth-child(3),.transactions-page .stat-card:nth-child(4){border-bottom:0}
    .transactions-page .panel-title{font-size:2.6rem}
    .transactions-page .transaction-tabs .tab-btn{padding:14px 10px;font-size:.58rem}.transactions-page .transaction-tabs small{display:none}
    .transactions-page .filter-bar{grid-template-columns:repeat(2,1fr);gap:14px 10px}
    .transactions-page .filter-actions{grid-column:1/-1}
    .transactions-page #tableContainer{overflow:visible}
    .transactions-page #tableContainer table{width:100%;min-width:0}
    .transactions-page #tableContainer tbody tr{padding:12px 14px;background:rgba(255,253,247,.76);border-color:var(--line);border-radius:10px;box-shadow:none}
    .transactions-page #tableContainer td{padding:6px 0;font-size:.78rem;text-align:right}
    .transactions-page #tableContainer td::before{text-align:left}
    .transactions-page #tableContainer .td-date{padding-bottom:9px;text-align:left}
    .transactions-page #tableContainer .td-amount-cell{padding-top:10px}
    .transactions-page .pagination{position:sticky;left:0;width:calc(100vw - 36px);justify-content:center}
}
@media(max-width:460px){
    .transactions-page .dividend-form-intro{grid-template-columns:1fr;gap:10px;padding:15px 0}
    .transactions-page .filter-bar{grid-template-columns:1fr 1fr}
    .transactions-page .s-value{font-size:1.22rem}
    .transactions-page .stat-card{padding:22px 13px}.transactions-page .stat-card:first-child{padding-left:0}
}