/* ══════════════════════════════════════════════════════════════════════════
   identidade-360.css — a camada de identidade da PLATAFORMA, só na cópia.

   Carregada DEPOIS dos <style> da tela, redefine tokens que a tela já
   declara. Nenhum seletor novo, nenhuma regra de componente: só valores.
   É por isso que ela cabe em 40 linhas — a tela já tinha a camada de
   tokens pronta (381 usos de var() contra 241 hex no arquivo inteiro).

   ══ O QUE ESTA CAMADA NÃO TOCA, E POR QUÊ ═══════════════════════════════

   IDENTIDADE DO ESTABELECIMENTO. Nome e logo vêm de `state.config.nome` e
   `state.config.logo` (delivery_cliente_v3.html:1269-1284) e são escritos
   na barra, no herói, no título da aba e no favicon. Isso é da loja, não
   da plataforma, e continua exatamente como está. A prévia é o teste de
   que as duas identidades convivem: o verde da moldura é do 360, o nome e
   o logo no meio são da loja.

   COR COM SIGNIFICADO. Estas ficam como estão porque dizem um estado, não
   uma marca:
     --re  #DC2626  erro, cancelado
     --ye  #D97706  aviso, atenção
     --gr  #10B981  disponível / concluído  ← ver nota abaixo
     --pu  #7C3AED  a caminho
     --bl  #2563EB  informação

   ══ A DECISÃO MENOS ÓBVIA: --ac e --gr ══════════════════════════════════

   Hoje `--ac` (destaque da marca) e `--gr` (verde de sucesso) valem os dois
   #10B981. Eles colidem porque a marca do PLIN é verde — o acaso de a marca
   e o estado terem a mesma cor escondia que são duas ideias diferentes.

   Aqui `--ac` passa ao verde do 360 e `--gr` fica onde estava. O efeito é
   que "disponível" deixa de ser a cor da marca e passa a ser uma cor só
   sua. É proposta de separação, não correção de defeito — e é reversível
   numa linha.
   ══════════════════════════════════════════════════════════════════════════ */

:root{
  /* ── destaque da plataforma: era o verde do PLIN, passa ao verde do 360 ── */
  --ac:  #0B8048;   /* verde 360 (amostrado da marca) */
  --ac2: #075A40;   /* verde-fundo 360 — estado pressionado, fim de gradiente */

  /* ── tinta ────────────────────────────────────────────────────────────
     #1B1B17 é um quase-preto quente, do tempo em que o fundo era creme.
     #082028 é a tinta da marca 360: escura, levemente fria, e é ela que
     casa com o verde. */
  --tx:  #082028;

  /* ── neutros ──────────────────────────────────────────────────────────
     Os do PLIN puxam para o creme (#FAFAF7, #E7E5E0). Sob o verde do 360
     o creme amarela. Estes puxam de leve para o verde da própria marca —
     é a diferença entre um cinza escolhido e um cinza herdado. */
  --bg:  #F7FAF8;
  --s1:  #FDFDFD;
  --s2:  #F1F6F2;
  --s3:  #E9F1EB;
  --b1:  #DDE8E0;
  --b2:  #C3D5C8;
  --mu:  #5A6B60;
  --mu2: #8A9A90;
}

/* ── Aviso da prévia ───────────────────────────────────────────────────
   Fica fixo no rodapé porque a tela é longa: quem rolar até o fim de um
   cardápio de mentira precisa continuar sabendo que é de mentira. */
#previa-360-aviso{
  position:fixed; left:0; right:0; bottom:0; z-index:2147483647;
  display:flex; gap:8px; align-items:center; justify-content:center;
  flex-wrap:wrap;
  padding:7px 14px calc(7px + env(safe-area-inset-bottom,0px));
  background:#082028; color:#E6F6EC;
  font:600 11.5px/1.4 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  letter-spacing:.02em; text-align:center;
  box-shadow:0 -2px 12px rgba(8,32,40,.28);
  pointer-events:none;
}
#previa-360-aviso b{ color:#50A830; font-weight:800 }
#previa-360-aviso span{ opacity:.72; font-weight:500 }
/* A barra do carrinho da tela também é fixa no rodapé: sem esta folga uma
   cobre a outra no celular. */
body{ padding-bottom:34px !important }