/* Approved light SNML direction. Scoped to the header and cargo exchange;
   account, payment and product screens keep their existing behavior. */
.site-header { background:#fff; color:#102840; border-bottom:1px solid #e0e8ef; }
.site-header .desktop-nav a,.site-header .text-button { color:#102840; }
.site-header .desktop-nav a:hover { color:#008e9a; }
.site-header .brand-copy b { font-size:24px; letter-spacing:-1px; }
.site-header .brand-copy small { color:#52677d; }
.site-header .button-dark { background:#ff652a; color:#fff; }
.site-header .notification-button { color:#102840; border-color:#d9e3ec; }
.site-header .menu-button span { background:#102840; }
.site-header.menu-open .desktop-nav { background:#fff; }
.exchange {
  --board-ink:#102840; --board-muted:#52677d; --board-page:#f2f6fa;
  --board-panel:#fff; --board-soft:#eaf4f6; --board-line:#e0e8ef;
  --board-violet:#007c89; --board-magenta:#007c89; --board-green:#18785c;
  --board-blue:#009eaa; --board-rail:#fff; --board-row:#fff;
  --board-contact:#fff; --board-row-border:#e0e8ef;
  padding:36px max(24px,calc((100vw - 1280px)/2)) 48px;
}
.exchange .section-heading { align-items:center; gap:24px; }
.exchange #exchange-title { color:#102840; font-size:clamp(25px,3vw,38px); line-height:1.2; letter-spacing:-1px; }
.exchange .kicker { color:#52677d; }
.exchange .tab span { background:#dceef1; }
.exchange .search-panel { background:transparent; }
.exchange .route-group { background:#fff; padding:10px 12px 12px; border-radius:8px; }
.exchange .route-group legend,.exchange .search-panel label { font-size:12px; color:#52677d; }
.exchange .search-panel select,.exchange .advanced-search-grid input { background:#fff; color:#102840; font-size:13px; min-height:44px; }
.exchange .search-button { background:#ff652a; color:#fff; font-size:14px; padding-inline:24px; }
.exchange .advanced-search { border:0; padding:10px 0 0; }
.exchange .advanced-search summary { font-size:12px; }
.exchange .results-head { padding:24px 0 14px; font-size:12px; flex-wrap:wrap; }
.exchange .results-head>b { font-size:17px; }
.exchange .publish-shortcut { border-color:#ff652a; color:#c4410d; background:#fff; }
.exchange .cargo-table-head { display:none; }
.exchange .loads { gap:10px; }
.exchange .cargo-row {
  grid-template-columns:32px minmax(200px,1.6fr) minmax(160px,1.1fr) minmax(100px,.7fr) minmax(110px,.8fr) minmax(160px,1.2fr);
  grid-template-areas:"service route description transport date contact" "service countries rate transport date contact";
  border-radius:10px; min-height:0; padding:14px 10px; align-items:center;
}
.exchange .cargo-row:hover { border-color:#9cbfc5; box-shadow:0 4px 16px #1028400a; }
.exchange .cargo-row>div { min-height:0; padding:4px 12px; border:0; min-width:0; }
.exchange .cargo-service-strip { grid-area:service; grid-row:auto; padding:0; }
.exchange .cargo-route { grid-area:route; border:0; }
.exchange .cargo-route>span { display:none; }
.exchange .cargo-route>div { display:flex; flex-direction:row; align-items:center; flex-wrap:wrap; gap:8px; }
.exchange .cargo-route b { font-size:14px; white-space:normal; overflow-wrap:anywhere; }
.exchange .cargo-route i { width:30px; height:2px; border:0; background:#009eaa; position:relative; flex:none; }
.exchange .cargo-route i::before,.exchange .cargo-route i::after { content:""; position:absolute; width:6px; height:6px; border-radius:50%; background:#009eaa; top:-2px; }
.exchange .cargo-route i::after { right:0; }
.exchange .cargo-details-button { flex-basis:100%; margin:0; font-size:12px; padding:6px 0; color:#007c89; }
.exchange .cargo-countries { grid-area:countries; flex-direction:row; gap:6px; }
.exchange .cargo-countries b { color:#52677d; font-size:11px; font-weight:500; }
.exchange .cargo-description { grid-area:description; border:0!important; }
.exchange .cargo-description p { font-size:13px; -webkit-line-clamp:2; margin-bottom:6px; }
.exchange .cargo-description span { font-size:11px; background:#f2f6fa; }
.exchange .cargo-transport { grid-area:transport; border-left:1px solid #e0e8ef; }
.exchange .cargo-date { grid-area:date; border-left:1px solid #e0e8ef; }
.exchange .cargo-date b,.exchange .cargo-transport b { font-size:13px; }
.exchange .cargo-date small,.exchange .cargo-transport small,.exchange .cargo-rate small { font-size:11px; }
.exchange .cargo-rate { grid-area:rate; flex-direction:row; flex-wrap:wrap; align-items:baseline; gap:6px; border:0!important; }
.exchange .cargo-contact { grid-area:contact; border-left:1px solid #e0e8ef; border-top:0!important; }
.exchange .cargo-contact b,.exchange .cargo-contact>span { font-size:12px; }
.exchange .unlock-contact { font-size:12px; padding:9px 12px; color:#c4410d; border-color:#ff652a; }
.exchange button:focus-visible,.site-header a:focus-visible { outline:3px solid #007c89; outline-offset:3px; }
@media(max-width:1100px) {
  .exchange .route-search-form { grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr)!important; }
  .exchange .cargo-row { grid-template-columns:28px minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr); grid-template-areas:"service route transport date" "service countries description description" "service rate contact contact"; }
  .exchange .cargo-contact { border-left:0; }
}
@media(max-width:700px) {
  .exchange { padding:24px 14px 32px; }
  .exchange .section-heading { display:block; }
  .exchange .route-search-form { grid-template-columns:1fr!important; }
  .exchange .cargo-row { padding:12px 4px; grid-template-columns:28px minmax(0,1fr) minmax(0,1fr); grid-template-areas:"service route route" "service countries countries" "service transport date" "service description description" "service rate rate" "service contact contact"; gap:6px 0; }
  .exchange .cargo-row>div { padding:4px 8px; }
  .exchange .cargo-route b { font-size:14px; }
  .exchange .cargo-transport,.exchange .cargo-date { border:0; }
  .exchange .cargo-contact { padding-top:10px; border-top:1px solid #e0e8ef!important; }
  .exchange .results-head>b { flex-basis:100%; }
  .exchange .search-button { width:100%; }
}