/* Custom link styling for blog posts and papers page */

/* Target links within blog post content and papers page content */
.content a,
main article .content a {
  color: #018574; /* Use the theme's teal color */
}

.content a:hover,
main article .content a:hover {
  color: #014a42; /* Darker teal for better contrast on light backgrounds */
  text-shadow: none;
}

/* Ensure headers within content don't get the colored links */
.content h1 a,
.content h2 a,
.content h3 a,
.content h4 a,
.content h5 a,
.content h6 a {
  color: inherit; /* Keep header link color as default */
}

.content h1 a:hover,
.content h2 a:hover,
.content h3 a:hover,
.content h4 a:hover,
.content h5 a:hover,
.content h6 a:hover {
  color: #014a42; /* Darker teal for headers too */
  text-shadow: none;
}

/* VS Code / Professional Terminal inspired syntax highlighting */

/* Main code block styling - VS Code dark theme */
.highlight,
.highlight pre[style],
.highlight pre {
  background-color: #1e1e1e !important; /* VS Code dark background */
  color: #d4d4d4 !important; /* VS Code light grey text */
  border: 1px solid #3c3c3c !important; /* Subtle border */
  border-radius: 6px !important; /* Modern rounded corners */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important; /* Subtle shadow */
}

/* Code container padding and styling */
.highlight pre {
  padding: 16px !important; /* More generous padding */
  margin: 0 !important;
  font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Courier New', monospace !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  overflow-x: auto !important;
}

/* VS Code color scheme overrides */

/* Strings - VS Code green */
.highlight code[class*="language-"] span[style*="color:#e6db74"],
.highlight code[class*="language-"] span[style*="color:#f8f8f2"],
.highlight pre code span[style*="color:#e6db74"] {
  color: #ce9178 !important; /* VS Code string color */
}

/* Numbers - VS Code light green */
.highlight code[class*="language-"] span[style*="color:#ae81ff"],
.highlight pre code span[style*="color:#ae81ff"] {
  color: #b5cea8 !important; /* VS Code number color */
}

/* Keywords and operators - VS Code blue */
.highlight code[class*="language-"] span[style*="color:#f92672"],
.highlight pre code span[style*="color:#f92672"],
.highlight code[class*="language-"] span[style*="color:#66d9ef"],
.highlight pre code span[style*="color:#66d9ef"] {
  color: #569cd6 !important; /* VS Code keyword blue */
}

/* Property names/attributes - VS Code light blue */
.highlight code[class*="language-"] span[style*="color:#a6e22e"],
.highlight pre code span[style*="color:#a6e22e"] {
  color: #9cdcfe !important; /* VS Code property/function color */
}

/* Comments - high contrast for better readability */
.highlight code[class*="language-"] span[style*="color:#75715e"],
.highlight pre code span[style*="color:#75715e"],
.highlight code span[style*="color:#75715e"],
.highlight pre span[style*="color:#75715e"],
/* Target the specific red color you mentioned with background */
.highlight code[class*="language-"] span[style*="color:#960050"],
.highlight pre code span[style*="color:#960050"],
.highlight code span[style*="color:#960050"],
.highlight pre span[style*="color:#960050"],
.highlight span[style*="color:#960050;background-color:#1e0010"],
.highlight code span[style*="color:#960050;background-color:#1e0010"],
.highlight pre code span[style*="color:#960050;background-color:#1e0010"],
/* Target other potential comment colors */
.highlight code[class*="language-"] span[style*="color:#999"],
.highlight code[class*="language-"] span[style*="color:#888"],
.highlight code[class*="language-"] span[style*="color:#666"] {
  color: #fff3cd !important; /* Bright warm white/cream for high contrast */
  background-color: transparent !important; /* Remove any background colors */
  font-style: italic !important;
}

/* Punctuation and brackets - VS Code yellow/gold */
.highlight code[class*="language-"] span[style*="color:#f8f8f2"] {
  color: #d4d4d4 !important; /* Default text color for punctuation */
}

/* Fallback: Chroma class overrides with VS Code colors */
.chroma { 
  background-color: #1e1e1e !important;
  color: #d4d4d4 !important;
  border: 1px solid #3c3c3c !important;
  border-radius: 6px !important;
}

.chroma .s, .chroma .s2, .chroma .s1, .chroma .sb, .chroma .sc { 
  color: #ce9178 !important; /* Strings */
}

.chroma .m, .chroma .mi, .chroma .mf, .chroma .mb, .chroma .mh, .chroma .mo { 
  color: #b5cea8 !important; /* Numbers */
}

.chroma .k, .chroma .kd, .chroma .kn, .chroma .kp, .chroma .kr, .chroma .kt,
.chroma .o, .chroma .ow { 
  color: #569cd6 !important; /* Keywords and operators */
}

.chroma .na, .chroma .nt, .chroma .nf, .chroma .nx { 
  color: #9cdcfe !important; /* Properties and functions */
}

.chroma .c, .chroma .c1, .chroma .cm, .chroma .cs, .chroma .cp, .chroma .cpf, .chroma .ch { 
  color: #fff3cd !important; /* Comments - bright cream for high contrast */
  font-style: italic !important;
}

/* JSON-specific enhancements */
.chroma .p { /* Punctuation (brackets, commas) */
  color: #d4d4d4 !important;
}

.chroma .err { /* Errors */
  color: #f44747 !important; /* VS Code error red */
  background: none !important;
}

/* Aggressive comment targeting - catch any remaining comments */
.highlight span:contains("//"),
.highlight *[class*="comment"],
.chroma *[class*="comment"] {
  color: #fff3cd !important;
  font-style: italic !important;
}

/* Target spans that start with // */
.highlight pre code span:first-child:before,
.chroma code span[data-content^="//"] {
  color: #fff3cd !important;
}

/* Mobile-responsive fixes for JSON syntax highlighting */
@media (max-width: 760px) {
  /* Ensure all syntax highlighting rules still apply on mobile */
  .highlight,
  .highlight pre[style],
  .highlight pre {
    background-color: #1e1e1e !important;
    color: #d4d4d4 !important;
    border: 1px solid #3c3c3c !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
  }

  .highlight pre {
    padding: 12px !important; /* Slightly less padding on mobile */
    font-size: 13px !important; /* Slightly smaller font on mobile */
    line-height: 1.4 !important;
  }

  /* Ensure all VS Code colors are preserved on mobile */
  .chroma { 
    background-color: #1e1e1e !important;
    color: #d4d4d4 !important;
    border: 1px solid #3c3c3c !important;
    border-radius: 6px !important;
  }

  /* Strings */
  .chroma .s, .chroma .s2, .chroma .s1, .chroma .sb, .chroma .sc,
  .highlight code[class*="language-"] span[style*="color:#e6db74"],
  .highlight pre code span[style*="color:#e6db74"] { 
    color: #ce9178 !important;
  }

  /* Numbers */
  .chroma .m, .chroma .mi, .chroma .mf, .chroma .mb, .chroma .mh, .chroma .mo,
  .highlight code[class*="language-"] span[style*="color:#ae81ff"],
  .highlight pre code span[style*="color:#ae81ff"] { 
    color: #b5cea8 !important;
  }

  /* Keywords and operators */
  .chroma .k, .chroma .kd, .chroma .kn, .chroma .kp, .chroma .kr, .chroma .kt,
  .chroma .o, .chroma .ow,
  .highlight code[class*="language-"] span[style*="color:#f92672"],
  .highlight pre code span[style*="color:#f92672"],
  .highlight code[class*="language-"] span[style*="color:#66d9ef"],
  .highlight pre code span[style*="color:#66d9ef"] { 
    color: #569cd6 !important;
  }

  /* Properties and functions */
  .chroma .na, .chroma .nt, .chroma .nf, .chroma .nx,
  .highlight code[class*="language-"] span[style*="color:#a6e22e"],
  .highlight pre code span[style*="color:#a6e22e"] { 
    color: #9cdcfe !important;
  }

  /* Comments - high contrast */
  .chroma .c, .chroma .c1, .chroma .cm, .chroma .cs, .chroma .cp, .chroma .cpf, .chroma .ch,
  .highlight code[class*="language-"] span[style*="color:#75715e"],
  .highlight pre code span[style*="color:#75715e"] { 
    color: #fff3cd !important;
    font-style: italic !important;
  }

  /* Punctuation */
  .chroma .p { 
    color: #d4d4d4 !important;
  }

  /* Errors */
  .chroma .err { 
    color: #f44747 !important;
    background: none !important;
  }
}

@media (max-width: 520px) {
  /* Extra small screens - even more compact */
  .highlight pre {
    padding: 10px !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
  }
}