/*
 * 現在地と「リスト｜地図」（docs/839）。地図の部品（Leaflet）は地図を開いたときだけ読む。
 * 補足・注意は線なし・少し角丸・背景色の四角で出す（左だけ太線の枠は使わない）。
 */

/* ---------- 検索フォーム：「現在地からさがす」（さがすボタンの1つ。選ばれた欄に見えないよう白地に枠） ---------- */
.geoaction { display: grid; gap: 10px; }
/* 「または、条件を選んでさがす」は細い線で挟む区切り */
.geoaction__or { display: flex; align-items: center; gap: 10px; margin: 2px 0 0; font-size: var(--fs-min); color: var(--text-2); }
.geoaction__or::before,
.geoaction__or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.geoaction__btn {
	display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
	min-height: var(--h-base); padding: 0 16px; border-radius: var(--r-pill);
	border: 2px solid var(--line); background: var(--surface); color: var(--ink);
	font: 700 1rem var(--font); cursor: pointer;
}
.geoaction__btn svg { color: var(--rose-ink); }
.geoaction__btn:disabled { opacity: .7; cursor: progress; }
.geoerr {
	margin: 0; padding: 12px 14px; border-radius: var(--r-14);
	background: var(--amber-tint); color: var(--ink); font-size: var(--fs-label); line-height: 1.7;
}
.geoerr b { display: block; margin-bottom: 2px; }
.geoerr[hidden] { display: none; }

/* 現在地で探しているときの場所の欄 */
.placechip {
	display: flex; align-items: center; justify-content: space-between; gap: 8px;
	min-height: var(--h-base); padding: 0 6px 0 16px; border-radius: var(--r-pill);
	background: var(--rose-tint-weak); border: 2px solid var(--rose-tint); color: var(--rose-ink); font-weight: 700;
}
.placechip span { display: inline-flex; align-items: center; gap: 6px; }
.site-main .placechip a:not(.btn):not(.chip) {
	display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px;
	border-radius: 50%; background: var(--surface); color: var(--ink-2); text-decoration: none; font-weight: 700;
}

/* ---------- 結果画面：目的の切り替え（畳まずに出す） ---------- */
.purposeseg {
	display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
	margin: 0 0 10px; padding: 4px; border-radius: var(--r-pill); background: var(--bg);
}
.site-main a.purposeseg__item:not(.btn):not(.chip) {
	display: flex; align-items: center; justify-content: center; min-height: 40px;
	border-radius: var(--r-pill); color: var(--ink-2); text-decoration: none; font-weight: 700; font-size: .93rem;
}
.site-main a.purposeseg__item[aria-current="page"]:not(.btn):not(.chip) { background: var(--surface); color: var(--ink); box-shadow: 0 2px 8px rgba(74, 63, 58, .12); }
.site-main a.purposeseg__item--night[aria-current="page"]:not(.btn):not(.chip) { background: var(--ink); color: #fff; }
.searchfilters--collapsible .purposeseg { margin: 12px 12px 0; }
.searchfilters__summary > svg:first-child { flex: none; color: var(--rose-ink); }

/* ---------- カードの距離（院名の下の札） ---------- */
p.clinic-card__distance {
	width: fit-content; margin: 2px 0 0; padding: 3px 10px;
	border-radius: var(--r-pill); background: var(--rose-tint-weak);
	color: var(--rose-ink); font-size: var(--fs-label); font-weight: 700;
}

/* ---------- リスト｜地図 ---------- */
.viewtoggle {
	display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
	margin: 0 0 12px; padding: 4px; border-radius: var(--r-pill);
	background: var(--surface); box-shadow: var(--shadow-card);
}
.viewtoggle[hidden] { display: none; }
.viewtoggle button {
	display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px;
	border: 0; border-radius: var(--r-pill); background: transparent; color: var(--ink-2);
	font: 700 .95rem var(--font); cursor: pointer;
}
.viewtoggle button[aria-pressed="true"] { background: var(--rose-ink); color: #fff; }

/* 囲みの中も親（.clinic・.front）と同じ間隔で並べる。囲むと親の gap が中に効かず、並び順とカードがくっついた（2026-10-31） */
.clinicresults,
.clinicresults > .listview { display: flex; flex-direction: column; gap: inherit; }
.clinicresults > .viewtoggle { margin: 0; }
.clinicresults .mapview { display: none; }
.clinicresults[data-view="map"] .mapview { display: block; }
/* 地図のときはリストを隠す。ただしマークの説明（.sheet）は地図の下のカードからも開くので残す */
.clinicresults[data-view="map"] .listview > :not(.sheet) { display: none; }
/* 「該当 N 件」と並び順も隠す。件数は地図の範囲の院数（.mapview__head）だけにする（運営者指示 2026-10-31「地図の数字とかみ合わない」）。
   その行しか無い .listctl は、空の枠が間隔を作らないよう枠ごと隠す */
.clinicresults[data-view="map"] .listctl__resultbar,
.clinicresults[data-view="map"] .listctl:not(:has(> :not(.listctl__resultbar))) { display: none; }

.mapview__head { margin: 0 4px 8px; font-size: var(--fs-label); color: var(--text-2); }
.mapview__head strong { color: var(--ink); font-size: 1.05rem; }
.mapwrap { position: relative; overflow: hidden; border-radius: var(--r-22); background: var(--surface); box-shadow: var(--shadow-card); }
.mapwrap__map { height: min(62vh, 520px); min-height: 360px; z-index: 0; }
.mapwrap .leaflet-control-attribution { font-size: 10px; }
.mlocbtn {
	position: absolute; top: 10px; right: 10px; z-index: 600;
	display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px;
	border: 0; border-radius: var(--r-pill); background: var(--surface); color: var(--rose-ink);
	font: 700 .9rem var(--font); box-shadow: 0 3px 10px rgba(74, 63, 58, .22); cursor: pointer;
}
.mlocbtn[hidden] { display: none; }
/* 未確認・受付不可のピンも出す切り替え（地図の左下。下地の出典の行に重ねない） */
.mshowall {
	position: absolute; left: 10px; bottom: 24px; z-index: 600; max-width: calc(100% - 20px); box-sizing: border-box;
	display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 14px;
	border-radius: var(--r-pill); background: var(--surface); color: var(--ink);
	font: 700 .85rem/1.4 var(--font); box-shadow: 0 3px 10px rgba(74, 63, 58, .22); cursor: pointer;
}
.mshowall[hidden] { display: none; }
/* 狭い幅では出典が2行に折り返すので、その上へ逃がす（375px で約4px重なっていた。2026-11-01） */
@media (max-width: 600px) { .mshowall { bottom: 44px; } }
.mshowall input { flex: none; width: 18px; height: 18px; margin: 0; accent-color: var(--rose-dark); cursor: pointer; }
.mshowall:focus-within { outline: 2px solid var(--rose-dark); outline-offset: 2px; }
.mapview .geoerr { margin-top: 10px; }

/* ピン：番号の無い院は状態の色の小さな点（塗り） */
.mpin {
	display: flex; align-items: center; justify-content: center; box-sizing: border-box;
	width: 100%; height: 100%; border-radius: 50%; border: 2px solid #fff;
	background: var(--stone-ink); color: #fff; font: 700 12px/1 var(--font);
	box-shadow: 0 2px 6px rgba(74, 63, 58, .35);
}
.mpin[data-st="Y"] { background: var(--sage-ink); }
.mpin[data-st="C"] { background: var(--amber-ink); }
/* 番号付き（地図とカードで同じ）：ローズの塗り・白い縁・影で目立たせる（運営者指示 2026-10-31「点線じゃなく色塗り」） */
.mpin[data-no] {
	background: var(--rose-ink); border: 3px solid #fff; font-size: 14px;
	box-shadow: 0 3px 10px rgba(74, 63, 58, .35);
}
/* まとめの丸（その辺りの院の数）は、番号と見分けられるよう淡い地に濃い数字 */
.mclu {
	display: flex; align-items: center; justify-content: center; border-radius: 50%;
	background: var(--rose-tint); color: var(--rose-ink); font: 700 13px/1 var(--font);
	border: 3px solid #fff; box-shadow: 0 2px 8px rgba(74, 63, 58, .25);
}
.mhere { display: block; width: 18px; height: 18px; border-radius: 50%; background: var(--rose); border: 3px solid #fff; box-shadow: 0 0 0 8px rgba(233, 148, 138, .28); box-sizing: border-box; }

.maplegend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 10px 4px 0; font-size: var(--fs-min); color: var(--text-2); }
.maplegend span { display: inline-flex; align-items: center; gap: 5px; }
.maplegend__dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--stone-ink); }
.maplegend__dot[data-st="Y"] { background: var(--sage-ink); }
.maplegend__dot[data-st="C"] { background: var(--amber-ink); }

/* 地図の下のカード：一覧と同じ病院カードの左上に、地図のピンと同じ番号を重ねる（押すとそのピンへ） */
.mapcards { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.mapcards[hidden] { display: none; }
.mapcards__item { position: relative; }
.mapcards__pin {
	position: absolute; top: -10px; left: -8px; z-index: 2; width: 34px; height: 34px; padding: 0;
	border: 0; background: transparent; cursor: pointer;
}
.mapcards__pin .mpin { width: 34px; height: 34px; }
.mapcards__loading { margin: 0; padding: 18px 20px 18px 34px; font-weight: 700; color: var(--ink); }
.mapcards__more { width: 100%; margin-top: 12px; }
.mapcards__more[hidden] { display: none; }

/* 地図のピンを押したときのカード（Leaflet のポップアップの中） */
.mapcard { display: grid; gap: 6px; font-family: var(--font); color: var(--ink); }
.mapcard__name { margin: 0; font-size: 1rem; font-weight: 700; }
.mapcard__meta { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: var(--fs-label); color: var(--text-2); }
.mapcard__meta b { color: var(--rose-ink); }
.mapcard__actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 2px; }
.site-main .mapcard__actions a:not(.btn):not(.chip) {
	display: flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 14px;
	border-radius: var(--r-pill); font-weight: 700; text-decoration: none; font-size: .9rem;
}
.site-main .mapcard__actions a.mapcard__go:not(.btn):not(.chip) { background: var(--rose-ink); color: #fff; }
.site-main .mapcard__actions a.mapcard__tel:not(.btn):not(.chip) { border: 2px solid var(--rose-tint); color: var(--rose-ink); }
.mapwrap .leaflet-popup-content-wrapper { border-radius: var(--r-20); }
.leaflet-popup-content .mapcard p { margin: 0; }
.leaflet-popup-content:has(.mapcard) { margin: 14px 16px; }