/* MS Shipments v2.9.5 — Typography Balance 2
 * REPLACES typography reset 1; intentionally non-invasive. Tajawal is already
 * loaded by style.css. Keep desktop tables readable via their OWN scroll areas.
 * No behavioral, business, security, or PDF changes.
 */
:root {
  --ty-body: 15px;
  --ty-page-title: 24px;
  --ty-section: 19px;
  --ty-subsection: 16px;
  --ty-label: 13px;
  --ty-note: 13px;
  --ty-control: 14px;
  --ty-table: 15.5px;
  --ty-metric: 23px;
}
html { font-size: 16px; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body { font-family: var(--font); font-size: var(--ty-body); line-height: 1.5; }
:where(button,input,select,textarea,option) { font-family: var(--font); }
/* Titles: avoid global h1/h2/h3 overrides that previously inflated compact panels. */
:where(main .pagehead h1,main .v290-head h1,main .v291-head h1,
       main .v281-head h1,main .page-form h1) {
  font-size:var(--ty-page-title); line-height:1.35; font-weight:700;
}
/* Keep compact headings on other pages; the shipment register is a primary page heading. */
main:not(.page-list) .pagehead h1 {font-size:var(--ty-page-title) !important;}
main:not(.page-list) .pagehead h1 small {font-size:13px !important;vertical-align:middle;}
/* Shipment register heading and shipment total, sized as readable first-class information. */
main.page-list .shipments-list-shell > .pagehead {min-height:90px;align-items:center;}
main.page-list .shipments-list-shell > .pagehead h1 {
  display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;
  font-size:clamp(36px,2.7vw,44px) !important;line-height:1.2;
  font-weight:900;letter-spacing:0;
}
main.page-list .shipments-list-shell > .pagehead h1 small {
  display:inline-block;margin-inline-start:0;
  font-size:clamp(27px,2.1vw,32px) !important;
  font-weight:850;line-height:1.2;color:#815122;
  font-variant-numeric:tabular-nums;vertical-align:baseline;
}
@media(max-width:640px){
  main.page-list .shipments-list-shell > .pagehead {min-height:72px;}
  main.page-list .shipments-list-shell > .pagehead h1 {font-size:32px !important;gap:9px;}
  main.page-list .shipments-list-shell > .pagehead h1 small {font-size:25px !important;}
}
:where(main .shipment-panel-heading h2,main .v290-panel h2,main .v291-panel h2,
       main .rowhead h2,main .card > h2) {font-size:var(--ty-section);line-height:1.4;}
:where(main .rowhead h3,main .card h3,main .v260b-chart-heading h3) {
  font-size:var(--ty-subsection);line-height:1.4;
}
/* Navbar should stay compact; brand and buttons must not outgrow the toolbar. */
.top .brand-copy strong {font-size:15px !important;line-height:1.2;}
.top .brand-copy small {font-size:10px !important;line-height:1.2;letter-spacing:1px;}
.top .primary-nav>a,.top .primary-nav>.nav-more>summary,
.top .nav-more-menu a {font-size:13px !important;line-height:1.35;}
.top .who :is(.btn.primary,.account-link,.muted,.user-label,.role-chip) {
  font-size:13px !important;line-height:1.35;
}
.top .who .btn.primary {min-height:34px;padding:6px 10px;}
/* Buttons + form controls; 'small' remains visibly smaller, not 15px everywhere. */
.btn {font-size:var(--ty-control) !important;line-height:1.4;}
.btn.small {font-size:13px !important;line-height:1.4;}
:where(.filters,.formgrid,.v291-filters,.v281-filters,.supplier-inline-form)
  :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  font-size:14px;line-height:1.45;
}
:where(main label,main .formgrid label,main .v291-filters label) {
  font-size:var(--ty-label);line-height:1.45;
}
:where(main .muted,main .notes,main .shipment-preview-card p,main .flash) {
  line-height:1.5;
}
:where(.role-chip,.badge,.tag,.status-chip,.v291-flag-chip) {
  font-size:12.5px;line-height:1.4;
}
/* Shipment register: readable individual cells; never scale the entire table.
   V2.9.3 Auto Fit and sticky serial/selection are intentionally untouched. */
.page-list .shipments-list-wrap {max-width:100%;overflow-x:auto !important;}
.page-list .shipments-list-wrap > .shipments-list-table {
  width:max-content !important;min-width:100% !important;table-layout:auto !important;
}
.page-list .shipments-list-table :is(th,td) {
  font-size:var(--ty-table) !important;
  line-height:1.45 !important;
  padding:9px 10px !important;
  vertical-align:middle;
  font-variant-numeric:tabular-nums;
}
.page-list .shipments-list-table th {font-size:15px !important;font-weight:750;}
.page-list .shipments-list-table td.n,
.page-list .shipments-list-table td.n b,
.page-list .shipments-list-table td[data-col="serial"] b,
.page-list .shipments-list-table td[data-col="serial"] a {
  font-size:16px !important;font-weight:750;
}
.page-list .shipments-list-table .status-select,
.page-list .shipments-list-table .status-chip {
  font-size:13px !important;line-height:1.4;min-width:110px;
}
.page-list .shipments-list-table :is(td[data-col="eta"],td[data-col="ship_date"]) {
  white-space:nowrap!important;
}
.page-list .shipments-list-table td[data-col="supplier"] {overflow-wrap:anywhere;}
.page-list .shipments-list-table td[data-col="goods"] small {font-size:12px;}
.page-list .shipment-fit-help strong {font-size:14px;}
.page-list .shipment-fit-help span,.page-list .shipment-fit-btn {font-size:13px;}
.page-list .kpis b {font-size:23px !important;line-height:1.25;}
.page-list .kpis span {font-size:13px;line-height:1.45;}
/* Shipment view: reduce oversized action row, tabs and overview while preserving
   distinctive totals and already-responsive column layout. */
.page-view .pagehead {gap:10px;margin-bottom:12px;}
.page-view .pagehead h1 {font-size:24px!important;line-height:1.35;}
.page-view .pagehead h1 :is(.badge,.status-chip,.shipment-status-shipping) {
  font-size:12.5px!important;vertical-align:middle;
}
.page-view .pagehead .muted {font-size:13px;line-height:1.45;}
.page-view .pagehead .actions {display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.page-view .pagehead .actions .btn {font-size:13.5px!important;line-height:1.4;
  padding:7px 11px;min-height:35px;white-space:nowrap;}
.page-view .pagehead .actions .badge {font-size:12px;}
.page-view .shipment-lock-panel {padding:13px 15px;margin-bottom:12px;}
.page-view .shipment-lock-panel .rowhead h3 {font-size:16px!important;margin-bottom:5px;}
.page-view .shipment-lock-panel .muted {font-size:13px!important;line-height:1.5;}
.page-view .shipment-lock-panel .btn {font-size:13px!important;min-height:34px;padding:7px 11px;}
.page-view .shipment-tabbar {gap:5px;padding:6px;margin:10px 0 13px;}
.page-view .shipment-tab {font-size:14px!important;line-height:1.4;min-height:37px;
  padding:7px 12px;gap:6px;}
.page-view .shipment-tab .tab-count {font-size:12px;min-width:22px;}
.page-view .shipment-panel-heading h2 {font-size:19px!important;}
.page-view .modepanel {padding:10px 12px;margin-bottom:12px;}
.page-view .modepanel > div > b {font-size:14px!important;line-height:1.4;}
.page-view .modepanel > div > span {font-size:13px!important;line-height:1.45;}
.page-view .fields {gap:10px 12px;}
.page-view .fields .f {padding:10px 11px;}
.page-view #tab-overview .fields .f > span {font-size:16px!important;line-height:1.4;}
.page-view #tab-overview .fields .f > b {font-size:20px!important;line-height:1.45;
  font-variant-numeric:tabular-nums;overflow-wrap:anywhere;}
.page-view .kpis > div {min-height:100px;padding:13px 12px;gap:4px;}
.page-view .kpis > div > b {font-size:22px!important;line-height:1.24;overflow-wrap:anywhere;}
.page-view .kpis > div > span {font-size:13px!important;line-height:1.45;}
.page-view .shipment-overview-links .btn,.page-view .shipment-panel-heading .btn {
  font-size:13.5px!important;min-height:35px;padding:7px 11px;
}
/* Keep tables across other business screens dense without inheriting the view's KPI sizes. */
:where(.page-view,.page-items,.page-warehouse,.page-suppliers,.page-financial,
       .page-reports,.page-expense_audit,.page-documents,.page-customs) table.grid :is(th,td) {
  font-size:14px;line-height:1.45;
}
/* Editable shipment tables: respect its own scroll container and 12-field width. */
.page-form #shipform .tablewrap {overflow-x:auto;}
.page-form #shipform .tablewrap > table.grid.edit {
  min-width:1100px!important;width:max(100%,1100px)!important;table-layout:auto!important;
}
.page-form #shipform .grid.edit :is(th,td) {
  font-size:13px!important;line-height:1.45!important;
}
.page-form #shipform .grid.edit :is(input:not([type="checkbox"]),select) {
  font-size:13px!important;line-height:1.4!important;min-height:34px;
}
.page-form #shipform>.card h3,.page-form #shipform .rowhead h3 {
  font-size:16px!important;
}
/* Other large metrics: consistent contrast without forcing 28px across the site. */
:is(.page-dashboard .v260b-kpis b,.page-dashboard .ops-kpis b,
    .page-suppliers .suppliers-kpis b,.v290-kpis strong,.v291-cards strong,
    .v281-summary strong) {
  font-size:var(--ty-metric)!important;line-height:1.25;font-variant-numeric:tabular-nums;
}
:where(.page-dashboard .v260b-kpis span,.page-dashboard .ops-kpis span,
       .v290-kpi-title,.v291-cards small) {font-size:13px;line-height:1.45;}
/* Keep intentionally fixed-width MFA/security values legible. */
:is(.mfa-settings .mfa-secret,.mfa-code-grid code,pre,code) {
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
}
@media(max-width:800px) {
  main .pagehead h1,.page-view .pagehead h1 {font-size:22px!important;}
  .page-view .shipment-tabbar {flex-wrap:nowrap;overflow-x:auto;}
  .page-view .shipment-tab {flex:0 0 auto;min-height:36px;padding:7px 10px;}
  .page-view .pagehead .actions .btn {font-size:13px!important;}
  .page-list .shipments-list-table :is(th,td) {font-size:14.5px!important;padding:8px 9px!important;}
  .page-list .shipments-list-table td[data-col="serial"] :is(b,a) {font-size:15px!important;}
}
@media(max-width:480px) {
  .top .brand-copy strong {font-size:14px!important;}
  .top .who :is(.btn.primary,.account-link,.muted) {font-size:12px!important;}
  .page-view .pagehead .actions {gap:5px;}
  .page-view .pagehead .actions .btn {min-height:34px;padding:6px 9px;}
  .page-view .fields {grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr));}
  .page-view .kpis>div>b {font-size:20px!important;}
}
@media print {
  .page-list .shipments-list-table :is(th,td) {font-size:11px!important;}
}