/* AMPAY web workspace: shared typography, controls and page rhythm. */
:root{--radius:12px;--ui-font:'Segoe UI',Arial,sans-serif;--ui-control:40px;--ui-space:20px}
body{font-family:var(--ui-font);font-size:14px;line-height:1.6}
h1,.pagehead h1{font-size:28px;line-height:1.25;letter-spacing:-.6px;font-weight:650}
h2,.panelhead h2{font-size:18px;line-height:1.4;font-weight:600}
h3{font-size:16px;line-height:1.4}
.pagehead{margin-bottom:24px;gap:20px;align-items:flex-start}
.pagehead p{font-size:14px;line-height:1.6;max-width:850px}
.pagehead>div{min-width:0}.pagehead h1{overflow-wrap:anywhere}
.eyebrow{font-size:11px;letter-spacing:1.2px;margin-bottom:8px}
main#content{padding:28px 32px 36px;max-width:1720px}
.topbar{height:68px;padding:0 32px}
.sidebar{width:248px;padding:26px 16px 20px}
.main{margin-left:248px}
.sidebar .brand{margin-bottom:24px}
.sidebar nav a{font-size:13px;min-height:44px;border-radius:8px;padding:10px 12px}
.sidebar nav a>span{width:20px;flex:0 0 20px}
.sidebar .navlabel{font-size:10px}
.topbar .account{flex-wrap:wrap;gap:10px}
.topbar .account>a:first-of-type{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
footer{margin:0 32px;font-size:11px}
.button{font-size:13px;min-height:var(--ui-control);padding:8px 14px;gap:8px;border-radius:7px;line-height:1.4;box-shadow:none}
.button.text-button{background:transparent;color:var(--teal);border-color:var(--line)}
.button.text-button:hover{background:var(--raised)}
.text-button{font-size:13px;min-height:32px}
input,select,textarea{font-size:14px;border-radius:7px;padding:9px 12px;line-height:1.5}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select{min-height:var(--ui-control)}
input[type=checkbox],input[type=radio]{accent-color:var(--teal)}
label{font-size:13px;margin-bottom:6px}
.field{margin-bottom:20px}.field small,.field .helptext{font-size:12px;line-height:1.6;color:var(--muted)}
.formpanel{padding:24px;max-width:760px}
.actions{gap:10px;margin-top:20px}
.filterbar{padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);gap:10px;align-items:center;margin:0 0 20px}
.filterbar input{min-width:180px}.filterbar select{min-width:150px}
.panel{border-radius:var(--radius);margin-bottom:24px;box-shadow:none;min-width:0}
.panelhead,.panelbody{padding:20px}
.panelhead{flex-wrap:wrap;gap:12px}
.panelhead a,.sectionhead a{font-size:13px}
.panelhead p,.small,small{font-size:12px}
.detailgrid,.bottomgrid{gap:20px}
.detailgrid>*{min-width:0}
th{font-size:12px;text-transform:none;letter-spacing:0;line-height:1.5;padding:13px 16px;font-weight:600}
td{font-size:13px;line-height:1.6;padding:16px;vertical-align:middle}
td small,td .strong{font-size:12px}
td code,code{font-size:12px}
table{font-variant-numeric:tabular-nums}
.table-scroll{border-radius:inherit;scrollbar-width:thin}
.badge{font-size:11px;line-height:1.5;padding:4px 8px;border-radius:5px}
.stat{border-radius:var(--radius);padding:20px;box-shadow:none;min-width:0}
.stats{gap:16px;margin-bottom:24px}
.statlabel{font-size:12px}.stat small,.stat a{font-size:12px}
.statvalue{font-size:32px;line-height:1.2;margin:14px 0 10px}
.providercard{border-radius:10px;padding:16px}.providercard small{font-size:11px}
.providergrid{margin-bottom:24px}.connectcard{padding:24px}
.activityrow{font-size:13px}.activityrow small{font-size:12px}
.hint,.notice,.flash,.errorlist{font-size:13px;line-height:1.6;border-radius:8px;padding:14px 16px}
.hint{margin:20px 0}.notice{margin:20px 0}.empty p{font-size:13px}
dt{font-size:12px;text-transform:none;letter-spacing:0;margin-top:16px}
dd{font-size:14px;margin-top:5px}
.largeamount{font-size:36px;line-height:1.3}
.messagebody{font:14px/1.75 var(--ui-font);padding:18px;white-space:pre-wrap}
.evidencelink p{font-size:13px}.devicerow{flex-wrap:wrap}
.backlink{font-size:13px;margin-bottom:20px}
.pagination{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:20px 0;font-size:13px;color:var(--muted)}
.pagination a{display:inline-flex;padding:7px 12px;border:1px solid var(--line);border-radius:7px;background:var(--paper)}
details>summary:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
/* Component families use the same scale, while retaining semantic colors. */
body .gw-nav,html #ampay-accounts .ap-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:0 0 14px;margin:0 0 24px;border-bottom:1px solid var(--line)}
body .gw-nav a,html #ampay-accounts .ap-tabs a{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:40px;padding:8px 13px;margin:0;border:1px solid var(--line);border-radius:7px;color:var(--ink);background:var(--paper);font-size:13px;line-height:1.5;text-decoration:none;white-space:nowrap}
body .gw-nav a:hover,html #ampay-accounts .ap-tabs a:hover{background:var(--raised);border-color:#655780}
body .gw-nav a[aria-current=page],html #ampay-accounts .ap-tabs a[aria-current=page]{background:#2e2546;border-color:#67528e;color:#dfd2ff;font-weight:600}
body .gw-nav svg,html #ampay-accounts .ap-tabs svg{width:17px;height:17px;flex:0 0 17px}
body .gw-card{border-radius:var(--radius);padding:20px;background:var(--paper)}
body .gw-card h2{font-size:18px}.gw-card p:last-child{margin-bottom:0}
body .gw-value{font-size:32px;line-height:1.3}
body .gw-code{font:13px/1.7 Consolas,monospace;border-radius:8px}
body .gw-grid{gap:16px;margin:20px 0 24px}body .gw-warning{font-size:13px;border-radius:8px;padding:16px}
body .gw-detail dt{font-size:12px}body .gw-detail dd{font-size:14px}
body .wallet-balance{border-radius:var(--radius);padding:20px}body .wallet-amount{font-size:32px;line-height:1.3}
body .wallet-section>summary{padding:20px;font-size:15px}body .wallet-section form{padding:20px}
body .wallet-filters{padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);align-items:center;gap:10px}
body .wallet-filters select{width:auto;flex:0 1 200px}
body .clean-filters{padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);gap:16px;margin:20px 0}
body .clean-filters label,body .format-fields label,body .commission-fields label{font-size:13px}
body .clean-table th,body .clean-table td{padding:16px}
body .clean-table th{padding-top:13px;padding-bottom:13px}
body .clean-state,body .sms-usage-status,body .sender-detail-note{font-size:12px}
body .sms-usage-control .button{font-size:13px;min-height:36px;padding:7px 12px}
body .clean-summary{gap:20px}body .clean-summary dd{font-size:14px}
body .sms-fields dt{font-size:12px;text-transform:none;letter-spacing:0}
body .sender-check{font-size:12px}body .sender-preview code{font-size:14px}
body .health-heading{padding:20px}body .health-heading h2{font-size:18px}
body .health-heading p,body .health-meta,body .health-row,body .health-foot{font-size:13px}
body .health-row .badge{font-size:11px}body .health-foot .button{font-size:13px}
/* Down Line keeps its approved yellow account headers and blue history. */
html #ampay-accounts{font:14px/1.6 var(--ui-font);--ap-row:16px;--ap-panel:var(--paper);--ap-edge:var(--line)}
html #ampay-accounts .ap-main{padding:0}
html #ampay-accounts h1{font-size:28px;line-height:1.25;letter-spacing:-.6px;font-weight:650}
html #ampay-accounts .ap-heading{margin-bottom:20px}
html #ampay-accounts .ap-crumb,html #ampay-accounts .ap-crumb a,html #ampay-accounts .ap-crumb span{font-size:12px;line-height:1.6}
html #ampay-accounts .ap-crumb{margin-bottom:18px}
html #ampay-accounts .ap-own{padding:16px;border-radius:8px;font-size:13px;margin-bottom:20px}
html #ampay-accounts .ap-own strong{font-size:17px}
html #ampay-accounts .ap-filters{padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);margin-bottom:20px;gap:10px}
html #ampay-accounts .ap-button{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 13px;border-radius:7px;font:600 13px/1.5 var(--ui-font);text-decoration:none}
html #ampay-accounts select,html #ampay-accounts input{font-size:14px;min-height:40px;padding:9px 12px;border-radius:7px}
html #ampay-accounts .ap-toolbar{margin-bottom:12px}html #ampay-accounts .ap-toolbar strong{font-size:14px}
html #ampay-accounts .ap-scroll{border-radius:10px}
html #ampay-accounts th{font-size:12px;padding:13px 16px}
html #ampay-accounts td{font-size:13px;padding:16px}
html #ampay-accounts td small,html #ampay-accounts small,html #ampay-accounts .ap-help,html #ampay-accounts .ap-pager{font-size:12px}
html #ampay-accounts .ap-final{font-size:15px}
html #ampay-accounts .ap-settings-link{width:38px;height:38px}
html #ampay-accounts .ap-settings-panel{max-width:760px;margin:20px 0;border-radius:var(--radius)}
html #ampay-accounts .ap-settings-heading p,html #ampay-accounts label{font-size:13px}
html #ampay-accounts .ap-dir span,html #ampay-accounts .ap-dir input{width:38px;height:40px;min-height:40px;font-size:13px}
html #ampay-accounts .ap-amount{width:110px;height:40px}html #ampay-accounts .ap-remark{width:160px;height:40px}
html #ampay-accounts .ap-full{height:40px;padding:8px 10px;border-radius:7px;font-size:13px}
html #ampay-accounts .ap-bank-head label{font-size:13px}
html #ampay-accounts .ap-bank-table{min-width:860px}
html #ampay-accounts .ap-help{line-height:1.7;margin-top:14px}
html #ampay-accounts .ap-branch summary{font-size:13px}
html #ampay-accounts .ap-log-link{font-size:13px}
html #ampay-accounts .ap-alert,html #ampay-accounts .ap-review{font-size:13px;border-radius:8px;padding:16px}
html #ampay-accounts .ap-review-lines{font-size:13px}
/* Sign-in shares the same fields, buttons and readable typography. */
.loginwrap{border-radius:16px;min-height:620px}.loginform h2{font-size:26px}.loginintro h1{font-size:40px}
@media(max-width:1150px){.sidebar{width:212px;padding:24px 12px}.main{margin-left:212px}main#content{padding:24px}.topbar{padding:0 24px}footer{margin:0 24px}}
@media(max-width:760px){
 :root{--ui-control:44px}
 .sidebar{width:100%;padding:16px 16px 8px}.sidebar .brand{margin-bottom:12px}
 .sidebar nav{align-items:center}.sidebar nav a{font-size:12px;min-height:42px;padding:9px 11px}
 .main{margin-left:0}.topbar{height:auto;min-height:60px;padding:12px 16px;gap:10px;flex-wrap:wrap}
 .topbar>span{font-size:10px}.topbar .account{margin-left:auto;gap:10px}
 .topbar .account>a:first-of-type{max-width:160px}
 main#content{padding:24px 16px 28px}footer{margin:0 16px;gap:12px}
 h1,.pagehead h1,html #ampay-accounts h1{font-size:25px}
 .pagehead p{font-size:14px}.pagehead{margin-bottom:22px}
 .stats{gap:12px}.stat{padding:16px}.statlabel{font-size:12px}.statvalue{font-size:27px}
 .panelhead,.panelbody,.formpanel,body .gw-card{padding:18px}
 .button{min-height:44px}.filterbar,body .clean-filters,body .wallet-filters,html #ampay-accounts .ap-filters{padding:14px}
 .filterbar input{min-width:0}.filterbar select{min-width:140px}
 body .gw-nav,html #ampay-accounts .ap-tabs{gap:6px;row-gap:8px}
 body .gw-nav a,html #ampay-accounts .ap-tabs a{font-size:13px;min-height:44px;padding:8px 10px;gap:7px}
 html #ampay-accounts .ap-main{padding:0}
 html #ampay-accounts .ap-create{margin-left:0;flex-wrap:wrap}
 html #ampay-accounts .ap-filters input{flex:1;min-width:150px}
 html #ampay-accounts .ap-button{min-height:44px}
 html #ampay-accounts .ap-settings-actions{flex-wrap:wrap}
 html #ampay-accounts .ap-bucket-form,html #ampay-accounts .ap-submit-side label{flex-wrap:wrap}
 html #ampay-accounts .ap-bank-head select{max-width:100%}
 html #ampay-accounts .ap-own .ap-wallet-link{margin-left:0}
 body .wallet-amount{font-size:27px}.loginintro h1{font-size:32px}
}
@media(max-width:440px){body .clean-filters{grid-template-columns:1fr}body .clean-filters .search{grid-column:auto}body .commission-fields{grid-template-columns:1fr 1fr}.loginpage{padding:12px}.loginintro,.loginform{padding:24px}.loginform h2{font-size:24px}.loginwrap{border-radius:12px}.filterbar select{width:100%;flex-basis:100%}html #ampay-accounts .ap-settings-panel{padding:18px}}

.page-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.notification-filters{align-items:flex-end}.notification-filters label{flex:1;min-width:180px;margin:0}.notification-filters label input,.notification-filters label select{display:block;width:100%;margin-top:6px}.notification-card{overflow-wrap:anywhere}.notification-heading{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px}.notification-heading time{color:var(--muted)}.notification-body{white-space:pre-wrap;unicode-bidi:plaintext;margin:12px 0}.notification-card>small{display:block;padding-top:12px;color:var(--muted);border-top:1px solid var(--line)}

html #ampay-accounts .ap-button{gap:6px}
@media(max-width:600px){body .wallet-balance-grid{grid-template-columns:1fr}}

.workspace-help{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);margin:20px 0}.workspace-help>summary{padding:16px;font-size:13px;color:var(--ink)}.workspace-help>div{padding:0 16px 16px}.workspace-help>div p:last-child{margin-bottom:0}.workspace-help .clean-note{font-size:13px;line-height:1.7}

.shop-provider-wallets .panelhead p{margin:6px 0 0}
.shop-wallet-form{display:grid;grid-template-columns:minmax(160px,1fr) minmax(240px,2fr) auto;gap:18px;align-items:start}
.shop-wallet-form .field{margin:0}.shop-wallet-form input,.shop-wallet-form select{width:100%}
.shop-wallet-form .button{margin-top:26px}.shop-wallet-errors{grid-column:1/-1}
.shop-wallet-table{overflow-x:auto}.shop-wallet-table table{min-width:650px;width:100%}
.shop-wallet-table td small{display:block;margin-top:6px;color:var(--muted)}
.shop-wallet-table.with-controls th:last-child,.shop-wallet-table.with-controls td:last-child{position:sticky;right:0;background:var(--paper);box-shadow:-1px 0 var(--line);white-space:nowrap}
.shop-wallet-help{border-top:1px solid var(--line)}.shop-wallet-help p{margin:0}
.wallet-test-controls{max-width:900px}.wallet-test-controls .panelhead p{margin:6px 0 0}.wallet-test-controls select{width:100%}.wallet-control-switches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:24px 0}.wallet-control-switches>label{display:flex;align-items:flex-start;gap:12px;padding:18px;border:1px solid var(--line);border-radius:10px;background:var(--bg);cursor:pointer;margin:0}.wallet-control-switches input[type=checkbox]{width:20px;height:20px;min-height:20px;flex:none;margin:2px 0;accent-color:var(--accent)}.wallet-control-switches small{display:block;color:var(--muted);margin-top:7px;line-height:1.5}.wallet-control-errors{margin-bottom:18px;color:#ffb7b7}.wallet-test-controls .errorlist{color:#ffb7b7}.wallet-test-controls .field small{display:block;margin-top:8px;line-height:1.6;color:var(--muted)}
@media(max-width:760px){.wallet-control-switches{grid-template-columns:1fr}.shop-wallet-table .button{white-space:nowrap}}
@media(max-width:760px){.shop-wallet-form{grid-template-columns:1fr}.shop-wallet-form .button{margin-top:0;justify-self:start}}

.language-switch{display:inline-flex;gap:4px;align-items:center;margin:0}.language-switch select{min-width:82px;width:auto;padding:6px 8px;font:inherit}.language-switch button{padding:5px 9px;min-height:32px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.payment-clock{display:block;font-size:11px;margin-top:5px;color:var(--muted,#aab9d0);line-height:1.5}.payment-clock small{display:block}.payment-clock.ending{color:#ffb68d}html[lang=bn] body{font-family:Arial,"Noto Sans Bengali","Nirmala UI",sans-serif;line-height:1.6}html[lang=bn] .navlabel,html[lang=bn] .eyebrow{letter-spacing:0}html[lang=bn] button,html[lang=bn] input,html[lang=bn] select{font-family:inherit}@media(max-width:700px){.topbar{height:auto;min-height:64px;flex-wrap:wrap;gap:8px;padding:10px}.account{flex-wrap:wrap}.language-switch select{min-width:72px}}
