/* Identidade visual do FoodEx (página inicial, painel e telas de conta). As lojas usam as cores delas. */
:root{--fx-verde:#127a47;--fx-verde-esc:#0d3b27;--fx-tinta:#10231a;--fx-mostarda:#f5b301;--fx-mostarda-esc:#b98400;--fx-creme:#faf7f0;--fx-linha:#e6dfd0;
  --fx-titulo:'Bricolage Grotesque',system-ui,-apple-system,"Segoe UI",sans-serif}
.marca{display:inline-flex;align-items:center;gap:8px;font:800 21px/1 var(--fx-titulo);letter-spacing:-.01em;color:var(--fx-tinta);text-decoration:none}
.marca .simb{width:30px;height:30px;border-radius:9px;background:var(--fx-verde-esc);display:flex;align-items:center;justify-content:center;flex:none}
.marca .simb svg{width:30px;height:30px}.marca b{color:var(--fx-verde);font-weight:800}
.marca.clara{color:var(--fx-creme)}.marca.clara b{color:var(--fx-mostarda)}.marca.clara .simb{box-shadow:inset 0 0 0 1.5px #ffffff2e} /* no fundo verde, um contorno claro separa o quadrado */
.marca.peq{font-size:15px;gap:6px}.marca.peq .simb{width:22px;height:22px;border-radius:6px}.marca.peq .simb svg{width:22px;height:22px}

/* logo grande do topo (página inicial): símbolo verde-escuro, "f" claro e seta amarela */
.marca.grande{font-size:36px;gap:14px;letter-spacing:-.025em}
.marca.grande .simb{width:56px;height:56px;border-radius:16px;background:var(--fx-verde-esc);box-shadow:0 10px 26px -10px #0009,inset 0 0 0 1.5px #ffffff2e;position:relative;transition:transform .25s}
.marca.grande .simb svg{width:56px;height:56px}
.marca.grande:hover .simb{transform:rotate(-6deg) scale(1.06)}
@media(max-width:560px){.marca.grande{font-size:28px;gap:10px}.marca.grande .simb,.marca.grande .simb svg{width:46px;height:46px}.marca.grande .simb{border-radius:13px}}

/* logo média (tela de entrar e recuperar senha) */
.marca.media{font-size:28px;gap:11px}.marca.media .simb{width:44px;height:44px;border-radius:13px;background:var(--fx-verde-esc);box-shadow:0 6px 16px -8px #0007}
.marca.media .simb svg{width:44px;height:44px}

/* símbolo novo (f com a seta e os riscos de velocidade): no fundo escuro fica solto, sem o quadrado */
.marca.clara .simb,.marca.clara.grande .simb,.marca.clara.media .simb{background:none;box-shadow:none;border-radius:0}
.marca.clara.grande .simb svg{width:60px;height:60px}.marca.clara.grande .simb{width:60px;height:56px}
@media(max-width:560px){.marca.clara.grande .simb,.marca.clara.grande .simb svg{width:50px;height:50px}}
.marca .simb{background:#06170e}