/* 日本百名山 登頂ログ（Leaflet の CSS より後に読まれないため、#app-hyakumeizan で詳細度を上げている） */

#app-hyakumeizan .hm-count { font-variant-numeric: tabular-nums; white-space: nowrap; }
#app-hyakumeizan .hm-count-num { font-size: 2rem; font-weight: 800; line-height: 1; }
#app-hyakumeizan .hm-count-of { font-weight: 700; }
#app-hyakumeizan .hm-rate { font-weight: 700; color: var(--bs-secondary-color); }
#app-hyakumeizan .hm-best { font-weight: 700; }
#app-hyakumeizan .hm-progress { height: 8px; }

#app-hyakumeizan .hm-filter { flex: 1 1 15rem; max-width: 24rem; }
#app-hyakumeizan .hm-sort { flex: 1 1 12rem; max-width: 18rem; }

/* ---- 地図 ---- */
#app-hyakumeizan .hm-map-wrap { position: relative; }
#app-hyakumeizan #hm-map {
    height: min(70vh, 560px);
    min-height: 380px;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
}
#app-hyakumeizan .hm-legend {
    position: absolute;
    left: 8px;
    bottom: 22px;
    z-index: 500;
    display: flex;
    gap: .75rem;
    padding: .25rem .5rem;
    font-size: .8rem;
    font-weight: 700;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
}
#app-hyakumeizan .hm-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: .25rem;
    vertical-align: -1px;
}

/* 印: まだ＝白抜き（線だけ）／登頂済み＝塗り。色だけに頼らず「塗りの有無」で見分ける */
#app-hyakumeizan .hm-dot.is-todo,
#app-hyakumeizan .hm-marker.is-todo span { background: var(--bs-body-bg); border: 2px solid #6d4bb3; color: var(--bs-body-color); }
#app-hyakumeizan .hm-dot.is-done,
#app-hyakumeizan .hm-marker.is-done span { background: #c2410c; border: 2px solid #fff; color: #fff; }
#app-hyakumeizan .hm-marker span {
    display: flex;
    width: 26px;
    height: 26px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .35);
}

/* ポップアップ */
#app-hyakumeizan .hm-popup .leaflet-popup-content { margin: 12px 14px; }
#app-hyakumeizan .hm-popup .leaflet-popup-content-wrapper,
#app-hyakumeizan .hm-popup .leaflet-popup-tip { background: var(--bs-body-bg); color: var(--bs-body-color); }
#app-hyakumeizan .hm-pop-no { font-size: .75rem; color: var(--bs-secondary-color); font-weight: 700; }
#app-hyakumeizan .hm-pop-name { font-size: 1.15rem; font-weight: 800; line-height: 1.3; }
#app-hyakumeizan .hm-pop-kana { font-size: .75rem; font-weight: 400; color: var(--bs-secondary-color); margin-left: .375rem; }
#app-hyakumeizan .hm-pop-meta { font-weight: 700; margin-top: .125rem; }
#app-hyakumeizan .hm-pop-gsi, #app-hyakumeizan .hm-pop-note { font-size: .78rem; color: var(--bs-secondary-color); }
#app-hyakumeizan .hm-pop-note { margin-top: .25rem; }
#app-hyakumeizan .hm-pop-actions { display: grid; gap: .5rem; margin-top: .625rem; }
#app-hyakumeizan .hm-pop-date { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .5rem; font-size: .8rem; }

/* ---- 一覧 ---- */
#app-hyakumeizan .hm-list-card { height: 100%; }
#app-hyakumeizan .hm-list { max-height: min(70vh, 560px); overflow-y: auto; }
@media (max-width: 991.98px) { #app-hyakumeizan .hm-list { max-height: 60vh; } }
#app-hyakumeizan .hm-row {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    border-top: 1px solid var(--bs-border-color-translucent);
}
#app-hyakumeizan .hm-row:first-child { border-top: 0; }
#app-hyakumeizan .hm-check, #app-hyakumeizan .hm-name {
    background: transparent;
    border: 0;
    color: inherit;
    text-align: start;
}
#app-hyakumeizan .hm-check { padding: .5rem .5rem .5rem .75rem; color: var(--bs-secondary-color); line-height: 1; }
#app-hyakumeizan .hm-check .mach-mi { font-size: 26px; }
#app-hyakumeizan .hm-row.is-done .hm-check { color: #c2410c; }
#app-hyakumeizan .hm-row.is-done .hm-check .mach-mi { font-variation-settings: "FILL" 1; }
#app-hyakumeizan .hm-name { padding: .4rem .75rem .4rem 0; min-width: 0; }
#app-hyakumeizan .hm-name:hover .hm-row-main { text-decoration: underline; }
#app-hyakumeizan .hm-row-main { display: flex; align-items: baseline; gap: .375rem; font-weight: 700; }
#app-hyakumeizan .hm-row-no { font-size: .75rem; color: var(--bs-secondary-color); min-width: 1.75rem; font-variant-numeric: tabular-nums; }
#app-hyakumeizan .hm-row-elev { margin-left: auto; font-variant-numeric: tabular-nums; white-space: nowrap; }
#app-hyakumeizan .hm-row-sub { display: block; font-size: .78rem; color: var(--bs-secondary-color); padding-left: 2.125rem; }

#app-hyakumeizan .hm-area-table th:first-child, #app-hyakumeizan .hm-area-table td:first-child { padding-left: 1rem; }
#app-hyakumeizan .hm-area-table th:last-child, #app-hyakumeizan .hm-area-table td:last-child { padding-right: 1rem; }
#app-hyakumeizan .hm-area-complete th { font-weight: 800; }

#app-hyakumeizan .hm-seo-table td, #app-hyakumeizan .hm-seo-table th { font-variant-numeric: tabular-nums; }
