/* V1452.177 — employee selector only. Aligned to approved reference.
   Existing employee search, availability calculation, selection and allocation
   actions continue to be provided by EarthRoster's real shift modal renderer. */
@media (max-width:760px) {
  html body[data-modal-type="shift"] #modalHost .shift-modal.er173-staff {
    box-sizing:border-box!important;min-height:0!important;height:100dvh!important;
    overflow:hidden!important;display:flex!important;flex-direction:column!important;
    background:#fbfaf7!important;overscroll-behavior:none!important;
  }
  html body[data-modal-type="shift"] #modalHost .shift-modal.er173-staff .modal-head {
    flex:none!important;position:relative!important;width:100%!important;box-sizing:border-box!important;
    padding:calc(12px + env(safe-area-inset-top, 0px)) 15px 12px!important;
    min-height:calc(61px + env(safe-area-inset-top, 0px))!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    background:linear-gradient(105deg,#28472b,#365833)!important;gap:11px!important;
  }
  html body[data-modal-type="shift"] #modalHost .shift-modal.er173-staff .modal-head h2 {
    color:#fff!important;font-size:clamp(18px,5vw,22px)!important;line-height:1.2!important;
    font-weight:750!important;letter-spacing:-.02em!important;flex:1 1 auto!important;
    margin:0!important;text-align:left!important;
  }
  html body[data-modal-type="shift"] #modalHost .shift-modal.er173-staff .modal-head .er176-panel-back,
  html body[data-modal-type="shift"] #modalHost .shift-modal.er173-staff .modal-head .modal-x {
    position:relative!important;inset:auto!important;flex:none!important;
    width:40px!important;height:40px!important;min-height:40px!important;min-width:40px!important;
    display:grid!important;place-items:center!important;border:0!important;
    border-radius:11px!important;background:rgba(255,255,255,.12)!important;color:#fff!important;
    pointer-events:auto!important;touch-action:manipulation!important;transform:none!important;
  }
  html body[data-modal-type="shift"] #modalHost .shift-modal.er173-staff .modal-body {
    display:flex!important;flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;
    overflow-x:hidden!important;overscroll-behavior-y:contain!important;
    padding:16px 13px 20px!important;background:#fbfaf7!important;
    scrollbar-width:thin!important;overflow-anchor:none!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-panel.er962-staff-picker {
    display:flex!important;flex-direction:column!important;gap:16px!important;
    padding:0!important;width:100%!important;max-width:100%!important;min-width:0!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-searchbox {
    display:flex!important;align-items:center!important;position:sticky!important;top:0!important;z-index:4!important;
    height:48px!important;min-height:48px!important;padding:0 13px!important;
    border-radius:12px!important;border:1px solid #d5dacd!important;
    background:#fff!important;box-shadow:0 2px 8px rgba(18,45,26,.04)!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-searchbox input {
    height:42px!important;font-size:14px!important;line-height:1.3!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-list {
    box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;
    display:flex!important;flex-direction:column!important;gap:5px!important;
    padding:9px!important;margin:0!important;border:1px solid #e0e4d9!important;
    border-radius:16px!important;background:#fffefa!important;
    min-height:0!important;max-height:none!important;overflow:visible!important;
    box-shadow:0 4px 17px rgba(32,64,39,.045)!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-row.er173-staff-row {
    box-sizing:border-box!important;width:100%!important;min-width:0!important;
    display:flex!important;flex-flow:row nowrap!important;align-items:center!important;gap:8px!important;
    min-height:67px!important;padding:9px!important;
    border:1px solid transparent!important;border-radius:12px!important;
    background:#fffefa!important;box-shadow:none!important;
    transition:background-color .14s ease,border-color .14s ease!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-row.er173-staff-row.on {
    background:#edf3e4!important;border-color:#d8e6cc!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er1018-staff-select {
    display:flex!important;align-items:center!important;flex:1 1 auto!important;min-width:0!important;
    gap:9px!important;padding:0!important;border:0!important;background:none!important;
    box-shadow:none!important;text-align:left!important;min-height:48px!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-check {
    flex:0 0 23px!important;width:23px!important;height:23px!important;
    border-radius:6px!important;border:1.6px solid #9fa9a0!important;
    background:#fff!important;display:grid!important;place-items:center!important;
    color:transparent!important;font-size:16px!important;font-weight:800!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-row.on .er932-check {
    background:#2f6939!important;border-color:#2f6939!important;color:#fff!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-av {
    flex:0 0 44px!important;width:44px!important;height:44px!important;
    border-radius:11px!important;display:grid!important;place-items:center!important;
    color:#fff!important;background:var(--er173-accent,#466d55)!important;
    font:750 14px/1 system-ui,-apple-system,sans-serif!important;
    letter-spacing:.02em!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-copy {
    display:block!important;flex:1 1 auto!important;min-width:0!important;overflow:hidden!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-copy b {
    display:block!important;min-width:0!important;max-width:100%!important;
    overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
    color:#1d2a21!important;font:710 clamp(12px,3.55vw,14px)/1.2 system-ui,-apple-system,sans-serif!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er173-availability {
    box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
    gap:4px!important;flex:0 0 auto!important;min-width:0!important;
    border-radius:999px!important;padding:6px 8px!important;white-space:nowrap!important;
    color:#285b2d!important;background:#e3f2da!important;
    font:750 10px/1.1 system-ui,-apple-system,sans-serif!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er173-availability.er173-unavailable {
    background:#f9e7e5!important;color:#8b3630!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er173-availability.er173-busy {
    background:#fff0d6!important;color:#895b17!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er173-availability.er173-unknown {
    background:#edf1ee!important;color:#55645b!important;
  }
  /* Normal equal allocation is calculated in the main shift form. Keep the
     numeric editor accessible whenever the administrator uses custom hours. */
  html body[data-modal-type="shift"] #modalHost .er173-staff .er962-staff-picker:has(#m_split_mode[value="equal"]) .er1018-hours-editor {
    display:none!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .er1018-hours-editor {
    flex:0 0 40px!important;width:40px!important;margin:0!important;
  }
  html body[data-modal-type="shift"] #modalHost .shift-modal.er173-staff .modal-foot {
    position:relative!important;inset:auto!important;flex:0 0 auto!important;
    box-sizing:border-box!important;padding:11px 15px calc(14px + env(safe-area-inset-bottom,0px))!important;
    background:#fffefa!important;border-top:1px solid #e2e7dd!important;
    display:flex!important;min-height:65px!important;align-items:center!important;
  }
  html body[data-modal-type="shift"] #modalHost .er173-staff .modal-foot .er932-foot-save {
    width:100%!important;height:46px!important;min-height:46px!important;
    background:#285b34!important;border-radius:10px!important;color:#fff!important;
    font:750 15px/1 system-ui,-apple-system,sans-serif!important;
  }
}
@media(max-width:355px){
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-row.er173-staff-row{gap:6px!important;padding:7px!important;min-height:64px!important}
  html body[data-modal-type="shift"] #modalHost .er173-staff .er932-staff-av{width:39px!important;height:39px!important;flex-basis:39px!important}
  html body[data-modal-type="shift"] #modalHost .er173-staff .er173-availability{padding:5px 6px!important;font-size:9px!important}
}
/* The app's older mobile interface has important declarations inside
   @layer er-earth. Override them within that same layer rather than relying
   on order outside the layer. */
@layer er-earth {
 @media(max-width:760px) {
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er1023-staff-legend {display:none!important;}
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er932-staff-list {
    display:flex!important;flex-direction:column!important;gap:5px!important;padding:9px!important;
    background:#fffefa!important;border:1px solid #e0e4d9!important;border-radius:16px!important;
    min-height:0!important;max-height:none!important;overflow:visible!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er1018-staff-row {
    box-sizing:border-box!important;display:flex!important;flex-direction:row!important;align-items:center!important;
    gap:8px!important;min-height:67px!important;height:auto!important;margin:0!important;
    padding:9px!important;border:1px solid transparent!important;border-radius:12px!important;
    background:#fffefa!important;box-shadow:none!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er1018-staff-row.on {
    background:#edf3e4!important;border-color:#d8e6cc!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er1018-staff-select {
    display:flex!important;flex-direction:row!important;align-items:center!important;gap:9px!important;
    flex:1 1 auto!important;grid-column:auto!important;grid-row:auto!important;
    width:auto!important;min-width:0!important;min-height:45px!important;padding:0!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er932-staff-av {
    width:44px!important;height:44px!important;min-width:44px!important;flex:0 0 44px!important;
    border-radius:11px!important;font-size:14px!important;
    color:#fff!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er932-check {
    width:23px!important;height:23px!important;min-width:23px!important;flex:0 0 23px!important;
    border-radius:6px!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er932-staff-copy b {
    font-size:14px!important;line-height:1.2!important;font-weight:720!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er1018-hours-editor {
    grid-column:auto!important;grid-row:auto!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er962-staff-picker:has(#m_split_mode[value="equal"]) .er1018-hours-editor {
    display:none!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .modal-foot {
    display:flex!important;align-items:center!important;padding:11px 15px calc(14px + env(safe-area-inset-bottom,0px))!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .modal-foot .er932-foot-save {
    width:100%!important;flex:1 1 100%!important;min-height:46px!important;height:46px!important;
    background:#285b34!important;border-radius:10px!important;
    color:#fff!important;font-size:15px!important;
  }
 }
 @media(max-width:355px) {
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er932-staff-av {
    width:39px!important;height:39px!important;min-width:39px!important;flex-basis:39px!important;
  }
  html.er-earth body[data-modal-type=shift] #modalHost#modalHost .er14508-staff-dialog .er932-staff-copy b {font-size:12px!important;}
 }
}
