/* Home hero Year/Make/Model form (story 1.W2.19). Port of the approved prototype
   (design/prototypes/part-1/home.html + proto.css, owner approval 2026-09-29).
   Tokens only (site/css/site.css): no hex, rgb or literal font. Everything scoped under .ymm.
   VehicleForm card: ADAPT of .booking (white card, --shadow-lg, local focus ring back to Royal 400). */
.ymm{display:flex;flex-direction:column;gap:var(--space-3);margin:0;background:var(--surface-card);color:var(--text-body);
  border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:clamp(var(--space-4),2.5vw,var(--space-6));--focus-ring:var(--qac-royal-400);}
.ymm__fields{display:flex;flex-direction:column;gap:var(--space-3);}
.ymm__title{margin:0;font-weight:var(--weight-bold);font-size:var(--type-subtitle);line-height:var(--leading-tight);color:var(--text-heading);}

/* Year / Make / Model grid: ADAPT of .booking__fs to three columns */
.ymm-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-2) var(--space-3);}
.ymm-grid[hidden]{display:none;}
@media (min-width:560px){ .ymm-grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
.ymm .field{gap:var(--space-1);}
.ymm .control{min-height:44px;padding-top:var(--space-2);padding-bottom:var(--space-2);font-size:var(--type-body);}
.ymm .control:disabled{background-color:var(--surface-muted);color:var(--text-muted);cursor:not-allowed;}

/* Field label with the inline list loader: ADAPT of .field__label */
.ymm .field__label--row{display:flex;align-items:center;gap:var(--space-2);}

/* QuoteLoader: CREATE, derived from CarouselDots dashes. Three dashes fill in Royal Blue; static under reduced motion. */
.ymm .qload{display:none;align-items:center;gap:var(--space-1);flex:none;}
.ymm .field.is-loading .qload{display:inline-flex;}
.ymm .qload i{display:block;width:var(--space-3);height:var(--space-1);background:var(--qac-bdazzled-200);
  animation:qac-ymm-qload calc(var(--duration-slow) * 4) var(--ease-standard) infinite;}
.ymm .qload i:nth-child(2){animation-delay:var(--duration-fast);}
.ymm .qload i:nth-child(3){animation-delay:calc(var(--duration-fast) * 2);}
@keyframes qac-ymm-qload{0%,100%{background:var(--qac-bdazzled-200);}40%{background:var(--action-primary);}}
@media (prefers-reduced-motion: reduce){
  .ymm .qload i{animation:none;}
  .ymm .qload i:first-child{background:var(--action-primary);}
}

/* Notice (catalog down): ADAPT of .form-alert with the warning background */
.ymm .notice{display:flex;align-items:flex-start;gap:var(--space-2);margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);
  background:var(--status-warning-bg);color:var(--text-heading);font-size:var(--type-body-sm);line-height:var(--leading-body);}
.ymm .notice[hidden]{display:none;}
.ymm .notice__ic{flex:none;display:flex;padding-top:calc(var(--space-1) / 2);color:var(--text-heading);}
.ymm .notice__body p{margin:0;}

/* Without JavaScript the lists cannot load: hide the fields and the send button, show the link to book/ and the phone. */
.ymm__nojs{margin:0;font-size:var(--type-body-sm);line-height:var(--leading-body);color:var(--text-body);}
.ymm__nojs a{display:inline-flex;align-items:center;min-height:44px;color:var(--text-link);font-weight:var(--weight-bold);}
html:not(.js) .ymm__fields{display:none;}