/* ---- Visual leve: letra mais fina, menos borda, cartões mais calmos. Carregado por último. ---- */
html { font-size: 15px; }
:root { --borda: #e8ede8; --texto: #2b3640; --texto-suave: #6b7680; --raio: 10px; }
body { background: #f8faf8; }
h1, h2, h3 { font-weight: 500; }
h2 { font-size: 1.05rem; }
h3 { font-size: .95rem; color: var(--texto-suave); }

/* Topo e abas */
.topo { padding: .35rem 1rem; border-bottom: 1px solid var(--borda); }
.topo .logo { width: 46px; }
.topo .titulo strong { font-weight: 500; }
.nome-btn { font-weight: 500; }
.abas { padding: .2rem 1rem 0; }
.abas a { padding: .5rem .7rem; font-size: .92rem; border-bottom-width: 2px; }
.abas a[aria-current='page'] { font-weight: 500; }
.conteudo { padding: .75rem 1rem; gap: .75rem; }
.vista { gap: .75rem; }

/* Botões: finos e discretos */
.botao { padding: .5rem .9rem; font-weight: 500; font-size: .92rem; }
.botao.grande { padding: .7rem; font-size: 1rem; }
.botao.pequeno { padding: .35rem .65rem; font-size: .85rem; }
.botao.secundario { border: 1px solid #cfdccf; background: #fff; }
.botao.secundario:hover { background: var(--verde-claro); border-color: var(--verde); }
.botao.perigo { background: #fff; color: #b3261e; border: 1px solid #f0cfcb; }
.botao.perigo:hover { background: #fdf3f2; }
.mais summary { padding: .35rem .7rem; }

/* Campos */
input[type='password'], input[type='text'], select, textarea, input[type='search'], input[type='date'], input[type='time'] {
  padding: .5rem .6rem; border-radius: 8px; font-size: .92rem;
}
label { font-size: .85rem; }

/* Cartões e listas */
.item, .pedido-linha, .recolhivel, .marcar-pedido, .etapa, .cartao { box-shadow: none; border-color: var(--borda); }
.item { padding: .6rem .75rem; border-radius: 8px; gap: .25rem; }
.item strong, .pedido-linha strong { font-weight: 500; }
.pedido-linha { padding: .6rem .75rem; border-radius: 8px; gap: .15rem; }
.titulo-pedido, .grupo-pedido > summary, .todos > summary, .recolhivel > summary { font-weight: 500; }
.chip { font-weight: 400; background: #f0f5ee; padding: .05rem .5rem; font-size: .78rem; }
.alerta { background: #fdf5f4; }
.cotacao { background: #f6faf4; border-left-width: 2px; }
.recados { border-left-width: 2px; }

/* Números do painel */
.cartoes { gap: .4rem; }
.cartao-num { border: 1px solid transparent; background: #f1f7ee; padding: .5rem .7rem; }
.cartao-num b { font-size: 1.4rem; font-weight: 500; }
.cartao-num span { font-weight: 500; }
.cartao-num.ativo { border-color: #b9d8b0; }
.cartao-num.alerta { background: #fdf5f4; }
.pendencia b, .etapa b { font-weight: 500; }
.tabela th { background: #f3f7f1; font-weight: 500; }

/* Janelas */
.janela-topo { padding: .6rem 1rem; border-bottom: 1px solid var(--borda); }
.janela-corpo { padding: .75rem 1rem; }

/* Conversa (chat) */
.conversa { gap: .4rem; }
.msg { padding: .4rem .7rem; border-radius: 8px; border-left-width: 3px; border-color: var(--borda); border-left-color: #cfd8cf; gap: .05rem; }
.msg.gestor { background: #fafdf8; border-left-color: #a6e48c; }
.msg-quem { padding-bottom: .15rem; margin-bottom: .1rem; border-bottom-color: #f0f3f0; font-size: .8rem; }
.msg-quem b { font-weight: 500; }
.msg-hora { font-size: .75rem; }
.msg-linha { font-size: .85rem; }
.msg-rotulo { font-weight: 400; color: #8a949c; }
.msg-quem + .msg-linha .msg-valor { font-weight: 500; }
.dia { background: #eef4eb; font-size: .75rem; }

/* Escrever recado: pequeno, no fim da conversa, sem grudar na tela */
.caixa-recado { position: static; background: transparent; border-top: 0; padding: .3rem 0 0; margin-top: .2rem; gap: .35rem; }
.caixa-recado textarea { height: 2.3rem; min-height: 0; resize: vertical; padding: .4rem .6rem; }
.caixa-recado textarea:focus { height: 4.2rem; }
.caixa-recado-baixo { align-items: center; justify-content: flex-end; gap: .4rem; }
.caixa-recado-baixo select { width: auto; padding: .3rem .5rem; font-size: .82rem; }
.caixa-recado-baixo .botao { padding: .35rem .9rem; }
@media (min-width: 640px) {
  .caixa-recado { grid-template-columns: 1fr 1fr; }
  .caixa-recado > textarea, .caixa-recado > .caixa-recado-baixo, .caixa-recado > .erro { grid-column: 1 / -1; }
}
.caixa-filtros { padding: .4rem .7rem; border-radius: 8px; }
.caixa-filtros summary { font-weight: 500; font-size: .92rem; }

/* Anexos no chat */
.anexos { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .25rem; }
.anexo { display: inline-flex; align-items: center; gap: .35rem; font-size: .85rem; }
.anexo img { max-height: 90px; max-width: 140px; border-radius: 6px; display: block; }
.anexos-escolhidos { font-size: .8rem; opacity: .8; overflow-wrap: anywhere; }
.caixa-recado > .anexos-escolhidos { grid-column: 1 / -1; }
