:root {
  --bg: #f7f7f7;
  --bg-card: #fff;
  --border: #ebebeb;
  --text: #222;
  --text-muted: #717171;
  --accent: #e61e4d;
  --accent-hover: #c4184a;
  --max-w: 1920px;
  --radius: 12px;
  --radius-full: 9999px;
  --shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);
  --public-nav-bar-height: 52px;
  --header-offset: 80px;
  /* Barra pública (Alojamentos, …): personalize cor aqui — layout em nav.menu-bar > .wrap.menu-bar-inner + .menu-bar-links */
  --menu-bar-bg: linear-gradient(180deg, #ffffff 0%, #fffafb 42%, #fff5f8 100%);
  --menu-bar-border-color: rgba(230, 30, 77, 0.16);
  --menu-bar-shadow: 0 1px 3px rgba(0, 0, 0, 0.06),
    0 1px 0 rgba(230, 30, 77, 0.05);
  /* Altura real do cabeçalho fixo; atualizada por JS para o .header-spacer não ficar aquém da .header-bar */
  --chrome-header-spacer: 80px;
  --chrome-header-height: 80px;
  --header-logo-max-height: min(
    48px,
    calc(var(--chrome-header-height, 80px) - 2.25rem)
  );
  --header-logo-max-width: min(280px, 52vw);
}
/* Valor inicial até public-menu-bar-scroll.js medir nav.menu-bar; 88px criava barra/spacer mais altos que uma linha. */
@media (max-width: 720px) {
  :root {
    --public-nav-bar-height: 56px;
  }
}
@media (max-width: 720px) {
  :root {
    --header-logo-max-width: min(200px, 44vw);
    --header-logo-max-height: min(
      40px,
      calc(var(--chrome-header-height, 80px) - 2rem)
    );
  }
}
@media (max-width: 480px) {
  :root {
    --header-logo-max-height: min(
      36px,
      calc(var(--chrome-header-height, 80px) - 2rem)
    );
    --header-logo-max-width: min(168px, 40vw);
  }
}
/* Ver checkinall-home.css: não fixar --header-offset no body (medição JS em public-menu-bar-scroll.js). */
*,
*::before,
*::after {
  box-sizing: border-box;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* Âncoras (#servicos, …): evita saltos sob header fixo + ajustes repetidos do browser */
html {
  scroll-padding-top: calc(
    var(--header-offset, 72px) + var(--public-nav-bar-height, 52px) + 12px
  );
  max-width: 100%;
  overflow-x: clip;
}
body {
  font-family:
    system-ui,
    -apple-system,
    sans-serif;
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
  overflow-x: clip;
  max-width: 100%;
}
.wrap {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 1.25rem;
}
main {
  max-width: var(--max-w);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}

.ci-site-chrome-stack {
  display: contents;
}

/* Header: fixo; ao scroll esconde-se e fica só o menu-bar visível */
/* Cabeçalho fixo centrado: largura máx. --max-w (1920px), alinhado ao main/footer */
.header-bar {
  position: fixed;
  top: 0;
  left: 50%;
  right: auto;
  width: min(100%, var(--max-w));
  max-width: var(--max-w);
  transform: translateX(-50%);
  z-index: 100;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  transition: transform 0.32s cubic-bezier(0.32, 0.72, 0, 1);
  will-change: transform;
  box-sizing: border-box;
  overflow: visible;
}
body.header-hidden .header-bar {
  transform: translate(-50%, -100%);
}
.header-spacer {
  height: var(--chrome-header-spacer, var(--header-offset, 80px));
  /* Sem transição de altura: animar o spacer durante scroll altera scrollHeight e causa “tremer”. */
  transition: none;
  flex-shrink: 0;
}
body.header-hidden .header-spacer {
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden;
}
/* Ecrã inteiro: oculta barra Pro + cabeçalho; navegação na gaveta esquerda */
body.platform-header-collapsed .header-bar {
  transform: translate(-50%, -100%);
  pointer-events: none;
}
body.platform-header-collapsed .header-spacer {
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden;
}
/* Opt-in legado: redundante com body.header-hidden .header-spacer (mantido por compatibilidade). */
body[data-ci-collapse-chrome-header-spacer-on-hide="1"].header-hidden
  .header-spacer {
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden;
}

/* Menu público (Alojamentos, Experiências…): fixo por baixo do header; visível no load; esconde ao scroll ↓, mostra ao scroll ↑ */
nav.menu-bar {
  position: fixed;
  left: 50%;
  right: auto;
  width: min(100%, var(--max-w));
  max-width: var(--max-w);
  transform: translateX(-50%);
  top: var(--header-offset, var(--chrome-header-spacer, 80px));
  margin-top: 0;
  z-index: 99;
  box-sizing: border-box;
  min-height: 0;
  background: var(--menu-bar-bg, var(--bg-card));
  border-bottom: 1px solid var(--menu-bar-border-color, var(--border));
  padding: 0.35rem 0;
  box-shadow: var(--menu-bar-shadow, 0 1px 3px rgba(0, 0, 0, 0.06));
  /* Só animar transform (retrair menu). top muda com header-hidden sem transição — evita jitter com scroll */
  transition:
    transform 0.28s cubic-bezier(0.32, 0.72, 0, 1),
    box-shadow 0.2s ease;
  will-change: transform;
  backface-visibility: hidden;
}
body.header-hidden nav.menu-bar,
body.platform-header-collapsed nav.menu-bar {
  top: max(0px, env(safe-area-inset-top, 0px));
}
body.public-menu-bar--retracted nav.menu-bar {
  transform: translate(-50%, -100%);
  pointer-events: none;
  box-shadow: none;
}
/* Altura estável: não colapsar com menu retrátil (só transform no nav) — evita jitter de scroll. */
.menu-bar-spacer {
  height: var(--public-nav-bar-height);
  flex-shrink: 0;
  transition: none;
  pointer-events: none;
}
/* Não zerar .menu-bar-spacer em .public-menu-bar--retracted: height 0 alterava scrollHeight/scrollY
       e reforçava “tremer” com header-hidden + scroll (mesmo padrão que .header-spacer). */

body.platform-header-collapsed .platform-nav-fab {
  display: flex !important;
}
.platform-nav-fab {
  display: none;
  position: fixed;
  top: 12px;
  /* Alinhar ao mesmo eixo do header (centrado com max-width 1920px) */
  left: max(
    12px,
    env(safe-area-inset-left, 0px),
    calc((100vw - var(--max-w)) / 2 + 12px)
  );
  z-index: 150;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-card);
  color: var(--text);
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  transition:
    background 0.2s,
    color 0.2s,
    border-color 0.2s;
}
.platform-nav-fab:hover {
  background: var(--bg);
  color: var(--accent);
  border-color: rgba(230, 30, 77, 0.35);
}
.platform-nav-fab svg {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
}
/* Quando o FAB está dentro de nav.menu-bar (index ou após relocate no JS): à esquerda de Alojamentos, não no canto do ecrã */
nav.menu-bar .wrap > .platform-nav-fab {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  flex-shrink: 0;
  align-self: center;
  z-index: 2;
  margin-inline-end: 0.35rem;
}

/* Logo fixo no canto: restaurar cabeçalho (ecrã inteiro ou header oculto ao scroll) */
.header-restore-logo-btn {
  display: none !important;
  position: fixed;
  top: calc(10px + env(safe-area-inset-top, 0px));
  /* Alinhar ao mesmo eixo do header (centrado com max-width 1920px) */
  left: max(
    10px,
    env(safe-area-inset-left, 0px),
    calc((100vw - var(--max-w)) / 2 + 10px)
  );
  z-index: 157;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: min(132px, 38vw);
  height: 40px;
  padding: 4px 8px;
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-card);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition:
    background 0.2s,
    border-color 0.2s,
    box-shadow 0.2s;
}
.header-restore-logo-btn:hover {
  background: var(--bg);
  border-color: rgba(230, 30, 77, 0.35);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.14);
}
.header-restore-logo-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.header-restore-logo-btn img {
  display: block;
  max-height: 26px;
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: left center;
  pointer-events: none;
}
body.platform-header-collapsed.user-logged-in .header-restore-logo-btn,
body.header-hidden.user-logged-in .header-restore-logo-btn {
  display: inline-flex !important;
}
body.platform-header-collapsed.user-logged-in
  nav.menu-bar
  > .wrap
  > .platform-nav-fab {
  margin-inline-start: min(140px, 34vw);
}

/* Webmaster (/webmaster/ com shell): logo na mesma faixa que a barra escura, à esquerda do título */
body.platform-header-collapsed.wm-with-ci-chrome.user-logged-in
  .header-restore-logo-btn {
  top: calc(
    max(0px, env(safe-area-inset-top, 0px)) + var(--public-nav-bar-height, 52px) +
      0.45rem
  );
}
body.platform-header-collapsed.wm-with-ci-chrome.user-logged-in
  .wm-shell-header {
  padding-left: max(1rem, calc(8px + min(140px, 36vw)));
}

/* Faixa “gaveta” no topo: puxar para baixo para mostrar o cabeçalho (ecrã inteiro) */
.header-pull-tab {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 154;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-height: 36px;
  padding: 6px 12px 8px;
  margin: 0;
  border: none;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.97) 0%,
    rgba(247, 247, 247, 0.92) 55%,
    transparent 100%
  );
  cursor: grab;
  font-family: inherit;
  touch-action: none;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}
.header-pull-tab:active {
  cursor: grabbing;
}
body.platform-header-collapsed.user-logged-in .header-pull-tab:not([hidden]) {
  display: flex;
}
/* Evita cobrir o menu público (Alojamentos, Marketplace…): z-index 154 ficava por cima do .menu-bar (99) */
body.platform-header-collapsed.user-logged-in:not(.public-menu-bar--retracted)
  .header-pull-tab {
  top: calc(env(safe-area-inset-top, 0px) + var(--public-nav-bar-height));
}
.header-pull-tab-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  pointer-events: none;
}
.header-pull-handle {
  width: 40px;
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, #d1d5db, #9ca3af, #d1d5db);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}
.header-pull-hint {
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
/* Desktop: handle + texto só no hover — faixa continua clicável/draggable (overlap limpo) */
@media (hover: hover) and (pointer: fine) {
  .header-pull-tab .header-pull-handle,
  .header-pull-tab .header-pull-hint {
    opacity: 0;
    transition: opacity 0.22s ease;
  }
  .header-pull-tab:hover .header-pull-handle,
  .header-pull-tab:hover .header-pull-hint,
  .header-pull-tab:focus-visible .header-pull-handle,
  .header-pull-tab:focus-visible .header-pull-hint {
    opacity: 1;
  }
}
body.platform-drawer-open .header-pull-tab {
  opacity: 0.35;
  pointer-events: none;
}
body.platform-drawer-open .header-restore-logo-btn {
  opacity: 0.35;
  pointer-events: none;
}

.platform-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 160;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}
body.platform-drawer-open .platform-drawer-overlay {
  opacity: 1;
  visibility: visible;
}
.platform-drawer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  max-width: min(360px, 92vw);
  height: 100vh;
  height: 100dvh;
  background: var(--bg-card);
  z-index: 161;
  box-shadow: 8px 0 32px rgba(0, 0, 0, 0.14);
  transform: translateX(-100%);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
body.platform-drawer-open .platform-drawer {
  transform: translateX(0);
}
.platform-drawer-head {
  flex-shrink: 0;
  padding: 1rem 1.1rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}
.platform-drawer-head h2 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text);
}
.platform-drawer-head p {
  margin: 0.25rem 0 0;
  font-size: 0.8rem;
  color: var(--text-muted);
  line-height: 1.4;
}
.platform-drawer-close {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  border-radius: 50%;
  cursor: pointer;
  color: var(--text-muted);
  font-size: 1.4rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.platform-drawer-close:hover {
  background: var(--bg);
  color: var(--text);
}
.platform-drawer-restore {
  display: block;
  width: calc(100% - 2rem);
  margin: 0.75rem 1rem 0;
  padding: 0.55rem 0.85rem;
  font-size: 0.85rem;
  font-weight: 600;
  font-family: inherit;
  color: #fff;
  background: var(--accent);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-align: center;
}
.platform-drawer-restore:hover {
  background: var(--accent-hover);
}
.platform-drawer-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem 0 1.25rem;
  -webkit-overflow-scrolling: touch;
}
.platform-drawer .nav-section-title {
  padding: 0.65rem 1.15rem 0.35rem;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.platform-drawer a.nav-row {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.65rem 1.15rem;
  color: var(--text);
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 500;
  border-left: 3px solid transparent;
  transition:
    background 0.15s,
    border-color 0.15s,
    color 0.15s;
}
.platform-drawer a.nav-row:hover {
  background: var(--bg);
  color: var(--accent);
}
.platform-drawer a.nav-row svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  opacity: 0.85;
}
.platform-drawer a.nav-row.nav-row--sub {
  padding-left: 2.35rem;
  font-size: 0.88rem;
  color: var(--text-muted);
}
.platform-drawer a.nav-row.nav-row--sub:hover {
  color: var(--accent);
}
body:not(.user-is-pro) .platform-drawer-pro-only {
  display: none !important;
}
body:not(.app-nav-mode-webmaster) .platform-drawer-wm-only {
  display: none !important;
}
body.app-nav-mode-webmaster .platform-drawer-admin-modules {
  display: none !important;
}
.header-left-cluster {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex: 1;
  min-width: 0;
}
.header-zen-toggle {
  flex-shrink: 0;
}
.header-zen-toggle-wrap {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  vertical-align: middle;
}
.header-zen-toggle-wrap .header-zen-tooltip {
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  z-index: 260;
  width: min(300px, calc(100vw - 28px));
  padding: 0.65rem 0.85rem;
  /* Fundo opaco + isolamento evitam texto “fantasma” / sobreposição com o conteúdo por baixo */
  background-color: var(--bg-card, #fff);
  background-clip: padding-box;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow:
    0 10px 32px rgba(0, 0, 0, 0.14),
    0 0 0 1px rgba(0, 0, 0, 0.05);
  font-size: 0.8125rem;
  line-height: 1.45;
  text-align: left;
  font-weight: 400;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-4px);
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease;
  isolation: isolate;
  -webkit-font-smoothing: antialiased;
}
.header-zen-toggle-wrap .header-zen-tooltip strong {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  margin: 0 0 0.4rem;
  line-height: 1.3;
  color: var(--text);
}
.header-zen-tooltip .header-zen-tooltip-body {
  display: block;
  margin: 0;
  line-height: 1.5;
  overflow-wrap: break-word;
  word-wrap: break-word;
  font-weight: 400;
}
.header-zen-toggle-wrap:hover .header-zen-tooltip,
.header-zen-toggle-wrap:focus-within .header-zen-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.header-zen-tooltip .header-zen-tooltip-never {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-top: 0.65rem;
  padding-top: 0.55rem;
  border-top: 1px solid var(--border);
  cursor: pointer;
  font-size: 0.8rem;
  color: var(--text-muted);
  font-weight: 500;
}
.header-zen-tooltip .header-zen-tooltip-never input {
  margin-top: 0.2rem;
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent, #e61e4d);
}
/* Enquanto o ecrã inteiro está activo ou após clicar, esconder o informativo */
.header-zen-toggle-wrap.is-zen-tip-dismissed .header-zen-tooltip,
.header-zen-toggle-wrap.is-zen-tip-dismissed:hover .header-zen-tooltip,
.header-zen-toggle-wrap.is-zen-tip-dismissed:focus-within .header-zen-tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(-4px);
}
/* Opção “não voltar a mostrar” (persistente) */
.header-zen-toggle-wrap.is-zen-tip-no-show .header-zen-tooltip,
.header-zen-toggle-wrap.is-zen-tip-no-show:hover .header-zen-tooltip,
.header-zen-toggle-wrap.is-zen-tip-no-show:focus-within .header-zen-tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(-4px);
}
.header-left-cluster .icon-btn.header-zen-toggle {
  width: 48px;
  height: 48px;
}
.header-left-cluster .icon-btn.header-zen-toggle svg {
  width: 26px;
  height: 26px;
}
@media (max-width: 480px) {
  .header-zen-toggle-wrap .header-zen-tooltip {
    left: auto;
    right: 0;
    width: min(280px, calc(100vw - 20px));
  }
}
.header-left-cluster .icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: none;
  background: none;
  color: var(--text);
  cursor: pointer;
  border-radius: 50%;
  flex-shrink: 0;
}
.header-left-cluster .icon-btn:hover {
  background: var(--bg);
  color: var(--accent);
}
.header-left-cluster .icon-btn svg {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
}
.header-left-cluster .icon-btn[aria-pressed="true"] {
  color: var(--accent);
  background: rgba(230, 30, 77, 0.08);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
  row-gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  max-width: var(--max-w);
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}
.header-bar .header-logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 1;
  min-width: 0;
  max-height: var(--header-logo-max-height);
}
.header-bar .header-logo:hover {
  opacity: 0.9;
}
.header-bar .header-logo img {
  max-height: var(--header-logo-max-height);
  max-width: var(--header-logo-max-width);
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: left center;
  display: block;
}
.header-right {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
  row-gap: 0.35rem;
  min-width: 0;
  flex: 0 1 auto;
  max-width: 100%;
}
/* Ecrãs estreitos: evitar sobreposição logo / ícones / CTAs (flex + largura fixa dos botões). */
@media (max-width: 720px) {
  .header-inner {
    padding: 0.5rem 0.75rem;
    gap: 0.45rem;
    align-items: flex-start;
  }
  .header-left-cluster {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    align-items: center;
  }
  .header-bar .header-logo {
    max-width: min(var(--header-logo-max-width), calc(100vw - 11rem));
  }
  .header-right {
    justify-content: flex-end;
    flex: 1 1 100%;
    max-width: 100%;
  }
  .header-host-link,
  .header-login-link,
  button.header-host-link,
  button.header-login-link {
    font-size: 0.82rem;
    padding: 0.32rem 0.55rem;
  }
  .header-left-cluster .icon-btn {
    width: 38px;
    height: 38px;
  }
  .header-right .icon-btn {
    width: 38px;
    height: 38px;
  }
}
@media (max-width: 520px) {
  .header-inner {
    flex-direction: column;
    align-items: stretch;
    gap: 0.4rem;
  }
  .header-left-cluster {
    flex: none;
    width: 100%;
    justify-content: flex-start;
    gap: 0.25rem;
  }
  .header-bar .header-logo {
    max-width: min(var(--header-logo-max-width), calc(100% - 5.5rem));
  }
  .header-right {
    flex: none;
    width: 100%;
    justify-content: flex-start;
    padding-top: 0.35rem;
    border-top: 1px solid var(--border);
    gap: 0.35rem;
  }
}
.header-right .icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: none;
  background: none;
  color: var(--text);
  cursor: pointer;
  border-radius: 50%;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}
.header-right .icon-btn:hover {
  background: var(--bg);
  color: var(--accent);
}
.header-right .icon-btn svg {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.header-right .icon-btn .header-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
}
.header-right .icon-btn.has-avatar .header-avatar-img {
  display: block;
}
.header-right .icon-btn.has-avatar svg {
  display: none;
}
.header-right .icon-btn.badge::after {
  content: "";
  position: absolute;
  top: 6px;
  right: 6px;
  width: 10px;
  height: 10px;
  background: var(--accent);
  border-radius: 50%;
  border: 2px solid var(--bg-card);
}
/* Perfil logado: foto + ícone menu (sem nome visível) */
.header-right .icon-btn.header-profile-btn {
  width: auto;
  min-width: unset;
  max-width: unset;
  height: auto;
  min-height: unset;
  padding: 0.2rem 0.35rem;
  border-radius: 10px;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  overflow: visible;
}
.header-right .icon-btn.header-profile-btn .header-profile-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: auto;
}
.header-right .icon-btn.header-profile-btn .header-profile-avatar-wrap {
  position: relative;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: linear-gradient(135deg, #e8eef5 0%, #dce4ee 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.header-right .icon-btn.header-profile-btn .header-avatar-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
  z-index: 1;
}
.header-right .icon-btn.header-profile-btn.has-avatar .header-avatar-img {
  display: block;
}
.header-right .icon-btn.header-profile-btn .header-avatar-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: #000821;
}
.header-right .icon-btn.header-profile-btn.has-avatar .header-avatar-fallback {
  display: none;
}
.header-right .icon-btn.header-profile-btn .header-avatar-fallback svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.header-right .icon-btn.header-profile-btn .header-profile-menu-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #000821;
  opacity: 0.85;
}
.header-right .icon-btn.header-profile-btn .header-profile-menu-ico svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
}
.header-right .icon-btn.header-profile-btn:hover .header-profile-menu-ico {
  color: var(--accent);
  opacity: 1;
}
.header-right .icon-btn.header-profile-btn.badge::after {
  top: 2px;
  right: 2px;
}
/* Dropdown troca rápida de conta (sob o bloco perfil) */
.header-profile-dropdown-wrap {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  vertical-align: middle;
}
.header-profile-cluster {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35rem;
}
.header-right .header-account-select {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  max-width: min(11rem, 38vw);
  min-height: 34px;
  padding: 0.28rem 0.45rem 0.28rem 0.6rem;
  margin: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-card);
  color: #000821;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  flex-shrink: 1;
  min-width: 0;
  text-align: left;
  font-family: inherit;
  box-sizing: border-box;
  transition:
    border-color 0.15s,
    background 0.15s,
    color 0.15s;
  -webkit-appearance: none;
  appearance: none;
}
.header-right .header-account-select:hover {
  border-color: rgba(230, 30, 77, 0.35);
  background: var(--bg);
  color: var(--accent);
}
.header-right .header-account-select:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.header-right .header-account-select-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.header-right .header-account-select-chevron {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.8;
  transition: transform 0.2s ease;
}
body.header-account-dropdown-open
  .header-account-select
  .header-account-select-chevron {
  transform: rotate(180deg);
}
.header-account-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 272px;
  max-width: min(92vw, 320px);
  background: #fff;
  border-radius: 14px;
  box-shadow:
    0 14px 48px rgba(0, 0, 0, 0.14),
    0 0 0 1px rgba(0, 0, 0, 0.06);
  z-index: 260;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-6px);
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease;
}
body.header-account-dropdown-open .header-account-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}
.header-account-dropdown-inner {
  padding: 0.5rem 0 0;
  max-height: min(60vh, 360px);
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.header-account-dropdown-label {
  padding: 0.35rem 1rem 0.5rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #9ca3af;
}
.header-account-dropdown-list {
  overflow-y: auto;
  padding: 0 0.5rem;
  -webkit-overflow-scrolling: touch;
  flex: 1;
  min-height: 0;
}
.header-account-dropdown .header-dd-account-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  text-align: left;
  padding: 0.6rem 0.75rem;
  margin-bottom: 0.25rem;
  border: 1px solid #ececec;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  font-family: inherit;
  transition:
    border-color 0.15s,
    background 0.15s;
}
.header-account-dropdown .header-dd-account-row:hover {
  border-color: rgba(230, 30, 77, 0.35);
  background: rgba(230, 30, 77, 0.04);
}
.header-account-dropdown .header-dd-account-row.is-current {
  border-color: var(--accent);
  background: rgba(230, 30, 77, 0.08);
}
.header-account-dropdown .header-dd-account-row .acc-main {
  min-width: 0;
}
.header-account-dropdown .header-dd-account-row .acc-label {
  display: block;
  font-weight: 600;
  font-size: 0.88rem;
  color: #000821;
}
.header-account-dropdown .header-dd-account-row .acc-sub {
  display: block;
  font-size: 0.72rem;
  color: #6b7280;
  margin-top: 0.12rem;
}
.header-account-dropdown .header-dd-account-row .acc-radio {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
  flex-shrink: 0;
  pointer-events: none;
}
.header-account-dropdown-footer {
  padding: 0.5rem;
  border-top: 1px solid #ececec;
  margin-top: 0.25rem;
}
.header-account-dropdown-fullmenu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.65rem 0.85rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: #000821;
  background: #f9fafb;
  border: 1px solid #ececec;
  border-radius: 10px;
  cursor: pointer;
  font-family: inherit;
  transition:
    background 0.15s,
    border-color 0.15s,
    color 0.15s;
}
.header-account-dropdown-fullmenu:hover {
  background: #fff;
  border-color: rgba(230, 30, 77, 0.35);
  color: var(--accent);
}
.header-account-dropdown-fullmenu svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  flex-shrink: 0;
}
.header-account-dropdown-panel-link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  width: 100%;
  padding: 0.55rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: #4b5563;
  background: #f9fafb;
  border: 1px solid #ececec;
  border-radius: 10px;
  cursor: pointer;
  font-family: inherit;
  transition:
    background 0.15s,
    border-color 0.15s,
    color 0.15s;
  text-align: left;
}
.header-account-dropdown-panel-link:hover {
  background: #fff;
  border-color: rgba(230, 30, 77, 0.35);
  color: var(--accent);
}
.header-account-dropdown-panel-link svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Mensagens: envelope + badge (à esquerda do avatar) — só utilizadores com sessão */
.header-right .header-messages-btn {
  overflow: visible;
  color: #000821;
  text-decoration: none;
}
.header-right .header-messages-btn:hover {
  background: var(--bg);
  color: var(--accent);
}
.header-right .header-messages-btn svg {
  stroke-width: 1.75;
}
.header-right .header-msg-badge {
  position: absolute;
  top: -5px;
  right: -7px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: #d72323;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  font-family:
    system-ui,
    -apple-system,
    sans-serif;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid var(--bg-card);
  box-sizing: border-box;
  pointer-events: none;
}
.header-right .header-msg-badge.is-hidden {
  display: none !important;
}
/* Notificações (sino): painel + alerta de configuração de anúncios */
.header-right .header-notifications-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}
.header-right .header-notifications-btn {
  overflow: visible;
  color: #000821;
}
.header-right .header-notifications-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: min(18rem, 92vw);
  max-width: 22rem;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.12);
  z-index: 200;
  padding: 0;
}
.header-notifications-panel-inner {
  padding: 0.5rem 0;
  max-height: min(70vh, 320px);
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.header-notifications-head {
  padding: 0.35rem 0.85rem 0.5rem;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--accent);
}
.header-notifications-status {
  padding: 0.65rem 0.85rem;
  font-size: 0.8rem;
  color: #64748b;
  line-height: 1.4;
}
.header-notifications-item {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0.65rem 0.85rem;
  border: none;
  border-top: 1px solid var(--border);
  background: #fff7ed;
  color: #9a3412;
  font-size: 0.8125rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.header-notifications-item:hover {
  background: #ffedd5;
  color: #7c2d12;
}
.header-notifications-footer-link {
  display: block;
  padding: 0.55rem 0.85rem 0.35rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
  border-top: 1px solid var(--border);
}
.header-notifications-footer-link:hover {
  text-decoration: underline;
}
.header-right .header-notifications-badge {
  position: absolute;
  top: -5px;
  right: -7px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background: #d72323;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  font-family:
    system-ui,
    -apple-system,
    sans-serif;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid var(--bg-card);
  box-sizing: border-box;
  pointer-events: none;
}
.header-right .header-notifications-badge.is-hidden {
  display: none !important;
}
/* Sino de notificações na barra Pro quando o cabeçalho branco está recolhido */
.app-nav-notifications-slot {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  margin: 0 0.15rem 0 0.1rem;
  z-index: 3;
}
.app-nav-inner-admin .app-nav-notifications-slot {
  margin-left: auto;
}
.app-nav-notifications-slot .header-notifications-btn {
  width: 36px;
  height: 36px;
}
.app-nav-notifications-slot .header-notifications-panel {
  z-index: 280;
}
body.header-notifications-open .app-nav-bar {
  overflow: visible;
}
/* Calendário — entre mensagens e avatar; mesmo traço #000821 que o envelope */
.header-right .header-calendar-btn {
  display: none;
  color: #000821;
  text-decoration: none;
  overflow: visible;
  align-items: center;
  justify-content: center;
}
.header-right .header-calendar-btn:hover {
  background: var(--bg);
  color: var(--accent);
}
.header-right .header-calendar-btn svg {
  stroke-width: 1.75;
}
body.user-logged-in .header-right .header-calendar-btn {
  display: inline-flex;
}
/* Marketplace, notificações, CX, acesso rápido — à esquerda das mensagens */
.header-right .header-app-shortcuts {
  display: inline-flex;
  align-items: center;
  gap: 0.05rem;
  margin-right: 0.15rem;
}
.header-right .header-app-shortcuts .icon-btn {
  color: #000821;
  text-decoration: none;
  overflow: visible;
}
.header-right .header-app-shortcuts .icon-btn:hover {
  background: var(--bg);
  color: var(--accent);
}
.header-right .header-app-shortcuts .icon-btn svg {
  stroke-width: 1.75;
}
body:not(.user-is-pro) .header-app-shortcuts .header-cx-pro-only {
  display: none !important;
}
body.user-is-pro .header-app-shortcuts .header-cx-traveller-only {
  display: none !important;
}
@media (max-width: 720px) {
  .header-right .header-app-shortcuts .header-shortcut-hide-narrow {
    display: none !important;
  }
}

.quick-access-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 168;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.25s ease,
    visibility 0.25s ease;
}
body.quick-access-drawer-open .quick-access-overlay {
  opacity: 1;
  visibility: visible;
}
.quick-access-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  max-width: min(400px, 94vw);
  height: 100vh;
  height: 100dvh;
  background: #fff;
  z-index: 169;
  box-shadow: -8px 0 32px rgba(0, 0, 0, 0.14);
  transform: translateX(100%);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
body.quick-access-drawer-open .quick-access-drawer {
  transform: translateX(0);
}
.quick-access-search-wrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.65rem 0.75rem;
  background: #1a1a1a;
  color: #fff;
}
.quick-access-search-wrap .quick-access-search-ico {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  stroke: #fff;
  fill: none;
  stroke-width: 2;
  opacity: 0.9;
}
.quick-access-search-wrap input {
  flex: 1;
  min-width: 0;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 0.875rem;
  font-family: inherit;
  outline: none;
}
.quick-access-search-wrap input::placeholder {
  color: rgba(255, 255, 255, 0.45);
}
.quick-access-search-wrap .quick-access-search-x {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #fff;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.85;
}
.quick-access-search-wrap .quick-access-search-x:hover {
  background: rgba(255, 255, 255, 0.1);
  opacity: 1;
}
.quick-access-drawer-head {
  flex-shrink: 0;
  padding: 0.85rem 1rem 0.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.quick-access-drawer-head h2 {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #9ca3af;
}
.quick-access-drawer-head .quick-access-close {
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  border-radius: 50%;
  cursor: pointer;
  color: #6b7280;
  font-size: 1.5rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.quick-access-drawer-head .quick-access-close:hover {
  background: #f3f4f6;
  color: #111;
}
.quick-access-scroll {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 0 1rem;
}
.quick-access-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.7rem 1rem;
  color: #1f2937;
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 500;
  border: none;
  width: 100%;
  text-align: left;
  background: #fff;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.15s;
  box-sizing: border-box;
}
a.quick-access-row {
  cursor: pointer;
}
.quick-access-row:hover {
  background: #f9fafb;
  color: var(--accent);
}
.quick-access-row .qa-ico {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  opacity: 0.85;
}
.quick-access-row .qa-label {
  flex: 1;
  min-width: 0;
}
.quick-access-row.is-hidden {
  display: none !important;
}
.qa-row-wrap {
  display: flex;
  align-items: stretch;
  width: 100%;
  box-sizing: border-box;
}
.qa-row-wrap .quick-access-row {
  flex: 1;
  min-width: 0;
}
.qa-row-wrap .qa-remove {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #9ca3af;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  align-self: center;
  margin-right: 0.25rem;
}
.qa-row-wrap .qa-remove:hover {
  background: #fee2e2;
  color: #b91c1c;
}
.quick-access-empty {
  padding: 1.25rem 1rem;
  font-size: 0.88rem;
  color: #6b7280;
  text-align: center;
  line-height: 1.45;
}
.quick-access-footer {
  flex-shrink: 0;
  padding: 0.75rem 1rem 1.1rem;
  border-top: 1px solid var(--border);
  background: #fafafa;
}
.quick-access-footer .qa-restore {
  display: block;
  width: 100%;
  margin-bottom: 0.75rem;
  padding: 0.45rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-muted);
  background: transparent;
  border: 1px dashed var(--border);
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
}
.quick-access-footer .qa-restore:hover {
  color: var(--accent);
  border-color: rgba(230, 30, 77, 0.35);
}
.quick-access-add-title {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #9ca3af;
  margin: 0 0 0.5rem;
}
.quick-access-footer input {
  width: 100%;
  margin-bottom: 0.45rem;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.88rem;
  font-family: inherit;
  box-sizing: border-box;
}
.quick-access-footer input:focus {
  outline: none;
  border-color: rgba(230, 30, 77, 0.45);
}
.quick-access-footer .qa-add-btn {
  width: 100%;
  margin-top: 0.35rem;
  padding: 0.55rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: #fff;
  background: var(--accent);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
}
.quick-access-footer .qa-add-btn:hover {
  background: var(--accent-hover);
}
body:not(.user-logged-in) .quick-access-overlay,
body:not(.user-logged-in) .quick-access-drawer {
  display: none !important;
}

/* Menu utilizador (dropdown) */
.user-menu-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 200;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.2s,
    visibility 0.2s;
}
body.user-menu-open .user-menu-overlay {
  opacity: 1;
  visibility: visible;
}
.user-menu-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 360px;
  height: 100vh;
  background: var(--bg-card);
  box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);
  z-index: 201;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform 0.25s ease;
}
body.user-menu-open .user-menu-panel {
  transform: translateX(0);
}
.user-menu-panel .menu-head {
  padding: 1.25rem 1.25rem 0.75rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.user-menu-panel .menu-head-label {
  flex: 1;
  min-width: 0;
}
.user-menu-panel .menu-close {
  width: 40px;
  height: 40px;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--text);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.user-menu-panel .menu-close:hover {
  background: var(--bg);
  color: var(--accent);
}
.user-menu-panel .menu-close svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.user-menu-panel .menu-tabs {
  display: none;
  flex-direction: row;
  gap: 0;
  padding: 0 0.35rem;
  border-bottom: 1px solid var(--border);
  background: var(--bg-card);
}
body.user-logged-in .user-menu-panel .menu-tabs {
  display: flex;
}
.user-menu-panel .menu-tab {
  flex: 1;
  padding: 0.6rem 0.25rem;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  background: none;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--text-muted);
  cursor: pointer;
  font-family: inherit;
  line-height: 1.2;
  text-align: center;
}
@media (min-width: 340px) {
  .user-menu-panel .menu-tab {
    font-size: 0.78rem;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
  }
}
.user-menu-panel .menu-tab.is-active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}
.user-menu-panel .menu-tab:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
body:not(.user-logged-in) .user-menu-panel #user-menu-tabpanel-cxa {
  display: none !important;
}
.user-menu-panel .menu-cx-wrap {
  padding: 1rem 1.25rem 1.5rem;
}
.user-menu-panel .menu-cx-intro {
  font-size: 0.88rem;
  color: var(--text-muted);
  line-height: 1.45;
  margin: 0 0 1.1rem;
}
.user-menu-panel .menu-cx-section {
  margin-bottom: 1.25rem;
}
.user-menu-panel .menu-cx-section:last-child {
  margin-bottom: 0;
}
.user-menu-panel .menu-cx-section-head {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.65rem;
  flex-wrap: wrap;
}
.user-menu-panel .menu-cx-section-head .menu-cx-section-title {
  flex: 1;
  min-width: 0;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text);
}
.user-menu-panel .menu-cx-gift-icon {
  display: flex;
  color: var(--accent);
}
.user-menu-panel .menu-cx-gift-icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.user-menu-panel .menu-cx-ver-tudo {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
  white-space: nowrap;
}
.user-menu-panel .menu-cx-ver-tudo:hover {
  text-decoration: underline;
}
.user-menu-panel .menu-cx-feature-card {
  display: block;
  padding: 0.85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.user-menu-panel .menu-cx-feature-card:hover {
  border-color: rgba(230, 30, 77, 0.35);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}
.user-menu-panel .menu-cx-card-visual {
  display: flex;
  gap: 0.35rem;
  margin-bottom: 0.65rem;
  justify-content: flex-start;
}
.user-menu-panel .menu-cx-mini-cal {
  width: 28px;
  height: 32px;
  border-radius: 6px;
  background: #f3f4f6;
  font-size: 0.7rem;
  font-weight: 700;
  color: #6b7280;
  display: flex;
  align-items: center;
  justify-content: center;
}
.user-menu-panel .menu-cx-mini-cal.on {
  background: linear-gradient(135deg, #ccfbf1, #99f6e4);
  color: #0f766e;
}
.user-menu-panel .menu-cx-dots {
  display: flex;
  gap: 5px;
  margin-top: 0.5rem;
  justify-content: center;
}
.user-menu-panel .menu-cx-dots span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #e5e7eb;
}
.user-menu-panel .menu-cx-dots span:first-child {
  background: #0d9488;
}
.user-menu-panel .menu-cx-card-title {
  font-size: 0.92rem;
  font-weight: 700;
  margin: 0 0 0.35rem;
  color: var(--text);
}
.user-menu-panel .menu-cx-card-desc {
  font-size: 0.8rem;
  color: var(--text-muted);
  line-height: 1.4;
  margin: 0;
}
.user-menu-panel .menu-cx-help-card {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.75rem 0.85rem;
  margin-bottom: 0.5rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition:
    border-color 0.15s,
    background 0.15s;
}
.user-menu-panel .menu-cx-help-card:last-child {
  margin-bottom: 0;
}
.user-menu-panel .menu-cx-help-card:hover {
  border-color: rgba(230, 30, 77, 0.3);
  background: var(--bg);
}
.user-menu-panel button.menu-cx-help-card {
  width: 100%;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.user-menu-panel a.menu-cx-help-card.menu-cx-host-only {
  display: none;
}
body.user-is-host .user-menu-panel a.menu-cx-help-card.menu-cx-host-only {
  display: flex;
}
.user-menu-panel .menu-cx-help-ico {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(145deg, #f3f4f6, #e5e7eb);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.user-menu-panel .menu-cx-help-ico svg {
  width: 20px;
  height: 20px;
  stroke: #374151;
  fill: none;
  stroke-width: 2;
}
.user-menu-panel .menu-cx-help-text {
  min-width: 0;
}
.user-menu-panel .menu-cx-help-text strong {
  display: block;
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 0.15rem;
}
.user-menu-panel .menu-cx-help-text span {
  font-size: 0.78rem;
  color: var(--text-muted);
  line-height: 1.35;
}
.user-menu-panel .menu-section {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border);
}
.user-menu-panel .menu-section:last-of-type {
  border-bottom: none;
}
.user-menu-panel .menu-link {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.75rem 1.25rem;
  color: var(--text);
  text-decoration: none;
  font-size: 0.95rem;
  font-weight: 500;
  transition: background 0.15s;
}
.user-menu-panel .menu-link:hover {
  background: var(--bg);
  color: var(--accent);
}
.user-menu-panel .menu-link .menu-icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.user-menu-panel .menu-link .menu-badge {
  margin-left: auto;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  background: var(--accent);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.user-menu-panel .host-cta {
  margin: 1rem 1.25rem;
  padding: 1.25rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.user-menu-panel .host-cta .title {
  font-weight: 700;
  font-size: 1rem;
  color: var(--text);
  margin: 0 0 0.35rem;
}
.user-menu-panel .host-cta .desc {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin: 0;
  line-height: 1.45;
}
.user-menu-panel .host-cta a {
  color: var(--accent);
  font-weight: 600;
  text-decoration: none;
}
.user-menu-panel .host-cta a:hover {
  text-decoration: underline;
}
.user-menu-panel .menu-link-login {
  background: rgba(230, 30, 77, 0.08);
  color: var(--accent);
  font-weight: 600;
}
.user-menu-panel .menu-link-login:hover {
  background: rgba(230, 30, 77, 0.14);
  color: var(--accent-hover);
}
.user-menu-panel .menu-link-logout {
  margin-top: 0.25rem;
  border-top: 1px solid var(--border);
  padding-top: 0.85rem;
  color: var(--text-muted);
}
.user-menu-panel .menu-link-logout:hover {
  color: var(--accent);
  background: var(--bg);
}
.user-menu-panel .menu-link.menu-link--nest {
  padding: 0.5rem 1.25rem 0.5rem 2.35rem;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--text-muted);
  gap: 0.5rem;
}
.user-menu-panel .menu-link.menu-link--nest:hover {
  color: var(--accent);
}
.user-menu-panel .menu-subsection-title.menu-subsection-title--config-nested {
  margin-top: 0.35rem;
  padding-top: 0.65rem;
  border-top: 1px solid var(--border);
}

/* Menu: perfil, contas, referência, sessão (design CheckInAll) */
.user-menu-panel .menu-profile-block {
  display: none;
  padding: 1rem 1.25rem 1.25rem;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(
    180deg,
    rgba(230, 30, 77, 0.06) 0%,
    transparent 100%
  );
}
body.user-logged-in .user-menu-panel .menu-profile-block {
  display: block;
}
.user-menu-panel .menu-profile-card {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.user-menu-panel .menu-profile-avatar {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: linear-gradient(135deg, #0d9488, #0f766e);
  color: #fff;
  font-size: 1.35rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.user-menu-panel .menu-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.user-menu-panel .menu-profile-name {
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--text);
  margin: 0 0 0.2rem;
  line-height: 1.25;
}
.user-menu-panel .menu-profile-email {
  font-size: 0.82rem;
  color: var(--text-muted);
  margin: 0;
  word-break: break-all;
}
.user-menu-panel .menu-subsection-title {
  padding: 0.65rem 1.25rem 0.35rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.user-menu-panel .menu-accounts-block {
  display: none;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.5rem;
}
body.user-logged-in .user-menu-panel .menu-accounts-block {
  display: block;
}
.user-menu-panel .menu-accounts-filter {
  display: block;
  width: calc(100% - 2.5rem);
  margin: 0 1.25rem 0.65rem;
  padding: 0.5rem 0.65rem 0.5rem 2rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.88rem;
  font-family: inherit;
  background: var(--bg-card)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23717171' stroke-width='2'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='M11 11l3 3'/%3E%3C/svg%3E")
    no-repeat 0.55rem 50%;
  box-sizing: border-box;
}
.user-menu-panel .menu-accounts-filter:focus {
  outline: none;
  border-color: var(--accent);
}
.user-menu-panel .menu-accounts-list {
  max-height: 200px;
  overflow-y: auto;
  padding: 0 0.75rem;
}
.user-menu-panel .menu-account-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  text-align: left;
  padding: 0.65rem 0.85rem;
  margin-bottom: 0.35rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-card);
  cursor: pointer;
  font-family: inherit;
  transition:
    border-color 0.15s,
    background 0.15s;
}
.user-menu-panel .menu-account-row:hover {
  border-color: rgba(230, 30, 77, 0.35);
  background: rgba(230, 30, 77, 0.04);
}
.user-menu-panel .menu-account-row.is-current {
  border-color: var(--accent);
  background: rgba(230, 30, 77, 0.08);
}
.user-menu-panel .menu-account-row .acc-main {
  min-width: 0;
}
.user-menu-panel .menu-account-row .acc-label {
  display: block;
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--text);
}
.user-menu-panel .menu-account-row .acc-sub {
  display: block;
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-top: 0.15rem;
}
.user-menu-panel .menu-account-row .acc-radio {
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
  flex-shrink: 0;
  pointer-events: none;
}
.user-menu-panel .menu-referral-block {
  display: none;
  padding: 0.75rem 1.25rem 1rem;
  border-bottom: 1px solid var(--border);
}
body.user-logged-in .user-menu-panel .menu-referral-block {
  display: block;
}
.user-menu-panel .menu-referral-card {
  padding: 1rem;
  border-radius: var(--radius);
  border: 1px solid rgba(230, 30, 77, 0.2);
  background: linear-gradient(
    135deg,
    rgba(230, 30, 77, 0.07) 0%,
    rgba(13, 148, 136, 0.06) 100%
  );
}
.user-menu-panel .menu-referral-card .ref-title {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--text);
  margin: 0 0 0.5rem;
  line-height: 1.35;
}
.user-menu-panel .menu-referral-card .ref-text {
  font-size: 0.82rem;
  color: var(--text-muted);
  margin: 0 0 0.75rem;
  line-height: 1.45;
}
.user-menu-panel .menu-referral-card .ref-link {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}
.user-menu-panel .menu-referral-card .ref-link:hover {
  text-decoration: underline;
}
.user-menu-panel .menu-session-block {
  display: none;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
}
body.user-logged-in .user-menu-panel .menu-session-block {
  display: block;
}
.user-menu-panel .menu-session-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}
.user-menu-panel .menu-session-label {
  font-weight: 600;
  font-size: 0.92rem;
  color: var(--text);
  margin: 0 0 0.35rem;
}
.user-menu-panel .menu-session-hint {
  font-size: 0.78rem;
  color: var(--text-muted);
  margin: 0.35rem 0 0;
  line-height: 1.45;
}
/* Nota longa: visível ao passar o rato / foco no interruptor (em ecrãs com hover); touch mostra sempre */
@media (hover: hover) and (pointer: fine) {
  .user-menu-panel .menu-session-hint {
    display: none;
    margin: 0;
  }
  .user-menu-panel .menu-session-row:hover .menu-session-hint,
  .user-menu-panel .menu-session-row:focus-within .menu-session-hint {
    display: block;
    margin-top: 0.35rem;
  }
}
.user-menu-panel .menu-toggle-switch {
  position: relative;
  width: 46px;
  height: 26px;
  flex-shrink: 0;
  cursor: pointer;
}
.user-menu-panel .menu-toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}
.user-menu-panel .menu-toggle-slider {
  position: absolute;
  inset: 0;
  background: var(--border);
  border-radius: 999px;
  transition: background 0.2s;
}
.user-menu-panel .menu-toggle-slider::before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  left: 3px;
  top: 3px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  transition: transform 0.2s;
}
.user-menu-panel .menu-toggle-switch input:checked + .menu-toggle-slider {
  background: var(--accent);
}
.user-menu-panel
  .menu-toggle-switch
  input:checked
  + .menu-toggle-slider::before {
  transform: translateX(20px);
}
.user-menu-panel .menu-panel-loading {
  font-size: 0.85rem;
  color: var(--text-muted);
  padding: 0 1.25rem 0.75rem;
  display: none;
}
body.user-logged-in .user-menu-panel .menu-panel-loading.is-visible {
  display: block;
}

/* Botão Login no header — visível apenas sem login (texto e borda em preto, sem tradução) */
.header-login-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.85rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #1a1a1a;
  text-decoration: none;
  border: 1px solid #1a1a1a;
  border-radius: var(--radius-full);
  background: var(--bg);
}
.header-login-link:hover {
  background: #1a1a1a;
  color: #fff;
  border-color: #1a1a1a;
}
button.header-login-link {
  cursor: pointer;
  font-family: inherit;
}
body.user-logged-in .header-guest-only {
  display: none !important;
}
.header-logged-in-only {
  display: none;
}
/* Excluir .app-nav-bar: é largura total e o seu display é definido abaixo (Viajando = oculto). */
body.user-logged-in .header-logged-in-only:not(.app-nav-bar) {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
/* FAB + gaveta: não usar .header-logged-in-only (essa classe força inline-flex e quebrava o FAB) */
body:not(.user-logged-in) .platform-nav-fab,
body:not(.user-logged-in) .platform-drawer,
body:not(.user-logged-in) .platform-drawer-overlay {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.menu-guest-only {
  display: block;
}
body.user-logged-in .menu-guest-only {
  display: none !important;
}
.menu-logged-in-only {
  display: none;
}
body.user-logged-in .menu-logged-in-only {
  display: flex;
}
.header-host-link {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
  text-decoration: none;
  padding: 0.4rem 0.5rem;
  border-radius: var(--radius-full);
  border: 1px solid var(--border);
  background: var(--bg);
  transition:
    color 0.2s,
    background 0.2s,
    border-color 0.2s;
}
.header-host-link:hover {
  color: var(--accent);
  background: var(--bg);
}
/* Sem conta: apenas "Anuncie aqui" em destaque, verde turquesa (estilo Holidu) */
body:not(.user-logged-in) .header-host-link {
  background: #0d9488;
  border-color: #0d9488;
  color: #fff;
}
body:not(.user-logged-in) .header-host-link:hover {
  background: #0f766e;
  border-color: #0f766e;
  color: #fff;
}

/* Modos no header (anfitrião): Webmaster (dashboard) | Viajando | Hospedando; sem conta: Anuncie aqui */
.mode-switcher {
  display: none;
  align-items: center;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  padding: 2px;
}
body.user-logged-in .mode-switcher {
  display: inline-flex;
}
.mode-switcher-wm,
.mode-switcher-hosp {
  display: none;
  align-items: center;
  gap: 0;
}
body.user-show-mode-webmaster .mode-switcher-wm {
  display: inline-flex;
}
body.user-show-mode-hospedando .mode-switcher-hosp {
  display: inline-flex;
}
/* Atalho Webmaster na barra Pro (CH Manager…): só contas com role webmaster */
body:not(.user-show-mode-webmaster) .app-nav-webmaster-cluster {
  display: none !important;
}
.mode-switcher a,
.mode-switcher span {
  padding: 0.35rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 600;
  border-radius: var(--radius-full);
  text-decoration: none;
  color: var(--text-muted);
  transition:
    color 0.15s,
    background 0.15s;
}
.mode-switcher a:hover {
  color: var(--accent);
  background: rgba(230, 30, 77, 0.08);
}
.mode-switcher .mode-active {
  color: var(--accent);
  background: var(--bg-card);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.mode-switcher .mode-sep {
  padding: 0;
  width: 1px;
  height: 14px;
  background: var(--border);
  margin: 0 2px;
}
.mode-switcher .mode-dd {
  position: relative;
  display: inline-flex;
}
.mode-switcher .mode-dd-menu {
  position: absolute;
  top: calc(100% + 0.45rem);
  left: 0;
  min-width: 220px;
  padding: 0.4rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-card);
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.2);
  display: none;
  z-index: 1400;
}
.mode-switcher .mode-dd.is-open .mode-dd-menu {
  display: grid;
  gap: 0.2rem;
}
.mode-switcher [data-mode-dd-trigger="1"]:focus-visible,
.mode-switcher .mode-dd-item:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.mode-switcher .mode-dd-item {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--text);
  text-decoration: none;
  font: inherit;
  font-size: 0.82rem;
  line-height: 1.3;
  padding: 0.5rem 0.6rem;
  border-radius: 8px;
  cursor: pointer;
}
.mode-switcher .mode-dd-item:hover {
  background: rgba(230, 30, 77, 0.08);
  color: var(--accent);
}
.mode-switcher .mode-dd-item--close {
  color: var(--text-muted);
}
@media (max-width: 720px) {
  .mode-switcher .mode-dd-menu {
    left: auto;
    right: 0;
    min-width: 200px;
  }
}
/* Esconder "Anuncie aqui" quando já é anunciante (mostra Viajando|Hospedando) */
body.user-is-host .header-host-link {
  display: none;
}

/* Barra de menu Pro — só contas Pro; largura total do browser.
       Em modo Viajando (menu público) a barra fica oculta; só aparece em Hospedando ou com o topo Webmaster ativo. */
.app-nav-bar {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0 1.25rem;
  box-sizing: border-box;
  background: rgba(247, 247, 247, 0.97);
  border-bottom: 1px solid var(--border);
  overflow: visible;
}
body.user-logged-in.user-is-pro.mode-hospedando .app-nav-bar,
body.user-logged-in.user-is-pro.app-nav-mode-webmaster .app-nav-bar {
  display: flex;
  flex-wrap: wrap;
}
/* Ferramentas internas (Beds24 equipa, preços alojamento, …): manter barra Pro com atalhos mesmo em modo Viajando */
body.user-logged-in.user-is-pro.app-nav-mode-admin.beds24-startup-page
  .app-nav-bar,
body.user-logged-in.user-is-pro.app-nav-mode-admin.accom-prices .app-nav-bar {
  display: flex;
  flex-wrap: wrap;
}
.app-nav-bar .app-nav-inner {
  display: none;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.05rem 0;
  width: 100%;
  max-width: var(--max-w);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  overflow: visible;
}
body.app-nav-mode-admin .app-nav-inner-admin {
  display: flex;
}
/* Admin no extremo direito da fila operacional + dropdown alinhado à direita */
body.app-nav-mode-admin .app-nav-inner-admin .app-nav-admin-trailing {
  margin-left: auto;
  display: inline-flex;
  align-items: stretch;
  flex-shrink: 0;
}
.app-nav-bar
  .app-nav-dropdown-wrap.app-nav-admin-trailing
  .app-nav-dropdown.app-nav-dropdown--align-end {
  left: auto;
  right: 0;
}
body.app-nav-mode-webmaster .app-nav-inner-webmaster {
  display: flex;
}
/* Pro + anfitrião + Hospedando: esconder 2.ª linha (logo, modos, conta). Webmaster: sempre compacto; Admin: compacto até o utilizador abrir o cabeçalho */
body.user-is-pro.user-is-host.mode-hospedando.app-nav-mode-webmaster
  .header-inner {
  display: none !important;
}
body.user-is-pro.user-is-host.mode-hospedando.app-nav-mode-admin:not(
    .ci-pro-host-show-secondary-header
  )
  .header-inner {
  display: none !important;
}
.app-nav-compact-exit-host {
  display: none;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 2rem;
  height: 2rem;
  margin: 0 0.25rem 0 0;
  padding: 0 0.4rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-card);
  color: var(--text-muted);
  cursor: pointer;
  flex-shrink: 0;
  box-sizing: border-box;
  overflow: hidden;
  transition:
    color 0.15s ease,
    border-color 0.15s ease,
    background 0.15s ease;
}
.app-nav-compact-exit-host:hover {
  color: var(--accent);
  border-color: rgba(230, 30, 77, 0.35);
  background: rgba(230, 30, 77, 0.06);
}
.app-nav-compact-exit-host:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
/* Sem depender só do pai: evita flash enorme se o markup ou a ordem de CSS falhar */
img.app-nav-micro-logo {
  display: block;
  height: auto;
  max-height: 20px;
  width: auto;
  max-width: 72px;
  object-fit: contain;
  object-position: left center;
  pointer-events: none;
  vertical-align: middle;
}
body.user-is-pro.user-is-host.mode-hospedando.app-nav-mode-webmaster
  .app-nav-compact-exit-host--to-admin {
  display: inline-flex !important;
}
body.user-is-pro.user-is-host.mode-hospedando.app-nav-mode-admin:not(
    .ci-pro-host-show-secondary-header
  )
  .app-nav-compact-exit-host--to-viajando {
  display: inline-flex !important;
}
/* Viajando: só menu público — sem barra Pro (Reception/PMS…), exceto se o topo for Webmaster; qualquer conta Pro (não só anfitrião). */
body.user-is-pro.mode-viajando:not(.app-nav-mode-webmaster) #app-nav-bar {
  display: none !important;
}
/* Excepção: páginas de ferramentas equipa — a regra acima usa #app-nav-bar + !important e anulava .app-nav-bar sem ID */
body.user-logged-in.user-is-pro.mode-viajando.app-nav-mode-admin.beds24-startup-page
  #app-nav-bar,
body.user-logged-in.user-is-pro.mode-viajando.app-nav-mode-admin.accom-prices
  #app-nav-bar {
  display: flex !important;
  flex-wrap: wrap;
}
body.user-is-pro.mode-viajando:not(.app-nav-mode-webmaster)
  nav.menu-bar
  .platform-nav-fab {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Webmaster: só operações Webmaster (Dashboard, Integrações, …) — sem menu público nem barra operacional */
body.user-is-pro.app-nav-mode-webmaster nav.menu-bar {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
body.user-is-pro.app-nav-mode-webmaster .menu-bar-spacer {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
body.user-is-pro.app-nav-mode-webmaster
  #app-nav-bar
  .app-nav-inner
  > .platform-nav-fab {
  display: inline-flex !important;
}
/* Hospedando: só barra Pro (Reception, PMS, …) — sem menu público Alojamentos/Experiências */
body.user-is-pro.user-is-host.mode-hospedando nav.menu-bar {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
body.user-is-pro.user-is-host.mode-hospedando .menu-bar-spacer {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
/* FAB da plataforma dentro da barra Pro (inserido por JS em modo hospedando) */
#app-nav-bar .app-nav-inner > .platform-nav-fab {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  flex-shrink: 0;
  align-self: center;
  z-index: 2;
  margin-inline-end: 0.35rem;
}
body.user-is-pro.user-is-host.mode-hospedando:not(.app-nav-mode-webmaster)
  #app-nav-bar
  .app-nav-inner
  > .platform-nav-fab {
  display: inline-flex !important;
}
.app-nav-bar .app-nav-link {
  display: inline-block;
  padding: 0.5rem 0.85rem;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  text-decoration: none;
  border-radius: 6px;
  transition:
    color 0.15s ease,
    background 0.15s ease;
}
.app-nav-bar .app-nav-link:hover {
  color: var(--accent);
  background: rgba(230, 30, 77, 0.06);
}
.app-nav-bar .app-nav-link.active {
  color: var(--accent);
}
.app-nav-bar .app-nav-sep {
  width: 1px;
  height: 12px;
  background: var(--border);
  margin: 0 0.15rem;
  flex-shrink: 0;
}
/* Accommodation (virtual calendar): menu operacional só para contas com papel de alojamento na sessão */
body:not(.user-is-host) .app-nav-accommodation-host-tools,
body:not(.user-is-host) .app-nav-sep-accommodation-host {
  display: none !important;
}
/* Reception: link principal + chevron (painel receção) */
.app-nav-bar .app-nav-reception-split {
  position: relative;
  display: inline-flex;
  align-items: stretch;
  vertical-align: middle;
  border-radius: 6px;
}
.app-nav-bar .app-nav-reception-split .app-nav-reception-home {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 0.5rem 0.5rem 0.85rem;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  text-decoration: none;
  border-radius: 6px 0 0 6px;
  transition:
    color 0.15s ease,
    background 0.15s ease;
}
.app-nav-bar .app-nav-reception-split .app-nav-reception-home:hover {
  color: var(--accent);
  background: rgba(230, 30, 77, 0.06);
}
.app-nav-bar .app-nav-reception-split .app-nav-reception-chevron {
  padding: 0.5rem 0.55rem 0.5rem 0.3rem;
  border-radius: 0 6px 6px 0;
  border-left: 1px solid rgba(0, 0, 0, 0.07);
}
.app-nav-bar .app-nav-reception-split.is-open .app-nav-reception-home,
.app-nav-bar .app-nav-reception-split.is-open .app-nav-reception-chevron {
  color: var(--accent);
  background: rgba(230, 30, 77, 0.06);
}
.app-nav-bar .app-nav-reception-split.is-active-route .app-nav-reception-home,
.app-nav-bar
  .app-nav-reception-split.is-active-route
  .app-nav-reception-chevron {
  color: var(--accent);
  background: rgba(230, 30, 77, 0.06);
}
/* Unified Box: duas secções visíveis — moldura + divisor; texto → dashboard, seta → menu */
.app-nav-bar .app-nav-split--unified-box {
  border: 1px solid rgba(37, 99, 235, 0.5);
  border-radius: 8px;
  background: #fff;
  overflow: visible;
  box-sizing: border-box;
}
.app-nav-bar .app-nav-dropdown-wrap.app-nav-split--unified-box.is-open {
  z-index: 260;
}
.app-nav-bar .app-nav-split--unified-box .app-nav-reception-home {
  border-radius: 7px 0 0 7px;
  color: var(--accent);
}
.app-nav-bar .app-nav-split--unified-box .app-nav-reception-home:hover {
  color: var(--accent-hover, #c7372c);
  background: rgba(230, 30, 77, 0.07);
}
.app-nav-bar .app-nav-split--unified-box .app-nav-reception-chevron {
  border-radius: 0 7px 7px 0;
  gap: 0;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  color: var(--accent);
  min-width: 2.1rem;
  justify-content: center;
}
.app-nav-bar .app-nav-split--unified-box .app-nav-reception-chevron:hover {
  background: rgba(230, 30, 77, 0.07);
  color: var(--accent-hover, #c7372c);
}
.app-nav-bar .app-nav-split--unified-box.is-open {
  border-color: rgba(37, 99, 235, 0.75);
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.12);
}
.app-nav-bar .app-nav-split--unified-box.is-open .app-nav-reception-home,
.app-nav-bar .app-nav-split--unified-box.is-open .app-nav-reception-chevron {
  color: var(--accent);
  background: rgba(230, 30, 77, 0.06);
}
/* Reception: dropdown (painel em camadas) */
.app-nav-bar .app-nav-dropdown-wrap {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.app-nav-bar .app-nav-dropdown-wrap.app-nav-reception-split {
  display: inline-flex;
  align-items: stretch;
}
.app-nav-bar .app-nav-dropdown-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  font: inherit;
  cursor: pointer;
  border: none;
  background: transparent;
  text-transform: inherit;
  letter-spacing: inherit;
}
.app-nav-bar .app-nav-dropdown-trigger .app-nav-chevron {
  width: 10px;
  height: 10px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
  transition: transform 0.2s ease;
}
.app-nav-bar
  .app-nav-dropdown-wrap.is-open
  .app-nav-dropdown-trigger
  .app-nav-chevron {
  transform: rotate(180deg);
}
.app-nav-bar .app-nav-dropdown-wrap.is-open .app-nav-dropdown-trigger {
  color: var(--accent);
}
.app-nav-bar .app-nav-dropdown {
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  min-width: 240px;
  max-width: min(92vw, 320px);
  background: #fff;
  border-radius: 10px;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.12),
    0 0 0 1px rgba(0, 0, 0, 0.06);
  padding: 0.4rem 0;
  z-index: 250;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-4px);
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease;
}
.app-nav-bar .app-nav-dropdown-wrap.is-open .app-nav-dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}
.app-nav-bar .app-nav-dd-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 1.1rem;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
  color: #1f2937;
  text-decoration: none;
  transition:
    background 0.15s ease,
    color 0.15s ease;
  border: none;
  background: transparent;
  width: 100%;
  box-sizing: border-box;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
}
.app-nav-bar .app-nav-dd-item:hover {
  background: #f3f4f6;
  color: #111827;
}
.app-nav-bar .app-nav-dd-item.is-active {
  color: #2563eb;
  font-weight: 600;
  box-shadow: inset 0 -3px 0 0 #2563eb;
  background: rgba(37, 99, 235, 0.06);
}
.app-nav-bar .app-nav-dd-chevron {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  stroke: #9ca3af;
  fill: none;
  stroke-width: 2;
}
.app-nav-bar .app-nav-dd-item:hover .app-nav-dd-chevron {
  stroke: #6b7280;
}
/* Itens com ícone à esquerda (ex.: Revenue) */
.app-nav-bar .app-nav-dd-item--with-icon {
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.7rem;
}
.app-nav-bar .app-nav-dd-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  stroke: #6b7280;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  margin-top: 2px;
}
.app-nav-bar .app-nav-dd-item--with-icon:hover .app-nav-dd-icon {
  stroke: #374151;
}
.app-nav-bar .app-nav-dd-text {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  line-height: 1.25;
}
.app-nav-bar .app-nav-dd-line1 {
  font-weight: 600;
  color: #374151;
}
.app-nav-bar .app-nav-dd-line2 {
  font-size: 0.8125rem;
  font-weight: 500;
  color: #4b5563;
}
.app-nav-bar .app-nav-dropdown--wide {
  min-width: 280px;
  max-width: min(94vw, 360px);
}
/* PMS: lista com ícones (estilo painel PMS) */
.app-nav-bar .app-nav-dropdown-wrap.app-nav-dropdown-tall .app-nav-dropdown {
  max-height: min(72vh, 520px);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  min-width: 268px;
}
.app-nav-bar .app-nav-ub-html-heading {
  padding: 0.55rem 1.1rem 0.3rem;
  margin-top: 0.35rem;
  border-top: 1px solid #ececec;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9ca3af;
}
.platform-drawer .nav-section-title.nav-section-title--sub {
  font-size: 0.7rem;
  margin-top: 0.5rem;
  padding-top: 0.35rem;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  color: #888;
}
.app-nav-bar .app-nav-dd-item.pms-dd-row {
  justify-content: flex-start;
  gap: 0.75rem;
  font-weight: 600;
  font-size: 0.8125rem;
  color: #5a5a5a;
  padding: 0.5rem 1rem 0.5rem 0.85rem;
}
.app-nav-bar .app-nav-dd-item.pms-dd-row:hover {
  background: rgba(230, 30, 77, 0.1);
  color: #c7372c;
}
.app-nav-bar .app-nav-dd-item.pms-dd-row .pms-dd-ico {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.85;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.app-nav-bar .app-nav-dd-item.pms-dd-row .pms-dd-soon {
  margin-left: auto;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.72;
  color: #888;
}
.app-nav-bar span.app-nav-dd-item.pms-dd-row[aria-disabled="true"] {
  opacity: 0.62;
  cursor: default;
  pointer-events: none;
}
.app-nav-bar span.app-nav-dd-item.pms-dd-row[aria-disabled="true"]:hover {
  background: transparent;
  color: #5a5a5a;
}
/* PMS: acordeão Configuração (submenu dentro do dropdown) */
#app-nav-pms-dropdown .app-nav-dd-group {
  border-top: 1px solid #ececec;
  margin-top: 0.15rem;
  padding-top: 0.2rem;
}
#app-nav-pms-dropdown .app-nav-dd-accordion-btn {
  padding: 0.5rem 1rem 0.5rem 0.85rem;
  align-items: center;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #5a5a5a;
}
#app-nav-pms-dropdown .app-nav-dd-accordion-btn:hover {
  background: rgba(230, 30, 77, 0.1);
  color: #c7372c;
}
#app-nav-pms-dropdown .app-nav-dd-accordion-inner .pms-dd-ico {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.85;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#app-nav-pms-dropdown .app-nav-dd-accordion-chevron {
  margin-top: 0;
}
#app-nav-pms-dropdown .app-nav-dd-subitem {
  font-size: 0.8125rem;
}
/* CH Manager: grupos com subitens (acordeão) */
.app-nav-bar .app-nav-dd-group {
  border-top: 1px solid #ececec;
  margin-top: 0.2rem;
  padding-top: 0.2rem;
}
.app-nav-bar .app-nav-dd-accordion-btn {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.65rem 1.1rem;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: #374151;
  text-decoration: none;
  border: none;
  background: transparent;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
.app-nav-bar .app-nav-dd-accordion-btn:hover {
  background: #f3f4f6;
  color: #111827;
}
.app-nav-bar .app-nav-dd-accordion-btn .app-nav-dd-accordion-inner {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  min-width: 0;
}
.app-nav-bar .app-nav-dd-accordion-chevron {
  width: 10px;
  height: 10px;
  flex-shrink: 0;
  stroke: #9ca3af;
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  margin-top: 5px;
  transition: transform 0.2s ease;
  transform: rotate(180deg);
}
.app-nav-bar .app-nav-dd-group:not(.is-expanded) .app-nav-dd-accordion-chevron {
  transform: rotate(0deg);
}
.app-nav-bar .app-nav-dd-group:not(.is-expanded) .app-nav-dd-sublist {
  display: none;
}
.app-nav-bar .app-nav-dd-sublist {
  padding: 0 0 0.4rem;
}
.app-nav-bar .app-nav-dd-subitem {
  display: block;
  padding: 0.5rem 1rem 0.5rem 2.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #4b5563;
  text-decoration: none;
  border-radius: 6px;
  margin: 0 0.35rem;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
.app-nav-bar .app-nav-dd-subitem:hover {
  background: #f3f4f6;
  color: #111827;
}
.app-nav-bar .app-nav-dd-sublabel {
  padding: 0.5rem 1rem 0.15rem 2.75rem;
  margin: 0.25rem 0.35rem 0;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #9ca3af;
  pointer-events: none;
}
.app-nav-bar .app-nav-dd-group--sublabel-only {
  border-top: 1px solid #ececec;
  margin-top: 0.35rem;
  padding-top: 0.2rem;
}
.app-nav-bar .app-nav-dd-sublabel--in-dropdown {
  padding-left: 1.1rem;
  padding-right: 1rem;
  margin-top: 0.1rem;
}
/* Website: primeiro item em destaque (estilo painel) */
.app-nav-bar .app-nav-dd-item.web-dd-highlight {
  background: rgba(230, 30, 77, 0.1);
  color: var(--accent);
  font-weight: 700;
  border-radius: 10px;
  margin: 0.35rem 0.5rem;
  width: calc(100% - 1rem);
  box-sizing: border-box;
  box-shadow: none;
}
.app-nav-bar .app-nav-dd-item.web-dd-highlight:hover {
  background: rgba(230, 30, 77, 0.14);
  color: var(--accent-hover);
}
.app-nav-bar .app-nav-dd-item.web-dd-highlight .app-nav-dd-line1 {
  color: inherit;
}
.app-nav-bar .app-nav-dd-item.web-dd-highlight .app-nav-dd-icon {
  stroke: var(--accent);
}
.app-nav-bar .app-nav-dd-item.web-dd-highlight:hover .app-nav-dd-icon {
  stroke: var(--accent-hover);
}
/* Admin: CH Manager e Website (antigos itens do topo) como megasubmenus dentro do dropdown */
.app-nav-bar
  #app-nav-admin-panel-dropdown
  .app-nav-admin-nested-root
  > .app-nav-dd-accordion-btn {
  border-top: 1px solid #ececec;
  margin-top: 0.25rem;
}
.app-nav-bar #app-nav-admin-panel-dropdown .app-nav-admin-nested-megasub {
  padding: 0 0 0.35rem;
}
.app-nav-bar
  #app-nav-admin-panel-dropdown
  .app-nav-admin-nested-megasub
  .app-nav-dd-item {
  width: calc(100% - 0.7rem);
  box-sizing: border-box;
  margin-left: 0.35rem;
  margin-right: 0.35rem;
}
.app-nav-bar
  #app-nav-admin-panel-dropdown
  .app-nav-admin-nested-megasub
  .app-nav-dd-subitem {
  padding-left: 1.65rem;
}
.app-nav-bar
  #app-nav-admin-panel-dropdown
  .app-nav-admin-nested-megasub
  .app-nav-dd-sublabel {
  padding-left: 1.65rem;
}
.app-nav-bar
  #app-nav-admin-panel-dropdown
  .app-nav-admin-nested-megasub
  .app-nav-dd-group {
  margin-top: 0.1rem;
}
/* Favoritos (barra Pro) */
.app-nav-bar .app-nav-dropdown--favorites {
  min-width: 260px;
  max-width: min(92vw, 360px);
  max-height: min(70vh, 420px);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.app-nav-bar .app-nav-fav-star-ico {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: #ca8a04;
}
/* Favoritos: só ícone na barra (dropdown mantém lista + adicionar) */
.app-nav-bar .app-nav-favorites-trigger-icon {
  padding: 0.5rem 0.65rem;
  gap: 0;
  letter-spacing: 0;
  text-transform: none;
}
.app-nav-bar .app-nav-favorites-trigger-icon .app-nav-fav-star-ico {
  width: 18px;
  height: 18px;
}
.app-nav-bar .app-nav-fav-row {
  display: flex;
  align-items: stretch;
  gap: 0;
  border-bottom: 1px solid #f3f4f6;
}
.app-nav-bar .app-nav-fav-row:last-child {
  border-bottom: none;
}
.app-nav-bar .app-nav-fav-link {
  flex: 1;
  min-width: 0;
  justify-content: flex-start !important;
  width: auto !important;
  border-radius: 0;
  padding-right: 0.35rem;
}
.app-nav-bar .app-nav-fav-remove {
  flex-shrink: 0;
  width: 2.35rem;
  align-self: stretch;
  border: none;
  background: transparent;
  cursor: pointer;
  color: #9ca3af;
  font-size: 1.2rem;
  line-height: 1;
  padding: 0 0.25rem;
  font-family: inherit;
  transition:
    color 0.15s,
    background 0.15s;
}
.app-nav-bar .app-nav-fav-remove:hover {
  color: #dc2626;
  background: #fef2f2;
}
.app-nav-bar .app-nav-favorites-empty {
  margin: 0;
  padding: 0.65rem 1.1rem;
  font-size: 0.8125rem;
  color: #6b7280;
  line-height: 1.4;
}
.app-nav-bar .app-nav-favorites-add-btn {
  border-top: 1px solid #ececec;
  margin-top: 0.1rem;
  font-weight: 600;
  color: var(--accent);
}
.app-nav-bar .app-nav-favorites-add-btn:hover {
  background: rgba(230, 30, 77, 0.08);
  color: var(--accent-hover);
}
/* Admin / Configuração: link para dashboard de cards; ícone engrenagem + texto sem uppercase */
.app-nav-bar .app-nav-link.app-nav-admin-config {
  text-transform: none;
  letter-spacing: 0.02em;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.app-nav-bar a.app-nav-link.app-nav-admin-config .app-nav-admin-gear {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
}
.app-nav-bar .app-nav-dropdown-trigger .app-nav-trigger-ico {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
}
body.user-logged-in:not(.user-is-pro) .header-spacer {
  height: 80px;
}
body.user-logged-in.user-is-pro .header-spacer {
  height: 118px;
}
/* Reforço: mesma especificidade + Pro; com opt-in o spacer deve colapsar para o conteúdo encostar à app-nav
       (ex.: Unified Messaging com scroll no painel, não no window). */
body[data-ci-collapse-chrome-header-spacer-on-hide="1"].header-hidden.user-logged-in
  .header-spacer,
body[data-ci-collapse-chrome-header-spacer-on-hide="1"].header-hidden.user-logged-in.user-is-pro
  .header-spacer {
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden;
}
@media (min-width: 900px) {
  .app-nav-bar .app-nav-link {
    font-size: 0.72rem;
    padding: 0.55rem 0.95rem;
    letter-spacing: 0.07em;
  }
}

/* Modais (anunciar + idioma/moeda + login) */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(1rem, env(safe-area-inset-top))
    max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom))
    max(1rem, env(safe-area-inset-left));
  box-sizing: border-box;
  overflow: auto;
  overscroll-behavior: contain;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.2s,
    visibility 0.2s;
}
body.modal-anunciar-open .modal-overlay.modal-anunciar-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-lang-open .modal-overlay.modal-lang-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-login-open .modal-overlay.modal-login-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-login-open .modal-box.modal-login {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
body.modal-welcome-open .modal-overlay.modal-welcome-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-welcome-open .modal-box.modal-welcome {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.modal-overlay.modal-login-overlay {
  background: rgba(0, 0, 0, 0.5);
}
/* Welcome overlay: fundo visível com blur e escurecimento leve */
.modal-overlay.modal-welcome-overlay {
  background: rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.modal-box.modal-welcome {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.92);
  z-index: 301;
  padding: 2.25rem 2.5rem;
  text-align: center;
  min-width: 300px;
  width: min(100%, 42rem);
  max-width: min(92vw, calc(100dvw - 2rem));
  max-height: min(90vh, calc(100dvh - 2rem));
  overflow: auto;
  box-sizing: border-box;
  background: var(--bg-card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.2),
    0 0 0 1px rgba(255, 255, 255, 0.5) inset;
  opacity: 0;
  visibility: hidden;
  transition:
    transform 0.25s ease,
    opacity 0.25s ease,
    visibility 0.25s;
}
.modal-box.modal-welcome .welcome-icon-wrap {
  width: 64px;
  height: 64px;
  margin: 0 auto 1.25rem;
  border-radius: 50%;
  background: linear-gradient(
    135deg,
    rgba(230, 30, 77, 0.15),
    rgba(230, 30, 77, 0.08)
  );
  display: flex;
  align-items: center;
  justify-content: center;
  animation: welcome-pulse 1.2s ease-out;
}
.modal-box.modal-welcome .welcome-icon-wrap svg {
  width: 32px;
  height: 32px;
  stroke: var(--accent);
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@keyframes welcome-pulse {
  0% {
    transform: scale(0.8);
    opacity: 0.6;
  }
  50% {
    transform: scale(1.05);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.modal-box.modal-welcome .welcome-title {
  margin: 0 0 0.35rem;
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.02em;
}
.modal-box.modal-welcome .welcome-tenant {
  margin: 0;
  font-size: 1.15rem;
  color: var(--accent);
  font-weight: 600;
}
.modal-box.modal-welcome .welcome-sub {
  margin: 0.75rem 0 0;
  font-size: 0.9rem;
  color: var(--text-muted);
}
/* Modal: Recomendação 2FA (só contas pro, após login/registo) */
body.modal-2fa-recommend-open .modal-overlay.modal-2fa-recommend-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-2fa-recommend-open .modal-box.modal-2fa-recommend {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.modal-overlay.modal-2fa-recommend-overlay {
  position: fixed;
  inset: 0;
  z-index: 300;
  background: rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.25s ease,
    visibility 0.25s;
}
.modal-box.modal-2fa-recommend {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.92);
  z-index: 301;
  padding: 2rem 2.25rem;
  text-align: center;
  min-width: 300px;
  width: min(100%, 42rem);
  max-width: min(92vw, calc(100dvw - 2rem));
  max-height: min(90vh, calc(100dvh - 2rem));
  overflow: auto;
  box-sizing: border-box;
  background: var(--bg-card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
  opacity: 0;
  visibility: hidden;
  transition:
    transform 0.25s ease,
    opacity 0.25s ease,
    visibility 0.25s;
}
.modal-box.modal-2fa-recommend .modal-2fa-title {
  margin: 0 0 0.75rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
}
.modal-box.modal-2fa-recommend .modal-2fa-text {
  margin: 0 0 1.25rem;
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.5;
}
.modal-box.modal-2fa-recommend .modal-2fa-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  align-items: center;
}
.modal-box.modal-2fa-recommend .btn-2fa-config {
  padding: 0.65rem 1.25rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  display: inline-block;
}
.modal-box.modal-2fa-recommend .btn-2fa-later {
  padding: 0.65rem 1rem;
  background: transparent;
  color: var(--text-muted);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
  cursor: pointer;
}
body.modal-webmaster-pro-open .modal-overlay.modal-webmaster-pro-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-webmaster-pro-open .modal-box.modal-webmaster-pro {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.modal-overlay.modal-webmaster-pro-overlay {
  position: fixed;
  inset: 0;
  z-index: 302;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.25s ease,
    visibility 0.25s;
}
.modal-box.modal-webmaster-pro {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.92);
  z-index: 303;
  padding: 2rem 2.25rem;
  text-align: center;
  min-width: 300px;
  width: min(100%, 42rem);
  max-width: min(92vw, calc(100dvw - 2rem));
  max-height: min(90vh, calc(100dvh - 2rem));
  overflow: auto;
  box-sizing: border-box;
  background: var(--bg-card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
  opacity: 0;
  visibility: hidden;
  transition:
    transform 0.25s ease,
    opacity 0.25s ease,
    visibility 0.25s;
}
.modal-box.modal-webmaster-pro .wm-pro-title {
  margin: 0 0 0.75rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
}
.modal-box.modal-webmaster-pro .wm-pro-text {
  margin: 0 0 1.35rem;
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.55;
  text-align: left;
}
.modal-box.modal-webmaster-pro .wm-pro-actions {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  align-items: stretch;
}
.modal-box.modal-webmaster-pro .wm-pro-actions a,
.modal-box.modal-webmaster-pro .wm-pro-actions button {
  padding: 0.65rem 1.15rem;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  box-sizing: border-box;
}
.modal-box.modal-webmaster-pro .wm-pro-btn-plans {
  background: var(--accent);
  color: #fff;
  border: none;
}
.modal-box.modal-webmaster-pro .wm-pro-btn-plans:hover {
  background: var(--accent-hover);
}
.modal-box.modal-webmaster-pro .wm-pro-btn-contact {
  background: var(--bg);
  color: var(--text);
  border: 1px solid var(--border);
}
.modal-box.modal-webmaster-pro .wm-pro-btn-contact:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.modal-box.modal-webmaster-pro .wm-pro-btn-close {
  background: transparent;
  color: var(--text-muted);
  border: none;
  margin-top: 0.25rem;
}
.modal-box.modal-login {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  z-index: 301;
  width: min(100%, 520px);
  max-width: min(560px, calc(100dvw - 2rem));
  min-width: 280px;
  min-height: 300px;
  height: auto;
  max-height: min(90vh, calc(100dvh - 2rem));
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: var(--bg-card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-lg);
  box-sizing: border-box;
}
@media (min-width: 768px) {
  .modal-box.modal-login {
    max-width: 560px;
    min-height: 340px;
  }
}
@media (max-height: 500px) {
  .modal-box.modal-login {
    min-height: 220px;
    max-height: 95vh;
  }
}
.modal-box.modal-login .modal-close {
  top: 0.5rem;
  right: 0.5rem;
  z-index: 2;
  background: var(--bg-card);
  color: var(--text);
  flex-shrink: 0;
}
.modal-box.modal-login .modal-close:hover {
  background: var(--bg);
  color: var(--accent);
}
.modal-box.modal-login .login-form-wrap {
  padding: clamp(1rem, 3vw, 1.5rem);
  flex: 1 1 auto;
  min-height: 260px;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.modal-box.modal-login .modal-tenant-logo {
  text-align: center;
  margin-bottom: 1rem;
}
.modal-box.modal-login .modal-tenant-logo img {
  height: 44px;
  width: auto;
  max-width: 180px;
  display: inline-block;
  object-fit: contain;
}
.modal-box.modal-login .login-form-wrap h2 {
  margin: 0 0 0.25rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
}
.modal-box.modal-login .login-form-wrap .login-subtitle {
  margin: 0 0 1.25rem;
  font-size: 0.9rem;
  color: var(--text-muted);
}
.modal-box.modal-login .login-form-wrap label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
}
.modal-box.modal-login .login-form-wrap input[type="email"],
.modal-box.modal-login .login-form-wrap input[type="password"] {
  width: 100%;
  padding: 0.65rem 0.75rem;
  margin-bottom: 1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 1rem;
  font-family: inherit;
  box-sizing: border-box;
}
.modal-box.modal-login .login-form-wrap .login-password-wrap {
  position: relative;
  margin-bottom: 1rem;
}
.modal-box.modal-login .login-form-wrap .login-password-wrap input {
  margin-bottom: 0;
  padding-right: 2.75rem;
}
.modal-box.modal-login .login-form-wrap .login-password-toggle {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--text-muted);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-box.modal-login .login-form-wrap .login-password-toggle:hover {
  color: var(--accent);
  background: var(--bg);
}
.modal-box.modal-login .login-form-wrap .login-password-toggle svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.modal-box.modal-login .login-form-wrap input:focus {
  outline: none;
  border-color: var(--accent);
}
.modal-box.modal-login .login-form-wrap .login-remember {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.modal-box.modal-login .login-form-wrap .login-remember input {
  width: auto;
  margin: 0;
}
.modal-box.modal-login .login-form-wrap .btn-login {
  width: 100%;
  padding: 0.75rem 1rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s;
}
.modal-box.modal-login .login-form-wrap .btn-login:hover {
  background: var(--accent-hover);
}
.modal-box.modal-login .login-form-wrap .login-recovery {
  margin-top: 1rem;
  text-align: center;
}
.modal-box.modal-login .login-form-wrap .login-recovery a {
  color: var(--accent);
  font-size: 0.9rem;
  text-decoration: none;
}
.modal-box.modal-login .login-form-wrap .login-recovery a:hover {
  text-decoration: underline;
}
.modal-box.modal-login .login-view-recovery {
  display: none;
}
.modal-box.modal-login.login-show-recovery .login-view-login {
  display: none;
}
.modal-box.modal-login.login-show-recovery .login-view-recovery {
  display: block;
}
.modal-box.modal-login.login-show-recovery .login-view-register {
  display: none;
}
.modal-box.modal-login .recovery-back {
  margin-top: 1rem;
}
.modal-box.modal-login .recovery-back a {
  color: var(--accent);
  font-size: 0.9rem;
  text-decoration: none;
}
.modal-box.modal-login .recovery-back a:hover {
  text-decoration: underline;
}
.modal-box.modal-login .recovery-msg {
  padding: 0.75rem;
  border-radius: 8px;
  margin-bottom: 1rem;
  font-size: 0.9rem;
}
.modal-box.modal-login .recovery-msg.err {
  background: #ffebee;
  color: #c62828;
}
.modal-box.modal-login .recovery-msg.ok {
  background: #e8f5e9;
  color: #2e7d32;
}
/* Vista Criar conta */
.modal-box.modal-login .login-view-register {
  display: none;
}
.modal-box.modal-login.login-show-register .login-view-login {
  display: none;
}
.modal-box.modal-login.login-show-register .login-view-recovery {
  display: none;
}
.modal-box.modal-login.login-show-register .login-view-register {
  display: block;
}
.modal-box.modal-login .register-roles {
  margin: 0.75rem 0;
  padding: clamp(0.75rem, 2vw, 1rem);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg);
}
.modal-box.modal-login .register-roles legend {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 0.5rem;
  display: block;
}
.modal-box.modal-login .register-roles-actions {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
  flex-wrap: wrap;
}
.modal-box.modal-login .register-roles-actions .btn-roles-toggle {
  padding: 0.4rem 0.75rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--accent);
  background: var(--bg-card);
  border: 1px solid var(--accent);
  border-radius: var(--radius);
  cursor: pointer;
  font-family: inherit;
  transition:
    background 0.2s,
    color 0.2s;
}
.modal-box.modal-login .register-roles-actions .btn-roles-toggle:hover {
  background: var(--accent);
  color: #fff;
}
.modal-box.modal-login .register-roles-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.4rem 1rem;
  max-height: min(16rem, 40vh);
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 0.25rem;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 380px) {
  .modal-box.modal-login .register-roles-list {
    grid-template-columns: 1fr;
  }
}
.modal-box.modal-login .register-role-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0.35rem 0;
  cursor: pointer;
  border-radius: 6px;
}
.modal-box.modal-login .register-role-item:hover {
  background: rgba(230, 30, 77, 0.06);
}
.modal-box.modal-login .register-role-item input {
  width: auto;
  margin: 0;
  accent-color: var(--accent);
}
.modal-box.modal-login .register-role-item span {
  font-weight: 500;
  font-size: 0.9rem;
  color: var(--text);
}
.modal-box.modal-login .register-step-form-pro .login-subtitle {
  margin-bottom: 0.75rem;
}
.modal-box.modal-login .register-step-form-pro label {
  margin-bottom: 0.25rem;
}
.modal-box.modal-login .register-step-form-pro input[type="email"],
.modal-box.modal-login .register-step-form-pro input[type="password"] {
  margin-bottom: 0.75rem;
}
.modal-box.modal-login .register-form-actions {
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--border);
}
.modal-box.modal-login .register-form-actions .btn-login {
  margin: 0;
}
.modal-box.modal-login .register-back {
  margin-top: 0.75rem;
  text-align: center;
}
.modal-box.modal-login .register-gocore-card {
  margin-top: 1.25rem;
  padding: 1rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  text-align: center;
}
.modal-box.modal-login .register-gocore-card .register-gocore-text {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin: 0 0 0.75rem;
  line-height: 1.4;
}
.modal-box.modal-login .register-gocore-card .cta-demo-pill {
  display: inline-flex;
  align-items: stretch;
  padding: 0;
  background: var(--bg-card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition:
    border-color 0.2s,
    box-shadow 0.2s;
  overflow: hidden;
}
.modal-box.modal-login .register-gocore-card .cta-demo-pill:hover {
  border-color: var(--accent);
  box-shadow: 0 2px 10px rgba(230, 30, 77, 0.15);
  color: var(--text);
}
.modal-box.modal-login
  .register-gocore-card
  .cta-demo-pill
  .cta-demo-pill-text {
  padding: 0.55rem 1rem;
  background: #e8e8e8;
  color: var(--text);
}
.modal-box.modal-login
  .register-gocore-card
  .cta-demo-pill
  .cta-demo-pill-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  background: var(--accent);
  color: #fff;
  flex-shrink: 0;
}
.modal-box.modal-login
  .register-gocore-card
  .cta-demo-pill
  .cta-demo-pill-icon
  svg {
  width: 18px;
  height: 18px;
}
.modal-box.modal-login .register-back {
  margin-top: 0.75rem;
  text-align: center;
}
.modal-box.modal-login .register-back a {
  color: var(--accent);
  font-size: 0.9rem;
  text-decoration: none;
}
.modal-box.modal-login .register-back a:hover {
  text-decoration: underline;
}
.modal-box.modal-login .login-recovery.register-links {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  align-items: center;
}
/* Criar conta: primeiro escolher Guest ou Pro */
.modal-box.modal-login .register-step-choice {
  display: block;
}
.modal-box.modal-login .register-step-form-guest,
.modal-box.modal-login .register-step-form-pro {
  display: none;
}
.modal-box.modal-login.register-show-guest .register-step-choice,
.modal-box.modal-login.register-show-guest .register-step-form-pro {
  display: none;
}
.modal-box.modal-login.register-show-guest .register-step-form-guest {
  display: block;
}
.modal-box.modal-login.register-show-pro .register-step-choice,
.modal-box.modal-login.register-show-pro .register-step-form-guest {
  display: none;
}
.modal-box.modal-login.register-show-pro .register-step-form-pro {
  display: block;
}
.modal-box.modal-login .register-option-cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin: 1rem 0 1.25rem;
}
.modal-box.modal-login .register-option-card {
  display: block;
  width: 100%;
  padding: 1rem 1.25rem;
  text-align: left;
  border: 2px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  cursor: pointer;
  font-family: inherit;
  transition:
    border-color 0.2s,
    box-shadow 0.2s;
}
.modal-box.modal-login .register-option-card:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow);
}
.modal-box.modal-login .register-option-card strong {
  display: block;
  font-size: 1rem;
  color: var(--text);
  margin-bottom: 0.25rem;
}
.modal-box.modal-login .register-option-card span {
  font-size: 0.9rem;
  color: var(--text-muted);
}
.modal-box {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  max-width: 90vw;
  max-height: 90vh;
  overflow-y: auto;
  background: var(--bg-card);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  z-index: 301;
  padding: 1.5rem;
  opacity: 0;
  visibility: hidden;
  transition:
    transform 0.2s,
    opacity 0.2s,
    visibility 0.2s;
}
body.modal-anunciar-open .modal-box.modal-anunciar {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
body.modal-lang-open .modal-box.modal-lang {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.modal-box .modal-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 36px;
  height: 36px;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--text-muted);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-box .modal-close:hover {
  background: var(--bg);
  color: var(--accent);
}
.modal-box .modal-close svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.modal-box h2 {
  margin: 0 0 1.25rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
  text-align: center;
}
/* Modal Anunciar: grelha adapta-se à largura real do diálogo (container queries) */
.modal-box.modal-anunciar .announce-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.35rem, 2vw, 0.75rem);
  margin-bottom: clamp(0.6rem, 2.5vw, 1.15rem);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.modal-box.modal-anunciar .announce-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding: clamp(0.45rem, 2.5vw, 0.85rem) clamp(0.3rem, 1.8vw, 0.55rem);
  border: 2px solid var(--border);
  border-radius: var(--radius);
  cursor: pointer;
  transition:
    border-color 0.2s,
    box-shadow 0.2s;
  background: var(--bg-card);
  min-width: 0;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  box-sizing: border-box;
}
.modal-box.modal-anunciar .announce-card:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow);
}
.modal-box.modal-anunciar .announce-card.selected {
  border-color: var(--accent);
  background: rgba(230, 30, 77, 0.06);
}
.modal-box.modal-anunciar .announce-card .ac-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(1.75rem, 11vw, 2.5rem);
  height: clamp(1.75rem, 11vw, 2.5rem);
  font-size: clamp(1.1rem, 6vw, 2rem);
  line-height: 1;
  flex-shrink: 0;
}
.modal-box.modal-anunciar .announce-card .ac-label {
  font-weight: 600;
  font-size: clamp(0.62rem, 2.8vw, 0.88rem);
  color: var(--text);
  text-align: center;
  line-height: 1.25;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
@supports (container-type: inline-size) {
  .modal-box.modal-anunciar {
    container-type: inline-size;
    container-name: modal-anunciar;
  }
  @container modal-anunciar (min-width: 300px) {
    .modal-box.modal-anunciar .announce-cards {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  @container modal-anunciar (min-width: 380px) {
    .modal-box.modal-anunciar .announce-cards {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  @container modal-anunciar (min-width: 480px) {
    .modal-box.modal-anunciar .announce-cards {
      grid-template-columns: repeat(5, minmax(0, 1fr));
    }
  }
}
.modal-box .btn-next {
  display: block;
  margin-left: auto;
  padding: clamp(0.5rem, 1.5vw, 0.65rem) clamp(1rem, 4vw, 1.5rem);
  background: var(--border);
  color: var(--text-muted);
  border: none;
  border-radius: var(--radius-full);
  font-weight: 600;
  font-size: clamp(0.8rem, 2vw, 0.95rem);
  cursor: pointer;
  font-family: inherit;
}
.modal-box .btn-next.active {
  background: var(--accent);
  color: #fff;
  cursor: pointer;
}
.modal-box .btn-next.active:hover {
  background: var(--accent-hover);
}
/* Modal Anunciar: encaixa no ecrã; largura escala com viewport */
.modal-box.modal-anunciar {
  width: min(94vw, 560px);
  max-width: 100%;
  min-width: 0;
  max-height: min(90vh, 900px);
  overflow-x: hidden;
  overflow-y: auto;
  padding: clamp(0.65rem, 3vw, 1.35rem);
  padding-top: clamp(2.5rem, 8vw, 3rem);
  box-sizing: border-box;
}
.modal-box.modal-anunciar .announce-step {
  display: none;
}
.modal-box.modal-anunciar.step-choice .announce-step-choice {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 0;
  padding-bottom: 0.35rem;
}
.modal-box.modal-anunciar.step-choice .announce-step-choice h2 {
  font-size: clamp(1rem, 3.5vw, 1.25rem);
  margin-bottom: clamp(0.75rem, 2.5vw, 1.25rem);
}
.modal-box.modal-anunciar.step-choice .announce-step-choice .btn-next {
  margin-top: 0.35rem;
  align-self: flex-end;
}
.modal-box.modal-anunciar.step-login .announce-step-login {
  display: block;
}
.modal-box.modal-anunciar.step-conta .announce-step-conta {
  display: block;
}
.modal-box.modal-anunciar.step-form .announce-step-form {
  display: block;
}
.announce-step-desc {
  margin: 0 0 1.25rem;
  font-size: 0.95rem;
  color: var(--text-muted);
}
.btn-announce-login {
  width: 100%;
  padding: 0.75rem 1rem;
  background: #ff5a5f;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  margin-bottom: 0.75rem;
}
.btn-announce-login:hover {
  background: #e00007;
}
.btn-conta-edit {
  width: 100%;
  padding: 0.6rem 1rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  margin-bottom: 0.5rem;
}
.btn-conta-edit:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.btn-back-announce {
  display: block;
  margin-top: 0.75rem;
  padding: 0.5rem 0;
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 0.9rem;
  cursor: pointer;
  font-family: inherit;
}
.btn-back-announce:hover {
  color: var(--accent);
}
.announce-form-gocore_channel {
  text-align: left;
}
.announce-form-gocore_channel .announce-fieldset {
  border: none;
  margin: 0 0 1.5rem;
  padding: 0 0 1rem;
  border-bottom: 1px solid var(--border);
}
.announce-form-gocore_channel .announce-fieldset:last-of-type {
  border-bottom: none;
}
.announce-form-gocore_channel .announce-fieldset legend {
  font-weight: 700;
  font-size: 0.95rem;
  margin-bottom: 0.75rem;
  padding: 0;
}
.announce-form-gocore_channel label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
}
.announce-form-gocore_channel .req {
  color: var(--accent);
}
.announce-form-gocore_channel input,
.announce-form-gocore_channel select {
  width: 100%;
  padding: 0.6rem 0.75rem;
  margin-bottom: 1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 1rem;
  font-family: inherit;
  box-sizing: border-box;
}
.announce-form-gocore_channel input:focus,
.announce-form-gocore_channel select:focus {
  outline: none;
  border-color: var(--accent);
}
.announce-field-note {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin: 0 0 0.75rem;
}
.room-type-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  align-items: center;
}
.room-type-row input {
  margin-bottom: 0;
}
.btn-add-room {
  padding: 0.5rem 1rem;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
  cursor: pointer;
  font-family: inherit;
  margin-bottom: 1rem;
}
.btn-add-room:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.announce-form-actions {
  display: flex;
  gap: 1rem;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 1rem;
}
.btn-submit-announce {
  padding: 0.75rem 1.5rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-full);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.btn-submit-announce:hover {
  background: var(--accent-hover);
}
.lang-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1.25rem;
}
.lang-tabs button {
  padding: 0.6rem 1rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-muted);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  cursor: pointer;
  font-family: inherit;
}
.lang-tabs button.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}
.lang-tabs button:hover {
  color: var(--text);
}
.lang-pane {
  display: none;
}
.lang-pane.active {
  display: block;
}
.lang-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--border);
}
.lang-toggle span {
  font-size: 0.9rem;
  color: var(--text);
}
.toggle-traducao-btn {
  width: 44px;
  height: 24px;
  border-radius: 12px;
  background: var(--accent);
  border: none;
  cursor: pointer;
  position: relative;
}
.toggle-traducao-btn span {
  position: absolute;
  right: 4px;
  top: 2px;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition:
    right 0.2s,
    left 0.2s;
}
.toggle-traducao-btn.toggle-off {
  background: #ccc;
}
.toggle-traducao-btn.toggle-off span {
  right: auto;
  left: 4px;
}
.lang-list {
  max-height: 280px;
  overflow-y: auto;
}
.lang-option {
  display: block;
  width: 100%;
  padding: 0.6rem 0.75rem;
  text-align: left;
  font-size: 0.9rem;
  color: var(--text);
  background: none;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
}
.lang-option:hover {
  background: var(--bg);
}
.lang-option.selected {
  background: rgba(230, 30, 77, 0.1);
  color: var(--accent);
  font-weight: 600;
}

/* Modal Conta: abas Guest / Pro */
body.modal-conta-open .modal-overlay.modal-conta-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-conta-open .modal-box.modal-conta {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.modal-box.modal-conta {
  width: 100%;
  max-width: 520px;
  max-height: 90vh;
  padding: 1.25rem 1.5rem;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.modal-box.modal-conta .conta-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1.25rem;
}
.modal-box.modal-conta .conta-tabs button {
  flex: 1;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-muted);
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
  cursor: pointer;
  font-family: inherit;
}
.modal-box.modal-conta .conta-tabs button.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}
.modal-box.modal-conta .conta-tabs button:hover {
  color: var(--text);
}
.modal-box.modal-conta .conta-pane {
  display: none;
}
.modal-box.modal-conta .conta-pane.active {
  display: block;
}
.modal-box.modal-conta .conta-form label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
}
.modal-box.modal-conta .conta-form input,
.modal-box.modal-conta .conta-form select,
.modal-box.modal-conta .conta-form textarea {
  width: 100%;
  padding: 0.6rem 0.75rem;
  margin-bottom: 1rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 1rem;
  font-family: inherit;
  box-sizing: border-box;
}
.modal-box.modal-conta .conta-form input:focus,
.modal-box.modal-conta .conta-form select:focus,
.modal-box.modal-conta .conta-form textarea:focus {
  outline: none;
  border-color: var(--accent);
}
.modal-box.modal-conta .btn-conta {
  width: 100%;
  padding: 0.75rem;
  background: #ff5a5f;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  margin-top: 0.5rem;
}
.modal-box.modal-conta .btn-conta:hover {
  background: #e00007;
}
.modal-box.modal-conta .conta-profile-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 0;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--border);
}
.modal-box.modal-conta .conta-profile-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--bg);
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.modal-box.modal-conta .conta-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.modal-box.modal-conta .conta-profile-avatar svg {
  width: 28px;
  height: 28px;
  stroke: var(--text-muted);
  fill: none;
  stroke-width: 2;
}
.modal-box.modal-conta .conta-profile-info {
  min-width: 0;
}
.modal-box.modal-conta .conta-profile-name {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
}
.modal-box.modal-conta .conta-profile-email {
  margin: 0.25rem 0 0;
  font-size: 0.9rem;
  color: var(--text-muted);
}
.modal-box.modal-conta .conta-form-section {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.modal-box.modal-conta .conta-section-title {
  font-size: 0.9rem;
  color: var(--text-muted);
  margin: 0 0 0.75rem;
  font-weight: 600;
}
.modal-box.modal-conta .conta-checkbox-wrap {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}
.modal-box.modal-conta .conta-checkbox-wrap input[type="checkbox"] {
  margin: 0;
  width: 1.1rem;
  height: 1.1rem;
  accent-color: var(--accent);
}
.modal-box.modal-conta .conta-billing-fields {
  transition: opacity 0.2s;
}
.modal-box.modal-conta .conta-billing-fields.hidden {
  display: none;
}
.modal-box.modal-conta .conta-session-settings {
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--border);
}
.modal-box.modal-conta .conta-session-settings .conta-section-title {
  margin-bottom: 0.25rem;
}
.modal-box.modal-conta .conta-session-desc {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin: 0 0 0.75rem;
  line-height: 1.4;
}
.modal-box.modal-conta .conta-session-settings label {
  margin-bottom: 0.35rem;
}
.modal-box.modal-conta .conta-session-settings select {
  margin-bottom: 0.75rem;
}
.modal-box.modal-conta .btn-conta-secondary {
  background: var(--bg);
  color: var(--text);
  border: 1px solid var(--border);
  margin-top: 0;
}
.modal-box.modal-conta .btn-conta-secondary:hover {
  background: var(--border);
  color: var(--text);
}
.modal-box.modal-conta a.btn-conta {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
}
.modal-box.modal-conta .conta-secure-settings-hint {
  margin: 0 0 1rem;
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.4;
}
.modal-box.modal-conta .conta-session-feedback {
  font-size: 0.85rem;
  margin: 0.5rem 0 0;
  min-height: 1.2em;
  color: var(--accent);
}

/* Modal Centro de Ajuda */
body.modal-ajuda-open .modal-overlay.modal-ajuda-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-ajuda-open .modal-box.modal-ajuda {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.modal-box.modal-ajuda {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  z-index: 301;
  width: 100%;
  max-width: 400px;
  padding: 1.5rem;
  background: var(--bg-card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transition:
    transform 0.2s,
    opacity 0.2s,
    visibility 0.2s;
}
.modal-box.modal-ajuda h2 {
  margin: 0 0 0.5rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
}
.modal-box.modal-ajuda .ajuda-desc {
  margin: 0 0 1.25rem;
  font-size: 0.9rem;
  color: var(--text-muted);
}
.modal-box.modal-ajuda .ajuda-links {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}
.modal-box.modal-ajuda .ajuda-link {
  display: block;
  padding: 0.65rem 0.85rem;
  background: var(--bg);
  border-radius: 8px;
  color: var(--text);
  text-decoration: none;
  font-weight: 500;
  font-size: 0.95rem;
  border: 1px solid var(--border);
  transition:
    border-color 0.2s,
    background 0.2s;
}
.modal-box.modal-ajuda .ajuda-link:hover {
  border-color: var(--accent);
  background: rgba(230, 30, 77, 0.06);
  color: var(--accent);
}
.modal-box.modal-ajuda .ajuda-contact {
  margin: 0;
  font-size: 0.85rem;
  color: var(--text-muted);
}
.modal-box.modal-ajuda .ajuda-contact a {
  color: var(--accent);
  text-decoration: none;
}
.modal-box.modal-ajuda .ajuda-contact a:hover {
  text-decoration: underline;
}

/* Barra pública: .menu-bar-inner + .menu-bar-links (âncoras não são filhos directos de .wrap) */
nav.menu-bar > .wrap.menu-bar-inner,
nav.menu-bar > .wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.35rem 0.5rem;
  width: 100%;
  min-height: 0;
  box-sizing: border-box;
}
.menu-bar-burger {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-card);
  color: var(--text);
  cursor: pointer;
  flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
  transition:
    border-color 0.2s,
    color 0.2s,
    background 0.2s;
}
.menu-bar-burger:hover {
  border-color: rgba(230, 30, 77, 0.35);
  color: var(--accent);
}
.menu-bar-burger-icon {
  width: 22px;
  height: 22px;
}
.menu-bar-burger-icon--close {
  display: none;
}
nav.menu-bar.is-menu-expanded .menu-bar-burger-icon--open {
  display: none;
}
nav.menu-bar.is-menu-expanded .menu-bar-burger-icon--close {
  display: block;
}
nav.menu-bar .menu-bar-links {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.15rem 0.2rem;
  min-width: 0;
}
nav.menu-bar .menu-bar-links a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.75rem;
  line-height: 1.25;
  text-decoration: none;
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 500;
  border-radius: var(--radius-full);
  flex-shrink: 0;
  white-space: nowrap;
}
nav.menu-bar .menu-bar-links a:hover {
  background: rgba(230, 30, 77, 0.07);
  color: var(--accent);
}
nav.menu-bar .menu-bar-links a.active,
nav.menu-bar .menu-bar-links a[aria-current="page"] {
  color: var(--accent);
  font-weight: 600;
  background: rgba(230, 30, 77, 0.1);
}
nav.menu-bar .menu-bar-links a.menu-bar-gocore-link {
  border: 1px solid rgba(13, 148, 136, 0.35);
  color: #0d9488;
}
nav.menu-bar .menu-bar-links a.menu-bar-gocore-link:hover {
  background: rgba(13, 148, 136, 0.1);
  color: #0f766e;
}
@media (max-width: 1040px) {
  .menu-bar-burger {
    display: inline-flex;
  }
  nav.menu-bar .menu-bar-links {
    display: none;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    padding: 0.5rem 0 0.25rem;
    gap: 0.15rem;
  }
  nav.menu-bar.is-menu-expanded .menu-bar-links {
    display: flex;
  }
  nav.menu-bar .menu-bar-links a {
    white-space: normal;
    border-radius: 10px;
  }
}
nav.menu-bar .nav-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
}

/* Hero + microsite (paridade com checkinall-home.css) */
.hero {
  background: linear-gradient(135deg, #7a9bb8 0%, #5a7b98 50%, #4a6b88 100%);
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 3rem 1.5rem 4.5rem;
  text-align: center;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}
.hero::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  max-height: 100%;
  background: url("/experiences/system_images/domains/checkinall/banner-hero.png")
    center/cover no-repeat;
  opacity: 0.35;
  pointer-events: none;
}
.hero .wrap {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
@media (min-width: 769px) and (max-width: 1219px) {
  .hero {
    max-height: none;
    min-height: 0;
  }
  .hero .wrap.hero-shell {
    overflow-y: visible;
  }
}
@media (min-width: 1220px) {
  .hero {
    max-height: min(86vh, 680px);
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  .hero .wrap.hero-shell {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}
/* Vcards gocore na rail .home-page-ad-rail — shell do hero é coluna única (paridade checkinall-home.css) */
.hero-shell {
  display: block;
  max-width: 100%;
}
.hero-microsite {
  margin: 0 auto;
  width: 100%;
  max-width: 320px;
}
.hero-microsite-card {
  display: block;
  background: #fff;
  color: var(--text);
  border-radius: 22px;
  padding: 1.35rem 1.2rem 1.25rem;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.14);
  border: 1px solid rgba(233, 30, 99, 0.14);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.hero-microsite-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 40px rgba(233, 30, 99, 0.18);
  color: var(--text);
}
.hero-microsite-badge {
  width: 48px;
  height: 48px;
  margin: 0 auto 0.85rem;
  border-radius: 12px;
  background: rgba(233, 30, 99, 0.12);
  color: #e91e63;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-microsite-badge svg {
  width: 26px;
  height: 26px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
@media (min-width: 1220px) {
  .home-page-ad-rail .hero-microsite-card {
    text-align: left;
  }
  .home-page-ad-rail .hero-microsite-badge {
    margin: 0 0 0.85rem;
  }
}
.hero-microsite-title {
  margin: 0 0 0.45rem;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
}
.hero-microsite-desc {
  margin: 0 0 1rem;
  font-size: 0.88rem;
  color: var(--text-muted);
  line-height: 1.45;
}
.hero-microsite-cta {
  display: inline-flex;
  align-items: stretch;
  border-radius: var(--radius-full);
  overflow: hidden;
  font-weight: 600;
  font-size: 0.88rem;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}
.hero-microsite-cta > span:first-child {
  padding: 0.55rem 1rem;
  background: #ececec;
  color: var(--text);
}
.hero-microsite-cta-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  background: #e91e63;
  color: #fff;
  flex-shrink: 0;
}
.hero-microsite-cta-icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.hero-main {
  min-width: 0;
}
.hero h1 {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  margin: 0 0 0.75rem;
  letter-spacing: -0.02em;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.hero .tagline {
  font-size: clamp(1rem, 2.2vw, 1.25rem);
  margin: 0 0 2rem;
  opacity: 0.95;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}
.hero .cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 1.75rem;
  background: var(--accent);
  color: #fff;
  border-radius: var(--radius-full);
  font-weight: 600;
  font-size: 1.05rem;
  text-decoration: none;
  box-shadow: var(--shadow-lg);
  transition:
    background 0.2s,
    transform 0.15s;
}
.hero .cta:hover {
  background: var(--accent-hover);
  color: #fff;
  transform: translateY(-1px);
}
.hero .cta svg {
  width: 20px;
  height: 20px;
}
.hero .cta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.25rem;
}
/* Botão demo: pill com ícone em círculo à direita */
.hero .cta-demo {
  display: inline-flex;
  align-items: center;
  padding: 0;
  background: var(--bg-card);
  color: var(--text);
  border: 2px solid var(--border);
  border-radius: var(--radius-full);
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  box-shadow: var(--shadow);
  transition:
    border-color 0.2s,
    box-shadow 0.2s,
    transform 0.15s;
  overflow: hidden;
}
.hero .cta-demo:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow-lg);
  transform: translateY(-1px);
  color: var(--text);
}
.hero .cta-demo .cta-demo-text {
  padding: 0.75rem 1.25rem;
}
.hero .cta-demo .cta-demo-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: var(--accent);
  color: #fff;
  flex-shrink: 0;
}
.hero .cta-demo .cta-demo-icon svg {
  width: 22px;
  height: 22px;
}

/* Hero search bar (pill) */
.hero-search {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  background: var(--bg-card);
  border-radius: var(--radius-full);
  box-shadow:
    0 4px 24px rgba(0, 0, 0, 0.12),
    0 0 0 1px rgba(255, 255, 255, 0.6);
  max-width: 880px;
  margin: 0 auto 2rem;
  overflow: hidden;
}
.hero-search .search-cell {
  flex: 1;
  min-width: 0;
  padding: 0.85rem 1rem;
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hero-search .search-cell:last-of-type {
  border-right: none;
}
.hero-search .search-label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text);
  margin-bottom: 0.2rem;
}
.hero-search .search-cell input,
.hero-search .search-cell .search-value {
  font-size: 0.95rem;
  color: var(--text);
  border: none;
  background: none;
  width: 100%;
  padding: 0;
  outline: none;
}
.hero-search .search-cell input::placeholder {
  color: var(--text-muted);
}
.hero-search .search-theme {
  min-width: 120px;
  cursor: pointer;
  position: relative;
}
.hero-search .search-theme .search-value {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
}
.hero-search .search-theme .search-value::after {
  content: "";
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid var(--text-muted);
  flex-shrink: 0;
}
.hero-search .search-theme[aria-expanded="true"] .search-value::after {
  transform: rotate(180deg);
}
.hero-search .search-theme-drop {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 2px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  z-index: 10;
  padding: 0.35rem 0;
  display: none;
}
.hero-search .search-theme[aria-expanded="true"] .search-theme-drop {
  display: block;
}
.hero-search .search-theme-drop button {
  display: block;
  width: 100%;
  padding: 0.5rem 1rem;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--text);
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
}
.hero-search .search-theme-drop button:hover {
  background: var(--bg);
  color: var(--accent);
}
.hero-search .search-where {
  min-width: 140px;
}
.hero-search .search-dates {
  min-width: 140px;
}
.hero-search .search-guests {
  min-width: 100px;
  cursor: pointer;
}
.hero-search .search-btn-wrap {
  flex-shrink: 0;
  padding: 0.5rem;
}
.hero-search .search-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.35rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-full);
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s;
}
.hero-search .search-btn:hover {
  background: var(--accent-hover);
  color: #fff;
}
.hero-search .search-btn svg {
  width: 18px;
  height: 18px;
}
@media (max-width: 1024px) {
  .hero-search {
    flex-direction: column;
    border-radius: var(--radius);
    max-width: 100%;
  }
  .hero-search .search-cell {
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
  .hero-search .search-cell:last-of-type {
    border-bottom: none;
  }
  .hero-search .search-btn-wrap {
    padding: 0.75rem;
    width: 100%;
  }
  .hero-search .search-btn {
    width: 100%;
  }
}

/* Modal Demo (agendamento reunião Teams) */
body.modal-demo-open .modal-overlay.modal-demo-overlay {
  opacity: 1;
  visibility: visible;
}
body.modal-demo-open .modal-box.modal-demo {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.modal-box.modal-demo {
  width: 100%;
  max-width: 440px;
  min-width: 280px;
  max-height: 90vh;
  padding: clamp(1rem, 3vw, 1.5rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: var(--bg-card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-lg);
  box-sizing: border-box;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(0.95);
  z-index: 301;
  opacity: 0;
  visibility: hidden;
  transition:
    transform 0.2s,
    opacity 0.2s,
    visibility 0.2s;
}
.modal-box.modal-demo .modal-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 36px;
  height: 36px;
  border: none;
  background: none;
  cursor: pointer;
  color: var(--text-muted);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  line-height: 1;
}
.modal-box.modal-demo .modal-close:hover {
  background: var(--bg);
  color: var(--accent);
}
.modal-box.modal-demo h2 {
  margin: 0 0 0.5rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
  text-align: center;
}
.modal-box.modal-demo .demo-desc {
  margin: 0 0 1.25rem;
  font-size: 0.95rem;
  color: var(--text-muted);
  text-align: center;
  line-height: 1.45;
}
.modal-box.modal-demo .demo-booking-link-wrap {
  margin-bottom: 1rem;
  text-align: center;
}
.modal-box.modal-demo .demo-booking-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 1.5rem;
  background: var(--accent);
  color: #fff;
  border-radius: var(--radius-full);
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  width: 100%;
  justify-content: center;
  box-sizing: border-box;
  transition: background 0.2s;
}
.modal-box.modal-demo .demo-booking-link:hover {
  background: var(--accent-hover);
  color: #fff;
}
.modal-box.modal-demo .demo-booking-link svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.modal-box.modal-demo .demo-form {
  display: none;
}
.modal-box.modal-demo.demo-show-form .demo-booking-link-wrap {
  display: none;
}
.modal-box.modal-demo.demo-show-form .demo-form {
  display: block;
}
.modal-box.modal-demo .demo-form label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
}
.modal-box.modal-demo .demo-form input,
.modal-box.modal-demo .demo-form textarea {
  width: 100%;
  padding: 0.65rem 0.75rem;
  margin-bottom: 1rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 1rem;
  font-family: inherit;
  box-sizing: border-box;
}
.modal-box.modal-demo .demo-form input:focus,
.modal-box.modal-demo .demo-form textarea:focus {
  outline: none;
  border-color: var(--accent);
}
.modal-box.modal-demo .demo-form .demo-msg {
  margin-bottom: 1rem;
  padding: 0.75rem;
  border-radius: var(--radius);
  font-size: 0.9rem;
  display: none;
}
.modal-box.modal-demo .demo-form .demo-msg.ok {
  display: block;
  background: #e8f5e9;
  color: #2e7d32;
}
.modal-box.modal-demo .demo-form .demo-msg.err {
  display: block;
  background: #ffebee;
  color: #c62828;
}

/* Value proposition — PMS, reservas, channel manager */
.value-section {
  padding: 3.5rem 1.5rem;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
}
.value-section h2 {
  text-align: center;
  font-size: 1.5rem;
  margin: 0 0 0.5rem;
  color: var(--text);
}
.value-section .sub {
  text-align: center;
  color: var(--text-muted);
  font-size: 1rem;
  margin: 0 0 2.5rem;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}
.value-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
  max-width: 960px;
  margin: 0 auto;
}
.value-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.5rem;
  text-align: center;
  transition:
    box-shadow 0.2s,
    border-color 0.2s;
}
.value-card:hover {
  box-shadow: var(--shadow);
  border-color: var(--accent);
}
.value-card .icon {
  width: 52px;
  height: 52px;
  margin: 0 auto 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(230, 30, 77, 0.1);
  color: var(--accent);
  border-radius: 14px;
}
.value-card .icon svg {
  width: 28px;
  height: 28px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.value-card h3 {
  margin: 0 0 0.35rem;
  font-size: 1.1rem;
  color: var(--text);
}
.value-card p {
  margin: 0;
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.5;
}

/* Card: System powered by gocore.solutions + demo CTA */
.gocore-powered-section {
  padding: 2rem 1.5rem;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
}
.gocore-powered-card {
  max-width: 420px;
  margin: 0 auto;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.75rem;
  text-align: center;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.gocore-powered-card .icon {
  width: 52px;
  height: 52px;
  margin: 0 auto 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(230, 30, 77, 0.1);
  color: var(--accent);
  border-radius: 14px;
}
.gocore-powered-card .icon svg {
  width: 28px;
  height: 28px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}
.gocore-powered-card h3 {
  margin: 0 0 0.5rem;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text);
}
.gocore-powered-card .gocore-desc {
  margin: 0 0 1.25rem;
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.45;
}
.gocore-powered-card .cta-demo-pill {
  display: inline-flex;
  align-items: stretch;
  padding: 0;
  background: var(--bg-card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition:
    border-color 0.2s,
    box-shadow 0.2s,
    transform 0.15s;
  overflow: hidden;
}
.gocore-powered-card .cta-demo-pill:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 14px rgba(230, 30, 77, 0.2);
  transform: translateY(-1px);
  color: var(--text);
}
.gocore-powered-card .cta-demo-pill .cta-demo-pill-text {
  padding: 0.7rem 1.25rem;
  background: #e8e8e8;
  color: var(--text);
}
.gocore-powered-card .cta-demo-pill .cta-demo-pill-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  background: var(--accent);
  color: #fff;
  flex-shrink: 0;
}
.gocore-powered-card .cta-demo-pill .cta-demo-pill-icon svg {
  width: 20px;
  height: 20px;
}

/* Welcome + Explore */
.section {
  padding: 3rem 1.5rem;
}
.section h2 {
  font-size: 1.5rem;
  margin: 0 0 1rem;
  color: var(--text);
}
.section p {
  margin: 0 0 1rem;
  color: var(--text-muted);
  max-width: 640px;
}
.explore-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}
.explore-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.25rem;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  transition: box-shadow 0.2s;
  text-decoration: none;
  color: inherit;
}
.explore-card:hover {
  box-shadow: var(--shadow);
}
.explore-card .emoji {
  font-size: 1.75rem;
  line-height: 1;
}
.explore-card h4 {
  margin: 0 0 0.25rem;
  font-size: 1rem;
  color: var(--text);
}
.explore-card p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--text-muted);
}
.explore-grid-wrap {
  position: relative;
  margin-top: 1.5rem;
}
.explore-grid-wrap.slider-mode {
  overflow: hidden;
}
.explore-grid-wrap.slider-mode .explore-grid {
  display: flex;
  flex-wrap: nowrap;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  margin: 0;
  padding: 0.25rem 0;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.explore-grid-wrap.slider-mode .explore-card {
  flex: 0 0 auto;
  min-width: 220px;
  max-width: 280px;
}
.explore-slider-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  z-index: 2;
  transition:
    background 0.2s,
    color 0.2s;
}
.explore-slider-btn:hover {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.explore-slider-btn.prev {
  left: -0.5rem;
}
.explore-slider-btn.next {
  right: -0.5rem;
}
.explore-slider-btn svg {
  width: 1.25rem;
  height: 1.25rem;
}

/* CTA block */
.cta-block {
  padding: 3rem 1.5rem;
  background: linear-gradient(135deg, #f0f4f8 0%, #e8ecf0 100%);
  border-top: 1px solid var(--border);
  text-align: center;
}
.cta-block h2 {
  font-size: 1.35rem;
  margin: 0 0 0.5rem;
  color: var(--text);
}
.cta-block p {
  margin: 0 0 1.5rem;
  color: var(--text-muted);
}
.cta-block .cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: var(--accent);
  color: #fff;
  border-radius: var(--radius-full);
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
}
.cta-block .cta:hover {
  background: var(--accent-hover);
  color: #fff;
}

/* Footer */
.site-footer {
  max-width: var(--max-w);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  background: #eaeaea;
  padding: 2.5rem 1.5rem 0;
  border-top: 1px solid var(--border);
  margin-top: 0;
}
.footer-inner {
  max-width: var(--max-w);
  margin: 0 auto;
}
.footer-top {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
  gap: 2rem;
  padding-bottom: 2rem;
}
@media (max-width: 900px) {
  .footer-top {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 500px) {
  .footer-top {
    grid-template-columns: 1fr;
  }
}
.footer-col h4 {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin: 0 0 1rem;
  text-transform: uppercase;
}
.footer-col p,
.footer-col a {
  font-size: 0.9rem;
  color: var(--text);
  line-height: 1.6;
  margin: 0 0 0.5rem;
}
.footer-col a {
  text-decoration: none;
  display: inline-block;
}
.footer-col a:hover {
  color: var(--accent);
  text-decoration: underline;
}
.footer-contact-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}
.footer-contact-item svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  color: var(--text-muted);
}
.footer-contact-item.whatsapp svg {
  color: #25d366;
}
.footer-logo {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--accent);
  margin-bottom: 0.75rem;
  display: block;
}
.footer-ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-ul li {
  margin-bottom: 0.4rem;
}
.footer-ul a {
  font-size: 0.9rem;
  color: var(--text);
}
.footer-newsletter input[type="email"] {
  width: 100%;
  padding: 0.6rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
  font-family: inherit;
}
.footer-newsletter .btn-subscribe {
  width: 100%;
  padding: 0.6rem;
  background: #0066cc;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
}
.footer-newsletter .btn-subscribe:hover {
  background: #0052a3;
}
.footer-newsletter .check {
  font-size: 0.8rem;
  color: var(--text-muted);
  margin-top: 0.5rem;
}
.footer-mid {
  padding: 1.25rem 0;
  border-top: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.footer-copy {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin: 0;
}
.footer-partners {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
}
.footer-partners a {
  font-size: 0.85rem;
}
.footer-bottom {
  background: #1a1a2e;
  color: #889;
  padding: 0.75rem 1.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.8rem;
}
.footer-bottom a {
  color: #aab;
  text-decoration: none;
}
.footer-bottom a:hover {
  color: #fff;
}
.footer-payments {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.footer-payments span {
  display: inline-block;
  width: 40px;
  height: 26px;
  background: var(--bg-card);
  border-radius: 4px;
  text-align: center;
  line-height: 26px;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--text-muted);
}
.btn-reclamacoes {
  display: inline-block;
  margin-top: 0.75rem;
  padding: 0.5rem 1rem;
  background: var(--accent);
  color: #fff;
  border-radius: var(--radius-full);
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
}
.reviews-section {
  padding: 3rem 1.5rem;
  background: var(--bg-card);
  border-top: 1px solid var(--border);
}
.reviews-section .wrap {
  max-width: var(--max-w);
  margin: 0 auto;
}
.reviews-section-label {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  text-transform: uppercase;
  margin: 0 0 0.25rem;
}
.reviews-section-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 1.5rem;
}
.reviews-home-track {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 0.25rem 0 1rem;
  scrollbar-width: none;
}
.reviews-home-track::-webkit-scrollbar {
  display: none;
}
.reviews-home-card {
  flex: 0 0 calc(100% - 0.5rem);
  max-width: 340px;
  scroll-snap-align: start;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.25rem;
}
@media (min-width: 600px) {
  .reviews-home-card {
    flex: 0 0 calc(50% - 0.5rem);
  }
}
@media (min-width: 900px) {
  .reviews-home-card {
    flex: 0 0 calc(33.333% - 0.7rem);
  }
}
.reviews-home-card-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.reviews-home-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 1.1rem;
  flex-shrink: 0;
  overflow: hidden;
}
.reviews-home-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.reviews-home-name {
  font-weight: 600;
  color: var(--text);
  font-size: 0.95rem;
  margin: 0;
}
.reviews-home-text {
  font-size: 0.9rem;
  color: var(--text-muted);
  line-height: 1.5;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.reviews-home-stars {
  display: flex;
  gap: 0.1rem;
  margin-top: 0.5rem;
}
.reviews-home-stars svg {
  width: 16px;
  height: 16px;
  fill: #0084b4;
}
.rec-section {
  min-height: 260px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
@media (min-width: 769px) {
  .rec-section {
    max-height: min(48vh, 400px);
    overflow: hidden;
  }
  .rec-section-inner {
    max-height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}
.rec-section-overlay {
  position: absolute;
  inset: 0;
  background: rgba(40, 44, 52, 0.75);
}
.rec-section-inner {
  position: relative;
  z-index: 1;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 2rem 1.25rem;
  width: 100%;
  text-align: center;
  box-sizing: border-box;
}
.rec-section-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 1.25rem;
  letter-spacing: -0.02em;
}
.rec-section-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem 1.25rem;
}
.rec-section-list a {
  display: inline-block;
  padding: 0.6rem 1.25rem;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  transition:
    background 0.2s,
    border-color 0.2s;
}
.rec-section-list a:hover {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.4);
  color: #fff;
}

/* Newsletter block (Subscribe to our newsletter) — sem repetir a mesma foto do widget acima */
.newsletter-section {
  background: var(--bg-card);
  border-top: 1px solid var(--border);
  overflow: hidden;
}
.newsletter-banner {
  height: 120px;
  background: linear-gradient(135deg, #7a9bb8 0%, #5a7b98 50%, #4a6b88 100%);
}
.newsletter-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 2rem 1.25rem 2.5rem;
}
.newsletter-subtitle {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--text-muted);
  text-transform: uppercase;
  margin: 0 0 0.35rem;
}
.newsletter-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 1.5rem;
}
.newsletter-form {
  max-width: 420px;
}
.newsletter-form .field-email {
  width: 100%;
  max-width: 320px;
  padding: 0.5rem 0;
  border: none;
  border-bottom: 2px solid var(--border);
  font-size: 1rem;
  font-family: inherit;
  color: var(--text);
  background: transparent;
  outline: none;
}
.newsletter-form .field-email::placeholder {
  color: var(--text-muted);
}
.newsletter-form .field-email:focus {
  border-bottom-color: var(--accent);
}
.newsletter-checkboxes {
  margin: 1.25rem 0 1rem;
}
.newsletter-checkboxes label {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 0.8rem;
  color: var(--text-muted);
  cursor: pointer;
  margin-bottom: 0.75rem;
  line-height: 1.4;
}
.newsletter-checkboxes input[type="checkbox"] {
  margin-top: 0.2rem;
  flex-shrink: 0;
}
.newsletter-checkboxes a {
  color: var(--accent);
  text-decoration: none;
  font-weight: 600;
}
.newsletter-checkboxes a:hover {
  text-decoration: underline;
}
.newsletter-form .btn-send {
  padding: 0.6rem 1.75rem;
  background: #fff;
  color: #0d9488;
  border: 2px solid #0d9488;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition:
    background 0.2s,
    color 0.2s;
}
.newsletter-form .btn-send:hover {
  background: #0d9488;
  color: #fff;
}
.newsletter-form .btn-send:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.newsletter-message {
  margin-top: 0.75rem;
  font-size: 0.9rem;
}
.newsletter-message.success {
  color: #0d9488;
}
.newsletter-message.error {
  color: var(--accent);
}

/* Botão voltar ao topo */
.back-to-top {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: var(--accent);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(230, 30, 77, 0.4);
  z-index: 90;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.2s,
    visibility 0.2s,
    transform 0.2s;
}
.back-to-top.visible {
  opacity: 1;
  visibility: visible;
}
.back-to-top:hover {
  background: var(--accent-hover);
  transform: translateY(-2px);
}
.back-to-top svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.5;
}

/* Vistas admin (.html) com .menu-trigger: abaixo da barra fixa mas com z-index acima do .header-bar (100)
       e dos dropdowns da app-nav (250), para o botão não ficar cortado por baixo do cabeçalho. Abaixo de modais (300+). */
body.ci-has-global-chrome .menu-trigger {
  top: calc(
    env(safe-area-inset-top, 0px) + var(--chrome-header-spacer, 80px) + 0.4rem
  );
  /* Alinhar ao mesmo eixo do header (centrado com max-width 1920px) */
  left: max(
    0.75rem,
    env(safe-area-inset-left, 0px),
    calc((100vw - var(--max-w)) / 2 + 0.75rem)
  );
  z-index: 270;
}
body.ci-has-global-chrome .admin-layout {
  padding-top: 3.25rem;
}