/* صفحات الأحياء — only what ui.css lacks. Mobile first, wrapping lists, no sideways rails. */
.alj-hoods .alj-hoods-crumbs{margin-bottom:14px;font-size:14px;color:var(--muted)}
.alj-hoods .alj-hoods-crumbs ol{display:flex;flex-wrap:wrap;gap:4px 0;list-style:none;margin:0;padding:0}
.alj-hoods .alj-hoods-crumbs li{display:inline-flex;align-items:center;min-width:0;overflow-wrap:anywhere}
.alj-hoods .alj-hoods-crumbs li+li::before{content:"›";margin:0 8px;color:#b4abc9}
.alj-hoods .alj-hoods-crumbs a{color:var(--muted)}
.alj-hoods .alj-hoods-crumbs a:hover{color:var(--v)}
.alj-hoods .alj-hoods-crumbs [aria-current]{color:var(--ink);font-weight:700}
.alj-hoods .alj-hoods-hero h1{overflow-wrap:anywhere}
.alj-hoods .alj-hoods-main,.alj-hoods .alj-hoods-side{min-width:0;display:grid;gap:28px;align-content:start}
.alj-hoods .alj-hoods-sec h2{font-size:19px;margin-bottom:12px}
.alj-hoods ul{list-style:none;margin:0;padding:0}

/* category chips: wrap, never scroll sideways */
.alj-hoods .alj-hoods-chips{display:flex;flex-wrap:wrap;gap:8px}
.alj-hoods .alj-hoods-chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font-weight:700;font-size:14.5px}
.alj-hoods .alj-hoods-chip span{font-weight:400;font-size:13px;color:var(--muted)}
.alj-hoods .alj-hoods-chip:hover{border-color:var(--v2)}
.alj-hoods .alj-hoods-chip.is-on{background:var(--deep);border-color:var(--deep);color:#fff}
.alj-hoods .alj-hoods-chip.is-on span{color:#d6ccf7}

/* listing cards */
.alj-hoods .alj-hoods-list{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr))}
.alj-hoods .alj-hoods-card{display:flex;gap:12px;align-items:center;height:100%;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink)}
.alj-hoods .alj-hoods-card:hover{border-color:var(--v2)}
.alj-hoods .alj-hoods-card img,.alj-hoods .alj-hoods-ph{width:64px;height:64px;border-radius:12px;object-fit:cover;flex:none;background:var(--v-soft)}
.alj-hoods .alj-hoods-ph{display:grid;place-items:center;color:var(--v);font-weight:700;font-size:24px}
.alj-hoods .alj-hoods-card-body{display:grid;gap:3px;min-width:0}
.alj-hoods .alj-hoods-card b{font-size:16px;overflow-wrap:anywhere}
.alj-hoods .alj-hoods-card small{color:var(--muted);font-size:13px}
.alj-hoods .alj-hoods-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.alj-hoods .alj-hoods-more{margin-top:12px}

/* district lists (index, city, nearby) */
.alj-hoods .alj-hoods-dists{display:grid;gap:4px 16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr))}
.alj-hoods .alj-hoods-dists a,.alj-hoods .alj-hoods-dists .is-off span{display:flex;justify-content:space-between;gap:8px;padding:7px 0;border-bottom:1px solid var(--line);font-weight:700}
.alj-hoods .alj-hoods-dists a span{font-weight:400;color:var(--muted);font-size:13px}
.alj-hoods .alj-hoods-dists .is-off span{color:#aaa2bd;font-weight:400}

/* index: regions → cities */
.alj-hoods .alj-hoods-region{margin-top:32px}
.alj-hoods .alj-hoods-region h2{font-size:22px;margin-bottom:14px}
.alj-hoods .alj-hoods-cities{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.alj-hoods .alj-hoods-city{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px}
.alj-hoods .alj-hoods-city h3{font-size:18px;margin-bottom:6px;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.alj-hoods .alj-hoods-city h3 span{font-size:13px;font-weight:400;color:var(--muted)}
.alj-hoods .alj-hoods-city.is-off h3{color:#aaa2bd}

/* events */
.alj-hoods .alj-hoods-events{display:grid;gap:10px}
.alj-hoods .alj-hoods-events a{display:flex;gap:12px;align-items:center;color:var(--ink)}
.alj-hoods .alj-hoods-events time{flex:none;width:58px;text-align:center;padding:6px 0;border-radius:12px;background:var(--v-soft);color:var(--v);font-size:12px;line-height:1.3}
.alj-hoods .alj-hoods-events time b{display:block;font-size:20px}
.alj-hoods .alj-hoods-events span{display:grid;font-weight:700;min-width:0;overflow-wrap:anywhere}
.alj-hoods .alj-hoods-events small{font-weight:400;color:var(--muted);font-size:13px}

/* related pages */
.alj-hoods .alj-hoods-links{display:grid;gap:8px}
.alj-hoods .alj-hoods-links a{display:block;padding:10px 0;border-bottom:1px solid var(--line);font-weight:700}
.alj-hoods .alj-hoods-links a::after{content:" ←"}