/* Noderr Protocol Documentation - Enhanced Readability CSS */
/* MAXIMUM SPECIFICITY VERSION - Matches HonKit's selector specificity */
/* WCAG AA compliant contrast ratios */

/* ========================================
   BASE STYLES - IMPROVED READABILITY
   ======================================== */

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 18px !important;
  line-height: 1.8 !important;
  font-weight: 400 !important;
}

.page-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 60px;
  width: 100%;
}

@media (max-width: 1400px) {
  .page-inner {
    max-width: 1000px;
    padding: 40px 40px;
  }
}

@media (max-width: 1024px) {
  .page-inner {
    max-width: 900px;
    padding: 40px 30px;
  }
}

.page-inner p,
.markdown-section p {
  font-size: 18px !important;
  line-height: 1.8 !important;
  margin: 16px 0 !important;
  font-weight: 400 !important;
}

/* Headings */
.page-inner h1, .page-inner h2, .page-inner h3, .page-inner h4, .page-inner h5, .page-inner h6,
.markdown-section h1, .markdown-section h2, .markdown-section h3, .markdown-section h4, .markdown-section h5, .markdown-section h6 {
  font-weight: 600 !important;
  margin-top: 32px !important;
  margin-bottom: 16px !important;
  line-height: 1.3 !important;
}

.page-inner h1, .markdown-section h1 { font-size: 1.75rem !important; padding-bottom: 12px !important; margin-bottom: 24px !important; }
.page-inner h2, .markdown-section h2 { font-size: 1.5rem !important; margin-top: 40px !important; }
.page-inner h3, .markdown-section h3 { font-size: 1.25rem !important; margin-top: 32px !important; }
.page-inner h4, .markdown-section h4 { font-size: 1.1rem !important; }

/* Links */
.page-inner a, .markdown-section a {
  text-decoration: none !important;
  transition: color 0.2s ease !important;
  font-weight: 500 !important;
}

.page-inner a:hover, .markdown-section a:hover {
  text-decoration: underline !important;
}

/* ========================================
   THEME-SPECIFIC STYLES WITH MAXIMUM SPECIFICITY
   Must match HonKit's .book.color-theme-X selector pattern
   ======================================== */

/* WHITE THEME (color-theme-1) */
.book.color-theme-1 .book-body {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
}

.book.color-theme-1 .book-body .page-wrapper {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal * {
  color: #1a1a1a !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal a {
  color: #0066cc !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal a:hover {
  color: #0052a3 !important;
}

/* SEPIA THEME (color-theme-2) */
.book.color-theme-2 .book-body {
  background-color: #f4ecd8 !important;
  color: #3e2723 !important;
}

.book.color-theme-2 .book-body .page-wrapper {
  background-color: #f4ecd8 !important;
  color: #3e2723 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner {
  background-color: #f4ecd8 !important;
  color: #3e2723 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section {
  background-color: #f4ecd8 !important;
  color: #3e2723 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal {
  background-color: #f4ecd8 !important;
  color: #3e2723 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal * {
  color: #3e2723 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal a {
  color: #8b4513 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal a:hover {
  color: #654321 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal h1,
.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal h2,
.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal h3,
.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal h4,
.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal h5,
.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal h6 {
  color: #3e2723 !important;
}

/* NIGHT THEME (color-theme-3) - CRITICAL FIX */
/* Fix the outer container and body background */
body.color-theme-3 {
  background-color: #0f172a !important;
}

.book.color-theme-3 {
  background-color: #0f172a !important;
}

.book.color-theme-3 .book-body {
  background-color: #0f172a !important;
  color: #f1f5f9 !important;
}

.book.color-theme-3 .book-body .page-wrapper {
  background-color: #0f172a !important;
  color: #f1f5f9 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner {
  background-color: #0f172a !important;
  color: #f1f5f9 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section {
  background-color: #0f172a !important;
  color: #f1f5f9 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal {
  background-color: #0f172a !important;
  color: #f1f5f9 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal * {
  color: #f1f5f9 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal h1,
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal h2,
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal h3,
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal h4,
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal h5,
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal h6 {
  color: #ffffff !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal a {
  color: #38bdf8 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal a:hover {
  color: #7dd3fc !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal code {
  background-color: #1e293b !important;
  color: #38bdf8 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal pre {
  background-color: #1e293b !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal pre code {
  color: #f1f5f9 !important;
  background-color: transparent !important;
}

/* Additional specificity for paragraphs */
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal p {
  color: #f1f5f9 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal p {
  color: #3e2723 !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal p {
  color: #1a1a1a !important;
}

/* Tablet */
@media (max-width: 768px) {
  body { font-size: 16px !important; }
  .page-inner { 
    padding: 30px 20px;
    max-width: 100%;
  }
  .page-inner h1, .markdown-section h1 { font-size: 1.75rem !important; }
}

/* Mobile */
@media (max-width: 480px) {
  body { font-size: 15px !important; }
  .page-inner { 
    padding: 20px 15px;
    max-width: 100%;
  }
  .page-inner h1, .markdown-section h1 { font-size: 1.5rem !important; }
  .page-inner h2, .markdown-section h2 { font-size: 1.25rem !important; }
}

/* ========================================
   TABLE STYLES - ALL THEMES
   ======================================== */

/* Base table styles */
.page-inner table,
.markdown-section table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 24px 0 !important;
  font-size: 16px !important;
}

.page-inner th,
.page-inner td,
.markdown-section th,
.markdown-section td {
  padding: 12px 16px !important;
  border: 1px solid !important;
  text-align: left !important;
  line-height: 1.6 !important;
}

.page-inner th,
.markdown-section th {
  font-weight: 600 !important;
}

/* WHITE THEME TABLES (color-theme-1) */
.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal table {
  border-color: #e0e0e0 !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal th {
  background-color: #f5f5f5 !important;
  color: #1a1a1a !important;
  border-color: #e0e0e0 !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal td {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
  border-color: #e0e0e0 !important;
}

.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal tr:nth-child(even) td {
  background-color: #fafafa !important;
}

/* SEPIA THEME TABLES (color-theme-2) */
.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal table {
  border-color: #d4c4a8 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal th {
  background-color: #e8dcc4 !important;
  color: #3e2723 !important;
  border-color: #d4c4a8 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal td {
  background-color: #f4ecd8 !important;
  color: #3e2723 !important;
  border-color: #d4c4a8 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal tr:nth-child(even) td {
  background-color: #efe5d0 !important;
}

/* NIGHT THEME TABLES (color-theme-3) */
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal table {
  border-color: #334155 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal th {
  background-color: #1e293b !important;
  color: #ffffff !important;
  border-color: #334155 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal td {
  background-color: #0f172a !important;
  color: #f1f5f9 !important;
  border-color: #334155 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal tr:nth-child(even) td {
  background-color: #1e293b !important;
}

/* Ensure table text inherits correct colors */
.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal table * {
  color: #1a1a1a !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal table * {
  color: #3e2723 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal table * {
  color: #f1f5f9 !important;
}

/* Table headers get slightly bolder color */
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal th * {
  color: #ffffff !important;
}

/* Code blocks in tables */
.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal table code {
  background-color: #f5f5f5 !important;
  color: #c7254e !important;
  padding: 2px 6px !important;
  border-radius: 3px !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal table code {
  background-color: #e8dcc4 !important;
  color: #8b4513 !important;
  padding: 2px 6px !important;
  border-radius: 3px !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal table code {
  background-color: #1e293b !important;
  color: #38bdf8 !important;
  padding: 2px 6px !important;
  border-radius: 3px !important;
}

/* Strong/bold text in tables */
.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal table strong,
.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal table b {
  color: #000000 !important;
  font-weight: 700 !important;
}

.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal table strong,
.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal table b {
  color: #2c1810 !important;
  font-weight: 700 !important;
}

.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal table strong,
.book.color-theme-3 .book-body .page-wrapper .page-inner section.normal table b {
  color: #ffffff !important;
  font-weight: 700 !important;
}

/* Responsive tables */
@media (max-width: 768px) {
  .page-inner table,
  .markdown-section table {
    font-size: 14px !important;
  }
  
  .page-inner th,
  .page-inner td,
  .markdown-section th,
  .markdown-section td {
    padding: 8px 12px !important;
  }
}
