/* Navigation shared by the two Site Visits views. */
.rrcc-visit-views { display: flex; gap: 18px; margin: 0 0 10px; border-bottom: 1px solid #d9e2ee; }
.rrcc-visit-views a {
  box-sizing: border-box; display: inline-flex; align-items: center; min-height: 44px;
  padding: 0 6px; border-bottom: 3px solid transparent; color: #475569;
  font-size: 14px; font-weight: 700; text-decoration: none;
}
.rrcc-visit-views a[aria-current="page"] { border-bottom-color: #a72835; color: #84252a; }
.rrcc-visit-views a:hover { color: #84252a; }
.rrcc-visit-views a:focus-visible { outline: 3px solid #1462a9; outline-offset: -3px; }

/* Staff worklist: choose a task, find a host site, then act on that site or selection. */
/* Safari's native single-select menu does not retain min-height alone. */
html.rrcc-page-site-visit select:not([multiple]) { box-sizing: border-box; height: 44px; min-height: 44px; }
#rrcc-main #svWorklist,
#rrcc-main .sv-settings-view { background: #fff; }
#rrcc-main #svWorklist { padding: clamp(12px, 2vw, 22px); }
#rrcc-main .sv-workhead {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 0 10px; margin: 0 0 10px; border-bottom: 1px solid #d9e2ee;
}
#rrcc-main .sv-workhead .rrcc-visit-views { margin: 0; border: 0; }
#svWorkTitle.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
#rrcc-main #visitTimesTitle { margin: 0; color: #1f2a44; font: 700 clamp(19px, 2.2vw, 24px)/1.2 var(--rr-display, Georgia, serif); }
#rrcc-main :is(.sv-plan-tools,.sv-more-tools,.sv-list-tools,.sv-selection) .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  min-height: 44px; min-width: 0; padding: 7px 12px; border-radius: 9px;
  line-height: 1.2; font-size: 14px; text-align: center; white-space: normal;
}
#rrcc-main :is(.sv-more-tools,.sv-list-tools) select.btn {
  display: block; width: 100%; padding-inline: 10px; text-align: left; color: #1f2a44;
}
#rrcc-main .sv-plan-tools { display: flex; flex-wrap: wrap; align-items: stretch; gap: 6px; margin-bottom: 12px; }
#rrcc-main #svPlannerStatus { margin: -5px 0 10px; color: #55627a; }
#rrcc-main #dayPlanBtn { color: #fff; background: #243651; border-color: #243651; }
#rrcc-main #dayPlanBtn:hover { background: #324a6e; border-color: #324a6e; }
#rrcc-main .sv-tools-summary[aria-expanded="true"] { color: #244776; background: #eff4fb; border-color: #afc0d7; }
#rrcc-main .sv-tools-summary[aria-expanded="true"] span { transform: rotate(180deg); }
#rrcc-main .sv-more-tools:not([hidden]) {
  display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%, 168px),1fr));
  gap: 6px; padding: 8px; margin: -5px 0 12px; background: #f5f7fb;
  border: 1px solid #dee5f0; border-radius: 10px;
}
#rrcc-main .sv-list-tools {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(160px, auto) minmax(108px, auto);
  gap: 6px; padding-top: 12px; border-top: 1px solid #e3e9f1;
}
#rrcc-main .sv-list-tools #search {
  width: 100%; min-width: 0; min-height: 44px; box-sizing: border-box;
  padding: 8px 11px; border: 1px solid #bfcadc; border-radius: 9px; background: #fff;
  color: #1f2a44; font-size: 16px;
}
#rrcc-main .sv-list-meta { display: flex; flex-wrap: wrap; gap: 3px 10px; margin: 2px 0 0; color: #55627a; font-size: 13px; }
#rrcc-main #svBookingReadiness { color: #765424; }
/* The selection tray follows the list in document order. Opening it doesn't push
   the just-tapped site out from under the user's finger. */
#rrcc-main .sv-selection { display: none; }
#rrcc-main .sv-selection:has(#svSelectedActions:not([hidden])) {
  display: block; position: sticky; z-index: 8;
  bottom: calc(var(--rr-mobile-nav-height, 0px) + max(8px, env(safe-area-inset-bottom)) + 4px);
  margin-top: 8px; padding: 5px 8px; border: 1px solid #b7c6d9; border-radius: 12px;
  background: #f5f8fc; box-shadow: 0 2px 8px #1c29411a;
}
#rrcc-main #svSelectedActions:not([hidden]) {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; gap: 4px 8px;
}
#rrcc-main #svSelectionCount { margin-right: auto; color: #243651; font-size: 14px; font-weight: 700; }
#rrcc-main #svWorklist:has(#svSelectedActions:not([hidden])) > #list { padding-bottom: 0 !important; }
#rrcc-main #svClearSelection { background: transparent; border-color: transparent; }
#rrcc-main #svWorklist #status:empty { margin: 0; }
#rrcc-main #svWorklist #list { margin-top: 9px; }
#rrcc-main .sv-settings-view { max-width: 860px; margin: 12px auto; padding: clamp(13px, 3vw, 24px); scroll-margin-top: var(--rr-stick, 0px); }
#rrcc-main:has(#visitTimesPanel:not([hidden])) .sv-top { padding-bottom: 16px !important; }
#rrcc-main .sv-settings-view .sv-task-head { align-items: center; justify-content: space-between; margin: 0 0 12px; }
#rrcc-main .sv-settings-view #vbResumeOutreach { margin-top: 9px; }
#rrcc-main .sv-settings-view .sv-setup-notice { margin: 0; }
#rrcc-main .sv-saved-plans { list-style: none; margin: 0; padding: 0; }
#rrcc-main .sv-saved-plans .vb-range { flex-wrap: wrap; }
#rrcc-main :is(#savedDayPlansStatus,#savedMapPlansStatus,#routePlanStatus):empty { display: none; }

@media (max-width: 600px) {
  #rrcc-main .sv-plan-tools { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1.1fr) auto; }
  #rrcc-main .sv-plan-tools .btn { padding-inline: 6px; }
  #rrcc-main .sv-plan-tools .btn { font-size: 13px; }
  #rrcc-main .sv-list-tools { grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); }
  #rrcc-main .sv-list-tools #search { grid-column: 1/-1; }
  #rrcc-main :is(.sv-more-tools,.sv-list-tools) select.btn { font-size: 16px; }
  #rrcc-main #svSelectedActions:not([hidden]) {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 6px;
  }
  #rrcc-main #svSelectionCount { grid-area: 1/1; }
  #rrcc-main #svClearSelection { grid-area: 1/2; }
  #rrcc-main #scheduleSelected { grid-area: 2/1; width: auto; }
  #rrcc-main #planRouteBtn { grid-area: 2/2; }
  #rrcc-main .sv-workhead .sv-list-meta { padding: 0 0 4px; }
  #rrcc-main .sv-selection .btn { padding-inline: 7px; }
}
@media (max-width: 420px) {
  #rrcc-main .sv-more-tools:not([hidden]) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #rrcc-main .sv-top #sub { display: none; }
}
#rrcc-main .sv-legacy-dates { margin: 12px 0; padding: 10px 12px; border: 1px solid #d6e2ee; border-radius: 10px; background: #f5f8fc; }
#rrcc-main .sv-legacy-dates h3 { margin-top: 0; }
#rrcc-main .sv-legacy-dates p { margin: 6px 0 10px; }
#rrcc-main #vbLegacyStatus:empty { margin: 0; }

#rrcc-main #bookingPanel {
  max-width: 710px;
  margin-inline: auto;
  background: #fff;
}
#rrcc-main #bookingPanel [hidden] { display: none; }
#rrcc-main .vb-appointment {
  padding: 10px 12px;
  margin: 8px 0 12px;
  border: 1px solid #d5dfeb;
  border-radius: 9px;
  background: #f4f7fb;
  overflow-wrap: anywhere;
}
#rrcc-main .vb-appointment > strong { color: #1f2a44; }
#rrcc-main .vb-appointment p { margin: 2px 0 0; }
#rrcc-main #bookingPanel #vbBookOptions { margin-top: 8px; }
#rrcc-main #bookingPanel #vbCancelBooking { color: #84252a; }
#rrcc-main #bookingPanel .vb-danger { background: #982c37; border-color: #982c37; color: #fff; }
#rrcc-main #bookingPanel .vb-danger:not(:disabled):hover { background: #7c202a; }
#rrcc-main #bookingPanel :is(#vbBookStatus,#vbSelected):empty { margin: 0; }
#rrcc-main #vbCancelReview .vb-actions { align-items: stretch; }

/* A task gets the workspace. Keep its navigation and its own controls in view. */
#rrcc-main #svWorklist[data-task] > :is(.sv-plan-tools,.sv-more-tools,.sv-list-tools,.sv-selection,#svPlannerStatus),
#rrcc-main #svWorklist[data-task] .sv-list-meta,
#rrcc-main #svWorklist[data-task]:not([data-task="availabilityPanel"]):not([data-task="routePanel"]) > #list {
  display: none !important;
}
#rrcc-main #svWorklist[data-task] > .sv-task-panel { margin-top: 0; }
#rrcc-main #vdGoToActions { margin: 0 0 12px; }
#rrcc-main #vdActions { scroll-margin-block: 18px 100px; }
#rrcc-main :is(.sv-task-panel,.sv-settings-view) :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) {
  font-size: 16px; min-height: 44px; box-sizing: border-box; max-width: 100%;
}
#rrcc-main :is(.sv-task-panel,.sv-settings-view) :is(button,.btn,summary) { min-height: 44px; }
#rrcc-main #dpLengthNote { margin: 8px 0; }
#mBackCalendar { margin-bottom: 10px; min-height: 44px; }
@media (pointer:coarse) {
  #rrcc-main :is(.sv-task-panel,.sv-settings-view) { padding-bottom: max(16px,env(safe-area-inset-bottom)); }
  #rrcc-main :is(.sv-task-panel,.sv-settings-view) :is(button,input,select,summary) { touch-action: manipulation; }
}