/* 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{margin:0;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}
.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-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}
