/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

body.assignments-pro-modal-active {
	width: 100%;
}

#assignments-pro-assignment-container {
	padding: 1rem;
	border: solid 1px #EEE;
	background-color: #FFF;
	margin: 1rem 0;
}

.assignments-pro-show-for-sr, .assignments-pro-hide, .assignments-pro-reveal {
	display: none;
}

#assignments-pro-upload-progress-div, .assignments-pro-upload-progress-div {
	height: 1.5rem;
	background-color: #DDD;
	text-align: center;
	margin: 1.5rem 0;
}

#assignments-pro-upload-progress-bar, .assignments-pro-upload-progress-bar {
	background-color: green;
}

#assignments-pro-upload-progress-text, .assignments-pro-upload-progress-text {
	color: #FFF;
}

.assignments-pro-button {
	display: inline-block;
	background: #333;
	padding: 0.5rem 1rem;
	color: #FFF;
	border-radius: .5rem;
	margin: 1rem 0;
	cursor: pointer;
	font-size: 1em;
	font-weight: normal;
	border: none;
	text-decoration: none;
}

.assignments-pro-button:hover {
	background: #777;
	color: #FFF;
}

.assignments-pro-file-name {
	display: block;
	font-style: italic;
	color: #444;
	font-size: 0.7em;
}

.assignments-pro-criteria-subcriteria {
	padding: 1rem;
	border: solid 1px #EEE;
	margin: 1rem 0 2rem;
}

.assignments-pro-criteria-subcriteria textarea, .assignments-pro-additional-comments textarea {
	width: 99%;
}

.assignments-pro-criteria-subcriteria-uploaded-files {
	padding: 0.25rem 1rem;
	background-color: #F5F5F5;
	margin-top: 1rem;
	font-size: 0.9em;
}

ul.assignments-pro-uploaded-subcriteria-files {
	margin-left: 0;
	list-style: none;
	padding: 0;
}

ul.assignments-pro-uploaded-subcriteria-files li {
	background-color: #EEE;
	display: block;
	padding: 0.5rem;
	margin-bottom: 0.5rem;
	position: relative;
}

.assignments-pro-uploaded-subcriteria-files li .remove-assignments-pro-subcriteria-file {
	position: absolute;
	top: 1rem;
	right: 1rem;
}

.assignments-pro-uploaded-subcriteria-files li .remove-assignments-pro-subcriteria-file {
	position: absolute;
	top: 1rem;
	right: 1rem;
}

.assignments-pro-uploaded-subcriteria-files li .assignments-pro-subcriteria-file-context {
	padding: 0.5rem;
	background-color: #DDD;
	margin-bottom: 0;
}

.assignments-pro-button.disabled {
	cursor: inherit;
	opacity: 0.2;
}

#assignments-pro-previously-uploaded, #assignments-pro-feedback {
	background-color: #F5F5F5;
	padding: 1rem;
	border: solid 1px #EEE;
	margin: 1rem 0;
}

body label.assignments-pro-uploaded, body label.assignments-pro-button {
	width: inherit!important;
}

#assignments-pro-upload-button, #assignments-pro-ready {
	padding: 1rem;
	font-weight: bold;
}

#assignments-pro-upload-button img, #assignments-pro-ready img {
	height: 1.5em;
	margin-left: 1rem
}


.assignments-pro-criteria-subcriteria-context.active .assignments-pro-edit-button {
	display: none;
}

.assignments-pro-criteria-subcriteria-context.locked .assignments-pro-save-button {
	display: none;
}


#assignments-pro-reveal-background {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: .50;
	-webkit-opacity: .5;
	-moz-opacity: .5;
	filter: alpha(opacity=50);
	z-index: 1000;
}

.assignments-pro-reveal {
	background-color: white;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: 0 0 20px 0 #222;
	-webkit-box-shadow: 0 0 20px 0 #222;
	-moz-box-shadow: 0 0 20px 0 #222;
	display: none;
	height: auto;
	left: 50%;
	margin: -120px 0 0 -320px;
	padding: 1.5rem;
	position: fixed;
	top: 50%;
	width: 640px;
	z-index: 1000;
	text-align: center;
}

p.assignments-pro-completion-message {
	text-align: center;
	padding-top: 1rem;
	border-top: solid 1px #000;
}

#assignments-pro-reveal-background.active, .assignments-pro-reveal.active {
	display: block;
}

body.assignments-pro-modal-active { position: fixed; overflow: hidden; }

#assignments-pro-assignment-comments {
	width: 100%;
}

input.assignments-pro-upload-field {
	display: none!important;
	min-height: 10rem;
}

.assignments-pro-alertbox {
	border: solid 1px #C00;
	padding: 1rem 1rem;
	background-color: #f2dede;
	color: #C00;
}

.assignments-pro-alertbox p {
	margin-bottom: 0;
}

#assignments-pro-uploaded-documents, #assignments-pro-feedback-documents {
	list-style: none;
	margin: 0;
}

#assignments-pro-uploaded-documents img, #assignments-pro-feedback-documents img {
	height: 1.5em;
	margin-right: 0.5rem;
	margin-top: -0.25rem
}

#assignments-pro-reopened-submission {
	background-color: #fffca5;
	padding: 1rem;
	border: solid 1px #f4ef61;
	margin: 1rem 0;
}

.assignments-pro-field-notice label {
	border-bottom: dotted 2px #C00;
}

body .learndash label.assignments-pro-inline {
	display: inline;
}

.assignments-pro-assignment-key-details {
	padding: 0.5rem;
	font-size: 0.8em;
	background-color: #F5F5F5;
}

.assignments-pro-back-to-assignment {
	text-align: center;
}

.assignments-pro-criteria-subcriteria-guidance {
	padding: 0.1rem 1rem;
	font-size: .8em;
	border-left: solid 2px #333;
	margin: 1rem 0;
	font-style: italic;
}

.assignments-pro-criteria-row {
	display: flex;
	flex-wrap: wrap;
	margin: 1rem 0 2rem;
	padding: 1rem;
	border: solid 1px #EEE;
	align-items: center;
}

.assignments-pro-criteria-main {
	flex: 2;
	min-width: 60%;
	padding-right: 1rem;
}

.assignments-pro-criteria-sidebar {
	flex: 1;
	min-width: 30%;
	display: flex;
	align-items: start;
	justify-content: flex-end;
}

.assignments-pro-criteria-status {
	text-align: center;
	width: 100%;
}

.assignments-pro-criteria-status-icon-container {
	display: block;
	width: 5rem;
	height: 5rem;
	margin: 0 auto 1rem;
	border: solid 1px #EEE;
	position: relative;
	border-radius: 50%;
}

.assignments-pro-criteria-status-icon-container .assignments-pro-status-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-size: 2em;
}

.assignments-pro-status-label-container {
	background-color: #EEE;
	padding: 0.5rem;
	border-radius: 2rem;
	font-size: 0.8em;
}

#assignments-pro-assignment-container.assignments-pro-criteria-completed .remove-assignments-pro-subcriteria-file, #assignments-pro-assignment-container.assignments-pro-criteria-completed .assignments-pro-uploaded-files-container, #assignments-pro-assignment-container.assignments-pro-criteria-completed .assignments-pro-subcriteria-context-buttons {
	display: none;
}

/* Main Expander Box */
.assignments-pro-expander {
	background: #f0f0f0;
	padding: 1rem;
	cursor: pointer;
	border: 1px solid #ddd;
	position: relative;
}

.assignments-pro-expander h3, .assignments-pro-accordion-toggle h4 {
	margin: 0
}

#assignments-pro-assignment-submission-feedback-container {
	margin: 1rem 0;
}

.assignments-pro-expander::after {
	content: "\25BC"; /* down chevron */
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	transition: transform 0.2s;
}

.assignments-pro-expander.open::after {
	content: "\25B2"; /* up chevron */
}

.assignments-pro-expander-content {
	display: none;
	border: 1px solid #eee;
	border-top: none;
	padding: 1rem;
}

/* Accordion Toggle */
.assignments-pro-accordion-toggle {
	background: #e9e9e9;
	padding: 1rem;
	cursor: pointer;
	font-size: 0.95em;
}

.assignments-pro-accordion-content {
	display: none;
	padding: 0.5rem 1rem;
	background: #fafafa;
	border: 1px solid #eee;
	margin-bottom: 1rem;
}

.assignments-pro-feedback-subcriteria-item .assignments-pro-criteria-row {
	padding: .5rem 1rem;
	margin: 0 0 .5rem;
}

.assignments-pro-feedback-subcriteria-item {
	font-size: 0.8em;
}

.assignments-pro-feedback-subcriteria-item p {
	margin: 0 0 .5rem;
}

.assignments-pro-feedback-subcriteria-item p:last-child {
	margin-bottom: 0;
}

.assignments-pro-feedback-subcriteria-item .assignments-pro-criteria-sidebar {
	justify-content: flex-end;
	text-align: right;
	flex-direction: column;
	align-items: flex-end;
}

.assignments-pro-feedback-subcriteria-item .assignments-pro-criteria-sidebar .assignments-pro-criteria-status {
	width: inherit;
}

.assignments-pro-feedback-subcriteria-item .assignments-pro-criteria-status-icon-container {
	width: 3rem;
	height: 3rem;
	margin: 0;
}

.assignments-pro-feedback-subcriteria-item .assignments-pro-criteria-status-icon-container .assignments-pro-status-icon {
	font-size: 1em;
}

.assignments-pro-assignment-status-message {
	margin: 2rem 0;
	border-top: solid 1px #EEE;
	border-bottom: solid 1px #EEE;
	padding: 1rem 0;
}

.assignments-pro-uploaded-files-container {
	padding: 1rem;
	background-color: #F5F5F5;
	margin: 2rem 0;
}

.assignments-pro-uploaded-files-container p {
	margin: 0 0 1rem;
}

.assignments-pro-upload-columns {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-bottom: 1rem;
}

.assignments-pro-upload-left {
	flex: 1 1 30%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
}

.assignments-pro-upload-right {
	flex: 1 1 65%;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.assignments-pro-word-counter {
	font-size: 0.8em;
	text-align: right;
	margin-top: 0.25rem;
	color: #666;
}

.assignments-pro-word-counter.exceeded {
	color: red;
}
.assignments-pro-word-counter.minimum-warning {
	color: goldenrod;
}
.assignments-pro-word-counter.minimum-ok {
	color: green;
}



@media (max-width: 768px) {
	.assignments-pro-criteria-row {
		flex-direction: column;
	}

	.assignments-pro-criteria-sidebar {
		justify-content: flex-start;
		padding-top: 0.5rem;
	}

	.assignments-pro-upload-columns {
		flex-direction: column;
	}

	.assignments-pro-upload-left,
	.assignments-pro-upload-right {
		flex: 1 1 100%;
	}

	.assignments-pro-reveal {
		margin: -120px 0 0 -160px;
		width: 320px;
	}

}
