/* PrismJS 1.29.0
 * Tema escuro do site (inspirado no Night Owl / One Dark) + estilos da toolbar
 * (etiqueta da linguagem e botão copiar).
 */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&display=swap');

:root {
	--code-bg: #1E2633;
	--code-bg-toolbar: #18202B;
	--code-border: rgba(255, 255, 255, 0.06);
	--code-color: #D6DEEB;
	--code-font: 'JetBrains Mono', Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
}

code[class*="language-"],
pre[class*="language-"] {
	color: var(--code-color);
	background: none;
	text-shadow: none;
	font-family: var(--code-font);
	font-size: 14px;
	font-variant-ligatures: none;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	word-wrap: normal;
	line-height: 1.65;

	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;

	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
	background: rgba(130, 170, 255, 0.3);
}

pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
code[class*="language-"]::selection, code[class*="language-"] ::selection {
	background: rgba(130, 170, 255, 0.3);
}

/* Code blocks */
pre[class*="language-"] {
	padding: 16px 20px;
	margin: 0;
	overflow: auto;
	background-color: var(--code-bg);
	border: 2px solid var(--color-outline, #4A5468);
	border-radius: 12px;
	box-shadow: 4px 4px 0 rgba(30, 38, 51, 0.15);
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
}

pre[class*="language-"]::-webkit-scrollbar {
	height: 8px;
}

pre[class*="language-"]::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.18);
	border-radius: 4px;
}

pre[class*="language-"]::-webkit-scrollbar-track {
	background: transparent;
}

/* Inline code com highlight (raro) */
:not(pre) > code[class*="language-"] {
	padding: 2px 6px;
	border-radius: 4px;
	white-space: normal;
	background-color: var(--code-bg);
}

/* Tokens */
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: #7F8DA3;
	font-style: italic;
}

.token.punctuation {
	color: #A6B0C3;
}

.token.namespace {
	opacity: .7;
}

.token.tag,
.token.deleted {
	color: #F07178;
}

.token.property,
.token.constant,
.token.symbol {
	color: #80CBC4;
}

.token.boolean,
.token.number,
.token.regex,
.token.important,
.token.variable {
	color: #F78C6C;
}

.token.selector,
.token.string,
.token.char,
.token.attr-value,
.token.inserted {
	color: #C3E88D;
}

.token.attr-name,
.token.builtin,
.token.class-name {
	color: #FFCB6B;
}

.token.operator,
.token.entity,
.token.url {
	color: #89DDFF;
}

.token.atrule,
.token.keyword {
	color: #C792EA;
}

.token.function {
	color: #82AAFF;
}

.token.important,
.token.bold {
	font-weight: bold;
}

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

.token.entity {
	cursor: help;
}

/* Toolbar: barra no topo do bloco com a linguagem à esquerda e o botão copiar à direita */
div.code-toolbar {
	position: relative;
	margin: 16px 0;
}

div.code-toolbar > pre[class*="language-"] {
	padding-top: 52px;
}

div.code-toolbar > .toolbar {
	position: absolute;
	top: 2px;
	left: 2px;
	right: 2px;
	height: 38px;
	padding: 0 10px 0 14px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background-color: var(--code-bg-toolbar);
	border-bottom: 1px solid var(--code-border);
	border-radius: 10px 10px 0 0;
	box-sizing: border-box;
}

div.code-toolbar > .toolbar > .toolbar-item {
	display: flex;
}

.code-language {
	font-family: 'Montserrat', Arial;
	font-size: 11px;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: #FFFFFF;
	background-color: #5B6376;
	border-radius: 4px;
	padding: 0 8px;
}

.code-language.lang-html,
.code-language.lang-markup { background-color: #D13076; }
.code-language.lang-css { background-color: #0AC5D4; color: #0B2A33; }
.code-language.lang-js,
.code-language.lang-javascript { background-color: #EF562D; }
.code-language.lang-php { background-color: #5587A2; }
.code-language.lang-sql { background-color: #5C7148; }
.code-language.lang-python { background-color: #D1AF94; color: #1E2633; }
.code-language.lang-jsx { background-color: #88B14B; }
.code-language.lang-bash,
.code-language.lang-shell { background-color: #5B6376; }
.code-language.lang-json { background-color: #5FA04E; }

.copy-to-clipboard-button {
	font-family: 'Montserrat', Arial;
	font-size: 12px;
	font-weight: 600;
	line-height: 24px;
	color: #A6B0C3;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 5px;
	padding: 0 10px;
	cursor: pointer;
	transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

.copy-to-clipboard-button:hover,
.copy-to-clipboard-button:focus-visible {
	color: #FFFFFF;
	background-color: rgba(255, 255, 255, 0.08);
	border-color: rgba(255, 255, 255, 0.25);
}

.copy-to-clipboard-button:focus-visible {
	outline: 2px solid #12A8C3;
	outline-offset: 2px;
}

.copy-to-clipboard-button[data-copy-state="copy-success"] {
	color: #C3E88D;
	border-color: rgba(195, 232, 141, 0.4);
}

.copy-to-clipboard-button[data-copy-state="copy-error"] {
	color: #F07178;
	border-color: rgba(240, 113, 120, 0.4);
}

@media print {
	pre[class*="language-"] {
		box-shadow: none;
	}

	div.code-toolbar > .toolbar {
		display: none;
	}

	div.code-toolbar > pre[class*="language-"] {
		padding-top: 16px;
	}
}