/* ==========================================================
   EMDB 詳細検索（inc/emdb_advanced_search.php）
   すべて .emdb-as 配下にスコープ。Cocoon の変数があれば使い、無ければフォールバック
   ========================================================== */

.emdb-as, .emdb-as-modal {
	--as-bg: #fff;
	--as-bg-soft: #f6f7f9;
	--as-border: #e3e6ea;
	--as-text: #333;
	--as-muted: #6b7280;
	--as-accent: #2b6cb0;
	--as-accent-soft: #e8f0fb;
	--as-radius: 8px;
}
.emdb-as {
	margin: 0 0 1.4em;
	font-size: 15px;
	color: var(--as-text);
	box-sizing: border-box;
}
.emdb-as *, .emdb-as *::before, .emdb-as *::after { box-sizing: border-box; }

/* 絞り込み中はジャンルナビ（カテゴリタブ）を隠す */
body.emdb-as-active .genre-nav { display: none; }

/* loop_start 保険で #list 内に入ったとき全幅を取る（flex / grid 両対応） */
#list > .emdb-as { flex: 0 0 100%; grid-column: 1 / -1; width: 100%; }

/* ---------- 折りたたみ箱 ---------- */
.emdb-as__box {
	background: var(--as-bg);
	border: 1px solid var(--as-border);
	border-radius: var(--as-radius);
	overflow: visible;
}
.emdb-as__summary {
	list-style: none;
	display: flex;
	align-items: center;
	gap: .6em;
	padding: .75em 1em;
	cursor: pointer;
	user-select: none;
	font-weight: 600;
	line-height: 1.3;
}
.emdb-as__summary::-webkit-details-marker { display: none; }
.emdb-as__summary:hover { background: var(--as-bg-soft); border-radius: var(--as-radius); }
.emdb-as__box[open] > .emdb-as__summary { border-bottom: 1px solid var(--as-border); border-radius: var(--as-radius) var(--as-radius) 0 0; }
.emdb-as__summary-icon { color: var(--as-accent); }
.emdb-as__badge {
	font-size: .78em;
	font-weight: 600;
	color: var(--as-accent);
	background: var(--as-accent-soft);
	border-radius: 999px;
	padding: .15em .7em;
}
.emdb-as__chev {
	margin-left: auto;
	width: .6em; height: .6em;
	border-right: 2px solid var(--as-muted);
	border-bottom: 2px solid var(--as-muted);
	transform: rotate(45deg);
	transition: transform .15s;
}
.emdb-as__box[open] .emdb-as__chev { transform: rotate(-135deg); }

/* ---------- フォーム ---------- */
.emdb-as__form { padding: 1em 1em 1.1em; margin: 0; }
.emdb-as__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .9em 1.2em;
}
@media (min-width: 1100px) { .emdb-as--shortcode .emdb-as__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .emdb-as__grid { grid-template-columns: minmax(0, 1fr); } }
.emdb-as__field { min-width: 0; }
.emdb-as__field--full { grid-column: 1 / -1; }
.emdb-as__label {
	display: block;
	font-size: .82em;
	font-weight: 600;
	color: var(--as-muted);
	margin: 0 0 .3em;
	letter-spacing: .02em;
}
.emdb-as__label--spacer { visibility: hidden; }
@media (max-width: 640px) { .emdb-as__label--spacer { display: none; } }
.emdb-as__help { display: block; margin-top: .3em; font-size: .76em; color: var(--as-muted); line-height: 1.4; }

.emdb-as__input, .emdb-as__select {
	width: 100%;
	font-size: .95em;
	padding: .5em .7em;
	border: 1px solid #cfd4da;
	border-radius: 6px;
	background: var(--as-bg);
	color: var(--as-text);
	line-height: 1.4;
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
}
.emdb-as__select {
	background-image: linear-gradient(45deg, transparent 50%, var(--as-muted) 50%), linear-gradient(135deg, var(--as-muted) 50%, transparent 50%);
	background-position: calc(100% - 16px) 55%, calc(100% - 11px) 55%;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	padding-right: 2em;
}
.emdb-as__input:focus, .emdb-as__select:focus { outline: none; border-color: var(--as-accent); box-shadow: 0 0 0 3px var(--as-accent-soft); }
.emdb-as__input::placeholder { color: #9aa3ad; }

/* チェックボックス群 */
.emdb-as__checks { display: flex; flex-wrap: wrap; gap: .4em .5em; }
.emdb-as__check {
	display: inline-flex;
	align-items: center;
	gap: .35em;
	padding: .3em .7em .3em .55em;
	border: 1px solid var(--as-border);
	border-radius: 999px;
	background: var(--as-bg-soft);
	font-size: .88em;
	cursor: pointer;
	margin: 0;
	line-height: 1.3;
	white-space: nowrap;
}
.emdb-as__check input { margin: 0; accent-color: var(--as-accent); }
.emdb-as__check small { color: var(--as-muted); font-size: .85em; }
.emdb-as__check:hover { border-color: #c5ccd4; }
.emdb-as__check:has(input:checked) { background: var(--as-accent-soft); border-color: var(--as-accent); color: var(--as-accent); }
.emdb-as__check--flag { font-size: .95em; }

/* 日付範囲 */
.emdb-as__range { display: flex; align-items: center; gap: .4em; }
.emdb-as__range .emdb-as__input--date { flex: 1 1 0; min-width: 0; }
.emdb-as__range-sep { color: var(--as-muted); flex: 0 0 auto; }

/* オートコンプリート */
.emdb-as__suggest { position: relative; }
.emdb-as__suggest.is-loading .emdb-as__suggest-input {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 50 50'><circle cx='25' cy='25' r='20' fill='none' stroke='%23999' stroke-width='5' stroke-dasharray='31 31'><animateTransform attributeName='transform' type='rotate' from='0 25 25' to='360 25 25' dur='1s' repeatCount='indefinite'/></circle></svg>");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 18px 18px;
}
.emdb-as__chips { display: flex; flex-wrap: wrap; gap: .35em; }
.emdb-as__chips:not(:empty) { margin-bottom: .4em; }
.emdb-as__chip {
	display: inline-flex;
	align-items: center;
	gap: .3em;
	max-width: 100%;
	padding: .2em .35em .2em .7em;
	background: var(--as-accent-soft);
	color: var(--as-accent);
	border: 1px solid #c7d9f2;
	border-radius: 999px;
	font-size: .86em;
	line-height: 1.3;
}
.emdb-as__chip-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.emdb-as__chip-x {
	appearance: none; -webkit-appearance: none;
	border: 0; background: transparent; color: inherit;
	width: 1.4em; height: 1.4em; border-radius: 50%;
	font-size: 1em; line-height: 1; cursor: pointer; padding: 0; margin: 0;
	display: inline-flex; align-items: center; justify-content: center;
}
.emdb-as__chip-x:hover { background: rgba(43, 108, 176, .15); }
.emdb-as__dropdown {
	position: absolute;
	z-index: 50;
	left: 0; right: 0;
	top: 100%;
	margin: .25em 0 0;
	padding: .25em 0;
	list-style: none;
	background: var(--as-bg);
	border: 1px solid var(--as-border);
	border-radius: 6px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
	max-height: 280px;
	overflow-y: auto;
}
.emdb-as__opt {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: .2em .6em;
	padding: .45em .8em;
	cursor: pointer;
	font-size: .92em;
	line-height: 1.35;
	margin: 0;
}
.emdb-as__opt::before { display: none; }
.emdb-as__opt:hover, .emdb-as__opt.is-active { background: var(--as-accent-soft); }
.emdb-as__opt.is-picked { opacity: .55; }
.emdb-as__opt-label { font-weight: 600; }
.emdb-as__opt-read, .emdb-as__opt-note { color: var(--as-muted); font-size: .85em; }

/* アクション */
.emdb-as__actions {
	display: flex; flex-wrap: wrap; align-items: center; gap: .6em;
	margin-top: 1.1em; padding-top: .9em;
	border-top: 1px dashed var(--as-border);
}
.emdb-as__btn {
	appearance: none; -webkit-appearance: none;
	display: inline-flex; align-items: center; gap: .4em;
	font-size: .93em; font-weight: 600;
	padding: .55em 1.3em;
	border-radius: 6px;
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	line-height: 1.3;
	margin: 0;
}
.emdb-as__btn--primary { background: var(--as-accent); color: #fff; }
.emdb-as__btn--primary:hover { filter: brightness(1.08); color: #fff; }
.emdb-as__btn--ghost { background: transparent; color: var(--as-muted); border-color: var(--as-border); }
.emdb-as__btn--ghost:hover { background: var(--as-bg-soft); color: var(--as-text); }
.emdb-as__hint { margin-left: auto; font-size: .76em; color: var(--as-muted); }
@media (max-width: 640px) { .emdb-as__hint { margin-left: 0; flex-basis: 100%; } }

/* ---------- ステータス・結果 ---------- */
.emdb-as__status {
	display: flex; align-items: center; gap: .5em; flex-wrap: wrap;
	margin: .7em 0 0;
	padding: .55em .9em;
	background: var(--as-accent-soft);
	border: 1px solid #c7d9f2;
	border-radius: 6px;
	font-size: .9em;
	color: var(--as-text);
}
.emdb-as__status[hidden], .emdb-as__dropdown[hidden], .emdb-as__badge[hidden] { display: none; }
.emdb-as__status strong { font-size: 1.15em; color: var(--as-accent); }
.emdb-as__status-clear { margin-left: auto; font-size: .9em; color: var(--as-accent); text-decoration: underline; }
.emdb-as__status-page { color: var(--as-muted); }
.emdb-as.is-loading .emdb-as__results { opacity: .5; pointer-events: none; }
.emdb-as__results { margin-top: 1em; }
.emdb-as__list { margin: 0; }
.emdb-as__list--simple { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6em; }
@media (max-width: 640px) { .emdb-as__list--simple { grid-template-columns: minmax(0, 1fr); } }
.emdb-as__empty {
	padding: 1.4em 1em; text-align: center; color: var(--as-muted);
	background: var(--as-bg-soft); border: 1px dashed var(--as-border); border-radius: var(--as-radius);
}
.emdb-as__empty--error { color: #b91c1c; background: #fef2f2; border-color: #fecaca; }

/* creator / brand の簡易カード */
.emdb-as__card {
	display: flex; flex-direction: column; gap: .35em;
	padding: .8em .95em;
	background: var(--as-bg);
	border: 1px solid var(--as-border);
	border-radius: var(--as-radius);
	color: var(--as-text);
	text-decoration: none;
	transition: box-shadow .12s, border-color .12s;
}
.emdb-as__card:hover { border-color: var(--as-accent); box-shadow: 0 2px 10px rgba(0, 0, 0, .08); color: var(--as-text); }
.emdb-as__card-main { display: flex; flex-direction: column; gap: .15em; min-width: 0; }
.emdb-as__card-title { font-weight: 700; font-size: 1.02em; line-height: 1.35; overflow-wrap: anywhere; }
.emdb-as__card-read { font-size: .8em; color: var(--as-muted); }
.emdb-as__card-sub { font-size: .8em; color: var(--as-muted); overflow-wrap: anywhere; }
.emdb-as__card-tags { display: flex; flex-wrap: wrap; gap: .3em; }
.emdb-as__tag {
	font-size: .74em; padding: .15em .6em; border-radius: 999px;
	background: var(--as-bg-soft); border: 1px solid var(--as-border); color: var(--as-muted);
}
.emdb-as__tag--group { background: #fff7ed; border-color: #fdba74; color: #9a3412; }

/* ページャ */
.emdb-as__pager { display: flex; flex-wrap: wrap; justify-content: center; gap: .3em; margin: 1.2em 0 .4em; }
.emdb-as__pager:empty { display: none; }
.emdb-as__page {
	appearance: none; -webkit-appearance: none;
	min-width: 2.3em; padding: .45em .7em;
	border: 1px solid var(--as-border); border-radius: 6px;
	background: var(--as-bg); color: var(--as-text);
	font-size: .9em; cursor: pointer; line-height: 1.2; margin: 0;
}
.emdb-as__page:hover:not(:disabled) { border-color: var(--as-accent); color: var(--as-accent); }
.emdb-as__page.is-current { background: var(--as-accent); border-color: var(--as-accent); color: #fff; }
.emdb-as__page:disabled { opacity: .45; cursor: default; }
.emdb-as__page-dots { align-self: center; color: var(--as-muted); padding: 0 .2em; }

.emdb-as__error { color: #b91c1c; }

/* ---------- ダークスキン（Cocoon .skin-dark 等） ---------- */
.skin-dark .emdb-as, body.dark .emdb-as, .skin-dark .emdb-as-modal, body.dark .emdb-as-modal {
	--as-bg: #1f2227;
	--as-bg-soft: #2a2e35;
	--as-border: #3a3f47;
	--as-text: #e5e7eb;
	--as-muted: #9aa3ad;
	--as-accent: #7eb3ff;
	--as-accent-soft: rgba(126, 179, 255, .15);
}
.skin-dark .emdb-as__input, .skin-dark .emdb-as__select { border-color: #3a3f47; }
.skin-dark .emdb-as__chip, .skin-dark .emdb-as__status { border-color: rgba(126, 179, 255, .35); }

/* ==========================================================
   サイト全体の検索モーダル + 右下ボタン
   ========================================================== */
.emdb-as-fab {
	position: fixed;
	right: 16px;
	bottom: 84px; /* Cocoon のトップへ戻るボタンの上 */
	z-index: 9000;
	display: inline-flex;
	align-items: center;
	gap: .45em;
	height: 46px;
	padding: 0 18px 0 16px;
	border: 0;
	border-radius: 999px;
	background: #2b6cb0;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
}
.emdb-as-fab:hover { filter: brightness(1.08); color: #fff; }
.emdb-as-fab[hidden] { display: none; }
@media (max-width: 640px) {
	.emdb-as-fab { right: 12px; bottom: calc(72px + env(safe-area-inset-bottom)); height: 44px; padding: 0 14px; }
	.emdb-as-fab__text { display: none; }
	.emdb-as-fab { width: 44px; justify-content: center; padding: 0; }
}
@media print { .emdb-as-fab, .emdb-as-modal { display: none !important; } }

html.emdb-as-modal-open, html.emdb-as-modal-open body { overflow: hidden; }

.emdb-as-modal { position: fixed; inset: 0; z-index: 10000; }
.emdb-as-modal[hidden] { display: none; }
.emdb-as-modal__backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, .55); backdrop-filter: blur(2px); animation: emdb-as-fade .16s ease-out; }
@keyframes emdb-as-fade { from { opacity: 0; } to { opacity: 1; } }
/* 閉じるときは逆再生（JS が is-closing を付け、animationend で hidden にする） */
.emdb-as-modal.is-closing .emdb-as-modal__backdrop { animation: emdb-as-fade .14s ease-in reverse forwards; }
.emdb-as-modal.is-closing .emdb-as-modal__panel { animation: emdb-as-pop .14s ease-in reverse forwards; }
@media (prefers-reduced-motion: reduce) { .emdb-as-modal__backdrop, .emdb-as-modal__panel, .emdb-as-modal.is-closing .emdb-as-modal__backdrop, .emdb-as-modal.is-closing .emdb-as-modal__panel { animation: none; } }
.emdb-as-modal__panel {
	position: relative;
	margin: 4vh auto 0;
	width: min(960px, calc(100% - 32px));
	max-height: 92vh;
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 24px 64px rgba(0, 0, 0, .35);
	overflow: hidden;
	animation: emdb-as-pop .16s ease-out;
	color: #333;
}
@keyframes emdb-as-pop { from { transform: translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } }
.emdb-as-modal__head {
	flex: 0 0 auto;
	display: flex; align-items: center; justify-content: space-between;
	padding: .8em 1em .6em 1.1em;
}
.emdb-as-modal__title { margin: 0; font-size: 1.1em; font-weight: 700; display: flex; align-items: center; gap: .5em; }
.emdb-as-modal__title .fas { color: #2b6cb0; }
.emdb-as-modal__close {
	-webkit-appearance: none; appearance: none;
	width: 2.2em; height: 2.2em; border: 0; border-radius: 50%;
	background: #f1f3f5; color: #555; font-size: 1.3em; line-height: 1; cursor: pointer; margin: 0; padding: 0;
}
.emdb-as-modal__close:hover { background: #e3e6ea; }
.emdb-as-modal__tabs {
	flex: 0 0 auto;
	display: flex; gap: .25em; padding: 0 1em; border-bottom: 1px solid #e3e6ea;
	overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.emdb-as-modal__tabs::-webkit-scrollbar { display: none; }
.emdb-as-modal__tab {
	-webkit-appearance: none; appearance: none;
	flex: 0 0 auto;
	padding: .6em 1em; margin: 0 0 -1px;
	border: 0; border-bottom: 3px solid transparent;
	background: transparent; color: #6b7280; font-size: .95em; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.emdb-as-modal__tab:hover { color: #333; }
.emdb-as-modal__tab.is-active { color: #2b6cb0; border-bottom-color: #2b6cb0; }
.emdb-as-modal__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 1em 1em 1.2em; background: #f6f7f9; }
.emdb-as-modal__pane[hidden] { display: none; }
.emdb-as--in-modal { margin: 0; }
.emdb-as--in-modal .emdb-as__box--bare { border-radius: var(--as-radius); }
@media (min-width: 900px) { .emdb-as--in-modal .emdb-as__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) {
	.emdb-as-modal__panel { margin: 0; width: 100%; max-height: 100%; height: 100%; border-radius: 0; }
	.emdb-as-modal__body { padding: .8em .8em 5em; }
}

/* モーダルのダークスキン */
.skin-dark .emdb-as-modal__panel { background: #1f2227; color: #e5e7eb; }
.skin-dark .emdb-as-modal__body { background: #171a1f; }
.skin-dark .emdb-as-modal__tabs { border-bottom-color: #3a3f47; }
.skin-dark .emdb-as-modal__close { background: #2a2e35; color: #ccc; }

/* 既存の検索ボックス直後の「詳細検索」リンク */
.emdb-as-searchlink {
	display: inline-flex; align-items: center; gap: .35em;
	margin: .4em 0 0; padding: .25em .6em;
	font-size: .85em; line-height: 1.3;
	color: #2b6cb0; background: #e8f0fb; border-radius: 999px;
	text-decoration: none; white-space: nowrap;
}
.emdb-as-searchlink:hover { background: #d9e6f8; color: #2b6cb0; }
.emdb-as-searchlink__sub { display: none; font-weight: 400; color: #6b7280; }
/* スマホの検索ポップアップ内では説明付き・ブロック表示 */
.search-menu-content .emdb-as-searchlink { display: flex; flex-wrap: wrap; justify-content: center; margin-top: .7em; padding: .6em .8em; font-size: .95em; text-align: center; border-radius: 10px; }
.search-menu-content .emdb-as-searchlink__sub { display: block; flex-basis: 100%; font-size: .78em; white-space: normal; margin-top: .15em; }
/* 検索結果ページ（本文側の検索フォーム直後）ではボタンサイズで、幅いっぱいに */
.main > .emdb-as-searchlink, .entry-content > .emdb-as-searchlink {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: .3em .6em;
	margin: .8em 0 1.4em; padding: .75em 1em;
	font-size: 1em; font-weight: 700; border-radius: 10px; white-space: normal; text-align: center;
}
.main > .emdb-as-searchlink .emdb-as-searchlink__sub, .entry-content > .emdb-as-searchlink .emdb-as-searchlink__sub { display: inline; font-size: .82em; }
.skin-dark .emdb-as-searchlink { background: rgba(126,179,255,.15); color: #7eb3ff; }

/* ヘッダー（PC）・ハンバーガーメニューでの配置は style.css 側（「検索ウィジェットをナビメニューの右に配置」と 1024px 以下のブロック）で定義 */

/* モーダル最上段: サイト全体のキーワード検索 */
.emdb-as-modal__site { flex: 0 0 auto; margin: 0; padding: .2em 1.1em .6em; }
.emdb-as-modal__site-label { display: block; font-size: .82em; font-weight: 600; color: #6b7280; margin: 0 0 .3em; }
.emdb-as-modal__site-row { display: flex; gap: .5em; }
.emdb-as-modal__site-row .emdb-as__input { flex: 1 1 auto; min-width: 0; }
.emdb-as-modal__site-row .emdb-as__btn { flex: 0 0 auto; }
.emdb-as-modal__or {
	flex: 0 0 auto;
	display: flex; align-items: center; gap: .8em;
	padding: 0 1.1em .2em; font-size: .78em; color: #6b7280;
}
.emdb-as-modal__or::before, .emdb-as-modal__or::after { content: ""; flex: 1 1 auto; height: 1px; background: #e3e6ea; }
.skin-dark .emdb-as-modal__or::before, .skin-dark .emdb-as-modal__or::after { background: #3a3f47; }
