:root{
  --ds-brand-50:#eef5fc;--ds-brand-100:#d7e7f7;--ds-brand-200:#b0cfef;--ds-brand-300:#7fb0e3;--ds-brand-400:#4a8ed4;--ds-brand-500:#1f6ec2;--ds-brand-600:#0755a5;--ds-brand-700:#074a8e;--ds-brand-800:#073b73;--ds-brand-900:#062f5c;--ds-brand-950:#041d39;
  --ds-success:#16a34a;--ds-success-surface:#ecfdf3;--ds-success-text:#15803d;
  --ds-warning:#b45309;--ds-warning-surface:#fef6e7;--ds-warning-text:#92400e;
  --ds-danger:#dc2626;--ds-danger-surface:#fef2f2;--ds-danger-text:#b91c1c;
  --ds-neutral:#64748b;--ds-neutral-surface:#f1f5f9;--ds-neutral-text:#475569;
  --ds-bg:#f8fafc;--ds-card:#ffffff;--ds-text:#172033;--ds-muted:#64748b;--ds-border:#dbe4ee;--ds-ring:#1f6ec2;--ds-radius:8px;
  --s4s-blue:var(--ds-brand-600);--s4s-blue-dark:var(--ds-brand-800);--s4s-green:var(--ds-success);--s4s-bg:var(--ds-bg);--s4s-card:var(--ds-card);--s4s-text:var(--ds-text);--s4s-muted:var(--ds-muted);--s4s-border:var(--ds-border);
}
html.dark{
  --ds-bg:#0b1220;--ds-card:#111b2b;--ds-text:#eef5fc;--ds-muted:#a7b6c8;--ds-border:#26364b;--ds-ring:#4a8ed4;
  --ds-brand-50:#101f33;--ds-brand-100:#132943;--ds-brand-200:#19395c;--ds-brand-600:#4a8ed4;--ds-brand-700:#7fb0e3;--ds-brand-800:#b0cfef;
  --ds-success-surface:#102a1b;--ds-success-text:#86efac;--ds-warning-surface:#30200c;--ds-warning-text:#fcd34d;--ds-danger-surface:#351416;--ds-danger-text:#fca5a5;--ds-neutral-surface:#182334;--ds-neutral-text:#cbd5e1;
}
html,body{font-family:'Instrument Sans',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
body{background:var(--ds-bg);color:var(--ds-text)}


body.s4s-authenticated .s4s-card,body.s4s-authenticated .s4s-stat,body.s4s-authenticated .s4s-report,body.s4s-authenticated .s4s-filter{border-radius:var(--ds-radius);border-color:var(--ds-border);background:var(--ds-card);box-shadow:none}
body.s4s-authenticated .s4s-btn,body.s4s-authenticated .s4s-tool-btn,body.s4s-authenticated .s4s-page-btn,body.s4s-authenticated input,body.s4s-authenticated select,body.s4s-authenticated textarea{border-radius:var(--ds-radius)}
body.s4s-authenticated .s4s-btn{min-height:40px;font-weight:600}
body.s4s-authenticated .s4s-btn.primary{background:var(--ds-brand-600);border-color:var(--ds-brand-600)}
body.s4s-authenticated .s4s-btn.green{background:var(--ds-success);border-color:var(--ds-success)}
body.s4s-authenticated .s4s-h1{font-size:24px;line-height:32px;font-weight:700;letter-spacing:-.02em;color:var(--ds-brand-800)}
body.s4s-authenticated .s4s-card h2{font-weight:600;color:var(--ds-text)}
body.s4s-authenticated .s4s-eyebrow{font-size:11px;line-height:16px;font-weight:600;letter-spacing:.08em;color:var(--ds-brand-600)}
body.s4s-authenticated .s4s-sub{font-size:13px;line-height:20px;color:var(--ds-muted)}
body.s4s-authenticated .s4s-nav a{border-radius:var(--ds-radius);font-weight:600}
body.s4s-authenticated .s4s-nav a.active{background:rgba(74,142,212,.16);color:#fff;box-shadow:inset 3px 0 0 var(--ds-brand-400)}
body.s4s-authenticated .s4s-nav a.active .s4s-nav-icon{color:#fff}
body.s4s-authenticated .s4s-app-switcher summary,body.s4s-authenticated .s4s-app-switcher-menu{border-radius:var(--ds-radius)}
body.s4s-authenticated .s4s-stat .value{font-size:26px;font-weight:700;letter-spacing:-.02em}
body.s4s-authenticated .s4s-stat-icon,body.s4s-authenticated .s4s-graph-icon{border-radius:var(--ds-radius);box-shadow:none}


body.s4s-authenticated #app .bg-white{background-color:var(--ds-card)!important}
body.s4s-authenticated #app .bg-slate-50,body.s4s-authenticated #app .bg-slate-100{background-color:var(--ds-neutral-surface)!important}
body.s4s-authenticated #app .text-slate-900,body.s4s-authenticated #app .text-slate-800,body.s4s-authenticated #app .text-slate-700{color:var(--ds-text)!important}
body.s4s-authenticated #app .text-slate-600,body.s4s-authenticated #app .text-slate-500,body.s4s-authenticated #app .text-slate-400{color:var(--ds-muted)!important}
body.s4s-authenticated #app .border-slate-100,body.s4s-authenticated #app .border-slate-200,body.s4s-authenticated #app .border-slate-300{border-color:var(--ds-border)!important}
body.s4s-authenticated #app .divide-slate-100>:not([hidden])~:not([hidden]),body.s4s-authenticated #app .divide-slate-200>:not([hidden])~:not([hidden]){border-color:var(--ds-border)!important}
body.s4s-authenticated #app .bg-indigo-600,body.s4s-authenticated #app [class*="bg-[#0755A5]"]{background-color:var(--ds-brand-600)!important}
body.s4s-authenticated #app .hover\:bg-indigo-700:hover,body.s4s-authenticated #app [class*="hover:bg-[#064986]"]:hover{background-color:var(--ds-brand-700)!important}
body.s4s-authenticated #app .text-indigo-600,body.s4s-authenticated #app [class*="text-[#0755A5]"]{color:var(--ds-brand-600)!important}
body.s4s-authenticated #app [class*="text-[#073B73]"],body.s4s-authenticated #app [class*="text-[#073b73]"]{color:var(--ds-brand-800)!important}
body.s4s-authenticated #app [class*="text-[#16A34A]"]{color:var(--ds-success)!important}
body.s4s-authenticated #app .rounded-xl,body.s4s-authenticated #app .rounded-2xl{border-radius:var(--ds-radius)!important}
body.s4s-authenticated #app .shadow-sm,body.s4s-authenticated #app .shadow-md{box-shadow:none!important}
body.s4s-authenticated #app main{color:var(--ds-text)}
body.s4s-authenticated #app main section{background-color:var(--ds-card);border-color:var(--ds-border)}


body.s4s-authenticated #app input:not([type="checkbox"]):not([type="radio"]),body.s4s-authenticated #app select,body.s4s-authenticated #app textarea,
body.s4s-authenticated .s4s-erp-page input:not([type="checkbox"]):not([type="radio"]),body.s4s-authenticated .s4s-erp-page select,body.s4s-authenticated .s4s-erp-page textarea{
  min-height:40px;border:1px solid var(--ds-border)!important;border-radius:var(--ds-radius)!important;background:var(--ds-card)!important;color:var(--ds-text)!important;outline:none;transition:border-color .16s,box-shadow .16s
}
body.s4s-authenticated #app textarea,body.s4s-authenticated .s4s-erp-page textarea{min-height:96px}
body.s4s-authenticated #app input:focus,body.s4s-authenticated #app select:focus,body.s4s-authenticated #app textarea:focus,
body.s4s-authenticated .s4s-erp-page input:focus,body.s4s-authenticated .s4s-erp-page select:focus,body.s4s-authenticated .s4s-erp-page textarea:focus{border-color:var(--ds-ring)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--ds-ring) 18%,transparent)!important}
body.s4s-authenticated button:focus-visible,body.s4s-authenticated a:focus-visible{outline:2px solid var(--ds-ring)!important;outline-offset:2px}
body.s4s-authenticated button:disabled{opacity:.5;cursor:not-allowed}
.s4s-select-search{display:block;width:100%;margin:0 0 6px;min-height:40px;padding:8px 10px;border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card);color:var(--ds-text);font:inherit}
.s4s-select-search:focus{outline:2px solid var(--ds-ring);outline-offset:1px}


.s4s-status-pill{display:inline-flex;align-items:center;padding:4px 9px;border-radius:9999px;font-size:11px;line-height:16px;font-weight:600;text-transform:capitalize}
.s4s-status-success{background:var(--ds-success-surface);color:var(--ds-success-text)}
.s4s-status-warning{background:var(--ds-warning-surface);color:var(--ds-warning-text)}
.s4s-status-danger{background:var(--ds-danger-surface);color:var(--ds-danger-text)}
.s4s-status-neutral{background:var(--ds-neutral-surface);color:var(--ds-neutral-text)}


.s4s-toast-stack{position:fixed;right:20px;bottom:20px;z-index:12050;display:grid;gap:8px;width:min(390px,calc(100vw - 24px));pointer-events:none}
.s4s-toast{display:grid;grid-template-columns:20px minmax(0,1fr) 36px;align-items:start;gap:10px;padding:12px 12px 12px 14px;border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card);color:var(--ds-text);box-shadow:0 12px 35px rgba(4,29,57,.16);pointer-events:auto;font-size:13px;line-height:20px}
.s4s-toast.success{border-color:color-mix(in srgb,var(--ds-success) 35%,var(--ds-border))}.s4s-toast.error{border-color:color-mix(in srgb,var(--ds-danger) 35%,var(--ds-border))}
.s4s-toast-icon{width:18px;height:18px;margin-top:1px}.s4s-toast.success .s4s-toast-icon{color:var(--ds-success)}.s4s-toast.error .s4s-toast-icon{color:var(--ds-danger)}
.s4s-toast-close{display:grid;place-items:center;width:36px;height:36px;margin:-8px -7px 0 0;border:0;border-radius:var(--ds-radius);background:transparent;color:var(--ds-muted);cursor:pointer}


.s4s-confirm-backdrop{position:fixed;inset:0;z-index:13000;background:rgba(4,18,36,.58);backdrop-filter:blur(2px);display:grid;place-items:center;padding:16px}
.s4s-confirm-dialog{width:min(430px,100%);border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card);color:var(--ds-text);padding:20px;box-shadow:0 20px 55px rgba(4,18,36,.28)}
.s4s-confirm-dialog h2{margin:0;font-size:18px;line-height:26px;font-weight:600}.s4s-confirm-dialog p{margin:7px 0 18px;color:var(--ds-muted);font-size:13px;line-height:20px}.s4s-confirm-actions{display:flex;justify-content:flex-end;gap:8px}.s4s-confirm-actions button{min-height:40px;padding:0 15px;border-radius:var(--ds-radius);border:1px solid var(--ds-border);font:600 13px/1 'Instrument Sans',sans-serif;cursor:pointer}.s4s-confirm-cancel{background:var(--ds-card);color:var(--ds-text)}.s4s-confirm-danger{background:var(--ds-danger);border-color:var(--ds-danger)!important;color:#fff}.s4s-confirm-primary{background:var(--ds-brand-600);border-color:var(--ds-brand-600)!important;color:#fff}


body.s4s-modal-active,body.s4s-native-form-modal-active,body.s4s-employee-modal-active{overflow:hidden!important}
.s4s-modal-backdrop,.s4s-native-form-backdrop,.s4s-employee-modal-backdrop{background:rgba(4,18,36,.52)!important;backdrop-filter:blur(2px)}
#app section.s4s-managed-form.s4s-modal-open,#app section.s4s-native-form-modal{
  top:0!important;right:0!important;bottom:0!important;left:auto!important;width:min(480px,100vw)!important;max-width:480px!important;max-height:100dvh!important;height:100dvh!important;margin:0!important;border-radius:0!important;border-left:1px solid var(--ds-border)!important;background:var(--ds-card)!important;padding:20px!important;box-shadow:-18px 0 50px rgba(4,18,36,.18)!important;overflow:auto!important
}
#app section.s4s-managed-form.s4s-modal-open.s4s-long-form,#app section.s4s-native-form-modal.s4s-long-form,#app .s4s-native-existing-overlay .s4s-long-form,#app section.s4s-employee-modal.s4s-long-form{
  position:fixed!important;inset:0!important;width:100%!important;max-width:none!important;height:100dvh!important;max-height:100dvh!important;border:0!important;border-radius:0!important;padding:clamp(16px,3vw,32px)!important;box-shadow:none!important;overflow:auto!important
}
#app .s4s-native-existing-overlay.s4s-long-overlay{padding:0!important;background:var(--ds-bg)!important;backdrop-filter:none!important}
#app .s4s-native-existing-overlay.s4s-long-overlay>div{width:100%!important;max-width:none!important;margin:0!important}
.s4s-modal-close{width:40px!important;height:40px!important;min-width:40px!important;border-radius:var(--ds-radius)!important}
.s4s-form-dirty-badge{display:none;margin-left:8px;padding:3px 7px;border-radius:9999px;background:var(--ds-warning-surface);color:var(--ds-warning-text);font-size:10px;font-weight:600}.s4s-is-dirty .s4s-form-dirty-badge{display:inline-flex}
.s4s-error-summary{margin:0 0 16px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--ds-danger) 30%,var(--ds-border));border-radius:var(--ds-radius);background:var(--ds-danger-surface);color:var(--ds-danger-text);font-size:13px;line-height:20px}.s4s-error-summary strong{display:block;margin-bottom:4px}.s4s-error-summary a{display:block;color:inherit;text-decoration:underline}


body.s4s-authenticated table{font-variant-numeric:tabular-nums}
body.s4s-authenticated .s4s-data-region{border:1px solid var(--ds-border);border-radius:var(--ds-radius);overflow:auto;background:var(--ds-card)}
body.s4s-authenticated .s4s-data-region table{border-collapse:separate;border-spacing:0;width:100%}
body.s4s-authenticated .s4s-data-region thead th{position:sticky;top:0;z-index:3;background:var(--ds-neutral-surface);color:var(--ds-neutral-text);font-size:11px;line-height:16px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
body.s4s-authenticated .s4s-data-region tbody td{border-bottom:1px solid var(--ds-border)}
body.s4s-authenticated .s4s-data-region tbody tr:last-child td{border-bottom:0}
.s4s-empty-card{display:grid;place-items:center;min-height:180px;padding:28px;text-align:center;color:var(--ds-muted)}
.s4s-empty-card svg{width:40px;height:40px;margin-bottom:10px}.s4s-empty-card strong{display:block;color:var(--ds-text);font-size:15px;font-weight:600}.s4s-empty-card span{display:block;margin-top:4px;font-size:13px}


.s4s-runtime-breadcrumbs{display:flex;align-items:center;gap:6px;margin:0 0 12px;color:var(--ds-muted);font-size:12px;line-height:18px}.s4s-runtime-breadcrumbs a{color:var(--ds-brand-600);text-decoration:none}.s4s-runtime-breadcrumbs .sep{opacity:.55}


.s4s-mobile-tabs{display:none}


body.s4s-client-v2{background:var(--ds-bg);color:var(--ds-text)}
body.s4s-client-v2 .client-shell{max-width:1180px;margin:auto;padding:20px}
body.s4s-client-v2 .client-top{padding:12px 0;border-bottom:1px solid var(--ds-border)}
body.s4s-client-v2 .client-brand strong{color:var(--ds-brand-800);font-size:16px}body.s4s-client-v2 .client-tag{color:var(--ds-muted)}
body.s4s-client-v2 .client-stat,body.s4s-client-v2 .s4s-card{border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card);box-shadow:none}
body.s4s-client-v2 .client-stat strong{color:var(--ds-brand-800);font-weight:700;font-variant-numeric:tabular-nums}

html.dark body.s4s-authenticated #app .bg-white,html.dark body.s4s-authenticated #app main section{background-color:var(--ds-card)!important;color:var(--ds-text)!important}
html.dark body.s4s-authenticated #app .bg-slate-50,html.dark body.s4s-authenticated #app .bg-slate-100{background-color:var(--ds-neutral-surface)!important}
html.dark body.s4s-authenticated #app input,html.dark body.s4s-authenticated #app select,html.dark body.s4s-authenticated #app textarea{color-scheme:dark}
html.dark body.s4s-authenticated .s4s-card,html.dark body.s4s-authenticated .s4s-stat,html.dark body.s4s-authenticated .s4s-report,html.dark body.s4s-authenticated .s4s-filter{background:var(--ds-card);color:var(--ds-text)}
html.dark body.s4s-authenticated .s4s-table th,html.dark body.s4s-authenticated .s4s-table td{color:var(--ds-text);border-color:var(--ds-border)}

@media(max-width:767px){
  body.s4s-authenticated{padding-bottom:0}
  body.s4s-authenticated #app input:not([type="checkbox"]):not([type="radio"]),body.s4s-authenticated #app select,body.s4s-authenticated #app textarea,body.s4s-authenticated .s4s-erp-page input:not([type="checkbox"]):not([type="radio"]),body.s4s-authenticated .s4s-erp-page select,body.s4s-authenticated .s4s-erp-page textarea{min-height:48px;font-size:16px!important}
  body.s4s-authenticated button,body.s4s-authenticated .s4s-btn,body.s4s-authenticated a.s4s-btn{min-height:44px}
  body.s4s-authenticated .s4s-h1{font-size:20px;line-height:28px}
  #app section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form),#app section.s4s-native-form-modal:not(.s4s-long-form){top:auto!important;right:0!important;bottom:0!important;left:0!important;width:100%!important;max-width:none!important;height:auto!important;max-height:min(88dvh,780px)!important;border:0!important;border-top:1px solid var(--ds-border)!important;border-radius:16px 16px 0 0!important;padding:18px 16px calc(16px + env(safe-area-inset-bottom))!important;box-shadow:0 -18px 45px rgba(4,18,36,.2)!important}
  #app section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form)::before,#app section.s4s-native-form-modal:not(.s4s-long-form)::before{content:"";display:block;width:42px;height:4px;margin:-7px auto 14px;border-radius:999px;background:var(--ds-border)}
  .s4s-confirm-actions{flex-direction:column-reverse}.s4s-confirm-actions button{min-height:48px;width:100%}
  .s4s-toast-stack{top:calc(12px + env(safe-area-inset-top));right:12px;bottom:auto;left:12px;width:auto}
  body.s4s-authenticated .s4s-table-toolbar{gap:8px}.s4s-table-toolbar .s4s-toolbar-left,.s4s-table-toolbar .s4s-toolbar-right{width:100%;display:grid!important;grid-template-columns:1fr 1fr;gap:8px}.s4s-table-toolbar .s4s-search-wrap{grid-column:1/-1}.s4s-table-toolbar .s4s-table-count{grid-column:1/-1}
  body.s4s-authenticated .s4s-data-region.s4s-mobile-cards{overflow:visible;border:0;background:transparent}
  .s4s-mobile-cards table,.s4s-mobile-cards tbody,.s4s-mobile-cards tr,.s4s-mobile-cards td{display:block;width:100%}
  .s4s-mobile-cards thead{display:none}
  .s4s-mobile-cards tbody{display:grid;gap:10px}
  .s4s-mobile-cards tbody tr{position:relative;padding:14px;border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card)}
  .s4s-mobile-cards tbody tr[style*="display: none"]{display:none!important}
  .s4s-mobile-cards tbody td{display:grid!important;grid-template-columns:minmax(105px,38%) minmax(0,1fr);gap:10px;align-items:start;padding:7px 0!important;border:0!important;white-space:normal!important;text-align:left!important;min-height:0}
  .s4s-mobile-cards tbody td::before{content:attr(data-s4s-label);color:var(--ds-muted);font-size:11px;line-height:16px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
  .s4s-mobile-cards tbody td[data-s4s-label=""],.s4s-mobile-cards tbody td[colspan]{display:block!important;text-align:center!important}.s4s-mobile-cards tbody td[data-s4s-label=""]::before,.s4s-mobile-cards tbody td[colspan]::before{display:none}
  .s4s-mobile-cards .s4s-row-actions-cell{display:flex!important;justify-content:flex-end;gap:6px;border-top:1px solid var(--ds-border)!important;margin-top:6px;padding-top:10px!important}.s4s-mobile-cards .s4s-row-actions-cell::before{display:none}
  body.s4s-employee-portal{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  body.s4s-employee-portal .s4s-mobile-tabs{position:fixed;right:0;bottom:0;left:0;z-index:10030;display:grid;grid-template-columns:repeat(5,1fr);padding:6px 6px calc(6px + env(safe-area-inset-bottom));border-top:1px solid var(--ds-border);background:color-mix(in srgb,var(--ds-card) 95%,transparent);backdrop-filter:blur(14px)}
  .s4s-mobile-tabs a{display:flex;min-height:48px;align-items:center;justify-content:center;padding:5px 2px;border-radius:var(--ds-radius);color:var(--ds-muted);font-size:10px;font-weight:600;text-decoration:none;text-align:center}.s4s-mobile-tabs a.active{background:var(--ds-brand-50);color:var(--ds-brand-600)}
  body.s4s-client-v2 .client-shell{padding:12px}body.s4s-client-v2 .client-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){body.s4s-client-v2 .client-grid{grid-template-columns:1fr}}
@media(max-width:767px){
  #app .s4s-long-form .s4s-form-actions,#app .s4s-native-existing-overlay.s4s-long-overlay .s4s-form-actions{position:sticky;right:0;bottom:0;left:0;z-index:5;margin:20px -16px -16px!important;padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--ds-border);background:color-mix(in srgb,var(--ds-card) 96%,transparent);backdrop-filter:blur(10px)}
  #app .s4s-long-form .s4s-form-actions button[type="submit"],#app .s4s-native-existing-overlay.s4s-long-overlay .s4s-form-actions button[type="submit"]{min-height:48px;flex:1}
}

.s4s-login-card,.s4s-login-brand,.s4s-login-input,.s4s-login-submit{border-radius:var(--ds-radius)!important}
.s4s-login-card{box-shadow:0 18px 55px rgba(4,29,57,.12)!important}.s4s-login-card h2,.s4s-login-hero h1{font-weight:700!important}.s4s-login-eyebrow,.s4s-login-form>label,.s4s-login-label-row label,.s4s-login-submit{font-weight:600!important}
.s4s-login-input.s4s-password-ready{grid-template-columns:42px minmax(0,1fr) 42px}.s4s-password-toggle{display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:var(--ds-radius);background:transparent;color:var(--ds-muted);cursor:pointer}.s4s-password-toggle:hover{background:var(--ds-neutral-surface);color:var(--ds-brand-600)}


.s4s-form-heading{display:flex;align-items:center;gap:8px}
.s4s-is-dirty .s4s-form-heading::after{content:"Unsaved";display:inline-flex;align-items:center;padding:3px 7px;border-radius:9999px;background:var(--ds-warning-surface);color:var(--ds-warning-text);font-size:10px;line-height:14px;font-weight:600;letter-spacing:0;text-transform:none}
[data-s4s-duplicate-hidden="1"]{display:none!important}
#app .s4s-action-original-hidden{display:none!important}
#app .s4s-row-actions-cell{position:relative;min-width:64px!important;overflow:visible!important}
#app .s4s-row-menu{position:relative;display:inline-flex;justify-content:flex-end}
#app .s4s-row-menu-trigger{display:inline-grid;place-items:center;width:40px;height:40px;min-width:40px;border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card);color:var(--ds-neutral-text);cursor:pointer;transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s}
#app .s4s-row-menu-trigger:hover,#app .s4s-row-menu.is-open .s4s-row-menu-trigger{border-color:var(--ds-brand-200);background:var(--ds-brand-50);color:var(--ds-brand-600)}
#app .s4s-row-menu-trigger:focus-visible{outline:2px solid var(--ds-ring)!important;outline-offset:2px}
#app .s4s-row-menu-trigger svg{width:18px;height:18px}
#app .s4s-row-menu-popover{position:absolute;right:0;top:calc(100% + 6px);z-index:80;display:none;min-width:150px;padding:5px;border:1px solid var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card);box-shadow:0 12px 30px rgba(4,29,57,.14)}
#app .s4s-row-menu.is-open .s4s-row-menu-popover{display:grid;gap:2px}
#app .s4s-row-menu-item{width:100%;min-height:38px;padding:8px 10px;border:0;border-radius:6px;background:transparent;color:var(--ds-text);font:600 12px/18px 'Instrument Sans',sans-serif;text-align:left;cursor:pointer}
#app .s4s-row-menu-item:hover,#app .s4s-row-menu-item:focus-visible{background:var(--ds-neutral-surface);outline:none}
#app .s4s-row-menu-item.danger{color:var(--ds-danger-text)}
#app .s4s-row-menu-item.danger:hover,#app .s4s-row-menu-item.danger:focus-visible{background:var(--ds-danger-surface)}
body.s4s-authenticated .s4s-dashboard-content>.s4s-grid{gap:12px}
body.s4s-authenticated .s4s-dashboard-content .s4s-stat{min-height:132px;padding:18px}
body.s4s-authenticated .s4s-dashboard-content .s4s-stat .label{font-size:12px;line-height:18px;font-weight:600;color:var(--ds-muted)}
body.s4s-authenticated .s4s-dashboard-content .s4s-stat .hint{font-size:11px;line-height:17px;color:var(--ds-muted)}
body.s4s-authenticated .s4s-dashboard-content .s4s-quick{gap:8px}
body.s4s-authenticated .s4s-dashboard-content .s4s-quick a{min-height:52px;border-color:var(--ds-border);border-radius:var(--ds-radius);background:var(--ds-card);box-shadow:none}
body.s4s-authenticated .s4s-dashboard-content .s4s-quick a:hover{border-color:var(--ds-brand-200);background:var(--ds-brand-50);box-shadow:none}
body.s4s-authenticated .s4s-table-toolbar{border-radius:var(--ds-radius);box-shadow:none}
body.s4s-authenticated .s4s-table-toolbar .s4s-tool-btn{min-height:40px}
body.s4s-authenticated .s4s-data-region{box-shadow:none}
@media(max-width:767px){
  #app .s4s-row-actions-cell{display:flex!important;justify-content:flex-end!important;min-width:0!important}
  #app .s4s-row-menu-popover{position:fixed;right:12px;left:12px;top:auto;bottom:calc(12px + env(safe-area-inset-bottom));min-width:0;padding:8px;box-shadow:0 18px 50px rgba(4,18,36,.24)}
  #app .s4s-row-menu-item{min-height:46px;font-size:14px}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat{min-height:118px}
}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form){top:12px!important;right:12px!important;bottom:auto!important;left:auto!important;width:min(520px,calc(100vw - 24px))!important;max-width:520px!important;height:auto!important;max-height:calc(100dvh - 24px)!important;margin:0!important;padding:22px!important;border:1px solid var(--ds-border)!important;border-radius:16px!important;background:var(--ds-card)!important;box-shadow:-14px 18px 52px rgba(4,18,36,.22)!important;overflow:auto!important}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px 14px!important}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form .wide,body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form .actions{grid-column:1/-1!important}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form-card h2{margin:0 48px 20px 0!important;font-size:18px!important;line-height:26px!important}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form label{font-size:11px!important;line-height:16px!important}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form input,body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form select,body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form textarea{margin-top:7px!important;border-radius:11px!important}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form .actions{align-items:center!important;padding-top:4px!important}
body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form)>.s4s-modal-close{position:absolute!important;top:14px!important;right:14px!important;z-index:2!important;border:1px solid var(--ds-border)!important;background:#fff!important;color:#64748b!important}
#app section.s4s-native-form-modal:not(.s4s-long-form){top:12px!important;right:12px!important;bottom:auto!important;left:auto!important;width:min(500px,calc(100vw - 24px))!important;max-width:500px!important;height:auto!important;max-height:calc(100dvh - 24px)!important;border:1px solid var(--ds-border)!important;border-radius:16px!important;padding:20px!important;box-shadow:-14px 18px 52px rgba(4,18,36,.22)!important}
@media(max-width:767px){body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form),#app section.s4s-native-form-modal:not(.s4s-long-form){top:auto!important;right:0!important;bottom:0!important;left:0!important;width:100%!important;max-width:none!important;height:auto!important;max-height:min(88dvh,780px)!important;border:0!important;border-top:1px solid var(--ds-border)!important;border-radius:16px 16px 0 0!important;padding:18px 16px calc(16px + env(safe-area-inset-bottom))!important;box-shadow:0 -18px 45px rgba(4,18,36,.2)!important}body.s4s-authenticated.s4s-app-erp section.s4s-managed-form.s4s-modal-open:not(.s4s-long-form) .s4s-erp-form{grid-template-columns:1fr!important}}


/* Recruitment table: keep actions inline and preserve horizontal scrolling. */
body.s4s-recruitment-index #app .s4s-data-region,
body.s4s-recruitment-index #app .overflow-x-auto{
  overflow-x:auto!important;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
}
body.s4s-recruitment-index #app .s4s-data-region table{
  min-width:1040px!important;
}
body.s4s-recruitment-index #app table th:last-child,
body.s4s-recruitment-index #app table td:last-child{
  position:sticky;
  right:0;
  z-index:4;
  background:#fff;
  box-shadow:-8px 0 12px -12px rgba(15,55,95,.28);
}
body.s4s-recruitment-index #app table thead th:last-child{
  z-index:6;
  background:var(--ds-neutral-surface)!important;
}
body.s4s-recruitment-index #app table tbody tr:hover td:last-child{
  background:#f5faff!important;
}
body.s4s-recruitment-index #app .s4s-row-action-edit{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  margin:0!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  border:1px solid #b9d5f1!important;
  border-radius:10px!important;
  background:#eef6ff!important;
  color:#0755a5!important;
  font-size:0!important;
  line-height:1!important;
}
body.s4s-recruitment-index #app .s4s-row-action-edit:hover{
  border-color:#8ab9e6!important;
  background:#e2f0ff!important;
  color:#064987!important;
}
body.s4s-recruitment-index #app .s4s-row-action-edit .s4s-row-action-icon{
  width:17px!important;
  height:17px!important;
  flex:0 0 17px!important;
  margin:0!important;
}
body.s4s-recruitment-index #app .s4s-row-menu{display:none!important;}

@media(max-width:767px){
  body.s4s-recruitment-index #app .s4s-data-region.s4s-mobile-cards{
    overflow-x:auto!important;
    border:1px solid var(--ds-border)!important;
    background:var(--ds-card)!important;
  }
  body.s4s-recruitment-index #app .s4s-mobile-cards table{display:table!important;width:100%!important;min-width:1040px!important;}
  body.s4s-recruitment-index #app .s4s-mobile-cards thead{display:table-header-group!important;}
  body.s4s-recruitment-index #app .s4s-mobile-cards tbody{display:table-row-group!important;}
  body.s4s-recruitment-index #app .s4s-mobile-cards tr{display:table-row!important;padding:0!important;border:0!important;background:transparent!important;}
  body.s4s-recruitment-index #app .s4s-mobile-cards td{display:table-cell!important;width:auto!important;padding:12px 13px!important;border-bottom:1px solid var(--ds-border)!important;white-space:normal!important;}
  body.s4s-recruitment-index #app .s4s-mobile-cards td::before{display:none!important;}
  body.s4s-recruitment-index #app .s4s-row-actions-cell{display:table-cell!important;min-width:74px!important;text-align:right!important;}
}

/* SAFE4SIGN MOBILE PATCH 2026-09-10 */
@media(max-width:767px){
  html,body{max-width:100%;overflow-x:hidden}
  body.s4s-authenticated{min-width:0!important}
  body.s4s-authenticated>.s4s-page,
  body.s4s-authenticated>#app{width:100%!important;max-width:100%!important;min-width:0!important;margin-left:0!important;overflow-x:hidden}
  body.s4s-authenticated .s4s-page,
  body.s4s-authenticated .s4s-erp-page{width:100%!important;max-width:100%!important;min-width:0!important;padding:66px 10px 18px!important}
  body.s4s-authenticated #app,
  body.s4s-authenticated #app>div,
  body.s4s-authenticated #app main{min-width:0!important;max-width:100%!important}

  /* React/Tailwind HRMS pages: collapse desktop multi-column forms and cards. */
  body.s4s-authenticated #app .grid[class*="grid-cols-"],
  body.s4s-authenticated #app [class*="sm:grid-cols-"],
  body.s4s-authenticated #app [class*="md:grid-cols-"],
  body.s4s-authenticated #app [class*="lg:grid-cols-"],
  body.s4s-authenticated #app [class*="xl:grid-cols-"]{grid-template-columns:minmax(0,1fr)!important}
  body.s4s-authenticated #app [class*="min-w-["]{min-width:0!important}
  body.s4s-authenticated #app [class*="max-w-["]{max-width:100%!important}
  body.s4s-authenticated #app input:not([type="checkbox"]):not([type="radio"]),
  body.s4s-authenticated #app select,
  body.s4s-authenticated #app textarea{max-width:100%!important}
  body.s4s-authenticated #app .overflow-x-auto{max-width:100vw!important;-webkit-overflow-scrolling:touch}
  body.s4s-authenticated #app .rounded-xl,
  body.s4s-authenticated #app .rounded-2xl{max-width:100%;min-width:0}
  body.s4s-authenticated #app form .flex[class*="justify-between"],
  body.s4s-authenticated #app main>.flex[class*="justify-between"]{flex-wrap:wrap!important;gap:10px!important}

  /* Generic application chrome and controls. */
  .s4s-title-row{width:100%;gap:10px!important}
  .s4s-title-row>div:last-child{display:flex!important;width:100%!important;flex-wrap:wrap!important;gap:8px!important}
  .s4s-title-row .s4s-btn{flex:1 1 135px;justify-content:center}
  .s4s-card{max-width:100%;min-width:0}
  .s4s-table-wrap,.s4s-data-region{max-width:100%!important}
  .s4s-table-toolbar{gap:9px!important;padding:10px!important}
  .s4s-toolbar-left,.s4s-toolbar-right{display:flex!important;width:100%!important;max-width:100%;gap:7px!important}
  .s4s-toolbar-left>*{min-width:0}
  .s4s-search-wrap{flex:1 1 100%!important;width:100%!important}
  .s4s-table-search{width:100%!important}
  .s4s-table-select{flex:1 1 120px!important;min-width:0!important}
  .s4s-toolbar-right .s4s-tool-btn{flex:1 1 110px;justify-content:center}

  /* ERP: remove fixed widths/min-widths that caused horizontal overflow on phones. */
  body.s4s-app-erp .s4s-erp-hero{padding:15px!important}
  body.s4s-app-erp .s4s-erp-hero-actions{display:flex!important;width:100%;flex-wrap:wrap;gap:8px}
  body.s4s-app-erp .s4s-erp-hero-actions .s4s-btn{flex:1 1 135px;justify-content:center}
  body.s4s-app-erp .s4s-erp-kpi-grid,
  body.s4s-app-erp .s4s-erp-stats,
  body.s4s-app-erp .s4s-erp-quick-grid,
  body.s4s-app-erp .s4s-erp-form,
  body.s4s-app-erp .s4s-erp-profile-grid,
  body.s4s-app-erp .s4s-erp-two-col,
  body.s4s-app-erp .s4s-erp-report-filter,
  body.s4s-app-erp .s4s-partner-profile-grid,
  body.s4s-app-erp .s4s-form-grid,
  body.s4s-app-erp .s4s-partner-search-head,
  body.s4s-app-erp .s4s-report-summary-grid{grid-template-columns:minmax(0,1fr)!important}
  body.s4s-app-erp .s4s-erp-form .wide,
  body.s4s-app-erp .s4s-erp-form .full,
  body.s4s-app-erp .s4s-form-grid label.wide{grid-column:auto!important}
  body.s4s-app-erp .s4s-courier-form{min-width:0!important;width:100%!important;max-width:100%!important}
  body.s4s-app-erp .s4s-inline-filter{display:flex;flex-wrap:wrap;gap:8px}
  body.s4s-app-erp .s4s-inline-filter>*{flex:1 1 145px;min-width:0}
  body.s4s-app-erp .s4s-list-head{align-items:flex-start!important;flex-direction:column!important;gap:10px}
  body.s4s-app-erp .s4s-list-head>*{max-width:100%}
  body.s4s-app-erp .s4s-managed-form.s4s-modal-open,
  #app section.s4s-native-form-modal{overscroll-behavior:contain}

  /* Mobile cards remain readable even when values/IDs are long. */
  .s4s-mobile-cards tbody td{grid-template-columns:minmax(88px,34%) minmax(0,1fr)!important;gap:8px!important;overflow-wrap:anywhere}
  .s4s-mobile-cards tbody tr{max-width:100%;overflow:hidden}
}

@media(max-width:420px){
  body.s4s-authenticated .s4s-page,
  body.s4s-authenticated .s4s-erp-page{padding-left:8px!important;padding-right:8px!important}
  .s4s-authenticated>.s4s-topbar{width:min(88vw,272px)!important}
  .s4s-toolbar-right .s4s-tool-btn span{font-size:11px}
  .s4s-mobile-cards tbody td{grid-template-columns:1fr!important;gap:3px!important}
  .s4s-mobile-cards tbody td::before{margin-bottom:1px}
}


/* SAFE4SIGN UI PATCH 2026-09-12 */
body.s4s-authenticated .s4s-dashboard-content .s4s-stat:after{
  width:68px!important;
  height:68px!important;
  right:0!important;
  top:0!important;
}
.s4s-row-menu-popover.s4s-row-menu-portal{
  position:fixed!important;
  z-index:10080!important;
  display:grid!important;
  gap:2px!important;
  min-width:160px!important;
  padding:6px!important;
  border:1px solid var(--ds-border)!important;
  border-radius:12px!important;
  background:var(--ds-card)!important;
  box-shadow:0 18px 48px rgba(4,29,57,.20)!important;
}
.s4s-row-menu-popover.s4s-row-menu-portal .s4s-row-menu-item{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  width:100%!important;
  min-height:40px!important;
  padding:9px 10px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:var(--ds-text)!important;
  font:600 12px/18px 'Instrument Sans',sans-serif!important;
  text-align:left!important;
  cursor:pointer!important;
}
.s4s-row-menu-popover.s4s-row-menu-portal .s4s-row-menu-item:hover,
.s4s-row-menu-popover.s4s-row-menu-portal .s4s-row-menu-item:focus-visible{
  background:var(--ds-neutral-surface)!important;
  outline:none!important;
}
.s4s-row-menu-popover.s4s-row-menu-portal .s4s-row-menu-item.danger{color:var(--ds-danger-text)!important}
.s4s-row-menu-popover.s4s-row-menu-portal .s4s-row-menu-item.danger:hover{background:var(--ds-danger-surface)!important}
.s4s-row-menu-popover.s4s-row-menu-portal .s4s-row-action-icon{width:16px!important;height:16px!important;flex:none!important}
.s4s-employee-quick-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  width:100%!important;
  margin-top:-1px!important;
  overflow-x:auto!important;
  padding:1px 0 4px!important;
  scrollbar-width:thin;
}
.s4s-employee-quick-actions .s4s-tool-btn{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
@media(max-width:767px){
  .s4s-row-menu-popover.s4s-row-menu-portal.is-mobile{
    right:12px!important;
    left:12px!important;
    top:auto!important;
    bottom:calc(12px + env(safe-area-inset-bottom))!important;
    min-width:0!important;
    width:auto!important;
    padding:8px!important;
    border-radius:14px!important;
  }
  .s4s-row-menu-popover.s4s-row-menu-portal.is-mobile .s4s-row-menu-item{min-height:48px!important;font-size:14px!important}
  .s4s-employee-quick-actions{justify-content:flex-start!important;padding-bottom:6px!important}
  .s4s-table-toolbar .s4s-toolbar-left{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
  .s4s-table-toolbar .s4s-toolbar-right{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
  .s4s-table-toolbar .s4s-tool-btn{min-width:0!important;padding-inline:9px!important}
  body.s4s-authenticated .s4s-dashboard-content>.s4s-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat{min-height:112px!important;padding:14px!important}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat .value{font-size:22px!important}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat .label,
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat .value,
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat .hint{padding-right:34px!important}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat-icon{right:10px!important;top:10px!important;width:36px!important;height:36px!important}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat:after{width:56px!important;height:56px!important;right:0!important;top:0!important}
}
@media(max-width:390px){
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat{padding:12px!important}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat .value{font-size:20px!important}
  body.s4s-authenticated .s4s-dashboard-content .s4s-stat .hint{font-size:10px!important;line-height:14px!important}
}

/* Walk-in/B2C two-part workflow */
.s4s-walkin-delivery-form{margin-top:16px;padding-top:16px;border-top:1px solid #d9e5f0}.s4s-walkin-part{margin-bottom:18px}.s4s-walkin-subhead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid #d9e5f0;border-radius:10px;background:#f7fbff;color:#0b477f}.s4s-walkin-subhead small{color:#718197;font-weight:500}.s4s-walkin-note{padding:11px 12px;border:1px dashed #cdd9e5;border-radius:10px;background:#fafcff;color:#64748b}
@media(max-width:767px){.s4s-walkin-subhead{align-items:flex-start;flex-direction:column;gap:3px}.s4s-walkin-part .s4s-list-head{align-items:flex-start}.s4s-walkin-part .actions{display:flex;flex-wrap:wrap;gap:8px}.s4s-walkin-part .actions .s4s-btn{flex:1 1 150px;text-align:center}}