/* Bústia inclusiva — mapa de recursos (Leaflet) i panell de centre. Mobile first. */
.rc-filtres { padding: 14px; }
.rc-cerca { position: relative; margin-bottom: 10px; }
.rc-selects { display: grid; grid-template-columns: 1fr; gap: 8px; }
.rc-selects label { font-size: .8rem; color: var(--text-2); font-weight: 600; display: flex; flex-direction: column; gap: 4px; }
.rc-selects .bi-select { min-height: 44px; padding: 8px 10px; font-size: .95rem; }
@media (min-width: 640px) { .rc-selects { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .rc-selects { grid-template-columns: repeat(4, 1fr); } .rc-filtres { padding: 16px 20px; } }
.rc-llegenda { display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 10px; font-size: .85rem; color: var(--text-2); }
.rc-llegenda span { display: inline-flex; align-items: center; gap: 6px; }
.rc-llegenda i { width: 14px; height: 14px; border-radius: 50%; display: inline-block; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.25); }

.rc-cos { display: grid; grid-template-columns: 1fr; gap: 14px; margin-bottom: 14px; }
@media (min-width: 900px) { .rc-cos { grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); align-items: start; } }
.rc-mapa { width: 100%; height: 62vh; min-height: 360px; max-height: 720px; border-radius: var(--radi); border: 1px solid var(--vora); box-shadow: var(--ombra); background: #e9eeea; z-index: 0; }
.rc-compt { margin: 8px 2px 0; }
.rc-llista-col { background: var(--targeta); border: 1px solid var(--vora); border-radius: var(--radi); box-shadow: var(--ombra); padding: 12px; max-height: 62vh; overflow: auto; }
@media (max-width: 899px) { .rc-llista-col { max-height: 320px; } }
.rc-h2 { font-size: 1.05rem; margin: 0 0 8px; color: var(--verd-fosc); display: flex; align-items: center; gap: 8px; }
.rc-llista { list-style: none; margin: 0; padding: 0; }
.rc-llista li { border-bottom: 1px solid #eef2ef; }
.rc-llista button { width: 100%; text-align: left; background: none; border: 0; padding: 10px 6px; font: inherit; color: var(--text); cursor: pointer; border-radius: 8px; min-height: 48px; display: flex; gap: 8px; align-items: flex-start; }
.rc-llista button:hover, .rc-llista button:focus-visible { background: var(--verd-clar); }
.rc-llista i.rc-punt { width: 12px; height: 12px; border-radius: 50%; flex: none; margin-top: 6px; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.25); }
.rc-llista small { display: block; color: var(--text-2); font-size: .82rem; }

/* Marcadors */
.rc-marker { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.35); }
.rc-marker.rc-sel { width: 20px; height: 20px; box-shadow: 0 0 0 3px var(--verd), 0 0 0 5px rgba(0,0,0,.25); }
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large { background: rgba(1, 92, 67, .25); }
.marker-cluster-small div, .marker-cluster-medium div, .marker-cluster-large div { background: rgba(1, 92, 67, .85); color: #fff; font-weight: 700; }
.leaflet-popup-content { margin: 10px 12px; font: inherit; }
.leaflet-popup-content b { display: block; }
.leaflet-container a.rc-pop-btn { display: inline-block; margin-top: 6px; color: var(--verd-fosc); font-weight: 700; }

/* Panell del centre */
.rc-panell { position: fixed; z-index: 1200; left: 0; right: 0; bottom: 0; max-height: 88vh; overflow: auto; background: #fff; border-radius: 18px 18px 0 0; box-shadow: 0 -10px 40px rgba(0,0,0,.25); padding: 14px 16px 24px; }
@media (min-width: 900px) { .rc-panell { left: auto; top: 16px; right: 16px; bottom: 16px; width: min(520px, 46vw); max-height: none; border-radius: 16px; padding: 18px 20px; } }
.rc-panell-cap { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; position: sticky; top: -14px; background: #fff; padding: 4px 0 8px; margin: -4px 0 8px; border-bottom: 1px solid var(--vora); z-index: 1; }
.rc-panell h2 { margin: 2px 0; font-size: 1.15rem; color: var(--verd-fosc); }
.rc-panell h3 { font-size: .95rem; margin: 16px 0 6px; color: var(--verd-fosc); text-transform: uppercase; letter-spacing: .03em; }
.rc-panell .bi-taula { font-size: .9rem; }
.rc-panell .bi-taula td, .rc-panell .bi-taula th { padding: 7px 6px; }
.rc-denuncia { display: inline-flex; align-items: center; gap: 4px; font-size: .8rem; font-weight: 700; color: #8a1f1f; background: var(--error-fons); border: 1px solid var(--error-vora); border-radius: 999px; padding: 4px 9px; text-decoration: none; white-space: nowrap; min-height: 32px; }
.rc-denuncia:hover { background: #f9d9d9; }
.rc-kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 8px 0; }
@media (min-width: 480px) { .rc-kpis { grid-template-columns: repeat(4, 1fr); } }
.rc-kpi { background: var(--fons); border-radius: 10px; padding: 8px 10px; }
.rc-kpi b { display: block; font-size: 1.3rem; color: var(--verd-fosc); line-height: 1.2; }
.rc-kpi span { font-size: .75rem; color: var(--text-2); }
.rc-fonts { margin-top: 4px; }
.rc-fonts-llista { margin: 0 0 10px; padding-left: 18px; font-size: .9rem; color: var(--text-2); }
.rc-cobertura { display: inline-block; min-width: 46px; text-align: center; border-radius: 6px; padding: 1px 6px; font-weight: 700; font-size: .82rem; }
.rc-cob-alta { background: #e6f6ee; color: #0f5132; }
.rc-cob-mitja { background: #fff1c2; color: #6b4f00; }
.rc-cob-baixa { background: var(--error-fons); color: var(--error-text); }
.rc-buit { color: var(--text-2); font-style: italic; }

/* Panell en mòbil: el botó de denúncia passa sota el nom del recurs */
.rc-m-only { display: none; }
@media (max-width: 560px) {
  .rc-panell .bi-taula th:last-child, .rc-panell .bi-taula td:last-child { display: none; }
  .rc-m-only { display: inline-flex; margin-top: 6px; }
  .rc-panell .bi-taula small { display: none; }
}
.rc-panell:focus { outline: none; box-shadow: 0 -10px 40px rgba(0,0,0,.25); }
@media (min-width: 900px) { .rc-panell:focus { box-shadow: 0 8px 28px rgba(1, 92, 67, .25); } }
#bi-form h2:focus, .bi-pantalla h2:focus { outline: none; box-shadow: none; }
