.appointment-shell .appointment-models { grid-template-columns: minmax(0,1fr); gap: 0; }
.appointment-shell .appointment-model {
 display: grid;
 grid-template-columns: 72px minmax(0,1fr) auto;
 grid-template-areas:
  "media label ."
  "media field remove"
  "media note ."
  "error error error";
 gap: 4px 20px;
 min-height: 132px;
 padding: 16px 0;
 border-bottom: 1px solid #d7d0c8;
 align-items: start;
 position: relative;
}
.appointment-shell .appointment-model:last-child { border-bottom: 0; }
.appointment-shell .appointment-model::before { content: attr(data-slot); grid-area: media; align-self: center; color: #b9b2ab; font: 400 30px/1 var(--serif); text-align: center; }
.appointment-shell .appointment-model.has-model::before { display: none; }
.appointment-shell .appointment-model > figure { grid-area: media; margin: 0; width: 72px; height: 108px; }
.appointment-shell .appointment-model > figure img { width: 100%; height: 100%; object-fit: contain; }
.appointment-shell .appointment-model figcaption { display: none; }
.appointment-shell .appointment-model > label { grid-area: label !important; margin: 0; min-width: 0; font-size: 11px; line-height: 1.5; color: #635e58; }
.appointment-shell .appointment-model > :is(input,select) { grid-area: field !important; width: 100%; min-width: 0; min-height: 48px; box-sizing: border-box; }
.appointment-shell .appointment-model > figure[hidden] ~ :is(label,select) { grid-column: 2 !important; }
.appointment-shell .appointment-model-name { grid-area: note !important; min-width: 0; margin: 4px 0 0; font-size: 13px; line-height: 1.5; color: #635e58; overflow-wrap: anywhere; }
.appointment-shell .appointment-model > button { grid-area: remove !important; justify-self: start; margin: 0; min-height: 48px; align-self: center; white-space: nowrap; font-size: 12px; border: 0; padding: 8px; }
.appointment-shell .appointment-model > .request-field-error { grid-area: error !important; min-width: 0; margin: 0; }
@media (max-width:480px) {
 .appointment-shell .appointment-model {
  grid-template-columns: 56px minmax(0,1fr);
  grid-template-areas:
   "media label"
   "media field"
   "media note"
   ". remove"
   "error error";
  column-gap: 14px;
 }
 .appointment-shell .appointment-model > figure { width: 56px; height: 84px; }
 .appointment-shell .appointment-model > button { justify-self: start; padding-left: 0; min-height: 44px; }
}