/* Sperr-Dialog: Kalender links, Ab/Bis/Wochentage/Grund rechts. @flutter: Wrap(children: [RangeCalendar, Column(...)]) */
.lock-dialog {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-24);
}

.lock-dialog__calendar {
  flex: 2 1 calc(2 * var(--size-calendar-month));
  min-width: 0;
}

.lock-dialog__side {
  display: flex;
  flex-direction: column;
  gap: var(--space-14);
  flex: 1 1 var(--size-lock-side);
  min-width: 0;
}

.lock-dialog__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}

.lock-dialog__label {
  font-size: var(--font-size-12-5);
  color: var(--color-on-surface-muted);
}

/* Bestehende Sperren als Auswahl über dem Kalender */
.lock-dialog__existing {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  margin-bottom: var(--space-16);
}

.lock-dialog__chips { display: flex; flex-wrap: wrap; gap: var(--space-6); }

.lock-dialog__chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-6);
  height: var(--size-control-small);
  padding: var(--space-0) var(--space-12);
  border-radius: var(--radius-full);
  background: var(--color-calendar-card);
  color: var(--color-on-surface-variant);
  font-size: var(--font-size-12-5);
  font-weight: var(--font-weight-semibold);
}

.lock-dialog__chip small { font-weight: var(--font-weight-regular); opacity: var(--opacity-pressed); }
.lock-dialog__chip:hover { color: var(--color-on-surface); }
.lock-dialog__chip--on { background: var(--color-error); color: var(--color-on-error); }
.lock-dialog__chip--on:hover { color: var(--color-on-error); }
.lock-dialog__chip--new.lock-dialog__chip--on { background: var(--color-primary); color: var(--color-on-primary); }

.lock-dialog__clash {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  margin: var(--space-0);
  font-size: var(--font-size-12-5);
  font-weight: var(--font-weight-semibold);
  color: var(--color-error-text);
}

.lock-dialog__muted { color: var(--color-on-surface-muted); }
.lock-dialog__overlap { color: var(--color-error-text); font-weight: var(--font-weight-semibold); }