/* Custom Styles & WCAG Enhancements */

:root {
  --base-font-size: 1rem;
}

body {
  font-size: var(--base-font-size);
  background-color: #f8f9fa;
  color: #212529;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  min-height: 100vh;
}

.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: #000;
  color: #fff;
  padding: 8px 16px;
  z-index: 9999;
  text-decoration: none;
  font-weight: bold;
  transition: top 0.2s ease;
}

.skip-link:focus {
  top: 0;
}

.fs-7 {
  font-size: 0.875rem;
}

.max-w-200 { max-width: 200px; }
.max-w-300 { max-width: 300px; }
.max-w-400 { max-width: 400px; }
.max-w-500 { max-width: 500px; }
.max-w-800 { max-width: 800px; }
.max-w-900 { max-width: 900px; }

/* Slide Images */
.slide-image-wrapper {
  max-height: 220px;
  overflow: hidden;
  border-top-left-radius: calc(0.375rem - 1px);
  border-top-right-radius: calc(0.375rem - 1px);
}

.slide-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
}

/* WCAG Focus Indicators */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.slide-card:focus-visible {
  outline: 3px solid #0d6efd !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

/* Form Controls accessibility */
.form-check-input {
  width: 1.25em;
  height: 1.25em;
  margin-top: 0.15em;
  cursor: pointer;
}

.form-check-label {
  cursor: pointer;
  padding-left: 0.25em;
}

/* High Contrast Mode */
body.high-contrast {
  background-color: #000000 !important;
  color: #ffffff !important;
}

body.high-contrast .card,
body.high-contrast .navbar,
body.high-contrast .modal-content,
body.high-contrast .wcag-bar {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 2px solid #ffff00 !important;
}

body.high-contrast a,
body.high-contrast .text-primary,
body.high-contrast .text-secondary,
body.high-contrast .text-muted {
  color: #ffff00 !important;
}

body.high-contrast .btn-primary {
  background-color: #ffff00 !important;
  color: #000000 !important;
  border-color: #ffff00 !important;
  font-weight: bold;
}

body.high-contrast .btn-outline-secondary,
body.high-contrast .btn-outline-light {
  border-color: #ffffff !important;
  color: #ffffff !important;
}

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

body.high-contrast .form-check-input {
  border: 2px solid #ffffff !important;
  background-color: #000000;
}

body.high-contrast .form-check-input:checked {
  background-color: #ffff00 !important;
  border-color: #ffff00 !important;
}

body.high-contrast .progress {
  background-color: #333333 !important;
  border: 1px solid #ffffff;
}

body.high-contrast .progress-bar {
  background-color: #ffff00 !important;
}