/* Shared presentation based on the Fukuoka prefecture facility-map layout.
   Styling and flow only: map data, coordinates, and zoom are intentionally untouched. */
.wrap{max-width:1100px!important;padding:34px 18px!important}
.wrap h1{font-size:clamp(30px,6vw,52px);line-height:1.2;margin:26px 0}
.wrap>p.lead{margin:0 0 18px;color:#718078}
.wrap>.hero{margin:0 0 18px;background:transparent;color:#718078;padding:0;border-radius:0}
.wrap>.hero h2{font-size:inherit;margin:0;font-weight:500}
.filters,.controls[aria-label="カテゴリ"]{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 14px;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.filters button,.controls[aria-label="カテゴリ"] button{font-size:14px;padding:9px 14px;border:1px solid #234d43;background:#fffdf9;border-radius:99px;color:#234d43;font-weight:900}
.filters button.active,.controls[aria-label="カテゴリ"] button.active{background:#234d43;color:#fff}
.trip-box,.panel#trip{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:14px 0;background:transparent;border:0;border-radius:0;padding:0}
.trip-box h2,.trip-box>p,.panel#trip h2,.panel#trip>p:not(#trip-status){display:none}
.trip-box #trip-list,.panel#trip #trip-list{order:2;flex-basis:100%;margin:2px 0 6px;padding:12px 16px;background:#fffdf9;border:0;border-radius:10px;list-style:none}
.trip-box button,.panel#trip button{margin:0;border:1px solid #234d43;border-radius:99px;padding:9px 14px;background:#fffdf9;color:#234d43;font-weight:900}
.trip-box button:disabled,.panel#trip button:disabled{opacity:.55}
.filters button[data-type="カフェ"]::before,.filters button[data-type="ドッグラン"]::before,.filters button[data-type="宿泊"]::before,.filters button[data-type="預ける"]::before,.filters button[data-type="病院"]::before,.controls[aria-label="カテゴリ"] button[data-category="food"]::before,.controls[aria-label="カテゴリ"] button[data-category="run"]::before,.controls[aria-label="カテゴリ"] button[data-category="stay"]::before,.controls[aria-label="カテゴリ"] button[data-category="boarding"]::before,.controls[aria-label="カテゴリ"] button[data-category="hospital"]::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px}
.filters button[data-type="カフェ"]::before,.controls[aria-label="カテゴリ"] button[data-category="food"]::before{background:#e85d75}
.filters button[data-type="ドッグラン"]::before,.controls[aria-label="カテゴリ"] button[data-category="run"]::before{background:#159a9c}
.filters button[data-type="宿泊"]::before,.controls[aria-label="カテゴリ"] button[data-category="stay"]::before{background:#7357d9}
.filters button[data-type="預ける"]::before,.controls[aria-label="カテゴリ"] button[data-category="boarding"]::before{background:#c052b8}
.filters button[data-type="病院"]::before,.controls[aria-label="カテゴリ"] button[data-category="hospital"]::before{background:#e5484d}
.legend{display:none}
#map{width:100%;height:62vh;min-height:430px;border-radius:16px;border:1px solid #dddcd5;box-shadow:0 8px 22px #c8c1b533}
.controls:not([aria-label="カテゴリ"]){gap:8px}
.controls:not([aria-label="カテゴリ"]) input,.controls:not([aria-label="カテゴリ"]) select,.controls:not([aria-label="カテゴリ"]) button{border-radius:10px;background:#fffdf9;color:#234d43}
@media(max-width:760px){
 .wrap{width:100%;padding:22px 14px!important}
 .wrap h1{font-size:34px;margin:18px 0}
 #map{height:58vh;min-height:340px;width:100%}
 .filters,.controls[aria-label="カテゴリ"]{gap:8px;margin:14px 0}
 .filters button,.controls[aria-label="カテゴリ"] button{font-size:13px;padding:9px 12px}
 .trip-box,.panel#trip{gap:8px}
 .trip-box #trip-list,.panel#trip #trip-list{flex-basis:100%}
 .controls:not([aria-label="カテゴリ"]){gap:8px}
}
