.form-container {
	width: 500px;
	background-color: #FFF;
}

.required {
	font-weight: bold;
	color: red;
}

.tooltip {
	position: relative;
	display: inline-block;
	cursor: pointer;
	border: none;
	background: none;
}

.custom-tooltip {
	visibility: hidden;
	background-color: black;
	color: white;
	text-align: center;
	padding: 5px 8px;
	border-radius: 5px;
	position: absolute;
	bottom: 125%; /* Position above the tooltip */
	left: 50%;
	transform: translateX(-50%);
	opacity: 0;
	transition: opacity 0.3s, visibility 0.3s;
	font-size: 12px;
}

.tooltip:hover .custom-tooltip {
	visibility: visible;
	opacity: 1;
}

.question-circle-tooltip {
	min-width: 128px;
	max-width: 250px;
}

.plus-btn-tooltip {
	white-space: nowrap;
}

.trash-btn-tooltip {
	white-space: nowrap;
}

.plus-btn {
	height: 24px;
	width: 24px;
	background-color: #288755;
	color: white;
	margin-bottom: 4px;
	border: none;
	border-radius: 3px;
}

.plus-btn:hover {
	background-color: #157347;
	cursor: pointer;
}

.trash-btn {
	height: 24px;
	width: 24px;
	background-color: #D73448;
	color: white;
	margin-bottom: 4px;
	border: none;
	border-radius: 3px;
}

.trash-btn:hover {
	background-color: #BB2D3B;
	cursor: pointer;
}

/* -------- Create/Edit Artifact -------- */

#new-artifact-name {
	width: 400px;
}

#new-artifact-description {
	min-height: 50px;
	width: 400px;
	height: auto;
	resize: vertical;
}

.class-category-select-label {
	display: inline-block;
	width: 130px;
}

.class-category-select {
	width: 250px;
}

#select-class {
	margin-bottom: 6px;
}

#recipe {
	min-height: 50px;
	width: 400px;
	height: auto;
	resize: vertical;
}

.error-message {
	color: red;
	font-weight: bold;
}

#new-artifact-notes {
	min-height: 50px;
	width: 400px;
	height: auto;
	resize: vertical;
}

#create-artifact-btn {
	padding: 10px;
	background-color: #005EA2;
	color: white;
	font-weight: bold;
	border: none;
	border-radius: 3px;
	cursor: pointer;
}
#create-artifact-btn:hover {
	background-color: #27447E;
}

/* -------- Bulk Submissions -------- */

#bulk-submission-container {
	max-width: 1000px;
}

.json-submit-button {
	padding: 10px;
	background-color: #005EA2;
	color: white;
	font-weight: bold;
	border: none;
	border-radius: 3px;
	cursor: pointer;
}
.json-submit-button:hover {
	background-color: #27447E;
}

.json-upload-success {
	font-weight: bold;
	color: green;
}
.json-upload-error {
	font-weight: bold;
	color: red;
}
