/* ============================================================
   SchedulrLab — Article & Global Page Styles
   Fixes GeneratePress white background override
   ============================================================ */

/* ── CSS VARIABLES (must be here, not just in front-page.php) ── */
:root {
  --sl-lime:    #c8f53a;
  --sl-dark:    #0b0b09;
  --sl-dark2:   #141412;
  --sl-dark3:   #1c1c19;
  --sl-dark4:   #242420;
  --sl-cream:   #f0f0e8;
  --sl-cream2:  #c8c8c0;
  --sl-grey:    #888880;
  --sl-grey2:   #555550;
  --sl-teal:    #3de0b4;
  --sl-orange:  #ff9052;
  --sl-border:  rgba(255,255,255,0.07);
  --sl-border2: rgba(255,255,255,0.12);
}

/* ── NUCLEAR BACKGROUND FIX ─────────────────────────────────────────────────
   GeneratePress sets white on html, body, #page, .site, .content-area etc.
   We override every single one with !important to force dark theme globally.
   ───────────────────────────────────────────────────────────────────────── */
html,
body,
#page,
#content,
.site,
.site-content,
.content-area,
.site-main,
.hentry,
.entry-content-wrap,
main.site-main,
div#primary,
div.inside-article,
div.content-container,
div.grid-container,
div.site-content {
  background-color: #0b0b09 !important;
  background:       #0b0b09 !important;
}

body {
  color:       var(--sl-cream) !important;
  font-family: 'Syne', -apple-system, 'Segoe UI', sans-serif !important;
}

/* ── GOOGLE FONTS on article pages ── */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=JetBrains+Mono:wght@300;400;500&display=swap');

/* ── STICKY HEADER ── */
.site-header,
.main-navigation,
header.site-header {
  background:       rgba(11,11,9,0.95) !important;
  backdrop-filter:  blur(20px) !important;
  border-bottom:    1px solid rgba(255,255,255,0.07) !important;
  position:         sticky !important;
  top:              0 !important;
  z-index:          100 !important;
}

/* ── SITE TITLE / LOGO ── */
.site-title a,
.site-title a:hover,
.site-title a:visited {
  color:           #c8f53a !important;
  font-weight:     800 !important;
  font-size:       1.1rem !important;
  text-decoration: none !important;
  font-family:     'Syne', sans-serif !important;
}

/* ── NAV LINKS ── */
.main-navigation a,
.main-navigation ul li a {
  color:      #888880 !important;
  font-size:  0.82rem !important;
  font-weight: 500 !important;
  transition: color 0.15s !important;
}

.main-navigation a:hover,
.main-navigation ul li a:hover {
  color: #f0f0e8 !important;
}

/* ── INNER CONTAINERS ── */
.inside-header,
.inside-navigation,
.header-widget,
div.inside-site-info,
.footer-bar,
footer.site-footer,
.site-footer {
  background: #141412 !important;
  color:      #888880 !important;
}

/* ── ARTICLE LAYOUT ── */
article.post,
article.page,
.post.hentry {
  background: #0b0b09 !important;
  border:     none !important;
  box-shadow: none !important;
}

/* ── ARTICLE HEADER ── */
.entry-header,
div.entry-header {
  max-width:     760px;
  margin:        0 auto !important;
  padding:       52px 24px 32px !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}

.entry-title,
h1.entry-title {
  font-family:    'Syne', sans-serif !important;
  font-size:      2.2rem !important;
  font-weight:    800 !important;
  color:          #f0f0e8 !important;
  line-height:    1.15 !important;
  letter-spacing: -0.025em !important;
  margin-bottom:  14px !important;
}

.entry-meta,
.entry-meta a,
span.posted-on,
span.byline {
  font-family:    'JetBrains Mono', monospace !important;
  font-size:      0.68rem !important;
  color:          #888880 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

.entry-meta a { color: #c8f53a !important; }

/* ── ARTICLE BODY ── */
.entry-content,
div.entry-content {
  max-width:   760px;
  margin:      32px auto 0 !important;
  padding:     0 24px 80px !important;
  color:       #c8c8c0 !important;
  font-size:   1rem !important;
  line-height: 1.85 !important;
}

.entry-content *,
.entry-content p,
.entry-content li {
  color: #c8c8c0;
}

/* ── HEADINGS IN ARTICLES ── */
.entry-content h2 {
  font-family:   'Syne', sans-serif !important;
  font-size:     1.5rem !important;
  font-weight:   700 !important;
  color:         #f0f0e8 !important;
  margin:        44px 0 16px !important;
  letter-spacing: -0.015em !important;
  border-left:   3px solid #c8f53a !important;
  padding-left:  14px !important;
  background:    transparent !important;
}

.entry-content h3 {
  font-family: 'Syne', sans-serif !important;
  font-size:   1.15rem !important;
  font-weight: 700 !important;
  color:       #f0f0e8 !important;
  margin:      32px 0 12px !important;
}

.entry-content h4 {
  font-size:   1rem !important;
  font-weight: 700 !important;
  color:       #c8c8c0 !important;
  margin:      24px 0 10px !important;
}

/* ── LINKS ── */
.entry-content a,
.entry-content a:visited {
  color:                #c8f53a !important;
  text-decoration:      underline !important;
  text-decoration-style: dotted !important;
  text-underline-offset: 3px !important;
  transition:           color 0.15s !important;
}

.entry-content a:hover { color: #d8ff4a !important; }

.entry-content strong { color: #f0f0e8 !important; font-weight: 700 !important; }
.entry-content em     { font-style: italic !important; }

/* ── LISTS ── */
.entry-content ul,
.entry-content ol {
  padding-left: 0 !important;
  list-style:   none !important;
  margin:       0 0 20px 0 !important;
}

.entry-content ul li,
.entry-content ol li {
  position:      relative !important;
  padding-left:  20px !important;
  margin-bottom: 8px !important;
  color:         #c8c8c0 !important;
  font-size:     0.95rem !important;
  line-height:   1.7 !important;
}

.entry-content ul li::before {
  content:       '' !important;
  position:      absolute !important;
  left:          0 !important;
  top:           10px !important;
  width:         6px !important;
  height:        6px !important;
  border-radius: 50% !important;
  background:    #c8f53a !important;
  opacity:       0.7 !important;
}

/* ── BLOCKQUOTE ── */
.entry-content blockquote,
blockquote {
  border-left:    3px solid #c8f53a !important;
  padding:        16px 20px !important;
  margin:         28px 0 !important;
  background:     rgba(200,245,58,0.04) !important;
  border-radius:  0 8px 8px 0 !important;
  font-style:     italic !important;
  color:          #c8c8c0 !important;
}

/* ── CODE ── */
.entry-content code,
code {
  font-family:   'JetBrains Mono', monospace !important;
  font-size:     0.82em !important;
  color:         #c8f53a !important;
  background:    rgba(200,245,58,0.08) !important;
  padding:       2px 6px !important;
  border-radius: 4px !important;
}

.entry-content pre,
pre {
  background:    #070706 !important;
  border:        1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px !important;
  padding:       18px 20px !important;
  overflow-x:    auto !important;
  margin:        24px 0 !important;
}

.entry-content pre code,
pre code {
  background: transparent !important;
  padding:    0 !important;
  font-size:  0.82rem !important;
  color:      #c8f53a !important;
  line-height: 1.65 !important;
}

/* ── IMAGES ── */
.entry-content img {
  max-width:     100% !important;
  height:        auto !important;
  border-radius: 10px !important;
  border:        1px solid rgba(255,255,255,0.07) !important;
  display:       block !important;
  margin:        24px auto !important;
}

.post-thumbnail img {
  width:         100% !important;
  max-height:    400px !important;
  object-fit:    cover !important;
  border-radius: 14px !important;
  margin-bottom: 32px !important;
  border:        1px solid rgba(255,255,255,0.07) !important;
}

/* ── TABLES ── */
.entry-content table,
.tablepress {
  width:           100% !important;
  border-collapse: collapse !important;
  margin:          28px 0 !important;
  font-size:       0.85rem !important;
}

.entry-content th,
.tablepress thead td,
thead th {
  background:     #1c1c19 !important;
  color:          #888880 !important;
  font-family:    'JetBrains Mono', monospace !important;
  font-size:      0.65rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight:    500 !important;
  padding:        12px 16px !important;
  text-align:     left !important;
  border-bottom:  1px solid rgba(255,255,255,0.07) !important;
}

.entry-content td,
.tablepress td {
  padding:       11px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
  color:         #c8c8c0 !important;
  background:    #1c1c19 !important;
  vertical-align: middle !important;
}

/* ── AFFILIATE DISCLOSURE BAR ── */
.sl-disclosure {
  background:    rgba(200,245,58,0.05) !important;
  border:        1px solid rgba(200,245,58,0.15) !important;
  border-radius: 8px !important;
  padding:       12px 16px !important;
  margin-bottom: 28px !important;
  font-size:     0.78rem !important;
  color:         #b8d870 !important;
  line-height:   1.6 !important;
}

.sl-disc-label {
  font-family:    'JetBrains Mono', monospace !important;
  font-size:      0.62rem !important;
  font-weight:    600 !important;
  color:          #c8f53a !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  margin-right:   6px !important;
}

/* ── VERDICT BOX ── */
.sl-verdict {
  background:    rgba(200,245,58,0.06) !important;
  border:        2px solid rgba(200,245,58,0.25) !important;
  border-radius: 12px !important;
  padding:       22px 24px !important;
  margin:        36px 0 !important;
}

.sl-verdict-label {
  font-family:    'JetBrains Mono', monospace !important;
  font-size:      0.62rem !important;
  color:          #c8f53a !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  margin-bottom:  10px !important;
  display:        block !important;
}

.sl-verdict p {
  font-size:   0.92rem !important;
  color:       #f0f0e8 !important;
  line-height: 1.75 !important;
  margin:      0 !important;
  font-weight: 500 !important;
}

/* ── BLOG INDEX CARDS ── */
.blog .hentry,
.archive .hentry,
.search .hentry {
  background:    #1c1c19 !important;
  border:        1px solid rgba(255,255,255,0.07) !important;
  border-radius: 14px !important;
  padding:       28px !important;
  margin-bottom: 16px !important;
  transition:    all 0.2s !important;
}

.blog .hentry:hover,
.archive .hentry:hover {
  border-color: rgba(255,255,255,0.12) !important;
  transform:    translateY(-2px) !important;
}

.blog .entry-title a,
.archive .entry-title a,
.search .entry-title a {
  color:           #f0f0e8 !important;
  text-decoration: none !important;
  font-weight:     700 !important;
  font-size:       1.15rem !important;
  transition:      color 0.15s !important;
}

.blog .entry-title a:hover { color: #c8f53a !important; }

.blog .entry-summary,
.archive .entry-summary {
  color:       #c8c8c0 !important;
  font-size:   0.88rem !important;
  line-height: 1.7 !important;
}

/* ── PAGINATION ── */
.page-numbers,
a.page-numbers {
  display:         inline-flex !important;
  align-items:     center !important;
  justify-content: center !important;
  min-width:       38px !important;
  height:          38px !important;
  background:      #1c1c19 !important;
  border:          1px solid rgba(255,255,255,0.07) !important;
  border-radius:   8px !important;
  color:           #888880 !important;
  font-size:       0.82rem !important;
  text-decoration: none !important;
  margin:          0 3px !important;
  transition:      all 0.15s !important;
  padding:         0 10px !important;
}

.page-numbers:hover,
a.page-numbers:hover,
.page-numbers.current,
span.page-numbers.current {
  background:   rgba(200,245,58,0.1) !important;
  border-color: rgba(200,245,58,0.25) !important;
  color:        #c8f53a !important;
}

/* ── SIDEBAR WIDGETS ── */
.widget-area,
aside.widget-area {
  background: transparent !important;
}

.widget,
.widget-area .widget {
  background:    #1c1c19 !important;
  border:        1px solid rgba(255,255,255,0.07) !important;
  border-radius: 12px !important;
  padding:       20px !important;
  margin-bottom: 16px !important;
  color:         #c8c8c0 !important;
}

.widget-title,
.widget .widget-title {
  font-family:    'JetBrains Mono', monospace !important;
  font-size:      0.62rem !important;
  color:          #c8f53a !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  margin-bottom:  14px !important;
  font-weight:    500 !important;
  background:     transparent !important;
}

.widget a { color: #c8c8c0 !important; }
.widget a:hover { color: #c8f53a !important; }

/* ── FOOTER ── */
.site-footer,
footer.site-footer,
.site-info,
div.site-info {
  background:  #141412 !important;
  border-top:  1px solid rgba(255,255,255,0.07) !important;
  color:       #555550 !important;
  font-size:   0.78rem !important;
  padding:     24px 40px !important;
  text-align:  center !important;
}

.site-footer a { color: #888880 !important; }
.site-footer a:hover { color: #c8f53a !important; }

/* ── SEARCH PAGE ── */
.search-form input[type="search"] {
  background:    #1c1c19 !important;
  border:        1px solid rgba(255,255,255,0.12) !important;
  border-radius: 8px !important;
  color:         #f0f0e8 !important;
  padding:       10px 16px !important;
}

.search-form button,
.search-submit {
  background:    #c8f53a !important;
  color:         #0b0b09 !important;
  border:        none !important;
  border-radius: 8px !important;
  padding:       10px 20px !important;
  font-weight:   700 !important;
  cursor:        pointer !important;
}

/* ── 404 PAGE ── */
.error404 .page-content {
  text-align:  center !important;
  padding:     80px 40px !important;
}

.error404 .page-title {
  font-size:   4rem !important;
  color:       #c8f53a !important;
  font-weight: 800 !important;
}

/* ── COMMENTS SECTION ── */
#comments,
.comment-list {
  background: transparent !important;
}

.comment-body {
  background:    #1c1c19 !important;
  border:        1px solid rgba(255,255,255,0.07) !important;
  border-radius: 10px !important;
  padding:       20px !important;
  margin-bottom: 12px !important;
}

.comment-author .fn { color: #f0f0e8 !important; }
.comment-content p  { color: #c8c8c0 !important; }

#respond,
.comment-respond {
  background:    #1c1c19 !important;
  border:        1px solid rgba(255,255,255,0.07) !important;
  border-radius: 12px !important;
  padding:       28px !important;
  margin-top:    32px !important;
}

#reply-title { color: #f0f0e8 !important; font-weight: 700 !important; }

.comment-form input,
.comment-form textarea {
  background:    #0b0b09 !important;
  border:        1px solid rgba(255,255,255,0.12) !important;
  border-radius: 7px !important;
  color:         #f0f0e8 !important;
  padding:       10px 14px !important;
  width:         100% !important;
}

.comment-form input:focus,
.comment-form textarea:focus {
  border-color: rgba(200,245,58,0.4) !important;
  outline:      none !important;
}

#submit,
.submit {
  background:    #c8f53a !important;
  color:         #0b0b09 !important;
  border:        none !important;
  border-radius: 8px !important;
  padding:       10px 24px !important;
  font-family:   'Syne', sans-serif !important;
  font-weight:   700 !important;
  font-size:     0.88rem !important;
  cursor:        pointer !important;
  transition:    background 0.15s !important;
}

#submit:hover { background: #d8ff4a !important; }

/* ── SCROLLBAR ── */
::-webkit-scrollbar       { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #242420; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #555550; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  .entry-header  { padding: 36px 20px 24px !important; }
  .entry-content { padding: 0 20px 60px !important; }
  .entry-title   { font-size: 1.7rem !important; }
  .entry-content h2 { font-size: 1.2rem !important; }
  .site-footer   { padding: 20px !important; }
}
