/* ═══════════════════════════════════════════════════════════════════════════
   SchoolMS — Accessibility CSS (WCAG 2.1)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── SKIP LINK ────────────────────────────────────────────────────────────── */
.skip-link {
  position: fixed;
  top: -100%;
  left: 0;
  background: #1B4F72;
  color: #fff;
  padding: 0.75rem 1.5rem;
  z-index: 10000;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  border-bottom-right-radius: 8px;
  transition: top 0.15s;
}
.skip-link:focus {
  top: 0;
  color: #fff;
}

/* ── FOCUS STYLES (keyboard navigation) ─────────────────────────────────── */
*:focus-visible {
  outline: 3px solid #FFD700 !important;
  outline-offset: 2px !important;
  border-radius: 3px;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid #FFD700 !important;
  outline-offset: 2px !important;
}

/* ── HIGH CONTRAST MODE ──────────────────────────────────────────────────── */
body.high-contrast {
  background: #000000 !important;
  color: #FFFFFF !important;
}

body.high-contrast a {
  color: #FFD700 !important;
}

body.high-contrast a:hover {
  color: #FFA500 !important;
}

body.high-contrast .card,
body.high-contrast .stat-card,
body.high-contrast .quick-action-card {
  background: #111111 !important;
  border: 2px solid #FFFFFF !important;
  color: #FFFFFF !important;
}

body.high-contrast .sidebar {
  background: #000000 !important;
  border-right: 2px solid #FFFFFF !important;
}

body.high-contrast .sidebar-nav .nav-link {
  color: #FFFFFF !important;
}

body.high-contrast .sidebar-nav .nav-link:hover,
body.high-contrast .sidebar-nav .nav-link.active {
  background: #333333 !important;
}

body.high-contrast .topbar {
  background: #000000 !important;
  border-bottom: 2px solid #FFFFFF !important;
  color: #FFFFFF !important;
}

body.high-contrast .content-body {
  background: #000000 !important;
}

body.high-contrast .main-content {
  background: #000000 !important;
}

body.high-contrast .btn-primary {
  background: #000000 !important;
  color: #FFFFFF !important;
  border: 2px solid #FFFFFF !important;
}

body.high-contrast .btn-primary:hover {
  background: #333333 !important;
}

body.high-contrast .btn-outline-primary {
  color: #FFD700 !important;
  border-color: #FFD700 !important;
  background: transparent !important;
}

body.high-contrast .btn-outline-primary:hover {
  background: #FFD700 !important;
  color: #000000 !important;
}

body.high-contrast .form-control,
body.high-contrast .form-select {
  background: #000000 !important;
  color: #FFFFFF !important;
  border: 2px solid #FFFFFF !important;
}

body.high-contrast .form-label {
  color: #FFFFFF !important;
}

body.high-contrast .table {
  color: #FFFFFF !important;
  --bs-table-bg: #000000;
  --bs-table-striped-bg: #111111;
  --bs-table-hover-bg: #222222;
}

body.high-contrast .table thead {
  background: #222222 !important;
  color: #FFFFFF !important;
}

body.high-contrast .badge {
  border: 1px solid rgba(255,255,255,0.5) !important;
}

body.high-contrast .text-muted {
  color: #CCCCCC !important;
}

body.high-contrast .login-right {
  background: #000000 !important;
}

body.high-contrast .login-card {
  background: #000000 !important;
  color: #FFFFFF !important;
}

body.high-contrast .login-title,
body.high-contrast .page-title {
  color: #FFFFFF !important;
}

body.high-contrast .alert {
  border: 2px solid #FFFFFF !important;
  background: #111111 !important;
  color: #FFFFFF !important;
}

body.high-contrast .breadcrumb-item a {
  color: #FFD700 !important;
}

body.high-contrast .breadcrumb-item.active {
  color: #CCCCCC !important;
}

body.high-contrast .nav-section-label {
  color: rgba(255,255,255,0.6) !important;
}

body.high-contrast [class^="role-badge-"] {
  background: #000000 !important;
  color: #FFFFFF !important;
  border: 1px solid #FFFFFF !important;
}

body.high-contrast .profile-avatar-initials,
body.high-contrast .avatar-initials-sm,
body.high-contrast .avatar-initials {
  background: #333333 !important;
  border: 2px solid #FFFFFF !important;
}

body.high-contrast .stat-number {
  color: #FFFFFF !important;
}

body.high-contrast .stat-label {
  color: #CCCCCC !important;
}

body.high-contrast .stat-icon {
  background: #222222 !important;
}

body.high-contrast .list-group-item {
  background: #000000 !important;
  color: #FFFFFF !important;
  border-color: #444444 !important;
}

body.high-contrast .list-group-item-light {
  background: #111111 !important;
}

body.high-contrast .accessibility-bar {
  background: #000000 !important;
  border-bottom: 2px solid #FFFFFF !important;
}

body.high-contrast .a11y-btn {
  border-color: #FFFFFF !important;
  color: #FFFFFF !important;
}

body.high-contrast .a11y-btn:hover,
body.high-contrast .a11y-btn[aria-pressed="true"] {
  background: #FFFFFF !important;
  color: #000000 !important;
}

/* ── REDUCED MOTION ──────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

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