/* Local service-detail tabs reuse the public form palette without touching gallery artwork. */
.quote-service-details,.quote-extras{--sd-ink:#091f3e;--sd-muted:#475f79;--sd-soft:#f1f8ff;--sd-line:#d5e1ed;--sd-accent:#007bd1;--sd-error:#b52236;min-width:0;margin:8px 0;padding:10px;border:1px solid var(--sd-line);border-radius:12px;background:var(--sd-soft);color:var(--sd-ink);box-sizing:border-box}
html[data-theme=dark] :is(.quote-service-details,.quote-extras){--sd-ink:#eff6ff;--sd-muted:#b4c7dc;--sd-soft:#0c2036;--sd-line:#2b4661;--sd-accent:#67d4ff;--sd-error:#ffa3ad}
#quote-form .quote-service-details .sd-help{font-size:12px;line-height:1.4;color:var(--sd-muted);margin:0 0 7px}
#quote-form .sd-tabs{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0}
#quote-form .sd-tabs>button{display:flex;flex:1 1 105px;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:5px 8px;border:1px solid var(--sd-line);border-radius:8px;background:transparent;color:var(--sd-ink);font:inherit;font-size:12px;text-align:left;cursor:pointer;transition:background .2s ease-in-out,border-color .2s ease-in-out}
#quote-form .sd-tabs>button[aria-selected=true]{background:#007bd1;border-color:#007bd1;color:white}
#quote-form .sd-tabs>button:focus-visible{outline:3px solid var(--sd-accent);outline-offset:2px}
#quote-form .sd-tabs .sd-tab-state{font-size:10px;font-weight:400;opacity:.9}
#quote-form .sd-panel{min-width:0;margin:0;padding:7px 0 0;border:0;border-top:1px solid var(--sd-line)}
#quote-form .sd-panel legend{font-size:13px;font-weight:650;padding:0 6px 0 0;color:var(--sd-ink)}
#quote-form .sd-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 9px}
#quote-form .sd-field{min-width:0}
#quote-form .sd-field>label:not(.sd-check){display:block;margin:0 0 3px;font-size:12px;line-height:1.4;color:var(--sd-ink)}
#quote-form .sd-field>:is(input,select){width:100%;max-width:100%;min-width:0;box-sizing:border-box;margin:0;padding:6px 8px;min-height:34px;border:1px solid var(--sd-line);border-radius:7px;background-color:var(--sd-soft);color:var(--sd-ink);font:inherit;font-size:13px}
#quote-form .sd-field select option{background:var(--sd-soft);color:var(--sd-ink)}
#quote-form .sd-field input:disabled{opacity:.55}
/* Native checkbox values and keyboard behavior, dressed like the Driveway service tile. */
#quote-form .sd-check{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:5px;min-height:28px;box-sizing:border-box;margin:4px 0 0;padding:4px 7px;border:1px solid var(--sd-line);border-radius:8px;background:var(--sd-soft);font-size:12px;line-height:1.4;color:var(--sd-ink);cursor:pointer;transition:border-color .18s,background .18s,box-shadow .18s}
#quote-form .sd-check .service-toggle-name{min-width:0;font-weight:650;overflow-wrap:anywhere}
#quote-form .sd-check .service-toggle-track{width:26px;height:15px;border-radius:20px;background:var(--sd-muted);position:relative;opacity:.7}
#quote-form .sd-check .service-toggle-track:after{content:"";position:absolute;width:11px;height:11px;top:2px;left:2px;border-radius:50%;background:#fff;transition:transform .18s}
#quote-form .sd-check .service-toggle-state{font-size:9px;min-width:14px;text-transform:none}
#quote-form .sd-check .toggle-on{display:none}
#quote-form .sd-check:has(input:checked){border-color:#008deb;background:linear-gradient(120deg,#007bd1,#0063ae);color:#fff}
#quote-form .sd-check:has(input:checked) .toggle-on{display:inline}
#quote-form .sd-check:has(input:checked) .toggle-off{display:none}
#quote-form .sd-check:has(input:checked) .service-toggle-track{background:#fff7;opacity:1}
#quote-form .sd-check:has(input:checked) .service-toggle-track:after{transform:translateX(11px)}
#quote-form .sd-check:has(input:focus-visible){outline:3px solid var(--sd-accent);outline-offset:2px}
#quote-form .sd-check:hover{border-color:#008deb;box-shadow:0 4px 10px #057ed315}
#quote-form .sd-check:has(input:disabled){opacity:.55;cursor:default}
#quote-form .sd-check>input{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;opacity:0;pointer-events:none}
#quote-form .sd-field-error,#quote-form .sd-panel-error{display:block;color:var(--sd-error);font-size:12px;line-height:1.4;margin:5px 0 0}
#quote-form .sd-wide{grid-column:1/-1}
#quote-form .quote-service-details [hidden]{display:none!important}
/* Selected panels share the tallest natural track, including narrow-screen and error content.
   Inactive tabs retain their answers but stay invisible and inert; unselected services add no height.
   Without JavaScript the questions remain in their original stacked layout. */
#quote-form .quote-service-details.sd-tabbed .sd-panels{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;min-width:0}
#quote-form .quote-service-details.sd-tabbed .sd-panels>.sd-panel{grid-area:1/1;align-self:stretch;box-sizing:border-box}
#quote-form .quote-service-details.sd-tabbed .sd-panels>.sd-panel[hidden]:not(:disabled){display:block!important;visibility:hidden;pointer-events:none}
@media(max-width:480px){#quote-form .sd-fields{grid-template-columns:minmax(0,1fr)}:is(.quote-service-details,.quote-extras){padding:8px}#quote-form .sd-tabs>button{flex-basis:calc(50% - 6px)}}
@media(prefers-color-scheme:dark){html:not([data-theme]) :is(.quote-service-details,.quote-extras){--sd-ink:#eff6ff;--sd-muted:#b4c7dc;--sd-soft:#0c2036;--sd-line:#2b4661;--sd-accent:#67d4ff;--sd-error:#ffa3ad}}
@media(prefers-reduced-motion:reduce){#quote-form .sd-tabs>button{transition:none}}

/* Compact only the shared public quote form; unrelated admin/login forms keep their spacing. */
#quote.quote-card{padding:20px}
#quote .required-note{margin:4px 0 8px;line-height:1.4}
#quote-form .form-row{gap:7px 9px;margin-bottom:8px}
#quote-form .field label{margin-bottom:3px}
#quote-form .field input{height:34px;padding:5px 8px}
#quote-form .field textarea{padding:6px 8px;min-height:60px}
#quote-form .details-meta{margin-top:3px}
#quote-form .address-fields .field select{min-height:34px;padding:5px 8px}
#quote-form .sd-field>select.quote-native-select,#quote-form .address-fields .field>select.quote-native-select{padding-right:42px}
#quote-form .address-provider-note{margin-bottom:6px}
#quote-form .address-review{padding:8px 10px;margin:8px 0}
#quote-form .vr-service-picker{margin-bottom:7px}
#quote-form .vr-service-picker .service-chips{gap:5px}
/* Bin-count uncertainty shares the service-selection tile height and touch target. */
#quote-form .vr-service-picker .service-chip,
#quote-form #sd-panel-trash_bins [data-sd-key=quantity_unknown]>.sd-check{padding:4px 7px;min-height:34px}
#quote-form .consent-wrap{margin:7px 0}
#quote-form .quote-submit{min-height:40px;padding:7px 10px}
#quote-form .verification-box{padding:6px 8px;margin:8px 0}
#quote-form .verification-box legend{font-size:11px}
#quote-form .verification-hint{line-height:1.35;margin:0 0 5px}
#quote-form .verification-options{gap:5px;margin:0 0 3px}
#quote-form .verification-option span{min-height:36px;font-size:18px}
#quote-form .verification-refresh{min-height:30px;padding:2px 5px}
#quote-form .verification-status,#quote-form .verification-privacy{line-height:1.35;margin:3px 0 0}
#quote-form .quote-extra-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin:0 0 7px}
#quote-form .quote-extra-tabs>button{min-width:0;min-height:34px;padding:5px 7px;border:1px solid var(--sd-line);border-radius:7px;background:transparent;color:var(--sd-ink);font:inherit;font-size:12px;line-height:1.35;cursor:pointer;transition:background-color .2s ease-in-out,color .2s ease-in-out}
#quote-form .quote-extra-tabs>button[aria-selected=true]{background:#007bd1;border-color:#007bd1;color:#fff}
#quote-form .quote-extra-tabs>button[aria-selected=true] .optional-label{color:inherit}
#quote-form .quote-extra-tabs>button:focus-visible{outline:3px solid var(--sd-accent);outline-offset:2px}
#quote-form .quote-extras [hidden],#quote-form .quote-service-details[hidden]{display:none!important}
#quote-form .quote-extras .client-uploads{margin:0;padding:0;border:0;background:transparent}
#quote-form .client-uploads-heading{margin-bottom:5px}
#quote-form .client-uploads p.client-upload-help{margin-top:5px}
#quote-form .client-upload-feedback{margin-top:3px}
#quote-form .client-uploads .filepond--root{margin-bottom:5px}
#quote-form .client-uploads .filepond--drop-label{min-height:48px}
#quote-form .client-uploads .filepond--drop-label label{padding:8px}
@media(max-width:600px){#quote.quote-card{padding:18px 14px}#quote-form .field textarea{min-height:64px}}
/* Keep touch targets and mobile input text usable rather than shrinking the type. */
@media(pointer:coarse),(max-width:700px){
 #quote-form .field input,#quote-form .address-fields .field select,#quote-form .sd-field>:is(input,select){height:40px;min-height:40px;font-size:16px}
 #quote-form .vr-service-picker .service-chip,#quote-form #sd-panel-trash_bins [data-sd-key=quantity_unknown]>.sd-check,#quote-form .verification-option span,#quote-form .quote-extra-tabs>button,#quote-form .quote-submit{min-height:44px}
 #quote-form .sd-tabs>button{min-height:44px}
 #quote-form .client-uploads .filepond--drop-label{min-height:52px}
}
@media(prefers-reduced-motion:reduce){#quote-form .quote-extra-tabs>button{transition:none}}

/* Contextual service guidance stays off the canvas until requested. */
#quote-form #quote-services-label{position:relative;width:100%;box-sizing:border-box}
#quote-form .quote-service-help{display:inline-flex;vertical-align:middle;margin-left:5px}
#quote-form .quote-service-help-button{display:inline-grid;place-items:center;width:26px;height:26px;min-height:26px;margin:0;padding:4px;border:1px solid var(--service-line);border-radius:50%;background:var(--service-soft);color:var(--service-ink);cursor:pointer;vertical-align:middle}
#quote-form .quote-service-help-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
#quote-form .quote-service-help-button:focus-visible{outline:3px solid var(--service-focus);outline-offset:2px}
#quote-form .quote-service-tooltip{position:absolute;z-index:4;left:0;top:calc(100% + 6px);display:grid;gap:5px;width:min(320px,100%);box-sizing:border-box;padding:10px 12px;border:1px solid var(--service-line);border-radius:9px;background:var(--service-soft);color:var(--service-ink);box-shadow:0 8px 24px #001b3533;font-size:12px;font-weight:400;line-height:1.4;text-transform:none}
#quote-form .quote-service-tooltip[hidden]{display:none!important}
@media(pointer:coarse){#quote-form .quote-service-help-button{width:32px;height:32px;min-height:32px}}

/* Shared two-row desktop canvas follows Driveway's compact field rhythm.
   No hard maximum height: validation text, larger text and smaller devices may expand. */
#quote-form .sd-panel{--service-line:var(--sd-line);--service-soft:var(--sd-soft);--service-ink:var(--sd-ink);--service-focus:var(--sd-accent)}
#quote-form .sd-panel legend{position:relative;display:flex;align-items:center;min-height:26px;width:100%;box-sizing:border-box}
#quote-form #sd-panel-trash_bins [data-sd-kind=count]>label>small{display:block;font-size:10px;line-height:1.4;font-weight:400;color:var(--sd-muted)}
#quote-form #sd-panel-trash_bins [data-sd-key=quantity_unknown]{display:flex;align-items:flex-end}
#quote-form #sd-panel-trash_bins [data-sd-key=quantity_unknown]>.sd-check{width:100%;margin:0}
@media(min-width:701px){
 #quote-form .sd-fields{grid-template-rows:minmax(86px,auto) minmax(54px,auto)}
 #quote-form .sd-field>:is(input,select){height:34px;line-height:1.35}
 #quote-form #sd-panel-fences .sd-fields{grid-template-columns:repeat(6,minmax(0,1fr))}
 #quote-form #sd-panel-fences .sd-field[data-sd-kind=measure]{grid-column:span 3}
 #quote-form #sd-panel-fences .sd-field[data-sd-kind=select]{grid-column:span 2}
 #quote-form #sd-panel-trash_bins .sd-fields{grid-template-columns:repeat(12,minmax(0,1fr))}
 #quote-form #sd-panel-trash_bins .sd-field{grid-column:span 3}
 #quote-form #sd-panel-trash_bins :is([data-sd-key=unknown_size],[data-sd-key=quantity_unknown],[data-sd-key=frequency]){grid-column:span 4}
}
@media(min-width:481px) and (max-width:700px){#quote-form #sd-panel-trash_bins [data-sd-key=frequency]{grid-column:1/-1}}
@media(pointer:coarse),(max-width:700px){#quote-form .sd-check{min-height:40px}#quote-form .sd-panel legend{min-height:32px}}
@media(prefers-reduced-motion:reduce){#quote-form .sd-check,#quote-form .sd-check .service-toggle-track:after{transition:none}}
@media(forced-colors:active){#quote-form .sd-check:has(input:checked){outline:3px solid Highlight;background:Highlight;color:HighlightText}#quote-form .sd-check .service-toggle-track{border:1px solid CanvasText}}

/* Both mounted tabs contribute to one grid track: no height jump and no lost FileList. */
#quote-form .quote-extras-tabbed .quote-extra-panels{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch}
#quote-form .quote-extras-tabbed [data-quote-extra-panel]{grid-area:1/1;display:flex;flex-direction:column;align-self:stretch;min-width:0;min-height:180px;box-sizing:border-box;padding:8px;border:1px solid var(--sd-line);border-radius:8px;background:var(--sd-soft)}
#quote-form .quote-extras-tabbed [data-quote-extra-panel][hidden]{display:flex!important;visibility:hidden;pointer-events:none}
#quote-form .quote-extras-tabbed [data-quote-extra-panel]>.details-field,
#quote-form .quote-extras-tabbed [data-quote-extra-panel]>.client-uploads:not([hidden]){display:flex;flex:1;flex-direction:column;min-width:0}
#quote-form .quote-extras-tabbed :is(.details-field>label,.client-uploads-heading){min-height:20px;margin:0 0 5px;font-size:12px;line-height:1.4}
#quote-form .quote-extras-tabbed .details-field>textarea{flex:1;min-height:96px;margin:0;box-sizing:border-box}
#quote-form .quote-extras-tabbed .client-uploads .file-picker{display:flex;flex:1;flex-direction:column;min-height:96px;min-width:0}
#quote-form .quote-extras-tabbed .file-picker>.file-picker-button{flex:1}
#quote-form .quote-extras-tabbed .client-uploads.vr-pond-enhanced .file-picker{display:none}
#quote-form .quote-extras-tabbed .filepond--root{flex:1 0 auto;min-height:96px;width:100%;margin:0}
#quote-form .quote-extras-tabbed .filepond--drop-label{min-height:96px}
#quote-form .quote-extras-tabbed .details-meta{margin-top:5px}

/* Required indicators share one accessible contrast treatment in both themes. */
#quote-form .required-mark,#quote .required-note>.required-mark{display:inline-block;margin-inline-start:.2em;color:#b42332;font-weight:750;line-height:1;white-space:nowrap}
#quote-form .required-mark[hidden]{display:none!important}
html[data-theme=dark] #quote-form .required-mark,html[data-theme=dark] #quote .required-note>.required-mark{color:#ff9da8}
@media(prefers-color-scheme:dark){html:not([data-theme]) #quote-form .required-mark,html:not([data-theme]) #quote .required-note>.required-mark{color:#ff9da8}}

/* Advanced quote only: compact rhythm without shrinking inputs or touch targets. */
.quote-modal .quote-card:has(#quote-form[data-quote-form-type="advanced"]){padding:16px}
.quote-card:has(#quote-form[data-quote-form-type="advanced"]) #quote-heading{padding-inline:28px}
.quote-card:has(#quote-form[data-quote-form-type="advanced"]) .required-note{margin:4px 0 6px}
#quote-form[data-quote-form-type="advanced"] .form-row{gap:6px 8px;margin-bottom:6px}
#quote-form[data-quote-form-type="advanced"] .field label{margin-bottom:2px}
#quote-form[data-quote-form-type="advanced"] .vr-service-picker{margin-bottom:6px}
#quote-form[data-quote-form-type="advanced"] :is(.quote-service-details,.quote-extras){margin:6px 0;padding:8px}
#quote-form[data-quote-form-type="advanced"] .sd-tabs{gap:6px;margin:4px 0 6px}
#quote-form[data-quote-form-type="advanced"] .sd-panel{padding-top:6px}
#quote-form[data-quote-form-type="advanced"] .sd-fields{gap:6px 8px}
#quote-form[data-quote-form-type="advanced"] .sd-field>label:not(.sd-check){margin-bottom:2px}
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed [data-quote-extra-panel]{min-height:105px;padding:6px}
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .client-uploads .file-picker,
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .filepond--root,
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .filepond--drop-label{min-height:56px}
#quote-form[data-quote-form-type="advanced"] .quote-contact-options{gap:6px;margin:6px 0}
#quote-form[data-quote-form-type="advanced"] .quote-contact-option{gap:4px}
#quote-form[data-quote-form-type="advanced"] .verification-box{margin:6px 0}
#quote-form[data-quote-form-type="advanced"] .quote-modal-actions{margin-top:10px;padding-top:10px}
#quote-form[data-quote-form-type="advanced"] .form-reassurance{margin-top:6px}
@media(min-width:701px){#quote-form[data-quote-form-type="advanced"] .sd-fields{grid-template-rows:auto auto}}
@media(max-width:600px){.quote-modal .quote-card:has(#quote-form[data-quote-form-type="advanced"]){padding:14px 12px}}

/* Optional editors keep 70% of their previous empty-state size, not a flex share
   of an ever-growing attachment list. Baseline notes include the old label/help
   rhythm (103.5px) and the enhanced picker's former 20px shell margin. Keeping
   those references separate preserves the same reduction in native fallback.
   Content, errors and file previews still enlarge the shared tab track. */
#quote-form[data-quote-form-type="advanced"] .quote-extras{
 --quote-notes-baseline:103.5px;--quote-notes-picker-space:0px;
 container-type:inline-size;container-name:quote-optional;
}
#quote-form[data-quote-form-type="advanced"] .quote-extras:has(.vr-pond-enhanced){--quote-notes-picker-space:20px}
#quote-form[data-quote-form-type="advanced"] .quote-extra-tabs{gap:6px;margin-bottom:6px}
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .details-field>textarea{
 flex:0 0 auto;min-height:56px;
 height:calc((var(--quote-notes-baseline) + var(--quote-notes-picker-space) + var(--quote-notes-wrapped-help,0px)) * .7);
 overflow-y:auto;resize:vertical;
}
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed :is(.details-field>label,.client-uploads-heading){margin-bottom:4px}
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .details-meta{margin-top:4px;flex-wrap:wrap}
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .client-uploads .file-picker{flex:0 0 auto;height:56px}
#quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .file-picker>.file-picker-button{min-height:44px;margin:0}
#quote-form[data-quote-form-type="advanced"] .quote-extras .vr-pond-shell{margin:0;min-width:0}
#quote-form[data-quote-form-type="advanced"] .quote-extras .filepond--drop-label>label{padding:8px!important}
#quote-form[data-quote-form-type="advanced"] .quote-extras .client-upload-help{margin-top:4px;overflow-wrap:anywhere}
#quote-form[data-quote-form-type="advanced"] .quote-extras .client-upload-feedback{margin-top:4px;flex-wrap:wrap}
#quote-form[data-quote-form-type="advanced"] .quote-extras :is(.client-upload-files,progress){margin-top:6px}
#quote-form[data-quote-form-type="advanced"] .quote-contact-options>.consent-wrap{margin:0}
@media(min-width:541px) and (max-width:1000px){
 #quote-form[data-quote-form-type="advanced"] .quote-extras{--quote-notes-baseline:101.95px}
}
@container quote-optional (max-width:260px){
 #quote-form[data-quote-form-type="advanced"] .quote-extras-tabbed .details-field>textarea{--quote-notes-wrapped-help:16.5px}
}