/**
 * Grand Jury Reports - Monterey Style with WCAG 2.1 AA Compliance
 * All color contrasts meet 4.5:1 minimum for normal text, 3:1 for large text
 */

/* ============================================================================
   YEAR SECTIONS
   ============================================================================ */

.grand-jury-year-section {
  margin-bottom: 3rem;
  padding-bottom: 2rem;
  
}

.grand-jury-year-section:last-child {
  border-bottom: none;
}

/* Year heading - Large, bold, navy blue */
.grand-jury-year-heading {
  font-size: 2rem;
  font-weight: bold;
  color: #1b2b85; /* JCC heading blue - 11.16:1 contrast ratio (AAA) */
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 3px solid #005ea2; /* Primary blue */
}

/* ============================================================================
   SUBSECTION HEADINGS (Reports / Responses)
   ============================================================================ */

.grand-jury-subsection {
  margin-bottom: 2rem;
}

.grand-jury-subsection-heading {
  font-size: 1.5rem;
  font-weight: bold;
  color: #1b2b85; /* 11.16:1 contrast ratio (AAA) */
  margin-bottom: 1rem;
  margin-top: 0;
}

/* ============================================================================
   DOCUMENT LISTS
   ============================================================================ */

.grand-jury-document-list {
  list-style-type: disc;
  padding-left: 2rem;
  margin: 0 0 1.5rem 0;
}

.grand-jury-document-item {
  margin-bottom: 0.75rem;
  line-height: 1.6;
}

/* ============================================================================
   RESPONSE LISTS (nested under reports)
   ============================================================================ */

.grand-jury-response-list {
  list-style-type: circle; /* Circle bullets to distinguish from reports */
  padding-left: 2rem;
  margin: 0.5rem 0 0 0;
}

.grand-jury-response-item {
  margin-bottom: 0.5rem;
  line-height: 1.6;
  font-size: 0.95rem;
}

/* Response links - slightly different styling */
.grand-jury-response-link {
  color: #005ea2; /* Same primary blue - 8.59:1 contrast ratio (AAA) */
  text-decoration: underline;
  text-underline-offset: 0.2em;
  font-weight: normal;
  transition: all 0.2s ease;
}

.grand-jury-response-link:hover {
  color: #1b2b85; /* Darker blue - 11.16:1 contrast ratio (AAA) */
  text-decoration-thickness: 2px;
  background-color: #f0f8ff; /* Light blue background */
}

.grand-jury-response-link:focus {
  outline: 3px solid #005ea2;
  outline-offset: 3px;
  background-color: #fff2c4; /* Yellow highlight */
  text-decoration-thickness: 2px;
}

.grand-jury-response-link:visited {
  color: #54278f; /* Purple - 6.5:1 contrast ratio (AA) */
}

/* ============================================================================
   LINKS - WCAG 2.1 AA Compliant
   ============================================================================ */

.grand-jury-document-link {
  color: #005ea2; /* Primary blue - 8.59:1 contrast ratio (AAA) */
  text-decoration: underline;
  text-underline-offset: 0.2em;
  font-weight: normal;
  transition: all 0.2s ease;
}

.grand-jury-document-link:hover {
  color: #1b2b85; /* Darker blue - 11.16:1 contrast ratio (AAA) */
  text-decoration-thickness: 2px;
  background-color: #f0f8ff; /* Light blue background */
}

/* Focus indicator - WCAG 2.4.7 Focus Visible */
.grand-jury-document-link:focus {
  outline: 3px solid #005ea2;
  outline-offset: 3px;
  background-color: #fff2c4; /* Yellow highlight */
  text-decoration-thickness: 2px;
}

/* Visited links - different color for usability */
.grand-jury-document-link:visited {
  color: #54278f; /* Purple - 6.5:1 contrast ratio (AA) */
}

/* ============================================================================
   FILE TYPE INDICATOR
   ============================================================================ */

.grand-jury-file-type {
  font-size: 0.875rem;
  color: #565c65; /* Gray - 7.48:1 contrast ratio (AAA) */
  font-style: italic;
  margin-left: 0.5rem;
}

/* ============================================================================
   EMPTY STATE
   ============================================================================ */

.grand-jury-empty-message {
  padding: 2rem;
  text-align: center;
  color: #565c65;
  font-style: italic;
  background-color: #f3f3f3;
  border-radius: 4px;
}

/* ============================================================================
   SKIP LINK - WCAG 2.4.1 Bypass Blocks
   ============================================================================ */

.grand-jury-skip-link {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.grand-jury-skip-link:focus {
  position: static;
  width: auto;
  height: auto;
  padding: 1rem;
  background-color: #005ea2;
  color: #ffffff;
  font-weight: bold;
  text-decoration: none;
  z-index: 1000;
}

/* ============================================================================
   RESPONSIVE DESIGN
   ============================================================================ */

/* Tablet (640px - 1024px) */
@media screen and (max-width: 1024px) {
  .grand-jury-year-heading {
    font-size: 1.75rem;
  }

  .grand-jury-subsection-heading {
    font-size: 1.25rem;
  }

  .grand-jury-document-list {
    padding-left: 1.5rem;
  }

  .grand-jury-response-list {
    padding-left: 1.5rem;
  }
}

/* Mobile (< 640px) */
@media screen and (max-width: 640px) {
  .grand-jury-year-section {
    margin-bottom: 2rem;
  }

  .grand-jury-year-heading {
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }

  .grand-jury-subsection-heading {
    font-size: 1.125rem;
  }

  .grand-jury-document-list {
    padding-left: 1.25rem;
  }

  .grand-jury-response-list {
    padding-left: 1.25rem;
  }

  .grand-jury-document-item {
    font-size: 0.9375rem;
  }

  .grand-jury-response-item {
    font-size: 0.875rem;
  }

  /* Increase touch target size for mobile - WCAG 2.5.5 (AAA) */
  .grand-jury-document-link,
  .grand-jury-response-link {
    display: inline-block;
    padding: 0.25rem 0;
    min-height: 44px;
    line-height: 1.8;
  }
}

/* ============================================================================
   PRINT STYLES
   ============================================================================ */

@media print {
  .grand-jury-year-section {
    page-break-inside: avoid;
    border-bottom: 1px solid #000;
  }

  .grand-jury-year-heading {
    color: #000;
    border-bottom-color: #000;
  }

  .grand-jury-document-link,
  .grand-jury-response-link {
    color: #000;
    text-decoration: underline;
  }

  /* Print URLs after links */
  .grand-jury-document-link::after,
  .grand-jury-response-link::after {
    content: " (" attr(href) ")";
    font-size: 0.75rem;
    color: #666;
  }
}

/* ============================================================================
   HIGH CONTRAST MODE - WCAG 1.4.11 Non-text Contrast
   ============================================================================ */

@media (prefers-contrast: high) {
  .grand-jury-year-heading {
    border-bottom-width: 4px;
  }

  .grand-jury-document-link,
  .grand-jury-response-link {
    text-decoration-thickness: 2px;
    font-weight: 600;
  }

  .grand-jury-document-link:focus,
  .grand-jury-response-link:focus {
    outline-width: 4px;
  }
}

/* ============================================================================
   REDUCED MOTION - WCAG 2.3.3 Animation from Interactions
   ============================================================================ */

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }

  .grand-jury-document-link,
  .grand-jury-response-link {
    transition: none;
  }
}

/* ============================================================================
   SCREEN READER ONLY CONTENT
   ============================================================================ */

.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;
}

/* ============================================================================
   FOCUS WITHIN - Enhanced keyboard navigation
   ============================================================================ */

.grand-jury-document-list:focus-within,
.grand-jury-response-list:focus-within {
  outline: 2px dashed #005ea2;
  outline-offset: 4px;
}

/* ============================================================================
   DARK MODE SUPPORT (if site implements it)
   ============================================================================ */

@media (prefers-color-scheme: dark) {
  /* Note: Only implement if site has dark mode */
  /* Ensure 4.5:1 contrast on dark backgrounds */
}
