/*
 * Scoped block content styles.
 * Loaded only for post and RISHO NEWS content, after theme CSS.
 */
.risho-block-content,
.editor-styles-wrapper {
	--risho-block-content-width: 900px;
	--risho-block-wide-width: 1040px;
	--risho-block-gap: 1.75rem;
	--risho-block-border: #d9d9d9;
	--risho-block-muted: #6f6f6f;

	font-family: var(--font-family-base, "Noto Sans JP", "Inter", sans-serif);
	color: var(--text, #2c2222);
	line-height: 1.9;
}

.editor-styles-wrapper .edit-post-visual-editor__post-title-wrapper,
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container {
	width: min(100%, var(--risho-block-content-width));
	max-width: var(--risho-block-content-width);
	margin-right: auto;
	margin-left: auto;
}

.risho-block-content > *,
.editor-styles-wrapper .block-editor-block-list__layout > * {
	margin-top: 0;
	margin-bottom: var(--risho-block-gap);
}

.risho-block-content > :last-child,
.editor-styles-wrapper .block-editor-block-list__layout > :last-child {
	margin-bottom: 0;
}

.risho-block-content p,
.editor-styles-wrapper p {
	line-height: 1.9;
}

.risho-block-content h1,
.risho-block-content h2,
.risho-block-content h3,
.risho-block-content h4,
.risho-block-content h5,
.risho-block-content h6,
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
	margin-top: 2.4em;
	margin-bottom: 0.7em;
	color: var(--text, #2c2222);
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.03em;
}

.risho-block-content h1:first-child,
.risho-block-content h2:first-child,
.risho-block-content h3:first-child,
.risho-block-content h4:first-child,
.risho-block-content h5:first-child,
.risho-block-content h6:first-child,
.editor-styles-wrapper h1:first-child,
.editor-styles-wrapper h2:first-child,
.editor-styles-wrapper h3:first-child,
.editor-styles-wrapper h4:first-child,
.editor-styles-wrapper h5:first-child,
.editor-styles-wrapper h6:first-child {
	margin-top: 0;
}

.risho-block-content h2,
.editor-styles-wrapper h2 {
	padding-left: 0.85rem;
	border-left: 4px solid var(--primary, #990100);
	font-size: clamp(1.35rem, 1.2rem + 0.6vw, 1.8rem);
}

.risho-block-content h3,
.editor-styles-wrapper h3 {
	font-size: clamp(1.15rem, 1.05rem + 0.4vw, 1.45rem);
}

.risho-block-content a,
.editor-styles-wrapper a {
	color: var(--primary, #990100);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.risho-block-content ul,
.risho-block-content ol,
.editor-styles-wrapper ul,
.editor-styles-wrapper ol {
	padding-left: 1.35em;
}

.risho-block-content ul,
.editor-styles-wrapper ul {
	list-style: disc;
}

.risho-block-content ol,
.editor-styles-wrapper ol {
	list-style: decimal;
}

.risho-block-content li + li,
.editor-styles-wrapper li + li {
	margin-top: 0.35em;
}

.risho-block-content blockquote,
.editor-styles-wrapper blockquote,
.risho-block-content .wp-block-quote,
.editor-styles-wrapper .wp-block-quote {
	margin-left: 0;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--primary, #990100);
	background: #f8f8f8;
}

.risho-block-content .wp-block-image,
.risho-block-content .wp-block-gallery,
.risho-block-content .wp-block-video,
.risho-block-content .wp-block-embed,
.editor-styles-wrapper .wp-block-image,
.editor-styles-wrapper .wp-block-gallery,
.editor-styles-wrapper .wp-block-video,
.editor-styles-wrapper .wp-block-embed {
	margin-top: 2rem;
	margin-bottom: 2rem;
}

.risho-block-content .wp-block-image img,
.editor-styles-wrapper .wp-block-image img {
	height: auto;
}

.risho-block-content figcaption,
.editor-styles-wrapper figcaption {
	margin-top: 0.75rem;
	color: var(--risho-block-muted);
	font-size: 0.875rem;
	line-height: 1.6;
	text-align: left;
}

.risho-block-content .aligncenter,
.editor-styles-wrapper .aligncenter {
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.risho-block-content .alignwide,
.editor-styles-wrapper .alignwide {
	max-width: min(100%, var(--risho-block-wide-width));
}

.risho-block-content .alignfull,
.editor-styles-wrapper .alignfull {
	width: 100%;
	max-width: 100%;
}

.risho-block-content .wp-block-table,
.editor-styles-wrapper .wp-block-table {
	overflow-x: auto;
}

.risho-block-content table,
.editor-styles-wrapper table {
	width: 100%;
	border-collapse: collapse;
}

.risho-block-content th,
.risho-block-content td,
.editor-styles-wrapper th,
.editor-styles-wrapper td {
	padding: 0.85rem 1rem;
	border: 1px solid var(--risho-block-border);
	vertical-align: top;
}

.risho-block-content th,
.editor-styles-wrapper th {
	background: #f8f8f8;
	font-weight: 700;
}

.risho-block-content .wp-block-button__link,
.editor-styles-wrapper .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: 0.65rem 1.5rem;
	border: 1px solid var(--primary, #990100);
	border-radius: 0;
	background: var(--primary, #990100);
	color: #fff;
	font-weight: 700;
	line-height: 1.4;
	text-decoration: none;
}

.risho-block-content .is-style-outline > .wp-block-button__link,
.editor-styles-wrapper .is-style-outline > .wp-block-button__link {
	background: #fff;
	color: var(--primary, #990100);
}

.risho-block-content .wp-block-separator,
.editor-styles-wrapper .wp-block-separator {
	border: 0;
	border-top: 1px solid var(--risho-block-border);
}

.risho-block-content pre,
.risho-block-content code,
.editor-styles-wrapper pre,
.editor-styles-wrapper code {
	font-family: var(--font-family-base, "Noto Sans JP", "Inter", sans-serif);
}

.risho-block-content pre,
.editor-styles-wrapper pre {
	overflow-x: auto;
	padding: 1rem;
	background: #f8f8f8;
}

.risho-block-content .wp-block-columns,
.editor-styles-wrapper .wp-block-columns {
	gap: var(--risho-block-gap);
}

.risho-block-content .wp-block-media-text,
.editor-styles-wrapper .wp-block-media-text {
	gap: var(--risho-block-gap);
}

.editor-styles-wrapper .editor-post-title__input {
	font-family: var(--font-family-base, "Noto Sans JP", "Inter", sans-serif);
	color: var(--text, #2c2222);
	font-weight: 700;
	letter-spacing: 0.03em;
}

@media (max-width: 767px) {
	.risho-block-content,
	.editor-styles-wrapper {
		--risho-block-gap: 1.35rem;
	}

	.risho-block-content th,
	.risho-block-content td,
	.editor-styles-wrapper th,
	.editor-styles-wrapper td {
		padding: 0.65rem 0.75rem;
	}
}
