/* Neighbourhoods Hub — /neighbourhoods (neighbourhoods.php + js/neighbourhoods-hub.js) */

/* ---- Map card -------------------------------------------------------------- */
.hood-map-card {
    border: 1px solid #e3e7eb;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 22px;
    background: #fff;
}
.hood-map-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 12px;
    background: #f5f8fb;
    border-bottom: 1px solid #e3e7eb;
}
.hood-map-hint { color: #556; font-size: .9em; }
#hoodMap {
    height: 460px;
    background: #eef2f5;
}
.hood-locate-msg {
    padding: 0 12px;
    font-size: .88em;
    color: #556;
}
.hood-locate-msg:not(:empty) { padding: 8px 12px; }
.hood-locate-msg.err { color: #b71c1c; }

/* Leaflet popup content (built in js/neighbourhoods-hub.js) */
.hood-pop { min-width: 190px; }
.hood-pop-name { font-weight: 700; color: #003366; font-size: 1.05em; margin: 0 0 2px; }
.hood-pop-meta { color: #778; font-size: .85em; margin: 0 0 8px; }
.hood-pop .btn { color: #fff; }

/* ---- "My neighbourhoods" chips --------------------------------------------- */
.hood-chip {
    display: inline-block;
    background: #eaf1f8;
    color: #003366;
    border-radius: 20px;
    padding: 3px 12px;
    margin: 2px 2px;
    font-size: .9em;
    text-decoration: none;
    border: 1px solid #d4e2ef;
}
.hood-chip:hover { background: #003366; color: #fff; text-decoration: none; }

/* ---- Directory ------------------------------------------------------------- */
.hood-muni-h {
    color: #003366;
    font-size: 1.35em;
    margin: 8px 0 14px;
}
.hood-muni-count {
    font-size: .6em;
    font-weight: 400;
    color: #889;
    vertical-align: middle;
    margin-left: 6px;
}
.hood-card {
    border: 1px solid #e3e7eb;
    border-radius: 12px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    transition: box-shadow .15s ease;
}
.hood-card.hood-card-hl { box-shadow: 0 0 0 3px #ffb84d, 0 4px 14px rgba(0, 0, 0, .12); }
.hood-card:hover { box-shadow: 0 4px 14px rgba(0, 0, 0, .08); }
.hood-card-cover { aspect-ratio: 3 / 1; min-height: 72px; }
.hood-card-body { padding: 12px 14px; flex: 1; display: flex; flex-direction: column; }
.hood-card-name { color: #003366; font-weight: 700; font-size: 1.08em; text-decoration: none; }
.hood-card-name:hover { text-decoration: underline; color: #003366; }
.hood-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    margin-right: 7px;
    vertical-align: baseline;
}
.hood-card-meta { color: #888; font-size: .85em; margin: 2px 0 6px; }
.hood-card-desc { color: #555; font-size: .9em; margin: 0 0 10px; flex: 1; }

.hood-credits { color: #99a; font-size: .8em; margin: 6px 0 0; }
.hood-credits a { color: #789; }

@media (max-width: 767px) {
    #hoodMap { height: 340px; }
}