/* Update 4 — Finance / Accounts / Wallet visual convergence.
   Scoped to isolated QA. Functions and existing card art untouched. */

/* Finance Home: two deliberate, equal utility tiles ABOVE the full-width Financial Health. */
#app main.u4-finance-home.u4fw-utility-first .u4fw-utility-pair{
 display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
 gap:12px!important;align-items:stretch!important;margin:0 0 13px!important;
 width:100%!important;min-width:0!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports,
#app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner{
 width:100%!important;min-width:0!important;max-width:none!important;
 margin:0!important;min-height:76px!important;height:100%!important;
 box-sizing:border-box!important;border-radius:18px!important;
 background:var(--u4-overview-mint,linear-gradient(120deg,rgba(182,229,224,.4),rgba(209,225,244,.4)))!important;
 border:1px solid var(--u4-overview-border,rgba(21,111,92,.15))!important;
 box-shadow:0 7px 21px rgba(26,59,66,.035)!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button{
 display:grid!important;grid-template-columns:32px minmax(0,1fr)!important;
 grid-template-rows:1fr 1fr!important;gap:0 9px!important;
 justify-content:start!important;align-items:center!important;
 min-height:76px!important;height:100%!important;padding:12px 13px!important;
 width:100%!important;min-width:0!important;border:0!important;
 background:transparent!important;box-shadow:none!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>span:first-child{
 grid-column:1!important;grid-row:1 / 3!important;width:32px!important;height:32px!important;
 flex:0 0 32px!important;align-self:center!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>b{
 grid-column:2!important;grid-row:1!important;align-self:end!important;
 font-size:13px!important;line-height:1.3!important;
 text-align:left!important;min-width:0!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>small{
 grid-column:2!important;grid-row:2!important;align-self:start!important;
 max-width:100%!important;min-width:0!important;overflow:hidden!important;
 text-overflow:ellipsis!important;white-space:nowrap!important;text-align:left!important;
 font-size:10px!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports .u4-reports-action{
 display:none!important; /* entire tile remains clickable; no clipped Explore label */
}
#app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner{
 display:grid!important;grid-template-columns:32px minmax(0,1fr)!important;
 grid-template-rows:1fr 1fr!important;gap:0 9px!important;
 align-items:center!important;justify-content:start!important;
 padding:12px 13px!important;overflow:hidden!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner .u4-salary-icon{
 grid-column:1!important;grid-row:1 / 3!important;width:32px!important;height:32px!important;
 align-self:center!important;margin:0!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner>span:not(.u4-salary-icon){
 grid-column:2!important;grid-row:1!important;align-self:end!important;
 text-align:left!important;white-space:nowrap!important;overflow:hidden!important;
 text-overflow:ellipsis!important;font-size:13px!important;line-height:1.3!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner>b{
 grid-column:2!important;grid-row:2!important;align-self:start!important;
 text-align:left!important;font-size:11px!important;min-width:0!important;
 white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
#app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner>small{display:none!important}
#app main.u4-finance-home.u4fw-utility-first .u4-health-dashboard{margin-top:0!important;margin-bottom:14px!important}
@media(max-width:520px){
 #app main.u4-finance-home.u4fw-utility-first .u4fw-utility-pair{gap:8px!important}
 #app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button,
 #app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner{padding:11px 8px!important;gap:0 6px!important;
  grid-template-columns:26px minmax(0,1fr)!important;min-height:72px!important}
 #app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>span:first-child,
 #app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner .u4-salary-icon{
   width:26px!important;height:26px!important;min-width:26px!important;flex-basis:26px!important}
 #app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>b,
 #app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner>span:not(.u4-salary-icon){font-size:11px!important}
 #app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>small,
 #app main.u4-finance-home .u4fw-utility-pair .u4-salary-banner>b{font-size:10px!important}
}
@media(max-width:360px){
 #app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>small{display:none!important}
 #app main.u4-finance-home .u4fw-utility-pair .u4-finance-reports>button>b{grid-row:1/3!important;align-self:center!important}
}

/* Wallet: keep Finance's unified header and the existing Add Card control.
   No redundant 'Your Wallet' section heading. Card stack/filters remain untouched. */
#app .finance-full-top.u4fw-wallet-top>.u4fw-wallet-add.u2w-add{
 position:relative!important;inset:auto!important;z-index:2!important;
 width:auto!important;max-width:45%!important;min-height:42px!important;
 height:42px!important;margin:0!important;padding:0 14px!important;
 font-size:12px!important;line-height:1.2!important;flex:0 0 auto!important;
 border-radius:999px!important;white-space:nowrap!important;
}
#app .u2w-root .u2w-landing.u4fw-wallet-compact{padding-top:0!important}
#app .u2w-root .u2w-landing.u4fw-wallet-compact>.u2w-filter{margin-top:5px!important}
@media(max-width:420px){
 #app .finance-full-top.u4fw-wallet-top>.u4fw-wallet-add.u2w-add{padding:0 9px!important;font-size:11px!important;max-width:43%!important}
}

/* Accounts: one cohesive action-pill component for both real buttons. */
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile,
body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile{
 min-height:60px!important;padding:8px 14px!important;margin:0!important;
 border-radius:20px!important;gap:10px!important;
 display:flex!important;align-items:center!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile>.u4acct-section-mark{
 width:30px!important;height:30px!important;flex:0 0 30px!important;border-radius:10px!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile>div{min-width:0!important;flex:1!important;gap:1px!important}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile>div>small{
 max-width:100%!important;line-height:1.25!important;white-space:normal!important;overflow-wrap:break-word!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile>button,
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.linked-debit-cards-v12813.u4fw-linked>.widget-head>button{
 -webkit-appearance:none!important;appearance:none!important;
 box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
 flex:0 0 auto!important;min-width:102px!important;max-width:none!important;
 height:36px!important;min-height:36px!important;max-height:36px!important;
 padding:0 13px!important;border-radius:999px!important;
 color:var(--accent,#087b59)!important;
 border:1px solid color-mix(in srgb,var(--accent,#087b59) 14%,var(--border,#d9e4e0))!important;
 background:color-mix(in srgb,var(--accent,#087b59) 10%,var(--card,#fff))!important;
 font-size:11px!important;font-weight:750!important;line-height:1.1!important;
 box-shadow:none!important;text-align:center!important;white-space:nowrap!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.linked-debit-cards-v12813.u4fw-linked>.widget-head{align-items:center!important}

/* Safeguards: independent minimal forecast, no repeated financial tiles,
   all labels and Manage Allocation stay in the normal document flow. */
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards,
body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards{
 height:auto!important;max-height:none!important;min-height:0!important;
 overflow:visible!important;clip-path:none!important;border-radius:20px!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards>summary{
 min-height:60px!important;padding:10px 14px!important;
 grid-template-columns:30px minmax(0,1fr) 18px!important;gap:2px 10px!important;
 border-radius:20px!important;overflow:visible!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards[open]>summary{
 border-radius:20px 20px 0 0!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards>summary .u4acct-section-mark{
 width:30px!important;height:30px!important;flex:0 0 30px!important;border-radius:10px!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards>summary strong{
 min-width:0!important;line-height:1.35!important;overflow-wrap:break-word!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards>summary span:not(.u4acct-section-mark){
 min-width:0!important;max-width:100%!important;line-height:1.35!important;
 white-space:normal!important;overflow-wrap:break-word!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards>summary:after{
 grid-column:3!important;grid-row:1/3!important;
 display:block!important;justify-self:end!important;align-self:center!important;
 width:18px!important;height:22px!important;line-height:22px!important;
 text-align:center!important;transition:none!important;transform:none!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards>.v1322-account-intel.u4fw-outlook,
body.rufiyaa-liquid-glass:not(.rufiyaa-admin-mode) #app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards>.v1322-account-intel.u4fw-outlook{
 min-width:0!important;width:100%!important;max-width:100%!important;
 padding:16px!important;margin:0!important;border:0!important;
 box-sizing:border-box!important;overflow:visible!important;
 display:grid!important;grid-template-columns:1fr!important;gap:14px!important;
 background:transparent!important;box-shadow:none!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards .u4fw-outlook .widget-head{
 display:flex!important;flex-wrap:wrap!important;justify-content:space-between!important;
 align-items:center!important;gap:9px!important;min-width:0!important;margin:0!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards .u4fw-outlook .widget-head b{
 font-size:13px!important;line-height:1.3!important;white-space:normal!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards .u4fw-outlook .widget-head button{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 min-height:36px!important;height:36px!important;padding:0 12px!important;
 max-width:100%!important;border-radius:999px!important;
 color:var(--accent,#087b59)!important;
 background:color-mix(in srgb,var(--accent,#087b59) 10%,var(--card,#fff))!important;
 border:1px solid color-mix(in srgb,var(--accent,#087b59) 14%,var(--border,#d9e4e0))!important;
 box-shadow:none!important;font-size:11px!important;font-weight:750!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards .u4fw-outlook .v1322-metric-grid{
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;
 min-width:0!important;width:100%!important;margin:0!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards .u4fw-outlook .v1322-metric-grid>div:nth-child(3){
 display:flex!important;flex-direction:column!important;gap:6px!important;
 width:100%!important;max-width:100%!important;box-sizing:border-box!important;
 border:0!important;background:color-mix(in srgb,var(--accent,#087b59) 4%,var(--card,#fff))!important;
 padding:15px!important;border-radius:16px!important;min-width:0!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards .u4fw-outlook .v1322-metric-grid>div:nth-child(3) b{
 overflow-wrap:anywhere!important;word-break:normal!important;white-space:normal!important;
 font-size:clamp(16px,2.4vw,21px)!important;
}
#app .finance-full-body.u4acct-detail-page .u4hyb-restored>.u4acct-advanced.u4fw-safeguards .u4fw-outlook .u4acct-forecast-note{
 padding:0!important;margin:0!important;max-width:100%!important;
 white-space:normal!important;overflow-wrap:break-word!important;
 font-size:11px!important;line-height:1.5!important;
}
@media(max-width:520px){
 #app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile{padding:8px 11px!important;gap:8px!important}
 #app .finance-full-body.u4acct-detail-page .u4hyb-restored>.account-reconcile-v12971.u4fw-reconcile>button,
 #app .finance-full-body.u4acct-detail-page .u4hyb-restored>.linked-debit-cards-v12813.u4fw-linked>.widget-head>button{
 min-width:88px!important;height:34px!important;min-height:34px!important;max-height:34px!important;padding:0 10px!important}
}
