/* Same look as the My jobs page techs know; buttons are big enough for dirty fingers. */
*{box-sizing:border-box}
body{font-family:Arial,Helvetica,sans-serif;margin:0;padding:12px 12px calc(96px + env(safe-area-inset-bottom));color:#202124;font-size:16px;background:#fff;-webkit-text-size-adjust:100%}
main{max-width:640px;margin:0 auto}
h2{margin:4px 0 2px;font-size:20px}h3.sec{margin:18px 0 0;font-size:17px}h3.warn{color:#b3261e}
.muted{color:#5f6368;font-size:14px}a{color:#1a73e8}
.msg{background:#f1f3f4;border-radius:10px;padding:12px;margin-top:12px}
.bar{position:sticky;top:0;z-index:5;margin:-12px -12px 8px;padding:8px 12px;background:#fef7e0;border-bottom:1px solid #f9cc6b;font-size:14px;text-align:center}
.job{border:1px solid #dadce0;border-radius:10px;padding:12px;margin-top:12px}
.job.late{border-color:#e57373;background:#fdf3f2}.job.done{background:#f1f3f4;color:#5f6368}
.badge{display:inline-block;background:#5f6368;color:#fff;border-radius:6px;padding:2px 8px;font-size:13px;font-weight:bold}
.when{font-weight:bold;color:#1a73e8}.done .when{color:#5f6368}
.name{font-size:18px;font-weight:bold;margin:2px 0}
.notes{white-space:pre-wrap;margin-top:8px}.anote{background:#fef7e0;border-radius:6px;padding:6px 8px}
.times{margin-top:8px;font-size:14px}.call{font-size:14px;margin-left:10px}
.ahead{border-top:1px solid #eee;padding:8px 0;font-size:15px}
.btn{display:block;width:100%;min-height:52px;text-align:center;background:#1a73e8;color:#fff;border:0;border-radius:10px;font-size:18px;font-weight:bold;margin-top:12px;padding:12px;cursor:pointer;font-family:inherit}
.btn.plain{background:#fff;color:#1a73e8;border:1px solid #1a73e8}.btn.go{background:#188038}.btn.off{background:#dadce0;color:#5f6368}
.btn.sm{min-height:44px;font-size:15px;margin-top:8px}.btn:disabled{opacity:.5}
.small{display:inline-block;margin-top:12px;padding:8px 0;font-size:15px}
details.cust,details.past,details.fin{margin-top:6px;font-size:14px}summary{color:#1a73e8;cursor:pointer;padding:6px 0}
.visit{border-top:1px solid #eee;padding:6px 0;white-space:pre-wrap}
.todo{margin-top:8px;font-size:14px;background:#fef7e0;border:1px solid #f9cc6b;border-radius:8px;padding:8px}.todo.clear{background:#f1f3f4;border-color:#dadce0}
.tick{display:flex;gap:10px;align-items:flex-start;padding:8px 6px;font-size:15px}.tick input{width:24px;height:24px;flex:none;margin:0}
.sheet{position:fixed;inset:0;background:rgba(32,33,36,.55);z-index:20;overflow:auto;-webkit-overflow-scrolling:touch}
.card{background:#fff;border-radius:12px;margin:5vh auto;max-width:560px;padding:16px;width:calc(100% - 24px)}
.card.low{margin-top:28vh}
label{display:block;margin-top:12px;font-weight:bold;font-size:15px}
input[type=time],textarea{width:100%;font-size:18px;padding:10px;border:1px solid #c4c7c5;border-radius:8px;font-family:inherit}
textarea{resize:vertical}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.row3 label{font-size:13px}
.trip{border-top:1px solid #eee;margin-top:10px;padding-top:4px}
.pics{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.pic{background:#f1f3f4;border-radius:8px;padding:8px 10px;font-size:14px}
.err{background:#fdf3f2;border:1px solid #e57373;color:#b3261e;border-radius:8px;padding:8px 10px;margin-top:10px}
.toast{position:fixed;left:12px;right:12px;bottom:calc(16px + env(safe-area-inset-bottom));background:#202124;color:#fff;border-radius:10px;padding:12px;text-align:center;z-index:30}

.badge.new{background:#d93025}
.thread{height:45vh;overflow:auto;background:#f8f9fa;border-radius:10px;padding:8px;margin:10px 0 6px;-webkit-overflow-scrolling:touch}
.bub{max-width:80%;padding:8px 10px;border-radius:14px;margin:6px 0;font-size:16px;white-space:pre-wrap;word-wrap:break-word}
.bub span{display:block;font-size:11px;opacity:.7;margin-top:2px}
.bub.in{background:#e8eaed;margin-right:auto}.bub.out{background:#1a73e8;color:#fff;margin-left:auto}.bub.bad{background:#b3261e}
.conv{display:block;border-bottom:1px solid #eee;padding:12px 4px;color:#202124;text-decoration:none}
.tabs{position:fixed;left:0;right:0;bottom:0;display:flex;background:#fff;border-top:1px solid #dadce0;z-index:10;padding-bottom:env(safe-area-inset-bottom)}
.tabs a{flex:1;text-align:center;padding:14px 8px;font-size:17px;font-weight:bold;text-decoration:none;color:#5f6368}.tabs a.on{color:#1a73e8;border-top:3px solid #1a73e8;margin-top:-1px}
body.hastabs{padding-bottom:calc(150px + env(safe-area-inset-bottom))}
[hidden]{display:none!important}