/* New menu controls stay absent from desktop and printed documents. */
.mobile-menu-toggle,.mobile-menu-close,.mobile-menu-backdrop{display:none}

@media screen and (max-width:768px){
  html,body{width:100%;min-width:0;max-width:100%}
  body>main{width:100%;min-width:0;max-width:100%;margin-left:0}
  body.mobile-menu-open{overflow:hidden}
  body>aside{width:min(300px,86vw);max-width:100%;height:100vh;height:var(--wk-mobile-view-height,100dvh);z-index:40;transform:translateX(-100%);visibility:hidden;overscroll-behavior:contain}
  body.mobile-menu-open>aside{transform:translateX(0);visibility:visible}
  .mobile-menu-backdrop{position:fixed;inset:0;z-index:30;background:#102a4988}
  body.mobile-menu-open>.mobile-menu-backdrop{display:block}
  body .mobile-menu-toggle,body .mobile-menu-close{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:44px;padding:9px 12px;border:1px solid #ffffff70;border-radius:6px;background:#ffffff16;color:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
  body .mobile-menu-close{display:flex;margin:8px 10px 0 auto}
  body>aside nav button{min-height:44px;line-height:1.4}
  body .mobile-menu-toggle:focus-visible,body .mobile-menu-close:focus-visible{outline:2px solid #fff;outline-offset:2px}
  body>main>.top{height:auto;min-height:64px;gap:8px;flex-wrap:wrap;padding:10px;align-items:center}
  body.mobile-short-viewport>main>.top{position:static}
  body>main>.top>b{flex:1;min-width:0;line-height:1.5;overflow-wrap:anywhere}
  body>main>.top .search{order:3;flex:1 0 100%;width:100%;min-width:0;margin:0}
  body>main>.top .search input{min-width:0;min-height:44px;font-size:16px}
  body>main>.top .topright{order:4;width:100%;min-width:0;white-space:normal;line-height:1.6;overflow-wrap:anywhere}
  body .sectionTabs{max-width:100%;min-width:0;flex-wrap:nowrap;overflow-x:auto;padding:8px 10px;overscroll-behavior-x:contain}
  body .sectionTabs button{flex:0 0 auto;min-height:44px;white-space:nowrap}
  body .page,body #pages>.page{width:100%;min-width:0;max-width:100%;padding:10px}
  body .page :is(.card,.grid,.form,.head,.section-title,.master-registration-body){min-width:0;max-width:100%}
  body .page :is(.head,.section-title,.actions,.dashToolbar,.toolbar,.tools,.eq-card-head,.eq-record-tools){flex-wrap:wrap}
  body .page :is(.head,.section-title)>*{min-width:0;max-width:100%}
  body .page .head h1{font-size:20px}
  body .page .head>span{flex-basis:100%;line-height:1.6}
  body .page .actions,body .dashToolbar{width:100%;margin-left:0}
  body .page:not(#orders) :is(.form,.grid,.raw-grid){grid-template-columns:minmax(0,1fr)!important;align-items:stretch}
  body .page :is(.dashRow,.dashRow2),body #equipmentOps :is(.eq-layout,.eq-basic,.eq-grid),body #dataReset .dr-confirm-grid,body #holds :is(.hold-fields,.hold-result-grid){grid-template-columns:minmax(0,1fr)}
  body #holds [data-hold-field=action]{display:block}
  body #holds #holds_actionPick{margin-bottom:7px!important}
  body #holds .hold-product-fields summary small,body #holds .hold-attachment summary small{display:block;margin:4px 0 0}
  body #holds :is(.hold-context-head,.hold-entry-actions){flex-wrap:wrap}
  body #holds .hold-fields input{min-width:0}
  body .page :is(.help,.notice,.section-title,.head,.hold-context-meta,.hold-context-product),body #traceOut pre{overflow-wrap:anywhere}
  body .page:not(#orders) :is(.head,.section-title)>:is(input,select){width:100%!important;flex:1 1 100%}
  body :is(.page:not(#orders),dialog,[role=dialog]) :is(button,.btn,input:not([type=checkbox]):not([type=radio]),select){min-height:44px;height:auto;font-size:16px;line-height:1.4}
  body :is(.page:not(#orders),dialog,[role=dialog]) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){max-width:100%;font-size:16px}
  body .page:not(#orders) td :is(button,.btn){min-height:44px;font-size:14px;padding:8px 10px}
  body .page:not(#orders) textarea{min-height:88px;font-size:16px}
  body .page:not(#orders) :is(input[type=checkbox],input[type=radio]){width:20px;height:20px}
  body .page :is(summary,label.btn){min-height:44px;line-height:1.5}
  body .page label.btn{display:inline-flex;align-items:center;padding:10px}
  body #productMasters_carFilterHost .product-master-excel-action{height:auto;min-height:44px;font-size:14px}
  body #productMasters_list .product-column-filter :is(input,select){height:auto;min-height:44px;font-size:16px}
  body .page [id$="_list"],body .page :is(.eq-scroll,.dash-table,.ncr-table-scroll,[data-rows]),body [id$="_externalComponents"]{width:100%;min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
  body .page [id$="_list"] table:not(.ncr-table):not(.restart-table),body .page :is(.eq-scroll,[data-rows]) table{min-width:640px}
  body .dash-table table,body .dash-alert-scroll table{min-width:520px}
  body .page .qualityTiles,body .page .alertTiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  body .dash-alerts li{grid-template-columns:64px minmax(0,1fr);align-items:start}
  body .dash-alerts li small{grid-column:2;max-width:100%}
  body .dash-alerts li :is(button,a){min-height:44px}
  body :is(#moldShell,#planningShell,#spcShell){padding:10px}
  body :is(#moldFrame,#planningFrame,#spcFrame){display:block;width:100%;min-width:0;max-width:100%;height:calc(100vh - var(--wk-mobile-chrome-height,180px) - 20px)!important;height:max(120px,calc(var(--wk-mobile-view-height,100dvh) - var(--wk-mobile-chrome-height,180px) - 20px))!important;min-height:120px}
  body :is(dialog,[role=dialog]){box-sizing:border-box;min-width:0;max-width:calc(100vw - 20px);max-height:calc(100vh - 20px)!important;max-height:calc(var(--wk-mobile-view-height,100dvh) - 20px)!important;padding:12px!important;overflow:auto;overflow-wrap:anywhere}
  body :is(dialog,[role=dialog]) .form{grid-template-columns:minmax(0,1fr)!important}
  body :is(dialog,[role=dialog]) :is(header,.head){flex-wrap:wrap}
  body :is(#productMasterEditBackdrop,#productMasterImportBackdrop){padding:10px!important}
}