/* TapHome Script Syntax Highlighting */
.taphome-highlighted {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    padding: 1rem !important;
    border-radius: 0.375rem !important;
    overflow-x: auto !important;
    line-height: 1.5 !important;
}

/* TapHome Script syntax colors based on the Python highlighter */
.th-function {
    color: #ae81ff; /* Magenta - Functions */
    font-weight: 600;
}

.th-keyword {
    color: #f92672; /* Pink/Red - Keywords */
    font-weight: 600;
}

.th-variable {
    color: #0369a1; /* Darker Blue - Variables */
}

.th-string {
    color: #d97706; /* Dark amber/orange - Strings */
}

.th-number {
    color: #16a34a; /* Darker Green - Numbers */
}

.th-comment {
    color: #6b7280; /* Medium Grey - Comments */
    font-style: italic;
}

.th-operator {
    color: #2d3748; /* Dark Grey - Operators */
    font-weight: 600;
}

.th-punctuation {
    color: #2d3748; /* Dark grey - Punctuation */
}

/* Dark theme support */
@media (prefers-color-scheme: dark) {
    .taphome-highlighted {
        background-color: #272822;
        color: #f8f8f2;
    }
}

/* Code block container styling */
pre code.taphome-highlighted {
    display: block;
    padding: 1rem;
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    border-radius: 0.375rem;
    overflow-x: auto;
}

/* Ensure pre elements also have light grey background */
pre:has(code.taphome-highlighted),
pre:has(code[class*="language-taphome"]) {
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    border-radius: 0.375rem;
}

/* Target Hugo-generated code blocks with maximum specificity */
pre[tabindex="0"] code[class*="language-taphome"],
pre code[class*="language-taphome"],
code[class*="language-taphome"] {
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    padding: 1rem !important;
    display: block !important;
    border-radius: 0.375rem !important;
    overflow-x: auto !important;
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
    line-height: 1.5 !important;
}

/* Target the pre element containing taphome code */
pre[tabindex="0"]:has(code[class*="language-taphome"]),
pre:has(code[class*="language-taphome"]) {
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    padding: 0 !important;
    border-radius: 0.375rem !important;
    margin: 1rem 0 !important;
}

/* Ensure proper spacing in code blocks */
.taphome-highlighted .th-function,
.taphome-highlighted .th-keyword,
.taphome-highlighted .th-variable,
.taphome-highlighted .th-string,
.taphome-highlighted .th-number,
.taphome-highlighted .th-comment,
.taphome-highlighted .th-operator,
.taphome-highlighted .th-punctuation {
    font-family: inherit;
    font-size: inherit;
}

/* Override any Tailwind/other CSS with maximum specificity - NUCLEAR OPTION */
html body main .content pre[tabindex="0"] code[class*="language-taphome"],
html body main .content pre code[class*="language-taphome"],
html body main .content code[class*="language-taphome"],
html body .content pre[tabindex="0"] code[class*="language-taphome"],
html body .content pre code[class*="language-taphome"],
html body .content code[class*="language-taphome"] {
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    padding: 1rem !important;
    display: block !important;
    border-radius: 0.375rem !important;
    overflow-x: auto !important;
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace !important;
    line-height: 1.5 !important;
    border: none !important;
    box-shadow: none !important;
}

html body main .content pre[tabindex="0"]:has(code[class*="language-taphome"]),
html body main .content pre:has(code[class*="language-taphome"]),
html body .content pre[tabindex="0"]:has(code[class*="language-taphome"]),
html body .content pre:has(code[class*="language-taphome"]) {
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    padding: 0 !important;
    border-radius: 0.375rem !important;
    margin: 1rem 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* Direct targeting of ALL pre elements with tabindex="0" - ULTIMATE OVERRIDE */
pre[tabindex="0"]:has(code[class*="language-taphome"]),
.content pre[tabindex="0"]:has(code[class*="language-taphome"]),
.taphome-docs pre[tabindex="0"]:has(code[class*="language-taphome"]),
article pre[tabindex="0"]:has(code[class*="language-taphome"]),
main pre[tabindex="0"]:has(code[class*="language-taphome"]) {
    background: #f5f5f5 !important;
    background-color: #f5f5f5 !important;
    color: #2d3748 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0.375rem !important;
}

/* FINAL NUCLEAR OPTION - Override everything with highest possible specificity */
html body main article .content.taphome-docs pre[tabindex="0"]:has(code[class*="language-taphome"]),
html body main article .content pre[tabindex="0"]:has(code[class*="language-taphome"]),
html body main .content pre[tabindex="0"]:has(code[class*="language-taphome"]),
html body .content pre[tabindex="0"]:has(code[class*="language-taphome"]),
html pre[tabindex="0"]:has(code[class*="language-taphome"]),
pre[tabindex="0"][tabindex="0"][tabindex="0"]:has(code[class*="language-taphome"]) {
    background: #f5f5f5 !important;
    background-color: #f5f5f5 !important;
    background-image: none !important;
}