/* Shipping: Pallet planning and Routes (public/shipplan.js) */
.sp-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:4px 0 14px}
.sp-sum>div{background:#fff;border:1px solid #d6e2e4;border-radius:10px;padding:10px 14px}.sp-sum b{display:block;font-size:26px;color:#123f4a}.sp-sum span{font-size:12.5px;color:#5c757c}
.sp-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}.sp-filters input,.sp-filters select{border:1px solid #cbdadd;border-radius:8px;padding:8px 10px;font:inherit;font-size:13.5px;background:#fff}.sp-filters input{flex:1;min-width:200px}
.sp-stop{background:#fff;border:1px solid #d6e2e4;border-radius:12px;padding:12px 14px;margin:0 0 12px}
.sp-stop>header{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:8px}.sp-stop>header strong{font-size:16px;color:#173f4a}.sp-stop>header small{display:block;color:#5c757c;font-size:12.5px}
.sp-lines{width:100%;border-collapse:collapse;font-size:13px}.sp-lines th{text-align:left;font-size:11px;text-transform:uppercase;color:#6a7e83;padding:4px 6px;border-bottom:1px solid #e3ecee}
.sp-lines td{padding:6px;border-bottom:1px solid #eef3f4;vertical-align:top}.sp-lines td small{display:block;color:#6a7e83;font-size:11.5px}.sp-lines .num{text-align:right;white-space:nowrap}
.sp-src{display:inline-block;font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px}.sp-src.fill{background:#e3f1f5;color:#1d4f60}.sp-src.shelf{background:#fff1d6;color:#7a5410}
.sp-pallets{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px;margin-top:10px}
.sp-pallet{border:1px solid #cfe1e5;border-left:5px solid #9bb0b5;border-radius:10px;padding:8px 10px;font-size:13px;background:#fbfdfd;display:flex;flex-direction:column;gap:4px}
.sp-pallet.sp-complete{border-left-color:#2e8b57}.sp-pallet.sp-loaded{border-left-color:#1286a0}
.sp-pallet-head{display:flex;justify-content:space-between;align-items:center}.sp-pallet ul{margin:0;padding-left:16px}.sp-pallet li small{color:#6a7e83}
.sp-levels{color:#5c757c}.sp-warn{color:#a3352b;font-weight:600}
.sp-pallet-foot{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:2px;font-size:12px;color:#5c757c}.sp-pallet-foot .crm-secondary{padding:3px 9px;font-size:12px;margin-left:4px}
.sp-fill{position:relative;height:16px;background:#eef3f4;border-radius:999px;overflow:hidden}.sp-fill i{position:absolute;inset:0 auto 0 0;background:#8cc7d4}.sp-fill span{position:relative;font-size:11px;padding-left:8px;line-height:16px;color:#173f4a;font-weight:600}
.sp-fill.over i{background:#e9a58b}
.ops-pill.ok{background:#dff3ea;color:#21613f}.ops-pill.warn{background:#fbe3df;color:#a3352b}
.sp-preview{margin-top:10px}.sp-preview p{font-size:13px;color:#33555e}
.sp-edit input{width:80px;text-align:right;border:1px solid #cbdadd;border-radius:6px;padding:5px 6px;font:inherit}
/* Route planner */
.sp-route-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;background:#fff;border:1px solid #d6e2e4;border-radius:12px;padding:12px 14px;margin-bottom:12px}
.sp-route-top label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:#5c757c;text-transform:uppercase}.sp-route-top .wide{grid-column:span 2}
.sp-route-top input,.sp-route-top select{border:1px solid #cbdadd;border-radius:8px;padding:8px 10px;font:inherit;font-size:14px;text-transform:none;font-weight:400;color:#173f4a}
.sp-route-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:12px;align-items:start}
.sp-col{background:#fff;border:1px solid #d6e2e4;border-radius:12px;padding:12px}.sp-col h3{margin:0 0 10px;font-size:15px;color:#173f4a}
.sp-truck{position:sticky;top:10px}
.sp-rstop{border:1px solid #e3ecee;border-radius:10px;padding:8px 10px;margin-bottom:8px}.sp-rstop.due{border-color:#9fd0dc;background:#f4fbfc}
.sp-rstop-head{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.sp-rstop-head small{display:block;color:#5c757c;font-size:12px}.sp-rstop-head .crm-primary{padding:5px 10px;font-size:12.5px;white-space:nowrap}
.sp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.sp-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px}.sp-chip .ops-pill{font-size:10.5px;padding:1px 6px}
.sp-chipbtn{border:1px dashed #9bc4cf;background:#fff;border-radius:8px;padding:4px 7px;font:inherit;cursor:pointer;color:#173f4a}.sp-chipbtn:hover{border-style:solid;border-color:#1286a0}
.sp-chipwrap{display:inline-flex;align-items:center;gap:2px;border:1px solid #cfe1e5;border-radius:8px;padding:3px 4px 3px 7px;background:#fbfdfd}
.sp-x{border:0;background:none;color:#8aa0a6;font-size:16px;cursor:pointer;padding:0 3px}
.sp-cap{margin:4px 0 8px}.sp-cap span{font-size:13px;font-weight:700;color:#173f4a}.sp-cap>div{height:10px;background:#eef3f4;border-radius:999px;overflow:hidden;margin-top:3px}.sp-cap i{display:block;height:100%;background:#1286a0}
.sp-cap.over span{color:#a3352b}.sp-cap.over i{background:#d9573b}
.sp-tstop{display:flex;gap:10px;align-items:flex-start;border-top:1px solid #eef3f4;padding:8px 0}
.sp-no{flex:0 0 28px;height:28px;border-radius:50%;background:#123f4a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px}
.sp-tstop-body{flex:1;min-width:0}.sp-tstop-body small{display:block;color:#5c757c;font-size:12px}
.sp-move{display:flex;flex-direction:column;gap:2px}.sp-move button{border:1px solid #cbdadd;background:#fff;border-radius:6px;width:28px;height:24px;cursor:pointer;color:#33555e}.sp-move button:disabled{opacity:.35;cursor:default}
.sp-empty{padding:20px 0;text-align:center}
@media(max-width:1000px){.sp-route-grid{grid-template-columns:1fr}.sp-truck{position:static}}
.sp-pbody{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px;align-items:end}
.sp-stack{display:flex;flex-direction:column;gap:2px;font-size:10px;font-weight:700}.sp-stack em{font-style:normal;color:#a3352b;font-size:10.5px}
.sp-lvl{border-radius:3px;padding:2px 4px;min-height:16px;display:flex;align-items:center;color:#173f4a;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.sp-lvl span{overflow:hidden;text-overflow:ellipsis}
.sp-lvl.t0{background:#eceff1}.sp-lvl.t1{background:#e3f1f5}.sp-lvl.t2{background:#d6ecdf}.sp-lvl.t3{background:#cfe3ea}.sp-lvl.t4{background:#fde8c8}.sp-lvl.t5{background:#f6d3c6}
.sp-base{height:6px;background:repeating-linear-gradient(90deg,#b08a5a 0 14px,transparent 14px 20px);border-radius:1px}
.sp-items{list-style:none;margin:0;padding:0;font-size:12px}.sp-items li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:5px;padding:2px 0;border-bottom:1px dashed #e3ecee}
.sp-items li b{color:#123f4a}.sp-items li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-items li small{color:#6a7e83}
.sp-pallets{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.sp-pallets{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}
.sp-pbody{grid-template-columns:104px minmax(0,1fr);align-items:start}
.sp-stack{justify-content:flex-end;min-height:110px;border-left:2px solid #dbe4e6;border-right:2px solid #dbe4e6;padding:0 3px;border-radius:2px}
.sp-lvl{min-height:0;align-items:center}
/* Route planner with the map in the middle */
.sp-route-grid{grid-template-columns:minmax(260px,.9fr) minmax(0,1.4fr) minmax(260px,.9fr)}
.sp-mapcol{display:flex;flex-direction:column;padding:0;overflow:hidden;position:sticky;top:10px;height:calc(100vh - 200px);min-height:460px}
.sp-mapcol>header{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid #e3ecee}
.sp-mapcol>header strong{display:block;font-size:14px;color:#173f4a}.sp-mapcol>header small{font-size:12px;color:#1286a0}
.sp-mapcol>header .crm-secondary{padding:5px 10px;font-size:12.5px}
.sp-map{flex:1;min-height:360px}
.sp-leg{color:#1286a0!important}
.rb-pin-open.sp-pin-due span{background:#e0a21a}
.rb-pin-open span{font-size:10px}
@media(max-width:1300px){.sp-route-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.sp-mapcol{grid-column:1/-1;order:-1;position:static;height:440px}}
.sp-map .rb-pin-open span{width:22px;height:22px;margin:2px;font-size:11px}
