/*
Theme Name: nasbi blog
Description: Twenty Twenty-Three の子テーマ。コードブロックの見た目と色分け（Prism）を足している。
Template: twentytwentythree
Version: 1.0.0
Requires at least: 6.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/old-licenses/gpl-2.0.html
Text Domain: nasbi-blog
*/

/* ---------------------------------------------------------------------------
 * コードブロック
 * 色は GitHub のダークテーマに合わせている。Prism の色分けは assets/prism.js（イメージのビルド時に作る）
 * ------------------------------------------------------------------------- */

:root {
	--nasbi-code-bg: #0d1117;
	--nasbi-code-fg: #e6edf3;
	--nasbi-code-font: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
}

.wp-block-code {
	margin-block: 1.5em;
	padding: 1.1em 1.4em;
	overflow-x: auto;
	border: 0;
	border-radius: 8px;
	background: var(--nasbi-code-bg);
	color: var(--nasbi-code-fg);
	font-size: 0.85em;
	line-height: 1.7;
	tab-size: 4;
}

/* 長い行は折り返さず横にスクロールさせる */
.wp-block-code code {
	display: block;
	width: max-content;
	min-width: 100%;
	white-space: pre;
	overflow-wrap: normal;
	font-family: var(--nasbi-code-font);
	font-variant-ligatures: none;
}

/* 本文中の `code` */
:where(p, li, td, th, figcaption) code {
	padding: 0.15em 0.4em;
	border-radius: 4px;
	background: rgb(127 127 127 / 0.15);
	font-family: var(--nasbi-code-font);
	font-size: 0.875em;
}

/* Prism のトークン */
.wp-block-code .token.comment,
.wp-block-code .token.prolog,
.wp-block-code .token.doctype,
.wp-block-code .token.cdata {
	color: #8b949e;
	font-style: italic;
}

.wp-block-code .token.keyword,
.wp-block-code .token.operator,
.wp-block-code .token.important,
.wp-block-code .token.atrule .token.rule {
	color: #ff7b72;
}

.wp-block-code .token.string,
.wp-block-code .token.char,
.wp-block-code .token.attr-value,
.wp-block-code .token.regex,
.wp-block-code .token.url {
	color: #a5d6ff;
}

.wp-block-code .token.function,
.wp-block-code .token.class-name,
.wp-block-code .token.selector {
	color: #d2a8ff;
}

.wp-block-code .token.number,
.wp-block-code .token.boolean,
.wp-block-code .token.constant,
.wp-block-code .token.property,
.wp-block-code .token.attr-name,
.wp-block-code .token.symbol {
	color: #79c0ff;
}

.wp-block-code .token.tag,
.wp-block-code .token.inserted {
	color: #7ee787;
}

.wp-block-code .token.variable,
.wp-block-code .token.builtin,
.wp-block-code .token.parameter {
	color: #ffa657;
}

.wp-block-code .token.deleted {
	color: #ffa198;
}

.wp-block-code .token.punctuation {
	color: #c9d1d9;
}

.wp-block-code .token.bold {
	font-weight: bold;
}

.wp-block-code .token.italic {
	font-style: italic;
}