.editor-toolbar {
  margin-bottom: 0.5rem;
}

.genre-editor-list {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-top: 1rem;
}

.genre-editor-card {
  padding: 0.85rem 1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
}

.genre-editor-form label,
.genre-editor-add label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.85rem;
  color: var(--muted);
  margin-bottom: 0.5rem;
}

.genre-editor-form input[type="text"],
.genre-editor-add input[type="text"] {
  padding: 0.45rem 0.55rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #12151c;
  color: var(--text);
  width: 100%;
}

.genre-editor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.35rem;
}

.genre-editor-actions button[type="submit"],
.genre-editor-add button[type="submit"] {
  padding: 0.45rem 0.85rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #252a38;
  color: var(--text);
  cursor: pointer;
  min-height: 2.5rem;
}

.genre-editor-form.htmx-request button,
.genre-delete-form.htmx-request button,
.genre-editor-add.htmx-request button {
  opacity: 0.6;
  cursor: wait;
}

.genre-delete-form {
  margin-top: 0.5rem;
}
