/*!
 * Quick Auto Center — /book/ Contact step (story 1.W2.25).
 * Port of the approved prototype design/prototypes/part-2/part-2.css (Contact block; flow-part-2.md section 3.2).
 * Tokens only (var(--*) of site.css, or calc() of one). DESIGN.md bans apply: no background gradient, blur, glass,
 * pill outside .tag, emoji or Unicode glyph icons. Targets >= 44px, inputs at --type-body (16px), 2px focus ring.
 */

/* Contact grid — ADAPT of .booking__fs (site.css): 1 column on phone, 2 from 560px, name and consent full width */
#step-contact-body{display:flex;flex-direction:column;gap:var(--space-4);}
#step-contact-body .step__lede{margin:0;}
.ct{margin:0;}
.ct-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-3);}
@media (min-width:560px){ .ct-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
.ct .control{font-size:var(--type-body);min-height:44px;}
.field__opt{font-weight:var(--weight-regular);letter-spacing:0;text-transform:none;font-size:var(--type-caption);}
.ct .field__msg[hidden]{display:none;}

/* Consent box — ADAPT of the DS Checkbox + .opt tile: unticked by default, the whole tile is the label */
.consent{display:flex;align-items:flex-start;gap:var(--space-2);min-height:44px;padding:var(--space-2) var(--space-3);
  border:var(--border-width) solid var(--border-default);border-radius:var(--radius-md);background:var(--surface-card);cursor:pointer;font-size:var(--type-body-sm);
  transition:border-color var(--duration-fast) var(--ease-standard),background var(--duration-fast) var(--ease-standard);}
.consent:hover{border-color:var(--border-brand);}
.consent input{flex:none;width:var(--space-5);height:var(--space-5);margin:0;accent-color:var(--action-primary);cursor:pointer;}
.consent input:focus-visible{outline:none;}
.consent:has(input:focus-visible){outline:2px solid var(--focus-ring);outline-offset:2px;}
.consent:has(input:checked){border-color:var(--border-brand);background:var(--qac-royal-050);}
.consent__txt{display:flex;flex-direction:column;gap:calc(var(--space-1) / 2);min-width:0;}
.consent__txt b{color:var(--text-heading);}

/* Anti-spam trap (envio-anti-spam): out of sight and out of the tab order, never display:none */
.ct-trap{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* Send area — compact recap (ADAPT of the .sum__veh key/value rhythm) + REUSE .btn--primary ("Confirm booking")
   with the privacy link next to it (PRD privacidade-aviso) */
.send{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-2);padding-top:var(--space-3);border-top:var(--border-width) solid var(--border-hairline);}
.recap{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:calc(var(--space-1) / 2) var(--space-3);align-items:baseline;font-size:var(--type-body-sm);}
.recap dt{font-weight:var(--weight-bold);font-size:var(--type-eyebrow);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-muted);}
.recap dd{margin:0;font-weight:var(--weight-semibold);color:var(--text-heading);overflow-wrap:anywhere;}
.recap .fineprint{font-weight:var(--weight-regular);}
.recap .sum__warn{font-weight:var(--weight-semibold);}
.send__row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-4);}
.send__row .btn{min-height:44px;}
.send__privacy a{display:inline-flex;align-items:center;min-height:44px;font-weight:var(--weight-bold);color:var(--action-primary);}
.send__status{margin:0;font-size:var(--type-body-sm);font-weight:var(--weight-semibold);color:var(--text-heading);}
.send__status:empty{display:none;}
.ct-err[hidden]{display:none;}
.ct-err:focus{outline:2px solid var(--focus-ring);outline-offset:2px;}
.btn__in{display:inline-flex;align-items:center;gap:var(--space-2);}
#ct-send[aria-disabled="true"]{cursor:progress;background:var(--action-primary-active);border-color:var(--action-primary-active);}
@media (max-width:639px){ .send__row .btn{width:100%;} }

/* QuoteLoader on a Royal button — ADAPT of .qload (book.css): Royal 300 dashes filling to white */
.qload--light i{background:var(--qac-royal-300);animation-name:qac-qload-light;}
@keyframes qac-qload-light{0%,100%{background:var(--qac-royal-300);}40%{background:var(--text-on-brand);}}
@media (prefers-reduced-motion: reduce){ .qload--light i{animation:none;} .qload--light i:first-child{background:var(--text-on-brand);} }
