/* Global navigation ported from the V1 shell. Mobile-first. */
.global-nav-shell {
  position: sticky;
  top: calc(52px + env(safe-area-inset-top));
  z-index: 90;
  background: #fff;
  border-bottom: 1px solid #d8dfdb;
}

.primary-nav,
.utility-nav {
  width: 100%;
  margin: 0 auto;
  display: grid;
}

.primary-nav { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.utility-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #d8dfdb; }

.global-nav-btn {
  position: relative;
  min-width: 0;
  min-height: 58px;
  padding: 7px 3px 6px;
  border: 0;
  border-right: 1px solid #d8dfdb;
  border-radius: 0;
  background: #fff;
  color: var(--green);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.05;
}
.global-nav-btn:last-child { border-right: 0; }
.global-nav-btn svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.global-nav-btn .nav-plus {
  color: var(--gold);
  font-size: 31px;
  font-weight: 500;
  line-height: 20px;
}
.global-nav-btn.active:not(.nav-new) {
  color: var(--green);
  background: #f8faf8;
}
.global-nav-btn.active:not(.nav-new)::after {
  content: "";
  position: absolute;
  left: 22%; right: 22%; bottom: 0;
  height: 4px;
  border-radius: 4px 4px 0 0;
  background: var(--green);
}
.global-nav-btn.nav-new {
  background: var(--green);
  color: #fff;
  border-top: 3px solid var(--gold);
}
.global-nav-btn.nav-new .nav-plus { color: var(--gold); }
.global-nav-btn:active { transform: none; background: #f1f5f2; }
.global-nav-btn.nav-new:active { background: #123f2b; }

.utility-nav .global-nav-btn {
  min-height: 44px;
  padding: 7px 4px;
  flex-direction: row;
  gap: 6px;
  font-size: 12px;
}
.utility-nav .global-nav-btn svg { width: 18px; height: 18px; }

/* Active work list. */
.job-list-screen { display: grid; gap: 10px; }
.job-list-heading {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 24px;
  color: var(--green);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.job-list-heading::before {
  content: "";
  width: 4px;
  height: 18px;
  border-radius: 3px;
  background: var(--gold);
}
.job-list-heading::after { content: ""; height: 1px; flex: 1; background: #aeb8b3; }
.job-list-search {
  width: 100%;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #c7d2cc;
  border-radius: 10px;
  background: #fff;
  font-size: 16px;
}
.job-list-cards { display: grid; gap: 9px; }
.job-list-card {
  width: 100%;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-left: 4px solid #d98279;
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  text-align: left;
  box-shadow: var(--shadow);
}
.job-list-card.lithium { border-left-color: #c9a82a; }
.job-list-card-top { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.job-list-card-name { min-width: 0; font-size: 15px; font-weight: 900; line-height: 1.2; overflow-wrap: anywhere; }
.job-list-card-code { flex: 0 0 auto; color: var(--green); font-size: 10px; font-weight: 900; letter-spacing: .035em; }
.job-list-card-cart { margin-top: 4px; color: #46514b; font-size: 12.5px; font-weight: 750; }
.job-list-card-next { margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--line); display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: baseline; }
.job-list-card-next span { color: #6b7280; font-size: 9px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.job-list-card-next strong { min-width: 0; font-size: 12.5px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-list-card-due { color: #59645f; font-size: 11px; font-weight: 800; white-space: nowrap; }

@media (min-width: 701px) {
  .global-nav-shell { top: calc(58px + env(safe-area-inset-top)); }
  .primary-nav, .utility-nav { max-width: 100%; }
  .global-nav-btn { min-height: 66px; font-size: 13px; }
  .global-nav-btn svg { width: 25px; height: 25px; }
  .utility-nav .global-nav-btn { min-height: 50px; font-size: 13px; }
}

@media (min-width: 1000px) {
  .app-header-inner { max-width: 1280px; }
  .app-main { max-width: 1280px; }
  .primary-nav, .utility-nav { max-width: 1280px; }
  .job-list-cards { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* Dedicated Repair/Lithium directories — compact operational context without mixed-view stripes. */
.job-list-screen{display:grid;gap:9px}
.job-list-heading{margin:0 2px 1px}
.job-list-loading{padding:18px 12px;text-align:center;color:var(--muted);font-size:12px;font-weight:750}
.job-list-search{min-height:44px;padding:9px 12px;border-color:#c7d2cc;border-radius:9px;font-size:16px}
.job-entry-filter-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:0 0 1px}
.job-entry-filter-btn{min-height:42px;padding:8px 10px;border:1px solid #c7d2cc;border-radius:9px;background:#fff;color:#52605a;font-size:12px;font-weight:850;display:flex;align-items:center;justify-content:center;gap:7px}
.job-entry-filter-btn strong{font-size:11px;color:var(--green);font-weight:900}
.job-entry-filter-btn.active{border-color:#8fa69a;background:#f1f6f3;color:var(--green);box-shadow:inset 0 0 0 1px rgba(24,84,57,.06)}
.job-list-cards{display:grid;gap:10px}
.job-list-card{border:1px solid #d3dcd7;border-left:1px solid #d3dcd7;padding:14px;border-radius:14px;background:#fff;box-shadow:0 1px 0 rgba(17,78,54,.03)}
.job-list-card.lithium{border-left-color:#d3dcd7;background:#fffdf6}
.job-list-card.repair{border-left-color:#d3dcd7;background:#fffafa}
.job-list-card-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.job-list-card-identity{min-width:0;flex:1 1 0}
.job-list-card-identity-open{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;margin:0;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}
.job-list-card-identity-copy{display:block;min-width:0}
.job-list-card-identity-copy .job-list-card-name,.job-list-card-identity-copy .job-list-card-contact,.job-list-card-identity-copy .job-list-card-cart{display:block}
.job-list-card-open-chevron{align-self:center;color:#8a948f;font-size:22px;font-weight:500;line-height:1;padding:0 1px 0 3px}
.job-list-card-identity-open:focus-visible{outline:2px solid var(--green);outline-offset:4px;border-radius:4px}
.job-list-card-name{min-width:0;color:#1f2937;font-size:18px;font-weight:900;line-height:1.14;overflow-wrap:break-word;word-break:normal}
.job-list-card-contact{margin-top:3px;color:#66716b;font-size:12.5px;font-weight:750;line-height:1.25;overflow-wrap:break-word}
.job-list-card-meta{display:block;margin-top:4px;color:#66716b;font-size:11px;font-weight:800;line-height:1.25}
.job-list-card-cart{margin-top:5px;color:#53605a;font-size:12px;font-weight:700;line-height:1.3;overflow-wrap:break-word}
.job-list-card-tech{position:relative;display:grid;justify-items:end;gap:1px;flex:0 1 auto;min-width:72px;max-width:29%;margin:0;padding:8px 20px 8px 9px;border:1px solid #c7d2cc;border-top:3px solid var(--gold);border-radius:9px;background:#fff;text-align:right;cursor:pointer;font:inherit;box-shadow:none}
.job-list-card.repair .job-list-card-tech{border-top-color:#d98279}
.job-list-card-tech::after{content:"⌄";position:absolute;right:8px;top:50%;transform:translateY(-50%);color:#6b7280;font-size:11px;font-weight:900;line-height:1}
.job-list-card-tech:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.job-list-ops-grid span{color:#6b7280;font-size:9px;font-weight:900;letter-spacing:.035em;text-transform:uppercase}
.job-list-card-tech strong{max-width:100%;color:#374151;font-size:12px;font-weight:900;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.job-list-card-top{position:relative}

.job-list-tech-picker{position:absolute;right:0;top:calc(100% + 5px);z-index:60;width:min(230px,72vw);margin:0;padding:5px;border:1px solid #c7d2cc;border-radius:9px;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.job-list-tech-menu{display:grid;gap:0}
.job-list-tech-menu button{width:100%;min-height:40px;margin:0;padding:8px 9px;border:0;border-radius:7px;background:#fff;color:var(--text);font-size:12px;font-weight:750;text-align:left}
.job-list-tech-menu button+button{border-top:1px solid #edf0ee}
.job-list-tech-menu button.current{background:#f1f6f3;color:var(--green);font-weight:900}
.job-list-tech-menu button:hover{background:#f5f7f5}
.job-list-ops-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin-top:9px;padding-top:9px;border-top:1px solid #e0e5e2}
.job-list-ops-grid-single{grid-template-columns:1fr}
.job-list-ops-grid>div{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:baseline;min-width:0}
.job-list-ops-grid>div:nth-child(2){grid-template-columns:auto minmax(0,1fr)}
.job-list-ops-grid strong{min-width:0;color:#374151;font-size:12.5px;font-weight:850;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.job-list-latest-note{margin-top:9px;border-top:1px solid #e0e5e2;padding-top:9px}
.job-list-latest-note summary{list-style:none;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:baseline;cursor:pointer}
.job-list-latest-note summary::-webkit-details-marker{display:none}
.job-list-latest-note span{color:#6b7280;font-size:9px;font-weight:900;letter-spacing:.035em;text-transform:uppercase;white-space:nowrap}
.job-list-latest-note strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#374151;font-size:12.5px;font-weight:750;line-height:1.25}
.job-list-latest-note i{align-self:center;font-style:normal;color:#909a95;font-size:14px;transition:transform .15s ease}
.job-list-latest-note[open] i{transform:rotate(180deg)}
.job-list-latest-note>div{margin-top:7px;color:#46514b;font-size:12px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
.job-list-latest-note.empty{display:flex;align-items:baseline;gap:10px}
.job-list-latest-note.empty strong{font-weight:700;color:#7d8882}
.job-list-contact-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:11px}
.job-list-contact-actions a,.job-list-contact-actions button{min-height:40px;border:1px solid #c7d2cc;border-radius:9px;background:#fff;color:var(--green);font-size:11px;font-weight:900;text-decoration:none;display:flex;align-items:center;justify-content:center}
.job-list-contact-actions button:disabled{color:#9ca5a1;background:#f5f6f5}
.job-list-cost-editor{margin-top:8px}
.job-note-composer{margin-top:8px;padding:9px;border:1px solid #d5ddd9;border-radius:9px;background:rgba(255,255,255,.8)}
.job-note-composer textarea{width:100%;min-height:72px;resize:vertical}
.job-note-composer>div{display:flex;justify-content:flex-end;gap:7px;margin-top:7px}
@media(max-width:700px){.job-list-card{padding:13px}.job-list-contact-actions a,.job-list-contact-actions button{min-height:42px;font-size:11.5px}}

/* Utility omni-search entry — same four-slot utility geometry, icon-only presentation. */
.utility-nav .utility-search-nav{gap:0}
.utility-nav .utility-search-nav svg{width:20px;height:20px}

/* Closed/terminal jobs use the exact same control geometry as the Tech picker.
   Only interaction and chevron differ. */
.job-list-card-terminal{
  cursor:default;
  pointer-events:none;
}
.job-list-card-terminal::after{display:none}
.job-list-card.lithium .job-list-card-terminal{border-top-color:#c9a82a}
.job-list-card.repair .job-list-card-terminal{border-top-color:#d98279}
.job-list-card-terminal strong{overflow:hidden;text-overflow:ellipsis}

/* Buyers uses the same primary-navigation color language as the other work areas. */
.primary-nav .global-nav-btn.nav-buyers{color:var(--green)}
.primary-nav .global-nav-btn.nav-buyers.active{color:var(--green);background:#fff}
.primary-nav .global-nav-btn.nav-buyers.active::after{background:var(--green)}

/* Front-card Tech is informational only; edits happen in the deeper workflow. */
.job-list-card-tech-readonly{
  cursor:default;
  pointer-events:none;
  padding-right:9px;
}
.job-list-card-tech-readonly::after{display:none}

/* Restore original Tech badge/picker appearance while keeping inline assignment. */
.job-list-tech-wrap{position:relative;flex:0 0 auto;display:block}
.job-list-tech-wrap .job-list-card-tech{max-width:none;min-width:92px}
.job-list-tech-wrap .job-list-tech-picker{top:calc(100% + 5px)}


/* Module title actions — 2026-10-06 */
.job-list-title-row,.buyers-title-row{display:flex;align-items:center;gap:10px;min-width:0}
.job-list-title-row .job-list-heading,.buyers-title-row .buyers-heading{flex:1 1 auto;min-width:0}
.module-title-action{flex:0 0 auto;min-height:36px;padding:7px 11px;border:1px solid #b9c6bf;border-radius:8px;background:#fff;color:#174f36;font-size:12px;font-weight:850;line-height:1;white-space:nowrap}
.job-list-screen[data-job-list-type="Repair"] .module-title-action{color:#7c302b;border-color:#d7bbb8}
.job-list-screen[data-job-list-type="Lithium"] .module-title-action{color:#7b6420;border-color:#d9cca0}
.buyers-title-row .module-title-action{color:#285f8d;border-color:#b8cfe2}
@media(max-width:720px){.job-list-title-row,.buyers-title-row{gap:8px}.module-title-action{min-height:34px;padding:6px 9px;font-size:11px}}

/* 2026-10-06 — Repair/Lithium production card: Work Done By replaces Parts/Battery status. */
#app .job-list-work-done-by{
  margin-top:9px;
  padding-top:9px;
  border-top:1px solid #e0e5e2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
#app .job-list-work-done-by>span,
#app .job-list-work-done-by .job-list-card-tech strong{
  font-size:13px;
  line-height:1.2;
  font-weight:850;
}
#app .job-list-work-done-by>span{color:#374151;}
#app .job-list-work-done-by .job-list-tech-wrap{margin-left:auto;}
#app .job-list-card-tech-inline{border-top-width:1px!important;min-width:92px;}
#app .job-list-notes{
  margin-top:9px;
  border-top:1px solid #e0e5e2;
  border-bottom:1px solid #e0e5e2;
}
#app .job-list-notes>summary{
  min-height:58px;
  padding:9px 24px 9px 0;
  display:grid;
  grid-template-columns:70px minmax(0,1fr);
  gap:10px;
  align-items:center;
  position:relative;
  list-style:none;
  cursor:pointer;
}
#app .job-list-notes>summary::-webkit-details-marker{display:none}
#app .job-list-notes>summary span,
#app .job-list-notes>summary strong,
#app .job-list-note-row{
  font-size:13px;
  line-height:1.25;
  font-weight:850;
}
#app .job-list-notes>summary span{color:#374151;}
#app .job-list-notes>summary strong{color:#5f6964;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#app .job-list-notes>summary i{position:absolute;right:2px;top:50%;transform:translateY(-50%);font-style:normal;font-size:13px;font-weight:900;color:#626b66;}
#app .job-list-notes[open]>summary i{transform:translateY(-50%) rotate(180deg)}
#app .job-list-notes-history{padding:0 0 9px;display:grid;gap:6px;}
#app .job-list-note-row{padding:8px 9px;border:1px solid #d9dddb;border-radius:8px;background:#f8f9f8;color:#4e5752;white-space:pre-wrap;overflow-wrap:anywhere;}
#app .job-list-note-row.empty{color:#7d8581;}


/* STEP 14 — Repair/Lithium Work Done By accordion mirrors Notes */
#app .job-list-work-done-by{
  margin-top:9px;
  border-top:1px solid #e0e5e2;
  border-bottom:1px solid #e0e5e2;
  padding:0;
  display:block;
}
#app .job-list-work-done-by>summary{
  min-height:58px;
  padding:9px 24px 9px 0;
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:10px;
  align-items:center;
  position:relative;
  list-style:none;
  cursor:pointer;
}
#app .job-list-work-done-by>summary::-webkit-details-marker{display:none}
#app .job-list-work-done-by>summary span,
#app .job-list-work-done-by>summary strong{
  font-size:13px;
  line-height:1.25;
  font-weight:850;
}
#app .job-list-work-done-by>summary span{color:#374151;text-transform:uppercase;}
#app .job-list-work-done-by>summary strong{display:block;width:100%;padding-right:14px;color:#1f2937;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;line-height:1.2;font-weight:850;letter-spacing:0;text-transform:uppercase;}
#app .job-list-work-done-by>summary i{position:absolute;right:2px;top:50%;transform:translateY(-50%);font-style:normal;font-size:13px;font-weight:900;color:#626b66;}
#app .job-list-work-done-by[open]>summary i{transform:translateY(-50%) rotate(180deg)}
#app .job-list-work-done-options{padding:0 0 9px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
#app .job-work-done-choice{min-height:46px;border:1px solid #d3dad6;border-radius:9px;background:#fff;color:#4e5752;font-size:13px;font-weight:850;}
#app .job-work-done-choice.current{border-width:2px;}
#app .job-list-screen[data-job-list-type="Lithium"] .job-work-done-choice.current{border-color:#caa62d;color:#7b6420;}
#app .job-list-screen[data-job-list-type="Repair"] .job-work-done-choice.current{border-color:#df867f;color:#7c302b;}
#app .job-list-work-done-by + .job-list-notes{margin-top:0;border-top:0;}

/* STEP 15 — Repair/Lithium card typography parity with Home/Lead cards.
   13px is the standard front-card information size; only the primary name stays larger. */
#app .job-list-card .job-list-card-contact,
#app .job-list-card .job-list-card-cart,
#app .job-list-card .job-list-work-done-by>summary span,
#app .job-list-card .job-list-work-done-by>summary strong,
#app .job-list-card .job-list-notes>summary span,
#app .job-list-card .job-list-notes>summary strong,
#app .job-list-card .job-list-note-row,
#app .job-list-card .job-list-contact-actions a,
#app .job-list-card .job-list-contact-actions button {
  font-size:13px;
  line-height:1.2;
}
#app .job-list-card .job-list-work-done-by>summary span,
#app .job-list-card .job-list-notes>summary span {
  font-weight:850;
  letter-spacing:0;
  text-transform:uppercase;
}
#app .job-list-card .job-list-work-done-by>summary strong,
#app .job-list-card .job-list-notes>summary strong {
  font-weight:850;
}
#app .job-list-card .job-list-card-name {
  font-size:18px;
}


/* Step 16 — Repair/Lithium top-right job actions menu. */
.job-list-card-actions{position:relative;flex:0 0 auto;margin:0}
.job-list-card-actions>summary{list-style:none;min-width:112px;min-height:54px;padding:11px 16px;border:1px solid #c7d2cc;border-top:3px solid var(--gold);border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;color:#374151}
.job-list-card.repair .job-list-card-actions>summary{border-top-color:#d98279;color:#8f4039}
.job-list-card.lithium .job-list-card-actions>summary{color:#7d6200}
.job-list-card-actions>summary::-webkit-details-marker{display:none}
.job-list-card-actions>summary strong{font-size:13px;font-weight:900;letter-spacing:.02em;line-height:1}
.job-list-card-actions>summary i{font-style:normal;font-size:12px;font-weight:900;transition:transform .15s ease}
.job-list-card-actions[open]>summary i{transform:rotate(180deg)}
.job-list-card-actions-popover{position:absolute;right:0;top:calc(100% + 6px);z-index:75;width:min(210px,72vw);padding:5px;border:1px solid #c7d2cc;border-radius:10px;background:#fff;box-shadow:0 10px 26px rgba(0,0,0,.14)}
.job-list-card-actions-popover button{display:block;width:100%;min-height:42px;padding:9px 10px;border:0;border-radius:7px;background:#fff;color:#374151;text-align:left;font-size:13px;font-weight:800}
.job-list-card-actions-popover button+button{border-top:1px solid #edf0ee}
.job-list-card-actions-popover button:hover,.job-list-card-actions-popover button:focus-visible{background:#f4f7f5;color:var(--green)}
.job-list-handoff-panel{margin-top:10px}
.job-list-handoff-panel .inline-editor{margin:0}
@media(max-width:700px){.job-list-card-actions>summary{min-width:106px;min-height:52px;padding:10px 13px}.job-list-card-actions-popover{width:min(205px,74vw)}}


/* Unified first-layer menu geometry lives in menu-system-step21.css. */

.job-open-picker-overlay{position:fixed;inset:0;z-index:10050;background:rgba(20,26,23,.34);display:flex;align-items:flex-end;justify-content:center;padding:16px;}
.job-open-picker{width:min(560px,100%);max-height:min(72vh,620px);overflow:auto;border:1px solid #cbd4cf;border-radius:16px;background:#fff;padding:14px;box-shadow:0 18px 44px rgba(0,0,0,.2);}
.job-open-picker-head{display:flex;flex-direction:column;gap:3px;margin-bottom:10px;color:#374151}.job-open-picker-head strong{font-size:16px}.job-open-picker-head small{font-size:12px;color:#6b746f}
.job-open-picker-search-wrap{display:block;margin:0 0 10px}.job-open-picker-search{width:100%;min-height:46px;padding:10px 12px;border:1px solid #cbd4cf;border-radius:10px;background:#fff;color:#24313d;font:inherit;font-size:14px;outline:none}.job-open-picker-search:focus{border-color:#8da99b;box-shadow:0 0 0 2px rgba(23,79,54,.08)}.job-open-picker-empty{padding:18px 10px;text-align:center;color:#6b746f;font-size:13px}
.job-open-picker-list{display:grid;gap:7px}.job-open-picker-list button{min-height:54px;padding:10px 12px;border:1px solid #d6ddda;border-radius:10px;background:#fff;text-align:left;color:#374151}.job-open-picker-list button strong{display:block;font-size:14px}.job-open-picker-list button small{display:block;margin-top:3px;font-size:12px;color:#6b746f}.job-open-picker-cancel{width:100%;min-height:46px;margin-top:10px;border:1px solid #cbd4cf;border-radius:10px;background:#f5f6f5;color:#4b5550;font-size:13px;font-weight:850;}
#app .job-list-card-identity-static{cursor:default;}