/**
 * Qoss Training — E-Portfolio (Portfolio of Evidence) styles.
 * Loaded alongside qoss-training.css; uses the same flat colour
 * palette as the rest of the plugin's front end.
 */

.qoss-eportfolio {
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid #dcdcde;
}

.qoss-eportfolio .description {
	color: #50575e;
}

.qoss-portfolio-export-link {
	display: inline-block;
	margin: 0.5rem 0 1.5rem;
	font-weight: 600;
}

.qoss-portfolio-unit {
	margin: 1.5rem 0;
	padding: 1rem 1.25rem;
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	border-radius: 6px;
}

.qoss-portfolio-unit h4 {
	margin-top: 0;
}

.qoss-portfolio-criterion {
	padding: 0.85rem 0;
	border-top: 1px solid #e0e0e0;
}

.qoss-portfolio-criterion:first-of-type {
	border-top: none;
}

.qoss-portfolio-criterion-text {
	margin: 0 0 0.4rem;
}

.qoss-portfolio-badge {
	display: inline-block;
	margin-left: 0.5rem;
	padding: 0.15rem 0.6rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	vertical-align: middle;
}

.qoss-portfolio-badge-none {
	background: #eee;
	color: #50575e;
}

.qoss-portfolio-badge-pending {
	background: #fdf3e3;
	color: #7a5b1e;
}

.qoss-portfolio-badge-approved {
	background: #eef7ef;
	color: #155225;
}

.qoss-portfolio-badge-returned {
	background: #fbe7e7;
	color: #7a1f1f;
}

.qoss-portfolio-existing {
	margin: 0.25rem 0 0.5rem;
	font-size: 0.9rem;
}

.qoss-portfolio-comment {
	color: #7a1f1f;
}

.qoss-portfolio-upload-form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: flex-start;
	margin-top: 0.5rem;
}

.qoss-portfolio-upload-form input[type="file"] {
	flex: 1 1 220px;
}

.qoss-portfolio-upload-form textarea {
	flex: 2 1 260px;
	min-height: 2.4rem;
}

.qoss-portfolio-upload-form button {
	flex: 0 0 auto;
}

.qoss-portfolio-upload-result {
	flex-basis: 100%;
	font-size: 0.85rem;
}

/* Gap analysis */

.qoss-portfolio-gap-none {
	color: #155225;
	font-weight: 600;
}

.qoss-portfolio-gap-analysis {
	margin: 1rem 0 1.5rem;
	padding: 1rem 1.25rem;
	background: #fbe7e7;
	border: 1px solid #f0c4c4;
	border-radius: 6px;
}

.qoss-portfolio-gap-analysis h4 {
	margin-top: 0;
	color: #7a1f1f;
}

.qoss-portfolio-gap-list {
	margin: 0;
	padding-left: 1.25rem;
}

.qoss-portfolio-gap-list li {
	margin: 0.35rem 0;
}

.qoss-eportfolio-gap-dashboard .qoss-gap-course {
	margin: 1.5rem 0;
	padding: 1rem 1.25rem;
	background: #fff;
	border: 1px solid #dcdcde;
	border-left: 4px solid #b32d2e;
	border-radius: 4px;
}

.qoss-gap-table {
	width: 100%;
	border-collapse: collapse;
	margin: 0.75rem 0;
}

.qoss-gap-table th,
.qoss-gap-table td {
	border: 1px solid #dcdcde;
	padding: 0.5rem 0.75rem;
	text-align: left;
	font-size: 0.9rem;
	vertical-align: top;
}

.qoss-gap-table th {
	background: #f6f7f7;
}

.qoss-gap-learners summary {
	cursor: pointer;
	font-weight: 600;
	margin-top: 0.5rem;
}

.qoss-gap-learners ul {
	margin: 0.5rem 0 0;
	padding-left: 1.25rem;
}

/* Assessor dashboard */

.qoss-eportfolio-assessor-row {
	margin: 1rem 0;
	padding: 1rem 1.25rem;
	background: #fff;
	border: 1px solid #dcdcde;
	border-left: 4px solid #b7791f;
	border-radius: 4px;
}

.qoss-eportfolio-assessor-date {
	color: #787c82;
	font-size: 0.85rem;
}

.qoss-eportfolio-note {
	background: #f6f7f7;
	padding: 0.5rem 0.75rem;
	border-radius: 4px;
	font-style: italic;
}

.qoss-eportfolio-assess-form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: flex-start;
	margin-top: 0.5rem;
}

.qoss-eportfolio-assess-form textarea {
	flex: 1 1 100%;
	min-height: 2.4rem;
}

.qoss-eportfolio-approve {
	background: #1a7f37;
	color: #fff;
	border: none;
	padding: 0.5rem 1rem;
	border-radius: 4px;
	cursor: pointer;
}

.qoss-eportfolio-return {
	background: #b32d2e;
	color: #fff;
	border: none;
	padding: 0.5rem 1rem;
	border-radius: 4px;
	cursor: pointer;
}

.qoss-eportfolio-assess-result {
	flex-basis: 100%;
	font-size: 0.85rem;
}