/* Custom styles for Malfind Labs blog */

/* Prose styling for content */
.prose {
    color: #374151;
}

.dark .prose {
    color: #e5e7eb;
}

.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
    color: #111827;
    font-weight: 600;
}

.dark .prose h1, .dark .prose h2, .dark .prose h3, .dark .prose h4, .dark .prose h5, .dark .prose h6 {
    color: #ffffff;
}

/* Ensure light theme text is always dark */
:not(.dark) .prose {
    color: #374151 !important;
}

/* Additional light theme overrides for any missed elements */
:not(.dark) body {
    color: #374151 !important;
}

:not(.dark) p {
    color: #374151 !important;
}

:not(.dark) li {
    color: #374151 !important;
}

:not(.dark) span {
    color: #374151 !important;
}

/* Dark theme overrides with higher specificity */
.dark body {
    color: #e5e7eb !important;
}

.dark p {
    color: #e5e7eb !important;
}

.dark li {
    color: #e5e7eb !important;
}

.dark span {
    color: #e5e7eb !important;
}

/* Ensure accent red color is preserved in both themes */
.text-accent-red,
:not(.dark) .text-accent-red,
.dark .text-accent-red {
    color: #FCA5A5 !important;
}

:not(.dark) .prose h1, 
:not(.dark) .prose h2, 
:not(.dark) .prose h3, 
:not(.dark) .prose h4, 
:not(.dark) .prose h5, 
:not(.dark) .prose h6 {
    color: #111827 !important;
}

:not(.dark) .prose p {
    color: #374151 !important;
}

:not(.dark) .prose li {
    color: #374151 !important;
}

:not(.dark) .prose strong {
    color: #111827 !important;
}

:not(.dark) .prose em {
    color: #374151 !important;
}

/* Ensure dark theme styles override light theme */
.dark .prose {
    color: #e5e7eb !important;
}

.dark .prose h1, 
.dark .prose h2, 
.dark .prose h3, 
.dark .prose h4, 
.dark .prose h5, 
.dark .prose h6 {
    color: #ffffff !important;
}

.dark .prose p {
    color: #e5e7eb !important;
}

.dark .prose li {
    color: #e5e7eb !important;
}

.dark .prose strong {
    color: #ffffff !important;
}

.dark .prose em {
    color: #e5e7eb !important;
}

.prose h1 {
    font-size: 2.25rem;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

.prose h2 {
    font-size: 1.875rem;
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
}

.prose h3 {
    font-size: 1.5rem;
    margin-top: 1.25rem;
    margin-bottom: 0.5rem;
}

.prose p {
    margin-bottom: 1rem;
    line-height: 1.7;
}

.prose a {
    color: #FCA5A5;
    text-decoration: none;
}

.prose a:hover {
    text-decoration: underline;
}

.prose code {
    background-color: #f3f4f6;
    color: #dc2626;
    padding: 0.125rem 0.25rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
}

.dark .prose code {
    background-color: #374151;
    color: #FCA5A5;
}

.prose pre {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 1rem;
    overflow-x: auto;
    margin: 1rem 0;
}

.dark .prose pre {
    background-color: #1f2937;
    border: 1px solid #374151;
}

.prose pre code {
    background-color: transparent !important;
    color: #374151;
    padding: 0;
    font-family: 'Roboto Mono', 'Monaco', 'Consolas', monospace;
}

.dark .prose pre code {
    color: #e5e7eb;
}

/* Ensure code blocks don't inherit prose styles */
.prose pre,
.prose pre code,
.prose code {
    font-family: 'Roboto Mono', 'Monaco', 'Consolas', monospace !important;
}

/* Hugo syntax highlighting styles */
.hljs,
pre code,
code[class*="language-"],
pre[class*="language-"] {
    background: #1f2937 !important;
    color: #e5e7eb !important;
    padding: 1rem;
    border-radius: 0.5rem;
    overflow-x: auto;
    font-family: 'Roboto Mono', 'Monaco', 'Consolas', monospace;
}

.hljs-comment,
.hljs-quote {
    color: #6a9955;
}

.hljs-variable,
.hljs-template-variable,
.hljs-attribute,
.hljs-tag,
.hljs-name,
.hljs-regexp,
.hljs-link,
.hljs-selector-id,
.hljs-selector-class {
    color: #f44747;
}

.hljs-number,
.hljs-meta,
.hljs-built_in,
.hljs-builtin-name,
.hljs-literal,
.hljs-type,
.hljs-params {
    color: #b5cea8;
}

.hljs-string,
.hljs-symbol,
.hljs-bullet {
    color: #ce9178;
}

.hljs-title,
.hljs-section {
    color: #dcdcaa;
}

.hljs-keyword,
.hljs-selector-tag {
    color: #569cd6;
}

.hljs-emphasis {
    font-style: italic;
}

.hljs-strong {
    font-weight: bold;
}

/* Light theme syntax highlighting - more specific selectors */
:not(.dark) .hljs {
    background: #f8fafc !important;
    color: #1f2937 !important;
}

:not(.dark) .hljs-comment,
:not(.dark) .hljs-quote {
    color: #6a9955 !important;
}

:not(.dark) .hljs-variable,
:not(.dark) .hljs-template-variable,
:not(.dark) .hljs-attribute,
:not(.dark) .hljs-tag,
:not(.dark) .hljs-name,
:not(.dark) .hljs-regexp,
:not(.dark) .hljs-link,
:not(.dark) .hljs-selector-id,
:not(.dark) .hljs-selector-class {
    color: #dc2626 !important;
}

:not(.dark) .hljs-number,
:not(.dark) .hljs-meta,
:not(.dark) .hljs-built_in,
:not(.dark) .hljs-builtin-name,
:not(.dark) .hljs-literal,
:not(.dark) .hljs-type,
:not(.dark) .hljs-params {
    color: #059669 !important;
}

:not(.dark) .hljs-string,
:not(.dark) .hljs-symbol,
:not(.dark) .hljs-bullet {
    color: #dc2626 !important;
}

:not(.dark) .hljs-title,
:not(.dark) .hljs-section {
    color: #7c3aed !important;
}

:not(.dark) .hljs-keyword,
:not(.dark) .hljs-selector-tag {
    color: #2563eb !important;
}

/* Ensure dark theme syntax highlighting overrides light theme */
.dark .hljs {
    background: #1f2937 !important;
    color: #e5e7eb !important;
}

.dark .hljs-comment,
.dark .hljs-quote {
    color: #6a9955 !important;
}

.dark .hljs-variable,
.dark .hljs-template-variable,
.dark .hljs-attribute,
.dark .hljs-tag,
.dark .hljs-name,
.dark .hljs-regexp,
.dark .hljs-link,
.dark .hljs-selector-id,
.dark .hljs-selector-class {
    color: #f44747 !important;
}

.dark .hljs-number,
.dark .hljs-meta,
.dark .hljs-built_in,
.dark .hljs-builtin-name,
.dark .hljs-literal,
.dark .hljs-type,
.dark .hljs-params {
    color: #b5cea8 !important;
}

.dark .hljs-string,
.dark .hljs-symbol,
.dark .hljs-bullet {
    color: #ce9178 !important;
}

.dark .hljs-title,
.dark .hljs-section {
    color: #dcdcaa !important;
}

.dark .hljs-keyword,
.dark .hljs-selector-tag {
    color: #569cd6 !important;
}

/* Additional Hugo syntax highlighting classes */
.chroma {
    background: #1f2937 !important;
    color: #e5e7eb !important;
    padding: 1rem;
    border-radius: 0.5rem;
    overflow-x: auto;
    font-family: 'Roboto Mono', 'Monaco', 'Consolas', monospace;
}

.light .chroma {
    background: #f8fafc !important;
    color: #374151 !important;
}

/* Specific syntax highlighting for different languages */
.chroma .c, .chroma .cm, .chroma .c1, .chroma .cs {
    color: #6a9955; /* Comments */
}

.chroma .k, .chroma .kc, .chroma .kd, .chroma .kn, .chroma .kp, .chroma .kr, .chroma .kt {
    color: #569cd6; /* Keywords */
}

.chroma .s, .chroma .sa, .chroma .sb, .chroma .sc, .chroma .dl, .chroma .sd, .chroma .s2, .chroma .se, .chroma .sh, .chroma .si, .chroma .sx, .chroma .sr, .chroma .s1, .chroma .ss {
    color: #ce9178; /* Strings */
}

.chroma .n, .chroma .na, .chroma .nb, .chroma .bp, .chroma .nc, .chroma .no, .chroma .nd, .chroma .ni, .chroma .ne, .chroma .nf, .chroma .fm, .chroma .nl, .chroma .nn, .chroma .nx, .chroma .py, .chroma .nt, .chroma .nv, .chroma .vc, .chroma .vg, .chroma .vi, .chroma .vm {
    color: #9cdcfe; /* Names */
}

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

/* Light theme chroma styles - more specific selectors */
:not(.dark) .chroma {
    background: #f8fafc !important;
    color: #1f2937 !important;
}

:not(.dark) .chroma .c, 
:not(.dark) .chroma .cm, 
:not(.dark) .chroma .c1, 
:not(.dark) .chroma .cs {
    color: #6a9955 !important;
}

:not(.dark) .chroma .k, 
:not(.dark) .chroma .kc, 
:not(.dark) .chroma .kd, 
:not(.dark) .chroma .kn, 
:not(.dark) .chroma .kp, 
:not(.dark) .chroma .kr, 
:not(.dark) .chroma .kt {
    color: #2563eb !important;
}

:not(.dark) .chroma .s, 
:not(.dark) .chroma .sa, 
:not(.dark) .chroma .sb, 
:not(.dark) .chroma .sc, 
:not(.dark) .chroma .dl, 
:not(.dark) .chroma .sd, 
:not(.dark) .chroma .s2, 
:not(.dark) .chroma .se, 
:not(.dark) .chroma .sh, 
:not(.dark) .chroma .si, 
:not(.dark) .chroma .sx, 
:not(.dark) .chroma .sr, 
:not(.dark) .chroma .s1, 
:not(.dark) .chroma .ss {
    color: #dc2626 !important;
}

:not(.dark) .chroma .n, 
:not(.dark) .chroma .na, 
:not(.dark) .chroma .nb, 
:not(.dark) .chroma .bp, 
:not(.dark) .chroma .nc, 
:not(.dark) .chroma .no, 
:not(.dark) .chroma .nd, 
:not(.dark) .chroma .ni, 
:not(.dark) .chroma .ne, 
:not(.dark) .chroma .nf, 
:not(.dark) .chroma .fm, 
:not(.dark) .chroma .nl, 
:not(.dark) .chroma .nn, 
:not(.dark) .chroma .nx, 
:not(.dark) .chroma .py, 
:not(.dark) .chroma .nt, 
:not(.dark) .chroma .nv, 
:not(.dark) .chroma .vc, 
:not(.dark) .chroma .vg, 
:not(.dark) .chroma .vi, 
:not(.dark) .chroma .vm {
    color: #111827 !important;
}

:not(.dark) .chroma .m, 
:not(.dark) .chroma .mb, 
:not(.dark) .chroma .mf, 
:not(.dark) .chroma .mh, 
:not(.dark) .chroma .mi, 
:not(.dark) .chroma .il, 
:not(.dark) .chroma .mo, 
:not(.dark) .chroma .mx {
    color: #059669 !important;
}

/* Ensure dark theme chroma overrides light theme */
.dark .chroma {
    background: #1f2937 !important;
    color: #e5e7eb !important;
}

.dark .chroma .c, 
.dark .chroma .cm, 
.dark .chroma .c1, 
.dark .chroma .cs {
    color: #6a9955 !important;
}

.dark .chroma .k, 
.dark .chroma .kc, 
.dark .chroma .kd, 
.dark .chroma .kn, 
.dark .chroma .kp, 
.dark .chroma .kr, 
.dark .chroma .kt {
    color: #569cd6 !important;
}

.dark .chroma .s, 
.dark .chroma .sa, 
.dark .chroma .sb, 
.dark .chroma .sc, 
.dark .chroma .dl, 
.dark .chroma .sd, 
.dark .chroma .s2, 
.dark .chroma .se, 
.dark .chroma .sh, 
.dark .chroma .si, 
.dark .chroma .sx, 
.dark .chroma .sr, 
.dark .chroma .s1, 
.dark .chroma .ss {
    color: #ce9178 !important;
}

.dark .chroma .n, 
.dark .chroma .na, 
.dark .chroma .nb, 
.dark .chroma .bp, 
.dark .chroma .nc, 
.dark .chroma .no, 
.dark .chroma .nd, 
.dark .chroma .ni, 
.dark .chroma .ne, 
.dark .chroma .nf, 
.dark .chroma .fm, 
.dark .chroma .nl, 
.dark .chroma .nn, 
.dark .chroma .nx, 
.dark .chroma .py, 
.dark .chroma .nt, 
.dark .chroma .nv, 
.dark .chroma .vc, 
.dark .chroma .vg, 
.dark .chroma .vi, 
.dark .chroma .vm {
    color: #9cdcfe !important;
}

.dark .chroma .m, 
.dark .chroma .mb, 
.dark .chroma .mf, 
.dark .chroma .mh, 
.dark .chroma .mi, 
.dark .chroma .il, 
.dark .chroma .mo, 
.dark .chroma .mx {
    color: #b5cea8 !important;
}

.prose blockquote {
    border-left: 4px solid #FCA5A5;
    padding-left: 1rem;
    margin: 1rem 0;
    color: #9ca3af;
    font-style: italic;
}

.prose ul, .prose ol {
    margin: 1rem 0;
    padding-left: 1.5rem;
}

.prose li {
    margin: 0.5rem 0;
}

.prose table {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
}

.prose th, .prose td {
    border: 1px solid #374151;
    padding: 0.5rem;
    text-align: left;
}

.prose th {
    background-color: #374151;
    font-weight: 600;
}

/* Search results styling */
#search-results {
    max-height: 400px;
    overflow-y: auto;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .prose h1 {
        font-size: 1.875rem;
    }
    
    .prose h2 {
        font-size: 1.5rem;
    }
    
    .prose h3 {
        font-size: 1.25rem;
    }
}
