.doc-code{background:var(--color-neutral-700,#0f172a);border-radius:var(--radius-lg,12px);font-family:Consolas,Monaco,Courier New,monospace;margin:var(--spacing-lg,24px) 0;overflow:hidden}.doc-code-header{align-items:center;background:hsla(0,0%,100%,.05);border-bottom:1px solid hsla(0,0%,100%,.1);display:flex;gap:var(--spacing-md,16px);padding:var(--spacing-sm,8px) var(--spacing-md,16px)}.doc-code-filename{color:var(--text-inverse,#fff);font-size:var(--font-size-sm,.875rem);font-weight:var(--font-weight-medium,500)}.doc-code-language{color:hsla(0,0%,100%,.5);letter-spacing:.05em;margin-left:auto;text-transform:uppercase}.doc-code-copy,.doc-code-language{font-size:var(--font-size-xs,.75rem)}.doc-code-copy{align-items:center;background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);border-radius:var(--radius-md,8px);color:hsla(0,0%,100%,.7);cursor:pointer;display:inline-flex;font-family:inherit;gap:var(--spacing-xs,4px);padding:var(--spacing-xs,4px) var(--spacing-sm,8px);transition:all .2s}.doc-code-copy:hover{background:hsla(0,0%,100%,.15);color:var(--text-inverse,#fff)}.doc-code-copy .material-icons-round{font-size:16px}.doc-code-copy.doc-code-copied{background:var(--color-success,#10b981);border-color:var(--color-success,#10b981);color:var(--text-inverse,#fff)}.doc-code-content{display:flex;overflow-x:auto}.doc-code-lines{background:hsla(0,0%,100%,.03);border-right:1px solid hsla(0,0%,100%,.1);flex-shrink:0;padding:var(--spacing-md,16px) var(--spacing-sm,8px);text-align:right;-webkit-user-select:none;-moz-user-select:none;user-select:none}.doc-code-line-number{color:hsla(0,0%,100%,.3);display:block;font-size:var(--font-size-sm,.875rem);line-height:1.6}.doc-code-pre{background:transparent;flex:1;margin:0;overflow-x:auto;padding:var(--spacing-md,16px)}.doc-code-block{color:var(--text-inverse,#fff);font-size:var(--font-size-sm,.875rem);line-height:1.6;white-space:pre;word-wrap:normal}.doc-code-content::-webkit-scrollbar{height:8px}.doc-code-content::-webkit-scrollbar-track{background:hsla(0,0%,100%,.05)}.doc-code-content::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.2);border-radius:4px}.doc-code-content::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,100%,.3)}.doc-code-php .doc-code-block{color:#e2e8f0}.doc-code-javascript .doc-code-block{color:#fcd34d}.doc-code-css .doc-code-block{color:#a78bfa}.doc-code-html .doc-code-block{color:#f87171}.doc-code-json .doc-code-block{color:#34d399}.doc-code-bash .doc-code-block{color:#60a5fa}@media(max-width:768px){.doc-code-header{flex-wrap:wrap}.doc-code-language{margin-bottom:var(--spacing-xs,4px);margin-left:0;order:-1;width:100%}.doc-code-copy{margin-left:auto}}@media(max-width:480px){.doc-code-lines{display:none}.doc-code-pre{padding:var(--spacing-sm,8px)}.doc-code-block{font-size:var(--font-size-xs,.75rem)}}