/* SMART Plus+ — Field Map Command Room V5. Only the route/GPS workspace is restyled. */
.content:has(.cmd-workspace){max-width:none;padding:19px 19px 28px;background:#f2f7f5}
.cmd-workspace{--cmd-ink:#133a31;--cmd-dark:#092e29;--cmd-muted:#748e87;--cmd-line:#dcece4;--cmd-shadow:0 12px 32px #063e2e0e;color:var(--cmd-ink);font-family:'IBM Plex Sans Thai',sans-serif}
.cmd-workspace *{box-sizing:border-box}
.cmd-workspace button,.cmd-workspace input,.cmd-workspace select,.cmd-workspace textarea{font-family:inherit}
.cmd-titlebar{display:flex;gap:18px;align-items:center;justify-content:space-between;margin:2px 0 17px}
.cmd-titleblock .cmd-kicker,.cmd-kicker{font-size:9px;font-weight:800;color:#198f71;letter-spacing:2px}
.cmd-titleblock h2{font:600 clamp(22px,2.1vw,30px) Kanit,sans-serif;color:#0a4535;margin:4px 0 0;display:flex;align-items:center;gap:10px}
.cmd-titleblock h2 svg{color:#109c75}
.cmd-titleblock p{color:#6a867d;margin:2px 0 0;font-size:11px}.cmd-separator{color:#b3ccc1;margin:0 8px}
.cmd-title-actions{display:flex;gap:10px;align-items:center}.cmd-source-tag{border:1px solid #b6e7d0;color:#157f5a;background:#def8eb;border-radius:999px;font-size:10px;padding:9px 12px;white-space:nowrap}
.cmd-source-tag i,.cmd-map-label i,.cmd-map-data .cmd-live-dot{display:inline-block;background:#12d9a0;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #10d59b22;margin-right:7px}
.cmd-button{border:1px solid #c6e3d5;color:#155742;background:white;border-radius:11px;padding:10px 13px;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;font:600 11px 'IBM Plex Sans Thai';transition:.15s background,.15s transform}
.cmd-button:hover{background:#e7f7ef}.cmd-button:active{transform:translateY(1px)}.cmd-button:disabled{opacity:.4;cursor:wait}
.cmd-button-primary{border-color:#087958;background:#0a765a;color:white;box-shadow:0 4px 12px #177f6622}.cmd-button-primary:hover{background:#06684d}
.cmd-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:15px}
.cmd-metric{background:white;border:1px solid #e0ece5;border-radius:17px;padding:14px 17px;box-shadow:var(--cmd-shadow);position:relative;overflow:hidden;min-height:103px}
.cmd-metric:before{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:#00b887}
.cmd-metric span{font-size:11px;color:#6f8980;font-weight:600;display:block}.cmd-metric strong{display:block;color:#0c4537;font:650 31px Kanit,sans-serif;line-height:1.35;margin-top:3px}.cmd-metric small{display:block;color:#8a9e95;font-size:10px}
.cmd-metric.blue:before{background:#3889c7}.cmd-metric.blue strong{color:#246e9f}.cmd-metric.amber:before{background:#e6a147}.cmd-metric.amber strong{color:#b97822}.cmd-metric.purple:before{background:#947ac9}.cmd-metric.purple strong{color:#7660ad}
.cmd-main-grid{display:grid;grid-template-columns:minmax(190px,225px) minmax(0,1fr) minmax(238px,270px);gap:13px;align-items:start}
.cmd-side{display:grid;gap:13px;min-width:0}.cmd-panel{background:#fff;border:1px solid var(--cmd-line);box-shadow:var(--cmd-shadow);border-radius:18px;overflow:hidden;min-width:0;padding:16px 15px}.cmd-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}.cmd-panel-head>div>span{font-size:8px;font-weight:800;letter-spacing:1.4px;color:#83a296;display:block}.cmd-panel-head h3{display:flex;align-items:center;gap:7px;margin:3px 0 0;font:600 14px Kanit,sans-serif;color:#143f32}.cmd-panel-head h3 svg{color:#118c6c}.cmd-counter{background:#e3f6ea;color:#167d5d;font:700 12px Kanit;border-radius:8px;padding:4px 9px}
.cmd-waypoints{display:grid;gap:6px}.cmd-loading,.cmd-empty{color:#7b9288;font-size:11px;line-height:1.75;margin:5px 0}.cmd-waypoint{display:flex;align-items:center;gap:9px;text-align:left;min-height:62px;background:#f8fbf9;border:1px solid #e4eee8;border-radius:12px;padding:9px 9px;cursor:pointer;color:#245647;width:100%;transition:background .12s}
.cmd-waypoint:hover{background:#e8f7ed;border-color:#b4e2c7}.cmd-waypoint svg{flex:none;color:#9cbbab}.cmd-station-number{display:grid;place-items:center;flex:none;border-radius:50%;width:31px;height:31px;color:#fff;background:#229f85;font:700 11px Kanit;box-shadow:0 0 0 4px #16987912}.cmd-station-number.first{background:#15966a}.cmd-station-number.last{background:#d67d37}.cmd-waypoint-meta{min-width:0;flex:1}.cmd-waypoint-meta b{display:block;font-size:11px;color:#254b40}.cmd-waypoint-meta small{font-size:9px;color:#829d90;display:block;line-height:1.45}
.cmd-layer-controls{display:grid;gap:4px}.cmd-layer-controls label{display:flex;align-items:center;gap:9px;font-size:11px;cursor:pointer;padding:7px 4px;color:#3c6356}.cmd-layer-controls label input{accent-color:#0b9f76}.cmd-line-preview{display:inline-block;height:0;width:27px;border-top:3px solid #12b986;border-radius:1px}.cmd-line-preview.car{border-color:#ebaa3f}.cmd-line-preview.spur{border-color:#71a7df;border-top-style:dashed}.cmd-line-preview.danger{border-color:#ed6570;border-top-style:dotted}
.cmd-panel-note{border-top:1px solid #e9f1ec;padding-top:9px;margin:13px 0 0;color:#91a49b;font-size:9px;line-height:1.7}
.cmd-map-stage{min-width:0;background:#092f2b;border:1px solid #0c4c3d;border-radius:20px;box-shadow:0 14px 33px #062f2e22;overflow:hidden;color:white}
.cmd-map-header{background:linear-gradient(110deg,#073c35,#0b5849);height:64px;display:flex;align-items:center;justify-content:space-between;padding:10px 14px 10px 19px;gap:12px}
.cmd-map-label{display:block;color:#5df0b4;font-size:8px;letter-spacing:1.5px;font-weight:800}.cmd-map-header strong{display:block;font:550 16px Kanit;color:white;margin-top:2px}.cmd-view-switch{display:flex;background:#082e2b;align-items:center;gap:3px;padding:4px;border-radius:10px;border:1px solid #ffffff1d}.cmd-view-switch button{border:0;background:transparent;color:#c0dbd1;padding:6px 10px;border-radius:7px;cursor:pointer;font:600 10px 'IBM Plex Sans Thai'}.cmd-view-switch button.selected{background:#17a17a;color:white}
.cmd-map-frame{position:relative;height:min(74vh,820px);min-height:510px;background:#172d29;overflow:hidden}
#commandMap{height:100%;width:100%;z-index:1;background:#1d352f}.cmd-map-frame .leaflet-control-container{font-size:11px}.cmd-map-frame .leaflet-control-zoom a{background:#0f4d43;color:white;border-color:#1a6b53}.cmd-map-frame .leaflet-control-zoom a:hover{background:#168d69}.cmd-map-frame .leaflet-control-scale-line{background:#ffffffd9;color:#12362b;border-color:#184c37}
.cmd-map-corner{position:absolute;left:13px;top:14px;z-index:480;display:flex;flex-direction:column;align-items:flex-start;gap:6px;pointer-events:none}.cmd-map-data{display:inline-flex;align-items:center;background:#073931e8;border:1px solid #32846b;color:#eafff5;border-radius:20px;padding:7px 11px;font:600 10px 'IBM Plex Sans Thai'}.cmd-map-corner>span:last-child{padding:5px 9px;background:#05261cce;color:#d2eddb;border-radius:6px;font-size:9px}
.cmd-map-tools{position:absolute;right:13px;top:14px;z-index:490;display:grid;gap:7px}.cmd-map-tools button{display:grid;place-items:center;border:1px solid #3e896d;cursor:pointer;background:#073d32ee;color:white;width:36px;height:36px;border-radius:9px;box-shadow:0 3px 10px #04191244}.cmd-map-tools button:hover{background:#117b61}
.cmd-map-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-top:1px solid #20624e;font-size:9px;color:#adcfc2}.cmd-legends{display:flex;flex-wrap:wrap;gap:13px}.cmd-legends span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.cmd-legend-dot{width:18px;height:3px;border-radius:3px;background:#0ff1a3;display:inline-block}.cmd-legend-dot.car{background:#ffba51}.cmd-legend-dot.spur{background:#84bdff}.cmd-legend-dot.warning{width:8px;height:8px;background:#f45c6a;border-radius:50%}
.cmd-gps-actions{padding:10px 15px;border-top:1px solid #2d6854;display:flex;gap:10px;justify-content:space-between;align-items:center}.cmd-gps-actions span{color:#b8dcd0;font-size:10px;display:flex;gap:5px;align-items:center}.cmd-gps-actions>div{display:flex;gap:7px;flex:none}
.cmd-weather-row{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #e9f2ec;padding:10px 0}.cmd-weather-row:last-child{border-bottom:0}.cmd-weather-row b{color:#254e40;font-size:12px;display:block}.cmd-weather-row small{display:block;color:#82968b;font-size:9px;margin-top:2px}.cmd-weather-row strong{color:#16795e;font:650 22px Kanit;white-space:nowrap}.cmd-weather-row strong.cmd-weather-watch{color:#c48523}.cmd-weather-unavailable{color:#a2b7ac}.cmd-icon-btn{appearance:none;display:grid;place-items:center;width:30px;height:30px;border-radius:8px;border:1px solid #d5e7da;background:#f4faf6;color:#368063;cursor:pointer;font-size:18px}
.cmd-report-intro{background:#edf6f0;border:1px solid #d6ebe0;padding:10px;border-radius:10px;color:#647f70;font-size:10px;line-height:1.7;margin-bottom:10px}.cmd-report-intro strong{color:#1c6e55;font-weight:700}.cmd-reports{display:grid;gap:8px;max-height:320px;overflow-y:auto}.cmd-report{border:1px solid #ecded5;background:#fffbf6;border-left:3px solid #e9a95b;border-radius:10px;padding:9px 9px;color:#79512d}.cmd-report.urgent{border-color:#f1c8c8;border-left-color:#d84e5e;background:#fff8f8;color:#8b3441}.cmd-report.info{border-color:#d7eadf;border-left-color:#6ab993;background:#f6fbf9;color:#38755c}.cmd-report-row{display:flex;justify-content:space-between;align-items:center;gap:6px}.cmd-report-row b{font-size:10px}.cmd-report-row span{background:#fff;border:1px solid #eee2d8;border-radius:99px;padding:2px 5px;font-size:8px}.cmd-report>strong{display:block;margin-top:5px;font-size:11px}.cmd-report p{font-size:10px;margin:5px 0;color:#6a7b6a;line-height:1.5}.cmd-report small{display:block;font-size:9px;color:#a09682}.cmd-report-resolve{cursor:pointer;color:#2f8565;background:transparent;border:0;padding:5px 0;font-size:9px;text-decoration:underline}.cmd-report-button{margin-top:12px;width:100%;background:#ebf8f0;border-color:#bde4ca;color:#18714f}.cmd-data-error{color:#a64d49;font-size:10px;line-height:1.75}
.cmd-info-panel p{color:#70897f;font-size:10px;line-height:1.75;margin:0 0 8px}.cmd-info-panel p:last-child{margin:0}
.cmd-pulse{width:48px;height:48px;position:relative;display:grid;place-items:center}.cmd-pulse-ring{position:absolute;inset:5px;border-radius:50%;background:#25d59b44;border:2px solid #1af0ad;animation:cmdPulse 2.2s ease-out infinite}.cmd-pulse-core{z-index:1;display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:#08b986;color:#fff;border:2px solid #fff;box-shadow:0 0 0 4px #11b98a55,0 1px 13px #021b1744;font:800 11px Kanit}
.cmd-pulse.station .cmd-pulse-ring{background:#2aa0ff44;border-color:#6ac6ff}.cmd-pulse.station .cmd-pulse-core{background:#1c87c4;box-shadow:0 0 0 4px #148ec955,0 1px 13px #021b1744}.cmd-pulse.finish .cmd-pulse-ring{background:#ffb95344;border-color:#f7b84b}.cmd-pulse.finish .cmd-pulse-core{background:#df8128;box-shadow:0 0 0 4px #f1a34855,0 1px 13px #021b1744}
.cmd-popup{font-family:'IBM Plex Sans Thai',sans-serif;display:grid;gap:4px;color:#174d39}.cmd-popup b{font-size:14px}.cmd-popup small{font-size:10px}.cmd-popup span{font-family:monospace;font-size:10px;color:#657f72}
@keyframes cmdPulse{0%{transform:scale(.65);opacity:.9}70%{transform:scale(1.46);opacity:.12}100%{transform:scale(1.6);opacity:0}}
@media(prefers-reduced-motion:reduce){.cmd-pulse-ring{animation:none;opacity:.4}.cmd-button{transition:none}}
.cmd-map-maximized{position:fixed!important;inset:14px!important;height:auto!important;z-index:10000!important;border-radius:15px;box-shadow:0 0 0 100vmax #031d17bc}.cmd-map-maximized #commandMap{height:100%}
.cmd-dialog{border:none;max-width:460px;width:calc(100% - 30px);border-radius:19px;background:#fff;color:#18493a;padding:0;box-shadow:0 25px 100px #062c2f60}.cmd-dialog::backdrop{background:#041e18a8;backdrop-filter:blur(3px)}.cmd-report-form{padding:24px}.cmd-dialog-top{display:flex;align-items:flex-start;justify-content:space-between}.cmd-dialog h3{font:600 22px Kanit;margin:4px 0}.cmd-report-form>p{font-size:11px;color:#84938d;line-height:1.7;margin:3px 0 17px}.cmd-report-form label{display:grid;gap:5px;font-size:11px;font-weight:600;margin:13px 0}.cmd-report-form input,.cmd-report-form select,.cmd-report-form textarea{font:400 12px 'IBM Plex Sans Thai';border:1px solid #cadecf;background:#f8fcfa;border-radius:10px;color:#1b4838;width:100%;padding:11px;outline:none}.cmd-report-form select:focus,.cmd-report-form textarea:focus{border-color:#0f996b}.cmd-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}
@media(max-width:1550px){.cmd-main-grid{grid-template-columns:minmax(0,1fr) 250px}.cmd-map-stage{grid-column:1;grid-row:1}.cmd-side-right{grid-column:2;grid-row:1}.cmd-side-left{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:1fr 1fr}.cmd-map-frame{min-height:530px;height:72vh}}
@media(max-width:1200px){.cmd-main-grid{grid-template-columns:1fr}.cmd-map-stage{grid-column:1;grid-row:1}.cmd-side-right{grid-column:1;grid-row:2;display:grid;grid-template-columns:1fr 1fr}.cmd-side-left{grid-column:1;grid-row:3;display:grid;grid-template-columns:1fr 1fr}.cmd-map-frame{height:66vh;min-height:420px}.cmd-info-panel{display:none}}
@media(max-width:760px){.content:has(.cmd-workspace){padding:12px}.cmd-titlebar{align-items:flex-start;flex-direction:column;gap:9px}.cmd-titleblock h2{font-size:22px}.cmd-title-actions{width:100%;justify-content:space-between}.cmd-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cmd-metric{padding:11px;min-height:90px}.cmd-metric strong{font-size:25px}.cmd-metric small{font-size:9px}.cmd-side-right,.cmd-side-left{grid-template-columns:1fr}.cmd-map-frame{height:58vh;min-height:340px}.cmd-map-footer{align-items:flex-start;flex-direction:column}.cmd-map-header{padding:8px 9px}.cmd-map-header strong{font-size:13px}.cmd-map-label{font-size:7px}.cmd-view-switch button{padding:6px;font-size:9px}.cmd-gps-actions{flex-direction:column;align-items:flex-start}.cmd-map-corner{left:7px;top:8px}.cmd-map-tools{right:7px;top:8px}}


/* V6 — user-verified route colors and side-by-side intel rail */
.cmd-main-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(264px,24vw,330px);gap:14px;align-items:start}
.cmd-main-grid>.cmd-map-stage{grid-column:1;grid-row:1;min-width:0;position:sticky;top:95px}
.cmd-main-grid>.cmd-intel-rail{grid-column:2;grid-row:1;min-width:0;display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 108px);overflow-y:auto;overscroll-behavior:contain;padding:1px 3px 14px 0;scrollbar-width:thin;scrollbar-color:#aed9c5 transparent}
.cmd-intel-rail .cmd-panel{flex:none}
.cmd-map-frame{height:clamp(540px,76vh,880px);min-height:510px}
.cmd-map-stage{align-self:start}
.cmd-route-note{display:grid;gap:8px;background:#edf8f2;color:#236347;border:1px solid #d0eadc;border-radius:10px;padding:10px;font-size:10px}
.cmd-route-note b{font-weight:700;font-size:11px}
.cmd-route-note span{display:flex;align-items:center;gap:9px}
.cmd-route-note i{width:29px;flex:none;border-top:4px solid #0bbd74;border-radius:4px}
.cmd-route-note .cmd-note-car{border-top:4px dashed #48adf6}
.cmd-line-preview.walk{border-color:#0aca82;border-top-style:solid}
.cmd-line-preview.car{border-color:#50c6ff;border-top-style:dashed;border-top-width:4px}
.cmd-line-preview.spur{border-color:#b4c9c2;border-top-style:dotted}
.cmd-legend-dot.main{background:#04e58a}
.cmd-legend-dot.car{background:transparent;height:0;border-top:3px dashed #50c6ff;border-radius:0}
.cmd-legend-dot.spur{background:transparent;height:0;border-top:3px dotted #d9e6df;border-radius:0}
.cmd-point-detail{background:#f1f9f4;border:1px solid #cfe8d7;border-radius:12px;padding:12px 11px;display:grid;gap:7px;line-height:1.5}
.cmd-point-detail b{color:#105e48;font-size:12px}
.cmd-point-detail span,.cmd-point-detail small{color:#627e71;font-size:10px;display:block;overflow-wrap:anywhere}
.cmd-detail-tag{display:inline-block!important;color:#0d8968!important;border-radius:99px;border:1px solid #c7e4d4;padding:2px 7px;margin-left:5px;font-size:9px!important}
.cmd-waypoint.selected{background:#e6f6eb;border-color:#64c99d;box-shadow:inset 3px 0 #10a676}
#commandMap .cmd-map-point-name{font:700 12px 'IBM Plex Sans Thai',sans-serif;background:#fcfffd;box-shadow:0 2px 8px #082a2844;color:#0a553f;border:2px solid #17ac7d;border-radius:8px;padding:4px 8px;white-space:nowrap}
#commandMap .cmd-map-point-name:before{border-right-color:#17ac7d}
#commandMap .leaflet-popup-content-wrapper,#commandMap .leaflet-popup-tip{background:#fff;color:#173f33}
#commandMap .cmd-map-point-name{pointer-events:none}
.cmd-map-footer .cmd-legends{gap:12px}
/* Prevent hide-below behavior at the tablet viewport widths; rail lives to the right. */
@media (max-width:1200px){
 .cmd-main-grid{grid-template-columns:minmax(0,1fr) 270px}
 .cmd-main-grid>.cmd-map-stage{grid-column:1;grid-row:1}
 .cmd-main-grid>.cmd-intel-rail{grid-column:2;grid-row:1;display:flex;max-height:calc(100vh - 105px)}
 .cmd-map-frame{height:76vh;min-height:475px}
 .cmd-info-panel{display:block}
}
/* Keep right-hand rail on most landscape iPad sizes. Move below only on truly narrow screens. */
@media (max-width:1020px){
 .cmd-main-grid{grid-template-columns:minmax(0,1fr) 260px}
 .cmd-main-grid>.cmd-intel-rail{max-height:76vh}
 .cmd-map-frame{min-height:440px;height:70vh}
}
@media (max-width:830px){
 .cmd-main-grid{grid-template-columns:minmax(0,1fr)}
 .cmd-main-grid>.cmd-map-stage{grid-column:1;grid-row:1;position:relative;top:auto}
 .cmd-main-grid>.cmd-intel-rail{grid-column:1;grid-row:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible}
 .cmd-map-frame{height:62vh;min-height:375px}
 .cmd-map-footer{flex-wrap:wrap}
}
@media (max-width:560px){
 .cmd-main-grid>.cmd-intel-rail{grid-template-columns:1fr}
 .cmd-map-frame{height:61vh;min-height:340px}
 #commandMap .cmd-map-point-name{font-size:10px;padding:3px 5px}
 .cmd-main-grid>.cmd-map-stage{position:relative}
}

/* V6 display-first rail and reversible wide-map view */
body.cmd-map-focus .app-shell>.sidebar{display:none!important}
body.cmd-map-focus .main{width:100%}
body.cmd-map-focus .content:has(.cmd-workspace){max-width:none}
.cmd-button-wide{background:#e4f4ec;color:#12644c;border-color:#b8dac8}
.cmd-button-wide[aria-pressed="true"]{background:#0e604b;color:#fff}
.cmd-intel-rail .cmd-waypoint{min-height:47px;padding:7px 8px}
.cmd-intel-rail .cmd-station-number{width:28px;height:28px}
.cmd-intel-rail .cmd-panel{padding:14px 13px}
@media(max-width:760px){.cmd-title-actions{flex-wrap:wrap}.cmd-button-wide{flex:1}}

/* V7: waypoint site names as two-line permanent map labels */
#commandMap .cmd-map-point-name{max-width:196px;white-space:normal!important;overflow-wrap:anywhere;line-height:1.35;padding:5px 8px}
#commandMap .cmd-tooltip-role{display:block;font-size:9px;font-weight:650;letter-spacing:.15px;color:#218366}
#commandMap .cmd-tooltip-place{display:block;font-size:11px;font-weight:750;color:#114934}
.cmd-waypoint-meta b{font-size:11px;line-height:1.5;overflow-wrap:anywhere}
.cmd-point-detail>b{line-height:1.6;overflow-wrap:anywhere}
@media(max-width:900px){#commandMap .cmd-map-point-name{max-width:150px;padding:3px 6px}#commandMap .cmd-tooltip-place{font-size:10px}}
