/* FlowZ · Painel: Busca em tudo (rota "busca"). Padrão startup: superfícies sólidas, roxo só no foco e no marcado, sem brilho. */

.sr-bar{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.sr-field{position:relative;display:flex;align-items:center;flex:1;min-width:0}
.sr-ico{position:absolute;left:18px;top:50%;transform:translateY(-50%);display:inline-flex;color:var(--text-3);pointer-events:none}
.sr-input{width:100%;height:58px;padding:0 18px 0 52px;border-radius:14px;border:1px solid var(--line-2);background:var(--surface);color:var(--text);font:500 18px/1 var(--sans);outline:none;transition:border-color .15s var(--ease)}
.sr-input::placeholder{color:var(--text-3)}
.sr-input:focus{border-color:var(--accent-ink)}
.sr-input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}
.sr-clear{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;border:1px solid var(--line-2);background:transparent;color:var(--text-2);cursor:pointer;transition:color .15s var(--ease),border-color .15s var(--ease)}
.sr-clear:hover{color:#fff;border-color:rgba(255,255,255,.22)}
.sr-clear[hidden]{display:none}

/* Chips de filtro: selecionado em branco cheio, o resto com borda neutra */
.sr-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.sr-chip{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:10px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text-2);font:500 14px/1 var(--sans);cursor:pointer;transition:background .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease)}
.sr-chip b{font:600 11.5px/1 var(--mono);color:var(--text-3)}
.sr-chip:hover{color:#fff;border-color:rgba(255,255,255,.22)}
.sr-chip.on{background:#fff;border-color:#fff;color:#111}
.sr-chip.on b{color:#555}
.sr-chips-skel{display:flex;gap:8px;width:100%}
.sr-chips-skel i{display:block;height:38px;width:96px;border-radius:10px}

/* Grupos: cartão sólido com linhas separadas por borda fina */
.sr-group{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:4px 0;margin-bottom:14px}
.sr-group-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px 8px}
.sr-group-title{margin:0;display:flex;align-items:center;gap:8px;font:600 12.5px/1 var(--sans);color:var(--text-2)}
.sr-group-title svg{color:var(--accent-ink)}
.sr-count{font:600 12px/1 var(--mono);color:var(--text-3);margin-left:auto}
.sr-group-head .p-btn{margin-left:4px}

.sr-item{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:center;gap:14px;width:100%;min-height:58px;padding:12px 18px;border:0;border-top:1px solid var(--line);background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background .15s var(--ease)}
.sr-list .sr-item:first-child{border-top:0}
.sr-item:hover{background:rgba(255,255,255,.03)}
.sr-item > svg{color:var(--text-3)}
.sr-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.sr-title{font:600 15px/1.3 var(--sans);color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-sub{font:400 13px/1.35 var(--sans);color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-hit{font:400 12.5px/1.35 var(--sans);color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-hit-lbl{font:600 12px/1 var(--sans);color:var(--accent-ink);margin-right:4px}
.sr-meta{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;font:400 13px/1.3 var(--sans);color:var(--text-2);font-variant-numeric:tabular-nums;max-width:46%}
.sr-money{font:600 13.5px/1 var(--mono);color:#fff}
.sr-date{font:500 12px/1 var(--mono);color:var(--text-2)}

/* Trecho que bateu: o termo marcado com fundo roxo suave, sem brilho */
.sr-results mark{background:rgba(255,255,255,.18);color:#fff;border-radius:4px;padding:0 2px}

/* Carregando: mesmo formato dos grupos e linhas */
.sr-skel-head{height:14px;width:30%;margin:14px 18px 12px}
.sr-skel-row{height:58px;margin:0 18px 1px;border-radius:12px}
.sr-skel .sr-group{padding-bottom:6px}

.sr-item:focus-visible,.sr-chip:focus-visible,.sr-clear:focus-visible{outline:2px solid var(--accent-ink);outline-offset:2px}

@media (prefers-reduced-motion:reduce){
  .sr-item,.sr-chip,.sr-clear,.sr-input{transition:none}
}
