/*
Theme Name: Twenty Twenty-Five Child
Theme URI: https://howtomake.best/
Description: Child theme of Twenty Twenty-Five — dark mode, premium typography, optimized for long-form AI content. Inspired by Vercel/Geist, Linear, and Refactoring UI design principles.
Author: Hermes
Template: twentytwentyfive
Version: 3.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive-child
*/

/* ============================================================
   DARK CONTENT THEME — howtomake.best
   Color system: Vercel/Geist-inspired layered dark palette
   Typography: Manrope variable (already loaded by parent)
   Principles: Fewer borders, background contrast, generous spacing
   ============================================================ */

/* --- CSS Custom Properties (Design Tokens) --- */
:root {
  /* Backgrounds — layered, not pure black */
  --bg-base:        #0a0a0f;   /* Page background — deep navy-black (Linear-style) */
  --bg-surface:     #111118;   /* Content card / article area */
  --bg-elevated:    #1a1a24;   /* Hover states, cards, elevated panels */
  --bg-overlay:     #222230;   /* Active states, code blocks, tables */

  /* Text — layered luminance, not pure white */
  --text-primary:   #ededef;   /* Primary body text — WCAG AAA on dark */
  --text-secondary: #a0a0b0;   /* Muted text, meta, captions */
  --text-tertiary:  #6e6e82;   /* Timestamps, labels, placeholders */

  /* Accent — vibrant blue for links & interactive */
  --accent-default: #5b8af5;   /* Primary accent — links, highlights */
  --accent-hover:   #7da6ff;   /* Hover state */
  --accent-muted:    rgba(91, 138, 245, 0.15);  /* Accent backgrounds — tags, badges */

  /* Semantic */
  --success:        #34d399;   /* Green — positive states */
  --warning:        #fbbf24;   /* Amber — caution */
  --error:          #f87171;   /* Red — errors */

  /* Borders — subtle, barely visible */
  --border-default: #2a2a3a;   /* Default borders */
  --border-subtle:  #1e1e2e;   /* Subtle separators */
  --border-strong:  #3a3a50;   /* Emphasized borders */

  /* Shadows — layered for depth, not stark */
  --shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.15);
  --shadow-md:  0 4px 6px rgba(0, 0, 0, 0.3), 0 2px 4px rgba(0, 0, 0, 0.2);
  --shadow-lg:  0 10px 25px rgba(0, 0, 0, 0.4), 0 6px 10px rgba(0, 0, 0, 0.2);
  --shadow-glow: 0 0 20px rgba(91, 138, 245, 0.08);

  /* Typography scale — Geist-inspired */
  --font-sans: 'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'Fira Code', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, monospace;

  /* Spacing */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;

  /* Transitions */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);
}


/* ============================================================
   GLOBAL OVERRIDES — Dark theme base
   ============================================================ */

/* Page background */
body {
  background-color: var(--bg-base) !important;
  color: var(--text-primary) !important;
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Site header/footer — subtle surface */
.wp-site-blocks > header,
.wp-site-blocks > footer,
.site-header,
.site-footer {
  background-color: var(--bg-surface);
  border-color: var(--border-subtle);
}

/* Links site-wide */
a {
  color: var(--accent-default) !important;
  text-decoration: none;
  transition: color var(--transition-fast);
}
a:hover {
  color: var(--accent-hover) !important;
}

/* Selection */
::selection {
  background: var(--accent-muted);
  color: var(--text-primary);
}

/* Scrollbar — dark themed */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: var(--bg-base);
}
::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--text-tertiary);
}


/* ============================================================
   ARTICLE CONTENT — Long-form typography
   Targets .wp-block-post-content (block theme standard)
   ============================================================ */
.wp-block-post-content {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.0625rem;       /* 17px — comfortable reading */
  line-height: 1.75;          /* Generous line-height for long-form */
  color: var(--text-primary);
  padding: var(--space-xl) 0;
}

/* --- Headings --- */
.wp-block-post-content h1,
.wp-block-post-content h2,
.wp-block-post-content h3,
.wp-block-post-content h4,
.wp-block-post-content h5,
.wp-block-post-content h6 {
  color: #ffffff;               /* Pure white for headings on dark — maximum contrast */
  letter-spacing: -0.025em;
  line-height: 1.3;
}

.wp-block-post-content h2 {
  color: #ffffff !important;
  font-size: 1.75rem;           /* 28px */
  font-weight: 700;
  margin-top: var(--space-2xl);
  margin-bottom: var(--space-lg);
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border-default);
}

.wp-block-post-content h3 {
  font-size: 1.3125rem;         /* 21px */
  font-weight: 600;
  margin-top: var(--space-xl);
  margin-bottom: var(--space-md);
}

.wp-block-post-content h4 {
  font-size: 1.125rem;          /* 18px */
  font-weight: 600;
  margin-top: var(--space-lg);
  margin-bottom: var(--space-sm);
  color: var(--text-primary);
}

/* --- Paragraphs --- */
.wp-block-post-content p {
  margin-bottom: var(--space-lg);
  color: var(--text-primary) !important;
}

/* --- Links inside content --- */
.wp-block-post-content a {
  color: var(--accent-default) !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(91, 138, 245, 0.4);  /* Subtle underline */
  transition: all var(--transition-fast);
}
.wp-block-post-content a:hover {
  color: var(--accent-hover) !important;
  text-decoration-color: var(--accent-hover);
  text-decoration-thickness: 2px;
}

/* --- Lists --- */
.wp-block-post-content ul,
.wp-block-post-content ol {
  margin-bottom: var(--space-lg);
  padding-left: 1.5rem;
  color: var(--text-primary);
}
.wp-block-post-content li {
  margin-bottom: var(--space-sm);
  line-height: 1.65;
}
.wp-block-post-content ul li::marker {
  color: var(--accent-default);
}
.wp-block-post-content ol li::marker {
  color: var(--accent-default);
  font-weight: 600;
}

/* --- Images --- */
.wp-block-post-content .wp-block-image {
  margin: var(--space-2xl) 0;
  text-align: center;
}
.wp-block-post-content .wp-block-image img {
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--border-subtle);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
}
.wp-block-post-content .wp-block-image img:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg), var(--shadow-glow);
}
.wp-block-post-content .wp-block-image figcaption {
  font-size: 0.875rem;
  color: var(--text-tertiary);
  margin-top: var(--space-sm);
  font-style: italic;
  text-align: center;
}

/* --- Blockquotes --- */
.wp-block-post-content blockquote {
  border-left: 3px solid var(--accent-default);
  padding: var(--space-lg) var(--space-xl);
  margin: var(--space-2xl) 0;
  background: var(--bg-elevated);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  color: var(--text-secondary);
  font-style: italic;
}
.wp-block-post-content blockquote p {
  color: var(--text-secondary);
  font-size: 1.125rem;
  line-height: 1.7;
}
.wp-block-post-content blockquote cite {
  color: var(--text-tertiary);
  font-size: 0.875rem;
}

/* --- Code --- */
.wp-block-post-content code {
  background: var(--bg-overlay);
  padding: 0.15em 0.4em;
  border-radius: var(--radius-sm);
  font-family: var(--font-mono);
  font-size: 0.875em;
  color: #e0e0f0;
  border: 1px solid var(--border-default);
}
.wp-block-post-content pre {
  background: var(--bg-overlay);
  padding: var(--space-lg);
  border-radius: var(--radius-md);
  overflow-x: auto;
  border: 1px solid var(--border-default);
  margin: var(--space-xl) 0;
}
.wp-block-post-content pre code {
  background: transparent;
  padding: 0;
  border: none;
  font-size: 0.875rem;
  line-height: 1.6;
}

/* --- Tables --- */
.wp-block-post-content table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: var(--space-xl) 0;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--border-default);
  font-size: 0.9375rem;
}
.wp-block-post-content thead {
  background: var(--bg-overlay);
}
.wp-block-post-content th {
  font-weight: 600;
  text-align: left;
  padding: 0.875rem var(--space-md);
  color: #ffffff;
  border-bottom: 2px solid var(--border-strong);
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.wp-block-post-content td {
  padding: 0.75rem var(--space-md);
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
}
.wp-block-post-content tr:last-child td {
  border-bottom: none;
}
.wp-block-post-content tbody tr:hover {
  background: var(--bg-elevated);
}

/* --- Separator --- */
.wp-block-post-content hr {
  border: none;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--border-default), transparent);
  margin: var(--space-3xl) 0;
}

/* --- Strong / emphasis --- */
.wp-block-post-content strong {
  color: #ffffff;
  font-weight: 600;
}
.wp-block-post-content em {
  color: var(--accent-hover);
  font-style: italic;
}

/* --- Rank Math FAQ Block --- */
.wp-block-post-content .rank-math-block {
  background: var(--bg-elevated);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
  margin: var(--space-2xl) 0;
  border: 1px solid var(--border-default);
}
.wp-block-post-content .rank-math-question {
  font-weight: 600;
  font-size: 1.0625rem;
  color: #ffffff;
  margin-bottom: var(--space-sm);
  cursor: pointer;
  transition: color var(--transition-fast);
}
.wp-block-post-content .rank-math-question:hover {
  color: var(--accent-hover);
}
.wp-block-post-content .rank-math-answer {
  color: var(--text-secondary);
  line-height: 1.7;
  padding-left: var(--space-lg);
  border-left: 2px solid var(--accent-default);
}

/* --- Pullquote --- */
.wp-block-post-content .wp-block-pullquote {
  border-top: 3px solid var(--accent-default);
  border-bottom: 3px solid var(--accent-default);
  border-left: none;
  padding: var(--space-xl) 0;
  margin: var(--space-2xl) 0;
  background: var(--bg-elevated);
  border-radius: var(--radius-lg);
}
.wp-block-post-content .wp-block-pullquote p {
  font-size: 1.375rem;
  font-weight: 600;
  color: #ffffff;
}
.wp-block-post-content .wp-block-pullquote cite {
  color: var(--text-tertiary);
}

/* --- Cover / Hero blocks --- */
.wp-block-post-content .wp-block-cover {
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin: var(--space-2xl) 0;
}

/* --- Gallery --- */
.wp-block-post-content .wp-block-gallery {
  margin: var(--space-xl) 0;
}
.wp-block-post-content .blocks-gallery-item img {
  border-radius: var(--radius-md);
  border: 1px solid var(--border-subtle);
}

/* --- Buttons (CTA) --- */
.wp-block-post-content .wp-block-button__link {
  background: var(--accent-default);
  color: #ffffff;
  border-radius: var(--radius-sm);
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  font-size: 0.9375rem;
  transition: all var(--transition-fast);
  border: none;
  text-decoration: none;
}
.wp-block-post-content .wp-block-button__link:hover {
  background: var(--accent-hover);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

/* --- Categories / Tags --- */
.wp-block-post-content .wp-block-post-terms a {
  display: inline-block;
  background: var(--accent-muted);
  color: var(--accent-default);
  padding: 0.25rem 0.75rem;
  border-radius: var(--radius-xl);
  font-size: 0.8125rem;
  font-weight: 500;
  text-decoration: none;
  transition: all var(--transition-fast);
  margin: 0.25rem;
}
.wp-block-post-content .wp-block-post-terms a:hover {
  background: rgba(91, 138, 245, 0.25);
  color: var(--accent-hover);
}

/* Override parent theme .entry-content a link color */
.entry-content a,
.entry-content a:visited {
  color: var(--accent-default) !important;
}
.entry-content a:hover {
  color: var(--accent-hover) !important;
}

/* Override parent theme .entry-content heading accents */
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
  --h-accent: var(--accent-default) !important;
  color: #ffffff !important;
}

/* Override parent theme body background */
body .has-base-background-color,
body.has-base-background-color {
  background-color: var(--bg-base) !important;
}

body .has-contrast-color,
body.has-contrast-color {
  color: var(--text-primary) !important;
}

/* ============================================================
   SITE-WIDE ELEMENTS — Header, Footer, Navigation
   ============================================================ */

/* Navigation links */
.wp-block-navigation a {
  color: var(--text-secondary);
  text-decoration: none;
  transition: color var(--transition-fast);
}
.wp-block-navigation a:hover {
  color: #ffffff;
}

/* Post title */
.wp-block-post-title {
  color: #ffffff;
  font-weight: 700;
  letter-spacing: -0.03em;
}

/* Post meta (date, author, categories) */
.wp-block-post-date,
.wp-block-post-author,
.wp-block-post-terms {
  color: var(--text-tertiary);
  font-size: 0.875rem;
}

/* Site title */
.wp-block-site-title a {
  color: #ffffff;
  text-decoration: none;
  font-weight: 700;
}

/* Pagination */
.wp-block-query-pagination a {
  color: var(--accent-default);
}
.wp-block-query-pagination {
  color: var(--text-secondary);
}

/* Comments */
.wp-block-comments .comment-content {
  color: var(--text-primary);
}

/* Search */
.wp-block-search__input {
  background: var(--bg-overlay);
  border: 1px solid var(--border-default);
  color: var(--text-primary);
  border-radius: var(--radius-sm);
  padding: 0.5rem 1rem;
}
.wp-block-search__button {
  background: var(--accent-default);
  color: #ffffff;
  border: none;
  border-radius: var(--radius-sm);
  padding: 0.5rem 1rem;
  font-weight: 600;
  cursor: pointer;
}

/* ============================================================
   SPECIAL CONTENT — TOC, callouts, feature boxes
   ============================================================ */

/* Table of Contents (auto-generated) */
.wp-block-post-content .wp-block-heading[id^="toc-"],
.wp-block-post-content h2[id^="toc-"] {
  scroll-margin-top: 2rem;
}

/* Notice / callout blocks (if using a plugin) */
.wp-block-post-content .wp-block-group.notice,
.wp-block-post-content .wp-block-group.callout {
  background: var(--bg-elevated);
  border-left: 3px solid var(--accent-default);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
}



/* ============================================================
   PARENT THEME OVERRIDES — Override Twenty Twenty-Five theme.json
   These !important rules override the inline styles generated
   by the parent theme's theme.json color palette.
   ============================================================ */
body {
  --wp--preset--color--base: var(--bg-base) !important;
  --wp--preset--color--contrast: var(--text-primary) !important;
  --wp--preset--color--primary: var(--accent-default) !important;
  --wp--preset--color--secondary: var(--text-secondary) !important;
  --wp--preset--color--tertiary: var(--text-tertiary) !important;
  --wp--preset--color--accent-1: var(--accent-muted) !important;
  --wp--preset--color--accent-2: var(--accent-muted) !important;
  --wp--preset--color--accent-3: var(--accent-muted) !important;
  --wp--preset--color--accent-4: var(--bg-overlay) !important;
  --wp--preset--color--accent-5: var(--bg-overlay) !important;
  --wp--preset--color--accent-6: var(--border-default) !important;
}

/* Override WP global styles that set inline colors */
.has-background { background-color: var(--bg-base) !important; }
.has-contrast-color { color: var(--text-primary) !important; }
.has-base-background-color { background-color: var(--bg-base) !important; }
.has-contrast-background-color { background-color: var(--text-primary) !important; }

/* ============================================================
   OVERRIDE HERMES DESIGN SYSTEM — Plugin-injected inline styles
   The WPCode plugin injects a <style id="hermes-design-system">
   that sets .entry-content colors to #635BFF (purple-blue accent).
   These overrides neutralize that for our dark theme.
   ============================================================ */
.entry-content a {
  color: var(--accent-default) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
  text-decoration-color: rgba(91, 138, 245, 0.4) !important;
}
.entry-content a:hover {
  color: var(--accent-hover) !important;
  text-decoration-color: var(--accent-hover) !important;
  text-decoration-thickness: 2px !important;
}
.entry-content h2 {
  border-bottom: 1px solid var(--border-default) !important;
  color: #ffffff !important;
}
.entry-content img {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-lg) !important;
  border: 1px solid var(--border-subtle) !important;
}
.entry-content blockquote {
  border-left: 3px solid var(--accent-default) !important;
  background: var(--bg-elevated) !important;
  color: var(--text-secondary) !important;
}
.entry-content th {
  background: var(--bg-overlay) !important;
  color: #ffffff !important;
  border-bottom: 2px solid var(--border-strong) !important;
}
.entry-content td {
  color: var(--text-secondary) !important;
  border-bottom: 1px solid var(--border-subtle) !important;
}
.entry-content table {
  border: 1px solid var(--border-default) !important;
}
/* ============================================================
   RESPONSIVE — Mobile adjustments
   ============================================================ */
@media (max-width: 768px) {
  .wp-block-post-content {
    padding-left: var(--space-md);
    padding-right: var(--space-md);
    font-size: 1rem;   /* 16px on mobile */
  }
  .wp-block-post-content h2 {
    font-size: 1.5rem; /* 24px */
  }
  .wp-block-post-content h3 {
    font-size: 1.1875rem; /* 19px */
  }
}

@media (max-width: 480px) {
  .wp-block-post-content {
    padding-left: var(--space-sm);
    padding-right: var(--space-sm);
  }
  .wp-block-post-content h2 {
    font-size: 1.375rem; /* 22px */
  }
}

/* ============================================================
   PRINT — Light background for printing
   ============================================================ */
@media print {
  body {
    background: #ffffff;
    color: #1a1a1a;
  }
  .wp-block-post-content {
    color: #1a1a1a;
    max-width: 100%;
  }
  .wp-block-post-content h2,
  .wp-block-post-content h3,
  .wp-block-post-content strong {
    color: #000000;
  }
  a {
    color: #0056b3;
  }
}
/* ============================================================
   WIDE LAYOUT + COLLAPSIBLE TABLE OF CONTENTS
   Inline TOC inside article content (not sidebar)
   ============================================================ */

/* --- Wide content container --- */
.wp-block-post-content {
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* --- Collapsible TOC (Rank Math block) --- */
.wp-block-rank-math-toc-block {
  border: 1px solid var(--border-default) !important;
  border-radius: var(--radius-md) !important;
  padding: 16px 20px !important;
  background: var(--bg-surface) !important;
  transition: background 0.2s !important;
  margin: 2em 0 !important;
}
.wp-block-rank-math-toc-block:hover,
.wp-block-rank-math-toc-block.is-expanded {
  background: var(--bg-elevated) !important;
}

/* Title bar with chevron */
.rank-math-toc-title,
.wp-block-rank-math-toc-block h2 {
  cursor: pointer !important;
  position: relative !important;
  padding-right: 28px !important;
  margin: 0 !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--accent-default) !important;
  user-select: none !important;
}
.rank-math-toc-title::after,
.wp-block-rank-math-toc-block h2::after {
  content: "\25B8" !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  transition: transform 0.2s ease !important;
  color: var(--accent-default) !important;
  font-size: 0.9em !important;
}

/* Collapsed: hide nav */
.wp-block-rank-math-toc-block nav,
.wp-block-rank-math-toc-block > ol {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  transition: max-height 0.4s ease, opacity 0.3s ease, margin-top 0.3s ease !important;
  margin-top: 0 !important;
}

/* Expanded on hover/focus/JS toggle */
.wp-block-rank-math-toc-block:hover nav,
.wp-block-rank-math-toc-block:focus-within nav,
.wp-block-rank-math-toc-block.is-expanded nav,
.wp-block-rank-math-toc-block:hover > ol,
.wp-block-rank-math-toc-block:focus-within > ol,
.wp-block-rank-math-toc-block.is-expanded > ol {
  max-height: 2000px !important;
  opacity: 1 !important;
  margin-top: 12px !important;
}

/* Chevron rotation */
.wp-block-rank-math-toc-block:hover .rank-math-toc-title::after,
.wp-block-rank-math-toc-block:focus-within .rank-math-toc-title::after,
.wp-block-rank-math-toc-block.is-expanded .rank-math-toc-title::after,
.wp-block-rank-math-toc-block:hover h2::after,
.wp-block-rank-math-toc-block:focus-within h2::after,
.wp-block-rank-math-toc-block.is-expanded h2::after {
  transform: translateY(-50%) rotate(90deg) !important;
}

/* TOC list styling */
.entry-content .wp-block-rank-math-toc-block ol,
.entry-content .wp-block-rank-math-toc-block ul {
  list-style: none !important;
  list-style-type: none !important;
  padding: 0 !important;
  margin: 0 !important;
  counter-reset: none !important;
}
.entry-content .wp-block-rank-math-toc-block ol li,
.entry-content .wp-block-rank-math-toc-block ul li {
  padding: 6px 0 !important;
  border-bottom: 1px solid var(--border-subtle) !important;
  line-height: 1.4 !important;
  list-style-type: none !important;
  list-style: none !important;
}
.entry-content .wp-block-rank-math-toc-block ol li::before,
.entry-content .wp-block-rank-math-toc-block ul li::before {
  display: none !important;
  content: none !important;
}
.entry-content .wp-block-rank-math-toc-block ol li:last-child,
.entry-content .wp-block-rank-math-toc-block ul li:last-child {
  border-bottom: none !important;
}

/* TOC links */
.entry-content .wp-block-rank-math-toc-block ol li a,
.entry-content .wp-block-rank-math-toc-block ul li a {
  color: var(--text-secondary) !important;
  text-decoration: none !important;
  font-size: 0.8125rem !important;
  opacity: 0.85 !important;
  transition: opacity 0.2s, color 0.2s !important;
  display: block !important;
}
.entry-content .wp-block-rank-math-toc-block ol li a:hover,
.entry-content .wp-block-rank-math-toc-block ul li a:hover {
  opacity: 1 !important;
  color: var(--accent-hover) !important;
}

/* Hide duplicate h2 when rank-math-toc-title exists */
.wp-block-rank-math-toc-block h2 + .rank-math-toc-title {
  display: block !important;
}
.wp-block-rank-math-toc-block h2:has(+ .rank-math-toc-title) {
  display: none !important;
}

/* --- Auto-injected TOC (when no Rank Math TOC exists) --- */
.injected-toc {
  border: 1px solid var(--border-default) !important;
  border-radius: var(--radius-md) !important;
  padding: 16px 20px !important;
  background: var(--bg-surface) !important;
  transition: background 0.2s !important;
  margin: 1.5em 0 !important;
}
.injected-toc:hover,
.injected-toc.is-expanded {
  background: var(--bg-elevated) !important;
}
.injected-toc-title {
  cursor: pointer !important;
  position: relative !important;
  padding-right: 28px !important;
  margin: 0 !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--accent-default) !important;
  user-select: none !important;
}
.injected-toc-title::after {
  content: "\25B8" !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  transition: transform 0.2s ease !important;
  color: var(--accent-default) !important;
  font-size: 0.9em !important;
}
.injected-toc.is-expanded .injected-toc-title::after,
.injected-toc:hover .injected-toc-title::after {
  transform: translateY(-50%) rotate(90deg) !important;
}
.injected-toc ul {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  transition: max-height 0.4s ease, opacity 0.3s ease !important;
  margin-top: 0 !important;
  list-style: none !important;
  padding: 0 !important;
}
.injected-toc.is-expanded ul,
.injected-toc:hover ul {
  max-height: 2000px !important;
  opacity: 1 !important;
  margin-top: 12px !important;
}
.injected-toc li {
  padding: 6px 0 !important;
  border-bottom: 1px solid var(--border-subtle) !important;
}
.injected-toc li:last-child {
  border-bottom: none !important;
}
.injected-toc a {
  color: var(--text-secondary) !important;
  text-decoration: none !important;
  font-size: 0.8125rem !important;
  opacity: 0.85 !important;
  transition: opacity 0.2s, color 0.2s !important;
  display: block !important;
}
.injected-toc a:hover {
  opacity: 1 !important;
  color: var(--accent-hover) !important;
}