*{box-sizing:border-box}body{margin:0;background:#faf9fc;color:#292532;font:15px/1.5 Arial,sans-serif}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default}a{color:#7130bb}.shell{max-width:540px;margin:auto;background:white;min-height:100vh}header{padding:12px 20px 0}header img{display:block;width:150px;height:50px;object-fit:contain}main{padding:10px 20px 20px}h1{font-size:25px;line-height:1.2;margin:8px 0 16px;letter-spacing:-.6px}h2{font-size:17px;margin:0 0 5px}p{margin:8px 0 12px}.job{margin-bottom:16px}.job strong{font-size:18px}.job p{margin:2px 0;color:#655c6d}.job small,.muted{font-size:12px;color:#746a7c}.empty{border:1px dashed #d3c5e4;border-radius:10px;padding:20px;margin:16px 0;color:#675c73}.empty p{font-size:14px;margin:0}.primary{display:block;border:0;border-radius:9px;background:#7735c6;color:white;padding:13px 14px;text-align:center;text-decoration:none;width:100%;font-weight:600;min-height:48px}.primary:disabled{background:#eee9f4;color:#8e8498}.secondary{background:#f3edf9;color:#7131bc;margin-top:14px}.text-button{border:0;padding:10px 0;background:none;color:#7131bc;min-height:44px}.status{background:#fff8e7;color:#6f5414;border-radius:8px;padding:10px 12px;font-size:13px}.confirmed{font-size:12px;color:#386848;margin:6px 0}.map{height:225px;border-radius:9px;overflow:hidden;background:#ede9f1;margin:8px 0 12px;z-index:0}.pin{width:20px!important;height:20px!important;background:#7735c6;border:3px solid white;border-radius:50%;box-shadow:0 1px 7px #0008}.leaflet-control-attribution{font-size:10px!important}.note{white-space:pre-wrap;padding:12px 0;margin:0;font-size:15px}.customer-photo{max-width:100%;width:100%;max-height:330px;object-fit:contain;border-radius:8px;margin:6px 0}.map-actions{display:flex;justify-content:space-between;gap:20px}.map-actions button{font-size:13px}fieldset{border:0;margin:0;padding:0}legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.contact{border:1px solid #e5dfec;border-radius:10px;margin:14px 0;padding:14px}.contact label{display:flex;align-items:center;gap:10px;border-top:1px solid #eee9f4;padding:12px 0;cursor:pointer;min-height:48px;font-size:14px}.contact label span{overflow-wrap:anywhere;min-width:0}.contact input{width:17px;height:17px;flex-shrink:0;accent-color:#7735c6}textarea{display:block;resize:vertical;width:100%;border:1px solid #d8cede;border-radius:8px;padding:10px;margin:6px 0 14px;font-size:16px}#photo-input{display:block;width:100%;margin:8px 0 12px;font-size:13px}#notice{font-size:13px;color:#6f3b25;overflow-wrap:anywhere}.build{font-size:12px;color:#73677d;border-left:3px solid #c9ace9;padding-left:10px;margin:0 0 20px}footer{text-align:center;font-size:11px;color:#897d93;padding:12px;border-top:1px solid #eee9f2}[hidden]{display:none!important}:focus-visible{outline:3px solid #b28bdd;outline-offset:3px}@media(max-width:360px){main{padding:8px 14px 16px}header{padding-left:14px}.map{height:195px}h1{font-size:23px}}

select{font:inherit;font-size:16px;min-height:48px;border:1px solid #d8cede;border-radius:8px;background:white;padding:8px;color:#292532;width:100%}.maps-choice{font-size:12px;color:#746a7c;margin:0;display:flex;align-items:center;justify-content:center;gap:5px}.maps-choice .text-button{font-size:12px;padding:6px}.maps-picker{padding:12px 0}.maps-picker label{display:block;font-weight:600;margin-bottom:8px}.maps-select{display:grid;gap:8px}.maps-picker .muted{margin:6px 0 0}.maps-picker #cancel-maps{padding:4px 0}

.desktop-modal .shell{min-height:0}

.desktop-modal header img{height:40px}.desktop-modal main{padding-top:8px;padding-bottom:14px}.desktop-modal h1{margin-bottom:12px}.desktop-modal footer{padding:7px}.desktop-window-viewport{position:fixed;inset:0;pointer-events:none;visibility:hidden}

.settings-shell{max-width:760px}.settings-shell main{padding:12px 28px 20px}.settings-shell header{padding-left:28px}.settings-intro{color:#655c6d;max-width:600px}.template-help{font-size:12px;background:#f7f3fb;padding:12px;border-radius:8px;color:#655c6d}.template-help code{color:#7130bb;font-size:12px}.template-section{border-top:1px solid #eee9f4;padding-top:16px;margin-top:18px}.template-section label{display:block;font-size:13px;font-weight:600;margin-top:10px}.template-section textarea{font-size:14px;margin-bottom:6px}.template-section input{width:100%;padding:10px;border:1px solid #d8cede;border-radius:8px;margin:6px 0;font-size:14px;color:inherit}.template-section .muted{margin:4px 0}#template-status{font-size:13px;color:#65458b;white-space:pre-wrap}#template-status:empty{display:none}#template-preview{margin:20px 0;font-size:13px}#template-preview summary{cursor:pointer;color:#7130bb;padding:6px 0}#template-preview h3{font-size:13px;margin:16px 0 5px}.message-preview{white-space:pre-wrap;overflow-wrap:anywhere;padding:12px;background:#f7f5fa;border-radius:8px}#preview-error{color:#963b24}.settings-shell .primary{max-width:240px}#preview-email_subject{overflow-wrap:anywhere}@media(max-width:500px){.settings-shell main{padding:10px 20px 20px}.settings-shell header{padding-left:20px}.template-section input,.template-section textarea{font-size:16px}}

#usage-totals {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;margin:20px 0} #usage-totals[hidden]{display:none} #usage-totals dt {color:var(--muted,#625b71)} #usage-totals dd {margin:0;font-weight:650;text-align:right}

/* Optional entrance trial. */
.access-pin{background:#167a5a!important;border:3px solid white!important;box-shadow:0 0 0 2px #167a5a!important}
#access-panel{margin:16px 0 24px;padding:17px 0;border-top:1px solid #dad5df;border-bottom:1px solid #dad5df}
.access-row{display:flex;align-items:center;gap:14px}
.access-copy{flex:1;min-width:0}
#access-title{font-size:16px;margin:0 0 5px}
#access-panel #access-status{font-size:14px;color:#655c6d;margin:0}
#access-panel .primary{background:#fff;color:#7131bc;border:1px solid #c9ace9}
#access-panel #add-access{flex:none;padding:0 14px;min-height:44px;margin:0;border:1px solid #b8a6cc;border-radius:5px;color:#7131bc;background:#fff;font-weight:600}
#access-editor{margin:0 0 12px;padding:12px;background:#f7f3fb;border:1px solid #d3c5e4;border-radius:9px}
#access-instruction{font-size:14px;margin:0 0 10px;color:#49365e}
.entrance-confirm-actions{display:flex;align-items:center;gap:16px}
.entrance-confirm-actions .primary{flex:1}
.entrance-confirm-actions .text-button{flex:none;padding:10px 4px}
#customer-map{scroll-margin-top:12px}
.send-location-bar{position:sticky;top:0;z-index:500;padding:8px 0;background:white}
.optional-hint{font-size:12px;color:#655c6d;margin:2px 0 12px}
.road-credit{font-size:10px;line-height:1.4;margin-top:20px}
#customer-form-view .job{margin-bottom:8px}
#customer-form-view h1{margin-bottom:10px}
@media(max-width:540px){#customer-map{height:clamp(150px,25svh,200px)}}
#access-panel button{margin:4px 8px 4px 0}
#access-panel p{margin:6px 0 12px}

/* Billing lives outside the ServiceM8 frame. */
#billing-consent-row{display:flex;gap:12px;align-items:flex-start;margin:20px 0}
#billing-consent{width:20px;height:20px;min-height:20px;flex:none;margin-top:4px}
#billing-controls .secondary,#admin-content .secondary,#billing-open,.account-actions .secondary{font:inherit;border:1px solid #c9b8de;background:#fff;color:#6331a5;border-radius:8px;padding:12px 16px;margin:8px 8px 8px 0;cursor:pointer}
#billing-controls .primary,#billing-controls .text-button{margin:8px 8px 8px 0}
#billing-invoices p{padding:14px 0;border-bottom:1px solid #eee8f3}
#admin-accounts h2{overflow-wrap:anywhere}

#request-actions.with-copy-link{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start;margin-top:14px}
#request-actions.with-copy-link #request-button{margin-top:0}
.copy-link-button{background:#fff;color:#7131bc;border:1px solid #bca5d3;padding:12px 10px}
#copy-link-helper{margin:8px 0 0;line-height:1.5}
#copy-link-status{font-size:13px;overflow-wrap:anywhere;margin-top:14px}
#copy-link-status.copy-success{color:#386848}
#copy-link-fallback{font-size:13px;margin:10px 0}
#customer-link{display:block;width:100%;padding:10px;margin-top:6px;color:#292532;border:1px solid #bca5d3;border-radius:7px;font-size:14px}
@media(max-width:440px){#request-actions.with-copy-link{grid-template-columns:1fr}}

.billing-confirmation{margin:18px 0;padding:18px 20px;border:1px solid #cec3df;border-left-width:5px;border-radius:10px;background:#f6f2fb;color:#32233f}
.billing-confirmation strong{display:block;font-size:18px;line-height:1.4}
.billing-confirmation p{margin:8px 0 0;font-size:14px;line-height:1.55}
.billing-confirmation.success{background:#eef8f0;border-color:#7aaa86;color:#234c2c}
.billing-confirmation.warning{background:#fff6e8;border-color:#c59142;color:#6b4512}

#billing-agreement{background:#f8f4fc;border:1px solid #e4d8f0;border-radius:10px;padding:16px;margin:16px 0}#billing-agreement p{font-size:14px}#billing-consent-row{display:flex;align-items:flex-start;gap:10px;margin:16px 0;font-size:14px}#billing-consent{flex:0 0 20px;width:20px;height:20px;margin:2px 0;accent-color:#7735c6}#billing-agreement-records{font-size:13px;margin:14px 0;overflow-wrap:anywhere}

.billing-return-help { display: none; }
.billing-return-help:target { display: block; }

.account-actions{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.account-actions button{max-width:100%}#account-request-confirmation{padding:16px;border:1px solid #d8c7eb;border-radius:12px;margin:16px 0}#account-request-confirmation label{display:flex;gap:10px;align-items:flex-start}#account-request-consent{width:auto;margin-top:5px;flex:none}#account-request-list p{overflow-wrap:anywhere}#account-data-status:empty{display:none}
