/* FleetFlow professional Create Job workspace */
#jobModal{background:rgba(15,23,42,.56);backdrop-filter:blur(10px)}
#jobModal .jobFormShell{background:#f4f7fb;color:#0f172a}
#jobModal .jobFormHeader{min-height:82px;padding:14px clamp(20px,3vw,42px);border-bottom:1px solid #dce4ef;background:rgba(255,255,255,.97);box-shadow:0 1px 0 rgba(15,23,42,.02)}
#jobModal .jobFormHeading{gap:13px}
#jobModal .jobFormIcon{width:44px;height:44px;border-radius:12px;background:#0f4fdc;box-shadow:0 8px 20px rgba(15,79,220,.22);font-size:0}
#jobModal .jobFormIcon svg{width:22px;height:22px;stroke:#fff}
#jobModal .jobFormEyebrow{margin-bottom:3px;color:#64748b;font-size:9px;letter-spacing:.11em}
#jobModal .jobFormHeader h2{font-size:21px;font-weight:850;letter-spacing:-.025em}
#jobModal .jobFormHeader p{margin-top:3px;color:#64748b;font-size:10px}
#jobModal .jobFormClose{width:38px;height:38px;border-color:#d9e2ec;border-radius:10px;color:#64748b;font-size:21px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
#jobModal .jobFormHeaderActions{display:flex;align-items:center;gap:8px;margin-left:auto}
#jobModal .jobTemplateChip{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 11px;border:1px solid #bfdbfe;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:10px;font-weight:850;white-space:nowrap}
#jobModal .jobTemplateChip:before{content:'';width:7px;height:7px;border-radius:50%;background:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
#jobModal .jobFieldsQuick{min-height:34px!important;padding:0 11px!important;border:1px solid #d8e1ec!important;border-radius:9px!important;background:#fff!important;color:#334155!important;font-size:10px!important;font-weight:800!important}
#jobModal .jobDraftMenu{position:relative}
#jobModal .jobDraftMenu>summary{list-style:none;display:flex;align-items:center;min-height:34px;padding:0 11px;border:1px solid #d8e1ec;border-radius:9px;background:#fff;color:#475569;font-size:10px;font-weight:800;cursor:pointer}
#jobModal .jobDraftMenu>summary::-webkit-details-marker{display:none}
#jobModal .jobDraftMenu[open]>summary{border-color:#93c5fd;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
#jobModal .jobDraftMenu .jobDraftGroup{position:absolute;right:0;top:42px;z-index:40;display:grid!important;grid-template-columns:minmax(210px,1fr) auto auto;gap:7px;width:390px;padding:11px;border:1px solid #dbe3ed;border-radius:12px;background:#fff;box-shadow:0 18px 45px rgba(15,23,42,.16)}
#jobModal .jobDraftMenu .jobDraftGroup label{grid-column:1/-1;color:#64748b;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}
#jobModal .jobDraftMenu .jobDraftGroup select{width:100%;min-height:34px}
#jobModal>.jobFeatureBar,#jobModal .jobFormShell>.jobFeatureBar{display:none!important}
#jobModal .jobFormBody{display:grid!important;grid-template-columns:minmax(0,1fr) 285px!important;align-items:start!important;gap:16px!important;width:min(1180px,calc(100% - 40px))!important;max-width:1180px!important;padding:20px 0 34px!important}
#jobModal .jobFormBody>.jobFormSection{grid-column:1;width:100%!important;max-width:none!important;margin:0!important;border:1px solid #e0e7f0;border-radius:14px;overflow:hidden!important;background:#fff;box-shadow:0 4px 14px rgba(15,23,42,.035)}
#jobModal .jobFormBody>.jobFormSection>header{min-height:55px;padding:12px 15px;border-bottom:1px solid #eef2f6;background:#fff}
#jobModal .jobFormBody>.jobFormSection>header>span{width:27px;height:27px;border-radius:8px;background:#eef4ff;color:#1d4ed8;font-size:10px}
#jobModal .jobFormSection h3{color:#172033;font-size:13px;font-weight:850;letter-spacing:-.01em}
#jobModal .jobFormSection header p{margin-top:2px;color:#8492a6;font-size:9px}
#jobModal .jobFormGrid{gap:14px 15px;padding:16px}
#jobModal .field{gap:6px}
#jobModal .field label{color:#526174;font-size:10px;font-weight:800;letter-spacing:.01em}
#jobModal input,#jobModal select,#jobModal textarea{min-height:44px;border:1px solid #cfd9e5;border-radius:9px;padding:9px 11px;background:#fff;color:#172033;font-size:12px;box-shadow:0 1px 1px rgba(15,23,42,.015)}
#jobModal input:hover,#jobModal select:hover,#jobModal textarea:hover{border-color:#aebccc}
#jobModal input:focus,#jobModal select:focus,#jobModal textarea:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.10)}
#jobModal textarea{min-height:96px;line-height:1.5}
#jobModal .ffLookupButton{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;min-height:32px;margin-top:1px;padding:0 10px;border-color:#cfd9e5;border-radius:8px;background:#fff;color:#334155;font-size:9px}
#jobModal .ffNearestDriver{min-height:34px;border-color:#d7e4fb;border-radius:8px;background:#f4f8ff;color:#1d4ed8;font-size:9px}
#jobModal .assignedVehicleSummary{min-height:30px;margin-top:1px;padding:6px 9px;border-color:#dbe6f5;border-radius:8px;background:#f7faff;font-size:9px!important}
#jobModal .jobOptionalSection>header{background:#fbfcfe}
#jobModal .jobSectionToggle{min-height:30px;padding:0 10px;border-color:#d8e1ec;border-radius:8px;background:#fff;color:#475569;font-size:9px}
#jobModal .jobSummaryRail{position:sticky;top:0;grid-column:2;grid-row:1 / span 30;overflow:hidden;border:1px solid #e0e7f0;border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(15,23,42,.05)}
#jobModal .jobSummaryHead{padding:15px 15px 13px;border-bottom:1px solid #eef2f6;background:linear-gradient(180deg,#fff,#fbfdff)}
#jobModal .jobSummaryHead small{display:block;margin-bottom:4px;color:#2563eb;font-size:8px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
#jobModal .jobSummaryHead h3{margin:0;color:#172033;font-size:15px;font-weight:850}
#jobModal .jobSummaryTemplate{display:inline-flex;margin-top:9px;padding:5px 8px;border-radius:999px;background:#eef4ff;color:#1d4ed8;font-size:9px;font-weight:850}
#jobModal .jobSummaryBody{display:grid;gap:0;padding:5px 15px 10px}
#jobModal .jobSummaryItem{display:grid;grid-template-columns:28px minmax(0,1fr);gap:9px;align-items:start;padding:11px 0;border-bottom:1px solid #f0f3f7}
#jobModal .jobSummaryItem:last-child{border-bottom:0}
#jobModal .jobSummaryIcon{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#f1f5f9;color:#64748b;font-size:11px;font-weight:900}
#jobModal .jobSummaryItem small{display:block;margin-bottom:2px;color:#94a3b8;font-size:8px;font-weight:850;letter-spacing:.05em;text-transform:uppercase}
#jobModal .jobSummaryItem b{display:block;overflow:hidden;color:#334155;font-size:10px;font-weight:800;line-height:1.35;text-overflow:ellipsis}
#jobModal .jobSummaryItem span{display:block;margin-top:2px;color:#8492a6;font-size:9px;line-height:1.35}
#jobModal .jobSummaryProgress{padding:12px 15px 15px;border-top:1px solid #eef2f6;background:#fbfcfe}
#jobModal .jobSummaryProgressTop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px;color:#64748b;font-size:9px;font-weight:800}
#jobModal .jobSummaryProgressTrack{height:6px;overflow:hidden;border-radius:999px;background:#e8edf4}
#jobModal .jobSummaryProgressBar{height:100%;border-radius:999px;background:#2563eb;transition:width .2s ease}
#jobModal .jobSummaryHint{margin:8px 0 0;color:#94a3b8;font-size:8px;line-height:1.45}
#jobModal .modalActions{padding:11px clamp(20px,3vw,42px);border-top:1px solid #dce4ef;background:rgba(255,255,255,.98);box-shadow:0 -8px 24px rgba(15,23,42,.04)}
#jobModal .modalActions:before{content:'';display:block;flex:1}
#jobModal .modalActions>div{gap:8px}
#jobModal .modalActions .btn{min-width:112px;min-height:42px;border-radius:9px;font-size:10px;font-weight:850}
#jobModal .modalActions .btn.primary{border-color:#2563eb;background:#2563eb;box-shadow:0 6px 14px rgba(37,99,235,.18)}
#jobModal .modalActions .btn.primary:hover{background:#1d4ed8}
#jobModal .jobFormRequired{display:none}
#jobModal #tipperWorkSection{border-color:#e7dcc1;background:#fff}
#jobModal #tipperWorkSection>header{background:#fffdf8}
#jobModal #tipperWorkSection>header>span{background:#f7ecd4!important;color:#7a4b00!important}
#jobModal .tipperCleanPanel,#jobModal .tipperPanel{border-color:#eadfca;border-radius:12px;background:#fffdf9}
#jobModal .tipperSite{border-color:#e4e8ef;border-radius:10px;box-shadow:0 1px 2px rgba(15,23,42,.02)}
#jobModal .tipperRemove{border:1px solid #fecaca;background:#fff;color:#b91c1c}
#jobTemplateChooser{background:rgba(15,23,42,.58);backdrop-filter:blur(9px)}
#jobTemplateChooser .modalBox{width:min(980px,calc(100vw - 36px));max-width:980px;padding:22px;border:1px solid rgba(255,255,255,.4);border-radius:18px;background:#fff;box-shadow:0 28px 75px rgba(15,23,42,.28)}
#jobTemplateChooser .jtChooserHead{align-items:center;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid #eef2f6}
#jobTemplateChooser .jtChooserHead h2{color:#172033;font-size:21px;font-weight:850;letter-spacing:-.02em}
#jobTemplateChooser .jtChooserHead p{margin-top:3px;color:#64748b;font-size:10px}
#jobTemplateChooser .jtChooserHead .btn{min-height:36px;border-color:#d8e1ec;border-radius:9px;background:#fff;color:#475569;font-size:10px;font-weight:800}
#jobTemplateChooser .jtGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#jobTemplateChooser .jtCard{grid-template-columns:42px minmax(0,1fr) auto;min-height:92px;padding:13px;border-color:#e0e7f0;border-radius:12px;box-shadow:0 1px 2px rgba(15,23,42,.015)}
#jobTemplateChooser .jtCard:hover{border-color:#9fc1f7;background:#fbfdff;box-shadow:0 8px 22px rgba(37,99,235,.08);transform:translateY(-1px)}
#jobTemplateChooser .jtIcon{width:42px;height:42px;border-radius:10px;background:#eef4ff;color:#1d4ed8;font-size:12px}
#jobTemplateChooser .jtCard strong{font-size:12px;font-weight:850}
#jobTemplateChooser .jtCard small{margin-top:4px;color:#738196;font-size:9px;line-height:1.4}
#jobTemplateChooser .jtDefault{padding:4px 6px;font-size:8px}
@media(max-width:1050px){#jobModal .jobFormHeaderActions{gap:6px}#jobModal .jobTemplateChip{display:none}#jobModal .jobFormBody{grid-template-columns:minmax(0,1fr) 250px!important;width:min(980px,calc(100% - 28px))!important}}
@media(max-width:820px){#jobModal .jobFormHeader{min-height:72px;padding:12px 14px}#jobModal .jobFormHeader p{display:none}#jobModal .jobFormBody{display:flex!important;width:min(700px,calc(100% - 24px))!important;padding-top:13px!important}#jobModal .jobSummaryRail{display:none}#jobModal .jobDraftMenu .jobDraftGroup{right:-48px;width:min(360px,calc(100vw - 28px))}#jobTemplateChooser .jtGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){#jobModal .jobFormIcon{width:39px;height:39px}#jobModal .jobFormHeader h2{font-size:18px}#jobModal .jobFieldsQuick{padding:0 9px!important}#jobModal .jobDraftMenu>summary{padding:0 9px}#jobModal .jobFormBody{width:calc(100% - 16px)!important;gap:9px!important;padding:9px 0 18px!important}#jobModal .jobFormBody>.jobFormSection{border-radius:12px}#jobModal .jobFormGrid{grid-template-columns:1fr!important;padding:13px}#jobModal .jobFormWide,#jobModal .jobFormFull{grid-column:1}#jobModal .modalActions{padding:9px 10px}#jobModal .modalActions .btn{min-height:40px;min-width:0;flex:1}#jobTemplateChooser .modalBox{width:calc(100vw - 18px);padding:14px;border-radius:14px}#jobTemplateChooser .jtGrid{grid-template-columns:1fr}#jobTemplateChooser .jtCard{min-height:78px}}

/* Keep template sections in normal document flow inside the two-column workspace. */
#jobModal .jobFormBody{grid-auto-rows:max-content!important;align-items:start!important}
#jobModal .jobFormBody>.jobFormSection{align-self:stretch!important}
#jobModal .jobSummaryRail{align-self:start!important}
