/* Small-screen overrides only. Desktop dimensions and business controls are untouched. */
.mobile-menu-toggle{display:none}
@media screen and (max-width:900px){
 html.mobile-nav-ready .topbar>.sidebar-toggle{display:none}
 html{scrollbar-gutter:auto}
 body{min-width:0;min-height:100dvh}
 .app-container{min-width:0;min-height:100dvh}
 .app-container .topbar{height:auto;min-height:58px;padding:10px 12px;gap:8px;flex-wrap:wrap}
 .topbar .logo{flex:1;min-width:0;font-size:14px;line-height:1.5;letter-spacing:0;white-space:normal}
 .topbar .logo i{font-size:16px;margin-right:5px}
 .topbar .spacer{display:none}
 .topbar .user-info{gap:8px;font-size:12px;flex-shrink:0}
 .topbar .user-info .date,.topbar .user-info .role-badge{display:none}
 .topbar .user-info .logout{display:inline-flex;align-items:center;min-height:40px}
 .mobile-menu-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;border:1px solid #d9e5f5;border-radius:8px;background:#f2f6ff;color:#2b5fd7;font:inherit;font-size:20px;cursor:pointer}
 .mobile-menu-toggle:focus-visible{outline:2px solid #2b5fd7;outline-offset:2px}
 html.mobile-nav-ready .app-container .sidebar:not(.mobile-nav-open){display:none!important}
 html.mobile-nav-ready .sidebar.mobile-nav-open{display:block;width:100%;max-height:55dvh;overflow-y:auto;overflow-x:hidden;padding:10px 12px;scrollbar-gutter:auto}
 html.mobile-nav-ready .sidebar>ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;width:100%;min-width:0}
 html.mobile-nav-ready .sidebar>ul>li{white-space:normal;min-width:0;min-height:44px;padding:10px!important;border-radius:8px;gap:8px;align-self:stretch}
 html.mobile-nav-ready .sidebar li.sidebar-group{display:block!important;grid-column:1/-1;padding:0!important}
 html.mobile-nav-ready .sidebar .sidebar-group-toggle{min-height:44px;padding:10px}
 html.mobile-nav-ready .sidebar .sidebar-submenu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;min-width:0;padding:4px 8px;gap:6px}
 html.mobile-nav-ready .sidebar .sidebar-submenu a{min-height:44px;white-space:normal}
 .app-container .content{padding:12px 12px max(20px,env(safe-area-inset-bottom));min-width:0;gap:16px;scrollbar-gutter:auto}
 .content-flow,.content-flow>section,.content-flow>div{min-width:0;max-width:100%}
 .app-container .topbar.workspace-metrics-topbar{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:8px}
 .workspace-metrics-topbar>.mobile-menu-toggle{grid-column:1;grid-row:1}
 .workspace-metrics-topbar>.logo{grid-column:2!important;grid-row:1!important;justify-self:start!important;white-space:normal!important}
 .workspace-metrics-topbar>.user-info{grid-column:3!important;grid-row:1!important;justify-self:end!important}
 .workspace-metrics-topbar>.workspace-top-metrics{grid-column:1/-1!important;grid-row:2!important;width:100%;padding-top:8px;border-top:1px solid #edf2f8}
 .workspace-top-metric{padding:0 4px}
 .workspace-top-metric>strong{max-width:100%;font-size:16px;overflow-wrap:anywhere;white-space:normal}
 .content .two-col.v4-dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr)!important;gap:16px;width:100%}
 .v4-dashboard-grid>.todo-panel,.v4-dashboard-grid>.right-sidebar{grid-column:1!important;grid-row:auto!important;min-width:0;max-width:100%}
 .v4-dashboard-grid .todo-list.ws-pane{height:70dvh!important;max-height:70dvh!important;min-height:280px}
 .v4-dashboard-grid .workspace-tabs{flex-wrap:wrap}
 .workspace-order-card .workspace-order-identity{flex-basis:100%}
 .workspace-order-card .workspace-order-identity>.workspace-order-meta{white-space:normal;flex-wrap:wrap}
 .workspace-order-card .workspace-order-identity>.workspace-order-meta>span{white-space:normal}
 .content-flow .detail-layout{grid-template-columns:minmax(0,1fr)!important}
 .content-flow .board-sections,.content-flow .cards-two{grid-template-columns:minmax(0,1fr)!important}
 .content-flow :is(.toolbar,.wf-filter){gap:8px;align-items:stretch}
 .content-flow :is(.toolbar,.wf-filter)>form{max-width:100%;margin-left:0!important}
 .content-flow :is(.toolbar,.wf-filter) :is(input[type=text],input[type=search]){min-width:0!important;max-width:100%}
 dialog{max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 24px)!important}
 dialog>form{max-height:calc(100dvh - 24px)!important;min-width:0}
 dialog .dlg-body{min-height:0;overflow-y:auto;overscroll-behavior:contain}
 .content-flow .kv>span{min-width:0;overflow-wrap:anywhere}
 .content-flow :is(.production-sheet-scroll,.report-scroll,.warehouse-stock-scroll,.warehouse-detail-scroll,.product-profile-table,.department-readonly-scroll){max-width:100%;min-width:0;-webkit-overflow-scrolling:touch}
}
@media screen and (max-width:600px){
 :root{--ui-control-height:44px;--ui-compact-height:40px}
 .content-flow :is(.toolbar,.wf-filter)>form{width:100%}
 .content-flow :is(.toolbar,.wf-filter)>:is(input[type=text],input[type=search]){flex:1 1 100%;width:100%!important}
 .content-flow :is(.toolbar,.wf-filter) select{flex:1 1 130px;min-width:0!important;max-width:100%}
 .content-flow :is(.form-grid,.mold-main-grid){grid-template-columns:minmax(0,1fr)!important;gap:12px}
 .content-flow .form-grid>label{min-width:0;grid-column:auto!important}
 .content-flow .form-grid label>:is(input:not([type=checkbox],[type=radio],[type=hidden]),select,textarea){max-width:100%!important;min-width:0!important}
 .content-flow :is(.page-head,.report-head){flex-wrap:wrap;gap:10px}
 .content-flow .page-head h2{overflow-wrap:anywhere;font-size:20px}
 .content-flow .page-head p{margin-bottom:12px}
 .content-flow :is(.inline-actions,.transition-form,.decide-form,.form-actions){flex-wrap:wrap;max-width:100%;gap:8px}
 .content-flow :is(.btn-primary,.btn-sub){white-space:normal;height:auto;min-height:40px;text-align:center}
 .content-flow table.grid{display:block;max-width:100%;overflow-x:auto}
 .content-flow .kv b{min-width:0;flex:0 0 76px}
 .content-flow img{max-width:100%}
 .content-flow textarea{max-width:100%;box-sizing:border-box}
 dialog .form-grid{padding:12px!important}
 dialog fieldset{min-width:0;margin-inline:12px!important}
 #repRows>div{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px!important}
 #repRows input{width:100%!important;min-width:0}
 #repRows input[name^=rep_content]{grid-column:1/-1}
 .production-sheet .production-entry-panel .toolbar{align-items:stretch}
 .production-sheet .production-entry-panel .toolbar label{flex:1 1 120px;min-width:0}
 .production-sheet-status form{width:100%;flex-wrap:wrap}
 .production-group-actions{gap:8px}
 .production-group-actions>*{max-width:100%}
 .report-center .report-filter{padding:12px;gap:10px}
 .report-center .report-filter label{flex:1 1 100%;min-width:0}
 .report-center .report-filter select{max-width:100%}
 .report-center .report-range{width:100%;gap:8px}
 .report-center .report-range label{flex:1 1 120px}
 .report-center .report-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
 .report-center .report-tabs a{padding:10px 8px;text-align:center}
 .report-center .report-panel>header>div{flex-wrap:wrap}
 .warehouse-view-tabs a,.warehouse-kind-tabs a{flex:1;justify-content:center;padding-inline:8px;white-space:nowrap}
 .warehouse-detail-summary{gap:12px}
 .workspace-product-table-wrap .workspace-product-table{min-width:0;table-layout:fixed}
 .workspace-product-table-wrap .workspace-product-table :is(.product-sequence,.product-mold,.product-code,.product-quantity){width:auto}
 .workspace-product-table-wrap .workspace-product-table .product-sequence{width:30px}
 .workspace-product-table-wrap .workspace-product-table .product-quantity{width:46px}
 .workspace-product-table-wrap .workspace-product-table th,.workspace-product-table-wrap .workspace-product-table td{padding:8px 4px;font-size:11px;white-space:normal;overflow-wrap:anywhere}
 .v4-dashboard-grid .todo-list .v4-order-heading{height:auto;min-height:44px;flex-wrap:wrap;gap:6px;padding-block:8px}
 .v4-dashboard-grid .workspace-tabs>[data-pane]{min-height:40px}
 .order-profile .department-readonly{max-height:60dvh}
 #quotation-app .mobile-quote-cards{display:block;width:100%!important;min-width:0!important;border:0;background:transparent}
 #quotation-app .mobile-quote-cards colgroup,#quotation-app .mobile-quote-cards thead{display:none}
 #quotation-app .mobile-quote-cards tbody,#quotation-app .mobile-quote-cards tfoot{display:block;width:100%}
 #quotation-app .mobile-quote-cards tbody>tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px;margin-bottom:10px;border:1px solid #dce6f3;border-radius:9px;background:#fff}
 #quotation-app .mobile-quote-cards tbody>tr>td{display:flex;flex-direction:column;align-items:stretch;gap:6px;min-width:0;width:auto!important;max-width:100%;padding:0;border:0;background:transparent;text-align:left;white-space:normal}
 #quotation-app .mobile-quote-cards tbody td::before{content:attr(data-mobile-label);font-size:12px;font-weight:500;color:#6d819d;line-height:1.5}
 #quotation-app .mobile-quote-cards tbody td:first-child,#quotation-app .mobile-quote-cards tbody td[colspan]{grid-column:1/-1}
 #quotation-app .mobile-quote-cards .form-control{height:40px;min-height:40px;font-size:14px;padding:7px 8px}
 #quotation-app .mobile-quote-cards .qt-row-delete{height:40px;min-height:40px;flex-basis:32px;width:32px}
 #quotation-app .mobile-quote-cards tfoot tr{display:flex;gap:12px;justify-content:space-between;padding:10px;background:#f2f6fd}
 #quotation-app .mobile-quote-cards tfoot td{display:block;width:auto;padding:0;border:0}
 #quotation-app .table-wrap:has(.mobile-quote-cards){border:0;background:transparent;overflow:visible}
 .login-card{width:min(360px,100%);padding:28px 22px}
}
@media print{.mobile-menu-toggle{display:none!important}}
/* Compact reading on phones; retain touch targets and every business field. */
@media screen and (max-width:600px){
 .app-container .content{padding:8px 8px max(12px,env(safe-area-inset-bottom));gap:10px}
 .content-flow :is(.card,.report-panel){padding:12px!important;border-radius:9px}
 .content-flow :is(.page-head,.order-profile-head,.product-profile-head){padding-bottom:10px;margin-bottom:8px}
 .content-flow :is(.order-detail-layout,.product-profile-layout),.content-flow :is(.order-detail-layout,.product-profile-layout)>section{gap:10px!important}
 .content-flow :is(.order-profile,.product-profile) .card{padding:12px!important}
 .content-flow .card h3{margin-bottom:9px!important;font-size:14px}
 .content-flow .order-profile .order-summary .kv,.content-flow .product-profile #pInfoForm .kv{padding:7px 0;line-height:1.5}
 .content-flow .kv{padding-block:5px;gap:8px;font-size:12px}
 .content-flow .order-item-list{gap:8px}
 .content-flow .order-item-header{padding:10px;gap:8px}
 .content-flow .order-item-overview{padding:10px;gap:8px}
 .content-flow .order-item-fields{gap:5px}
 .content-flow .order-item-note{padding:0 10px 9px}
 .content-flow .order-item-amounts{gap:8px;font-size:12px}
 .content-flow .order-item-amounts dt{margin-bottom:2px}
 .content-flow .order-item-identity h4{font-size:13px}
 .content-flow .product-image-empty{min-height:110px;gap:8px}
 .content-flow .product-profile-gallery figure:first-child img{height:160px!important}
 .content-flow .product-profile-gallery img{height:90px!important}
 .content-flow .product-profile-aside .card:not(.product-media-card) .kv{padding:6px 0;gap:2px}
 .content-flow .product-profile-table .grid{min-width:0;width:100%;display:table;table-layout:fixed}
 .content-flow .product-profile-table .grid th,.content-flow .product-profile-table .grid td{padding:7px 4px;font-size:11px;white-space:normal;overflow-wrap:anywhere}
 .content-flow .mold-component-table col{width:auto!important}
 .content-flow .product-profile-table .grid .btn-sub{padding-inline:5px;font-size:12px}
 .v4-dashboard-grid .workspace-order-card{padding:10px;border-radius:8px}
 .v4-dashboard-grid .workspace-order-list{gap:8px}
 .v4-dashboard-grid .workspace-order-card header{gap:6px}
 .v4-dashboard-grid .workspace-order-flow{margin:9px 0;gap:6px 4px}
 .v4-dashboard-grid .workspace-order-flow li{padding-top:4px;font-size:11px}
 .v4-dashboard-grid .workspace-stage-summary{margin-top:6px}
 .v4-dashboard-grid .workspace-stage-name{padding:0 0 5px}
 .v4-dashboard-grid .workspace-stage-badges{gap:5px}
 .v4-dashboard-grid .workspace-stage-badges>div{padding:4px 6px;font-size:11px}
 .v4-dashboard-grid .workspace-product-table-wrap{margin:7px 0}
 .v4-dashboard-grid .workspace-product-table td,.v4-dashboard-grid .workspace-product-table th{padding:6px 3px}
 .warehouse-stock-page .warehouse-stock-table{min-width:0;width:100%;table-layout:fixed}
 .warehouse-stock-page .warehouse-stock-table .stock-seq{width:28px}
 .warehouse-stock-page .warehouse-stock-table .stock-name{width:34%}
 .warehouse-stock-page .warehouse-stock-table .stock-carton,.warehouse-stock-page .warehouse-stock-table .stock-qty{width:54px}
 .warehouse-stock-page .warehouse-stock-table th,.warehouse-stock-page .warehouse-stock-table td{padding:8px 4px;font-size:12px;white-space:normal;overflow-wrap:anywhere}
 .warehouse-stock-page .warehouse-stock-table [data-stock-expand]{gap:3px;min-height:40px}
 .warehouse-stock-page .warehouse-detail-scroll table{min-width:580px}
 .report-center .report-cards{gap:8px;margin:10px 0}
 .report-center .report-cards article{padding:12px;gap:6px}
 .report-center .report-panel{margin:10px 0}
 .report-center .report-tabs{margin-bottom:10px}
 .report-center .report-table{min-width:460px}
 .report-center .report-table th,.report-center .report-table td{padding:8px 6px;font-size:12px;min-width:56px}
 .report-center .report-table td:first-child{min-width:100px}
 .content-flow .department-readonly-scroll table{min-width:400px}
 .content-flow .department-readonly-scroll th,.content-flow .department-readonly-scroll td{padding:8px 5px;font-size:11px;white-space:normal}
 .production-sheet .production-cumulative{min-width:700px}
 .production-sheet .production-cumulative .col-product{width:190px}
 .production-sheet .production-cumulative .col-mold{width:76px}
 .production-sheet .production-cumulative .col-order{width:76px}
 .production-sheet .production-cumulative .col-order-qty{width:56px}
 .production-sheet .production-cumulative .col-count{width:48px}
 .production-sheet .production-cumulative .col-hours{width:50px}
 .production-sheet .production-cumulative .col-completion{width:66px}
 .production-sheet .production-cumulative .col-seq{width:32px}
 .production-sheet .production-history-sheet{min-width:830px}
 .production-sheet .production-history-sheet .history-product{width:170px}
 .production-sheet .production-history-sheet .history-mold{width:72px}
 .production-sheet .production-history-sheet .history-order{width:72px}
 .production-sheet .production-history-sheet .history-count{width:48px}
 .production-sheet .production-history-sheet .history-people{width:48px}
 .production-sheet .production-history-sheet .history-hours{width:56px}
 .production-sheet .production-history-sheet th,.production-sheet .production-history-sheet td{padding:7px 4px;font-size:11px;white-space:normal}
 .production-sheet .production-sheet-scroll{margin:8px 0}
 .production-sheet .production-batch-record{padding:10px;margin:8px 0}
 #quotation-app .mobile-quote-cards tbody>tr{padding:9px;gap:7px;margin-bottom:8px}
 #quotation-app .mobile-quote-cards tbody>tr>td{gap:3px}
 #quotation-app .mobile-quote-cards tbody td::before{font-size:11px}
 #quotation-app h2{margin:16px 0 9px}
 #quotation-app .form-row{margin-bottom:12px}
 #quotation-app .quote-total-bar{padding:12px;margin-top:12px}
}
