/**
 * Custom Code Block Styles
 * Syntax highlighting and copy functionality
 * Using highlight.js (vs2015 theme extended)
 */

/* Code Block Container */
.andykemp-code-block {
    margin: 2rem 0;
    border-radius: 8px;
    overflow: hidden;
    background: #1e1e1e;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    font-family: 'Courier New', Courier, monospace;
}

/* Header */
.code-block-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: #2d2d2d;
    border-bottom: 1px solid #3e3e3e;
}

.code-block-header .file-name {
    display: flex;
    align-items: center;
    color: #d4d4d4;
    font-size: 0.875rem;
    font-weight: 500;
}

.code-block-header .file-icon {
    margin-right: 0.5rem;
}

.language-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    background: #3e3e3e;
    color: #569cd6;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.copy-code-btn {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
    background: #0e639c;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.copy-code-btn:hover {
    background: #1177bb;
}

.copy-code-btn:active {
    transform: scale(0.98);
}

.copy-code-btn.copied {
    background: #16a34a;
}

.copy-code-btn.copied::after {
    content: ' Copied!';
}

.copy-code-btn i {
    margin-right: 0.25rem;
}

/* Code Content */
.andykemp-code-block pre {
    margin: 0;
    padding: 1.5rem;
    overflow-x: auto;
    background: #1e1e1e;
    line-height: 1.6;
}

.andykemp-code-block code {
    display: block;
    color: #d4d4d4;
    font-family: 'Courier New', Courier, monospace;
    font-size: 0.875rem;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    tab-size: 4;
}

/* Line Numbers using CSS Counters */
.andykemp-code-block.line-numbers code {
    counter-reset: line;
}

.andykemp-code-block.line-numbers code .line {
    display: inline-block;
    width: 100%;
    position: relative;
    padding-left: 3.5rem;
    counter-increment: line;
}

.andykemp-code-block.line-numbers code .line::before {
    content: counter(line);
    position: absolute;
    left: 0;
    width: 3rem;
    color: #858585;
    font-size: 0.875rem;
    line-height: inherit;
    text-align: right;
    padding-right: 0.5rem;
    user-select: none;
    pointer-events: none;
}

/* Syntax Highlighting - Enhanced VS Code Dark+ Theme */

/* Comments and Documentation */
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
    color: #6a9955;
    font-style: italic;
}

.token.namespace {
    opacity: 0.8;
}

/* Strings and Characters */
.token.string,
.token.attr-value,
.token.char {
    color: #ce9178;
}

.token.template-string .token.string {
    color: #ce9178;
}

/* Keywords and Control Flow */
.token.keyword,
.token.control,
.token.directive,
.token.unit,
.token.statement,
.token.regex,
.token.atrule {
    color: #c586c0;
}

/* Language-specific keywords */
.token.keyword.module,
.token.keyword.control-flow {
    color: #c586c0;
}

/* Operators and Punctuation */
.token.punctuation,
.token.operator {
    color: #d4d4d4;
}

.token.operator.arrow {
    color: #569cd6;
}

/* Numbers and Booleans */
.token.number,
.token.boolean,
.token.constant {
    color: #b5cea8;
}

/* Functions and Methods */
.token.function,
.token.function-name,
.token.method,
.token.property-access {
    color: #dcdcaa;
}

/* Classes and Types */
.token.class-name,
.token.type-annotation,
.token.type,
.token.builtin,
.token.primitive {
    color: #4ec9b0;
}

/* Variables and Properties */
.token.variable,
.token.property,
.token.constant {
    color: #9cdcfe;
}

.token.parameter {
    color: #9cdcfe;
}

/* Tags and Selectors (HTML/CSS) */
.token.tag,
.token.selector {
    color: #569cd6;
}

.token.attr-name,
.token.property {
    color: #9cdcfe;
}

/* URLs and Links */
.token.entity,
.token.url,
.token.symbol {
    color: #4ec9b0;
}

/* Important and Special */
.token.important,
.token.bold {
    font-weight: bold;
    color: #ff6b6b;
}

.token.italic {
    font-style: italic;
}

/* Inserted and Deleted (Diffs) */
.token.inserted {
    color: #b5cea8;
    background: rgba(181, 206, 168, 0.15);
}

.token.deleted {
    color: #f44747;
    background: rgba(244, 71, 71, 0.15);
}

/* Shell/Bash specific */
.language-bash .token.function,
.language-bash .token.builtin {
    color: #dcdcaa;
}

.language-bash .token.string {
    color: #ce9178;
}

.language-bash .token.keyword {
    color: #c586c0;
}

.language-bash .token.operator {
    color: #d4d4d4;
}

/* PowerShell specific */
.language-powershell .token.function,
.language-powershell .token.cmdlet {
    color: #4fc1ff !important; /* Bright cyan/blue for cmdlets like Get-Process, Set-Location */
    font-weight: 600 !important;
}

.language-powershell .token.variable,
.language-powershell .token.namespace {
    color: #9cdcfe !important;
}

.language-powershell .token.keyword {
    color: #c586c0 !important; /* Purple for keywords like if, foreach */
}

.language-powershell .token.operator {
    color: #b5cea8 !important; /* Light green for operators like -eq, -ne */
}

.language-powershell .token.string {
    color: #ce9178 !important; /* Orange for strings */
}

.language-powershell .token.boolean {
    color: #569cd6 !important; /* Blue for $true, $false */
}

/* JavaScript/TypeScript specific */
.language-javascript .token.template-string .token.interpolation,
.language-typescript .token.template-string .token.interpolation {
    color: #569cd6;
}

.language-javascript .token.template-string .token.interpolation .token.punctuation,
.language-typescript .token.template-string .token.interpolation .token.punctuation {
    color: #c586c0;
}

/* Python specific */
.language-python .token.decorator {
    color: #dcdcaa;
}

.language-python .token.keyword {
    color: #c586c0;
}

/* JSON specific */
.language-json .token.property {
    color: #9cdcfe;
}

.language-json .token.string {
    color: #ce9178;
}

/* CSS/SCSS specific */
.language-css .token.selector,
.language-scss .token.selector {
    color: #d7ba7d;
}

.language-css .token.property,
.language-scss .token.property {
    color: #9cdcfe;
}

/* SQL specific */
.language-sql .token.keyword {
    color: #c586c0;
}

.language-sql .token.function {
    color: #dcdcaa;
}

/* Error highlighting */
.token.error {
    color: #f44747;
    background: rgba(244, 71, 71, 0.1);
}

/* Highlighted Lines */
.andykemp-code-block.has-highlights pre code .line-highlight {
    background: rgba(255, 255, 255, 0.1);
    border-left: 3px solid #0e639c;
    padding-left: 0.5rem;
    margin-left: -0.5rem;
}

/* Editor Styles (Gutenberg) */
.andykemp-code-block-wrapper {
    margin: 1rem 0;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
}

.andykemp-code-block-wrapper .code-block-header {
    background: #f5f5f5;
    border-bottom: 1px solid #ddd;
}

.andykemp-code-block-wrapper .file-name,
.andykemp-code-block-wrapper .language-badge {
    color: #333;
}

.andykemp-code-block-wrapper .language-badge {
    background: #e0e0e0;
    color: #0066cc;
}

.code-block-editor {
    position: relative;
}

.code-textarea {
    width: 100%;
    min-height: 200px;
    padding: 1rem;
    border: none;
    font-family: 'Courier New', Courier, monospace;
    font-size: 0.875rem;
    line-height: 1.6;
    background: #1e1e1e;
    color: #d4d4d4;
    resize: vertical;
}

.code-textarea:focus {
    outline: none;
    background: #252526;
}

.code-block-footer {
    padding: 0.5rem 1rem;
    background: #f5f5f5;
    border-top: 1px solid #ddd;
    font-size: 0.75rem;
    color: #666;
}

/* Responsive */
@media (max-width: 768px) {
    .andykemp-code-block pre {
        padding: 1rem;
        font-size: 0.8rem;
    }

    .code-block-header {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .copy-code-btn {
        padding: 0.4rem 0.8rem;
        font-size: 0.8rem;
    }

    .andykemp-code-block.line-numbers pre {
        padding-left: 2.5rem;
    }

    .andykemp-code-block.line-numbers pre::before {
        width: 2rem;
    }
}

/* Scrollbar Styling */
.andykemp-code-block pre::-webkit-scrollbar {
    height: 8px;
}

.andykemp-code-block pre::-webkit-scrollbar-track {
    background: #2d2d2d;
}

.andykemp-code-block pre::-webkit-scrollbar-thumb {
    background: #555;
    border-radius: 4px;
}

.andykemp-code-block pre::-webkit-scrollbar-thumb:hover {
    background: #666;
}

/* highlight.js Additional Styling (VS Code Dark+ Theme) */
/* PowerShell Specific Enhancements */
.language-powershell .hljs-function,
.language-powershell .hljs-built_in {
    color: #4fc1ff !important;
    font-weight: 600 !important;
}

.language-powershell .hljs-keyword {
    color: #c586c0 !important;
}

.language-powershell .hljs-operator {
    color: #d4d4d4 !important;
}

.language-powershell .hljs-string {
    color: #ce9178 !important;
}

.language-powershell .hljs-variable {
    color: #9cdcfe !important;
}

.language-powershell .hljs-number {
    color: #b5cea8 !important;
}

.language-powershell .hljs-comment {
    color: #6a9955 !important;
    font-style: italic !important;
}

.language-powershell .hljs-params {
    color: #9cdcfe !important;
}

/* General highlight.js enhancements */
.hljs-comment,
.hljs-quote {
    color: #6a9955;
    font-style: italic;
}

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

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

.hljs-title,
.hljs-section,
.hljs-selector-id {
    color: #dcdcaa;
    font-weight: 600;
}

.hljs-type,
.hljs-class .hljs-title {
    color: #4ec9b0;
}

.hljs-tag,
.hljs-name,
.hljs-attribute {
    color: #9cdcfe;
}

.hljs-regexp,
.hljs-link {
    color: #d16969;
}

.hljs-symbol,
.hljs-bullet,
.hljs-number {
    color: #b5cea8;
}

.hljs-meta,
.hljs-selector-attr,
.hljs-selector-pseudo {
    color: #d7ba7d;
}

.hljs-built_in,
.hljs-builtin-name {
    color: #4fc1ff;
    font-weight: 500;
}

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

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

.hljs-deletion {
    color: #f92672;
}

.hljs-addition {
    color: #a6e22e;
}