/* Atendimento · Cantina do Délio — mesma linguagem das compras e do fechamento */
.carregando{position:fixed;inset:0;display:grid;place-items:center;z-index:40}
.carregando .logo{width:150px;height:84px;background:url(img/logo-creme.webp) center/contain no-repeat;animation:respira 1.8s ease-in-out infinite}
@keyframes respira{50%{opacity:.45}}
.usuario{font-family:var(--texto);font-style:italic;color:var(--creme-2);font-size:1rem;margin-right:4px;white-space:nowrap}
@media (max-width:640px){.usuario{display:none}}

/* chave liga/desliga */
.chave{display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.chave input{position:absolute;opacity:0;pointer-events:none}
.trilho{width:44px;height:26px;border-radius:13px;background:rgba(246,239,226,.18);border:1px solid rgba(246,239,226,.3);position:relative;transition:background .2s var(--ease)}
.bola{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--creme);box-shadow:0 1px 3px rgba(0,0,0,.4);transition:transform .25s var(--ease)}
.chave input:checked+.trilho{background:#4f7d43;border-color:#8fbf7a}
.chave input:checked+.trilho .bola{transform:translateX(18px)}
.chave input:focus-visible+.trilho{outline:2px solid var(--ouro-2);outline-offset:3px}
.chave-txt{font-family:var(--maq);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--creme-2)}

/* abas */
.abas{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-bottom:0!important}
.abas::-webkit-scrollbar{display:none}
.abas button{flex:none;background:none;border:0;border-bottom:2px solid transparent;color:var(--creme-3);font-family:var(--maq);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;padding:.9em .9em .8em;display:flex;align-items:center;gap:.5em;transition:color .15s}
.abas button[aria-selected="true"]{color:var(--creme);border-bottom-color:var(--ouro-2)}
.abas button:hover{color:var(--creme)}
.cont{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--ouro);color:var(--tinta);font-size:.7rem;letter-spacing:0;font-weight:700}

.faixa{background:rgba(184,146,74,.16);border-bottom:1px solid rgba(214,180,110,.35);color:var(--creme);text-align:center;padding:.7em 16px;font-size:.95rem}
.faixa b{font-weight:500;color:var(--ouro-2)}

main.wrap{padding-top:18px;padding-bottom:40px}

/* conversas: lista + chat */
.conversas{display:grid;grid-template-columns:340px minmax(0,1fr);gap:18px;align-items:start}
.lista{display:grid;gap:8px;max-height:calc(100svh - 170px);overflow-y:auto;padding:2px 4px 2px 2px}
.item-conv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;text-align:left;width:100%;padding:12px 14px;border-radius:4px;border:1px solid rgba(246,239,226,.12);background:rgba(246,239,226,.05);color:var(--creme);transition:background .15s,border-color .15s}
.item-conv:hover{background:rgba(246,239,226,.09)}
.item-conv[aria-current="true"]{background:rgba(246,239,226,.14);border-color:rgba(214,180,110,.55)}
.item-conv .nome{font-family:var(--display);font-size:1.08rem;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item-conv .hora{font-family:var(--maq);font-size:.66rem;color:var(--creme-3);align-self:center}
.item-conv .ult{grid-column:1/-1;color:var(--creme-2);font-size:.92rem;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.item-conv.nao-lida .nome::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ouro-2);margin-left:8px;vertical-align:middle}
.etqs{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.etq{font-family:var(--maq);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;padding:.25em .6em;border-radius:2px;background:rgba(246,239,226,.1);color:var(--creme-2)}
.etq--atencao{background:var(--ouro);color:var(--tinta);font-weight:700}
.etq--humano{background:rgba(143,191,122,.2);color:#cfe6c4}
.lista .nada{color:var(--creme-3);font-style:italic;padding:18px 6px}

.chat,.sim{display:flex;flex-direction:column;border-radius:4px;height:calc(100svh - 170px);min-height:440px;overflow:hidden}
.chat-topo{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid rgba(107,30,35,.15);flex-wrap:wrap}
.quem{display:flex;flex-direction:column;gap:2px;min-width:0}
.quem strong{font-family:var(--display);font-weight:400;font-size:1.3rem;line-height:1.1}
.quem .rot{color:#8a6a4a;text-transform:none;letter-spacing:.04em;font-size:.74rem}
.voltar{display:none;background:none;border:0;font-size:2rem;line-height:1;color:var(--vinho);padding:0 6px 4px 0}
.bt--claro{background:transparent;color:var(--vinho);border:1px solid rgba(107,30,35,.4);box-shadow:none}
.alerta{background:rgba(184,146,74,.22);color:var(--tinta);padding:.6em 16px;font-size:.95rem;border-bottom:1px solid rgba(184,146,74,.4)}

.msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:8px;overscroll-behavior:contain}
.bolha{max-width:78%;padding:9px 13px 7px;border-radius:12px;font-size:1rem;line-height:1.42;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 1px 1px rgba(42,10,12,.12)}
.bolha small{display:block;font-family:var(--maq);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;opacity:.6;margin-top:3px}
.bolha.cliente{align-self:flex-start;background:#fff;color:var(--tinta);border-bottom-left-radius:3px}
.bolha.robo{align-self:flex-end;background:#f3e3c9;color:var(--tinta);border-bottom-right-radius:3px}
.bolha.equipe{align-self:flex-end;background:var(--vinho);color:var(--creme);border-bottom-right-radius:3px}
.nota{align-self:center;max-width:90%;text-align:center;font-family:var(--maq);font-size:.72rem;letter-spacing:.04em;color:#7a5c44;background:rgba(107,30,35,.07);padding:.4em .9em;border-radius:3px}
.digitando{align-self:flex-end;font-family:var(--texto);font-style:italic;color:#8a6a4a;font-size:.95rem}

.escrever{display:flex;gap:10px;align-items:flex-end;padding:12px 14px;border-top:1px solid rgba(107,30,35,.15);background:rgba(255,255,255,.35)}
.escrever textarea{flex:1;resize:none;min-height:48px;max-height:160px;border:1px solid rgba(107,30,35,.28);border-radius:3px;background:rgba(255,255,255,.75);padding:.6em .8em;font-size:1rem;color:var(--tinta);outline:none}
.escrever textarea:focus{border-color:var(--vinho);background:#fff;box-shadow:0 0 0 3px rgba(184,146,74,.35)}
.escrever .bt{min-height:48px}

.vazio-chat{display:grid;place-items:center;min-height:300px;color:var(--creme-3);font-style:italic;border:1px dashed rgba(246,239,226,.18);border-radius:4px}

.sugestoes{display:flex;gap:6px;flex-wrap:wrap;padding:0 14px 10px}
.sugestoes button{background:rgba(107,30,35,.07);border:1px solid rgba(107,30,35,.2);color:var(--vinho);border-radius:14px;padding:.35em .8em;font-size:.88rem;font-family:var(--texto)}
.sugestoes button:hover{background:rgba(107,30,35,.14)}

/* reservas */
.reservas{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.res{padding:18px 18px 14px;border-radius:4px;display:flex;flex-direction:column;gap:6px}
.res .quando{font-family:var(--display);font-size:1.4rem;line-height:1.15}
.res .linha{color:#5a4a3e}
.res .obs{font-style:italic;color:#6b5a4d}
.res .acoes{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.res .st{align-self:flex-start;font-family:var(--maq);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;padding:.3em .7em;border-radius:2px}
.st--pendente{background:var(--ouro);color:var(--tinta)}
.st--confirmada{background:#3d7a35;color:#fff}
.st--recusada{background:#a3343b;color:#fff}
.res.feita{opacity:.72}
.reservas .nada{color:var(--creme-3);font-style:italic}
.titulo-grupo{grid-column:1/-1;font-family:var(--maq);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ouro-2);margin-top:8px}

/* ficha */
.ficha{padding:22px;border-radius:4px}
.ficha h2{font-family:var(--display);font-weight:400;font-size:1.6rem}
.ficha .sub,.modal .sub{color:#6b5a4d;margin:4px 0 14px}
.ficha textarea,.modal textarea{width:100%;min-height:60svh;border:1px solid rgba(107,30,35,.28);border-radius:3px;background:rgba(255,255,255,.7);padding:.8em 1em;font-family:var(--maq);font-size:.9rem;line-height:1.5;color:var(--tinta);outline:none;resize:vertical}
.ficha textarea:focus,.modal textarea:focus{border-color:var(--vinho);background:#fff}
.acoes{display:flex;justify-content:flex-end;gap:10px;margin-top:12px}

/* modal */
.modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:16px;background:rgba(17,11,10,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.modal-caixa{width:100%;max-width:520px;padding:22px;border-radius:4px}
.modal h3{font-family:var(--display);font-weight:400;font-size:1.4rem}
.modal textarea{min-height:140px;font-family:var(--texto);font-size:1rem}

@media (max-width:860px){
  .conversas{grid-template-columns:1fr}
  .lista{max-height:none}
  .conversas.abriu .lista,.conversas.abriu .vazio-chat{display:none}
  .conversas:not(.abriu) .chat{display:none}
  .vazio-chat{display:none}
  .voltar{display:block}
  .chat,.sim{height:calc(100svh - 150px)}
  .bolha{max-width:88%}
  .chave-txt{display:none}
}

/* comentários */
.com-topo{display:flex;gap:18px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}
.com-topo h2{font-family:var(--display);font-weight:400;font-size:1.6rem;line-height:1.1}
.com-topo p{color:var(--creme-2);max-width:60ch;margin-top:4px}
.com-topo b{font-weight:500;color:var(--ouro-2)}
.modo-com{min-width:280px}
.chave-txt--sempre{display:inline!important;text-transform:none;letter-spacing:.02em;font-family:var(--texto);font-size:.95rem;line-height:1.3}
.com-teste{border-radius:4px;padding:4px 18px;margin-bottom:18px}
.com-teste summary{cursor:pointer;font-family:var(--maq);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--vinho);padding:12px 0}
.com-teste form{padding-bottom:16px;display:grid;gap:10px}
.campo{display:grid;gap:4px}
.campo .rot{color:#8a6a4a}
.campo textarea,.com textarea{width:100%;resize:vertical;border:1px solid rgba(107,30,35,.28);border-radius:3px;background:rgba(255,255,255,.7);padding:.6em .8em;font-size:1rem;color:var(--tinta);outline:none;font-family:var(--texto)}
.campo textarea:focus,.com textarea:focus{border-color:var(--vinho);background:#fff;box-shadow:0 0 0 3px rgba(184,146,74,.35)}
.coms{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}
.com{padding:16px 18px 14px;border-radius:4px;display:flex;flex-direction:column;gap:8px}
.com .post{font-size:.86rem;color:#7a6656;border-left:2px solid rgba(184,146,74,.6);padding-left:10px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.com .post a{color:var(--vinho)}
.com .autor{font-family:var(--maq);font-size:.78rem;color:var(--vinho)}
.com .texto{font-size:1.06rem;line-height:1.4;color:var(--tinta)}
.com .cab{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cat{font-family:var(--maq);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;padding:.25em .6em;border-radius:2px;background:rgba(107,30,35,.1);color:var(--vinho)}
.cat--reclamacao{background:#a3343b;color:#fff}.cat--spam{background:#555;color:#fff}.cat--reserva{background:var(--ouro);color:var(--tinta)}
.com .rot-resp{font-family:var(--maq);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#8a6a4a}
.com .publicada{background:rgba(61,122,53,.1);border-left:2px solid #3d7a35;padding:.5em .8em;color:var(--tinta)}
.com .erro{color:#9b2a31;font-size:.92rem}
.com.feito{opacity:.7}
.com .acoes{margin-top:2px;flex-wrap:wrap}
.coms .nada,.coms .titulo-grupo{grid-column:1/-1}
.coms .nada{color:var(--creme-3);font-style:italic}