/* Application-wide responsive and dialog hardening */
:root{
  --ik-safe-top:max(12px,env(safe-area-inset-top));
  --ik-safe-right:max(12px,env(safe-area-inset-right));
  --ik-safe-bottom:max(12px,env(safe-area-inset-bottom));
  --ik-safe-left:max(12px,env(safe-area-inset-left));
}
html{max-width:100%;overflow-x:hidden}
body{max-width:100%;overflow-x:hidden}
body.modal-open,body.ik-dialog-open,[class*="workspace-open"]{overflow:hidden!important;overscroll-behavior:none}
img,svg,video,canvas,iframe{max-width:100%}
input,select,textarea,button{max-width:100%;font:inherit}
textarea{resize:vertical}
.app-area,.dashboard,.module-page,.panel,.table-wrap,.dataTables_wrapper,.dt-container,.form-grid>*{min-width:0}
.table-wrap,.client-table-wrap,.portal-table-wrap,.workspace-table-wrap,.dataTables_scroll,.dataTables_scrollBody{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table,.client-table-wrap table,.portal-table-wrap table{width:100%}
.select2-container{max-width:100%!important}
.select2-dropdown{max-width:calc(100vw - 24px)}
.select2-results__option{overflow-wrap:anywhere}
.button,.row-action,.icon-button,.workflow-close,[class$="-close"]{touch-action:manipulation}
.button{white-space:normal;text-align:center}

/* Native application overlays */
.modal-backdrop,.enquiry-backdrop,.workflow-backdrop,
.client-workspace-backdrop,.project-workspace-backdrop,.support-workspace-backdrop,
.supplier-workspace-backdrop,.document-workspace-backdrop,.product-workspace-backdrop,
.employee-workspace-backdrop,.payroll-workspace-backdrop{
  padding:var(--ik-safe-top) var(--ik-safe-right) var(--ik-safe-bottom) var(--ik-safe-left);
  overflow:auto;
  overscroll-behavior:contain;
}
.modal-backdrop[hidden],.enquiry-backdrop[hidden],.workflow-backdrop[hidden],
.client-workspace-backdrop[hidden],.project-workspace-backdrop[hidden],.support-workspace-backdrop[hidden],
.supplier-workspace-backdrop[hidden],.document-workspace-backdrop[hidden],.product-workspace-backdrop[hidden],
.employee-workspace-backdrop[hidden],.payroll-workspace-backdrop[hidden]{display:none!important}
.login-modal,.enquiry-modal,.workflow-modal,.portal-payment-dialog,.portal-payment-modal,
.product-workflow-form,.receivables-wide,.administration-workflow{
  width:min(760px,100%);
  max-width:100%;
  max-height:calc(100dvh - var(--ik-safe-top) - var(--ik-safe-bottom));
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.client-workspace,.project-workspace,.support-workspace,.supplier-workspace,.document-workspace,
.product-workspace,.employee-workspace,.payroll-workspace{
  max-width:100%;
  max-height:calc(100dvh - var(--ik-safe-top) - var(--ik-safe-bottom));
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.workflow-form,.settings-form,.client-form,.project-form,.workspace-card form{min-width:0}
.workflow-form .form-grid,.settings-form .form-grid{min-width:0}
.workflow-actions,.settings-card-actions,.module-page-actions,.invoice-actions,.operations-command-actions{flex-wrap:wrap}
.popover{max-width:calc(100vw - 24px)}

/* Custom dialogs, confirmations, prompts and notices */
.ik-dialog-layer{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:var(--ik-safe-top) var(--ik-safe-right) var(--ik-safe-bottom) var(--ik-safe-left)}
.ik-dialog-layer[hidden]{display:none!important}
.ik-dialog-scrim{position:absolute;inset:0;background:rgba(2,14,28,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.ik-dialog{position:relative;z-index:1;width:min(500px,100%);max-height:calc(100dvh - var(--ik-safe-top) - var(--ik-safe-bottom));overflow:auto;background:var(--bg,#fff);color:var(--ink,#132238);border:1px solid var(--line,#dce3ec);border-radius:18px;box-shadow:0 30px 100px rgba(2,14,28,.32);padding:26px;display:grid;grid-template-columns:52px minmax(0,1fr);gap:0 16px;animation:ik-dialog-in .18s ease-out}
.ik-dialog-close{position:absolute;right:14px;top:14px;width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:var(--muted,#667085);display:grid;place-items:center;font-size:20px}
.ik-dialog-close:hover,.ik-dialog-close:focus-visible{background:var(--surface,#f4f7fb);color:var(--ink,#132238)}
.ik-dialog-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#eaf2ff;color:#0667f9;font-size:25px}
.ik-dialog[data-tone="danger"] .ik-dialog-icon{background:#fff0f0;color:#c43232}
.ik-dialog[data-tone="primary"] .ik-dialog-icon{background:#eaf8f1;color:#08764f}
.ik-dialog-copy{padding-right:26px;min-width:0}
.ik-dialog-eyebrow{margin:1px 0 5px;color:#0667f9;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.11em}
.ik-dialog-copy h2{margin:0;font:800 21px/1.25 Manrope,system-ui,sans-serif;overflow-wrap:anywhere}
.ik-dialog-copy>p:last-child{margin:9px 0 0;color:var(--muted,#667085);font-size:13px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.ik-dialog-input-wrap{grid-column:1/-1;margin-top:20px}
.ik-dialog-input-wrap label{display:block;margin-bottom:7px;font-size:12px;font-weight:800}
.ik-dialog-input-wrap textarea{display:block;width:100%;min-height:112px;border:1px solid var(--line,#dce3ec);border-radius:11px;background:var(--bg,#fff);color:var(--ink,#132238);padding:12px 13px;outline:none;line-height:1.5}
.ik-dialog-input-wrap textarea:focus{border-color:#0667f9;box-shadow:0 0 0 4px rgba(6,103,249,.12)}
.ik-dialog-input-help{display:block;margin-top:6px;color:var(--muted,#667085);font-size:10px}
.ik-dialog-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px;margin-top:24px}
.ik-dialog-actions.single .ik-dialog-button{min-width:120px}
.ik-dialog-button{min-height:42px;padding:0 17px;border-radius:10px;border:1px solid transparent;font-weight:800;font-size:12px;cursor:pointer}
.ik-dialog-button.secondary{border-color:var(--line,#dce3ec);background:var(--bg,#fff);color:var(--ink,#132238)}
.ik-dialog-button.primary{background:#0667f9;color:#fff}
.ik-dialog-button.danger{background:#c43232;color:#fff}
.ik-dialog-button:hover{filter:brightness(.97)}
.ik-dialog-button:focus-visible{outline:3px solid rgba(6,103,249,.24);outline-offset:2px}
.ik-toast-region{position:fixed;z-index:2147483100;right:var(--ik-safe-right);bottom:var(--ik-safe-bottom);width:min(390px,calc(100vw - var(--ik-safe-left) - var(--ik-safe-right)));display:grid;gap:10px;pointer-events:none}
.ik-toast{pointer-events:auto;display:grid;grid-template-columns:38px minmax(0,1fr) 30px;gap:11px;align-items:start;padding:13px 12px;border:1px solid var(--line,#dce3ec);border-radius:14px;background:var(--bg,#fff);color:var(--ink,#132238);box-shadow:0 20px 60px rgba(2,14,28,.2);animation:ik-toast-in .2s ease-out}
.ik-toast.leaving{opacity:0;transform:translateY(8px);transition:.18s ease}
.ik-toast-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#eaf2ff;color:#0667f9;font-size:19px}
.ik-toast[data-tone="success"] .ik-toast-icon{background:#eaf8f1;color:#08764f}
.ik-toast[data-tone="danger"] .ik-toast-icon{background:#fff0f0;color:#c43232}
.ik-toast b{display:block;font-size:12px;line-height:1.35}
.ik-toast p{margin:4px 0 0;color:var(--muted,#667085);font-size:11px;line-height:1.5;overflow-wrap:anywhere;white-space:pre-wrap}
.ik-toast>button{width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:var(--muted,#667085);display:grid;place-items:center}
.ik-toast>button:hover{background:var(--surface,#f4f7fb)}
@keyframes ik-dialog-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes ik-toast-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

@media(max-width:980px){
  .app-shell{min-width:0}
  .app-top{min-width:0}
  .top-actions{margin-left:auto}
  .dashboard{max-width:100%}
  .module-page-head{flex-wrap:wrap}
  .module-page-head>div{min-width:0}
  .workflow-modal{width:min(760px,100%)}
  .client-workspace,.project-workspace,.support-workspace,.supplier-workspace,.document-workspace,.product-workspace,.employee-workspace,.payroll-workspace{width:min(860px,100vw)}
}

@media(max-width:700px){
  :root{--ik-safe-top:max(8px,env(safe-area-inset-top));--ik-safe-right:max(8px,env(safe-area-inset-right));--ik-safe-bottom:max(8px,env(safe-area-inset-bottom));--ik-safe-left:max(8px,env(safe-area-inset-left))}
  input,select,textarea{font-size:16px!important}
  .app-top{position:sticky;top:0;z-index:50;min-height:64px;height:auto;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
  .company-select-label{order:2;flex:1 1 calc(100% - 56px);width:auto!important;max-width:none}
  .top-actions{order:1;margin-left:auto}
  .mobile-sidebar-trigger{order:1}
  .search{order:3;width:100%;max-width:none}
  .dashboard{padding:12px}
  .module-page,.panel{max-width:100%}
  .module-page-head{align-items:stretch}
  .module-page-head>.button,.module-page-head>.actions,.module-page-actions{width:100%}
  .module-page-actions,.module-page-head>.actions{display:grid;grid-template-columns:1fr}
  .module-page-actions .button,.module-page-head>.actions .button{width:100%;justify-content:center}
  .operations-toolbar,.sales-toolbar,.client-toolbar,.product-toolbar{width:100%}
  .workflow-backdrop{align-items:flex-end;place-items:end center}
  .modal-backdrop,.enquiry-backdrop{align-items:end;place-items:end center}
  .login-modal,.enquiry-modal,.workflow-modal,.portal-payment-dialog,.portal-payment-modal,.product-workflow-form,.receivables-wide,.administration-workflow{width:100%;max-width:100%;max-height:calc(100dvh - var(--ik-safe-top));border-radius:18px 18px 0 0;padding:22px 16px calc(18px + env(safe-area-inset-bottom))}
  .workflow-form .form-grid,.settings-form .form-grid,.client-form-grid,.project-billing-form>.client-form-grid{grid-template-columns:1fr!important}
  .workflow-actions,.settings-card-actions,.invoice-actions,.operations-command-actions{display:grid!important;grid-template-columns:1fr;width:100%}
  .workflow-actions .button,.settings-card-actions .button,.invoice-actions .button,.operations-command-actions .button{width:100%;justify-content:center}
  .client-workspace-backdrop,.project-workspace-backdrop,.support-workspace-backdrop,.supplier-workspace-backdrop,.document-workspace-backdrop,.product-workspace-backdrop,.employee-workspace-backdrop,.payroll-workspace-backdrop{padding:0;align-items:stretch}
  .client-workspace,.project-workspace,.support-workspace,.supplier-workspace,.document-workspace,.product-workspace,.employee-workspace,.payroll-workspace{width:100vw!important;max-width:100vw!important;height:100dvh;max-height:100dvh;border-radius:0!important;padding-bottom:env(safe-area-inset-bottom)}
  .workspace-hero,.client-workspace-hero,.project-workspace-hero,.support-workspace-hero,.supplier-workspace-hero,.document-workspace-hero,.product-workspace-hero{position:relative;padding-right:52px!important}
  .workspace-tabs,.client-workspace-tabs,.project-workspace-tabs,.support-workspace-tabs,.supplier-workspace-tabs,.document-workspace-tabs,.product-workspace-tabs{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  .popover{position:fixed!important;left:var(--ik-safe-left)!important;right:var(--ik-safe-right)!important;top:auto!important;bottom:var(--ik-safe-bottom)!important;width:auto!important;max-height:min(70dvh,560px);overflow:auto;border-radius:16px}
  .notification-menu{right:var(--ik-safe-right)!important}
  .ik-dialog-layer{align-items:end}
  .ik-dialog{width:100%;max-height:calc(100dvh - var(--ik-safe-top));border-radius:20px 20px 0 0;padding:22px 16px calc(18px + env(safe-area-inset-bottom));grid-template-columns:44px minmax(0,1fr);gap:0 12px}
  .ik-dialog-icon{width:44px;height:44px;border-radius:13px;font-size:21px}
  .ik-dialog-copy{padding-right:24px}
  .ik-dialog-copy h2{font-size:19px}
  .ik-dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .ik-dialog-actions.single{grid-template-columns:1fr}
  .ik-dialog-button{width:100%}
  .ik-toast-region{left:var(--ik-safe-left);right:var(--ik-safe-right);bottom:var(--ik-safe-bottom);width:auto}
  .ik-toast{grid-template-columns:34px minmax(0,1fr) 30px;padding:11px}
  .ik-toast-icon{width:34px;height:34px}
}

@media(max-width:430px){
  .dashboard{padding:10px}
  .app-top .profile-trigger{padding:4px}
  .app-top .notification-trigger{display:none}
  .company-select-label{flex-basis:calc(100% - 48px)}
  .workflow-modal,.login-modal,.enquiry-modal{padding-left:14px;padding-right:14px}
  .ik-dialog-actions{grid-template-columns:1fr}
  .ik-dialog-actions .secondary{order:2}
  .ik-dialog-copy h2{font-size:18px}
  .ik-dialog-copy>p:last-child{font-size:12px}
  .dataTables_wrapper .dt-layout-row{display:grid!important;grid-template-columns:1fr!important;gap:8px}
  .dataTables_wrapper .dt-layout-cell{width:100%!important}
}

@media(prefers-reduced-motion:reduce){
  .ik-dialog,.ik-toast{animation:none}
  .ik-toast.leaving{transition:none}
}
.ik-dialog-input-wrap select{display:block;width:100%;min-height:46px;border:1px solid var(--line,#dce3ec);border-radius:11px;background:var(--bg,#fff);color:var(--ink,#132238);padding:0 42px 0 13px;outline:none;font:inherit}.ik-dialog-input-wrap select:focus{border-color:#0667f9;box-shadow:0 0 0 4px rgba(6,103,249,.12)}

/* Custom-dialog validation and field recovery */
.ik-dialog-input-wrap.has-error textarea,.ik-dialog-input-wrap.has-error select{border-color:#d92d20!important;box-shadow:0 0 0 3px rgba(217,45,32,.12)!important}.ik-dialog-input-wrap.has-error .ik-dialog-input-help{color:#b42318;font-weight:700}.ik-field-invalid{outline:2px solid #d92d20!important;outline-offset:2px!important;box-shadow:0 0 0 4px rgba(217,45,32,.12)!important}.ik-field-invalid+.select2-container .select2-selection{border-color:#d92d20!important;box-shadow:0 0 0 3px rgba(217,45,32,.12)!important}
