/* Premium task surface
   Long forms keep their context and a clear way back without becoming another app shell. */

.route-jobs .job-workspace:not([data-job-view="overview"]) .job-task-bar{
  /* Section navigation stays sticky; this context row must scroll beneath it. */
  position:relative;
  min-height:56px;
  margin:0 0 18px;
  padding:8px 0;
  border-bottom:1px solid var(--jobs-line);
  background:color-mix(in srgb,var(--sp-premium-paper,var(--card)) 90%,transparent);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  animation:sp-task-bar-in 240ms var(--sp-motion-ease,ease) both;
}
.route-jobs .job-task-bar .job-back{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  margin:0;
  padding:0 0;
  color:#5f655f;
  font-size:.8rem;
  font-weight:600;
}
.route-jobs .job-task-bar .job-back::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:8px;
  height:1px;
  background:var(--brand-gold);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 220ms var(--sp-motion-ease,ease);
}
.route-jobs .job-task-bar .job-back:hover{
  color:#80683d;
}
.route-jobs .job-task-bar .job-back:focus-visible{
  outline:2px solid color-mix(in srgb,var(--brand-gold) 62%,transparent);
  outline-offset:3px;
}
@media(hover:hover) and (pointer:fine){
  .route-jobs .job-task-bar .job-back:hover::after{transform:scaleX(1)}
}
.route-jobs .job-task-bar>span{
  color:#8a7047;
  font-size:.66rem;
  line-height:1.4;
  font-weight:700;
  letter-spacing:.085em;
  text-transform:uppercase;
}

/* A task should feel like one focused workspace, not a nested card stack. */
.route-jobs .job-workspace[data-job-view="task"] .job-tools{
  grid-template-columns:minmax(0,1fr);
  border:0;
  border-top:1px solid var(--jobs-line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
.route-jobs .job-workspace[data-job-view="task"] .job-tool-workspace{
  background:transparent;
}
.route-jobs .job-workspace[data-job-view="task"] .job-tool-panel>.job-panel{
  padding:22px 0 4px;
  background:transparent;
}
.route-jobs .job-workspace[data-job-view="task"] .job-quote-panel::before{
  content:none;
}
.route-jobs .job-workspace[data-job-view="task"] .job-quick-scheduler{
  margin-top:0;
  padding:22px;
  border:1px solid var(--jobs-line);
  border-radius:8px;
  background:var(--sp-premium-paper,var(--card));
  box-shadow:0 12px 34px rgba(20,21,21,.035);
}
.route-jobs .job-workspace[data-job-view="task"] [data-job-task-active]{
  animation:sp-task-surface-in 280ms var(--sp-motion-ease,ease) both;
}

/* Record mode gets the same calm context bar. */
.route-jobs .job-workspace[data-job-view="record"] .job-task-bar{
  margin-bottom:20px;
}

/* Laptop tabs already provide the section name and a direct route to Overview. */
@media(min-width:901px){
  .route-jobs .job-workspace[data-job-view="task"]>.job-task-bar{display:none}
  .route-jobs .job-workspace[data-job-view="task"] .job-tools{border-top:0}
  .route-jobs .job-workspace[data-job-view="task"] .job-tool-panel>.job-panel{padding-top:4px}
  .route-jobs .job-workspace[data-job-view="task"] .job-survey-form{gap:14px;margin-top:12px}
  .route-jobs .job-workspace[data-job-view="task"] .job-survey-measurements{margin:2px 0;padding-top:12px}
  .route-jobs .job-workspace[data-job-view="task"] .job-survey-extra{gap:8px;padding-top:0}
  .route-jobs .job-workspace[data-job-view="task"] .job-measurement-opening{padding:0;border:0;border-radius:0;background:transparent}
  .route-jobs .job-workspace[data-job-view="task"] .job-survey-group>legend{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
  .route-jobs .job-workspace[data-job-view="task"] .job-notes-disclosure[open]>summary>.job-survey-action{display:none}
}

@keyframes sp-task-bar-in{
  from{opacity:0;transform:translate3d(0,-5px,0)}
  to{opacity:1;transform:none}
}
@keyframes sp-task-surface-in{
  from{opacity:0;transform:translate3d(0,6px,0)}
  to{opacity:1;transform:none}
}

@media(max-width:720px){
  .route-jobs .job-workspace:not([data-job-view="overview"]) .job-task-bar{
    min-height:54px;
    margin:0 -18px 14px;
    padding:6px 18px;
    background:color-mix(in srgb,var(--sp-premium-paper,var(--card)) 92%,transparent);
  }
  .route-jobs .job-task-bar{
    align-items:center;
  }
  .route-jobs .job-task-bar>span{
    padding-top:0;
    text-align:right;
  }
  .route-jobs .job-workspace[data-job-view="task"] .job-quick-scheduler{
    padding:18px;
    border-radius:7px;
  }
}

@media(prefers-reduced-motion:reduce){
  .route-jobs .job-workspace:not([data-job-view="overview"]) .job-task-bar,
  .route-jobs .job-workspace[data-job-view="task"] [data-job-task-active]{
    animation:none!important;
  }
}


/* A site-record question needs its own visible return route at every width. */
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"]>.job-task-bar:not([hidden]){display:flex;min-height:44px;padding:0;margin:0 0 16px;border:0;background:none;backdrop-filter:none;animation:none}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"]>.job-task-bar>span{display:none}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] .job-back{font-size:.9375rem}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] [data-job-survey]>summary{display:none}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] .job-survey-plan-link{display:none}
/* The site record sits on the page itself, not in a card within a card. */
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] [data-job-survey]{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] [data-job-survey][data-survey-focus] .job-site-apprentice{gap:8px;padding-top:0}
/* The step indicator already names the section; keep the heading for assistive technology and show the requirement. */
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] .job-survey-section-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] .job-survey-measurements>h3 small{margin:0;font-size:.8125rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--sp-shell-muted,var(--muted))}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] .job-survey-measurements>.job-hint{margin:4px 0 12px;font-size:.875rem;line-height:1.5}
.route-jobs .job-workspace[data-job-view="task"][data-job-task="survey"] .job-survey-form{margin-top:0;gap:20px!important}
.route-jobs .job-survey-context{padding-bottom:0;border-bottom:0}
.route-jobs .job-survey-choice-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.route-jobs .job-survey-choice-buttons .job-survey-choice{min-width:0}
/* Answers: slightly tighter, still a 48px minimum target; larger text grows the button. */
.route-jobs .job-survey-choice-buttons .job-survey-choice span{height:100%;min-height:48px;text-align:center;font-size:1rem;padding:8px 10px}
/* One compact save bar: a quiet Save only beside the primary Save · next, clear of the bottom navigation. */
.route-jobs .job-survey-form .job-survey-actions{position:sticky;bottom:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;margin:0;padding:10px 0;border-top:1px solid var(--line);background:var(--sp-premium-paper,var(--card,#fff))}
.route-jobs .job-survey-form .job-survey-actions [data-survey-status]{order:-1;flex:1 0 100%;font-size:.8125rem;line-height:1.35;color:var(--sp-shell-muted,var(--muted))}
.route-jobs .job-survey-form .job-survey-actions [data-survey-status]:empty{display:none}
.route-jobs .job-survey-form .job-survey-actions button{width:auto;min-height:48px;margin:0}
.route-jobs .job-survey-form .job-survey-actions button:not(.primary){padding:0 14px;border-color:var(--line);background:transparent;color:var(--ink);box-shadow:none}
.route-jobs .job-survey-form .job-survey-actions [data-survey-save-next]{flex:1 1 180px;min-height:52px;padding-inline:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Showing stoves sits under More actions, below the save bar, so Save · next stays the one route through the survey. */
.route-jobs .job-survey-form .job-survey-more{margin:8px 0 0}
.route-jobs .job-survey-form .job-survey-more>summary{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--sp-shell-muted,var(--muted));font-size:.875rem;font-weight:600;cursor:pointer}
.route-jobs .job-survey-form .job-survey-more [data-survey-browse]{min-height:44px;margin:4px 0 0}
@media(max-width:720px){.route-jobs .job-survey-form .job-survey-actions{bottom:calc(var(--sp-phone-nav-h) + env(safe-area-inset-bottom,0px))}}
@media(max-width:600px){.route-jobs .job-survey-choice-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-height:480px){.route-jobs .job-survey-form .job-survey-actions{position:static}}

/* Entering a task animates; a save refreshing the same task does not (data-job-task-restored). */
.route-jobs .job-workspace[data-job-task-restored] .job-task-bar,
.route-jobs .job-workspace[data-job-task-restored] [data-job-task-active]{animation:none}