/*
 * ClassRoll Attendance Type Colors and Styling
 *
 * This stylesheet defines visual styles for different attendance types,
 * session types, and student status indicators in the ClassRoll interface.
 */

/* ========================================
 * Attendance Type Colors
 * ======================================== */

/* Present - Green */
.attendance-p {
	background-color: #d1f2eb !important;
	border-left: 3px solid #0f5132;
}

.attendance-p .attendance-display,
.attendance-p select {
	background-color: #d1f2eb;
	color: #0f5132;
	font-weight: 500;
}

/* Tardy - Yellow/Warning */
.attendance-t {
	background-color: #fff3cd !important;
	border-left: 3px solid #997404;
}

.attendance-t .attendance-display,
.attendance-t select {
	background-color: #fff3cd;
	color: #997404;
	font-weight: 500;
}

/* Absent - Red */
.attendance-a {
	background-color: #f8d7da !important;
	border-left: 3px solid #842029;
}

.attendance-a .attendance-display,
.attendance-a select {
	background-color: #f8d7da;
	color: #842029;
	font-weight: 500;
}

/* Excused - Blue */
.attendance-e {
	background-color: #cfe2ff !important;
	border-left: 3px solid #084298;
}

.attendance-e .attendance-display,
.attendance-e select {
	background-color: #cfe2ff;
	color: #084298;
	font-weight: 500;
}

/* Virtual - Purple */
.attendance-v {
	background-color: #e0cffc !important;
	border-left: 3px solid #59359a;
}

.attendance-v .attendance-display,
.attendance-v select {
	background-color: #e0cffc;
	color: #59359a;
	font-weight: 500;
}

/* Sick - Orange */
.attendance-s {
	background-color: #ffe5d0 !important;
	border-left: 3px solid #cc5200;
}

.attendance-s .attendance-display,
.attendance-s select {
	background-color: #ffe5d0;
	color: #cc5200;
	font-weight: 500;
}

/* Leave - Gray */
.attendance-l {
	background-color: #e2e3e5 !important;
	border-left: 3px solid #41464b;
}

.attendance-l .attendance-display,
.attendance-l select {
	background-color: #e2e3e5;
	color: #41464b;
	font-weight: 500;
}

/* Modified - Highlight with border */
.attendance-col.modified {
	box-shadow: inset 0 0 0 2px #ffc107;
	animation: pulse-modified 1s ease-in-out;
}

@keyframes pulse-modified {
	0%, 100% {
		box-shadow: inset 0 0 0 2px #ffc107;
	}
	50% {
		box-shadow: inset 0 0 0 3px #ffc107;
	}
}

/* ========================================
 * Session Type Indicators
 * ======================================== */

/* Open Session */
.session-type-open {
	border-top: 2px solid #0d6efd;
}

/* Program Lock Session */
.session-type-plock {
	border-top: 2px solid #6610f2;
}

/* Day Lock Session */
.session-type-dlock {
	border-top: 2px solid #6f42c1;
}

/* Clinical Session */
.session-type-clinical {
	border-top: 2px solid #0dcaf0;
}

/* Lab Session */
.session-type-lab {
	border-top: 2px solid #20c997;
}

/* Secondary (Lock-Step) Session */
.secondary-session {
	background-color: rgba(13, 110, 253, 0.05) !important;
}

.secondary-session .attendance-header {
	background-color: rgba(13, 110, 253, 0.1);
	padding: 0.25rem;
	border-radius: 0.25rem;
}

/* ========================================
 * Student Row Highlighting
 * ======================================== */

/* Student with unsubmitted attendance */
.classroll-table tbody tr.has-unsubmitted {
	border-left: 4px solid #ffc107;
	background-color: rgba(255, 193, 7, 0.03);
}

/* Student with balance issues */
.classroll-table tbody tr.has-balance {
	background-color: rgba(255, 193, 7, 0.05);
}

/* Hover effect for rows */
.classroll-table tbody tr:hover {
	background-color: rgba(0, 0, 0, 0.02);
	cursor: pointer;
}

/* ========================================
 * Lab and Clinical Status Colors
 * ======================================== */

/* Lab status badges */
.badge.lab-needs-attention {
	background-color: #dc3545;
	color: white;
}

.badge.lab-clocked-in {
	background-color: #198754;
	color: white;
}

.badge.lab-clocked-out {
	background-color: #6c757d;
	color: white;
}

/* Clinical status badges */
.badge.clinical-clocked-in {
	background-color: #0dcaf0;
	color: #000;
}

.badge.clinical-clocked-out {
	background-color: #6c757d;
	color: white;
}

/* ========================================
 * Grid Layout Enhancements
 * ======================================== */

/* Sticky column headers */
.classroll-table thead th.sticky-top {
	position: sticky;
	top: 0;
	z-index: 100;
	background-color: var(--bs-light);
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Attendance cell hover */
.attendance-col:hover {
	background-color: rgba(0, 0, 0, 0.03) !important;
}

/* Disabled/non-editable attendance cells */
.attendance-col .attendance-display {
	opacity: 0.7;
	cursor: not-allowed;
}

/* Attendance select focus */
.attendance-select:focus {
	border-color: #0d6efd;
	box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

/* ========================================
 * Responsive Adjustments
 * ======================================== */

@media (max-width: 768px) {
	.classroll-table {
		font-size: 0.75rem;
	}

	.student-photo {
		width: 30px;
		height: 30px;
	}

	.attendance-col {
		min-width: 80px;
	}

	.student-status-badges .badge {
		font-size: 0.65rem;
		padding: 0.2rem 0.4rem;
	}
}

/* ========================================
 * Print Styles
 * ======================================== */

@media print {
	.classroll-toolbar,
	.actions-col,
	.attendance-select {
		display: none !important;
	}

	.attendance-col .attendance-display {
		opacity: 1 !important;
		border: 1px solid #000 !important;
	}

	.classroll-table {
		page-break-inside: avoid;
	}

	.classroll-table thead th {
		position: static;
		background-color: #f8f9fa !important;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	/* Preserve attendance type colors in print */
	.attendance-p { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.attendance-t { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.attendance-a { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.attendance-e { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.attendance-v { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.attendance-s { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	.attendance-l { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ========================================
 * Loading States
 * ======================================== */

.classroll-loading-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(255, 255, 255, 0.8);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1000;
}

.classroll-saving-indicator {
	position: fixed;
	top: 1rem;
	right: 1rem;
	z-index: 1050;
	animation: slide-in 0.3s ease-out;
}

@keyframes slide-in {
	from {
		transform: translateX(100%);
		opacity: 0;
	}
	to {
		transform: translateX(0);
		opacity: 1;
	}
}

/* ========================================
 * Accessibility Enhancements
 * ======================================== */

/* Focus indicators for keyboard navigation */
.classroll-table tbody tr:focus-within {
	outline: 2px solid #0d6efd;
	outline-offset: -2px;
}

.attendance-select:focus-visible {
	outline: 2px solid #0d6efd;
	outline-offset: 2px;
}

/* Screen reader only text */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border-width: 0;
}