/* Compact alignment overrides for the modern Nieuwe rit editor */
body.xroute-new-trip .xr-card{padding:9px 10px!important}
body.xroute-new-trip .xroute-step-title{margin-bottom:8px!important}
body.xroute-new-trip .xr-grid{gap:6px 10px!important;align-items:end!important}
body.xroute-new-trip .xr-grid label,
body.xroute-new-trip .xr-fin-grid label{gap:4px!important;align-content:end!important}
body.xroute-new-trip .xr-card input,
body.xroute-new-trip .xr-card select{height:31px!important;padding:5px 8px!important;font-size:10px!important}
body.xroute-new-trip .xr-card textarea{padding:6px 8px!important;font-size:10px!important}
body.xroute-new-trip .xr-grid-container{grid-template-columns:minmax(180px,1.15fr) minmax(130px,.72fr) minmax(130px,.72fr) minmax(170px,.9fr)!important;gap:6px 10px!important;align-items:end!important}
body.xroute-new-trip .xr-grid-container>label{min-width:0!important;margin:0!important}
body.xroute-new-trip .xr-grid-container .xr-checkline{height:31px!important;align-self:end!important}
body.xroute-new-trip .xroute-stop{gap:6px!important}
body.xroute-new-trip .xroute-stop input{height:30px!important}
body.xroute-new-trip .xr-fin-grid{gap:10px!important}
body.xroute-new-trip .xr-fin-grid>div{gap:6px!important}
body.xroute-new-trip .xr-order-reference{max-width:560px!important}
body.xroute-new-trip .xr-order-number,
body.xroute-new-trip .xr-order-job-type,
body.xroute-new-trip .xr-order-customer,
body.xroute-new-trip .xr-order-date{align-self:end!important}
body.xroute-new-trip .xr-required{display:none!important}
body.xroute-new-trip .xr-route-card .xroute-extra-stop{display:block!important;margin:10px 0 0 auto!important;width:max-content!important}
@media(max-width:1240px){
  body.xroute-new-trip .xr-grid-container{grid-template-columns:1fr 1fr!important}
}
@media(max-width:720px){
  body.xroute-new-trip .xr-grid-container{grid-template-columns:1fr!important}
  body.xroute-new-trip .xr-order-reference{max-width:none!important}
}

body.xroute-new-trip .xroute-stop-kind:has(.xroute-stop-type){display:flex!important;align-items:center!important;gap:6px!important}
body.xroute-new-trip .xroute-stop-kind .xr-stop-type-label{display:block!important;min-width:0!important;width:100%!important}
body.xroute-new-trip .xroute-stop-kind .xroute-stop-type{height:30px!important;width:100%!important;margin:0!important;color:inherit!important;font-weight:700!important}


/* One consistent field typography across the complete trip editor */
body.xroute-new-trip :is(.xr-card,.xroute-exact-form) :is(input,select,textarea){
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;
  font-size:10px!important;
  font-weight:700!important;
  line-height:1.25!important;
  color:#fff!important;
}
body.xroute-new-trip :is(.xr-card,.xroute-exact-form) :is(input,textarea)::placeholder{
  font-family:inherit!important;
  font-size:10px!important;
  font-weight:600!important;
  color:#8f9ba0!important;
}
body.xroute-new-trip :is(.xr-card,.xroute-exact-form) select option{
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;
  font-size:10px!important;
  font-weight:700!important;
}
html[data-theme="light"] body.xroute-new-trip :is(.xr-card,.xroute-exact-form) :is(input,select,textarea){
  color:#1b272c!important;
}


/* Compact card layout for every Route & locaties row */
body.xroute-new-trip .xr-route-card .xroute-route-grid{
  gap:7px!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop{
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:30px minmax(100px,120px) minmax(220px,1fr) 15ch repeat(3,36px)!important;
  gap:7px!important;
  align-items:center!important;
  padding:8px!important;
  border:1px solid #374145!important;
  border-radius:8px!important;
  background:#171c1e!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop :is(.xroute-date,input[type="time"],.xr-picker-clear-wrap:has(.xroute-date),.xr-picker-clear-wrap:has(input[type="time"])){
  display:none!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xroute-ref{
  width:15ch!important;
  min-width:15ch!important;
  max-width:15ch!important;
  box-sizing:border-box!important;
}
html[data-theme="light"] body.xroute-new-trip .xr-route-card .xroute-stop{
  border-color:#d8dfe2!important;
  background:#f7f9fa!important;
}
@media(max-width:900px){
  body.xroute-new-trip .xr-route-card .xroute-stop{
    grid-template-columns:30px minmax(100px,120px) minmax(160px,1fr) 15ch repeat(3,36px)!important;
  }
}


/* Modern route numbering and deliberately compact route fields */
body.xroute-new-trip .xr-route-card .xroute-stop{
  grid-template-columns:30px minmax(100px,120px) minmax(260px,42ch) 15ch repeat(3,36px)!important;
  justify-content:start!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop-num{
  width:26px!important;
  min-width:26px!important;
  height:26px!important;
  border:1px solid rgba(239,186,63,.55)!important;
  border-radius:8px!important;
  background:linear-gradient(145deg,rgba(239,186,63,.24),rgba(239,186,63,.10))!important;
  color:#f0bd4f!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
  font-size:11px!important;
  font-weight:800!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xr-location-wrap{
  width:100%!important;
  max-width:42ch!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xroute-location{
  width:100%!important;
  max-width:42ch!important;
}
@media(max-width:900px){
  body.xroute-new-trip .xr-route-card .xroute-stop{
    grid-template-columns:30px minmax(100px,120px) minmax(220px,36ch) 15ch repeat(3,36px)!important;
  }
}


/* Location actions match the outlined Route berekenen control. */
body.xroute-new-trip .xr-route-card .xr-location-actions :is(.xr-add-location,.xroute-extra-stop){
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  width:auto!important;
  min-width:max-content!important;
  min-height:32px!important;
  height:32px!important;
  padding:0 11px!important;
  border:1px solid #8f6d19!important;
  border-radius:6px!important;
  background:#15191a!important;
  background-image:none!important;
  color:#efb62f!important;
  box-shadow:none!important;
  font-size:10px!important;
  font-weight:750!important;
  line-height:1!important;
}
body.xroute-new-trip .xr-route-card .xr-location-actions :is(.xr-add-location,.xroute-extra-stop)>i{
  width:12px!important;
  color:currentColor!important;
  font-size:11px!important;
  text-align:center!important;
}
body.xroute-new-trip .xr-route-card .xr-location-actions :is(.xr-add-location,.xroute-extra-stop):hover{
  transform:translateY(-1px)!important;
  border-color:#e4b13c!important;
  background:#211d12!important;
  color:#ffd05c!important;
}
html[data-theme="light"] body.xroute-new-trip .xr-route-card .xr-location-actions :is(.xr-add-location,.xroute-extra-stop){
  border-color:#b8871d!important;
  background:#fff!important;
  color:#8a5c00!important;
}


/* Final route-row alignment: compact locations, aligned headings and no red clear marks. */
body.xroute-new-trip .xr-route-card .xroute-stop:not(:last-child)::after{
  content:none!important;
  display:none!important;
  border:0!important;
}
body.xroute-new-trip .xr-route-card :is(.xr-route-clear,.xr-generic-clear){
  display:none!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop :is(input,select){
  padding-right:8px!important;
}
body.xroute-new-trip .xr-route-card :is(.xr-route-head,.xroute-stop){
  grid-template-columns:30px 120px minmax(230px,36ch) 15ch 94px!important;
  gap:7px!important;
  justify-content:start!important;
  box-sizing:border-box!important;
}
body.xroute-new-trip .xr-route-card .xr-route-head{
  width:100%!important;
  padding:0 8px!important;
}
body.xroute-new-trip .xr-route-card .xr-route-head>:nth-child(3){
  grid-column:3!important;
}
body.xroute-new-trip .xr-route-card .xr-route-head>:nth-child(4),
body.xroute-new-trip .xr-route-card .xr-route-head>:nth-child(5){
  display:none!important;
}
body.xroute-new-trip .xr-route-card .xr-route-head>:nth-child(6){
  grid-column:4!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xr-location-wrap,
body.xroute-new-trip .xr-route-card .xroute-stop .xroute-location{
  width:100%!important;
  max-width:36ch!important;
}


/* Compact Route & locaties: no column captions and less vertical whitespace. */
body.xroute-new-trip .xr-route-card{
  padding:7px 8px!important;
}
body.xroute-new-trip .xr-route-card .xroute-step-title{
  margin-bottom:5px!important;
}
body.xroute-new-trip .xr-route-card .xr-route-head{
  display:none!important;
}
body.xroute-new-trip .xr-route-card .xroute-route-grid{
  gap:5px!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop{
  min-height:0!important;
  padding:6px 8px!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop :is(input,select),
body.xroute-new-trip .xr-route-card .xroute-stop-kind .xroute-stop-type{
  height:28px!important;
}
body.xroute-new-trip .xr-route-card .xr-location-actions{
  margin-top:6px!important;
}
body.xroute-new-trip .xr-route-card .xroute-extra-stop{
  margin-top:0!important;
}


/* Tighter horizontal route alignment. */
body.xroute-new-trip .xr-route-card :is(.xroute-stop,.xr-route-head){
  grid-template-columns:30px 120px minmax(180px,30ch) 15ch 94px!important;
  column-gap:4px!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xr-location-wrap,
body.xroute-new-trip .xr-route-card .xroute-stop .xroute-location{
  width:100%!important;
  max-width:30ch!important;
}


/* Explicit placement prevents Portbase from displacing location/reference fields. */
body.xroute-new-trip .xr-route-card .xroute-stop{
  grid-template-columns:30px 120px minmax(150px,200px) 114px minmax(100px,1fr)!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop>.xroute-stop-num{grid-column:1!important;grid-row:1!important}
body.xroute-new-trip .xr-route-card .xroute-stop>.xroute-stop-kind{grid-column:2!important;grid-row:1!important}
body.xroute-new-trip .xr-route-card .xroute-stop>.xr-location-wrap{
  grid-column:3!important;grid-row:1!important;
  width:100%!important;min-width:0!important;max-width:none!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xroute-location{
  width:100%!important;min-width:0!important;max-width:none!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop>:is(.xroute-ref,.xr-hcn-tar-cell,.xr-picker-clear-wrap:has(.xroute-ref)){
  grid-column:4!important;grid-row:1!important;
  width:100%!important;min-width:0!important;max-width:none!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xroute-ref{
  width:100%!important;min-width:0!important;max-width:none!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xr-hcn-route-row{
  grid-column:5/-1!important;grid-row:1!important;
  display:flex!important;align-items:center!important;flex-wrap:wrap!important;
  width:100%!important;min-width:0!important;
  margin-left:0!important;justify-content:flex-end!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xr-hcn-action-group{
  display:inline-flex!important;flex:0 0 auto!important;
  margin-left:auto!important;gap:5px!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop .xr-hcn-tar-validity{
  flex:0 1 auto!important;min-width:0!important;max-width:100%!important;
  display:block!important;white-space:normal!important;line-height:1.4!important;
  box-sizing:border-box!important;
}
body.xroute-new-trip .xr-route-card .xroute-stop>.xr-route-delete{
  grid-column:5!important;grid-row:1!important;justify-self:end!important;
}
@media(max-width:720px){
  body.xroute-new-trip .xr-route-card .xroute-stop{
    grid-template-columns:30px minmax(0,1fr)!important;
  }
  body.xroute-new-trip .xr-route-card .xroute-stop>.xr-location-wrap{
    grid-column:1/-1!important;grid-row:2!important;
  }
  body.xroute-new-trip .xr-route-card .xroute-stop>:is(.xroute-ref,.xr-hcn-tar-cell,.xr-picker-clear-wrap:has(.xroute-ref)){
    grid-column:1/-1!important;grid-row:3!important;width:114px!important;
  }
  body.xroute-new-trip .xr-route-card .xroute-stop .xr-hcn-route-row{
    grid-column:1/-1!important;grid-row:4!important;
  }
  body.xroute-new-trip .xr-route-card .xroute-stop>.xr-route-delete{
    grid-column:2!important;grid-row:3!important;
  }
}


/* Extra-stop removal shares the Portbase action column and button dimensions. */
html body.xroute-new-trip .xr-route-card .xroute-stop>.xr-route-delete{
  grid-column:4!important;grid-row:1!important;
  justify-self:start!important;align-self:center!important;margin:0!important;
  width:28px!important;height:28px!important;
  min-width:28px!important;min-height:28px!important;
  max-width:28px!important;max-height:28px!important;
}