/* Shared Safari / WKWebView layout. Keep scrolling on the page or the open dialog. */
.sidebar{height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(20px,env(safe-area-inset-bottom))}
.estimate-page:has(.simple-estimate){padding:24px;min-width:0}
.estimate-page:has(.simple-estimate)>.page-head{margin:0 0 22px;padding:0 0 18px;border-bottom:1px solid var(--line);align-items:center}
.simple-estimate{gap:24px}
.simple-estimate .running-entry{padding:0}
.simple-estimate .running-summary{padding:20px;position:static}
.simple-estimate .simple-cost-section{padding:18px 0 0;margin-top:20px}
.simple-cost-section>h3{margin:0 0 14px}
.simple-additional-row{grid-template-columns:minmax(0,1fr) 130px auto;gap:10px;margin:12px 0}
.simple-material-row{margin:12px 0;gap:8px 12px}
.simple-material-row>small{align-self:center;line-height:1.4}
.simple-estimate .text-link{background:transparent;border:0;color:var(--blue);min-width:44px;min-height:44px;cursor:pointer;justify-self:end}
.simple-estimate .running-values>div{padding:9px 0;gap:12px}
.running-values strong{white-space:nowrap}
.estimate-hint{font-size:13px;line-height:1.5;color:var(--muted)}
.estimate-summary-jump,.estimate-edit-link{display:none}
@media(max-width:767px), (max-height:500px) and (hover:none){
 .app-shell{display:block}.sidebar{position:fixed;top:0;z-index:90;width:260px;transform:translateX(-105%)}.sidebar.open{transform:none}.topbar .menu{display:block}.topbar h1{display:none}.company-select{max-width:calc(100vw - 145px)}
 html{-webkit-text-size-adjust:100%;scroll-padding-top:110px;scroll-padding-bottom:90px}
 body{overflow-wrap:break-word}
 .content{padding:16px 12px calc(86px + env(safe-area-inset-bottom));min-width:0}
 .topbar{padding-inline:12px;gap:8px}
 .icon-btn,.close{min-width:44px;min-height:44px}
 button,.btn,summary,.view-tabs button,.order-workspace-tabs button,.customer-workspace-tabs button{min-height:44px;touch-action:manipulation}
 input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important;min-height:46px;scroll-margin-block:110px}
 input[type=checkbox],input[type=radio]{min-width:20px;min-height:20px}
 .page-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
 .page-head h2{font-size:25px;line-height:1.2}
 .page-head .actions{margin:0;flex-wrap:wrap;gap:8px}
 .page-head .btn{white-space:normal;line-height:1.3}
 .estimate-page:has(.simple-estimate){padding:16px;border:1px solid var(--line);border-radius:14px}
 .estimate-page:has(.simple-estimate)>.page-head{gap:10px;margin-bottom:16px;padding-bottom:14px}
 .estimate-page:has(.simple-estimate)>.page-head h2{font-size:23px}
 .simple-estimate{grid-template-columns:minmax(0,1fr);gap:18px}
 .simple-estimate .form-grid{gap:14px}
 .simple-estimate .running-summary{padding:16px;scroll-margin-top:110px}
 .simple-estimate .running-price{padding:16px}
 .simple-estimate .running-price h2{font-size:30px;margin:10px 0}
 .simple-estimate .running-values>div{font-size:13px}
 .simple-estimate .simple-material-row{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px;border:1px solid var(--line);border-radius:10px;margin:12px 0}
 .simple-material-row>.field:first-child{grid-column:1/-1}
 .simple-material-row>.field:nth-child(2){max-width:130px}
 .simple-material-row>small{grid-row:3;grid-column:1}
 .simple-material-row>.text-link{grid-row:3;grid-column:2}
 .simple-additional-row{grid-template-columns:minmax(0,1fr) auto;padding:12px;border:1px solid var(--line);border-radius:10px}
 .simple-additional-row>.field:first-child{grid-column:1/-1}
 .simple-additional-row>.text-link{align-self:end}
 .simple-cost-section>[data-add-material],.simple-cost-section>[data-add-cost]{width:100%}
 .estimate-summary-jump{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:48px;background:#edf4fa;border:1px solid #d7e5f0;padding:10px 12px;border-radius:9px;font-size:13px;color:var(--navy)}
 .estimate-summary-jump strong{white-space:nowrap}
 .estimate-edit-link{display:inline-flex;align-items:center;border:0;background:none;padding:6px 0;color:var(--blue);font-weight:600}
 .mobile-nav{height:auto;min-height:64px;padding:4px 6px calc(4px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;overflow:visible}
 .mobile-nav button{width:100%;min-width:0;min-height:54px;padding:5px 2px;font-size:10px;line-height:1.2}
 .view-tabs,.order-workspace-tabs,.customer-workspace-tabs{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
 .view-tabs>*{flex-shrink:0}
 .keyboard-open .mobile-nav{display:none}
 .keyboard-open .topbar .global-search{display:none}
 body:has(dialog[open]){overflow:hidden}
 body:has(dialog[open])>.app-shell,body:has(dialog[open]) .mobile-nav{pointer-events:none}
 dialog[open],dialog[open]:has(.wide-dialog),dialog[open]:has(.data-import-dialog){position:fixed;inset:var(--viewport-top,0px) 0 auto;margin:8px auto;width:calc(100% - 16px);max-width:680px;height:auto;max-height:calc(var(--viewport-height,100dvh) - 16px);overflow:auto;border-radius:14px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scroll-padding-block:80px}
 dialog[open]>#modal-content{overflow:visible;max-height:none;width:100%;min-width:0}
 dialog[open] .modal-body{width:100%;min-width:0;max-width:100%;height:auto;max-height:none;overflow:visible;padding:16px}
 dialog[open] .modal-head{position:sticky;top:-1px;z-index:5;margin:-1px 0 16px;padding:12px 0;background:var(--panel,#fff);align-items:flex-start;gap:12px}
 dialog[open] .modal-head>div{min-width:0;flex:1}
 dialog[open] .modal-head h3{font-size:21px;line-height:1.25}
 dialog[open] .modal-head .close{flex:0 0 44px;width:44px;height:44px;position:static}
 dialog[open] .form-grid{grid-template-columns:minmax(0,1fr)}
 dialog[open] .form-grid>.span-2{grid-column:1}
 dialog[open] .form-submit-bar{position:static;display:flex;flex-wrap:wrap;padding:14px 0 0;margin-top:16px;gap:8px;background:var(--panel,#fff)}
 dialog[open] .form-submit-bar .btn,dialog[open] form>button[type=submit],dialog[open] .modal-body>.btn:last-child{min-height:48px;white-space:normal;flex:1;position:static}
 dialog[open] .actions{flex-wrap:wrap;gap:8px}
 dialog[open] .actions .btn{white-space:normal;line-height:1.3}
 dialog[open] .table-shell{max-width:100%;overscroll-behavior-x:contain}
 #toast{bottom:calc(78px + env(safe-area-inset-bottom));left:12px;right:12px;pointer-events:none}
 .keyboard-open #toast{bottom:12px}
 .opshq-ios-app .content{padding-bottom:80px}
}
@media(max-width:767px) and (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:767px), (max-height:500px) and (hover:none){
 .estimate-page .field-help-button,.operational-workspace .field-help-button,.field-help-button{height:44px!important;min-height:44px!important;width:44px!important;min-width:44px!important;flex:0 0 44px;border-radius:12px}
 dialog[open]:has(.quote-screen),dialog[open]:has(.work-screen),dialog[open]:has(.team-member-screen){height:auto;max-height:calc(var(--viewport-height,100dvh) - 16px);overflow:auto}
 dialog[open]:has(.quote-screen)>#modal-content,dialog[open]:has(.work-screen)>#modal-content,dialog[open]:has(.team-member-screen)>#modal-content{position:static;inset:auto;height:auto;overflow:visible}
 dialog[open] .quote-screen,dialog[open] .work-screen,dialog[open] .team-member-screen{height:auto;max-height:none;overflow:visible;display:block}
 dialog[open] .team-member-screen>#record-form{overflow:visible;max-height:none;padding:0}
}
@media(max-width:767px), (max-height:500px) and (hover:none){
 dialog[open] .modal-body #record-form>.form-submit-bar{position:static;width:100%;margin:16px 0 0;padding:0;box-shadow:none}
 dialog[open] .modal-body #record-form>button[type=submit]{position:static;width:100%;max-width:100%;margin:16px 0 0;bottom:auto;box-shadow:none}
}
@media(max-width:767px), (max-height:500px) and (hover:none){
 /* Remaining destinations stay reachable through the main menu. */
 .mobile-nav button:last-child{display:grid}
 .mobile-nav button:nth-child(n+6){display:none}
}

@media(max-width:767px), (max-height:500px) and (hover:none){
 .keyboard-open .topbar{height:60px;min-height:60px;grid-template-rows:44px;padding-block:8px}
}
