@font-face{font-family:LogoStudioThai;src:url('./assets/logo-studio-thai.ttf') format('truetype');font-display:swap}
:root{--claim-ink:#183629;--claim-muted:#50685b;--claim-line:#d8e4dc;--claim-soft:#f4f8f5;--claim-green:#287a4e;--claim-green-dark:#185c39;--claim-red:#b42318;--lgs-ink:#183629;--lgs-muted:#50685b;--lgs-line:#d8e4dc;--lgs-canvas:#f6f8f7;--lgs-blue:#287a4e;--lgs-blue-dark:#185c39;--ink:#183629;--muted:#50685b}
html,body{background:#f6f8f7!important;color:#183629;font-family:LogoStudioThai,'Noto Sans Thai',system-ui,sans-serif;font-size:16px!important;line-height:1.65}
[hidden]{display:none!important}
button,input,select,textarea{font-family:inherit;max-width:100%;min-height:44px}
input,select,textarea{color:#183629;border:1px solid #c5d8cb!important;border-radius:10px!important;background:#fff}
:is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #287a4e!important;outline-offset:3px}
input[readonly]{background:#f1f5f2!important}
body .login-wrap{background:#f6f8f7!important;min-height:100dvh;padding:32px 20px}
body .login-card,#admin-login .login-card,#staff-login .login-card{width:min(480px,100%);max-width:100%;padding:32px;border:1px solid #d8e4dc;border-radius:20px!important;box-shadow:0 8px 28px #18362908!important;overflow:visible}
.login-card h1{font-size:27px;line-height:1.45;letter-spacing:0}.login-description,.login-card>p{font-size:15px!important;line-height:1.7}.login-card .brand{margin-bottom:24px}.login-card .brand-mark{width:48px;height:48px;box-shadow:none!important}
.login-card form{display:grid;gap:18px;margin-top:24px}.login-card form label{display:grid;gap:8px}.login-card input{min-height:46px;width:100%}
.route-note{padding:14px;text-align:left;background:#f5f8f5;border-color:#d8e4dc;margin-top:20px}
body .eyebrow{color:#185c39!important;letter-spacing:.05em}
body :is(.primary-button,.primary-action,.approve-button),body .claim-form .primary-button{background:#287a4e!important;background-image:none!important;color:#fff!important;box-shadow:none!important;min-height:46px;border-radius:10px;padding:10px 16px}
body :is(.primary-button,.primary-action,.approve-button):hover,body .claim-form .primary-button:hover{background:#185c39!important}
body .reject-button{background:#b42318!important;min-height:46px;padding:10px 16px}
body :is(button:disabled,input:disabled,select:disabled){opacity:.6;cursor:not-allowed}
body .topbar{background:#fff!important;backdrop-filter:none;box-shadow:none;padding:16px max(24px,calc((100vw - 1180px)/2));gap:20px;align-items:center}
.topbar .brand{flex-shrink:0}.brand-mark{box-shadow:none!important}.topbar nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.topbar nav a,.topbar nav button{min-height:44px;padding:9px 12px;border:1px solid #d8e4dc;border-radius:10px;background:#fff;color:#185c39!important;line-height:1.5}
.topbar nav>span{overflow-wrap:anywhere;min-width:0;font-size:14px}.topbar .brand small{font-size:11px!important;letter-spacing:.02em}
.simple-page{width:min(1180px,calc(100% - 40px));margin:28px auto 48px}.simple-hero{align-items:center;gap:24px;margin-bottom:24px}.simple-hero>div{min-width:0}.simple-hero h1{font-size:clamp(25px,3vw,32px);line-height:1.5}.simple-hero p{font-size:15px;line-height:1.6}.simple-month{gap:12px}.simple-month label{min-width:0}.simple-month button{min-height:44px}
.simple-grid,.content-grid{gap:24px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
body :is(.simple-card,.panel,.payment-balance-card,.payment-qr-card){padding:24px;border:1px solid #d8e4dc!important;border-radius:16px!important;box-shadow:none!important;background:#fff!important;min-width:0}
.simple-card>header{gap:16px;flex-wrap:wrap;margin-bottom:20px}.simple-card>header>div{min-width:0;flex:1 1 200px}.simple-card>header h2,.panel-title h2{font-size:20px;line-height:1.5}.simple-card>header p,.panel-title p{font-size:14px!important;line-height:1.65}.simple-card>header>label{max-width:100%;min-width:0}.simple-card>header select{max-width:100%}
.form-person-note{white-space:normal;overflow-wrap:anywhere;max-width:100%;border-radius:10px;background:#eef7f0;font-size:13px!important}
.simple-form,.claim-form{gap:18px}.simple-form label,.claim-form label{font-size:15px!important;line-height:1.6;min-width:0}.simple-form .form-row,.claim-form .form-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.simple-form textarea,.claim-form textarea{min-height:96px}.amount-field{display:block}.amount-field input{padding-right:52px}.amount-field span{font-size:14px}.money-input{min-width:0}
.upload-box{position:relative;background:#f5f9f6!important;border-color:#b9d4c2!important;padding:16px;border-radius:12px}.upload-box:focus-within{outline:3px solid #287a4e;outline-offset:3px}.upload-box strong{font-size:15px}.upload-box em,.upload-box small{font-size:13px!important;overflow-wrap:anywhere}.upload-box input[type=file]{min-width:1px!important;min-height:1px!important;max-width:1px!important;height:1px!important;padding:0!important;border:0!important}
.simple-stats{gap:12px;margin-bottom:20px;grid-template-columns:repeat(4,minmax(0,1fr))}.simple-stats article{padding:16px;border-radius:12px}.simple-stats span{font-size:13px!important}.simple-stats b{font-size:23px;overflow-wrap:anywhere}
.simple-list,.owner-ledger,.claim-list{gap:16px}.simple-claim-item,.owner-item,.payment-review-card,body .claim-card{box-shadow:none;border-color:#d8e4dc;border-radius:12px;background:#fff;padding:18px;min-width:0}.owner-item{padding:0}.owner-item summary{padding:18px}.owner-item-body{padding:18px}
:is(.simple-claim-item,.payment-review-card,.owner-item) h3{font-size:16px;line-height:1.65;overflow-wrap:anywhere}.owner-item summary>div:first-child,.simple-claim-item>header>div:first-child,.payment-review-card>header>div:first-child{min-width:0}.simple-amount b,.claim-amount b{font-size:18px!important;line-height:1.5}.simple-amount{white-space:normal;flex-shrink:0}.simple-claim-item .item-meta,.owner-item summary p,.payment-review-card p{font-size:13px!important;overflow-wrap:anywhere}
.simple-claim-item dd,.owner-details b,.owner-details p{font-size:15px;line-height:1.7}.simple-claim-item dt,.owner-details span{font-size:13px!important}.settlement-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.settlement-strip div{padding:12px}.settlement-strip span{font-size:13px}.settlement-strip b{font-size:15px;overflow-wrap:anywhere}.owner-details{gap:12px}.job-reference-link{min-height:44px;white-space:normal;max-width:100%;text-align:center}
.status-pill,.status,.tag{font-size:13px!important;line-height:1.5;white-space:normal;max-width:100%;overflow-wrap:anywhere}.status-pill{min-height:28px;padding:4px 10px}.reviewed-note,.payment-status-next{font-size:14px!important;line-height:1.65;overflow-wrap:anywhere}.simple-empty,.empty{padding:28px 18px;background:#f5f8f5!important;border:1px dashed #d8e4dc;border-radius:12px;font-size:15px;line-height:1.7}
.payment-review-actions{gap:12px}.payment-review-actions button{flex:1 1 140px}.proof-button,.slip-button{min-height:44px;padding:10px 14px}.slip-preview img{max-width:100%;height:auto;object-fit:contain}
.payment-section{margin-top:32px;padding-top:28px;border-top-color:#d8e4dc}.section-heading h2{font-size:25px}.payment-flow{gap:12px}.payment-flow li{box-shadow:none;border-color:#d8e4dc;background:#fff;padding:14px}.payment-flow li i{background:#e0f2e5!important;color:#185c39}.payment-flow b{font-size:14px}.payment-flow small{font-size:13px!important}.payment-checkout{gap:24px;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:24px}
body .payment-balance-card{background:#f1f8f3!important;color:#183629!important}.payment-balance-card :is(h3,dt,dd,strong,b){color:#183629!important}.payment-balance-card :is(span,small,p){color:#50685b!important}.payment-balance-card .eyebrow{color:#185c39!important}.payment-balance-card header,.payment-qr-card header{gap:12px;flex-wrap:wrap}.payment-balance-main{padding:20px 0}.payment-balance-main strong{font-size:34px}.payment-balance-card dl>div{gap:16px;border-color:#d4e4d9}.payment-balance-card dt,.payment-balance-card dd{font-size:15px;min-width:0;overflow-wrap:anywhere}.payment-balance-card dd{text-align:right}.payment-balance-outstanding{background:#e3f0e7!important}.payment-balance-note{background:#fff!important;border-color:#d4e4d9;font-size:14px!important}
.payment-live-badge,.promptpay-badge{font-size:12px!important;white-space:normal;max-width:100%;color:#185c39!important;background:#e0f2e5!important}.payment-qr-link{max-width:100%}.payment-qr-link img{max-width:100%;object-fit:contain}.payment-account-row{gap:12px;flex-wrap:wrap;min-width:0}.payment-account-row strong{overflow-wrap:anywhere}.payment-account-row button{min-height:44px;background:#eef7f0;color:#185c39;border-color:#c5d8cb}.payment-safety-note{font-size:13px!important;line-height:1.7;background:#f6f8f5}
body #logo-studio-universal-hub-back{position:static;min-height:44px;padding:9px 12px;border:1px solid #c5d8cb;border-radius:10px;background:#fff;color:#185c39!important;box-shadow:none;font:600 14px/1.5 LogoStudioThai,system-ui,sans-serif;z-index:auto;white-space:normal}
body #logo-studio-universal-hub-back:hover{transform:none;background:#eef7f0;box-shadow:none}.login-card #logo-studio-universal-hub-back{display:flex;justify-content:center;margin-top:20px}
@media(max-width:1000px){body .topbar{flex-wrap:wrap;gap:12px}.topbar nav{justify-content:flex-start}.simple-grid,.content-grid,.payment-checkout{grid-template-columns:minmax(0,1fr)}.payment-flow{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){.simple-hero{align-items:stretch}.simple-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){body .login-wrap{padding:24px 16px}body .login-card,#admin-login .login-card,#staff-login .login-card{padding:28px 22px}.login-card h1{font-size:25px}.simple-page{width:calc(100% - 32px);margin-top:24px}body .topbar{padding:16px}.topbar nav{width:100%;gap:8px}.topbar nav>span{width:100%}.topbar nav a,.topbar nav button{flex:1 1 auto;text-align:center;justify-content:center}.simple-month{flex-wrap:wrap}.simple-month label{flex:1 1 150px}.simple-hero h1{font-size:26px}body :is(.simple-card,.panel,.payment-balance-card,.payment-qr-card){padding:20px 16px}.simple-card>header>label{width:100%}.simple-card>header select{width:100%}.simple-form .form-row,.claim-form .form-row,.owner-details{grid-template-columns:minmax(0,1fr)!important}.owner-item summary{flex-direction:column;gap:12px}.simple-amount{text-align:left}.simple-amount b{font-size:20px!important}.owner-item summary,.owner-item-body,.simple-claim-item,.payment-review-card{padding:16px}.claim-card-head{flex-direction:column;gap:12px}.claim-amount{text-align:left}.payment-flow{grid-template-columns:minmax(0,1fr)}.payment-flow li{padding:12px 14px}.payment-flow small{margin-top:0}.payment-balance-card dl>div{flex-wrap:wrap}.payment-account-row{display:grid;grid-template-columns:minmax(0,1fr)}.payment-account-row button{width:100%}.payment-review-actions button{flex-basis:100%}.section-heading h2{font-size:23px}}
@media(max-width:540px){body .topbar{position:static}.simple-stats article{padding:12px}.simple-stats b{font-size:21px}}
@media(max-width:360px){.settlement-strip{grid-template-columns:minmax(0,1fr)}body .login-card,#admin-login .login-card,#staff-login .login-card{padding:24px 18px}.login-card h1{font-size:23px}.simple-month button{width:100%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* Review one slip at a time while retaining the original form and handlers. */
.claims-review-details{margin-top:14px;border:1px solid #d8e4dc;border-radius:12px;background:#fff}
.claims-review-details>summary{padding:12px;min-height:44px;cursor:pointer;color:#185c39;font-size:14px;font-weight:600;line-height:1.7;overflow-wrap:anywhere}
.claims-review-details>summary:focus-visible{outline:3px solid #287a4e;outline-offset:3px}
.claims-review-details[open]>summary{border-bottom:1px solid #d8e4dc;background:#eef7f0;border-radius:12px 12px 0 0}
.claims-review-details>.payment-review-form{padding:14px 12px;margin:0}
.claims-review-details:not([open])>.payment-review-form{display:none}
.payment-review-card .simple-amount b{color:#183629!important}
.payment-review-card:has(.status-pill.approved) .simple-amount b{color:#185c39!important}
