/* css styles */
a {
  color: #008; /* Example: Sets the link color */
  text-decoration: none; /* Optional: Remove the underline */
}

a:hover {
  color: #ff0000; /* Example: Sets the hover color to red */
  text-decoration: underline; /* Optional: Add underline on hover */
}

/* Reduced default style for general paragraph spacing */
p {
  margin-bottom: 1em; 
}

/* Specific class for very small spacing */
.tight-page p {
  margin-bottom: 0.3em;
}

/* Specific class for larger spacing */
.loose-page p {
  margin-bottom: 1.5em;
}

/* * Trestles Fluid Width Customizations
 * ----------------------------------
 * This file overrides the default max-widths set by the trestles theme 
 * to allow the main content to take up more screen space, adapting fluidly.
 */

:root {
  /* --bs-body-color: var(--bs-black); */
}

/* * 1. Target the main Bootstrap container
 * This is usually the primary container wrapping all content.
 */
.container, 
.quarto-container {
  max-width: 90vw !important;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* For very large screens, you might want an absolute max-width to preserve readability */
@media (min-width: 1400px) {
  .container, 
  .quarto-container {
    max-width: 1600px !important; 
  }
}

/* * 2. Target the Title Block container
 * This ensures the title, subtitle, and author information also use the fluid width.
 */
.quarto-container-title-block {
  max-width: 90vw !important;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* * 3. Target the Main Page Content 
 * REMOVED: .quarto-content { max-width: 100% !important; }
 */

/* * 4. Target Specific Components (like code blocks, tables, etc.)
 * REMOVED: .page-content { max-width: 100% !important; }
 */

/* Optional: Adjusting the column spacing if needed */
.row {
  --bs-gutter-x: 1.5rem;
}

.footnote-wrapper {
  max-width: 100%; !important
  clear: both;
}

.footnotes {
  width: 100%;
}