/* Shared workspace branding and controls. Login rules below stay inside #login. */
.core-logo{position:relative;display:block;width:142px;height:48px;overflow:hidden;flex:none}
.core-logo img,#core-topbar .core-logo img{position:absolute;width:118%;max-width:none;height:auto;left:-9%;top:4px;transform:translateY(-34.5%)}
.workspace-label{font-size:12px!important;letter-spacing:.7px!important;color:#667182!important}
#mode-control[hidden]{display:none!important}
#mode-control{font-size:10px;min-width:150px;margin:0}
#workspace-mode{font-size:11px;margin:3px 0 0;padding:8px;min-height:0}
input:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #7bacee;outline-offset:3px}

body.login-state{background:#f6f6f6;border-top:3px solid #ed001b}
body.login-state #core-topbar{display:none}
#login.portal-login{--login-red:#ed001b;--login-ink:#282d32;--login-paper:#f6f6f6;display:block;max-width:none;min-height:calc(100svh - 3px);margin:0;padding:0;border:0;border-radius:0;background:var(--login-paper);color:var(--login-ink);font:16px Arial,Helvetica,sans-serif}
#login.portal-login[hidden]{display:none!important}
#login a{color:inherit;text-decoration:none}
#login button,#login input{font:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#login a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#login button:focus-visible,#login a:focus-visible,#login input:focus-visible{outline:3px solid #286dd4;outline-offset:4px}
#login p,#login h1{margin:0}
#login .skip-link{position:fixed;top:-80px;left:20px;padding:14px;background:#fff;z-index:20}
#login .skip-link:focus{top:10px}
#login .login-header{height:101px;padding:0 5.5vw;display:flex;justify-content:space-between;align-items:center;gap:20px;position:relative;z-index:3;background:var(--login-paper);border:0;white-space:normal}
#login .login-brand{display:block;line-height:0;flex:none}
#login .login-brand img{width:194px;height:auto;display:block}
#login .login-header-links{display:flex;align-items:center;gap:24px;font-size:14px}
#login .login-header-links a{font-weight:700;display:flex;gap:10px;align-items:center}
#login .login-header-links a:hover{color:var(--login-red)}
#login .login-header-links a span{font-size:20px}
#login .login-access-label{flex:none;font-size:11px;font-weight:400;letter-spacing:.12em;color:#747d86;padding-right:24px;border-right:1px solid #cbd0d4}
#login .login-page{position:relative;min-height:calc(100svh - 164px);display:flex;align-items:center;isolation:isolate;overflow:hidden}
#login .signin-panel{position:relative;z-index:2;width:42%;padding:38px 0 44px 5.5vw;pointer-events:none}
#login .signin-inner{max-width:390px;pointer-events:auto}
#login .eyebrow{font-size:11px;font-weight:800;letter-spacing:.14em;display:flex;align-items:center;gap:10px;margin-bottom:22px;line-height:1.4;color:var(--login-ink);text-transform:uppercase}
#login .eyebrow>span{width:22px;height:3px;flex:none;background:var(--login-red)}
#login h1{font-weight:900;font-size:clamp(48px,4.4vw,72px);line-height:.98;letter-spacing:-.035em;color:var(--login-red);margin-left:-3px}
#login .intro{font-size:16px;line-height:1.55;margin-top:20px;color:#5e6874}
#login form{margin-top:27px}
#login .field{margin-bottom:17px}
#login .field label{display:block;font-size:14px;line-height:normal;font-weight:700;margin:0 0 9px;color:var(--login-ink)}
#login .field input{display:block;background:#fff;border:1px solid #cbd1d8;border-radius:0;height:47px;padding:0 14px;width:100%;min-width:0;margin:0;color:var(--login-ink);font-size:16px;box-shadow:none;transition:border-color .18s}
#login .field input::placeholder{color:#929aa4}
#login .field input:hover{border-color:#8d96a2}
#login .field input:focus{border-color:var(--login-ink)}
#login .password-field{position:relative}
#login .password-field input{padding-right:47px}
#login .reveal-password{position:absolute;right:0;top:0;bottom:0;width:46px;min-height:44px;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#697581;display:grid;place-items:center;cursor:pointer}
#login .reveal-password:hover{color:var(--login-red)}
#login .signin-button{padding:0;border:0;border-radius:0;background:transparent;display:flex;align-items:center;gap:14px;width:100%;margin:25px 0 0;font-size:14px;font-weight:800;color:var(--login-ink);text-align:left;letter-spacing:.012em;line-height:1.35;cursor:pointer}
#login .signin-button:disabled{opacity:.55;cursor:wait}
#login .arrow-box{background:var(--login-red);width:45px;height:45px;color:#fff;font-size:28px;font-weight:400;display:grid;place-items:center;flex:none;transition:background .18s,transform .18s}
#login .signin-button:hover{color:var(--login-red)}
#login .signin-button:hover .arrow-box{background:#c70017;transform:translateX(2px)}
#login .access-help{font-size:12px;color:#707b86;line-height:1.5;margin-top:22px}
#login .access-help a{display:inline-block;padding:2px 0 0;color:#444e58;font-size:12px;font-weight:600;text-align:left}
#login .access-help a:hover{color:var(--login-red)}
#login .portal-switch{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #d9dce0;padding-top:17px;margin-top:24px;font-size:12px}
#login .portal-switch>span{color:#7a838d}
#login .portal-switch a{font-weight:700}
#login .portal-switch a:hover{color:var(--login-red)}
#login .portal-switch a span{margin-left:8px}
#login .freight-visual{position:absolute;right:0;top:50%;transform:translateY(-50%);width:64%;aspect-ratio:1.43;max-height:100%;overflow:hidden;z-index:1;clip-path:polygon(18% 0,100% 0,100% 100%,0 100%);pointer-events:none}
#login .freight-visual img{position:absolute;right:0;top:0;display:block;height:100%;width:auto;max-width:none}
#login .login-footer{min-height:60px;padding:15px 5.5vw;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:11px;color:#818891;border-top:1px solid #e1e3e5;background:var(--login-paper);position:relative;z-index:3}
#login .login-footer>a{display:flex;gap:9px;color:#626d79;font-size:12px}
#login .login-footer>a:hover{color:var(--login-red)}
#login .login-footer p{font-size:10px;font-weight:700;letter-spacing:.15em;color:#939aa2}
.login-state #status{max-width:calc(100% - 36px)}
@media(min-width:1700px){
 #login .login-header{height:113px}
 #login .login-brand img{width:220px}
 #login .login-page{min-height:calc(100svh - 176px)}
 #login .signin-inner{max-width:450px}
 #login .signin-panel{padding-top:44px;padding-bottom:48px}
 #login .eyebrow{font-size:12px}
 #login h1{font-size:76px}
 #login .intro{font-size:18px}
 #login .field input{height:52px}
 #login .field{margin-bottom:21px}
 #login .signin-button{font-size:16px}
 #login .arrow-box{width:49px;height:49px}
 #login .access-help,#login .access-help a,#login .portal-switch{font-size:14px}
}
@media(max-width:1150px){
 #login .login-header{padding-inline:4vw}
 #login .signin-panel{padding-left:4vw;width:44%}
 #login .signin-inner{max-width:350px}
 #login .eyebrow{font-size:10px;letter-spacing:.1em}
 #login .freight-visual{width:62%;aspect-ratio:1.35}
 #login .login-footer{padding-inline:4vw}
 #login .login-footer p{display:none}
}
@media(max-width:1080px){.workspace-label{display:none}#core-topbar{gap:12px;padding-inline:18px}#core-search{max-width:360px}}
@media(max-width:940px){
 #login .login-header{height:87px;padding:0 25px}
 #login .login-brand img{width:175px}
 #login .login-access-label{display:none}
 #login .login-header-links a{font-size:13px}
 #login .login-page{min-height:calc(100svh - 150px);overflow:visible}
 #login .signin-panel{width:56%;padding:38px 25px 44px}
 #login .signin-inner{max-width:360px}
 #login .freight-visual{width:48%;height:100%;aspect-ratio:auto;max-height:none;clip-path:polygon(20% 0,100% 0,100% 100%,0 100%)}
 #login .freight-visual img{right:-32%;height:100%;width:auto;opacity:.92}
 #login .login-footer{padding-inline:25px}
 #login h1{font-size:54.4px}
 #login .intro{font-size:16px}
}
@media(max-width:760px){#mode-control{order:5;flex-basis:100%;max-width:none;display:flex;gap:12px;align-items:center}#workspace-mode{flex:1}#core-topbar:has(#mode-control:not([hidden])){height:auto;min-height:80px;flex-wrap:wrap}body:has(#mode-control:not([hidden])) #core-sidebar{top:120px}}
@media(max-width:680px){
 #login .login-header{height:83px;padding:0 23px}
 #login .login-brand img{width:161px}
 #login .login-header-links a{font-size:11px;gap:5px}
 #login .login-header-links a span{font-size:16px}
 #login .login-page{min-height:0;display:block;overflow:hidden}
 #login .signin-panel{width:100%;padding:32px 27px 36px}
 #login .signin-inner{max-width:430px;margin:0 auto}
 #login .eyebrow{font-size:10px;letter-spacing:.12em;margin-bottom:21px}
 #login h1{font-size:clamp(40px,14vw,54.4px)}
 #login .intro{margin-top:18px;line-height:1.5}
 #login form{margin-top:26px}
 #login .field input{height:50px}
 #login .signin-button{font-size:14px;margin-top:24px}
 #login .access-help,#login .access-help a,#login .portal-switch{font-size:13px}
 #login .freight-visual{position:relative;top:auto;right:auto;transform:none;width:100%;height:auto;aspect-ratio:1.48;max-height:none;clip-path:polygon(18% 0,100% 0,100% 100%,0 100%);margin:0 0 0 auto}
 #login .freight-visual img{height:100%;right:0;opacity:1}
 #login .login-footer{flex-wrap:wrap;min-height:85px;gap:12px;padding:20px 27px;font-size:10px}
 #login .login-footer>a{font-size:11px}
}
@media(max-width:380px){#login .login-header{padding-inline:20px;gap:15px}#login .login-brand img{width:140px}#login .login-header-links{max-width:120px}#login .portal-switch{gap:10px}}
@media(prefers-reduced-motion:reduce){#login *,#login *::before,#login *::after{transition:none!important;scroll-behavior:auto!important}}

/* Load lookup remains available in the phone header. */
@media(max-width:760px){
 #core-topbar{height:auto;min-height:66px;flex-wrap:wrap}
 #core-search:not([hidden]){display:flex;order:6;flex:1 0 100%;max-width:none;margin:0}
 #core-search input{font-size:14px;min-height:42px}
 #core-search button{min-height:42px}
 body #core-sidebar,body:has(#mode-control:not([hidden])) #core-sidebar{top:var(--core-header-height,132px)}
}
/* The portal uses the complete VEXO wordmark, without the old raster crop. */
.core-logo img[src$="portal-wordmark.svg"],#core-topbar .core-logo img[src$="portal-wordmark.svg"]{position:static;width:100%;max-width:100%;height:100%!important;left:auto;top:auto;transform:none;object-fit:contain;object-position:center}
