@charset "utf-8";
.error_msg{font-size:15px;color:#F00;float:left}
.center_box form input[type="submit"] {
    background: #408734 none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: "Open Sans",sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 34px;
    margin: 0 5px;
    padding: 0 16px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    width: auto;
}
.php_error_center{text-align:center;margin-top:50px;color:#F00}
.success_msg_color{color:#090;!important}
.error_msg_color{color:#FF0000;!important}
.invoice_left form input[type="text"], input[type="password"], input[type="email"] {
	float:right!important;
}
.middle_box-new_message form textarea{
	width:67%;
}

#notifications {
    cursor: pointer;
	position: fixed;
	right: 0px;
	z-index: 9999;
	bottom: 0px;
	margin-bottom: 22px;
	margin-right: 15px;
	max-width: 300px;
}
#coldelete{
    cursor: pointer;
}

.blueBold {  color:#0066FF !important; font-weight:bold  !important }






/* ──────────────────────────────────────────────────────────────
   1. GLOBAL HIGHCHARTS BACKGROUND & DEFAULT TEXT OVERRIDES
   ────────────────────────────────────────────────────────────── */
.highcharts-container,
.highcharts-background {
    fill: #FFFFFF !important;
    background-color: #FFFFFF !important;
}

/* Force all standard titles, axes, legends, and text nodes to stay sharp dark gray */
.highcharts-root text,
.highcharts-title,
.highcharts-subtitle,
.highcharts-axis-labels text,
.highcharts-yaxis-title,
.highcharts-xaxis-title,
.highcharts-legend-item text {
    fill: #222222 !important;
    color: #222222 !important;
    text-shadow: none !important;
}

/* ──────────────────────────────────────────────────────────────
   2. FIX FOR BLURRY/DOUBLE DATA VALUES (BARS & GAUGES)
   ────────────────────────────────────────────────────────────── */
/* Completely strip away Highcharts' automatic blurry outline system globally */
.highcharts-text-outline {
    stroke: none !important;
    fill: none !important;
    display: none !important;
}

/* Clear standard text shadows on any data label container */
.highcharts-data-label text {
    text-shadow: none !important;
}

/* Force the actual text layer (including nested tspans in bars & gauges) to be solid, crisp, and readable */
.highcharts-data-label text tspan,
.highcharts-gauge-series .highcharts-data-label text {
    text-shadow: none !important;
    stroke: none !important;
    font-weight: bold !important;
    fill: #222222 !important;
    color: #222222 !important;
}

/* ──────────────────────────────────────────────────────────────
   3. EXPORT MENU ICON (HAMBURGER BUTTON) FIX
   ────────────────────────────────────────────────────────────── */
/* Forces the 3 structural menu lines to stay dark gray */
.highcharts-contextbutton .highcharts-button-symbol {
    stroke: #333333 !important;
}

/* Keeps the rectangular button container backdrop white */
.highcharts-contextbutton rect.highcharts-button-box {
    fill: #FFFFFF !important;
}

/* Adds a subtle gray background shift when hovering the menu button */
.highcharts-contextbutton:hover rect.highcharts-button-box {
    fill: #EFEFEF !important;
}


/* Force tooltip background to white */
.highcharts-tooltip-box {
    fill: #FFFFFF !important;
    stroke: #CCCCCC !important; /* optional subtle border */
}

/* Force tooltip text to dark gray */
.highcharts-tooltip text {
    fill: #222222 !important;
    color: #222222 !important;
}

/* Remove any text shadow */
.highcharts-tooltip text tspan {
    text-shadow: none !important;
    stroke: none !important;
}


/* Gauge dial (the needle/pointer) */
.highcharts-dial {
    fill: #000000 !important;   /* center hub color */
    stroke: #000000 !important; /* needle line color */
}

/* Gauge pivot (the circle at the center) */
.highcharts-pivot {
    fill: #000000 !important;   /* center circle fill */
    stroke: #000000 !important; /* center circle border */
}

/* Fix: absolute-positioned .footer clings to AdminLTE .wrapper{height:100%;} (one viewport),
   so on pages taller than one screen the footer overlaps content instead of sitting at the
   true bottom. Let .wrapper grow with content while still filling short pages. */
body .wrapper { height: auto; min-height: 100vh; }

/* Thin scrollbar for Manage Inventory tiles (Current Stock / Recent Stock Transactions),
   applied only when the panel's PHP-side row count exceeds 10 (class added conditionally). */
.table-responsive.scroll-thin {
max-height: 460px;
overflow-y: auto;
scrollbar-width: thin;              /* Firefox */
scrollbar-color: #c1c1c1 transparent; /* Firefox */
}
.table-responsive.scroll-thin::-webkit-scrollbar { width: 6px; }
.table-responsive.scroll-thin::-webkit-scrollbar-track { background: transparent; }
.table-responsive.scroll-thin::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 3px; }
.table-responsive.scroll-thin::-webkit-scrollbar-thumb:hover { background: #a8a8a8; }
.table-responsive.scroll-thin table thead th {
position: sticky;
top: 0;
z-index: 1;
background: #fff;
}

/* Fix: .main-sidebar (aside) correctly stretches to full page height via min-height:100%,
   but its inner .sidebar div (which carries the real navy theme color) only grows to fit
   the menu content, so on pages taller than one viewport the aside's plain gray default
   shows through below the menu. Make the inner .sidebar stretch to match its parent. */
.main-sidebar { display: flex; flex-direction: column; }
.main-sidebar .sidebar { flex: 1 1 auto; min-height: 0; }

/* Restyle Commercial Invoice page (commercial_report.php) to match the flat white
   "inv-panel" card look and neutral table headers used on Manage Inventory, instead
   of the older dark-bar Card / orange-striped table style. Scoped to
   #generate_commercial_invoice (the page's main form) so other pages that also use
   .Card / .orange-striped elsewhere in the app are unaffected. */
#generate_commercial_invoice .Card , #frmtelex .Card , #generate_packaging_report .Card {
border: 1px solid #e1e5ec;
border-radius: 6px;
box-shadow: none;
}
#generate_commercial_invoice .Card .CardHeader , #frmtelex .Card .CardHeader , #generate_packaging_report .Card .CardHeader {
background: transparent;
padding: 16px 18px 4px 18px;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
#generate_commercial_invoice .Card .CardHeader h3.CardTitle , #frmtelex .Card .CardHeader h3.CardTitle , #generate_packaging_report .Card .CardHeader h3.CardTitle {
float: none;
display: block;
color: #292b2c;
font-size: 16px;
font-weight: 700;
padding: 0;
}
#generate_commercial_invoice .Card .CardBody , #frmtelex .Card .CardBody , #generate_packaging_report .Card .CardBody {
padding: 8px 18px 16px 18px;
}
#generate_commercial_invoice .CommonTable .table.orange-striped .thead-dark th , #frmtelex .CommonTable .table.orange-striped .thead-dark th , #generate_packaging_report .CommonTable .table.orange-striped .thead-dark th {
background-color: #fff !important;
color: #292b2c !important;
border-color: #ecebef !important;
font-weight: 700;
}
#generate_commercial_invoice .CommonTable .table.orange-striped tbody tr:nth-of-type(2n+1) , #frmtelex .CommonTable .table.orange-striped tbody tr:nth-of-type(2n+1) , #generate_packaging_report .CommonTable .table.orange-striped tbody tr:nth-of-type(2n+1) {
background-color: #f8f9fa;
}
#generate_commercial_invoice .CommonTable .table.orange-striped tbody td , #frmtelex .CommonTable .table.orange-striped tbody td , #generate_packaging_report .CommonTable .table.orange-striped tbody td {
border-color: #ecebef !important;
}
#generate_commercial_invoice .CommonTable .table .thead-dark th , #frmtelex .CommonTable .table .thead-dark th , #generate_packaging_report .CommonTable .table .thead-dark th {
  background-color: #cf7d2c !important;
  color: #fff !important;
  border-color: #ffca96 !important;
font-weight: 700;
}
#generate_commercial_invoice .CommonTable .table .thead-dark th a , #frmtelex .CommonTable .table .thead-dark th a , #generate_packaging_report .CommonTable .table .thead-dark th a {
  color: #fff !important;
}

/* Commercial Invoice ribbon: quick-facts strip below the header + colored status badge. */
#generate_commercial_invoice .ci-ribbon , #frmtelex .ci-ribbon , #generate_packaging_report .ci-ribbon {
display: flex;
flex-wrap: wrap;
gap: 20px;
background: #fff;
border: 1px solid #e1e5ec;
border-radius: 6px;
padding: 14px 18px;
margin-top: 10px;
margin-bottom: 10px;
}
#generate_commercial_invoice .ci-ribbon-item , #frmtelex .ci-ribbon-item , #generate_packaging_report .ci-ribbon-item {
display: flex;
flex-direction: column;
gap: 2px;
padding-right: 20px;
border-right: 1px solid #ecebef;
}
#generate_commercial_invoice .ci-ribbon-item:last-child , #frmtelex .ci-ribbon-item:last-child , #generate_packaging_report .ci-ribbon-item:last-child {
border-right: none;
padding-right: 0;
}
#generate_commercial_invoice .ci-ribbon-label , #frmtelex .ci-ribbon-label , #generate_packaging_report .ci-ribbon-label {
font-size: 11px;
text-transform: uppercase;
letter-spacing: .4px;
color: #6b7280;
font-weight: 600;
}
#generate_commercial_invoice .ci-ribbon-value , #frmtelex .ci-ribbon-value , #generate_packaging_report .ci-ribbon-value {
font-size: 16px;
font-weight: 700;
color: #292b2c;
}
#generate_commercial_invoice .ci-status-badge , #frmtelex .ci-status-badge , #generate_packaging_report .ci-status-badge {
display: inline-block;
padding: 3px 10px;
border-radius: 12px;
font-size: 12px;
font-weight: 700;
vertical-align: middle;
}
#generate_commercial_invoice .ci-badge-neutral , #frmtelex .ci-badge-neutral , #generate_packaging_report .ci-badge-neutral { background: #eef0f2; color: #55595c; }
#generate_commercial_invoice .ci-badge-warning , #frmtelex .ci-badge-warning , #generate_packaging_report .ci-badge-warning { background: #fff3cd; color: #8a6d1d; }
#generate_commercial_invoice .ci-badge-info     , #frmtelex .ci-badge-info     , #generate_packaging_report .ci-badge-info     { background: #d6ecff; color: #0a5aa8; }
#generate_commercial_invoice .ci-badge-success  , #frmtelex .ci-badge-success  , #generate_packaging_report .ci-badge-success  { background: #d9f2e3; color: #1c7a43; }
#generate_commercial_invoice .ci-badge-danger   , #frmtelex .ci-badge-danger   , #generate_packaging_report .ci-badge-danger   { background: #fbdcdc; color: #a3252c; }

/* Middle products table: orange top-strip accent, matching the Shipping Documents tile pattern (.sd-card border-top). */
#generate_commercial_invoice .CommonTable.bluehead , #frmtelex .CommonTable.bluehead , #generate_packaging_report .CommonTable.bluehead {
  border-top: 3px solid #e07a5f;
}

/* Consignee, Ship To, Shipment Details cards: same orange top-strip accent as the middle table / Shipping Documents tiles. */
#generate_commercial_invoice .Card.ci-accent-orange , #frmtelex .Card.ci-accent-orange , #generate_packaging_report .Card.ci-accent-orange {
  border-top: 3px solid #e07a5f;
}

/* Match Commercial Invoice buttons to the Shipping Documents page's compact/rounded button style (.sd-btn / .sd-ghost). */
#generate_commercial_invoice .btn , #frmtelex .btn , #generate_packaging_report .btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#generate_commercial_invoice .btn.btn-primary, #frmtelex .btn.btn-primary, #generate_packaging_report .btn.btn-primary,
#generate_commercial_invoice .btn.btn-green , #frmtelex .btn.btn-green , #generate_packaging_report .btn.btn-green {
  background-color: #689a69;
  color: #fff;
  border: none;
}
#generate_commercial_invoice .btn.btn-primary:hover, #frmtelex .btn.btn-primary:hover, #generate_packaging_report .btn.btn-primary:hover,
#generate_commercial_invoice .btn.btn-green:hover , #frmtelex .btn.btn-green:hover , #generate_packaging_report .btn.btn-green:hover {
  background-color: #0069d9;
}
#generate_commercial_invoice .btn.btn-secondary , #frmtelex .btn.btn-secondary , #generate_packaging_report .btn.btn-secondary {
  background-color: #555555;
  color: #ffffff;
  border: 1px solid #555555;
}
#generate_commercial_invoice .btn.btn-secondary:hover , #frmtelex .btn.btn-secondary:hover , #generate_packaging_report .btn.btn-secondary:hover {
  background-color: #0069d9;
  color: #fff;
}
#generate_commercial_invoice .btn.btn-sm , #frmtelex .btn.btn-sm , #generate_packaging_report .btn.btn-sm {
  padding: 4px 12px;
  font-size: 12px;
}



/* Telex Release page: this page's single Card wraps the #frmtelex form (not the reverse),
   so it needs its own ID scope rather than the #frmtelex descendant pattern used elsewhere. */
#telexCard {
  border: 1px solid #e1e5ec;
  border-radius: 6px;
  box-shadow: none;
}
#telexCard.ci-accent-orange {
  border-top: 3px solid #e07a5f;
}
#telexCard .CardHeader {
  background: transparent;
  padding: 16px 18px 4px 18px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
#telexCard .CardHeader h3.CardTitle {
  float: none;
  display: block;
  color: #292b2c;
  font-size: 16px;
  font-weight: 700;
  padding: 0;
}
#telexCard .CardBody {
  padding: 20px 18px 16px 18px;
}

/* Telex Release tile: divider line under the header, matching the line under panel titles
   on Manage Inventory Locations (there it's the table header's own border; here, since
   this tile has no table, the line sits directly under the CardHeader instead). */
#telexCard .CardHeader {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}

/* Upload Documents page: same single-Card pattern and treatment as Telex Release
   (#telexCard) - flat card, orange top strip, transparent header with divider line,
   extra top padding above the first field, dark-gray Back button, blue hover on all. */
#uploadDocCard {
  border: 1px solid #e1e5ec;
  border-radius: 6px;
  box-shadow: none;
}
#uploadDocCard.ci-accent-orange {
  border-top: 3px solid #e07a5f;
}
#uploadDocCard .CardHeader {
  background: transparent;
  padding: 16px 18px 4px 18px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#uploadDocCard .CardHeader h3.CardTitle {
  float: none;
  display: block;
  color: #292b2c;
  font-size: 16px;
  font-weight: 700;
  padding: 0;
}
#uploadDocCard .CardBody {
  padding: 20px 18px 16px 18px;
}
#uploadDocCard .btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#uploadDocCard .btn.btn-primary {
  background-color: #689a69;
  color: #fff;
  border: none;
}
#uploadDocCard .btn.btn-primary:hover {
  background-color: #0069d9;
}
#uploadDocCard .btn.btn-secondary {
  background-color: #555555;
  color: #ffffff;
  border: 1px solid #555555;
}
#uploadDocCard .btn.btn-secondary:hover {
  background-color: #0069d9;
  color: #fff;
}


/* Divider line under the panel-head title area on these 8 list pages, matching
   the look used on Telex Release / Upload Documents (a thin line + spacing
   below the title before the content starts). */
#imageFilesPanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#insuranceDocsPanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#packagingListsPanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#commInvoicesPanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#telexReleasePanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#certOriginPanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#billLadingPanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}
#otherShippingDocsPanel .inv-panel-head {
  border-bottom: 1px solid #ecebef;
  padding-bottom: 10px;
}


/* Shipping Documents page: lighten the Invoice ID / Search inputs from dark navy to a light shade,
   matching the app's standard light form-control look. */
.sd-util-card input {
  background-color: #f5f7fa !important;
  color: #292b2c !important;
  border: 1px solid #d6dde3 !important;
}
.sd-util-card input::placeholder {
  color: #8a94a0 !important;
}
.sd-util-card input:focus {
  background-color: #ffffff !important;
  border-color: #689a69 !important;
}

/* Estimate Edit page: same style/format as the logistics pages, but keeping the
   estimate's own blue theme (#008acd) instead of orange for accents. */
.Card {
  border: 1px solid #e1e5ec;
  border-radius: 6px;
  box-shadow: none;
}
.CardBody {
  padding: 16px 18px;
}
#ResortTable thead.thead-dark th {
  background-color: #005f8a !important;
  color: #fff !important;
  border-color: #004a6b !important;
}
#ResortTable thead.thead-dark th a {
  color: #fff !important;
}
#ResortTable {
  border-top: 3px solid #008acd;
}
#estimateEditPage .btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#estimateEditPage .btn.btn-sm {
  padding: 4px 12px;
  font-size: 12px;
}
#estimateEditPage .btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Estimate Edit page: modernize the "Estimate ID / Client / Status" info ribbon -
   rounded corners, subtle gradient + shadow, refined typography instead of a flat
   rectangular solid-color bar. */
#estimateEditPage .CustomerInfoLine {
  background: linear-gradient(135deg, #008acd 0%, #00a8e8 100%);
  border-radius: 8px;
  padding: 14px 20px;
  margin-bottom: 16px;
  box-shadow: 0 2px 8px rgba(0,90,140,0.35);
  font-size: 14px;
  letter-spacing: 0.2px;
  color: rgba(255,255,255,0.85);
}
#estimateEditPage .CustomerInfoLine strong {
  color: #ffffff;
  font-weight: 700;
}

/* Estimate Edit page: reformat the Estimate ID / Client / Status ribbon to match
   the Commercial Invoice ribbon style (white quick-facts strip with labeled tiles
   and a colored status badge) instead of the flat solid-color bar. */
#estimateEditPage .ci-ribbon {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  background: #fff;
  border: 1px solid #e1e5ec;
  border-radius: 6px;
  padding: 14px 18px;
  margin-bottom: 16px;
}
#estimateEditPage .ci-ribbon-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-right: 20px;
  border-right: 1px solid #d8d7dc;
}
#estimateEditPage .ci-ribbon-item:last-child {
  border-right: none;
  padding-right: 0;
}
#estimateEditPage .ci-ribbon-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: #6b7280;
  font-weight: 600;
}
#estimateEditPage .ci-ribbon-value {
  font-size: 16px;
  font-weight: 700;
  color: #292b2c;
}
#estimateEditPage .ci-status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  vertical-align: middle;
}
#estimateEditPage .ci-badge-neutral { background: #eef0f2; color: #55595c; }
#estimateEditPage .ci-badge-warning { background: #fff3cd; color: #8a6d1d; }
#estimateEditPage .ci-badge-info     { background: #d6ecff; color: #0a5aa8; }
#estimateEditPage .ci-badge-success  { background: #d9f2e3; color: #1c7a43; }
#estimateEditPage .ci-badge-danger   { background: #fbdcdc; color: #a3252c; }

/* Estimate Edit page: MainDashboardFilter buttons - stop the uppercase transform so
   "Container Capacity" / "Add Item" display in the case we typed, and switch
   Container Capacity from green to dark gray (secondary/utility action). */
#estimateEditPage .MainDashboardFilter input[type="button"] {
  text-transform: none !important;
}
#estimateEditPage #Containers {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#estimateEditPage #Containers:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
}

/* Manage Estimates (list) page: compact button shape + blue hover matching the rest
   of the app; Reset switched from green to dark gray (secondary/utility action). */
#estimatesListPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#estimatesListPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#estimatesListPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Estimates Archive List page: same button treatment as Manage Estimates -
   compact shape, blue hover, Reset switched from green to dark gray. */
#estimatesArchivePage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#estimatesArchivePage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#estimatesArchivePage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Estimate Landed Cost Analysis page: same button treatment as the other Estimates
   list pages - compact shape, blue hover, Reset switched from green to dark gray. */
#estimateLandedCostPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#estimateLandedCostPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#estimateLandedCostPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Fix: the Reset base-color rule (input[name] + class) had higher specificity than
   the plain .search-category-btn:hover rule, so Reset never turned blue on hover.
   Add matching-specificity hover overrides for all three Estimates list pages. */
#estimatesListPage input[name="Reset"].search-category-btn:hover,
#estimatesArchivePage input[name="Reset"].search-category-btn:hover,
#estimateLandedCostPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Global informative-ribbon component (reused across list pages: Insurance Documents,
   Commercial Invoices, Packing Lists, and now the Estimates pages). Defined once here
   since the underlying pages currently declare it inline per-page. */
:root {
  --rib-good: #1f8a4c; --rib-good-soft: #eaf7ef;
  --rib-warning: #b8790a; --rib-warning-soft: #fdf3de;
  --rib-critical: #c23b3b; --rib-critical-soft: #fceded;
}
.tile-ribbon { margin: 14px 0; padding: 9px 14px; border-radius: 7px; font-size: 12.5px; line-height: 1.5; border-left: 3px solid var(--rib-warning); background: var(--rib-warning-soft); color: #1f2933; }
.tile-ribbon b { font-weight: 700; }
.tile-ribbon.status-good{ border-left-color: var(--rib-good); background: var(--rib-good-soft); }
.tile-ribbon.status-warning{ border-left-color: var(--rib-warning); background: var(--rib-warning-soft); }
.tile-ribbon.status-critical{ border-left-color: var(--rib-critical); background: var(--rib-critical-soft); }

/* Global "tile" table + operations-link component (introduced on Commercial Invoices;
   reused here so other list pages, like Estimates, can opt in with class="tile" on the
   table and class="operations-link" on the actions cell). */
:root {
  --stripe: #fdf3e9; --row-hover: #fbe6cd;
  --tile-head-bg: #b5651d; --tile-head-border: #8f4f16; --tile-head-text: #ffffff;
  --tile-orange: #b5651d; --tile-orange-dark: #8f4f16; --text-faint: #9aa3ad;
}
table.tile { width: 100%; border-collapse: collapse; font-size: 12px; }
table.tile thead th { text-align: left; padding: 9px 14px; font-size: 10.5px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--tile-head-text); background: var(--tile-head-bg); border-bottom: 1px solid var(--tile-head-border); white-space: nowrap; }
table.tile thead th a { color: inherit; text-decoration: none; }
table.tile tbody td { padding: 11px 14px; border-bottom: 1px solid #f5e6d3; vertical-align: top; color: #1f2933; }
table.tile tbody tr:nth-child(odd) { background: var(--stripe); }
table.tile tbody tr:hover { background: var(--row-hover); }
table.tile tbody tr:last-child td { border-bottom: none; }
table.tile td a.bluetext { color: var(--tile-orange); font-weight: 600; text-decoration: underline; }
table.tile td a.bluetext:hover { color: var(--tile-orange-dark); text-decoration: underline; }
table.tile td a[onclick] { color: #8a6a45; text-decoration: none; }
table.tile td a[onclick]:hover { color: var(--tile-orange); text-decoration: underline; }
table.tile td.operations-link { white-space: nowrap; }
table.tile td.operations-link a { display: inline-flex; width: 28px; height: 28px; border-radius: 6px; border: 1px solid #f0dcbf; background: #fff; align-items: center; justify-content: center; color: #8a6a45; margin-right: 4px; text-decoration: none; }
table.tile td.operations-link a:hover { background: #fdf3e9; border-color: #f0c896; color: var(--tile-orange); }
table.tile td.operations-link a svg { width: 14px; height: 14px; }

/* Estimates list page: Estimate ID links use the estimate blue theme (#008acd) instead
   of the shared tile-orange color used by other table.tile pages. */
#estimatesListPanel table.tile td a.bluetext { color: #008acd; }
#estimatesListPanel table.tile td a.bluetext:hover { color: #005f8a; }

/* Estimates list page: row-hover highlight uses a light blue instead of the shared
   tile-orange hover used by other table.tile pages. */
#estimatesListPanel table.tile tbody tr:hover { background: #d6ecff; }

/* Fix: the striped (odd) rows paint their own background on the <td> (via Bootstrap's
   table-striped mechanism), which sits on top of the <tr> background, so the blue
   hover only showed on non-striped rows. Target the td directly, with !important,
   and neutralize Bootstrap's striping accent variable so every row goes blue. */
#estimatesListPanel table.tile tbody tr:hover > td {
  background-color: #d6ecff !important;
  --bs-table-accent-bg: transparent;
}

/* Estimate Landed Cost Analysis: same tile look as Manage Estimates, with the
   estimate blue theme instead of tile-orange for the Estimate ID links and row hover. */
#estimateLandedCostPanel table.tile td a.bluetext { color: #008acd; }
#estimateLandedCostPanel table.tile td a.bluetext:hover { color: #005f8a; }
#estimateLandedCostPanel table.tile tbody tr:hover > td {
  background-color: #d6ecff !important;
  --bs-table-accent-bg: transparent;
}

/* Global white "tile card" panel used by Commercial Invoices, Insurance Documents, etc.
   These pages each declared this inline per-page; adding it once here so any page can
   opt in with class="inv-panel" / class="inv-panel-head" (e.g. Estimates pages). */
:root { --card-border: #e1e5ec; }
.inv-panel { background: #fff; border: 1px solid var(--card-border); border-radius: 8px; padding: 18px 20px 8px; }
.inv-panel-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.inv-panel-head h3 { margin: 0; font-size: 16px; font-weight: 700; }
.inv-panel-head .sub { font-size: 12px; color: #6b7280; }
.inv-panel-head .panel-count { margin-left: auto; font-size: 11.5px; color: var(--text-faint); font-weight: 600; letter-spacing: .3px; }

/* Estimates Archive List: same tile look as Manage Estimates, with the estimate
   blue theme instead of tile-orange for Estimate ID links and row hover. */
#estimatesArchivePanel table.tile td a.bluetext { color: #008acd; }
#estimatesArchivePanel table.tile td a.bluetext:hover { color: #005f8a; }
#estimatesArchivePanel table.tile tbody tr:hover > td {
  background-color: #d6ecff !important;
  --bs-table-accent-bg: transparent;
}

/* Vendor Purchase Orders page: same tile look as Manage Estimates, with the
   estimate blue theme for the PO Number column and row hover. Also unify the
   Search/Reset buttons to the compact/blue-hover style used elsewhere. */
#vendorPOPanel table.tile td.bluetext { color: #008acd; font-weight: 600; }
#vendorPOPanel table.tile tbody tr:hover > td {
  background-color: #d6ecff !important;
  --bs-table-accent-bg: transparent;
}
#vendorPOPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#vendorPOPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#vendorPOPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#vendorPOPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Estimates-section tile cards: thin gray divider under the card title/header,
   separating it from the ribbon/table content below. */
#estimatesListPanel .inv-panel-head,
#estimatesArchivePanel .inv-panel-head,
#vendorPOPanel .inv-panel-head,
#estimateLandedCostPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}

/* Estimates-section tile cards: consistent spacing above the card, matching
   the Manage Estimates page (reference), between the filter row and the card. */
#estimatesListPanel,
#estimatesArchivePanel,
#vendorPOPanel,
#estimateLandedCostPanel {
  margin-top: 16px;
}

/* Logistics list pages: same spacing above the card as Manage Estimates. */
#packagingListsPanel,
#certOriginPanel,
#insuranceDocsPanel,
#imageFilesPanel,
#otherShippingDocsPanel,
#billLadingPanel,
#telexReleasePanel {
  margin-top: 16px;
}

/* Commercial Invoices: same spacing above the card as Manage Estimates. */
#commInvoicesPanel {
  margin-top: 16px;
}

/* Invoices list page: tile look with the invoice green theme. */
#invoiceListPanel {
  margin-top: 16px;
}
#invoiceListPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#invoiceListPanel table.tile td a.bluetext { color: #2e7d32; font-weight: 600; }
#invoiceListPanel table.tile td a.bluetext:hover { color: #1b5e20; }
#invoiceListPanel table.tile tbody tr:hover > td {
  background-color: #e2f3e4 !important;
  --bs-table-accent-bg: transparent;
}
#invoiceListPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#invoiceListPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#invoiceListPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Manufacturer Invoices page: tile look with green theme. */
#manufInvoiceListPanel {
  margin-top: 16px;
}
#manufInvoiceListPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#manufInvoiceListPanel table.tile td a.bluetext { color: #2e7d32; font-weight: 600; }
#manufInvoiceListPanel table.tile td a.bluetext:hover { color: #1b5e20; }
#manufInvoiceListPanel table.tile tbody tr:hover > td {
  background-color: #e2f3e4 !important;
  --bs-table-accent-bg: transparent;
}
#manufInvoiceListPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#manufInvoiceListPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#manufInvoiceListPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Client Purchase Orders page: tile look with green theme. */
#clientPOPanel {
  margin-top: 16px;
}
#clientPOPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#clientPOPanel table.tile td a.bluetext { color: #2e7d32; font-weight: 600; }
#clientPOPanel table.tile td a.bluetext:hover { color: #1b5e20; }
#clientPOPanel table.tile tbody tr:hover > td {
  background-color: #e2f3e4 !important;
  --bs-table-accent-bg: transparent;
}
#clientPOPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#clientPOPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientPOPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Vendor PO Invoice page: tile look with green theme. */
#vendorPOInvoicePanel {
  margin-top: 16px;
}
#vendorPOInvoicePanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#vendorPOInvoicePanel table.tile td.bluetext { color: #2e7d32; font-weight: 600; }
#vendorPOInvoicePanel table.tile td a.bluetext { color: #2e7d32; font-weight: 600; }
#vendorPOInvoicePanel table.tile td a.bluetext:hover { color: #1b5e20; }
#vendorPOInvoicePanel table.tile tbody tr:hover > td {
  background-color: #e2f3e4 !important;
  --bs-table-accent-bg: transparent;
}
#vendorPOInvoicePage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#vendorPOInvoicePage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#vendorPOInvoicePage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Invoice Landed Cost Analysis page: tile look with green theme. */
#invoiceLandedCostPanel {
  margin-top: 16px;
}
#invoiceLandedCostPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#invoiceLandedCostPanel table.tile td a.bluetext { color: #2e7d32; font-weight: 600; }
#invoiceLandedCostPanel table.tile td a.bluetext:hover { color: #1b5e20; }
#invoiceLandedCostPanel table.tile tbody tr:hover > td {
  background-color: #e2f3e4 !important;
  --bs-table-accent-bg: transparent;
}
#invoiceLandedCostPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#invoiceLandedCostPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#invoiceLandedCostPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Products list page: tile look with purple theme, matching the existing
   purple-striped table on this page. */
#productsListPanel {
  margin-top: 16px;
}
#productsListPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#productsListPanel table.tile td a.bluetext { color: #6a1b9a; font-weight: 600; }
#productsListPanel table.tile td a.bluetext:hover { color: #4a148c; }
#productsListPanel table.tile tbody tr:hover > td {
  background-color: #f1e3fa !important;
  --bs-table-accent-bg: transparent;
}

/* Product Categories page: tile look with purple theme. Also unify Search/Reset
   button style to the compact/blue-hover pattern used elsewhere. */
#productCategoriesPanel {
  margin-top: 16px;
}
#productCategoriesPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#productCategoriesPanel table.tile td.bluetext { color: #6a1b9a; font-weight: 600; }
#productCategoriesPanel table.tile tbody tr:hover > td {
  background-color: #f1e3fa !important;
  --bs-table-accent-bg: transparent;
}
#productCategoriesPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#productCategoriesPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#productCategoriesPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Brands page: tile look with purple theme. Also unify Search/Reset button style. */
#brandsPanel {
  margin-top: 16px;
}
#brandsPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#brandsPanel table.tile tbody tr:hover > td {
  background-color: #f1e3fa !important;
  --bs-table-accent-bg: transparent;
}
#brandsPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#brandsPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#brandsPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Products page: modernize the search filter card header. Replace the dark full-
   width label bars with a clean white card topped by a purple ribbon accent. */
#productsListPage .Card.ListCard.Block3 {
  border-top: 4px solid #6a1b9a;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#productsListPage .Card.ListCard li .LabelTitle {
  background: #faf5fd;
  color: #6a1b9a;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#productsListPage .Card.ListCard li:first-child .LabelTitle,
#productsListPage .Card.ListCard li:last-child .LabelTitle {
  border-radius: 0;
}
#productsListPage .Card.ListCard li .FieldBox {
  padding: 2px 22px 14px;
  background: #faf5fd;
}

/* Products page: buttons (Search, Reset, Add, Export/Import/Select File) should
   render in their natural upper/lowercase text, not forced all-caps. */
#productsListPage .search-category-btn {
  text-transform: none;
}

/* Products page filter card: the button row (Search/Reset/Add and Export/Import/
   Select File) sat flush against the fields above with a large gap below. Add
   equal vertical spacing above and below the button row. */
#productsListPage .Card.ListCard.Block3 form > .row {
  margin-top: 18px;
}
#productsListPage .Card.ListCard.Block3 .CardBody {
  padding-bottom: 2px;
}
#productsListPage .Card.ListCard.Block3 .form-group {
  margin-bottom: 0;
}

/* Shipping Documents page: modernize the two top utility card headers (Email
   Shipping Documents, Search Library). Replace the solid dark-navy header block
   with a clean white header topped by a dark blue ribbon accent. */
.sd-util-card {
  border-top: 4px solid #131e2a;
}
.sd-util-head {
  background: #ffffff !important;
  border-bottom: 1px solid #e1e5ec;
}
.sd-util-title {
  color: #131e2a !important;
}

/* Shipping Documents utility cards -- ALTERNATE (Option 2) header style:
   gradient top ribbon + solid icon badge + small uppercase title, instead of
   the flat single-color ribbon + soft icon tint used in Option 1. Later rules
   win, so this overrides the Option 1 declarations above for the same selectors. */
.sd-util-card {
  border-top: none;
  position: relative;
  padding-top: 3px;
}
.sd-util-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #131e2a 0%, #2f5d8a 100%);
}
.sd-util-title {
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: .6px;
  color: #4a5b70 !important;
}
.sd-util-title .sd-ic {
  background: #131e2a !important;
  color: #ffffff !important;
}

/* Shipping Documents utility cards -- refine Option 2: solid dark blue ribbon
   (no gradient) and no divider lines within the card. */
.sd-util-card::before {
  background: #0d3b66;
}
.sd-util-head {
  border-bottom: none !important;
}
.sd-util-body {
  border-top: none !important;
  margin-top: 0 !important;
}

/* Shipping Documents utility cards: increase the font size of the field labels
   ("Invoice ID No.", "Search invoice ID, filename...") for better readability. */
.sd-field label {
  font-size: 14px;
}
.sd-field input {
  font-size: 14px;
}

/* Manage Inventory page: add a top blue ribbon accent to the "Current Stock"
   tile card, matching the modern ribbon treatment used elsewhere. */
#currentStockPanel {
  border-top: 4px solid #2c4a86;
  padding-top: 12px;
}

/* Manage Inventory page: buttons (Receive Stock, Import Receipt, Export,
   Search, Reset) should render in their natural upper/lowercase text, not
   forced all-caps. */
#inventoryPage .btn,
#inventoryPage .search-category-btn {
  text-transform: none;
}

/* Product Categories and Brands pages: the ADD button uses .btn.btn-primary
   (not .search-category-btn), which was still rendering all-caps. */
#productCategoriesPage .btn,
#brandsPage .btn {
  text-transform: none;
}

/* Manage Inventory Locations, Reorder Alerts, Inventory Transactions pages:
   buttons (Add, Search, Reset) should render in their natural upper/lowercase
   text, not forced all-caps. */
#invLocationsPage .btn,
#invLocationsPage .search-category-btn,
#reorderAlertsPage .btn,
#reorderAlertsPage .search-category-btn,
#invTransactionsPage .btn,
#invTransactionsPage .search-category-btn {
  text-transform: none;
}

/* Site-wide: force table header text (font, color, size) to match the
   Commercial Invoices page spec on every table.tile, regardless of the
   thead-blue/green/purple/orange color variant class, which otherwise wins
   the cascade with its own font-size/weight. Only text properties are
   touched here -- colors/background driven by --tile-head-* stay as-is. */
table.tile thead th {
  font-family: Roboto, sans-serif !important;
  color: #ffffff !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Table headers site-wide: the sortable column links (<a> tags inside thead th)
   have their own font-size/weight from a global link style, so they weren't
   inheriting the th's Commercial-Invoices-matched text style. Force them to
   match, same as the plain-text "Operations" header already does. */
table.tile thead th a {
  font-family: Roboto, sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: inherit !important;
}

/* Clients page: tile look with a new teal theme (Clients/Sales Reps/
   Manufacturers/Reports sections use teal/indigo/brown/slate respectively,
   since the site's own thead-color classes only cover blue/green/purple). */
#clientsPanel {
  margin-top: 16px;
}
#clientsPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#clientsPanel table.tile thead th {
  background: #00695c !important;
  border-bottom-color: #004d40 !important;
}
#clientsPanel table.tile thead th a {
  color: #ffffff !important;
}
#clientsPanel table.tile td a.bluetext { color: #00695c; font-weight: 600; }
#clientsPanel table.tile td a.bluetext:hover { color: #004d40; }
#clientsPanel table.tile tbody tr:nth-child(odd) { background-color: #e0f2f1; }
#clientsPanel table.tile tbody tr:hover > td {
  background-color: #b2dfdb !important;
  --bs-table-accent-bg: transparent;
}
#clientsPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#clientsPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientsPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#clientsPage .btn {
  text-transform: none;
}

/* Client Categories page: teal theme, matching Clients. */
#clientCategoriesPanel {
  margin-top: 16px;
}
#clientCategoriesPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#clientCategoriesPanel table.tile thead th {
  background: #00695c !important;
  border-bottom-color: #004d40 !important;
}
#clientCategoriesPanel table.tile thead th a {
  color: #ffffff !important;
}
#clientCategoriesPanel table.tile td.bluetext { color: #00695c; font-weight: 600; }
#clientCategoriesPanel table.tile tbody tr:nth-child(odd) { background-color: #e0f2f1; }
#clientCategoriesPanel table.tile tbody tr:hover > td {
  background-color: #b2dfdb !important;
  --bs-table-accent-bg: transparent;
}
#clientCategoriesPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#clientCategoriesPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientCategoriesPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#clientCategoriesPage .btn {
  text-transform: none;
}

/* Client Shipping page: teal theme, matching Clients. */
#clientShippingPanel {
  margin-top: 16px;
}
#clientShippingPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#clientShippingPanel table.tile thead th {
  background: #00695c !important;
  border-bottom-color: #004d40 !important;
}
#clientShippingPanel table.tile thead th a {
  color: #ffffff !important;
}
#clientShippingPanel table.tile td.bluetext { color: #00695c; font-weight: 600; }
#clientShippingPanel table.tile tbody tr:nth-child(odd) { background-color: #e0f2f1; }
#clientShippingPanel table.tile tbody tr:hover > td {
  background-color: #b2dfdb !important;
  --bs-table-accent-bg: transparent;
}
#clientShippingPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#clientShippingPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientShippingPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Sales Representatives page: indigo theme. */
#salesRepsPanel {
  margin-top: 16px;
}
#salesRepsPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#salesRepsPanel table.tile thead th {
  background: #303f9f !important;
  border-bottom-color: #1a237e !important;
}
#salesRepsPanel table.tile thead th a {
  color: #ffffff !important;
}
#salesRepsPanel table.tile td a.bluetext { color: #303f9f; font-weight: 600; }
#salesRepsPanel table.tile td a.bluetext:hover { color: #1a237e; }
#salesRepsPanel table.tile tbody tr:nth-child(odd) { background-color: #e8eaf6; }
#salesRepsPanel table.tile tbody tr:hover > td {
  background-color: #c5cae9 !important;
  --bs-table-accent-bg: transparent;
}
#salesRepsPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#salesRepsPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#salesRepsPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#salesRepsPage .btn {
  text-transform: none;
}

/* Sales Gauge Metrics page: indigo theme, matching Sales Representatives. */
#salesMetricsPanel {
  margin-top: 16px;
}
#salesMetricsPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#salesMetricsPanel table.tile thead th {
  background: #303f9f !important;
  border-bottom-color: #1a237e !important;
}
#salesMetricsPanel table.tile thead th a {
  color: #ffffff !important;
}
#salesMetricsPanel table.tile tbody tr:nth-child(odd) { background-color: #e8eaf6; }
#salesMetricsPanel table.tile tbody tr:hover > td {
  background-color: #c5cae9 !important;
  --bs-table-accent-bg: transparent;
}
#salesMetricsPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#salesMetricsPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#salesMetricsPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#salesMetricsPage .btn {
  text-transform: none;
}

/* Manufacturers page: brown theme. */
#manufacturersPanel {
  margin-top: 16px;
}
#manufacturersPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#manufacturersPanel table.tile thead th {
  background: #6d4c41 !important;
  border-bottom-color: #4e342e !important;
}
#manufacturersPanel table.tile thead th a {
  color: #ffffff !important;
}
#manufacturersPanel table.tile td a.bluetext { color: #6d4c41; font-weight: 600; }
#manufacturersPanel table.tile td a.bluetext:hover { color: #4e342e; }
#manufacturersPanel table.tile tbody tr:nth-child(odd) { background-color: #efebe9; }
#manufacturersPanel table.tile tbody tr:hover > td {
  background-color: #d7ccc8 !important;
  --bs-table-accent-bg: transparent;
}
#manufacturersPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#manufacturersPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#manufacturersPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#manufacturersPage .btn {
  text-transform: none;
}

/* Vendors page: brown theme, matching Manufacturers. */
#vendorsPanel {
  margin-top: 16px;
}
#vendorsPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#vendorsPanel table.tile thead th {
  background: #6d4c41 !important;
  border-bottom-color: #4e342e !important;
}
#vendorsPanel table.tile thead th a {
  color: #ffffff !important;
}
#vendorsPanel table.tile td a.bluetext { color: #6d4c41; font-weight: 600; }
#vendorsPanel table.tile td a.bluetext:hover { color: #4e342e; }
#vendorsPanel table.tile tbody tr:nth-child(odd) { background-color: #efebe9; }
#vendorsPanel table.tile tbody tr:hover > td {
  background-color: #d7ccc8 !important;
  --bs-table-accent-bg: transparent;
}
#vendorsPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#vendorsPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#vendorsPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#vendorsPage .btn {
  text-transform: none;
}

/* Sales Report page: modern filter card (matching Products' recipe) with a
   slate-gray ribbon, plus slate theme for the report table (Reports section). */
#salesReportFilterCard {
  border-top: 4px solid #455a64;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#salesReportFilterCard .LabelTitle {
  background: #eceff1;
  color: #455a64;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#salesReportFilterCard .FieldBox {
  padding: 2px 22px 14px;
  background: #eceff1;
}
#salesReportPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#salesReportPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#salesReportPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#salesReportPanel {
  margin-top: 16px;
}
#salesReportPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#salesReportPanel table.tile thead th {
  background: #455a64 !important;
  border-bottom-color: #263238 !important;
  color: #ffffff !important;
}
#salesReportPanel table.tile tbody tr:hover > td {
  background-color: #eceff1 !important;
  --bs-table-accent-bg: transparent;
}

/* Client Report page: modern filter card + slate theme, matching Sales Report. */
#clientReportFilterCard {
  border-top: 4px solid #455a64;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#clientReportFilterCard .LabelTitle {
  background: #eceff1;
  color: #455a64;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#clientReportFilterCard .FieldBox {
  padding: 2px 22px 14px;
  background: #eceff1;
}
#clientReportPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#clientReportPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientReportPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#clientReportPanel {
  margin-top: 16px;
}
#clientReportPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#clientReportPanel table.tile thead th {
  background: #455a64 !important;
  border-bottom-color: #263238 !important;
  color: #ffffff !important;
}
#clientReportPanel table.tile thead th a {
  color: #ffffff !important;
}
#clientReportPanel table.tile tbody tr:hover > td {
  background-color: #eceff1 !important;
  --bs-table-accent-bg: transparent;
}

/* Client Statement page: modern filter card + slate theme, matching Sales Report. */
#clientStatementFilterCard {
  border-top: 4px solid #455a64;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#clientStatementFilterCard .LabelTitle {
  background: #eceff1;
  color: #455a64;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#clientStatementFilterCard .FieldBox {
  padding: 2px 22px 14px;
  background: #eceff1;
}
#clientStatementPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#clientStatementPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientStatementPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#clientStatementPanel {
  margin-top: 16px;
}
#clientStatementPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#clientStatementPanel table.tile thead th {
  background: #455a64 !important;
  border-bottom-color: #263238 !important;
  color: #ffffff !important;
}
#clientStatementPanel table.tile thead th a {
  color: #ffffff !important;
}
#clientStatementPanel table.tile tbody tr:hover > td {
  background-color: #eceff1 !important;
  --bs-table-accent-bg: transparent;
}

/* Activity Tracker page: slate theme, matching the other Reports pages. */
#activityTrackerPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#activityTrackerPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#activityTrackerPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#activityTrackerPanel {
  margin-top: 16px;
}
#activityTrackerPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#activityTrackerPanel table.tile thead th {
  background: #455a64 !important;
  border-bottom-color: #263238 !important;
  color: #ffffff !important;
}
#activityTrackerPanel table.tile thead th a {
  color: #ffffff !important;
}
#activityTrackerPanel table.tile tbody tr:hover > td {
  background-color: #eceff1 !important;
  --bs-table-accent-bg: transparent;
}

/* Client Accounts Receivable page: modern filter card + maroon theme for
   the Finances section. */
#clientARFilterCard {
  border-top: 4px solid #7b241c;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#clientARFilterCard .LabelTitle {
  background: #fdedec;
  color: #7b241c;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#clientARFilterCard .FieldBox {
  padding: 2px 22px 14px;
  background: #fdedec;
}
#clientARPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#clientARPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientARPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#clientARPanel {
  margin-top: 16px;
}
#clientARPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#clientARPanel table.tile thead th {
  background: #7b241c !important;
  border-bottom-color: #4a1510 !important;
  color: #ffffff !important;
}
#clientARPanel table.tile thead th a {
  color: #ffffff !important;
}
#clientARPanel table.tile tbody tr:nth-child(odd) { background-color: #fdedec; }
#clientARPanel table.tile tbody tr:hover > td {
  background-color: #f5b7b1 !important;
  --bs-table-accent-bg: transparent;
}

/* Manufacturer Accounts Payable page: modern filter card + maroon theme,
   matching Client Accounts Receivable. */
#manufAPFilterCard {
  border-top: 4px solid #7b241c;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#manufAPFilterCard .LabelTitle {
  background: #fdedec;
  color: #7b241c;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#manufAPFilterCard .FieldBox {
  padding: 2px 22px 14px;
  background: #fdedec;
}
#manufAPPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#manufAPPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#manufAPPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#manufAPPanel {
  margin-top: 16px;
}
#manufAPPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#manufAPPanel table.tile thead th {
  background: #7b241c !important;
  border-bottom-color: #4a1510 !important;
  color: #ffffff !important;
}
#manufAPPanel table.tile thead th a {
  color: #ffffff !important;
}
#manufAPPanel table.tile tbody tr:nth-child(odd) { background-color: #fdedec; }
#manufAPPanel table.tile tbody tr:hover > td {
  background-color: #f5b7b1 !important;
  --bs-table-accent-bg: transparent;
}

/* Paid Commission Report page: modern filter card + maroon theme. */
#paidCommFilterCard {
  border-top: 4px solid #7b241c;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#paidCommFilterCard .LabelTitle {
  background: #fdedec;
  color: #7b241c;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#paidCommFilterCard .FieldBox {
  padding: 2px 22px 14px;
  background: #fdedec;
}
#paidCommPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#paidCommPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#paidCommPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#paidCommPanel {
  margin-top: 16px;
}
#paidCommPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#paidCommPanel table.tile thead th {
  background: #7b241c !important;
  border-bottom-color: #4a1510 !important;
  color: #ffffff !important;
}
#paidCommPanel table.tile thead th a {
  color: #ffffff !important;
}
#paidCommPanel table.tile tbody tr:nth-child(odd) { background-color: #fdedec; }
#paidCommPanel table.tile tbody tr:hover > td {
  background-color: #f5b7b1 !important;
  --bs-table-accent-bg: transparent;
}

/* Product Sales Report page: modern filter card + maroon theme. */
#prodSalesFilterCard {
  border-top: 4px solid #7b241c;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.08) 0 1px 4px;
}
#prodSalesFilterCard .LabelTitle {
  background: #fdedec;
  color: #7b241c;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 12px 22px 4px;
  border-radius: 0;
}
#prodSalesFilterCard .FieldBox {
  padding: 2px 22px 14px;
  background: #fdedec;
}
#prodSalesPage .search-category-btn {
  border-radius: 5px;
  padding: 10px 30px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
}
#prodSalesPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#prodSalesPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#prodSalesPanel {
  margin-top: 16px;
}
#prodSalesPanel .inv-panel-head {
  border-bottom: 1px solid #e1e5ec;
  padding-bottom: 10px;
}
#prodSalesPanel table.tile thead th {
  background: #7b241c !important;
  border-bottom-color: #4a1510 !important;
  color: #ffffff !important;
}
#prodSalesPanel table.tile thead th a {
  color: #ffffff !important;
}
#prodSalesPanel table.tile tbody tr:nth-child(odd) { background-color: #fdedec; }
#prodSalesPanel table.tile tbody tr:hover > td {
  background-color: #f5b7b1 !important;
  --bs-table-accent-bg: transparent;
}

/* Reports and Finances section filter cards: equalize the vertical gap above
   and below the Search/Reset/Export button row (was ~14px above vs 20px
   below since the CardBody's own padding-bottom already accounts for the
   gap below -- add matching margin-top to the button row's container). */
#salesReportFilterCard .row > .col-12.text-center,
#clientReportFilterCard .row > .col-12.text-center,
#clientStatementFilterCard .row > .col-12.text-center,
#clientARFilterCard .row > .col-12.text-center,
#manufAPFilterCard .row > .col-12.text-center,
#paidCommFilterCard .row > .col-12.text-center,
#prodSalesFilterCard .row > .col-12.text-center {
  margin-top: 6px;
}

/* Finances section filter cards (Client AR, Manuf AP, Paid Commission,
   Product Sales): these use .form-group.col-4.text-center for the button
   row instead of .col-12.text-center, so the earlier fix did not match. */
#clientARFilterCard .row > .form-group.col-4.text-center,
#manufAPFilterCard .row > .form-group.col-4.text-center,
#paidCommFilterCard .row > .form-group.col-4.text-center,
#prodSalesFilterCard .row > .form-group.col-4.text-center {
  margin-top: 6px;
}

/* Client Report and Client Statement filter cards: the "Select Customer"
   chosen-dropdown row had a smaller gap above it (from the fields) than
   below it (from its own 16px margin-bottom before the button row).
   Add matching margin-top so both gaps match. */
#clientReportFilterCard .form-group.col-12.p-lr-38,
#clientStatementFilterCard .form-group.col-12.p-lr-38 {
  margin-top: 8px;
}

/* Paid Commission Report: the table's many columns were pushing #paidCommPanel
   wider than its own flex-row parent (a Bootstrap .row without min-width:0 on
   its children), so the panel spilled past the page edge instead of the table
   scrolling within it. Constrain the panel to 100% of its container and allow
   it to shrink so the inner .table-responsive wrapper's own horizontal scroll
   takes over correctly at any window width. */
#paidCommPanel {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
#paidCommPanel #ManagePrdTable.table-responsive {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

/* Product Sales Report: same fix as Paid Commission Report -- the table's
   many columns were pushing #prodSalesPanel wider than its flex-row parent,
   causing it to overflow instead of scrolling internally. */
#prodSalesPanel {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
#prodSalesPanel #ManagePrdTable.table-responsive {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

/* Client Accounts Receivable page: the Operations column's $ icon is still
   a FontAwesome font-icon (font-size:20px) rather than the 14px SVG icons
   used on Manage Invoices and other list pages. Shrink it to match. */
#clientARPanel table.tile td.operations-link a {
  width: 26px;
  height: 26px;
}
#clientARPanel table.tile td.operations-link .fa-dollar {
  font-size: 14px;
}

/* Manufacturer Accounts Payable page: same fix as Client Accounts
   Receivable -- shrink the Operations $ font-icon to match the 14px SVG
   icons used elsewhere. */
#manufAPPanel table.tile td.operations-link a {
  width: 26px;
  height: 26px;
}
#manufAPPanel table.tile td.operations-link .fa-dollar {
  font-size: 14px;
}

/* Manage Products filter card: the button row had a 32px gap above it (from
   the fields) but only 2px below it (the CardBody's own padding-bottom),
   so it looked cramped against the bottom edge. Equalize both to 32px. */
#productsListPage .Card.ListCard.Block3 .CardBody {
  padding-bottom: 32px;
}

/* Global fix: ensure every page's Reset button hovers to the same blue
   (#0069d9) used on Manage Estimates, instead of staying gray. Each of
   these page-scoped Reset base-color rules previously had no matching
   :hover override at the same specificity. */
#activityTrackerPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#brandsPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientARPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientCategoriesPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientPOPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientReportPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientShippingPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientsPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#clientStatementPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#invoiceLandedCostPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#invoiceListPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#manufacturersPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#manufAPPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#manufInvoiceListPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#paidCommPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#prodSalesPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#productCategoriesPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#salesMetricsPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#salesReportPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#salesRepsPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#vendorPOInvoicePage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}
#vendorsPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}


/* Manage Products page: this page's buttons (Search, Reset, Add, Export
   File, Import File, Select File) had no custom hover styling at all --
   apply the same blue (#0069d9) hover used on Manage Estimates to all of
   them, matching the rest of the site. */
#productsListPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Manage Products page: Reset button was still green like Search/Add --
   switch it to the same gray (#555555) used for Reset elsewhere. Its hover
   already turns blue via the page-wide .search-category-btn:hover rule. */
#productsListPage input[name="reset_product_form"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Fix: the Reset gray base-color rule (input[name] + class) had higher
   specificity than the page-wide .search-category-btn:hover rule, so
   Reset never turned blue on hover. Add a matching-specificity override. */
#productsListPage input[name="reset_product_form"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Client Statement page: Reset button was still green -- switch to the
   standard gray (#555555) with white text, and add a matching-specificity
   hover override so it turns blue like the rest of the site. */
#clientStatementPage input[value="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#clientStatementPage input[value="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Clients section: the Add button (.btn.btn-primary, styled green by the
   site's own default) had no custom hover -- apply the same blue
   (#0069d9) hover used on Manage Estimates for consistency. */
#clientsPage .btn.btn-primary:hover,
#clientCategoriesPage .btn.btn-primary:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Sales Representatives section: same fix as Clients -- Add button
   (.btn.btn-primary, green) had no custom hover. Apply the same blue
   (#0069d9) hover used on Manage Estimates. */
#salesRepsPage .btn.btn-primary:hover,
#salesMetricsPage .btn.btn-primary:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Manufacturers section: same fix as Clients/Sales Reps -- Add button
   (.btn.btn-primary, green) had no custom hover. Apply the same blue
   (#0069d9) hover used on Manage Estimates. */
#manufacturersPage .btn.btn-primary:hover,
#vendorsPage .btn.btn-primary:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Inventory section (Stock by Location, Locations, Reorder Alerts,
   Transaction History): apply the same blue (#0069d9) hover used on
   Manage Estimates to every button style used across these 4 pages --
   .search-category-btn (Search/Reset), .btn-primary (Add/Receive Stock),
   and .btn-secondary (Import Receipt/Export/Reset). */
#inventoryPage .search-category-btn:hover,
#inventoryPage .btn.btn-primary:hover,
#inventoryPage .btn.btn-secondary:hover,
#invLocationsPage .search-category-btn:hover,
#invLocationsPage .btn.btn-primary:hover,
#reorderAlertsPage .search-category-btn:hover,
#invTransactionsPage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Inventory page modals (Receive Stock, Adjust, Reorder Point, Import) are
   appended outside #inventoryPage in the DOM, so the earlier page-scoped
   hover rule doesn't reach their primary buttons (Save/submit). Target the
   modal IDs directly with the same blue (#0069d9) hover. */
#receiveModal .btn.btn-primary:hover,
#adjustModal .btn.btn-primary:hover,
#reorderPointModal .btn.btn-primary:hover,
#importModal .btn.btn-primary:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Fix: Reorder Alerts and Transaction History use .btn.btn-secondary for
   their Reset button (not .search-category-btn like Stock by Location),
   so the earlier rule missed them. */
#reorderAlertsPage .btn.btn-secondary:hover,
#invTransactionsPage .btn.btn-secondary:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Logistics section (Commercial Invoices, Shipping Documents, Packing
   Lists, Certificates of Origin, Insurance Documents, Image Files, Other
   Shipping Documents, Bill of Ladings, Telex Releases): these pages still
   used the old compact button spec (padding 0 16px, font-size 13px,
   border-radius 7px, weight 700). Resize to match the Inventory section's
   button style (padding 10px 30px, font-size 14px, border-radius 5px,
   weight 500), and add the same blue (#0069d9) hover for consistency. */
#commInvoicesPage .search-category-btn,
#shippingDocsPage .search-category-btn,
#packingListsPage .search-category-btn,
#certOriginPage .search-category-btn,
#insuranceDocsPage .search-category-btn,
#imageFilesPage .search-category-btn,
#otherShippingDocsPage .search-category-btn,
#billLadingPage .search-category-btn,
#telexReleasePage .search-category-btn {
  padding: 10px 30px !important;
  font-size: 14px !important;
  border-radius: 5px !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
}
#commInvoicesPage .search-category-btn:hover,
#shippingDocsPage .search-category-btn:hover,
#packingListsPage .search-category-btn:hover,
#certOriginPage .search-category-btn:hover,
#insuranceDocsPage .search-category-btn:hover,
#imageFilesPage .search-category-btn:hover,
#otherShippingDocsPage .search-category-btn:hover,
#billLadingPage .search-category-btn:hover,
#telexReleasePage .search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Fix: these Logistics pages' .search-category-btn kept an old fixed
   height:34px from the original compact spec, which now fights the new
   10px vertical padding + 14px font, squeezing the button text off-center
   instead of vertically centered. Let height grow with the padding. */
#commInvoicesPage .search-category-btn,
#shippingDocsPage .search-category-btn,
#packingListsPage .search-category-btn,
#certOriginPage .search-category-btn,
#insuranceDocsPage .search-category-btn,
#imageFilesPage .search-category-btn,
#otherShippingDocsPage .search-category-btn,
#billLadingPage .search-category-btn,
#telexReleasePage .search-category-btn {
  height: auto !important;
  line-height: normal !important;
}

/* Shipping Documents page: this page uses its own .sd-btn / .sd-ghost
   classes (not .search-category-btn like the rest of Logistics), so the
   earlier fix missed it. Resize to match the Inventory section's button
   style and fix Reset's leftover old dark-navy color to the standard
   gray, plus the blue (#0069d9) hover used across the site. */
#shippingDocsPage .sd-btn {
  padding: 10px 30px !important;
  font-size: 14px !important;
  border-radius: 5px !important;
  font-weight: 500 !important;
  height: auto !important;
  line-height: normal !important;
}
#shippingDocsPage .sd-btn.sd-ghost {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#shippingDocsPage .sd-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Product Category and Brands pages: Add button (.btn.btn-primary, green)
   had no custom hover. Apply the same blue (#0069d9) hover used on
   Manage Estimates. */
#productCategoriesPage .btn.btn-primary:hover,
#brandsPage .btn.btn-primary:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Commercial Invoices page: Reset button still used the old dark-navy
   color scheme (#0f1822 bg, #a7b2bf text, #2c3c52 border). Switch to the
   same gray (#555555) with white text used on Manage Products' Reset. */
#commInvoicesPage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#commInvoicesPage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Same fix as Commercial Invoices, applied to the remaining Logistics
   pages: Reset buttons still used the old dark-navy color scheme.
   Switch to the standard gray (#555555) with white text used on Manage
   Products' Reset, plus the blue (#0069d9) hover. */
#packingListsPage input[name="Reset"].search-category-btn,
#certOriginPage input[name="Reset"].search-category-btn,
#insuranceDocsPage input[name="Reset"].search-category-btn,
#imageFilesPage input[name="Reset"].search-category-btn,
#otherShippingDocsPage input[name="Reset"].search-category-btn,
#billLadingPage input[name="Reset"].search-category-btn,
#telexReleasePage input[name="Reset"].search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}
#packingListsPage input[name="Reset"].search-category-btn:hover,
#certOriginPage input[name="Reset"].search-category-btn:hover,
#insuranceDocsPage input[name="Reset"].search-category-btn:hover,
#imageFilesPage input[name="Reset"].search-category-btn:hover,
#otherShippingDocsPage input[name="Reset"].search-category-btn:hover,
#billLadingPage input[name="Reset"].search-category-btn:hover,
#telexReleasePage input[name="Reset"].search-category-btn:hover {
  background-color: #0069d9 !important;
  color: #fff !important;
  border-color: #0069d9 !important;
}

/* Manage Products page: Select File button (a div with .upload-btn, not
   a name-addressable input like Reset) was still green -- switch to the
   same gray (#555555) used for Reset. Hover already turns blue via the
   page-wide .search-category-btn:hover rule. */
#productsListPage .upload-btn.search-category-btn {
  background-color: #555555 !important;
  color: #ffffff !important;
  border-color: #555555 !important;
}

/* Client Accounts Receivable page: turn the "Total Outstanding Client
   Invoices" text (rendered into #manage-category-search_box by inline JS)
   into a ribbon-badge matching the site's .tile-ribbon.status-good style,
   instead of plain green text. */
#clientARPage #manage-category-search_box {
  margin: 0;
  padding: 9px 14px;
  border-radius: 7px;
  border-left: 3px solid #1f8a4c;
  background: #eaf7ef;
  font-size: 12.5px;
  line-height: 1.5;
  color: #1f2933;
  display: inline-block;
}
#clientARPage #manage-category-search_box * {
  color: #1f2933 !important;
  font-weight: 700;
}

/* Manufacturer Accounts Payable page: same fix as Client Accounts
   Receivable -- turn the "Total Outstanding Manuf Invoices" text into a
   ribbon-badge matching .tile-ribbon.status-good. */
#manufAPPage #manage-category-search_box {
  margin: 0;
  padding: 9px 14px;
  border-radius: 7px;
  border-left: 3px solid #1f8a4c;
  background: #eaf7ef;
  font-size: 12.5px;
  line-height: 1.5;
  color: #1f2933;
  display: inline-block;
}
#manufAPPage #manage-category-search_box * {
  color: #1f2933 !important;
  font-weight: 700;
}

/* Paid Commission Report page: turn the "Total Sales Commission" /
   "Total Independent Sales Commission" text block into a ribbon-badge
   matching .tile-ribbon.status-good, instead of plain green text lines. */
#paidCommPage .col-4.p-l-38 {
  margin: 0;
  padding: 9px 14px;
  border-radius: 7px;
  border-left: 3px solid #1f8a4c;
  background: #eaf7ef;
  color: #1f2933;
  max-width: fit-content;
  flex: 0 0 auto;
}
#paidCommPage .col-4.p-l-38 .form-group {
  margin-bottom: 2px !important;
}
#paidCommPage .col-4.p-l-38 label,
#paidCommPage .col-4.p-l-38 strong {
  font-size: 12.5px;
  line-height: 1.5;
  color: #1f2933 !important;
  font-weight: 700;
}

/* Fix: the ribbon-badge above was stretching to the full row height
   (its Bootstrap .row parent default-stretches flex children). Keep it
   sized to its own content instead. */
#paidCommPage .col-4.p-l-38 {
  align-self: flex-start;
}

/* Paid Commission Report page: now that the ribbon-badge next to the
   buttons is taller (3 lines of text), vertically center the
   Search/Reset/Export button column against it instead of top-aligning. */
#paidCommPage .col-4.pt-2.text-center {
  align-self: center;
}

/* Fix: overriding padding shorthand on the ribbon-badge wiped out its
   original .p-l-38 left padding, and the Bootstrap .row's -15px negative
   margin then pulled it further left, so it sat flush against (or past)
   the card's edge with the green border barely visible. Push it back in
   to align with the card's normal left padding, like the other ribbons. */
#paidCommPage .col-4.p-l-38 {
  margin-left: 36px;
}

/* Paid Commission Report page: #paidCommPanel is nested inside a Bootstrap
   .row wrapper (with its -15px negative margins on both sides) that the
   other Finance pages don't have, so the table card rendered 30px wider
   and 15px further left than the filter card above it. Compensate with
   matching positive margins so both cards line up exactly. */
#paidCommPanel {
  margin-left: 15px;
  margin-right: 15px;
}

/* Fix: the table wrapper sits inside its own nested .row > .col-12 (with
   Bootstrap's default -15px row margin and 15px column padding), which
   the ribbon above it does not have, so the table rendered 30px narrower
   and 15px further right than the ribbon. Zero out that inner grid
   spacing so the table matches the ribbon's width exactly. */
#paidCommPanel .row {
  margin-left: 0;
  margin-right: 0;
}
#paidCommPanel .row > .col-12 {
  padding-left: 0;
  padding-right: 0;
}

/* Correction: #ManagePrdTable's actual parent is .col-12 (with Bootstrap's
   15px padding), nested directly inside #paidCommPanel itself -- not
   inside a separate .row as first assumed. That extra 15px padding on
   .col-12, stacked on top of #paidCommPanel's own padding, is what pushed
   the table 15px right and 30px narrower than the ribbon above it. */
#paidCommPanel > .col-12,
#paidCommPanel .row > .col-12 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Redo: split the single ribbon-badge into two separate ribbon-badges
   (one for "Total Sales Commission", one for "Total Independent Sales
   Commission"), each styled like .tile-ribbon.status-good, stacked with
   even spacing between them, and vertically centered as a group against
   the Search/Reset/Export button column beside it. */
#paidCommPage .col-4.p-l-38 {
  border-left: none !important;
  background: transparent !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 8px !important;
}
#paidCommPage .col-4.p-l-38 .form-group.row.m-0 {
  margin: 0 !important;
  padding: 7px 14px !important;
  border-radius: 7px;
  border-left: 3px solid #1f8a4c;
  background: #eaf7ef;
}
#paidCommPage .col-4.p-l-38 label,
#paidCommPage .col-4.p-l-38 strong {
  font-size: 12.5px;
  line-height: 1.5;
  color: #1f2933 !important;
  font-weight: 700;
}

/* Fix: the second ribbon's label ("Total Independent Sales Commission:")
   is long enough that, combined with the value's fixed .col-sm-5 (41.67%)
   width, it exceeded the ribbon's available width and wrapped to a new
   line under Bootstrap's default flex-wrap. Force both onto one line by
   preventing wrap and letting the value shrink to its own content width
   instead of a fixed column fraction, matching the first ribbon. */
#paidCommPage .col-4.p-l-38 .form-group.row.m-0 {
  flex-wrap: nowrap !important;
  align-items: baseline !important;
}
#paidCommPage .col-4.p-l-38 label.col-form-label {
  white-space: nowrap;
  flex: 0 0 auto !important;
  max-width: none !important;
  padding-top: 0;
  padding-bottom: 0;
}
#paidCommPage .col-4.p-l-38 .col-sm-5 {
  flex: 0 0 auto !important;
  max-width: none !important;
  width: auto !important;
  white-space: nowrap;
  padding-left: 6px !important;
}

/* Fix: the button column only occupies its fixed Bootstrap col-4 (33%)
   width, leaving a large empty gap between it and the card's right edge
   (the row has no third column to fill that space). Let the button
   column grow to fill the remaining row width and center its buttons
   horizontally within that full space, instead of hugging the left side
   of an otherwise-empty area. */
#paidCommPage .col-4.pt-2.text-center {
  flex: 1 1 auto !important;
  max-width: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Center the ribbon+button row vertically within the white space below
   the filter fields: it currently sits flush against the top (0px gap)
   with all the slack (~36px) pushed to the bottom. Split that slack
   evenly so both gaps match. */
#paidCommPage .col-4.p-l-38 {
  margin-top: 20px;
}

/* Fix: giving the button column flex:1 1 auto caused the outer .row
   (Bootstrap default flex-wrap:wrap) to wrap it onto its own line below
   the ribbon badges instead of sitting beside them. Force the row to a
   single line so both columns stay side by side. */
#paidCommPage .col-4.p-l-38 {
  flex-shrink: 0 !important;
}
#paidCommPage .row:where(.vcl0):not(.vfhz):not(.vfhz) {
  flex-wrap: nowrap !important;
}

/* Center the buttons within the full card tile width (matching the
   ribbon/table alignment), not just the leftover space beside the
   ribbon badges. Position the button column absolutely, spanning the
   card's true content width (compensating the outer .row's -15px
   margins), then center within that full span. */
#paidCommPage .row:where(.vcl0):not(.vfhz):not(.vfhz) {
  position: relative !important;
}
#paidCommPage .col-4.pt-2.text-center {
  position: absolute !important;
  left: 15px !important;
  right: 15px !important;
  top: 0 !important;
  width: auto !important;
  height: 100% !important;
}

/* Reduce the top/bottom gap around the ribbons+buttons: the form's own
   default 16px margin-bottom (on top of CardBody's 20px padding-bottom)
   was inflating the bottom gap to 36px. Zero it out so the bottom gap
   matches CardBody's 20px padding, and the ribbon's margin-top above
   was reduced to match (20px), giving a tighter, evenly balanced gap. */
#paidCommPage .Card.ListCard.Block3 .CardBody form {
  margin-bottom: 0 !important;
}

/* Match the ribbon text format to the reference ("Total Outstanding
   Manuf Invoices" on Manuf Accounts Payable): both label and value use
   the same dark green (#060), label bold, value normal weight. Our
   earlier rule forced the label to dark gray (#1f2933) -- fix it to the
   matching green, and leave the value's own inline green untouched. */
#paidCommPage .col-4.p-l-38 label.col-form-label {
  color: #060 !important;
  font-weight: bold;
}
#paidCommPage .col-4.p-l-38 .col-sm-5 {
  font-weight: normal;
}

/* Make "USD 0.00" (the value) match the bold weight of "Total Sales
   Commission:" (the label), overriding the earlier normal-weight rule. */
#paidCommPage .col-4.p-l-38 .col-sm-5 {
  font-weight: bold !important;
}

/* Client Accounts Receivable page: reduce the excess white space below
   the Search/Reset/Export buttons, caused by the filter form's default
   16px margin-bottom stacking on top of the card's own 20px padding. */
#clientARPage .Card.ListCard.Block3 .CardBody form {
  margin-bottom: 0 !important;
}

/* Fix: the ribbon-badge's own wrapper (.form-group.col-4.p-l-38.pt-3)
   carries a default 16px margin-bottom, adding to the gap below the
   buttons beyond the card's 20px padding. Zero it out for a tighter fit. */
#clientARPage .form-group.col-4.p-l-38.pt-3 {
  margin-bottom: 0 !important;
}

/* Manufacturer Accounts Payable page: same fix as Client Accounts
   Receivable -- reduce the excess white space below the Search/
   Reset/Export buttons, caused by two stacking default margins: the
   filter form's 16px margin-bottom, and the ribbon-badge wrapper's own
   16px margin-bottom. */
#manufAPPage .Card.ListCard.Block3 .CardBody form {
  margin-bottom: 0 !important;
}
#manufAPPage .form-group.col-4.p-l-38.pt-3 {
  margin-bottom: 0 !important;
}

/* Replace the green ribbon-badge color with red (matching the site's
   existing --rib-critical / --rib-critical-soft palette) on Manuf
   Accounts Payable and Paid Commission Report. */
#manufAPPage #manage-category-search_box,
#paidCommPage .col-4.p-l-38 .form-group.row.m-0 {
  border-left-color: #c23b3b !important;
  background: #fceded !important;
}
#manufAPPage #manage-category-search_box *,
#paidCommPage .col-4.p-l-38 label.col-form-label,
#paidCommPage .col-4.p-l-38 .col-sm-5 {
  color: #c23b3b !important;
}

/* Manuf Accounts Payable: keep the ribbon's red background/border, but
   revert the text color back to black instead of red. */
#manufAPPage #manage-category-search_box * {
  color: #000000 !important;
}

/* Paid Commission Report: change just the "USD 0.00" value text to
   black in both ribbons, keeping the label text red. */
#paidCommPage .col-4.p-l-38 .col-sm-5 {
  color: #000000 !important;
}

/* Paid Commission Report: shrink the "USD 0.00" value font-size from
   14px down to 12.5px, matching the ribbon label's font-size. */
#paidCommPage .col-4.p-l-38 .col-sm-5 {
  font-size: 12.5px !important;
}

/* Edit Estimate page redesign: the PHP markup already uses the same
   .ci-ribbon / .ci-status-badge / .ci-badge-* components styled
   elsewhere for Commercial Invoice / Telex / Packing Report generation
   forms, but the CSS for them was scoped to only those 3 pages. Extend
   the exact same styling to #estimateEditPage so the Estimate ID /
   Client / Status header renders as a modern ribbon instead of plain
   unstyled text. */
#estimateEditPage .ci-ribbon {
  display: flex;
  gap: 20px;
  align-items: center;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-top: 4px solid #008acd;
  border-radius: 6px;
  padding: 14px 18px;
  margin-top: 10px;
  margin-bottom: 10px;
}
#estimateEditPage .ci-ribbon-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-right: 20px;
  border-right: 1px solid #d8d7dc;
}
#estimateEditPage .ci-ribbon-item:last-child {
  border-right: none;
  padding-right: 0;
}
#estimateEditPage .ci-ribbon-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .4px;
  color: #6b7280;
  font-weight: 600;
}
#estimateEditPage .ci-ribbon-value {
  font-size: 16px;
  font-weight: 700;
  color: #292b2c;
}
#estimateEditPage .ci-status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  vertical-align: middle;
}
#estimateEditPage .ci-badge-neutral { background: #eef0f2; color: #55595c; }
#estimateEditPage .ci-badge-warning { background: #fff3cd; color: #8a6d1d; }
#estimateEditPage .ci-badge-info    { background: #d6ecff; color: #0a5aa8; }
#estimateEditPage .ci-badge-success { background: #d9f2e3; color: #1c7a43; }
#estimateEditPage .ci-badge-danger  { background: #fbdcdc; color: #a3252c; }

/* Estimate details card (admin_estimate_po_details.php): restructured
   from a table/th/td layout into a div-based card grid with labels
   above each field, matching the site's modern SaaS card style. */
.ed-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  margin-bottom: 10px;
  overflow: hidden;
}
.ed-card-head {
  padding: 12px 18px;
  border-bottom: 1px solid #e2e8f0;
  background: #fafbfc;
}
.ed-card-head h2 {
  font-size: 15px;
  font-weight: 700;
  margin: 0;
  color: #1f2933;
}
.ed-card-body {
  padding: 18px;
}
#estimateEditPage .ed-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px 18px;
}
#estimateEditPage .ed-f {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
#estimateEditPage .ed-f.ed-span2 {
  grid-column: span 2;
}
#estimateEditPage .ed-f label {
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
}
#estimateEditPage .ed-f label input[type=checkbox] {
  margin-right: 4px;
  vertical-align: -1px;
}
#estimateEditPage .ed-f input[type=text],
#estimateEditPage .ed-f select,
#estimateEditPage .ed-f textarea {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 7px 9px !important;
  font-size: 13px;
  color: #1f2933;
  width: 100% !important;
  box-sizing: border-box;
}
#estimateEditPage .ed-f input[readonly] {
  background: #f8fafc !important;
}
#estimateEditPage .ed-inline {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
#estimateEditPage .ed-inline select { width: auto !important; }
#estimateEditPage .ed-inline input[type=text] { width: 80px !important; }
#estimateEditPage .ed-price {
  font-size: 12px;
  color: #64748b;
  font-weight: 600;
}
#estimateEditPage .ed-readonly {
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 7px 9px;
  background: #f8fafc;
  font-size: 13px;
  color: #1f2933;
}
#estimateEditPage .ed-readonly.ed-bold { font-weight: 700; }
#estimateEditPage .ed-readonly.ed-blue { color: #008acd; }
#estimateEditPage .ed-f .btn.btn-green {
  border-radius: 6px;
  padding: 8px 20px;
}


/* Estimate ribbon: push the new financial metrics (TTL Inv. Cost,
   Profit Margin, TTL Amount) to the right side of the ribbon, matching
   the artifact's summary strip, and give them a slightly larger bold
   value like the id/client/status items. */
#estimateEditPage .ci-ribbon-spacer {
  flex: 1;
}
#estimateEditPage .ci-ribbon-metric .ci-ribbon-value {
  font-size: 15px;
}

/* Match the artifact: Estimate ID value in blue, and the red status pill
   gets a left border accent like the artifact's status-badge. */
#estimateEditPage .ci-ribbon-item:first-child .ci-ribbon-value {
  color: #008acd;
}
body:where(.vch0):not(#vfhz) .ci-status-badge{border-left:4px solid !important;padding-left:10px !important;}


/* Match select dropdown and textarea heights to the text input fields
   in the Estimate details card, so all field controls line up evenly. */
#estimateEditPage .ed-f select {
  height: 35.7px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
#estimateEditPage .ed-f textarea {
  height: 35.7px;
  min-height: 35.7px !important;
  resize: vertical;
}

/* Estimate details card: Reset button (btn_reset_cont_vol) was still
   green like Save -- switch to the standard gray used for Reset
   elsewhere, with a matching blue hover. */
#estimateEditPage input[name="btn_reset_cont_vol"].btn.btn-green {
  background-color: #555555 !important;
  border-color: #555555 !important;
  color: #ffffff !important;
}
#estimateEditPage input[name="btn_reset_cont_vol"].btn.btn-green:hover {
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  color: #fff !important;
}

/* Estimate details card: Save button was stretching to fill its grid
   cell (100% width, inherited from the general .ed-f input rule),
   resizing with the window. Give it a fixed, standard button width
   instead, left-aligned in its cell like Reset. */
#estimateEditPage input[name="save_estimate_po"].btn.btn-green {
  width: auto !important;
  min-width: 100px;
  padding: 8px 24px !important;
}

/* Fix: the Save button sits in a flex-column .ed-f container with
   default align-items:stretch, so width:auto alone wasn.t enough -- it
   still stretched to the container.s cross-axis width. Opt it out of
   stretching. */
#estimateEditPage input[name="save_estimate_po"].btn.btn-green {
  align-self: flex-start !important;
}

/* Match the Estimate details card exactly to the artifact: 10px radius
   (same as the ribbon/summary card), and remove the divider line under
   the "Estimate details" header. */
.ed-card {
  border-radius: 10px !important;
}
.ed-card-head {
  border-bottom: none !important;
}

/* Fix: #InvoiceTable (the old table-based panel wrapper) still had its
   own 1px border/background from the original design, showing through
   as a visible outline behind the new rounded .ed-card. Remove it since
   the card now provides its own border/shadow. */
#estimateEditPage #InvoiceTable.content {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* Extend the summary ribbon to match the Estimate details card's width:
   the ribbon sits one level shallower in the Bootstrap grid than the
   card (which is nested inside the include file's own row/col-12), so
   it rendered 15px narrower and inset 7.5px further from each edge. */
#estimateEditPage .ci-ribbon.estimateInfoRibbon {
  margin-left: -7.5px !important;
  margin-right: -7.5px !important;
  border-right: none !important;
}
#estimateEditPage .ci-ribbon.estimateInfoRibbon .ci-ribbon-item:nth-child(3) {
  border-right: none !important;
}

/* Estimate details card: show the last-saved timestamp in the header,
   positioned to the right like the artifact's card-head hint. */
.ed-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#estimateEditPage .ed-hint {
  font-size: 12px;
  color: #64748b;
}

/* Estimate Details header: remove the gray background fill and any
   divider line, so it sits flush and plain within the white card. */
.ed-card-head {
  background: transparent !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

/* Remove the native site h2 border-bottom under "Estimate Details". */
.ed-card-head h2 {
  border-bottom: none !important;
}

/* Add back the card-head divider, matching the artifact's exact style
   (light gray #e2e8f0, on the .ed-card-head container itself rather
   than the native site's h2 border). */
.ed-card-head {
  border-bottom: 1px solid #e2e8f0 !important;
}

/* Line items table: give #ResortTable the same rounded-card treatment
   (border, radius, clipped overflow so the blue header respects the
   rounded top corners) as the rest of the redesigned page. */
#estimateEditPage #ResortTable.content.bluehead {
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}
#estimateEditPage #ResortTable.content.bluehead table.table {
  margin-bottom: 0 !important;
}

/* Comments/attachments card: bump radius from the native 6px to 10px,
   matching the ribbon and Estimate Details card radius. */
.Card {
  border-radius: 10px !important;
}

/* Full redesign pass: Line Items, Comments/Attachments, and Additional
   Order Cost sections, matching the Estimate Details / summary ribbon
   card style established earlier. */

/* Line Items: section header sitting above the toggles + table. */
#estimateEditPage .ed-section-head {
  margin-top: 4px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e2e8f0;
}
#estimateEditPage .ed-section-head h2 {
  font-size: 15px;
  font-weight: 700;
  color: #1f2933;
  margin: 0;
  border-bottom: none !important;
}

/* Comments and Attachments: card-head title + spacing under it. */
.Card .ed-card-head {
  padding: 14px 18px;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 4px;
}
.Card .ed-card-head h2 {
  border-bottom: none !important;
}
.Card .CardBody > .row {
  padding: 4px 4px 14px;
}
#estimateEditPage .col-6.left-space-30 .form-group.row:nth-of-type(2) .col-sm-12 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
#estimateEditPage .col-6.left-space-30 .form-group.row:nth-of-type(2) .col-sm-12 input.btn {
  flex: 1 1 calc(50% - 5px);
  margin: 0 !important;
}

/* Additional Order Cost: full card treatment. */
.ed-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
.ed-card > .row:first-child {
  padding: 14px 18px;
  border-bottom: 1px solid #e2e8f0;
  margin: 0;
}
.ed-card > .row:first-child h2 {
  font-size: 15px;
  font-weight: 700;
  color: #1f2933;
  margin: 0;
  border-bottom: none !important;
}
.ed-card > .row:last-child {
  padding: 14px 18px;
  margin: 0;
}
.ed-card table.table thead.thead-dark th {
  background: #1f2933;
}


/* Fix: target the action button container by its actual class
   (.col-sm-12.text-left) instead of an unreliable :nth-of-type. */
#estimateEditPage .col-6.left-space-30 .col-sm-12.text-left {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
}
#estimateEditPage .col-6.left-space-30 .col-sm-12.text-left input.btn {
  flex: 1 1 calc(50% - 5px);
  margin: 0 !important;
}

/* Line Items: true single card matching the artifact -- head with
   title+buttons, gray toggles sub-bar, edge-to-edge table, and a
   footer actions-row for the note + Save button. */
#estimateEditPage .ed-lineitems-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}
#estimateEditPage .ed-lineitems-card > .ed-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid #e2e8f0;
  margin: 0;
}
#estimateEditPage .ed-lineitems-card > .ed-card-head h2 {
  font-size: 15px;
  font-weight: 700;
  color: #1f2933;
  margin: 0;
  border-bottom: none !important;
}
#estimateEditPage .ed-head-actions {
  display: flex;
  gap: 10px;
}
#estimateEditPage .ed-head-actions a {
  text-decoration: none;
}
/* Toggles sub-bar */
#estimateEditPage .ed-lineitems-card > .row:nth-of-type(1) {
  padding: 12px 18px;
  background: #fafbfc;
  border-bottom: 1px solid #e2e8f0;
  margin: 0;
}
/* Resort/country + table row: no side padding so table sits flush */
#estimateEditPage .ed-lineitems-card #ResortTable.content.bluehead {
  border: none !important;
  border-radius: 0 !important;
}
#estimateEditPage .ed-lineitems-card .coloredsortbar {
  padding: 12px 18px 0;
}
/* Footer actions row */
#estimateEditPage .ed-lineitems-card > .row:last-of-type {
  display: flex;
  align-items: center;
  padding: 14px 18px;
  background: #fafbfc;
  border-top: 1px solid #e2e8f0;
  margin: 0;
}

/* Line items table: match the artifact tile-table style exactly. */
#estimateEditPage .ed-lineitems-card table.table {
  border-collapse: collapse;
  font-size: 13px;
}
#estimateEditPage .ed-lineitems-card table.table thead th {
  background: #008acd !important;
  color: #fff !important;
  font-weight: 700;
  font-size: 11.5px;
  letter-spacing: .02em;
  padding: 10px 12px !important;
  border: none !important;
  vertical-align: middle;
}
#estimateEditPage .ed-lineitems-card table.table tbody td {
  padding: 8px 10px !important;
  border: none !important;
  border-bottom: 1px solid #e2e8f0 !important;
  vertical-align: middle;
}
#estimateEditPage .ed-lineitems-card table.table.table-striped tbody tr:nth-of-type(odd) {
  background-color: #f8fafc;
}
#estimateEditPage .ed-lineitems-card table.table tbody tr:hover td {
  background-color: #eef5fb;
}
#estimateEditPage .ed-lineitems-card table.table tfoot td,
#estimateEditPage .ed-lineitems-card table.table tbody tr:last-child td {
  font-weight: 700;
  background: #f1f5f9 !important;
  border-top: 2px solid #e2e8f0 !important;
}
#estimateEditPage .ed-lineitems-card table.table input[type=text],
#estimateEditPage .ed-lineitems-card table.table select.form-control {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 5px 6px !important;
  font-size: 12.5px !important;
  height: auto !important;
}
#estimateEditPage .ed-lineitems-card table.table tbody tr td:first-child input {
  width: 30px;
  height: 26px;
  text-align: center;
  padding: 3px !important;
}


/* Toggles: flex-wrap checkbox row matching the artifact. */
#estimateEditPage .ResortData {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  list-style: none;
  margin: 0;
  padding: 0;
}
#estimateEditPage .ResortData li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: #1f2933;
  font-weight: 500;
}
#estimateEditPage .ResortData input[type=checkbox] {
  margin: 0;
}

/* Legend: small colored dots matching the artifact. */
#estimateEditPage .ColorLegend.colorbg {
  display: flex;
  gap: 14px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 12px;
  color: #64748b;
  align-items: center;
}
#estimateEditPage .ColorLegend.colorbg li {
  display: flex;
  align-items: center;
  padding-left: 0 !important;
  background: none !important;
}
#estimateEditPage .ColorLegend.colorbg li::before {
  content: "";
  display: inline-block !important;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 6px;
  background: #94a3b8;
}
#estimateEditPage .ColorLegend.colorbg li.modified::before { background: #e0a83a; }
#estimateEditPage .ColorLegend.colorbg li.added::before { background: #1f8a4c; }
#estimateEditPage .ColorLegend.colorbg li.delet::before { background: #c23b3b; }


/* Keep the Line Items card background pure white throughout, matching
   the other cards -- remove the gray tints from the toggles bar,
   footer actions row, and Total row; use borders for separation
   instead of fill color. */
#estimateEditPage .ed-lineitems-card > .row:nth-of-type(1) {
  background: #fff !important;
}
#estimateEditPage .ed-lineitems-card > .row:last-of-type {
  background: #fff !important;
}
#estimateEditPage .ed-lineitems-card table.table tfoot td,
#estimateEditPage .ed-lineitems-card table.table tbody tr:last-child td {
  background: #fff !important;
  border-top: 2px solid #e2e8f0 !important;
}

/* Fix: .coloredsortbar (native site class) carries its own gray-blue
   background and wraps the whole table+footer area, showing through
   as an unwanted tint. Force it white within the redesigned card. */
#estimateEditPage .ed-lineitems-card .coloredsortbar {
  background: #fff !important;
}

/* Line items table: allow horizontal scrolling (was clipped by
   overflow:hidden on the card wrapper) with a thin styled scrollbar,
   while the outer card keeps its own overflow:hidden for rounded
   corners. */
#estimateEditPage .ed-lineitems-card #ResortTable.content.bluehead {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 #f1f5f9;
}
#estimateEditPage .ed-lineitems-card #ResortTable.content.bluehead::-webkit-scrollbar {
  height: 8px;
}
#estimateEditPage .ed-lineitems-card #ResortTable.content.bluehead::-webkit-scrollbar-track {
  background: #f1f5f9;
}
#estimateEditPage .ed-lineitems-card #ResortTable.content.bluehead::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
#estimateEditPage .ed-lineitems-card #ResortTable.content.bluehead::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Container Capacity button: use the artifact.s btn-outline style
   (light blue fill, dark blue text) instead of the current gray. */
#estimateEditPage #Containers.btn-green {
  background-color: #e8f3fa !important;
  border-color: #e8f3fa !important;
  color: #08517c !important;
}
#estimateEditPage #Containers.btn-green:hover {
  background-color: #0a6ea8 !important;
  border-color: #0a6ea8 !important;
  color: #fff !important;
}

/* Reverse the visual order of the Line Items header buttons
   (Container Capacity before Add Item) via flex row-reverse, without
   touching the underlying markup/handlers. Bold the button text. */
#estimateEditPage .ed-head-actions {
  flex-direction: row-reverse;
}
#estimateEditPage .ed-head-actions input.btn-green {
  font-weight: 700 !important;
}

/* Line Items header buttons were rendering in ALL CAPS via the native
   .btn text-transform. Restore normal title case: "Container Capacity"
   and "Add Item". */
#estimateEditPage .ed-head-actions input.btn-green {
  text-transform: none !important;
}

/* Fix: the toggles row.s :nth-of-type(1) selector wasn.t matching, so
   the checkbox list rendered flush against the card edge instead of
   aligned with the table/title. Target .ResortData directly. */
#estimateEditPage .ed-lineitems-card .ResortData {
  margin-left: 18px !important;
}
#estimateEditPage .ed-lineitems-card .ColorLegend.colorbg {
  margin-right: 18px !important;
}

/* Add breathing room between the Resort/Country row and the table
   below it. */
#estimateEditPage .ed-lineitems-card .coloredsortbar {
  padding-bottom: 14px !important;
}

/* Fix: padding-bottom on .coloredsortbar doesn.t push its sibling row
   (the table) down -- use margin-bottom instead. */
#estimateEditPage .ed-lineitems-card .coloredsortbar {
  margin-bottom: 14px !important;
}

/* Fix: the Resort/Country filter row and the table row are BOTH direct
   children of .coloredsortbar (siblings), not the table being outside
   it -- target the filter row itself for the gap. */
#estimateEditPage .ed-lineitems-card .coloredsortbar > .row:first-child {
  margin-bottom: 14px !important;
}

/* Remove the native gray strip background from the legend, leaving
   just the colored dots + text on transparent/white. */
#estimateEditPage .ColorLegend.colorbg {
  background: transparent !important;
}

/* Match the Resort button.s size/shape to the Reset button used
   elsewhere on the page (colors already matched). */
#estimateEditPage #btnsort.btn.btn-secondary.btn-sm {
  padding: 8px 20px !important;
  font-size: 14px !important;
  border-radius: 6px !important;
}

/* Vertically center the legend against the (possibly 2-line wrapped)
   checkbox toggles row, instead of sitting top-aligned/disconnected. */
#estimateEditPage .ed-lineitems-card .ResortData {
  align-items: center;
}
#estimateEditPage .ed-lineitems-card .col-4:where(.vcl1):not(.vfhz) {
  display: flex;
  align-items: center;
}

/* Add space between the card-head divider line and the checkbox
   toggles row below it. */
#estimateEditPage .ed-lineitems-card > .row:first-of-type {
  margin-top: 14px !important;
}

/* Fix: :first-of-type is tag-based (matches first DIV overall, which
   is the card-head, not the toggles row) so it never matched. Target
   .ResortData directly instead. */
#estimateEditPage .ed-lineitems-card .ResortData {
  margin-top: 14px !important;
}

/* Right-align the legend strip with the Add Item button above it. */
#estimateEditPage .ed-lineitems-card .ColorLegend.colorbg {
  margin-right: 0 !important;
}
#estimateEditPage .ed-lineitems-card .col-4:where(.vcl1):not(.vfhz) {
  justify-content: flex-end;
}

/* Fine-tune: match legend right edge exactly to Add Item button. */
#estimateEditPage .ed-lineitems-card .ColorLegend.colorbg {
  margin-right: 18px !important;
}

/* Match the table header to the artifact.s --primary color exactly
   (#0a6ea8), replacing the earlier #008acd. */
#estimateEditPage .ed-lineitems-card table.table thead th {
  background: #0a6ea8 !important;
}

/* Match Container Capacity and Add Item hover color to the Reset
   button.s hover (#0069d9). */
#estimateEditPage #Containers.btn-green:hover {
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  color: #fff !important;
}
#estimateEditPage .ed-head-actions input.btn-green:hover {
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  color: #fff !important;
}

/* Comments and Attachments: match the artifact.s action-grid (2-col
   button layout) for the Import/Export/Calculate Volume/Purchase
   Order/Manuf Export buttons. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn {
  width: 100% !important;
  margin: 0 !important;
}


/* File attachment rows: bordered chip style matching the artifact
   .file-list li. */
.Card [id^="row_misc_doc"] {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  font-size: 12.5px;
  padding: 7px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #f8fafc;
  margin-bottom: 6px;
  float: none !important;
}
.Card [id^="row_misc_doc"] a {
  color: #0a6ea8;
  text-decoration: none;
  font-weight: 600;
}
.Card [id^="row_misc_doc"] img {
  filter: invert(28%) sepia(64%) saturate(1934%) hue-rotate(335deg) brightness(90%) contrast(89%);
}

/* File picker buttons: bordered white fake-btn matching the artifact. */
.Card input[type=file] {
  border: 1px solid #e2e8f0 !important;
  border-radius: 7px !important;
  background: #fff !important;
  padding: 6px 10px !important;
  font-size: 12.5px !important;
}


/* Fix: the .col-sm-12.text-left container was CSS Grid with 2 columns,
   but the &nbsp;&nbsp; text runs between buttons in the PHP markup
   create their own anonymous grid items, pushing each real button into
   its own row. Use font-size:0 to collapse those whitespace runs to
   zero width, restoring normal button font-size on the buttons
   themselves. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left {
  font-size: 0 !important;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn {
  font-size: 13.5px !important;
}

/* Fix: explicit grid placement for the 5 action buttons, bypassing
   auto-placement entirely since the &nbsp; text runs between them
   still occupy grid cells regardless of their rendered size. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(1) {
  grid-column: 1; grid-row: 1;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(2) {
  grid-column: 2; grid-row: 1;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(3) {
  grid-column: 1; grid-row: 2;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(4) {
  grid-column: 2; grid-row: 2;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(5) {
  grid-column: 1; grid-row: 3;
}

/* Match Import/Export/Calculate Volume/Purchase Order to the
   Container Capacity button.s light-blue outline color scheme. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(1),
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(2),
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(3),
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(4) {
  background-color: #e8f3fa !important;
  border-color: #e8f3fa !important;
  color: #08517c !important;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(1):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(2):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(3):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(4):hover {
  background-color: #0a6ea8 !important;
  border-color: #0a6ea8 !important;
  color: #fff !important;
}

/* Bold text for all 5 Comments and Attachments action buttons. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn {
  font-weight: 700 !important;
}

/* Match Import/Export/Calculate Volume/Purchase Order hover color to
   the Manuf Export button.s hover (#008fd2). */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(1):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(2):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(3):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(4):hover {
  background-color: #008fd2 !important;
  border-color: #008fd2 !important;
  color: #fff !important;
}

/* Correction: use the Reset button.s hover blue (#0069d9), not Manuf
   Export.s, for Import/Export/Calculate Volume/Purchase Order. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(1):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(2):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(3):hover,
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(4):hover {
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  color: #fff !important;
}

/* Manuf Export: match the artifact.s .btn-dark color exactly (dark
   navy #1f2933, hover to --primary #0a6ea8), spanning both grid
   columns like the artifact. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(5) {
  background-color: #1f2933 !important;
  border-color: #1f2933 !important;
  color: #fff !important;
  grid-column: 1 / span 2 !important;
}
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(5):hover {
  background-color: #0a6ea8 !important;
  border-color: #0a6ea8 !important;
  color: #fff !important;
}

/* Fix: .EstFileUpld list items were laid out side-by-side (flex row),
   so the Choose Files box and file rows sat to the right of the
   checkbox instead of below/aligned with it. Stack them vertically. */
#estimateEditPage .EstFileUpld {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

/* Reduce the Comments and Attachments card header height. */
.Card .ed-card-head {
  padding: 8px 18px !important;
}

/* Add 6px more space below the Comments and Attachments header
   divider (4px -> 10px total). */
.Card .ed-card-head {
  margin-bottom: 10px !important;
}

/* Line Items, Comments and Attachments, Additional Order Cost: each
   in its own card, separated by exactly 8px. */
#estimateEditPage .ed-lineitems-card {
  margin-bottom: 8px !important;
}
.Card {
  margin-bottom: 8px !important;
}
#estimateEditPage .ed-lineitems-card ~ .ed-card {
  margin-bottom: 8px !important;
  margin-top: 0 !important;
}
/* Remove the surrounding row/col wrapper spacing that was adding
   extra gap beyond the card margins. */
#estimateEditPage .row.justify-content-center {
  margin: 0 !important;
}
#estimateEditPage .row.justify-content-center > .col-12 {
  padding: 0 !important;
}

/* Tighten the Send Email row (between Comments and Additional Order
   Cost) so the total gap between those two cards is close to 8px. */
#estimateEditPage hr {
  margin: 4px 0 !important;
}
#estimateEditPage .form-group.row:where(.vcl2):not(.vfhz):not(vfhz),
#estimateEditPage .form-group.row:where(.vcl3):not(.vfhz) {
  margin: 0 !important;
  padding: 0 !important;
}

/* Fix: #estimateEditPage actually closes right after the Comments
   card, so hr/Additional-Order-Cost sit OUTSIDE that scope. Target
   them via the .Card sibling relationship instead. */
.Card ~ hr {
  margin: 4px 0 !important;
}
.Card ~ .form-group.row {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

/* Fix: hr is a direct child of .content-wrapper, not a sibling of
   .Card. Target it directly via that container, scoped to this
   page by the estimate edit form context. */
.MainContainer.content-wrapper > hr {
  margin: 4px 0 !important;
}
.MainContainer.content-wrapper > .form-group.row {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

/* Close remaining gap: the .row/.col-12 wrapping the Comments card
   still had residual bottom spacing. */
.MainContainer.content-wrapper .row.justify-content-center {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.MainContainer.content-wrapper .row.justify-content-center .col-12 {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Fix: #estimateEditPage.ContentArea has a native 44px padding-bottom,
   which shows as extra space after Line Items (its last child)
   before the Comments card that sits outside it. */
#estimateEditPage.ContentArea {
  padding-bottom: 0 !important;
}

/* Final fix: .Card.s native margin-bottom (2rem/32px from global.css)
   was outweighing our earlier 8px override somewhere in the cascade.
   Re-assert at the very end of the file with a more specific
   selector to guarantee it wins. */
.MainContainer.content-wrapper .Card {
  margin-bottom: 8px !important;
}

/* Compact the hr divider and Send Email checkbox row further, since
   they.re real content sitting between Comments and Additional
   Order Cost (matching the artifact.s send-row, just not physically
   relocated into the card). */
.MainContainer.content-wrapper > hr {
  height: 1px !important;
  margin: 2px 0 !important;
  border: none !important;
  background: #e2e8f0 !important;
}
.MainContainer.content-wrapper > .form-group.row {
  line-height: 1.2 !important;
}
.MainContainer.content-wrapper > .form-group.row label,
.MainContainer.content-wrapper > .form-group.row .col-sm-12 {
  margin: 0 !important;
  padding: 2px 0 !important;
}

/* Match "Comments and Attachments" title font to "Line Items"
   exactly (15px, weight 700, dark ink color, not the native green). */
.Card .ed-card-head h2 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1f2933 !important;
}

/* Restore title case for the 5 action buttons (Import/Export/
   Calculate Volume/Purchase Order/Manuf Export), overriding the
   native ALL CAPS text-transform. */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn {
  text-transform: none !important;
}

/* Match Manuf Export hover to the Reset button.s hover (#0069d9),
   correctly scoped via .Card (not the broken #estimateEditPage
   prefix). */
.Card .col-6.left-space-30 .form-group.row .col-sm-12.text-left input.btn:nth-of-type(5):hover {
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  color: #fff !important;
}

/* Fix: re-apply the Attachments checkbox/file-list stacking fix with
   correct scoping (.Card, not the broken #estimateEditPage prefix). */
.Card .EstFileUpld {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

/* Match the Comment and Manufacturer Comment textareas. outline to
   the Estimate Details comment field (light border, 6px radius). */
.Card textarea[name="comment"],
.Card textarea[name="ManufComment"] {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
}
.Card textarea[name="comment"]:focus,
.Card textarea[name="ManufComment"]:focus {
  outline: none;
  box-shadow: 0 0 0 3px #e8f3fa !important;
  border-color: #0a6ea8 !important;
}

/* Align the Comments and Attachments card width to match the Line
   Items card above it (was 20px wider on each side). */
.MainContainer.content-wrapper .row.justify-content-center {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* Fine-tune: close the remaining 5px on the right edge. */
.MainContainer.content-wrapper .row.justify-content-center {
  padding-right: 25px !important;
}

/* Fix direction: reduce padding-right (not increase) to extend the
   right edge to match Line Items exactly. */
.MainContainer.content-wrapper .row.justify-content-center {
  padding-right: 15px !important;
}

/* Match the Line Items -> Comments gap (was 8px) to the Estimate
   Details -> Line Items gap (30px). */
.ed-lineitems-card {
  margin-bottom: 30px !important;
}

/* Fix: #estimateEditPage .ed-lineitems-card (higher specificity) was
   still winning at 8px. Match that specificity to override. */
#estimateEditPage .ed-lineitems-card {
  margin-bottom: 30px !important;
}

/* Fix: the page footer (.footer) uses position:absolute with a stale
   fixed top value that doesn.t track the page.s actual height (which
   grew after our card-spacing changes), so it renders mid-page
   instead of at the bottom. Make it a normal flow element. */
body.sidebar-mini > div.footer {
  position: static !important;
  top: auto !important;
}

/* Fix v2: keep position:absolute (matches original site pattern) but
   anchor to bottom:0 instead of a stale top value, so it tracks the
   body.s actual (now taller) height correctly. */
body.sidebar-mini > div.footer {
  position: absolute !important;
  top: auto !important;
  bottom: 0 !important;
}

/* Fix v3: body has position:static, so absolute+bottom:0 on the
   footer was resolving against the viewport (initial containing
   block), not the body.s actual content height. Give body a
   positioning context so bottom:0 correctly tracks full page height. */
body.sidebar-mini {
  position: relative !important;
}

/* Visually relocate the Send Email checkboxes to the bottom of the
   Comments and Attachments card (merged as a footer strip), without
   physically moving the underlying conditional PHP markup. */
.MainContainer.content-wrapper .row.justify-content-center .Card {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom: none !important;
}
.MainContainer.content-wrapper > hr {
  display: none !important;
}
.MainContainer.content-wrapper > .form-group.row {
  padding-left: 20px !important;
  padding-right: 20px !important;
  margin-top: -1px !important;
  background: #fafbfc !important;
  border: 1px solid #e2e8f0 !important;
  border-top: 1px solid #e2e8f0 !important;
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}
.MainContainer.content-wrapper > .form-group.row .col-sm-12 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Match Comments and Attachments header height to Estimate Details
   (51.6px) by fixing height directly and centering content. */
.Card .ed-card-head {
  height: 36px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
}

/* Remove the divider line under the Comments and Attachments
   header. */
.Card .ed-card-head {
  border-bottom: none !important;
}

/* Restore the bottom border on the Comments and Attachments header,
   matching the Line Items header divider style. */
.Card .ed-card-head {
  border-bottom: 1px solid #e2e8f0 !important;
}

/* Extend the Comments and Attachments header border to the full
   width of the card (was inset ~23px on each side). */
.Card .ed-card-head {
  margin-left: -23px !important;
  margin-right: -23px !important;
  padding-left: 23px !important;
  padding-right: 23px !important;
}

/* Reduce the space below the Save Items button (Line Items footer). */
#estimateEditPage .ed-lineitems-card .col-12 > .row:where(.vcl4):not(.vfhz):not(vfhz) {
  padding-bottom: 8px !important;
}

/* Reduce the Line Items footer row height further (smaller Save
   Items button + tighter padding). */
#estimateEditPage .ed-lineitems-card .col-12 > .row:where(.vcl4):not(.vfhz):not(vfhz) {
  padding-bottom: 4px !important;
}


/* Reduce the space between file rows under Choose Files. A native
   <br> tag between each [id^=row_misc_doc] span adds extra line-
   height; collapse it with font-size:0 on the li, restoring normal
   font-size on the actual content. */
.Card .EstFileUpld li:where(.vcl5):not(.vfhz) {
  font-size: 0 !important;
}
.Card .EstFileUpld li [id^="row_misc_doc"] {
  font-size: 12.5px !important;
  margin-bottom: 4px !important;
}

/* Additional Order Cost: add a card-head style divider/padding under
   the title, matching Line Items and Comments. Also fix the SAVE
   button.s ALL CAPS to title case. */
.MainContainer.content-wrapper > .ed-card > .row:first-child {
  padding: 14px 18px !important;
  border-bottom: 1px solid #e2e8f0 !important;
  margin: 0 !important;
}
.MainContainer.content-wrapper > .ed-card input[type=submit][value="Save"],
.MainContainer.content-wrapper > .ed-card input[type=button][value="Save"] {
  text-transform: none !important;
}

/* Additional Order Cost: match Line Items card width, table header
   color, row striping, cell spacing, add-button casing, and delete-
   icon styling. */
.MainContainer.content-wrapper > .ed-card {
  margin-left: 20px !important;
  margin-right: 15px !important;
}
.MainContainer.content-wrapper > .ed-card table.table thead th {
  background: #0a6ea8 !important;
}
.MainContainer.content-wrapper > .ed-card table.table tbody td {
  padding: 8px 10px !important;
  border: none !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}
.MainContainer.content-wrapper > .ed-card table.table.table-striped tbody tr:nth-of-type(odd) td {
  background-color: #f8fafc !important;
}
.MainContainer.content-wrapper > .ed-card table.table tbody tr:hover td {
  background-color: #eef5fb !important;
}
.MainContainer.content-wrapper > .ed-card table.table tbody tr:last-child td,
.MainContainer.content-wrapper > .ed-card table.table tfoot td {
  font-weight: 700 !important;
  background: #f1f5f9 !important;
  border-top: 2px solid #e2e8f0 !important;
}
.MainContainer.content-wrapper > .ed-card input.btn-green {
  text-transform: none !important;
}
.MainContainer.content-wrapper > .ed-card table.table tbody td a {
  color: #c23b3b !important;
}

/* Match Save and Add (+) button hover color (Additional Order Cost)
   to the Reset button.s hover (#0069d9). */
.MainContainer.content-wrapper > .ed-card input.btn-green:hover {
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  color: #fff !important;
}

/* Reduce the Additional Order Cost table header height, matching
   Line Items table header padding. */
.MainContainer.content-wrapper > .ed-card table.table thead th {
  padding: 10px 12px !important;
  font-size: 11.5px !important;
  vertical-align: middle !important;
}

/* Match Additional Order Cost table header font to Line Items exactly
   (weight 700, letter-spacing 0.23px). */
.MainContainer.content-wrapper > .ed-card table.table thead th {
  font-weight: 700 !important;
  letter-spacing: 0.23px !important;
}

/* Increase Additional Order Cost table header text size. */
.MainContainer.content-wrapper > .ed-card table.table thead th {
  font-size: 13px !important;
}

/* Unbold the Line Items table header text. */
.ed-lineitems-card table.table thead th {
  font-weight: 400 !important;
}

/* Match Additional Order Cost input fields to the Estimate Details
   field style (light border, 6px radius, consistent padding). */
.MainContainer.content-wrapper > .ed-card table.table tbody input[type=text],
.MainContainer.content-wrapper > .ed-card table.table tbody input[type=number] {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 6px 8px !important;
  background: #fff !important;
}
.MainContainer.content-wrapper > .ed-card table.table tbody input[type=text]:focus,
.MainContainer.content-wrapper > .ed-card table.table tbody input[type=number]:focus {
  outline: none;
  box-shadow: 0 0 0 3px #e8f3fa !important;
  border-color: #0a6ea8 !important;
}

/* Match the Specification column textareas (Additional Order Cost)
   to the Estimate Details field style too. */
.MainContainer.content-wrapper > .ed-card table.table tbody textarea {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 6px 8px !important;
  background: #fff !important;
}
.MainContainer.content-wrapper > .ed-card table.table tbody textarea:focus {
  outline: none;
  box-shadow: 0 0 0 3px #e8f3fa !important;
  border-color: #0a6ea8 !important;
}

/* Change Additional Order Cost table header from blue to navy blue. */
.MainContainer.content-wrapper > .ed-card table.table thead th {
  background: #1a3a63 !important;
}

/* Match the Save button (btn-primary) hover to the Add (+) button
   hover in Additional Order Cost. */
.MainContainer.content-wrapper > .ed-card input.btn-primary:hover {
  background-color: #0069d9 !important;
  border-color: #0069d9 !important;
  color: #fff !important;
}

/* Show "Save Additional Cost" in title case, not ALL CAPS. */
.MainContainer.content-wrapper > .ed-card input#btnSaveCost {
  text-transform: none !important;
}

/* Match the Add (+) button (Additional Order Cost) to the Container
   Capacity button color scheme. */
.MainContainer.content-wrapper > .ed-card input.btn-green {
  background-color: #e8f3fa !important;
  border-color: #e8f3fa !important;
  color: #08517c !important;
}
.MainContainer.content-wrapper > .ed-card input.btn-green:hover {
  background-color: #0a6ea8 !important;
  border-color: #0a6ea8 !important;
  color: #fff !important;
}

/* Match the "United States" (Resort) dropdown to the Estimate Details
   select field style. */
.ed-lineitems-card .coloredsortbar select {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 6px 9px !important;
  background: #fff !important;
  height: auto !important;
}
.ed-lineitems-card .coloredsortbar select:focus {
  outline: none;
  box-shadow: 0 0 0 3px #e8f3fa !important;
  border-color: #0a6ea8 !important;
}

/* Modernize the native "Choose File(s)" button to match the dropdown
   style (light blue background, rounded corners, dark blue text). */
.Card input[type=file]::file-selector-button {
  background: #e8f3fa !important;
  color: #08517c !important;
  border: none !important;
  border-radius: 5px !important;
  padding: 6px 12px !important;
  margin-right: 8px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: background-color 0.15s ease;
}
.Card input[type=file]::file-selector-button:hover {
  background: #0a6ea8 !important;
  color: #fff !important;
}

/* Add space below the Additional Order Cost card, above the page
   footer (which was overlapping it). */
.MainContainer.content-wrapper > .ed-card {
  margin-bottom: 40px !important;
}

/* Increase further: still slightly overlapping the footer. */
.MainContainer.content-wrapper > .ed-card {
  margin-bottom: 60px !important;
}

/* Container Capacity modal: modern redesign, part 1 (shell, header,
   close button). */
.contcap-modal-content {
  border-radius: 14px !important;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.25) !important;
  border: none !important;
  overflow: hidden !important;
}
.contcap-modal-content .modal-header {
  background: #0a6ea8 !important;
  padding: 18px 24px !important;
  border-bottom: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.contcap-modal-content .modal-title {
  color: #fff !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
  margin: 0 !important;
}
.contcap-close {
  color: #fff !important;
  opacity: 0.9 !important;
  float: none !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  margin: 0 !important;
  background: rgba(255,255,255,0.15) !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transition: background-color 0.15s ease;
}
.contcap-close:hover, .contcap-close:focus {
  color: #fff !important;
  opacity: 1 !important;
  background: rgba(255,255,255,0.3) !important;
  text-decoration: none !important;
}

/* Container Capacity modal: part 2 (4-column summary tiles). */
.contcap-modal-content .CommonTable {
  padding: 22px 24px 4px 24px !important;
}
.contcap-modal-content .CommonTable table.table-striped {
  border-collapse: separate !important;
  border-spacing: 10px 0 !important;
  margin-left: -10px !important;
  width: calc(100% + 20px) !important;
}
.contcap-modal-content .CommonTable table.table-striped thead.thead-dark th {
  background: #0a6ea8 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  border-radius: 8px 8px 0 0 !important;
  padding: 9px 6px !important;
  border: none !important;
}
.contcap-modal-content .CommonTable table.table-striped tbody td {
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-top: none !important;
  padding: 0 !important;
  vertical-align: top !important;
}
.contcap-modal-content .CommonTable table.table-striped tbody tr td table {
  background: transparent !important;
}
.contcap-modal-content .CommonTable table.table-striped tbody tr td table td {
  border: none !important;
  background: transparent !important;
  font-size: 10.5px !important;
  color: #64748b !important;
  font-weight: 600 !important;
  padding: 8px 4px 2px !important;
}
.contcap-modal-content .CommonTable table.table-striped tbody tr td table[border="1"] td {
  font-size: 14px !important;
  color: #1f2933 !important;
  font-weight: 700 !important;
  padding: 2px 4px 10px !important;
}

/* Container Capacity modal: part 3 (footer button, spec image). */
.contcap-modal-content .modal-footer {
  padding: 14px 24px !important;
  border-top: 1px solid #e2e8f0 !important;
  text-align: right !important;
}
.contcap-modal-content .modal-footer .contcap-close.btn-green {
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  border-radius: 6px !important;
  background: #e8f3fa !important;
  color: #08517c !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  opacity: 1 !important;
  padding: 7px 16px !important;
  margin: 0 !important;
}
.contcap-modal-content .modal-footer .contcap-close.btn-green:hover {
  background: #0a6ea8 !important;
  color: #fff !important;
}
.contcap-modal-content > div:last-of-type {
  padding: 4px 24px 24px !important;
}
.contcap-modal-content > div:last-of-type img {
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  display: block !important;
}

/* Container Capacity modal: Fill % progress bar (was referenced in
   PHP but never defined). */
.contcap-fillbar-track {
  height: 6px !important;
  border-radius: 4px !important;
  background: #e2e8f0 !important;
  margin: 8px auto 0 !important;
  overflow: hidden !important;
  width: 90% !important;
  display: block !important;
}
.contcap-fillbar-fill {
  height: 100% !important;
  border-radius: 4px !important;
  background: #0a6ea8 !important;
  display: block !important;
}

/* Fix: the Line Items table horizontal-scroll wrapper had
   overflow-y:hidden (for the wide-table scrollbar), which was
   clipping the Unit Price USD price-history popup vertically with
   no way to see the rest of it. Allow vertical overflow to show
   while keeping horizontal scroll intact. */
#estimateEditPage .ed-lineitems-card #ResortTable.content.bluehead {
  overflow-y: visible !important;
}
#suggestprice.priceSuggest {
  z-index: 2000 !important;
}

/* Add hover row striping to the Unit Price USD price-history popup
   table. */
#suggestprice.priceSuggest table.section-invoice tbody tr:hover td,
#suggestprice.priceSuggest table.section-invoice tr:hover td {
  background-color: #eef5fb !important;
  transition: background-color 0.1s ease;
}

/* Rework: broader, ID-scoped selectors for the price-history popup
   (not dependent on the exact table class), covering hover AND
   zebra row striping. */
#suggestprice tbody tr:nth-child(even) td {
  background-color: #f8fafc !important;
}
#suggestprice tbody tr:hover td {
  background-color: #eef5fb !important;
}
#suggestprice tr:hover td {
  background-color: #eef5fb !important;
}
#suggestprice table tr:hover > td {
  background-color: #eef5fb !important;
}

/* Increase zebra-stripe contrast in the price-history popup so it.s
   clearly visible, not just barely-off-white. */
#suggestprice tbody tr:nth-child(even) td {
  background-color: #eef2f7 !important;
}

/* Fix: the Line Items "Total row" bold/shaded styling was bleeding
   into the Unit Price USD price-history popup.s last row, since the
   popup is nested inside the same table.table ancestor. Reset it
   back to normal formatting matching the other popup rows. */
#suggestprice tbody tr:last-child td {
  font-weight: 400 !important;
  background-color: #fff !important;
}
#suggestprice tbody tr:nth-child(even):last-child td {
  background-color: #eef2f7 !important;
}

/* Simplify: force the popup.s last row background to explicitly
   match its own nth-child parity, overriding the earlier
   unconditional white background which was winning incorrectly. */
#suggestprice tbody tr:nth-child(odd):last-child td {
  background-color: #fff !important;
}
#suggestprice tbody tr:nth-child(even):last-child td {
  background-color: #eef2f7 !important;
}

/* Boost specificity above the old broad "Total row" rule
   (#estimateEditPage .ed-lineitems-card table.table tbody
   tr:last-child td), which has (1 id, 3 class/pseudo, 4 elements)
   and was winning over the #suggestprice-scoped fix. Repeating the
   ID pushes ours higher. */
#suggestprice#suggestprice tbody tr:nth-child(odd):last-child td {
  background-color: #fff !important;
  font-weight: 400 !important;
}
#suggestprice#suggestprice tbody tr:nth-child(even):last-child td {
  background-color: #eef2f7 !important;
  font-weight: 400 !important;
}

/* Price-history popup: modern card redesign, part 1 (container +
   section headers, unified to the site.s blue palette). */
#suggestprice.priceSuggest {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18) !important;
  padding: 4px !important;
  overflow: hidden !important;
}
#suggestprice th {
  background: #0a6ea8 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  padding: 9px 10px !important;
  border: none !important;
  text-align: left !important;
}
#suggestprice table {
  border-radius: 8px !important;
  overflow: hidden !important;
  margin-bottom: 6px !important;
  width: 100% !important;
}

/* Price-history popup: part 2 (cells, spacing, font). */
#suggestprice td {
  font-size: 12px !important;
  padding: 8px 10px !important;
  border: none !important;
  border-bottom: 1px solid #eef1f5 !important;
}
#suggestprice tbody tr:last-of-type td {
  border-bottom: none !important;
}
#suggestprice table + table {
  margin-top: 2px !important;
}

/* Price-history popup: distinguish section headers by source -
   top (Invoice) matches the invoice list page header green, middle
   table matches the Manuf Export button.s dark navy. */
#suggestprice table:nth-of-type(1) th {
  background: #336633 !important;
}
#suggestprice table:nth-of-type(2) th {
  background: #1f2933 !important;
}

/* Final fix: hover on even rows was losing to the equally-specific
   nth-child(even) striping rule due to source order (striping was
   added later). Boost hover.s specificity with a doubled ID so it
   always wins regardless of row parity. */
#suggestprice#suggestprice tbody tr:hover td {
  background-color: #eef5fb !important;
}

/* The hover color (#eef5fb) was nearly identical to the row-stripe
   color (#eef2f7), making the hover feedback imperceptible. Use a
   clearly more saturated blue so hover is obviously distinct from
   both the plain white and striped rows. */
#suggestprice#suggestprice tbody tr:hover td {
  background-color: #d7ebfa !important;
}

/* ===== Invoice Edit page redesign: port the modern card design
   from the Estimate Edit page. Scoped via body:has(#client_po_detail)
   since this page shares many generic IDs (frmDetails, InvoiceTable)
   with the Estimate page. Part 1: page background + Invoice Details
   grid modernization. */
body:where(.vch1):not(#vfhz) .ContentArea {
  background: #f8fafc !important;
  padding: 20px 24px !important;
}
body:where(.vch1):not(#vfhz) #frmDetails {
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 8px !important;
  box-shadow: 0 1px 3px rgba(15,23,42,0.06) !important;
  display: block !important;
  overflow: hidden !important;
}
body:where(.vch1):not(#vfhz) #frmDetails table.green-striped {
  border: none !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
body:where(.vch1):not(#vfhz) #frmDetails table.green-striped td,
body:where(.vch1):not(#vfhz) #frmDetails table.green-striped th {
  border-color: #e2e8f0 !important;
}
body:where(.vch1):not(#vfhz) #frmDetails table.green-striped td[style*="background-color: rgb(211"],
body:where(.vch1):not(#vfhz) #frmDetails table.green-striped td[bgcolor],
body:where(.vch1):not(#vfhz) #frmDetails table.green-striped tr > td:first-child {
  background: #f8fafc !important;
  color: #1f2933 !important;
  font-weight: 700 !important;
  font-size: 11.5px !important;
}
body:where(.vch1):not(#vfhz) #frmDetails input[type=text],
body:where(.vch1):not(#vfhz) #frmDetails input[type=date],
body:where(.vch1):not(#vfhz) #frmDetails select,
body:where(.vch1):not(#vfhz) #frmDetails textarea {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 6px 8px !important;
  background: #fff !important;
}

/* Part 2: Line Items table + toolbar (Resort/country dropdown,
   Container Capacity, Add Item buttons). */
body:where(.vch1):not(#vfhz) #InvoiceTable {
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 16px !important;
  box-shadow: 0 1px 3px rgba(15,23,42,0.06) !important;
  margin-top: 20px !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table thead th {
  background: #0a6ea8 !important;
  color: #fff !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  border: none !important;
  padding: 10px 12px !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table {
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td {
  border-color: #e2e8f0 !important;
  font-size: 12.5px !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table.table-striped tbody tr:nth-of-type(odd) td {
  background-color: #f8fafc !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table.table-striped tbody tr:hover td {
  background-color: #eef5fb !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table tbody tr:last-child td {
  font-weight: 700 !important;
  background: #f1f5f9 !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable input.btn-green,
body:where(.vch1):not(#vfhz) #InvoiceTable button.btn-green {
  background: #1f8a4c !important;
  border-color: #1f8a4c !important;
  border-radius: 6px !important;
  text-transform: none !important;
  font-weight: 600 !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable input.btn-green:hover {
  background: #0a6ea8 !important;
  border-color: #0a6ea8 !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable input#Containers {
  background: #e8f3fa !important;
  border-color: #e8f3fa !important;
  color: #08517c !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable input#Containers:hover {
  background: #0a6ea8 !important;
  color: #fff !important;
}

/* Line Items card (invoice) - match Estimate styling */
.ed-lineitems-card .ResortData{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:20px 0 8px 19px;padding:0;}
.ed-lineitems-card .ResortData li{display:flex;align-items:center;gap:6px;font-size:12.5px;color:#1f2933;font-weight:500;}
.ed-lineitems-card .ResortData input[type=checkbox]{margin:0;}
.ed-lineitems-card input#Containers{background:#e8f3fa !important;border-color:#e8f3fa !important;color:#08517c !important;}
.ed-lineitems-card input#Containers:hover{background:#0a6ea8 !important;color:#fff !important;}
.ed-lineitems-card table.green-striped tr>td:first-child{background-color:transparent !important;}.ed-lineitems-card .ed-head-actions input[type=button]{text-transform:none !important;font-weight:700 !important;}.ed-lineitems-card .ed-head-actions a:first-child{margin-right:10px;}
.ed-lineitems-card .ed-head-actions input[type=button]:last-child{background:#336633 !important;border-color:#336633 !important;color:#fff !important;}
.ed-lineitems-card input[name=update_invoice]{background:#336633 !important;border-color:#336633 !important;color:#fff !important;text-transform:none !important;font-weight:700 !important;}
.ed-lineitems-card .coloredsortbar{background:transparent !important;}
.ed-lineitems-card table.green-striped{border-top:none !important;}
body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable table.table{border-top:none !important;}
.ed-lineitems-card #btnsort{text-transform:none !important;font-weight:700 !important;margin-bottom:12px !important;}
body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable table.table{border:none !important;}

.ed-lineitems-card .coloredsortbar .row:first-child{margin-bottom:12px !important;}




.ed-lineitems-card input#Containers:hover,
.ed-lineitems-card .ed-head-actions input[type=button]:last-child:hover,
.ed-lineitems-card input[name=update_invoice]:hover{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important;}



body:where(.vch1):not(#vfhz) #InvoiceTable select,
body:where(.vch1):not(#vfhz) #InvoiceTable input[type=text] {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
}

/* Part 3: Comments and Attachments row. */
body:where(.vch1):not(#vfhz) .row.justify-content-center {
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 20px !important;
  margin-top: 20px !important;
  box-shadow: 0 1px 3px rgba(15,23,42,0.06) !important;
}
body:where(.vch1):not(#vfhz) .row.justify-content-center textarea,
body:where(.vch1):not(#vfhz) .row.justify-content-center input[type=file],
body:where(.vch1):not(#vfhz) .row.justify-content-center input[type=text] {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
}
body:where(.vch1):not(#vfhz) .row.justify-content-center a.btn,
body:where(.vch1):not(#vfhz) .row.justify-content-center input[type=button] {
  background: #e8f3fa !important;
  color: #08517c !important;
  border: none !important;
  border-radius: 6px !important;
  text-transform: none !important;
}

/* Part 4: Additional Order Cost card (#frmCost). */
body:where(.vch1):not(#vfhz) #frmCost {
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 16px !important;
  margin-top: 20px !important;
  margin-bottom: 40px !important;
  box-shadow: 0 1px 3px rgba(15,23,42,0.06) !important;
  display: block !important;
}
body:where(.vch1):not(#vfhz) #frmCost table.table {
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
body:where(.vch1):not(#vfhz) #frmCost table.table thead th,
body:where(.vch1):not(#vfhz) #frmCost table.table tr.thead-light th,
body:where(.vch1):not(#vfhz) #frmCost table.table tr.thead-dark th {
  background: #1f2933 !important;
  color: #fff !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.2px !important;
  border: none !important;
  padding: 10px 12px !important;
}
body:where(.vch1):not(#vfhz) #frmCost table.table td {
  border-color: #e2e8f0 !important;
  font-size: 12.5px !important;
}
body:where(.vch1):not(#vfhz) #frmCost table.table.table-striped tbody tr:nth-of-type(even) td {
  background-color: #f8fafc !important;
}
body:where(.vch1):not(#vfhz) #frmCost input[type=text],
body:where(.vch1):not(#vfhz) #frmCost textarea {
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 6px 8px !important;
}
body:where(.vch1):not(#vfhz) #frmCost input.btn-green {
  background: #e8f3fa !important;
  border-color: #e8f3fa !important;
  color: #08517c !important;
  border-radius: 6px !important;
  text-transform: none !important;
}
body:where(.vch1):not(#vfhz) #frmCost input.btn-green:hover {
  background: #0a6ea8 !important;
  color: #fff !important;
}
body:where(.vch1):not(#vfhz) #frmCost input[type=submit],
body:where(.vch1):not(#vfhz) #frmCost input.btn-primary {
  background: #1f8a4c !important;
  border-color: #1f8a4c !important;
  border-radius: 6px !important;
  text-transform: none !important;
}
body:where(.vch1):not(#vfhz) #frmCost input[type=submit]:hover,
body:where(.vch1):not(#vfhz) #frmCost input.btn-primary:hover {
  background: #0a6ea8 !important;
  border-color: #0a6ea8 !important;
}

/* On the Invoice page, the price-history popup.s only section is
   Estimate ID data, but it inherited the green (Invoice-section)
   color meant for position 1 on the Estimate page. Override to blue
   to correctly reflect Estimate content on this page. */
body:where(.vch1):not(#vfhz) #suggestprice table:nth-of-type(1) th {
  background: #0a6ea8 !important;
}

/* Revert per request: the client_po_detail summary header (nested
   inside the same #InvoiceTable wrapper as Line Items, so it had
   inherited the blue Line Items header color) and the price-history
   popup.s top section on the Invoice page both go back to green. */
body:where(.vch1):not(#vfhz) #client_po_detail table.table thead th {
  background: #336633 !important;
}
body:where(.vch1):not(#vfhz) #suggestprice table:nth-of-type(1) th {
  background: #336633 !important;
}

/* Revert: keep the Invoice Details (client_po_detail) header green,
   but the price-history popup window itself goes back to blue. */
body:where(.vch1):not(#vfhz) #suggestprice table:nth-of-type(1) th {
  background: #0a6ea8 !important;
}

/* Revert: Invoice Details (client_po_detail) header back to blue,
   matching the Line Items header and the price-popup. */
body:where(.vch1):not(#vfhz) #client_po_detail table.table thead th {
  background: #0a6ea8 !important;
}

/* Change both the Invoice Details grid header and the Line Items
   table header from blue to #336633. */
body:where(.vch1):not(#vfhz) #client_po_detail table.table thead th {
  background: #336633 !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table thead th {
  background: #336633 !important;
}

/* Fix: the Line Items table.s real wrapper is #ResortTable (not
   #InvoiceTable), and the native #ResortTable thead.thead-dark th
   rule (specificity 1,2,2) beat my earlier #InvoiceTable-scoped
   attempt. Target #ResortTable directly with matching specificity. */
body:where(.vch1):not(#vfhz) #ResortTable thead.thead-dark th {
  background: #336633 !important;
}

/* Revert: price-history popup.s top (Invoice) section back to
   #336633 green. */
body:where(.vch1):not(#vfhz) #suggestprice table:nth-of-type(1) th {
  background: #336633 !important;
}

/* Distinguish the price-history popup.s top-section header color
   based on which trigger populated it (Invoice vs Estimate), using
   the .invoice-suggest/.estimate-suggest classes added in invoice.js. */
body:where(.vch1):not(#vfhz) #suggestprice.invoice-suggest table:nth-of-type(1) th {
  background: #336633 !important;
}
body:where(.vch1):not(#vfhz) #suggestprice.estimate-suggest table:nth-of-type(1) th {
  background: #0a6ea8 !important;
}

/* Summary ribbon for the Invoice Edit page, replicating the
   Estimate Edit page.s .ci-ribbon component styling. */
body:where(.vch1):not(#vfhz) .ci-ribbon {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  background: #ffffff;
  border: 1px solid #e1e5ec;
  border-radius: 6px;
  padding: 14px 18px;
  margin-bottom: 16px;
}
body:where(.vch1):not(#vfhz) .ci-ribbon-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-right: 20px;
  border-right: 1px solid #d8d7dc;
}
body:where(.vch1):not(#vfhz) .ci-ribbon-item:last-child {
  border-right: none;
  padding-right: 0;
}
body:where(.vch1):not(#vfhz) .ci-ribbon-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: #6b7280;
  font-weight: 600;
}
body:where(.vch1):not(#vfhz) .ci-ribbon-value {
  font-size: 16px;
  font-weight: 700;
  color: #292b2c;
}
body:where(.vch1):not(#vfhz) .ci-ribbon-spacer {
  flex: 1 1 0%;
}
body:where(.vch1):not(#vfhz) .ci-ribbon-metric .ci-ribbon-value {
  font-size: 15px;
}
body:where(.vch1):not(#vfhz) .ci-status-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  vertical-align: middle;
}
body:where(.vch1):not(#vfhz) .ci-badge-neutral { background: #eef0f2; color: #55595c; }
body:where(.vch1):not(#vfhz) .ci-badge-warning { background: #fff3cd; color: #8a6d1d; }
body:where(.vch1):not(#vfhz) .ci-badge-info { background: #d6ecff; color: #0a5aa8; }
body:where(.vch1):not(#vfhz) .ci-badge-success { background: #d9f2e3; color: #1c7a43; }
body:where(.vch1):not(#vfhz) .ci-badge-danger { background: #fbdcdc; color: #a3252c; }

/* Deeper pass: unify the Invoice Details grid.s per-row header
   bars (thead-light / thead-dark, including the dark #444444
   "Order Status" row) to a single clean, light label style,
   matching the airy look of the Estimate Details form. The
   #client_po_detail green summary header is intentionally left
   untouched. */
body:where(.vch1):not(#vfhz) #InvoiceTable .thead-dark th,
body:where(.vch1):not(#vfhz) #InvoiceTable .thead-light th,
body:where(.vch1):not(#vfhz) form#frmDetails .thead-dark th,
body:where(.vch1):not(#vfhz) form#frmDetails .thead-light th {
  background: #fbfcfd !important;
  color: #475569 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0.2px !important;
  border: none !important;
  border-bottom: 1px solid #eef1f5 !important;
  padding: 8px 10px !important;
}

body:where(.vch1):not(#vfhz) #ResortTable thead.thead-dark th{background-color:#336633 !important;color:#ffffff !important;} body:where(.vch1):not(#vfhz) #ResortTable thead.thead-dark th a{color:#ffffff !important;}

body:where(.vch1):not(#vfhz) #InvoiceTable table.table,
body:where(.vch1):not(#vfhz) form#frmDetails table.table {
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td,
body:where(.vch1):not(#vfhz) form#frmDetails table.table td {
  border-color: #eef1f5 !important;
  padding: 8px 10px !important;
}

/* Button color adjustments on the Invoice Edit page. */
body:where(.vch1):not(#vfhz) #btn_reset_cont_vol {
  background: #555555 !important;
  color: #fff !important;
}
body:where(.vch1):not(#vfhz) input[value="Send Email"] {
  background: #e8f3fa !important;
  color: #08517c !important;
}
body:where(.vch1):not(#vfhz) input[value="Send Email"]:hover {
  background: #0a6ea8 !important;
  color: #fff !important;
}
body:where(.vch1):not(#vfhz) #save_po_detail {
  background: #336633 !important;
  color: #fff !important;
}
/* Top accent bar on the summary ribbon. */
body:where(.vch1):not(#vfhz) .ci-ribbon {
  border-top: 4px solid #336633 !important;
}
/* Match Invoice Details grid inputs/selects to the Estimate
   Details page.s input styling. */
body:where(.vch1):not(#vfhz) #frmDetails input[type=text],
body:where(.vch1):not(#vfhz) #frmDetails input[type=date],
body:where(.vch1):not(#vfhz) #frmDetails select,
body:where(.vch1):not(#vfhz) #frmDetails textarea {
  background: #fff !important;
  color: #1f2933 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  padding: 7px 9px !important;
  font-size: 13px !important;
}

/* Boost specificity: #btn_reset_cont_vol was losing to the earlier
   #InvoiceTable input.btn-green rule (more classes). */
body:where(.vch1):not(#vfhz) #btn_reset_cont_vol#btn_reset_cont_vol {
  background: #555555 !important;
  color: #fff !important;
}

/* Boost specificity: both Send Email and Save buttons are inside
   #InvoiceTable, matching the earlier input.btn-green rule.s (2,2,2)
   specificity. Include #InvoiceTable in these selectors to match or
   beat it. */
body:where(.vch1):not(#vfhz) #InvoiceTable input[value="Send Email"] {
  background: #e8f3fa !important;
  color: #08517c !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable input[value="Send Email"]:hover {
  background: #0a6ea8 !important;
  color: #fff !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable #save_po_detail {
  background: #336633 !important;
  color: #fff !important;
}

/* Make the Invoice Details grid responsive: no horizontal
   scrollbar, columns auto-resize to fit the available width as
   the browser window resizes. table-layout:fixed divides the
   width evenly across columns and wraps cell content instead of
   overflowing. */
body:where(.vch1):not(#vfhz) #InvoiceTable {
  overflow-x: visible !important;
  overflow-y: visible !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table {
  table-layout: fixed !important;
  width: 100% !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td {
  white-space: normal !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table select,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table input[type=text] {
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Expand the Invoice Details table to the full width of its card
   (was inset ~17px each side due to the card.s padding). */
body:where(.vch1):not(#vfhz) #InvoiceTable {
  padding: 0 !important;
}

/* Restore card padding (removed entirely last time, which killed
   the card look) while keeping the table itself flush to the full
   available content width, with explicit box-sizing/display to
   guard against shrink-to-fit behavior. */
body:where(.vch1):not(#vfhz) #InvoiceTable {
  padding: 12px !important;
  display: block !important;
  box-sizing: border-box !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table {
  table-layout: fixed !important;
  width: 100% !important;
  max-width: 100% !important;
  display: table !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

/* Revert per request: back to a horizontal scrollbar for the
   Invoice Details grid instead of the responsive/auto-resize
   table-layout. Styled as a thin scrollbar to stay unobtrusive. */
body:where(.vch1):not(#vfhz) #InvoiceTable {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 16px !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table {
  table-layout: auto !important;
  width: auto !important;
  max-width: none !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td {
  white-space: nowrap !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table select,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table input[type=text] {
  width: auto !important;
  max-width: none !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable::-webkit-scrollbar {
  height: 7px !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable::-webkit-scrollbar-track {
  background: #f1f5f9 !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable::-webkit-scrollbar-thumb {
  background: #cbd5e1 !important;
  border-radius: 4px !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable::-webkit-scrollbar-thumb:hover {
  background: #94a3b8 !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable {
  scrollbar-width: thin !important;
  scrollbar-color: #cbd5e1 #f1f5f9 !important;
}

/* Match Country of Export / Brand / Order Description column
   widths to the Internal Use column, and constrain their selects
   so long option text doesn.t force the column wide again
   (table-layout:auto otherwise sizes columns to content). */
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th:nth-child(3),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(3),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th:nth-child(4),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(4),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th:nth-child(5),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(5) {
  width: 345px !important;
  max-width: 345px !important;
}
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(3) select,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(4) select,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(5) select {
  width: 100% !important;
  max-width: 100% !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important;
}

/* Reinforce with min-width: under table-layout:auto, plain width
   on a cell is treated as a hint the browser.s column-sizing
   algorithm can still shrink; min-width is respected as a hard
   floor. */
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th:nth-child(3),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(3),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th:nth-child(4),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(4),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table th:nth-child(5),
body:where(.vch1):not(#vfhz) #InvoiceTable table.table td:nth-child(5) {
  min-width: 345px !important;
}

/* Remove the Invoice Details grid.s colored header bars entirely
   (both the green #client_po_detail row and the admin_po_details
   rows) and match the Estimate Details page.s plain-label style:
   no background, small slate-gray bold text, no uppercase. */
body:where(.vch1):not(#vfhz) #client_po_detail table.table thead th,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table thead th,
body:where(.vch1):not(#vfhz) #InvoiceTable .thead-dark th,
body:where(.vch1):not(#vfhz) #InvoiceTable .thead-light th {
  background: transparent !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  border: none !important;
  border-bottom: none !important;
  padding: 0 10px 8px 10px !important;
}

/* Add breathing room between the new "Invoice Details" card header
   and the first row of fields. */
body:where(.vch1):not(#vfhz) #InvoiceTable table.table {
  margin-top: 16px !important;
}

/* Fine-tune: match Estimate Details. exact spacing convention for
   card-head descriptions - 12px above the title (already automatic
   via the shared .ed-card-head padding) and 18px below it before
   the first row of fields. */
body:where(.vch1):not(#vfhz) #InvoiceTable table.table {
  margin-top: 18px !important;
}

/* Update the Invoice Details grid row description (label) color. */
body:where(.vch1):not(#vfhz) #client_po_detail table.table thead th,
body:where(.vch1):not(#vfhz) #InvoiceTable table.table thead th,
body:where(.vch1):not(#vfhz) #InvoiceTable .thead-dark th,
body:where(.vch1):not(#vfhz) #InvoiceTable .thead-light th {
  color: #475569 !important;
}

/* Remove the border-bottom divider under the "Invoice Details"
   card header (scoped to this page only, since .ed-card-head is a
   shared class also used by the Estimate Details page). */
body:where(.vch1):not(#vfhz) .ed-card-head {
  border-bottom: none !important;
}

/* Add back a bottom border under the "Invoice Details" header. */
body:where(.vch1):not(#vfhz) .ed-card-head {
  border-bottom: 1px solid #e2e8f0 !important;
}

/* Extend the Invoice Details header.s bottom border to the full
   card width, counteracting the #InvoiceTable wrapper.s own 12px
   padding via negative margins. */
body:where(.vch1):not(#vfhz) .ed-card-head {
  margin-left: -12px !important;
  margin-right: -12px !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.ed-lineitems-card #ResortTable{border-top:none !important;}

body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable table.green-striped tr>td:first-child{background-color:transparent !important;}

body:where(.vch1):not(#vfhz) .row.justify-content-center:where(.vcl6):not(.vfhz){padding:0 !important;}

.ed-lineitems-card #frmDetails{border:none !important;border-radius:0 !important;box-shadow:none !important;}

body:where(.vch1):not(#vfhz) .ed-lineitems-card #frmDetails{border:none !important;border-radius:0 !important;box-shadow:none !important;}

.ed-lineitems-card .col-4.mb-2{margin-bottom:0 !important;}
.ed-lineitems-card input[name=update_invoice]{margin-bottom:0 !important;}

.ed-lineitems-card .col-4.mb-2 + .col-4{display:none !important;}
.ed-lineitems-card{padding-bottom:0 !important;}

.ed-lineitems-card{margin:0 7.5px 30px 7.5px !important;}
.row.justify-content-center:where(.vcl7):not(.vfhz){margin:0 7.5px 20px 7.5px !important;}
.ed-card:not(.ed-lineitems-card){margin:0 7.5px 30px 7.5px !important;}

body:where(.vch1):not(#vfhz) .ed-lineitems-card #btnsort:hover{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important;}

body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped tbody tr:hover{background-color:#a8cfa0 !important;}

body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable table.green-striped thead th{text-transform:uppercase !important;}

body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable table.green-striped thead th a{font-family:Roboto !important;font-weight:700 !important;font-size:11.5px !important;text-transform:uppercase !important;color:#fff !important;}

#suggestprice tbody tr td:first-child{background-color:rgb(247,247,247) !important;}
#suggestprice tbody tr:nth-child(2n) td:first-child{background-color:rgb(238,242,247) !important;}

body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable #suggestprice tbody tr td:first-child{background-color:rgb(247,247,247) !important;}
body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable #suggestprice tbody tr:nth-child(2n) td:first-child{background-color:rgb(238,242,247) !important;}

body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable #suggestprice tbody tr:hover td:first-child{background-color:rgb(215,235,250) !important;}

body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable #suggestprice#suggestprice tbody tr:last-child:hover td:first-child{background-color:rgb(215,235,250) !important;}

body:where(.vch1):not(#vfhz) form#frmDetails #ResortTable #suggestprice#suggestprice tbody tr:last-child:hover td{background-color:rgb(215,235,250) !important;}

.ed-lineitems-card .ed-card-head{padding:14px 18px !important;}

body:where(.vch1):not(#vfhz) input[name=btnpo]:hover{background-color:#0069d9 !important;border-color:#0069d9 !important;}

#dStatusChange b{font-family:Roboto !important;font-size:13px !important;font-weight:700 !important;color:#475569 !important;text-transform:none !important;}

.row:where(.vcl8):not(#vfhz){margin-top:8px !important;margin-bottom:8px !important;}

.Card .CardBody > .row:first-child{margin-top:0 !important;}

.Card .CardBody > .row{align-items:flex-start !important;}
.Card .CardBody{padding-bottom:8px !important;}

.Card .CardBody > .row{padding-bottom:0 !important;margin-bottom:0 !important;}

body:where(.vch1):not(#vfhz) .row.justify-content-center .Card{border:none !important;border-radius:0 !important;box-shadow:none !important;}

#chkdocument + span{font-family:Roboto !important;font-size:12px !important;font-weight:400 !important;color:#94a3b8 !important;margin-left:6px;}

body:where(.vch1):not(#vfhz) #frmCost{border:none !important;border-radius:0 !important;box-shadow:none !important;}
body:where(.vch1):not(#vfhz) #frmCost table.table-bordered{border:none !important;border-radius:0 !important;}

body:where(.vch1):not(#vfhz) #frmCost .CommonTable{border:none !important;}

body:where(.vch1):not(#vfhz) .CommonTable:where(.vcl9):not(#vfhz){border:none !important;}

body:where(.vch1):not(#vfhz) #frmCost table{border-radius:8px !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered{border-radius:8px !important;}

body:where(.vch1):not(#vfhz) #frmCost{padding-bottom:0 !important;margin-bottom:0 !important;}

body:where(.vch1):not(#vfhz) input#btnSaveCost[type=submit]{background-color:#336633 !important;border-color:#336633 !important;color:#fff !important;}

body:where(.vch1):not(#vfhz) input#btnSaveCost[type=submit]:hover{background-color:#0069d9 !important;border-color:#0069d9 !important;}

body:where(.vch1):not(#vfhz) .Card input[type="file"]::file-selector-button:hover{background:#0069d9 !important;color:#fff !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered thead th{padding:8px 10px !important;font-size:11.5px !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered thead th{text-align:left !important;}

.oc-section{background-color:#e7ecf1 !important;}







body:where(.vch1):not(#vfhz) #frmCost{background-color:transparent !important;}
body:where(.vch1):not(#vfhz) .CommonTable:where(.vcl9):not(#vfhz){background-color:transparent !important;}

body:where(.vch1):not(#vfhz) #frmCost td:where(.vcl10):not(#vfhz){background-color:transparent !important;}



body:where(.vch1):not(#vfhz) .ed-card:where(.vcl11):not(#vfhz) > .row:first-child{border-bottom:1px solid #cbd5e1 !important;}

body:where(.vch1):not(#vfhz) #frmCost{padding-top:0 !important;margin-top:8px !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered tbody tr td:last-child{text-align:center !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered textarea{width:100% !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table.table-striped tbody tr:nth-of-type(2n) td{background-color:transparent !important;}

body:where(.vch1):not(#vfhz) .CommonTable:where(.vcl9):not(#vfhz) .table-striped tbody tr:nth-of-type(2n+1){background-color:#eaf2ec !important;}

body:where(.vch1):not(#vfhz) .CommonTable:where(.vcl9):not(#vfhz) .table-striped tbody tr{background-color:#eaf2ec !important;}

body:where(.vch1):not(#vfhz) .CommonTable:where(.vcl9):not(#vfhz) .table-striped tbody tr:where(.vcl12):not(#vfhz){background-color:transparent !important;}

body:where(.vch1):not(#vfhz) #frmCost td:where(.vcl10):not(#vfhz){border:none !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered tbody tr td:nth-child(7){font-size:13px !important;font-weight:400 !important;color:#292b2c !important;}

body:where(.vch1):not(#vfhz) #eleGrandTotal{color:#000000 !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered thead th{text-transform:uppercase !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered td{border-color:#ffffff !important;}

body:where(.vch1):not(#vfhz) .ci-status-badge{border-left:4px solid currentColor !important;padding-left:10px !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered thead th{padding:5px 10px !important;}
body:where(.vch1):not(#vfhz) #frmCost table.table-bordered thead input[type=button]{padding:3px 10px !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered thead th{vertical-align:middle !important;}

body:where(.vch1):not(#vfhz) #btn_reset_cont_vol{margin-left:22px !important;}

body:where(.vch1):not(#vfhz) #btn_reset_cont_vol:hover{background-color:#0069d9 !important;border-color:#0069d9 !important;}

body:where(.vch1):not(#vfhz) #btn_reset_cont_vol{text-transform:none !important;margin-bottom:16px !important;}

body:where(.vch1):not(#vfhz) #ResortTable .onlynumber{width:38px !important;padding:7px 4px !important;text-align:center !important;}

body:where(.vch1):not(#vfhz) .orange-table table.table-bordered thead th{background-color:#ffffff !important;color:#292b2c !important;font-size:14px !important;font-weight:700 !important;border:1px solid #ecebef !important;padding:13.6px 15.84px !important;text-transform:none !important;}
body:where(.vch1):not(#vfhz) .orange-table table.table-bordered tbody td{border:1px solid #ecebef !important;padding:12px 15.84px !important;background-color:transparent !important;}
body:where(.vch1):not(#vfhz) .orange-table table.table-striped tbody tr:nth-of-type(2n){background-color:transparent !important;}

body:where(.vch1):not(#vfhz) .tbl_slot{padding-left:27px !important;padding-right:27px !important;}

body:where(.vch1):not(#vfhz) .orange-table table.table-bordered thead th{font-size:11.5px !important;text-transform:uppercase !important;letter-spacing:0.2px !important;}

body:where(.vch2):not(#vfhz) .Card input[type="file"]::file-selector-button:hover{background:#0069d9 !important;color:#fff !important;}

body:where(.vch2):not(#vfhz) .Card input[type="file"]{width:220px !important;}

body:where(.vch1):not(#vfhz) .ed-lineitems-card{border-top:4px solid #336633 !important;}

body:where(.vch1):not(#vfhz) .ed-card:where(.vcl11):not(#vfhz){border-top:4px solid #336633 !important;}

body:where(.vch0):not(#vfhz) .ed-lineitems-card{border-top:4px solid #008acd !important;}
body:where(.vch0):not(#vfhz) .ed-card:where(.vcl11):not(#vfhz){border-top:4px solid #008acd !important;}

body:where(.vch0):not(#vfhz) #estimate_po_detail > .ed-card > .ed-card-head{border-bottom:2px solid #e2e8f0 !important;}

body:where(.vch0):not(#vfhz) .Card .ed-card-head{border-bottom:2px solid #e2e8f0 !important;}
body:where(.vch0):not(#vfhz) .ed-card:where(.vcl11):not(#vfhz) > .row:first-child{border-bottom:2px solid #e2e8f0 !important;}

body:where(.vch0):not(#vfhz) .row.justify-content-center{margin-left:27.5px !important;margin-right:22.5px !important;}

body:where(.vch0):not(#vfhz) .MainContainer.content-wrapper .row.justify-content-center{padding-left:0px !important;padding-right:0px !important;}
body:where(.vch0):not(#vfhz) .ed-card:where(.vcl11):not(#vfhz){margin-left:27.5px !important;margin-right:22.5px !important;}

body:where(.vch0):not(#vfhz) .Card{margin-left:-15px !important;margin-right:-15px !important;width:calc(100% + 30px) !important;}

body:where(.vch1):not(#vfhz) .ed-lineitems-card .ed-card-head{border-bottom:2px solid #e2e8f0 !important;}

body:where(.vch1):not(#vfhz) .ed-card:not(.ed-lineitems-card) .ed-card-head{border-bottom:2px solid #e2e8f0 !important;}
body:where(.vch1):not(#vfhz) .ed-card:where(.vcl11):not(#vfhz) > .row:first-child{border-bottom:2px solid #cbd5e1 !important;}

body:where(.vch1):not(#vfhz) .Card .ed-card-head{border-bottom:2px solid #e2e8f0 !important;}

body:where(.vch0):not(#vfhz) #frmCost .fa-trash{color:#555555 !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered textarea{width:100% !important;box-sizing:border-box !important;}

body:where(.vch0):not(#vfhz) .ed-lineitems-card table.table-bordered thead th{text-transform:uppercase !important;}
body:where(.vch0):not(#vfhz) #frmCost table.table-bordered thead th{text-transform:uppercase !important;}

body:where(.vch0):not(#vfhz) .ed-lineitems-card table.table-bordered thead th{font-weight:700 !important;}

body:where(.vch0):not(#vfhz) .ed-lineitems-card table.table-bordered{border-radius:8px !important;overflow:hidden !important;}

body:where(.vch0):not(#vfhz) .ed-lineitems-card table.table-bordered thead th{letter-spacing:0.2px !important;vertical-align:bottom !important;padding:8px 10px !important;}

body:where(.vch0):not(#vfhz) .ed-lineitems-card table.table-bordered thead th a{font-size:11.5px !important;font-weight:700 !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered{border-radius:8px !important;overflow:hidden !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered thead th{padding:8px 10px !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered thead th{line-height:17.25px !important;}
body:where(.vch0):not(#vfhz) #frmCost table.table-bordered thead input[type=button]{padding:2px 8px !important;font-size:11px !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered thead th{padding-top:6.5px !important;padding-bottom:6.5px !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered td input.onlynumber, body:where(.vch0):not(#vfhz) #frmCost table.table-bordered td input[name*=Pack]{width:100% !important;box-sizing:border-box !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered td input.onlynumber, body:where(.vch1):not(#vfhz) #frmCost table.table-bordered td input[name*=Pack]{width:100% !important;box-sizing:border-box !important;}

body:where(.vch1):not(#vfhz) #frmCost table.table-bordered td textarea{resize:both !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered td textarea{resize:both !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered thead th:last-child,
body:where(.vch1):not(#vfhz) #frmCost table.table-bordered thead th:last-child{text-align:center !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered tbody td:last-child{text-align:center !important;}

body:where(.vch0):not(#vfhz) #fx_country, body:where(.vch1):not(#vfhz) #fx_country{margin-top:0 !important;vertical-align:middle !important;}

body:where(.vch0):not(#vfhz) #fx_country, body:where(.vch1):not(#vfhz) #fx_country{height:31px !important;padding-top:5px !important;padding-bottom:5px !important;}

body:where(.vch0):not(#vfhz) #fx_country{margin-top:-10.3px !important;}
body:where(.vch1):not(#vfhz) #fx_country{margin-top:-5.25px !important;}

body:where(.vch0):not(#vfhz) #frmCost table.table-bordered td textarea{height:48px;min-height:48px !important;}

body:where(.vch0):not(#vfhz) #comment{height:48px;min-height:48px !important;}

body:where(.vch0):not(#vfhz) .EstFileUpld li:where(.vcl13):not(#vfhz) br{display:none !important;}

body:where(.vch1):not(#vfhz) #comment{height:48px;min-height:48px !important;}

body:where(.vch1):not(#vfhz) #shipagent_details{height:50px;min-height:50px !important;}

body:where(.vch1):not(#vfhz) #ManufComment, body:where(.vch1):not(#vfhz) #GeneralComment{height:48px;min-height:48px !important;}

body:where(.vch1):not(#vfhz) span:where(.vcl14):not(#vfhz){font-size:13px !important;font-weight:400 !important;color:#292b2c !important;}

body:where(.vch1):not(#vfhz) div:where(.vcl15):not(#vfhz):not(vfhz){margin-bottom:0px !important;}

body:where(.vch1):not(#vfhz) #ManufComment{margin-top:6.5px !important;}
body:where(.vch1):not(#vfhz) #MOHComment{margin-top:4.5px !important;}

/* ===================== OPTION D — Command Center light theme, applied to dashboard.php ===================== */
body:where(.vch3):not(.vfhz) {
  font-family:'Inter',sans-serif !important;
}
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap');

body:where(.vch3):not(.vfhz) .MainContainer.content-wrapper{background:#D3D3D3 !important;}
body:where(.vch3):not(.vfhz) h1,
body:where(.vch3):not(.vfhz) h2,
body:where(.vch3):not(.vfhz) h3,
body:where(.vch3):not(.vfhz) h4{font-family:'Inter',sans-serif !important;}

/* ---- KPI tiles: solid color fill -> white card with left accent bar ---- */
body:where(.vch3):not(.vfhz) .StaticBox{
  background:#ffffff !important;
  border:1px solid #d8d8d8 !important;
  border-left:4px solid var(--od-accent,#2f7de0) !important;
  border-radius:10px !important;
  box-shadow:none !important;
}
body:where(.vch3):not(.vfhz) .StaticBox.BgEstimate{--od-accent:#2f7de0;}
body:where(.vch3):not(.vfhz) .StaticBox.BgOrder{--od-accent:#7c8a99;}
body:where(.vch3):not(.vfhz) .StaticBox.BgCustomer{--od-accent:#1c7a43;}
body:where(.vch3):not(.vfhz) .StaticBox.BgManufacturer{--od-accent:#c2760c;}
body:where(.vch3):not(.vfhz) .StaticBox .value h3{
  font-family:'IBM Plex Mono',monospace !important;
  color:#182530 !important;
  font-weight:700 !important;
  font-size:25px !important;
}
body:where(.vch3):not(.vfhz) .StaticBox .value p{color:#51616f !important;}
body:where(.vch3):not(.vfhz) .StaticBox .value p:first-of-type{
  color:#7c8a99 !important;
  font-size:11.5px !important;
  font-weight:600 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}
body:where(.vch3):not(.vfhz) .StaticBox .icon img{opacity:.55 !important;}

/* ---- Card panels: header + body restyle ---- */
body:where(.vch3):not(.vfhz) .Card{
  background:#ffffff !important;
  border:1px solid #d8d8d8 !important;
  border-radius:10px !important;
  box-shadow:none !important;
}
body:where(.vch3):not(.vfhz) .CardTitle{
  font-family:'Inter',sans-serif !important;
  font-size:13px !important;
  font-weight:700 !important;
  color:#182530 !important;
  border-bottom:1px solid #e4e4e4 !important;
  padding-left:14px !important;
  border-left:none !important;
  position:relative;
}
body:where(.vch3):not(.vfhz) .CardTitle::before{
  content:'';position:absolute;left:0;top:calc(50% - 5px);transform:translateY(-50%); /* VF 2026-10-13: centre on the text line (title has 10px bottom padding) */
  width:8px;height:8px;border-radius:2px;background:var(--od-line,#2f7de0);
}
body:where(.vch3):not(.vfhz) .CardTitle.BlueLine::before{background:#2f7de0;}
body:where(.vch3):not(.vfhz) .CardTitle.GreenLine::before{background:#1c7a43;}
body:where(.vch3):not(.vfhz) .CardTitle.RedLine::before{background:#e2536a;}

/* ---- Shipment Status strip: dark bar -> light card matching Option D ---- */
body:where(.vch3):not(.vfhz) #ssCard{
  background:#ffffff !important;
  border:1px solid #d8d8d8 !important;
  border-left:4px solid #e2536a !important;
  color:#182530 !important;
}
body:where(.vch3):not(.vfhz) #ssCard .ss-card-title{color:#182530 !important;font-family:'Inter',sans-serif !important;font-weight:700 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-demo-pill{
  background:#e6e6e6 !important;color:#51616f !important;border:none !important;
  font-family:'IBM Plex Mono',monospace !important;font-size:9.5px !important;text-transform:uppercase !important;letter-spacing:.04em !important;
}
body:where(.vch3):not(.vfhz) #ssCard .ss-tab-btn{
  color:#51616f !important;font-family:'IBM Plex Mono',monospace !important;font-size:9.5px !important;
  text-transform:uppercase !important;letter-spacing:.04em !important;background:transparent !important;
}
body:where(.vch3):not(.vfhz) #ssCard .ss-tab-btn.ss-active{background:#e3edfb !important;color:#0a5aa8 !important;border-radius:20px !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-unread-text,
body:where(.vch3):not(.vfhz) #ssCard .ss-bell{color:#51616f !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-collapse-toggle{color:#7c8a99 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat{background:#f7f7f7 !important;border:1px solid #e4e4e4 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-n{font-family:'IBM Plex Mono',monospace !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-lbl{color:#51616f !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-feed-item{border-bottom:1px solid #e4e4e4 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-card-footnote{color:#7c8a99 !important;border-top:1px solid #e4e4e4 !important;}

body:where(.vch3):not(.vfhz) .CardHeader{background:#ffffff !important;border-bottom:1px solid #e4e4e4 !important;}

body:where(.vch3):not(.vfhz) .CardHeader a{color:#2f7de0 !important;}

/* ===================== OPTION D — theme variables (override block, must stay after the base rules above) ===================== */
body:where(.vch3):not(.vfhz){
  --od-bg:#D3D3D3; --od-panel:#ffffff; --od-panel2:#e6e6e6; --od-line:#d8d8d8; --od-lineSoft:#e4e4e4;
}
body:where(.vch3):not(.vfhz) .MainContainer.content-wrapper{background:var(--od-bg) !important;}
body:where(.vch3):not(.vfhz) .StaticBox{background:var(--od-panel) !important;border-top-color:var(--od-line) !important;border-right-color:var(--od-line) !important;border-bottom-color:var(--od-line) !important;}
body:where(.vch3):not(.vfhz) .Card{background:var(--od-panel) !important;border-color:var(--od-line) !important;}
body:where(.vch3):not(.vfhz) .CardHeader{background:var(--od-panel) !important;border-bottom-color:var(--od-lineSoft) !important;}
body:where(.vch3):not(.vfhz) .CardTitle{border-bottom-color:var(--od-lineSoft) !important;}
body:where(.vch3):not(.vfhz) #ssCard{background:var(--od-panel) !important;border-color:var(--od-line) !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-demo-pill{background:var(--od-panel2) !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat{background:var(--od-panel2) !important;border-color:var(--od-lineSoft) !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-feed-item{border-bottom-color:var(--od-lineSoft) !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-card-footnote{border-top-color:var(--od-lineSoft) !important;}

/* ---- Theme picker widget ---- */
.od-theme-picker{position:absolute;top:14px;right:20px;display:flex;align-items:center;gap:6px;z-index:5;}
.od-theme-picker .od-tlabel{font-family:'IBM Plex Mono',monospace;font-size:10px;color:rgba(255,255,255,.75);margin-right:2px;letter-spacing:.04em;}
.od-swatch{width:20px;height:20px;border-radius:6px;cursor:pointer;border:2px solid rgba(255,255,255,.55);padding:0;position:relative;transition:transform .12s ease;}
.od-swatch:hover{transform:translateY(-2px);}
.od-swatch.od-active{border-color:#ffffff;box-shadow:0 0 0 2px rgba(0,0,0,.25);}
.od-swatch.od-active::after{content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:10px;color:#182530;text-shadow:0 1px 1px rgba(255,255,255,.8);}
.ContentHeader{position:relative;}
@media (max-width:700px){ .od-theme-picker{position:static;justify-content:flex-end;padding:6px 20px 0;} }

/* ===================== Shipment Schedule calendar — restyled to match Option D artifact ===================== */
body:where(.vch3):not(.vfhz) li.grey.date_cell{background:transparent !important;}
body:where(.vch3):not(.vfhz) li.grey.date_cell > span{
  display:inline-flex !important;align-items:center;justify-content:center;
  background:#0a5aa8 !important;color:#fff !important;
  width:22px;height:22px;border-radius:50% !important;
  font-weight:700 !important;font-family:'IBM Plex Mono',monospace !important;
}
body:where(.vch3):not(.vfhz) .Cal_shipped,
body:where(.vch3):not(.vfhz) .Cal_shipped_blue{
  display:block !important;
  width:100% !important;height:4px !important;
  border-radius:2px !important;
  font-size:0 !important;line-height:0 !important;
  padding:0 !important;margin:3px auto 0 !important;
  text-indent:-9999px;
}
body:where(.vch3):not(.vfhz) .Cal_shipped{background:#1c7a43 !important;}
body:where(.vch3):not(.vfhz) .Cal_shipped_blue{background:#0a5aa8 !important;}
body:where(.vch3):not(.vfhz) .od-cal-legend{
  display:flex;gap:16px;margin-top:10px;padding-top:10px;border-top:1px solid #e4e4e4;
  font-family:'IBM Plex Mono',monospace;font-size:11px;color:#51616f;
}
body:where(.vch3):not(.vfhz) .od-cal-legend span{display:flex;align-items:center;gap:6px;}
body:where(.vch3):not(.vfhz) .od-cal-legend i{width:8px;height:8px;border-radius:2px;display:inline-block;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl16):not(.vfhz) .DashboardCardScroll{height:auto !important;overflow:visible !important;}

/* ===================== Shipment Status strip — remaining fixes ===================== */
body:where(.vch3):not(.vfhz) #ssCard .ss-feed-client{color:#7c8a99 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-feed-activity{color:#51616f !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat-prod{background:#fdf0e0 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat-transit{background:#e3edfb !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat-docs{background:#eceef0 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat-arrived{background:#e3f6ea !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat-recheck{background:#f1ecfa !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat-booked{background:#fdf0e0 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-stat{border:1px solid transparent !important;}

body:where(.vch3):not(.vfhz) li,
body:where(.vch3):not(.vfhz) .CardListing,
body:where(.vch3):not(.vfhz) .CardListing a,
body:where(.vch3):not(.vfhz) p,
body:where(.vch3):not(.vfhz) div{font-family:'Inter',sans-serif !important;}

/* ===================== Systematic artifact-parity pass ===================== */
/* Tabs: was 20px pill / 9.5px mono / 4px 9px — artifact spec is 6px / 11px sans / 5px 10px */
body:where(.vch3):not(.vfhz) .od-notif-tab{
  border-radius:6px !important;
  font-size:11px !important;
  padding:5px 10px !important;
  font-family:'Inter',sans-serif !important;
}
body:where(.vch3):not(.vfhz) .od-notif-tabs{border-radius:8px !important;}

/* Status pills: add the colored dot the artifact's .status::before defines */
body:where(.vch3):not(.vfhz) .od-status-pill{
  display:inline-flex !important;align-items:center !important;gap:5px !important;
  padding:2px 8px 2px 6px !important;
}
body:where(.vch3):not(.vfhz) .od-status-pill::before{
  content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0;
}

/* Activity Stream: add the missing colored dot before each item */
body:where(.vch3):not(.vfhz) #odActivityStream li{
  position:relative;padding-left:16px !important;
}
body:where(.vch3):not(.vfhz) #odActivityStream li::before{
  content:'';position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:50%;
}
body:where(.vch3):not(.vfhz) #odActivityStream li.estimate_blue::before{background:#0a5aa8;}
body:where(.vch3):not(.vfhz) #odActivityStream li.invoice_green::before{background:#1c7a43;}

/* Order Follow-ups deposit amounts: amber + mono to match .list .r */
body:where(.vch3):not(.vfhz) .od-deposit-amt{
  font-family:'IBM Plex Mono',monospace !important;font-weight:600 !important;color:#c2760c !important;
}

body:where(.vch3):not(.vfhz) .ContentHeader{height:54px !important;padding-top:0 !important;display:flex !important;align-items:center !important;}
body:where(.vch3):not(.vfhz) .ContentHeader .container-fluid{display:flex !important;align-items:flex-start !important;width:100% !important;}
body:where(.vch3):not(.vfhz) .od-theme-picker{top:50% !important;transform:translateY(-50%) !important;}

body:where(.vch3):not(.vfhz) .ContentHeader h1{font-size:20px !important;font-weight:700 !important;}

.od-inv-header{height:64px !important;padding-top:0 !important;display:flex !important;align-items:center !important;}
.od-inv-header .container-fluid{display:flex !important;flex-direction:column !important;justify-content:center !important;gap:3px !important;}
.od-inv-header h1{font-size:20px !important;font-weight:700 !important;line-height:1.1 !important;}
.od-inv-header .breadcrumbs{font-size:12.5px !important;}



/* ===== Global blue band reduction — applies site-wide; more specific per-page rules above still win ===== */
.ContentHeader{height:64px !important;padding-top:0 !important;display:flex !important;align-items:center !important;}
.ContentHeader .container-fluid{display:flex !important;flex-direction:column !important;justify-content:center !important;align-items:flex-start !important;gap:3px !important;width:100% !important;}
.ContentHeader h1{font-size:20px !important;font-weight:700 !important;line-height:1.1 !important;margin:0 !important;}
.ContentHeader .breadcrumbs{font-size:12.5px !important;margin:0 !important;padding:0 !important;}

/* ===== Option D theme (light touch) — site-wide page bg + panel color wash, falls back to current look if no theme saved ===== */
.MainContainer.content-wrapper{background:var(--od-bg, #f4f6f9) !important;}
.inv-panel{background:var(--od-panel, #ffffff) !important;}

.inv-loc-strip{margin-top:5px !important;margin-bottom:11px !important;}

body:where(.vch3):not(.vfhz) .StaticValueBox{margin-top:6px !important;}

body:where(.vch3):not(.vfhz) .rm-ticker-item{padding:6px 20px !important;font-size:12px !important;}

body:where(.vch3):not(.vfhz) .rm-ticker-wrap{height:30px !important;}

body:where(.vch3):not(.vfhz) .rm-ticker-track{height:30px !important;align-items:center !important;}
body:where(.vch3):not(.vfhz) .rm-ticker-item{height:30px !important;align-items:center !important;}

body:where(.vch3):not(.vfhz) .StaticBox{border-radius:6px !important;}

body:where(.vch3):not(.vfhz) .StaticBox{min-height:93.75px !important;height:93.75px !important;}

body:where(.vch3):not(.vfhz) .StaticBox{display:flex !important;align-items:center !important;}

body:where(.vch3):not(.vfhz) .StaticBox .value h3{font-size:20px !important;}

body:where(.vch3):not(.vfhz) .StaticBox .value{display:flex !important;flex-direction:column !important;}
body:where(.vch3):not(.vfhz) .StaticBox .value h3{order:2 !important;}
body:where(.vch3):not(.vfhz) .StaticBox .value p:nth-of-type(1){order:1 !important;}
body:where(.vch3):not(.vfhz) .StaticBox .value p:nth-of-type(2){order:3 !important;}

body:where(.vch3):not(.vfhz) .StaticBox .value h3{font-size:20px !important;font-weight:700 !important;font-family:'Roboto',sans-serif !important;letter-spacing:normal !important;}
body:where(.vch3):not(.vfhz) .StaticBox .value p:nth-of-type(2){font-size:11.5px !important;margin-top:4px !important;color:rgb(107,114,128) !important;}

body:where(.vch3):not(.vfhz) .StaticBox{padding:11px 10px !important;}

body:where(.vch3):not(.vfhz) .StaticBox{padding:12px 16px !important;}

body:where(.vch3):not(.vfhz) .StaticBox .value p:nth-of-type(1){margin-top:6px !important;}

body:where(.vch3):not(.vfhz) .StaticBox .value p:nth-of-type(2){white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;}

body:where(.vch3):not(.vfhz) .StaticBox .value p:nth-of-type(1){margin-bottom:8px !important;}
body:where(.vch3):not(.vfhz) .StaticBox .value h3{margin-top:0 !important;}

body:where(.vch3):not(.vfhz) #ssCard.card{background-color:#ffffff !important;border-radius:6px !important;border-left:4px solid #d9534f !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-card-header{background-color:#ffffff !important;border-radius:6px 6px 0 0 !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-card-body{background-color:#ffffff !important;}

body:where(.vch3):not(.vfhz) #ssCard .ss-card-header{background-image:none !important;background-color:#ffffff !important;}
body:where(.vch3):not(.vfhz) #ssCard .ss-card-body{background-image:none !important;background-color:#ffffff !important;}
body:where(.vch3):not(.vfhz) #ssCard{background-image:none !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading,
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed,
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-card-footnote{background-color:#1c2530 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading{color:#c8d0d8 !important;padding:10px 16px !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed{padding:0 16px !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-top{color:#e8eef3 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-client{color:#8b98a5 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-activity{color:#aab5be !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-item{border-color:#2c3947 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-card-footnote{color:#7c8a99 !important;padding:10px 16px !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading{background-color:#ffffff !important;color:#182530 !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-card-footnote{background-color:#ffffff !important;color:#7c8a99 !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading{color:#4a4a4a !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading{color:#2a2a2a !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading{color:#0d0d0d !important;font-weight:700 !important;}

#ssCard:not(.ss-collapsed) .ss-feed-heading h4{color:#2a2a2a !important;}

body:where(.vch3):not(.vfhz) #ssCard .ss-card-header{border-bottom:2px solid #e4e4e4 !important;}

#ssCard:not(.ss-collapsed) .ss-card-footnote{border-top:2px solid #e4e4e4 !important;}

#odActivityStream li.estimate_blue::before{background:#2f7de0 !important;}

#ssCard:not(.ss-collapsed) .ss-feed{background-color:#263344 !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed{background-color:var(--od-panel2, #44587a) !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-top{color:#182530 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-client{color:#51616f !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-activity{color:#7c8a99 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-item{border-color:var(--od-line, #2c3947) !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-inv{color:#182530 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-time{color:#7c8a99 !important;}
body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-tag{color:#51616f !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed{border-top:none !important;}

body:where(.vch3):not(.vfhz) #ssCard{border-bottom:none !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading h4{color:#4a4a4a !important;}

body:where(.vch3):not(.vfhz) #ssCard:not(.ss-collapsed) .ss-feed-heading h4{font-family:'Roboto',sans-serif !important;font-size:11px !important;font-weight:700 !important;letter-spacing:normal !important;color:rgb(71,85,105) !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl17):not(#vfhz) .CardTitle{border-bottom:none !important;}

body:where(.vch3):not(.vfhz) .CardTitle{border-bottom:none !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl17):not(#vfhz) .DashboardCardScroll{scrollbar-width:thin !important;}
body:where(.vch3):not(.vfhz) .Card:where(.vcl17):not(#vfhz) .DashboardCardScroll::-webkit-scrollbar{width:6px !important;}
body:where(.vch3):not(.vfhz) .Card:where(.vcl17):not(#vfhz) .DashboardCardScroll::-webkit-scrollbar-thumb{background:#c6cfd6 !important;border-radius:3px !important;}
body:where(.vch3):not(.vfhz) .Card:where(.vcl17):not(#vfhz) .DashboardCardScroll::-webkit-scrollbar-track{background:transparent !important;}

body:where(.vch3):not(.vfhz) #calendar_div{width:100% !important;font-size:11.5px !important;}
body:where(.vch3):not(.vfhz) #calender_section_top li{color:#7c8a99 !important;font-weight:600 !important;padding:4px 0 !important;font-size:10px !important;}
body:where(.vch3):not(.vfhz) #calender_section_bot li.date_cell{text-align:center !important;padding:7px 0 !important;color:#51616f !important;position:relative !important;}

body:where(.vch3):not(.vfhz) #calender_section_bot li.date_cell{border:none !important;}
body:where(.vch3):not(.vfhz) #calender_section_top li{border:none !important;}

body:where(.vch3):not(.vfhz) #calender_section_bot li{border:none !important;}

body:where(.vch3):not(.vfhz) #calender_section_bot{border:none !important;}

body:where(.vch3):not(.vfhz) .od-cal-legend{margin-top:4px !important;}

body:where(.vch3):not(.vfhz) #odCalNextShip{max-height:84px !important;overflow-y:auto !important;scrollbar-width:thin !important;}
body:where(.vch3):not(.vfhz) #odCalNextShip::-webkit-scrollbar{width:6px !important;}
body:where(.vch3):not(.vfhz) #odCalNextShip::-webkit-scrollbar-thumb{background:#c6cfd6 !important;border-radius:3px !important;}
body:where(.vch3):not(.vfhz) #odCalNextShip::-webkit-scrollbar-track{background:transparent !important;}

body:where(.vch3):not(.vfhz) .CardHeader{height:55px !important;min-height:55px !important;max-height:55px !important;display:flex !important;align-items:center !important;overflow:hidden !important;}

body:where(.vch3):not(.vfhz) .CardHeader{justify-content:space-between !important;}

body:where(.vch3):not(.vfhz) .Cal_Today{display:none !important;}

body:where(.vch3):not(.vfhz) .Cal_Ship_link_launch{display:none !important;}

body:where(.vch3):not(.vfhz) .Cal_Ship_link_head img{filter:brightness(0) saturate(100%) invert(24%) sepia(72%) saturate(2500%) hue-rotate(196deg) brightness(95%) contrast(101%) !important;}

body:where(.vch3):not(.vfhz) .Cal_Ship_link_head img{width:16px !important;height:16px !important;}

body:where(.vch3):not(.vfhz) .Cal_Ship_link_head_green img{margin-right:6px !important;}

body:where(.vch3):not(.vfhz) #calender_section h2{font-size:13px !important;}

body:where(.vch3):not(.vfhz) div:where(.vcl18):not(#vfhz):not(.vfhz):not(.vfhz):not(.vfhz){padding-top:20px !important;}

body:where(.vch3):not(.vfhz) .row.MainDashboard > [class*=col-]{padding-left:7px !important;padding-right:7px !important;}
body:where(.vch3):not(.vfhz) .row.MainDashboard{margin-left:-7px !important;margin-right:-7px !important;}

body:where(.vch3):not(.vfhz) #odCalNextShip{padding-left:10px !important;padding-right:10px !important;}

body:where(.vch3):not(.vfhz) #odCalNextShip{padding-bottom:10px !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl17):not(#vfhz) .DashboardCardScroll{height:440px !important;}

body:where(.vch3):not(.vfhz) .Cal_Prev_month img, body:where(.vch3):not(.vfhz) .Cal_Next_month img{display:none !important;}
body:where(.vch3):not(.vfhz) .Cal_Prev_month, body:where(.vch3):not(.vfhz) .Cal_Next_month{display:inline-flex !important;align-items:center !important;justify-content:center !important;width:22px !important;height:22px !important;}
body:where(.vch3):not(.vfhz) .Cal_Prev_month::before{content:'''' !important;display:block !important;width:7px !important;height:7px !important;border-left:2px solid #51616f !important;border-bottom:2px solid #51616f !important;transform:rotate(45deg) !important;}
body:where(.vch3):not(.vfhz) .Cal_Next_month::before{content:'''' !important;display:block !important;width:7px !important;height:7px !important;border-right:2px solid #51616f !important;border-top:2px solid #51616f !important;transform:rotate(45deg) !important;}

body:where(.vch3):not(.vfhz) .Cal_shipped:where(.vcl19):not(.vfhz){width:50% !important;left:0 !important;right:auto !important;}
body:where(.vch3):not(.vfhz) .Cal_shipped + .Cal_shipped_blue{width:50% !important;left:50% !important;right:auto !important;}

#ManagePrdTable2 thead th{font-family:'Roboto',sans-serif !important;font-size:14px !important;font-weight:400 !important;}

#odEstScroll, #odInvScroll{scrollbar-width:thin;}
#odEstScroll::-webkit-scrollbar, #odInvScroll::-webkit-scrollbar{width:6px;}
#odEstScroll::-webkit-scrollbar-thumb, #odInvScroll::-webkit-scrollbar-thumb{background:#c9c9c9;border-radius:4px;}
#odEstScroll::-webkit-scrollbar-track, #odInvScroll::-webkit-scrollbar-track{background:transparent;}

body:where(.vch3):not(.vfhz) .CardMoreLink::after, body:where(.vch3):not(.vfhz) .CardMoreLink a::after, body:where(.vch3):not(.vfhz) .CardMoreLink::before, body:where(.vch3):not(.vfhz) .CardMoreLink a::before{content:none !important;display:none !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl20):not(#vfhz), body:where(.vch3):not(.vfhz) .Card:where(.vcl21):not(#vfhz){height:458px !important;}
#odEstScroll, #odInvScroll{height:368px !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl20):not(#vfhz) .CardTitle.BlueLine::before{background:#0a5aa8 !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl17):not(#vfhz) .CardTitle.BlueLine::before{background:#7c8a99 !important;}

#odEstScroll li{padding-top:0px !important;padding-bottom:6px !important;}
#odEstScroll li[style*='0a5aa8']{padding-top:0px !important;padding-bottom:6px !important;}

#odInvScroll li{padding-top:0px !important;padding-bottom:6px !important;}
#odInvScroll li[style*='1c7a43']{padding-top:0px !important;padding-bottom:6px !important;}

#odEstScroll li{margin-bottom:2px !important;}

#odInvScroll li{margin-bottom:2px !important;}

#odEstScroll li span, #odInvScroll li span{width:4px !important;height:4px !important;}

body:where(.vch3):not(.vfhz) #odActivityStream li.invoice_green::before, body:where(.vch3):not(.vfhz) #odActivityStream li.estimate_blue::before{width:4px !important;height:4px !important;}

#estimateEditPage .ci-ribbon.estimateInfoRibbon{margin-left:1px !important;margin-right:1px !important;}

#dStatusChange{margin-left:6.5px !important;margin-right:1.5px !important;}

.form-group.row:where(.vcl22):not(#vfhz) + .ed-card{background:#fafbfc !important;}

.form-group.row:where(.vcl22):not(#vfhz){border-radius:0 !important;}

.form-group.row:where(.vcl22):not(#vfhz) + .ed-card{margin-top:10px !important;}

.form-group.row:where(.vcl22):not(#vfhz){padding-top:8px !important;padding-bottom:8px !important;}

body:where(.vch4):not(#vfhz) .ed-card{border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important;}

body:where(.vch4):not(#vfhz) .row.justify-content-center{border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important;}




body:where(.vch5):not(#vfhz) div:where(.vcl23):not(.vfhz):not(.vfhz):not(vfhz){display:flex !important;justify-content:center !important;align-items:center !important;padding-top:0px !important;padding-bottom:18px !important;padding-left:16px !important;padding-right:16px !important;margin-bottom:0 !important;}

body:where(.vch5):not(#vfhz) input.btn-green[onclick*='save_po_detail']{background:#336633 !important;border-color:#336633 !important;color:#fff !important;}
body:where(.vch5):not(#vfhz) input.btn-green[onclick*='save_po_detail']:hover{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important;}

body:where(.vch5):not(#vfhz) input.btn-green[onclick*='save_po_detail']{text-transform:none !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl24):not(.vfhz) .CardListing.RedLine li a::before,
body:where(.vch3):not(.vfhz) .Card:where(.vcl25):not(.vfhz) .CardListing li.RedLine a::before{width:4px !important;height:4px !important;border-radius:50% !important;top:50% !important;transform:translateY(-50%) !important;left:-14px !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl24):not(.vfhz) .DashboardCardScroll{scrollbar-width:thin !important;}
body:where(.vch3):not(.vfhz) .Card:where(.vcl24):not(.vfhz) .DashboardCardScroll::-webkit-scrollbar{width:6px !important;}
body:where(.vch3):not(.vfhz) .Card:where(.vcl24):not(.vfhz) .DashboardCardScroll::-webkit-scrollbar-thumb{background:#c9c9c9 !important;border-radius:4px !important;}
body:where(.vch3):not(.vfhz) .Card:where(.vcl24):not(.vfhz) .DashboardCardScroll::-webkit-scrollbar-track{background:transparent !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl24):not(.vfhz) .CardListing li{padding-bottom:6px !important;margin-bottom:4px !important;}

body:where(.vch3):not(.vfhz) .Card:where(.vcl26):not(#vfhz) div[style*='font-size:11px;color:#7c8a99'] { font-size:13px !important; }
body:where(.vch3):not(.vfhz) .Card:where(.vcl26):not(#vfhz) div[style*='font-size:10.5px;color:#7c8a99'] { font-size:12px !important; }
body:where(.vch3):not(.vfhz) .Card:where(.vcl26):not(#vfhz) div[style*='font-weight:600;color:#c0392b'] { font-size:13px !important; }
body:where(.vch3):not(.vfhz) .Card:where(.vcl26):not(#vfhz) div[style*='font-weight:600;color:#1c7a43'] { font-size:13px !important; }

body:where(.vch3):not(.vfhz) .Card:where(.vcl26):not(#vfhz) div[style*='font-size:9.5px;color:#7c8a99;margin-top:1px'] { font-size:11px !important; }
body:where(.vch3):not(.vfhz) .Card:where(.vcl26):not(#vfhz) div[style='font-size:10px;color:#7c8a99;'] { font-size:11.5px !important; }

/* Estimate page: don't enforce full-viewport min-height; let content size naturally */
#estimateEditPage.ContentArea {
  min-height: auto !important;
}
/* === Ported from nexgen (Sep 30 changes) - estimate edit page === */
body:where(.vch6):not(.vfhz) .ed-lineitems-card table.table{border-bottom:0 !important;border-left:0 !important;border-right:0 !important}
body:where(.vch6):not(.vfhz) input[name="btnSaveForm"],body:where(.vch6):not(.vfhz) #btnSaveCost,body:where(.vch6):not(.vfhz) #save_estimate_po{background-color:#336633 !important;border-color:#336633 !important;color:#fff !important}
body:where(.vch6):not(.vfhz):where(.vch0):not(#vfhz):where(.vch7):not(#vfhz):where(.vch8):not(#vfhz) :is(input[type="submit"],input[type="button"],input[type="reset"],button.btn,button.btn-green,a.btn):hover{background-color:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important}
body:where(.vch6):not(.vfhz):where(.vch0):not(#vfhz):where(.vch7):not(#vfhz):where(.vch8):not(#vfhz) input[type="file"]::file-selector-button:hover{background:#0069d9 !important;color:#fff !important}
body:where(.vch6):not(.vfhz) #btn_reset_cont_vol{background-color:#555555 !important;border-color:#555555 !important;color:#fff !important;font-family:Roboto,sans-serif !important;font-size:14px !important;font-weight:400 !important;text-transform:none !important;letter-spacing:normal !important}
body:where(.vch6):not(.vfhz):where(.vch0):not(#vfhz) #btnsort{font-family:Roboto,sans-serif !important;font-weight:400 !important;font-size:14px !important}
body:where(.vch6):not(.vfhz) #ResortTable > table > tbody > tr:last-child:not(:where(.vcl27):not(.vfhz):not(vfhz)) td,body:where(.vch6):not(.vfhz) #ResortTable > table > tbody > tr:last-child:not(:where(.vcl27):not(.vfhz):not(vfhz)) td *{font-size:14px !important}
body:where(.vch6):not(.vfhz) #frmCost table.table tbody tr:where(.vcl28):not(vfhz):not(vfhz):not(:where(.vcl29):not(vfhz)) td,body:where(.vch6):not(.vfhz) #frmCost table.table tbody tr:where(.vcl28):not(vfhz):not(vfhz):not(:where(.vcl29):not(vfhz)) td b{font-size:14px !important}
body:where(.vch6):not(.vfhz) .ed-lineitems-card .row:where(.vcl30):not(.vfhz):not(.vfhz):not(vfhz):not(:where(.vcl31):not(#vfhz)):not(:where(.vcl32):not(#vfhz)){flex-wrap:nowrap !important;padding-bottom:9.5px !important}
body:where(.vch6):not(.vfhz) .ed-lineitems-card .row:where(.vcl30):not(.vfhz):not(.vfhz):not(vfhz):not(:where(.vcl31):not(#vfhz)):not(:where(.vcl32):not(#vfhz)) > .col-8{flex:1 1 0 !important;min-width:0 !important;max-width:none !important;width:auto !important}
body:where(.vch6):not(.vfhz) .ed-lineitems-card .row:where(.vcl30):not(.vfhz):not(.vfhz):not(vfhz):not(:where(.vcl31):not(#vfhz)):not(:where(.vcl32):not(#vfhz)) > .col-4{flex:0 0 auto !important;max-width:none !important;width:auto !important}
body:where(.vch6):not(.vfhz) .ContentArea{padding-top:16px !important}
body:where(.vch6):not(.vfhz) .ci-ribbon.estimateInfoRibbon{margin-top:0 !important}
body:where(.vch6):not(.vfhz) .row > .row.justify-content-center:where(.vcl33):not(.vfhz):not(.vfhz){flex:0 0 100% !important;max-width:100% !important;width:100% !important}
body:where(.vch6):not(.vfhz) #ResortTable > table > thead > tr > th:nth-child(10),body:where(.vch6):not(.vfhz) #ResortTable > table > tbody > tr > td:nth-child(10){min-width:220px !important}
body:where(.vch6):not(.vfhz) #ResortTable > table > thead > tr > th:nth-child(12),body:where(.vch6):not(.vfhz) #ResortTable > table > tbody > tr > td:nth-child(12){min-width:260px !important}
body:where(.vch6):not(.vfhz) #estimateEditPage .coloredsortbar > .row:where(.vcl34):not(#vfhz){margin-bottom:12.5px !important}
body:where(.vch6):not(.vfhz) #suggestprice#suggestprice#suggestprice tbody tr:nth-child(2n+1):last-child td{background-color:#f7f7f7 !important;font-weight:400 !important}
body:where(.vch6):not(.vfhz) #suggestprice#suggestprice#suggestprice tbody tr:nth-child(2n):last-child td{background-color:#eef2f7 !important;font-weight:400 !important}
body:where(.vch6):not(.vfhz) #suggestprice#suggestprice#suggestprice tbody tr:last-child:hover td{background-color:#d7ebfa !important}
/* Legend in Resort row (matches nexgen): text 24.5px above table */
body:where(.vch6):not(.vfhz) .coloredsortbar ul.ColorLegend{margin-top:5px !important}
/* Dashboard top tiles - Option B icon badge cards */
.InfoBoxTop.sb-v2 .StaticBox{position:relative !important;display:flex !important;align-items:flex-start !important;gap:16px !important;padding:20px !important;height:100% !important;box-sizing:border-box !important;background:var(--od-panel,#ffffff) !important;border:1px solid #e2e8f0 !important;border-radius:12px !important;box-shadow:0 1px 2px rgba(15,23,42,.06) !important;transition:border-color .15s,box-shadow .15s}
.InfoBoxTop.sb-v2 .StaticBox::before{content:"";flex-shrink:0;width:44px;height:44px;border-radius:10px;background-position:center;background-repeat:no-repeat;background-size:22px 22px}
.InfoBoxTop.sb-v2 .BgEstimate::before{background-color:#e8f3fa;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%230a6ea8%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z%27/%3E%3Cpath d=%27M14 3v5h5%27/%3E%3Cpath d=%27M9 13h6%27/%3E%3Cpath d=%27M9 17h6%27/%3E%3C/svg%3E")}
.InfoBoxTop.sb-v2 .BgOrder::before{background-color:#eef2f7;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23475569%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M21 8l-9-5-9 5 9 5 9-5z%27/%3E%3Cpath d=%27M3 8v8l9 5 9-5V8%27/%3E%3Cpath d=%27M12 13v8%27/%3E%3C/svg%3E")}
.InfoBoxTop.sb-v2 .BgCustomer::before{background-color:#e7f4ec;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%232f7d4f%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M12 3v12%27/%3E%3Cpath d=%27M7 10l5 5 5-5%27/%3E%3Cpath d=%27M5 21h14%27/%3E%3C/svg%3E")}
.InfoBoxTop.sb-v2 .BgManufacturer::before{background-color:#fdf1e3;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23b45f06%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M12 21V9%27/%3E%3Cpath d=%27M7 14l5-5 5 5%27/%3E%3Cpath d=%27M5 3h14%27/%3E%3C/svg%3E")}
.InfoBoxTop.sb-v2 .StaticBox .icon{display:none !important}
.InfoBoxTop.sb-v2 .StaticBox .value{display:flex !important;flex-direction:column !important;gap:4px !important;min-width:0 !important;padding:0 !important;margin:0 !important;float:none !important;width:auto !important}
.InfoBoxTop.sb-v2 .StaticBox .value p:first-of-type{order:-1 !important;margin:0 !important;font-size:12px !important;font-weight:700 !important;color:#475569 !important;letter-spacing:.4px !important;text-transform:uppercase !important;line-height:1.3 !important}
.InfoBoxTop.sb-v2 .StaticBox .value h3{order:0 !important;margin:0 !important;font-size:30px !important;font-weight:700 !important;line-height:1.1 !important;color:#1f2933 !important}
.InfoBoxTop.sb-v2 .StaticBox .value p:nth-of-type(2){order:1 !important;margin:0 !important;font-size:13px !important;font-weight:400 !important;color:#475569 !important;text-transform:none !important;letter-spacing:normal !important}
.InfoBoxTop.sb-v2 .StaticBox .sb-link{order:2;margin-top:6px;font-size:12.5px;font-weight:600;color:#0a6ea8 !important;text-decoration:none !important}
.InfoBoxTop.sb-v2 .StaticBox .sb-link::after{content:"";position:absolute;inset:0;border-radius:12px}
.InfoBoxTop.sb-v2 .StaticBox:hover{border-color:#0a6ea8 !important;box-shadow:0 4px 12px rgba(15,23,42,.10) !important}
.InfoBoxTop.sb-v2 .StaticBox:hover .sb-link,.InfoBoxTop.sb-v2 .StaticBox .sb-link:hover,.InfoBoxTop.sb-v2 .StaticBox .sb-link:focus{text-decoration:none !important}
.InfoBoxTop.sb-v2 .StaticBox:focus-within{box-shadow:0 0 0 3px #bfdcf0 !important}
.InfoBoxTop.sb-v2 .StaticBox .sb-link:focus{outline:none}
/* Dashboard tiles - Option G footer strip on Option B cards */
.InfoBoxTop.sb-v2 .StaticBox{display:grid !important;grid-template-columns:44px minmax(0,1fr) !important;grid-template-rows:auto auto auto 1fr !important;column-gap:16px !important;row-gap:4px !important;align-items:start !important;padding:20px 20px 0 !important;overflow:hidden !important}
.InfoBoxTop.sb-v2 .StaticBox::before{grid-column:1 !important;grid-row:1 / span 3 !important}
.InfoBoxTop.sb-v2 .StaticBox .value{display:contents !important}
.InfoBoxTop.sb-v2 .StaticBox .value p:first-of-type{grid-column:2 !important;grid-row:1 !important}
.InfoBoxTop.sb-v2 .StaticBox .value h3{grid-column:2 !important;grid-row:2 !important}
.InfoBoxTop.sb-v2 .StaticBox .value p:nth-of-type(2){grid-column:2 !important;grid-row:3 !important}
.InfoBoxTop.sb-v2 .StaticBox .sb-link{grid-column:1 / -1 !important;grid-row:4 !important;align-self:end !important;display:flex !important;justify-content:space-between !important;align-items:center !important;margin:14px -20px 0 !important;padding:12px 20px !important;border-top:1px solid #eef1f5 !important;background:#fafbfc !important;font-size:13px !important;font-weight:600 !important;color:#0a6ea8 !important}
.InfoBoxTop.sb-v2 .StaticBox .sb-arrow{font-size:14px;line-height:1}
/* Dashboard header - date + theme pill with round dots (from header Option B) */
.ContentHeader .od-date{position:absolute;top:50%;right:244px;transform:translateY(-50%);font-family:Roboto,Arial,sans-serif;font-size:13px;font-weight:500;color:#e6f2fa;white-space:nowrap}
.ContentHeader #odThemePicker{display:flex !important;align-items:center !important;gap:6px !important;padding:5px 10px !important;background:#fafbfc !important;border:1px solid #e2e8f0 !important;border-radius:999px !important}
.ContentHeader #odThemePicker .od-tlabel{font-size:0 !important;margin:0 4px 0 0 !important;padding:0 !important;letter-spacing:0 !important}
.ContentHeader #odThemePicker .od-tlabel::after{content:"Theme";font-family:Roboto,Arial,sans-serif;font-size:11px;font-weight:700;color:#475569}
.ContentHeader #odThemePicker .od-swatch{width:18px !important;height:18px !important;min-width:0 !important;padding:0 !important;margin:0 !important;border-radius:50% !important;border:1px solid #b8c1cc !important;box-shadow:none !important;font-size:0 !important;line-height:0 !important;cursor:pointer}
.ContentHeader #odThemePicker .od-swatch::before,.ContentHeader #odThemePicker .od-swatch::after{display:none !important;content:none !important}
.ContentHeader #odThemePicker .od-swatch.od-active{border:2px solid #0a6ea8 !important;box-shadow:0 0 0 2px #ffffff inset !important}
.ContentHeader #odThemePicker .od-swatch:hover{border-color:#0a6ea8 !important}
.ContentHeader #odThemePicker .od-swatch:focus-visible{outline:2px solid #0a6ea8 !important;outline-offset:2px !important}
/* Admin top bar - Option B (balanced) */
header.header.tb-v2 .main-header{display:flex !important;align-items:center !important;height:67px !important;padding:0 20px 0 12px !important;background:#ffffff !important;border-bottom:1px solid #e2e8f0 !important;box-shadow:none !important}
header.header.tb-v2 .push-menu{width:40px !important;height:40px !important;display:flex !important;align-items:center !important;justify-content:center !important;border-radius:8px !important}
header.header.tb-v2 .push-menu:hover{background:#f1f5f9 !important}
header.header.tb-v2 .navbar-collapse{display:flex !important;flex:1 1 auto !important;flex-direction:row !important;justify-content:flex-end !important}
header.header.tb-v2 ul.navbar-nav{flex:1 1 auto !important;display:flex !important;flex-direction:row !important;align-items:center !important;gap:6px !important;margin:0 !important}
header.header.tb-v2 li.nav-search{flex:1 1 auto !important;display:flex !important;justify-content:center !important;margin:0 16px 0 24px !important;padding:0 !important;float:none !important}
header.header.tb-v2 #frmglobalsearch{position:relative !important;width:100% !important;max-width:560px !important;margin:0 !important}
header.header.tb-v2 #global_keyword{width:100% !important;height:40px !important;box-sizing:border-box !important;padding:0 14px 0 40px !important;border:1px solid #e2e8f0 !important;border-radius:10px !important;background:#f8fafc !important;font-family:Roboto,Arial,sans-serif !important;font-size:14px !important;color:#1f2933 !important;box-shadow:none !important}
header.header.tb-v2 #global_keyword:focus{outline:none !important;border-color:#0a6ea8 !important;background:#ffffff !important;box-shadow:0 0 0 3px #e8f3fa !important}
header.header.tb-v2 #frmglobalsearch .search-icon{position:absolute !important;left:12px !important;top:50% !important;right:auto !important;transform:translateY(-50%) !important;width:18px !important;height:18px !important;margin:0 !important;background:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%2364748b%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Ccircle cx=%2711%27 cy=%2711%27 r=%277%27/%3E%3Cline x1=%2721%27 y1=%2721%27 x2=%2716.65%27 y2=%2716.65%27/%3E%3C/svg%3E") no-repeat center/17px !important}
header.header.tb-v2 #frmglobalsearch .search-icon img{width:18px !important;height:18px !important;opacity:0 !important;display:block !important}
header.header.tb-v2 .dashboard-link-nav,header.header.tb-v2 .support-link-nav{display:flex !important;align-items:center !important;gap:7px !important;width:auto !important;height:40px !important;padding:0 12px !important;border-radius:8px !important;color:#334155 !important;font-family:Roboto,Arial,sans-serif !important;font-size:13px !important;font-weight:600 !important;text-decoration:none !important;background-image:none !important}
header.header.tb-v2 .dashboard-link-nav:hover,header.header.tb-v2 .support-link-nav:hover{background:#f1f5f9 !important;color:#0a6ea8 !important}
header.header.tb-v2 .dashboard-link-nav > span:first-child,header.header.tb-v2 .support-link-nav > span:first-child{display:inline-block !important;width:18px !important;height:18px !important;margin:0 !important;padding:0 !important}
header.header.tb-v2 .dashboard-link-nav > span:first-child{background:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23334155%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Crect x=%273%27 y=%273%27 width=%277%27 height=%277%27 rx=%271.5%27/%3E%3Crect x=%2714%27 y=%273%27 width=%277%27 height=%275%27 rx=%271.5%27/%3E%3Crect x=%2714%27 y=%2712%27 width=%277%27 height=%279%27 rx=%271.5%27/%3E%3Crect x=%273%27 y=%2714%27 width=%277%27 height=%277%27 rx=%271.5%27/%3E%3C/svg%3E") no-repeat center/18px !important}
header.header.tb-v2 .support-link-nav > span:first-child{background:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23334155%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Ccircle cx=%2712%27 cy=%2712%27 r=%279%27/%3E%3Cpath d=%27M9.5 9.5a2.5 2.5 0 1 1 3.6 2.2c-.7.4-1.1.9-1.1 1.8%27/%3E%3Cline x1=%2712%27 y1=%2717%27 x2=%2712%27 y2=%2717.01%27/%3E%3C/svg%3E") no-repeat center/18px !important}
header.header.tb-v2 li.user-menu{margin-left:8px !important;padding-left:14px !important;border-left:1px solid #e2e8f0 !important}
header.header.tb-v2 li.user-menu::before{display:none !important;content:none !important}
header.header.tb-v2 .user-link-nav{display:flex !important;align-items:center !important;gap:10px !important;width:auto !important;height:44px !important;padding:0 10px 0 4px !important;border:1px solid #e2e8f0 !important;border-radius:999px !important;background:#ffffff !important;text-decoration:none !important}
header.header.tb-v2 .user-link-nav:hover{border-color:#0a6ea8 !important}
header.header.tb-v2 .user-link-nav::after{display:none !important}
header.header.tb-v2 .user-link-nav > span:first-child{display:none !important}
header.header.tb-v2 .tb-label,header.header.tb-v2 .tb-user,header.header.tb-v2 .tb-uname,header.header.tb-v2 .tb-urole{background:none !important;width:auto !important;height:auto !important;min-width:0 !important;margin:0 !important;padding:0 !important;float:none !important;position:static !important}
header.header.tb-v2 .tb-label{display:inline !important;font-size:13px !important;font-weight:600 !important;color:inherit !important;line-height:1 !important}
header.header.tb-v2 .user-link-nav .tb-initial{width:34px !important;height:34px !important;min-width:34px !important;margin:0 !important;padding:0 !important;float:none !important;position:static !important;display:flex !important;align-items:center !important;justify-content:center !important;border-radius:50% !important;background-image:none !important;background-color:#e8f3fa !important;color:#08517c !important;font-family:Roboto,Arial,sans-serif !important;font-size:13px !important;font-weight:700 !important}
header.header.tb-v2 .user-link-nav .tb-user{display:flex !important;flex-direction:column !important;align-items:flex-start !important;line-height:1.2 !important;font-family:Roboto,Arial,sans-serif !important}
header.header.tb-v2 .user-link-nav .tb-uname{display:block !important;font-size:13px !important;font-weight:600 !important;color:#1f2933 !important;white-space:nowrap !important}
header.header.tb-v2 .user-link-nav .tb-urole{display:block !important;font-size:11px !important;color:#64748b !important}
header.header.tb-v2 .user-link-nav i.fa-angle-down{color:#64748b !important;font-size:14px !important;margin:0 !important}
header.header.tb-v2 li.user-menu::after{display:none !important;content:none !important}
/* Admin top bar - Option E profile menu */
header.header.tb-v2 .user-menu .dropdown-menu{width:280px !important;min-width:280px !important;padding:0 !important;margin-top:8px !important;border:1px solid #e2e8f0 !important;border-radius:12px !important;box-shadow:0 12px 32px rgba(15,23,42,.18) !important;overflow:hidden !important;background:#ffffff !important;left:auto !important;right:0 !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item{display:flex !important;align-items:center !important;gap:12px !important;height:40px !important;margin:0 6px !important;padding:0 10px !important;border-radius:8px !important;font-family:Roboto,Arial,sans-serif !important;font-size:13.5px !important;font-weight:400 !important;color:#1f2933 !important;background:transparent !important;white-space:nowrap !important;width:auto !important;border:none !important;letter-spacing:normal !important;text-transform:none !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item:hover,header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item:focus{background:#f1f5f9 !important;color:#0a6ea8 !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item:not(.user-name)::before{content:"" !important;flex:0 0 18px !important;width:18px !important;height:18px !important;background-repeat:no-repeat !important;background-position:center !important;background-size:18px !important;display:block !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item:nth-child(2){margin-top:6px !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href$="change_email.php"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23475569%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Crect x=%273%27 y=%275%27 width=%2718%27 height=%2714%27 rx=%272%27/%3E%3Cpolyline points=%273 7 12 13 21 7%27/%3E%3C/svg%3E") !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href$="change_username.php"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23475569%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Ccircle cx=%2712%27 cy=%278%27 r=%274%27/%3E%3Cpath d=%27M4 21c1.5-3.5 4.5-5 8-5s6.5 1.5 8 5%27/%3E%3C/svg%3E") !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href$="change_password.php"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23475569%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Crect x=%274%27 y=%2711%27 width=%2716%27 height=%2710%27 rx=%272%27/%3E%3Cpath d=%27M8 11V7a4 4 0 0 1 8 0v4%27/%3E%3C/svg%3E") !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href$="two_factor_setup.php"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23475569%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6l8-3z%27/%3E%3Cpolyline points=%279 12 11 14 15 10%27/%3E%3C/svg%3E") !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href$="logout.php"]{margin:6px 0 0 !important;padding:0 16px !important;height:48px !important;border-radius:0 !important;border-top:1px solid #eef1f5 !important;color:#b42318 !important;font-weight:600 !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href$="logout.php"]:hover{background:#fdecea !important;color:#8a1c12 !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href$="logout.php"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23b42318%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4%27/%3E%3Cpolyline points=%2716 17 21 12 16 7%27/%3E%3Cline x1=%2721%27 y1=%2712%27 x2=%279%27 y2=%2712%27/%3E%3C/svg%3E") !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item.user-name{height:auto !important;margin:0 !important;padding:16px !important;border-radius:0 !important;border-bottom:1px solid #eef1f5 !important;gap:12px !important;background:#ffffff !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item.user-name:hover{background:#fafbfc !important;color:#1f2933 !important}
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item.user-name::after{display:none !important;content:none !important}
header.header.tb-v2 .user-menu .dropdown-menu .tb-mh-avatar{width:42px;height:42px;flex:0 0 42px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#e8f3fa;color:#08517c;font-size:14px;font-weight:700}
header.header.tb-v2 .user-menu .dropdown-menu .tb-mh-text{display:flex;flex-direction:column;gap:2px;min-width:0}
header.header.tb-v2 .user-menu .dropdown-menu .tb-mh-name{font-size:14px;font-weight:700;color:#1f2933;overflow:hidden;text-overflow:ellipsis;letter-spacing:normal !important}
header.header.tb-v2 .user-menu .dropdown-menu .tb-mh-role{font-size:12px;font-weight:400;color:#64748b;letter-spacing:normal !important}
/* Portals without a search box: keep top-bar items on the right */
header.header.tb-v2 ul.navbar-nav{justify-content:flex-end !important}
/* Manufacturer dashboard - Awaiting Your Review tile + solo date */
.InfoBoxTop.sb-v2 .BgMfrReview::before{background-color:#e8f3fa;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%230a6ea8%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpolyline points=%2722 12 16 12 14 15 10 15 8 12 2 12%27/%3E%3Cpath d=%27M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z%27/%3E%3C/svg%3E")}
.ContentHeader .od-date.od-date-solo{right:20px}
/* Manufacturer dashboard - Open POs + Documents Pending tile icons */
.InfoBoxTop.sb-v2 .BgMfrPO::before{background-color:#fdf1e3;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23b45f06%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Crect x=%278%27 y=%272%27 width=%278%27 height=%274%27 rx=%271%27/%3E%3Cpath d=%27M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2%27/%3E%3Cline x1=%279%27 y1=%2712%27 x2=%2715%27 y2=%2712%27/%3E%3Cline x1=%279%27 y1=%2716%27 x2=%2715%27 y2=%2716%27/%3E%3C/svg%3E")}
.InfoBoxTop.sb-v2 .BgMfrDocs::before{background-color:#fdecea;background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23b42318%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z%27/%3E%3Cpath d=%27M14 3v5h5%27/%3E%3Cline x1=%2712%27 y1=%2711%27 x2=%2712%27 y2=%2715%27/%3E%3Cline x1=%2712%27 y1=%2718%27 x2=%2712%27 y2=%2718.01%27/%3E%3C/svg%3E")}
/* Manufacturer dashboard - tile row spacing matches admin (6px top, 27px/23px sides) */
.StaticValueBox:where(.vcl35):not(.vfhz){margin-top:6px !important;padding:0 15px 0 20px !important}
.StaticValueBox:where(.vcl35):not(.vfhz) > .container-fluid{padding:0 7.5px !important}
/* Manufacturer dashboard - 20px gap between tiles (outer edges unchanged) */
.StaticValueBox:where(.vcl35):not(.vfhz) .InfoBoxTop.sb-v2{margin-left:-10px !important;margin-right:-10px !important}
.StaticValueBox:where(.vcl35):not(.vfhz) .InfoBoxTop.sb-v2 > [class*="col-"]{padding-left:10px !important;padding-right:10px !important}
/* Manufacturer dashboard - Accounts Receivables amount at 26px */
.StaticValueBox:where(.vcl35):not(.vfhz) .InfoBoxTop.sb-v2 .BgCustomer .value h3{font-size:26px !important}
/* Manufacturer dashboard - dark blue ribbon on top of the Orders card */
body:where(.vch9):not(.vfhz) .ContentArea .Card{border-top:4px solid #1a3a63 !important}
/* Invoice page - bold Save Details and Save Additional Cost buttons */
body:where(.vch1):not(#vfhz) input[value="Save Details"], body:where(.vch1):not(#vfhz) #btnSaveCost{font-weight:700 !important}
/* Invoice page - Estimated Container Vol box and Reset button centred vertically */
body:where(.vch1):not(#vfhz) div:where(.vcl36):not(#vfhz){display:flex !important;flex-wrap:wrap !important;align-items:center !important;align-content:flex-start !important}
body:where(.vch1):not(#vfhz) div:where(.vcl36):not(#vfhz) > .oc-fld-label{flex:0 0 100% !important}
body:where(.vch1):not(#vfhz) div:where(.vcl36):not(#vfhz) > #total_cont_vol, body:where(.vch1):not(#vfhz) div:where(.vcl37):not(#vfhz) > #btn_reset_cont_vol{margin-top:0 !important;margin-bottom:0 !important}
/* Site-wide blue banner - 54px on every page to match the main dashboard */
body .ContentHeader:not(#vf-a):not(#vf-b){height:54px !important;min-height:0 !important;padding-top:0 !important;padding-bottom:0 !important;display:flex !important;align-items:center !important}
body .ContentHeader:not(#vf-a):not(#vf-b) .container-fluid{display:flex !important;flex-direction:column !important;justify-content:center !important;align-items:flex-start !important}
body .ContentHeader:not(#vf-a):not(#vf-b) h1{font-size:20px !important;font-weight:700 !important;line-height:1.1 !important;margin:0 !important}
body .ContentHeader:not(#vf-a):not(#vf-b) .breadcrumbs{font-size:12.5px !important;margin:0 !important;padding:0 !important}
/* Theme colour on every admin page (page background follows the saved dashboard theme) */
body .MainContainer.content-wrapper:not(#vf-c){background:var(--od-bg, #f4f6f9) !important}
/* Invoices list redesign (test page, scoped via .ng-ilr marker) */
body:where(.vch10):not(.vfhz) .ilr-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:18px 0 16px}
body:where(.vch10):not(.vfhz) .ilr-kpi{background:#fff;border:1px solid #d5dce4;border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
body:where(.vch10):not(.vfhz) .ilr-kpi-l{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#52606d}
body:where(.vch10):not(.vfhz) .ilr-kpi-v{font-size:26px;font-weight:700;color:#102a43}
body:where(.vch10):not(.vfhz) .ilr-kpi-s{font-size:12.5px;color:#52606d}
body:where(.vch10):not(.vfhz) .ilr-card{background:#fff;border:1px solid #d5dce4;border-top:4px solid #1a3a63;border-radius:10px;margin-bottom:16px}
body:where(.vch10):not(.vfhz) .ilr-filters{padding:16px 18px 14px;display:flex;flex-direction:column;gap:12px}
body:where(.vch10):not(.vfhz) .ilr-chips{display:flex;flex-wrap:wrap;gap:8px}
body:where(.vch10):not(.vfhz) a.ilr-chip{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:999px;border:1px solid #cbd2d9;background:#fff;color:#1f2933 !important;font-size:13px;font-weight:500;text-decoration:none !important}
body:where(.vch10):not(.vfhz) a.ilr-chip:hover{border-color:#1a3a63}
body:where(.vch10):not(.vfhz) a.ilr-chip.is-on{background:#1a3a63;border-color:#1a3a63;color:#fff !important}
body:where(.vch10):not(.vfhz) .ilr-form{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0}
body:where(.vch10):not(.vfhz) .ilr-form input[type=search],body:where(.vch10):not(.vfhz) .ilr-form select,body:where(.vch10):not(.vfhz) .ilr-form input[type=date]{height:40px;box-sizing:border-box;border:1px solid #cbd2d9;border-radius:8px;padding:0 10px;font-size:13.5px;background:#fff;color:#1f2933;margin:0;width:auto}
body:where(.vch10):not(.vfhz) .ilr-search{flex:1 1 280px;max-width:420px;margin:0}
body:where(.vch10):not(.vfhz) .ilr-search input{width:100% !important}
body:where(.vch10):not(.vfhz) .ilr-date,body:where(.vch10):not(.vfhz) .ilr-check{display:flex;align-items:center;gap:6px;margin:0;font-size:13px;color:#3e4c59;font-weight:500}
body:where(.vch10):not(.vfhz) .ilr-check{height:40px;padding:0 12px;border:1px solid #cbd2d9;border-radius:8px}
body:where(.vch10):not(.vfhz) .ilr-check input{width:16px;height:16px;margin:0}
body:where(.vch10):not(.vfhz) .ilr-btn{height:40px;padding:0 14px;border:1px solid #cbd2d9;border-radius:8px;background:#fff;color:#1f2933 !important;font-size:13.5px;font-weight:500;display:inline-flex;align-items:center;text-decoration:none !important;cursor:pointer}
body:where(.vch10):not(.vfhz) .ilr-btn-go{background:#2f5e34;border-color:#2f5e34;color:#fff !important;font-weight:700}
body:where(.vch10):not(.vfhz) .ilr-cols{position:relative;margin-left:auto}
body:where(.vch10):not(.vfhz) .ilr-cols-menu{position:absolute;right:0;top:46px;z-index:30;background:#fff;border:1px solid #cbd2d9;border-radius:10px;box-shadow:0 12px 32px rgba(15,23,42,.18);padding:10px 12px;display:flex;flex-direction:column;gap:8px;min-width:170px}
body:where(.vch10):not(.vfhz) .ilr-cols-menu[hidden]{display:none}
body:where(.vch10):not(.vfhz) .ilr-cols-menu label{display:flex;gap:8px;align-items:center;font-size:13px;margin:0;white-space:nowrap}
body:where(.vch10):not(.vfhz) .ilr-bulk{display:flex;align-items:center;gap:10px;padding:10px 18px;background:#1a3a63;color:#fff;border-radius:8px;margin:0 0 10px}
body:where(.vch10):not(.vfhz) .ilr-bulk[hidden]{display:none}
body:where(.vch10):not(.vfhz) .ilr-bulk b{font-size:13.5px;margin-right:6px}
body:where(.vch10):not(.vfhz) .ilr-bulk button{height:34px;padding:0 12px;border:0;border-radius:6px;background:#e8f3fa;color:#08517c;font-size:13px;font-weight:700;cursor:pointer}
body:where(.vch10):not(.vfhz) .ilr-bulk button.ilr-danger{background:transparent;border:1px solid #f3b4ae;color:#ffd9d5}
body:where(.vch10):not(.vfhz) .ilr-bulk button.ilr-link{margin-left:auto;background:transparent;color:#dbeaf6;text-decoration:underline;font-weight:400}
body:where(.vch10):not(.vfhz) table.tile:not(.ilr-ready){visibility:hidden}
body:where(.vch10):not(.vfhz) div:where(.vcl38):not(.vfhz):not(vfhz){overflow:visible !important}
body:where(.vch10):not(.vfhz) table.tile .ilr-hide{display:none !important}
body:where(.vch10):not(.vfhz) table.tile th,body:where(.vch10):not(.vfhz) table.tile td{vertical-align:middle !important}
body:where(.vch10):not(.vfhz) table.tile thead th{font-size:11px !important;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
body:where(.vch10):not(.vfhz) table.tile thead th #ddoperation{display:none !important}
body:where(.vch10):not(.vfhz) table.tile tbody td{padding-top:10px !important;padding-bottom:10px !important;font-size:13.5px}
body:where(.vch10):not(.vfhz) .ilr-selcol{width:44px;text-align:center}
body:where(.vch10):not(.vfhz) .ilr-selcol input{width:16px;height:16px;margin:0}
body:where(.vch10):not(.vfhz) .ilr-sub{font-size:12px;color:#616e7c;margin-top:2px;font-weight:400}
body:where(.vch10):not(.vfhz) .ilr-main{font-weight:500}
body:where(.vch10):not(.vfhz) .ilr-pill{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;border:1px solid}
body:where(.vch10):not(.vfhz) .s-grey{background:#eef1f5;color:#3b4754;border-color:#c3ccd6}
body:where(.vch10):not(.vfhz) .s-amber{background:#fff4e0;color:#7a4a00;border-color:#efc172}
body:where(.vch10):not(.vfhz) .s-blue{background:#e3f0fb;color:#0b4f86;border-color:#9cc6ea}
body:where(.vch10):not(.vfhz) .s-indigo{background:#e9ecfb;color:#2c3e8f;border-color:#b3bdf0}
body:where(.vch10):not(.vfhz) .s-purple{background:#f3e9fb;color:#5b2d86;border-color:#cfb3ea}
body:where(.vch10):not(.vfhz) .s-green{background:#e5f4ea;color:#1e6b3a;border-color:#a8d7b8}
body:where(.vch10):not(.vfhz) .s-red{background:#fdecea;color:#9b1c13;border-color:#f1aaa3}
body:where(.vch10):not(.vfhz) .ilr-cur{font-size:11px;color:#616e7c;margin-right:4px}
body:where(.vch10):not(.vfhz) .ilr-due{color:#b42318 !important;font-weight:700}
body:where(.vch10):not(.vfhz) .ilr-paid{display:inline-block;padding:3px 10px;border-radius:999px;background:#e5f4ea;color:#1e6b3a;font-size:12px;font-weight:700}
body:where(.vch10):not(.vfhz) .ilr-ops{position:relative;display:flex;justify-content:flex-end;align-items:center;gap:6px}
body:where(.vch10):not(.vfhz) a.ilr-open{display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:6px;background:#2f5e34;color:#fff !important;font-size:13px;font-weight:700;text-decoration:none !important}
body:where(.vch10):not(.vfhz) .ilr-more{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #cbd2d9;border-radius:6px;background:#fff;color:#3e4c59;cursor:pointer;padding:0}
body:where(.vch10):not(.vfhz) .ilr-more[aria-expanded=true]{border-color:#1a3a63;background:#e8f3fa;color:#1a3a63}
body:where(.vch10):not(.vfhz) .ilr-menu{position:absolute;right:0;top:38px;z-index:40;width:270px;background:#fff;border:1px solid #cbd2d9;border-radius:10px;box-shadow:0 12px 32px rgba(15,23,42,.18);padding:6px 0;text-align:left}
body:where(.vch10):not(.vfhz) .ilr-menu[hidden]{display:none}
body:where(.vch10):not(.vfhz) a.ilr-mi{display:flex !important;align-items:center;gap:12px;height:40px;padding:0 14px;color:#1f2933 !important;font-size:13.5px;text-decoration:none !important;white-space:nowrap;width:auto !important;margin:0 !important}
body:where(.vch10):not(.vfhz) a.ilr-mi:hover{background:#f1f5f9;color:#0a5a9a !important}
body:where(.vch10):not(.vfhz) a.ilr-mi svg{width:18px !important;height:18px !important;flex:0 0 18px}
body:where(.vch10):not(.vfhz) a.ilr-del{color:#b42318 !important;font-weight:700}
body:where(.vch10):not(.vfhz) .ilr-sep{height:1px;margin:6px 0;background:#e4e9ef}
body:where(.vch10):not(.vfhz) tr.ilr-selrow td{background:#eef5fb !important}
/* Invoices list redesign - fixes (Open button, menu links, row striping) */
body:where(.vch10):not(.vfhz) table.tile a.ilr-open{width:auto !important;min-width:0 !important;height:32px !important;padding:0 14px !important;background:#2f5e34 !important;color:#fff !important;border:0 !important;border-radius:6px !important;font-size:13px !important;font-weight:700 !important;line-height:32px !important;display:inline-flex !important;align-items:center !important;text-indent:0 !important;overflow:visible !important}
body:where(.vch10):not(.vfhz) table.tile a.ilr-mi{width:auto !important;height:40px !important;background:transparent !important;border:0 !important;border-radius:0 !important;padding:0 14px !important;line-height:normal !important}
body:where(.vch10):not(.vfhz) table.tile a.ilr-mi:hover{background:#f1f5f9 !important}
body:where(.vch10):not(.vfhz) table.tile tbody tr td{background:#fff !important;border-bottom:1px solid #e4e9ef !important}
body:where(.vch10):not(.vfhz) table.tile tbody tr:nth-child(even) td{background:#f8fafc !important}
body:where(.vch10):not(.vfhz) table.tile tbody tr.ilr-selrow td{background:#eef5fb !important}
/* List redesign - menu text fix + Estimates extras (test pages) */
body:where(.vch10):not(.vfhz) table.tile a.ilr-mi{justify-content:flex-start !important;text-align:left !important;font-size:13.5px !important;font-weight:400}
body:where(.vch10):not(.vfhz) table.tile a.ilr-mi span{font-size:13.5px !important}
body:where(.vch10):not(.vfhz) table.tile a.ilr-mi.ilr-del{font-weight:700}
body:where(.vch10):not(.vfhz) .s-orange{background:#fdeedd;color:#8a3c00;border-color:#f2b98a}
body:where(.vch11):not(.vfhz) .elr-rev{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:4px;background:#eef1f5;color:#3b4754;font-size:11px;font-weight:700;vertical-align:middle}
body:where(.vch11):not(.vfhz) .elr-np{color:#7b8794;font-style:italic;font-size:12.5px}
body:where(.vch11):not(.vfhz) table.tile td.elr-void{color:#7b8794 !important;text-decoration:line-through}
/* Invoices list - filter card ribbon green, matching the invoice page Line Items card */
body:where(.vch10):not(.vfhz):not(:where(.vch11):not(.vfhz)) .ilr-card{border-top-color:#336633 !important}
/* List redesign - admin-dashboard style footer on the summary tiles */
body:where(.vch10):not(.vfhz) .ilr-kpi{padding-bottom:0 !important;overflow:hidden}
body:where(.vch10):not(.vfhz) a.ilr-kpi-foot{margin:auto -18px 0;padding:12px 18px;display:flex;justify-content:space-between;align-items:center;background:#fafbfc;border-top:1px solid #eef1f5;color:#0a6ea8 !important;font-size:13px;font-weight:600;text-decoration:none !important}
body:where(.vch10):not(.vfhz) a.ilr-kpi-foot:hover,body:where(.vch10):not(.vfhz) a.ilr-kpi-foot:focus{background:#f1f5f9;color:#08517c !important;text-decoration:none !important}
body:where(.vch10):not(.vfhz) .ilr-kpi-arrow{font-size:14px;line-height:1}
body:where(.vch10):not(.vfhz) .ilr-kpi-s{margin-bottom:12px}
/* Site-wide: 16px space under the blue band (matches the estimate detail page); dashboard-type pages excluded */
body:not(:where(.vch3):not(.vfhz)) .ContentArea:not(#vf-a){padding-top:16px !important}
body:where(.vch10):not(.vfhz) .ilr-kpis{margin-top:0 !important}
/* Inventory pages: drop the old -24px pull-up so the 16px space under the band applies */
body #inventoryPage.ContentArea:not(#vf-b){margin-top:0 !important}
body #inventoryPage .inv-loc-strip:first-child{margin-top:0 !important}
/* Site-wide: green buttons turn blue #0069d9 on hover (matches the estimate detail page) */
body .btn-green:not(#vf-h):not(:disabled):hover, body .btn-success:not(#vf-h):not(:disabled):hover, body .btn.btn-primary:not(#vf-h):not(:disabled):hover, body .search-category-btn:not(#vf-h):not(:disabled):hover, body input[type=submit].btn-green:not(#vf-h):hover
{background-color:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important;text-decoration:none !important}
body:where(.vch10):not(.vfhz) table.tile a.ilr-open:not(#vf-h):hover, body:where(.vch10):not(.vfhz) .ilr-btn-go:not(#vf-h):hover
{background-color:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important;text-decoration:none !important}
body .btn-green, body .btn-success, body .search-category-btn, body a.ilr-open, body .ilr-btn-go{transition:background-color .15s, border-color .15s}
/* List pages - Reset dark grey, Columns light blue */
body:where(.vch10):not(.vfhz) .ilr-form > a.ilr-btn{background:#555555 !important;border-color:#555555 !important;color:#fff !important;font-weight:600}
body:where(.vch10):not(.vfhz) .ilr-form > a.ilr-btn:hover,body:where(.vch10):not(.vfhz) .ilr-form > a.ilr-btn:focus{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important}
body:where(.vch10):not(.vfhz) #ilrColsBtn{background:#e8f3fa !important;border-color:#e8f3fa !important;color:#08517c !important;font-weight:600}
body:where(.vch10):not(.vfhz) #ilrColsBtn:hover,body:where(.vch10):not(.vfhz) #ilrColsBtn:focus{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important}
/* List pages - Columns button follows Reset instead of being pinned to the right edge */
body:where(.vch10):not(.vfhz) .ilr-form .ilr-cols{margin-left:0 !important}
/* List pages - thin scrollbars (same look as .scroll-thin) */
html:where(.vch12):not(.vfhz), html:where(.vch12):not(.vfhz) *{scrollbar-width:thin;scrollbar-color:#c1c1c1 transparent}
html:where(.vch12):not(.vfhz)::-webkit-scrollbar, html:where(.vch12):not(.vfhz) ::-webkit-scrollbar{width:6px;height:6px}
html:where(.vch12):not(.vfhz)::-webkit-scrollbar-track, html:where(.vch12):not(.vfhz) ::-webkit-scrollbar-track{background:transparent}
html:where(.vch12):not(.vfhz)::-webkit-scrollbar-thumb, html:where(.vch12):not(.vfhz) ::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}
html:where(.vch12):not(.vfhz)::-webkit-scrollbar-thumb:hover, html:where(.vch12):not(.vfhz) ::-webkit-scrollbar-thumb:hover{background:#a8a8a8}
/* List pages - 16px above the table header */
body:where(.vch10):not(.vfhz) div.table-responsive:where(.vcl39):not(.vfhz):not(vfhz){margin-top:0 !important}
body:where(.vch10):not(.vfhz) .inv-panel-head + .tile-ribbon + .row:not(:where(.vcl40):not(.vfhz):not(vfhz)){display:none !important}
/* List pages - paging footer in the design style (square buttons, navy current page) */
body:where(.vch10):not(.vfhz) .ilr-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding:12px 0 4px;border-top:1px solid #e4e9ef;font-size:13px;color:#3e4c59}
body:where(.vch10):not(.vfhz) .ilr-pager strong{color:#1f2933;font-weight:700}
body:where(.vch10):not(.vfhz) .ilr-pager ul.pagination{margin:0 !important;display:flex;gap:6px;justify-content:flex-end !important;padding:0}
body:where(.vch10):not(.vfhz) .ilr-pager .page-item .page-link{width:32px !important;min-width:32px;height:32px !important;padding:0 !important;margin:0 !important;display:inline-flex !important;align-items:center;justify-content:center;border:1px solid #cbd2d9 !important;border-radius:6px !important;background:#fff !important;color:#1f2933 !important;font-size:13px !important;font-weight:500;line-height:1 !important;box-shadow:none !important;text-decoration:none !important}
body:where(.vch10):not(.vfhz) .ilr-pager .page-item.active .page-link{background:#1a3a63 !important;border-color:#1a3a63 !important;color:#fff !important;font-weight:700}
body:where(.vch10):not(.vfhz) .ilr-pager .page-item:not(.active):not(.disabled) .page-link:hover{border-color:#1a3a63 !important;color:#1a3a63 !important;background:#f1f5f9 !important}
body:where(.vch10):not(.vfhz) .ilr-pager .page-item.disabled .page-link{color:#9aa5b1 !important;background:#fff !important;cursor:default}
/* List pages - Rows per page dropdown in the paging footer */
body:where(.vch10):not(.vfhz) .ilr-pager-right{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
body:where(.vch10):not(.vfhz) .ilr-perpage{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;font-weight:400;color:#3e4c59;white-space:nowrap}
body:where(.vch10):not(.vfhz) .ilr-perpage select{height:32px;padding:0 8px;border:1px solid #cbd2d9;border-radius:6px;background:#fff;color:#1f2933;font-size:13px;cursor:pointer}
/* Inventory pages - green buttons use the standard dark green #336633 (hover stays blue) */
body:where(.vch13):not(.vfhz) .btn-primary, body:where(.vch13):not(.vfhz) .search-category-btn, body:where(.vch13):not(.vfhz) .btn-green, body:where(.vch13):not(.vfhz) .btn-success{background-color:#336633 !important;border-color:#336633 !important;color:#fff !important}
/* Manage Inventory - Import Receipt and Export in light blue (hover blue) */
body:where(.vch13):not(.vfhz) .inv-toolbar-actions a.btn.btn-secondary:not(#vf-l){background-color:#e8f3fa !important;border-color:#e8f3fa !important;color:#08517c !important;font-weight:600}
body:where(.vch13):not(.vfhz) .inv-toolbar-actions a.btn.btn-secondary:not(#vf-l):hover, body:where(.vch13):not(.vfhz) .inv-toolbar-actions a.btn.btn-secondary:not(#vf-l):focus{background-color:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important;text-decoration:none !important}
/* GLOBAL DEFAULT - every table header: 37px tall, Roboto 11.5px bold uppercase 0.23px (header colours stay per table; date pickers excluded) */
html body table:not(:is(.ui-datepicker, .datepicker, .daterangepicker, .bootstrap-datetimepicker-widget, .flatpickr-calendar) *) thead th:not(#vf-gt1):not(#vf-gt2){height:37px !important;padding-top:0 !important;padding-bottom:0 !important;line-height:17.25px !important;vertical-align:middle !important;box-sizing:border-box;font-family:Roboto, Arial, sans-serif !important;font-size:11.5px !important;font-weight:700 !important;text-transform:uppercase !important;letter-spacing:0.23px !important}
html body table:not(:is(.ui-datepicker, .datepicker, .daterangepicker, .bootstrap-datetimepicker-widget, .flatpickr-calendar) *) thead th:not(#vf-gt1):not(#vf-gt2) a, html body table:not(:is(.ui-datepicker, .datepicker, .daterangepicker, .bootstrap-datetimepicker-widget, .flatpickr-calendar) *) thead th:not(#vf-gt1):not(#vf-gt2) span{font-family:Roboto, Arial, sans-serif !important;font-size:11.5px !important;font-weight:700 !important;text-transform:uppercase !important;letter-spacing:0.23px !important;text-decoration:none !important}
/* Invoice + estimate detail pages - synced from nexgen: save banner padding, invoice grey background, Expand All spacing */
body:where(.vch1):not(#vfhz) .ContentArea:not(#vf-cab){background:transparent !important;background-color:transparent !important}
body:where(.vch1):not(#vfhz) #InvoiceTable > div:where(.vcl41):not(.vfhz):not(#vf-ea2){padding-bottom:0 !important}
body:where(.vch1):not(#vfhz) #InvoiceTable > .oc-section:not(.oc-section ~ .oc-section):not(#vf-ea2){margin-top:5px !important}
body:where(.vch1):not(#vfhz) .ContentArea .row.justify-content-center > .col-sm-10 > .alert.alert-success:not(#vf-sb9){padding-top:9px !important;padding-bottom:9px !important}
body #estimate_po_detail > div:where(.vcl42):not(.vfhz):not(#vf-ea){padding-bottom:0 !important}
body #estimate_po_detail > .oc-section:not(.oc-section ~ .oc-section):not(#vf-ea){margin-top:5px !important}
body:where(.vch0):not(#vfhz) .row.justify-content-center > .col-sm-10 > .alert.alert-success:not(#vf-sb9e){padding-top:9px !important;padding-bottom:9px !important}
/* Estimates list - estimate number colour #004080 (as on nexgen), no underline */
body #estimatesListPanel table.tile td a.bluetext:not(#vf-el), body #estimatesListPanel table.tile td a.bluetext:not(#vf-el):hover, body #estimatesListPanel table.tile td a.bluetext:not(#vf-el):focus{color:#004080 !important;text-decoration:none !important}
/* Invoices list - invoice number colour #004080 (as the estimate numbers), no underline */
body #invoiceListPanel table.tile td a.bluetext:not(#vf-il), body #invoiceListPanel table.tile td a.bluetext:not(#vf-il):hover, body #invoiceListPanel table.tile td a.bluetext:not(#vf-il):focus{color:#004080 !important;text-decoration:none !important}
/* Manage Products redesign (scoped via .ng-prd marker) */
body:where(.vch14):not(.vfhz) .vp-panel{background:#fff;border:1px solid #d5dce4;border-radius:10px;padding:18px 20px 8px;margin-bottom:16px}
body:where(.vch14):not(.vfhz) .vp-head{display:flex;align-items:baseline;gap:10px;padding-bottom:10px;border-bottom:1px solid #e1e5ec;margin-bottom:14px}
body:where(.vch14):not(.vfhz) .vp-title{font-size:16px;font-weight:700;color:#1f2933}
body:where(.vch14):not(.vfhz) .vp-subtitle{font-size:12.5px;color:#616e7c}
body:where(.vch14):not(.vfhz) .vp-scroll{overflow-x:auto}
body:where(.vch14):not(.vfhz) table.vp-table{width:100%;min-width:1150px;border-collapse:separate;border-spacing:0;font-size:13.5px;color:#1f2933}
body:where(.vch14):not(.vfhz) table.vp-table thead th{background:#675f80;color:#fff;padding-left:10px;padding-right:10px;text-align:left;white-space:nowrap;border:0}
body:where(.vch14):not(.vfhz) table.vp-table thead th:first-child{border-top-left-radius:6px}
body:where(.vch14):not(.vfhz) table.vp-table thead th:last-child{border-top-right-radius:6px}
body:where(.vch14):not(.vfhz) table.vp-table td{padding:10px;border-bottom:1px solid #e4e9ef;vertical-align:middle;background:#fff}
body:where(.vch14):not(.vfhz) table.vp-table tbody tr:nth-child(even) td{background:#f8fafc}
body:where(.vch14):not(.vfhz) table.vp-table tbody tr:hover td{background:#ece9f4}
body:where(.vch14):not(.vfhz) table.vp-table tbody tr.vp-selrow td{background:#eef5fb !important}
body:where(.vch14):not(.vfhz) table.vp-table .vp-sel{width:44px;padding-left:14px}
body:where(.vch14):not(.vfhz) table.vp-table .vp-sel input{width:16px;height:16px}
body:where(.vch14):not(.vfhz) table.vp-table th.vp-r, body:where(.vch14):not(.vfhz) table.vp-table td.vp-r{text-align:right}
body:where(.vch14):not(.vfhz) .vp-num{font-variant-numeric:tabular-nums}
body:where(.vch14):not(.vfhz) .vp-sub{font-size:12px;color:#616e7c;margin-top:2px}
body:where(.vch14):not(.vfhz) .vp-small{font-size:12px;color:#3e4c59}
body:where(.vch14):not(.vfhz) .vp-desc{font-size:13px;font-weight:600}
body:where(.vch14):not(.vfhz) .vp-muted{color:#9aa5b1}
body:where(.vch14):not(.vfhz) .vp-warn{color:#8a3c00;font-weight:600;font-size:12.5px}
body:where(.vch14):not(.vfhz) .vp-prod{display:flex;align-items:center;gap:10px}
body:where(.vch14):not(.vfhz) .vp-thumb{width:40px;height:40px;flex:0 0 40px;box-sizing:border-box;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:#eef2f6;border:1px solid #dfe5ec;color:#9aa5b1;padding:0}
body:where(.vch14):not(.vfhz) button.vp-thumb.has-img{cursor:pointer;background:#f0f7fc;border-color:#b9d6ea;color:#0a6ea8}
body:where(.vch14):not(.vfhz) button.vp-thumb.has-img:hover, body:where(.vch14):not(.vfhz) button.vp-thumb.has-img:focus-visible{background:#0069d9;border-color:#0069d9;color:#fff;outline:none}
body:where(.vch14):not(.vfhz) .vp-info{display:flex;flex-direction:column;gap:4px;min-width:0}
body:where(.vch14):not(.vfhz) a.vp-code{font-size:14px;font-weight:700;color:#004080;text-decoration:none}
body:where(.vch14):not(.vfhz) .vp-tags{display:flex;flex-wrap:wrap;gap:4px}
body:where(.vch14):not(.vfhz) .vp-tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}
body:where(.vch14):not(.vfhz) .vp-tag.vp-tag-hidden{background:#eceff3 !important;color:#52606d !important}
body:where(.vch14):not(.vfhz) .vp-cost{font-weight:700}
body:where(.vch14):not(.vfhz) .vp-cost .vp-sub{font-weight:400}
body:where(.vch14):not(.vfhz) .vp-empty{text-align:center;padding:36px 10px !important;color:#52606d}
body:where(.vch14):not(.vfhz) table.vp-table.vp-hide-pack .vp-c-pack, body:where(.vch14):not(.vfhz) table.vp-table.vp-hide-ids .vp-c-ids, body:where(.vch14):not(.vfhz) table.vp-table.vp-hide-vol .vp-c-vol, body:where(.vch14):not(.vfhz) table.vp-table.vp-hide-last .vp-c-last, body:where(.vch14):not(.vfhz) table.vp-table.vp-hide-alt .vp-c-alt{display:none}
body:where(.vch14):not(.vfhz) .vp-bulk{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px;padding:10px 14px;border-radius:8px;background:#1a3a63;color:#fff;font-size:13.5px}
body:where(.vch14):not(.vfhz) .vp-bulk[hidden]{display:none}
body:where(.vch14):not(.vfhz) .vp-bb{height:32px;padding:0 12px;border:0;border-radius:6px;background:#e8f3fa;color:#08517c;font-size:13px;font-weight:600;cursor:pointer}
body:where(.vch14):not(.vfhz) .vp-bb:hover, body:where(.vch14):not(.vfhz) .vp-bb:focus-visible{background:#0069d9;color:#fff}
body:where(.vch14):not(.vfhz) .vp-bb.vp-bb-del{background:#fff;color:#b42318;border:1px solid #f3b4ad;font-weight:700}
body:where(.vch14):not(.vfhz) .vp-bb.vp-bb-link{margin-left:auto;background:transparent;color:#fff;text-decoration:underline}
body:where(.vch14):not(.vfhz) a.vp-add{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:8px;background:#336633;color:#fff !important;font-size:13.5px;font-weight:700;text-decoration:none !important;white-space:nowrap}
body:where(.vch14):not(.vfhz) a.vp-add:hover, body:where(.vch14):not(.vfhz) a.vp-add:focus{background:#0069d9}
body:where(.vch14):not(.vfhz) .vp-lb{background:#e8f3fa !important;border-color:#e8f3fa !important;color:#08517c !important;font-weight:600}
body:where(.vch14):not(.vfhz) #vpReset{background:#555555 !important;border-color:#555555 !important;color:#fff !important;font-weight:600}
body:where(.vch14):not(.vfhz) .vp-lb:hover, body:where(.vch14):not(.vfhz) #vpReset:hover, body:where(.vch14):not(.vfhz) .vp-lb:focus, body:where(.vch14):not(.vfhz) #vpReset:focus{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important}
body:where(.vch14):not(.vfhz) select.vp-more{height:34px;padding:0 10px;border:1px solid #cbd2d9;border-radius:999px;font-size:13px;background:#fff;color:#1f2933}
body:where(.vch14):not(.vfhz) #vpBrand{height:40px;padding:0 10px;border:1px solid #cbd2d9;border-radius:8px;font-size:13.5px;background:#fff;max-width:240px}
body:where(.vch14):not(.vfhz) a.vp-edit:hover, body:where(.vch14):not(.vfhz) a.vp-edit:focus{background:#0069d9 !important;color:#fff !important}
body:where(.vch14):not(.vfhz) a.vp-mi{justify-content:flex-start !important;text-align:left;font-size:13.5px !important}
body:where(.vch14):not(.vfhz) a.vp-mi.ilr-del{color:#b42318 !important;font-weight:700}
body:where(.vch14):not(.vfhz) .ilr-menu .ilr-sep{height:1px;background:#e4e9ef;margin:4px 0}
/* Manage Products redesign - band button placement + chip pills */
body:where(.vch14):not(.vfhz) .ContentHeader{position:relative}
body:where(.vch14):not(.vfhz) .ContentHeader a.vp-add{position:absolute;right:28px;top:50%;transform:translateY(-50%)}
body:where(.vch14):not(.vfhz) #vpChips button.ilr-chip{height:34px;padding:0 14px;border:1px solid #cbd2d9;border-radius:999px;background:#fff;color:#1f2933;font-size:13px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
body:where(.vch14):not(.vfhz) #vpChips button.ilr-chip b{font-weight:700}
body:where(.vch14):not(.vfhz) #vpChips button.ilr-chip:hover{border-color:#1a3a63}
body:where(.vch14):not(.vfhz) #vpChips button.ilr-chip.is-on{background:#1a3a63;border-color:#1a3a63;color:#fff}
body:where(.vch14):not(.vfhz) #vpChips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
/* Manage Products - brief highlight when a summary tile points to a filter */
@keyframes vpFlash{0%{box-shadow:0 0 0 0 rgba(0,105,217,.55)}60%{box-shadow:0 0 0 6px rgba(0,105,217,.25)}100%{box-shadow:0 0 0 0 rgba(0,105,217,0)}}
body:where(.vch14):not(.vfhz) .vp-flash{animation:vpFlash 1.5s ease-out 1;border-radius:10px}
/* Edit Product redesign (scoped via .ng-pe marker) */
body:where(.vch15):not(.vfhz) .pe-flat{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;max-width:none !important;width:100% !important;margin:0 !important;flex:1 1 auto !important}
body:where(.vch15):not(.vfhz) .pe-root{display:flex;flex-direction:column;gap:10px;margin-top:0}
body:where(.vch15):not(.vfhz) .pe-ribbon{background:#fff;border:1px solid #d5dce4;border-top:4px solid #675f80;border-radius:10px;padding:12px 20px;display:flex;flex-wrap:wrap;gap:24px;align-items:center}
body:where(.vch15):not(.vfhz) .pe-rb{display:flex;flex-direction:column;gap:4px;min-width:0}
body:where(.vch15):not(.vfhz) .pe-rb-l{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#616e7c}
body:where(.vch15):not(.vfhz) .pe-code{font-size:15px;font-weight:700;color:#004080}
body:where(.vch15):not(.vfhz) .pe-strong{font-weight:700;font-variant-numeric:tabular-nums;color:#1f2933}
body:where(.vch15):not(.vfhz) .pe-green{color:#1e6b3a !important}
body:where(.vch15):not(.vfhz) .pe-muted{color:#7b8794}
body:where(.vch15):not(.vfhz) .pe-pill{align-self:flex-start;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700}
body:where(.vch15):not(.vfhz) .pe-pill-cat{background:#e9ecfb;color:#2c3e8f}
body:where(.vch15):not(.vfhz) .pe-pill-on{background:#e5f4ea;color:#1e6b3a}
body:where(.vch15):not(.vfhz) .pe-pill-off{background:#eceff3;color:#52606d}
body:where(.vch15):not(.vfhz) .pe-bar{display:flex;justify-content:flex-end;align-items:center;gap:10px;font-size:12px}
body:where(.vch15):not(.vfhz) .pe-toggle{border:0;background:transparent;color:#64748b;font-size:12px;font-weight:600;cursor:pointer;padding:0}
body:where(.vch15):not(.vfhz) .pe-sep{color:#cbd5e1}
body:where(.vch15):not(.vfhz) .pe-saved{color:#94a3b8}
body:where(.vch15):not(.vfhz) .pe-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
@media (max-width:1100px){body:where(.vch15):not(.vfhz) .pe-layout{grid-template-columns:1fr}}
body:where(.vch15):not(.vfhz) .pe-main{display:flex;flex-direction:column;gap:14px;min-width:0}
body:where(.vch15):not(.vfhz) .pe-sec{background:#e5e9ee;border-radius:10px}
body:where(.vch15):not(.vfhz) .pe-sec-head{width:100%;display:flex;align-items:center;border:0;padding:0;background:transparent;cursor:pointer;text-align:left}
body:where(.vch15):not(.vfhz) .pe-sec-tab{display:flex;align-items:center;gap:12px;height:40px;padding:0 18px;min-width:290px;box-sizing:border-box;color:#fff;border-radius:10px 0 10px 0;font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
body:where(.vch15):not(.vfhz) .pe-sec-num{width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px}
body:where(.vch15):not(.vfhz) .pe-sec-arrow{margin-left:auto}
body:where(.vch15):not(.vfhz) .pe-sec-hint{padding-left:14px;font-size:12px;color:#52606d}
body:where(.vch15):not(.vfhz) .pe-sec-body{padding:16px 18px 6px;background:#f4f6f9;border-radius:0 0 10px 10px}
body:where(.vch15):not(.vfhz) .pe-sec.pe-closed .pe-sec-body{display:none}
body:where(.vch15):not(.vfhz) .pe-grid{display:grid;gap:14px;margin-bottom:14px}
body:where(.vch15):not(.vfhz) .pe-f{display:flex;flex-direction:column;gap:6px;min-width:0}
body:where(.vch15):not(.vfhz) .pe-l{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#3e4c59;margin:0}
body:where(.vch15):not(.vfhz) .pe-req{color:#b42318}
body:where(.vch15):not(.vfhz) .pe-f .form-control, body:where(.vch15):not(.vfhz) .pe-f select, body:where(.vch15):not(.vfhz) .pe-f input[type=text]{width:100% !important;max-width:none !important;height:38px;border:1px solid #cbd2d9 !important;border-radius:8px !important;font-size:13.5px !important;padding:0 10px !important;box-sizing:border-box;background-color:#fff}
body:where(.vch15):not(.vfhz) .pe-f textarea.form-control, body:where(.vch15):not(.vfhz) .pe-f textarea{height:auto !important;min-height:62px;padding:8px 10px !important}
body:where(.vch15):not(.vfhz) .pe-ro .form-control, body:where(.vch15):not(.vfhz) .pe-ro input{background-color:#eef1f5 !important;font-weight:700;color:#1f2933}
body:where(.vch15):not(.vfhz) .pe-f > a{font-size:12px;font-weight:600}
body:where(.vch15):not(.vfhz) .pe-f .form-control-feedback{font-size:12px;color:#b42318}
body:where(.vch15):not(.vfhz) .pe-links{margin:-6px 0 12px;font-size:12.5px}
body:where(.vch15):not(.vfhz) .pe-links a{color:#0a6ea8;font-weight:600}
body:where(.vch15):not(.vfhz) .pe-sub{margin:2px 0 12px;padding-top:12px;border-top:1px dashed #cbd2d9;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#52606d}
body:where(.vch15):not(.vfhz) .pe-chips{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px}
body:where(.vch15):not(.vfhz) .pe-chip{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px;border-radius:999px;background:#fff;border:1px solid #cbd2d9;font-size:13px;cursor:pointer;margin:0}
body:where(.vch15):not(.vfhz) .pe-chip.is-on{background:#e5f4ea;border-color:#a8d7b8;color:#1e6b3a;font-weight:700}
body:where(.vch15):not(.vfhz) .pe-chip input{margin:0 !important;width:16px;height:16px;position:static !important}
body:where(.vch15):not(.vfhz) .pe-brands{background:#fff;border:1px solid #d5dce4;border-radius:8px;overflow:hidden;margin-bottom:14px}
body:where(.vch15):not(.vfhz) .pe-brands > .form-group{margin:0 !important;background:#675f80;align-items:center;min-height:37px;padding:4px 0}
body:where(.vch15):not(.vfhz) .pe-brands > .form-group, body:where(.vch15):not(.vfhz) .pe-brands > .form-group label, body:where(.vch15):not(.vfhz) .pe-brands > .form-group div{color:#fff !important;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.23px}
body:where(.vch15):not(.vfhz) .pe-brands > .form-group input[type=button]{background:#e8f3fa !important;color:#08517c !important;border:0 !important;border-radius:6px !important;font-weight:600;text-transform:none}
body:where(.vch15):not(.vfhz) .pe-brands .contentBrBc{padding:6px 8px}
body:where(.vch15):not(.vfhz) .pe-side{display:flex;flex-direction:column;gap:14px;position:sticky;top:16px}
body:where(.vch15):not(.vfhz) .pe-card{background:#fff;border:1px solid #d5dce4;border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:8px;font-size:13px}
body:where(.vch15):not(.vfhz) .pe-card-t{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#52606d}
body:where(.vch15):not(.vfhz) .pe-imgcard .form-group{display:block !important;margin:0 0 10px !important}
body:where(.vch15):not(.vfhz) .pe-imgcard .form-group > *{max-width:100% !important;width:100% !important;flex:none !important;padding:0 !important;text-align:left !important}
body:where(.vch15):not(.vfhz) .pe-imgcard label{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#3e4c59}
body:where(.vch15):not(.vfhz) .pe-imgcard .form-control{display:inline-block;width:calc(100% - 30px) !important;height:36px;border:1px solid #cbd2d9 !important;border-radius:8px !important;font-size:12.5px !important}
body:where(.vch15):not(.vfhz) .pe-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:4px 0;border-bottom:1px solid #eef1f5}
body:where(.vch15):not(.vfhz) .pe-row:last-child{border-bottom:0}
body:where(.vch15):not(.vfhz) .pe-row > span:first-child{color:#3e4c59}
body:where(.vch15):not(.vfhz) .pe-row-hi .pe-strong{color:#1e6b3a}
body:where(.vch15):not(.vfhz) .pe-link{font-weight:600;color:#0a6ea8;text-decoration:none;margin-top:4px}
body:where(.vch15):not(.vfhz) .pe-actions{display:flex;justify-content:center;gap:10px;margin:8px 0 4px}
body:where(.vch15):not(.vfhz) .pe-actions input{height:40px !important;padding:0 22px !important;border-radius:8px !important;font-size:13.5px !important;font-weight:700 !important;text-transform:none !important;border:0 !important;color:#fff !important}
body:where(.vch15):not(.vfhz) .pe-actions input[name=save_products]{background:#336633 !important}
body:where(.vch15):not(.vfhz) .pe-actions input[type=button]{background:#555555 !important}
body:where(.vch15):not(.vfhz) .pe-actions input:hover{background:#0069d9 !important}
body:where(.vch15):not(.vfhz) .ContentHeader{position:relative}
body:where(.vch15):not(.vfhz) .pe-band-actions{position:absolute;right:28px;top:50%;transform:translateY(-50%);display:flex;gap:8px}
body:where(.vch15):not(.vfhz) .pe-bb{height:36px;padding:0 16px;border:0;border-radius:8px;font-size:13.5px;font-weight:700;cursor:pointer;color:#fff}
body:where(.vch15):not(.vfhz) .pe-bb-back{background:#555555}
body:where(.vch15):not(.vfhz) .pe-bb-save{background:#336633}
body:where(.vch15):not(.vfhz) .pe-bb:hover, body:where(.vch15):not(.vfhz) .pe-bb:focus{background:#0069d9}
/* Edit Product - brands & barcodes (+) toggle visible on the purple header */
body:where(.vch15):not(.vfhz) .pe-brands .toggleBrBc{background-image:none !important;cursor:pointer;display:flex !important;align-items:center;justify-content:center;min-height:37px;user-select:none}
body:where(.vch15):not(.vfhz) .pe-brands .toggleBrBc::before{content:"+";color:#fff;font-size:22px;font-weight:700;line-height:1}
body:where(.vch15):not(.vfhz) .pe-brands .toggleBrBc.expanded::before{content:"\2212"}
body:where(.vch15):not(.vfhz) .pe-brands .toggleBrBc:hover::before{color:#e8f3fa}
/* Invoice page - no hover highlight on the Line Items totals row (last row) */
body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped tbody tr:last-child:not(#vf-tot):hover, body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped tbody tr:last-child:not(#vf-tot):hover > td{background:transparent !important;background-color:transparent !important}
/* Invoice page - no vertical divider lines in the Line Items totals row (last row) */
body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped tbody tr:last-child > td:not(#vf-tv){border-left:0 !important;border-right:0 !important}
body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped tbody tr:last-child > td:first-child:not(#vf-tv){border-left:1px solid #eef1f5 !important}
/* Invoice page - no side borders on the Line Items table below the header */
body:where(.vch1):not(#vfhz) .ed-lineitems-card div.content.greenhead:where(.vcl43):not(.vfhz):not(vfhz):not(#vf-sb):not(#vf-sb2){border-left:0 !important;border-right:0 !important}
body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped tbody tr > td:first-child:not(#vf-sb):not(#vf-sb2){border-left:0 !important}
body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped tbody tr > td:last-of-type:not(#vf-sb):not(#vf-sb2){border-right:0 !important}
/* Invoice page - "Totals" label in the first cell of the Line Items totals row */
body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped > tbody > tr:last-child > td:first-child:not(#vf-tl){text-align:left !important;white-space:nowrap}
body:where(.vch1):not(#vfhz) .ed-lineitems-card table.green-striped > tbody > tr:last-child > td:first-child:not(#vf-tl)::before{content:"Totals";font-weight:700;font-size:14px;color:#1f2933}
/* ===== Global View redesign (copied from nexgen) ===== */
/* Global View redesign (test page, scoped via .ng-gvr marker) */
body:where(.vch16):not(.vfhz) .gvr-panel{background:#fff;border:1px solid #d5dce4;border-radius:10px;padding:18px 20px 8px;margin-bottom:16px}
body:where(.vch16):not(.vfhz) .gvr-head{display:flex;align-items:baseline;gap:10px;padding-bottom:10px;border-bottom:1px solid #e1e5ec;margin-bottom:16px}
body:where(.vch16):not(.vfhz) .gvr-title{font-size:16px;font-weight:700;color:#1f2933}
body:where(.vch16):not(.vfhz) .gvr-subtitle{font-size:12.5px;color:#616e7c}
body:where(.vch16):not(.vfhz) .gvr-scroll{overflow-x:auto}
body:where(.vch16):not(.vfhz) table.gvr-table{width:100%;min-width:1180px;border-collapse:separate;border-spacing:0;font-size:13.5px;color:#1f2933}
body:where(.vch16):not(.vfhz) table.gvr-table thead th{background:#1a3a63;color:#fff;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:12px 10px;text-align:left;white-space:nowrap;border:0}
body:where(.vch16):not(.vfhz) table.gvr-table thead th:first-child{border-top-left-radius:6px}
body:where(.vch16):not(.vfhz) table.gvr-table thead th:last-child{border-top-right-radius:6px}
body:where(.vch16):not(.vfhz) table.gvr-table td{padding:10px;border-bottom:1px solid #e4e9ef;vertical-align:middle;background:#fff}
body:where(.vch16):not(.vfhz) table.gvr-table tbody tr:nth-child(even) td{background:#f8fafc}
body:where(.vch16):not(.vfhz) table.gvr-table th.gvr-r, body:where(.vch16):not(.vfhz) table.gvr-table td.gvr-r{text-align:right}
body:where(.vch16):not(.vfhz) .gvr-num{font-variant-numeric:tabular-nums}
body:where(.vch16):not(.vfhz) a.gvr-id{font-size:14px;font-weight:700;color:#0a5a9a;text-decoration:none}
body:where(.vch16):not(.vfhz) .gvr-sub{font-size:12px;color:#616e7c;margin-top:2px}
body:where(.vch16):not(.vfhz) .gvr-sub2{font-size:11.5px;color:#7b8794;margin-top:1px}
body:where(.vch16):not(.vfhz) .gvr-main{font-weight:500}
body:where(.vch16):not(.vfhz) .gvr-dots{display:flex;gap:4px;margin-bottom:6px}
body:where(.vch16):not(.vfhz) .gvr-dot{width:10px;height:10px;border-radius:50%;box-sizing:border-box;background:#fff;border:1.5px solid #9aa5b1;display:inline-block}
body:where(.vch16):not(.vfhz) .gvr-dot.is-done{background:#2f7d4a;border-color:#2f7d4a}
body:where(.vch16):not(.vfhz) .gvr-bar{height:6px;border-radius:3px;background:#e4e9ef;overflow:hidden;margin-bottom:6px;min-width:110px}
body:where(.vch16):not(.vfhz) .gvr-fill{height:100%;background:#0a6ea8}
body:where(.vch16):not(.vfhz) .gvr-fill.is-full{background:#2f7d4a}
body:where(.vch16):not(.vfhz) .gvr-owe{color:#8a3c00}
body:where(.vch16):not(.vfhz) .gvr-muted{color:#7b8794}
body:where(.vch16):not(.vfhz) .gvr-profit{color:#1e6b3a;font-weight:600}
body:where(.vch16):not(.vfhz) .gvr-empty{text-align:center;padding:36px 10px !important;color:#52606d}
body:where(.vch16):not(.vfhz) table.gvr-table.gvr-hide-docs .gvr-c-docs, body:where(.vch16):not(.vfhz) table.gvr-table.gvr-hide-sup .gvr-c-sup, body:where(.vch16):not(.vfhz) table.gvr-table.gvr-hide-profit .gvr-c-profit{display:none}
body:where(.vch16):not(.vfhz) .gvr-kv-red{color:#b42318 !important}
body:where(.vch16):not(.vfhz) .gvr-kv-amber{color:#8a3c00 !important}
body:where(.vch16):not(.vfhz) .gvr-kv-green{color:#1e6b3a !important}
body:where(.vch16):not(.vfhz) a.gvr-open:hover, body:where(.vch16):not(.vfhz) a.gvr-open:focus{background:#0069d9 !important;color:#fff !important}
body:where(.vch16):not(.vfhz) a.gvr-mi{justify-content:flex-start !important;text-align:left;font-size:13.5px !important}
body:where(.vch16):not(.vfhz) #gvReset{background:#555555 !important;border-color:#555555 !important;color:#fff !important;font-weight:600}
body:where(.vch16):not(.vfhz) #gvExport{background:#e8f3fa !important;border-color:#e8f3fa !important;color:#08517c !important;font-weight:600}
body:where(.vch16):not(.vfhz) #gvReset:hover, body:where(.vch16):not(.vfhz) #gvExport:hover, body:where(.vch16):not(.vfhz) #gvReset:focus, body:where(.vch16):not(.vfhz) #gvExport:focus{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important}
/* Global View redesign - documents checklist card */
body:where(.vch16):not(.vfhz) button.gvr-docbtn{display:block;background:none;border:0;padding:4px 6px;margin:-4px -6px;border-radius:6px;cursor:pointer;text-align:left;font:inherit;color:inherit}
body:where(.vch16):not(.vfhz) button.gvr-docbtn:hover, body:where(.vch16):not(.vfhz) button.gvr-docbtn[aria-expanded=true], body:where(.vch16):not(.vfhz) button.gvr-docbtn:focus-visible{background:#eef5fb;outline:none;box-shadow:0 0 0 2px #9cc6ea}
body:where(.vch16):not(.vfhz) .gvr-docpop{position:fixed;z-index:1050;width:300px;background:#fff;border:1px solid #cbd2d9;border-radius:10px;box-shadow:0 12px 32px rgba(15,23,42,.18);padding:14px 16px;display:flex;flex-direction:column;gap:10px;text-align:left;white-space:normal;color:#1f2933}
body:where(.vch16):not(.vfhz) .gvr-docpop[hidden]{display:none}
body:where(.vch16):not(.vfhz) .gvr-docpop-h{display:flex;justify-content:space-between;align-items:baseline;font-size:14px}
body:where(.vch16):not(.vfhz) .gvr-docpop-c{font-size:12px;color:#3e4c59}
body:where(.vch16):not(.vfhz) .gvr-docpop .gvr-bar{margin:0;min-width:0}
body:where(.vch16):not(.vfhz) .gvr-fill.is-docs{background:#2f7d4a}
body:where(.vch16):not(.vfhz) .gvr-docrow{display:flex;align-items:center;gap:10px;font-size:13.5px}
body:where(.vch16):not(.vfhz) .gvr-docmark{width:18px;height:18px;flex:0 0 18px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;box-sizing:border-box;background:#fff;border:1.5px solid #9aa5b1;color:#fff}
body:where(.vch16):not(.vfhz) .gvr-docmark.is-done{background:#2f7d4a;border-color:#2f7d4a}
body:where(.vch16):not(.vfhz) .gvr-doclabel{flex:1 1 auto}
body:where(.vch16):not(.vfhz) .gvr-docstate{font-size:12px;font-weight:600;color:#8a3c00}
body:where(.vch16):not(.vfhz) .gvr-docstate.is-done{color:#1e6b3a}
/* Global View redesign - optional Commissions and References columns */
body:where(.vch16):not(.vfhz) table.gvr-table.gvr-hide-comm .gvr-c-comm, body:where(.vch16):not(.vfhz) table.gvr-table.gvr-hide-ref .gvr-c-ref{display:none}
body:where(.vch16):not(.vfhz) .gvr-kv{display:flex;align-items:center;gap:6px;font-size:12.5px;line-height:1.6;white-space:nowrap}
body:where(.vch16):not(.vfhz) .gvr-k{min-width:34px;color:#7b8794;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
body:where(.vch16):not(.vfhz) .gvr-tag{font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:999px;background:#fff4e0;color:#7a4a00}
body:where(.vch16):not(.vfhz) .gvr-tag.is-paid{background:#e5f4ea;color:#1e6b3a}
/* Global View redesign - in-between document states (Requested / Emailed) in yellow */
body:where(.vch16):not(.vfhz) .gvr-dot.is-mid{background:#f2b705;border-color:#f2b705}
body:where(.vch16):not(.vfhz) .gvr-docmark.is-mid{background:#f2b705;border-color:#f2b705;color:#fff}
body:where(.vch16):not(.vfhz) .gvr-docstate.is-mid{color:#9a6700}
body:where(.vch16):not(.vfhz) .gvr-docstate:not(.is-done):not(.is-mid){color:#7b8794}
/* Global View redesign - AWB not-sent tag */
body:where(.vch16):not(.vfhz) .gvr-tag.is-off{background:#eef1f5;color:#52606d}
/* Global View redesign - Ship Agent/AWB column toggle */
body:where(.vch16):not(.vfhz) table.gvr-table.gvr-hide-awb .gvr-c-awb{display:none}
/* Global View redesign - launch icons for the original pop-ups */
body:where(.vch16):not(.vfhz) .gvr-idline{display:flex;align-items:center;gap:6px}
body:where(.vch16):not(.vfhz) button.gvr-pop{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;flex:0 0 22px;padding:0;margin-left:6px;vertical-align:middle;border:1px solid #cbd2d9;border-radius:5px;background:#fff;color:#0a6ea8;cursor:pointer}
body:where(.vch16):not(.vfhz) .gvr-idline button.gvr-pop{margin-left:0}
body:where(.vch16):not(.vfhz) button.gvr-pop:hover, body:where(.vch16):not(.vfhz) button.gvr-pop:focus-visible{background:#0069d9;border-color:#0069d9;color:#fff;outline:none}
/* Global View redesign - bold Total column */
body:where(.vch16):not(.vfhz) table.gvr-table td.gvr-total{font-weight:700}
body:where(.vch16):not(.vfhz) table.gvr-table td.gvr-total .ilr-cur{font-weight:400}
body:where(.vch11):not(.vfhz):not(:where(.vch16):not(.vfhz)) table.tile tbody tr:not(#vf-rh):hover > td{background-color:#d6ecff !important;--bs-table-accent-bg:transparent}
/* Edit Product - Choose File button in the light-blue button style */
body:where(.vch15):not(.vfhz) .pe-imgcard input[type=file]::file-selector-button{height:34px;padding:0 14px;margin-right:10px;border:0;border-radius:6px;background:#e8f3fa;color:#08517c;font-size:13px;font-weight:600;cursor:pointer}
body:where(.vch15):not(.vfhz) .pe-imgcard input[type=file]::-webkit-file-upload-button{height:34px;padding:0 14px;margin-right:10px;border:0;border-radius:6px;background:#e8f3fa;color:#08517c;font-size:13px;font-weight:600;cursor:pointer}
body:where(.vch15):not(.vfhz) .pe-imgcard input[type=file]:hover::file-selector-button, body:where(.vch15):not(.vfhz) .pe-imgcard input[type=file]:focus-visible::file-selector-button{background:#0069d9;color:#fff}
body:where(.vch15):not(.vfhz) .pe-imgcard input[type=file]:hover::-webkit-file-upload-button{background:#0069d9;color:#fff}
/* Edit Product - image card Reset button: dark green #336633, label Reset (not uppercase) */
body:where(.vch15):not(.vfhz) .pe-imgcard a.btn.add-btn:not(#vf-ir){background:#336633 !important;border-color:#336633 !important;color:#fff !important;text-transform:none !important;font-size:13px !important;font-weight:600 !important;border-radius:6px !important}
body:where(.vch15):not(.vfhz) .pe-imgcard a.btn.add-btn:not(#vf-ir):hover, body:where(.vch15):not(.vfhz) .pe-imgcard a.btn.add-btn:not(#vf-ir):focus{background:#0069d9 !important;border-color:#0069d9 !important;color:#fff !important}
/* Edit product category redesign (scoped via .ng-pcat-edit; reuses the Edit Product styles) */
body:where(.vch17):not(.vfhz) .pck-grid{grid-template-columns:180px minmax(0,1fr) !important}
body:where(.vch17):not(.vfhz) .pck-help{font-size:11.5px;color:#616e7c;font-weight:400;text-transform:none;letter-spacing:0}
body:where(.vch17):not(.vfhz) input.pck-code{font-weight:700 !important;color:#004080;text-transform:uppercase}
body:where(.vch17):not(.vfhz) input.pck-name{text-transform:uppercase}
body:where(.vch17):not(.vfhz) .pck-preview{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 14px;border-radius:8px;background:#fff;border:1px dashed #cbd2d9;font-size:13px;margin-bottom:12px}
body:where(.vch17):not(.vfhz) .pck-pv-l{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#52606d}
body:where(.vch17):not(.vfhz) .pck-pv-code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;padding:3px 8px;border-radius:6px;background:#eef1f5;color:#1f2933}
body:where(.vch17):not(.vfhz) .pck-pv-t{color:#52606d}
body:where(.vch17):not(.vfhz) .pck-pv-tag{padding:3px 10px;border-radius:999px;background:#e9ecfb;color:#2c3e8f;font-size:12px;font-weight:700}
body:where(.vch17):not(.vfhz) .pck-warn{padding:10px 14px;border-radius:8px;background:#fff4e0;color:#7a4a00;font-size:13px;margin-bottom:12px}
body:where(.vch17):not(.vfhz) .pck-warn[hidden]{display:none}
body:where(.vch17):not(.vfhz) .pck-card-top{display:flex;justify-content:space-between;align-items:baseline}
body:where(.vch17):not(.vfhz) .pck-big{font-size:22px;font-weight:700;color:#102a43}
body:where(.vch17):not(.vfhz) .pck-prow{display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px solid #eef1f5;font-size:12.5px}
body:where(.vch17):not(.vfhz) .pck-pcode{font-weight:700;color:#004080;text-decoration:none}
body:where(.vch17):not(.vfhz) .pck-pdesc{color:#3e4c59;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:where(.vch17):not(.vfhz) .pck-pcost{font-variant-numeric:tabular-nums}
body:where(.vch17):not(.vfhz) .pck-head{cursor:default}
body:where(.vch17):not(.vfhz) .pe-actions input[name=save_product_category]{background:#336633 !important}
body:where(.vch17):not(.vfhz) .pe-actions input[name=save_product_category]:hover{background:#0069d9 !important}
/* Manage Brands redesign (scoped via .ng-brands; reuses the Products and Category styles) */
body:where(.vch18):not(.vfhz) table.vp-table.pc-table{min-width:960px}
body:where(.vch18):not(.vfhz) .vb-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
body:where(.vch18):not(.vfhz) .vp-tag.vb-tag-never{background:#fff4e0 !important;color:#7a4a00 !important}
body:where(.vch18):not(.vfhz) .vb-recent{color:#1e6b3a !important;font-weight:600}
body:where(.vch18):not(.vfhz) .vb-inv{font-weight:700}
body:where(.vch18):not(.vfhz) a.pc-sort{color:#fff !important;text-decoration:none}
body:where(.vch18):not(.vfhz) a.pc-sort:hover, body:where(.vch18):not(.vfhz) a.pc-sort:focus-visible{text-decoration:underline}
/* Edit brand redesign (scoped via .ng-brand-edit; reuses the category-edit styles) */
body:where(.vch19):not(.vfhz) .vbe-field{max-width:520px}
body:where(.vch19):not(.vfhz) input.vbe-name{font-weight:700 !important;color:#004080;text-transform:uppercase}
body:where(.vch19):not(.vfhz) .vbe-rb-name{display:flex;align-items:center;gap:8px}
body:where(.vch19):not(.vfhz) .vbe-note{margin-top:6px;padding:10px 12px;border-radius:8px;background:#f4f6f9;color:#3e4c59;font-size:12.5px}
body:where(.vch19):not(.vfhz) .vbe-del{align-self:flex-start;margin-top:4px;height:34px;padding:0 14px;border:1px solid #f3b4ad;border-radius:6px;background:#fff;color:#b42318;font-size:13px;font-weight:700;cursor:pointer}
body:where(.vch19):not(.vfhz) .vbe-del:hover, body:where(.vch19):not(.vfhz) .vbe-del:focus-visible{background:#fdecea}
body:where(.vch19):not(.vfhz) .vb-recent-txt{color:#1e6b3a !important}
body:where(.vch19):not(.vfhz) .pe-actions input[name=save_fob_countries]{background:#336633 !important}
body:where(.vch19):not(.vfhz) .pe-actions input[name=save_fob_countries]:hover{background:#0069d9 !important}
/* Product categories redesign (scoped via .ng-pcat marker; reuses the Manage Products styles) */
body:where(.vch20):not(.vfhz) table.vp-table.pc-table{min-width:900px}
body:where(.vch20):not(.vfhz) .pc-sort{background:transparent;border:0;padding:0;color:#fff;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer}
body:where(.vch20):not(.vfhz) .pc-sort:hover, body:where(.vch20):not(.vfhz) .pc-sort:focus-visible{text-decoration:underline;outline:none}
body:where(.vch20):not(.vfhz) .pc-name{font-size:13.5px;font-weight:600}
body:where(.vch20):not(.vfhz) .pc-count{display:flex;align-items:center;gap:10px}
body:where(.vch20):not(.vfhz) .pc-num{width:48px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
body:where(.vch20):not(.vfhz) .pc-bar{display:block;flex:1 1 auto;max-width:200px;height:8px;border-radius:999px;background:#e8ebf0;overflow:hidden}
body:where(.vch20):not(.vfhz) .pc-bar > span{display:block;height:100%;background:#675f80;border-radius:999px}
body:where(.vch20):not(.vfhz) #pcKw{width:100%;height:40px;box-sizing:border-box;border:1px solid #cbd2d9;border-radius:8px;padding:0 12px;font-size:13.5px}
/* Clients list redesign (scoped via .ng-cust; reuses the Products and Category styles) */
body:where(.vch21):not(.vfhz) table.vp-table.vc-table{min-width:980px}
body:where(.vch21):not(.vfhz) .vc-name{display:flex;flex-direction:column;gap:3px}
body:where(.vch21):not(.vfhz) .vc-sub{font-size:12px;color:#616e7c}
body:where(.vch21):not(.vfhz) .vc-cat{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:999px;background:#e9ecfb;color:#2c3e8f;font-size:11px;font-weight:700}
body:where(.vch21):not(.vfhz) .vc-pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700}
body:where(.vch21):not(.vfhz) .vc-on{background:#e5f4ea;color:#1e6b3a}
body:where(.vch21):not(.vfhz) .vc-off{background:#eceff3;color:#52606d}
body:where(.vch21):not(.vfhz) .ilr-select{height:40px;border:1px solid #cbd2d9;border-radius:8px;padding:0 10px;font-size:13.5px;background:#fff;max-width:220px}
body:where(.vch21):not(.vfhz) .vb-recent{color:#1e6b3a !important;font-weight:600}
body:where(.vch21):not(.vfhz) .vb-inv{font-weight:700}
body:where(.vch21):not(.vfhz) a.pc-sort{color:#fff !important;text-decoration:none}
body:where(.vch21):not(.vfhz) a.pc-sort:hover, body:where(.vch21):not(.vfhz) a.pc-sort:focus-visible{text-decoration:underline}
/* Edit client redesign (scoped via .ng-cust-edit; reuses the Edit Product styles) */
body:where(.vch22):not(.vfhz) .vce-emails{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-bottom:14px}
@media (max-width:1200px){body:where(.vch22):not(.vfhz) .vce-emails{grid-template-columns:minmax(0,1fr)}}
body:where(.vch22):not(.vfhz) .vce-eblock{background:#fff;border:1px solid #d5dce4;border-radius:8px;overflow:hidden;min-width:0}
body:where(.vch22):not(.vfhz) .vce-etitle{display:flex;justify-content:space-between;align-items:center;height:37px;padding:0 12px;background:#675f80;color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.23px;text-transform:uppercase}
body:where(.vch22):not(.vfhz) .vce-ecount{font-weight:400;text-transform:none;letter-spacing:0}
body:where(.vch22):not(.vfhz) .vce-ehelp{padding:6px 12px 2px;font-size:12px;color:#52606d}
body:where(.vch22):not(.vfhz) .vce-erows .form-group{align-items:center;gap:8px;margin:0 !important;padding:8px 12px;border-bottom:1px solid #eef1f5;flex-wrap:nowrap}
body:where(.vch22):not(.vfhz) .vce-erows .form-group > div{flex:1 1 auto;max-width:none !important;width:auto !important;margin:0 !important;padding:0 !important}
body:where(.vch22):not(.vfhz) .vce-erows .form-group > div:first-child{flex:0 0 130px}
body:where(.vch22):not(.vfhz) .vce-erows .form-group > div:last-child{flex:0 0 auto}
body:where(.vch22):not(.vfhz) .vce-erows .form-control{height:34px;border:1px solid #cbd2d9;border-radius:6px;font-size:13px}
body:where(.vch22):not(.vfhz) .vce-ebar{padding:10px 12px;background:#fafbfc}
body:where(.vch22):not(.vfhz) .vce-ebar input[type=button]{height:32px;padding:0 12px;border:0 !important;border-radius:6px !important;background:#e8f3fa !important;color:#08517c !important;font-size:13px;font-weight:600;text-transform:none}
body:where(.vch22):not(.vfhz) .vce-warn{color:#b42318 !important;font-weight:600}
body:where(.vch22):not(.vfhz) .vce-off{color:#7a4a00 !important}
body:where(.vch22):not(.vfhz) .vb-recent-txt{color:#1e6b3a !important}
body:where(.vch22):not(.vfhz) .vce-status input{margin:0 !important;width:16px;height:16px;position:static !important}
body:where(.vch22):not(.vfhz) .pe-actions input[name=submit]{background:#336633 !important}
body:where(.vch22):not(.vfhz) .pe-actions input[name=submit]:hover{background:#0069d9 !important}
/* Edit client - required field highlighting */
body:where(.vch22):not(.vfhz) .pe-f .vf-invalid.vf-invalid{border-color:#b42318 !important;box-shadow:0 0 0 3px rgba(180,35,24,.14) !important}
body:where(.vch22):not(.vfhz) .vf-req-msg{margin-top:2px;font-size:12px;font-weight:600;color:#b42318}
body:where(.vch22):not(.vfhz) .vf-req-banner{padding:10px 14px;border-radius:8px;border:1px solid #f3b4ad;background:#fdecea;color:#8a1c12;font-size:13.5px;font-weight:600}
/* Clients list - navy table header */
body:where(.vch21):not(.vfhz) .vp-panel table.vp-table.vc-table thead th{background:#1a3a63 !important;border-color:#1a3a63 !important}
/* Client categories list redesign (scoped via .ng-ccat; reuses the Clients and Category styles) */
body:where(.vch23):not(.vfhz) table.vp-table.vcc-table{min-width:760px}
body:where(.vch23):not(.vfhz) .vcc-sub{display:block;margin-top:3px;font-size:12px;color:#616e7c}
/* Client category edit redesign (scoped via .ng-ccat-edit; reuses the category-edit styles) */
body:where(.vch24):not(.vfhz) .vcce-field{max-width:520px}
body:where(.vch24):not(.vfhz) .vcce-prow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid #eef1f5;font-size:12.5px}
body:where(.vch24):not(.vfhz) .vcce-name{display:block;font-weight:700;color:#004080;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:where(.vch24):not(.vfhz) .vcce-city{display:block;font-size:11.5px;color:#616e7c}
body:where(.vch24):not(.vfhz) .vcce-st{padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700}
body:where(.vch24):not(.vfhz) .vcce-on{background:#e5f4ea;color:#1e6b3a}
body:where(.vch24):not(.vfhz) .vcce-off{background:#eceff3;color:#52606d}
body:where(.vch24):not(.vfhz) .pe-actions input[name=submit]{background:#336633 !important}
body:where(.vch24):not(.vfhz) .pe-actions input[name=submit]:hover{background:#0069d9 !important}
/* Client shipping list redesign (scoped via .ng-cship; reuses the Clients styles) */
body:where(.vch25):not(.vfhz) table.vp-table.vcs-table{min-width:960px}
body:where(.vch25):not(.vfhz) .vcs-addr{display:block;font-size:13px;color:#1f2933}
body:where(.vch25):not(.vfhz) .vcs-nozip{display:inline-block;margin-top:4px;padding:1px 8px;border-radius:999px;background:#fff4e0;color:#7a4a00;font-size:11px;font-weight:700}
/* Shipping address edit - client name in side card */
body:where(.vch26):not(.vfhz) .pe-card .vcce-name{display:block;margin:2px 0 6px;font-size:14px;font-weight:700;color:#004080;text-decoration:none}
body:where(.vch26):not(.vfhz) .pe-card .vcce-name:hover{text-decoration:underline}
/* All buttons in sentence case: no forced uppercase */
.btn, button, input[type="button"], input[type="submit"], input[type="reset"], a.btn, .add-btn, .add-btn-sm { text-transform: none !important; }
/* Sales reps list redesign (scoped via .ng-srep; reuses the Clients styles) */
body:where(.vch27):not(.vfhz) table.vp-table.vsr-table{min-width:980px}
body:where(.vch27):not(.vfhz) .vsr-count{display:inline-block;min-width:52px;font-weight:700;font-variant-numeric:tabular-nums}
body:where(.vch27):not(.vfhz) .vsr-full{color:#1e6b3a}
body:where(.vch27):not(.vfhz) .vsr-toggle{margin-left:8px;height:28px;padding:0 10px;border:1px solid #cbd2d9;border-radius:6px;background:#fff;color:#0a6ea8;font-size:12.5px;font-weight:600;cursor:pointer}
body:where(.vch27):not(.vfhz) .vsr-toggle:hover, body:where(.vch27):not(.vfhz) .vsr-toggle:focus-visible{border-color:#0a6ea8;background:#e8f3fa}
body:where(.vch27):not(.vfhz) .vsr-last{display:block;font-size:11.5px;font-weight:400;color:#616e7c}
body:where(.vch27):not(.vfhz) tr.vsr-prow > td{background:#f4f6f9 !important;padding:12px 14px !important}
body:where(.vch27):not(.vfhz) tr.vsr-prow[hidden]{display:none}
body:where(.vch27):not(.vfhz) .vsr-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
body:where(.vch27):not(.vfhz) .vsr-pcell{display:flex;flex-direction:column;gap:4px;margin:0;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#3e4c59}
body:where(.vch27):not(.vfhz) .vsr-psel{height:32px !important;padding:0 8px !important;border:1px solid #cbd2d9 !important;border-radius:6px !important;font-size:13px !important;text-transform:none;letter-spacing:0;background:#fff}
body:where(.vch27):not(.vfhz) .vsr-pnote{margin-top:8px;font-size:12px;color:#52606d}
/* Sales rep edit redesign (scoped via .ng-srep-edit; reuses the Edit Product styles) */
body:where(.vch28):not(.vfhz) .vsre-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
body:where(.vch28):not(.vfhz) .vsre-group{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
body:where(.vch28):not(.vfhz) .vsre-gt{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#52606d}
body:where(.vch28):not(.vfhz) .vsre-pnote{margin-top:12px}
body:where(.vch28):not(.vfhz) .pe-actions input[type=submit]{background:#336633 !important}
body:where(.vch28):not(.vfhz) .pe-actions input[type=submit]:hover{background:#0069d9 !important}
/* Sales gauge metrics list redesign (scoped via .ng-smet; reuses the Clients styles) */
body:where(.vch29):not(.vfhz) table.vp-table.vsm-table{min-width:820px}
body:where(.vch29):not(.vfhz) .vsm-dash{display:inline-flex;align-items:center;gap:6px;height:28px;margin:0;padding:0 10px 0 8px;border:1px solid #cbd2d9;border-radius:999px;background:#fff;color:#52606d;font-size:12px;font-weight:700;cursor:pointer}
body:where(.vch29):not(.vfhz) .vsm-dash.is-on{background:#e5f4ea;border-color:#a8d7b8;color:#1e6b3a}
body:where(.vch29):not(.vfhz) .vsm-dash input{position:static !important;margin:0 !important;width:15px;height:15px}
body:where(.vch29):not(.vfhz) .vsm-savebar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:12px}
body:where(.vch29):not(.vfhz) .vsm-savebar input[name=btnsave]{height:36px;padding:0 16px;border:0;border-radius:8px;background:#336633 !important;color:#fff;font-size:13.5px;font-weight:700}
body:where(.vch29):not(.vfhz) .vsm-savebar input[name=btnsave]:hover{background:#0069d9 !important}
body:where(.vch29):not(.vfhz) .vsm-unsaved{font-size:12.5px;font-weight:600;color:#7a4a00}
body:where(.vch29):not(.vfhz) .vsm-unsaved[hidden]{display:none}
/* Sales target edit redesign (scoped via .ng-smet-edit; reuses the Edit Product styles) */
body:where(.vch30):not(.vfhz) .vsme-row{display:grid;grid-template-columns:minmax(0,1fr) auto 52px;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid #eef1f5;font-size:12.5px}
body:where(.vch30):not(.vfhz) .vsme-p{font-weight:700;color:#004080;text-decoration:none}
body:where(.vch30):not(.vfhz) .vsme-row.is-cur .vsme-p{color:#1f2933}
body:where(.vch30):not(.vfhz) .vsme-a{font-variant-numeric:tabular-nums}
body:where(.vch30):not(.vfhz) .vsme-s{font-size:11px;font-weight:700;color:#7b8794;text-align:right}
body:where(.vch30):not(.vfhz) .vsme-on{color:#1e6b3a}
body:where(.vch30):not(.vfhz) .vb-recent-txt{color:#1e6b3a !important}
body:where(.vch30):not(.vfhz) .pe-actions input[type=submit]{background:#336633 !important}
body:where(.vch30):not(.vfhz) .pe-actions input[type=submit]:hover{background:#0069d9 !important}
body:where(.vch30):not(.vfhz) .pe-f .vf-invalid.vf-invalid{border-color:#b42318 !important;box-shadow:0 0 0 3px rgba(180,35,24,.14) !important}
/* Sales gauge metrics: the old white table wrapper now holds the tiles and cards - make it transparent so the page colour shows in the gaps */
body:where(.vch29):not(.vfhz) .ContentArea .content.table-responsive:where(.vcl44):not(.vfhz){background:transparent !important;border:0 !important;box-shadow:none !important;overflow:visible !important;padding:0 !important}
/* Sales gauge metrics (demo layout): the outer white inv-panel also wraps the tiles and cards - make it transparent and hide its duplicate title and count line */
body:where(.vch29):not(.vfhz) .ContentArea .inv-panel:where(.vcl45):not(.vfhz){background:transparent !important;border:0 !important;border-radius:0 !important;padding:0 !important;box-shadow:none !important}
body:where(.vch29):not(.vfhz) .ContentArea .inv-panel:where(.vcl45):not(.vfhz) > .inv-panel-head, body:where(.vch29):not(.vfhz) .ContentArea .inv-panel:where(.vcl46):not(.vfhz) > .tile-ribbon{display:none !important}
/* Manufacturer invoices list redesign (scoped via .ng-minv) */
body:where(.vch31):not(.vfhz) table.vp-table.vmi-table{min-width:900px}
body:where(.vch31):not(.vfhz) .vmi-docs{display:flex;flex-direction:column;gap:6px}
body:where(.vch31):not(.vfhz) .vmi-doc{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:12.5px}
body:where(.vch31):not(.vfhz) .vmi-name{font-weight:600;color:#004080;text-decoration:none;word-break:break-all}
body:where(.vch31):not(.vfhz) .vmi-name:hover{text-decoration:underline}
body:where(.vch31):not(.vfhz) .vmi-date{color:#616e7c;font-variant-numeric:tabular-nums}
body:where(.vch31):not(.vfhz) .vmi-badge{padding:1px 8px;border-radius:999px;background:#eceff3;color:#52606d;font-size:11px;font-weight:700}
body:where(.vch31):not(.vfhz) .vmi-act{font-size:12px;font-weight:600;color:#0a6ea8;text-decoration:none}
body:where(.vch31):not(.vfhz) .vmi-act:hover{text-decoration:underline}
body:where(.vch31):not(.vfhz) .vmi-act.vmi-del{color:#b42318}
body:where(.vch31):not(.vfhz) .vmi-def{display:inline-flex;align-items:center;gap:4px;margin:0;font-size:11.5px;color:#3e4c59;cursor:pointer}
body:where(.vch31):not(.vfhz) .vmi-def input{position:static !important;margin:0 !important}
/* Manufacturer AP redesign (scoped via .ng-ap) */
body:where(.vch32):not(.vfhz) .vap-card form{margin:0}
body:where(.vch32):not(.vfhz) .vap-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px}
body:where(.vch32):not(.vfhz) .vap-field{display:flex;flex-direction:column;gap:5px;margin:0;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#52606d}
body:where(.vch32):not(.vfhz) .vap-field input{height:40px;box-sizing:border-box;min-width:160px;padding:0 10px;border:1px solid #cbd2d9;border-radius:8px;font-size:13.5px;font-weight:400;text-transform:none;letter-spacing:0;color:#1f2933;background:#fff}
body:where(.vch32):not(.vfhz) .vap-field input[name=keyword]{min-width:280px}
body:where(.vch32):not(.vfhz) .vap-btns{display:flex;gap:8px;margin-left:auto}
body:where(.vch32):not(.vfhz) .vap-btns input{height:40px;padding:0 16px;border:0 !important;border-radius:8px !important;color:#fff !important;font-size:13.5px;font-weight:700;cursor:pointer}
body:where(.vch32):not(.vfhz) .vap-b-go{background:#336633 !important}
body:where(.vch32):not(.vfhz) .vap-b-reset{background:#555 !important}
body:where(.vch32):not(.vfhz) .vap-b-exp{background:#0a6ea8 !important}
body:where(.vch32):not(.vfhz) .vap-btns input:hover{filter:brightness(1.1)}
body:where(.vch32):not(.vfhz) .vap-bal{color:#b42318;font-weight:700}
body:where(.vch32):not(.vfhz) table.vp-table.vap-table{min-width:960px}
body:where(.vch32):not(.vfhz) .ContentArea .ilr-card.vap-card{padding:16px 18px !important}
/* Vendor PO document pages redesign (scoped via .ng-vpoe) */
body:where(.vch33):not(.vfhz) .vpoe-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
@media (max-width:1200px){body:where(.vch33):not(.vfhz) .vpoe-two{grid-template-columns:minmax(0,1fr)}}
body:where(.vch33):not(.vfhz) .vpoe-two .pe-sec{margin:0}
body:where(.vch33):not(.vfhz) .vpoe-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}
body:where(.vch33):not(.vfhz) .vpoe-chips-l{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#52606d}
body:where(.vch33):not(.vfhz) .vpoe-chip input{position:static !important;margin:0 !important}
body:where(.vch33):not(.vfhz) .vpoe-items{overflow-x:auto;background:#fff;border:1px solid #d5dce4;border-radius:8px}
body:where(.vch33):not(.vfhz) .vpoe-items .CommonTable{margin:0 !important}
body:where(.vch33):not(.vfhz) .vpoe-items table{margin:0 !important;width:100%;font-size:13px}
body:where(.vch33):not(.vfhz) .vpoe-items table thead th, body:where(.vch33):not(.vfhz) .vpoe-items table thead td{background:#1a3a63 !important;color:#fff !important;border-color:#1a3a63 !important;font-size:11.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
body:where(.vch33):not(.vfhz) .vpoe-items table td{padding:8px 10px;vertical-align:middle}
body:where(.vch33):not(.vfhz) .vpoe-items table tbody tr:last-child td{background:#f4f6f9 !important;font-weight:700}
body:where(.vch33):not(.vfhz) .pe-actions input[name=btnsave]{background:#336633 !important}
body:where(.vch33):not(.vfhz) .pe-actions input[name=btnpdf]{background:#0a6ea8 !important}
body:where(.vch33):not(.vfhz) .pe-bb-pdf{background:#0a6ea8 !important;color:#fff !important}
/* Landed cost page redesign (scoped via .ng-elcd) */
body:where(.vch34):not(.vfhz) .elcd-items{overflow-x:auto;background:#fff;border:1px solid #d5dce4;border-radius:8px;margin:0 !important}
body:where(.vch34):not(.vfhz) .elcd-items table{margin:0 !important;font-size:12.5px}
body:where(.vch34):not(.vfhz) .elcd-items table thead th{background:#1a3a63;color:#fff;border-color:#1a3a63}
body:where(.vch34):not(.vfhz) .elcd-inputs .form-group{margin-bottom:8px}
body:where(.vch34):not(.vfhz) .elcd-inputs label, body:where(.vch34):not(.vfhz) .elcd-inputs .col-6:first-child{font-size:12px;font-weight:700;color:#3e4c59}
body:where(.vch34):not(.vfhz) .pe-bb-reset{background:#555 !important;color:#fff !important}
body:where(.vch34):not(.vfhz) .elcd-bottom input[name=btnSaveForm]{background:#336633 !important}
body:where(.vch34):not(.vfhz) .elcd-bottom input[name=submitExport]{background:#0a6ea8 !important}
/* Landed cost products table - new style */
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl thead th{background:#1a3a63 !important;color:#fff !important;border-color:#2c4a73 !important;font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;vertical-align:bottom;padding:8px !important;white-space:normal}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl thead th.elcd-calc{background:#0a6ea8 !important}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody td{padding:7px 8px !important;vertical-align:top;border-color:#e4e9ef !important;background:#fff !important;color:#1f2933}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody tr:nth-of-type(even) td{background:#f7f9fb !important}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody td.elcd-calc{background:#eef6fc !important}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody tr:nth-of-type(even) td.elcd-calc{background:#e4f0f9 !important}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody td.elcd-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody tr:last-child td{background:#eef2f6 !important;font-weight:700;border-top:2px solid #cbd2d9 !important}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody td:nth-child(2), body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody td:nth-child(3){min-width:200px}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody td:nth-child(4){min-width:130px}
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody td input:not([type=hidden]){width:90px;height:30px;border:1px solid #cbd2d9;border-radius:6px;padding:0 6px;text-align:right;font-size:12.5px;background:#fff}
/* Landed cost products table - row hover (same as the vendor PO list) */
body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody tr:not(:last-child):hover td, body:where(.vch34):not(.vfhz) .elcd-items table.elcd-tbl tbody tr:not(:last-child):hover td.elcd-calc{background:#ece9f4 !important}
/* Invoice landed cost list (scoped via .ng-ilc) */
body:where(.vch35):not(.vfhz) .vli-bal{display:block;font-size:11.5px;font-weight:600;color:#b42318}
body:where(.vch35):not(.vfhz) .vli-paid{display:block;font-size:11.5px;font-weight:600;color:#1e6b3a}
/* Client PO list (scoped via .ng-cpo) */
body:where(.vch36):not(.vfhz) .vcp-doc{font-weight:600;color:#004080;text-decoration:none;word-break:break-all}
body:where(.vch36):not(.vfhz) .vcp-doc:hover{text-decoration:underline}
/* Other customs / forwarding expenses - rows with + Add expense */
.vfx-wrap{margin:4px 0 8px}
.vfx-list{display:flex;flex-direction:column;gap:8px}
.vfx-row{display:grid;grid-template-columns:minmax(0,1fr) 150px 34px;gap:8px;align-items:center}
.vfx-row .form-control{height:36px;border:1px solid #cbd2d9;border-radius:6px;font-size:13px}
.vfx-row .vfx-amt{text-align:right;font-variant-numeric:tabular-nums}
.vfx-del{width:34px;height:34px;padding:0;border:1px solid #cbd2d9;border-radius:6px;background:#fff;color:#b42318;font-size:18px;line-height:1;cursor:pointer}
.vfx-del:hover{background:#fdecea;border-color:#f3b4ae}
.vfx-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.vfx-add{height:34px;padding:0 14px;border:1px solid #9ccbe6;border-radius:8px;background:#e3f2fb;color:#0a6ea8;font-size:13px;font-weight:700;cursor:pointer}
.vfx-add:hover, .vfx-add:focus-visible{background:#cfe7f7;border-color:#0a6ea8}
.vfx-total{font-size:13px;font-weight:700;color:#1f2933}
/* Client pages: tile icon badges (dashboard style) */
.ilr-kpi.vfk-ic{position:relative}
.ilr-kpi.vfk-ic::before{content:"";position:absolute;top:16px;left:18px;width:44px;height:44px;border-radius:10px;background:#e8f3fa}
.ilr-kpi.vfk-ic::after{content:"";position:absolute;top:27px;left:29px;width:22px;height:22px;background:#0a6ea8;-webkit-mask:var(--vfk-icon) center/22px 22px no-repeat;mask:var(--vfk-icon) center/22px 22px no-repeat}
.ilr-kpi.vfk-ic .ilr-kpi-l, .ilr-kpi.vfk-ic .ilr-kpi-v, .ilr-kpi.vfk-ic .ilr-kpi-s{margin-left:60px}
.ilr-kpi.vfk-ic .ilr-kpi-s{min-height:18px}
.ilr-kpi.vfk-c2::before{background:#eef2f7} .ilr-kpi.vfk-c2::after{background:#475569}
.ilr-kpi.vfk-c3::before{background:#e7f4ec} .ilr-kpi.vfk-c3::after{background:#2f7d4f}
.ilr-kpi.vfk-c4::before{background:#fdf1e3} .ilr-kpi.vfk-c4::after{background:#b45f06}
.ilr-kpi.vfk-i-users{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-bag{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-globe{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-shield{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-tag{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/%3E%3Cpath d='M7 7h.01'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-chart{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20V10'/%3E%3Cpath d='M18 20V4'/%3E%3Cpath d='M6 20v-4'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-clock{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-pin{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-home{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpath d='M9 22V12h6v10'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-alert{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E")}
/* All redesigned pages: more tile icons */
.ilr-kpi.vfk-i-file{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3Cpath d='M9 13h6'/%3E%3Cpath d='M9 17h6'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-files{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H8a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M15 2v5h5'/%3E%3Cpath d='M4 8v12a2 2 0 0 0 2 2h10'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-truck{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 3h15v13H1z'/%3E%3Cpath d='M16 8h4l3 3v5h-7V8z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-factory{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 20h20'/%3E%3Cpath d='M4 20V10l5 3v-3l5 3v-3l5 3v7'/%3E%3Cpath d='M17 13V4h3v16'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-calendar{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4'/%3E%3Cpath d='M8 2v4'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-archive{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3' width='20' height='5' rx='1'/%3E%3Cpath d='M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8'/%3E%3Cpath d='M10 12h4'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-dollar{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 1v22'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-box{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8l-9-5-9 5 9 5 9-5z'/%3E%3Cpath d='M3 8v8l9 5 9-5V8'/%3E%3Cpath d='M12 13v8'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-award{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='6'/%3E%3Cpath d='M15.48 12.89L17 22l-5-3-5 3 1.52-9.11'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-usercheck{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='8.5' cy='7' r='4'/%3E%3Cpath d='M17 11l2 2 4-4'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-target{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-gauge{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 14l4-4'/%3E%3Cpath d='M3.34 19a10 10 0 1 1 17.32 0'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-clipboard{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Crect x='8' y='2' width='8' height='4' rx='1'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-layers{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2L2 7l10 5 10-5-10-5z'/%3E%3Cpath d='M2 17l10 5 10-5'/%3E%3Cpath d='M2 12l10 5 10-5'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-trending{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M23 6l-9.5 9.5-5-5L1 18'/%3E%3Cpath d='M17 6h6v6'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-grid{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7'/%3E%3Crect x='14' y='3' width='7' height='7'/%3E%3Crect x='14' y='14' width='7' height='7'/%3E%3Crect x='3' y='14' width='7' height='7'/%3E%3C/svg%3E")}
/* Tile icons: brands/products extras */
.ilr-kpi.vfk-i-eyeoff{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94'/%3E%3Cpath d='M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19'/%3E%3Cpath d='M1 1l22 22'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-barcode{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5v14'/%3E%3Cpath d='M8 5v14'/%3E%3Cpath d='M12 5v14'/%3E%3Cpath d='M17 5v14'/%3E%3Cpath d='M21 5v14'/%3E%3C/svg%3E")}
.ilr-kpi.vfk-i-check{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 12l3 3 5-5'/%3E%3C/svg%3E")}
/* Company Dashboard growth boxes + Business Metrics KPI cards: icon badges */
.ch-growth-box.vfk-gb{position:relative}
.ch-growth-box.vfk-gb::before{content:"";position:absolute;left:18px;top:calc(50% + 4px);width:44px;height:44px;border-radius:10px;background:#e8f3fa}
.ch-growth-box.vfk-gb::after{content:"";position:absolute;left:29px;top:calc(50% + 15px);width:22px;height:22px;background:#0a6ea8;-webkit-mask:var(--vfk-icon) center/22px 22px no-repeat;mask:var(--vfk-icon) center/22px 22px no-repeat}
.ch-growth-box.vfk-c2::before{background:#eef2f7} .ch-growth-box.vfk-c2::after{background:#475569}
.ch-growth-box.vfk-c3::before{background:#e7f4ec} .ch-growth-box.vfk-c3::after{background:#2f7d4f}
.bm-kpi-card.vfk-bm{position:relative}
.bm-kpi-card.vfk-bm .bm-kpi-label{padding-right:46px}
.bm-kpi-card.vfk-bm::before{content:"";position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:10px;background:rgba(56,152,214,.20)}
.bm-kpi-card.vfk-bm::after{content:"";position:absolute;top:26px;right:26px;width:20px;height:20px;background:#8ccbf2;-webkit-mask:var(--vfk-icon) center/20px 20px no-repeat;mask:var(--vfk-icon) center/20px 20px no-repeat}
.bm-kpi-card.vfk-c2::before{background:rgba(148,163,184,.18)} .bm-kpi-card.vfk-c2::after{background:#cbd5e1}
.bm-kpi-card.vfk-c3::before{background:rgba(74,163,108,.22)} .bm-kpi-card.vfk-c3::after{background:#8fd9a8}
.bm-kpi-card.vfk-c4::before{background:rgba(214,138,52,.22)} .bm-kpi-card.vfk-c4::after{background:#f5b06b}
.vfk-gb.vfk-i-users, .vfk-bm.vfk-i-users{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M23 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-bag, .vfk-bm.vfk-i-bag{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-globe, .vfk-bm.vfk-i-globe{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-shield, .vfk-bm.vfk-i-shield{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-tag, .vfk-bm.vfk-i-tag{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/%3E%3Cpath d='M7 7h.01'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-chart, .vfk-bm.vfk-i-chart{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20V10'/%3E%3Cpath d='M18 20V4'/%3E%3Cpath d='M6 20v-4'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-clock, .vfk-bm.vfk-i-clock{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-pin, .vfk-bm.vfk-i-pin{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-home, .vfk-bm.vfk-i-home{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpath d='M9 22V12h6v10'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-alert, .vfk-bm.vfk-i-alert{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-file, .vfk-bm.vfk-i-file{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3Cpath d='M9 13h6'/%3E%3Cpath d='M9 17h6'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-files, .vfk-bm.vfk-i-files{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H8a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M15 2v5h5'/%3E%3Cpath d='M4 8v12a2 2 0 0 0 2 2h10'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-truck, .vfk-bm.vfk-i-truck{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 3h15v13H1z'/%3E%3Cpath d='M16 8h4l3 3v5h-7V8z'/%3E%3Ccircle cx='5.5' cy='18.5' r='2.5'/%3E%3Ccircle cx='18.5' cy='18.5' r='2.5'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-factory, .vfk-bm.vfk-i-factory{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 20h20'/%3E%3Cpath d='M4 20V10l5 3v-3l5 3v-3l5 3v7'/%3E%3Cpath d='M17 13V4h3v16'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-calendar, .vfk-bm.vfk-i-calendar{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4'/%3E%3Cpath d='M8 2v4'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-archive, .vfk-bm.vfk-i-archive{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3' width='20' height='5' rx='1'/%3E%3Cpath d='M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8'/%3E%3Cpath d='M10 12h4'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-dollar, .vfk-bm.vfk-i-dollar{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 1v22'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-box, .vfk-bm.vfk-i-box{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8l-9-5-9 5 9 5 9-5z'/%3E%3Cpath d='M3 8v8l9 5 9-5V8'/%3E%3Cpath d='M12 13v8'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-award, .vfk-bm.vfk-i-award{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='6'/%3E%3Cpath d='M15.48 12.89L17 22l-5-3-5 3 1.52-9.11'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-usercheck, .vfk-bm.vfk-i-usercheck{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='8.5' cy='7' r='4'/%3E%3Cpath d='M17 11l2 2 4-4'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-target, .vfk-bm.vfk-i-target{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Ccircle cx='12' cy='12' r='6'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-gauge, .vfk-bm.vfk-i-gauge{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 14l4-4'/%3E%3Cpath d='M3.34 19a10 10 0 1 1 17.32 0'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-clipboard, .vfk-bm.vfk-i-clipboard{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Crect x='8' y='2' width='8' height='4' rx='1'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-layers, .vfk-bm.vfk-i-layers{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2L2 7l10 5 10-5-10-5z'/%3E%3Cpath d='M2 17l10 5 10-5'/%3E%3Cpath d='M2 12l10 5 10-5'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-trending, .vfk-bm.vfk-i-trending{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M23 6l-9.5 9.5-5-5L1 18'/%3E%3Cpath d='M17 6h6v6'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-grid, .vfk-bm.vfk-i-grid{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7'/%3E%3Crect x='14' y='3' width='7' height='7'/%3E%3Crect x='14' y='14' width='7' height='7'/%3E%3Crect x='3' y='14' width='7' height='7'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-eyeoff, .vfk-bm.vfk-i-eyeoff{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94'/%3E%3Cpath d='M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19'/%3E%3Cpath d='M1 1l22 22'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-barcode, .vfk-bm.vfk-i-barcode{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5v14'/%3E%3Cpath d='M8 5v14'/%3E%3Cpath d='M12 5v14'/%3E%3Cpath d='M17 5v14'/%3E%3Cpath d='M21 5v14'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-check, .vfk-bm.vfk-i-check{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 12l3 3 5-5'/%3E%3C/svg%3E")}
.vfk-gb.vfk-i-userplus, .vfk-bm.vfk-i-userplus, .ilr-kpi.vfk-i-userplus{--vfk-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='8.5' cy='7' r='4'/%3E%3Cpath d='M20 8v6'/%3E%3Cpath d='M23 11h-6'/%3E%3C/svg%3E")}
/* Inventory location cards: warehouse icon badge */
.inv-loc-card.vfk-wh{position:relative;padding-left:72px !important}
.inv-loc-card.vfk-wh::before{content:"";position:absolute;left:16px;top:50%;margin-top:-22px;width:44px;height:44px;border-radius:10px;background:var(--vfk-tint,#e8f3fa)}
.inv-loc-card.vfk-wh::after{content:"";position:absolute;left:27px;top:50%;margin-top:-11px;width:22px;height:22px;background:var(--vfk-ink,#0a6ea8);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 8.35V20a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8.35A2 2 0 0 1 3.26 6.5l8-3.2a2 2 0 0 1 1.48 0l8 3.2A2 2 0 0 1 22 8.35z'/%3E%3Cpath d='M6 18h12'/%3E%3Cpath d='M6 14h12'/%3E%3Crect width='12' height='12' x='6' y='10'/%3E%3C/svg%3E") center/22px 22px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 8.35V20a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8.35A2 2 0 0 1 3.26 6.5l8-3.2a2 2 0 0 1 1.48 0l8 3.2A2 2 0 0 1 22 8.35z'/%3E%3Cpath d='M6 18h12'/%3E%3Cpath d='M6 14h12'/%3E%3Crect width='12' height='12' x='6' y='10'/%3E%3C/svg%3E") center/22px 22px no-repeat}
/* Logistics document lists (scoped via .ng-ldoc) */
body:where(.vch37):not(.vfhz) .vcp-doc{font-weight:600;color:#004080;text-decoration:none;word-break:break-all}
body:where(.vch37):not(.vfhz) .vcp-doc:hover{text-decoration:underline}
body:where(.vch37):not(.vfhz) .vld-slot select{min-width:130px;height:32px;padding:0 6px;border:1px solid #cbd2d9;border-radius:6px;font-size:12.5px;background:#fff}
body:where(.vch37):not(.vfhz) table.vp-table.vld-table{min-width:980px}
/* Shipping documents library redesign (scoped via .ng-sdl) */
body:where(.vch38):not(.vfhz) .ContentArea .Card.sdl-card{border:1px solid #d5dce4;border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,.05);background:#fff}
body:where(.vch38):not(.vfhz) .ContentArea .Card.sdl-card > .CardHeader{background:#1a3a63 !important;border:0 !important;padding:12px 16px !important;display:flex;align-items:center;gap:8px;min-height:48px}
body:where(.vch38):not(.vfhz) .ContentArea .Card.sdl-card > .CardHeader .CardTitle, body:where(.vch38):not(.vfhz) .ContentArea .Card.sdl-card > .CardHeader h3{color:#fff !important;font-size:14px !important;font-weight:700;margin:0;flex:1 1 auto}
body:where(.vch38):not(.vfhz) .sdl-pill{flex:0 0 auto;padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.16);color:#fff;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
body:where(.vch38):not(.vfhz) .sdl-all{flex:0 0 auto;color:#bfe0f5 !important;font-size:12px;font-weight:700;text-decoration:none;white-space:nowrap}
body:where(.vch38):not(.vfhz) .sdl-all:hover{color:#fff !important;text-decoration:underline}
body:where(.vch38):not(.vfhz) .sdl-doc ul.CardListing{margin:0;padding:6px 8px}
body:where(.vch38):not(.vfhz) .sdl-doc ul.CardListing li{list-style:none;margin:0;padding:0;border-bottom:1px solid #eef1f4}
body:where(.vch38):not(.vfhz) .sdl-doc ul.CardListing li:last-child{border-bottom:0}
body:where(.vch38):not(.vfhz) .sdl-doc ul.CardListing li.sdl-total{display:none}
body:where(.vch38):not(.vfhz) .sdl-doc a.sdl-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:6px;color:#1f2933 !important;font-size:13px;text-decoration:none;word-break:break-all}
body:where(.vch38):not(.vfhz) .sdl-doc a.sdl-item:hover{background:#ece9f4}
body:where(.vch38):not(.vfhz) .sdl-doc a.sdl-item::before{content:"";flex:0 0 16px;width:16px;height:16px;background:#0a6ea8;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3C/svg%3E") center/16px 16px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3C/svg%3E") center/16px 16px no-repeat}
body:where(.vch38):not(.vfhz) .sdl-doc li.sdl-none{padding:14px 10px;color:#7b8794;font-size:13px;border:0}
body:where(.vch38):not(.vfhz) .sdl-kpis{margin-bottom:16px}
/* Shipping documents library: navy style for the sd-card layout (scoped via .ng-sdx) */
body:where(.vch39):not(.vfhz) .ContentArea .sd-card{background:#fff !important;border:1px solid #d5dce4 !important;border-radius:10px !important;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,.05) !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head{background:#1a3a63 !important;padding:12px 16px !important;margin:0 !important;display:flex;align-items:center;gap:8px;min-height:48px;border:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head h3, body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head h4{color:#fff !important;font-size:14px !important;font-weight:700 !important;margin:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head-left{flex:1 1 auto;display:flex;align-items:center;gap:8px}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-ic{display:none !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-count-pill{background:rgba(255,255,255,.16) !important;color:#fff !important;border:0 !important;padding:2px 10px !important;border-radius:999px !important;font-size:12px !important;font-weight:700;min-width:0 !important;height:auto !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-foot.sdx-hide{display:none !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card a.sd-file-row{border-radius:6px;color:#1f2933 !important;background:transparent !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card a.sd-file-row:hover{background:#ece9f4 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-file-ic{color:#0a6ea8 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-file-ic svg{stroke:#0a6ea8 !important}
/* Generated shipping documents lists (scoped via .ng-cip) */
body:where(.vch40):not(.vfhz) .vcip-docs a{font-weight:600;color:#004080 !important;text-decoration:none;word-break:break-all}
body:where(.vch40):not(.vfhz) .vcip-docs a:hover{text-decoration:underline}
body:where(.vch40):not(.vfhz) .vcip-docs, body:where(.vch40):not(.vfhz) .vcip-dates{line-height:1.7}
body:where(.vch40):not(.vfhz) table.vp-table.vcip-table{min-width:900px}
/* HS Code Lookup + HS Code Table redesign */
body:where(.vch41):not(#vfhz) .ContentArea .Card{border:1px solid #d5dce4;border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,.05);background:#fff}
body:where(.vch41):not(#vfhz) .ContentArea .Card > .CardHeader{background:#1a3a63 !important;border:0 !important;padding:12px 16px !important}
body:where(.vch41):not(#vfhz) .ContentArea .Card > .CardHeader, body:where(.vch41):not(#vfhz) .ContentArea .Card > .CardHeader *{color:#fff !important}
body:where(.vch41):not(#vfhz) .hts-box{border:1px solid #d5dce4 !important;border-radius:10px !important;background:#f8fafc !important;padding:18px !important;box-shadow:none !important}
body:where(.vch41):not(#vfhz) .hts-box label{font-size:11px !important;font-weight:700 !important;letter-spacing:.05em;text-transform:uppercase;color:#52606d !important}
body:where(.vch41):not(#vfhz) #hts-query, body:where(.vch41):not(#vfhz) .hts-box select{height:40px !important;border:1px solid #cbd2d9 !important;border-radius:8px !important;font-size:13.5px !important;background:#fff !important}
body:where(.vch41):not(#vfhz) .hts-box button[type=submit]{height:40px;padding:0 20px !important;border:0 !important;border-radius:8px !important;background:#336633 !important;color:#fff !important;font-weight:700 !important}
body:where(.vch41):not(#vfhz) #hts-results table{width:100%;border-collapse:separate !important;border-spacing:0;border:1px solid #d5dce4 !important;border-radius:8px;overflow:hidden;font-size:13px;margin-top:14px;background:#fff}
body:where(.vch41):not(#vfhz) #hts-results table th{background:#1a3a63 !important;color:#fff !important;font-size:11px !important;font-weight:700 !important;letter-spacing:.04em;text-transform:uppercase;padding:10px 12px !important;border:0 !important}
body:where(.vch41):not(#vfhz) #hts-results table td{padding:9px 12px !important;border:0 !important;border-top:1px solid #eef1f4 !important;vertical-align:top;background:#fff !important;color:#1f2933}
body:where(.vch41):not(#vfhz) #hts-results table tr:nth-child(even) td{background:#f8fafc !important}
body:where(.vch41):not(#vfhz) #hts-results table tr:hover td{background:#ece9f4 !important}
body:where(.vch41):not(#vfhz) #hts-results table td:first-child{font-weight:700;color:#004080;white-space:nowrap;font-variant-numeric:tabular-nums}
body:where(.vch42):not(.vfhz) table.vhs-table td:first-child, body:where(.vch42):not(.vfhz) table.vhs-table td:nth-child(2){white-space:nowrap;font-variant-numeric:tabular-nums}
body:where(.vch42):not(.vfhz) table.vhs-table td:first-child{font-weight:700;color:#004080}
body:where(.vch42):not(.vfhz) table.vp-table.vhs-table{min-width:720px}
/* Commercial invoice editor redesign - ported from nexgen */
/* Commercial invoice editor redesign (scoped via .ng-cir) */
body:where(.vch43):not(.vfhz) .cir-ribbon{margin-bottom:14px}
body:where(.vch43):not(.vfhz) .Card.cir-card{border:1px solid #d5dce4 !important;border-radius:10px !important;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,.05) !important;background:#fff !important}
body:where(.vch43):not(.vfhz) .Card.cir-card > .CardHeader{background:#1a3a63 !important;border:0 !important;padding:12px 16px !important}
body:where(.vch43):not(.vfhz) .Card.cir-card > .CardHeader, body:where(.vch43):not(.vfhz) .Card.cir-card > .CardHeader *{color:#fff !important}
body:where(.vch43):not(.vfhz) .Card.cir-card > .CardHeader select{color:#1f2933 !important;background:#fff !important;border-radius:6px}
body:where(.vch43):not(.vfhz) .cir-ship-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px 14px}
body:where(.vch43):not(.vfhz) .cir-f{display:flex;flex-direction:column;gap:5px;margin:0}
body:where(.vch43):not(.vfhz) .cir-f input, body:where(.vch43):not(.vfhz) .cir-f select{width:100% !important;height:38px;border:1px solid #cbd2d9 !important;border-radius:8px !important;padding:0 10px;font-size:13px;background:#fff}
body:where(.vch43):not(.vfhz) .cir-sec{margin:14px 0}
body:where(.vch43):not(.vfhz) .cir-items-wrap{background:#fff;border:1px solid #d5dce4;border-radius:10px;overflow:auto}
body:where(.vch43):not(.vfhz) table.cir-items{margin:0 !important}
body:where(.vch43):not(.vfhz) table.cir-items th{background:#1a3a63 !important;color:#fff !important;border-color:#2c4a73 !important;font-size:11px !important;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:9px 8px !important}
body:where(.vch43):not(.vfhz) table.cir-items tbody tr td{background:#fff !important;border-color:#eef1f4 !important;padding:6px 8px !important;vertical-align:middle}
body:where(.vch43):not(.vfhz) table.cir-items tbody tr:nth-of-type(even) td{background:#f7f9fb !important}
body:where(.vch43):not(.vfhz) table.cir-items tbody tr:hover td{background:#ece9f4 !important}
body:where(.vch43):not(.vfhz) table.cir-items input[type=text]{height:30px;border:1px solid #cbd2d9 !important;border-radius:6px !important;padding:0 7px;font-size:12.5px;background:#fff}
body:where(.vch43):not(.vfhz) table.cir-items input[type=text]:focus{border-color:#0a6ea8 !important;outline:2px solid rgba(10,110,168,.15)}
body:where(.vch43):not(.vfhz) .cir-btn{height:36px;padding:0 16px !important;border:0 !important;border-radius:8px !important;color:#fff !important;font-weight:700 !important;font-size:13px !important;cursor:pointer}
body:where(.vch43):not(.vfhz) .cir-btn.cir-go{background:#336633 !important}
body:where(.vch43):not(.vfhz) .cir-btn.cir-blue{background:#0a6ea8 !important}
body:where(.vch43):not(.vfhz) .cir-btn.cir-grey{background:#5f6b7a !important}
body:where(.vch43):not(.vfhz) .cir-btn.cir-add{background:#e3f2fb !important;color:#0a6ea8 !important;border:1px solid #9ccbe6 !important}
body:where(.vch43):not(.vfhz) .cir-btn:hover{filter:brightness(1.08)}
body:where(.vch43):not(.vfhz) .pe-bb-pdf{background:#0a6ea8 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon{background:#1a3a63 !important;border-color:#1a3a63 !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon .pe-rb-l{color:#a9bdd3 !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon .pe-strong, body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon .pe-code{color:#fff !important}
body:where(.vch43):not(.vfhz) .Card.cir-card > .CardHeader{border-radius:10px 10px 0 0 !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-filebar{background:transparent !important;border:0 !important;box-shadow:none !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-filebar .CardBody{background:transparent !important}
body:where(.vch43):not(.vfhz) .cir-resort-row{display:flex;justify-content:flex-start;margin:6px 0 8px}
body:where(.vch43):not(.vfhz) table.cir-items th input[type=button], body:where(.vch43):not(.vfhz) table.cir-items th button, body:where(.vch43):not(.vfhz) table.cir-items th .cir-btn{height:24px !important;padding:0 8px !important;font-size:11px !important;border-radius:6px !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) table.cir-items th, body:where(.vch43):not(.vfhz) table.cir-items td{border:0 !important}
body:where(.vch43):not(.vfhz) table.cir-items th{background:#fff !important;color:#292b2c !important;font-size:11.5px !important;font-weight:700 !important;text-transform:uppercase;letter-spacing:.02em;border-bottom:2px solid #eceaef !important}
body:where(.vch43):not(.vfhz) .cir-items-wrap{border:1px solid #eceef0 !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent{border:1px solid #e1e5ec !important;border-top:3px solid #e07a5f !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader{background:transparent !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader, body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader *{color:#292b2c !important}
body:where(.vch43):not(.vfhz) input[type=file]::file-selector-button{background:#e3f2fb;color:#0a6ea8;border:1px solid #9ccbe6;border-radius:8px;padding:7px 14px;font-weight:700;cursor:pointer;margin-right:10px}
body:where(.vch43):not(.vfhz) input[type=file]::file-selector-button:hover{background:#cfe7f7}
body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-pdf{background:#e3f2fb !important;color:#0a6ea8 !important;border:1px solid #9ccbe6 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr th, body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr td{border-left:0 !important;border-right:0 !important;border-top:0 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr td{border-bottom:0 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr th{border-bottom:2px solid #eceaef !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon{background:#fff !important;border:1px solid #e1e5ec !important;border-top:3px solid #e07a5f !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon .pe-rb-l{color:#616e7c !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon .pe-strong{color:#1f2933 !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon .pe-code{color:#004080 !important}
body:where(.vch43):not(.vfhz) .cir-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
@media (max-width:1100px){body:where(.vch43):not(.vfhz) .cir-two{grid-template-columns:minmax(0,1fr)}}
body:where(.vch43):not(.vfhz) .cir-col-title{display:flex;align-items:center;gap:10px;min-height:34px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid #eef1f4;color:#1a3a63;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
body:where(.vch43):not(.vfhz) .cir-col-title select{height:32px;max-width:260px;border:1px solid #cbd2d9;border-radius:6px;font-size:12.5px;text-transform:none;letter-spacing:0;color:#1f2933;background:#fff}
body:where(.vch43):not(.vfhz) .cir-toggle{cursor:pointer;user-select:none}
body:where(.vch43):not(.vfhz) .cir-toggle:focus-visible{outline:2px solid #0a6ea8;outline-offset:2px}
body:where(.vch43):not(.vfhz) .cir-chev{margin-left:auto;padding:0 12px;color:#52606d;font-size:15px;line-height:1;transition:transform .15s}
body:where(.vch43):not(.vfhz) .cir-sec.is-collapsed .cir-chev{transform:rotate(-90deg)}
body:where(.vch43):not(.vfhz) .cir-sec.is-collapsed > .pe-sec-body{display:none !important}
body:where(.vch43):not(.vfhz) .row.cir-filebar-row{margin-bottom:0 !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-filebar{margin:0 !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-filebar .CardBody{padding:6px 0 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap{border:1px solid #e1e5ec !important;border-top:3px solid #e07a5f !important;border-radius:10px !important;box-shadow:none !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr th, body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr td{border-right:1px solid #ecebef !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr th:last-child, body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items tr td:last-child{border-right:0 !important}
body:where(.vch43):not(.vfhz) .cir-filebar input[type=file]{width:auto !important;min-width:270px;max-width:none !important}
body:where(.vch43):not(.vfhz) .cir-btn.cir-add, body:where(.vch43):not(.vfhz) table.cir-items th .cir-btn.cir-add{background:#336633 !important;color:#fff !important;border:0 !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent{border:1px solid #e1e5ec !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent.cir-accent-o{border-top:3px solid #e07a5f !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader{padding:16px 18px 4px !important;border-bottom:0 !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader, body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader h3, body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader h4, body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent > .CardHeader .CardTitle{font-family:Roboto, sans-serif !important;font-size:16px !important;font-weight:700 !important;color:#292b2c !important;text-transform:none !important;letter-spacing:normal !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent label, body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent .LabelTitle, body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent .col-form-label{font-size:14px !important;font-weight:400 !important;color:#555 !important;text-transform:none !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent input[type=text], body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent select, body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent textarea{border:1px solid rgba(0,0,0,.15) !important;border-radius:4px !important;font-size:14px !important;background:#fff !important}
body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent input[type=text], body:where(.vch43):not(.vfhz) .Card.cir-card.cir-accent select{height:38px !important}
body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-pdf{background:#336633 !important;color:#fff !important;border:0 !important}
body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-pdf:hover, body:where(.vch43):not(.vfhz) .cir-btn.cir-hoverblue:hover{background:#0a6ea8 !important;filter:none !important}
body:where(.vch43):not(.vfhz) .row.cir-top-row{margin-bottom:0 !important}
body:where(.vch43):not(.vfhz) .row.cir-top-row .Card{margin-bottom:12px !important}
body:where(.vch43):not(.vfhz) .pe-sec.cir-sec{margin-top:0 !important;margin-bottom:12px !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice ul.ResortData{margin-bottom:10px !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-resort-row{margin-top:0 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar input[type=file]{font-size:12.5px !important;color:#555 !important;width:259px !important;min-width:259px !important;max-width:none !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar input[type=file]::file-selector-button{background:#e8f3fa !important;color:#08517c !important;border:0 !important;border-radius:5px !important;padding:6px 12px !important;font-size:12.5px !important;font-weight:600 !important;margin-right:10px;cursor:pointer}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar input[type=file]::file-selector-button:hover{background:#d6eaf7 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar .cir-btn{background:#e8f3fa !important;color:#08517c !important;border:0 !important;border-radius:5px !important;padding:10px 30px !important;height:auto !important;font-size:13.5px !important;font-weight:700 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar .cir-btn:hover{background:#d6eaf7 !important;filter:none !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar .cir-btn[name=submitImport], body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar .cir-btn[name=submitExport]{background:#336633 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar .cir-btn[name=submitCopyPL]{background:#5f6b7a !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-btn:hover, body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar .cir-btn:hover, body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb:hover, body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-pdf:hover, body:where(.vch43):not(.vfhz) .cir-btn.cir-hoverblue:hover{background:#0069d9 !important;color:#fff !important;border-color:#0069d9 !important;filter:none !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar input[type=file]::file-selector-button:hover{background:#0069d9 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-btn.cir-grey:not(:hover){background:#555555 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar .cir-btn[name=submitCopyPL]:not(:hover){background:#555555 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-back:not(:hover){background:#555555 !important;color:#fff !important;border-color:#555555 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap.cir-slots-wrap{border-top:3px solid #000 !important;margin-top:14px}
body:where(.vch43):not(.vfhz) .ContentArea .cir-slots-wrap table.cir-slots td, body:where(.vch43):not(.vfhz) .ContentArea .cir-slots-wrap table.cir-slots th{white-space:nowrap}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack{text-align:center !important;vertical-align:bottom !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack .cir-th-ctl{display:flex;justify-content:center;align-items:center;gap:6px;margin:4px 0 0}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack .cir-th-ctl input{margin:0 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items td.cir-center{text-align:center !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items td.cir-center > *{margin-left:auto;margin-right:auto}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack .cir-th-ctl{position:relative}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack .cir-th-ctl > i{position:absolute;left:calc(50% + 12px);top:50%;transform:translateY(-50%)}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack{vertical-align:middle !important;line-height:1.25}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack .cir-th-ctl{margin:2px 0 0 !important;line-height:1}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack .cir-th-ctl input[type=checkbox]{width:12px !important;height:12px !important;margin:0 !important;vertical-align:middle}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-top{display:flex;justify-content:center}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-ctl{position:relative}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-icons{position:absolute;left:calc(50% + 10px);top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-icons i{position:static !important;transform:none !important;font-size:12px;cursor:pointer}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th i.fa{color:#555 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th i.fa-trash{color:#b42318 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th i.fa-refresh{color:#0a6ea8 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th i.fa:hover{color:#0069d9 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-icons{left:calc(50% + 8px);gap:4px}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-ctl{flex-direction:column-reverse !important;align-items:center !important;gap:3px !important;margin:3px 0 0 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-ctl .cir-th-icons{position:static !important;left:auto !important;top:auto !important;transform:none !important;display:inline-flex;justify-content:center;gap:8px}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add{font-size:0 !important;line-height:0 !important;vertical-align:middle !important;padding-top:6px !important;padding-bottom:6px !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-top{line-height:1}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-top input, body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-top button{margin:0 !important}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-ctl{margin:4px 0 0 !important;line-height:1}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-add .cir-th-icons i{font-size:12px !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add{font-size:0 !important;line-height:0 !important;vertical-align:middle !important;padding-top:6px !important;padding-bottom:6px !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add .cir-th-top input, body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add .cir-th-top button{margin:0 !important;font-size:11px !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add .cir-th-ctl{margin:4px 0 0 !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2){font-size:0 !important;line-height:0 !important;vertical-align:middle !important;padding-top:6px !important;padding-bottom:6px !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl{display:flex !important;flex-direction:row !important;justify-content:center !important;align-items:center !important;gap:7px !important;margin:5px 0 0 !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl .cir-th-icons{display:contents !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl i.fa{position:static !important;transform:none !important;font-size:12px !important;line-height:1 !important;display:block !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl i.fa-trash{order:1 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl input[type=checkbox]{order:2 !important;margin:0 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl i.fa-refresh{order:3 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items input[name^="Unit["], body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items input[name^="Quantity["], body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items input[name^="Price["]{width:120px !important;min-width:120px !important;max-width:120px !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr th.cir-th-wrap:not(#vfz-w1):not(#vfz-w2){white-space:normal !important;width:1% !important;min-width:72px !important;line-height:1.25 !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items tr td.cir-fit:not(#vfz-w1):not(#vfz-w2){white-space:nowrap !important;width:1% !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items input[name^="ShippingDate"]{width:98px !important;min-width:98px !important;max-width:98px !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-cm-toggle{display:inline-flex;align-items:center;gap:4px;margin:0;font-weight:400;cursor:pointer}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items table.slot_summary td:not(#vfz-t1):not(#vfz-t2), body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items table.slot_summary th:not(#vfz-t1):not(#vfz-t2){font-size:15px !important;font-weight:700 !important;white-space:nowrap !important}
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items input[name^="Cost["]{width:80px !important;min-width:80px !important;max-width:80px !important}
body:where(.vch43):not(.vfhz) .pe-ribbon.cir-ribbon{column-gap:56px !important;row-gap:12px !important;flex-wrap:wrap}
/* Commercial invoice editor - demo: override older orange table headers */
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items thead th:not(#vfz-h1):not(#vfz-h2){background:#fff !important;color:#292b2c !important}
/* Commercial invoice editor - demo: hide the older summary strip (replaced by the new ribbon) */
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .ci-ribbon{display:none !important}
/* Packing list editor - ported to demo (form-specific rules + column widths) */
body:where(.vch43):not(.vfhz) #generate_packaging_report ul.ResortData{margin-bottom:10px !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-resort-row{margin-top:0 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar input[type=file]{font-size:12.5px !important;color:#555 !important;width:259px !important;min-width:259px !important;max-width:none !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar input[type=file]::file-selector-button{background:#e8f3fa !important;color:#08517c !important;border:0 !important;border-radius:5px !important;padding:6px 12px !important;font-size:12.5px !important;font-weight:600 !important;margin-right:10px;cursor:pointer}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar input[type=file]::file-selector-button:hover{background:#d6eaf7 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar .cir-btn{background:#e8f3fa !important;color:#08517c !important;border:0 !important;border-radius:5px !important;padding:10px 30px !important;height:auto !important;font-size:13.5px !important;font-weight:700 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar .cir-btn:hover{background:#d6eaf7 !important;filter:none !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar .cir-btn[name=submitImport], body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar .cir-btn[name=submitExport]{background:#336633 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar .cir-btn[name=submitCopyPL]{background:#5f6b7a !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-btn:hover, body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar .cir-btn:hover, body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb:hover, body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-pdf:hover, body:where(.vch43):not(.vfhz) .cir-btn.cir-hoverblue:hover{background:#0069d9 !important;color:#fff !important;border-color:#0069d9 !important;filter:none !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar input[type=file]::file-selector-button:hover{background:#0069d9 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-btn.cir-grey:not(:hover){background:#555555 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar .cir-btn[name=submitCopyPL]:not(:hover){background:#555555 !important;color:#fff !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add{font-size:0 !important;line-height:0 !important;vertical-align:middle !important;padding-top:6px !important;padding-bottom:6px !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add .cir-th-top input, body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add .cir-th-top button{margin:0 !important;font-size:11px !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add .cir-th-ctl{margin:4px 0 0 !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2){font-size:0 !important;line-height:0 !important;vertical-align:middle !important;padding-top:6px !important;padding-bottom:6px !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl{display:flex !important;flex-direction:row !important;justify-content:center !important;align-items:center !important;gap:7px !important;margin:5px 0 0 !important;line-height:1 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl .cir-th-icons{display:contents !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl i.fa{position:static !important;transform:none !important;font-size:12px !important;line-height:1 !important;display:block !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl i.fa-trash{order:1 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl input[type=checkbox]{order:2 !important;margin:0 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-stack.cir-th-add:not(#vfz-a1):not(#vfz-a2) .cir-th-ctl i.fa-refresh{order:3 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="Unit["], body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="Quantity["], body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="Price["]{width:120px !important;min-width:120px !important;max-width:120px !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr th.cir-th-wrap:not(#vfz-w1):not(#vfz-w2){white-space:normal !important;width:1% !important;min-width:72px !important;line-height:1.25 !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items tr td.cir-fit:not(#vfz-w1):not(#vfz-w2){white-space:nowrap !important;width:1% !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="ShippingDate"]{width:98px !important;min-width:98px !important;max-width:98px !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-cm-toggle{display:inline-flex;align-items:center;gap:4px;margin:0;font-weight:400;cursor:pointer}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items table.slot_summary td:not(#vfz-t1):not(#vfz-t2), body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items table.slot_summary th:not(#vfz-t1):not(#vfz-t2){font-size:15px !important;font-weight:700 !important;white-space:nowrap !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="Cost["]{width:80px !important;min-width:80px !important;max-width:80px !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items thead th:not(#vfz-h1):not(#vfz-h2){background:#fff !important;color:#292b2c !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .ci-ribbon{display:none !important}
body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="TtlVol["], body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="CtnQty["], body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="grosswt["], body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items input[name^="netwt["]{width:100px !important;min-width:100px !important;max-width:100px !important}
/* Commercial invoice + packing list editors - demo: no white box around the file input */
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .Card.cir-filebar input[type=file]:not(#vfz-f1), body:where(.vch43):not(.vfhz) #generate_packaging_report .Card.cir-filebar input[type=file]:not(#vfz-f1){background:transparent !important;border:0 !important;padding:0 !important;box-shadow:none !important;border-radius:0 !important;height:auto !important}
/* Commercial invoice + packing list editors - Resort centred above NO. */
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-no .cir-th-top{display:flex;justify-content:center;margin:0 0 4px}
body:where(.vch43):not(.vfhz) .ContentArea .cir-items-wrap table.cir-items th.cir-th-stack.cir-th-no .cir-th-top input{margin:0 !important}
/* Manage Commercial Invoices / Packing Lists - Reset button #555555, hover #0069d9 */
body:where(.vch40):not(.vfhz) .ilr-card .ilr-form .ilr-btn:not(.ilr-btn-go){background:#555555 !important;color:#fff !important;border-color:#555555 !important}
body:where(.vch40):not(.vfhz) .ilr-card .ilr-form .ilr-btn:not(.ilr-btn-go):hover, body:where(.vch40):not(.vfhz) .ilr-card .ilr-form .ilr-btn:not(.ilr-btn-go):focus-visible{background:#0069d9 !important;color:#fff !important;border-color:#0069d9 !important}
/* Manage Commercial Invoices / Packing Lists - Reset button bold */
body:where(.vch40):not(.vfhz) .ilr-card .ilr-form .ilr-btn:not(.ilr-btn-go){font-weight:700 !important}
/* demo Manage Commercial Invoices - orange card ribbon + light-orange table header */
body:where(.vch44):not(.vfhz) .ContentArea .vp-panel{border-top:3px solid #e07a5f !important}
body:where(.vch44):not(.vfhz) .ContentArea table.vp-table.vcip-table thead th:not(#vfz-o1):not(#vfz-o2){background:#fde8df !important;color:#292b2c !important;border-color:#f6d3c6 !important}
/* Manage Commercial Invoices + Packing Lists - orange card ribbon + light-orange table header */
body:where(.vch40):not(.vfhz) .ContentArea .vp-panel{border-top:3px solid #e07a5f !important}
body:where(.vch40):not(.vfhz) .ContentArea table.vp-table.vcip-table thead th:not(#vfz-o1):not(#vfz-o2){background:#fde8df !important;color:#292b2c !important;border-color:#f6d3c6 !important}
/* CI + PL editors - light-orange items table header */
body:where(.vch43):not(.vfhz) #generate_commercial_invoice .cir-items-wrap table.cir-items:not(.cir-slots) thead th:not(#vfz-p1):not(#vfz-p2):not(#vfz-p3), body:where(.vch43):not(.vfhz) #generate_packaging_report .cir-items-wrap table.cir-items:not(.cir-slots) thead th:not(#vfz-p1):not(#vfz-p2):not(#vfz-p3){background:#fde8df !important;color:#292b2c !important;border-bottom-color:#f6d3c6 !important}
/* All document lists - orange card ribbon + light-orange table header */
body:where(.vch37):not(.vfhz) .ContentArea .vp-panel{border-top:3px solid #e07a5f !important}
body:where(.vch37):not(.vfhz) .ContentArea table.vp-table.vld-table thead th:not(#vfz-o1):not(#vfz-o2){background:#fde8df !important;color:#292b2c !important;border-color:#f6d3c6 !important}
body:where(.vch37):not(.vfhz) .ContentArea table.vp-table.vld-table thead th a{color:#292b2c !important}
/* Telex release edit page - ported to demo (button colours + ribbon spacing) */
body:where(.vch45):not(.vfhz) .pe-band-actions .pe-bb.telex-pdf, body:where(.vch45):not(.vfhz) .pe-actions .telex-pdf{background:#336633 !important;color:#fff !important;border:0 !important}
body:where(.vch45):not(.vfhz) .pe-band-actions .pe-bb.telex-pdf:hover, body:where(.vch45):not(.vfhz) .pe-actions .telex-pdf:hover{background:#0069d9 !important}
body:where(.vch45):not(.vfhz) .pe-actions input[type=button].telex-pdf:not(:hover){background:#336633 !important;color:#fff !important;border:0 !important}
body:where(.vch45):not(.vfhz) .pe-actions input[type=button].telex-pdf:hover{background:#0069d9 !important;color:#fff !important}
body:where(.vch45):not(.vfhz) .pe-actions input[type=submit][name=btnsave]:not(:hover){background:#336633 !important;color:#fff !important;border:0 !important}
body:where(.vch45):not(.vfhz) .pe-actions input[type=submit][name=btnsave]:hover{background:#0069d9 !important;color:#fff !important}
body:where(.vch46):not(.vfhz) .pe-ribbon{column-gap:56px !important;row-gap:12px !important;flex-wrap:wrap}
/* HS Code Lookup - no navy header, navy top ribbon, smaller corners */
body:where(.vch41):not(#vfhz) .ContentArea .Card{border-top:3px solid #1a3a63 !important;border-radius:10px !important}
body:where(.vch41):not(#vfhz) .ContentArea .Card > .CardHeader{background:transparent !important;border-radius:10px 10px 0 0 !important;border-bottom:1px solid #eef1f4 !important}
body:where(.vch41):not(#vfhz) .ContentArea .Card > .CardHeader, body:where(.vch41):not(#vfhz) .ContentArea .Card > .CardHeader *{color:#1f2933 !important}
/* HS Code Table - Open HS Code Lookup button #336633, hover #0069d9 */
body:where(.vch42):not(.vfhz) .ilr-card .ilr-btn.ilr-btn-go:not(:hover){background:#336633 !important;color:#fff !important;border-color:#336633 !important}
body:where(.vch42):not(.vfhz) .ilr-card .ilr-btn.ilr-btn-go:hover{background:#0069d9 !important;color:#fff !important;border-color:#0069d9 !important}
/* demo Shipping documents library - plain card headers, navy (email: orange) top ribbons, 10px corners, standard buttons */
body:where(.vch39):not(.vfhz) .ContentArea .sd-card{border-radius:10px !important;border-top:3px solid #1a3a63 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head{background:#fff !important;border-radius:10px 10px 0 0 !important;border-bottom:1px solid #eef1f4 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head h3, body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head h4, body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head{color:#1f2933 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head a{color:#0a6ea8 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-card-head a:hover{color:#0069d9 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-count-pill{background:#eef2f7 !important;color:#1f2933 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card{border-radius:10px !important;overflow:hidden;border:1px solid #d5dce4 !important;border-top:3px solid #1a3a63 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card:where(.vcl47):not(.vfhz){border-top:3px solid #e07a5f !important}
body:where(.vch39):not(.vfhz) .ContentArea :is(input[name="Search"], input[type="button"][value="Send"]):not(:hover){background:#2f5e34 !important;color:#fff !important;border:0 !important;border-radius:8px !important;font-weight:700 !important}
body:where(.vch39):not(.vfhz) .ContentArea :is(input[name="Search"], input[type="button"][value="Send"]):hover{background:#0069d9 !important;color:#fff !important;border:0 !important;border-radius:8px !important}
body:where(.vch39):not(.vfhz) .ContentArea input[name="Reset"]:not(:hover){background:#555555 !important;color:#fff !important;border:0 !important;border-radius:8px !important;font-weight:700 !important}
body:where(.vch39):not(.vfhz) .ContentArea input[name="Reset"]:hover{background:#0069d9 !important;color:#fff !important;border:0 !important;border-radius:8px !important}
/* demo Shipping documents - sd-btn buttons: Send/Search dark green, Reset #555555, hover #0069d9 */
body:where(.vch39):not(.vfhz) .ContentArea button.sd-btn:not(.sd-ghost):not(:hover){background:#2f5e34 !important;color:#fff !important;border:0 !important;border-radius:8px !important;font-weight:700 !important}
body:where(.vch39):not(.vfhz) .ContentArea button.sd-btn.sd-ghost:not(:hover){background:#555555 !important;color:#fff !important;border:0 !important;border-radius:8px !important;font-weight:700 !important}
body:where(.vch39):not(.vfhz) .ContentArea button.sd-btn:hover{background:#0069d9 !important;color:#fff !important;border:0 !important;border-radius:8px !important;font-weight:700 !important}
body:where(.vch39):not(.vfhz) .ContentArea button.sd-btn:not(#vfz-b1):not(#vfz-b2){border-radius:8px !important;font-weight:700 !important}
/* demo Activity Log rows like the dashboard Activity Stream (blue bullets, tight rows) */
body:where(.vch39):not(.vfhz) .ContentArea .sd-activity-list > li.sd-activity-row{padding:0 0 6px 0 !important;margin:0 0 4px !important;border-bottom:1px solid #f0f0f0 !important;line-height:16px !important;align-items:flex-start !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-activity-list > li.sd-activity-row:last-child{border-bottom:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-activity-list .sd-activity-dot-col{width:16px !important;flex:0 0 16px !important;height:auto !important;padding-top:6px !important;display:block !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-activity-list .sd-activity-dot-col > *{width:5px !important;height:5px !important;min-width:5px !important;border-radius:50% !important;background:#0a5aa8 !important;display:block !important;margin:0 !important;box-shadow:none !important;border:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-activity-list .sd-activity-main{line-height:16px !important}
/* demo Shipping documents library - cards match nexgen (title accent bars, 13px file rows with dividers, 16px icons) */
body:where(.vch39):not(.vfhz) .ContentArea .sd-card h3.sdx-acc, body:where(.vch39):not(.vfhz) .ContentArea .sd-card h4.sdx-acc{position:relative !important;padding-left:20px !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card h3.sdx-acc::before, body:where(.vch39):not(.vfhz) .ContentArea .sd-card h4.sdx-acc::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:18px;background:var(--sdx-acc)}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-file-list{padding:6px 8px !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-file-list > li{border-bottom:1px solid #eef1f4 !important;margin:0 !important;padding:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-file-list > li:last-child{border-bottom:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card a.sd-file-row{font-size:13px !important;line-height:16px !important;padding:8px 10px !important;gap:10px !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card a.sd-file-row .sd-file-ic{width:16px !important;height:16px !important;flex:0 0 16px !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card a.sd-file-row .sd-file-ic svg{width:16px !important;height:16px !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-file-list li:where(.vcl48):not(.vfhz):not(vfhz){border-bottom:1px solid #eef1f4 !important;margin:0 !important;padding:0 !important;list-style:none !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card .sd-file-list li:where(.vcl48):not(.vfhz):not(vfhz):last-child{border-bottom:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-card a.sd-file-row .sd-file-name{font-family:inherit !important;font-size:13px !important;color:#1f2933 !important;letter-spacing:normal !important}
/* demo Shipping documents library - less empty space inside the Email/Search boxes */
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body{padding-bottom:10px !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body > *:last-child, body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body .form-group:last-child, body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body .row:last-child{margin-bottom:0 !important}
/* demo Shipping documents library - Email / Search boxes look like the nexgen cards */
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card, body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card:where(.vcl49):not(.vfhz){border-top:3px solid #e07a5f !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-head{padding:12px 16px !important;height:auto !important;min-height:48px !important;background:#fff !important;border-bottom:1px solid #eef1f4 !important;display:flex !important;align-items:center !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-title{text-transform:none !important;color:#1f2933 !important;font-size:14px !important;font-weight:700 !important;letter-spacing:normal !important;gap:0 !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-title .sd-ic{display:none !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-title::before{content:"\25e6\00a0" !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body{background:#fff !important;padding:16px 22px !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body label{font-size:13px !important;font-weight:400 !important;color:#555 !important;text-transform:none !important;letter-spacing:normal !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body input[type="text"], body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body input:not([type]){height:40px !important;border:1px solid #cbd2d9 !important;border-radius:8px !important;background:#fff !important;font-size:13px !important;padding:0 12px !important}
/* demo Shipping documents library - Email / Search boxes: no old navy accent, white fill, nexgen shadow */
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card::before{display:none !important;content:none !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card{background:#fff !important;display:flex !important;flex-direction:column !important;box-shadow:0 1px 2px rgba(16,24,40,.05) !important}
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-body{flex:1 1 auto !important}
/* demo Shipping documents library - no bullet before the Email / Search titles */
body:where(.vch39):not(.vfhz) .ContentArea .sd-util-card .sd-util-title::before{content:none !important;display:none !important}
/* Finance pages (transactions, payments, reports) - ported from nexgen */
body:where(.vch47):not(.vfhz){background:#eef1f4 !important}
body:where(.vch47):not(.vfhz) .container-fluid:where(.vcl50):not(#vfhz){padding:16px 20px 24px !important}
body:where(.vch47):not(.vfhz) .tx-tabs input[type="button"]{background:#fff !important;color:#1f2933 !important;border:1px solid #cbd2d9 !important;border-radius:18px !important;padding:6px 16px !important;font-weight:700 !important;font-size:12.5px !important;margin-right:6px}
body:where(.vch47):not(.vfhz) .tx-tabs input[type="button"].tx-tab-on{background:#1a3a63 !important;color:#fff !important;border-color:#1a3a63 !important}
body:where(.vch47):not(.vfhz) .tx-tabs input[type="button"]:hover{background:#0069d9 !important;color:#fff !important;border-color:#0069d9 !important}
body:where(.vch47):not(.vfhz) .tx-band{background:linear-gradient(90deg,#0a5a9c,#1580c8) !important;border-radius:10px !important;padding:10px 16px !important;margin:12px 0 16px !important;color:#fff !important}
body:where(.vch47):not(.vfhz) .tx-band, body:where(.vch47):not(.vfhz) .tx-band *:not(input){color:#fff !important;font-size:16px;font-weight:700}
body:where(.vch47):not(.vfhz) .tx-band input[type="button"]{border:0 !important;border-radius:8px !important;font-weight:700 !important;font-size:13px !important;padding:7px 18px !important;color:#fff !important;margin-left:6px}
body:where(.vch47):not(.vfhz) .tx-band input[type="button"][value="Add"]{background:#336633 !important}
body:where(.vch47):not(.vfhz) .tx-band input[type="button"][value="Close"]{background:#555555 !important}
body:where(.vch47):not(.vfhz) .tx-band input[type="button"]:hover{background:#0069d9 !important}
body:where(.vch47):not(.vfhz) .tx-kpis{margin:0 0 16px !important}
body:where(.vch47):not(.vfhz) .tx-card{background:#fff !important;border:1px solid #e1e5ec !important;border-top:3px solid #1a3a63 !important;border-radius:10px !important;padding:14px 18px !important;margin:0 0 16px !important;box-shadow:0 1px 2px rgba(16,24,40,.05) !important}
body:where(.vch47):not(.vfhz) .tx-card-title, body:where(.vch47):not(.vfhz) .tx-sec-title{font-size:14px !important;font-weight:700 !important;color:#1f2933 !important;margin:0 0 10px !important}
body:where(.vch47):not(.vfhz) .tx-card input[type="submit"], body:where(.vch47):not(.vfhz) .tx-card input[type="button"]{border:0 !important;border-radius:8px !important;font-weight:700 !important;color:#fff !important;padding:8px 18px !important}
body:where(.vch47):not(.vfhz) .tx-card input[name="submitImport"], body:where(.vch47):not(.vfhz) .tx-req input[type="button"]{background:#336633 !important}
body:where(.vch47):not(.vfhz) .tx-card input[name="submitExport"]{background:#0a6ea8 !important}
body:where(.vch47):not(.vfhz) .tx-card input[type="submit"]:hover, body:where(.vch47):not(.vfhz) .tx-card input[type="button"]:hover{background:#0069d9 !important}
body:where(.vch47):not(.vfhz) .tx-card input[type="file"]::file-selector-button{background:#e8f3fa;color:#08517c;border:0;border-radius:5px;padding:6px 12px;font-weight:600;font-size:12.5px;cursor:pointer}
body:where(.vch47):not(.vfhz) .tx-table{background:#fff !important;border:1px solid #e1e5ec !important;border-radius:10px !important;overflow:hidden !important;margin:0 0 16px !important}
body:where(.vch47):not(.vfhz) .tx-table table{margin:0 !important;border:0 !important}
body:where(.vch47):not(.vfhz) .tx-table table th{background:#1a3a63 !important;color:#fff !important;font-size:11.5px !important;text-transform:uppercase;letter-spacing:.03em;font-weight:700 !important;border:0 !important;padding:10px 12px !important}
body:where(.vch47):not(.vfhz) .tx-table table td{border:0 !important;border-bottom:1px solid #eef1f4 !important;padding:10px 12px !important;font-size:13px !important;vertical-align:middle !important}
body:where(.vch47):not(.vfhz) .tx-table table tr:nth-child(even) td{background:#f8fafc !important}
body:where(.vch47):not(.vfhz) .tx-table table tr:hover td{background:#eef2ff !important}
body:where(.vch47):not(.vfhz) .tx-req select, body:where(.vch47):not(.vfhz) .tx-req input[type="text"], body:where(.vch47):not(.vfhz) .tx-req textarea{border:1px solid #cbd2d9 !important;border-radius:8px !important;font-size:13px !important}
body:where(.vch47):not(.vfhz) .tx-req select, body:where(.vch47):not(.vfhz) .tx-req input[type="text"]{height:38px !important}
body:where(.vch47):not(.vfhz) .tx-card .CardBody, body:where(.vch47):not(.vfhz) .tx-card .CardBody > *{text-align:left !important;justify-content:flex-start !important;margin-left:0 !important;padding-left:0 !important;padding-right:0 !important;float:none !important}
body:where(.vch47):not(.vfhz) .tx-card .text-center, body:where(.vch47):not(.vfhz) .tx-card .uplodNbtnCen{text-align:left !important}
body:where(.vch48):not(.vfhz) .pay-kpis{margin:0 0 16px !important}
body:where(.vch48):not(.vfhz) .Card.pay-card{border:1px solid #e1e5ec !important;border-top:3px solid #1a3a63 !important;border-radius:10px !important;overflow:hidden;box-shadow:0 1px 2px rgba(16,24,40,.05) !important}
body:where(.vch48):not(.vfhz) .Card.pay-card > .CardHeader{background:#fff !important;border-radius:10px 10px 0 0 !important;border-bottom:1px solid #eef1f4 !important;padding:12px 18px !important}
body:where(.vch48):not(.vfhz) .Card.pay-card > .CardHeader, body:where(.vch48):not(.vfhz) .Card.pay-card > .CardHeader *{color:#1f2933 !important;font-size:15px !important;font-weight:700 !important}
body:where(.vch48):not(.vfhz) .Card.pay-card .CardBody{padding:16px 22px !important}
body:where(.vch48):not(.vfhz) .Card.pay-card label{font-size:13px !important;color:#555 !important;font-weight:400 !important}
body:where(.vch48):not(.vfhz) .Card.pay-card input[type="text"], body:where(.vch48):not(.vfhz) .Card.pay-card input[type="date"], body:where(.vch48):not(.vfhz) .Card.pay-card select{height:38px !important;border:1px solid #cbd2d9 !important;border-radius:8px !important;font-size:13px !important}
body:where(.vch48):not(.vfhz) .Card.pay-card textarea{border:1px solid #cbd2d9 !important;border-radius:8px !important;font-size:13px !important}
body:where(.vch48):not(.vfhz) .Card.pay-card .pay-b-go, body:where(.vch48):not(.vfhz) .Card.pay-card .pay-b-back{border:0 !important;border-radius:8px !important;font-weight:700 !important;color:#fff !important;padding:9px 20px !important}
body:where(.vch48):not(.vfhz) .Card.pay-card .pay-b-go{background:#336633 !important}
body:where(.vch48):not(.vfhz) .Card.pay-card .pay-b-back{background:#555555 !important}
body:where(.vch48):not(.vfhz) .Card.pay-card .pay-b-go:hover, body:where(.vch48):not(.vfhz) .Card.pay-card .pay-b-back:hover{background:#0069d9 !important}
body:where(.vch48):not(.vfhz) .pay-kpis .ilr-kpi:first-child .ilr-kpi-v{font-size:15px !important;line-height:1.3 !important}
body:where(.vch49):not(.vfhz) .rpt-kpis{margin:0 0 16px !important}
body:where(.vch49):not(.vfhz) .Card.ListCard.rpt-listcard{background:transparent !important;border:0 !important;box-shadow:none !important;margin:0 !important}
body:where(.vch49):not(.vfhz) .Card.ListCard.rpt-listcard > .CardBody{padding:0 !important}
body:where(.vch49):not(.vfhz) .rpt-filter{background:#fff !important;border:1px solid #e1e5ec !important;border-top:3px solid #1a3a63 !important;border-radius:10px !important;padding:14px 18px !important;margin:0 0 16px !important;box-shadow:0 1px 2px rgba(16,24,40,.05) !important}
body:where(.vch49):not(.vfhz) .rpt-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px}
body:where(.vch49):not(.vfhz) .rpt-field{display:flex;flex-direction:column;gap:4px;margin:0;flex:0 0 190px}
body:where(.vch49):not(.vfhz) .rpt-field:where(.vcl51):not(.vfhz){flex:1 1 260px}
body:where(.vch49):not(.vfhz) .rpt-field > span{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#52606d}
body:where(.vch49):not(.vfhz) .rpt-field input{height:38px !important;border:1px solid #cbd2d9 !important;border-radius:8px !important;font-size:13px !important;padding:0 10px !important;width:100% !important;background:#fff !important}
body:where(.vch49):not(.vfhz) .rpt-btns{display:flex;gap:8px;margin-left:auto}
body:where(.vch49):not(.vfhz) .rpt-btns input{height:38px !important;border:0 !important;border-radius:8px !important;font-weight:700 !important;color:#fff !important;padding:0 18px !important;font-size:13px !important;text-transform:none !important}
body:where(.vch49):not(.vfhz) .rpt-btns .rpt-b-go{background:#2f5e34 !important}
body:where(.vch49):not(.vfhz) .rpt-btns .rpt-b-reset{background:#555555 !important}
body:where(.vch49):not(.vfhz) .rpt-btns .rpt-b-exp{background:#0a6ea8 !important}
body:where(.vch49):not(.vfhz) .rpt-btns input:hover{background:#0069d9 !important}
body:where(.vch49):not(.vfhz) .rpt-panel{background:#fff;border:1px solid #e1e5ec;border-top:3px solid #1a3a63;border-radius:10px;padding:14px 18px 10px;margin:0 0 16px;box-shadow:0 1px 2px rgba(16,24,40,.05)}
body:where(.vch49):not(.vfhz) .rpt-head{display:flex;align-items:baseline;gap:10px;padding:0 0 10px;margin:0 0 10px;border-bottom:1px solid #eef1f4}
body:where(.vch49):not(.vfhz) .rpt-title{font-size:15px;font-weight:700;color:#1f2933}
body:where(.vch49):not(.vfhz) .rpt-hint{font-size:12.5px;color:#7b8794}
body:where(.vch49):not(.vfhz) table.rpt-table{margin:0 !important;border:0 !important}
body:where(.vch49):not(.vfhz) table.rpt-table th{background:#1a3a63 !important;color:#fff !important;font-size:11.5px !important;text-transform:uppercase;letter-spacing:.03em;font-weight:700 !important;border:0 !important;padding:10px 12px !important;white-space:nowrap}
body:where(.vch49):not(.vfhz) table.rpt-table td{border:0 !important;border-bottom:1px solid #eef1f4 !important;padding:9px 12px !important;font-size:13px !important;vertical-align:middle !important;background:#fff !important}
body:where(.vch49):not(.vfhz) table.rpt-table tr:nth-child(even) td{background:#f8fafc !important}
body:where(.vch49):not(.vfhz) table.rpt-table tr:hover td{background:#eef2ff !important}
body:where(.vch49):not(.vfhz) table.rpt-table td a{font-weight:700 !important;color:#0a6ea8 !important}
body:where(.vch49):not(.vfhz) .rpt-pager{display:flex;justify-content:center;padding:12px 0 2px}
body:where(.vch49):not(.vfhz) .rpt-pager ul.pagination{margin:0 !important}
/* demo AR list - hide the older wrapper header + status strip around the new panel */
body:where(.vch50):not(.vfhz) #clientARPanel > .inv-panel-head, body:where(.vch50):not(.vfhz) #clientARPanel > .tile-ribbon{display:none !important}
body:where(.vch50):not(.vfhz) #clientARPanel{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important}
/* Finance pages tweaks - AP/AR search grows to the buttons, transactions import card aligned, payment popups without sidebar gap + footer */
body:where(.vch32):not(.vfhz) .vap-row .vap-field:where(.vcl52):not(.vfhz){flex:1 1 260px !important}
body:where(.vch32):not(.vfhz) .vap-row .vap-field:where(.vcl52):not(.vfhz) input{width:100% !important}
body:where(.vch47):not(.vfhz) .col-12:where(.vcl53):not(.vfhz){padding-left:0 !important;padding-right:0 !important}
body:where(.vch48):not(.vfhz) .MainContainer{margin-left:0 !important}
body:where(.vch48):not(.vfhz) .footer{display:none !important}
body:where(.vch48):not(.vfhz){background:#eef1f4 !important}
/* Transactions popups - Client / Manufacturer tabs shaped like the AR buttons; active = dark green, other = white */
body:where(.vch47):not(.vfhz) .tx-tabs input[type="button"]{border-radius:8px !important;height:40px !important;padding:0 16px !important;font-size:13.5px !important;font-weight:700 !important;background:#fff !important;color:#1f2933 !important;border:1px solid #cbd2d9 !important;margin-right:8px !important;text-transform:none !important}
body:where(.vch47):not(.vfhz) .tx-tabs input[type="button"].tx-tab-on, body:where(.vch47):not(.vfhz) .tx-tabs input[type="button"].tx-tab-on:hover{background:#336633 !important;color:#fff !important;border-color:#336633 !important}
body:where(.vch47):not(.vfhz) .tx-tabs input[type="button"]:not(.tx-tab-on):hover{background:#0069d9 !important;color:#fff !important;border-color:#0069d9 !important}
/* Client statements - Client Ledger List / Client Statement / preview */
body:where(.vch51):not(.vfhz) .stmt-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
body:where(.vch51):not(.vfhz) .stmt-tab{height:40px;box-sizing:border-box;display:inline-flex;align-items:center;padding:0 16px;border-radius:8px;background:#fff;border:1px solid #cbd2d9;color:#1f2933 !important;font-size:13.5px;font-weight:700;text-decoration:none !important}
body:where(.vch51):not(.vfhz) .stmt-tab:not(.stmt-tab-on):hover{background:#0069d9;border-color:#0069d9;color:#fff !important}
body:where(.vch51):not(.vfhz) .stmt-tab.stmt-tab-on{background:#336633;border-color:#336633;color:#fff !important}
body:where(.vch51):not(.vfhz) .stmt-field-clients{flex:2 1 320px !important}
body:where(.vch51):not(.vfhz) .stmt-field-clients .chosen-container{width:100% !important}
body:where(.vch51):not(.vfhz) .stmt-field-clients .chosen-choices{min-height:38px !important;border:1px solid #cbd2d9 !important;border-radius:8px !important;background:#fff !important;padding:3px 6px !important}
body:where(.vch51):not(.vfhz) .stmt-opts{display:flex;flex-wrap:wrap;gap:22px;margin:12px 0 0}
body:where(.vch51):not(.vfhz) .stmt-opt{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#1f2933;margin:0;font-weight:400}
body:where(.vch51):not(.vfhz) .stmt-opt input{width:17px;height:17px;margin:0}
body:where(.vch51):not(.vfhz) .rpt-btns .rpt-b-send{background:#336633 !important}
body:where(.vch51):not(.vfhz) .stmt-pill{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;white-space:nowrap}
body:where(.vch51):not(.vfhz) .stmt-pill-unpaid{background:#fde8df;color:#9a3412}
body:where(.vch51):not(.vfhz) .stmt-pill-partial{background:#dbeafe;color:#1e3a8a}
body:where(.vch51):not(.vfhz) .stmt-pill-paid{background:#dcfce7;color:#14532d}
body:where(.vch51):not(.vfhz) table.stmt-table td.stmt-bal{color:#b42318 !important;font-weight:700 !important}
body:where(.vch51):not(.vfhz) table.stmt-table tr.stmt-total td{font-weight:700 !important;background:#f6f8fa !important;border-bottom:0 !important}
body:where(.vch51):not(.vfhz) table.stmt-table tr.stmt-pay-row td{background:#f1f8f1 !important;color:#2f6b34 !important;font-size:12.5px !important}
/* Client statements - Client Statement tab (Option B) */
body:where(.vch52):not(.vfhz) .stmtb-wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin:0 0 16px}
body:where(.vch52):not(.vfhz) .stmtb-rail{flex:1 1 300px;max-width:380px;background:#fff;border:1px solid #e1e5ec;border-top:3px solid #1a3a63;border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:12px}
body:where(.vch52):not(.vfhz) .stmtb-rail-head{display:flex;justify-content:space-between;align-items:baseline}
body:where(.vch52):not(.vfhz) .stmtb-rail .rpt-field{flex:none !important}
body:where(.vch52):not(.vfhz) .stmtb-list{display:flex;flex-direction:column;gap:4px;max-height:640px;overflow-y:auto}
body:where(.vch52):not(.vfhz) .stmtb-item{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px;border-radius:8px;border:1px solid #eef1f4;background:#fff;text-decoration:none !important}
body:where(.vch52):not(.vfhz) .stmtb-item:hover{border-color:#0069d9;background:#f3f8fe}
body:where(.vch52):not(.vfhz) .stmtb-item.stmtb-on{background:#e8f0fa;border-color:#0f5f9e}
body:where(.vch52):not(.vfhz) .stmtb-item-l{display:flex;flex-direction:column;gap:2px;min-width:0}
body:where(.vch52):not(.vfhz) .stmtb-name{font-size:13px;font-weight:600;color:#1f2933;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:where(.vch52):not(.vfhz) .stmtb-meta{font-size:12px;color:#52606d}
body:where(.vch52):not(.vfhz) .stmtb-bal{font-size:13px;font-weight:700;color:#b42318;white-space:nowrap;font-variant-numeric:tabular-nums}
body:where(.vch52):not(.vfhz) .stmtb-bal.stmtb-zero{color:#52606d;font-weight:600}
body:where(.vch52):not(.vfhz) .stmtb-main{flex:999 1 640px;min-width:0;display:flex;flex-direction:column;gap:16px}
body:where(.vch52):not(.vfhz) .stmtb-main form{margin:0}
body:where(.vch52):not(.vfhz) .stmtb-head, body:where(.vch52):not(.vfhz) .stmtb-empty{background:#fff;border:1px solid #e1e5ec;border-top:3px solid #1a3a63;border-radius:10px;padding:18px 20px;display:flex;flex-direction:column;gap:14px}
body:where(.vch52):not(.vfhz) .stmtb-head-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:flex-start}
body:where(.vch52):not(.vfhz) .stmtb-who{display:flex;flex-direction:column;gap:4px}
body:where(.vch52):not(.vfhz) .stmtb-client{font-size:19px;font-weight:700;color:#1f2933}
body:where(.vch52):not(.vfhz) .stmtb-head .rpt-btns{margin-left:0}
body:where(.vch52):not(.vfhz) .stmtb-sum{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
body:where(.vch52):not(.vfhz) .stmtb-sum-i{background:#f6f8fa;border-radius:8px;padding:12px 14px;display:flex;flex-direction:column;gap:4px}
body:where(.vch52):not(.vfhz) .stmtb-sum-v{font-size:21px;font-weight:700;font-variant-numeric:tabular-nums;color:#1f2933}
body:where(.vch52):not(.vfhz) .stmtb-paid .stmtb-sum-v{color:#2f6b34}
body:where(.vch52):not(.vfhz) .stmtb-due{background:#fdf1ef}
body:where(.vch52):not(.vfhz) .stmtb-due .stmtb-sum-v{color:#b42318}
/* demo client statements - hide the older wrapper header + status strip around the new panel */
body:where(.vch51):not(.vfhz) #clientStatementPanel > .inv-panel-head, body:where(.vch51):not(.vfhz) #clientStatementPanel > .tile-ribbon{display:none !important}
body:where(.vch51):not(.vfhz) #clientStatementPanel{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important}
/* Sales report - overview + Month Summary */
body:where(.vch53):not(.vfhz) .ContentHeader{position:relative}
body:where(.vch53):not(.vfhz) .sales-band-act{position:absolute;right:24px;top:50%;transform:translateY(-50%);display:flex;gap:8px}
body:where(.vch53):not(.vfhz) .sales-bb{height:40px;box-sizing:border-box;display:inline-flex;align-items:center;padding:0 16px;border-radius:8px;color:#fff !important;font-size:13.5px;font-weight:700;text-decoration:none !important}
body:where(.vch53):not(.vfhz) .sales-bb-go{background:#336633}
body:where(.vch53):not(.vfhz) .sales-bb-back{background:#555555}
body:where(.vch53):not(.vfhz) .sales-bb:hover{background:#0069d9}
body:where(.vch53):not(.vfhz) .ilr-kpi-v.sales-pos{color:#2f6b34}
body:where(.vch53):not(.vfhz) .ilr-kpi-v.sales-neg{color:#b42318}
body:where(.vch53):not(.vfhz) .sales-grid{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch;margin:0 0 16px}
body:where(.vch53):not(.vfhz) .sales-card{background:#fff;border:1px solid #e1e5ec;border-top:3px solid #1a3a63;border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:12px;box-shadow:0 1px 2px rgba(16,24,40,.05)}
body:where(.vch53):not(.vfhz) .sales-chart{flex:999 1 620px;min-width:0}
body:where(.vch53):not(.vfhz) .sales-clients{flex:1 1 320px}
body:where(.vch53):not(.vfhz) .sales-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:10px}
body:where(.vch53):not(.vfhz) .sales-head h2{margin:0;font-size:15px;font-weight:700;color:#1f2933}
body:where(.vch53):not(.vfhz) .sales-legend{display:flex;gap:16px;font-size:12.5px;color:#3e4c59}
body:where(.vch53):not(.vfhz) .sales-legend span{display:inline-flex;align-items:center;gap:6px}
body:where(.vch53):not(.vfhz) .sales-legend span::before{content:"";width:12px;height:12px;border-radius:3px}
body:where(.vch53):not(.vfhz) .sales-legend .sl-s::before{background:#1a3a63}
body:where(.vch53):not(.vfhz) .sales-legend .sl-c::before{background:#9fb3c8}
body:where(.vch53):not(.vfhz) .sales-bars{display:flex;gap:8px;align-items:flex-end;height:230px;padding:0 4px;border-bottom:1px solid #cbd2d9}
body:where(.vch53):not(.vfhz) .sales-col{flex:1 1 0;height:100%;display:flex;align-items:flex-end;justify-content:center;gap:4px}
body:where(.vch53):not(.vfhz) .sales-col .sb-s, body:where(.vch53):not(.vfhz) .sales-col .sb-c{width:40%;max-width:26px;border-radius:4px 4px 0 0}
body:where(.vch53):not(.vfhz) .sales-col .sb-s{background:#1a3a63}
body:where(.vch53):not(.vfhz) .sales-col .sb-c{background:#9fb3c8}
body:where(.vch53):not(.vfhz) .sales-labels{display:flex;gap:8px;padding:0 4px}
body:where(.vch53):not(.vfhz) .sales-labels span{flex:1 1 0;text-align:center;font-size:11.5px;color:#52606d;white-space:nowrap}
body:where(.vch53):not(.vfhz) .sales-cl{display:flex;flex-direction:column;gap:5px}
body:where(.vch53):not(.vfhz) .sales-cl-r{display:flex;justify-content:space-between;gap:10px;font-size:13px}
body:where(.vch53):not(.vfhz) .sales-cl-n{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:where(.vch53):not(.vfhz) .sales-cl-v{font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
body:where(.vch53):not(.vfhz) .sales-bar{flex:1 1 auto;min-width:70px;height:8px;border-radius:4px;background:#e6ebf1;overflow:hidden}
body:where(.vch53):not(.vfhz) .sales-bar-i{height:8px;background:#2f6b34}
body:where(.vch53):not(.vfhz) .sales-bar-i.sales-bar-blue{background:#0f5f9e}
body:where(.vch53):not(.vfhz) .sales-head2{justify-content:space-between}
body:where(.vch53):not(.vfhz) .sales-link{margin-left:auto;font-size:12.5px;font-weight:700;color:#0a6ea8 !important;text-decoration:none !important}
body:where(.vch53):not(.vfhz) .sales-link:hover{color:#0069d9 !important}
body:where(.vch53):not(.vfhz) .sales-tw{overflow-x:auto}
body:where(.vch53):not(.vfhz) table.sales-mt{width:100%;border-collapse:collapse}
body:where(.vch53):not(.vfhz) table.sales-mt th.num, body:where(.vch53):not(.vfhz) table.sales-mt td.num, body:where(.vch53):not(.vfhz) table.sales-sub .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
body:where(.vch53):not(.vfhz) table.sales-mt td.sales-mn{font-weight:700}
body:where(.vch53):not(.vfhz) table.sales-mt td.sales-pos{color:#2f6b34 !important}
body:where(.vch53):not(.vfhz) table.sales-mt td.sales-neg, body:where(.vch53):not(.vfhz) table.sales-sub td.sales-neg{color:#b42318 !important;font-weight:700}
body:where(.vch53):not(.vfhz) table.sales-mt td.sales-zero, body:where(.vch53):not(.vfhz) table.sales-sub td.sales-zero{color:#52606d !important}
body:where(.vch53):not(.vfhz) .sales-collected{display:flex;align-items:center;gap:8px}
body:where(.vch53):not(.vfhz) .sales-collected span{font-size:12.5px;width:46px;text-align:right}
body:where(.vch53):not(.vfhz) table.sales-mt tr.sales-tot td{font-weight:700 !important;background:#f6f8fa !important;border-bottom:0 !important}
body:where(.vch53):not(.vfhz) table.sales-mt tr.sales-open td{background:#f3f6fa !important}
body:where(.vch53):not(.vfhz) .sales-show{height:32px;padding:0 12px;border:1px solid #cbd2d9;border-radius:8px;background:#fff;color:#1f2933;font-weight:700;font-size:12.5px;cursor:pointer}
body:where(.vch53):not(.vfhz) .sales-show.on{background:#336633;border-color:#336633;color:#fff}
body:where(.vch53):not(.vfhz) .sales-show:hover{background:#0069d9;border-color:#0069d9;color:#fff}
body:where(.vch53):not(.vfhz) table.sales-mt tr.sales-subrow > td{background:#f3f6fa !important;padding:4px 12px 16px 28px !important}
body:where(.vch53):not(.vfhz) table.sales-sub{width:100%;border-collapse:collapse;background:#fff;border:1px solid #e1e5ec;border-radius:8px}
body:where(.vch53):not(.vfhz) table.sales-sub th{background:#e8eef6 !important;color:#1a3a63 !important;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:8px 12px !important;text-align:left}
body:where(.vch53):not(.vfhz) table.sales-sub td{padding:9px 12px !important;border-bottom:1px solid #eef1f4 !important;font-size:13px !important;background:#fff !important}
body:where(.vch53):not(.vfhz) .sales-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;padding-top:14px;margin-top:14px;border-top:1px solid #eef1f4}
body:where(.vch53):not(.vfhz) .sales-strip > div{display:flex;flex-direction:column;gap:3px}
body:where(.vch53):not(.vfhz) .sales-strip-v{font-size:19px;font-weight:700;font-variant-numeric:tabular-nums;white-space:pre}
body:where(.vch53):not(.vfhz) .sales-strip-v.sales-pos{color:#2f6b34}
body:where(.vch53):not(.vfhz) .sales-strip-v.sales-neg{color:#b42318}
/* demo sales report - hide the older wrapper header + status strip */
body:where(.vch53):not(.vfhz) #salesReportPanel > .inv-panel-head, body:where(.vch53):not(.vfhz) #salesReportPanel > .tile-ribbon{display:none !important}
body:where(.vch53):not(.vfhz) #salesReportPanel{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important}
body:where(.vch53):not(.vfhz) .rpt-filter > .sales-strip:first-child{border-top:0;padding-top:0;margin-top:0;padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid #eef1f4}
/* Client invoice report - overview + Client Scorecard */
body:where(.vch54):not(.vfhz) .cir2-period{font-size:12.5px;color:#52606d;margin:0 0 12px}
body:where(.vch54):not(.vfhz) .cir2-bar{display:grid;grid-template-columns:minmax(150px,240px) 1fr 150px;gap:12px;align-items:center}
body:where(.vch54):not(.vfhz) .cir2-bar-n{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:where(.vch54):not(.vfhz) .cir2-bar-b{height:14px !important;border-radius:4px}
body:where(.vch54):not(.vfhz) .cir2-bar-b .sales-bar-i{height:14px}
body:where(.vch54):not(.vfhz) .sales-bar-i.cir2-navy{background:#1a3a63}
body:where(.vch54):not(.vfhz) .cir2-bar-v{font-size:12.5px;text-align:right;color:#52606d;white-space:nowrap;font-variant-numeric:tabular-nums}
body:where(.vch54):not(.vfhz) .cir2-bar-v b{color:#1f2933}
body:where(.vch54):not(.vfhz) .sales-cl-v.cir2-red{color:#b42318}
body:where(.vch54):not(.vfhz) .sales-bar.cir2-owe{background:#f6e3df}
body:where(.vch54):not(.vfhz) .sales-bar-i.cir2-red-bg{background:#b42318}
body:where(.vch54):not(.vfhz) .cir2-head{justify-content:space-between;flex-wrap:wrap}
body:where(.vch54):not(.vfhz) .cir2-ctl, body:where(.vch54):not(.vfhz) .cir2-ctlbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
body:where(.vch54):not(.vfhz) .cir2-ctlbar{background:#fff;border:1px solid #e1e5ec;border-radius:10px;padding:12px 16px;margin:0 0 16px}
body:where(.vch54):not(.vfhz) .cir2-find, body:where(.vch54):not(.vfhz) .cir2-sort{height:36px;box-sizing:border-box;border:1px solid #cbd2d9;border-radius:8px;padding:0 10px;font-size:13px;background:#fff}
body:where(.vch54):not(.vfhz) .cir2-find{width:240px}
body:where(.vch54):not(.vfhz) .cir2-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin:0 0 16px}
body:where(.vch54):not(.vfhz) .cir2-card{background:#fff;border:1px solid #e1e5ec;border-top:3px solid #1a3a63;border-radius:10px;padding:16px 18px;display:flex;flex-direction:column;gap:12px;box-shadow:0 1px 2px rgba(16,24,40,.05)}
body:where(.vch54):not(.vfhz) .cir2-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
body:where(.vch54):not(.vfhz) .cir2-card-top h2{margin:0;font-size:14px;font-weight:700;line-height:1.35;color:#1f2933}
body:where(.vch54):not(.vfhz) .cir2-kv{display:grid;grid-template-columns:1fr 1fr;gap:10px}
body:where(.vch54):not(.vfhz) .cir2-kv > div{display:flex;flex-direction:column;gap:2px}
body:where(.vch54):not(.vfhz) .cir2-v{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums;color:#1f2933}
body:where(.vch54):not(.vfhz) .cir2-v.sales-pos{color:#2f6b34}
body:where(.vch54):not(.vfhz) .cir2-v.sales-neg{color:#b42318}
body:where(.vch54):not(.vfhz) .cir2-v.sales-zero{color:#52606d}
body:where(.vch54):not(.vfhz) .cir2-coll{display:flex;flex-direction:column;gap:5px}
body:where(.vch54):not(.vfhz) .cir2-coll-r{display:flex;justify-content:space-between;font-size:12px;color:#52606d}
body:where(.vch54):not(.vfhz) .cir2-coll-r b{color:#1f2933}
body:where(.vch54):not(.vfhz) .cir2-links{display:flex;justify-content:space-between;align-items:center;padding-top:10px;border-top:1px solid #eef1f4}
body:where(.vch54):not(.vfhz) .cir2-links .sales-link{margin-left:0}
/* demo client invoice report - hide the older wrapper header + status strip */
body:where(.vch54):not(.vfhz) #clientReportPanel > .inv-panel-head, body:where(.vch54):not(.vfhz) #clientReportPanel > .tile-ribbon{display:none !important}
body:where(.vch54):not(.vfhz) #clientReportPanel{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important}
/* Client statements - view switch button in the blue band */
body:where(.vch51):not(.vfhz) .ContentHeader{position:relative}
body:where(.vch51):not(.vfhz) .sales-band-act{position:absolute;right:24px;top:50%;transform:translateY(-50%);display:flex;gap:8px}
body:where(.vch51):not(.vfhz) .sales-bb{height:40px;box-sizing:border-box;display:inline-flex;align-items:center;padding:0 16px;border-radius:8px;color:#fff !important;font-size:13.5px;font-weight:700;text-decoration:none !important}
body:where(.vch51):not(.vfhz) .sales-bb-go{background:#336633}
body:where(.vch51):not(.vfhz) .sales-bb:hover{background:#0069d9}
body:where(.vch51):not(.vfhz) .sales-bb-back{background:#555555}
/* Activity tracker - Activity Log / Timeline Feed / Order Journey */
body:where(.vch55):not(.vfhz) .act-show .act-checks{display:flex;gap:16px;height:38px;align-items:center}
body:where(.vch55):not(.vfhz) .act-kw{flex:1 1 300px !important}
body:where(.vch55):not(.vfhz) .act-sel{height:38px;box-sizing:border-box;border:1px solid #cbd2d9;border-radius:8px;padding:0 10px;font-size:13px;background:#fff;width:100%}
body:where(.vch55):not(.vfhz) .act-pill{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;white-space:nowrap}
body:where(.vch55):not(.vfhz) .act-est{background:#e0f2f1;color:#0f5e57}
body:where(.vch55):not(.vfhz) .act-inv{background:#dbeafe;color:#1e3a8a}
body:where(.vch55):not(.vfhz) .act-pay{background:#dcfce7;color:#14532d}
body:where(.vch55):not(.vfhz) .act-ship{background:#fde8df;color:#9a3412}
body:where(.vch55):not(.vfhz) .act-mfr{background:#f3e8ff;color:#5b21b6}
body:where(.vch55):not(.vfhz) .act-ord{background:#eef2f7;color:#334155}
body:where(.vch55):not(.vfhz) .act-none{background:#fff4cc;color:#7a5a00}
body:where(.vch55):not(.vfhz) table.act-table tr.act-day td{background:#f3f6fa !important;font-weight:700 !important;font-size:12.5px !important;color:#1a3a63 !important;padding:8px 12px !important;border-bottom:1px solid #dfe5ee !important}
body:where(.vch55):not(.vfhz) .act-dot-est, body:where(.vch55):not(.vfhz) .act-bg-est{background:#0f766e}
body:where(.vch55):not(.vfhz) .act-dot-inv, body:where(.vch55):not(.vfhz) .act-bg-inv{background:#1d4ed8}
body:where(.vch55):not(.vfhz) .act-dot-pay, body:where(.vch55):not(.vfhz) .act-bg-pay{background:#15803d}
body:where(.vch55):not(.vfhz) .act-dot-ship, body:where(.vch55):not(.vfhz) .act-bg-ship{background:#c2410c}
body:where(.vch55):not(.vfhz) .act-dot-mfr, body:where(.vch55):not(.vfhz) .act-bg-mfr{background:#6d28d9}
body:where(.vch55):not(.vfhz) .act-dot-ord, body:where(.vch55):not(.vfhz) .act-bg-ord{background:#64748b}
body:where(.vch55):not(.vfhz) .act-dot-none, body:where(.vch55):not(.vfhz) .act-bg-none{background:#b7791f}
body:where(.vch55):not(.vfhz) .act-fg-est{color:#0f5e57}
body:where(.vch55):not(.vfhz) .act-fg-inv{color:#1e3a8a}
body:where(.vch55):not(.vfhz) .act-fg-pay{color:#14532d}
body:where(.vch55):not(.vfhz) .act-fg-ship{color:#9a3412}
body:where(.vch55):not(.vfhz) .act-fg-mfr{color:#5b21b6}
body:where(.vch55):not(.vfhz) .act-fg-ord{color:#334155}
body:where(.vch55):not(.vfhz) .act-fg-none{color:#7a5a00}
body:where(.vch55):not(.vfhz) .act-wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin:0 0 16px}
body:where(.vch55):not(.vfhz) .act-feed{flex:999 1 640px;min-width:0}
body:where(.vch55):not(.vfhz) .act-side{flex:1 1 320px;max-width:400px;display:flex;flex-direction:column;gap:16px}
body:where(.vch55):not(.vfhz) .act-tl-day{margin:10px 0 6px;font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#1a3a63}
body:where(.vch55):not(.vfhz) .act-tl{display:grid;grid-template-columns:74px 14px 1fr;gap:10px;align-items:start;padding:4px 0}
body:where(.vch55):not(.vfhz) .act-tl-time{font-size:12.5px;color:#52606d;text-align:right;white-space:nowrap}
body:where(.vch55):not(.vfhz) .act-tl-dot{display:inline-block;width:11px;height:11px;border-radius:50%;margin-top:4px;flex:0 0 11px}
body:where(.vch55):not(.vfhz) .act-tl-body{display:flex;flex-direction:column;gap:2px}
body:where(.vch55):not(.vfhz) .act-tl-l1{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;font-size:13.5px}
body:where(.vch55):not(.vfhz) .act-cnt{display:grid;grid-template-columns:1fr 90px 26px;gap:10px;align-items:center;font-size:13px}
body:where(.vch55):not(.vfhz) .act-cnt-n{display:inline-flex;align-items:center;gap:8px}
body:where(.vch55):not(.vfhz) .act-cnt-n .act-tl-dot{margin-top:0}
body:where(.vch55):not(.vfhz) .act-cnt b{text-align:right}
body:where(.vch55):not(.vfhz) .act-h2{margin:0;font-size:15px;font-weight:700;color:#1f2933}
body:where(.vch55):not(.vfhz) .act-warn{background:#fff8e1;border:1px solid #f0d78c;border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:#5c4600}
body:where(.vch55):not(.vfhz) .act-warn .act-h2{font-size:14px;color:#7a5a00}
body:where(.vch55):not(.vfhz) .act-jcount{margin-left:auto;align-self:center;font-weight:700}
body:where(.vch55):not(.vfhz) .act-jnote{margin-top:10px}
body:where(.vch55):not(.vfhz) .act-jlist{display:flex;flex-direction:column;gap:16px;margin:0 0 16px}
body:where(.vch55):not(.vfhz) .act-card{background:#fff;border:1px solid #e1e5ec;border-top:3px solid #1a3a63;border-radius:10px;padding:16px 20px;display:flex;flex-direction:column;gap:14px;box-shadow:0 1px 2px rgba(16,24,40,.05)}
body:where(.vch55):not(.vfhz) .act-card-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:flex-start}
body:where(.vch55):not(.vfhz) .act-who{display:flex;flex-direction:column;gap:3px}
body:where(.vch55):not(.vfhz) .act-who h2{margin:0;font-size:15px;font-weight:700;color:#1f2933}
body:where(.vch55):not(.vfhz) .act-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
body:where(.vch55):not(.vfhz) .act-stage{border-radius:999px;padding:4px 12px;font-size:12px;font-weight:700}
body:where(.vch55):not(.vfhz) .act-stage-client{background:#dbeafe;color:#1e3a8a}
body:where(.vch55):not(.vfhz) .act-stage-mfr{background:#f3e8ff;color:#5b21b6}
body:where(.vch55):not(.vfhz) .act-stage-ship{background:#fde8df;color:#9a3412}
body:where(.vch55):not(.vfhz) .act-stage-pay{background:#dcfce7;color:#14532d}
body:where(.vch55):not(.vfhz) .act-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:0}
body:where(.vch55):not(.vfhz) .act-step{display:flex;flex-direction:column;gap:6px;padding-right:8px;min-width:0}
body:where(.vch55):not(.vfhz) .act-step-mark{display:flex;align-items:center}
body:where(.vch55):not(.vfhz) .act-step-dot{width:18px;height:18px;flex:0 0 18px;border-radius:50%;box-sizing:border-box;border:2px solid #cbd2d9;background:#fff}
body:where(.vch55):not(.vfhz) .act-step-line{flex:1 1 auto;height:3px;background:#e1e5ec}
body:where(.vch55):not(.vfhz) .act-step:last-child .act-step-line{visibility:hidden}
body:where(.vch55):not(.vfhz) .act-step-done .act-step-dot{background:#336633;border-color:#336633}
body:where(.vch55):not(.vfhz) .act-step-implied .act-step-dot{background:#a9c5a9;border-color:#a9c5a9}
body:where(.vch55):not(.vfhz) .act-line-done .act-step-line{background:#336633}
body:where(.vch55):not(.vfhz) .act-step-cur .act-step-dot{border-color:#0f5f9e;border-width:3px}
body:where(.vch55):not(.vfhz) .act-step-name{font-size:12.5px;font-weight:500;color:#7b8794;line-height:1.3}
body:where(.vch55):not(.vfhz) .act-step-done .act-step-name, body:where(.vch55):not(.vfhz) .act-step-implied .act-step-name{color:#1f2933}
body:where(.vch55):not(.vfhz) .act-step-cur .act-step-name{color:#0f5f9e;font-weight:700}
body:where(.vch55):not(.vfhz) .act-step-when{font-size:11.5px;color:#52606d;line-height:1.35}
/* demo activity tracker - hide the older wrapper header + status strip */
body:where(.vch55):not(.vfhz) #activityTrackerPanel > .inv-panel-head, body:where(.vch55):not(.vfhz) #activityTrackerPanel > .tile-ribbon{display:none !important}
body:where(.vch55):not(.vfhz) #activityTrackerPanel{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important}
/* Unified pager - Manage Products style on every paged list */
.vf-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding:12px 0 4px;border-top:1px solid #e4e9ef;font-size:13px;color:#3e4c59;width:100%;box-sizing:border-box}
.vf-pager strong{color:#1f2933;font-weight:700}
.vf-pager-right{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-left:auto}
.vf-pager ul.pagination{margin:0 !important;display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end !important;padding:0}
.vf-pager .page-item .page-link{min-width:32px !important;width:auto !important;height:32px !important;padding:0 8px !important;margin:0 !important;display:inline-flex !important;align-items:center;justify-content:center;border:1px solid #cbd2d9 !important;border-radius:6px !important;background:#fff !important;color:#1f2933 !important;font-size:13px !important;line-height:1 !important;box-sizing:border-box}
.vf-pager .page-item.active .page-link{background:#1a3a63 !important;border-color:#1a3a63 !important;color:#fff !important;font-weight:700 !important}
.vf-pager .page-item:not(.active):not(.disabled) .page-link:hover{border-color:#1a3a63 !important;color:#1a3a63 !important;background:#f1f5f9 !important}
.vf-perpage{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;font-weight:400;color:#3e4c59;white-space:nowrap}
.vf-perpage select{height:32px;padding:0 8px;border:1px solid #cbd2d9;border-radius:6px;background:#fff;color:#1f2933;font-size:13px;cursor:pointer}
.rpt-pager:where(.vcl54):not(.vfhz){display:block !important;padding:0 !important}

/* VF 2026-10-08: top-bar menu button = sidebar-toggle icon (option C); arrow points left when the menu is open, right when collapsed */
header.header.tb-v2 .nav-link.push-menu{padding:0 !important}
header.header.tb-v2 .nav-link.push-menu span,header.header.tb-v2 .nav-link.push-menu:hover span{display:block;width:22px !important;height:22px !important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='3'/%3E%3Cpath d='M9 4v16M16 10l-2 2 2 2'/%3E%3C/svg%3E") center/22px 22px no-repeat !important}
header.header.tb-v2 .nav-link.push-menu:hover span{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231260a8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='3'/%3E%3Cpath d='M9 4v16M16 10l-2 2 2 2'/%3E%3C/svg%3E") !important}
body.sidebar-collapse header.header.tb-v2 .nav-link.push-menu span{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='3'/%3E%3Cpath d='M9 4v16M14 10l2 2-2 2'/%3E%3C/svg%3E") !important}
body.sidebar-collapse header.header.tb-v2 .nav-link.push-menu:hover span{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231260a8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='3'/%3E%3Cpath d='M9 4v16M14 10l2 2-2 2'/%3E%3C/svg%3E") !important}

/* VF 2026-10-09: top bar menu toggle - light grey shade always on, light blue on hover */
header.header.tb-v2 .push-menu{background:#f1f5f9 !important}
header.header.tb-v2 .push-menu:hover,header.header.tb-v2 .push-menu:focus-visible{background:#dbeafe !important}

/* VF 2026-10-14: every "Back" button in the blue band uses the translucent style with a left arrow (matches Email Shipping Docs) */
body .ContentHeader .pe-bb-back,body .ContentHeader .sales-bb-back,body .pe-band-actions .pe-bb-back,body .sales-band-act .sales-bb-back,body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-back:not(:hover){background:rgba(255,255,255,.14) !important;border:1px solid rgba(255,255,255,.35) !important;color:#fff !important;border-radius:6px !important;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;font-size:13px;font-weight:700;line-height:1;cursor:pointer}
body .ContentHeader .pe-bb-back:hover,body .ContentHeader .pe-bb-back:focus,body .ContentHeader .sales-bb-back:hover,body .pe-band-actions .pe-bb-back:hover,body .sales-band-act .sales-bb-back:hover,body:where(.vch43):not(.vfhz) .pe-band-actions .pe-bb.pe-bb-back:hover{background:rgba(255,255,255,.26) !important;border-color:rgba(255,255,255,.35) !important;color:#fff !important}
body .ContentHeader .pe-bb-back::before,body .ContentHeader .sales-bb-back::before,body .pe-band-actions .pe-bb-back::before,body .sales-band-act .sales-bb-back::before{content:"";display:inline-block;width:16px;height:16px;flex-shrink:0;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5'/%3E%3Cpath d='m12 19-7-7 7-7'/%3E%3C/svg%3E") center/16px 16px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5'/%3E%3Cpath d='m12 19-7-7 7-7'/%3E%3C/svg%3E") center/16px 16px no-repeat}

/* VF 2026-10-14: Logistics document pages (Commercial Invoices, Packing Lists, Bill of Ladings, Certificates of Origin, Insurance, Image Files, Other Shipping Docs, Telex Releases) - no navy ribbon on the search card; HS Code pages (ng-hst) keep theirs */
body:where(.vch40):not(.vfhz) .ilr-card.ilr-card,body:where(.vch37):not(.vfhz) .ilr-card.ilr-card{border-top:1px solid #d5dce4 !important}

/* VF 2026-10-14: Logistics document pages - orange square before each card label */
body:where(.vch40):not(.vfhz) .vp-panel .vp-title::before,body:where(.vch37):not(.vfhz) .vp-panel .vp-title::before{content:"";display:inline-block;width:10px;height:10px;background:#b5651d;border-radius:2px;margin-right:10px;vertical-align:middle;position:relative;top:-1px}

/* VF 2026-10-14: admin Manage Invoices - dark green square before the Invoices card label */
#invoiceListPanel .inv-panel-head h3::before{content:"";display:inline-block;width:10px;height:10px;background:#336633;border-radius:2px;margin-right:10px;vertical-align:middle;position:relative;top:-1px}

/* VF 2026-10-14: admin Manage Estimates - blue square before the Estimates card label */
#estimatesListPanel .inv-panel-head h3::before{content:"";display:inline-block;width:10px;height:10px;background:#0062a6;border-radius:2px;margin-right:10px;vertical-align:middle;position:relative;top:-1px}

/* VF 2026-10-14: landed cost lists - invoice search card ribbon dark green; estimate table header blue */
body:where(.vch35):not(.vfhz) .ilr-card.ilr-card{border-top:4px solid #336633 !important}
body:where(.vch56):not(.vfhz) .ilr-card.ilr-card, body:where(.vch57):not(.vfhz) .ilr-card.ilr-card, body:where(.vch58):not(.vfhz):not(:where(.vch59):not(.vfhz)) .ilr-card.ilr-card{border-top:4px solid #0062a6 !important}
body:where(.vch31):not(.vfhz) .ilr-card.ilr-card, body:where(.vch36):not(.vfhz) .ilr-card.ilr-card, body:where(.vch59):not(.vfhz) .ilr-card.ilr-card{border-top:4px solid #336633 !important}

/* VF 2026-10-14: card label squares - estimate pages blue, invoice pages dark green */
body:where(.vch56):not(.vfhz) .vp-panel .vp-title::before, body:where(.vch57):not(.vfhz) .vp-panel .vp-title::before, body:where(.vch58):not(.vfhz):not(:where(.vch59):not(.vfhz)) .vp-panel .vp-title::before{content:"";display:inline-block;width:10px;height:10px;background:#0062a6;border-radius:2px;margin-right:10px;vertical-align:middle;position:relative;top:-1px}
body:where(.vch35):not(.vfhz) .vp-panel .vp-title::before, body:where(.vch31):not(.vfhz) .vp-panel .vp-title::before, body:where(.vch36):not(.vfhz) .vp-panel .vp-title::before, body:where(.vch59):not(.vfhz) .vp-panel .vp-title::before{content:"";display:inline-block;width:10px;height:10px;background:#336633;border-radius:2px;margin-right:10px;vertical-align:middle;position:relative;top:-1px}
/* VF 2026-10-19: profile menu - compass icon for "Navigation guide" (same size and colour as the other menu icons) */
header.header.tb-v2 .user-menu .dropdown-menu .dropdown-item[href*="vfguide"]::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolygon points='16.24 7.76 14.12 14.12 7.76 16.24 9.88 9.88 16.24 7.76'/%3E%3C/svg%3E") !important }

/* VF 2026-10-26: KPI tile icons sit on the right in every portal (admin, sales, client) */
/* 1. list-page / detail-page / metrics tiles (.ilr-kpi with the vfk icon, incl. .sm-kpi) */
body .ilr-kpi.vfk-ic::before{left:auto !important;right:18px !important}
body .ilr-kpi.vfk-ic::after{left:auto !important;right:29px !important}
body .ilr-kpi.vfk-ic > .ilr-kpi-l,body .ilr-kpi.vfk-ic > .ilr-kpi-v,body .ilr-kpi.vfk-ic > .ilr-kpi-s,body .ilr-kpi.vfk-ic > .sm-kpi-progress-track{margin-left:0 !important;margin-right:60px !important}
/* 2. admin dashboard top tiles (.StaticBox) */
body .InfoBoxTop.sb-v2 .StaticBox{grid-template-columns:minmax(0,1fr) 44px !important}
body .InfoBoxTop.sb-v2 .StaticBox::before{grid-column:2 !important}
body .InfoBoxTop.sb-v2 .StaticBox .value h3,body .InfoBoxTop.sb-v2 .StaticBox .value p:first-of-type,body .InfoBoxTop.sb-v2 .StaticBox .value p:nth-of-type(2){grid-column:1 !important}
/* 3. company health tiles */
body .cx-card.cx-kpi{padding-left:18px !important;padding-right:76px !important}
body .cx-card.cx-kpi > span:first-child{left:auto !important;right:18px !important}
/* 4. inventory location tiles */
body .inv-loc-card.vfk-wh{padding-left:16px !important;padding-right:72px !important}
body .inv-loc-card.vfk-wh::before{left:auto !important;right:16px !important}
body .inv-loc-card.vfk-wh::after{left:auto !important;right:27px !important}