/* V1452.163: Add/Edit Shift only. Matte, accessible earthy palette, scrollable mobile form. */
html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .shift-modal.er163-add-shift{
  --er163-ink:#173126;--er163-green:#2c5138;--er163-line:#d9ded3;
  background:#f8f7f2!important;border:1px solid #d0d8ce!important;border-radius:20px!important;
  display:flex!important;flex-direction:column!important;max-height:calc(100dvh - 32px)!important;height:auto!important;overflow:hidden!important;
  box-shadow:0 18px 55px #12241b30!important;
}
html body[data-modal-type="shift"] #modalHost .er163-add-shift *{box-sizing:border-box}
html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift .modal-head{
  flex-shrink:0!important;display:flex!important;align-items:center!important;background:linear-gradient(112deg,#23412d,#37553b)!important;
  color:#fff!important;padding:16px 22px!important;border:0!important;min-height:81px!important;
}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .modal-head h2{color:#fff!important;font-size:23px!important;font-weight:740!important;letter-spacing:-.035em!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1394-modal-subtitle{color:#e0e9dc!important;font-size:13px!important;line-height:1.4!important}
html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift .modal-body{
  flex:1 1 auto!important;max-height:none!important;min-height:0!important;padding:16px 18px 23px!important;overflow-y:auto!important;overscroll-behavior-y:contain!important;scrollbar-gutter:stable!important;background:#f8f7f2!important;
}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1367-main{display:flex!important;flex-direction:column!important;gap:12px!important;max-width:100%!important}
html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift .er1367-form-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:12px!important;width:100%!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1367-form-column{display:flex!important;flex-direction:column!important;gap:12px!important;min-width:0!important}
html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift :is(.er1367-client,.er1367-schedule,.er1367-staff,.er1370-instructions){
  padding:15px!important;margin:0!important;background:#fffefa!important;border:1px solid #e0e2d9!important;border-radius:14px!important;box-shadow:0 1px 4px #24392b08!important;min-width:0!important;
}
html body[data-modal-type="shift"] #modalHost .er163-add-shift :is(.er932-label span,.er1367-section-heading h3){color:#172e20!important;font:750 16px/1.3 system-ui,-apple-system,sans-serif!important;letter-spacing:-.016em!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift :is(.er962-client-copy b,.er932-team-row .names){color:#183225!important;font-size:16px!important;font-weight:740!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er962-client-copy small{font-size:12.5px!important;color:#506253!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er932-team-row{min-width:0!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-original-staff-picker{display:none!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-shell{display:flex;flex-direction:column;gap:11px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-heading{font:750 16px/1.3 system-ui!important;color:#1c3223}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-collapse{width:36px;height:36px;flex:none;display:grid;place-items:center;border:1px solid #d9dfd4;border-radius:10px;background:#f2f4ef;color:#26462e;font-size:25px;cursor:pointer}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-summary{min-width:0}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;min-width:0}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person{--er163-person:#5a8268;display:flex;align-items:center;gap:9px;min-width:0;padding:9px 10px;border-radius:10px;background:#f5f5f0;border-left:3px solid var(--er163-person);min-height:56px;color:#203329}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person-avatar{display:grid;place-items:center;flex:0 0 35px;width:35px;height:35px;border-radius:50%;background:var(--er163-person);color:white;font:750 11px/1 system-ui}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person-name{font:710 13px/1.2 system-ui;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person-hours{font:600 11.5px/1.1 system-ui;white-space:nowrap;color:#526056}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person-tick{display:grid;place-items:center;width:17px;height:17px;flex:none;background:#3c693e;color:white;border-radius:50%;font-size:11px;font-weight:800}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-summary.is-collapsed .er163-staff-grid{display:flex;gap:0;overflow-x:auto;scrollbar-width:thin;background:#f5f5ed;border:1px solid #e2e4dc;border-radius:12px;padding:8px 4px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed .er163-person{display:flex;flex:1 0 72px;max-width:110px;flex-direction:column;gap:4px;text-align:center;padding:3px 5px;background:transparent;border:0;border-right:1px solid #e2e2d9;border-radius:0;min-height:79px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed .er163-person:last-child{border:0}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed .er163-person-avatar{width:31px;height:31px;flex:0 0 31px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed .er163-person-name{max-width:100%;font-size:11.5px;flex:none}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed .er163-person-hours{font-size:10px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed .er163-person-tick{width:14px;height:14px;font-size:9px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-total{display:flex;flex-wrap:wrap;align-items:center;gap:7px 13px;background:#e7ebdf;border:1px solid #d5dfd1;color:#244532;border-radius:10px;padding:10px 12px;font:600 12px/1.3 system-ui}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-total button{margin-left:auto;background:transparent;color:#275139;font:750 12px system-ui;border:0;cursor:pointer;min-height:26px}
html body[data-modal-type="shift"] #modalHost .er163-add-shift :is(.er1016-employee-hours-card,.er932-hours,.er1370-settings .er1394-options-label){display:none!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1367-section-heading p{font-size:12px!important;color:#69776c!important;margin-top:3px!important}
html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift #m_notes{
  display:block!important;visibility:visible!important;overflow:auto!important;opacity:1!important;width:100%!important;min-height:155px!important;height:155px!important;max-height:none!important;padding:14px!important;border:1px solid #cdd8ce!important;border-radius:11px!important;background:#fff!important;color:#1c3828!important;font:450 15px/1.5 system-ui!important;resize:vertical!important;box-shadow:none!important;margin:12px 0 0!important;
}
html body[data-modal-type="shift"] #modalHost .er163-add-shift #m_notes::placeholder{color:#778277!important;opacity:1!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er934-notes-link{display:none!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-checklist{display:flex!important;align-items:center!important;justify-content:space-between!important;min-height:48px!important;margin-top:12px!important;border:1px solid #e3e5dc!important;border-radius:10px!important;background:#fdfcf7!important;padding:10px 14px!important;font-size:14px!important;font-weight:680!important;color:#223e2c!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-publishing{width:100%;background:#fffefa;border:1px solid #e1e4da;border-radius:13px;overflow:hidden}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-publishing>summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:53px;padding:14px 16px;background:#eaf0e4;color:#1f422c;font:740 15px/1.3 system-ui}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-publishing>summary::-webkit-details-marker{display:none}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-publishing[open]>summary span:last-child{transform:rotate(180deg)}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-publishing-body{padding:12px 14px 17px!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1370-settings{display:flex!important;flex-direction:column!important;gap:12px!important;margin:0!important;width:100%!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1367-publish-row{margin-top:12px!important}
html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift .modal-foot{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important;background:#fffefa!important;padding:13px 16px calc(13px + env(safe-area-inset-bottom))!important;min-height:72px!important;border-top:1px solid #e0e5dc!important;flex:0 0 auto!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .modal-foot .er163-original-save{display:none!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .modal-foot :is(.er932-foot-cancel,.er163-save-draft,.er163-publish-now){display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;min-width:0!important;min-height:46px!important;white-space:normal!important;padding:8px 6px!important;border-radius:9px!important;font:720 13px/1.15 system-ui!important;letter-spacing:0!important;box-shadow:none!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .modal-foot .er932-foot-cancel{background:#f7f4ee!important;color:#3c4a40!important;border:1px solid #cfd3c9!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .modal-foot .er163-save-draft{background:#e8ebdf!important;color:#28482e!important;border:1px solid #c7d1bf!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .modal-foot .er163-publish-now{background:#254a2f!important;color:white!important;border:1px solid #254a2f!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1337-start-finish-grid{gap:10px!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er932-field label{font-size:12px!important;color:#31483a!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift :is(#m_date,.er1322-time-face){min-height:44px!important;font-size:14px!important;border-radius:9px!important;background:#fff!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er1337-total-time{background:#eef1e8!important;border-radius:10px!important;margin-top:12px!important;color:#274631!important}
@media(max-width:760px){
 html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .shift-modal.er163-add-shift{width:100%!important;max-width:100%!important;height:100dvh!important;max-height:100dvh!important;margin:0!important;border-radius:0!important;border:0!important}
 html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift .modal-body{padding:13px 12px 34px!important}
 html body[data-modal-type="shift"] #modalHost .er163-add-shift :is(.er1367-client,.er1367-schedule,.er1367-staff,.er1370-instructions){padding:13px!important}
 html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person{padding:8px 8px;gap:6px}
 html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person-name{font-size:12.5px}
 html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person-hours{font-size:11px}
}
@media(max-width:345px){html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-grid{grid-template-columns:1fr}}
@media(min-width:761px){
 html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .shift-modal.er163-add-shift{width:min(920px,calc(100vw - 44px))!important;max-width:920px!important;height:min(890px,calc(100dvh - 44px))!important}
 html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift .modal-body{padding:18px 22px 25px!important}
 html body[data-modal-type="shift"] #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .er163-add-shift .er1367-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
 html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-person{padding:10px 10px}
 html body[data-modal-type="shift"] #modalHost .er163-add-shift #m_notes{min-height:180px!important;height:180px!important}
}
/* Accessible two-line employee cards: full first names stay legible on phones. */
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-summary.is-expanded .er163-person{display:grid!important;grid-template-columns:34px minmax(0,1fr) 18px!important;grid-template-rows:auto auto!important;column-gap:8px!important;row-gap:1px!important;min-height:66px!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-expanded .er163-person-avatar{grid-column:1;grid-row:1/3;align-self:center}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-expanded .er163-person-name{grid-column:2;grid-row:1;overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:break-word;font-size:13px!important;line-height:1.22!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-expanded .er163-person-hours{grid-column:2;grid-row:2;justify-self:start;font-size:11.5px!important;line-height:1.3!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-expanded .er163-person-tick{grid-column:3;grid-row:1/3;align-self:center}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-title-wrap{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-back{width:38px;height:38px;flex:none;display:grid;place-items:center;border:1px solid #54715a;background:#375e40;color:#fff;border-radius:9px;font-size:31px;line-height:1;cursor:pointer}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .modal-head .modal-x{flex:none!important;color:#fff!important;background:#ffffff22!important;border-color:#ffffff24!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-staff-summary.is-collapsed .er163-person{display:flex!important;grid-template-columns:none!important;grid-template-rows:none!important}
/* Six assigned staff remain visible together in collapsed mode, with a horizontal
   scroll only for larger teams where keeping readable names is more important. */
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed[data-count="6"] .er163-person,
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed[data-count="5"] .er163-person{flex:1 1 0!important;min-width:0!important;max-width:none!important;padding:3px 1px!important}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed[data-count="6"] .er163-person-name{font-size:10.5px!important;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .is-collapsed[data-count="6"] .er163-person-hours{font-size:9.6px!important;letter-spacing:-.03em}

/* On-site clock time is independent of total billable labour hours. */
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-on-site{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 0;padding:11px 14px;background:#edf2e8;border-radius:10px;color:#2c5237;font:690 13px/1.3 system-ui}
html body[data-modal-type="shift"] #modalHost .er163-add-shift .er163-on-site strong{font:780 13px/1.3 system-ui;white-space:nowrap}
/* Client picker and quick-add subviews inherit the refreshed Add Shift palette. */
html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1450-client-picker .modal-head,
html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1393-client-dialog .modal-head{background:linear-gradient(112deg,#24442e,#36543c)!important;color:#fff!important;border:0!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .modal-head h2,
html body #modalHost#modalHost .shift-modal.er1393-client-dialog .modal-head h2{color:#fff!important;font-weight:740!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .modal-x,
html body #modalHost#modalHost .shift-modal.er1393-client-dialog .modal-x{color:#fff!important;border:1px solid #ffffff3b!important;background:#ffffff20!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .modal-body,
html body #modalHost#modalHost .shift-modal.er1393-client-dialog .modal-body{background:#f8f7f2!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-results{display:flex!important;flex-direction:column!important;gap:9px!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row{min-height:68px!important;background:#f1f4ee!important;border:1px solid #e0e7da!important;border-radius:12px!important;padding:12px!important;box-shadow:none!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row:nth-child(4n+1){background:#eaf1e7!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row:nth-child(4n+2){background:#eaf0f5!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row:nth-child(4n+3){background:#f5eff6!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row:nth-child(4n){background:#f6ede9!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row.on{outline:2px solid #528363!important;outline-offset:-2px!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row .copy b{font-size:15px!important;color:#213c2b!important}
html body #modalHost#modalHost .shift-modal.er1450-client-picker .er932-client-row .copy small{font-size:12px!important;color:#53655b!important}
html body #modalHost#modalHost .shift-modal.er1393-client-dialog :is(.er1393-client-fields,.er1393-onboard){gap:14px!important}
html body #modalHost#modalHost .shift-modal.er1393-client-dialog :is(#qc_name,#qc_addr,#qc_contact,#qc_email,#qc_phone){min-height:46px!important;border-radius:9px!important;background:#fff!important;font-size:14px!important}
html body #modalHost#modalHost .shift-modal.er1393-client-dialog #qc_notes{min-height:120px!important;background:#fff!important;font-size:14px!important}
@media(max-width:760px){
 html body #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .shift-modal.er1450-client-picker,
 html body #modalHost#modalHost#modalHost#modalHost#modalHost#modalHost .shift-modal.er1393-client-dialog{height:100dvh!important;max-height:100dvh!important;width:100%!important;max-width:100%!important;margin:0!important;border-radius:0!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
 html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1450-client-picker .modal-body,
 html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1393-client-dialog .modal-body{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-y:auto!important;padding:18px 16px 25px!important}
 html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1450-client-picker .modal-head,
 html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1393-client-dialog .modal-head{flex-shrink:0!important;min-height:76px!important;padding:13px 16px!important}
 html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1450-client-picker .modal-foot,
 html body #modalHost#modalHost#modalHost#modalHost .shift-modal.er1393-client-dialog .modal-foot{flex-shrink:0!important;background:#fffefa!important;border-top:1px solid #dae2d6!important;padding:13px 16px calc(13px + env(safe-area-inset-bottom))!important}
}

/* V1452.164 — faithful reference details: iconography, input chrome, proportion. */
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-ico{display:inline-block!important;width:20px!important;height:20px!important;flex:0 0 20px;vertical-align:middle;stroke:currentColor!important;fill:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-back .er164-ico,
html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-x .er164-ico{width:22px!important;height:22px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-head{background:linear-gradient(116deg,#25422d 0%,#364d38 48%,#273f2e 100%)!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-head .er163-back{background:#3c6136!important;border:1px solid #52714b!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-head .modal-x{background:#ffffff21!important;color:white!important;border-color:#ffffff35!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-label{display:flex!important;align-items:center!important;gap:10px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-label>.er164-ico{color:#45653e!important;width:22px!important;height:22px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-add-client-link{display:inline-flex!important;align-items:center!important;gap:4px!important;background:#edf1e8!important;border:1px solid #e2e6dc!important;border-radius:9px!important;padding:6px 10px!important;min-height:34px!important;color:#1b3525!important;font-weight:650!important;text-decoration:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-add-client-link .er164-ico{width:16px!important;height:16px!important;flex-basis:16px}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er962-client-trigger{min-height:64px!important;background:#f1f0eb!important;border:0!important;border-radius:12px!important;padding:10px 12px!important;gap:12px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-client-badge{display:grid;place-items:center;flex:none;width:46px;height:46px;background:linear-gradient(138deg,#61795a,#36513d);color:#fff;border-radius:12px}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-client-badge .er164-ico{width:26px!important;height:26px!important;flex-basis:26px}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er962-client-trigger .edit{font-size:0!important;color:#1b3525!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er962-client-trigger .edit .er164-ico{width:19px!important;height:19px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control{display:block!important;position:relative!important;min-width:0}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control>.er164-ico{position:absolute;top:50%;transform:translateY(-50%);pointer-events:none;z-index:3;color:#243b30!important;width:19px!important;height:19px!important;}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control>.er164-control-leading{left:13px}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control>.er164-control-trailing{right:12px;width:16px!important;height:16px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design :is(.er164-date-wrap input,#m_start-display,#m_end-display){width:100%!important;min-height:44px!important;height:44px!important;padding:7px 38px 7px 42px!important;background:#fffefa!important;border:1px solid #dadcd5!important;border-radius:9px!important;color:#1d2c23!important;font-weight:640!important;font-size:14px!important;text-align:left!important;appearance:none!important;box-shadow:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-date-wrap input::-webkit-calendar-picker-indicator{opacity:0;position:absolute;inset:0;width:100%;height:100%;cursor:pointer}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-onsite{background:#eef2e8!important;border:0!important;border-radius:10px!important;padding:10px 13px!important;min-height:42px!important;margin-top:9px!important;display:flex!important;align-items:center!important;justify-content:space-between!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-onsite>span{display:inline-flex!important;align-items:center!important;gap:9px!important;color:#27432f!important;font-weight:640!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-onsite .er164-ico{color:#2a6535!important;width:21px!important;height:21px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-onsite strong{color:#1c3829!important;font-weight:790!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-heading{display:flex!important;align-items:center!important;gap:9px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-heading>.er164-ico{color:#476b41!important;width:22px!important;height:22px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-collapse{background:transparent!important;border:0!important;width:33px!important;height:33px!important;padding:5px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-collapse .er164-ico{width:22px!important;height:22px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person{background:#f4f3ef!important;border-left-width:3px!important;border-radius:10px!important;min-height:53px!important;gap:9px!important;padding:7px 9px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person-avatar{width:36px!important;height:36px!important;flex-basis:36px!important;font-weight:730!important;font-size:12px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person-name{font-weight:740!important;font-size:13px!important;letter-spacing:-.01em!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person-tick{width:20px!important;height:20px!important;border-radius:50%!important;background:#34643c!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person-tick .er164-ico{width:13px!important;height:13px!important;flex-basis:13px}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total{display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:wrap!important;background:linear-gradient(110deg,#415c43,#314f3a)!important;color:#fff!important;gap:10px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total>span{display:flex!important;align-items:center!important;gap:5px!important;color:#fff!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total button{display:inline-flex!important;align-items:center!important;gap:4px!important;margin-left:auto!important;color:#fff!important;text-decoration:underline!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total .er164-ico{width:17px!important;height:17px!important;flex-basis:17px}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .is-collapsed+.er163-staff-total{display:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .is-collapsed .er163-person-avatar{width:31px!important;height:31px!important;flex-basis:31px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .is-collapsed .er163-person-tick{width:16px!important;height:16px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .is-collapsed .er163-person-tick .er164-ico{width:11px!important;height:11px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-section-heading{display:grid!important;grid-template-columns:25px minmax(0,1fr)!important;grid-template-rows:auto auto!important;column-gap:10px!important;align-items:center!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-section-heading>.er164-ico{grid-row:1/3;color:#456c44!important;width:23px!important;height:23px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-section-heading h3{grid-column:2!important;margin:0!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-section-heading p{grid-column:2!important;margin:2px 0 0!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-checklist{display:flex!important;justify-content:flex-start!important;gap:10px!important;background:#fffefa!important;min-height:44px!important;margin-top:0!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-checklist>.er164-ico:first-child{color:#41663c!important;width:21px!important;height:21px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-checklist>.er164-checklist-chevron{margin-left:auto!important;width:18px!important;height:18px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-publishing>summary{background:#edf2e8!important;gap:10px!important;min-height:48px!important;color:#24472e!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-publishing>summary>span{display:inline-flex!important;align-items:center!important;gap:10px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-publishing>summary .er164-ico{color:#3f643c!important;width:20px!important;height:20px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-publishing-arrow{margin-left:auto!important;transition:transform .2s ease}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-publishing[open] .er164-publishing-arrow{transform:rotate(90deg)}
html body[data-modal-type="shift"] #modalHost .er164-approved-design #m_notes{min-height:165px!important;height:165px!important;padding:13px!important;border-radius:10px!important;background:#fffefa!important}
/* Mobile follows the provided reference: one vertical column and generous textarea. */
@media(max-width:760px){
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-head{padding:11px 15px!important;min-height:74px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-body{padding:12px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-form-grid{grid-template-columns:1fr!important;gap:10px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design :is(.er1367-client,.er1367-schedule,.er1367-staff,.er1370-instructions){padding:11px 12px!important;border-radius:13px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-grid{gap:7px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person{gap:6px!important;padding:7px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total{padding:9px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design #m_notes{min-height:165px!important;height:165px!important}
}
@media(max-width:350px){
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person-name{font-size:12px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person-hours{font-size:10.5px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total{font-size:11px!important}
}

/* V1452.164 compact staff refinement — match the supplied thin, readable staff chips. */
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-label,
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-label span,
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-field label{
 text-transform:none!important; letter-spacing:-.015em!important; font-size:14px!important;font-weight:720!important;color:#172d20!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er932-field label{font-size:12px!important;font-weight:590!important;letter-spacing:0!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1394-kicker,
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1372-eyebrow,
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1394-eyebrow{display:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-title-wrap{gap:1px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control{position:relative!important;display:block!important;min-width:0!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control .er164-control-leading{position:absolute!important;left:11px!important;top:50%!important;transform:translateY(-50%)!important;z-index:3!important;width:18px!important;height:18px!important;color:#2b4935!important;pointer-events:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control .er164-control-trailing{position:absolute!important;right:10px!important;top:50%!important;transform:translateY(-50%)!important;z-index:3!important;width:16px!important;height:16px!important;color:#24462f!important;pointer-events:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-date-wrap input,
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1322-time-wrap .er1322-time-face{padding-left:40px!important;padding-right:33px!important;min-width:0!important;width:100%!important;font-size:14px!important;font-weight:690!important;letter-spacing:0!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-date-wrap input::-webkit-calendar-picker-indicator{opacity:0!important;width:0!important;position:absolute!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1337-start-finish-grid{row-gap:8px!important;column-gap:9px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design :is(#m_date,.er1322-time-face){min-height:40px!important;height:40px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-onsite{padding:6px 9px!important;min-height:36px!important;margin-top:9px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-onsite span{font-size:12px!important;display:flex!important;align-items:center!important;gap:7px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-onsite strong{font-size:12px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-staff .er163-staff-shell{gap:7px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-staff .er163-staff-grid{gap:6px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person{
 display:flex!important;align-items:center!important;min-height:48px!important;height:48px!important;
 padding:6px 7px!important;gap:5px!important;grid-template-columns:none!important;grid-template-rows:none!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-avatar{
 display:grid!important;place-items:center!important;width:30px!important;height:30px!important;flex:0 0 30px!important;
 grid-column:auto!important;grid-row:auto!important;font-size:10.5px!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-name{
 grid-column:auto!important;grid-row:auto!important;font-size:12.5px!important;flex:1 1 auto!important;
 white-space:nowrap!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-hours{
 grid-column:auto!important;grid-row:auto!important;font-size:10.6px!important;flex:0 0 auto!important;white-space:nowrap!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-tick{
 grid-column:auto!important;grid-row:auto!important;align-self:center!important;width:17px!important;height:17px!important;flex:0 0 17px!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total{
 flex-wrap:nowrap!important;gap:7px!important;font-size:10.8px!important;min-height:35px!important;
 padding:7px 9px!important;white-space:nowrap!important;border-radius:9px!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total>span{min-width:0!important;flex-shrink:1!important;gap:3px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total .er164-ico{width:14px!important;height:14px!important;flex-basis:14px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total button{flex:0 0 auto!important;font-size:11px!important;min-height:24px!important;padding:0!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-collapsed .er163-staff-grid{
 padding:6px 3px!important;min-height:84px!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .is-collapsed .er163-person{
 min-height:71px!important;gap:3px!important;padding:2px 1px!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .is-collapsed .er163-person-name{font-size:10.8px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .is-collapsed .er163-person-hours{font-size:10px!important}
/* Keep the instructions genuinely roomy; reduce the chrome around it, not its usable writing area. */
html body[data-modal-type="shift"] #modalHost .er164-approved-design #m_notes{height:160px!important;min-height:160px!important;font-size:14px!important;line-height:1.5!important}
@media(max-width:760px){
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-head{min-height:68px!important;padding:8px 12px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-body{padding:10px 11px 18px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design :is(.er1367-client,.er1367-schedule,.er1367-staff,.er1370-instructions){padding:10px 11px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1367-form-column{gap:9px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-person-name{letter-spacing:-.015em!important}
}
@media(max-width:355px){
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person{display:grid!important;grid-template-columns:28px minmax(0,1fr) 16px!important;grid-template-rows:auto auto!important;height:53px!important;min-height:53px!important;row-gap:0!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-avatar{grid-column:1!important;grid-row:1/3!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-name{grid-column:2!important;grid-row:1!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-hours{grid-column:2!important;grid-row:2!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-tick{grid-column:3!important;grid-row:1/3!important}
}

/* Fix the native date control overlap without sacrificing native calendar selection. */
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-date-wrap{height:40px!important;display:flex!important;align-items:center!important;border:1px solid #d1d6cb!important;border-radius:9px!important;background:#fff!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-date-wrap #m_date{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;cursor:pointer!important;z-index:5!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-date-text{pointer-events:none!important;font-size:14px!important;line-height:1.1!important;font-weight:710!important;color:#1e2f25!important;padding-left:40px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er164-control{width:100%!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .modal-head h2::before{display:none!important;content:none!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person{
 display:grid!important;grid-template-columns:30px minmax(0,1fr) 17px!important;grid-template-rows:17px 15px!important;
 min-height:53px!important;height:53px!important;column-gap:6px!important;row-gap:0!important;
 padding:9px 7px!important;align-items:center!important;
}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-avatar{grid-column:1!important;grid-row:1/3!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-name{grid-column:2!important;grid-row:1!important;font-size:12.8px!important;line-height:16px!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-hours{grid-column:2!important;grid-row:2!important;font-size:10.7px!important;line-height:14px!important}
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-tick{grid-column:3!important;grid-row:1/3!important}
/* Keep staff readable with six selected; compact is not tiny. */
@media(max-width:350px){html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person{min-height:53px!important;height:53px!important}}
/* Preserve the reference order on desktop and phone. */
html body[data-modal-type="shift"] #modalHost .er164-approved-design .er1370-job-details.er163-checklist{order:5!important}
@media(max-width:355px){
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-staff-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person{grid-template-columns:27px minmax(0,1fr) 15px!important;column-gap:4px!important;padding:7px 5px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-avatar{width:27px!important;height:27px!important;flex-basis:27px!important;font-size:10px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-name{font-size:11.8px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-summary.is-expanded .er163-person-tick{width:15px!important;height:15px!important;flex-basis:15px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total{font-size:9.5px!important;gap:4px!important;padding:7px 6px!important}
 html body[data-modal-type="shift"] #modalHost .er164-approved-design .er163-staff-total .er164-ico{width:12px!important;height:12px!important;flex-basis:12px!important}
}
