/* A barra do menu (HTML de lib/cds-chrome.js) nas paginas de RESERVA e do PORTAL: /booking, /entrar,
   /minha-reserva e /reserva-solicitada.

   Na home e nas paginas geradas (blog, galeria, Sitio) a barra ja vem estilizada, pela home e por
   cds-blog.css. Estas quatro paginas nao carregam nenhum dos dois, e antes nem tinham barra: o
   /booking tinha um link "voltar", o portal um topo proprio so com a marca, o pedido recebido nada.
   Aqui entra so o que falta (a barra fixa, o logo e o espaco que ela ocupa). O painel, o botao do
   menu e a lista de links sao de cds-nav.css, que as paginas carregam em seguida.

   A barra mede 68 px (12 + 44 + 12): `body.com-barra` reserva esse espaco no alto, porque ela e fixa e
   nao ocupa lugar no fluxo. */

#navbar{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:12px max(24px,env(safe-area-inset-right)) 12px max(24px,env(safe-area-inset-left))}
/* O vidro mora no ::before (v10): com o filtro na <nav>, o painel do menu do celular não vira vidro. */
#navbar::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--vidro-escuro);
  -webkit-backdrop-filter:var(--vidro-blur);backdrop-filter:var(--vidro-blur);
  box-shadow:inset 0 -1px 0 var(--vidro-escuro-borda),var(--elev-3)}
@media(max-width:359px){
  #navbar{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
}

/* Duas assinaturas do manual, uma por vez (a 44 px o lockup pede 214 px e nao cabe ao lado do botao
   do menu em celular): a partir de 441 px o lockup, abaixo disso o simbolo. Nunca encolher a marca
   para caber: o espaco e que cede. */
.nav-logo{display:block;line-height:0}
.nav-logo img{height:44px;width:auto;display:block}
.nav-logo .nav-mark{display:none}
@media(max-width:440px){
  .nav-logo .nav-lockup{display:none}
  .nav-logo .nav-mark{display:block;border-radius:10px}
}

body.com-barra{padding-top:68px}