#mbk-calendar{
  margin-bottom: 3rem;
}
#mbk-booking-form{
  display: grid;
      grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.form-field-group{
  
}
#mbk-booking-form label{
width: 100%;
font-weight: bold;
display: block;
}
#mbk-booking-form input, #mbk-booking-form select {
  width: 100%;
}

/* Ein Tag, der bereits Buchungen hat, aber noch nicht voll ist */
.ui-datepicker-calendar .partially-booked .ui-state-default {
    background: #a2e8c2; /* Ein sanftes Grün */
    color: #333;
}
/* Markiert Samstage und Sonntage im Kalender */
.ui-datepicker-calendar .weekend-date .ui-state-default {
    background: #f4f4f4; /* Hellgrau */
    color: #aaa;
}

/* Ladeanzeige beim Absenden */
.mbk-loading {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 0.9rem;
  background: #f8fafc; /* sehr helles grau/blau */
  border: 1px solid #e5e7eb; /* hellgrau */
  border-radius: 6px;
  margin-top: 1rem;
}

.mbk-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid #cbd5e1;        /* helles grau */
  border-top-color: #0d6efd;         /* blau (WP/Bootstrap-like) */
  border-radius: 50%;
  animation: mbk-spin 0.8s linear infinite;
}

@keyframes mbk-spin {
  to { transform: rotate(360deg); }
}

.mbk-loading-text {
  font-size: 0.95rem;
  color: #334155; /* dunkles grau/blau */
}

/* Puffer-Tage: informativ, nicht blockierend */
.ui-datepicker-calendar .buffer-date .ui-state-default {
    background: #fff5c2; /* sanftes Gelb */
    color: #555;
    border: 1px dashed #eab308; /* gelblicher Rahmen */
}