/* Existing staff form components — fit their available content width */
.vc-main{container-type:inline-size}
.vc-main :is(.vc-card,.vc-toolbar,.vc-field,.vc-check){min-width:0}
.vc-main .vc-check>span{min-width:0;overflow-wrap:anywhere}
.vc-main :is(.vc-field,.vc-card h2,.vc-card h3,.vc-card b,.vc-muted,.vc-status,.vc-notice){overflow-wrap:anywhere}
.vc-main .vc-field :is(input,select,textarea){box-sizing:border-box;min-width:0;max-width:100%;font-size:16px;min-height:44px}
.vc-main .vc-toolbar{align-items:end;gap:14px}
.vc-main .vc-toolbar>.vc-field{flex:1 1 190px}
.vc-main .vc-toolbar>.vc-button{flex:0 1 auto;white-space:normal;min-height:44px}
.vc-main .vc-inventory-row:has([name="cost"]){grid-template-columns:minmax(200px,1fr) 110px minmax(220px,.65fr) minmax(110px,.35fr) auto;align-items:center;gap:20px}
.vc-main .vc-inventory-row :is(input,select){width:100%}
.vc-main .vc-inventory-row .vc-check{align-items:center;gap:10px}
.vc-main .vc-inventory-row .vc-check input{width:20px;height:20px;min-height:20px;flex:0 0 20px}
.vc-main .vc-inventory-row .vc-button{min-height:44px;white-space:normal}
.vc-main .vc-inventory-row>fieldset{grid-column:1/-1}
@container(max-width:1000px){
 .vc-main .vc-inventory-row,.vc-main .vc-inventory-row:has([name="cost"]){grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
 .vc-main .vc-inventory-row>div:first-child{grid-column:1/-1}
 .vc-main .vc-inventory-row>.vc-button{justify-self:end;min-width:100px}
}
@container(max-width:500px){
 .vc-main .vc-inventory-row,.vc-main .vc-inventory-row:has([name="cost"]){grid-template-columns:minmax(0,1fr)}
 .vc-main .vc-inventory-row>.vc-button{justify-self:stretch}
 .vc-main .vc-toolbar>.vc-field,.vc-main .vc-toolbar>.vc-button{flex:1 1 100%}
}
/* Legacy product editor: preserve the form, let controls and original previews fit */
#dlgItem{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}
#dlgItem :is(input,select,textarea){max-width:100%;box-sizing:border-box}
#dlgItem :is(.field,.row,.bar){min-width:0}
#dlgItem .df{flex-wrap:wrap;gap:10px}
@media(max-width:850px){#dlgItem :is(input,select,textarea){font-size:16px;min-height:44px}#dlgItem .df button{min-height:44px}}
/* Short landscape screens keep whole menu rows readable and scroll the existing panel */
@media(min-width:851px) and (max-height:600px){
 body.nx16-enabled :is(#landing,#nxFrontNav) .nx353-menu{height:auto!important;min-height:240px}
 body.nx16-enabled :is(#landing,#nxFrontNav) .nx353-column{min-height:220px!important}
 body.nx16-enabled :is(#landing,#nxFrontNav) .nx353-list{min-height:140px;max-height:260px}
}
