/* backend/api/public/docs/css/highlight.css */

/* Code Syntax Highlighting for Oliver Chat API Documentation */

.hljs {
    display: block;
    overflow-x: auto;
    padding: 1rem;
    background: #1e293b;
    color: #e2e8f0;
    border-radius: 0.5rem;
}

.hljs-comment,
.hljs-quote {
    color: #64748b;
    font-style: italic;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-subst {
    color: #f59e0b;
    font-weight: bold;
}

.hljs-number,
.hljs-literal,
.hljs-variable,
.hljs-template-variable,
.hljs-tag .hljs-attr {
    color: #10b981;
}

.hljs-string,
.hljs-doctag {
    color: #22d3ee;
}

.hljs-title,
.hljs-section,
.hljs-selector-id {
    color: #60a5fa;
    font-weight: bold;
}

.hljs-type,
.hljs-class .hljs-title {
    color: #a78bfa;
    font-weight: bold;
}

.hljs-tag,
.hljs-name,
.hljs-attribute {
    color: #f87171;
    font-weight: normal;
}

.hljs-regexp,
.hljs-link {
    color: #fb7185;
}

.hljs-symbol,
.hljs-bullet {
    color: #fbbf24;
}

.hljs-built_in,
.hljs-builtin-name {
    color: #34d399;
}

.hljs-meta {
    color: #94a3b8;
}

.hljs-deletion {
    background: #fecaca;
    color: #dc2626;
}

.hljs-addition {
    background: #bbf7d0;
    color: #059669;
}

.hljs-emphasis {
    font-style: italic;
}

.hljs-strong {
    font-weight: bold;
}

/* Language-specific highlighting */
.hljs-json .hljs-attr {
    color: #60a5fa;
}

.hljs-json .hljs-string {
    color: #22d3ee;
}

.hljs-json .hljs-number {
    color: #10b981;
}

.hljs-json .hljs-literal {
    color: #f59e0b;
}

/* PHP specific */
.hljs-php .hljs-keyword {
    color: #8b5cf6;
}

.hljs-php .hljs-variable {
    color: #ef4444;
}

.hljs-php .hljs-string {
    color: #22d3ee;
}

/* JavaScript specific */
.hljs-javascript .hljs-function {
    color: #60a5fa;
}

.hljs-javascript .hljs-params {
    color: #e2e8f0;
}

/* CSS specific */
.hljs-css .hljs-selector-tag {
    color: #f59e0b;
}

.hljs-css .hljs-selector-class {
    color: #22d3ee;
}

.hljs-css .hljs-selector-id {
    color: #60a5fa;
}

.hljs-css .hljs-attribute {
    color: #a78bfa;
}

.hljs-css .hljs-number {
    color: #10b981;
}

/* Shell/Bash specific */
.hljs-bash .hljs-built_in {
    color: #f59e0b;
}

.hljs-bash .hljs-string {
    color: #22d3ee;
}

/* SQL specific */
.hljs-sql .hljs-keyword {
    color: #8b5cf6;
    text-transform: uppercase;
}

.hljs-sql .hljs-string {
    color: #22d3ee;
}

/* HTTP specific for API documentation */
.hljs-http .hljs-keyword {
    color: #f59e0b;
    font-weight: bold;
}

.hljs-http .hljs-string {
    color: #22d3ee;
}

.hljs-http .hljs-attribute {
    color: #60a5fa;
}

/* Custom styles for API documentation */
.api-endpoint {
    background: #0f172a;
    border: 1px solid #334155;
    border-radius: 0.5rem;
    padding: 1rem;
    margin: 1rem 0;
    position: relative;
}

.api-endpoint .method {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    margin-right: 0.5rem;
}

.api-endpoint .method.get {
    background: #065f46;
    color: #10b981;
}

.api-endpoint .method.post {
    background: #1e3a8a;
    color: #60a5fa;
}

.api-endpoint .method.put {
    background: #92400e;
    color: #fbbf24;
}

.api-endpoint .method.delete {
    background: #991b1b;
    color: #f87171;
}

.api-endpoint .method.patch {
    background: #581c87;
    color: #a78bfa;
}

.api-endpoint .url {
    color: #e2e8f0;
    font-family: monospace;
    font-size: 0.875rem;
}

.api-endpoint .description {
    color: #94a3b8;
    font-size: 0.875rem;
    margin-top: 0.5rem;
}

/* Code block with copy functionality */
.code-block-container {
    position: relative;
    margin: 1rem 0;
}

.code-block-container .copy-btn {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #cbd5e1;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    cursor: pointer;
    transition: all 0.2s;
}

.code-block-container .copy-btn:hover {
    background: rgba(0, 0, 0, 0.7);
    color: white;
}

.code-block-container .copy-btn.copied {
    background: #059669;
    color: white;
}

/* Inline code */
:not(pre) > code {
    background: #f1f5f9;
    color: #475569;
    padding: 0.125rem 0.25rem;
    border-radius: 0.25rem;
    font-size: 0.875em;
    font-weight: 500;
}

/* Dark theme inline code */
[data-theme="dark"] :not(pre) > code {
    background: #334155;
    color: #cbd5e1;
}

/* Line numbers */
.hljs-ln {
    border-collapse: collapse;
}

.hljs-ln td {
    padding: 0;
}

.hljs-ln-n {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.hljs-ln-numbers {
    text-align: center;
    color: #64748b;
    border-right: 1px solid #334155;
    vertical-align: top;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.hljs-ln-code {
    padding-left: 0.5rem;
}

/* Responsive */
@media (max-width: 768px) {
    .hljs {
        font-size: 0.75rem;
        padding: 0.75rem;
    }
    
    .api-endpoint {
        padding: 0.75rem;
    }
    
    .code-block-container .copy-btn {
        position: static;
        display: block;
        margin-bottom: 0.5rem;
        width: fit-content;
    }
}