/* Compact Payments presentation. No application logic or values are changed. */
.app:has(#paymentsTab:not(.hidden)) #pageTitle{font-size:18px;line-height:1.25;font-weight:600}
#paymentsTab{font-size:13px;line-height:1.35}
#paymentsTab .finance-kpis{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
#paymentsTab .finance-kpis .card{padding:10px 12px}
#paymentsTab .kpi-label{font-size:12px;line-height:1.3;font-weight:600}
#paymentsTab .kpi-value{font-size:25px;line-height:1.2;margin-top:3px}
#paymentsTab .kpi-note{font-size:12px;line-height:1.35;margin-top:3px}
#paymentsTab .yai-pay-card{margin-top:8px;padding:12px;min-width:0}
#paymentsTab .card-title{font-size:16px;line-height:1.25;font-weight:600}
#paymentsTab .card-sub,#paymentsTab .small{font-size:13px;line-height:1.35}
#paymentsTab .section-head{gap:8px;margin-bottom:6px;align-items:flex-start}
#paymentsTab .toolbar{margin:8px 0;gap:6px}
#paymentsTab input,#paymentsTab select{font-size:14px;line-height:1.25;padding:6px 9px;min-height:32px}
#paymentsTab .search{min-width:140px}
#paymentsTab .btn,#paymentsTab .btn.mini{font-size:12px;line-height:1.25;padding:5px 8px;min-height:28px;font-weight:600;white-space:normal}
#paymentsTab .pill,#renewalList .pill{font-size:12px;line-height:1.25;padding:2px 6px;font-weight:500;max-width:100%;white-space:normal}
#paymentsTab td{font-size:13px;padding:8px;vertical-align:top;line-height:1.35;overflow-wrap:anywhere}
#paymentsTab th{font-size:12px;padding:7px 8px;line-height:1.25;text-transform:uppercase;letter-spacing:.025em}
#paymentRows td:first-child .strong,#paymentsTab .renewal-item .strong,#renewalList .renewal-item .strong{font-size:14px;font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.yai-pay-detail{max-width:250px;margin-top:3px;line-height:1.35}
.yai-pay-attention{color:#a45217;margin-top:3px}
.yai-schedule-filters{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0}
.yai-schedule-filters .btn{font-size:12px;line-height:1.25;padding:5px 8px;min-height:28px}
.yai-schedule-filters .is-selected{background:var(--ink);color:var(--card,#fff);border-color:var(--ink)}
.yai-schedule-filters b{margin-left:4px;font-variant-numeric:tabular-nums}
.yai-schedule-list{max-height:none;overflow:visible}
.yai-schedule-list .renewal-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px;padding:8px 0}
.yai-schedule-list .renewal-item>div{min-width:0;overflow-wrap:anywhere}
.yai-schedule-list .renewal-item>.btn{flex-shrink:0;align-self:start;white-space:nowrap;font-size:12px;line-height:1.25;min-height:28px;padding:5px 8px}
.yai-schedule-list .small,#renewalList>p{font-size:13px;line-height:1.35}
.yai-schedule-list .pill{margin-left:3px}
.yai-pay-caption{margin:5px 0 0;font-size:13px;color:var(--muted);line-height:1.35}
#paymentsTab table{min-width:700px}
#paymentsTab .table-wrap{max-width:100%;overflow-x:auto;overflow-y:visible}
#paymentsTab #paymentRows td:last-child{min-width:94px}
@media(min-width:601px) and (max-width:1299px){
 #paymentsTab .yai-pay-layout{display:flex;flex-direction:column}
 #paymentsTab .yai-pay-layout>.card:last-child{order:-1}
 #paymentsTab .yai-pay-layout .yai-schedule-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:12px}
 #paymentsTab .yai-pay-layout .yai-schedule-filters+p{margin:5px 0}
}
@media(min-width:1300px){
 #paymentsTab .yai-pay-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(340px,1fr);gap:8px;align-items:start}
 #paymentsTab .yai-pay-layout>.card{min-width:0}
}
@media(min-width:601px) and (max-width:900px){
 #paymentsTab .finance-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
 #paymentsTab .yai-pay-layout .yai-schedule-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
 #paymentsTab .finance-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 #paymentsTab .finance-kpis .card{padding:8px 10px}
 #paymentsTab .kpi-value{font-size:25px}
 #paymentsTab .section-head{gap:6px;flex-wrap:wrap}
 #paymentsTab .toolbar{flex-wrap:wrap}
 #paymentsTab .toolbar input{width:100%}
 #paymentsTab .yai-pay-card{padding:10px}
 #paymentsTab .btn,#paymentsTab .btn.mini{min-height:32px}
 .yai-schedule-filters .btn{flex:1 1 44%;min-height:32px}
 #paymentsTab table:has(#paymentRows){min-width:0;width:100%}
 #paymentsTab table:has(#paymentRows) thead{display:none}
 #paymentsTab #paymentRows{display:block}
 #paymentsTab #paymentRows tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-bottom:1px solid var(--line,#dde3ec);padding:8px 0;gap:6px}
 #paymentsTab #paymentRows td{display:block;padding:0 5px;border:0;min-width:0}
 #paymentsTab #paymentRows td:first-child,#paymentsTab #paymentRows td:nth-child(3),#paymentsTab #paymentRows td:last-child{grid-column:1/-1}
 #paymentsTab #paymentRows td:nth-child(2)::before{content:'Monthly fee';display:block;color:var(--muted);font-size:12px}
 #paymentsTab #paymentRows td:nth-child(4)::before{content:'Stored coverage';display:block;color:var(--muted);font-size:12px}
 #paymentsTab #paymentRows td:nth-child(5)::before{content:'Latest receipt';display:block;color:var(--muted);font-size:12px}
 #paymentsTab #paymentRows td:nth-child(3){grid-row:2}
 #paymentsTab #paymentRows td:nth-child(2){grid-row:3}
 #paymentsTab #paymentRows td:nth-child(2)>.small,#paymentsTab #paymentRows td:nth-child(4)>.small{display:none}
 #paymentsTab .yai-pay-detail{max-width:none}
 #paymentsTab #paymentRows .btn{width:100%}
}

/* Final operational layout: controls precede the overview and ledger. */
#paymentsTab .finance-kpis .card{min-height:96px;box-sizing:border-box;padding:8px 11px}
#paymentsTab .finance-kpis{align-items:start}
#paymentsTab .kpi-note{font-size:12px;line-height:1.25;margin-top:3px}
#paymentsTab .yai-pay-layout{display:block}
#paymentsTab .yai-operational-overview{margin:7px 0 8px;padding:7px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
#paymentsTab .yai-ops-header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
#paymentsTab .yai-ops-header .card-title{flex-shrink:0}
#paymentsTab .yai-ops-header .yai-schedule-filters{margin:0;gap:4px}
#paymentsTab .yai-ops-header .btn{padding:4px 6px;min-height:26px}
#paymentsTab .yai-ops-note{font-size:13px;color:var(--muted);margin:4px 0}
#paymentsTab .yai-ops-group-label{font-size:12px;font-weight:600;margin:4px 0;color:var(--muted)}
#paymentsTab .yai-ops-schedule-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:5px}
#paymentsTab .yai-ops-row{display:grid;grid-template-columns:minmax(130px,1.5fr) 120px 120px minmax(175px,1.6fr) 60px;align-items:start;gap:8px;padding:5px 0;border-bottom:1px solid var(--line);font-size:13px;line-height:1.3}
#paymentsTab .yai-ops-row:last-child{border-bottom:0}
#paymentsTab .yai-ops-row>div{min-width:0;overflow-wrap:anywhere}
#paymentsTab .yai-ops-name{font-size:13px;font-weight:600}
#paymentsTab .yai-ops-label{display:block;font-size:12px;color:var(--muted)}
#paymentsTab .yai-ops-reason{display:block;color:var(--muted);font-size:12px;margin-top:2px}
#paymentsTab .yai-ops-row>.btn{white-space:nowrap;min-height:28px;align-self:start}
#paymentsTab .yai-ops-empty{font-size:13px;color:var(--muted);padding:4px 0}
#paymentsTab .yai-ops-unpaid{border-left:2px solid var(--amber,#b7791f);padding-left:7px}
#paymentsTab .yai-ops-row .pill{font-size:12px;padding:1px 5px}
@media(min-width:1000px){
 #paymentsTab .finance-kpis .card{height:100px;min-height:100px}
 #paymentsTab .yai-ops-row>div:nth-child(2),#paymentsTab .yai-ops-row>div:nth-child(3){display:flex;flex-direction:column}
}
@media(max-width:999px){
 #paymentsTab .yai-ops-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 60px;gap:5px 8px}
 #paymentsTab .yai-ops-name{grid-column:1/3}
 #paymentsTab .yai-ops-row>.btn{grid-column:3;grid-row:1/3}
 #paymentsTab .yai-ops-state{grid-column:1/3}
 #paymentsTab .yai-ops-reason{display:inline;margin-left:4px}
}

/* P2 final correction: complete secondary text and one quiet section divider. */
#paymentsTab .finance-kpis .card{height:auto;min-height:100px;padding:8px 10px;overflow:visible}
#paymentsTab .finance-kpis .kpi-label{line-height:1.25;overflow-wrap:anywhere}
#paymentsTab .finance-kpis .kpi-note{line-height:1.3;overflow-wrap:anywhere;white-space:normal}
#paymentsTab .yai-operational-overview{margin:12px 0 8px;padding:12px 0 0;border-top:1px solid color-mix(in srgb,var(--ink) 18%,transparent);border-bottom:0}