/* payments pages (checkout, orders, order, earnings). Class prefix pay-. Tokens come from rf.css (light and dark). */
.pay-test{margin-bottom:16px}
.pay-mono{font-family:var(--mono);font-size:13px;overflow-wrap:anywhere}
.pay-money{font:600 18px var(--sans);font-variant-numeric:tabular-nums}
.pay-h{font-size:16px;margin:0 0 12px}
.pay-h3{font-size:15px;margin:0 0 10px}
.pay-sec{margin-top:32px}
.pay-sk{margin-bottom:12px}
.pay-body{min-height:120px}
.pay-after{margin-top:16px}
.pay-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;align-items:center}
.pay-row{display:flex;gap:8px;flex-wrap:wrap}
.pay-row input{flex:1 1 220px;min-width:0}
.pay-err:empty,.pay-msg:empty{display:none}
.pay-err,.pay-msg{margin-top:14px}
.pay-msg{margin:0 0 16px}
.pay-tabs{margin-bottom:16px}
.pay-filters{margin-bottom:16px}
.pay-owner{margin-bottom:16px}

/* two-column layout: form/main left, summary right; one column on phones */
.pay-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start}
.pay-grid-order{grid-template-columns:minmax(0,1fr) 320px}
.pay-stack{display:grid;gap:20px;min-width:0}
.pay-summary{position:sticky;top:calc(var(--hdr) + 16px)}
@media (max-width:820px){.pay-grid,.pay-grid-order{grid-template-columns:minmax(0,1fr)}.pay-summary{position:static}.pay-grid>aside{order:-1}.pay-grid-order>aside{order:0}}

/* checkout */
.pay-item-title{font-size:18px;margin:0 0 4px}
.pay-by{margin-bottom:10px}
.pay-sum{margin-bottom:14px;font-size:14px}
.pay-kv{margin:12px 0}
.pay-kv dd{font-family:var(--sans);font-size:14px}
.pay-total{font-weight:600}
.pay-total dt{color:var(--fg)}
.pay-total dd{font-size:18px}
.pay-rails{border:0;padding:0;margin:0 0 14px;min-width:0;display:grid;gap:8px}
.pay-rails legend{font-size:13px;font-weight:500;margin-bottom:8px;padding:0}
.pay-rail{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);cursor:pointer;margin:0;font-weight:400;background:var(--panel);min-height:44px}
.pay-rail:hover{border-color:var(--line-strong)}
.pay-rail:has(input:checked){border-color:var(--acc);background:var(--acc-soft)}
.pay-rail:has(input:focus-visible){outline:2px solid var(--acc);outline-offset:2px}
.pay-rail input{margin-top:3px;flex:none}
.pay-rail strong{display:block;font-size:14.5px}
.pay-rail .small{display:block}

/* orders list */
.pay-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pay-row-link{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 16px;color:var(--fg);text-decoration:none;min-height:44px;border-radius:var(--r)}
.pay-row-link:hover{background:var(--panel2)}
.pay-row-main{display:grid;gap:3px;min-width:0}
.pay-row-end{display:grid;gap:6px;justify-items:end;flex:none}
@media (max-width:480px){.pay-row-link{flex-direction:column;align-items:flex-start}.pay-row-end{justify-items:start;grid-auto-flow:column;align-items:center;gap:10px}}

/* order detail */
.crumbs{margin-bottom:12px;color:var(--mute)}
.pay-panel h3{font-size:17px;margin:0 0 6px}
.pay-fields{display:grid;gap:0;margin:14px 0}
.pay-fld{display:grid;grid-template-columns:150px minmax(0,1fr);gap:4px 12px;padding:8px 0;border-bottom:1px solid var(--line2);align-items:center}
.pay-fld:last-child{border-bottom:0}
.pay-fld dt{color:var(--mute);font-size:13.5px}
.pay-fld dd{margin:0;min-width:0}
.pay-copy{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pay-copy code{flex:1 1 200px;min-width:0;background:var(--panel2);padding:6px 8px;border-radius:var(--r-sm);border:1px solid var(--line2)}
@media (max-width:520px){.pay-fld{grid-template-columns:minmax(0,1fr)}}
.pay-cd{font-variant-numeric:tabular-nums;font-weight:600}
.pay-manual{margin-top:14px}
.pay-manual summary{cursor:pointer;font-weight:500;min-height:32px;display:flex;align-items:center}
.pay-tx{margin-top:12px}
.pay-hashform{margin-top:14px}
.pay-hashform label{display:block;margin-bottom:6px}
.pay-items{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.pay-item-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.pay-item h3{font-size:16px;margin:0;min-width:0;overflow-wrap:anywhere}
.pay-item p{margin:6px 0 0}
.pay-item .small{display:block;margin-top:6px}
.pay-access{margin-top:10px;padding:10px 12px;background:var(--panel2);border:1px solid var(--line2);border-radius:var(--r-sm)}
.pay-access svg{vertical-align:-2px}

/* earnings */
.pay-stats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:900px){.pay-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:380px){.pay-stats{grid-template-columns:minmax(0,1fr)}}
.pay-stat{display:grid;gap:2px;align-content:start;min-height:96px}
.pay-stat-l{font-size:13px;color:var(--mute)}
.pay-stat-n{font:600 clamp(22px,2.6vw,28px)/1.15 var(--sans);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pay-addrs{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.pay-addr{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--line2);border-radius:var(--r-sm)}
.pay-addr-main{display:grid;gap:2px;min-width:0;flex:1 1 240px}
.pay-addr-end{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pay-addform{max-width:560px;border-top:1px solid var(--line2);padding-top:16px}
.pay-addrs+.pay-addform{margin-top:0}
.pay-proof{margin-top:14px}
.pay-msgbox{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--panel2);border:1px solid var(--line2);border-radius:var(--r-sm);padding:10px 12px;font-size:12.5px;margin:8px 0}
.pay-claims{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:10px}
.pay-claim{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center}

/* key/value lists: own layout so long values wrap instead of squeezing the label */
dl.pay-kv{display:block;margin:12px 0}
.pay-kv>div{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 16px}
.pay-kv dt{flex:none}
.pay-kv dd{margin:0;white-space:nowrap;text-align:right}
.pay-kv dd.pay-mono{white-space:normal;overflow-wrap:anywhere;flex:1 1 100%;text-align:left}
.pay-by{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
