/* TrailSurge V21 – compact left-aligned mobile and tablet branding */
@media(max-width:850px){
  header.top{justify-content:space-between!important;gap:12px!important}
  header.top>div:first-child:has(.top-title){order:0!important;margin:0 auto 0 0!important;flex:0 1 auto!important;min-width:0!important}
  header.top .top-title{justify-content:flex-start!important;text-align:left!important}
  header.top .top-title .mobile-header-logo{display:block;max-width:100%;width:124px;height:auto}
  header.top .top-actions,header.top>.simple-new-job{order:1!important}
}
@media(max-width:570px){header.top .top-title .mobile-header-logo{width:112px}header.top{gap:7px!important}header.top .top-actions{gap:6px}}
/* Simple in-person cleaning consent */
.v21-clean{padding:16px 17px!important;background:#fafbfb;border:1px solid #e4e7e7!important;border-radius:12px}
.v21-clean>legend{font-size:15px;font-weight:800;color:#242a2d;padding:0 6px}
.v21-clean-help{font-size:12px;line-height:1.6;color:#646b6e;margin:6px 0 13px}
.v21-legacy-choice{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;overflow:hidden!important;pointer-events:none!important;padding:0!important;border:0!important}
.v21-clean-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.v21-clean-option{position:relative;cursor:pointer;font-weight:400!important}
.v21-clean-option input{position:absolute;top:14px;left:13px;width:18px!important;height:18px!important;min-height:0!important;margin:0!important;accent-color:#263d46}
.v21-clean-option>span{min-height:111px;border:1.5px solid #dbe0e2;border-radius:10px;background:#fff;padding:13px 13px 13px 39px;display:flex;flex-direction:column;gap:5px;transition:background .1s,border-color .1s}
.v21-clean-option strong{color:#222e36;font-size:13px;line-height:1.35}
.v21-clean-option small{font-size:11px;font-weight:450;line-height:1.4;color:#657078}
.v21-clean-option b{font-size:16px;font-weight:800;margin-top:auto;color:#243a43}
.v21-clean-option input:checked+span{border-color:#315b6e;background:#f1f6f8}
.v21-clean-option input:focus-visible+span{outline:3px solid #5085a8;outline-offset:2px}
.v21-clean-summary{font-size:12px;font-weight:700;margin:12px 0 0;color:#31444d}
.v21-clean-agreement{margin-top:14px;padding:15px;border-radius:9px;background:#fff;border:1px solid #e0e4e5}
.v21-clean-explain{font-size:12px;line-height:1.5;color:#35434a;margin:0 0 12px}
.v21-consent{display:flex!important;align-items:flex-start;gap:11px;padding:12px;background:#f6f8f9;border-radius:8px;cursor:pointer}
.v21-consent input{width:20px!important;height:20px!important;min-height:0!important;margin:0!important;flex:none;accent-color:#2e5c70}
.v21-consent span{display:block}.v21-consent strong{display:block;font-size:13px;color:#27343a}.v21-consent small{display:block;font-size:11px;line-height:1.5;margin-top:3px;color:#657076}
@media(max-width:540px){.v21-clean-options{grid-template-columns:1fr}.v21-clean-option>span{min-height:87px}}
/* Dashboard print-tag lookup */
.v21-dashboard-job{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.v21-dashboard-job .v21-job-open{display:flex;gap:10px;align-items:center;min-width:0;flex:1;text-decoration:none;color:inherit}
.v21-dashboard-job .v21-job-open .job-main{flex:1;min-width:0}
.v21-job-actions{flex:none}.v21-inline-print{border:1px solid #d6e0e5;background:#fff;border-radius:7px;padding:8px 11px;font-size:11px;font-weight:750;color:#334852;white-space:nowrap}
.v21-inline-print:hover{background:#f2f6f7}
.v21-tag-dialog{width:min(540px,calc(100% - 28px));max-height:min(88vh,760px);border:1px solid #dfe6e9;border-radius:15px;box-shadow:0 18px 70px #091c2b30;padding:23px;background:#fff;color:#263742}
.v21-tag-dialog::backdrop{background:#101a2980}
.v21-tag-top{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;margin-bottom:17px}
.v21-tag-dialog h2{font-size:22px;margin:2px 0 5px}.v21-tag-dialog p{font-size:12px;color:#66747f;margin:0;line-height:1.5}
.v21-tag-top button{border:1px solid #dce4e8;border-radius:7px;background:#fff;padding:9px 13px;font-weight:650}
.v21-tag-dialog label{display:block;font-size:12px;font-weight:750;margin-bottom:6px}
.v21-tag-dialog input{display:block;width:100%;font:inherit;border:1px solid #d3dde3;border-radius:9px;padding:13px;margin-bottom:12px}
.v21-tag-matches{display:grid;gap:6px;overflow-y:auto;max-height:46vh}
.v21-tag-result{display:grid;grid-template-columns:1fr auto;text-align:left;border:1px solid #e3e9eb;background:#fff;border-radius:9px;padding:12px;gap:3px 10px;cursor:pointer}
.v21-tag-result:hover,.v21-tag-result:focus-visible{background:#f4f8f9;border-color:#b6cdd8}
.v21-tag-result strong{font-size:13px}.v21-tag-result span{font-size:12px;color:#53636f;grid-column:1}.v21-tag-result small{font-size:11px;color:#73828c;grid-column:2;grid-row:1}
.v21-tag-dialog .v21-tag-privacy{margin-top:12px;font-size:11px}
.v21-no-tags{padding:17px;text-align:center}
@media(max-width:570px){.v21-dashboard-job{align-items:stretch}.v21-dashboard-job .v21-job-open{width:100%;flex:1 0 100%}.v21-job-actions{margin-left:36px}.v21-inline-print{min-height:38px}.v21-tag-dialog{padding:17px}}
/* Dashboard tag printing – same dimensions and content as individual job tags */
.job-tag{display:none}
@media print{
  @page{size:A4;margin:12mm}
  body[data-ts-print="tag"] .app,body[data-ts-print="tag"] .mobile-bar,body[data-ts-print="tag"] dialog,body[data-ts-print="tag"] #printSheet{display:none!important}
  body[data-ts-print="tag"] #jobTag{display:block!important;position:static!important;width:96mm!important;padding:5mm!important;color:#152a3b!important;font:12px/1.45 Arial,sans-serif}
  body[data-ts-print="tag"] .tag-brand{display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:2px solid #333;padding-bottom:10px;margin-bottom:17px}
  body[data-ts-print="tag"] .tag-brand strong{font-size:20px;letter-spacing:1px}
  body[data-ts-print="tag"] .tag-brand small{font-size:9px;color:#444}
  body[data-ts-print="tag"] .tag-ref{font-size:29px;font-weight:800;overflow-wrap:anywhere;margin:10px 0}
  body[data-ts-print="tag"] .tag-customer{font-size:18px;font-weight:750;margin:9px 0 3px;overflow-wrap:anywhere}
  body[data-ts-print="tag"] .tag-bike{font-size:15px;margin-bottom:15px;overflow-wrap:anywhere}
  body[data-ts-print="tag"] .tag-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;padding:12px 0;border-top:1px solid #bbb;border-bottom:1px solid #bbb}
  body[data-ts-print="tag"] .doc-field small,body[data-ts-print="tag"] .doc-field span{display:block;overflow-wrap:anywhere}
  body[data-ts-print="tag"] .doc-field small{font-size:9px;color:#4f5963;margin-bottom:4px;font-weight:700;text-transform:uppercase}
  body[data-ts-print="tag"] .doc-field span{font-size:11px;font-weight:700;white-space:pre-wrap}
  body[data-ts-print="tag"] .tag-task{margin-top:20px;padding-top:10px;border-top:1px solid #bbb;break-inside:avoid}
  body[data-ts-print="tag"] .tag-task p{white-space:pre-line;margin:7px 0}
  body[data-ts-print="tag"] .tag-foot{margin-top:24px;font-size:9px;color:#555}
}

.v21-email-tracking{margin:16px 0;padding:14px;border:1px solid #dce6e9;border-radius:9px;background:#f5f9fa}
.v21-email-tracking strong{font-size:14px;color:#264350}.v21-email-tracking p{margin:6px 0;font-size:12px;line-height:1.5}.v21-email-tracking a{display:inline-flex;text-decoration:underline;font-weight:750;font-size:12px;color:#1a617f;margin:6px 0}.v21-email-tracking small{display:block;font-size:10px;color:#667b87}

.v21-quick-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.v21-quick-print{border:1px solid #d5e0e4;background:#fff;border-radius:8px;color:#294a5b;font-weight:750;font-size:12px;padding:10px 13px;cursor:pointer}.v21-quick-print:not(:disabled):hover{background:#eef6f8}.v21-quick-print:disabled{opacity:.5;cursor:default}

/* V24: header image only belongs on tablet/mobile. Fix giant logo on desktop. */
@media(min-width:851px){
 header.top .top-title .mobile-header-logo{display:none!important;width:0!important;height:0!important}
 header.top .top-title .desktop-header-brand{display:inline!important}
}
@media(max-width:850px){
 header.top .top-title .desktop-header-brand{display:none!important}
 header.top .top-title .mobile-header-logo{display:block!important;width:min(124px,34vw)!important;max-width:124px!important;height:auto!important;object-fit:contain!important}
 header.top .top-title{display:inline-flex!important;align-items:center!important;max-width:150px!important;min-width:0!important}
}
[hidden]{display:none!important}