/* =====================================================================
   Tema "represa" — Ronaldo Bar e Restaurante (Represa Bortolan).
   Alto padrão: represa ao anoitecer em tons frios (imagem de fundo),
   vidro escuro discreto, logo em círculo branco com aro prateado e
   botões coloridos em cápsula.
   Só vale para páginas listadas em THEMES (assets/js/config.js).
   ===================================================================== */
.theme-represa {
  --r-deep: #0b1a24;
  --r-silver: #c9d7de;
  --r-ink: #0b2230;
  --r-text: 'Montserrat', system-ui, sans-serif;
  --muted: #b8c7cf;
  --ink-2: #d5e0e6;
  color: #f2f6f8;
  font-family: var(--r-text);
}

/* Fundo: represa à noite, com morros, luzes da margem e reflexo na água */
.theme-represa.pub-body {
  background: #07141c url('/assets/img/represa-fundo.webp') center -150px / 100% auto no-repeat;
}
@media (min-aspect-ratio: 3/4) {
  .theme-represa.pub-body { background-size: cover; background-position: center 30%; }
}
.theme-represa .pub-wrap { position: relative; padding-top: 30px; padding-bottom: 40px; }

/* Cartão: vidro escuro, bem discreto, para não tirar a atenção */
.theme-represa .pub-card {
  margin-top: 150px;
  padding: 112px 18px 24px;
  background: linear-gradient(180deg, rgba(10, 26, 36, .38), rgba(10, 26, 36, .58));
  -webkit-backdrop-filter: blur(14px) saturate(1.1); backdrop-filter: blur(14px) saturate(1.1);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 30px;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* Logo em círculo branco com aro prateado, como a foto do perfil */
.theme-represa .pub-logo {
  width: 186px; height: 186px; border-radius: 50%;
  background: #fff; color: var(--r-ink);
  font-family: var(--r-text); font-weight: 700; font-size: 46px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .7), 0 0 0 9px rgba(201, 215, 222, .16), 0 0 0 10px rgba(255, 255, 255, .25), 0 22px 44px rgba(0, 0, 0, .5);
}
.theme-represa .pub-logo.has-img { background: #fff; }
/* A própria imagem é recortada em círculo: no celular com modo escuro forçado
   o logo continua redondo, sem cantos escuros */
.theme-represa .pub-logo img { width: 100%; height: 100%; padding: 0; object-fit: cover; border-radius: 50%; transform: scale(.94); }

/* Com logotipo, o nome escrito some (o logo já tem o nome); fica só para leitores de tela */
.theme-represa .pub-logo.has-img + .pub-name { font-size: 0; line-height: 0; color: transparent; margin: 0; }

.theme-represa .pub-name {
  font-family: var(--r-text); font-weight: 600; text-transform: uppercase; letter-spacing: .08em;
  font-size: clamp(20px, 5.6vw, 24px); line-height: 1.25; color: #fff; margin: 4px 0 6px;
}
.theme-represa .pub-desc {
  font-family: var(--r-text); font-weight: 500; font-size: 13px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--r-silver); margin: 2px auto 8px;
}
.theme-represa .pub-desc::before, .theme-represa .pub-desc::after { content: ' — '; opacity: .5; }
.theme-represa .pub-links { margin-top: 14px; gap: 12px; }

/* Botões: cápsulas com as cores aprovadas */
.theme-represa .pub-link {
  --c: #1d6fa3; --fg: #fff;
  min-height: 60px; border-radius: 999px; padding: 8px 20px 8px 8px;
  background: var(--c); color: var(--fg); border: 0;
  box-shadow: 0 10px 22px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .22), inset 0 -3px 0 rgba(0, 0, 0, .14);
  font-family: var(--r-text); font-weight: 600; font-size: 14.5px; text-transform: uppercase; letter-spacing: .07em;
}
.theme-represa .pub-link:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .22), inset 0 -3px 0 rgba(0, 0, 0, .14); }
.theme-represa .pub-link:active { transform: translateY(1px) scale(.99); filter: none; }
.theme-represa .pub-link:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.theme-represa .pub-link__icon { width: 44px; height: 44px; border-radius: 50%; background: #fff; color: var(--c); box-shadow: 0 2px 6px rgba(0, 0, 0, .15); }
.theme-represa .pub-link__icon .icon { width: 21px; height: 21px; }
.theme-represa .pub-link__chev { color: var(--fg); opacity: .85; }

.theme-represa .t-google_reviews { --c: #1d6fa3; }
.theme-represa .t-wifi { --c: #ffc93c; --fg: var(--r-ink); }
.theme-represa .t-instagram { --c: #d6336c; }
.theme-represa .t-whatsapp { --c: #1f8a4c; }
.theme-represa .t-menu { --c: #d63b30; }
.theme-represa .t-location { --c: #087f8c; }
.theme-represa .t-website { --c: #2c4a5e; }
.theme-represa .t-facebook { --c: #1c4fbf; }
.theme-represa .t-tiktok { --c: #10202b; }
.theme-represa .t-custom { --c: #087f8c; }
.theme-represa .t-wifi .pub-link__icon { color: var(--r-ink); }
.theme-represa .t-tiktok .pub-link__icon .icon { filter: none; }

/* Painel do Wi-Fi: vidro escuro */
.theme-represa .wifi { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .18); border-radius: 22px; font-family: var(--r-text); color: #fff; }
.theme-represa .wifi__row { border-bottom-color: rgba(255, 255, 255, .16); }
.theme-represa .wifi__k { color: var(--r-silver); font-weight: 600; letter-spacing: .14em; }
.theme-represa .wifi__v { color: #fff; font-weight: 600; }
.theme-represa .wifi__tip { color: #d5e0e6; }
.theme-represa .chip,
.theme-represa .wifi__qr-btn { font-size: 13px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; color: #fff; font-family: var(--r-text); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.theme-represa .chip.is-done { background: #1f8a4c; border-color: #1f8a4c; color: #fff; }
.theme-represa .wifi__qr svg { border: 0; border-radius: 16px; background: #fff; padding: 6px; }
.theme-represa .wifi__qr p { color: #d5e0e6; }

/* Mensagens, carregamento e rodapé */
.theme-represa .pub-card--msg .pub-desc::before, .theme-represa .pub-card--msg .pub-desc::after { content: none; }
.theme-represa .pub-retry { background: #fff; color: var(--r-ink); border-radius: 999px; font-family: var(--r-text); }
.theme-represa .skeleton { background: linear-gradient(90deg, rgba(255, 255, 255, .08) 25%, rgba(255, 255, 255, .16) 50%, rgba(255, 255, 255, .08) 75%); background-size: 200% 100%; }
.theme-represa .sk-btn { border-radius: 999px; }
.theme-represa .pub-card--loading .pub-logo { box-shadow: none; }
.theme-represa .pub-footer { margin-top: 24px; color: rgba(255, 255, 255, .7); font-family: var(--r-text); font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; }
.theme-represa .pub-footer .gac-mark { background: none; -webkit-text-fill-color: #fff; color: #fff; letter-spacing: .2em; }

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