.doctor-schedule-page {
  gap: 18px;
}

.doctor-schedule-heading {
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 4px;
}

.doctor-schedule-heading .toolbar-title {
  display: grid;
  gap: 6px;
}

.doctor-schedule-heading .toolbar-title h3 {
  margin: 0;
}

.doctor-schedule-heading .toolbar-title p {
  max-width: 760px;
  color: var(--text-muted, #475569);
}

.doctor-schedule-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
}

.doctor-schedule-page .doctor-schedule-form {
  align-items: end;
  width: min(100%, 920px);
  gap: 12px;
}

.doctor-schedule-datetime-group {
  grid-column: span 2;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.doctor-schedule-datetime-group label {
  display: grid;
  gap: 4px;
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  font-weight: 700;
}

.doctor-schedule-page textarea.form-control {
  min-height: 72px;
  resize: vertical;
}

.doctor-schedule-empty {
  border: 1px solid var(--border-color, #dbe3ee);
  border-radius: var(--radius-sm, 12px);
  background: color-mix(in oklab, var(--surface-muted, #f8fafc) 82%, #fff 18%);
  color: var(--text-muted, #475569);
  font-size: 13px;
  font-weight: 600;
  padding: 10px 12px;
}

.doctor-schedule-actions {
  justify-content: flex-end;
  padding-top: 2px;
}

.doctor-schedule-actions button {
  min-width: 92px;
}

.doctor-schedule-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 220px));
  align-items: end;
  gap: 10px;
  margin: 4px 0 2px;
}

.doctor-schedule-filters label {
  display: grid;
  gap: 4px;
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  font-weight: 700;
}

.doctor-schedule-filters .form-control,
.doctor-schedule-filters .form-select {
  width: 100%;
}

.doctor-schedule-activity {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 800;
}

.doctor-schedule-activity::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: currentColor;
}

.doctor-schedule-activity.opd { background: #dcfce7; color: #166534; }
.doctor-schedule-activity.operation { background: #ede9fe; color: #6d28d9; }
.doctor-schedule-activity.wardround { background: #e0f2fe; color: #075985; }
.doctor-schedule-activity.emergency { background: #fee2e2; color: #991b1b; }
.doctor-schedule-activity.meeting { background: #1f2937; color: #ffffff; }
.doctor-schedule-activity.leave { background: #ffedd5; color: #9a3412; }
.doctor-schedule-activity.holiday { background: #f8fafc; color: #475569; border: 1px solid #cbd5e1; }
.doctor-schedule-activity.blocked { background: #e5e7eb; color: #374151; }

.doctor-schedule-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 800;
}

.doctor-schedule-status.scheduled {
  background: #dbeafe;
  color: #1d4ed8;
}

.doctor-schedule-status.completed {
  background: #dcfce7;
  color: #166534;
}

.doctor-schedule-status.cancelled {
  background: #fee2e2;
  color: #991b1b;
}

.doctor-schedule-page .row-action:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.doctor-block-btn {
  border-color: rgba(239, 68, 68, 0.25);
  color: #b91c1c;
  background: #fff5f5;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .doctor-schedule-heading {
    align-items: stretch;
  }

  .doctor-schedule-header-actions {
    justify-content: stretch;
    width: 100%;
  }

  .doctor-block-btn {
    width: 100%;
    justify-content: center;
  }

  .doctor-schedule-datetime-group {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }

  .doctor-schedule-page .master-actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  .doctor-schedule-page .master-actions button,
  .doctor-schedule-filters label {
    flex: 1 1 100%;
    max-width: none;
  }

  .doctor-schedule-filters {
    grid-template-columns: 1fr;
  }
}