/* Recovery layout for existing iOS 1.1.2 WebView. Only presentation changes. */
:root {--dgs112-panel:#172d4e;--dgs112-border:#38577b;--dgs112-blue:#3279d6}
html,body{max-width:100%;overflow-x:hidden}
#app{max-width:100%;overflow-x:hidden}
#app .wrap{width:min(1180px,100%);max-width:100%;margin:0 auto;padding:16px!important;overflow:visible}
#app .top{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:space-between;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 14px}
#app .top>div{min-width:0}
#app .top .dgs-app-brand{display:flex;align-items:center;gap:10px;font-weight:750;white-space:nowrap}
#app .top .right{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
#app .top select{min-width:104px;max-width:180px;color:#152943;background:white;border:1px solid #8ba2ba;border-radius:10px}
#app .nav{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:9px!important;width:100%!important;overflow:visible!important;margin:0 0 16px!important;padding:0!important}
#app .nav .btn{display:flex!important;min-width:0!important;width:100%!important;height:auto!important;min-height:44px;align-items:center;justify-content:center;padding:9px 5px!important;white-space:normal!important;overflow-wrap:anywhere;font-size:14px;text-align:center;line-height:1.2}
#app .nav .btn.active{background:#367acb;border-color:#6aa9ff;color:white}
#app section>.card,#app .card{min-width:0;overflow-wrap:anywhere}
#app .card{padding:18px!important;margin:0 0 14px!important}
#app .card h2,#app .card h3{margin:0 0 15px;font-size:clamp(19px,4vw,24px)}
#app .metrics{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;margin-top:14px}
#app .metric{display:flex!important;flex-direction:column!important;justify-content:center;align-items:flex-start;min-width:0!important;gap:7px;padding:16px!important;border-radius:12px;background:#213c60;color:#fff}
#app .metric span{display:block!important;font-size:13px;line-height:1.25;color:#bbcee4}
#app .metric b{display:block!important;font-size:clamp(22px,5vw,30px);line-height:1.2;font-weight:760;overflow-wrap:anywhere}
#app .field{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
#app .grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#app section .btn{max-width:100%;white-space:normal}
#app canvas#hoursChart,#app canvas#employeeWeekChart{display:block!important;position:relative;width:100%!important;max-width:100%;height:235px!important;margin:8px 0 0}
#app #map{width:100%;height:310px;min-height:260px;border-radius:12px;border:1px solid #52708e;overflow:hidden;margin:12px 0;background:#b9c8d9}
#app .dgs112-map-help{margin:4px 0 6px;font-size:13px;color:#c0d2e6}
#app .dgs112-field-label{display:block;margin:10px 0 5px;font-weight:700;color:#d8e5f5}
#app .dgs112-empty{padding:12px;color:#bfcee0;font-size:14px}
#app .dgs112-schedule-card{padding:14px;margin:10px 0;border:1px solid #4d6a8f;border-radius:12px;background:#21395b}
#app .dgs112-schedule-card strong{display:block;font-size:16px;line-height:1.4}
#app .dgs112-schedule-card .muted{font-size:13px;margin-top:5px}
#app .dgs112-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}
#app .dgs112-actions .btn{flex:1 1 110px}
#app .dgs112-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#app .dgs112-row>div{min-width:0}
#app .dgs112-report-tools{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}
#app .dgs112-report-tools button{flex:1 1 150px}
#app #workOrderList{min-height:60px}
#app #workPlan>.card{margin-bottom:15px}
#app #workPlanNav{display:flex}
#app #dgs112SiteAddress{margin-top:8px}
#app .leaflet-container{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
@media(max-width:720px){
 #app .wrap{padding:12px!important}
 #app .top{padding-left:14px;padding-right:14px}
 #app .top .dgs-app-brand{font-size:20px!important}
 #app .top .dgs-web-mark{width:38px;height:38px}
 #app .nav{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
 #app .nav .btn{font-size:13px!important;padding:10px 4px!important;border-radius:10px}
 #app .card{padding:15px!important}
 #app .metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
 #app .metric{padding:13px!important}
 #app .grid2,#app .dgs112-row{grid-template-columns:minmax(0,1fr)}
 #app #map{min-height:260px;height:280px}
}
@media(max-width:360px){#app .nav{grid-template-columns:repeat(2,minmax(0,1fr))!important}#app .top .right{width:100%}}