/*
 * AN Liquid Glass UI — v1.0.0
 * Agriculture Novel | Apple Intelligence Aesthetic
 * Full-site liquid glass transformation
 * Colour system: White · Red #FF3B30 · Blue #0A84FF · Green #30D158 · Black #1C1C1E
 */

/* ============================================================
   0. TOKENS & RESET
   ============================================================ */
:root {
  --anlg-white:       #FFFFFF;
  --anlg-red:         #FF3B30;
  --anlg-red-soft:    #FF6961;
  --anlg-blue:        #0A84FF;
  --anlg-blue-soft:   #64AFFF;
  --anlg-green:       #30D158;
  --anlg-green-soft:  #6EE89A;
  --anlg-black:       #1C1C1E;
  --anlg-black-soft:  #2C2C2E;

  /* Glass surfaces */
  --glass-base:       rgba(255,255,255,0.07);
  --glass-hover:      rgba(255,255,255,0.13);
  --glass-strong:     rgba(255,255,255,0.14);
  --glass-card:       rgba(255,255,255,0.09);
  --glass-nav:        rgba(15,25,20,0.72);
  --glass-border:     rgba(255,255,255,0.18);
  --glass-border-s:   rgba(255,255,255,0.10);
  --glass-shadow:     0 8px 40px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.18);
  --glass-shadow-sm:  0 4px 20px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.14);
  --glass-blur:       blur(28px) saturate(200%);
  --glass-blur-sm:    blur(16px) saturate(180%);
  --glass-blur-nav:   blur(40px) saturate(220%);

  /* Typography */
  --font-display:     'Fraunces', Georgia, serif;
  --font-body:        'Bricolage Grotesque', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Background orbs */
  --bg-orb1: radial-gradient(ellipse 900px 700px at 10% 20%, rgba(48,209,88,0.18) 0%, transparent 70%);
  --bg-orb2: radial-gradient(ellipse 700px 600px at 85% 15%, rgba(10,132,255,0.20) 0%, transparent 70%);
  --bg-orb3: radial-gradient(ellipse 600px 500px at 50% 85%, rgba(255,59,48,0.12) 0%, transparent 70%);
  --bg-orb4: radial-gradient(ellipse 500px 400px at 20% 70%, rgba(10,132,255,0.14) 0%, transparent 70%);
  --bg-base: linear-gradient(135deg, #030d07 0%, #050f1a 35%, #030d07 65%, #0a1408 100%);
}

/* ============================================================
   1. GLOBAL BACKGROUND — Fixed nature-depth canvas
   ============================================================ */
html.anlg-active,
body.anlg-active {
  background-color: #030d07 !important;
  background-image:
    var(--bg-orb1),
    var(--bg-orb2),
    var(--bg-orb3),
    var(--bg-orb4),
    var(--bg-base) !important;
  background-attachment: fixed !important;
  background-size: cover !important;
  color: var(--anlg-white) !important;
  font-family: var(--font-body) !important;
  -webkit-font-smoothing: antialiased !important;
  min-height: 100vh !important;
}

/* ============================================================
   2. UNIVERSAL WHITE-BACKGROUND OBLITERATION
   Replace every white/light surface with liquid glass
   ============================================================ */

/* Catch-all: any element with an explicit white/near-white background */
body.anlg-active *,
body.anlg-active *::before,
body.anlg-active *::after {
  box-sizing: border-box;
}

/* The nuclear reset — kill all white/light backgrounds */
body.anlg-active div,
body.anlg-active section,
body.anlg-active article,
body.anlg-active aside,
body.anlg-active main,
body.anlg-active header,
body.anlg-active footer,
body.anlg-active nav,
body.anlg-active ul,
body.anlg-active ol,
body.anlg-active li,
body.anlg-active span,
body.anlg-active p,
body.anlg-active td,
body.anlg-active th,
body.anlg-active tr,
body.anlg-active table,
body.anlg-active form,
body.anlg-active fieldset,
body.anlg-active label,
body.anlg-active select,
body.anlg-active textarea,
body.anlg-active blockquote,
body.anlg-active pre,
body.anlg-active code,
body.anlg-active figure,
body.anlg-active figcaption {
  background-color: transparent !important;
}

/* ============================================================
   3. GLASS SURFACE SYSTEM — Apply to structural containers
   ============================================================ */

/* Primary glass panels */
body.anlg-active .site-header,
body.anlg-active #header,
body.anlg-active #masthead,
body.anlg-active .main-navigation,
body.anlg-active header.site-header,
body.anlg-active .header-main,
body.anlg-active .nav-wrapper,
body.anlg-active #nav-main {
  background: var(--glass-nav) !important;
  backdrop-filter: var(--glass-blur-nav) !important;
  -webkit-backdrop-filter: var(--glass-blur-nav) !important;
  border-bottom: 1px solid var(--glass-border) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,0.4) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
}

/* Logo text in nav */
body.anlg-active .site-branding *,
body.anlg-active .site-title,
body.anlg-active .site-title a,
body.anlg-active #logo,
body.anlg-active .logo a,
body.anlg-active .logo {
  color: var(--anlg-white) !important;
  font-family: var(--font-display) !important;
}

/* Content area — main glass card */
body.anlg-active #page,
body.anlg-active .site,
body.anlg-active #content,
body.anlg-active .site-content,
body.anlg-active .content-area,
body.anlg-active .hfeed {
  background: transparent !important;
}

body.anlg-active .entry-content-wrapper,
body.anlg-active .post-container,
body.anlg-active article.post,
body.anlg-active article.page,
body.anlg-active .post,
body.anlg-active .type-post,
body.anlg-active .type-page,
body.anlg-active .hentry,
body.anlg-active .entry {
  background: var(--glass-card) !important;
  backdrop-filter: var(--glass-blur) !important;
  -webkit-backdrop-filter: var(--glass-blur) !important;
  border: 1px solid var(--glass-border-s) !important;
  box-shadow: var(--glass-shadow) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  margin-bottom: 32px !important;
  position: relative !important;
}

/* Specular highlight on glass cards */
body.anlg-active article.post::before,
body.anlg-active .hentry::before,
body.anlg-active .glass-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent) !important;
  pointer-events: none !important;
}

/* Sidebar */
body.anlg-active #secondary,
body.anlg-active .widget-area,
body.anlg-active .sidebar {
  background: transparent !important;
}

body.anlg-active .widget,
body.anlg-active .sidebar .widget,
body.anlg-active #secondary .widget {
  background: var(--glass-base) !important;
  backdrop-filter: var(--glass-blur-sm) !important;
  -webkit-backdrop-filter: var(--glass-blur-sm) !important;
  border: 1px solid var(--glass-border-s) !important;
  border-radius: 16px !important;
  box-shadow: var(--glass-shadow-sm) !important;
  padding: 20px !important;
  margin-bottom: 24px !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Footer */
body.anlg-active .site-footer,
body.anlg-active #colophon,
body.anlg-active footer.site-footer {
  background: rgba(3, 13, 7, 0.85) !important;
  backdrop-filter: blur(40px) !important;
  -webkit-backdrop-filter: blur(40px) !important;
  border-top: 1px solid var(--glass-border-s) !important;
  color: rgba(255,255,255,0.7) !important;
}

/* ============================================================
   4. TYPOGRAPHY — Intelligent colour-coded system
   ============================================================ */

/* Base text — WHITE */
body.anlg-active,
body.anlg-active p,
body.anlg-active li,
body.anlg-active td,
body.anlg-active th,
body.anlg-active span,
body.anlg-active label,
body.anlg-active div {
  color: var(--anlg-white) !important;
  font-family: var(--font-body) !important;
  font-weight: 400 !important;
}

/* Body text inside articles — high legibility white */
body.anlg-active .entry-content p,
body.anlg-active .entry-content li,
body.anlg-active article p,
body.anlg-active article li,
body.anlg-active .post-content p {
  color: rgba(255,255,255,0.92) !important;
  font-size: 1.05rem !important;
  line-height: 1.85 !important;
  font-weight: 400 !important;
}

/* H1 — RED (punchy, commanding) */
body.anlg-active h1,
body.anlg-active .entry-title,
body.anlg-active .page-title,
body.anlg-active .post-title,
body.anlg-active h1.entry-title,
body.anlg-active .site-title,
body.anlg-active .hero-title {
  color: var(--anlg-red) !important;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  text-shadow: 0 0 40px rgba(255,59,48,0.35), 0 2px 12px rgba(0,0,0,0.6) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
}

/* H2 — BLUE (structural, authoritative) */
body.anlg-active h2,
body.anlg-active .entry-content h2,
body.anlg-active article h2 {
  color: var(--anlg-blue) !important;
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  text-shadow: 0 0 30px rgba(10,132,255,0.30), 0 2px 10px rgba(0,0,0,0.5) !important;
  letter-spacing: -0.015em !important;
}

/* H3 — GREEN (fresh, natural — perfect for agri content) */
body.anlg-active h3,
body.anlg-active .entry-content h3,
body.anlg-active article h3 {
  color: var(--anlg-green) !important;
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
  text-shadow: 0 0 24px rgba(48,209,88,0.28), 0 2px 8px rgba(0,0,0,0.4) !important;
}

/* H4 — WHITE (neutral supporting) */
body.anlg-active h4,
body.anlg-active .entry-content h4,
body.anlg-active article h4 {
  color: rgba(255,255,255,0.90) !important;
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
}

/* H5, H6 — soft white */
body.anlg-active h5,
body.anlg-active h6 {
  color: rgba(255,255,255,0.75) !important;
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
}

/* Widget titles — GREEN */
body.anlg-active .widget-title,
body.anlg-active .widgettitle,
body.anlg-active .sidebar h2,
body.anlg-active .sidebar h3,
body.anlg-active .widget h2,
body.anlg-active .widget h3 {
  color: var(--anlg-green) !important;
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid rgba(48,209,88,0.25) !important;
  padding-bottom: 8px !important;
  margin-bottom: 14px !important;
}

/* ============================================================
   5. LINKS — BLUE system with hover glow
   ============================================================ */
body.anlg-active a,
body.anlg-active a:visited {
  color: var(--anlg-blue) !important;
  text-decoration: none !important;
  transition: color 0.2s ease, text-shadow 0.2s ease !important;
}

body.anlg-active a:hover,
body.anlg-active a:focus {
  color: var(--anlg-blue-soft) !important;
  text-shadow: 0 0 16px rgba(10,132,255,0.60) !important;
  text-decoration: none !important;
}

/* Post title links — RED override */
body.anlg-active .entry-title a,
body.anlg-active .entry-title a:visited,
body.anlg-active h1.entry-title a,
body.anlg-active h2.entry-title a {
  color: var(--anlg-red) !important;
  text-shadow: 0 0 30px rgba(255,59,48,0.30) !important;
}

body.anlg-active .entry-title a:hover {
  color: var(--anlg-red-soft) !important;
  text-shadow: 0 0 24px rgba(255,59,48,0.55) !important;
}

/* Navigation links — WHITE */
body.anlg-active .main-navigation a,
body.anlg-active .nav-menu a,
body.anlg-active #site-navigation a,
body.anlg-active .menu-item a,
body.anlg-active nav a {
  color: rgba(255,255,255,0.88) !important;
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.02em !important;
  padding: 8px 14px !important;
  border-radius: 8px !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}

body.anlg-active .main-navigation a:hover,
body.anlg-active nav a:hover,
body.anlg-active .menu-item a:hover {
  background: rgba(255,255,255,0.12) !important;
  color: var(--anlg-white) !important;
  text-shadow: none !important;
}

/* Active menu item — GREEN dot / highlight */
body.anlg-active .current-menu-item > a,
body.anlg-active .current_page_item > a {
  color: var(--anlg-green) !important;
  background: rgba(48,209,88,0.12) !important;
}

/* ============================================================
   6. ARTICLE CONTENT — Specific overrides for rich content
   ============================================================ */

/* Table of Contents (most TOC plugins) */
body.anlg-active #ez-toc-container,
body.anlg-active .ez-toc-container,
body.anlg-active .table-of-contents,
body.anlg-active #toc-widget-div,
body.anlg-active .toc_widget_list,
body.anlg-active nav.ez-toc-sticky-fixed,
body.anlg-active .ez-toc-sticky,
body.anlg-active #ez-toc-sticky-container {
  background: rgba(10,132,255,0.08) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid rgba(10,132,255,0.25) !important;
  border-radius: 16px !important;
  padding: 20px 24px !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.12) !important;
}

body.anlg-active #ez-toc-container p.ez-toc-title,
body.anlg-active .ez-toc-title,
body.anlg-active .table-of-contents h3,
body.anlg-active .table-of-contents .title {
  color: var(--anlg-green) !important;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
}

body.anlg-active #ez-toc-container ul li a,
body.anlg-active .ez-toc-list a,
body.anlg-active .table-of-contents a {
  color: var(--anlg-blue-soft) !important;
}

body.anlg-active #ez-toc-container ul li a:hover,
body.anlg-active .ez-toc-list a:hover {
  color: var(--anlg-white) !important;
}

/* Blockquotes — glass with blue left border */
body.anlg-active blockquote,
body.anlg-active .wp-block-quote {
  background: rgba(10,132,255,0.10) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-left: 3px solid var(--anlg-blue) !important;
  border-radius: 0 12px 12px 0 !important;
  padding: 20px 24px !important;
  margin: 28px 0 !important;
}

body.anlg-active blockquote p,
body.anlg-active blockquote cite {
  color: rgba(255,255,255,0.88) !important;
}

/* Code blocks */
body.anlg-active pre,
body.anlg-active code,
body.anlg-active .wp-block-code {
  background: rgba(28,28,30,0.80) !important;
  backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 10px !important;
  color: var(--anlg-green) !important;
  font-size: 0.9em !important;
}

body.anlg-active p code,
body.anlg-active li code {
  background: rgba(48,209,88,0.12) !important;
  color: var(--anlg-green-soft) !important;
  padding: 1px 6px !important;
  border-radius: 4px !important;
}

/* Tables */
body.anlg-active table {
  background: var(--glass-base) !important;
  backdrop-filter: var(--glass-blur-sm) !important;
  -webkit-backdrop-filter: var(--glass-blur-sm) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid var(--glass-border-s) !important;
  width: 100% !important;
}

body.anlg-active thead tr,
body.anlg-active table thead {
  background: rgba(48,209,88,0.15) !important;
}

body.anlg-active thead th {
  color: var(--anlg-green) !important;
  font-weight: 600 !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid rgba(48,209,88,0.25) !important;
}

body.anlg-active tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.03) !important;
}

body.anlg-active td {
  padding: 10px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

/* Images */
body.anlg-active .entry-content img,
body.anlg-active article img,
body.anlg-active .wp-post-image {
  border-radius: 14px !important;
  border: 1px solid var(--glass-border-s) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.5) !important;
}

/* Featured image container */
body.anlg-active .post-thumbnail,
body.anlg-active .featured-image,
body.anlg-active .wp-block-image {
  background: transparent !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}

/* ============================================================
   7. TAXONOMY — Categories & Tags (GREEN system)
   ============================================================ */
body.anlg-active .cat-links a,
body.anlg-active .category a,
body.anlg-active .post-categories a,
body.anlg-active .entry-meta .cat-links a {
  background: rgba(48,209,88,0.15) !important;
  color: var(--anlg-green) !important;
  border: 1px solid rgba(48,209,88,0.30) !important;
  border-radius: 100px !important;
  padding: 3px 12px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

body.anlg-active .tags-links a,
body.anlg-active .tag-links a,
body.anlg-active .entry-tags a,
body.anlg-active a[rel="tag"],
body.anlg-active .post-tags a {
  background: rgba(10,132,255,0.12) !important;
  color: var(--anlg-blue-soft) !important;
  border: 1px solid rgba(10,132,255,0.25) !important;
  border-radius: 6px !important;
  padding: 2px 10px !important;
  font-size: 0.78rem !important;
  margin: 2px !important;
  display: inline-block !important;
}

/* Entry meta (date, author) */
body.anlg-active .entry-meta,
body.anlg-active .post-meta,
body.anlg-active .byline,
body.anlg-active .posted-on,
body.anlg-active .entry-meta *,
body.anlg-active .post-meta * {
  color: rgba(255,255,255,0.55) !important;
  font-size: 0.82rem !important;
}

body.anlg-active .entry-meta a,
body.anlg-active .post-meta a {
  color: rgba(255,255,255,0.65) !important;
}

body.anlg-active .entry-meta a:hover {
  color: var(--anlg-green) !important;
}

/* ============================================================
   8. BUTTONS & FORMS
   ============================================================ */
body.anlg-active button,
body.anlg-active input[type="submit"],
body.anlg-active input[type="button"],
body.anlg-active .button,
body.anlg-active .btn,
body.anlg-active a.button,
body.anlg-active .wp-block-button__link,
body.anlg-active .read-more,
body.anlg-active .more-link,
body.anlg-active .site-main .more-link {
  background: rgba(10,132,255,0.20) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(10,132,255,0.40) !important;
  color: var(--anlg-white) !important;
  border-radius: 100px !important;
  padding: 10px 24px !important;
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.02em !important;
  cursor: pointer !important;
  transition: background 0.2s ease, box-shadow 0.2s ease !important;
  box-shadow: 0 4px 16px rgba(10,132,255,0.20) !important;
}

body.anlg-active button:hover,
body.anlg-active input[type="submit"]:hover,
body.anlg-active .button:hover,
body.anlg-active .more-link:hover {
  background: rgba(10,132,255,0.35) !important;
  box-shadow: 0 6px 24px rgba(10,132,255,0.40) !important;
}

/* Inputs */
body.anlg-active input[type="text"],
body.anlg-active input[type="email"],
body.anlg-active input[type="search"],
body.anlg-active input[type="password"],
body.anlg-active textarea,
body.anlg-active select {
  background: rgba(255,255,255,0.07) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  border-radius: 10px !important;
  color: var(--anlg-white) !important;
  padding: 10px 16px !important;
  font-family: var(--font-body) !important;
  outline: none !important;
  transition: border-color 0.2s ease !important;
}

body.anlg-active input:focus,
body.anlg-active textarea:focus,
body.anlg-active select:focus {
  border-color: rgba(10,132,255,0.60) !important;
  box-shadow: 0 0 0 3px rgba(10,132,255,0.15) !important;
}

body.anlg-active input::placeholder,
body.anlg-active textarea::placeholder {
  color: rgba(255,255,255,0.35) !important;
}

/* Search form */
body.anlg-active .search-form,
body.anlg-active .search-box {
  background: rgba(255,255,255,0.07) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  border-radius: 100px !important;
  overflow: hidden !important;
}

/* ============================================================
   9. NAVIGATION MENUS & DROPDOWNS
   ============================================================ */
body.anlg-active .main-navigation .sub-menu,
body.anlg-active .nav-menu .sub-menu,
body.anlg-active .menu .sub-menu {
  background: rgba(5,15,10,0.90) !important;
  backdrop-filter: blur(32px) !important;
  -webkit-backdrop-filter: blur(32px) !important;
  border: 1px solid var(--glass-border-s) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.60) !important;
  padding: 8px !important;
}

body.anlg-active .sub-menu li a {
  border-radius: 8px !important;
  padding: 8px 14px !important;
  display: block !important;
}

body.anlg-active .sub-menu li a:hover {
  background: rgba(255,255,255,0.10) !important;
}

/* Mobile hamburger menu */
body.anlg-active button.menu-toggle,
body.anlg-active .menu-toggle {
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
  color: var(--anlg-white) !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
}

/* ============================================================
   10. POST CARDS / ARCHIVE GRID
   ============================================================ */
body.anlg-active .post-card,
body.anlg-active .article-card,
body.anlg-active .blog-post,
body.anlg-active .archive .hentry,
body.anlg-active .blog .hentry,
body.anlg-active .home .hentry {
  background: var(--glass-card) !important;
  backdrop-filter: var(--glass-blur) !important;
  -webkit-backdrop-filter: var(--glass-blur) !important;
  border: 1px solid var(--glass-border-s) !important;
  border-radius: 20px !important;
  box-shadow: var(--glass-shadow) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
  overflow: hidden !important;
  position: relative !important;
}

body.anlg-active .archive .hentry:hover,
body.anlg-active .blog .hentry:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 56px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.22) !important;
  border-color: rgba(48,209,88,0.25) !important;
}

/* ============================================================
   11. PAGINATION
   ============================================================ */
body.anlg-active .pagination,
body.anlg-active .page-links,
body.anlg-active .nav-links,
body.anlg-active .posts-navigation {
  background: transparent !important;
}

body.anlg-active .pagination .page-numbers,
body.anlg-active .page-numbers {
  background: rgba(255,255,255,0.07) !important;
  color: var(--anlg-white) !important;
  border: 1px solid var(--glass-border-s) !important;
  border-radius: 8px !important;
  padding: 6px 14px !important;
  margin: 2px !important;
  display: inline-block !important;
}

body.anlg-active .pagination .current,
body.anlg-active .page-numbers.current {
  background: rgba(10,132,255,0.25) !important;
  border-color: rgba(10,132,255,0.40) !important;
  color: var(--anlg-blue-soft) !important;
}

/* ============================================================
   12. COMMENTS
   ============================================================ */
body.anlg-active #comments,
body.anlg-active .comments-area {
  background: transparent !important;
}

body.anlg-active .comment-body,
body.anlg-active .comment-content {
  background: rgba(255,255,255,0.05) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid var(--glass-border-s) !important;
  border-radius: 14px !important;
  padding: 16px !important;
}

body.anlg-active .comment-author .fn {
  color: var(--anlg-green) !important;
  font-weight: 600 !important;
}

body.anlg-active .comment-meta time {
  color: rgba(255,255,255,0.45) !important;
}

body.anlg-active #respond,
body.anlg-active .comment-respond {
  background: rgba(255,255,255,0.06) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid var(--glass-border-s) !important;
  border-radius: 16px !important;
  padding: 24px !important;
}

body.anlg-active #reply-title,
body.anlg-active .comment-reply-title {
  color: var(--anlg-blue) !important;
  font-family: var(--font-display) !important;
}

/* ============================================================
   13. AUTHOR BOX — Enhanced glass (already present, improve)
   ============================================================ */
body.anlg-active .author-box,
body.anlg-active .author-card,
body.anlg-active .about-author,
body.anlg-active .post-author-box,
body.anlg-active .author-bio,
body.anlg-active .entry-author {
  background: rgba(48,209,88,0.08) !important;
  backdrop-filter: blur(28px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(200%) !important;
  border: 1px solid rgba(48,209,88,0.22) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 40px rgba(48,209,88,0.10), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  padding: 24px !important;
}

body.anlg-active .author-box h3,
body.anlg-active .author-name,
body.anlg-active .author-box .name {
  color: var(--anlg-green) !important;
}

/* ============================================================
   14. BREADCRUMBS
   ============================================================ */
body.anlg-active .breadcrumbs,
body.anlg-active .breadcrumb,
body.anlg-active .yoast-breadcrumb,
body.anlg-active #breadcrumbs {
  color: rgba(255,255,255,0.50) !important;
  font-size: 0.82rem !important;
}

body.anlg-active .breadcrumbs a,
body.anlg-active .yoast-breadcrumb a {
  color: rgba(255,255,255,0.55) !important;
}

body.anlg-active .breadcrumbs a:hover {
  color: var(--anlg-green) !important;
}

body.anlg-active .breadcrumbs .separator,
body.anlg-active .breadcrumbs span:not(.breadcrumb_last) {
  color: rgba(255,255,255,0.30) !important;
}

/* ============================================================
   15. RELATED POSTS
   ============================================================ */
body.anlg-active .related-posts,
body.anlg-active .yarpp-related,
body.anlg-active .related-articles {
  background: transparent !important;
}

body.anlg-active .related-posts .post-card,
body.anlg-active .yarpp-related article,
body.anlg-active .related-post-item {
  background: var(--glass-card) !important;
  backdrop-filter: var(--glass-blur-sm) !important;
  border: 1px solid var(--glass-border-s) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  transition: transform 0.25s ease !important;
}

body.anlg-active .related-posts .post-card:hover {
  transform: translateY(-3px) !important;
}

/* ============================================================
   16. SPECIAL GUTENBERG BLOCKS
   ============================================================ */
body.anlg-active .wp-block-group,
body.anlg-active .wp-block-cover,
body.anlg-active .wp-block-columns {
  background: transparent !important;
}

body.anlg-active .wp-block-pullquote {
  background: rgba(255,59,48,0.08) !important;
  border: none !important;
  border-top: 2px solid rgba(255,59,48,0.40) !important;
  border-bottom: 2px solid rgba(255,59,48,0.40) !important;
  border-radius: 0 !important;
}

body.anlg-active .wp-block-pullquote p,
body.anlg-active .wp-block-pullquote blockquote p {
  color: var(--anlg-red-soft) !important;
  font-family: var(--font-display) !important;
  font-style: italic !important;
}

/* Notice/info blocks */
body.anlg-active .wp-block-notice,
body.anlg-active .notice,
body.anlg-active .info-box {
  border-radius: 12px !important;
  backdrop-filter: blur(12px) !important;
}

/* ============================================================
   17. SCROLLBAR — custom dark glass scrollbar
   ============================================================ */
body.anlg-active ::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}

body.anlg-active ::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.04) !important;
}

body.anlg-active ::-webkit-scrollbar-thumb {
  background: rgba(48,209,88,0.35) !important;
  border-radius: 100px !important;
}

body.anlg-active ::-webkit-scrollbar-thumb:hover {
  background: rgba(48,209,88,0.60) !important;
}

/* ============================================================
   18. SELECTION HIGHLIGHT
   ============================================================ */
body.anlg-active ::selection {
  background: rgba(10,132,255,0.35) !important;
  color: var(--anlg-white) !important;
}

/* ============================================================
   19. MOBILE RESPONSIVE ADJUSTMENTS
   ============================================================ */
@media (max-width: 768px) {
  body.anlg-active article.post,
  body.anlg-active .hentry {
    border-radius: 14px !important;
    margin-bottom: 20px !important;
  }

  body.anlg-active h1,
  body.anlg-active .entry-title {
    font-size: 1.7rem !important;
  }

  body.anlg-active h2,
  body.anlg-active .entry-content h2 {
    font-size: 1.3rem !important;
  }

  body.anlg-active .widget {
    border-radius: 12px !important;
  }
}

/* ============================================================
   20. ANIMATE-IN — smooth page load reveal
   ============================================================ */
body.anlg-active article,
body.anlg-active .hentry,
body.anlg-active .widget {
  animation: anlgFadeUp 0.5s ease both !important;
}

body.anlg-active article:nth-child(2) { animation-delay: 0.06s !important; }
body.anlg-active article:nth-child(3) { animation-delay: 0.12s !important; }
body.anlg-active article:nth-child(4) { animation-delay: 0.18s !important; }
body.anlg-active article:nth-child(5) { animation-delay: 0.24s !important; }

@keyframes anlgFadeUp {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================================================
   21. THEME-SPECIFIC OVERRIDES — Common WordPress themes
   ============================================================ */

/* GeneratePress */
body.anlg-active .inside-article,
body.anlg-active .inside-header-image,
body.anlg-active .generate-inside-navigation {
  background: transparent !important;
}

/* Astra */
body.anlg-active .ast-container,
body.anlg-active #ast-fixed-header,
body.anlg-active .ast-header-break-point .ast-mobile-menu-buttons {
  background: transparent !important;
}

/* OceanWP */
body.anlg-active #site-header-inner,
body.anlg-active .oceanwp-mobile-menu-icon a {
  background: transparent !important;
}

/* Kadence */
body.anlg-active .wp-site-blocks,
body.anlg-active .kadence-inner-column-inner {
  background: transparent !important;
}

/* Twenty Twenty-Four, Twenty Twenty-Five */
body.anlg-active .wp-block-template-part,
body.anlg-active .wp-block-post-content,
body.anlg-active .is-layout-flow {
  background: transparent !important;
}

/* ============================================================
   22. CRITICAL FALLBACK — Any surviving white/light backgrounds
   These selectors catch anything theme-specific that slipped through
   ============================================================ */
body.anlg-active [style*="background: white"],
body.anlg-active [style*="background: #fff"],
body.anlg-active [style*="background: #ffffff"],
body.anlg-active [style*="background-color: white"],
body.anlg-active [style*="background-color: #fff"],
body.anlg-active [style*="background-color: #ffffff"],
body.anlg-active [style*="background-color: rgb(255, 255, 255)"],
body.anlg-active [style*="background:#fff"],
body.anlg-active [style*="background:#ffffff"] {
  background: var(--glass-card) !important;
  backdrop-filter: var(--glass-blur-sm) !important;
  -webkit-backdrop-filter: var(--glass-blur-sm) !important;
}

/* Text visibility on any white remnant */
body.anlg-active [style*="background: white"] *,
body.anlg-active [style*="background-color: #fff"] *,
body.anlg-active [style*="background-color: white"] * {
  color: var(--anlg-white) !important;
}

/* Any black/dark text that might be invisible on dark glass */
body.anlg-active [style*="color: black"],
body.anlg-active [style*="color: #000"],
body.anlg-active [style*="color: #000000"],
body.anlg-active [style*="color:#000"],
body.anlg-active [style*="color: rgb(0,0,0)"] {
  color: rgba(255,255,255,0.88) !important;
}