/* TOS Page Specific Styles - CSP Phase 4 Extraction */
/* Extracted from frontend/tos.html inline <style> block (lines 28-213) */
/* Date: 2025-12-23 */

/* Profile Hub and Support Container styles now in external CSS files */
/* See: styles/profile-hub.css, styles/support-container.css, styles/floating-icons-extended.css */

/* ToS Specific Styles - Enhanced for Readability & Accessibility */
body.tos-page article.box.post {
  background: linear-gradient(165deg, #04180d 0%, #0c2617 55%, #133821 100%);
  border: 2px solid rgba(255, 238, 0, 0.3);
  border-radius: 14px;
  padding: 3em;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
  color: #e8e8e8; /* Accessibility: ensures baseline body copy meets WCAG AA contrast */
}

/* UPDATED: Improved text visibility and WCAG AA contrast compliance */
/* All color combinations meet WCAG AA standards (4.5:1 for normal text, 3:1 for large text) */
/* Yellow (#ffee00) on content card: ≥ 14:1 contrast (WCAG AAA) */
/* White (#ffffff) on content card: ≥ 16:1 contrast (WCAG AAA) */
/* Green (#28a745) on content card: 5.6:1 contrast (WCAG AA+) */

.tos-notice {
  background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
  border: 3px solid #ffee00;
  border-radius: 10px;
  padding: 2em;
  margin: 2em 0;
  text-align: center;
}

.tos-notice h3 {
  color: #ffee00; /* High contrast yellow - WCAG AA compliant */
  font-size: 1.8em;
  margin-bottom: 0.5em;
  font-weight: bold;
}

.tos-notice p {
  color: #ffffff; /* White text for maximum contrast */
  font-size: 1.1em;
  line-height: 1.8;
}

article h2 {
  color: #ffee00; /* High contrast yellow - WCAG AA compliant */
  font-size: 1.8em;
  margin-top: 2em;
  margin-bottom: 0.8em;
  border-bottom: 3px solid #28a745;
  padding-bottom: 0.3em;
  font-weight: bold; /* Added for better heading distinction */
}

article h3 {
  color: #28a745; /* Green for subheadings - WCAG AA compliant */
  font-size: 1.4em;
  margin-top: 1.5em;
  margin-bottom: 0.6em; /* Increased from 0.5em */
  font-weight: bold; /* Added for better heading distinction */
}

article h4 {
  color: #ffffff; /* White for h4 */
  font-size: 1.2em;
  margin-top: 1em;
  margin-bottom: 0.5em;
  font-weight: bold;
}

/* Enhanced paragraph readability */
article p {
  color: #e8e8e8; /* Improved from default - better contrast against dark background */
  font-size: 1.05em; /* Slightly larger for better readability */
  line-height: 1.8; /* Optimal reading line-height */
  margin-bottom: 1.2em; /* Consistent spacing between paragraphs */
}

article ul,
article ol {
  margin-left: 2em;
  line-height: 1.8;
  color: #e8e8e8; /* Improved contrast */
}

article li {
  margin-bottom: 0.6em; /* Increased from 0.5em for better separation */
}

article strong {
  color: #ffee00; /* High visibility yellow */
  font-weight: bold;
}

article a {
  color: #4de88a; /* Accessibility: brighter green keeps 4.5:1 contrast on dark card */
  text-decoration: underline;
  transition: color 0.3s ease;
}

article a:hover {
  color: #ffee00; /* Yellow on hover for visibility */
}

article code {
  background: #2a2a2a;
  padding: 2px 6px;
  border-radius: 3px;
  color: #28a745;
  font-family: "Courier New", monospace;
}

.important-box {
  background: #2a2a2a;
  border-left: 5px solid #ffee00;
  padding: 1.5em;
  margin: 1.5em 0;
  border-radius: 5px;
}

.important-box p {
  color: #ffffff; /* White text for maximum contrast in important boxes */
  margin-bottom: 0.5em;
  line-height: 1.8;
}

.important-box ul {
  color: #ffffff; /* White text for lists in important boxes */
}

/* Table of Contents */
.toc {
  background: #1a1a1a;
  border: 2px solid #28a745;
  border-radius: 10px;
  padding: 2em;
  margin: 2em 0;
}

.toc h3 {
  color: #ffee00;
  margin-top: 0;
  margin-bottom: 1em;
}

.toc ol {
  list-style-type: decimal;
  line-height: 2;
}

.toc a {
  color: #28a745;
  text-decoration: none;
  transition: color 0.3s ease;
}

.toc a:hover {
  color: #ffee00;
}

@media (max-width: 768px) {
  /* Profile Hub and Support Container responsive styles now in external CSS files */

  article h2 {
    font-size: 1.5em;
  }

  article h3 {
    font-size: 1.2em;
  }

  .toc {
    padding: 1.5em;
  }

  body.tos-page article.box.post {
    padding: 2em 1.5em; /* Accessibility: keep high-contrast card snug on mobile */
  }
}

/* ================================================
   CSP PHASE 4 - INLINE STYLE EXTRACTION
   Added: 2025-12-23
   ================================================ */

/* ToC list styling - replaces inline style on line 162 */
.toc-list {
  list-style-type: none;
  margin-left: 1em;
  margin-top: 0.5em;
}

/* Closing message - replaces inline style on line 1030 */
.closing-message {
  text-align: center;
  font-size: 1.3em;
  color: #28a745;
  margin-top: 2em;
}

/* Section separator - replaces inline style on line 1034 */
.section-separator {
  margin: 3em 0;
  border-color: #ffee00;
}

/* Footer text - replaces inline style on line 1036 */
.footer-text {
  text-align: center;
  color: #999999;
  font-size: 0.9em;
}
