/* ========================================
   CalProgs Prism Website Template System
   Copyright (c) 2025 CalProgs
   Template Version: 1.25.10081719
   File: portal/modules/school/common/styles.css
   ========================================
   School Module-specific CSS classes
   Extracted from modules/common/styles.css for modular architecture
   ======================================== */

/* ========================================
   SCHOOL MODULE STYLES
   ======================================== */

/* Student and family information cards */
.prism-student-card {
  background-color: rgba(59, 130, 246, 0.1);
  border: 1px solid rgba(59, 130, 246, 0.3);
  border-radius: 0.5rem;
  padding: 1rem;
  margin-bottom: 1rem;
}

.prism-student-card-header {
  display: flex;
  align-items: center;
  margin-bottom: 0.75rem;
}

.prism-student-card-title {
  font-weight: 600;
  color: #1f2937;
  margin-left: 0.5rem;
}

.prism-student-card-meta {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.prism-student-card-info {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.875rem;
}

.prism-student-card-field {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.prism-student-card-label {
  font-weight: 500;
  color: #374151;
}

.prism-student-card-value {
  color: #6b7280;
}

/* Attendance and enrollment tables */
.prism-attendance-table {
  width: 100%;
  font-size: 0.875rem;
  border-collapse: collapse;
}

.prism-attendance-table th {
  text-align: left;
  padding: 0.75rem 0.5rem;
  font-weight: 500;
  color: #374151;
  border-bottom: 1px solid rgba(209, 213, 219, 0.5);
}

.prism-attendance-table td {
  padding: 0.75rem 0.5rem;
  border-bottom: 1px solid rgba(229, 231, 235, 0.5);
}

.prism-attendance-table tr:hover {
  background-color: rgba(243, 244, 246, 0.5);
}

.prism-attendance-status {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.75rem;
  font-weight: 500;
}

.prism-attendance-status-present {
  background-color: rgba(34, 197, 94, 0.2);
  color: #059669;
}

.prism-attendance-status-absent {
  background-color: rgba(239, 68, 68, 0.2);
  color: #dc2626;
}

.prism-attendance-status-late {
  background-color: rgba(251, 146, 60, 0.2);
  color: #ea580c;
}

.prism-attendance-status-excused {
  background-color: rgba(168, 85, 247, 0.2);
  color: #7c3aed;
}

/* Report containers */
.prism-report-container {
  background-color: rgba(243, 244, 246, 0.5);
  border: 1px solid rgba(209, 213, 219, 0.5);
  border-radius: 0.5rem;
  padding: 1.5rem;
  margin-bottom: 1rem;
}

.prism-report-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(209, 213, 219, 0.5);
}

.prism-report-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1f2937;
}

.prism-report-subtitle {
  font-size: 0.875rem;
  color: #6b7280;
  margin-top: 0.25rem;
}

.prism-report-actions {
  display: flex;
  gap: 0.5rem;
}

.prism-report-button {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 1rem;
  background-color: #2563eb;
  color: white;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  font-weight: 500;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s;
  text-decoration: none;
}

.prism-report-button:hover {
  background-color: #1d4ed8;
}

.prism-report-button-secondary {
  background-color: #6b7280;
}

.prism-report-button-secondary:hover {
  background-color: #4b5563;
}

/* Family management forms */
.prism-family-form {
  background-color: white;
  border-radius: 0.5rem;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.prism-family-form-section {
  margin-bottom: 2rem;
}

.prism-family-form-section:last-child {
  margin-bottom: 0;
}

.prism-family-form-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(229, 231, 235, 0.5);
}

.prism-family-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1rem;
}

.prism-family-form-field {
  display: flex;
  flex-direction: column;
}

.prism-family-form-label {
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.5rem;
}

.prism-family-form-input {
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.prism-family-form-input:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

.prism-family-form-select {
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  background-color: white;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.prism-family-form-select:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

.prism-family-form-textarea {
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  min-height: 100px;
  resize: vertical;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.prism-family-form-textarea:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

/* Emergency contact information */
.prism-emergency-contact {
  background-color: rgba(239, 68, 68, 0.05);
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: 0.5rem;
  padding: 1rem;
  margin-bottom: 1rem;
}

.prism-emergency-contact-header {
  display: flex;
  align-items: center;
  margin-bottom: 0.75rem;
}

.prism-emergency-contact-title {
  font-weight: 600;
  color: #dc2626;
  margin-left: 0.5rem;
}

.prism-emergency-contact-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0.75rem;
}

.prism-emergency-contact-field {
  display: flex;
  flex-direction: column;
}

.prism-emergency-contact-label {
  font-size: 0.75rem;
  font-weight: 500;
  color: #7f1d1d;
  margin-bottom: 0.25rem;
}

.prism-emergency-contact-value {
  font-size: 0.875rem;
  color: #dc2626;
}

/* School closure notices */
.prism-closure-notice {
  background-color: rgba(251, 146, 60, 0.1);
  border: 1px solid rgba(251, 146, 60, 0.3);
  border-radius: 0.5rem;
  padding: 1rem;
  margin-bottom: 1rem;
}

.prism-closure-notice-header {
  display: flex;
  align-items: center;
  margin-bottom: 0.75rem;
}

.prism-closure-notice-title {
  font-weight: 600;
  color: #ea580c;
  margin-left: 0.5rem;
}

.prism-closure-notice-date {
  font-size: 0.875rem;
  color: #9a3412;
  margin-bottom: 0.5rem;
}

.prism-closure-notice-description {
  font-size: 0.875rem;
  color: #7c2d12;
  line-height: 1.5;
}

/* School overview box */
.prism-school-overview-box {
  background-color: rgba(254, 215, 170, 0.1); /* bg-orange-500/10 */
  border: 1px solid rgba(251, 146, 60, 0.3); /* border-orange-400/30 */
  border-radius: 0.5rem;
  padding: 1rem;
}

.prism-school-overview-title {
  font-weight: 500;
  color: #c2410c; /* text-orange-700 */
  margin-bottom: 0.75rem;
}

.prism-school-overview-note {
  font-size: 0.875rem;
  opacity: 0.8;
}

/* School schedule widget */
.prism-school-day-group {
  margin-bottom: 1rem;
}

.prism-school-day-group:last-child {
  margin-bottom: 0;
}

.prism-school-day-header {
  font-weight: 600;
  color: #111827; /* text-gray-900 */
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.5rem;
}

.prism-school-day-header:not(:first-child) {
  margin-top: 1rem;
}

.prism-school-closure-notice {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
}

.prism-school-closure-text {
  color: #374151; /* text-gray-700 */
  font-style: italic;
}

.prism-school-event-item {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.prism-school-event-item:last-child {
  margin-bottom: 0;
}

.prism-school-event-time {
  font-weight: 500;
  color: #111827; /* text-gray-900 */
}

.prism-school-event-details {
  margin-left: 0.5rem;
  color: #1f2937; /* text-gray-800 */
}

/* School widget icons */
.prism-school-icon-orange {
  font-size: 0.75rem;
  margin-right: 0.5rem;
  vertical-align: middle;
  color: #ea580c; /* text-orange-600 */
}

.prism-school-icon-blue {
  font-size: 0.75rem;
  margin-right: 0.5rem;
  vertical-align: middle;
  color: #2563eb; /* text-blue-600 */
}

.prism-school-icon-purple {
  font-size: 0.75rem;
  margin-right: 0.5rem;
  vertical-align: middle;
  color: #9333ea; /* text-purple-600 */
}

.prism-school-icon-small {
  font-size: 0.75rem;
  margin-right: 0.25rem;
  vertical-align: middle;
}

/* School single event and no events */
.prism-school-single-event {
  font-size: 0.875rem;
  opacity: 0.9;
}

.prism-school-student-names {
  color: #dbeafe; /* text-blue-100 */
}

.prism-school-no-events {
  font-size: 0.875rem;
  opacity: 0.7;
}

/* School Dashboard Layout */
.prism-school-section-container {
  margin-bottom: 1rem;
}

.prism-school-section-title {
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
}

.prism-school-section-subtitle {
  font-size: 0.875rem;
  font-weight: 400;
  color: #6b7280; /* text-gray-500 */
  margin-left: 0.5rem;
}

/* School Icon Colors */
.prism-school-icon-green {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #10b981; /* text-green-500 */
}

.prism-school-icon-indigo {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #6366f1; /* text-indigo-500 */
}

.prism-school-icon-cyan {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #06b6d4; /* text-cyan-500 */
}

.prism-school-icon-blue {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #3b82f6; /* text-blue-500 */
}

.prism-school-icon-purple {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #8b5cf6; /* text-purple-500 */
}

.prism-school-icon-blue-small {
  font-size: 0.875rem;
  color: #2563eb; /* text-blue-600 */
}

.prism-school-icon-green-small {
  font-size: 0.875rem;
  color: #059669; /* text-green-600 */
}

/* School Content Cards */
.prism-school-content-card-blue {
  background-color: rgba(59, 130, 246, 0.1); /* bg-blue-500/10 */
  border: 1px solid rgba(96, 165, 250, 0.3); /* border-blue-400/30 */
  border-radius: 0.5rem;
  padding: 1rem;
}

.prism-school-content-card-green {
  background-color: rgba(16, 185, 129, 0.1); /* bg-green-500/10 */
  border: 1px solid rgba(52, 211, 153, 0.3); /* border-green-400/30 */
  border-radius: 0.5rem;
  padding: 1rem;
}

.prism-school-card-spacing {
  margin-bottom: 1rem;
}

.prism-school-card-title-with-icon {
  font-weight: 600;
  color: #111827; /* text-gray-900 */
  margin-bottom: 0.25rem;
  display: flex;
  align-items: center;
}

/* School Closure Styles */
.prism-school-closure-current {
  background-color: rgba(254, 240, 138, 0.3); /* bg-yellow-100/30 */
  border-left: 4px solid #eab308; /* border-yellow-500 */
}

.prism-school-closure-upcoming {
  background-color: rgba(255, 255, 255, 0.3); /* bg-white/30 */
}

.prism-school-closure-past {
  background-color: rgba(243, 244, 246, 0.2); /* bg-gray-100/20 */
}

.prism-school-closure-row {
  padding: 1rem;
}

.prism-school-closure-border {
  border-top: 1px solid rgba(147, 197, 253, 0.3); /* border-blue-300/30 */
}

.prism-school-closure-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.prism-school-closure-content {
  flex: 1;
}

.prism-school-closure-title-row {
  display: flex;
  align-items: center;
  margin-bottom: 0.25rem;
}

.prism-school-closure-icon {
  font-size: 0.875rem;
  margin-right: 0.5rem;
}

.prism-school-closure-icon-active {
  color: #4f46e5; /* text-indigo-600 */
}

.prism-school-closure-icon-inactive {
  color: #6b7280; /* text-gray-500 */
}

.prism-school-closure-title {
  font-weight: 600;
}

/* Additional form classes for enrollment management */
.prism-form-input-disabled {
  background-color: #f9fafb;
  cursor: not-allowed;
}

.prism-align-middle {
  vertical-align: middle;
}

/* Button color variants for enrollment forms */
.prism-btn-purple {
  padding: 0.5rem 1rem;
  background-color: #9333ea;
  color: white;
  border-radius: 0.5rem;
  transition: background-color 0.15s;
  display: inline-flex;
  align-items: center;
  font-weight: 500;
  border: none;
  cursor: pointer;
}

.prism-btn-purple:hover {
  background-color: #7c3aed;
}

/* Modal icon and utility classes */
.prism-modal-icon-large {
  font-size: 1.25rem;
}

.prism-text-red {
  color: #dc2626;
}

.prism-mr-sm {
  margin-right: 0.5rem;
}

/* Temporary password status styles */
.prism-school-temp-password-warning {
  margin-top: 0.5rem;
  padding: 0.5rem;
  background-color: #fefce8;
  border: 1px solid #fde047;
  border-radius: 0.25rem;
}

.prism-school-temp-password-content {
  display: flex;
  align-items: flex-start;
}

.prism-school-temp-password-icon {
  color: #ca8a04;
  font-size: 0.875rem;
  margin-right: 0.25rem;
  margin-top: 0.125rem;
}

.prism-school-temp-password-text {
  font-size: 0.75rem;
  font-weight: 500;
  color: #a16207;
}

.prism-school-temp-password-code {
  font-family: monospace;
  background-color: #fef3c7;
  padding: 0.125rem 0.25rem;
  border-radius: 0.25rem;
}

.prism-school-temp-password-note {
  font-size: 0.75rem;
  color: #ca8a04;
  margin-top: 0.25rem;
}

.prism-school-password-success {
  margin-top: 0.5rem;
  padding: 0.5rem;
  background-color: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 0.25rem;
}

.prism-school-password-success-content {
  display: flex;
  align-items: center;
}

.prism-school-password-success-icon {
  color: #16a34a;
  font-size: 0.875rem;
  margin-right: 0.25rem;
}

.prism-school-password-success-text {
  font-size: 0.75rem;
  color: #16a34a;
}

/* ========================================
   REPORT STYLES - MODULE-SPECIFIC OVERRIDES

   NOTE: All reports now use consolidated .prism-reports-* classes from modules/common/styles.css
   This section contains only module-specific color overrides for icons and focus states.

   TODO: Remove all duplicate container/header/form styles from this file in future refactoring.
   The legacy styles below (.prism-school-[report]-*) can be removed once we confirm
   all reports are using the new consolidated classes correctly.
   ======================================== */

/* Report Icon Colors - Module-Specific */
.prism-school-family-page-icon {
  color: #2563eb; /* Blue */
}

.prism-school-absence-page-icon {
  color: #a855f7; /* Purple */
}

.prism-school-emergency-page-icon {
  color: #dc2626; /* Red */
}

.prism-school-roster-page-icon {
  color: #9333ea; /* Purple */
}

.prism-school-attendance-page-icon {
  color: #16a34a; /* Green */
}

/* Report Focus States - Module-Specific */
.prism-school-family-year-select:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.prism-school-absence-year-select:focus,
.prism-school-absence-month-select:focus {
  border-color: #a855f7;
  box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.1);
}

.prism-school-emergency-year-select:focus {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

.prism-school-roster-year-select:focus {
  border-color: #9333ea;
  box-shadow: 0 0 0 3px rgba(147, 51, 234, 0.1);
}

.prism-school-attendance-year-select:focus,
.prism-school-attendance-week-select:focus {
  border-color: #16a34a;
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.1);
}

/* ========================================
   LEGACY REPORT STYLES (TO BE REMOVED)
   The styles below are duplicates of .prism-reports-* in modules/common/styles.css
   ======================================== */

/* ========================================
   FAMILY ROSTER REPORT STYLES
   ======================================== */

/* Main report container */
.prism-school-family-report-container {
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 1.5rem;
}

/* Report header section */
.prism-school-family-report-header {
  padding-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.prism-school-family-header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

/* Page title and description */
.prism-school-family-page-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1f2937;
  display: flex;
  align-items: center;
}

.prism-school-family-page-icon {
  color: #2563eb;
  margin-right: 0.75rem;
}

.prism-school-family-page-description {
  color: #6b7280;
}

/* Header actions */
.prism-school-family-header-actions {
  display: flex;
  align-items: end;
  gap: 1rem;
}

.prism-school-family-year-form {
  display: flex;
  align-items: end;
}

.prism-school-family-year-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.prism-school-family-year-select {
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  transition: all 0.2s;
}

.prism-school-family-year-select:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

/* Main content area */
.prism-school-family-content {
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Empty state */
.prism-school-family-empty-state {
  text-align: center;
  padding: 2rem 0;
}

.prism-school-family-empty-icon {
  font-size: 2.25rem;
  color: #9ca3af;
  margin-bottom: 1rem;
}

.prism-school-family-empty-text {
  color: #6b7280;
}

/* Table container and base table */
.prism-school-family-table-container {
  overflow-x: auto;
}

.prism-school-family-table {
  width: 100%;
  border-collapse: collapse;
}

/* Table header */
.prism-school-family-table-header-row {
  background-color: #374151;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.prism-school-family-table-header-cell {
  border: 1px solid #d1d5db;
  padding: 0.75rem 1rem;
  text-align: left;
  font-weight: 700;
  color: white;
}

/* Table body rows and cells */
.prism-school-family-table-row {
  transition: background-color 0.2s;
}

.prism-school-family-table-row:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.prism-school-family-table-cell {
  border: 1px solid #d1d5db;
  padding: 0.75rem 1rem;
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

/* Content within cells */
.prism-school-family-student-name {
  font-weight: 500;
  color: #1f2937;
}

.prism-school-family-parent-names {
  font-size: 0.875rem;
  color: #6b7280;
  margin-top: 0.25rem;
}

.prism-school-family-phone-number {
  color: #1f2937;
  white-space: nowrap;
}

.prism-school-family-email {
  color: #1f2937;
}

/* Table footer */
.prism-school-family-table-footer-row {
  background-color: #d1d5db;
  border-top: 2px solid #9ca3af;
}

.prism-school-family-table-footer-text {
  font-weight: 600;
  color: #374151;
}

/* ========================================
   ABSENCE REPORT STYLES
   ======================================== */

/* Main report container */
.prism-school-absence-report-container {
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 1.5rem;
}

/* Report header section */
.prism-school-absence-report-header {
  padding-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.prism-school-absence-header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

/* Page title and description */
.prism-school-absence-page-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1f2937;
  display: flex;
  align-items: center;
}

.prism-school-absence-page-icon {
  color: #a855f7;
  margin-right: 0.75rem;
}

.prism-school-absence-page-description {
  color: #6b7280;
}

/* Header actions */
.prism-school-absence-header-actions {
  display: flex;
  align-items: end;
  gap: 1rem;
}

.prism-school-absence-year-form,
.prism-school-absence-month-form {
  display: flex;
  align-items: end;
}

.prism-school-absence-year-label,
.prism-school-absence-month-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.prism-school-absence-year-select,
.prism-school-absence-month-select {
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  transition: all 0.2s;
}

.prism-school-absence-year-select:focus,
.prism-school-absence-month-select:focus {
  outline: none;
  border-color: #a855f7;
  box-shadow: 0 0 0 2px rgba(168, 85, 247, 0.2);
}

/* ========================================
   EMERGENCY CONTACT REPORT STYLES
   ======================================== */

/* Main report container */
.prism-school-emergency-report-container {
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 1.5rem;
}

/* Report header section */
.prism-school-emergency-report-header {
  padding-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.prism-school-emergency-header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

/* Page title and description */
.prism-school-emergency-page-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1f2937;
  display: flex;
  align-items: center;
}

.prism-school-emergency-page-icon {
  color: #dc2626;
  margin-right: 0.75rem;
}

.prism-school-emergency-page-description {
  color: #6b7280;
}

/* Header actions */
.prism-school-emergency-header-actions {
  display: flex;
  align-items: end;
  gap: 1rem;
}

.prism-school-emergency-year-form {
  display: flex;
  align-items: end;
}

.prism-school-emergency-year-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.prism-school-emergency-year-select {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  transition: all 0.2s;
}

.prism-school-emergency-year-select:focus {
  outline: none;
  border-color: #dc2626;
  box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.2);
}

/* Main content area */
.prism-school-emergency-content {
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Empty state */
.prism-school-emergency-empty-state {
  text-align: center;
  padding: 2rem 0;
}

.prism-school-emergency-empty-icon {
  font-size: 2.25rem;
  color: #9ca3af;
  margin-bottom: 1rem;
}

.prism-school-emergency-empty-text {
  color: #6b7280;
}

/* Student list container */
.prism-school-emergency-student-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Individual student cards */
.prism-school-emergency-student-card {
  background-color: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid #d1d5db;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.prism-school-emergency-student-header {
  background-color: #374151;
  color: white;
  padding: 0.75rem 1rem 0.25rem 1rem;
  border-radius: 0.5rem 0.5rem 0 0;
}

.prism-school-emergency-student-name {
  font-weight: 700;
  font-size: 1.125rem;
  display: flex;
  align-items: center;
}

.prism-school-emergency-student-icon {
  color: #fca5a5;
  margin-right: 0.5rem;
}

.prism-school-emergency-student-content {
  padding: 0.25rem 1rem 1rem 1rem;
}

/* Contact table */
.prism-school-emergency-contact-table {
  width: 100%;
}

.prism-school-emergency-contact-row {
  border-bottom: 1px solid rgba(229, 231, 235, 0.5);
}

.prism-school-emergency-contact-row:last-child {
  border-bottom: none;
}

.prism-school-emergency-contact-name-cell {
  padding: 0.5rem 1rem 0.5rem 0;
}

.prism-school-emergency-contact-name-content {
  display: flex;
  align-items: center;
}

.prism-school-emergency-contact-person-icon {
  font-size: 0.875rem;
  margin-right: 0.5rem;
}

.prism-school-emergency-contact-person-icon-active {
  color: #059669;
}

.prism-school-emergency-contact-person-icon-inactive {
  color: #6b7280;
}

.prism-school-emergency-contact-name {
  font-weight: 700;
  color: #1f2937;
}

.prism-school-emergency-contact-type {
  color: #6b7280;
  margin-left: 0.5rem;
}

.prism-school-emergency-contact-phone-cell {
  padding: 0.5rem 0;
  text-align: right;
  width: 170px;
  min-width: 170px;
}

.prism-school-emergency-contact-phone-content {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.prism-school-emergency-contact-phone-icon-active {
  color: #059669;
  font-size: 0.875rem;
  margin-right: 0.5rem;
}

.prism-school-emergency-contact-phone-icon-inactive {
  color: #9ca3af;
  font-size: 0.875rem;
  margin-right: 0.5rem;
}

.prism-school-emergency-contact-phone-number {
  font-weight: 500;
  color: #1f2937;
}

.prism-school-emergency-contact-no-phone {
  color: #6b7280;
  font-style: italic;
}

/* No contacts state */
.prism-school-emergency-no-contacts {
  text-align: center;
  padding: 1rem 0;
}

.prism-school-emergency-no-contacts-icon {
  color: #9ca3af;
  font-size: 1.5rem;
  margin-bottom: 0.5rem;
}

.prism-school-emergency-no-contacts-text {
  color: #6b7280;
  font-style: italic;
}

/* Summary card */
.prism-school-emergency-summary-card {
  background-color: #d1d5db;
  border: 2px solid #9ca3af;
  border-radius: 0.5rem;
  padding: 1rem;
  margin-top: 1.5rem;
}

.prism-school-emergency-summary-text {
  font-weight: 600;
  color: #374151;
  text-align: center;
}

/* ========================================
   ROSTER REPORT STYLES
   ======================================== */

/* Main report container */
.prism-school-roster-report-container {
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 1.5rem;
}

/* Report header section */
.prism-school-roster-report-header {
  padding-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.prism-school-roster-header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

/* Page title and description */
.prism-school-roster-page-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1f2937;
  display: flex;
  align-items: center;
}

.prism-school-roster-page-icon {
  color: #8b5cf6;
  margin-right: 0.75rem;
}

.prism-school-roster-page-description {
  color: #6b7280;
}

/* Header actions */
.prism-school-roster-header-actions {
  display: flex;
  align-items: end;
  gap: 1rem;
}

.prism-school-roster-year-form {
  display: flex;
  align-items: end;
}

.prism-school-roster-year-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.prism-school-roster-year-select {
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  transition: all 0.2s;
}

.prism-school-roster-year-select:focus {
  outline: none;
  border-color: #8b5cf6;
  box-shadow: 0 0 0 2px rgba(139, 92, 246, 0.2);
}

/* Main content area */
.prism-school-roster-content {
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* ========================================
 * Attendance Report Styles (matching roster styling)
 * ======================================== */
.prism-school-attendance-report-container {
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 1.5rem;
}

.prism-school-attendance-report-header {
  padding-top: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.prism-school-attendance-header-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.prism-school-attendance-content {
  padding-bottom: 1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Empty state */
.prism-school-roster-empty-state {
  text-align: center;
  padding: 2rem 0;
}

.prism-school-roster-empty-icon {
  font-size: 2.25rem;
  color: #9ca3af;
  margin-bottom: 1rem;
}

.prism-school-roster-empty-text {
  color: #6b7280;
}

/* Print button styles */
.prism-school-print-button {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem;
    background-color: #4b5563;
    color: white;
    border-radius: 0.5rem;
    transition: all 0.3s;
    border: none;
    cursor: pointer;
}

.prism-school-print-button:hover {
    background-color: #374151;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

.prism-school-print-text {
    display: none;
    transition: all 0.3s;
}

.prism-school-print-button:hover .prism-school-print-text {
    display: inline;
}

@media print {
    .prism-school-print-button {
        display: none;
    }
}/* ========================================
   EXTRACTED SCHOOL-SPECIFIC CSS RULES
   Moved from modules/common/styles.css
   ======================================== */

.prism-school-overview-box {
  background-color: rgba(254, 215, 170, 0.1); /* bg-orange-500/10 */
  border: 1px solid rgba(251, 146, 60, 0.3); /* border-orange-400/30 */
  border-radius: 0.5rem;
  padding: 1rem;
}

.prism-school-overview-title {
  font-weight: 500;
  color: #c2410c; /* text-orange-700 */
  margin-bottom: 0.75rem;
}

.prism-school-overview-note {
  font-size: 0.875rem;
  opacity: 0.8;
}

.prism-school-day-group {
  margin-bottom: 1rem;
}

.prism-school-day-group:last-child {
  margin-bottom: 0;
}

.prism-school-day-header {
  font-weight: 600;
  color: #111827; /* text-gray-900 */
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.5rem;
}

.prism-school-day-header:not(:first-child) {
  margin-top: 1rem;
}

.prism-school-closure-notice {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
}

.prism-school-closure-text {
  color: #374151; /* text-gray-700 */
  font-style: italic;
}

.prism-school-event-item {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.prism-school-event-item:last-child {
  margin-bottom: 0;
}

.prism-school-event-time {
  font-weight: 500;
  color: #111827; /* text-gray-900 */
}

.prism-school-event-details {
  margin-left: 0.5rem;
  color: #1f2937; /* text-gray-800 */
}

.prism-school-icon-orange {
  font-size: 0.75rem;
  margin-right: 0.5rem;
  vertical-align: middle;
  color: #ea580c; /* text-orange-600 */
}

.prism-school-icon-blue {
  font-size: 0.75rem;
  margin-right: 0.5rem;
  vertical-align: middle;
  color: #2563eb; /* text-blue-600 */
}

.prism-school-icon-purple {
  font-size: 0.75rem;
  margin-right: 0.5rem;
  vertical-align: middle;
  color: #9333ea; /* text-purple-600 */
}

.prism-school-icon-small {
  font-size: 0.75rem;
  margin-right: 0.25rem;
  vertical-align: middle;
}

.prism-school-single-event {
  font-size: 0.875rem;
  opacity: 0.9;
}

.prism-school-student-names {
  color: #dbeafe; /* text-blue-100 */
}

.prism-school-no-events {
  font-size: 0.875rem;
  opacity: 0.7;
}

.prism-school-section-container {
  margin-bottom: 1rem;
}

.prism-school-section-title {
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
}

.prism-school-section-subtitle {
  font-size: 0.875rem;
  font-weight: 400;
  color: #6b7280; /* text-gray-500 */
  margin-left: 0.5rem;
}

.prism-school-icon-green {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #10b981; /* text-green-500 */
}

.prism-school-icon-indigo {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #6366f1; /* text-indigo-500 */
}

.prism-school-icon-cyan {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #06b6d4; /* text-cyan-500 */
}

.prism-school-icon-blue {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #3b82f6; /* text-blue-500 */
}

.prism-school-icon-purple {
  font-size: 1.25rem;
  margin-right: 0.75rem;
  color: #8b5cf6; /* text-purple-500 */
}

.prism-school-icon-blue-small {
  font-size: 0.875rem;
  color: #2563eb; /* text-blue-600 */
}

.prism-school-icon-green-small {
  font-size: 0.875rem;
  color: #059669; /* text-green-600 */
}

.prism-school-content-card-blue {
  background-color: rgba(59, 130, 246, 0.1); /* bg-blue-500/10 */
  border: 1px solid rgba(96, 165, 250, 0.3); /* border-blue-400/30 */
  border-radius: 0.5rem;
  padding: 1rem;
}

.prism-school-content-card-green {
  background-color: rgba(16, 185, 129, 0.1); /* bg-green-500/10 */
  border: 1px solid rgba(52, 211, 153, 0.3); /* border-green-400/30 */
  border-radius: 0.5rem;
  padding: 1rem;
}

.prism-school-card-spacing {
  margin-bottom: 1rem;
}

.prism-school-card-title-with-icon {
  font-weight: 600;
  color: #111827; /* text-gray-900 */
  margin-bottom: 0.25rem;
  display: flex;
  align-items: center;
}

.prism-school-closure-current {
  background-color: rgba(254, 240, 138, 0.3); /* bg-yellow-100/30 */
  border-left: 4px solid #eab308; /* border-yellow-500 */
}

.prism-school-closure-upcoming {
  background-color: rgba(255, 255, 255, 0.3); /* bg-white/30 */
}

.prism-school-closure-past {
  background-color: rgba(243, 244, 246, 0.2); /* bg-gray-100/20 */
}

.prism-school-closure-row {
  padding: 1rem;
}

.prism-school-closure-border {
  border-top: 1px solid rgba(147, 197, 253, 0.3); /* border-blue-300/30 */
}

.prism-school-closure-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.prism-school-closure-content {
  flex: 1;
}

.prism-school-closure-title-row {
  display: flex;
  align-items: center;
  margin-bottom: 0.25rem;
}

.prism-school-closure-icon {
  font-size: 0.875rem;
  margin-right: 0.5rem;
}

.prism-school-closure-icon-active {
  color: #4f46e5; /* text-indigo-600 */
}

.prism-school-closure-icon-inactive {
  color: #6b7280; /* text-gray-500 */
}

.prism-school-closure-title {
  font-weight: 600;
  color: #111827; /* text-gray-900 */
}

.prism-school-closure-badge-current {
  margin-left: 0.5rem;
  font-size: 0.75rem;
  background-color: #eab308; /* bg-yellow-500 */
  color: #ffffff; /* text-white */
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
}

.prism-school-closure-details {
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
  margin-left: 1.5rem;
}

.prism-school-closure-description {
  display: block;
  margin-top: 0.25rem;
  color: #6b7280; /* text-gray-500 */
}

.prism-school-closure-badge-container {
  margin-left: 1rem;
}

.prism-school-closure-type-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
}

.prism-school-closure-type-holiday {
  background-color: #dcfce7; /* bg-green-100 */
  color: #166534; /* text-green-800 */
}

.prism-school-closure-type-closure {
  background-color: #fed7aa; /* bg-orange-100 */
  color: #9a3412; /* text-orange-800 */
}

.prism-school-info-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  font-size: 0.875rem;
}

  .prism-school-info-grid {
    grid-template-columns: 1fr 1fr;
  }

.prism-school-info-label {
  font-weight: 500;
  color: #374151; /* text-gray-700 */
}

.prism-school-info-value {
  color: #4b5563; /* text-gray-600 */
  margin-top: 0.25rem;
}

.prism-school-info-label-warning {
  font-weight: 500;
  color: #c2410c; /* text-orange-700 */
}

.prism-school-info-value-warning {
  color: #ea580c; /* text-orange-600 */
}

.prism-school-info-label-special {
  font-weight: 500;
  color: #7c3aed; /* text-purple-700 */
}

.prism-school-info-value-special {
  color: #9333ea; /* text-purple-600 */
}

.prism-school-info-label-medical {
  font-weight: 500;
  color: #b91c1c; /* text-red-700 */
}

.prism-school-info-value-medical {
  color: #dc2626; /* text-red-600 */
}

.prism-school-info-full-width {
  grid-column: span 2;
}

  .prism-school-info-full-width {
    grid-column: span 1;
  }

.prism-school-contact-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.prism-school-contact-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  background-color: rgba(255, 255, 255, 0.3); /* bg-white/30 */
  padding: 0.75rem;
  border-radius: 0.375rem;
}

.prism-school-contact-info {
  flex: 1;
}

.prism-school-contact-name {
  font-weight: 500;
  color: #111827; /* text-gray-900 */
}

.prism-school-contact-relationship {
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
}

.prism-school-contact-details {
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
  margin-top: 0.25rem;
}

.prism-school-pickup-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.5rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
  background-color: #dbeafe; /* bg-blue-100 */
  color: #1e40af; /* text-blue-800 */
}

.prism-school-student-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.prism-school-student-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}

.prism-school-student-name {
  font-weight: 600;
  color: #111827; /* text-gray-900 */
  font-size: 1.125rem;
}

.prism-school-group-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
  background-color: #dbeafe; /* bg-blue-100 */
  color: #1e40af; /* text-blue-800 */
}

.prism-school-student-number {
  font-size: 0.875rem;
  color: #6b7280; /* text-gray-500 */
}

.prism-school-table-container {
  background-color: rgba(59, 130, 246, 0.1); /* bg-blue-500/10 */
  border: 1px solid rgba(96, 165, 250, 0.3); /* border-blue-400/30 */
  border-radius: 0.5rem;
  overflow: hidden;
}

.prism-school-table-scroll {
  overflow-x: auto;
}

.prism-school-table {
  width: 100%;
}

.prism-school-table-header {
  background-color: rgba(37, 99, 235, 0.2); /* bg-blue-600/20 */
}

.prism-school-table-header-row {
  text-align: left;
}

.prism-school-table-th {
  padding: 0.25rem 0.25rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151; /* text-gray-700 */
}

.prism-school-table-body {
  border-top: 1px solid rgba(147, 197, 253, 0.3); /* divide-blue-300/30 */
}

.prism-school-table-body tr {
  border-bottom: 1px solid rgba(147, 197, 253, 0.3); /* divide-blue-300/30 */
}

.prism-school-table-row:hover {
  background-color: rgba(255, 255, 255, 0.2); /* hover:bg-white/20 */
}

.prism-school-table-td {
  padding: 0.5rem 0.25rem;
  font-size: 0.875rem;
  color: #111827; /* text-gray-900 */
}

.prism-school-table-td-name {
  padding: 0.5rem 0.25rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #111827; /* text-gray-900 */
}

.prism-school-table-td-secondary {
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
}

.prism-school-table-td-small {
  font-size: 0.75rem;
  color: #6b7280; /* text-gray-500 */
}

.prism-school-table-empty {
  color: #9ca3af; /* text-gray-400 */
}

.prism-school-status-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.5rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
}

.prism-school-empty-state-blue {
  background-color: rgba(59, 130, 246, 0.1); /* bg-blue-500/10 */
  border: 1px solid rgba(96, 165, 250, 0.3); /* border-blue-400/30 */
  border-radius: 0.5rem;
  padding: 1.5rem;
  text-align: center;
}

.prism-school-empty-state-gray {
  background-color: rgba(107, 114, 128, 0.1); /* bg-gray-500/10 */
  border: 1px solid rgba(156, 163, 175, 0.3); /* border-gray-400/30 */
  border-radius: 0.5rem;
  padding: 1.5rem;
  text-align: center;
}

.prism-school-empty-icon-blue {
  font-size: 2.5rem;
  color: rgba(96, 165, 250, 0.6); /* text-blue-400/60 */
  margin-bottom: 0.75rem;
}

.prism-school-empty-icon-gray {
  font-size: 2.5rem;
  color: #9ca3af; /* text-gray-400 */
  margin-bottom: 0.75rem;
}

.prism-school-empty-text-blue {
  color: rgba(30, 64, 175, 0.7); /* text-blue-800/70 */
}

.prism-school-empty-text-gray {
  color: #4b5563; /* text-gray-600 */
}

.prism-school-admin-dashboard {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.prism-school-admin-welcome-card {
  background-color: rgba(59, 130, 246, 0.2); /* bg-blue-500/20 */
  border: 1px solid rgba(96, 165, 250, 0.3); /* border-blue-400/30 */
  border-radius: 0.5rem;
  padding: 1.5rem;
}

.prism-school-admin-card-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1f2937; /* text-gray-800 */
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
}

.prism-school-admin-title-icon {
  margin-right: 0.5rem;
}

.prism-school-admin-card-text {
  color: #374151; /* text-gray-700 */
  margin-bottom: 1rem;
}

.prism-school-admin-features-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

  .prism-school-admin-features-grid {
    grid-template-columns: 1fr 1fr;
  }

.prism-school-admin-feature-card {
  border-radius: 0.375rem;
  padding: 0.75rem;
}

.prism-school-admin-feature-blue {
  background-color: rgba(37, 99, 235, 0.2); /* bg-blue-600/20 */
}

.prism-school-admin-feature-green {
  background-color: rgba(22, 163, 74, 0.2); /* bg-green-600/20 */
}

.prism-school-admin-feature-purple {
  background-color: rgba(147, 51, 234, 0.2); /* bg-purple-600/20 */
}

.prism-school-admin-feature-orange {
  background-color: rgba(234, 88, 12, 0.2); /* bg-orange-600/20 */
}

.prism-school-admin-feature-title {
  font-weight: 500;
  color: #1f2937; /* text-gray-800 */
  margin-bottom: 0.25rem;
}

.prism-school-admin-feature-description {
  font-size: 0.875rem;
  color: #374151; /* text-gray-700 */
}

.prism-school-admin-info-card {
  background-color: rgba(16, 185, 129, 0.2); /* bg-green-500/20 */
  border: 1px solid rgba(52, 211, 153, 0.3); /* border-green-400/30 */
  border-radius: 0.5rem;
  padding: 1.5rem;
}

.prism-school-admin-info-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1f2937; /* text-gray-800 */
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
}

.prism-school-admin-info-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  color: #374151; /* text-gray-700 */
}

.prism-school-admin-info-item {
  display: flex;
  align-items: flex-start;
}

.prism-school-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}

.prism-school-section-header-styled {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  padding: 1rem 1.5rem;
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 0.5rem;
}

.prism-school-attendance-header {
  display: flex;
  flex-direction: column;
  gap: 0rem;
  margin-bottom: 1rem;
  padding: 0.75rem;
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 0.5rem;
}

.prism-school-header-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.prism-school-header-bottom-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.prism-school-admin-page-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1f2937; /* text-gray-800 */
  margin-bottom: 0rem;
  display: flex;
  align-items: center;
}

.prism-school-admin-page-icon {
  font-size: 1.875rem;
  margin-right: 0.5rem;
  vertical-align: middle;
}

.prism-school-admin-page-description {
  color: #4b5563; /* text-gray-600 */
}

.prism-school-filter-container {
  margin-bottom: 1.5rem;
  background-color: rgba(255, 255, 255, 0.3); /* bg-white/30 */
  backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  padding: 1rem;
}

.prism-school-filter-form {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.prism-school-form-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151; /* text-gray-700 */
  margin-bottom: 0.25rem;
}

.prism-school-form-select {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.5rem;
  background: white;
}

.prism-school-form-select:focus {
  outline: none;
  border-color: #3b82f6; /* focus:border-blue-500 */
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2); /* focus:ring-2 focus:ring-blue-500 */
}

.prism-school-filter-stats {
  display: flex;
  align-items: flex-end;
}

.prism-school-stats-text {
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
}

.prism-school-enrollment-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

  .prism-school-enrollment-layout {
    grid-template-columns: 2fr 1fr;
  }

.prism-school-enrollment-main {
  /* No specific styles needed, handled by grid */
}

.prism-school-enrollment-sidebar {
  /* No specific styles needed, handled by grid */
}

.prism-school-enrollment-card {
  background-color: rgba(255, 255, 255, 0.4); /* bg-white/40 */
  backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2); /* border-white/20 */
  overflow: hidden;
}

.prism-school-card-header {
  padding: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2); /* border-white/20 */
}

.prism-school-card-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1f2937; /* text-gray-800 */
  display: flex;
  align-items: center;
}

.prism-school-card-content {
  padding: 1rem;
}

.prism-school-empty-state {
  text-align: center;
  padding: 2rem 0;
}

.prism-school-empty-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #374151; /* text-gray-700 */
  margin-bottom: 0.5rem;
}

.prism-school-text-small {
  font-size: 0.875rem;
}

.prism-school-student-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem;
  background-color: rgba(255, 255, 255, 0.5); /* bg-white/50 */
  border-radius: 0.375rem;
  border: 1px solid rgba(255, 255, 255, 0.3); /* border-white/30 */
  margin-bottom: 0.5rem;
}

.prism-school-student-item:last-child {
  margin-bottom: 0;
}

.prism-school-student-info {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
}

.prism-school-student-details {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.prism-school-student-name {
  font-weight: 500;
  color: #111827; /* text-gray-900 */
}

.prism-school-student-meta {
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
}

.prism-school-student-grade {
  font-weight: 700;
}

.prism-school-student-warning {
  color: #ea580c; /* text-orange-600 */
  font-weight: 500;
}

.prism-school-student-id {
  font-size: 0.75rem;
  color: #2563eb; /* text-blue-600 */
}

.prism-school-student-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.prism-school-btn-edit {
  background-color: #2563eb; /* bg-blue-600 */
  color: white;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s;
}

.prism-school-btn-edit:hover {
  background-color: #1d4ed8; /* hover:bg-blue-700 */
}

.prism-school-btn-schedule {
  background-color: #16a34a; /* bg-green-600 */
  color: white;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s;
}

.prism-school-btn-schedule:hover {
  background-color: #15803d; /* hover:bg-green-700 */
}

.prism-school-potential-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.prism-school-potential-item {
  padding: 0.5rem;
  background-color: rgba(255, 255, 255, 0.3); /* bg-white/30 */
  border-radius: 0.375rem;
  border: 1px solid rgba(255, 255, 255, 0.2); /* border-white/20 */
}

.prism-school-potential-info {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.prism-school-potential-details {
  flex: 1;
}

.prism-school-potential-name {
  font-weight: 500;
  color: #111827; /* text-gray-900 */
}

.prism-school-potential-meta {
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
}

.prism-school-potential-suggestion {
  font-size: 0.75rem;
  color: #6b7280; /* text-gray-500 */
}

.prism-school-btn-enroll {
  width: 100%;
  background-color: #16a34a; /* bg-green-600 */
  color: white;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.prism-school-btn-enroll:hover {
  background-color: #15803d; /* hover:bg-green-700 */
}

.prism-school-btn-icon {
  font-size: 0.875rem;
  vertical-align: middle;
  margin-left: 0.25rem;
  background: transparent;
  border: none;
  cursor: pointer;
}

.prism-school-mode-toggle {
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(8px);
  border-radius: 0.5rem;
  padding: 0.5rem;
  display: flex;
}

.prism-school-mode-btn {
  padding: 0.5rem 1rem;
  transition: all 0.15s ease;
  border: none;
  cursor: pointer;
}

.prism-school-mode-btn-left {
  border-radius: 0.5rem 0 0 0.5rem;
}

.prism-school-mode-btn-right {
  border-radius: 0 0.5rem 0.5rem 0;
}

.prism-school-mode-btn-active-green {
  background-color: #059669; /* bg-green-600 */
  color: white;
}

.prism-school-mode-btn-active-blue {
  background-color: #2563eb; /* bg-blue-600 */
  color: white;
}

.prism-school-mode-btn-inactive {
  background-color: transparent;
  color: #374151; /* text-gray-700 */
}

.prism-school-mode-btn-inactive:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

.prism-school-attendance-clock {
  text-align: right;
  min-width: 120px;
}

.prism-school-clock-time {
  font-size: 1.875rem;
  font-weight: bold;
}

.prism-school-attendance-count {
  font-size: 0.875rem;
  color: #4b5563; /* text-gray-600 */
}

.prism-school-empty-icon-red {
  font-size: 4rem;
  color: #ef4444; /* text-red-500 */
  margin-bottom: 1rem;
  display: block;
}

.prism-school-table-th-left {
  text-align: left;
}

.prism-school-table-th-center {
  text-align: center;
}

.prism-school-table-td-center {
  text-align: center;
}

.prism-school-table-td-right {
  text-align: right;
}

.prism-school-table-th-nowrap {
  white-space: nowrap;
}

.prism-school-table-th-checkbox {
  /* Remove fixed width to allow auto-sizing around checkbox content */
}

.prism-school-table-th-time {
  /* Remove fixed width to allow auto-sizing around dropdown content */
}

.prism-school-table-th-person {
  /* Remove fixed width to allow auto-sizing around dropdown content */
}

.prism-school-table-th-notes {
  /* Remove fixed width to allow auto-sizing around notes icon */
}

.prism-school-table-row-alt {
  background-color: rgba(255, 255, 255, 0.1);
}

.prism-school-table-td-nowrap {
  white-space: nowrap;
}

.prism-school-attendance-time {
  font-family: monospace;
  color: #374151; /* text-gray-700 */
  text-align: right;
}

.prism-school-checkbox-container {
  display: flex;
  justify-content: center;
}

.prism-school-attendance-checkbox {
  width: 24px;
  height: 24px;
  color: #059669; /* text-green-600 */
  cursor: pointer;
}

.prism-school-time-display-area {
  /* Remove fixed width to allow auto-sizing around dropdown content */
  text-align: center;
}

.prism-school-time-spinner {
  padding: 0.25rem 0.5rem;
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.25rem;
  text-align: center;
  background-color: rgba(255, 255, 255, 0.7);
  width: 60px;
  font-size: 1rem;
}

.prism-school-time-spinner:disabled {
  background-color: #f3f4f6 !important;
  color: #9ca3af !important;
  cursor: not-allowed;
  opacity: 0.6;
}

.prism-school-time-separator {
  color: #6b7280; /* text-gray-500 */
  font-weight: bold;
}

.prism-school-time-dropdown {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.375rem; /* rounded-md */
  background-color: rgba(255, 255, 255, 0.9);
  font-size: 0.875rem;
  width: 100px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.prism-school-time-dropdown:hover {
  border-color: #9ca3af; /* border-gray-400 */
  background-color: rgba(255, 255, 255, 1);
}

.prism-school-time-dropdown:focus {
  outline: none;
  border-color: #3b82f6; /* border-blue-500 */
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.prism-school-time-dropdown:disabled {
  background-color: #f3f4f6 !important;
  color: #9ca3af !important;
  cursor: not-allowed;
  opacity: 0.6;
}

.prism-school-person-dropdown {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.375rem; /* rounded-md */
  background-color: rgba(255, 255, 255, 0.9);
  font-size: 0.875rem;
  width: 140px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.prism-school-person-dropdown:hover {
  border-color: #9ca3af; /* border-gray-400 */
  background-color: rgba(255, 255, 255, 1);
}

.prism-school-person-dropdown:focus {
  outline: none;
  border-color: #3b82f6; /* border-blue-500 */
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.prism-school-person-dropdown:disabled {
  background-color: #f3f4f6 !important;
  color: #9ca3af !important;
  cursor: not-allowed;
  opacity: 0.6;
}

.prism-school-notes-btn {
  border: none;
  background: none;
  cursor: pointer;
  transition: color 0.15s ease;
}

.prism-school-notes-btn-active {
  color: #7c3aed; /* text-purple-600 */
}

.prism-school-notes-btn-active:hover {
  color: #6d28d9; /* text-purple-700 */
}

.prism-school-notes-btn-inactive {
  color: #9ca3af; /* text-gray-400 */
}

.prism-school-notes-btn-inactive:hover {
  color: #6d28d9; /* text-purple-700 */
}

.prism-school-form-actions {
  padding: 1rem;
  background-color: rgba(249, 250, 251, 0.5); /* bg-gray-100/50 */
  border-top: 1px solid #d1d5db; /* border-gray-300 */
}

.prism-school-form-actions-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.prism-school-form-actions-group {
  display: flex;
  gap: 0.5rem;
}

.prism-school-btn-secondary {
  padding: 0.5rem 1rem;
  background-color: #4b5563; /* bg-gray-600 */
  color: white;
  border-radius: 0.5rem;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.prism-school-btn-secondary:hover {
  background-color: #374151; /* bg-gray-700 */
}

.prism-school-btn-primary {
  padding: 0.5rem 1.5rem;
  background-color: #059669; /* bg-green-600 */
  color: white;
  border-radius: 0.5rem;
  border: none;
  cursor: pointer;
  font-weight: 600;
  transition: background-color 0.15s ease;
}

.prism-school-btn-primary:hover {
  background-color: #047857; /* bg-green-700 */
}

.prism-school-admin-feature-disabled {
  background-color: #dbeafe; /* bg-blue-200 */
  color: #93c5fd; /* text-blue-400 */
  cursor: not-allowed;
  opacity: 0.6;
}

.prism-school-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 50;
  display: none;
  align-items: center;
  justify-content: center;
}

.prism-school-modal-overlay.hidden {
  display: none !important;
}

.prism-school-modal-overlay:not(.hidden) {
  display: flex;
}

.prism-school-modal-content {
  background-color: white;
  border-radius: 0.5rem;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  padding: 1.5rem;
  margin: 1rem;
  max-width: 28rem;
  width: 100%;
}

.prism-school-modal-title {
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #1f2937; /* text-gray-800 */
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.prism-school-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 1rem;
}

.prism-school-form-section {
  margin-bottom: 1rem;
}

.prism-school-form-section-hidden {
  display: none;
}

.prism-school-form-input {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.5rem;
  outline: none;
}

.prism-school-form-input:focus {
  border-color: #2563eb; /* border-blue-500 */
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

.prism-school-form-textarea {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.5rem;
  outline: none;
  resize: vertical;
}

.prism-school-form-textarea:focus {
  border-color: #7c3aed; /* border-purple-500 */
  box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.2);
}


  .prism-school-table-td {
    padding: 0.25rem 0.25rem !important;
    line-height: 1.2;
  }

  .prism-school-table-th {
    padding: 0.25rem 0.25rem !important;
  }

  .prism-school-table-row {
    min-height: 40px !important;
    height: 40px;
  }

  .prism-school-student-name {
    line-height: 1.1;
    margin: 0;
  }

  .prism-school-time-spinner {
    font-size: 1rem;
    width: 110px !important;
  }


.prism-school-form-flex-1 {
  flex: 1;
}

.prism-school-badge-legend {
  margin-left: auto;
}

.prism-school-badge-legend-cell {
  text-align: center;
  padding: 0 0.5rem;
}

.prism-school-badge-legend-label {
  padding-right: 0.75rem;
  padding-top: 0.25rem;
  font-size: 0.75rem;
  color: #374151; /* text-gray-700 */
  font-weight: bold;
}

.prism-school-badge-legend-text {
  text-align: center;
  padding: 0 0.5rem;
  padding-top: 0.25rem;
  font-size: 0.75rem;
  color: #4b5563; /* text-gray-600 */
}

.prism-school-badge {
  padding: 0.25rem 0.5rem;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
}

.prism-school-badge-icon {
  font-size: 0.75rem;
}

.prism-school-badge-indigo {
  background-color: #e0e7ff; /* bg-indigo-100 */
  color: #3730a3; /* text-indigo-800 */
}

.prism-school-badge-purple {
  background-color: #f3e8ff; /* bg-purple-100 */
  color: #6b21a8; /* text-purple-800 */
}

.prism-school-badge-red {
  background-color: #fee2e2; /* bg-red-100 */
  color: #991b1b; /* text-red-800 */
}

.prism-school-badge-green {
  background-color: #dcfce7; /* bg-green-100 */
  color: #166534; /* text-green-800 */
}

.prism-school-badge-blue {
  background-color: #dbeafe; /* bg-blue-100 */
  color: #1e40af; /* text-blue-800 */
}

.prism-school-list-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.prism-school-card-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.prism-school-card-title-section {
  flex: 1;
}

.prism-school-card-title-row {
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}

.prism-school-card-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.prism-school-btn-expand {
  background-color: #6b7280; /* bg-gray-500 */
  color: white;
  padding: 0.5rem 0.75rem;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  transition: background-color 0.15s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  border: none;
  cursor: pointer;
}

.prism-school-btn-expand:hover {
  background-color: #4b5563; /* bg-gray-600 */
}

.prism-school-empty-actions {
  margin-top: 1rem;
}

.prism-school-closure-current {
  background-color: #fefce8; /* bg-yellow-50 */
}

.prism-school-closure-upcoming {
  background-color: white;
}

.prism-school-closure-past {
  background-color: #f9fafb; /* bg-gray-50 */
}

.prism-school-closure-badge-current {
  margin-left: 0.5rem;
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
  background-color: #fef3c7; /* bg-yellow-100 */
  color: #92400e; /* text-yellow-800 */
}

.prism-school-closure-type-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
}

.prism-school-closure-type-holiday {
  background-color: #dcfce7; /* bg-green-100 */
  color: #166534; /* text-green-800 */
}

.prism-school-badge-gray {
  background-color: #f3f4f6; /* bg-gray-100 */
  color: #1f2937; /* text-gray-800 */
}

.prism-school-status-active {
  background-color: #dcfce7; /* bg-green-100 */
  color: #166534; /* text-green-800 */
}

.prism-school-status-inactive {
  background-color: #fee2e2; /* bg-red-100 */
  color: #991b1b; /* text-red-800 */
}

.prism-school-table-actions {
  white-space: nowrap;
  font-size: 0.875rem;
  font-weight: 500;
  display: flex;
  gap: 0.5rem;
}

.prism-school-action-btn {
  border: none;
  background: none;
  cursor: pointer;
  transition: color 0.15s ease;
}

.prism-school-action-btn-edit {
  color: #4f46e5; /* text-indigo-600 */
}

.prism-school-action-btn-edit:hover {
  color: #312e81; /* text-indigo-900 */
}

.prism-school-action-btn-success {
  color: #059669; /* text-green-600 */
}

.prism-school-action-btn-success:hover {
  color: #047857; /* text-green-900 */
}

.prism-school-action-btn-danger {
  color: #dc2626; /* text-red-600 */
}

.prism-school-action-btn-danger:hover {
  color: #7f1d1d; /* text-red-900 */
}

.prism-school-form-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  align-items: center;
}

  .prism-school-form-grid {
    grid-template-columns: 1fr 2fr;
  }

.prism-school-form-grid-start {
  align-items: flex-start;
}

.prism-school-form-label-right {
  text-align: left;
}

  .prism-school-form-label-right {
    text-align: right;
  }

.prism-school-form-input-col {
  grid-column: span 1;
}

  .prism-school-form-input-col {
    grid-column: span 1;
  }

.prism-school-required {
  color: #ef4444; /* text-red-500 */
}

.prism-school-form-help {
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: #6b7280; /* text-gray-500 */
}

.prism-school-icon-red {
  color: #dc2626; /* text-red-600 */
}

.prism-school-report-controls {
  display: flex;
  align-items: flex-end;
  gap: 1rem;
}

.prism-school-student-count {
  margin-left: 0.5rem;
}

.prism-school-table-subtitle {
  font-size: 0.75rem;
  font-weight: normal;
  color: #d1d5db; /* text-gray-300 */
  margin-top: 0.25rem;
}

.prism-school-schedule-entry {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.prism-school-schedule-present {
  background-color: #dcfce7; /* bg-green-100 */
}

.prism-school-schedule-absent {
  background-color: #f9fafb; /* bg-gray-50 */
}

.prism-school-schedule-time {
  font-size: 0.75rem;
  color: #4b5563; /* text-gray-600 */
  font-weight: normal;
  margin-left: auto;
}

.prism-school-table-footer {
  background-color: #d1d5db; /* bg-gray-300 */
  border-top: 2px solid #9ca3af; /* border-gray-400 */
}

  .prism-school-table-td {
    padding: 0.25rem 0.25rem !important;
  }

  .prism-school-table-th {
    padding: 0.25rem 0.25rem !important;
  }

  /* Removed first-child specific padding for consistency */

  /* Removed nth-child specific padding for consistency */

/* ========================================
 * Missing Utility Classes
 * ======================================== */
.prism-flex-start {
  display: flex;
  align-items: center;
}

.prism-gap-2 {
  gap: 0.5rem; /* 8px */
}

.prism-bg-gray-200 {
  background-color: #e5e7eb; /* gray-200 */
}

.prism-school-info-card {
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 1rem;
  margin-bottom: 1.5rem;
}

/* Green button utility classes for families interface */
.prism-bg-green-500 {
  background-color: #10b981; /* green-500 */
}

.prism-hover-bg-green-600:hover {
  background-color: #059669; /* green-600 */
}

.prism-bg-green-600 {
  background-color: #059669; /* green-600 */
}

.prism-hover-bg-green-700:hover {
  background-color: #047857; /* green-700 */
}

/* Blue button utility classes for families interface */
.prism-bg-blue-500 {
  background-color: #3b82f6; /* blue-500 */
}

.prism-hover-bg-blue-600:hover {
  background-color: #2563eb; /* blue-600 */
}

.prism-bg-blue-600 {
  background-color: #2563eb; /* blue-600 */
}

.prism-hover-bg-blue-700:hover {
  background-color: #1d4ed8; /* blue-700 */
}

/* Badge utility classes for family member icons */
.prism-badge-green {
  background-color: #dcfce7; /* bg-green-100 */
  color: #166534; /* text-green-800 */
}

.prism-badge-blue {
  background-color: #dbeafe; /* bg-blue-100 */
  color: #1e40af; /* text-blue-800 */
}

.prism-badge-red {
  background-color: #fee2e2; /* bg-red-100 */
  color: #991b1b; /* text-red-800 */
}

.prism-badge-indigo {
  background-color: #e0e7ff; /* bg-indigo-100 */
  color: #3730a3; /* text-indigo-800 */
}

/* Spacing utility for button gaps */
.prism-space-x-2 > * + * {
  margin-left: 0.5rem; /* 8px gap between child elements */
}

.prism-space-x-3 > * + * {
  margin-left: 0.75rem; /* 12px gap between child elements */
}

/* Gray button utility classes for modal footers */
.prism-bg-gray-300 {
  background-color: #d1d5db; /* gray-300 */
}

.prism-hover-bg-gray-400:hover {
  background-color: #9ca3af; /* gray-400 */
}

.prism-bg-gray-50 {
  background-color: #f9fafb; /* gray-50 */
}

.prism-hover-bg-gray-100:hover {
  background-color: #f3f4f6; /* gray-100 */
}

/* Button classes for modals */
.prism-btn-secondary {
  background-color: #6b7280; /* bg-gray-500 */
  color: white;
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s;
}

.prism-btn-secondary:hover {
  background-color: #4b5563; /* hover:bg-gray-600 */
}

  .prism-school-time-spinner {
    width: 50px !important;
    font-size: 0.875rem !important;
  }



  .prism-school-time-display-area {
    /* Remove fixed width to allow auto-sizing around dropdown content */
  }