/* Lot View CSS — extracted from reference lotview.html */
html, body{ margin:0; padding:0; width:100%; font-family:monospace; overflow-x:auto; }
.searchMenu{ width:100%; padding:10px 16px; background:#D80B00; color:white; font-weight:bold; box-sizing:border-box; }
.topBar{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:40px; }
.barLeft{ flex:1 1 auto; display:flex; align-items:center; }
.barCenter{ flex:0 0 520px; display:flex; justify-content:center; min-width:520px; }
.barRight{ flex:1 1 auto; display:flex; align-items:center; justify-content:flex-end; gap:12px; white-space:nowrap; }
#search{ width:100%; height:40px; border:none; border-radius:6px; padding:0 14px; font-family:Arial; font-size:14px; box-sizing:border-box; background:#f3f3f3; color:#333; }
.searchMenu select{ height:40px; width:180px; min-width:180px; border:none; border-radius:6px; padding:0 10px; font-size:16px; box-sizing:border-box; background:white; color:black; }
.searchMenu label{ display:inline-flex; align-items:center; height:40px; line-height:40px; white-space:nowrap; margin:0; font-size:13px; }
.legendBox{ display:flex; align-items:center; gap:10px; height:40px; padding:0 10px; background:white; color:black; border-radius:6px; white-space:nowrap; font-size:13px; }
.legendSwatch{ width:14px; height:14px; border-radius:3px; border:1px solid #333; display:inline-block; margin-right:4px; }
#TrailerTable{ width:420px !important; max-width:500px !important; position:absolute !important; top:46px !important; left:50% !important; transform:translateX(-50%) !important; z-index:9999; background:#fff; border:1px solid #333; border-radius:6px; box-shadow:0 3px 8px rgba(0,0,0,0.25); overflow:hidden; }
#TrailerTable table{ background:white; }
#TrailerTable th, #TrailerTable td{ font-weight:bold !important; padding:4px 6px !important; }
.EMPTY{ background:#6bc3ff !important; }
.INBOUND{ background:#ffd84d; }
.OUTBOUND{ background:#4caf50; color:white; }
.LIVE{ background:#c56cf0; }
.OOS{ background:repeating-linear-gradient(-45deg,transparent 0 6px,black 6px 12px); }
.REJECT{ background:repeating-linear-gradient(45deg,transparent 0 6px,red 6px 12px); }
.TANDEM{ background:#b4ffff; }
.m-map{ background:#FFF8DC; border:6px solid black; border-radius:10px; padding:10px 8px; width:100%; margin:10px auto; display:flex; flex-direction:column; gap:10px; box-sizing:border-box; }
.m-title{ color:black !important; background:none !important; padding:0 !important; margin:0 0 4px 0 !important; border:none !important; font-weight:bold; font-size:14px; text-align:center; }
.m-topSection{ display:flex; flex-direction:column; align-items:center; gap:6px; width:100%; }
.m-topWrap{ width:100%; overflow-x:hidden; }
.m-topTable{ border-collapse:collapse; border-spacing:0; margin:0 auto; }
.m-topRow td[id]{ width:58px !important; min-width:58px !important; max-width:58px !important; height:150px !important; min-height:150px !important; max-height:150px !important; padding:1px !important; white-space:normal !important; overflow:hidden !important; box-sizing:border-box !important; vertical-align:top !important; text-align:left !important; border:1px solid black !important; font-size:11px !important; font-family:Arial,sans-serif !important; word-wrap:break-word !important; overflow-wrap:break-word !important; }
.m-road{ height:40px; background:#444; border-top:2px dashed white; border-bottom:2px dashed white; display:flex; align-items:center; justify-content:center; color:white; margin-top:-6px; }
.m-lanes{ display:grid; grid-template-columns:1fr 50px 1fr 1fr 50px 1fr; align-items:stretch; width:100%; }
.m-group{ display:flex; flex-direction:column; align-items:center; gap:5px; min-width:170px; }
.m-colTable{ border-collapse:collapse; }
.m-colTable tr{ height:50px !important; }
.m-colTable td{ height:50px !important; min-height:50px !important; max-height:50px !important; width:160px !important; min-width:160px !important; max-width:160px !important; vertical-align:top !important; box-sizing:border-box !important; }
.m-colTable td[id]{ padding:2px 4px !important; margin:0 !important; line-height:13px !important; overflow:hidden !important; text-align:left !important; border:1px solid black !important; white-space:normal !important; position:relative !important; font-size:11px !important; font-family:Arial,sans-serif !important; word-wrap:break-word !important; overflow-wrap:break-word !important; }
.m-roadV{ background:#444; border-left:2px dashed white; border-right:2px dashed white; position:relative; min-height:600px; height:100%; margin-bottom:-6px; }
.m-roadV:before{ content:'↰ ↱'; position:absolute; top:8px; left:50%; transform:translateX(-50%); color:white; }
.m-roadV:after{ content:'↲ ↳'; position:absolute; bottom:8px; left:50%; transform:translateX(-50%); color:white; }
.popover{ text-align:center !important; border:1px solid #bdbdbd !important; border-radius:4px !important; box-shadow:none !important; overflow:visible !important; max-width:340px !important; background:#ffffff !important; }
.popover-body{ padding:0 !important; margin:0 !important; text-align:center !important; font-size:14px !important; background:#ffffff !important; }
.m-sweep-gap{ height:40px; margin:10px 0 6px 0; background:repeating-linear-gradient(45deg,#cfcfcf,#cfcfcf 6px,#dddddd 6px,#dddddd 12px); border-top:2px dashed #666; border-bottom:2px dashed #666; }
.m-topRow td.EMPTY, .m-colTable td.EMPTY{ background:#F0E2B6 !important; border:1px solid #666 !important; color:#000 !important; }
td.EMPTY[data-bs-toggle='popover'], td.EMPTY[data-bs-toggle='popover'] > div{ background:#6bc3ff !important; color:#000 !important; }
td.EMPTY[data-bs-toggle='popover'] > div > div:first-child{ background:white !important; color:#000 !important; }
td.EMPTY[clickable='true'], td.EMPTY[clickable='true'] > div, td.EMPTY[clickable='true'] > div > div{ background:#F0E2B6 !important; color:#000 !important; }
.dock-carrier-stack{ position:absolute; top:45%; left:50%; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:11px; font-family:Arial,sans-serif; font-weight:bold; line-height:1.2; text-align:center; width:95%; overflow:visible; }
.dock-carrier-stack div{ white-space:normal; word-wrap:break-word; overflow-wrap:break-word; max-width:100%; }
.m-topRow .dock-carrier-stack{ font-size:11px; }
.m-topRow .dock-carrier-stack div{ white-space:normal; word-wrap:break-word; }
/* Override inline styles from FileMaker td HTML — wrap text, keep original size */
.m-topRow td[id] div div{ white-space:normal !important; overflow:visible !important; word-wrap:break-word !important; overflow-wrap:break-word !important; }
.m-colTable td[id] div div{ white-space:normal !important; overflow:visible !important; word-wrap:break-word !important; overflow-wrap:break-word !important; }
.dock-days-bottom{ position:absolute; bottom:5px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; font-size:11px; font-family:Arial,sans-serif; font-weight:bold; line-height:1.1; white-space:nowrap; }
.m-topRow td.west-only.EMPTY { background:#6bc3ff !important; }
.m-topRow td.west-only.INBOUND { background:#ffd84d !important; }
.m-topRow td.west-only.OUTBOUND { background:#4caf50 !important; color:white !important; }
.m-topRow td.west-only.LIVE { background:#c56cf0 !important; }
.m-topRow td.west-only.OOS { background:repeating-linear-gradient(-45deg,transparent 0 6px,black 6px 12px) !important; }