/* MS Shipments V2.9.2 — Visual density & responsive layout correction.
   Display only. No JS/form field name/calculation/database changes.
   Designed to override previous broad max-content table rule *only* where safe.
*/
:root{--ui292-control:35px;--ui292-gap:10px;--ui292-border:#28566d}
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%}
main{min-width:0;max-width:100%}
main.wide{width:100%;max-width:100%;min-width:0}
.card,.tablewrap,.formgrid,.rowhead{min-width:0}
/* Primary navigation: short, readable, never overlaid on user actions. */
.top{display:flex;align-items:center;flex-wrap:nowrap;gap:10px;min-height:62px;padding:8px 16px;isolation:isolate}
.top .brand{min-width:0;flex:0 0 auto;gap:7px;margin:0}
.top .brand-copy strong{font-size:15px;white-space:nowrap}
.top .brand-copy small{font-size:9px;letter-spacing:1.2px}
.top .brand-mark,.top .brand-mark img{width:30px;height:30px}
.top .primary-nav{display:flex;flex:1 1 auto;align-items:center;justify-content:center;gap:3px;min-width:0;overflow:visible;flex-wrap:nowrap}
.top .primary-nav>a,.top .primary-nav>.nav-more>summary{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:34px;line-height:1.35;padding:7px 8px;font-size:13px;font-weight:650;white-space:nowrap;border:1px solid transparent;border-radius:9px;color:#cbe0eb;text-decoration:none;cursor:pointer}
.top .primary-nav>a:hover,.top .primary-nav>.nav-more>summary:hover,.top .primary-nav>.nav-more>summary.on{background:#124359;color:#e7ffff;border-color:#3a93a6}
.top .primary-nav .nav-svg{width:15px;height:15px;flex-shrink:0}
.top .nav-more{position:relative;flex:0 0 auto;min-width:0}
.top .nav-more>summary{list-style:none;user-select:none}
.top .nav-more>summary::-webkit-details-marker{display:none}
.top .nav-caret{font-size:11px;opacity:.85;transition:transform .16s}
.top .nav-more[open] .nav-caret{transform:rotate(180deg)}
.top .nav-more-menu{position:absolute;top:calc(100% + 9px);right:0;z-index:30;min-width:203px;display:flex;flex-direction:column;gap:3px;padding:7px;background:#0c293b;border:1px solid #326078;border-radius:11px;box-shadow:0 16px 35px rgba(0,0,0,.44)}
.top .nav-more-menu a{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;font-size:13px;color:#d2e8f4;text-decoration:none;white-space:nowrap}
.top .nav-more-menu a:hover,.top .nav-more-menu a.on{background:#17516a;color:#fff}
.top .nav-more-menu .nav-svg{width:16px;height:16px}
.top .who{display:flex;gap:7px;min-width:0;flex:0 0 auto;align-items:center;margin:0}
.top .who .btn.primary{font-size:13px;min-height:35px;padding:7px 10px;white-space:nowrap}
.top .who .account-link,.top .who .muted,.top .who .user-label{font-size:13px;white-space:nowrap}
.top .who .account-link{padding:6px}
.top .who .user-label{max-width:105px;overflow:hidden;text-overflow:ellipsis}
.top .who .user-avatar{width:29px;height:29px;font-size:11px}
.top .who .role-chip{font-size:12px}
/* Responsive navigation: wraps into a proper second row rather than one cramped scroll strip. */
@media(max-width:1450px){
 .top{flex-wrap:wrap;gap:5px 12px;padding:7px 12px}
 .top .brand{flex:0 0 auto}
 .top .who{margin-inline-start:auto}
 .top .primary-nav{order:3;flex:1 1 100%;justify-content:flex-start;flex-wrap:wrap;gap:3px 6px;padding:2px 0 1px;overflow:visible}
 .top .primary-nav>a,.top .primary-nav>.nav-more>summary{min-height:31px;padding:5px 9px;font-size:13px}
}
@media(max-width:740px){
 .top{position:relative;align-items:center;gap:6px 9px;padding:7px 9px}
 .top .brand-copy small,.top .who .user-label,.top .who .user-avatar{display:none}
 .top .brand-copy strong{font-size:14px}
 .top .who{gap:5px}
 .top .who .btn.primary{font-size:12px;min-height:32px;padding:6px 8px}
 .top .who .account-link,.top .who .muted{font-size:12px;padding:3px}
 .top .primary-nav{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:4px}
 .top .primary-nav>a,.top .primary-nav>.nav-more>summary{font-size:12px;min-height:32px;padding:5px 7px}
 .top .primary-nav .nav-svg{width:14px;height:14px}
 .top .nav-more-menu{right:0;min-width:190px;max-width:min(82vw,260px)}
}
/* Shrink accidental excessive card padding on dense editor pages only. */
.page-form{min-width:0;width:100%;max-width:100%}
.page-form .pagehead{margin:0 0 10px}
.page-form .pagehead h1{font-size:clamp(20px,2vw,25px);margin:0}
.page-form #shipform{min-width:0;max-width:100%}
.page-form #shipform>.card{padding:14px 15px;margin-bottom:11px;min-width:0}
.page-form #shipform>.card h3,.page-form #shipform .rowhead h3{font-size:17px;margin:0 0 10px}
.page-form #shipform .rowhead{gap:7px;margin-bottom:5px}
.page-form #shipform .rowhead h3{margin-bottom:0}
.page-form #shipform .muted.small,.page-form .calc-mode-card .muted{font-size:12px;line-height:1.6}
.page-form .modepanel{padding:10px 13px;margin:0 0 11px;gap:8px}
.page-form .modepanel>div>span{font-size:12px;line-height:1.6}
.page-form .modepanel>div>b{font-size:14px}
/* Responsive form fields: 5/4/3/2/1 by available width. No fixed min-width overflow. */
.page-form #shipform .formgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px 11px}
.page-form #shipform .formgrid>label{display:flex;flex-direction:column;gap:3px;min-width:0;font-size:12px;line-height:1.35}
.page-form #shipform .formgrid :is(input,select){margin:0;min-width:0;max-width:100%;width:100%;min-height:var(--ui292-control);height:var(--ui292-control);font-size:14px;padding:6px 9px;border-radius:7px}
.page-form #shipform .formgrid .sent-field{display:flex;flex-direction:column;justify-content:flex-end}
.page-form #shipform .formgrid .sent-inline{display:flex;align-items:center;justify-content:center;gap:6px;min-height:var(--ui292-control);border:1px solid #35576d;border-radius:7px;background:#0a2839}
.page-form #shipform .formgrid .sent-inline input{min-height:0;height:17px;width:17px;margin:0}
.page-form #shipform>section.card>label.wide{font-size:12px}
.page-form #shipform>section.card>label.wide textarea{font-size:14px;min-height:55px;max-width:100%;width:100%}
.page-form .calc-mode-card .rowhead{display:flex;align-items:center;gap:12px}
.page-form .calc-mode-select{min-width:min(230px,100%);font-size:12px}
.page-form .calc-mode-select select{width:100%;min-width:0;margin-top:3px;font-size:13px;min-height:34px}
/* Edit tables: use the page width before requiring horizontal scroll. */
.page-form #shipform .tablewrap{max-width:100%;width:100%;min-width:0;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}
.page-form #shipform .tablewrap>table.grid.edit{width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important;border-collapse:collapse;font-size:13px!important}
.page-form #shipform .tablewrap>table.grid.edit th,.page-form #shipform .tablewrap>table.grid.edit td{padding:5px 4px!important;min-width:0!important;max-width:none!important;font-size:12.5px!important;line-height:1.4!important;vertical-align:middle;overflow-wrap:anywhere}
.page-form #shipform .grid.edit th{white-space:normal!important;color:#bcd8e5}
.page-form #shipform .grid.edit td{white-space:normal!important}
.page-form #shipform .grid.edit :is(input:not([type=checkbox]),select){display:block;box-sizing:border-box;max-width:100%!important;width:100%!important;min-width:0!important;padding:6px 6px!important;margin:0!important;font-size:13px!important;line-height:1.2!important;min-height:33px;height:33px;border-radius:6px}
.page-form #shipform .grid.edit input.w-name,.page-form #shipform .expense-editor input.w-name{min-width:0!important;width:100%!important}
.page-form #shipform .grid.edit td.c input[type=checkbox]{width:17px;height:17px;min-width:17px!important;margin:auto;accent-color:#56d5db}
.page-form #shipform .grid.edit td .x{min-height:30px;padding:3px 5px;font-size:18px}
/* Shipment item editor: prioritize name, then distribute useful widths among all 12 columns. */
.page-form #itemtable th:nth-child(1){width:19%}.page-form #itemtable th:nth-child(2){width:9%}.page-form #itemtable th:nth-child(3){width:8%}.page-form #itemtable th:nth-child(4){width:7%}.page-form #itemtable th:nth-child(5){width:8%}.page-form #itemtable th:nth-child(6){width:8%}.page-form #itemtable th:nth-child(7){width:6%}.page-form #itemtable th:nth-child(8){width:8%}.page-form #itemtable th:nth-child(9){width:8%}.page-form #itemtable th:nth-child(10){width:8%}.page-form #itemtable th:nth-child(11){width:8%}.page-form #itemtable th:nth-child(12){width:3%}
.page-form #itemtable th:nth-child(7){font-size:11px!important}
.page-form #itemtable .parent-select{min-width:0!important}
/* Expense table: compact selectors, generous narrative field. */
.page-form #exptable th:nth-child(1){width:22%}.page-form #exptable th:nth-child(2){width:8%}.page-form #exptable th:nth-child(3){width:10%}.page-form #exptable th:nth-child(4){width:9%}.page-form #exptable th:nth-child(5){width:10%}.page-form #exptable th:nth-child(6){width:7%}.page-form #exptable th:nth-child(7){width:8%}.page-form #exptable th:nth-child(8){width:12%}.page-form #exptable th:nth-child(9){width:11%}.page-form #exptable th:nth-child(10){width:3%}
.page-form #exptable select,.page-form #exptable .direct-select{min-width:0!important}
.page-form #shipform .grid.edit tfoot td{font-size:13px!important;font-weight:700!important;background:#103246}
.page-form .recon-preview{font-size:13px;padding:9px 11px;gap:7px}
.page-form .savebar{gap:9px;padding:10px 12px;margin:0;border-radius:10px 10px 0 0;align-items:center;flex-wrap:wrap;z-index:4}
.page-form .savebar :is(button,a){min-height:36px;font-size:14px;padding:7px 13px}
/* Data tables elsewhere: do not apply max-content to tables that naturally fit. */
.page-dashboard .tablewrap>table.grid,.page-reports .tablewrap>table.grid,.page-expense_audit .tablewrap>table.grid{width:100%!important;min-width:0!important;table-layout:auto!important}
.page-expense_audit .v291-detail{min-width:950px}
.page-expense_audit .v291-scroll,.page-reports .v290-scroll{max-width:100%}
@media(max-width:1500px){
 .page-form #shipform .formgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1170px){
 .page-form #shipform .formgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .page-form #shipform .tablewrap>table.grid.edit{width:100%!important;min-width:1120px!important}
 .page-form #shipform .tablewrap>#exptable{min-width:970px!important}
}
@media(max-width:780px){
 .page-form #shipform .formgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .page-form #shipform>.card{padding:12px 10px}
 .page-form .calc-mode-card .rowhead{align-items:stretch;flex-direction:column}
 .page-form .calc-mode-select{width:100%}
 .page-form #shipform .tablewrap>table.grid.edit{min-width:1090px!important}
 .page-form #shipform .tablewrap>#exptable{min-width:960px!important}
 .page-form #shipform .grid.edit th,.page-form #shipform .grid.edit td{padding-inline:4px!important}
}
@media(max-width:440px){.page-form #shipform .formgrid{grid-template-columns:minmax(0,1fr)}.page-form .savebar{position:static}.top .brand-copy strong{display:none}}
@media print{.top .nav-more-menu{display:none!important}.page-form #shipform .tablewrap{overflow:visible!important}.page-form #shipform .tablewrap>table.grid.edit{min-width:0!important}}