/* Let It Ride Logistics — visual layer only. */
:root{--brand-red:#e50919;--brand-red-dark:#b90714;--brand-blue:#25262b;--brand-blue-dark:#101114;--brand-blue-gray:#888b94;--brand-cyan:#e50919;--navy:#18191d;--ink:#202126;--ink-soft:#696b74;--paper:#fff;--off-white:#f4f4f6;--line:#dedee3;--shadow:0 14px 36px #17181c12}
body{font-family:Inter,Arial,Helvetica,sans-serif;background:var(--off-white)}
a:hover{color:var(--brand-red)}
.btn{border-radius:8px;font-weight:700;letter-spacing:.01em;transition:background .15s,box-shadow .15s,transform .15s}
.btn-primary{background:linear-gradient(135deg,#f01424,#cf0716);border-color:transparent;box-shadow:0 5px 14px #e509191a;color:#fff}
.btn-primary:hover{background:linear-gradient(135deg,#d80b1b,#b90714);box-shadow:0 7px 20px #e509192b;color:#fff}
.btn-secondary{background:#fff;border-color:#c8c9cf;color:#303138}
.btn-secondary:hover{background:#24252a;border-color:#24252a;color:#fff}
.btn-ghost:hover{background:#eeeeF1;color:#24252a}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid #e5091980;outline-offset:3px}
input:focus,select:focus,textarea:focus{border-color:#e50919!important;box-shadow:0 0 0 3px #e5091912!important}
.form,.page-card,.auth-card{border-color:#e1e1e6;border-radius:12px;box-shadow:0 6px 24px #1c1c2510}
.page-card-title,.portal-page-title{letter-spacing:-.4px;color:#23242a}
.page-card-header{border-bottom-color:#ededf0}
.portal-topbar{background:#fff;border-bottom:1px solid #e0e0e5;box-shadow:0 2px 12px #17181c04}
.portal-sidebar{background:linear-gradient(165deg,#25262b 0%,#131417 70%);border-right:1px solid #303137}
.sidebar-brand{background:#111215;display:flex;justify-content:center;align-items:center;padding:20px 22px;border-bottom:3px solid #e50919;min-height:160px}
.sidebar-logo{width:166px;max-height:140px;object-fit:contain;filter:drop-shadow(0 4px 10px #0005)}
.sidebar-nav{padding:20px 12px;gap:6px}
.sidebar-link{border:1px solid transparent;border-radius:7px;font-size:13px;padding:12px}
.sidebar-link.active{background:linear-gradient(100deg,#e50919,#bf0715);border-color:#ff32414d;box-shadow:0 5px 16px #0002;color:#fff}
.sidebar-link:hover{background:#ffffff0d;color:#fff}
.sidebar-link.active:hover{background:#cf0a19}
.sidebar-user-avatar{background:#e50919}
.sidebar-logout:hover{background:#e509191c;color:#ff8490}
.portal-table thead th{background:#f7f7f9;color:#6b6c76;font-size:10px;letter-spacing:.07em;border-bottom-color:#e4e4e9}
.portal-table tbody tr:hover{background:#fafafb}
.portal-table td{border-bottom-color:#ededf1}
.auth-page,.login-page{background:radial-gradient(ellipse at 10% 90%,#e5091908,transparent 55%),linear-gradient(130deg,#f6f6f8,#e9e9ee);min-height:100vh}
.auth-nav,.login-nav{background:#141518;border-bottom:3px solid #e50919}
.auth-nav-inner,.login-nav-inner{justify-content:center;padding:14px 0;min-height:146px}
.auth-nav .logo,.login-nav .logo{width:170px;max-height:132px;object-fit:contain;filter:drop-shadow(0 4px 10px #0005)}
.auth-card,.login-card{border-top:3px solid #e50919;box-shadow:0 18px 50px #20212612;background:#fff}
.auth-card h1,.login-card h1{color:#24252b;font-weight:800;letter-spacing:-.8px}
.eyebrow{color:#d80b1b;letter-spacing:.12em}
.auth-footer,.login-footer{color:#777983;font-size:11px}
.load-hero{background:linear-gradient(125deg,#25262b,#111215);border:1px solid #33343b;border-left:4px solid #e50919;box-shadow:0 10px 30px #17181c16}
.load-hero-route{color:#fff}.load-hero-ref{color:#c2c3cc}.load-hero-distance{color:#c1c2ca}.load-hero-rate{color:#ff5461}
.load-hero .pill-pending{background:#ffffff12;color:#ececf1;border:1px solid #ffffff20}
.load-info-table th{color:#777983}.load-info-table td{color:#292a31}
.carrier-list-page{color:#24252b;background:#f4f4f6}
.cl-header{background:linear-gradient(110deg,#1b1c20,#101114);border-bottom:3px solid #e50919}
.cl-header-inner{min-height:150px}.cl-logo{width:175px;max-height:135px;object-fit:contain;filter:drop-shadow(0 5px 12px #0005)}
.cl-header-label{color:#c0c1ca;letter-spacing:.08em;text-transform:uppercase;font-size:10px}
.cl-header-label>span{background:#f01424;box-shadow:0 0 0 4px #e509191a}
.cl-hero{background:linear-gradient(125deg,#2c2d33 0%,#17181d 57%,#101114 100%);border:1px solid #33343d;border-radius:16px;box-shadow:0 18px 48px #14151b20}
.cl-hero:before{border-color:#ffffff0c;box-shadow:0 0 0 70px #ffffff03,0 0 0 140px #ffffff03}
.cl-hero:after{content:"";position:absolute;left:0;top:0;width:110px;height:4px;background:#e50919;transform:skewX(-35deg);transform-origin:left;pointer-events:none}
.cl-eyebrow{color:#c6c7ce;font-size:9px;letter-spacing:.16em}
.cl-intro h1{color:#fff}.cl-lead{color:#f1f1f5}.cl-description{color:#b3b4c0}
.cl-route{color:#858792}.cl-route>span{color:#b0b1be}
.cl-download-card{border:1px solid #dedee5;border-top:4px solid #e50919;border-radius:12px;box-shadow:0 18px 40px #0003}
.cl-file-icon{background:#fff0f1;color:#e50919;border:1px solid #ffd8dc}
.cl-download-card h2{color:#24252b}.cl-card-eyebrow{color:#7c7e88}
.cl-download-card>p:not(.cl-card-eyebrow):not(.cl-download-hint){color:#71737e}
.cl-ready{background:#f4f4f6;border-color:#e2e2e7;color:#62646e}
.cl-updated{border-color:#e8e8ee;color:#7a7c86}.cl-updated>span{color:#8b8d98}.cl-updated time{color:#303138}
.cl-download{background:linear-gradient(110deg,#ef1323,#d10716);box-shadow:0 6px 15px #e509191a;border-radius:7px}
.cl-download:hover{background:linear-gradient(110deg,#d70a1a,#b90714);box-shadow:0 8px 20px #e5091926}
.cl-download:focus-visible{outline-color:#e5091980}
.cl-next-steps h2{color:#303138}.cl-next-steps p{color:#777984}.cl-step-number{color:#dc101f;font-weight:700}
.cl-notice{border-color:#dddde4;border-left:3px solid #e50919;background:#fff;border-radius:7px}
.cl-notice h2{color:#303138}.cl-notice p{color:#757780}.cl-notice-icon{color:#e50919;border-color:#e50919}
.cl-footer{background:#17181c;border-color:#303138}.cl-footer>.cl-container{color:#b3b4be}
.cl-unavailable{border-top:3px solid #e50919}.cl-unavailable h1{color:#24252b}.cl-unavailable .cl-eyebrow{color:#d80b1b}
@media(max-width:680px){.cl-header-inner{min-height:126px}.cl-logo{width:144px;max-height:110px}.cl-header-label{font-size:8px;max-width:88px;text-align:right}.auth-nav-inner,.login-nav-inner{min-height:125px}.auth-nav .logo,.login-nav .logo{width:145px;max-height:110px}.cl-hero{padding-top:30px}}
@media(prefers-reduced-motion:reduce){.btn{transition:none}}
