html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    overflow: hidden;
}


/* ========================================
   站台標題列
   ======================================== */

#site-header {
    width: 100%;
    height: 56px;

    box-sizing: border-box;

    display: flex;
    align-items: center;

    padding: 0 28px;

    background: #44ACFF;
    border-bottom: 1px solid #89D4FF;
}

#site-header h1 {
    margin: 0;

    display: flex;
    align-items: center;
    gap: 16px;

    font-size: 22px;
    font-weight: 700;
    line-height: 1;

    color: #FFFFFF;
}

#site-header h1,
#site-header .page-title,
#site-header .title-divider {
    color: #FFFFFF;
}

/* 修正那塊淺藍色色塊 */
.title-divider {
    display: inline;
    background: none !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 4px;
    color: rgba(255, 255, 255, 0.85) !important;
    font-weight: 400;
}

.page-title {
    font-size: 20px;
    font-weight: 600;
    color: #FFFFFF;
}


/* ========================================
   地圖主區域
   ======================================== */

#map-area {
    position: relative;
    width: 100%;
    height: calc(100vh - 56px);
}


/* ========================================
   搜尋框
   ======================================== */

#search-panel {
    position: absolute;
    top: 20px;
    left: 18px;
    z-index: 1000;

    width: 348px;
    height: 42px;

    display: flex;
    align-items: center;

    background: #FFFFFF;
    border: 1px solid #BFE6FF;
    border-radius: 12px;

    box-shadow: 0 2px 8px rgba(68, 172, 255, 0.12);
}

#search-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);

    width: 18px;
    height: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 16px;
    line-height: 1;
    color: #44ACFF;

    pointer-events: none;
}

#search-input {
    width: 100%;
    height: 100%;

    box-sizing: border-box;
    border: none;
    outline: none;
    background: transparent;

    padding: 0 14px 0 44px;

    font-size: 15px;
    color: #444;
}

#search-input::placeholder {
    color: #A8B5C2;
}


/* ========================================
   圖例
   ======================================== */

#map-legend {
    position: absolute;
    left: 18px;
    bottom: 18px;
    z-index: 1000;

    width: 116px;

    padding: 14px 14px 12px 14px;

    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #D8ECFA;
    border-radius: 14px;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.legend-title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 700;
    color: #3E5F77;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 8px;

    font-size: 13px;
    color: #4F687C;
}

.legend-item:last-child {
    margin-bottom: 0;
}

.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.toilet-dot {
    background: #89D4FF;
    border: 2px solid #FFFFFF;
    box-shadow: 0 0 0 1px rgba(68, 172, 255, 0.28);
}

.location-dot {
    background: #44ACFF;
    border: 2px solid #FFFFFF;
    box-shadow: 0 0 0 1px rgba(68, 172, 255, 0.28);
}


/* ========================================
   公廁 Marker
   ======================================== */

.toilet-place-marker {
    width: 38px;
    height: 38px;

    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);

    background: #89D4FF;
    border: 3px solid #FFFFFF;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    box-shadow: 0 2px 8px rgba(68, 172, 255, 0.22);
}

.toilet-place-marker span {
    transform: rotate(45deg);
    font-size: 16px;
    line-height: 1;
}

/* ========================================
   車站 Marker
   ======================================== */

.station-place-marker {
    width: 38px;
    height: 38px;

    border-radius:
        50% 50% 50% 0;

    transform:
        rotate(-45deg);

    background:
        #FF9D4D;

    border:
        3px solid #FFFFFF;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing:
        border-box;

    box-shadow:
        0 2px 8px
        rgba(255, 157, 77, 0.30);
}


.station-place-marker span {
    width: 22px;
    height: 22px;

    display: flex;
    align-items: center;
    justify-content: center;

    transform:
        rotate(45deg);
}


.station-marker-icon {
    width: 20px;
    height: 20px;

    display:
        block;
}


/* ========================================
   哺集乳室 Marker
   ======================================== */

.lactation-room-marker {
    width: 38px;
    height: 38px;

    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);

    background: #FE9EC7;
    border: 3px solid #FFFFFF;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    box-shadow: 0 2px 8px rgba(254, 158, 199, 0.28);
}

.lactation-room-marker span {
    transform: rotate(45deg);
    font-size: 16px;
    line-height: 1;
}


/* ========================================
   公廁 Cluster
   ======================================== */

.toilet-cluster {
    width: 48px;
    height: 48px;

    border-radius: 50%;
    background: rgba(137, 212, 255, 0.28);

    display: flex;
    align-items: center;
    justify-content: center;
}

.toilet-cluster-inner {
    width: 38px;
    height: 38px;

    border-radius: 50%;
    background: #89D4FF;
    border: 3px solid #FFFFFF;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 17px;
    font-weight: 700;
    color: #FFFFFF;

    box-shadow: 0 2px 8px rgba(68, 172, 255, 0.22);
}


/* ========================================
   哺集乳室 Cluster
   ======================================== */

.lactation-cluster {
    width: 48px;
    height: 48px;

    border-radius: 50%;
    background: rgba(254, 158, 199, 0.28);

    display: flex;
    align-items: center;
    justify-content: center;
}

.lactation-cluster-inner {
    width: 38px;
    height: 38px;

    border-radius: 50%;
    background: #FE9EC7;
    border: 3px solid #FFFFFF;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 17px;
    font-weight: 700;
    color: #FFFFFF;

    box-shadow: 0 2px 8px rgba(254, 158, 199, 0.28);
}

/* ========================================
   飲水機 Marker
   ======================================== */

.drinking-water-marker {
    width: 38px !important;
    height: 38px !important;

    border-radius: 50% 50% 50% 0 !important;

    transform: rotate(-45deg) !important;

    background: #7EDDB8 !important;

    border: 3px solid #FFFFFF !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    box-shadow:
        0 2px 8px
        rgba(80, 190, 140, 0.28) !important;
}


.drinking-water-marker span {
    width: 22px;
    height: 22px;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: rotate(45deg) !important;
}


.drinking-water-marker-icon {
    width: 20px;
    height: 20px;

    display: block;
}


/* ========================================
   飲水機 Cluster
   ======================================== */

.drinking-water-cluster {
    width: 48px;
    height: 48px;

    border-radius: 50%;

    background:
        rgba(126, 221, 184, 0.30);

    display: flex;
    align-items: center;
    justify-content: center;
}


.drinking-water-cluster-inner {
    width: 38px;
    height: 38px;

    border-radius: 50%;

    background: #7EDDB8;

    border: 3px solid #FFFFFF;

    display: flex;
    align-items: center;
    justify-content: center;

    box-sizing: border-box;

    font-size: 17px;
    font-weight: 700;

    color: #FFFFFF;

    box-shadow:
        0 2px 8px
        rgba(80, 190, 140, 0.28);
}


/* ========================================
   Leaflet 控制按鈕
   ======================================== */

.leaflet-top.leaflet-right {
    top: 10px;
    right: 10px;
}

.leaflet-control-layers,
.location-control,
.leaflet-control-zoom {
    border: none !important;
    box-shadow: none !important;
}

.leaflet-control-layers-toggle,
.location-control a,
.leaflet-control-zoom a {
    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center;
    justify-content: center;

    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid #D8ECFA !important;
    border-radius: 12px !important;

    color: #44ACFF !important;
    font-size: 22px !important;
    text-decoration: none !important;

    box-shadow: 0 2px 8px rgba(68, 172, 255, 0.15);
}

.leaflet-control-zoom-in {
    margin-bottom: 6px !important;
}

.leaflet-right .leaflet-control {
    margin-right: 10px;
}

.leaflet-bottom.leaflet-right .leaflet-control {
    margin-bottom: 10px;
}


/* ========================================
   右側資訊面板
   ======================================== */

.place-detail-panel {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1200;

    width: 320px;
    height: 100%;

    background: rgba(255, 255, 255, 0.97);
    border-left: 1px solid #DCECF8;
    box-shadow: -4px 0 14px rgba(0, 0, 0, 0.06);

    transform: translateX(100%);
    transition: transform 0.25s ease;
}

.place-detail-panel.is-open {
    transform: translateX(0);
}

.place-detail-close {
    position: absolute;
    top: 14px;
    right: 14px;

    width: 32px;
    height: 32px;

    border: none;
    background: none;
    cursor: pointer;

    font-size: 24px;
    color: #6E8AA1;
}

.place-detail-content {
    height: 100%;
    box-sizing: border-box;
    overflow-y: auto;
    padding: 22px 18px 18px 18px;
}

#place-detail-title,
.nearby-place-title {
    margin: 0 34px 12px 0;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.45;
    color: #2E597A;
}

.place-detail-address,
.nearby-place-summary {
    margin-bottom: 16px;
    font-size: 14px;
    line-height: 1.6;
    color: #6D8598;
}

.place-detail-group {
    margin-bottom: 12px;
    padding: 12px 14px;

    background: #FFFFFF;
    border: 1px solid #DDEFFA;
    border-radius: 12px;
}

.place-detail-group-title {
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 700;
    color: #44ACFF;
}

.place-detail-toilet,
.place-detail-toilet-list div {
    font-size: 14px;
    line-height: 1.7;
    color: #4C6477;
}


/* ========================================
   附近清單卡片
   ======================================== */

.nearby-place-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.nearby-place-card {
    padding: 14px 14px 12px 14px;

    background: #FFFFFF;
    border: 1px solid #DDEFFA;
    border-radius: 14px;

    cursor: pointer;
    transition: 0.2s ease;
}

.nearby-place-card:hover {
    border-color: #89D4FF;
    box-shadow: 0 4px 10px rgba(68, 172, 255, 0.12);
}

.nearby-place-card-title {
    margin-bottom: 6px;
    font-size: 16px;
    font-weight: 700;
    color: #2E597A;
}

.nearby-place-card-address {
    margin-bottom: 6px;
    font-size: 13px;
    line-height: 1.5;
    color: #6B8294;
}

.nearby-place-card-distance {
    font-size: 13px;
    font-weight: 700;
    color: #44ACFF;
}


/* ========================================
   樓層切換按鈕
   ======================================== */

.place-floor-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.place-floor-button {
    padding: 8px 14px;

    background: #FFFFFF;
    border: 1px solid #BFE6FF;
    border-radius: 10px;

    font-size: 14px;
    font-weight: 700;
    color: #44ACFF;

    cursor: pointer;
}

.place-floor-button.is-active {
    background: #44ACFF;
    border-color: #44ACFF;
    color: #FFFFFF;
}


/* ========================================
   返回按鈕 / 重開附近公廁
   ======================================== */

.place-detail-back,
.nearby-reopen-button {
    border: 1px solid #BFE6FF;
    background: #FFFFFF;
    color: #44ACFF;

    border-radius: 10px;
    cursor: pointer;

    font-size: 14px;
    font-weight: 700;
}

.place-detail-back {
    margin-bottom: 14px;
    padding: 8px 12px;
}

.nearby-reopen-button {
    position: absolute;
    top: 16px;
    right: 330px;
    z-index: 1250;

    padding: 8px 12px;

    box-shadow: 0 2px 8px rgba(68, 172, 255, 0.14);
}
/* ========================================
   修正底圖切換選單
   展開時隱藏上方空白按鈕
   ======================================== */

.leaflet-control-layers-expanded
.leaflet-control-layers-toggle {
    display: none !important;
}
/* ========================================
   修復 Leaflet 圖層切換圖示
   ======================================== */

.leaflet-control-layers-toggle {
    width: 38px !important;
    height: 38px !important;

    background-color: rgba(255, 255, 255, 0.96) !important;

    background-image:
        url("https://unpkg.com/leaflet@1.9.4/dist/images/layers.png") !important;

    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 26px 26px !important;

    border: 1px solid #D8ECFA !important;
    border-radius: 12px !important;

    box-shadow:
        0 2px 8px rgba(68, 172, 255, 0.15) !important;
}


/* 高解析度螢幕 */

.leaflet-retina
.leaflet-control-layers-toggle {
    background-image:
        url("https://unpkg.com/leaflet@1.9.4/dist/images/layers-2x.png") !important;

    background-size:
        26px 26px !important;
}


/* 展開選單時隱藏圖示按鈕 */

.leaflet-control-layers-expanded
.leaflet-control-layers-toggle {
    display: none !important;
}
/* ========================================
   修正右側資訊面板
   不覆蓋頂部標題列
   ======================================== */

#site-header {
    position: relative;
    z-index: 1300;
}

#place-detail-panel,
.place-detail-panel {
    position: fixed !important;

    top: 56px !important;
    right: 0 !important;
    bottom: 0 !important;

    height: auto !important;

    z-index: 1200 !important;
}
/* ========================================
   右側資訊面板開啟時
   Leaflet 控制鈕自動往左移
   ======================================== */

/* 右側面板寬度 */
:root {
    --right-panel-width: 320px;
    --map-control-gap: 12px;
}


/* 平常狀態
   控制鈕維持畫面右側 */
#map-area .leaflet-right {
    right: 10px !important;

    transition:
        right 0.25s ease;
}


/* ========================================
   面板開啟
   → 底圖、定位、縮放全部往左
   ======================================== */

#map-area.has-right-panel .leaflet-right {
    right:
        calc(
            var(--right-panel-width) +
            var(--map-control-gap)
        ) !important;
}
/* ========================================
   右側清單收起後的「附近公廁」標籤
   ======================================== */

#nearby-reopen-button {
    position: fixed;

    top: 82px;
    right: 0;

    z-index: 1150;

    padding: 10px 12px 10px 14px;

    border: 1px solid #BFE6FF;
    border-right: none;

    border-radius: 12px 0 0 12px;

    background: #FFFFFF;

    color: #44ACFF;

    font-size: 14px;
    font-weight: 700;

    cursor: pointer;

    box-shadow:
        -2px 2px 8px
        rgba(68, 172, 255, 0.14);

    transition:
        background 0.2s ease,
        color 0.2s ease;
}


#nearby-reopen-button:hover {
    background: #44ACFF;
    color: #FFFFFF;
}


/* hidden 時真正隱藏 */
#nearby-reopen-button[hidden] {
    display: none !important;
}
/* ========================================
   右側清單收起後
   直式「附近公廁」標籤
   ======================================== */

#nearby-reopen-button {
    position: fixed !important;

    /* 避開右上角底圖切換按鈕 */
    top: 135px !important;
    right: 0 !important;

    z-index: 1150 !important;

    width: 42px !important;
    height: auto !important;

    padding:
        14px 9px !important;

    box-sizing: border-box !important;

    border: none !important;

    border-radius:
        10px 0 0 10px !important;

    /* 跟標題列相同 */
    background:
        #44ACFF !important;

    /* 白字 */
    color:
        #FFFFFF !important;

    font-size:
        14px !important;

    font-weight:
        700 !important;

    line-height:
        1.4 !important;

    letter-spacing:
        3px !important;

    /* 直式文字 */
    writing-mode:
        vertical-rl !important;

    text-orientation:
        upright !important;

    cursor:
        pointer !important;

    box-shadow:
        -2px 3px 9px
        rgba(68, 172, 255, 0.22) !important;

    transition:
        background 0.2s ease,
        transform 0.2s ease !important;
}


/* Hover */

#nearby-reopen-button:hover {
    background:
        #2F9FF8 !important;

    color:
        #FFFFFF !important;

    transform:
        translateX(-2px);
}


/* hidden 時真正隱藏 */

#nearby-reopen-button[hidden] {
    display:
        none !important;
}
/* ========================================
   縮放按鈕
   ＋ / － 合併成同一組
   ======================================== */

.leaflet-control-zoom {
    display: flex !important;
    flex-direction: column !important;

    border: 1px solid #D8ECFA !important;
    border-radius: 12px !important;

    overflow: hidden !important;

    background: #FFFFFF !important;

    box-shadow:
        0 2px 8px
        rgba(68, 172, 255, 0.15) !important;
}


/* ＋、－共同設定 */

.leaflet-control-zoom a {
    width: 38px !important;
    height: 38px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: none !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    background: #FFFFFF !important;

    color: #44ACFF !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    line-height: 38px !important;
}


/* ＋ 與 － 中間只留一條分隔線 */

.leaflet-control-zoom-in {
    margin-bottom: 0 !important;

    border-bottom:
        1px solid #D8ECFA !important;
}


/* Hover */

.leaflet-control-zoom a:hover {
    background:
        #EAF6FF !important;
}
/* ========================================
   搜尋框放大鏡再加大
   ======================================== */

#search-icon {
    width: 26px !important;
    height: 26px !important;

    left: 12px !important;

    font-size: 24px !important;
    font-weight: 700 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform:
        translateY(-50%)
        scale(1.08) !important;
}


/* 如果是 SVG */

#search-icon svg {
    width: 24px !important;
    height: 24px !important;

    stroke-width: 2.2 !important;
}


/* 配合較大的放大鏡
   讓文字不要太靠近 */

#search-input {
    padding-left: 50px !important;
}
/* ========================================
   搜尋框放大鏡
   改成單一 CSS 圖示，避免重疊
   ======================================== */

#search-icon {
    position: absolute !important;

    left: 12px !important;
    top: 50% !important;

    width: 30px !important;
    height: 30px !important;

    transform: translateY(-50%) !important;

    font-size: 0 !important;
    color: transparent !important;

    display: block !important;

    pointer-events: none !important;
}


/* 隱藏原本可能存在的文字 / SVG / icon */

#search-icon > * {
    display: none !important;
}


/* 放大鏡圓圈 */

#search-icon::before {
    content: "";

    position: absolute;

    width: 16px;
    height: 16px;

    left: 3px;
    top: 3px;

    border: 2.5px solid #44ACFF;
    border-radius: 50%;

    box-sizing: border-box;
}


/* 放大鏡握把 */

#search-icon::after {
    content: "";

    position: absolute;

    width: 10px;
    height: 2.5px;

    left: 17px;
    top: 19px;

    background: #44ACFF;

    border-radius: 2px;

    transform: rotate(45deg);
    transform-origin: left center;
}


/* 搜尋文字往右退一點 */

#search-input {
    padding-left: 52px !important;
}
/* ========================================
   搜尋框放大鏡
   重新調整成較乾淨的線條版
   ======================================== */

#search-icon {
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;

    width: 28px !important;
    height: 28px !important;

    transform: translateY(-50%) !important;

    font-size: 0 !important;
    color: transparent !important;

    display: block !important;
    pointer-events: none !important;
}

/* 隱藏原本可能存在的內容 */
#search-icon > * {
    display: none !important;
}

/* 放大鏡圓圈 */
#search-icon::before {
    content: "";
    position: absolute;

    width: 13px;
    height: 13px;

    left: 3px;
    top: 4px;

    border: 2.2px solid #44ACFF;
    border-radius: 50%;
    box-sizing: border-box;
}

/* 放大鏡握把 */
#search-icon::after {
    content: "";
    position: absolute;

    width: 8px;
    height: 2.2px;

    left: 14px;
    top: 17px;

    background: #44ACFF;
    border-radius: 999px;

    transform: rotate(45deg);
    transform-origin: left center;
}

/* 搜尋輸入框左側留白 */
#search-input {
    padding-left: 50px !important;
}
/* ========================================
   搜尋結果下拉選單
   配合整體藍白介面風格
   ======================================== */

#search-results {
    position: absolute !important;

    top: calc(100% + 8px) !important;
    left: 0 !important;

    width: 100% !important;

    max-height: 360px !important;
    overflow-y: auto !important;

    padding: 6px !important;

    box-sizing: border-box !important;

    background: rgba(255, 255, 255, 0.98) !important;

    border:
        1px solid #BFE6FF !important;

    border-radius:
        12px !important;

    box-shadow:
        0 6px 18px
        rgba(68, 172, 255, 0.16) !important;

    z-index: 1100 !important;
}


/* hidden 時隱藏 */

#search-results[hidden] {
    display: none !important;
}


/* ========================================
   每一筆搜尋結果
   ======================================== */

.search-result-item {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;

    padding:
        10px 12px !important;

    box-sizing: border-box !important;

    text-align: left !important;

    border: none !important;

    border-bottom:
        1px solid #E4F2FB !important;

    border-radius: 8px !important;

    background:
        transparent !important;

    color:
        #4F687C !important;

    cursor:
        pointer !important;

    transition:
        background 0.15s ease,
        color 0.15s ease !important;
}


/* 最後一筆不要底線 */

.search-result-item:last-child {
    border-bottom:
        none !important;
}


/* Hover */

.search-result-item:hover {
    background:
        #EAF6FF !important;
}


/* ========================================
   場所名稱
   ======================================== */

.search-result-name {
    margin-bottom:
        4px !important;

    color:
        #2E597A !important;

    font-size:
        14px !important;

    font-weight:
        700 !important;

    line-height:
        1.4 !important;
}


/* ========================================
   地址
   ======================================== */

.search-result-address {
    color:
        #7890A2 !important;

    font-size:
        12px !important;

    font-weight:
        400 !important;

    line-height:
        1.45 !important;
}


/* ========================================
   無搜尋結果
   ======================================== */

.search-result-empty {
    padding:
        14px 12px !important;

    color:
        #7890A2 !important;

    font-size:
        13px !important;

    text-align:
        center !important;
}


/* ========================================
   搜尋結果捲軸
   ======================================== */

#search-results::-webkit-scrollbar {
    width: 6px;
}

#search-results::-webkit-scrollbar-track {
    background: transparent;
}

#search-results::-webkit-scrollbar-thumb {
    background: #C5E5F9;

    border-radius: 999px;
}

#search-results::-webkit-scrollbar-thumb:hover {
    background: #89D4FF;
}
/* ========================================
   右側附近公廁清單
   文字改為靠左對齊
   ======================================== */

.nearby-place-card {
    text-align: left !important;
}

.nearby-place-card-name,
.nearby-place-card-address,
.nearby-place-card-distance {
    text-align: left !important;
}
.nearby-place-card {
    padding-left: 16px !important;
    padding-right: 16px !important;
}
/* ========================================
   哺集乳室 Marker
   ======================================== */

.lactation-room-marker {
    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #FE9EC7 !important;

    border: 3px solid #FFFFFF !important;

    border-radius:
        50% 50% 50% 0 !important;

    transform:
        rotate(-45deg) !important;

    box-shadow:
        0 2px 8px
        rgba(254, 158, 199, 0.30) !important;
}

.lactation-room-marker span {
    transform:
        rotate(45deg) !important;

    font-size: 16px !important;

    line-height: 1 !important;
}
.lactation-cluster {
    background: rgba(254, 158, 199, 0.30) !important;
}

.lactation-cluster-inner {
    background: #FE9EC7 !important;
}
/* ========================================
   設施類型切換列
   ======================================== */

#facility-filter {
    position: absolute;

    top: 24px;
    left: 378px;

    z-index: 1000;

    display: flex;
    align-items: center;

    gap: 7px;
}


/* ========================================
   設施類型按鈕
   ======================================== */

.facility-filter-button {
    height: 32px;

    padding: 0 14px;

    box-sizing: border-box;

    border:
        1px solid #BFE6FF;

    border-radius: 16px;

    background:
        #FFFFFF;

    color:
        #44ACFF;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;

    white-space: nowrap;

    transition:
        background 0.15s ease,
        color 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease;
}


/* Hover */

.facility-filter-button:hover {
    background:
        #EAF6FF;

    border-color:
        #89D4FF;
}


/* ========================================
   選取狀態
   ======================================== */

.facility-filter-button.is-active {
    background:
        #44ACFF;

    border-color:
        #44ACFF;

    color:
        #FFFFFF;

    box-shadow:
        0 2px 6px
        rgba(68, 172, 255, 0.20);
}


/* ========================================
   選取狀態
   #44ACFF 底 + 白框 + 白字
   ======================================== */

.facility-filter-button.is-active {
    background:
        #44ACFF;

    border-color:
        #FFFFFF;

    color:
        #FFFFFF;

    box-shadow:
        0 2px 7px
        rgba(68, 172, 255, 0.25);
}


.facility-filter-button.is-active:hover {
    background:
        #44ACFF;

    color:
        #FFFFFF;
}
/* ========================================
   詳細資料左上角返回箭頭
   ======================================== */

#place-detail-back {
    width: 34px !important;
    height: 34px !important;

    margin: 0 0 12px 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: none !important;
    border-radius: 50% !important;

    background: transparent !important;

    color: #44ACFF !important;

    font-size: 25px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    cursor: pointer !important;

    transition:
        background 0.15s ease,
        transform 0.15s ease;
}

#place-detail-back:hover {
    background: #EAF6FF !important;

    transform:
        translateX(-2px);
}

#place-detail-back[hidden] {
    display: none !important;
}
/* ========================================
   右側附近公廁類型 ICON
   ======================================== */

.nearby-toilet-icons {
    display: flex;
    align-items: center;

    gap: 5px;

    margin-top: 6px;
    margin-bottom: 3px;
}


/* 因為目前 PNG 本身四周有白色留白
   用小框裁切，讓真正的圖示看起來不要太小 */

.nearby-toilet-icon-wrap {
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;

    overflow: hidden;

    flex: 0 0 20px;
}


.nearby-toilet-icon {
    position: absolute;

    width: 34px;
    height: 34px;

    max-width: none !important;

    left: 50%;
    top: 50%;

    transform:
        translate(-50%, -50%);

    object-fit: contain;
}
/* ========================================
   公廁類型 ICON 排列
   ======================================== */

.toilet-type-icons {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    /* 每顆圖示格子之間的距離 */
    gap: 5px;

    margin-top: 6px;
    margin-bottom: 3px;
}


/* ========================================
   每顆 ICON 固定佔一個 31 × 31 的位置
   不論圖片本身是 31px 或 26px
   ======================================== */

.toilet-type-icon-wrap {
    width: 31px;
    height: 31px;

    flex: 0 0 31px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
}


/* ========================================
   ICON 共通設定
   ======================================== */

.toilet-type-icon {
    display: block;

    max-width: none !important;
    max-height: none !important;

    object-fit: contain;

    flex-shrink: 0;
}


/* ========================================
   白邊較大的三種
   男廁 / 女廁 / 混合廁
   ======================================== */

.toilet-type-icon-male,
.toilet-type-icon-female,
.toilet-type-icon-mixed {
    width: 31px;
    height: 31px;
}


/* ========================================
   白邊較小的三種
   親子 / 無障礙 / 尿布台
   ======================================== */

.toilet-type-icon-family,
.toilet-type-icon-accessible,
.toilet-type-icon-diaper {
    width: 26px;
    height: 26px;
}
.toilet-type-icons {
    display: flex;
    align-items: center;

    /* 圖示彼此靠近 */
    gap: 2px;

    margin-top: 6px;
    margin-bottom: 3px;
}


.toilet-type-icon-wrap {
    position: relative;

    width: 25px;
    height: 25px;

    flex: 0 0 25px;

    overflow: hidden;

    border-radius: 5px;
}


/* 圖片置中，再利用放大把白邊裁掉 */
.toilet-type-icon {
    position: absolute;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    display: block;

    max-width: none !important;
    max-height: none !important;

    height: auto;

    /*
       白色在白色卡片上視覺消失，
       可以大幅改善 PNG 沒去背的問題
    */
    mix-blend-mode: multiply;

    pointer-events: none;
}


/* ========================================
   男廁 / 女廁 / 混合廁
   原圖白邊最大，因此需要放大最多
   ======================================== */

.toilet-type-icon-male,
.toilet-type-icon-female,
.toilet-type-icon-mixed {
    width: 43px;
}


/* ========================================
   親子廁所
   ======================================== */

.toilet-type-icon-family {
    width: 37px;
}

/* ========================================
   無障礙廁所
   ======================================== */

.toilet-type-icon-accessible {
    width: 35px;
}


/* ========================================
   尿布台
   ======================================== */

.toilet-type-icon-diaper {
    width: 34px;
}
border-radius: 5px;
/* ========================================
   公廁詳細頁 ICON
   ======================================== */

.place-detail-toilet-icons {
    margin-top: 10px;
    margin-bottom: 6px;
}
/* ========================================
   附近清單－哺集乳室卡片
   ======================================== */

.nearby-place-card.nearby-place-card-lactation {
    /* 哺集乳室用粉紅色框線區隔 */
    border-color: rgba(246, 136, 185, 0.55);

    /* 跟公廁一樣維持白底 */
    background: #FFFFFF;
}


/* ========================================
   哺集乳室名稱
   不另外改粉紅色
   直接沿用公廁原本的名稱顏色
   ======================================== */

.nearby-place-card.nearby-place-card-lactation
.nearby-place-card-name {
    color: inherit;
}


/* ========================================
   距離仍保留粉紅色作為類型識別
   ======================================== */

.nearby-place-card.nearby-place-card-lactation
.nearby-place-card-distance {
    color: #E274A2;
}


/* ========================================
   滑鼠移入
   白底不變，只增加粉紅色陰影
   ======================================== */

.nearby-place-card.nearby-place-card-lactation:hover {
    border-color: rgba(246, 136, 185, 0.75);

    background: #FFFFFF;

    box-shadow:
        0 4px 12px
        rgba(254, 158, 199, 0.35);
}
/* ========================================
   哺集乳室詳細資料
   粉紅色系
   ======================================== */


/* 資訊卡框線 */
#place-detail-view.is-lactation-detail
.place-detail-group {
    border-color: #FE9EC7;

    /* 跟右側清單一樣維持白底 */
    background: #FFFFFF;
}


/* 設置類型、樓層、電話、開放時間、備註 */
#place-detail-view.is-lactation-detail
.place-detail-group-title {
    color: #E274A2;
}


/* 資訊內容維持一般文字色 */
#place-detail-view.is-lactation-detail
.place-detail-toilet {
    color: inherit;
}
/* ========================================
   哺集乳室詳細頁
   樓層選擇 + 條列式資訊
   ======================================== */

/* 樓層按鈕區 */
#place-detail-view.is-lactation-detail
.lactation-floor-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
    margin-bottom: 20px;
}


/* 樓層按鈕 */
#place-detail-view.is-lactation-detail
.lactation-floor-button {
    min-width: 52px;
    height: 34px;
    padding: 0 14px;

    border: 1px solid #FE9EC7;
    border-radius: 999px;

    background: #FFFFFF;
    color: #E274A2;

    font: inherit;
    font-size: 14px;
    font-weight: 600;

    cursor: pointer;

    transition:
        background-color 0.18s ease,
        color 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease;
}


/* 樓層按鈕 hover */
#place-detail-view.is-lactation-detail
.lactation-floor-button:hover {
    background: #FFF4F8;

    box-shadow:
        0 3px 10px
        rgba(254, 158, 199, 0.28);
}


/* 目前樓層 */
#place-detail-view.is-lactation-detail
.lactation-floor-button.is-active {
    border-color: #FE9EC7;
    background: #FE9EC7;
    color: #FFFFFF;

    box-shadow:
        0 3px 10px
        rgba(254, 158, 199, 0.32);
}


/* ========================================
   詳細資料改成條列式
   不使用卡片框框
   ======================================== */

#place-detail-view.is-lactation-detail
.lactation-detail-row {
    margin: 0;
    padding: 0 0 14px 0;
    margin-bottom: 14px;

    border: none;
    border-bottom: 1px solid #F0F0F0;

    background: transparent;
    box-shadow: none;
}


#place-detail-view.is-lactation-detail
.lactation-detail-row:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}


/* 欄位名稱 */
#place-detail-view.is-lactation-detail
.lactation-detail-label {
    margin-bottom: 5px;

    color: #E274A2;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}


/* 欄位內容 */
#place-detail-view.is-lactation-detail
.lactation-detail-value {
    color: #4F6375;

    font-size: 14px;
    font-weight: 400;
    line-height: 1.65;

    white-space: pre-line;
    overflow-wrap: anywhere;
}


/* 備註文字稍微增加閱讀行距 */
#place-detail-view.is-lactation-detail
.lactation-detail-row.is-note
.lactation-detail-value {
    line-height: 1.75;
}


/* 沒有其他資料 */
#place-detail-view.is-lactation-detail
.lactation-detail-empty {
    color: #7A8793;
    font-size: 14px;
    line-height: 1.6;
}
/* ========================================
   哺集乳室詳細頁－設施名稱
   ======================================== */

#place-detail-view.is-lactation-detail
#place-detail-title {
    color: #E274A2;
}
/* ========================================
   Marker 內部自製 ICON
   裁掉 PNG 白框
   ======================================== */

.toilet-place-marker span,
.lactation-room-marker span {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 4px;
}

.toilet-place-marker .marker-inner-icon,
.lactation-room-marker .marker-inner-icon {
    width: 22px;
    height: 22px;
    display: block;
    object-fit: cover;
    transform: scale(1.30);
    transform-origin: center center;
}
}
/* ========================================
   單一設施 Marker 顏色微調
   ======================================== */

/* 公共廁所 */
.toilet-place-marker {
    background: #7ACDFC;
}

/* 哺集乳室 */
.lactation-room-marker {
    background: #F688B9;
}
/* ========================================
   使用者目前位置
   Google Maps 風格橘色定位點
   ======================================== */

.user-location-icon-wrapper {
    background: transparent !important;
    border: none !important;
}


/* 整個定位圖示範圍 */
.user-location-icon {
    position: relative;

    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;
}


/* 外圍半透明定位光圈 */
.user-location-halo {
    position: absolute;

    width: 34px;
    height: 34px;

    border-radius: 50%;

    background: rgba(255, 157, 77, 0.22);
}


/* 中央目前位置圓點 */
.user-location-dot {
    position: relative;

    width: 16px;
    height: 16px;

    box-sizing: border-box;

    border-radius: 50%;

    background: #FF9D4D;

    border: 3px solid #FFFFFF;

    box-shadow:
        0 1px 4px rgba(0, 0, 0, 0.30);
}
/* ========================================
   左下角地圖圖例
   ======================================== */

.map-legend {
    min-width: 145px;

    padding: 12px 14px;

    box-sizing: border-box;

    background: rgba(255, 255, 255, 0.94);

    border-radius: 10px;

    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.16);

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    color: #45627A;
}


/* ========================================
   圖例標題
   ======================================== */

.map-legend-title {
    margin-bottom: 10px;

    font-size: 15px;

    font-weight: 700;

    color: #45627A;
}


/* ========================================
   每一列
   ======================================== */

.map-legend-item {
    display: flex;

    align-items: center;

    gap: 10px;

    min-height: 34px;

    font-size: 14px;
}


/* ========================================
   圖示固定區
   ======================================== */

.legend-marker-wrapper {
    width: 32px;
    height: 32px;

    flex: 0 0 32px;

    display: flex;

    align-items: center;

    justify-content: center;
}


/* ========================================
   廁所 / 哺集乳室 Marker
   比照地圖上的圖釘造型
   ======================================== */

.legend-facility-marker {
    position: relative;

    width: 24px;
    height: 24px;

    box-sizing: border-box;

    border: 2px solid #FFFFFF;

    border-radius:
        50%
        50%
        50%
        0;

    transform:
        rotate(-45deg);

    box-shadow:
        0 1px 4px rgba(0, 0, 0, 0.24);

    display: flex;

    align-items: center;

    justify-content: center;
}


/* 公共廁所 */
.legend-toilet-marker {
    background: #7ACDFC;
}


/* 哺集乳室 */
.legend-lactation-marker {
    background: #F688B9;
}

/* 飲水機 */
.legend-drinking-marker {
    background: #7EDDB8;
}


/* 飲水機圖示 */
.legend-drinking-icon-wrap {
    width: 15px;
    height: 15px;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: rotate(45deg);
}


.legend-drinking-icon {
    width: 15px;
    height: 15px;

    display: block;
}


/* ========================================
   Marker 裡面的 ICON
   ======================================== */

.legend-marker-icon-wrap {
    width: 15px;
    height: 15px;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: center;

    transform:
        rotate(45deg);

    border-radius: 3px;
}


.legend-marker-icon-wrap img {
    width: 15px;
    height: 15px;

    display: block;

    object-fit: cover;

    /* 裁掉原始 PNG 外圍白邊 */
    transform:
        scale(1.30);

    transform-origin:
        center center;
}


/* ========================================
   使用者位置
   ======================================== */

.legend-user-location {
    position: relative;

    width: 30px;
    height: 30px;

    border-radius: 50%;

    background:
        rgba(255, 157, 77, 0.22);

    display: flex;

    align-items: center;

    justify-content: center;
}


.legend-user-location-dot {
    width: 14px;
    height: 14px;

    box-sizing: border-box;

    border-radius: 50%;

    background: #FF9D4D;

    border:
        3px solid #FFFFFF;

    box-shadow:
        0 1px 3px rgba(0, 0, 0, 0.28);
}
/* ========================================
   搜尋模式切換
   關鍵字 / 行政區 / 車站
   ======================================== */

.search-mode-tabs {
    display: flex;

    gap: 6px;

    margin-bottom: 9px;
}


.search-mode-button {
    flex: 1;

    height: 30px;

    padding: 0 10px;

    box-sizing: border-box;

    border:
        1px solid #44ACFF;

    border-radius: 6px;

    background:
        #FFFFFF;

    color:
        #44ACFF;

    font-size: 13px;

    font-weight: 600;

    cursor: pointer;

    transition:
        background 0.15s ease,
        color 0.15s ease;
}


.search-mode-button:hover {
    background:
        #F0F8FF;
}


.search-mode-button.is-active {
    background:
        #44ACFF;

    color:
        #FFFFFF;
}


/* ========================================
   搜尋內容
   ======================================== */

.search-mode-view {
    width: 100%;
}


/* 關鍵字輸入列 */
.search-input-row {
    position: relative;

    width: 100%;
}


/* ========================================
   階層式搜尋
   ======================================== */

.hierarchy-toolbar {
    min-height: 32px;

    display: flex;

    align-items: center;

    gap: 8px;

    margin-bottom: 9px;
}


/* 返回上一層 */
.hierarchy-back-button {
    width: 30px;
    height: 30px;

    flex: 0 0 30px;

    border:
        1px solid #D6E5F0;

    border-radius: 6px;

    background:
        #FFFFFF;

    color:
        #44ACFF;

    font-size: 18px;

    cursor: pointer;
}


.hierarchy-back-button:hover {
    background:
        #F0F8FF;
}


/* 目前所在階層 */
.hierarchy-breadcrumb {
    color:
        #52697A;

    font-size:
        13px;

    font-weight:
        600;

    line-height:
        1.4;
}


/* ========================================
   階層按鈕
   ======================================== */

.hierarchy-options {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 7px;
}


.hierarchy-option-button {
    min-height: 36px;

    padding:
        7px 10px;

    box-sizing:
        border-box;

    border:
        1px solid #C9E7FA;

    border-radius:
        7px;

    background:
        #FFFFFF;

    color:
        #45627A;

    font-size:
        13px;

    text-align:
        center;

    cursor:
        pointer;

    transition:
        border-color 0.15s ease,
        background 0.15s ease;
}


.hierarchy-option-button:hover {
    border-color:
        #44ACFF;

    background:
        #F3FAFF;
}


/* ========================================
   尚未接資料提示
   ======================================== */

.hierarchy-placeholder {
    grid-column:
        1 / -1;

    padding:
        14px 10px;

    border:
        1px dashed #CAD9E3;

    border-radius:
        7px;

    background:
        #FAFCFD;

    color:
        #8596A3;

    font-size:
        13px;

    text-align:
        center;
}
/* ========================================
   新版搜尋方式卡片
   ======================================== */

#search-panel {
    width: 340px;

    box-sizing: border-box;

    padding: 10px;

    background: #FFFFFF;

    border:
        1px solid rgba(68, 172, 255, 0.28);

    border-radius: 10px;

    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.14);
}


/* ========================================
   搜尋方式
   ======================================== */

.search-mode-tabs {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 6px;

    margin-bottom: 10px;
}


.search-mode-button {
    height: 31px;

    padding: 0 8px;

    box-sizing: border-box;

    border:
        1px solid #44ACFF;

    border-radius: 6px;

    background: #FFFFFF;

    color: #44ACFF;

    font-size: 13px;

    font-weight: 600;

    cursor: pointer;

    transition:
        background 0.15s ease,
        color 0.15s ease;
}


.search-mode-button:hover {
    background: #F2F9FF;
}


.search-mode-button.is-active {
    background: #44ACFF;

    color: #FFFFFF;
}


/* ========================================
   搜尋內容
   ======================================== */

.search-mode-content {
    width: 100%;
}


.search-mode-view {
    width: 100%;
    box-sizing: border-box;
}


.search-mode-view[hidden] {
    display: none !important;
}


/* ========================================
   原本關鍵字搜尋列
   ======================================== */

.search-input-row {
    position: relative;

    width: 100%;
}


.search-input-row #search-input {
    width: 100%;
    height: 40px;

    box-sizing: border-box;

    padding:
        0
        12px
        0
        37px;

    border:
        1px solid #D5E4EE;

    border-radius: 7px;

    background: #FFFFFF;
}


.search-input-row #search-input:focus {
    outline: none;

    border-color: #44ACFF;
}


/* 搜尋 ICON */

.search-input-row #search-icon {
    position: absolute;

    left: 12px;

    top: 50%;

    transform:
        translateY(-50%);

    z-index: 2;

    color: #44ACFF;

    pointer-events: none;
}


/* 搜尋結果以搜尋列為基準 */

#search-keyword-view {
    position: relative;
}


/* ========================================
   階層工具列
   ======================================== */

.hierarchy-toolbar {
    min-height: 32px;

    display: flex;

    align-items: center;

    gap: 8px;

    margin-bottom: 9px;
}


/* ========================================
   返回上一層
   ======================================== */

.hierarchy-back-button {
    width: 30px;
    height: 30px;

    flex:
        0
        0
        30px;

    box-sizing: border-box;

    padding: 0;

    border:
        1px solid #D4E7F3;

    border-radius: 6px;

    background: #FFFFFF;

    color: #44ACFF;

    font-size: 18px;

    cursor: pointer;
}


.hierarchy-back-button:hover {
    background: #F2F9FF;
}


/* ========================================
   目前階層
   ======================================== */

.hierarchy-breadcrumb {
    color: #50687A;

    font-size: 13px;

    font-weight: 600;

    line-height: 1.4;
}


/* ========================================
   階層選項
   ======================================== */

.hierarchy-options {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 7px;

    max-height: 270px;

    overflow-y: auto;
}


/* ========================================
   階層按鈕
   ======================================== */

.hierarchy-option-button {
    min-height: 36px;

    padding:
        7px
        8px;

    box-sizing: border-box;

    border:
        1px solid #CBE7F8;

    border-radius: 7px;

    background: #FFFFFF;

    color: #45627A;

    font-size: 13px;

    cursor: pointer;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease;
}


.hierarchy-option-button:hover {
    border-color: #44ACFF;

    background: #F3FAFF;

    color: #278FD9;
}


/* ========================================
   尚未接正式資料
   ======================================== */

.hierarchy-placeholder {
    grid-column:
        1 / -1;

    padding: 15px 10px;

    box-sizing: border-box;

    border:
        1px dashed #C9DCE8;

    border-radius: 7px;

    background: #FAFCFD;

    color: #82929E;

    font-size: 13px;

    text-align: center;
}
/* ========================================
   搜尋卡片最終版修正
   ======================================== */

#search-panel {
    position: absolute !important;

    top: 18px !important;
    left: 18px !important;

    z-index: 1000 !important;

    width: 340px !important;

    /* 關鍵：取消原本 42px 固定高度 */
    height: auto !important;

    /* 關鍵：不要再用舊版橫向 flex */
    display: block !important;

    box-sizing: border-box !important;

    padding: 10px !important;

    background: #FFFFFF !important;

    border:
        1px solid rgba(68, 172, 255, 0.28) !important;

    border-radius: 10px !important;

    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.14) !important;
}


/* 搜尋方式固定橫向三等分 */

#search-panel .search-mode-tabs {
    width: 100% !important;

    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 6px !important;

    margin:
        0
        0
        10px
        0 !important;
}


/* 內容區另外一列 */

#search-panel .search-mode-content {
    display: block !important;

    width: 100% !important;
}


/* 關鍵字輸入列 */

#search-panel .search-input-row {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    height: 40px !important;
}


/* 輸入框 */

#search-panel #search-input {
    width: 100% !important;
    height: 40px !important;

    box-sizing: border-box !important;

    padding:
        0
        12px
        0
        48px !important;

    border:
        1px solid #D5E4EE !important;

    border-radius: 7px !important;

    background: #FFFFFF !important;
}


/* hidden 一定真正隱藏 */

#search-panel .search-mode-view[hidden] {
    display: none !important;
}
/* ========================================
   附近清單－飲水機
   ======================================== */

.nearby-place-card.nearby-place-card-drinking {
    border-color:
        rgba(126, 221, 184, 0.65);

    background:
        #FFFFFF;
}


.nearby-place-card.nearby-place-card-drinking
.nearby-place-card-distance {
    color:
        #56B993;
}


.nearby-place-card.nearby-place-card-drinking:hover {
    border-color:
        #7EDDB8;

    background:
        #FFFFFF;

    box-shadow:
        0 4px 12px
        rgba(126, 221, 184, 0.30);
}
/* ========================================
   飲水機詳細資料
   ======================================== */

#place-detail-view.is-drinking-detail
#place-detail-title {
    color: #55A985;
}


#place-detail-view.is-drinking-detail
.drinking-detail-row {
    margin: 0 0 14px 0;

    padding: 0 0 14px 0;

    border-bottom:
        1px solid #F0F0F0;
}


#place-detail-view.is-drinking-detail
.drinking-detail-row:last-child {
    margin-bottom: 0;

    padding-bottom: 0;

    border-bottom: none;
}


#place-detail-view.is-drinking-detail
.drinking-detail-label {
    margin-bottom: 5px;

    color: #55A985;

    font-size: 14px;
    font-weight: 700;

    line-height: 1.4;
}


#place-detail-view.is-drinking-detail
.drinking-detail-value {
    color: #4F6375;

    font-size: 14px;
    font-weight: 400;

    line-height: 1.65;

    white-space: pre-line;
    overflow-wrap: anywhere;
}
/* ========================================
   飲水機－設施類型按鈕
   與其他設施按鈕一致
   ======================================== */

.facility-filter-button[data-facility="drinking"] {
    border:
        1px solid #BFE6FF !important;

    border-radius:
        16px !important;

    background:
        #FFFFFF;

    color:
        #44ACFF;
}


/* 選取狀態 */
.facility-filter-button[data-facility="drinking"].is-active {
    background:
        #44ACFF !important;

    border:
        1px solid #FFFFFF !important;

    color:
        #FFFFFF !important;
}


/* Hover */
.facility-filter-button[data-facility="drinking"]:hover {
    border-color:
        #89D4FF !important;

    background:
        #EAF6FF;
}


/* 選取後 Hover */
.facility-filter-button[data-facility="drinking"].is-active:hover {
    background:
        #44ACFF !important;

    border-color:
        #FFFFFF !important;

    color:
        #FFFFFF !important;
}
/* ========================================
   Marker Hover 場所名稱
   ======================================== */

.facility-marker-tooltip {
    padding:
        6px
        10px !important;

    border:
        1px solid
        #D8ECFA !important;

    border-radius:
        7px !important;

    background:
        rgba(
            255,
            255,
            255,
            0.96
        ) !important;

    box-shadow:
        0 2px 8px
        rgba(
            0,
            0,
            0,
            0.14
        ) !important;

    color:
        #45627A !important;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        700 !important;

    line-height:
        1.4 !important;

    white-space:
        nowrap !important;
}


/* ========================================
   Tooltip 左側小箭頭
   ======================================== */

.leaflet-tooltip-right.facility-marker-tooltip::before {
    border-right-color:
        #FFFFFF !important;
}
/* ========================================
   設施評價摘要
   ======================================== */

.facility-review-summary {
    margin-top: -8px;
    margin-bottom: 18px;

    color: #FBBC04;

    font-size: 14px;
    font-weight: 700;
}


/* ========================================
   設施評價區
   ======================================== */

.facility-review-section {
    margin-top: 24px;

    padding-top: 18px;

    border-top:
        1px solid #E7EDF2;
}


.facility-review-section-title {
    margin-bottom: 12px;

    color: #45627A;

    font-size: 16px;
    font-weight: 700;
}


.facility-review-action {
    display: flex;

    align-items: center;

    gap: 12px;
}


.facility-review-empty-stars {
    color: #FBBC04;

    font-size: 23px;

    letter-spacing: 2px;
}

.facility-review-open-button {
    padding:
        7px
        12px;

    border:
        1px solid #BFE6FF;

    border-radius: 8px;

    background: #FFFFFF;

    color: #44ACFF;

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;
}


.facility-review-open-button:hover {
    background:
        #EAF6FF;
}


/* ========================================
   評價紀錄
   ======================================== */

.facility-review-history {
    margin-top: 20px;
}


.facility-review-history-title {
    margin-bottom: 10px;

    color: #45627A;

    font-size: 15px;
    font-weight: 700;
}


.facility-review-item {
    padding:
        12px
        0;

    border-bottom:
        1px solid #EEF1F4;
}


.facility-review-item:last-child {
    border-bottom:
        none;
}


.facility-review-item-stars {
    color: #FBBC04;

    font-size: 15px;
    font-weight: 700;
}


.facility-review-item-stars span {
    margin-left: 6px;

    color: #718493;

    font-size: 12px;
    font-weight: 400;
}


.facility-review-item-comment {
    margin-top: 7px;

    color: #4F6375;

    font-size: 14px;

    line-height: 1.6;
}


.facility-review-item-date {
    margin-top: 6px;

    color: #9AA8B3;

    font-size: 12px;
}
/* ========================================
   評價填寫表單
   ======================================== */

.facility-review-form {
    margin-top: 14px;
}

.facility-review-form[hidden] {
    display: none !important;
}


.facility-review-form-stars {
    display: flex;
    gap: 3px;

    margin-bottom: 10px;
}


.facility-review-star {
    padding: 0;

    border: none;
    background: transparent;

    color: #FBBC04;

    font-size: 28px;
    line-height: 1;

    cursor: pointer;
}


.facility-review-comment {
    width: 100%;
    min-height: 80px;

    box-sizing: border-box;

    padding: 10px;

    resize: vertical;

    border: 1px solid #D8E5EE;
    border-radius: 8px;

    outline: none;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size: 14px;

    color: #4F6375;
}


.facility-review-comment:focus {
    border-color: #44ACFF;
}


.facility-review-submit-button {
    margin-top: 10px;

    padding: 8px 14px;

    border: none;
    border-radius: 8px;

    background: #44ACFF;

    color: #FFFFFF;

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;
}


.facility-review-submit-button:hover {
    background: #2F9FF8;
}
.facility-review-section {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #e6e6e6;
}

.facility-review-title {
    margin: 0 0 10px 0;
    font-size: 24px;
    font-weight: 700;
    color: #2f4863;
}

.facility-review-summary {
    margin-bottom: 12px;
    font-size: 16px;
    font-weight: 600;
    color: #fbbc04;
}

.facility-review-open-button {
    display: inline-block;
    padding: 10px 16px;
    border: 1px solid #5ab0ff;
    border-radius: 10px;
    background: #ffffff;
    color: #3f9cff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.facility-review-open-button:hover {
    background: #f3f9ff;
}

.facility-review-form {
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.facility-review-stars-row {
    display: flex;
    align-items: center;
}

.facility-review-stars {
    display: flex;
    gap: 6px;
}

.facility-review-star {
    border: none;
    background: transparent;
    padding: 0;
    font-size: 32px;
    line-height: 1;
    color: #fbbc04;
    cursor: pointer;
}

.facility-review-comment {
    width: 100%;
    min-height: 96px;
    box-sizing: border-box;
    padding: 12px;
    border: 1px solid #d8d8d8;
    border-radius: 10px;
    font-size: 15px;
    resize: vertical;
}

.facility-review-submit-button {
    align-self: flex-start;
    padding: 10px 18px;
    border: none;
    border-radius: 10px;
    background: #54adff;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.facility-review-submit-button:hover {
    background: #3d9df8;
}

.facility-review-history {
    margin-top: 20px;
}

.facility-review-history-title {
    margin: 0 0 12px 0;
    font-size: 16px;
    font-weight: 700;
    color: #2f4863;
}
/* ========================================
   設施評價標題
   比照公廁詳細資料欄位標題
   ======================================== */

.facility-review-section-title,
.facility-review-title {
    margin: 0 0 8px 0 !important;

    color: #44ACFF !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    line-height: 1.4 !important;
}
/* ========================================
   評價功能色系
   公廁：維持藍色
   哺集乳室：粉色
   飲水機：綠色
   ======================================== */


/* ----------------------------------------
   哺集乳室：評價區色系
   ---------------------------------------- */

#place-detail-view.is-lactation-detail
.facility-review-section-title,
#place-detail-view.is-lactation-detail
.facility-review-title {
    color: #F688B9 !important;
}


#place-detail-view.is-lactation-detail
.facility-review-open-button {
    border: 1px solid #F688B9 !important;
    background: #FFFFFF !important;
    color: #F688B9 !important;
}


#place-detail-view.is-lactation-detail
.facility-review-open-button:hover {
    background: #FFF1F7 !important;
}


#place-detail-view.is-lactation-detail
.facility-review-submit-button {
    background: #F688B9 !important;
    color: #FFFFFF !important;
}


#place-detail-view.is-lactation-detail
.facility-review-submit-button:hover {
    background: #EB72AA !important;
}


#place-detail-view.is-lactation-detail
.facility-review-comment:focus {
    border-color: #F688B9 !important;
}


/* ----------------------------------------
   飲水機：評價區色系
   ---------------------------------------- */

#place-detail-view.is-drinking-detail
.facility-review-section-title,
#place-detail-view.is-drinking-detail
.facility-review-title {
    color: #55A985 !important;
}


#place-detail-view.is-drinking-detail
.facility-review-open-button {
    border: 1px solid #7EDDB8 !important;
    background: #FFFFFF !important;
    color: #55A985 !important;
}


#place-detail-view.is-drinking-detail
.facility-review-open-button:hover {
    background: #F1FBF6 !important;
}


#place-detail-view.is-drinking-detail
.facility-review-submit-button {
    background: #55A985 !important;
    color: #FFFFFF !important;
}


#place-detail-view.is-drinking-detail
.facility-review-submit-button:hover {
    background: #469674 !important;
}


#place-detail-view.is-drinking-detail
.facility-review-comment:focus {
    border-color: #7EDDB8 !important;
}
/* ========================================
   錯誤回報
   ======================================== */

.facility-error-report-section-title {
    margin: 0 0 8px 0;

    color: #45627A;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size: 14px;
    font-weight: 700;

    line-height: 1.4;
}


/* ========================================
   回報錯誤按鈕
   ======================================== */

.facility-error-report-open-button {
    padding:
        8px
        14px;

    border:
        1px solid #FF8A7A;

    border-radius:
        9px;

    background:
        #FFFFFF;

    color:
        #E66D5C;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size:
        14px;

    font-weight:
        700;

    cursor:
        pointer;

    transition:
        background 0.15s ease,
        border-color 0.15s ease;
}


.facility-error-report-open-button:hover {
    background:
        #FFF4F2;

    border-color:
        #E66D5C;
}


/* ========================================
   回報表單
   ======================================== */

.facility-error-report-form {
    margin-top: 14px;

    display:
        flex;

    flex-direction:
        column;

    gap:
        10px;
}


.facility-error-report-form[hidden] {
    display:
        none !important;
}


/* 問題類型標題 */

.facility-error-report-label {
    color:
        #45627A;

    font-size:
        13px;

    font-weight:
        700;
}


/* ========================================
   問題類型下拉選單
   ======================================== */

.facility-error-report-type {
    width:
        100%;

    height:
        38px;

    box-sizing:
        border-box;

    padding:
        0
        10px;

    border:
        1px solid #D8E5EE;

    border-radius:
        8px;

    background:
        #FFFFFF;

    color:
        #4F6375;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size:
        14px;

    outline:
        none;
}


.facility-error-report-type:focus {
    border-color:
        #FF8A7A;
}


/* ========================================
   問題說明
   ======================================== */

.facility-error-report-description {
    width:
        100%;

    min-height:
        90px;

    box-sizing:
        border-box;

    padding:
        10px;

    resize:
        vertical;

    border:
        1px solid #D8E5EE;

    border-radius:
        8px;

    outline:
        none;

    color:
        #4F6375;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size:
        14px;

    line-height:
        1.6;
}


.facility-error-report-description:focus {
    border-color:
        #FF8A7A;
}


/* ========================================
   送出回報按鈕
   ======================================== */

.facility-error-report-submit-button {
    align-self:
        flex-start;

    padding:
        8px
        14px;

    border:
        none;

    border-radius:
        8px;

    background:
        #E66D5C;

    color:
        #FFFFFF;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size:
        14px;

    font-weight:
        700;

    cursor:
        pointer;
}


.facility-error-report-submit-button:hover {
    background:
        #D75C4C;
}
/* ========================================
   設施評價 / 錯誤回報
   標題完全統一
   ======================================== */

.facility-review-title,
.facility-error-report-section-title {
    margin: 0 0 8px 0 !important;

    color: #44ACFF !important;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    line-height: 1.4 !important;
}
/* ========================================
   設施評價 / 錯誤回報區隔
   ======================================== */

.facility-error-report-section {
    margin-top: 20px !important;
    padding-top: 18px !important;

    border-top:
        1px solid #E7EDF2 !important;
}
/* ========================================
   錯誤回報照片
   ======================================== */

.facility-error-report-photo-section {
    margin-top: 2px;
}


.facility-error-report-photo-actions {
    display: flex;
    gap: 8px;

    flex-wrap: wrap;
}


.facility-error-report-photo-button {
    padding: 8px 12px;

    border: 1px solid #D8E5EE;
    border-radius: 8px;

    background: #FFFFFF;

    color: #4F6375;

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;
}


.facility-error-report-photo-button:hover {
    background: #F7FAFC;
}


/* 照片預覽 */

.facility-error-report-photo-preview {
    margin-top: 10px;
}


.facility-error-report-photo-preview[hidden] {
    display: none !important;
}


.facility-error-report-photo-preview img {
    display: block;

    width: 100%;
    max-height: 180px;

    object-fit: cover;

    border-radius: 9px;

    border: 1px solid #E1E8ED;
}


.facility-error-report-photo-remove {
    margin-top: 7px;

    padding: 5px 9px;

    border: none;

    background: transparent;

    color: #E66D5C;

    font-size: 12px;

    cursor: pointer;
}
/* ========================================
   我要評價按鈕
   尺寸比照回報錯誤
   ======================================== */

.facility-review-open-button {
    padding:
        8px
        14px !important;

    border-radius:
        9px !important;

    font-size:
        14px !important;

    font-weight:
        700 !important;

    line-height:
        normal !important;
}
/* ========================================
   評價照片按鈕修正
   ======================================== */

.facility-review-photo-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;

    margin-top: 2px !important;
}


.facility-review-photo-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 7px 12px !important;

    border: 1px solid #D8E5EE !important;
    border-radius: 8px !important;

    background: #FFFFFF !important;

    color: #4F6375 !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    line-height: 1.4 !important;

    cursor: pointer !important;
}


.facility-review-photo-button:hover {
    background: #F7FAFC !important;
}
/* ========================================
   設施詳細資料欄位標題
   使用比設施主色更深一階的顏色
   ======================================== */


/* 哺集乳室 */
#place-detail-view.is-lactation-detail
.lactation-detail-label {
    color: #D95F94 !important;
}


/* 飲水機 */
#place-detail-view.is-drinking-detail
.drinking-detail-label {
    color: #469675 !important;
}
/* ========================================
   右下角主畫面操作按鈕
   錯誤回報 + 定位
   ======================================== */

.map-action-control {
    display: flex;
    flex-direction: column;

    gap: 8px;
}


/* 共通按鈕 */

.map-action-control > a {
    width: 38px !important;
    height: 38px !important;

    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #FFFFFF !important;

    border: 1px solid #D8ECFA !important;
    border-radius: 12px !important;

    text-decoration: none !important;

    box-shadow:
        0 2px 8px
        rgba(68, 172, 255, 0.15) !important;
}


/* ========================================
   錯誤回報
   ======================================== */

.map-error-report-button {
    color: #E66D5C !important;

    font-size: 22px !important;
    font-weight: 700 !important;
}


.map-error-report-button:hover {
    background: #FFF4F2 !important;
}


/* ========================================
   定位
   ======================================== */

.map-location-button {
    color: #44ACFF !important;

    font-size: 22px !important;
}


.map-location-button:hover {
    background: #EAF6FF !important;
}
/* ========================================
   主畫面錯誤回報視窗
   ======================================== */

.map-error-report-modal {
    position: fixed;

    inset: 0;

    z-index: 3000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;

    box-sizing: border-box;

    background:
        rgba(37, 55, 70, 0.28);
}


.map-error-report-modal[hidden] {
    display: none !important;
}


.map-error-report-dialog {
    position: relative;

    width: 100%;
    max-width: 420px;

    box-sizing: border-box;

    padding: 24px;

    background: #FFFFFF;

    border-radius: 14px;

    box-shadow:
        0 10px 30px
        rgba(0, 0, 0, 0.16);
}


/* 關閉 */

.map-error-report-close {
    position: absolute;

    top: 12px;
    right: 12px;

    width: 32px;
    height: 32px;

    border: none;
    background: transparent;

    color: #6E8AA1;

    font-size: 24px;

    cursor: pointer;
}


/* 標題 */

.map-error-report-title {
    margin-bottom: 20px;

    color: #2E597A;

    font-size: 18px;
    font-weight: 700;
}


/* 欄位標題 */

.map-error-report-label {
    margin:
        12px
        0
        6px;

    color: #45627A;

    font-size: 14px;
    font-weight: 700;
}


/* 問題類型 */

.map-error-report-type {
    width: 100%;
    height: 40px;

    box-sizing: border-box;

    padding: 0 10px;

    border: 1px solid #D8E5EE;
    border-radius: 8px;

    background: #FFFFFF;

    color: #4F6375;

    font-size: 14px;

    outline: none;
}


/* 說明欄 */

.map-error-report-description {
    width: 100%;
    min-height: 110px;

    box-sizing: border-box;

    padding: 10px;

    border: 1px solid #D8E5EE;
    border-radius: 8px;

    resize: vertical;

    color: #4F6375;

    font-family:
        Arial,
        "Microsoft JhengHei",
        sans-serif;

    font-size: 14px;

    outline: none;
}


/* 照片按鈕 */

.map-error-report-photo-actions {
    display: flex;

    gap: 8px;

    margin-top: 12px;
}


.map-error-report-photo-button {
    padding: 8px 12px;

    border: 1px solid #D8E5EE;
    border-radius: 8px;

    background: #FFFFFF;

    color: #4F6375;

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;
}


/* 預覽 */

.map-error-report-photo-preview {
    margin-top: 12px;
}


.map-error-report-photo-preview[hidden] {
    display: none !important;
}


.map-error-report-photo-preview img {
    display: block;

    width: 100%;
    max-height: 200px;

    object-fit: cover;

    border: 1px solid #E1E8ED;
    border-radius: 9px;
}


.map-error-report-photo-remove {
    margin-top: 6px;

    border: none;
    background: transparent;

    color: #E66D5C;

    cursor: pointer;
}


/* 送出 */

.map-error-report-submit {
    margin-top: 16px;

    padding: 9px 16px;

    border: none;
    border-radius: 9px;

    background: #E66D5C;

    color: #FFFFFF;

    font-size: 14px;
    font-weight: 700;

    cursor: pointer;
}


.map-error-report-submit:hover {
    background: #D75C4C;
}
/* ========================================
   評價紀錄照片
   ======================================== */

.facility-review-item-photo {
    display: block;

    width: 100%;
    max-height: 190px;

    margin-top: 10px;

    object-fit: cover;

    border: 1px solid #E1E8ED;
    border-radius: 9px;
}
/* ========================================
   附近設施清單－評價摘要
   ======================================== */

.nearby-place-card-review {
    margin-top: 2px;
    margin-bottom: 6px;

    color: #FBBC04;

    font-size: 13px;
    font-weight: 700;

    line-height: 1.4;
}
/* ========================================
   附近設施清單－尚無評論
   ======================================== */

.nearby-place-card-review.is-empty {
    color: #C9D1D3 !important;
    font-weight: 600;
}
/* ========================================
   階層 Breadcrumb
   ======================================== */

.hierarchy-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}


.hierarchy-breadcrumb-button {
    padding: 0;

    border: none;
    background: none;

    font: inherit;
    color: #44ACFF;

    cursor: pointer;
}


.hierarchy-breadcrumb-button:hover {
    text-decoration: underline;
}


.hierarchy-breadcrumb-separator {
    color: #A8B5C2;
}


.hierarchy-breadcrumb-current {
    color: #5F7485;
}
/* ========================================
   設施導航
   ======================================== */

.place-navigation-area {
    display: flex;
    align-items: center;

    margin-top: 10px;
    margin-bottom: 14px;
}

.place-navigation-area[hidden] {
    display: none;
}


.place-navigation-button {
    appearance: none;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 6px;

    min-width: 78px;
    height: 36px;

    padding: 0 14px;

    border: 1px solid #44ACFF;
    border-radius: 9px;

    background-color: #FFFFFF;

    color: #168EEA;

    font-family: inherit;
    font-size: 14px;
    font-weight: 600;

    cursor: pointer;
}


.place-navigation-button:hover {
    background-color: #44ACFF;
    color: #FFFFFF;
}


.place-navigation-button:active {
    transform: translateY(1px);
}


.place-navigation-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-size: 14px;
}
/* ========================================
   哺集乳室－導航按鈕
   ======================================== */

.is-lactation-detail .place-navigation-button {
    border-color: #FE9EC7;
    color: #E86D9A;
}


.is-lactation-detail .place-navigation-button:hover {
    background-color: #FE9EC7;
    border-color: #FE9EC7;
    color: #FFFFFF;
}


/* ========================================
   飲水機－導航按鈕
   ======================================== */

.is-drinking-detail .place-navigation-button {
    background-color: #FFFFFF;

    border-color: #55A985;

    color: #469675;
}


.is-drinking-detail .place-navigation-button:hover {
    background-color: #55A985;

    border-color: #55A985;

    color: #FFFFFF;
}
/* ========================================
   附近設施清單－標題列
   ======================================== */

.nearby-place-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 10px;
}


/* 場域名稱 */
.nearby-place-card-header .nearby-place-card-name {
    flex: 1;

    min-width: 0;
}


/* ========================================
   附近設施清單－導航
   ======================================== */

.nearby-place-navigation-button {
    appearance: none;

    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 3px;

    width: auto;
    height: 26px;

    padding: 0 5px;

    border: none;
    border-radius: 5px;

    background: transparent;

    color: #44ACFF;

    font-family: inherit;
    font-size: 12px;
    font-weight: 500;

    line-height: 1;

    white-space: nowrap;

    cursor: pointer;

    transition:
        background-color 0.15s ease,
        opacity 0.15s ease;
}


.nearby-place-navigation-button:hover {
    background-color: rgba(68, 172, 255, 0.08);
}


.nearby-place-navigation-button:active {
    opacity: 0.7;
}


.nearby-place-navigation-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-size: 10px;
    line-height: 1;
}


/* 哺集乳室 */
.nearby-place-card-lactation
.nearby-place-navigation-button {
    color: #E86D9A;
}


.nearby-place-card-lactation
.nearby-place-navigation-button:hover {
    background-color: rgba(254, 158, 199, 0.16);
}


/* 飲水機 */
.nearby-place-card-drinking
.nearby-place-navigation-button {
    color: #469675;
}


.nearby-place-card-drinking
.nearby-place-navigation-button:hover {
    background-color: rgba(85, 169, 133, 0.14);
}