/**
 * @file
 * Footnotes styling for frontend (end user view).
 */

/* Footnote references in content */
.footnote-ref {
  font-size: 0.75em;
  line-height: 1;
  vertical-align: super;
  margin-left: 0.25em;
  margin-right: 0.25em;
}

.footnote-link {
  color: #0073aa;
  text-decoration: none;
  font-weight: 500;
  padding: 0.125em 0.25em;
  border-radius: 0.125em;
  transition: all 0.2s ease;
}

.footnote-link:hover,
.footnote-link:focus {
  color: #005177;
  background-color: #f0f0f0;
  text-decoration: none;
}

.footnote-link:focus {
  outline: 2px solid #0073aa;
  outline-offset: 2px;
}

/* Footnotes section at the end of content */
.footnotes-section {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid #e0e0e0;
}

.footnotes-section h5 {
  font-size: 1.25rem;
  font-weight: 800;
  margin-bottom: 1.5rem;
  color: #333;
}

/* Individual footnote items */
.footnote-item {
  margin-bottom: 0.75rem;
}

.footnotes-section p {
  margin-bottom: 0.5rem;
}

/* Footnote back-link styling */
.footnote-backlink {
  color: #0073aa;
  text-decoration: none;
  font-weight: 500;
  margin-right: 0.5em;
}

.footnote-backlink:hover,
.footnote-backlink:focus {
  color: #005177;
  text-decoration: underline;
}

.footnote-backlink:focus {
  outline: 2px solid #0073aa;
  outline-offset: 2px;
}

/* Legacy support for old class names */
.Testimonyfootnotes {
  margin: 0;
  line-height: 1.6;
  font-size: 0.9em;
}

.Testimonyfootnotes a {
  color: #0073aa;
  text-decoration: none;
  font-weight: 500;
}

.Testimonyfootnotes a:hover,
.Testimonyfootnotes a:focus {
  color: #005177;
  text-decoration: underline;
}

.Testimonyfootnotes a:focus {
  outline: 2px solid #0073aa;
  outline-offset: 2px;
}

/* Responsive design */
@media (max-width: 768px) {
  .footnotes-section {
    margin-top: 2rem;
    padding-top: 1.5rem;
  }

  .footnote-item {
    margin-bottom: 1rem;
  }

  .footnote-link {
    padding: 0.25em 0.5em;
  }
}

/* Print styles */
@media print {

  .footnote-link,
  .footnote-backlink,
  .Testimonyfootnotes a {
    color: #000;
    text-decoration: none;
  }

  .footnote-item {
    page-break-inside: avoid;
  }

  .footnotes-section {
    border-top: 1px solid #000;
  }
}
