/* Name, phone and clinic are required; service and doctor stay optional. */
.appointment-form {gap: 20px;}
.appointment-form .form-primary {gap: 16px;}
.appointment-form .field {display: grid; gap: 8px; margin: 0;}
.appointment-form .field > label {font-size: 15px; line-height: 1.4; font-weight: 500;}
.appointment-form .field input,
.appointment-form .field select {
  width: 100%; min-height: 56px; padding: 15px 18px; border-radius: 14px;
  border: 1px solid var(--color-line); background: white; font-size: 16px; line-height: 1.4;
}
.appointment-form .field select {
  appearance: none; -webkit-appearance: none; padding-right: 50px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%231f2e46' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 18px 18px; background-repeat: no-repeat; background-position: right 18px center;
}
.appointment-form [data-appointment-options], .appointment-form .appointment-choices {display: grid; gap: 14px;}
.appointment-form .appointment-optional-fields {display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px;}
.appointment-form .appointment-context {
  order: -1; padding: 0; margin: 0; border: 0; background: none;
  font-size: 15px; line-height: 1.5; color: var(--color-primary);
}
.appointment-form .form-actions {gap: 16px;}
.appointment-form .check-label {
  align-items: start; font-size: 14px; line-height: 1.5; color: var(--color-muted);
}
.appointment-form .check-label input {width: 19px; height: 19px; flex: none; margin-top: 1px;}
.appointment-form .form-actions > .btn {width: 100%; min-height: 56px; border-radius: 999px;}
.ref8-booking-form.appointment-form {gap: 16px;}
.ref8-booking-form .form-primary {gap: 16px;}
.ref8-booking-form .form-primary input {border: 1px solid var(--color-line); border-radius: 14px;}
.ref8-booking-form .check-label {padding: 0; font-size: 14px;}
@media (max-width: 767px) {
  .appointment-form .form-primary, .dialog .appointment-form .form-primary, .appointment-form .appointment-optional-fields {grid-template-columns: 1fr;}
  .appointment-form .field > label {font-size: 15px;}
  .ref8-booking {padding: 28px 22px;}
}