/* Office-only: chauffeur layout stays on its 25 October rules. */

@layer mobileViewport {
@media screen and (max-width:900px){html:has(#admin:not(.hidden)),:root:has(#admin:not(.hidden)) body{width:100%!important;min-width:0!important;margin:0!important;box-sizing:border-box!important}:root:has(#admin:not(.hidden)) #admin:not(.hidden),:root:has(#admin:not(.hidden)) #driver:not(.hidden){width:100%!important;max-width:100%!important;min-width:0!important;min-height:100dvh!important;height:auto!important;margin:0!important;padding:8px!important;box-sizing:border-box!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) *{box-sizing:border-box!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(.field,label,.grid,.card,.entryCard,.overviewCard,form){min-width:0!important;max-width:100%!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){min-width:0!important;max-width:100%!important;width:100%!important;font-size:16px!important;box-sizing:border-box!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(input:not([type=checkbox]):not([type=radio]),select){min-height:44px!important;height:44px!important;padding:6px 8px!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) textarea{height:auto!important;min-height:88px!important;max-height:35dvh!important;resize:vertical!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) button{min-width:0!important;max-width:100%!important;min-height:44px!important;height:auto!important;aspect-ratio:auto!important;padding:8px 10px!important;font-size:14px!important;line-height:1.25!important;white-space:normal!important;overflow-wrap:anywhere!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(.actions,.rotActions,.rotRemarkActions){display:flex!important;align-items:center!important;gap:6px!important;flex-wrap:wrap!important;width:100%!important;height:auto!important;min-height:0!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(.actions,.rotActions,.rotRemarkActions)>button{flex:1 1 80px!important;width:auto!important;max-height:none!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(.grid,.rotGrid){grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))!important;gap:8px!important}:root:has(#admin:not(.hidden)) #admin>.top{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;min-height:0!important;margin:0!important;padding:10px!important;display:flex!important;flex-wrap:wrap!important;gap:8px!important}:root:has(#admin:not(.hidden)) #admin>.top .right{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important;width:100%!important;min-width:0!important}:root:has(#admin:not(.hidden)) #admin>.top .right button{width:100%!important;font-size:12px!important;min-height:36px!important;padding:6px!important;white-space:nowrap!important;overflow-wrap:normal!important}:root:has(#admin:not(.hidden)) #proposalPageTitle{width:100%!important;margin:0!important;font-size:20px!important}:root:has(#admin:not(.hidden)) #admin>.tab.active{width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important}:root:has(#admin:not(.hidden)) #admin #officeHome.active{display:flex!important;flex-direction:column!important;gap:8px!important;height:auto!important;min-height:calc(100dvh - 160px)!important;flex:1 1 auto!important}:root:has(#admin:not(.hidden)) #officeHome :is(.homeDriverSummary,.driverHubSummary){padding:0!important;margin:0!important;width:100%!important;min-height:0!important;flex:0 0 auto!important;border:0!important}:root:has(#admin:not(.hidden)) #officeHome .driverHubStats{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:6px!important}:root:has(#admin:not(.hidden)) #officeHome .driverHubStats>*{grid-column:span 2!important;width:100%!important;height:auto!important;min-height:66px!important;padding:6px!important;font-size:11px!important}:root:has(#admin:not(.hidden)) #officeHome .driverHubStats>:nth-last-child(-n+2){grid-column:span 3!important}:root:has(#admin:not(.hidden)) #officeHome .driverHubStats b{font-size:22px!important}:root:has(#admin:not(.hidden)) #officeHome .mobileAdminNotices{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;width:100%!important}:root:has(#admin:not(.hidden)) #officeHome .driverHubNames{display:grid!important;grid-template-columns:1fr!important;width:100%!important;font-size:12px!important}:root:has(#admin:not(.hidden)) #officeHomePrimary{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-rows:minmax(58px,1fr)!important;gap:8px!important;width:100%!important;min-width:0!important;min-height:0!important;height:auto!important;flex:1 1 auto!important;margin:0!important;padding:0!important}:root:has(#admin:not(.hidden)) #officeHomePrimary>button{width:100%!important;height:100%!important;min-height:58px!important;grid-column:auto!important;padding:8px!important}:root:has(#admin:not(.hidden)) #officeHomePrimary>.portalHelpOpen{grid-column:1/-1!important}:root:has(#admin:not(.hidden)) #officeHomePrimary>.homeFundingRow{grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;min-width:0!important;min-height:58px!important;height:auto!important}:root:has(#admin:not(.hidden)) #officeHomePrimary>.homeFundingRow>button{width:100%!important;height:100%!important;min-height:58px!important;flex:none!important;font-size:13px!important}:root:has(#admin:not(.hidden)) dialog[open]{position:fixed!important;inset:0!important;margin:0!important;width:100%!important;max-width:100%!important;min-width:0!important;height:100dvh!important;max-height:100dvh!important;padding:10px!important;border-radius:0!important;overflow:auto!important}:root:has(#admin:not(.hidden)) dialog[open]>header{position:sticky!important;top:0!important;inset-inline:auto!important;display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:nowrap!important;width:100%!important;min-height:52px!important;height:auto!important;margin:0 0 8px!important;padding:8px!important;z-index:10!important}:root:has(#admin:not(.hidden)) dialog[open]>header h2{font-size:20px!important;margin:0!important;min-width:0!important;overflow-wrap:anywhere!important}:root:has(#admin:not(.hidden)) dialog[open]>header button{flex:0 0 auto!important;min-height:40px!important;height:40px!important;width:auto!important}:root:has(#admin:not(.hidden)) dialog[open] :is(.card,.overviewCard,.entryCard){height:auto!important;min-height:0!important;max-height:none!important;padding:8px!important;margin:0 0 8px!important}:root:has(#admin:not(.hidden)) dialog[open] :is(.receiptOverviewContent,.personnelWorkspaceBody){width:100%!important;min-width:0!important;padding:0!important;min-height:0!important}:root:has(#admin:not(.hidden)) #mobilePersonnelWorkspace[open],:root:has(#admin:not(.hidden)) #portalHelp[open]{display:flex!important;flex-direction:column!important;overflow:hidden!important;gap:8px!important}:root:has(#admin:not(.hidden)) #mobilePersonnelWorkspace .personnelWorkspaceBody{flex:1 1 auto!important;overflow:auto!important}:root:has(#admin:not(.hidden)) #mobilePersonnelWorkspace :is(.overviewCard,.table,table,#drvRows,.driverOverviewHead){position:static!important;height:auto!important;max-height:none!important;overflow:visible!important;min-height:0!important}:root:has(#admin:not(.hidden)) #mobilePersonnelWorkspace .driverOverviewHead .actions{flex-wrap:wrap!important;overflow:visible!important}:root:has(#admin:not(.hidden)) #portalHelp .helpAnswers{flex:1 1 auto!important;min-height:0!important;overflow:auto!important}:root:has(#admin:not(.hidden)) #portalHelp form{flex:0 0 auto!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:6px!important}:root:has(#admin:not(.hidden)) #portalHelp form textarea{height:88px!important;min-height:88px!important}:root:has(#admin:not(.hidden)) #portalHelp form button{height:44px!important;align-self:end!important}:root:has(#admin:not(.hidden)) #portalHelp form small{grid-column:1/-1!important;font-size:12px!important}:root:has(#admin:not(.hidden)) #portalHelp>p{font-size:12px!important;line-height:1.35!important}:root:has(#admin:not(.hidden)) .receiptOverviewScreen button{min-height:44px!important;height:auto!important;max-height:none!important;flex-grow:0!important}:root:has(#admin:not(.hidden)) .receiptOverviewScreen .actions>button{flex:1 1 80px!important}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) [hidden],:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog).hidden{display:none!important}
 }
}

@layer mobileViewport {:root:has(#admin:not(.hidden)) :is(#admin,#driver) .top .logo,:root:has(#admin:not(.hidden)) body:has(#admin:not(.hidden)) .proposalDialogLogo{display:flex!important;align-items:center!important;justify-content:center!important;width:64px!important;height:64px!important;min-width:64px!important;min-height:64px!important;max-width:64px!important;max-height:64px!important;flex:0 0 64px!important;padding:0!important;margin:0!important;box-sizing:border-box!important;border-radius:12px!important;background-size:contain!important;background-position:center!important;background-repeat:no-repeat!important}
 @media(max-width:900px){:root:has(#admin:not(.hidden)) :is(#admin,#driver) .top .logo,:root:has(#admin:not(.hidden)) body:has(#admin:not(.hidden)) .proposalDialogLogo{width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;max-width:48px!important;max-height:48px!important;flex-basis:48px!important;border-radius:9px!important}}
}

@layer mobileViewport {:root:has(#admin:not(.hidden)) #admin #officeHome .driverHubNames{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;align-items:stretch!important;gap:8px!important;width:100%!important;min-width:0!important;margin:0!important}:root:has(#admin:not(.hidden)) #admin #officeHome .driverHubNames>div{width:auto!important;min-width:0!important;max-width:100%!important;height:auto!important;margin:0!important;padding:8px!important;white-space:normal!important;overflow-wrap:anywhere!important;box-sizing:border-box!important;background:#f7f9fc!important;border:1px solid #dce5ef!important;border-radius:10px!important}@media(max-width:650px){:root:has(#admin:not(.hidden)) #admin #officeHome .driverHubNames{gap:5px!important}:root:has(#admin:not(.hidden)) #admin #officeHome .driverHubNames>div{font-size:12px!important;line-height:1.35!important;padding:6px!important}}}

@layer mobileViewport {@media(max-width:900px){:root:has(#admin:not(.hidden)) #admin>.top .proposalHeaderActions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%!important;gap:5px!important}:root:has(#admin:not(.hidden)) #admin>.top .proposalHeaderActions>button{width:100%!important;white-space:nowrap!important;overflow-wrap:normal!important;min-height:36px!important;padding:6px!important;font-size:12px!important}:root:has(#admin:not(.hidden)) #admin>.top .right{display:none!important}}}

@layer mobileViewport {@media(max-width:900px){:root:has(#admin:not(.hidden)) #admin #mobilePersonnelWorkspace .driverOverviewHead>.actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important;align-items:stretch!important}:root:has(#admin:not(.hidden)) #admin #mobilePersonnelWorkspace .driverOverviewHead>.actions>button{width:100%!important;min-width:0!important;max-width:100%!important;min-height:44px!important;height:auto!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important;flex:none!important}:root:has(#admin:not(.hidden)) #admin #mobilePersonnelWorkspace .officeDriverSearch,:root:has(#admin:not(.hidden)) #admin #mobilePersonnelWorkspace .driverDayActions{display:flex!important;flex-wrap:wrap!important;gap:6px!important;width:100%!important;min-width:0!important;overflow:visible!important}:root:has(#admin:not(.hidden)) #admin #mobilePersonnelWorkspace .driverDayActions>*{flex:1 1 130px!important;width:auto!important;min-width:0!important;max-width:100%!important}:root:has(#admin:not(.hidden)) #mobilePersonnelWorkspace>header>#driverQuickEditClose{display:none!important}:root:has(#admin:not(.hidden)) #admin>.top nav.proposalHeaderActions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;flex:none!important}}}

@layer mobileViewport {@media(max-width:900px){:root:has(#admin:not(.hidden)) #admin>.top nav.proposalHeaderActions>button{grid-column:auto!important;grid-row:auto!important}:root:has(#admin:not(.hidden)) #admin #mobilePersonnelWorkspace .driverOverviewHead>.actions>button{grid-column:auto!important;grid-row:auto!important}}}


@layer mobileViewport {
 @media screen and (max-width:900px) {:root:has(#admin:not(.hidden)) dialog[open]{
   inset:var(--portal-mobile-top,0px) 0 auto 0!important;
   transform:none!important;translate:none!important;
   width:100%!important;max-width:100%!important;
   height:var(--portal-mobile-height,100dvh)!important;
   max-height:var(--portal-mobile-height,100dvh)!important;
   box-sizing:border-box!important;overscroll-behavior:contain;
   padding:8px!important;scroll-padding-block:64px 12px;
  }:root:has(#admin:not(.hidden)) dialog[open] :is(form,.field,.actions,header,section,fieldset){min-width:0!important;box-sizing:border-box!important;}:root:has(#admin:not(.hidden)) dialog[open] :is(img,video,canvas,iframe){max-width:100%!important;}:root:has(#admin:not(.hidden)) dialog[open]>header{flex-shrink:0!important;}:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(.actions,.rotActions,.rotRemarkActions){
   flex-wrap:nowrap!important;overflow-x:auto!important;align-items:stretch!important;
  }:root:has(#admin:not(.hidden)) :is(#admin,#driver,dialog) :is(.actions,.rotActions,.rotRemarkActions)>button{
   flex:1 0 auto!important;min-height:44px!important;
  }:root:has(#admin:not(.hidden)) #driver[data-compact-driver]:not(.hidden){position:relative!important;inset:auto!important;}:root:has(#admin:not(.hidden)) #driver[data-compact-driver]>.driverPanel.active{flex:0 0 auto!important;overflow:visible!important;}:root:has(#admin:not(.hidden)) #driver .compactHeaderActions{width:138px!important;flex:0 0 138px!important;}:root:has(#admin:not(.hidden)) #driver .driverLangBtn{white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important;padding:4px!important;}:root:has(#admin:not(.hidden)) #driver .compactHeader{width:100%!important;min-width:0!important;}:root:has(#admin:not(.hidden)) #driver .compactHeaderInfo{gap:6px!important;}:root:has(#admin:not(.hidden)) #driver .compactHeaderInfo .portalSoundControl{font-size:12px!important;}:root:has(#admin:not(.hidden)) #admin #messages .messagesLayout{grid-template-columns:minmax(0,1fr)!important;height:auto!important;}:root:has(#admin:not(.hidden)) #admin #messages :is(.messageComposer,.messageInbox,.officeGroupReadonly){height:auto!important;max-height:none!important;overflow:visible!important;}:root:has(#admin:not(.hidden)) #admin #messages .messageList{flex:none!important;height:auto!important;max-height:none!important;overflow:visible!important;}:root:has(#admin:not(.hidden)) #admin #messages .messageHead{min-width:0!important;flex-wrap:wrap!important;}:root:has(#admin:not(.hidden)) #messageReplyDialog .messageReplyForm{padding:0 4px 8px!important;gap:8px!important;}:root:has(#admin:not(.hidden)) #messageReplyDialog blockquote{max-height:72px!important;font-size:14px!important;line-height:1.35!important;}:root:has(#admin:not(.hidden)) #messageReplyDialog label{font-size:14px!important;overflow-wrap:anywhere;}:root:has(#admin:not(.hidden)) #messageReplyDialog textarea{min-height:72px!important;height:88px!important;}:root:has(#admin:not(.hidden)) #messageReplyDialog header{background:white;}:root:has(#admin:not(.hidden)) #portalHelp form{grid-template-columns:minmax(0,1fr)!important;}:root:has(#admin:not(.hidden)) #portalHelp form button{justify-self:end!important;width:auto!important;}
 }
 @media screen and (max-width:900px) and (max-height:500px) {:root:has(#admin:not(.hidden)) dialog[open]>header{min-height:44px!important;padding:4px!important;}:root:has(#admin:not(.hidden)) dialog[open]>header h2{font-size:17px!important;}:root:has(#admin:not(.hidden)) #portalHelp>p{margin:0!important;}
 }
}