/* Shared action geometry. Navigation, calendar cells and clickable cards retain their layout. */
:root{--action-border:#cbd8ea;--action-ink:#23466f;--action-surface:#fff;--action-hover:#eef5ff;--action-focus:#1469e8}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal,.employee-shell) :where(
  td button:not([role="option"]):not([data-clear]),footer>button,header>button,[class$="-actions"]>button,
  .rh-toolbar button,.concept-editor button:not([role="option"]):not([data-clear]),.personnel-actions button,
  button.primary,button.secondary,button[type="submit"],a.button,a.btn
){
  box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 auto!important;gap:8px!important;width:auto!important;min-width:40px!important;max-width:100%!important;
  height:auto!important;min-height:40px!important;padding:10px 14px!important;
  border-radius:9px!important;font-family:inherit!important;font-size:12px!important;font-weight:600!important;line-height:1.25!important;
  white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;text-wrap:pretty;
  text-align:center!important;text-indent:0!important;text-overflow:clip!important;overflow:visible!important;
  vertical-align:middle;cursor:pointer;box-shadow:none!important;transform:none!important;
}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal,.employee-shell) :where(td button:not([role="option"]):not([data-clear]),.concept-editor button:not([role="option"]):not([data-clear]),footer>button,header>button):not([class*="primary"]):not([class*="danger"]):not([class*="delete"]):not([type="submit"]):not([aria-pressed="true"]):not(.active){
  border:1px solid var(--action-border);background:var(--action-surface);color:var(--action-ink);
}
/* A text action may not inherit an icon-only width or wrap halfway through its caption. */
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) td :where(button,a.button,a.btn):not([role="option"]):not([data-clear]){
  min-width:max-content!important;max-width:none!important;white-space:nowrap!important;padding:9px 14px!important;min-height:38px!important;
}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) td:has(>button,>.personnel-actions,>.client-directory-actions){white-space:nowrap;padding-inline:14px!important}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) td button:not([role="option"]):not([data-clear])+button{margin-inline-start:6px}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) :where(footer,[class$="-actions"],.rh-toolbar):has(>button){gap:8px!important;align-items:center!important;flex-wrap:wrap!important}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) button>svg{flex-shrink:0!important;width:17px;height:17px}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) button>:where(span,b){overflow:visible;text-overflow:clip;word-break:normal}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) button:focus-visible{outline:2px solid var(--action-focus)!important;outline-offset:3px!important}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) button:disabled{cursor:not-allowed!important;opacity:.5!important;transform:none!important}
:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) :where(td button:not([role="option"]):not([data-clear]),footer>button,.concept-editor button:not([role="option"]):not([data-clear])):not(:disabled):not([class*="primary"]):not([class*="danger"]):hover{border-color:#90b5e6;background:var(--action-hover)}
html[data-theme="dark"],body.dark{--action-border:#455671;--action-ink:#e2edff;--action-surface:#1c293b;--action-hover:#293d59;--action-focus:#78aaff}
@media(pointer:coarse){:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) :where(td button:not([role="option"]):not([data-clear]),footer>button,header>button,[class$="-actions"]>button){min-height:44px!important;min-width:44px!important}}
@media(max-width:600px){:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) footer>button{flex:1 1 140px!important;margin-inline:0!important}}

:where(#appScreen .shell-main,.payroll-modal,[role="dialog"],dialog,.modal) table:has(td>button){table-layout:auto!important}
