/* =============== content-page.css =============== */

/* Assumes listserv.css is linked first */

.content-page {
    padding: 3rem 0 4rem; /* Vertical padding for the main content area */
  }
  
  .content-page .container {
    max-width: 800px; /* Constrain width for better text readability */
  }
  
  .content-header {
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border-color);
  }
  
  .content-header h1 {
    font-size: 2.25rem; /* Large, clear title */
    margin-bottom: 0.5rem;
  }
  
  .content-header .last-updated {
    font-size: 0.875rem;
    color: var(--text-muted);
  }
  
  /* Body content styling */
  .content-body h2 {
    font-size: 1.5rem;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-color);
  }
  
  .content-body h3 {
    font-size: 1.25rem;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
  }
  
  .content-body p {
    font-size: 1rem; /* Ensure readable paragraph text */
    line-height: 1.7; /* Increase line height slightly for long text */
    margin-bottom: 1.25rem;
    color: var(--text-secondary); /* Slightly softer text color */
  }
  [data-theme="dark"] .content-body p {
      color: var(--text-primary); /* Use primary text in dark mode for better contrast */
  }
  
  
  .content-body ul,
  .content-body ol {
    margin-bottom: 1.25rem;
    padding-left: 1.5rem; /* Standard indentation */
    color: var(--text-secondary);
  }
  [data-theme="dark"] .content-body ul,
  [data-theme="dark"] .content-body ol {
      color: var(--text-primary);
  }
  
  
  .content-body ul {
    list-style: disc;
  }
  
  .content-body ol {
    list-style: decimal;
  }
  
  .content-body li {
    margin-bottom: 0.75rem;
    line-height: 1.6;
  }
  
  .content-body a {
      font-weight: 500; /* Make links slightly bolder */
      text-decoration: underline; /* Underline links in text */
      text-decoration-color: rgba(var(--accent-color-rgb, 9, 105, 218), 0.4); /* Subtle underline */
  }
  [data-theme="dark"] .content-body a {
      text-decoration-color: rgba(var(--accent-color-rgb, 88, 166, 255), 0.4);
  }
  
  .content-body a:hover {
      text-decoration-color: var(--accent-hover);
  }
  
  /* Helper for RGB vars if not defined */
  :root { --accent-color-rgb: 9, 105, 218; }
  [data-theme="dark"] { --accent-color-rgb: 88, 166, 255; }
  
  /* Responsive */
  @media (max-width: 768px) {
      .content-header h1 { font-size: 2rem; }
      .content-body h2 { font-size: 1.35rem; }
      .content-body h3 { font-size: 1.15rem; }
  }