button, .upload-btn {
	border-radius: var(--button-border-radius);
	background-color: var(--button-background-color);
	color: var(--button-text-color);
	/*border-color: var(--button-border-color);*/
	border: 1px solid var(--button-border-color);
	/*border-width: 1px;*/
	box-shadow: none;
	box-sizing: border-box;
	cursor: pointer;
	font-size: var(--button-font-size);
	font-weight: normal;
	transform: translate3d(0, 0, 0);
	transition: all .3s;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding-left: 1rem;
	padding-right: 1rem;
	padding-top: 1rem;
	padding-bottom: 1rem;
	height: 33px;
}

button:hover {
	/* 	opacity: 1;
	transform: translateY(0);
	transition-duration: .35s; */
	color: var(--button-hover-text-color);
	background-color: var(--button-hover-background-color);
	/* border-color: var(--button-hover-border-color); */
}

button:disabled {
	/* background-color: #ccc;
	cursor: not-allowed; */
	pointer-events: none;  /* Verhindert jegliche Interaktion mit dem Button */
	opacity: 0.5; /* Optional, um den Button visuell als deaktiviert darzustellen */
}

.save-button {
	color: var(--button-save-text-color);
	/* border-color: var(--button-save-border-color); */
	background-color: var(--button-save-background-color);
	border: 1px solid var(--button-save-border-color);
}

.save-button:hover {
	color: var(--button-save-hover-text-color);
	/* border-color: var(--button-save-hover-border-color); */
	background-color: var(--button-save-hover-background-color);
	border: 1px solid var(--button-save-hover-border-color);
}

.cancel-button {
	color: var(--button-cancel-text-color);
	/* border-color: var(--button-cancel-border-color); */
	background-color: var(--button-cancel-background-color);
	border: 1px solid var(--button-cancel-border-color);
}

.cancel-button:hover {
	color: var(--button-cancel-hover-text-color);
	/* border-color: var(--button-cancel-hover-border-color); */
	background-color: var(--button-cancel-hover-background-color);
	border: 1px solid var(--button-cancel-hover-border-color);
}

.edit-button {
	color: var(--button-edit-text-color);
	/* border-color: var(--button-edit-border-color); */
	background-color: var(--button-edit-background-color);
	border: 1px solid var(--button-edit-border-color);
}

.edit-button:hover {
	color: var(--button-edit-hover-text-color);
	/* border-color: var(--button-edit-hover-border-color); */
	background-color: var(--button-edit-hover-background-color);
	border: 1px solid var(--button-edit-hover-border-color);
}

.delete-button {
	color: var(--button-delete-text-color);
	/* border-color: var(--button-delete-border-color); */
	background-color: var(--button-delete-background-color);
	border: 1px solid var(--button-delete-border-color);
}

.delete-button:hover {
	color: var(--button-delete-hover-text-color);
	border-color: var(--button-delete-hover-border-color);
	background-color: var(--button-delete-hover-background-color);
}

.create-button {
	color: var(--button-create-text-color);
	/* border-color: var(--button-create-border-color); */
	background-color: var(--button-create-background-color);
	border: 1px solid var(--button-create-border-color);
}

.create-button:hover {
	color: var(--button-create-hover-text-color);
	border-color: var(--button-create-hover-border-color);
	background-color: var(--button-create-hover-background-color);
}

/*Aktionbuttons sollen in einer Zeile rechts (end) ausgerichtet sein. Der Abstand zwischen den buttons wird mit gap festgelegt.*/
.action-button-container {
	display: flex;
	gap: 5px;
	justify-content: end;
}

.square {
	height: 20px;
	width: 20px;
}

.small {
	height: 30px;
}

.file-upload {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* #uploadBtn {
  padding: 8px 16px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

#uploadBtn:hover {
  background-color: #0056b3;
} */

#fileName {
  font-style: italic;
  color: #555;
}


.disabled {
	/* background-color: #ccc;
	cursor: not-allowed; */
	pointer-events: none;  /* Verhindert jegliche Interaktion mit dem Button */
	opacity: 0.5; /* Optional, um den Button visuell als deaktiviert darzustellen */
}