/* Cubic Ship: carries the approved front's look onto the retained operational
   pages (ship, track, contact, store pages, account, language homes...).
   Loaded last on those pages by tools/apply-approved-front.cjs. Colors, type and
   shape only: no markup, copy, translation or script changes.
   One ink on one paper; orange is the route. No radius, no shadow, no gradient. */

@font-face{font-family:"Overpass";src:url("/redesign/cubic/assets/fonts/overpass-latin-var.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Overpass Mono";src:url("/redesign/cubic/assets/fonts/overpass-mono-latin-var.woff2") format("woff2");font-weight:400 600;font-style:normal;font-display:swap}

:root{
  --cx-paper:#f5f4ef;
  --cx-ink:#0b1630;
  --cx-ink-60:#5c6372;
  --cx-ink-40:#8b909a;
  --cx-ink-20:#c6c7c8;
  --cx-ink-10:#e4e3df;
  --cx-route:#e8661c;
  --cx-route-text:#b0480d;
  --cx-font:"Overpass",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --cx-mono:"Overpass Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  /* old dark homepage / track page tokens, flipped to paper and ink */
  --navy:var(--cx-paper);
  --navy-light:var(--cx-paper);
  --navy-mid:var(--cx-ink-10);
  --navy-soft:var(--cx-ink-10);
  --surface:var(--cx-paper);
  --surface-light:var(--cx-ink-10);
  --orange:var(--cx-route);
  --orange-light:var(--cx-route);
  --orange-dark:var(--cx-route-text);
  --green:var(--cx-ink);
  --green-light:var(--cx-ink);
  --blue:var(--cx-ink);
  --blue-accent:var(--cx-ink);
  --blue-glow:var(--cx-ink);
  --text:var(--cx-ink);
  --text-secondary:var(--cx-ink-60);
  --text-dim:var(--cx-ink-60);
  --muted:var(--cx-ink-60);
  --soft:var(--cx-paper);
  --line:var(--cx-ink-20);
  --bg:var(--cx-paper);
  --ink:var(--cx-ink);
  --border:var(--cx-ink-20);
  --border-hover:var(--cx-ink);
  --glow-orange:transparent;
  --glow-green:transparent;
  color-scheme:light;
}

/* ---------- base ---------- */
html,body,body.cs-page{background:var(--cx-paper)!important;color:var(--cx-ink)}
body{font-family:var(--cx-font);-webkit-font-smoothing:antialiased}
body :is(h1,h2,h3,h4,p,li,label,legend,summary,dt,dd,input,select,textarea,button,a,span,small,strong,td,th){font-family:inherit}
body *:not(.jdlo-credit):not(.jdlo-credit *){border-radius:0!important;box-shadow:none!important;text-shadow:none!important}
body *:not(.jdlo-credit *)::before,body *:not(.jdlo-credit *)::after{border-radius:0!important;box-shadow:none!important}
body::after{display:none!important}
::selection{background:var(--cx-route);color:var(--cx-ink)}
body :focus-visible{outline:3px solid var(--cx-route)!important;outline-offset:3px}
body.cs-page a,body .page a,body main a{color:var(--cx-ink);text-decoration-color:var(--cx-ink-40);text-underline-offset:5px}
body.cs-page a:hover,body main a:hover{text-decoration-color:var(--cx-route)}
body :is(.auth-shell .intro,.page) a[href]{color:var(--cx-ink)}

/* ---------- header ---------- */
body .cs-header{background:var(--cx-paper)!important;color:var(--cx-ink);border-bottom:1px solid var(--cx-ink-20);font:600 16px/1.5 var(--cx-font);min-height:76px}
body .cs-header{max-width:none;margin:0;padding:14px max(20px,calc((100vw - 1120px) / 2));justify-content:space-between}
body .cs-header .cs-brand{color:var(--cx-ink)!important;font-size:22px;font-weight:800;letter-spacing:-.01em;gap:0}
body .cs-header .cs-brand span{color:var(--cx-ink);margin-inline-start:.26em}
body .cs-header .cs-brand img{width:48px;height:48px;background:#03102d;margin-inline-end:13px}
body.cs-page .cs-header .cs-navigation a,body .cs-header .cs-navigation a{color:var(--cx-ink);text-decoration:none;font-weight:600}
body .cs-header .cs-navigation a:hover,body .cs-header .cs-navigation a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--cx-route);text-decoration-thickness:2px;text-underline-offset:8px}
body .cs-header .cs-toggle{background:transparent;color:var(--cx-ink);border:1px solid var(--cx-ink);font-weight:600}
body .cs-header .cs-language,body .cs-header .cs-language-icon{color:var(--cx-ink)}
body .cs-language select{background-color:var(--cx-paper);color:var(--cx-ink);border:1px solid var(--cx-ink-20);font-family:var(--cx-mono);font-size:15px}
body .cs-language .cs-language-status{background:var(--cx-paper);color:var(--cx-ink);border:1px solid var(--cx-ink-20)}

/* ---------- footer ---------- */
body .cs-footer{max-width:none;margin:0;background:var(--cx-paper);color:var(--cx-ink-60);border-top:2px solid var(--cx-ink);font:400 15px/1.6 var(--cx-font)}
body.cs-page .cs-footer a,body .cs-footer a{color:var(--cx-ink);text-decoration-color:var(--cx-ink-40)}

/* ---------- type ---------- */
body.cs-page h1,body .page h1,body main h1{font-weight:900;letter-spacing:-.03em;line-height:.98;color:var(--cx-ink)}
body.cs-page .cs-main h1{font-size:clamp(40px,5.6vw,84px);margin:10px 0 22px}
body.cs-page h2,body.cs-page h3,body main h2,body main h3{font-weight:800;letter-spacing:-.015em;color:var(--cx-ink)}
body.cs-page .cs-main h2{font-size:clamp(24px,2.2vw,30px);line-height:1.1}
body :is(.cs-kicker,.eyebrow,.section-eyebrow,.discount-kicker){font-family:var(--cx-mono);color:var(--cx-route-text);font-weight:600;letter-spacing:.06em}
body :is(.cs-lead,.cs-muted,.cs-card p,.lead,.hero-sub,.section-desc){color:var(--cx-ink-60)}
body .cs-lead,body .lead{color:var(--cx-ink)}

/* ---------- surfaces ---------- */
body :is(.cs-card,.card,.track-card,.quick-card,.panel,.form-card,.hero-panel,.status-panel,.choice-card,.nearby-picker,.step-card,.value-card,.freight-item,.service-card,.extras-note,.systems-panel,.quote-handoff,.location-card,.dhl-badge,.dhl-location,.contact-stack a,.contact-stack span,.mini-proof span,.business-print-list span,.support-strip,.success-box,.cs-sms-consent){background:transparent!important;border:1px solid var(--cx-ink-20)!important;color:var(--cx-ink)}
body :is(.choice-card,.quick-card,.location-card):hover{border-color:var(--cx-ink)!important}
body .choice-card strong{color:var(--cx-ink)}
body :is(.cs-notice,.notice,.alert){background:var(--cx-ink-10)!important;border-left:3px solid var(--cx-route)!important;color:var(--cx-ink)}
html[dir="rtl"] body :is(.cs-notice,.notice){border-left:0!important;border-right:3px solid var(--cx-route)!important}
body :is(.cs-tag,.service-tag,.dhl-pill,.rating-pill,.secure-chip){background:var(--cx-ink-10)!important;color:var(--cx-ink)!important;border:0!important}
body .cs-page details,body.cs-page details{border-bottom-color:var(--cx-ink-20)}
body :is(.cs-error,.error,.field-error-text){color:#9c1c1c}

/* ---------- buttons ---------- */
body :is(.cs-btn,.btn,.btn-secondary,.cs-help-trigger,.nearby-picker button,.language-choice button,.lang-toggle button){background:transparent!important;color:var(--cx-ink)!important;border:1px solid var(--cx-ink)!important;font-family:var(--cx-font);font-weight:600}
body :is(.cs-primary,.btn-primary,.primary,.nearby-zip-row button,.cs-help-submit,.cs-help-optout,.language-choice button[aria-pressed="true"],.lang-toggle button.active){background:var(--cx-ink)!important;color:var(--cx-paper)!important;border-color:var(--cx-ink)!important}
body.cs-page .cs-btn.cs-primary,body.cs-page a.cs-primary,body.cs-page a.btn-primary,body a.primary{color:var(--cx-paper)!important;text-decoration:none}
body :is(.cs-btn,.btn,.cs-primary,.btn-primary):hover{border-color:var(--cx-route)!important}
body :is(.cs-primary,.btn-primary,.primary):hover{background:#18264a!important}

/* ---------- forms ---------- */
body :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){background-color:#fff;color:var(--cx-ink);border:1px solid var(--cx-ink-40)!important;font-family:var(--cx-font)}
body :is(input,select,textarea):focus{border-color:var(--cx-ink)!important}
body input[type="checkbox"],body input[type="radio"]{accent-color:var(--cx-ink)}
body .choice{border-color:var(--cx-ink-20)!important}
body .choice:has(input:checked),body .nearby-picker .nearby-card[aria-pressed="true"]{border:1px solid var(--cx-ink)!important;background:var(--cx-ink-10)!important}
body .nearby-card .nearby-choice{color:var(--cx-route-text)}
body .cs-help{background:var(--cx-paper)!important;border:1px solid var(--cx-ink)!important;color:var(--cx-ink)}
body .cs-help-close{background:transparent!important;color:var(--cx-ink)}
body .cs-help-result{background:var(--cx-ink-10)!important}
body .cs-help.cs-help-inline{border:0!important;background:transparent!important}

/* ---------- old dark homepage (language homes) and track page ---------- */
body .hero-media{opacity:.9}
body .hero-media::after{background:linear-gradient(90deg,var(--cx-paper) 0%,rgba(245,244,239,.94) 46%,rgba(245,244,239,.55) 72%,rgba(245,244,239,.2) 100%)!important}
@media (max-width:820px){body .hero-media::after{background:rgba(245,244,239,.9)!important}}
body .hero::before,body .page::before,body .hero-routes,body .hero-globe{display:none!important}
body .hero h1,body .hero h1 span,body .hero h1 span.line2{background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--cx-ink)!important;font-weight:900;letter-spacing:-.035em}
body .hero h1 span.line2{color:var(--cx-route)!important}
body .hero-partner{background:transparent!important;border:1px solid var(--cx-ink-20)!important;color:var(--cx-ink)!important}
body :is(.how-bg,.about-bg,.extras-bg,.systems-bg,.reviews-bg,.discount-strip,.business-print-panel,.freight-item,.freight-item.featured){background:var(--cx-paper)!important;color:var(--cx-ink)}
body :is(.how-bg,.about-bg,.extras-bg,.systems-bg,.reviews-bg){border-top:1px solid var(--cx-ink-20)}
body :is(.section-heading,.section-header h2,.how-title h2)::after{background:var(--cx-route)!important}
body .section-eyebrow::before{background:var(--cx-route)!important}
body .service-card::after{background:var(--cx-route)!important}
body .metric-value,body .review-score strong{color:var(--cx-ink)!important;-webkit-text-fill-color:currentColor}
body .nav-wordmark .c-orange,body .nav-wordmark .c-green,body .c-orange,body .c-green,body .brand .orange,body .brand .green,body .orange,body .green{color:var(--cx-ink)!important}
body .nav,body .topbar,body .nav.scrolled,body .nav-links.open{background:var(--cx-paper)!important;color:var(--cx-ink);border-bottom:1px solid var(--cx-ink-20);-webkit-backdrop-filter:none;backdrop-filter:none}
body .nav-links a{color:var(--cx-ink)!important}
body footer:not(.cs-footer):not(.site-footer){background:var(--cx-paper);color:var(--cx-ink-60);border-top:2px solid var(--cx-ink)}

/* ---------- help widget ---------- */
body .chat-toggle,body .chat-links a:not(.secondary),body .chat-foot a.primary{background:var(--cx-ink)!important;color:var(--cx-paper)!important;border:1px solid var(--cx-ink)!important}
body :is(.chat-panel,.seller-offer-panel){background:var(--cx-paper)!important;border:1px solid var(--cx-ink)!important;color:var(--cx-ink)}
body .chat-head{background:var(--cx-ink)!important;color:var(--cx-paper)!important}
body .chat-head :is(strong,span,button){color:var(--cx-paper)!important}
body :is(.chat-action,.chat-links a.secondary){background:transparent!important;color:var(--cx-ink)!important;border:1px solid var(--cx-ink-20)!important}
body .chat-action:hover{border-color:var(--cx-ink)!important}
body .chat-message.bot{background:var(--cx-ink-10)!important;color:var(--cx-ink)!important}
body .chat-message.user{background:var(--cx-ink)!important;color:var(--cx-paper)!important}

/* ---------- page-specific dark leftovers ---------- */
body :is(.intro,.story p,.values p){color:var(--cx-ink-60)}
body .action{background:var(--cx-ink)!important;color:var(--cx-paper)!important}
body .auth-shell .intro{background:transparent!important;color:var(--cx-ink);border-inline-end:1px solid var(--cx-ink-20)}
body .auth-shell .intro :is(h1,h2,strong){color:var(--cx-ink)!important}
body .auth-shell .intro :is(p,span){color:var(--cx-ink-60)!important}
body .intro-offer{background:var(--cx-ink-10)!important;border:0!important}
body .hero-panel{color:var(--cx-ink)!important}
body .hero-panel p{color:var(--cx-ink-60)!important}
body .hero-panel::after{display:none!important}
html[dir="rtl"] body .hero-media::after{background:linear-gradient(270deg,var(--cx-paper) 0%,rgba(245,244,239,.94) 46%,rgba(245,244,239,.55) 72%,rgba(245,244,239,.2) 100%)!important}
@media (max-width:820px){html[dir="rtl"] body .hero-media::after{background:rgba(245,244,239,.9)!important}}
body :is(.home-steps p,.home-help p,.home-footer p,.home-footer-bottom){color:var(--cx-ink-60)!important}
body .home-footer a{color:var(--cx-ink)!important}
body .proof-number{color:var(--cx-ink)!important}
