/* Fleet case: the View Matches screen, rebuilt in HTML as a product mockup (Loadsmart's own colours). */
.vm-host .vm{position:absolute;left:0;top:0;transform-origin:0 0;border-radius:4px;box-shadow:0 0 0 1px var(--line)}
.vm{position:relative;width:960px;height:600px;overflow:hidden;background:#F4F5F6;font-family:Roboto,"Helvetica Neue",Arial,sans-serif;color:#1F2326;-webkit-font-smoothing:antialiased}
.vm *{box-sizing:border-box}
.vm-side{position:absolute;left:0;top:0;bottom:0;width:136px;background:#23272B;padding:18px 0}
.vm-logo{display:flex;align-items:center;gap:6px;padding:0 14px;color:#3CC35F;font:700 15px/1 Roboto,sans-serif;letter-spacing:-.02em}
.vm-logo svg{flex:none}
.vm-nav{margin-top:30px;display:flex;flex-direction:column}
.vm-nav span{font:500 11px/30px Roboto,sans-serif;color:#E9ECEE;padding-left:14px;border-left:2px solid transparent}
.vm-nav span.on{color:#3CC35F;background:#1B1F22;border-left-color:#3CC35F}
.vm-top{position:absolute;left:136px;right:0;top:0;height:44px;background:#FFFFFF;border-bottom:1px solid #E6E8EA;display:flex;align-items:center;justify-content:flex-end;gap:16px;padding-right:22px}
.vm-top svg{display:block}
.vm-user{font:500 11px/1 Roboto,sans-serif;color:#1F2326;margin-left:8px}
.vm-main{position:absolute;left:136px;right:0;top:44px;bottom:0;padding:22px 56px 0}
.vm-crumb{display:flex;align-items:center;gap:8px;font:500 14px/20px Roboto,sans-serif}
.vm-crumb .back{width:16px;height:16px;border-radius:50%;background:#C9CDD1;display:grid;place-items:center}
.vm-crumb a{color:#2FAE52}
.vm-crumb b{font-weight:500;color:#1F2326}
.vm-card{background:#FFFFFF;border-radius:3px;box-shadow:0 1px 2px rgba(20,24,28,.08),0 0 0 1px #ECEEF0}
.vm-steps{margin-top:18px;height:62px;display:flex;align-items:center;padding:0 40px;position:relative}
.vm-step{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:1}
.vm-step .dot{width:18px;height:18px;border-radius:50%;border:1.5px solid #A3A9AE;background:#FFFFFF;display:grid;place-items:center;font:500 9px/1 Roboto,sans-serif;color:#7C8389}
.vm-step .nm{font:500 9px/1 Roboto,sans-serif;letter-spacing:.04em;color:#8A9196}
.vm-step.cur .dot{border-color:#2FAE52;color:#2FAE52}
.vm-step.cur .nm{color:#1F2326}
.vm-step.done .dot{border-color:#2FAE52;background:#2FAE52;color:#FFFFFF}
.vm-step.done .nm{color:#1F2326}
.vm-track{position:absolute;left:calc(40px + (100% - 80px)/10);right:calc(40px + (100% - 80px)/10);top:21px;height:1px;background:#D5D9DC}
.vm-track i{position:absolute;left:0;top:0;height:1px;width:100%;background:#2FAE52;transform-origin:0 0;transform:scaleX(0)}
.vm-panel-wrap{position:relative;margin-top:12px;height:384px}
.vm-panel{position:absolute;inset:0;padding:18px 20px 0;opacity:0}
.vm-panel.on{opacity:1}
.vm-h{font:500 13px/18px Roboto,sans-serif;color:#1F2326}
.vm-sub{font:400 11px/16px Roboto,sans-serif;color:#6E767C;margin-top:4px}
.vm-foot{position:absolute;left:20px;right:20px;bottom:16px;display:flex;justify-content:flex-end;align-items:center;gap:16px}
.vm-btn{height:30px;padding:0 18px;border-radius:3px;background:#2FAE52;color:#FFFFFF;font:500 11px/30px Roboto,sans-serif;letter-spacing:.04em;text-transform:uppercase}
.vm-btn.ghost{background:transparent;color:#6E767C;padding:0 4px}
.vm-btn.dim{background:#BFE6C9}
.vm-tabs{display:flex;gap:28px;margin:14px -20px 0;padding:0 20px;border-bottom:1px solid #E6E8EA}
.vm-tabs span{font:500 9.5px/30px Roboto,sans-serif;letter-spacing:.04em;color:#7C8389;text-transform:uppercase}
.vm-tabs span.on{color:#1F2326;box-shadow:inset 0 -2px #2FAE52}
.vm-imp{display:flex;gap:24px;margin-top:18px}
.vm-drop{position:relative;width:330px;height:150px;border:1px dashed #B9BEC2;border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font:400 11px/1 Roboto,sans-serif;color:#4B5257}
.vm-drop small{font:400 8.5px/1 Roboto,sans-serif;letter-spacing:.06em;color:#8A9196}
.vm-file{position:absolute;inset:-1px;border-radius:3px;background:#F2FAF4;border:1px solid #9FD9AF;display:flex;align-items:center;gap:12px;padding:0 18px;opacity:0}
.vm-file .ic{width:34px;height:40px;border-radius:3px;background:#FFFFFF;border:1px solid #CFE9D6;display:grid;place-items:center;font:700 8px/1 Roboto,sans-serif;color:#2FAE52}
.vm-file b{display:block;font:500 12px/16px Roboto,sans-serif;color:#1F2326}
.vm-file span{font:400 10.5px/16px Roboto,sans-serif;color:#4B5257}
.vm-file .ok{margin-left:auto;width:18px;height:18px;border-radius:50%;background:#2FAE52;display:grid;place-items:center}
.vm-req{font:400 9.5px/15px Roboto,sans-serif;color:#4B5257;max-width:300px}
.vm-req b{display:block;font:500 9.5px/15px Roboto,sans-serif;color:#1F2326;margin-bottom:2px}
.vm-req ul{margin:0 0 10px;padding-left:12px}
.vm-req .tpl{display:inline-block;border:1px solid #1F2326;border-radius:2px;padding:2px 6px;font:500 8.5px/12px Roboto,sans-serif;letter-spacing:.04em}
.vm-table{margin-top:14px;width:100%;border-collapse:collapse;font:400 10.5px/1 Roboto,sans-serif;color:#1F2326}
.vm-table th{font:500 8.5px/1 Roboto,sans-serif;letter-spacing:.05em;text-transform:uppercase;color:#7C8389;text-align:left;padding:0 8px 9px;border-bottom:1px solid #E6E8EA}
.vm-table td{height:34px;padding:0 8px;border-bottom:1px solid #F0F1F2;white-space:nowrap}
.vm-table td.n{font-variant-numeric:tabular-nums}
.vm-table .ln{font-weight:500}
.vm-table .ln i{font-style:normal;color:#7C8389;padding:0 4px}
.vm-table .pill{display:inline-block;padding:3px 7px;border-radius:9px;background:#E8F6EC;color:#23853F;font:500 9px/1 Roboto,sans-serif}
.vm-table .pill.none{background:#F0F1F2;color:#7C8389}
.vm-table .cb{width:12px;height:12px;border-radius:2px;background:#2FAE52;display:grid;place-items:center}
.vm-table .cb.off{background:#FFFFFF;box-shadow:inset 0 0 0 1px #B9BEC2}
.vm-table tr.row{opacity:1}
.vm-form{margin-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:18px 32px}
.vm-field label{display:block;font:500 9px/1 Roboto,sans-serif;letter-spacing:.05em;text-transform:uppercase;color:#7C8389;margin-bottom:8px}
.vm-chips{display:flex;gap:6px}
.vm-chip{height:26px;padding:0 12px;border-radius:13px;border:1px solid #C9CDD1;font:500 10px/24px Roboto,sans-serif;color:#4B5257;background:#FFFFFF}
.vm-chip.on{border-color:#2FAE52;background:#E8F6EC;color:#23853F}
.vm-radio{display:flex;flex-direction:column;gap:8px}
.vm-radio span{display:flex;align-items:center;gap:8px;font:400 11px/1 Roboto,sans-serif;color:#1F2326}
.vm-radio span i{width:13px;height:13px;border-radius:50%;border:1.5px solid #A3A9AE;display:grid;place-items:center}
.vm-radio span i::after{content:"";width:6px;height:6px;border-radius:50%;background:#2FAE52;opacity:0}
.vm-radio span.on i{border-color:#2FAE52}
.vm-radio span.on i::after{opacity:1}
.vm-radio em{font-style:normal;color:#7C8389;font-size:10px;margin-left:2px}
.vm-input{height:30px;border:1px solid #C9CDD1;border-radius:3px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;font:400 11px/1 Roboto,sans-serif;color:#1F2326;max-width:220px}
.vm-input span{color:#7C8389}
.vm-conn{margin-top:16px;display:flex;flex-direction:column;gap:10px;max-width:560px}
.vm-opt{display:flex;align-items:center;gap:12px;height:54px;padding:0 14px;border:1px solid #E1E4E6;border-radius:3px}
.vm-opt.on{border-color:#2FAE52;background:#F6FBF7}
.vm-opt .ic{width:28px;height:28px;border-radius:50%;background:#F0F1F2;display:grid;place-items:center}
.vm-opt.on .ic{background:#E1F3E6}
.vm-opt b{display:block;font:500 11.5px/16px Roboto,sans-serif}
.vm-opt span{font:400 10px/14px Roboto,sans-serif;color:#6E767C}
.vm-opt .tg{margin-left:auto;width:28px;height:16px;border-radius:8px;background:#C9CDD1;position:relative}
.vm-opt .tg::after{content:"";position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:#FFFFFF;transition:none}
.vm-opt.on .tg{background:#2FAE52}
.vm-opt.on .tg::after{left:14px}
.vm-seg{display:inline-flex;border:1px solid #C9CDD1;border-radius:3px;overflow:hidden;margin-top:2px}
.vm-seg span{font:500 10px/26px Roboto,sans-serif;padding:0 14px;color:#4B5257}
.vm-seg span.on{background:#E8F6EC;color:#23853F}
.vm-done{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:58px;gap:10px}
.vm-done .big{width:52px;height:52px;border-radius:50%;background:#2FAE52;display:grid;place-items:center;margin-bottom:8px}
.vm-done h4{margin:0;font:500 16px/22px Roboto,sans-serif;color:#1F2326}
.vm-done p{margin:0;font:400 11.5px/18px Roboto,sans-serif;color:#4B5257;max-width:340px}
.vm-done .vm-btn{margin-top:14px}
