/* ---------- 地图搜索页 ---------- */

.mapsearch { --ms-bar: 64px; margin-top: var(--nav-height); display: flex; flex-direction: column; height: calc(100vh - var(--nav-height)); height: calc(100dvh - var(--nav-height)); }
.ms-bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.75rem 1.5rem; border-bottom: 1px solid var(--color-border); background: var(--color-white); min-height: var(--ms-bar); }
.ms-filters, .ms-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
.ms-filter { position: relative; }
.ms-chip { border: 1px solid var(--color-border-strong); background: var(--color-white); color: var(--color-text); border-radius: 10px; padding: 0.45rem 0.9rem; font: inherit; font-size: 0.9rem; cursor: pointer; }
.ms-chip[aria-expanded="true"], .ms-chip.is-active { border-color: var(--color-accent); color: var(--color-accent); background: var(--color-accent-soft); }
.ms-chip:focus:not(:focus-visible) { outline: none; }
.ms-link { background: none; border: 0; color: var(--color-text-secondary); font: inherit; cursor: pointer; white-space: nowrap; }
.ms-panel { position: absolute; top: calc(100% + 6px); left: 0; z-index: 20; min-width: 220px; display: grid; gap: 0.45rem; padding: 0.9rem 1rem; background: var(--color-white); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: 0 12px 28px rgba(15, 62, 84, 0.14); }
.ms-panel[hidden] { display: none; }
.ms-panel label { display: flex; gap: 0.5rem; align-items: center; font-size: 0.92rem; }
.ms-panel--price label { justify-content: space-between; }
.ms-panel--price label span { white-space: nowrap; }
.ms-panel--price input { width: 7rem; }
/* 选项后的数量用次要文字色（白底 7.3:1）；为 0 的整行变灰，禁用的控件不要求对比度。 */
.ms-panel .af-n { color: var(--color-text-secondary); font-size: 0.85em; }
.ms-panel .af-option { white-space: nowrap; cursor: pointer; }
.ms-panel .af-option.is-empty { color: var(--color-text-muted); cursor: default; }
.ms-panel .af-option.is-empty .af-n { color: inherit; }
.ms-panel[data-ms-meet] { max-height: 60vh; overflow-y: auto; }

/* 列表宽到能放两列小卡片（「现在展示的东西太少了」），地图占其余；两头夹住，窄屏不至于挤没地图、宽屏不至于卡片过大。 */
.ms-body { flex: 1; min-height: 0; display: grid; grid-template-columns: clamp(440px, 42%, 680px) minmax(0, 1fr); }
.ms-list { overflow-y: auto; padding: 1rem 1.25rem; background: var(--color-paper); }
.ms-list-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
.ms-count { font-size: 1.3rem; font-weight: 800; color: var(--color-text); }
.ms-cards { display: grid; gap: 0.85rem; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.ms-status:empty { display: none; }
.ms-status { padding: 1rem; border-radius: 12px; background: var(--color-white); border: 1px solid var(--color-border); display: grid; gap: 0.6rem; justify-items: start; }
.ms-map { position: relative; min-height: 0; }
.ms-sheet-handle { display: none; }
.mapsearch.is-map-hidden .ms-body { grid-template-columns: 1fr; }
.mapsearch.is-map-hidden .ms-map { display: none; }
.mapsearch.is-map-hidden .ms-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 1280px) { .mapsearch.is-map-hidden .ms-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* 卡片翻图 */
.ms-card .pcard-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.ms-card .pcard-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ms-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, 0.92); cursor: pointer; opacity: 0; transition: opacity 0.15s; }
.ms-nav--prev { left: 8px; } .ms-nav--next { right: 8px; }
.ms-card:hover .ms-nav, .ms-nav:focus-visible { opacity: 1; }
.ms-counter { position: absolute; right: 8px; bottom: 8px; font-size: 0.75rem; padding: 2px 8px; border-radius: 999px; background: rgba(15, 62, 84, 0.75); color: #fff; }
/* 紧凑卡片：两列时一张卡约 190–300px 宽，内边距、标题、价格、按钮都收小。 */
.ms-card .pcard-body { padding: 0.6rem 0.75rem 0.7rem; }
.ms-card .pcard-title { font-size: 0.95rem; line-height: 1.3; margin-bottom: 0.25rem; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* 卡片的地点是一段纯文字，不是 .pcard-meta 预设的三栏图标组；不改的话只占第一栏，中文地名五个字就折行。 */
.ms-card .pcard-meta { display: block; font-size: 0.8rem; font-weight: 500; color: var(--color-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 克朗这类长价格在 1024px 时放不下「VIEW」：折到下一行，不撑出横向滚动。 */
.ms-card .pcard-foot { padding-top: 0.55rem; flex-wrap: wrap; gap: 0.35rem 0.5rem; }
.ms-card .pcard-from { font-size: 0.7rem; }
.ms-card .pcard-now { font-size: 1.05rem; }
.ms-card .pcard-cta { padding: 0.4rem 0.65rem; font-size: 0.7rem; box-shadow: none; }
.ms-card .ms-nav { width: 28px; height: 28px; }
.ms-card.is-hover { outline: 2px solid var(--color-accent); outline-offset: 2px; border-radius: 14px; }

/* 地图标签 */
.ms-label { padding: 3px 9px; border-radius: 999px; font: 600 0.8rem/1.4 var(--font); white-space: nowrap; cursor: pointer; box-shadow: 0 2px 6px rgba(15, 62, 84, 0.25); border: 1px solid transparent; }
.ms-label.is-cluster { background: var(--color-accent-soft); color: var(--color-text); border-color: var(--color-sky); }
.ms-label.is-tour { background: var(--color-text); color: #fff; }
.ms-label.is-activity { background: var(--color-happy); color: #fff; }
/* MapLibre 用行内 transform 定位标签，这里不能再用 transform 放大：改用换色、描边和置顶来突出。 */
.ms-label:hover, .ms-label.is-hover, .ms-label:focus-visible { z-index: 5; background: var(--color-accent); border-color: var(--color-white); color: #fff; outline: 2px solid var(--color-accent); outline-offset: 1px; box-shadow: 0 4px 12px rgba(15, 62, 84, 0.4); }
.ms-popup .maplibregl-popup-content { padding: 0; border-radius: 14px; overflow: hidden; width: 260px; }

@media (max-width: 1023px) {
	.mapsearch { height: calc(100dvh - var(--nav-height)); position: relative; overflow: hidden; }
	.ms-bar { position: absolute; top: 0; left: 0; right: 0; z-index: 10; background: transparent; border: 0; padding: 0.75rem; }
	.ms-filters { flex: 1; min-width: 0; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding: 3px; }
	.ms-filters::-webkit-scrollbar { display: none; }
	.ms-filter, .ms-actions { flex: none; }
	.ms-panel { position: fixed; left: 12px; right: 12px; top: calc(var(--nav-height) + 64px); max-height: 60vh; overflow-y: auto; min-width: 0; }
	.ms-body { grid-template-columns: 1fr; }
	.ms-cards { grid-template-columns: 1fr; }
	.ms-map { position: absolute; inset: 0; }
	.ms-list { position: absolute; left: 0; right: 0; bottom: 0; z-index: 15; max-height: 85%; transform: translateY(calc(100% - 64px)); transition: transform 0.25s; border-radius: 16px 16px 0 0; box-shadow: 0 -8px 24px rgba(15, 62, 84, 0.18); padding-top: 0; }
	.ms-list.is-open { transform: translateY(0); }
	/* 把手和「N tours」标题吸在抽屉顶上：列表往下翻很远后，仍能点把手收起。
	   列表去掉上内边距（粘性定位从内边距内侧算起，留着会露出滚过去的卡片），
	   由把手补上这 16px，并左右出血盖住底下的卡片。 */
	.ms-sheet-handle { display: block; position: sticky; top: 0; z-index: 3; width: calc(100% + 2.5rem); height: 36px; margin: 0 -1.25rem; padding: 16px 0 0; border: 0; border-radius: 16px 16px 0 0; background: var(--color-paper); cursor: pointer; }
	.ms-list-head { position: sticky; top: 36px; z-index: 3; margin: 0 -1.25rem 0.75rem; padding: 0 1.25rem 0.5rem; background: var(--color-paper); }
	.ms-sheet-handle span { display: block; width: 44px; height: 4px; margin: 0 auto; border-radius: 2px; background: var(--color-border-strong); }
	.ms-actions [data-ms-toggle-map] { display: none; }
	/* 缩放按钮挪到筛选栏下面，不压住右上角的「New search」。 */
	.ms-map .maplibregl-ctrl-top-right { top: var(--ms-bar); }
	/* 没有 WebGL 时只剩列表：铺满页面，不做底部抽屉。 */
	.mapsearch.is-map-hidden .ms-list { position: static; z-index: auto; transform: none; max-height: none; border-radius: 0; box-shadow: none; padding-top: 1rem; }
	.mapsearch.is-map-hidden .ms-cards { grid-template-columns: 1fr; }
	.mapsearch.is-map-hidden .ms-sheet-handle { display: none; }
	.mapsearch.is-map-hidden .ms-list-head { position: static; }
	.mapsearch.is-map-hidden .ms-bar { position: static; z-index: auto; background: var(--color-white); border-bottom: 1px solid var(--color-border); }
	/* 浮动 WhatsApp 按钮让到收起的列表头（64px）上方，不压住排序下拉。 */
	body.page-template-page-map .wa-float { bottom: calc(64px + var(--space-2)); }
}

/* 平板宽度的抽屉与纯列表放得下两列。 */
@media (min-width: 600px) and (max-width: 1023px) {
	.ms-cards, .mapsearch.is-map-hidden .ms-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) { .ms-list, .ms-nav { transition: none; } }
