@import url('/employee-landscape-myhours-v4.css?v=20261013-landscape-myhours-4');
@import url('/employee-landscape-period-toggle-force.css?v=20261013-landscape-toggle-force-1');

.stafftime-app-card{padding:20px;border:1px solid #dfe5ed;border-radius:16px;background:#fff;color:#172033;margin:18px 0}.stafftime-app-card h3{margin:0 0 8px;font-size:18px}.stafftime-app-card p{font-size:13px;line-height:1.6;color:#667085}.stafftime-app-card>div{display:flex;flex-wrap:wrap;gap:10px}.stafftime-app-card button,#stafftimeUpdateNotice button{border:0;border-radius:10px;background:#1677f5;color:#fff;padding:12px 16px;font-weight:750;min-height:44px}.stafftime-app-card [data-refresh]{background:#edf4ff;color:#1459a5}#stafftimeUpdateNotice{position:fixed;z-index:20000;top:calc(12px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(430px,calc(100% - 24px));background:#172033;color:white;box-shadow:0 8px 30px #0004;padding:12px 16px;border-radius:14px;display:flex;align-items:center;gap:14px;font-size:13px}#stafftimeUpdateNotice span{flex:1}body.agency-dark .stafftime-app-card,body[data-admin-theme=dark] .stafftime-app-card,body[data-employee-theme=dark] .stafftime-app-card{background:#192637;color:#edf3ff;border-color:#344253}@media(max-width:600px){.stafftime-app-card{padding:16px}.stafftime-app-card>div>button{flex:1}}

#stafftimePullStatus{position:fixed;z-index:100300;top:calc(12px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);box-sizing:border-box;padding:12px 18px;border-radius:24px;background:#172033;color:#fff;box-shadow:0 4px 18px #0003;font-size:13px;font-weight:700;pointer-events:none}
#stafftimePullStatus[hidden]{display:none}
#stafftimePullStatus.refreshing{border:1px solid #75adff}

/* Employee My Hours: make the Week date navigator use the same compact visual language as Month. */
@media(max-width:700px){
html:root body[data-employee-theme="dark"][data-hgvera-suite="on"] #app main #week .week-page .week-head>.week-controls{
 display:grid!important;
 grid-template-columns:34px minmax(0,1fr) 34px!important;
 grid-template-rows:38px!important;
 align-items:center!important;
 justify-items:stretch!important;
 gap:6px!important;
 width:100%!important;
 max-width:100%!important;
 height:38px!important;
 min-height:38px!important;
 margin:12px 0 0!important;
 padding:0!important;
 box-sizing:border-box!important;
 position:static!important;
}
html:root body[data-employee-theme="dark"][data-hgvera-suite="on"] #app main #week .week-page .week-head>.week-controls>button{
 display:grid!important;
 place-items:center!important;
 width:34px!important;
 min-width:34px!important;
 max-width:34px!important;
 height:38px!important;
 min-height:38px!important;
 max-height:38px!important;
 margin:0!important;
 padding:0!important;
 box-sizing:border-box!important;
 position:static!important;
 transform:none!important;
 border:1px solid #344253!important;
 border-radius:10px!important;
 background:#142232!important;
 color:#edf3ff!important;
 box-shadow:none!important;
 font-size:22px!important;
 font-weight:600!important;
 line-height:1!important;
}
html:root body[data-employee-theme="dark"][data-hgvera-suite="on"] #app main #week .week-page .week-head>.week-controls>.week-date{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 width:100%!important;
 min-width:0!important;
 max-width:100%!important;
 height:38px!important;
 min-height:38px!important;
 max-height:38px!important;
 margin:0!important;
 padding:0!important;
 box-sizing:border-box!important;
 position:static!important;
 transform:none!important;
 overflow:hidden!important;
 border:1px solid #344253!important;
 border-radius:10px!important;
 background:#142232!important;
 color:#edf3ff!important;
 box-shadow:none!important;
}
html:root body[data-employee-theme="dark"][data-hgvera-suite="on"] #app main #week .week-page .week-head>.week-controls>.week-date>b{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;
 width:100%!important;
 min-width:0!important;
 max-width:100%!important;
 height:100%!important;
 min-height:0!important;
 margin:0!important;
 padding:0 8px!important;
 box-sizing:border-box!important;
 position:static!important;
 transform:none!important;
 border:0!important;
 border-radius:0!important;
 background:transparent!important;
 color:#edf3ff!important;
 box-shadow:none!important;
 font-size:13px!important;
 font-weight:700!important;
 line-height:1.2!important;
 white-space:nowrap!important;
 overflow:hidden!important;
 text-overflow:ellipsis!important;
}
}