/*
Theme Name: JOS Base
Theme URI: https://example.com/
Author: Japan Organ Society
Author URI: https://example.com/
Description: 日本オルガン研究会サイト向けのブロックテーマ。ヘッダーナビゲーションとレスポンシブ表示に対応します。
Requires at least: 6.5
Tested up to: 6.5
Requires PHP: 8.1
Version: 0.1.53
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jos-base
*/

html {
	scroll-behavior: auto;
}

body {
	border-top: 0;
}

a {
	text-underline-offset: 0.18em;
}

.jos-site-header {
	border-bottom: 0;
}

.jos-site-header .wp-block-site-title a {
	text-decoration: none;
}

.jos-site-branding {
	flex: 0 1 auto;
	min-width: 0;
	cursor: pointer;
}

.jos-site-header > .wp-block-group > .jos-site-branding {
	max-width: var(--wp--style--global--wide-size, 1120px) !important;
}

.jos-site-logo img {
	display: block;
	width: 64px;
	height: auto;
	border-radius: 4px;
}

.jos-header-nav-bar {
	background: transparent;
}

.jos-header-nav-bar > .wp-block-navigation {
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1120px) !important;
}

.jos-header-top {
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1120px);
	margin: 0 auto;
}
.jos-header-top > .jos-site-branding {
	flex: 0 1 auto;
	min-width: 0;
	max-width: var(--wp--style--global--wide-size, 1120px) !important;
}
.jos-header-top > .jos-header-actions {
	flex: 0 0 auto;
}

.jos-header-nav,
.jos-header-nav .wp-block-navigation__container,
.jos-header-nav .wp-block-navigation__responsive-container,
.jos-header-nav .wp-block-navigation__responsive-container-content {
	border-left: 0;
	border-right: 0;
}
.jos-header-nav .wp-block-navigation__container {
	flex-wrap: wrap;
	gap: 0.35rem;
	width: 100%;
	justify-content: flex-start;
}
.jos-header-search {
	flex: 0 0 auto;
	width: 12rem;
}
.jos-header-search .wp-block-search__inside-wrapper {
	border: 1px solid var(--wp--preset--color--border, #ded9cd);
	border-radius: 4px;
	position: relative;
}
.jos-header-search .wp-block-search__input {
	height: 2rem;
	padding: 0.2rem 0.5rem 0.2rem 1.8rem;
	border: 0;
	background: transparent;
	font-size: 0.85rem;
}
.jos-header-search .wp-block-search__input::placeholder {
	color: var(--wp--preset--color--muted, #646056);
	opacity: 0.7;
}
.jos-header-search .wp-block-search__button {
	display: none;
}
.jos-header-social {
	flex: 0 0 auto;
	margin-left: 0.5rem;
}
.jos-header-social .jos-social-link {
	margin: 0;
	line-height: 1;
}
.jos-header-social .jos-social-link a {
	display: block;
	width: 1.4rem;
	height: 1.4rem;
	overflow: hidden;
	text-indent: -9999px;
	white-space: nowrap;
	position: relative;
	color: var(--wp--preset--color--muted, #646056);
	transition: color 0.15s;
}
.jos-header-social .jos-social-link a:hover {
	color: var(--wp--preset--color--contrast, #25231f);
}
.jos-header-social .jos-social-link a::before {
	content: "";
	position: absolute;
	inset: 0;
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	background: currentColor;
}
.jos-header-social .jos-social-fb a::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/%3E%3C/svg%3E");
}
.jos-header-social .jos-social-ig a::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z'/%3E%3C/svg%3E");
}

.jos-header-search .wp-block-search__inside-wrapper::before {
	content: "";
	position: absolute;
	left: 0.4rem;
	top: 50%;
	transform: translateY(-50%);
	width: 1rem;
	height: 1rem;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	background: var(--wp--preset--color--muted, #646056);
	pointer-events: none;
}

.jos-header-nav .wp-block-navigation-item {
	flex: 0 1 auto;
	box-sizing: border-box;
	white-space: nowrap;
}

.jos-header-nav .wp-block-navigation-item:first-child .wp-block-navigation-item__label {
	display: none;
}

.jos-header-nav .wp-block-navigation-item:first-child .wp-block-navigation-item__content::before {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	background: currentColor;
	flex-shrink: 0;
}

.jos-header-nav .wp-block-navigation-item__content {
	display: flex;
	justify-content: center;
	width: 100%;
	color: var(--wp--preset--color--contrast) !important;
	padding: 0.8em 0.85em;
	text-decoration: none;
}

.jos-header-nav .wp-block-navigation-item:hover .wp-block-navigation-item__content {
	background: color-mix(in srgb, var(--wp--preset--color--accent-4) 50%, transparent);
}

.jos-mobile-social-icons {
	display: none;
}

.jos-mobile-search {
	display: none;
}

.jos-main-grid {
	align-items: start;
}

.jos-content-column {
	min-width: 0;
}

.jos-sidebar {
	border-left: 1px solid var(--wp--preset--color--border);
}

.jos-sidebar .wp-block-heading {
	border-left: 4px solid var(--wp--preset--color--accent-1, #2d5a27) !important;
	border-bottom: 0;
	padding-left: 0.55em !important;
	padding-bottom: 0;
	line-height: 1.3;
}

.jos-post-list > .wp-block-post {
	border-bottom: 1px solid var(--wp--preset--color--border);
	padding-bottom: var(--wp--preset--spacing--40);
}

.jos-post-list > .wp-block-post:last-child {
	border-bottom: 0;
}

.jos-page-title {
	border-bottom: 0;
	padding-bottom: var(--wp--preset--spacing--30);
}

.wp-block-query-title {
	box-sizing: border-box;
}

h2.wp-block-post-title {
	border-left: 0 !important;
	padding-left: 0 !important;
}

.jos-box {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 4px;
}

.jos-concert-intro {
	max-width: 760px !important;
	margin-left: 0 !important;
	margin-right: auto !important;
}

/* コンサートガイド掲載方針：WordPressが生成するネストグループの余白・最大幅を打ち消す */
.wp-block-group.has-accent-3-background-color > .wp-block-group.has-global-padding:not(.has-background) {
	padding-left: 0;
	padding-right: 0;

	/* 内側グループ自身の幅制限を解除する */
	max-width: none;
}

/* 枠内の子ブロックに付与されるis-layout-constrainedの720px幅・autoマージンを解除する */
.wp-block-group.has-accent-3-background-color.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.wp-block-group.has-accent-3-background-color > .wp-block-group.has-global-padding.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: none;
}

/* コンサートガイド掲載方針のリスト：インデントを狭く */
.jos-concert-policy.wp-block-list {
	padding-left: 1.2em;
	list-style-type: circle;
}
.jos-concert-policy.wp-block-list li {
	margin-bottom: 0.25em;
	line-height: 1.7;
	padding-left: 0;
}

.jos-footer {
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--border, #ded9cd) 18%, transparent);
}

.jos-footer-inner {
	margin-left: auto;
	margin-right: auto;
}

.jos-footer-cols {
	margin-bottom: 0;
}

.jos-footer-branding {
	max-width: 100%;
}

.jos-footer-logo img {
	display: block;
	width: 48px;
	height: auto;
	border-radius: 4px;
}

.jos-footer .wp-block-site-title a {
	text-decoration: none;
	color: inherit;
}

.jos-footer-heading {
	margin-bottom: 0.5rem;
	padding-bottom: 0;
	border-bottom: 0;
	text-transform: uppercase;
}

/* フッター内ナビ：縦並びでリンク間隔を確保 */
.jos-footer .wp-block-navigation.jos-footer-nav {
	display: block;
}
.jos-footer .jos-footer-nav .wp-block-navigation__container {
	flex-direction: column;
	align-items: flex-start;
	gap: 0.35rem;
	width: 100%;
}
.jos-footer .jos-footer-nav .wp-block-navigation-item {
	width: 100%;
}
.jos-footer .jos-footer-nav .wp-block-navigation-item__content {
	width: auto;
	padding: 0.15em 0;
}
.jos-footer .jos-footer-nav .wp-block-navigation-item__label {
	white-space: normal;
}

/* フッターSNSアイコン：背景丸でヘッダーと同マスク */
.jos-footer-social {
	gap: 0.5rem;
}
.jos-footer-social .jos-social-link {
	margin: 0;
	line-height: 1;
}
.jos-footer-social .jos-social-link a {
	display: block;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: color-mix(in srgb, currentColor 14%, transparent);
	overflow: hidden;
	text-indent: -9999px;
	white-space: nowrap;
	position: relative;
	color: var(--wp--preset--color--base);
	transition: background 0.15s, color 0.15s;
}
.jos-footer-social .jos-social-link a:hover {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
}
.jos-footer-social .jos-social-link a::before {
	content: "";
	position: absolute;
	inset: 0.55rem;
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	background: currentColor;
}
.jos-footer-social .jos-social-fb a::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/%3E%3C/svg%3E");
}
.jos-footer-social .jos-social-ig a::before {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z'/%3E%3C/svg%3E");
}

.jos-footer-bottom {
	margin-left: auto;
	margin-right: auto;
	max-width: var(--wp--style--global--wide-size, 1120px);
}

.jos-footer-copy {
	margin: 0 auto;
}

.jos-footer a,
.jos-footer a:link,
.jos-footer a:visited {
	color: var(--wp--preset--color--base) !important;
	text-decoration: none;
}
.jos-footer a:hover {
	color: var(--wp--preset--color--accent-2) !important;
	text-decoration: underline;
}

.jos-footer h2,
.jos-footer h3 {
	border-left: 0 !important;
	padding-left: 0 !important;
}

.jos-footer .wp-block-heading {
	border-bottom: 0 !important;
}

@media (max-width: 781px) {
	.jos-footer-cols .wp-block-column {
		flex-basis: 100% !important;
		margin-bottom: var(--wp--preset--spacing--30);
	}
	.jos-footer-bottom {
		max-width: 100%;
		padding-left: var(--wp--preset--spacing--30);
		padding-right: var(--wp--preset--spacing--30);
	}
}



.wp-block-search__input,
.wp-block-search__button,
.wp-block-button__link {
	border-radius: 4px;
}

.wp-block-search__input {
	border: 1px solid #949494 !important;
}

.wp-block-search__button,
.wp-block-button__link {
	border: 1px solid var(--wp--preset--color--accent);
	white-space: nowrap;
}

@media (max-width: 1099px) {
	/* ハンバーガーメニュー → Lucide menu アイコン（3本線） */
	.wp-block-navigation__responsive-container-open svg {
		display: none;
	}
	.wp-block-navigation__responsive-container-open:not(.always-shown)::before {
		content: "";
		display: block;
		width: 24px;
		height: 24px;
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' x2='20' y1='6' y2='6'/%3E%3Cline x1='4' x2='20' y1='12' y2='12'/%3E%3Cline x1='4' x2='20' y1='18' y2='18'/%3E%3C/svg%3E");
		mask-size: contain;
		mask-repeat: no-repeat;
		mask-position: center;
		background: currentColor;
	}

	/* Headerをflex rowにしてbrandingとhamburgerを横並びに */
	.wp-site-blocks > header {
		position: sticky;
		top: 0;
		z-index: 100;
		background: var(--wp--preset--color--base, #fbfaf7);
	}

	.jos-site-header {
		display: flex;
		flex-direction: row;
		align-items: center;
		min-height: 64px;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		border-bottom: 1px solid var(--wp--preset--color--border, #ded9cd);
	}

	.jos-site-header > .wp-block-group:first-child {
		flex: 1;
		min-width: 0;
	}

	.jos-header-nav-bar {
		flex: 0 0 auto;
		display: flex;
		align-items: center;
		background: transparent;
		min-height: 0;
		height: auto;
		margin-block-start: 0 !important;
	}

	.jos-header-nav-bar {
		padding-right: var(--wp--preset--spacing--30) !important;
	}
	.jos-header-nav-bar > .wp-block-navigation {
		width: auto;
		max-width: none;
	}

	.jos-header-actions.is-layout-flex,
	.jos-header-search,
	.jos-header-social.is-layout-flex {
		display: none;
	}

	.jos-mobile-social-icons {
		display: none;
	}

	.jos-mobile-search.jos-header-search {
		display: block;
		width: 100%;
		max-width: 22rem;
		padding: 0.8em 1.2em;
		margin: 0 auto;
		box-sizing: border-box;
	}

	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		flex: 1 1 auto;
		width: 100%;
	}

	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		gap: 0;
	}

	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container .wp-block-navigation-item {
		flex: 1 1 100%;
		width: 100%;
	}

	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		width: 100%;
		justify-content: flex-start;
		padding: 0.8em 1.2em;
	}

	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .jos-mobile-social-icons {
		display: flex;
		width: 100%;
		margin-top: auto;
		margin-left: 0;
		padding: var(--wp--preset--spacing--40) 1.2em 0.8em;
		justify-content: center;
		gap: 1rem;
		box-sizing: border-box;
	}

	.jos-mobile-social-icons .jos-social-link a {
		width: 2.75rem;
		height: 2.75rem;
	}

	.jos-mobile-social-icons .jos-social-link a::before {
		inset: 0.675rem;
	}

	.jos-header-nav {
		justify-content: flex-end;
		background: transparent;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}

	.jos-site-header .jos-site-branding {
		gap: var(--wp--preset--spacing--10);
	}

	.jos-site-logo img {
		width: 32px;
	}

	.jos-site-header .wp-block-site-title {
		font-size: var(--wp--preset--font-size--medium);
	}

	.jos-site-header .wp-block-site-tagline {
		display: block;
		font-size: clamp(0.62rem, 2.2vw, 0.72rem);
		letter-spacing: 0.1em;
		line-height: 1.2;
		margin-top: 0.05rem;
		opacity: 0.85;
	}

	.jos-sidebar {
		border-left: 0;
		padding-left: 0 !important;
	}
}

/* WP core hides hamburger at 600px → override to match our 1100px breakpoint */
@media (min-width: 601px) and (max-width: 1099px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}
	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}

	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		gap: 0;
	}

	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container .wp-block-navigation-item {
		flex: 1 1 100%;
		width: 100%;
	}
	.jos-header-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		width: 100%;
		justify-content: flex-start;
		padding: 0.8em 1.2em;
	}
}

@media (min-width: 1100px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: none !important;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: block;
	}

	.jos-header-nav .wp-block-navigation__container {
		flex-wrap: nowrap;
	}
}
