/* =====================================================================
   Tema "boteco" — segue o cardápio do Boteco BenVindo:
   fundo branco, fios verdes em "L" nos cantos, títulos altos e
   condensados (Bebas Neue), itens em letra forte maiúscula (Rubik),
   preços em serifa (Libre Baskerville), amarelo das ilustrações
   (cadeira, copos), molduras tracejadas e faixa de azulejos.
   Só vale para páginas listadas em THEMES (assets/js/config.js).
   ===================================================================== */
.theme-boteco {
  --b-teal: #55a08f;          /* verde exato do cardápio */
  --b-teal-dark: #2f7d6c;     /* versão escura para texto branco legível */
  --b-mint: #c9e4ce;          /* faixas claras do cardápio */
  --b-mint-soft: #eef7f1;
  --b-sage: #a8c7bf;
  --b-yellow: #ffb02a;        /* amarelo da cadeira e dos copos */
  --b-ink: #1c1c1c;
  --b-ink-2: #4a4a4a;
  --b-title: 'Bebas Neue', 'League Gothic', Impact, 'Arial Narrow', sans-serif;
  --b-text: 'Rubik', system-ui, sans-serif;
  --b-serif: 'Libre Baskerville', Georgia, serif;
  --muted: var(--b-ink-2);
  --ink-2: var(--b-ink-2);
  color: var(--b-ink);
  font-family: var(--b-text);
}

/* Fundo branco com a faixa de azulejos no rodapé */
.theme-boteco.pub-body {
  background:
    url('/assets/img/azulejo.svg') bottom center / 48px 48px repeat-x,
    #fff;
}
.theme-boteco .pub-wrap { position: relative; padding-top: 34px; padding-bottom: 76px; }

/* Fios em "L" nos cantos de cima, iguais aos do cardápio */
.theme-boteco .pub-wrap::before,
.theme-boteco .pub-wrap::after {
  content: ''; position: absolute; top: 10px; width: 44%; max-width: 230px; height: 180px; pointer-events: none;
}
.theme-boteco .pub-wrap::before {
  left: 10px;
  background:
    linear-gradient(var(--b-teal), var(--b-teal)) left top / 100% 7px no-repeat,
    linear-gradient(var(--b-teal), var(--b-teal)) left top / 7px 100% no-repeat,
    linear-gradient(var(--b-teal), var(--b-teal)) left 22px top 20px / 52% 6px no-repeat,
    linear-gradient(var(--b-teal), var(--b-teal)) left 18px top 26px / 6px 60% no-repeat;
  border-radius: 4px;
}
.theme-boteco .pub-wrap::after {
  right: 10px;
  background:
    linear-gradient(var(--b-teal), var(--b-teal)) right top / 100% 7px no-repeat,
    linear-gradient(var(--b-teal), var(--b-teal)) right top / 7px 100% no-repeat,
    linear-gradient(var(--b-teal), var(--b-teal)) right 22px top 20px / 52% 6px no-repeat,
    linear-gradient(var(--b-teal), var(--b-teal)) right 18px top 26px / 6px 60% no-repeat;
}

/* Sem caixa: a própria página é a folha do cardápio */
.theme-boteco .pub-card {
  position: relative; z-index: 1;
  margin-top: 0; padding: 14px 6px 10px;
  background: transparent; border: 0; border-radius: 0; box-shadow: none; outline: 0;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}

/* Logotipo grande, solto, como no rodapé do cardápio */
.theme-boteco .pub-logo {
  position: static; transform: none; margin: 0 auto 2px;
  width: 200px; height: 200px; border-radius: 0;
  background: none; box-shadow: none; color: var(--b-teal);
  font-family: var(--b-title); font-weight: 400; font-size: 84px; letter-spacing: .02em;
}
.theme-boteco .pub-logo.has-img { background: none; }
.theme-boteco .pub-logo img { object-fit: contain; }

/* Nome: título do cardápio ("PORÇÕES", "DRINKS") */
.theme-boteco .pub-name {
  font-family: var(--b-title); font-weight: 400; text-transform: uppercase;
  font-size: clamp(42px, 12.5vw, 56px); line-height: .95; letter-spacing: .01em;
  color: var(--b-teal); margin: 0 0 4px;
}
/* Com logotipo, o nome escrito some (o logo já tem o nome); fica só para leitores de tela.
*/
.theme-boteco .pub-logo.has-img + .pub-name { position: relative; z-index: 1; font-size: 0; line-height: 0; color: transparent; margin: 0; }
.theme-boteco .pub-logo.has-img { width: 230px; height: 230px; margin-bottom: -16px; }

.theme-boteco .pub-desc {
  font-family: var(--b-text); font-weight: 500; text-transform: uppercase; letter-spacing: .02em;
  font-size: 13.5px; color: var(--b-ink-2); margin: 8px auto 4px;
}
.theme-boteco .pub-links { margin-top: 18px; gap: 14px; }

/* Botões: placas retrô, alternando verde e amarelo */
.theme-boteco .pub-link {
  --c: var(--b-teal-dark); --fg: #fff;
  min-height: 64px; gap: 14px; padding: 10px 16px 10px 10px;
  background: var(--c); color: var(--fg);
  border: 2.5px solid var(--b-ink); border-radius: 14px;
  box-shadow: 4px 4px 0 var(--b-ink);
  font-family: var(--b-text); font-weight: 700; font-size: 15.5px;
  text-transform: uppercase; letter-spacing: .03em;
}
/* Uma cor viva por botão: azul e amarelo das ilustrações do cardápio,
   verde do cardápio e cores fortes de boteco (todas legíveis) */
.theme-boteco .t-google_reviews { --c: #2457d6; }             /* azul "Brasilidade" */
.theme-boteco .t-wifi { --c: var(--b-yellow); --fg: var(--b-ink); } /* amarelo da cadeira */
.theme-boteco .t-instagram { --c: #c2255c; }                  /* framboesa */
.theme-boteco .t-whatsapp { --c: #13803f; }                   /* verde vivo */
.theme-boteco .t-menu { --c: #c43d0b; }                       /* laranja-tijolo */
.theme-boteco .t-location { --c: #c92a2a; }
.theme-boteco .t-website { --c: var(--b-teal-dark); }
.theme-boteco .t-facebook { --c: #1c4fbf; }
.theme-boteco .t-tiktok { --c: var(--b-ink); }
.theme-boteco .t-custom { --c: #7048e8; }
.theme-boteco .pub-link:hover { transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--b-ink); filter: none; }
.theme-boteco .pub-link:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 var(--b-ink); filter: none; }
.theme-boteco .pub-link:focus-visible { outline: 3px solid var(--b-teal); outline-offset: 3px; }
.theme-boteco .pub-link__icon {
  width: 42px; height: 42px; border-radius: 50%;
  background: #fff; color: var(--b-ink);
  border: 2px dashed var(--b-teal);
}
.theme-boteco .pub-link__icon .icon { width: 21px; height: 21px; }
.theme-boteco .pub-link__chev { color: var(--fg); opacity: .9; }
/* Ícone na cor do próprio botão (no amarelo, fica preto) */
.theme-boteco .pub-link .pub-link__icon { color: var(--c); border-color: var(--c); }
.theme-boteco .t-wifi .pub-link__icon { color: var(--b-ink); border-color: var(--b-ink); }
.theme-boteco .t-tiktok .pub-link__icon .icon { filter: none; }

/* Painel do Wi-Fi: moldura tracejada, como as fotos do cardápio */
.theme-boteco .wifi {
  margin-top: 16px; background: var(--b-mint-soft);
  border: 3px dashed var(--b-sage); border-radius: 14px;
  font-family: var(--b-text);
}
.theme-boteco .wifi__row { border-bottom-color: var(--b-sage); }
.theme-boteco .wifi__k { color: var(--b-teal-dark); font-weight: 700; letter-spacing: .1em; }
.theme-boteco .wifi__v { color: var(--b-ink); font-weight: 700; font-size: 17px; }
.theme-boteco .wifi__tip { color: var(--b-ink-2); }
.theme-boteco .chip,
.theme-boteco .wifi__qr-btn {
  background: #fff; border: 2px solid var(--b-ink); border-radius: 10px; box-shadow: 2px 2px 0 var(--b-ink);
  color: var(--b-ink); font-family: var(--b-text); font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
}
.theme-boteco .chip.is-done { background: var(--b-mint); color: var(--b-ink); border-color: var(--b-ink); }
.theme-boteco .wifi__qr svg { border: 2px solid var(--b-ink); border-radius: 10px; background: #fff; }

/* Mensagens e botão de tentar novamente */
.theme-boteco .pub-card--msg .pub-logo { width: 110px; height: 110px; }
.theme-boteco .pub-retry { background: var(--b-teal-dark); border: 2px solid var(--b-ink); border-radius: 12px; box-shadow: 3px 3px 0 var(--b-ink); font-family: var(--b-text); text-transform: uppercase; }

/* Carregamento */
.theme-boteco .skeleton { background: linear-gradient(90deg, #e3f0e8 25%, #f2f8f4 50%, #e3f0e8 75%); background-size: 200% 100%; }
.theme-boteco .pub-card--loading .pub-logo { width: 160px; height: 160px; box-shadow: none; }
.theme-boteco .sk-btn { border-radius: 14px; }

/* Rodapé */
.theme-boteco .pub-footer { position: relative; z-index: 1; margin-top: 26px; color: var(--b-ink-2); font-family: var(--b-text); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.theme-boteco .pub-footer .gac-mark {
  font-family: var(--b-title); font-size: 18px; letter-spacing: .12em;
  background: none; -webkit-text-fill-color: var(--b-teal); color: var(--b-teal);
}

@media (min-width: 720px) {
  .theme-boteco .pub-wrap { justify-content: flex-start; padding-top: 48px; }
  .theme-boteco .pub-card { margin-top: 0; }
}