/* ===== HelmBridge modules: Service, Yard, Parts, Sales, work orders, customers, settings =====
   Uses the design tokens defined in index.html. */
.modnav{display:contents}
.rb .badge{position:absolute;top:4px;right:14px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#e6a23c;color:#12202a;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* Interaction bar */
.ibar-wrap{position:relative;margin-bottom:16px}
.ibar-row{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
.ibar-row .command{flex:1 1 420px;min-width:0}
.ibar-row .btn.big{padding:12px 18px;font-size:15px;border-radius:14px}
.ibar-res{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);margin-top:8px;overflow:hidden}
.ibar-res[hidden]{display:none}
.ir{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 14px;border-top:1px solid var(--line2);cursor:pointer}
.ir:first-child{border-top:0}
.ir:hover,.ir.sel{background:#f7f3eb}
.ir .k{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);min-width:74px}
.ir b{display:block;font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ir .s{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ir .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.ir-empty{padding:14px;color:var(--muted);font-size:13.5px}

/* Department page */
.dgrid{display:grid;gap:16px}
.sched-nav{display:flex;align-items:center;gap:6px}
.sched-nav button{border:1px solid var(--line);background:#fff;border-radius:999px;width:30px;height:30px;font-weight:700;color:var(--navy)}
.sched{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:12px}
.tech{background:#fff;border:1px solid var(--line2);border-radius:14px;padding:10px 12px}
.tech h3{font-size:14px;font-weight:700;display:flex;justify-content:space-between;gap:8px;margin-bottom:6px}
.tech h3 small{font-weight:500;color:var(--muted)}
.job{display:grid;grid-template-columns:52px minmax(0,1fr);gap:4px 10px;padding:8px 6px;border-top:1px solid var(--line2);border-radius:8px;text-decoration:none;color:inherit}
.job:first-of-type{border-top:0}
.job:hover{background:#f7f3eb}
.job .tm{font-size:12.5px;font-weight:700;color:var(--soft);font-variant-numeric:tabular-nums}
.job b{font-size:14px;font-weight:600;display:block}
.job .s{font-size:12.5px;color:var(--muted);display:block}

/* Boat + customer header (photo always visible) */
.bhead{display:grid;grid-template-columns:132px minmax(0,1fr);gap:16px;align-items:start}
.bphoto{width:132px;height:100px;border-radius:14px;background:#e9eef1 center/cover no-repeat;border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;position:relative;color:#8aa0b0}
.bphoto img{width:100%;height:100%;object-fit:cover;display:block}
.bphoto svg{width:54px;height:54px}
.bphoto.sm{width:64px;height:48px;border-radius:10px}.bphoto.sm svg{width:28px;height:28px}
.bphoto label{position:absolute;inset:auto 6px 6px auto;background:rgba(14,40,54,.78);color:#fff;font-size:11px;font-weight:600;border-radius:8px;padding:3px 7px;cursor:pointer}
.bname{font-family:"Instrument Serif",serif;font-size:26px;line-height:1.1}
.bsub{font-size:13.5px;color:var(--soft);margin-top:4px}
.cust{margin-top:10px;font-size:14px;line-height:1.5}
.cust a{font-weight:600}
.progress{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;border-radius:999px;padding:4px 10px;background:var(--gray-bg);color:var(--gray)}
.chip.ok{background:var(--ok-bg);color:var(--ok)}.chip.warn{background:var(--warn-bg);color:var(--warn)}.chip.bad{background:var(--bad-bg);color:var(--bad)}.chip.teal{background:var(--teal-soft);color:var(--teal-dk)}
@media (max-width:640px){.bhead{grid-template-columns:88px minmax(0,1fr);gap:12px}.bphoto{width:88px;height:70px}.bname{font-size:21px}}

/* Tasks on a work order */
.task{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:14px 16px;margin-top:12px}
.task-h{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.task-h b{font-size:16px}
.task .meta{font-size:13px;color:var(--muted);margin-top:4px}
.task .wp{font-size:14px;line-height:1.55;margin-top:10px;white-space:pre-wrap}
.task .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;align-items:center}
.dchip{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);margin-right:6px}
.ptable{width:100%;border-collapse:collapse;font-size:13.5px;margin-top:8px}
.ptable th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:5px 6px;border-bottom:1px solid var(--line)}
.ptable td{padding:6px;border-bottom:1px solid var(--line2);vertical-align:top}
.ptable td.n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.inline-form{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-top:10px;background:#fbf8f2;border:1px solid var(--line2);border-radius:12px;padding:10px}
.inline-form .f{flex:1 1 140px;min-width:0}
.inline-form .f label{display:block;font-size:12px;color:var(--muted);margin-bottom:3px}
.inline-form input,.inline-form select,.inline-form textarea,.wf select,.wf input,.wf textarea{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 10px;font-size:14px}
.inline-form textarea{min-height:64px}
.thumbs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.thumb{width:84px;height:66px;border-radius:10px;border:1px solid var(--line);background:#eef1f3;overflow:hidden;display:grid;place-items:center;font-size:11px;color:var(--muted);text-align:center;padding:4px;cursor:pointer;text-decoration:none}
.thumb img{width:100%;height:100%;object-fit:cover}
.timeline{font-size:13px;color:var(--soft)}
.timeline div{padding:6px 0;border-top:1px solid var(--line2);display:flex;gap:10px}
.timeline div:first-child{border-top:0}
.timeline span:first-child{color:var(--muted);white-space:nowrap;min-width:110px}

/* Technician work form */
.wf{display:grid;gap:14px}
.wf .f label{display:block;font-size:13px;font-weight:600;color:var(--soft);margin-bottom:5px}
.wf textarea{min-height:150px;font-size:15px;line-height:1.5}
.wf .hours input{max-width:160px;font-size:20px;font-weight:700}
.prow{display:grid;grid-template-columns:110px minmax(0,1fr) 70px 170px auto auto;gap:6px;align-items:center;margin-top:6px}
.prow input{padding:8px;min-width:0}
.prow label{font-size:12px;color:var(--soft);display:flex;gap:4px;align-items:center;white-space:nowrap}
.prow label input{width:auto}
.prow .x{border:0;background:none;color:var(--bad);font-size:18px;padding:0 6px}
.prow.head{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-top:0}
@media (max-width:640px){
  .prow{grid-template-columns:1fr 64px auto;grid-template-areas:"d d d" "pn q x" "pr rq rq"}
  .prow .pd{grid-area:d}.prow .pn{grid-area:pn}.prow .pq{grid-area:q}.prow .pp{grid-area:pr}.prow .rq{grid-area:rq}.prow .x{grid-area:x}
  .prow.head{display:none}
  .prow{border-top:1px solid var(--line2);padding-top:8px}
}
.stick{position:sticky;bottom:0;background:linear-gradient(transparent,var(--paper) 30%);padding:18px 0 6px;display:flex;gap:10px;flex-wrap:wrap}
.stick .btn{flex:1 1 180px;justify-content:center;padding:14px 16px;font-size:15.5px}

/* Sheets (Create work order, customer) */
.sheet-wrap{position:fixed;inset:0;background:rgba(15,28,38,.45);z-index:55;display:none;overflow:auto;padding:24px 16px}
.sheet-wrap.show{display:block}
.sheet{max-width:760px;margin:0 auto;background:var(--paper);border-radius:22px;box-shadow:0 24px 70px rgba(15,28,38,.35);overflow:hidden}
.sheet-h{background:var(--navy);color:#fff;padding:18px 22px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.sheet-h h3{font-family:"Instrument Serif",serif;font-weight:400;font-size:28px}
.sheet-h button{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:10px;padding:7px 12px;font-weight:600}
.sheet-b{padding:16px 20px 20px;display:grid;gap:14px}
.sheet-b .sec-t{margin-bottom:6px}
.pick{display:grid;gap:6px;max-height:260px;overflow:auto;margin-top:8px}
.pick button{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;align-items:center;text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;padding:8px}
.pick button:hover{border-color:#b8d4d2;background:#f7fbfa}
.pick b{display:block;font-size:14px}.pick span.s{display:block;font-size:12.5px;color:var(--muted)}
.trow{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.2fr) 140px auto;gap:8px;align-items:center;margin-top:8px}
.trow .route{font-size:12px;color:var(--teal-dk);font-weight:600}
@media (max-width:640px){.trow{grid-template-columns:1fr auto}.trow .tt,.trow .tb{grid-column:1/-1}}
.sheet-f{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;padding:0 20px 20px}

/* Settings */
.stable{width:100%;border-collapse:collapse;font-size:14px}
.stable th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:6px;border-bottom:1px solid var(--line)}
.stable td{padding:8px 6px;border-bottom:1px solid var(--line2);vertical-align:middle}
.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 4px;border-top:1px solid var(--line2)}
.toggle:first-of-type{border-top:0}
.toggle b{display:block}.toggle span{font-size:13px;color:var(--muted)}
.switch{position:relative;width:46px;height:26px;border-radius:13px;border:0;background:#cfd8dd;flex:none}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .15s}
.switch.on{background:var(--teal)}.switch.on::after{left:23px}
.switch:disabled{opacity:.5}
.checks{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13.5px}
.checks label{display:flex;gap:5px;align-items:center}
.money-t{font-variant-numeric:tabular-nums}
.inv-tot{display:grid;grid-template-columns:1fr auto;gap:4px 18px;font-size:14px;margin-top:10px;max-width:360px;margin-left:auto}
.inv-tot b{font-size:16px}
.wf .f label.btn{display:inline-flex;margin:0;font-size:14px;font-weight:600;color:#fff;cursor:pointer}
.wf .f label.btn.ghost{color:var(--navy)}
.bphoto > span{width:100%;height:100%;display:grid;place-items:center}
.trow select,.trow input{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 10px;font-size:14px;min-width:0}
.timeline span:first-child{flex:none}

/* ===== Parts (v0.6.0) ===== */
.prow .pinfo{grid-column:1/-1;font-size:12.5px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:-2px 0 4px}
.ppick .pick button{grid-template-columns:1fr}
.ptable tr.click:hover td{background:#f7f3eb}
.ptable select,.ptable input{border:1px solid var(--line);border-radius:8px;padding:5px 7px;background:#fff;font-size:13.5px}
.ibar-row .btn.ghost.big{padding:12px 16px}

/* ===== Yard (v0.7.0) ===== */
.bstat{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.bstat .chip{font-weight:600;line-height:1.3}
.bacts{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px;font-size:13px}
.sstat{margin:-2px 0 6px 76px}
.sstat .bstat{margin-top:0}
.mv{margin-top:10px;font-size:13.5px;line-height:1.5;background:#f2f8f7;border:1px solid #d3e6e3;border-radius:12px;padding:8px 10px}
.mv.done{background:var(--ok-bg);border-color:#cfe5d6}
.mv .muted{font-size:12.5px}
.sp-loc{border-top:1px solid var(--line2);padding-top:8px;margin-top:8px}
.sp-loc:first-of-type{border-top:0;margin-top:0;padding-top:0}
.sp-h{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:14px;margin-bottom:4px}
.sp-h .muted{font-size:13px}
.sp-area summary{cursor:pointer;display:flex;justify-content:space-between;gap:10px;padding:7px 4px;font-size:14px;font-weight:600;border-top:1px solid var(--line2);list-style:none}
.sp-area summary::-webkit-details-marker{display:none}
.sp-area summary::before{content:"▸";color:var(--muted);margin-right:6px}
.sp-area[open] summary::before{content:"▾"}
.sp-area summary span:first-child{flex:1}
.sp-area summary .muted{font-weight:500;font-size:13px}
.pkg-item{border:1px solid var(--line2);border-radius:12px;padding:8px 10px;margin-top:8px;background:#fff}
.pkg-item select,.pkg-item input{border:1px solid var(--line);border-radius:10px;padding:7px 9px;background:#fff;font-size:14px;min-width:0}
@media (max-width:640px){.sstat{margin-left:0}}

/* ===== Sales (v0.8.0) ===== */
.sqrow{display:grid;grid-template-columns:150px minmax(0,1fr) 70px 120px 64px 28px;gap:6px;align-items:center;margin-top:6px}
.sqrow input,.sqrow select{border:1px solid var(--line);background:#fff;border-radius:10px;padding:7px 9px;font-size:14px;min-width:0;width:100%}
.sqrow .ql-tax{font-size:12.5px;color:var(--soft);display:flex;gap:4px;align-items:center}
.sqrow .ql-tax input{width:auto}
.sqrow .x{border:0;background:none;color:var(--bad);font-size:18px;padding:0 4px}
.sqrow .pinfo{grid-column:2/-1;font-size:12.5px;margin:-2px 0 2px}
.sqrow.head{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-top:0}
.sqrow select:disabled{background:#f4f1ea;color:var(--soft)}
@media (max-width:640px){.sqrow{grid-template-columns:1fr 64px 28px;grid-template-areas:"k k x" "d d d" "q p t"}.sqrow .ql-kind{grid-area:k}.sqrow .ql-desc{grid-area:d}.sqrow .ql-qty{grid-area:q}.sqrow .ql-price{grid-area:p}.sqrow .ql-tax{grid-area:t}.sqrow .x{grid-area:x}.sqrow.head{display:none}.sqrow{border-top:1px solid var(--line2);padding-top:8px}}
.dsteps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.dstep{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.dstep span{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700}
.dstep b{font-size:14.5px}
.dstep small{font-size:12px;color:var(--muted)}
.dstep.ok{border-color:#cfe5d6;background:var(--ok-bg)}
.dstep.warn{border-color:#ecd9b0;background:var(--warn-bg)}
@media (max-width:760px){.dsteps{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Rentals: fleet availability grid (rentals.js) */
.rgrid{overflow-x:auto;margin:0 -4px;padding:0 4px}
.rrow{display:grid;grid-template-columns:minmax(220px,1.6fr) repeat(7,minmax(96px,1fr));gap:4px;border-top:1px solid var(--line2);padding:6px 0;min-width:900px}
.rrow.rhead{border-top:0;padding-top:0}
.rrow.sel{background:var(--teal-soft);border-radius:10px}
.rname{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:start;font-size:13.5px}
.rname b{display:block;font-size:14px}.rname .s{display:block;font-size:12px;color:var(--muted)}
.rname .bstat{margin-top:4px}.rname .bacts{margin-top:2px}
.rcell{position:relative;min-height:46px;border-radius:8px;background:#faf8f3;padding:4px;display:flex;flex-direction:column;gap:3px}
.rcell.h{min-height:0;background:none;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:2px 4px}
.rcell.free{background:#f3f8f5}
.rslot{display:block;font-size:11.5px;font-weight:600;border-radius:6px;padding:3px 6px;text-decoration:none;line-height:1.3;color:var(--teal-dk);background:var(--teal-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rslot.s-hold{background:var(--warn-bg);color:var(--warn)}
.rslot.s-requested{background:#fff;color:var(--muted);border:1px dashed var(--line)}
.rslot.s-checked_out{background:var(--ok-bg);color:var(--ok)}
.rslot.s-overdue{background:var(--bad-bg);color:var(--bad)}
.rslot.s-block{background:repeating-linear-gradient(45deg,#eee9df,#eee9df 6px,#e5dfd2 6px,#e5dfd2 12px);color:#5b5446}
.rslot.s-block .linkbtn{font-size:12px;padding:0 2px}
.rplus{position:absolute;right:3px;bottom:3px;border:0;background:none;color:var(--teal-dk);font-size:14px;line-height:1;opacity:0;cursor:pointer;padding:2px 4px}
.rcell:hover .rplus,.rplus:focus{opacity:1}
.rcell.free .rplus{opacity:.55}
.rlegend{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.rlegend .rslot{display:inline-block}
@media (max-width:640px){.rrow{min-width:780px;grid-template-columns:180px repeat(7,minmax(84px,1fr))}}