/* Explanations follow the current theme and remain separate from business actions. */
html {
  --context-help-target:24px;
  --context-help-mark:18px;
  --context-help-gap:4px;
  --context-help-control-space:32px;
}
html body [class^="context-help-"][hidden] { display:none !important; }
html body .context-help-trigger {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 var(--context-help-target); width: var(--context-help-target); height: var(--context-help-target);
  min-width: var(--context-help-target); min-height: var(--context-help-target);
  padding: 0; margin: 0 0 0 var(--context-help-gap); border: 0;
  border-radius: 50%; background: transparent; color: var(--text-2,#465a6b);
  font: 600 12px/1 var(--f2,system-ui,sans-serif); vertical-align: middle; cursor: help;
  box-shadow: none; text-transform: none; letter-spacing: normal; transform: none;
}
html body .context-help-trigger > span {
  display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box;
  flex:0 0 var(--context-help-mark); width:var(--context-help-mark); height:var(--context-help-mark);
  border:1px solid var(--border-2,#a4b2bf); border-radius:50%;
  background:var(--surface-2,#f4f7fa); font:inherit; color:inherit; pointer-events:none;
}
html body .context-help-trigger:hover,
html body .context-help-trigger[aria-describedby] {
  color: var(--text,#213345); background:transparent; opacity: 1; transform: none;
}
html body .context-help-trigger:is(:hover,[aria-describedby]) > span { border-color:var(--experience-focus,#176ca4); background:var(--surface-3,#eaf0f5); }
html body .context-help-trigger:focus-visible { outline: 3px solid var(--experience-focus,#176ca4); outline-offset: 2px; }
html body :is(.context-help-label,.context-help-choice,.context-help-control,.context-help-action,.context-help-group,.context-help-heading) > .context-help-trigger { margin:0; }
html body .context-help-heading { display:flex; align-items:center; gap:var(--context-help-gap); min-width:0; overflow-wrap:anywhere; }
html body .context-help-label { display:flex; align-items:center; gap:var(--context-help-gap); min-width:0; min-height:var(--context-help-target); }
html body .context-help-label > label { flex:1 1 auto; min-width:0; gap:8px; line-height:1.4; overflow-wrap:anywhere; }
html body .context-help-field { display:block; position:relative; min-width:0; max-width:100%; }
html body .context-help-field > label { width:100%; box-sizing:border-box; height:100%; }
html body .context-help-field > .context-help-trigger { position:absolute; right:0; top:0; margin:0; }
html body .context-help-choice { display:inline-flex; align-items:center; gap:var(--context-help-gap); min-width:0; max-width:100%; vertical-align:middle; }
html body .context-help-choice > label { display:flex; flex-direction:row; align-items:center; gap:8px; min-width:0; line-height:1.4; }
html body .context-help-floating { padding-right:var(--context-help-control-space); box-sizing:border-box; }
html body .context-help-floating > .context-help-trigger { position:absolute; right:0; top:calc((46px - var(--context-help-target)) / 2); margin:0; }
html body #routeFormModal .context-help-floating > .rf-clear { right:calc(38px + var(--context-help-control-space)); }
html body .context-help-caption { display:flex; align-items:center; min-height:var(--context-help-target); padding-right:var(--context-help-control-space); box-sizing:border-box; line-height:1.4; overflow-wrap:anywhere; }
html body .context-help-control { display:inline-flex; align-items:center; gap:var(--context-help-gap); min-width:0; max-width:100%; }
html body .context-help-control > :is(input,select,textarea) { min-width:0; flex:1 1 auto; }
html body .tab-toolbar > .context-help-search { min-width:min(var(--context-help-search-width, 260px),100%); }
html body .context-help-control:has(> :is(#vehicleSearch,#fleetSearch)) { min-width:min(276px,100%); flex-basis:276px; }
html body.experience-ui .context-help-control #vehicleSearch { min-width:0; max-width:100%; }
html body .context-help-action { display:inline-flex; align-items:center; gap:var(--context-help-gap); min-width:0; max-width:100%; vertical-align:middle; }
html body .context-help-action > :is(button,a):first-child { min-width:0; }
/* RF's mobile footer lets its business buttons fill a row. The separate help
   target keeps its own size inside that row without changing the main action. */
html body #routeFormModal .rf-actions > .context-help-action > .context-help-trigger {
  flex:0 0 var(--context-help-target);
  width:var(--context-help-target); min-width:var(--context-help-target); max-width:var(--context-help-target);
}
html body .context-help-group { display:flex; align-items:center; gap:var(--context-help-gap); margin:8px 0; font-size:13px; font-weight:600; color:var(--text-2,#465a6b); }
html body .si-dialog > .context-help-group { margin-inline:24px; }
html body .context-help-popup {
  position:fixed; inset:auto; margin:0; box-sizing:border-box; width:340px;
  max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); overflow:auto;
  padding:14px 16px; border:1px solid var(--border-2,#a4b2bf); border-radius:10px;
  color:var(--text,#213345); background:var(--surface,#fff);
  font:400 14px/1.55 var(--f2,system-ui,sans-serif); text-align:left;
  box-shadow:0 6px 24px rgb(12 27 42 / 18%); z-index:2147483000;
  white-space:normal; overflow-wrap:anywhere; text-transform:none; letter-spacing:normal;
}
html body .context-help-popup strong { display:block; margin:0 0 6px; font-size:14px; line-height:1.4; }
html body .context-help-popup p { margin:0; padding:0; font:inherit; color:inherit; }
html body .context-help-popup::backdrop { display:none; background:transparent; pointer-events:none; }
html body .amis-data-state {
  display:inline-flex; align-items:center; gap:var(--context-help-gap,4px);
  min-width:0; max-width:100%; vertical-align:middle; color:var(--text,#213345);
  font:inherit; line-height:1.45; white-space:normal; text-align:inherit;
}
html body .amis-data-state-label { min-width:0; overflow-wrap:anywhere; }
html body .amis-data-state > .context-help-trigger { margin:0; }
html body .amis-data-state-note { display:block; margin-block-start:4px; font-size:13px; line-height:1.45; }
@media (pointer:coarse) {
  html { --context-help-target:32px; --context-help-control-space:40px; }
}
@media (max-width:600px) {
  html body .si-dialog > .context-help-group { margin-inline:16px; }
  html body .context-help-control:has(> :is(#vehicleSearch,#fleetSearch)) { grid-column:1 / -1; }
}

/* Keep the explanation and source note on separate aligned lines below a field. */
html body :is([data-document-reason],[data-si-reason]):not([hidden]) { display:block; margin-block-start:4px; font-size:13px; line-height:1.45; }
html body #dpFields label > small { display:block; margin-block-start:4px; line-height:1.45; }
