/* Tokens da identidade da Prefeitura de Atibaia (Manual de Identidade Visual):
   Montserrat; preto 100K; cores extraídas do vetor do brasão/logotipo. Sem logotipo: texto PEA. */
:root{--preto:#231f20;--vermelho:#ed1c24;--verde:#00a650;--amarelo:#f7de3d;--amarelo-esc:#d7bb33;--cinza:#d1d3d4;
--bg:#fff;--fg:#231f20;--mudo:#6b6869;--linha:#d1d3d4;--card:#f6f6f6}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#161415;--fg:#f2f2f2;--mudo:#a9a6a7;--linha:#3a3637;--card:#232021}}
*{box-sizing:border-box}html,body{height:100%;margin:0}
body{font-family:Montserrat,system-ui,sans-serif;background:var(--bg);color:var(--fg);display:flex;flex-direction:column}
header{background:var(--preto);color:#fff;display:flex;align-items:center;gap:16px;padding:10px 16px}
header h1{font-weight:900;font-size:22px;letter-spacing:.08em;margin:0}
header small{font-weight:400;opacity:.8}
header .sp{flex:1}header button,header a{color:#fff;background:none;border:1px solid #fff5;border-radius:6px;padding:6px 10px;font:inherit;font-size:13px;cursor:pointer;text-decoration:none}
main{flex:1;display:flex;min-height:0}
aside{width:340px;max-width:100%;border-right:1px solid var(--linha);display:flex;flex-direction:column;min-height:0}
.filtros{padding:12px;border-bottom:1px solid var(--linha);display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--linha);background:var(--bg);color:var(--fg);border-radius:99px;padding:5px 10px;font:inherit;font-size:12px;cursor:pointer;display:flex;align-items:center;gap:6px}
.chip[aria-pressed=true]{background:var(--preto);color:#fff;border-color:var(--preto)}
.dot{width:10px;height:10px;border-radius:50%;border:1px solid #0006;display:inline-block}
#lista{overflow:auto;flex:1}
.item{display:flex;gap:10px;padding:10px 12px;border-bottom:1px solid var(--linha);cursor:pointer}
.item:hover{background:var(--card)}
.item img,.item .ph{width:84px;height:56px;object-fit:cover;border-radius:4px;background:var(--cinza);flex:none}
.item .ph{display:grid;place-items:center;font-size:11px;color:var(--mudo)}
.item b{font-size:13px}.item small{display:block;color:var(--mudo);font-size:12px}
.tag{font-size:11px;font-weight:700;border-radius:4px;padding:1px 6px;color:#fff}
.t-vazio{background:var(--mudo)}.t-vencida{background:var(--vermelho)}.t-vencendo{background:var(--amarelo-esc);color:#000}
#mapa{flex:1;min-width:0}
.ficha img{width:100%;border-radius:6px;margin:6px 0}
.ficha button,.ficha input{font:inherit;font-size:13px}
.ficha form{display:grid;gap:6px;margin-top:8px}
.ficha input{padding:6px;border:1px solid var(--linha);border-radius:4px}
.ficha .btn{background:var(--preto);color:#fff;border:0;border-radius:6px;padding:8px;cursor:pointer}
.pin{width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);border:2px solid #231f20;box-shadow:0 1px 4px #0006}
.pin.alerta{outline:3px solid var(--vermelho);outline-offset:1px}
.pin.off{background:var(--cinza)!important;opacity:.8}
@media(max-width:760px){main{flex-direction:column-reverse}aside{width:100%;height:42%;border-right:0;border-top:1px solid var(--linha)}}