/* --- Tipografia da casa: Abril Fatface (títulos) + Lato (texto) — servidas localmente --- */
@font-face {
  font-family: 'Playfair Display';
  src: url('fonts/PlayfairDisplay-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('fonts/PlayfairDisplay-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('fonts/Lato-Regular.woff2') format('woff2'), url('fonts/Lato-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('fonts/Lato-Bold.woff2') format('woff2'), url('fonts/Lato-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Lato';
  src: url('fonts/Lato-Italic.woff2') format('woff2'), url('fonts/Lato-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* Essência SPA — paleta calma: verde-pinho, salva e areia clara */
:root {
  --fundo: #f4f5f0;
  --cartao: #ffffff;
  --tinta: #192a3c;
  --tinta-suave: #555f69;
  --pinho: #1b3b5c;
  --salva: #7595ba;
  --salva-clara: #e4ebf2;
  --erro: #a33b2d;
  --erro-fundo: #f8e9e6;
  --raio: 10px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--tinta);
  background: var(--fundo);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.topo { text-align: center; padding: 3.5rem 1rem 1.5rem; }
.marca {
  margin: 0;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  font-size: 0.75rem;
  color: var(--salva);
  font-weight: 600;
}
h1 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.8rem, 5vw, 2.6rem);
  margin: 0.4rem 0 0;
  color: var(--pinho);
}
.sub { color: var(--tinta-suave); margin: 0.4rem 0 0; }

.cartao {
  background: var(--cartao);
  border: 1px solid #efece9;
  border-radius: 16px;
  max-width: 640px;
  width: calc(100% - 2rem);
  margin: 1rem auto 3rem;
  padding: 1.75rem clamp(1rem, 4vw, 2.25rem) 2.25rem;
}

.passo { margin-top: 1.75rem; }
.passo:first-child { margin-top: 0; }
.passo h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.2rem;
  color: var(--pinho);
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0 0 0.9rem;
}
.num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 50%;
  background: var(--salva-clara);
  color: var(--pinho);
  font-family: var(--sans);
  font-size: 0.85rem;
  font-weight: 600;
}

.oculto { display: none; }

.opcoes { display: grid; gap: 0.6rem; }
.opcoes.horas { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); }

.opcao {
  font: inherit;
  text-align: left;
  background: var(--fundo);
  border: 1px solid #edeae5;
  border-radius: var(--raio);
  padding: 0.8rem 1rem;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  color: var(--tinta);
  transition: border-color 0.15s, background 0.15s;
}
.opcao:hover { border-color: var(--salva); }
.opcao:focus-visible { outline: 2px solid var(--pinho); outline-offset: 2px; }
.opcao.ativa { background: var(--salva-clara); border-color: var(--pinho); }
.opcao strong { font-weight: 600; }
.opcao span { color: var(--tinta-suave); font-size: 0.92rem; }
.opcao .meta { color: var(--pinho); font-weight: 600; font-size: 0.88rem; }
.opcao.hora { align-items: center; padding: 0.55rem 0.4rem; }

.campo {
  display: block;
  margin-bottom: 0.9rem;
  font-weight: 600;
  font-size: 0.92rem;
  color: var(--tinta-suave);
}
.campo input,
.campo textarea {
  display: block;
  width: 100%;
  margin-top: 0.3rem;
  font: inherit;
  font-weight: 400;
  color: var(--tinta);
  padding: 0.6rem 0.8rem;
  border: 1px solid #edeae5;
  border-radius: var(--raio);
  background: #fff;
}
.campo input:focus-visible,
.campo textarea:focus-visible { outline: 2px solid var(--pinho); outline-offset: 1px; }
.campo textarea { resize: vertical; min-height: 4.6rem; line-height: 1.5; }

.btn {
  font: inherit;
  font-weight: 600;
  background: var(--pinho);
  color: #fff;
  border: none;
  border-radius: var(--raio);
  padding: 0.75rem 1.6rem;
  cursor: pointer;
  margin-top: 0.4rem;
}
.btn:hover { background: #1f4166; }
.btn:disabled { opacity: 0.6; cursor: default; }
.btn.secundario { background: var(--salva-clara); color: var(--pinho); }
.btn.perigo { background: var(--erro-fundo); color: var(--erro); padding: 0.4rem 0.9rem; font-size: 0.88rem; }

.erro {
  background: var(--erro-fundo);
  color: var(--erro);
  border-radius: var(--raio);
  padding: 0.7rem 1rem;
  margin: 0 0 0.8rem;
}

.rodape {
  margin-top: auto;
  text-align: center;
  color: var(--tinta-suave);
  font-size: 0.85rem;
  padding: 1rem 0 2rem;
}

/* --- Painel de administração --- */
.admin-barra {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  max-width: 900px;
  width: calc(100% - 2rem);
  margin: 1.5rem auto 0;
}
.admin-barra h1 { font-size: 1.5rem; }
.admin-barra nav { display: flex; gap: 0.75rem; align-items: center; }
.admin-barra a { color: var(--pinho); font-weight: 600; text-decoration: none; }
.admin-barra a:hover { text-decoration: underline; }

.cartao.largo { max-width: 900px; }

table.agenda { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
table.agenda th, table.agenda td {
  text-align: left;
  padding: 0.6rem 0.5rem;
  border-bottom: 1px solid #f5f3f0;
  vertical-align: top;
}
table.agenda th {
  color: var(--tinta-suave);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.etiqueta {
  display: inline-block;
  background: var(--salva-clara);
  color: var(--pinho);
  border-radius: 6px;
  padding: 0.1rem 0.5rem;
  font-size: 0.82rem;
  font-weight: 600;
}
.etiqueta.cancelada { background: #eee; color: var(--tinta-suave); }

.filtros { display: flex; gap: 0.75rem; flex-wrap: wrap; align-items: end; margin-bottom: 1.25rem; }
.filtros .campo { margin-bottom: 0; }
.filtros .campo input, .filtros .campo select {
  display: block; margin-top: 0.3rem; font: inherit; padding: 0.5rem 0.7rem;
  border: 1px solid #edeae5; border-radius: var(--raio); background: #fff; color: var(--tinta);
}

@media (max-width: 560px) {
  table.agenda thead { display: none; }
  table.agenda tr { display: block; border-bottom: 1px solid #f5f3f0; padding: 0.5rem 0; }
  table.agenda td { display: block; border: none; padding: 0.15rem 0; }
}

/* --- Extensões: casal, regulamento, estados --- */
.aviso {
  background: #fef8f1;
  border: 1px solid #ecd9ad;
  color: #6d5518;
  border-radius: var(--raio);
  padding: 0.75rem 1rem;
  margin: 1rem 0 0.6rem;
  font-size: 0.93rem;
}
.resumo {
  background: var(--salva-clara);
  color: var(--pinho);
  border-radius: var(--raio);
  padding: 0.7rem 1rem;
  font-weight: 600;
  margin: 0.4rem 0 1rem;
}
.aceite {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  margin: 0 0 1rem;
  font-size: 0.93rem;
  color: var(--tinta);
}
.aceite input { margin-top: 0.25rem; width: 1.05rem; height: 1.05rem; accent-color: var(--pinho); }
.aceite a { color: var(--pinho); font-weight: 600; }
.etiqueta.pendente { background: #fef8f1; color: #6d5518; }
.zona-horas .sub { margin: 1rem 0 0.4rem; }
.regulamento h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.15rem;
  color: var(--pinho);
  margin: 1.6rem 0 0.4rem;
}
.regulamento p { margin: 0.4rem 0 0.8rem; }
.rodape a { color: var(--tinta-suave); }

.categoria {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.05rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--salva);
  margin: 1.2rem 0 0.2rem;
}
.categoria:first-child { margin-top: 0; }

/* --- Vista mensal do painel — grelha larga tradicional --- */
.mes-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.mes-nav h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.5rem;
  color: var(--pinho);
  margin: 0;
  text-align: center;
}
.mes-nav .btn { text-decoration: none; white-space: nowrap; }

.mes-scroll { overflow-x: auto; }
.mes-grelha {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  border-left: 1px solid #edeae5;
  border-top: 1px solid #edeae5;
  min-width: 900px;
}
.mes-cabecalho {
  text-align: left;
  font-size: 0.82rem;
  font-weight: 600;
  color: #fff;
  background: #85929e;
  padding: 0.5rem 0.7rem;
  border-right: 1px solid #edeae5;
  border-bottom: 1px solid #edeae5;
}
.mes-dia {
  display: block;
  min-height: 120px;
  background: #fff;
  border-right: 1px solid #edeae5;
  border-bottom: 1px solid #edeae5;
  padding: 0.4rem 0.5rem;
  text-decoration: none;
  color: var(--tinta);
  transition: background 0.15s;
}
.mes-dia:hover { background: var(--salva-clara); }
.mes-dia.vazio { background: #f4f5f2; pointer-events: none; }
.mes-dia.hoje { box-shadow: inset 0 0 0 2px var(--pinho); }
.mes-dia.livre:hover { background: var(--salva-clara); }
.mes-numero {
  display: block;
  font-weight: 600;
  font-size: 1rem;
  color: var(--tinta-suave);
  margin-bottom: 0.3rem;
}
.mes-dia.hoje .mes-numero { color: var(--pinho); }
.mes-reserva {
  display: block;
  font-size: 0.72rem;
  line-height: 1.25;
  background: var(--salva-clara);
  color: var(--pinho);
  border-radius: 5px;
  padding: 0.15rem 0.35rem;
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mes-reserva em { font-style: normal; color: var(--tinta-suave); }
.mes-reserva.pendente { background: #fef8f1; color: #6d5518; }
.mes-reserva.pendente em { color: #a58a3f; }
.mes-reserva.continuacao { opacity: 0.65; }
.mes-mais { font-size: 0.72rem; font-weight: 600; color: var(--tinta-suave); }
.legenda { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-top: 1rem; }
.ponto {
  display: inline-block;
  width: 0.7rem; height: 0.7rem;
  border-radius: 3px;
  background: var(--salva-clara);
  border: 1px solid var(--salva);
}
.ponto.pendente { background: #fef8f1; border-color: #ecd9ad; }

/* --- Grelha de serviços com foto e animações --- */
.cartao.largo-publico { max-width: 960px; }

.grelha-servicos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
  margin-bottom: 0.5rem;
}

@keyframes surgir {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

.passo { animation: surgir 0.45s ease both; }

.cartao-servico {
  font: inherit;
  text-align: left;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #efece9;
  border-radius: 14px;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  color: var(--tinta);
  animation: surgir 0.5s ease both;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.2s ease;
}
.cartao-servico:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(27, 59, 92, 0.14);
  border-color: var(--salva);
}
.cartao-servico:focus-visible {
  outline: 2px solid var(--pinho);
  outline-offset: 2px;
}
.cartao-servico.ativa {
  border-color: var(--pinho);
  box-shadow: inset 0 0 0 1px var(--pinho), 0 10px 24px rgba(27, 59, 92, 0.12);
}
.cartao-servico.ativa .corpo::after {
  content: 'Selecionado ✓';
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--pinho);
  background: var(--salva-clara);
  border-radius: 6px;
  padding: 0.12rem 0.5rem;
  align-self: flex-start;
}

.cartao-servico .foto {
  display: block;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: var(--salva-clara);
}
.cartao-servico .foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}
.cartao-servico:hover .foto img { transform: scale(1.06); }

.cartao-servico .corpo {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0.85rem 1rem 1rem;
  flex: 1;
}
.cartao-servico strong {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.05rem;
  color: var(--pinho);
  line-height: 1.3;
}
.cartao-servico .descricao {
  color: var(--tinta-suave);
  font-size: 0.88rem;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cartao-servico .meta {
  margin-top: auto;
  padding-top: 0.4rem;
  color: var(--pinho);
  font-weight: 600;
  font-size: 0.86rem;
}

@media (max-width: 560px) {
  .grelha-servicos { grid-template-columns: 1fr 1fr; gap: 0.7rem; }
  .cartao-servico .descricao { -webkit-line-clamp: 2; font-size: 0.82rem; }
  .cartao-servico .corpo { padding: 0.7rem 0.75rem 0.85rem; }
  .cartao-servico strong { font-size: 0.95rem; }
}

@media (prefers-reduced-motion: reduce) {
  .passo, .cartao-servico { animation: none; }
  .cartao-servico, .cartao-servico .foto img { transition: none; }
  .cartao-servico:hover { transform: none; }
  .cartao-servico:hover .foto img { transform: none; }
}

/* --- Agenda pública (passo 1) — grelha suave e viva --- */
.cal-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.9rem;
}
.cal-titulo {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.4rem;
  color: var(--pinho);
  margin: 0;
  text-align: center;
  letter-spacing: 0.02em;
}
.cal-nav .btn { padding: 0.45rem 0.95rem; border-radius: 999px; }
.cal-nav .btn:disabled { opacity: 0.35; cursor: default; }

.cal-scroll { overflow-x: auto; padding: 4px; margin: -4px; }
.cal-grelha {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  min-width: 720px;
}
.cal-cabecalho {
  text-align: center;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pinho);
  background: var(--salva-clara);
  border-radius: var(--raio-pilula, 10px);
  padding: 0.42rem 0.3rem;
  margin-bottom: 2px;
}
.cal-dia {
  font: inherit;
  position: relative;
  min-height: 88px;
  text-align: left;
  background: #fff;
  border: 1px solid #e1eaf1;
  border-radius: 14px;
  padding: 0.5rem 0.65rem;
  color: var(--tinta-suave);
  cursor: default;
  animation: surgir 0.45s ease both;
  transition: transform 0.18s ease, box-shadow 0.18s ease,
              background 0.18s ease, border-color 0.18s ease;
}
.cal-dia .cal-numero {
  font-family: var(--serif);
  font-size: 1.15rem;
  color: var(--tinta-suave);
}
.cal-dia.livre {
  cursor: pointer;
  border-color: #d2deea;
  box-shadow: 0 1px 3px rgba(27, 59, 92, 0.06);
}
.cal-dia.livre .cal-numero { color: var(--pinho); }
.cal-dia.livre .cal-etiqueta {
  position: absolute;
  left: 0.6rem;
  bottom: 0.55rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--pinho);
  background: var(--salva-clara);
  border-radius: var(--raio-pilula, 10px);
  padding: 0.14rem 0.55rem;
  transition: background 0.18s ease, color 0.18s ease;
}
.cal-dia.livre::after {
  content: '';
  position: absolute;
  right: 0.65rem;
  top: 0.72rem;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--salva);
}
.cal-dia.livre:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(27, 59, 92, 0.16);
  border-color: var(--salva);
  background: #fbfdfb;
}
.cal-dia.livre:hover .cal-etiqueta { background: var(--pinho); color: #fff; }
.cal-dia.livre:focus-visible { outline: 2px solid var(--pinho); outline-offset: 2px; }
.cal-dia.selecionado,
.cal-dia.selecionado:hover {
  background: var(--pinho);
  border-color: var(--pinho);
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(27, 59, 92, 0.3);
}
.cal-dia.selecionado .cal-numero { color: #fff; }
.cal-dia.selecionado::after { background: #fff; }
.cal-dia.selecionado .cal-etiqueta { background: rgba(255, 255, 255, 0.18); color: #fff; }
.cal-dia.cheio {
  background: #fcf9f5;
  border-color: #f4ecdf;
  color: #b6a288;
  cursor: not-allowed;
}
.cal-dia.cheio .cal-numero { color: #c3af97; }
.cal-dia.cheio::before {
  content: 'esgotado';
  position: absolute;
  left: 0.6rem;
  bottom: 0.55rem;
  font-size: 0.68rem;
  font-weight: 600;
  color: #c3af97;
}
.cal-dia.fora, .cal-dia.vazio {
  background: transparent;
  border-color: transparent;
  min-height: 88px;
  animation: none;
}
.cal-dia.fora .cal-numero { color: #c8d1da; font-family: var(--sans); font-size: 0.95rem; }
.cal-dia:disabled { pointer-events: none; }
.ponto.cheio { background: #fcf9f5; border-color: #f4ecdf; }

.sub-titulo {
  font-family: var(--sans);
  font-size: 0.95rem;
  color: var(--tinta-suave);
  font-weight: 400;
}

@media (max-width: 560px) {
  .cal-grelha { gap: 5px; min-width: 640px; }
  .cal-dia { min-height: 74px; border-radius: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .cal-dia { transition: none; animation: none; }
  .cal-dia.livre:hover, .cal-dia.selecionado { transform: none; }
}

/* --- Cabeçalho com fotografia e resumo estruturado --- */
.topo.hero {
  position: relative;
  padding: 0;
  overflow: hidden;
}
.hero-foto {
  display: block;
  width: 100%;
  height: clamp(220px, 34vw, 340px);
  object-fit: cover;
}
.hero-conteudo {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: linear-gradient(to bottom, rgba(18, 30, 43, 0.25), rgba(18, 30, 43, 0.55));
}
.topo.hero .marca { color: #dee7f1; }
.topo.hero h1 { color: #ffffff; text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35); }
.topo.hero .sub { color: #e7edf3; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35); }

.resumo { display: flex; flex-direction: column; gap: 0.35rem; font-weight: 400; }
.resumo-titulo {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.05rem;
  margin-bottom: 0.25rem;
}
.resumo-linha {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px dashed rgba(27, 59, 92, 0.25);
  padding-bottom: 0.3rem;
  font-size: 0.92rem;
}
.resumo-linha:last-child { border-bottom: none; font-size: 1rem; }
.resumo-linha span { color: var(--tinta-suave); }
.resumo-linha strong { text-align: right; }

.rodape-legal { margin-top: 0.3rem; font-size: 0.8rem; }
.rodape-legal a { color: var(--tinta-suave); }

/* ============================================================
   Painel de gestão — layout, KPIs e timeline
   ============================================================ */
.admin-corpo { background: #eef0eb; display: block; }
.admin-layout { display: flex; min-height: 100vh; }

.admin-lateral {
  width: 230px;
  flex-shrink: 0;
  background: var(--pinho);
  color: #e5ecf3;
  display: flex;
  flex-direction: column;
  padding: 1.4rem 0.9rem;
  position: sticky;
  top: 0;
  height: 100vh;
}
.admin-marca {
  font-family: var(--serif);
  font-size: 1.15rem;
  color: #fff;
  margin: 0 0.6rem 1.4rem;
  line-height: 1.3;
}
.admin-marca span {
  display: block;
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #98b7d9;
}
.admin-nav { display: flex; flex-direction: column; gap: 0.15rem; }
.admin-nav a {
  color: #dee7f1;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.93rem;
  padding: 0.55rem 0.8rem;
  border-radius: 8px;
  transition: background 0.15s;
}
.admin-nav a:hover { background: rgba(255, 255, 255, 0.08); }
.admin-nav a.ativo { background: rgba(255, 255, 255, 0.14); color: #fff; }
.admin-nav-fundo { margin-top: auto; border-top: 1px solid rgba(255, 255, 255, 0.12); padding-top: 0.8rem; }
.admin-nav-fundo a { font-weight: 400; font-size: 0.86rem; color: #b3cae2; }

.admin-conteudo { flex: 1; padding: 1.6rem clamp(1rem, 3vw, 2.2rem) 3rem; min-width: 0; }
.admin-cabecalho h1 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.7rem;
  color: var(--pinho);
  margin: 0 0 1.1rem;
}

.flash { border-radius: var(--raio); padding: 0.7rem 1rem; margin: 0 0 1rem; font-weight: 600; }
.flash-ok { background: var(--salva-clara); color: var(--pinho); }
.flash-erro { background: var(--erro-fundo); color: var(--erro); }

/* KPIs */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0.9rem; margin-bottom: 1.2rem; }
.kpi {
  background: #fff;
  border: 1px solid #efece9;
  border-radius: 14px;
  padding: 1rem 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  text-decoration: none;
  color: var(--tinta);
}
a.kpi:hover { border-color: var(--salva); }
.kpi-valor { font-family: var(--serif); font-size: 1.7rem; color: var(--pinho); line-height: 1.1; }
.kpi-rotulo { font-size: 0.82rem; font-weight: 600; color: var(--tinta-suave); text-transform: uppercase; letter-spacing: 0.05em; }
.kpi-atencao { border-color: #ebd7bf; background: #fefaf5; }
.kpi-atencao .kpi-valor { color: #886c47; }

/* Cartões do painel */
.painel-grelha { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0.9rem; align-items: start; }
.painel-grelha .painel-cartao:first-child { grid-row: span 2; }
.painel-cartao {
  background: #fff;
  border: 1px solid #efece9;
  border-radius: 14px;
  padding: 1.1rem 1.2rem 1.2rem;
}
.painel-cartao h3 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.1rem;
  color: var(--pinho);
  margin: 0 0 0.7rem;
}
.acoes-linha { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.mini-btn { padding: 0.35rem 0.7rem; font-size: 0.84rem; }

.lista-proximas { list-style: none; margin: 0; padding: 0; }
.lista-proximas li { border-bottom: 1px solid #f5f3f0; }
.lista-proximas li:last-child { border-bottom: none; }
.lista-proximas a {
  display: grid;
  gap: 0.05rem;
  padding: 0.5rem 0.2rem;
  text-decoration: none;
  color: var(--tinta);
  border-radius: 8px;
}
.lista-proximas a:hover { background: var(--fundo); }
.lista-proximas .quando { font-size: 0.8rem; font-weight: 700; color: var(--pinho); }
.lista-proximas .quem { font-size: 0.9rem; }
.lista-proximas .com { font-size: 0.82rem; color: var(--tinta-suave); }
.lista-ausencias { list-style: none; margin: 0; padding: 0; }
.lista-ausencias li { padding: 0.35rem 0; border-bottom: 1px solid #f5f3f0; font-size: 0.92rem; }
.lista-ausencias li:last-child { border-bottom: none; }

/* Agenda do dia — timeline */
.dia-nav { display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; margin-bottom: 1rem; }
.dia-nav-centro { text-align: center; }
.dia-nav-centro h2 { font-family: var(--serif); font-weight: 400; font-size: 1.25rem; color: var(--pinho); margin: 0; }
.dia-nav-salto { display: flex; gap: 0.6rem; align-items: center; justify-content: center; margin-top: 0.2rem; }
.dia-nav-salto input { font: inherit; font-size: 0.85rem; border: 1px solid #edeae5; border-radius: 8px; padding: 0.25rem 0.5rem; background: #fff; color: var(--tinta); }
.dia-nav-salto a { font-size: 0.85rem; color: var(--pinho); font-weight: 600; }
.dia-nav .btn { text-decoration: none; }

.timeline {
  display: flex;
  background: #fff;
  border: 1px solid #efece9;
  border-radius: 14px;
  overflow: hidden;
}
.timeline-horas { width: 58px; flex-shrink: 0; border-right: 1px solid #f5f3f0; }
.timeline-cab {
  height: 58px;
  border-bottom: 1px solid #efece9;
  padding: 0.5rem 0.7rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.05rem;
}
.timeline-cab .sub { font-size: 0.78rem; }
.timeline-regua { position: relative; height: 640px; }
.timeline-regua span {
  position: absolute;
  right: 8px;
  transform: translateY(-50%);
  font-size: 0.72rem;
  color: var(--tinta-suave);
}
.timeline-coluna { flex: 1; min-width: 0; border-right: 1px solid #f5f3f0; }
.timeline-coluna:last-child { border-right: none; }
.timeline-pista { position: relative; height: 640px; background: #f6f7f3; }
.timeline-pista.ausente {
  background: repeating-linear-gradient(-45deg, #f1f2ee, #f1f2ee 8px, #f2f0ed 8px, #f2f0ed 16px);
}
.timeline-linha { position: absolute; left: 0; right: 0; border-top: 1px dashed #efece9; }
.turno { position: absolute; left: 0; right: 0; background: #fff; border-top: 1px solid #dce5ed; border-bottom: 1px solid #dce5ed; }

.bloco {
  position: absolute;
  left: 6px;
  right: 6px;
  border-radius: 9px;
  padding: 0.35rem 0.55rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  font-size: 0.8rem;
  line-height: 1.3;
  border: 1px solid;
  box-shadow: 0 2px 8px rgba(25, 42, 60, 0.08);
}
.bloco.confirmada { background: var(--salva-clara); border-color: var(--salva); color: var(--pinho); }
.bloco.pendente { background: #fef8f1; border-color: #ecd9ad; color: #6d5518; }
.bloco-hora { font-size: 0.72rem; font-weight: 700; }
.bloco-hora em { font-style: normal; font-weight: 600; opacity: 0.75; margin-left: 0.3rem; }
.bloco-servico { font-size: 0.75rem; opacity: 0.85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bloco-acoes { position: absolute; top: 0.3rem; right: 0.4rem; display: flex; gap: 0.25rem; }
.bloco .mini {
  font: inherit;
  font-size: 0.7rem;
  font-weight: 700;
  border: none;
  border-radius: 6px;
  padding: 0.12rem 0.4rem;
  cursor: pointer;
}
.bloco .mini.ok { background: var(--pinho); color: #fff; }
.bloco .mini.nao { background: rgba(163, 59, 45, 0.12); color: var(--erro); }

@media (max-width: 860px) {
  .admin-layout { flex-direction: column; }
  .admin-lateral { width: 100%; height: auto; position: static; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.4rem; padding: 0.8rem 1rem; }
  .admin-marca { margin: 0 0.8rem 0 0; font-size: 1rem; }
  .admin-marca span { display: none; }
  .admin-nav { flex-direction: row; flex-wrap: wrap; }
  .admin-nav a { padding: 0.4rem 0.6rem; font-size: 0.85rem; }
  .admin-nav-fundo { margin: 0 0 0 auto; border: none; padding: 0; }
  .painel-grelha { grid-template-columns: 1fr; }
  .timeline-regua, .timeline-pista { height: 520px; }
}

/* --- Modal do serviço --- */
.sem-scroll { overflow: hidden; }
.modal-fundo {
  position: fixed;
  inset: 0;
  background: rgba(18, 30, 43, 0.55);
  backdrop-filter: blur(3px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  z-index: 60;
  animation: surgir 0.25s ease both;
}
.modal-fundo.oculto { display: none; }
.modal {
  position: relative;
  background: #fff;
  border-radius: 18px;
  max-width: 520px;
  width: 100%;
  max-height: 92vh;
  overflow-y: auto;
  box-shadow: 0 24px 60px rgba(18, 30, 43, 0.35);
  animation: modal-entrar 0.3s ease both;
}
@keyframes modal-entrar {
  from { opacity: 0; transform: translateY(18px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.modal-fechar {
  position: absolute;
  top: 0.7rem;
  right: 0.7rem;
  width: 2.1rem;
  height: 2.1rem;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--tinta);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  z-index: 2;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}
.modal-fechar:hover { background: #fff; }
.modal-foto { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 18px 18px 0 0; background: var(--salva-clara); }
.modal-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.modal-corpo { padding: 1.2rem 1.4rem 1.5rem; }
.modal-categoria {
  margin: 0 0 0.15rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--salva);
}
.modal h3 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.45rem;
  color: var(--pinho);
  margin: 0 0 0.5rem;
}
.modal-descricao { color: var(--tinta); line-height: 1.6; margin: 0 0 0.5rem; }
.modal-duracao { color: var(--tinta-suave); font-size: 0.9rem; margin: 0 0 1rem; }
.modal-escolha { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.modal-escolha .btn { margin-top: 0; }

/* --- Carrinho de marcações --- */
#passo-carrinho {
  background: #fff;
  border: 1px solid var(--salva);
  border-radius: 14px;
  padding: 1.1rem 1.2rem 1.2rem;
}
#passo-carrinho h2 { margin-top: 0; }
.carrinho-item {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 0.8rem;
  align-items: center;
  padding: 0.55rem 0;
  border-bottom: 1px dashed rgba(27, 59, 92, 0.25);
}
.carrinho-item:last-child { border-bottom: none; }
.carrinho-quando { font-size: 0.82rem; font-weight: 700; color: var(--pinho); white-space: nowrap; }
.carrinho-nome { font-size: 0.92rem; min-width: 0; }
.carrinho-nome span { color: var(--tinta-suave); font-size: 0.85rem; }
.carrinho-preco { font-weight: 700; color: var(--pinho); white-space: nowrap; }
.carrinho-remover {
  width: 1.7rem;
  height: 1.7rem;
  border: none;
  border-radius: 50%;
  background: var(--erro-fundo);
  color: var(--erro);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
}
.carrinho-remover:hover { filter: brightness(0.96); }
.carrinho-total {
  text-align: right;
  font-size: 1.05rem;
  margin: 0.8rem 0;
  color: var(--pinho);
}
.carrinho-acoes { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.carrinho-acoes .btn { margin-top: 0; }
#btn-adicionar:disabled { opacity: 0.5; cursor: default; }

.cartao-cta {
  margin-top: 0.35rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--salva);
}
.cartao-servico:hover .cartao-cta { color: var(--pinho); }

@media (max-width: 560px) {
  .carrinho-item { grid-template-columns: 1fr auto; }
  .carrinho-quando { grid-column: 1 / -1; }
  .modal-corpo { padding: 1rem 1.1rem 1.2rem; }
}


/* --- Ficha da reserva e botão abrir --- */
.bloco .mini.abrir {
  background: rgba(27, 59, 92, 0.12);
  color: var(--pinho);
  text-decoration: none;
  display: inline-block;
}
.bloco .mini.abrir:hover { background: rgba(27, 59, 92, 0.2); }
table.ficha th {
  text-align: left;
  color: var(--tinta-suave);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.55rem 1rem 0.55rem 0;
  white-space: nowrap;
  vertical-align: top;
  border-bottom: 1px solid #f5f3f0;
}
table.ficha td { border-bottom: 1px solid #f5f3f0; }
table.ficha tr:last-child th, table.ficha tr:last-child td { border-bottom: none; }
input[type="file"] {
  display: block;
  width: 100%;
  margin-top: 0.3rem;
  font: inherit;
  font-size: 0.9rem;
  color: var(--tinta);
}

/* ============================================================
   Mobile-first para o cliente (≤ 640px)
   ============================================================ */
.dia-curto { display: none; }
.barra-movel { display: none; }

@media (max-width: 640px) {
  /* Espaço geral mais eficiente */
  .cartao.largo-publico { width: calc(100% - 1.2rem); padding: 1.1rem 0.85rem 1.6rem; border-radius: 14px; }
  .topo.hero .hero-foto { height: 190px; }
  .passo { margin-top: 1.4rem; }
  .passo h2 { font-size: 1.08rem; }

  /* --- Calendário compacto: cabe no ecrã, sem scroll horizontal --- */
  .dia-longo { display: none; }
  .dia-curto { display: inline; }
  .cal-scroll { overflow: visible; padding: 0; margin: 0; }
  .cal-grelha { min-width: 0; gap: 4px; }
  .cal-cabecalho {
    font-size: 0.62rem;
    letter-spacing: 0.04em;
    padding: 0.3rem 0;
    border-radius: 8px;
  }
  .cal-dia {
    min-height: 46px;
    padding: 0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: none;
  }
  .cal-dia .cal-numero { font-size: 0.98rem; }
  .cal-dia.livre .cal-etiqueta { display: none; }
  .cal-dia.livre::after {
    right: auto;
    top: auto;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    width: 5px;
    height: 5px;
  }
  .cal-dia.cheio::before { display: none; }
  .cal-dia.cheio { background: #f9f5ef; }
  .cal-dia.fora, .cal-dia.vazio { min-height: 46px; }
  .cal-dia.livre:hover { transform: none; box-shadow: 0 1px 3px rgba(27, 59, 92, 0.06); }
  .cal-dia.selecionado, .cal-dia.selecionado:hover { transform: none; box-shadow: 0 4px 12px rgba(27, 59, 92, 0.25); }
  .cal-nav .btn { min-width: 44px; min-height: 44px; }
  .cal-titulo { font-size: 1.15rem; }

  /* --- Serviços: carrossel com swipe por categoria --- */
  .grelha-servicos {
    display: flex;
    gap: 0.7rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding: 4px 4px 0.9rem;
    margin: -4px -4px 0;
    scrollbar-width: none;
  }
  .grelha-servicos::-webkit-scrollbar { display: none; }
  .cartao-servico {
    flex: 0 0 74%;
    max-width: 74%;
    scroll-snap-align: start;
    animation: none;
  }
  .cartao-servico .descricao { -webkit-line-clamp: 2; }
  .categoria { font-size: 0.92rem; }
  .categoria::after {
    content: '  · deslize →';
    font-family: var(--sans);
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.74rem;
    color: var(--tinta-suave);
  }

  /* --- Modal em bottom sheet --- */
  .modal-fundo { align-items: flex-end; padding: 0; }
  .modal {
    max-width: none;
    width: 100%;
    max-height: 90vh;
    border-radius: 20px 20px 0 0;
    animation: folha-subir 0.32s ease both;
    padding-bottom: env(safe-area-inset-bottom);
  }
  @keyframes folha-subir {
    from { transform: translateY(45%); opacity: 0.6; }
    to   { transform: translateY(0); opacity: 1; }
  }
  .modal::before {
    content: '';
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    width: 42px;
    height: 4px;
    border-radius: var(--raio-pilula, 10px);
    background: #d1dae3;
    z-index: 2;
  }
  .modal-foto { border-radius: 20px 20px 0 0; aspect-ratio: 16 / 8; }
  .modal-escolha { flex-direction: column; }
  .modal-escolha .btn { width: 100%; min-height: 48px; }

  /* --- Alvos táteis --- */
  .opcao.hora { min-height: 46px; }
  .opcao { min-height: 48px; justify-content: center; }
  .btn { min-height: 48px; }
  .carrinho-remover { width: 2.1rem; height: 2.1rem; }

  /* --- Barra fixa inferior com o total --- */
  .barra-movel {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.65rem 1rem calc(0.65rem + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(10px);
    border-top: 1px solid #efece9;
    box-shadow: 0 -6px 22px rgba(25, 42, 60, 0.12);
    animation: folha-subir 0.28s ease both;
  }
  .barra-movel.oculto { display: none; }
  .barra-resumo {
    display: flex;
    flex-direction: column;
    font-size: 0.78rem;
    color: var(--tinta-suave);
    line-height: 1.25;
  }
  .barra-resumo strong {
    font-family: var(--serif);
    font-size: 1.15rem;
    color: var(--pinho);
  }
  .barra-movel .btn { margin-top: 0; min-height: 44px; padding: 0.6rem 1.5rem; white-space: nowrap; }
  body.com-barra .cartao.largo-publico { margin-bottom: 6rem; }
  body.com-barra .rodape { padding-bottom: 6rem; }

  /* Formulário e resumo confortáveis */
  .filtros { flex-direction: column; align-items: stretch; }
  .resumo-linha { font-size: 0.88rem; }
  .aceite { font-size: 0.88rem; }

  @media (prefers-reduced-motion: reduce) {
    .modal, .barra-movel { animation: none; }
  }
}

/* --- Hóspedes: método de pagamento e portão do quarto --- */
.metodo-pagamento {
  border: 1px solid var(--salva);
  border-radius: 12px;
  padding: 0.9rem 1rem;
  margin: 0.5rem 0 1rem;
}
.metodo-pagamento legend {
  font-weight: 600;
  color: var(--pinho);
  padding: 0 0.4rem;
}
.metodo-pagamento .radio {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  padding: 0.45rem 0;
  cursor: pointer;
  font-size: 0.92rem;
}
.metodo-pagamento .radio input { margin-top: 0.2rem; accent-color: var(--pinho); }
#passo-quarto .campo input { font-size: 1.1rem; letter-spacing: 0.08em; }

/* --- Mini-agenda de horários (pintura A/B/C/F/FE) --- */
.mini-codigos { display: flex; gap: 0.45rem; flex-wrap: wrap; margin-top: 0.4rem; }
.mini-codigo {
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: var(--raio-pilula, 10px);
  padding: 0.35rem 0.8rem;
  border: 2px solid transparent;
  color: var(--tinta);
}
.mini-codigo.ativo { border-color: var(--pinho); box-shadow: 0 2px 8px rgba(27, 59, 92, 0.2); }
.cod-A { background: #d9e9f8; color: #1f5c3d; }
.cod-B { background: #dde7f5; color: #274d80; }
.cod-C { background: #f5eee4; color: #6f5636; }
.cod-F { background: #ececec; color: #555; }
.cod-FE { background: #f4dcdc; color: #8a2f2f; }
.cod-X { background: #fff; color: var(--tinta-suave); border: 1px dashed #c1ced9; }
.cod-P { background: #e8dff2; color: #5b3e80; }

.mini-grelha {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  max-width: 560px;
}
.mini-cab {
  text-align: center;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--tinta-suave);
  padding: 0.2rem 0;
}
.mini-forma { display: contents; }
.mini-dia {
  font: inherit;
  aspect-ratio: 1 / 0.9;
  border: 1px solid #efece9;
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.05rem;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.mini-dia:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(27, 59, 92, 0.18); }
.mini-dia.vazio { visibility: hidden; }
.mini-num { font-size: 0.78rem; font-weight: 600; opacity: 0.8; }
.mini-letra { font-size: 0.95rem; font-weight: 700; line-height: 1; }

/* Bloco flutuante (por atribuir) na timeline */
.bloco.flutuante { background: #ece5f5; border-color: #cbb8e4; color: #4a3568; }
.ponto.flutuante { background: #ece5f5; border-color: #cbb8e4; }

/* --- Circuito húmido --- */
.circ-lotacao { display: grid; gap: 4px; }
.circ-linha { display: flex; align-items: center; gap: 0.5rem; }
.circ-hora { font-size: 0.74rem; color: var(--tinta-suave); width: 42px; text-align: right; }
.circ-barra {
  position: relative;
  flex: 1;
  height: 22px;
  background: #f0f2ee;
  border-radius: 6px;
  overflow: hidden;
}
.circ-barra i { display: block; height: 100%; background: #b7d4f1; transition: width 0.2s ease; }
.circ-barra.quase i { background: #ebd7bf; }
.circ-barra.cheio i { background: #e8b3a9; }
.circ-barra em {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-style: normal;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--tinta-suave);
}
.circ-tag-h { background: #d9e9f8; color: #1f5c3d; }
.circ-tag-e { background: #dde7f5; color: #274d80; }
.circ-dia { text-decoration: none; }
.circ-dia.com-agenda { background: #eaf3fa; border-color: #b9d3e8; }
.circ-dia.com-agenda .mini-letra { color: #274d80; }

/* --- Hóspedes: escolha Circuito vs SPA --- */
.escolha-cartoes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 0.4rem;
}
.escolha-cartao {
  font: inherit;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 1.4rem 1.3rem 1.2rem;
  border-radius: 18px;
  border: 1px solid #dbe4ed;
  background: linear-gradient(160deg, #ffffff 0%, #f4f8f4 100%);
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.escolha-cartao:hover, .escolha-cartao:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(27, 59, 92, 0.18);
  border-color: var(--salva);
}
#btn-escolha-circuito { background: linear-gradient(160deg, #f2f8fa 0%, #dcecf1 100%); }
.escolha-icone {
  font-size: 1.9rem;
  color: var(--pinho);
  line-height: 1;
}
.escolha-titulo {
  font-family: var(--serif);
  font-size: 1.25rem;
  color: var(--pinho);
}
.escolha-desc { font-size: 0.88rem; color: var(--tinta-suave); }
.escolha-nota {
  margin-top: 0.4rem;
  align-self: flex-start;
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--pinho);
  background: rgba(255, 255, 255, 0.75);
  border-radius: var(--raio-pilula, 10px);
  padding: 0.25rem 0.7rem;
}
.circ-passo-titulo {
  font-weight: 600;
  color: var(--pinho);
  margin: 1.2rem 0 0.5rem;
}
.pessoas-chips { display: flex; gap: 0.45rem; flex-wrap: wrap; }
.pessoa-chip {
  font: inherit;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #d0dbe5;
  background: #fff;
  font-weight: 700;
  color: var(--tinta);
  cursor: pointer;
  transition: all 0.15s ease;
}
.pessoa-chip:hover { border-color: var(--salva); transform: translateY(-2px); }
.pessoa-chip.ativa { background: var(--pinho); border-color: var(--pinho); color: #fff; }
.circ-resumo {
  margin-top: 1.1rem;
  background: var(--salva-clara);
  border-radius: 14px;
  padding: 1rem 1.2rem;
}
.circ-resumo p:first-child { margin: 0 0 0.7rem; font-size: 1.02rem; color: #192a3c; }
.circ-barra.bloq { background: #f6e3e1; }
.circ-barra.bloq i { background: repeating-linear-gradient(45deg, #e2a49c, #e2a49c 6px, #eec4be 6px, #eec4be 12px); }
.circ-barra.bloq em { color: #8a2f2f; }
@media (max-width: 640px) {
  .escolha-cartoes { grid-template-columns: 1fr; }
}

/* --- Secções colapsáveis (horários) --- */
details.colapsavel > summary {
  cursor: pointer;
  list-style: none;
  user-select: none;
}
details.colapsavel > summary::-webkit-details-marker { display: none; }
details.colapsavel > summary h3 { margin: 0; display: inline-block; }
details.colapsavel > summary::before {
  content: '▸';
  color: var(--pinho);
  margin-right: 0.5rem;
  font-size: 0.9rem;
}
details.colapsavel[open] > summary::before { content: '▾'; }
details.colapsavel[open] > summary { margin-bottom: 0.7rem; }

/* --- Horas do circuito (hóspedes): compactas e apelativas --- */
.opcoes.horas.compacta { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 0.45rem; }
.opcoes.horas.compacta .opcao.hora {
  border-radius: var(--raio-pilula, 10px);
  justify-content: center;
  font-weight: 600;
  padding: 0.5rem 0.3rem;
  background: #fff;
}
.opcoes.horas.compacta .opcao.hora:hover { transform: translateY(-2px); box-shadow: 0 5px 12px rgba(27, 59, 92, 0.14); }
.opcoes.horas.compacta .opcao.hora.ativa { background: var(--pinho); border-color: var(--pinho); color: #fff; }

/* --- Nota RGPD no formulário --- */
.rgpd-nota {
  font-size: 0.78rem;
  line-height: 1.55;
  color: var(--tinta-suave);
  background: #f4f6f2;
  border: 1px solid #dee8f0;
  border-radius: 12px;
  padding: 0.8rem 1rem;
  margin: 0.9rem 0;
}
.rgpd-nota a { color: var(--pinho); }

/* --- Acordeão dos agendamentos do circuito --- */
.circ-lista .circ-detalhe > td {
  background: #f6f8f4;
  border-left: 3px solid var(--pinho);
  padding: 0.9rem 1rem;
}
.circ-detalhe-acoes {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
  margin-top: 0.6rem;
}
.circ-detalhe-acoes p { flex: 1; min-width: 200px; }

/* --- Seletor de idiomas --- */
.idiomas {
  position: absolute;
  top: 14px;
  right: 16px;
  z-index: 3;
  display: flex;
  gap: 0.3rem;
  align-items: center;
  background: rgba(17, 30, 44, 0.55);
  backdrop-filter: blur(4px);
  border-radius: var(--raio-pilula, 10px);
  padding: 0.28rem;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.idiomas a {
  color: rgba(255, 255, 255, 0.75);
  text-decoration: none;
  padding: 0.34rem 0.85rem;
  border-radius: var(--raio-pilula, 10px);
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: background 0.15s ease, color 0.15s ease;
}
.idiomas a:hover { color: #fff; background: rgba(255, 255, 255, 0.14); }
.idiomas a.ativo { background: #f4f8f4; color: #1b3b5c; }

.idiomas a { display: flex; align-items: center; gap: 0.45rem; }
.idiomas .bandeira { width: 19px; height: 13px; border-radius: 2.5px; display: block;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12); flex: none; }

@media (min-width: 900px) {
  .idiomas { top: 20px; right: 24px; font-size: 1.05rem; }
  .idiomas a { padding: 0.5rem 1.15rem; gap: 0.55rem; }
  .idiomas .bandeira { width: 23px; height: 16px; }
}


/* --- Calendário em inglês: etiqueta do dia cheio --- */
html[lang="en"] .cal-dia.cheio::before { content: 'full'; }

/* --- Horários: almoço ao lado da mini-agenda --- */
.mini-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 1.6rem;
  align-items: start;
}
.almoco-lateral {
  background: #fefbf7;
  border: 1px solid #f3eadd;
  border-left: 4px solid #cfaa7b;
  border-radius: 14px;
  padding: 1rem 1.1rem 1.1rem;
  position: sticky;
  top: 1rem;
}
.almoco-lateral h3 { margin-top: 0; }
.almoco-lateral .filtros { flex-direction: column; align-items: stretch; gap: 0.6rem; }
.almoco-lateral .campo, .almoco-lateral .btn { width: 100%; }
@media (max-width: 1150px) {
  .mini-layout { grid-template-columns: 1fr; }
  .almoco-lateral { position: static; }
}


/* --- Mini-agenda: almoço visível na célula --- */
.mini-dia { min-height: 74px; }
.mini-almoco {
  display: block;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1.25;
  color: #836640;
  background: #fdf6eb;
  border-radius: 6px;
  padding: 1px 4px;
  margin-top: 3px;
  white-space: nowrap;
}


/* --- Cabeçalho do admin com ações junto ao título --- */
.admin-cabecalho {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.cabecalho-acoes {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.cabecalho-acoes input[type="date"] {
  border: 1px solid #edeae5;
  border-radius: 10px;
  padding: 0.35rem 0.5rem;
  font: inherit;
  background: #fff;
}

/* ============================================================
   Admin mais colorido — acentos com lógica
   verde = feito/confirmado · âmbar = pendente/dinheiro por cobrar
   azul = circuito/informação · vermelho = perigo/bloqueios
   ============================================================ */
.kpi { border-top: 4px solid transparent; transition: transform 0.14s ease, box-shadow 0.14s ease; }
a.kpi:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(27, 43, 59, 0.14); }
.kpi-verde { border-top-color: #4f8f6a; }
.kpi-verde .kpi-valor { color: #2e6b4a; }
.kpi-azul { border-top-color: #5a93a8; }
.kpi-azul .kpi-valor { color: #2c6478; }
.kpi-ambar { border-top-color: #d8a94e; }
.kpi-ambar .kpi-valor { color: #96701c; }
.kpi-pinho { border-top-color: var(--pinho); }
.kpi-pinho .kpi-valor { color: var(--pinho); }

.etiqueta.confirmada { background: #e2f1e7; color: #1e5c37; }

/* menu lateral: item ativo com barra e hover suave */
.admin-menu a { border-left: 3px solid transparent; transition: background 0.12s ease; }
.admin-menu a:hover { background: rgba(255, 255, 255, 0.08); }
.admin-menu a.ativo { border-left-color: #cfaa7b; }

/* tabelas do painel: cabeçalho tingido e hover nas linhas */
.agenda thead th { background: #eaf3fa; color: var(--pinho); }
.agenda tbody tr { transition: background 0.1s ease; }
.agenda tbody tr:hover > td { background: #f6f9f5; }

/* títulos das secções com filete */
.painel-cartao > h3 {
  padding-bottom: 0.45rem;
  border-bottom: 2px solid var(--salva-clara);
}

/* navegação das listas (próximas marcações) */
.lista-nav {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-top: 0.8rem;
}

/* lista de próximas: pontinho colorido por estado */
.lista-proximas li { border-left: 3px solid #dee8f0; transition: border-color 0.12s ease; }
.lista-proximas li:has(.etiqueta.pendente) { border-left-color: #d8a94e; }
.lista-proximas li:has(.etiqueta.confirmada) { border-left-color: #4f8f6a; }

/* --- Mini-agenda conjunta: os dois terapeutas em cada dia --- */
.mini-grelha { max-width: 1080px; }
.mini-dia { min-height: 96px; gap: 3px; }
.mini-linha {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.68rem;
  line-height: 1.2;
  padding: 1px 3px;
  border-radius: 6px;
  width: 100%;
  justify-content: center;
  flex-wrap: wrap;
}
.mini-linha.alvo { background: #ebf3fa; }
.mini-quem { font-style: normal; color: var(--tinta-suave); font-weight: 600; }
.mini-linha .mini-letra { font-size: 0.85rem; }
.letra-A { color: #1f5c3d; }
.letra-B { color: #274d80; }
.letra-C { color: #8f7149; }
.letra-F { color: #868f96; }
.letra-FE { color: #a5484d; }
.letra-P { color: #6b4fa0; }
.letra-X { color: #bfc9d1; font-weight: 400; }
.mini-linha .mini-almoco { display: inline-block; margin-top: 0; font-size: 0.6rem; padding: 0 4px; }
.mini-terapeuta { font-weight: 700; }
.mini-terapeuta.ativo { outline: 2px solid var(--pinho); outline-offset: 1px; }

/* --- Pop-up de confirmação (casal com um só terapeuta) --- */
.confirm-fundo {
  position: fixed;
  inset: 0;
  background: rgba(16, 28, 41, 0.55);
  backdrop-filter: blur(3px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  z-index: 60;
}
.confirm-fundo.oculto { display: none; }
.confirm-caixa {
  background: #fff;
  border-radius: 20px;
  max-width: 460px;
  width: 100%;
  padding: 1.6rem 1.5rem 1.4rem;
  text-align: center;
  box-shadow: 0 24px 60px rgba(11, 23, 36, 0.35);
  animation: confirmEntra 0.22s ease;
}
@keyframes confirmEntra {
  from { transform: translateY(14px) scale(0.97); opacity: 0; }
  to { transform: none; opacity: 1; }
}
.confirm-icone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #fcf4e8;
  color: #8f7149;
  font-size: 1.6rem;
  margin-bottom: 0.6rem;
}
.confirm-caixa h3 {
  margin: 0 0 0.6rem;
  font-family: var(--serif);
  color: var(--pinho);
  font-size: 1.08rem;
  line-height: 1.45;
}
.confirm-caixa p { margin: 0 0 1.2rem; color: var(--tinta-suave); font-size: 0.93rem; line-height: 1.55; }
.confirm-botoes { display: flex; gap: 0.7rem; justify-content: center; flex-wrap: wrap; }
.confirm-botoes .btn { min-width: 170px; }
.btn.confirm-recusar {
  background: #fff;
  color: #9c3d34;
  border: 1px solid #dfa39b;
}
.btn.confirm-recusar:hover { background: #fdf1ef; }
@media (max-width: 480px) {
  .confirm-botoes { flex-direction: column; }
  .confirm-botoes .btn { width: 100%; }
}

/* --- Atribuir terapeuta: chips --- */
.chips-atribuir {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-top: 0.35rem;
}
.chip-radio input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.chip-radio span {
  display: inline-block;
  padding: 0.5rem 1.05rem;
  border-radius: var(--raio-pilula, 10px);
  border: 1.5px solid #cad7e2;
  background: #fff;
  font-weight: 600;
  color: var(--tinta);
  cursor: pointer;
  transition: all 0.14s ease;
}
.chip-radio span:hover { border-color: var(--salva); transform: translateY(-2px); box-shadow: 0 5px 12px rgba(27, 59, 92, 0.13); }
.chip-radio input:checked + span { background: var(--pinho); border-color: var(--pinho); color: #fff; }
.chip-radio input:focus-visible + span { outline: 2px solid var(--pinho); outline-offset: 2px; }

/* --- Estatísticas: mini-barras nas tabelas --- */
.mini-barra {
  display: block;
  height: 10px;
  border-radius: var(--raio-pilula, 10px);
  background: #edf1ec;
  overflow: hidden;
}
.mini-barra i { display: block; height: 100%; border-radius: var(--raio-pilula, 10px); background: #4f8f6a; }

/* --- Vista mensal do circuito: dias bloqueados --- */
.circ-dia.dia-bloq {
  background: repeating-linear-gradient(45deg, #fdf1ef, #fdf1ef 7px, #f7dfdb 7px, #f7dfdb 14px);
  border-color: #e6b7b0;
}
.mini-bloq-etq {
  display: block;
  font-size: 0.58rem;
  font-weight: 700;
  color: #8a2f2f;
  line-height: 1.2;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* --- Agenda do dia: linhas de serviço múltiplas --- */
.linha-servico { align-items: end; position: relative; }
.linha-servico + .linha-servico { border-top: 1px dashed #dde5ed; padding-top: 0.6rem; margin-top: 0.2rem; }
.linha-servico .remover-servico {
  padding: 0.35rem 0.7rem;
  color: #9c3d34;
  border-color: #dfa39b;
  align-self: end;
}


/* --- Painel: chip de valor do gráfico (tooltip instantâneo) --- */
.graf-chip {
  position: fixed;
  z-index: 60;
  background: var(--pinho);
  color: #f4f8f4;
  padding: 0.32rem 0.75rem;
  border-radius: var(--raio-pilula, 10px);
  font-size: 0.78rem;
  white-space: nowrap;
  box-shadow: 0 3px 10px rgba(24, 47, 69, 0.28);
  pointer-events: none;
}

/* --- Painel: gráfico mensal de reservas --- */
.graf-mes .graf-barra rect { transition: opacity 0.12s ease, filter 0.12s ease; cursor: default; }
.graf-mes .graf-barra:hover rect { opacity: 0.82; filter: brightness(1.06); }
.graf-mes .graf-barra:hover text { font-weight: 700; }

/* --- Painel: chip de valor do gráfico (tooltip instantâneo) --- */
.graf-chip {
  position: fixed;
  z-index: 60;
  background: var(--pinho);
  color: #f4f8f4;
  padding: 0.32rem 0.75rem;
  border-radius: var(--raio-pilula, 10px);
  font-size: 0.78rem;
  white-space: nowrap;
  box-shadow: 0 3px 10px rgba(24, 47, 69, 0.28);
  pointer-events: none;
}

/* --- Painel: gráfico mensal de reservas --- */
.graf-mes .graf-barra rect { transition: opacity 0.12s ease; }
.graf-mes .graf-barra:hover rect { opacity: 0.72; }
.graf-mes .graf-barra { cursor: default; }


/* --- Promoções: pílula no cartão do serviço --- */
.promo-pill {
  align-self: flex-start;
  background: #a7855a;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.18rem 0.6rem;
  border-radius: var(--raio-pilula, 10px);
  margin-bottom: 0.3rem;
}


/* --- Agenda do dia: coluna das canceladas (consulta) --- */
.coluna-canceladas { background: #fafaf8; }
.coluna-canceladas .timeline-cab strong { color: #9a5a52; }
.bloco.cancelado {
  background: #f1efec;
  border: 1px dashed #dcd9d5;
  color: #7c7a77;
}
.bloco.cancelado strong { text-decoration: line-through; text-decoration-thickness: 1px; }
.bloco.cancelado .mini.abrir { background: #eceae7; color: #5a5753; }
.ponto.cancelado { background: #dcd9d5; }

/* --- Notificação flutuante (canto inferior direito) --- */
.toast-flutuante {
  position: fixed;
  right: 18px;
  bottom: 86px; /* acima da bolha do assistente */
  z-index: 90;
  background: #2f7d4f;
  color: #fff;
  padding: 0.65rem 1.1rem;
  border-radius: 12px;
  font-size: 0.92rem;
  box-shadow: 0 6px 18px rgba(13, 36, 59, 0.3);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.22s ease, transform 0.22s ease;
  max-width: min(420px, 80vw);
}
.toast-flutuante.visivel { opacity: 1; transform: translateY(0); }
.toast-flutuante.aviso { background: #a8742a; bottom: 142px; }
.toast-flutuante.erro { background: #9c3d34; }

/* --- Suporte interno: separador, badge e fio de conversa --- */
.admin-nav-suporte {
  margin-top: auto;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 0.5rem;
}
.nav-badge {
  display: inline-block;
  min-width: 1.35em;
  text-align: center;
  background: #b18c5c;
  color: #fff;
  border-radius: var(--raio-pilula, 10px);
  font-style: normal;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.1rem 0.35rem;
  margin-left: 0.35rem;
  vertical-align: 1px;
}
.ticket-caixa {
  border: 1px solid #efece9;
  border-radius: 12px;
  padding: 0.6rem 0.85rem;
  margin: 0.55rem 0;
  background: #fff;
}
.ticket-caixa summary {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}
.ticket-cab-detalhe { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; }
.ticket-fio { margin-top: 0.7rem; display: flex; flex-direction: column; gap: 0.5rem; }
.ticket-msg {
  border-radius: 12px;
  padding: 0.55rem 0.8rem;
  max-width: 46rem;
}
.ticket-msg p { margin: 0.25rem 0 0; }
.ticket-msg.de-mim { background: #f2f5f1; border: 1px solid #dee7f0; }
.ticket-msg.de-gestor {
  background: #eef3f5;
  border: 1px solid #d7e2e6;
  border-left: 4px solid #5a93a8;
  align-self: flex-end;
}
.ticket-quem { font-size: 0.78rem; color: #65727e; font-weight: 700; }
.ticket-quem em { font-weight: 400; margin-left: 0.4rem; }
.ticket-responder { display: flex; gap: 0.5rem; align-items: flex-start; margin-top: 0.3rem; }
.ticket-responder textarea { flex: 1; }


/* Abril Fatface só tem um peso: títulos em 400 real, com o respiro certo de um display serif */
h1, h2, h3, .hero h1, #cal-titulo {
  font-weight: 400;
  letter-spacing: 0.012em;
  line-height: 1.18;
}
.cartao-servico strong {
  line-height: 1.25;
  letter-spacing: 0.01em;
}



/* --- Móvel: conteúdos largos deslizam no próprio caixilho, a página fica quieta --- */
@media (max-width: 700px) {
  .timeline,
  .mini-grelha,
  .circ-grelha {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .mini-grelha {
    max-width: none;
    grid-template-columns: repeat(7, minmax(86px, 1fr));
  }
  .timeline-coluna { min-width: 190px; }
  table.agenda {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  table.agenda th, table.agenda td { white-space: nowrap; }
}

/* --- Móvel: formulários e painéis encolhem em vez de empurrar a página --- */
@media (max-width: 700px) {
  .painel-cartao { min-width: 0; }
  .painel-cartao svg { max-width: 100%; height: auto; }
  .filtros { flex-wrap: wrap; }
  .campo { min-width: 0; flex: 1 1 150px; max-width: 100%; }
  .campo select,
  .campo input,
  .campo textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
  .mini-esq { min-width: 0; max-width: 100%; }
  .mini-codigos { flex-wrap: wrap; }
  .mini-codigos button, .mini-codigos .btn { white-space: normal; text-align: left; }
  .mes-nav { flex-wrap: wrap; }
}


/* --- Chat interno da equipa (bolha + painel flutuante) --- */
#chat-bolha {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 95;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: none;
  background: var(--pinho, #1b3b5c);
  color: #fff;
  font-size: 1.45rem;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(13, 36, 59, 0.35);
}
#chat-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 20px;
  height: 20px;
  border-radius: var(--raio-pilula, 10px);
  background: #c9531f;
  color: #fff;
  font-style: normal;
  font-size: 0.72rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
}
#chat-painel {
  position: fixed;
  right: 84px;               /* à esquerda da bolha, alinhado com ela */
  bottom: 18px;
  z-index: 95;
  width: min(340px, calc(100vw - 104px));
  height: min(460px, 70vh);
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 12px 34px rgba(13, 36, 59, 0.3);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: chat-desliza 0.18s ease-out;
  transform-origin: right bottom;
}
@keyframes chat-desliza {
  from { opacity: 0; transform: translateX(22px); }
  to { opacity: 1; transform: translateX(0); }
}
#chat-painel[hidden] { display: none; }
#chat-badge[hidden] { display: none; }
.chat-cab {
  background: var(--pinho, #1b3b5c);
  color: #fff;
  padding: 0.55rem 0.85rem;
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}
.chat-nota { font-size: 0.66rem; opacity: 0.75; flex: 1; }
#chat-fechar {
  background: none;
  border: none;
  color: #fff;
  font-size: 1.15rem;
  cursor: pointer;
  line-height: 1;
}
#chat-corpo {
  flex: 1;
  overflow-y: auto;
  padding: 0.7rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  background: #f6f7f4;
}
.chat-msg { display: flex; flex-direction: column; align-items: flex-start; max-width: 86%; }
.chat-msg.minha { align-self: flex-end; align-items: flex-end; }
.chat-quem { font-size: 0.68rem; font-weight: 700; margin: 0 0 2px 6px; }
.chat-bolha-txt {
  background: #fff;
  border: 1px solid #efece9;
  border-left: 3px solid #ccc;
  border-radius: 4px 14px 14px 14px;
  padding: 0.42rem 0.7rem;
  font-size: 0.86rem;
  line-height: 1.35;
  word-break: break-word;
}
.chat-msg.minha .chat-bolha-txt {
  background: var(--pinho, #1b3b5c);
  color: #f2f6f2;
  border: none;
  border-radius: 14px 4px 14px 14px;
}
.chat-hora { font-size: 0.62rem; color: #95a0ab; margin: 2px 6px 0; font-style: normal; }
#chat-form { display: flex; gap: 0.4rem; padding: 0.55rem; border-top: 1px solid #efece9; background: #fff; }
#chat-form input {
  flex: 1;
  border: 1px solid #e8e5e1;
  border-radius: var(--raio-pilula, 10px);
  padding: 0.45rem 0.85rem;
  font: inherit;
  font-size: 0.88rem;
}
#chat-form .btn { border-radius: 50%; width: 38px; height: 38px; padding: 0; }
@media (max-width: 700px) {
  #chat-painel { height: min(420px, 62vh); }
}

/* --- Registos em direto --- */
#reg-direto { font-size: 0.72rem; color: #2e7d54; font-weight: 700; margin-left: 0.6rem; }
.reg-ponto {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2e7d54;
  animation: reg-pulsa 1.6s ease-in-out infinite;
  vertical-align: 1px;
}
@keyframes reg-pulsa { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
@keyframes reg-flash { from { background: rgba(158, 211, 180, 0.22); } to { background: transparent; } }

/* --- Chat: responder a uma mensagem (estilo WhatsApp) --- */
.chat-citacao {
  display: block;
  border-left: 3px solid #ccc;
  background: rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  padding: 0.2rem 0.5rem;
  margin-bottom: 0.28rem;
  font-size: 0.74rem;
  opacity: 0.92;
}
.chat-msg.minha .chat-citacao { background: rgba(255, 255, 255, 0.16); }
.chat-acoes { display: flex; gap: 0.5rem; align-items: center; margin: 2px 6px 0; }
.chat-btn-responder {
  border: none;
  background: none;
  color: #76889b;
  font-size: 0.64rem;
  cursor: pointer;
  padding: 0;
  opacity: 0;
  transition: opacity 0.15s;
}
.chat-msg:hover .chat-btn-responder, .chat-btn-responder:focus { opacity: 1; }
@media (pointer: coarse) { .chat-btn-responder { opacity: 1; } } /* no telemóvel fica sempre visível */
#chat-respondendo {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.7rem;
  background: #ecf2f8;
  border-top: 1px solid #efece9;
  font-size: 0.74rem;
}
#chat-respondendo[hidden] { display: none; }
#chat-resp-texto { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#chat-resp-cancelar { border: none; background: none; cursor: pointer; font-size: 1rem; color: #76889b; }

/* --- Abas (pré-reserva / marcação livre) e grelha anual --- */
.abas-titulo { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.aba-btn {
  border: 1px solid #e8e5e1;
  background: #f2f4ef;
  border-radius: 10px 10px 0 0;
  padding: 0.45rem 0.9rem;
  font: inherit;
  font-size: 0.92rem;
  cursor: pointer;
  color: #525e6c;
}
.aba-btn.ativo {
  background: var(--pinho, #1b3b5c);
  color: #fff;
  border-color: var(--pinho, #1b3b5c);
  font-weight: 700;
}
.ano-grelha {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 0.5rem;
}
.ano-mes {
  border: 1px solid #efece9;
  border-radius: 10px;
  padding: 0.5rem 0.6rem;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  background: #fff;
}
.ano-mes:hover { border-color: var(--pinho, #1b3b5c); }
.ano-mes.ativo { background: var(--pinho, #1b3b5c); color: #fff; border-color: var(--pinho, #1b3b5c); }
.ano-mes.ativo .sub, .ano-mes.ativo em { color: #dee7f1; }
.ano-mes span { font-size: 0.74rem; color: #677786; }
.ano-mes.ativo span { color: #cdddee; }
.ano-mes em { font-size: 0.74rem; font-style: normal; font-weight: 700; }

/* --- Circuito: vista diária (lotação 340px + gestão), empilha no telemóvel --- */
.circ-dia-grelha { grid-template-columns: 340px 1fr; align-items: start; }
@media (max-width: 700px) {
  .circ-dia-grelha { grid-template-columns: 1fr; }
}

/* --- Estabilidade de carregamento (CLS): a grelha dos serviços reserva o seu espaço
       antes de os cartões chegarem pela rede, para nada saltar abaixo dela. --- */
#lista-servicos { min-height: clamp(380px, 60vh, 560px); }
/* Os dois calendários (tratamentos e circuito) também reservam a sua altura típica. */
.cal-grelha { min-height: 300px; }
.flash-aviso { background: #f9f1e5; color: #7a5c14; }

/* --- Chat: mensagens privadas do gestor --- */
#chat-para {
  border: 1px solid #e8e5e1;
  border-radius: var(--raio-pilula, 10px);
  font: inherit;
  font-size: 0.72rem;
  padding: 0.3rem 0.4rem;
  max-width: 96px;
  background: #fff;
}
.chat-privada {
  display: block;
  font-size: 0.62rem;
  font-weight: 700;
  color: #886c47;
  margin-bottom: 2px;
}
.chat-msg.minha .chat-privada { color: #efd6b8; }
.chat-bolha-txt.e-privada { box-shadow: inset 0 0 0 1px rgba(177, 141, 93, 0.45); }

/* ================= Pacote visual (propostas 2·3·4·7·8) — só site do cliente ================= */

/* 2 (via B) · Playfair Display substitui a Abril em todo o lado; nos títulos
      pequenos usa o peso 600 para manter presença sem perder a elegância. */
body:not(.admin-corpo) h2,
body:not(.admin-corpo) h3,
body:not(.admin-corpo) .cartao-servico strong {
  font-weight: 600;
}

/* (o gradiente do hero foi retirado a pedido — a fotografia volta a falar por si) */
html { scroll-behavior: smooth; } /* mantém o deslize suave do botão móvel */
#app { scroll-margin-top: 12px; }

/* 4 · Cartões de serviço com vida: sombra suave, levantam ao passar, preço em destaque */
.cartao-servico {
  box-shadow: 0 2px 10px rgba(26, 42, 60, 0.07);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.cartao-servico:hover, .cartao-servico:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(26, 42, 60, 0.16);
}
.cartao-servico .meta { font-weight: 700; font-size: 0.95rem; }

/* 7 · Botão «Reservar agora» fixo no telemóvel (some quando o formulário já está à vista) */
.cta-movel { display: none; }
@media (max-width: 700px) {
  .cta-movel {
    display: block;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    z-index: 60;
    background: var(--pinho);
    color: #fff;
    font-weight: 700;
    padding: 0.75rem 2rem;
    border-radius: var(--raio-pilula, 10px);
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(7, 20, 34, 0.35);
    transition: transform 0.2s ease, opacity 0.2s ease;
  }
  .cta-movel.fora { opacity: 0; transform: translateX(-50%) translateY(70px); pointer-events: none; }
}

/* 8 · Micro-transições: o site inteiro responde ao toque */
body:not(.admin-corpo) .btn,
body:not(.admin-corpo) .opcao,
body:not(.admin-corpo) .mini-dia {
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}
body:not(.admin-corpo) .btn:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(26, 42, 60, 0.14); }
body:not(.admin-corpo) .mini-dia:not(.vazio):hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(26, 42, 60, 0.12); }

/* --- Estatísticas: navegação do mês e do ano, alinhada e sem ruído --- */
.mes-nav-titulo { display: inline-flex; align-items: center; gap: 0.55rem; }
.mes-nav-titulo .btn {
  text-decoration: none;
  line-height: 1;
  padding: 0.45rem 0.75rem;
  margin: 0; /* a regra genérica dos .btn traz margin-top e desalinhava as setas */
  display: inline-flex;
  align-items: center;
}
.mes-nav-titulo strong { min-width: 130px; text-align: center; font-size: 1.02rem; line-height: 1; margin: 0; }
.ano-nav { float: right; display: inline-flex; gap: 0.4rem; }
.ano-nav .btn { text-decoration: none; }
a.aba-btn { text-decoration: none; display: inline-block; }

/* --- Vouchers: caixa da data do usufruto (aparece só ao clicar) --- */
.caixa-data {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  background: #fff;
  border: 1px solid var(--pinho, #1b3b5c);
  border-radius: 10px;
  padding: 0.35rem 0.55rem;
  box-shadow: 0 6px 18px rgba(26, 42, 60, 0.16);
  animation: caixa-nasce 0.15s ease;
}
.caixa-data[hidden] { display: none; }
.caixa-data input[type="date"] { font-size: 0.8rem; padding: 0.25rem 0.35rem; border: 1px solid #e8e5e1; border-radius: 7px; }
.caixa-data label { white-space: nowrap; }
@keyframes caixa-nasce { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: none; } }
/* edição em linha da data (✎ → ✓ ×) */
.data-inline { border: none; background: transparent; font: inherit; font-size: 0.82rem; color: #525e6c; padding: 0; width: 118px; pointer-events: none; }
.data-inline.edicao { border: 1px solid var(--pinho, #1b3b5c); background: #fff; border-radius: 7px; padding: 0.22rem 0.3rem; pointer-events: auto; }
.mini-btn.ico { width: 30px; height: 28px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
/* Vouchers: as células com botões/formulários alinham ao centro como as restantes */
.tabela-vouchers td { vertical-align: middle; }
.tabela-vouchers td form { margin: 0; display: inline-flex; align-items: center; gap: 0.35rem; }
.tabela-vouchers td .btn { margin: 0; }
.tabela-vouchers td .caixa-data .btn { margin: 0; }
.tabela-vouchers td form, .tabela-vouchers td .btn, .tabela-vouchers td .etiqueta,
.tabela-vouchers td a, .tabela-vouchers td .data-inline, .tabela-vouchers td .sub { vertical-align: middle; }
table.agenda.tabela-vouchers tbody td { vertical-align: middle; }

/* ============================================================
   Fundo ambiente do site público — aguarela suave + ramo botânico
   (CSS puro + SVG embutido: zero pedidos, zero CLS)
   Personalização: ajustar as variáveis --fundo-* abaixo.
   ============================================================ */
body:not(.admin-corpo) {
  --fundo-base: #faf9f4;          /* creme de fundo */
  --fundo-verde: 182, 205, 184;   /* mancha verde-salva (RGB) */
  --fundo-quente: 240, 232, 214;  /* mancha creme-quente (RGB) */
  background: var(--fundo-base);
}
body:not(.admin-corpo)::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(42rem 34rem at 108% 78%, rgba(var(--fundo-verde), 0.55), transparent 62%),
    radial-gradient(36rem 26rem at -6% 12%, rgba(var(--fundo-quente), 0.7), transparent 60%),
    linear-gradient(160deg, #fbfaf6 0%, var(--fundo-base) 45%, #f8f6f2 100%);
}

/* ============================================================
   DESIGN 2026 · «Boutique sobre aguarela»
   Camada de design do site público — aditiva e reversível
   (apagar esta secção repõe o aspeto anterior por inteiro)
   ============================================================ */
body:not(.admin-corpo) {
  --sombra-flutuar: 0 1px 2px rgba(26, 42, 60, 0.05), 0 12px 32px rgba(26, 42, 60, 0.08);
  --sombra-elevada: 0 2px 6px rgba(26, 42, 60, 0.07), 0 18px 44px rgba(26, 42, 60, 0.13);
}

/* 1 · Cada passo é um cartão branco a flutuar sobre a aguarela */
body:not(.admin-corpo) .passo {
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(27, 59, 92, 0.07);
  border-radius: 22px;
  padding: 1.5rem 1.7rem 1.7rem;
  box-shadow: var(--sombra-flutuar);
}
@media (max-width: 700px) {
  body:not(.admin-corpo) .passo { padding: 1.1rem 1rem 1.25rem; border-radius: 18px; }
}

/* 2 · Número do passo: badge circular verde-pinho (como no estudo) */
body:not(.admin-corpo) .passo h2 .num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 50%;
  background: var(--salva-clara);
  color: var(--pinho);
  font-family: var(--sans);
  font-size: 0.95rem;
  font-weight: 700;
  margin-right: 0.35rem;
  vertical-align: -0.35rem;
  box-shadow: inset 0 0 0 1px rgba(27, 59, 92, 0.12);
}

/* 3 · Navegação do mês: título Playfair ao centro, setas circulares */
body:not(.admin-corpo) .cal-nav { align-items: center; }
body:not(.admin-corpo) .cal-titulo { font-size: 1.35rem; }
body:not(.admin-corpo) .cal-nav .btn {
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  box-shadow: 0 1px 3px rgba(26, 42, 60, 0.08);
}
body:not(.admin-corpo) .cal-nav .btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(26, 42, 60, 0.14);
}

/* 4 · Hierarquia do calendário: só os dias com vida têm cartão */
body:not(.admin-corpo) .cal-dia:not(.livre):not(.selecionado):not(.cheio) {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
body:not(.admin-corpo) .cal-dia:not(.livre):not(.selecionado):not(.cheio) .cal-numero {
  color: #b5bfc9;
  font-size: 1.02rem;
}
body:not(.admin-corpo) .cal-dia.cheio {
  background: #fcf8f2;
  border-color: #f5ebdd;
}
body:not(.admin-corpo) .cal-dia.livre { box-shadow: 0 1px 3px rgba(27, 59, 92, 0.06), 0 4px 10px rgba(27, 59, 92, 0.05); }
body:not(.admin-corpo) .cal-dia.selecionado { box-shadow: var(--sombra-elevada); }

/* 5 · Campos e botões no mesmo vocabulário (cantos, foco, profundidade) */
body:not(.admin-corpo) input:not([type="radio"]):not([type="checkbox"]),
body:not(.admin-corpo) select,
body:not(.admin-corpo) textarea {
  border-radius: 12px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
body:not(.admin-corpo) input:focus-visible,
body:not(.admin-corpo) select:focus-visible,
body:not(.admin-corpo) textarea:focus-visible {
  outline: none;
  border-color: var(--salva);
  box-shadow: 0 0 0 4px rgba(124, 158, 190, 0.22);
}
body:not(.admin-corpo) .btn {
  border-radius: var(--raio-pilula, 10px);
  box-shadow: 0 1px 2px rgba(26, 42, 60, 0.1);
}
body:not(.admin-corpo) .btn:not(.secundario):not(:disabled):hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(27, 59, 92, 0.22);
}

/* 6 · Legenda alinhada com pontos maiores */
body:not(.admin-corpo) .legenda { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.9rem; }
body:not(.admin-corpo) .legenda .ponto { width: 11px; height: 11px; border-radius: 4px; }

/* Aviso do gestor a todo o painel — bem visível, sem gritar */
.aviso-gestor {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  margin: 0 0 1rem;
  padding: 0.8rem 1rem;
  background: #fef6eb;
  border: 1px solid #ecd9a8;
  border-left: 5px solid #d9a83c;
  border-radius: 10px;
  font-size: 0.98rem;
  font-weight: 600;
  color: #5d4a1a;
  box-shadow: 0 2px 8px rgba(120, 90, 20, 0.08);
}
.aviso-gestor-icone { font-size: 1.15rem; line-height: 1.4; }
.aviso-gestor-texto { flex: 1; }
.aviso-gestor a { color: #8a6d2a; }

/* Abas-pílula do grupo Administração (gestor) */
.abas-admin {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: -0.2rem 0 1.1rem;
}
.abas-admin a {
  padding: 0.42rem 1rem;
  border-radius: var(--raio-pilula, 10px);
  border: 1px solid #e8e5e1;
  background: #fff;
  color: var(--tinta);
  font-size: 0.86rem;
  font-weight: 600;
  text-decoration: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.abas-admin a:hover { border-color: var(--salva); box-shadow: 0 1px 4px rgba(27, 59, 92, 0.12); }
.abas-admin a.ativa {
  background: var(--pinho);
  border-color: var(--pinho);
  color: #fff;
}

/* ============================================================
   MODO NOTURNO do painel — paleta «Agenda de Direção»
   (cores extraídas da referência; contrastes WCAG validados)
   fundo #0e1f1d · cartões #16302e · lateral #0a1817
   texto #f2efe6 (12.2:1) · secundário #8fa5bf (5.6:1) · dourado #d4af80 (6.4:1)
   Automático das 21h às 7h; botão 🌙 permite escolher.
   ============================================================ */
.tema-noturno .admin-corpo,
.tema-noturno body.admin-corpo { background: #101c2d; color: #f6f3ef; }

/* Lateral */
.tema-noturno .admin-lateral { background: #0c1523; border-right: 1px solid #293f5d; }
.tema-noturno .admin-marca { color: #f6f3ef; }
.tema-noturno .admin-marca span { color: #8fa5bf; }
.tema-noturno .admin-nav a { color: #c8d4e1; }
.tema-noturno .admin-nav a:hover { background: #192b44; color: #f6f3ef; }
.tema-noturno .admin-nav a.ativo { background: #1d304a; color: #d4af80; box-shadow: inset 3px 0 0 #d4af80; }

/* Títulos e superfícies */
.tema-noturno .admin-cabecalho h1,
.tema-noturno .admin-conteudo h2,
.tema-noturno .admin-conteudo h3 { color: #f6f3ef; }
.tema-noturno .painel-cartao,
.tema-noturno .admin-conteudo section {
  background: #192b44;
  border-color: #335075;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
}
.tema-noturno .sub { color: #8fa5bf; }
.tema-noturno a { color: #d4af80; }
.tema-noturno hr { border-color: #293f5d; }

/* Tabelas */
.tema-noturno table.agenda th { background: #1d304a; color: #b6c8dd; }
.tema-noturno table.agenda td { border-color: #293f5d; }
.tema-noturno table.agenda tbody tr:nth-child(even) { background: #13292700; }
.tema-noturno table.agenda tbody tr:hover { background: #1d304a; }

/* Formulários */
.tema-noturno .campo input,
.tema-noturno .campo select,
.tema-noturno .campo textarea,
.tema-noturno .filtros .campo input,
.tema-noturno .filtros .campo select {
  background: #1d304a;
  border-color: #335075;
  color: #f6f3ef;
}
.tema-noturno .campo input::placeholder,
.tema-noturno .campo textarea::placeholder { color: #798da6; }
.tema-noturno .campo input:focus-visible,
.tema-noturno .campo select:focus-visible,
.tema-noturno .campo textarea:focus-visible { outline-color: #d4af80; }

/* Botões: o principal em dourado, como na referência */
.tema-noturno .btn { background: #d4af80; border-color: #d4af80; color: #0c1523; }
.tema-noturno .btn:hover:not(:disabled) { background: #ddb98b; border-color: #ddb98b; }
.tema-noturno .btn.secundario { background: #1d304a; border-color: #335075; color: #f6f3ef; }
.tema-noturno .btn.secundario:hover:not(:disabled) { background: #233b58; }
.tema-noturno .btn.perigo { background: #7d3a32; border-color: #8c453c; color: #f7e2de; }

/* Abas do grupo Administração */
.tema-noturno .abas-admin a { background: #192b44; border-color: #335075; color: #d4dee9; }
.tema-noturno .abas-admin a:hover { border-color: #d4af80; }
.tema-noturno .abas-admin a.ativa { background: #d4af80; border-color: #d4af80; color: #0c1523; }

/* Mensagens e etiquetas */
.tema-noturno .flash { border-color: #335075; }
.tema-noturno .flash-ok { background: #16302e; color: #a9dcbb; border-left: 4px solid #4c9a6a; }
.tema-noturno .flash-erro { background: #2c1c1a; color: #f0b3aa; border-left: 4px solid #8c453c; }
.tema-noturno .flash-aviso { background: #1a2734; color: #ecd9a8; border-left: 4px solid #d4af80; }
.tema-noturno .etiqueta { background: #1d304a; color: #b6c8dd; }
.tema-noturno .aviso-gestor {
  background: #1a2734; border-color: #57491f; border-left-color: #d4af80;
  color: #f5eada; box-shadow: none;
}
.tema-noturno .aviso-gestor a { color: #d4af80; }

/* Chat */
.tema-noturno #chat-janela { background: #192b44; border-color: #335075; color: #f6f3ef; }
.tema-noturno #chat-mensagens { background: #101c2d; }
.tema-noturno .chat-msg { background: #1d304a; color: #f6f3ef; }
.tema-noturno .chat-msg.minha { background: #293f5d; }

/* Diversos */
.tema-noturno .mes-nav-titulo,
.tema-noturno .cabecalho-acoes { color: #f6f3ef; }
.tema-noturno #botao-tema { color: #d4af80; }

/* ---- Modo noturno · componentes específicos de cada página ----
   (grelhas mensais, agenda do dia, KPIs, mini-agenda, circuito,
   estatísticas, modais e chips: nada fica branco) */

/* KPIs (Painel e Estatísticas) */
.tema-noturno .kpi { background: #192b44; border-color: #335075; }
.tema-noturno .kpi-valor { color: #f6f3ef; }
.tema-noturno .kpi-rotulo { color: #8fa5bf; }
.tema-noturno .kpi-verde { border-top-color: #4c9a6a; }
.tema-noturno .kpi-azul { border-top-color: #5d90b8; }
.tema-noturno .kpi-ambar,
.tema-noturno .kpi-pinho { border-top-color: #d4af80; }
.tema-noturno .kpi-atencao { background: #1a2734; border-color: #584732; }

/* Vista mensal */
.tema-noturno .mes-cabecalho { background: #1d304a; color: #b6c8dd; border-color: #335075; }
.tema-noturno .mes-grelha { border-color: #335075; }
.tema-noturno .mes-dia { background: #192b44; border-color: #335075; color: #f6f3ef; }
.tema-noturno .mes-dia:hover,
.tema-noturno .mes-dia.livre:hover { background: #213855; }
.tema-noturno .mes-dia.vazio { background: #132338; }
.tema-noturno .mes-dia.hoje { box-shadow: inset 0 0 0 2px #d4af80; }
.tema-noturno .mes-numero { color: #d4af80; }
.tema-noturno .mes-reserva { background: #233b58; color: #dee7f0; border-color: #335075; }
.tema-noturno .mes-reserva.pendente { background: #1a2734; color: #ecd9a8; }
.tema-noturno .mes-mais { color: #8fa5bf; }
.tema-noturno .mes-nav-titulo { color: #f6f3ef; }

/* Agenda do dia (linha do tempo) */
.tema-noturno .timeline { background: #192b44; border-color: #335075; }
.tema-noturno .timeline-coluna { border-color: #335075; }
.tema-noturno .timeline-pista { background: #15273e; }
.tema-noturno .timeline-pista.ausente { background: #111c2b; }
.tema-noturno .timeline-linha { border-color: #253c58; }
.tema-noturno .turno { background: #192b44; border-color: #335075; }
.tema-noturno .timeline-horas span,
.tema-noturno .timeline-cabecalho { color: #b6c8dd; }
.tema-noturno .bloco { background: #233b58; border-color: #3c5c83; color: #eef3ef; }
.tema-noturno .bloco.confirmada { background: #234039; border-color: #4c9a6a; }
.tema-noturno .bloco.pendente { background: #1a2734; border-color: #d4af80; color: #f5eada; }
.tema-noturno .bloco.flutuante { background: #2a2340; border-color: #6a5a95; color: #ded6f0; }
.tema-noturno .bloco-hora { color: #d4af80; }
.tema-noturno .bloco-servico { color: #b6c8dd; }
.tema-noturno .dia-nav-salto input { background: #1d304a; border-color: #335075; color: #f6f3ef; }

/* Mini-agenda dos horários */
.tema-noturno .mini-dia { background: #192b44; border-color: #335075; color: #f6f3ef; }
.tema-noturno .mini-dia:hover { background: #213855; }
.tema-noturno .mini-dia.vazio { background: #132338; }
.tema-noturno .mini-num { color: #d4af80; }
.tema-noturno .mini-letra { color: #f6f3ef; }
.tema-noturno .cod-A { background: #233b58; color: #cce0f4; }
.tema-noturno .cod-B { background: #23364a; color: #cfe0f0; }
.tema-noturno .cod-C { background: #213245; color: #e7d2b8; }
.tema-noturno .cod-F { background: #242c35; color: #b2c0ce; }
.tema-noturno .cod-FE { background: #3a2320; color: #f0b3aa; }
.tema-noturno .cod-P { background: #2a2340; color: #d5c8ee; }
.tema-noturno .cod-X { background: #192b44; color: #778da2; border-color: #335075; }
.tema-noturno .chip-radio { background: #1d304a; border-color: #335075; color: #e5ebf1; }
.tema-noturno .chip-radio input:checked + span,
.tema-noturno .chip-radio.ativo { background: #d4af80; color: #0c1523; }

/* Circuito húmido */
.tema-noturno .circ-dia { background: #192b44; border-color: #335075; color: #f6f3ef; }
.tema-noturno .circ-dia.com-agenda { background: #1c3a44; border-color: #3d6b7d; }
.tema-noturno .circ-dia.com-agenda .mini-letra { color: #9fd0e8; }
.tema-noturno .circ-linha { border-color: #335075; }
.tema-noturno .circ-barra { background: #253c58; }
.tema-noturno .circ-tag-h { background: #233b58; color: #a9dcbb; }
.tema-noturno .circ-tag-e { background: #23364a; color: #a8c8ea; }
.tema-noturno .circ-hora,
.tema-noturno .circ-lotacao { color: #d4dee9; }

/* Estatísticas */
.tema-noturno .ano-mes { background: #192b44; border-color: #335075; color: #f6f3ef; }
.tema-noturno .ano-mes:hover { background: #213855; border-color: #d4af80; }
.tema-noturno .ano-mes.ativo { background: #233b58; border-color: #d4af80; }
.tema-noturno .mini-barra { background: #253c58; }
.tema-noturno .mini-barra i { background: #4c9a6a; }

/* Painel — próximas marcações */
.tema-noturno .lista-proximas li { border-bottom-color: #253c58; border-left-color: #335075; }
.tema-noturno .lista-proximas a:hover { background: #1d304a; }
.tema-noturno .lista-proximas .quando { color: #8fa5bf; }
.tema-noturno .lista-proximas .quem { color: #d4af80; }
.tema-noturno .lista-proximas .com { color: #8fa5bf; }

/* Modais e diversos */
.tema-noturno .modal { background: #192b44; color: #f6f3ef; border: 1px solid #335075; }
.tema-noturno .modal-fechar { color: #b6c8dd; }
.tema-noturno .modal-fechar:hover { background: #1d304a; }
.tema-noturno .pessoa-chip { background: #1d304a; border-color: #335075; color: #f6f3ef; }
.tema-noturno .pessoa-chip.ativo { background: #d4af80; color: #0c1523; border-color: #d4af80; }
.tema-noturno .escolha-cartoes { background: transparent; }
.tema-noturno .graf-mes { fill: #4c9a6a; }
.tema-noturno .graf-chip { background: #1d304a; color: #d4dee9; }

/* ---- Modo noturno · últimos resquícios claros ---- */
.tema-noturno .admin-corpo input,
.tema-noturno .admin-corpo select,
.tema-noturno .admin-corpo textarea {
  background: #1d304a;
  border-color: #335075;
  color: #f6f3ef;
  color-scheme: dark;                 /* calendários/relógios nativos em escuro */
}
.tema-noturno .admin-corpo input[type="checkbox"],
.tema-noturno .admin-corpo input[type="radio"] { accent-color: #d4af80; }
.tema-noturno table.agenda td,
.tema-noturno table.agenda tbody td { background: transparent; color: #e5ebf1; }
.tema-noturno .acoes-linha { background: #1d304a; border-color: #335075; }
.tema-noturno .aba-btn { background: #1d304a; border-color: #335075; color: #d4dee9; }
.tema-noturno .aba-btn.ativa { background: #d4af80; border-color: #d4af80; color: #0c1523; }
.tema-noturno .mini-linha.alvo { background: #233b58; }
.tema-noturno .almoco-lateral { background: #1a2734; border-color: #584732; color: #f5eada; }
.tema-noturno .almoco-lateral h3 { color: #f5eada; }

/* Cabeçalhos ordenáveis (tabela de vouchers) */
th.th-ord { padding: 0; }
th.th-ord a {
  display: block;
  padding: 0.55rem 0.7rem;
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
th.th-ord a:hover { background: rgba(27, 59, 92, 0.08); }
th.th-ord.ativa a { color: var(--pinho); font-weight: 700; }
th.th-ord .th-seta { font-size: 0.72em; opacity: 0.75; }
.tema-noturno th.th-ord a { color: #b6c8dd; }
.tema-noturno th.th-ord a:hover { background: rgba(212, 175, 128, 0.12); }
.tema-noturno th.th-ord.ativa a { color: #d4af80; }

/* Lista de espera — entrada já contactada (bem visível) */
.linha-contactado > td { background: #fef6eb; }
.linha-contactado:hover > td { background: #fcf0df; }
.linha-contactado > td:first-child { box-shadow: inset 4px 0 0 #d1a874; }
.etiqueta.etq-contactado {
  background: #d1a874;
  color: #3c2f1e;
  font-weight: 700;
}
.tema-noturno .linha-contactado > td { background: #1a2734; }
.tema-noturno .linha-contactado:hover > td { background: #202f3f; }
.tema-noturno .linha-contactado > td:first-child { box-shadow: inset 4px 0 0 #d4af80; }
.tema-noturno .etiqueta.etq-contactado { background: #d4af80; color: #122130; }

/* ============================================================
   SISTEMA DE DESIGN 2026 · ronda A
   Painel «centro de comando» + pesquisa global + refinamentos
   ============================================================ */

/* ---- Tokens partilhados (claro) ---- */
.admin-corpo {
  --sd-superficie: #ffffff;
  --sd-superficie-2: #f4f6f2;
  --sd-borda: #eeebe7;
  --sd-texto: #1c2937;
  --sd-sub: #627283;
  --sd-realce: #1b3b5c;
  --sd-dourado: #bd996b;
  --sd-sombra: 0 1px 2px rgba(26, 42, 60, 0.05), 0 8px 24px rgba(26, 42, 60, 0.06);
  --sd-raio: 14px;
}
.tema-noturno .admin-corpo {
  --sd-superficie: #192b44;
  --sd-superficie-2: #1d304a;
  --sd-borda: #335075;
  --sd-texto: #f6f3ef;
  --sd-sub: #8fa5bf;
  --sd-realce: #d4af80;
  --sd-dourado: #d4af80;
  --sd-sombra: 0 2px 12px rgba(0, 0, 0, 0.35);
}

/* ---- Topo do painel ---- */
.cc-topo { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin: -0.2rem 0 1rem; flex-wrap: wrap; }
.cc-data { font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sd-sub); }
.cc-saudacao { font-family: var(--serif); font-size: 1.6rem; color: var(--sd-texto); margin-top: 0.1rem; }
.cc-acoes { display: flex; gap: 0.5rem; align-items: center; }
.cc-pesquisa, .pesquisa-lateral {
  display: inline-flex; align-items: center; gap: 0.5rem;
  border: 1px solid var(--sd-borda); background: var(--sd-superficie); color: var(--sd-sub);
  border-radius: var(--raio-pilula, 10px); padding: 0.5rem 0.9rem; font: inherit; font-size: 0.86rem; cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.cc-pesquisa:hover, .pesquisa-lateral:hover { border-color: var(--sd-realce); box-shadow: var(--sd-sombra); }
.cc-pesquisa kbd, .pesquisa-lateral kbd, .pg-dica kbd {
  font: 600 0.68rem/1 var(--sans); padding: 0.15rem 0.4rem; border-radius: 5px;
  border: 1px solid var(--sd-borda); background: var(--sd-superficie-2); color: var(--sd-sub);
}
.pesquisa-lateral { width: 100%; justify-content: space-between; margin: 0 0 0.9rem; font-size: 0.82rem; }

/* ---- KPIs com contexto ---- */
.cc-kpis { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.cc-kpis .kpi { display: flex; flex-direction: column; gap: 0.15rem; min-height: 96px; border-radius: var(--sd-raio); box-shadow: var(--sd-sombra); transition: transform 0.15s ease, box-shadow 0.15s ease; }
a.kpi:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(26, 42, 60, 0.06), 0 14px 32px rgba(26, 42, 60, 0.12); }
.cc-kpis .kpi-rotulo { order: 0; font-size: 0.74rem; letter-spacing: 0.06em; }
.cc-kpis .kpi-valor { order: 1; font-size: 1.9rem; line-height: 1.1; }
.cc-kpis .kpi-valor.atencao { color: #9f7b4d; }
.kpi-tendencia { order: 2; font-size: 0.78rem; color: var(--sd-sub); margin-top: 0.2rem; }
.kpi-tendencia.sobe { color: #256b43; }
.kpi-tendencia.desce { color: #8c3b31; }
.kpi-barra { order: 2; display: block; height: 5px; background: var(--sd-borda); border-radius: 3px; margin-top: 0.55rem; overflow: hidden; }
.kpi-barra i { display: block; height: 100%; background: linear-gradient(90deg, #1b3b5c, #7c9ebe); border-radius: 3px; }
.tema-noturno .kpi-barra i { background: linear-gradient(90deg, #d4af80, #ddb98b); }
.tema-noturno .kpi-tendencia.sobe { color: #a9dcbb; }
.tema-noturno .kpi-tendencia.desce { color: #f0b3aa; }
.tema-noturno .cc-kpis .kpi-valor.atencao { color: #ddb98b; }

/* ---- Grelha do painel ---- */
.cc-grelha { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); align-items: start; }
@media (max-width: 900px) { .cc-grelha { grid-template-columns: 1fr; } }
.cc-chips { float: right; display: inline-flex; gap: 0.3rem; }
.cc-chips .etiqueta { font-size: 0.72rem; }

/* ---- Agenda de hoje (compacta) ---- */
.cc-agenda { display: grid; gap: 0.4rem; }
.cc-bloco {
  display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 0.6rem; align-items: center;
  padding: 0.55rem 0.8rem; border-radius: 10px; text-decoration: none; color: inherit;
  background: #e4ebf2; border: 1px solid #cedcec; transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.cc-bloco:hover { transform: translateX(2px); box-shadow: var(--sd-sombra); }
.cc-bloco.pendente { background: #fef6eb; border-color: #ecd9a8; }
.cc-bloco.sem-terapeuta { background: #fef6eb; border-color: #ecd7bc; }
.cc-bloco.realizada { opacity: 0.6; }
.cc-hora { font-weight: 700; font-size: 0.86rem; color: var(--sd-realce); }
.cc-quem { font-size: 0.88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cc-tag { font-size: 0.72rem; padding: 0.2rem 0.55rem; border-radius: var(--raio-pilula, 10px); background: rgba(255, 255, 255, 0.75); color: var(--sd-realce); font-weight: 700; }
.tema-noturno .cc-bloco { background: #233b58; border-color: #3c5c83; }
.tema-noturno .cc-bloco.pendente, .tema-noturno .cc-bloco.sem-terapeuta { background: #1a2734; border-color: #57491f; }
.tema-noturno .cc-tag { background: rgba(0, 0, 0, 0.25); color: #d4af80; }

/* ---- A tratar ---- */
.etiqueta.etq-atencao { background: #d1a874; color: #3c2f1e; font-weight: 700; margin-left: 0.35rem; }
.cc-pend { display: flex; gap: 0.75rem; align-items: flex-start; padding: 0.7rem 0; border-top: 1px solid var(--sd-borda); font-size: 0.9rem; }
.cc-pend:first-of-type { border-top: 0; padding-top: 0.2rem; }
.cc-av { flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.8rem; background: #e3eef7; color: #274d80; }
.cc-av.ambar { background: #fef6eb; color: #8a5a12; }
.cc-av.verde { background: #e4ebf2; color: #256b43; }
.cc-pend-acoes { margin-top: 0.4rem; display: flex; gap: 0.4rem; flex-wrap: wrap; }
.tema-noturno .cc-av { background: #23364a; color: #a8c8ea; }
.tema-noturno .cc-av.ambar { background: #243547; color: #ecd9a8; }
.tema-noturno .cc-av.verde { background: #233b58; color: #a9dcbb; }

/* ---- Pesquisa global (Ctrl+K) ---- */
.pg-fundo { position: fixed; inset: 0; background: rgba(12, 23, 35, 0.45); backdrop-filter: blur(3px); z-index: 90; display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; }
.pg-fundo.oculto { display: none; }
.pg-caixa { width: min(640px, 92vw); background: var(--sd-superficie); border-radius: 16px; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3); overflow: hidden; border: 1px solid var(--sd-borda); }
#pg-input { width: 100%; box-sizing: border-box; border: 0; border-bottom: 1px solid var(--sd-borda); padding: 1rem 1.2rem; font: inherit; font-size: 1.05rem; background: transparent; color: var(--sd-texto); outline: none; }
.pg-lista { max-height: 50vh; overflow: auto; }
.pg-item { display: flex; gap: 0.8rem; align-items: center; padding: 0.7rem 1.2rem; text-decoration: none; color: var(--sd-texto); border-bottom: 1px solid var(--sd-borda); }
.pg-item:hover, .pg-item.ativo { background: var(--sd-superficie-2); }
.pg-tipo { flex-shrink: 0; font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.2rem 0.5rem; border-radius: 5px; background: #e4ebf2; color: #256b43; min-width: 56px; text-align: center; }
.pg-tipo.voucher { background: #fef6eb; color: #7c603b; }
.pg-tipo.espera { background: #e7ddf2; color: #5b3f86; }
.pg-tipo.pagina { background: var(--sd-superficie-2); color: var(--sd-sub); }
.pg-txt { display: flex; flex-direction: column; min-width: 0; }
.pg-txt strong { font-weight: 600; font-size: 0.94rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pg-txt small { color: var(--sd-sub); font-size: 0.8rem; }
.pg-vazio, .pg-dica { padding: 0.7rem 1.2rem; font-size: 0.8rem; color: var(--sd-sub); }
.pg-dica { border-top: 1px solid var(--sd-borda); display: flex; gap: 0.6rem; }
.tema-noturno .pg-tipo { background: #233b58; color: #a9dcbb; }
.tema-noturno .pg-tipo.voucher { background: #243547; color: #ecd7bc; }
.tema-noturno .pg-tipo.espera { background: #2a2340; color: #d5c8ee; }

/* ---- Cartões e tabelas: coerência geral ---- */
.admin-corpo .painel-cartao { border-radius: var(--sd-raio); box-shadow: var(--sd-sombra); border: 1px solid var(--sd-borda); }
.admin-corpo .painel-cartao h3 { font-family: var(--serif); font-weight: 600; }
.admin-corpo table.agenda tbody tr { transition: background 0.12s ease; }
.admin-corpo .btn { border-radius: var(--raio-pilula, 10px); }
.admin-corpo .btn:not(.secundario):not(.perigo) { box-shadow: 0 1px 2px rgba(26, 42, 60, 0.15); }

/* ---- Horários: só apresentação (o funcionamento fica igual) ---- */
.admin-corpo .mini-dia { border-radius: 12px; box-shadow: 0 1px 2px rgba(26, 42, 60, 0.06); transition: transform 0.12s ease, box-shadow 0.12s ease; }
.admin-corpo .mini-dia:hover { transform: translateY(-2px); box-shadow: var(--sd-sombra); }
.admin-corpo .mini-num { font-family: var(--serif); font-size: 1.05rem; }
.admin-corpo .chip-radio { border-radius: var(--raio-pilula, 10px); transition: box-shadow 0.12s ease, transform 0.12s ease; }
.admin-corpo .chip-radio:hover { transform: translateY(-1px); box-shadow: var(--sd-sombra); }
.admin-corpo .almoco-lateral { border-radius: var(--sd-raio); box-shadow: var(--sd-sombra); }

/* ============================================================
   RONDA B · Painel lateral da ficha + toasts
   ============================================================ */

/* ---- Painel lateral ---- */
.fp-fundo { position: fixed; inset: 0; z-index: 80; background: rgba(12, 23, 35, 0.35); backdrop-filter: blur(2px); transition: opacity 0.2s ease; }
.fp-fundo.oculto { display: none; }
.fp-painel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(560px, 94vw);
  background: var(--sd-superficie); border-left: 1px solid var(--sd-borda);
  box-shadow: -18px 0 48px rgba(0, 0, 0, 0.22); overflow-y: auto;
  animation: fp-desliza 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);
  padding: 0 1.2rem 1.4rem;
}
@keyframes fp-desliza { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .fp-painel { animation: none; } }
.ficha-painel-cab {
  position: sticky; top: 0; z-index: 2; pointer-events: none; display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem;
  background: var(--sd-superficie); padding: 1.1rem 0 0.8rem; margin-bottom: 0.4rem; border-bottom: 1px solid var(--sd-borda);
}
.fp-titulo { font-family: var(--serif); font-size: 1.25rem; color: var(--sd-texto); line-height: 1.25; }
.ficha-painel-cab a, .ficha-painel-cab button { pointer-events: auto; }
.fp-fechar { flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--sd-borda); background: var(--sd-superficie-2); color: var(--sd-sub); font-size: 1.3rem; line-height: 1; cursor: pointer; }
.fp-fechar:hover { color: var(--sd-texto); border-color: var(--sd-realce); }
/* dentro do painel a ficha empilha numa só coluna */
.fp-painel .ficha-grelha { grid-template-columns: 1fr !important; gap: 0.8rem; }
.fp-painel .painel-cartao { box-shadow: none; }
.fp-painel h3 { font-size: 1.02rem; }
body.fp-aberto { overflow: hidden; }

/* ---- Toasts ---- */
.flash-escondido { position: absolute; left: -9999px; }
.toasts { position: fixed; right: 1.1rem; bottom: 1.1rem; z-index: 95; display: flex; flex-direction: column; gap: 0.5rem; max-width: min(420px, 92vw); pointer-events: none; }
.toast {
  pointer-events: auto; cursor: pointer;
  padding: 0.75rem 1rem 0.75rem 0.9rem; border-radius: 12px; font-size: 0.9rem; font-weight: 600; line-height: 1.4;
  background: var(--sd-superficie); color: var(--sd-texto); border: 1px solid var(--sd-borda); border-left-width: 5px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
  transform: translateY(12px); opacity: 0; transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.28s ease;
}
.toast.visivel { transform: none; opacity: 1; }
.toast.ok { border-left-color: #2e8b57; }
.toast.aviso { border-left-color: #d9a83c; }
.toast.erro { border-left-color: #b8483c; }
@media (max-width: 700px) { .toasts { right: 0.6rem; left: 0.6rem; bottom: 0.6rem; max-width: none; } }

/* ============================================================
   RONDA C · arrastar para remarcar · peeks · densidade
   ============================================================ */

/* ---- Arrastar na agenda do dia ---- */
.timeline .bloco[draggable="true"] { cursor: grab; }
.timeline .bloco[draggable="true"]:active { cursor: grabbing; }
.timeline .bloco.a-arrastar { opacity: 0.45; }
.timeline .bloco.a-gravar { opacity: 0.6; pointer-events: none; }
.bloco-fantasma {
  position: absolute; left: 4px; right: 4px; z-index: 5; pointer-events: none;
  border: 2px dashed #1b3b5c; border-radius: 8px; background: rgba(27, 59, 92, 0.12);
  display: flex; align-items: flex-start; padding: 4px 8px;
}
.bloco-fantasma .bf-hora { font-size: 0.78rem; font-weight: 700; color: #1b3b5c; background: #fff; padding: 1px 6px; border-radius: 5px; }
.bloco-fantasma.invalido { border-color: #b8483c; background: rgba(184, 72, 60, 0.14); }
.bloco-fantasma.invalido .bf-hora { color: #8c3b31; }
.tema-noturno .bloco-fantasma { border-color: #d4af80; background: rgba(212, 175, 128, 0.16); }
.tema-noturno .bloco-fantasma .bf-hora { color: #0c1523; background: #d4af80; }

/* ---- Peek (vista mensal e circuito) ---- */
.mes-dia, .circ-dia { position: relative; }
.peek {
  position: absolute; left: 50%; top: 100%; transform: translate(-50%, 6px) scale(0.98); z-index: 40;
  min-width: 240px; max-width: 320px; padding: 0.55rem 0.7rem; border-radius: 12px; text-align: left;
  background: var(--sd-superficie, #fff); border: 1px solid var(--sd-borda, #eeebe7); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.18);
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.14s ease, transform 0.14s ease, visibility 0s linear 0.14s;
}
.mes-dia:hover .peek, .circ-dia:hover .peek, .mes-dia:focus-visible .peek, .circ-dia:focus-visible .peek {
  opacity: 1; visibility: visible; transform: translate(-50%, 6px) scale(1); transition-delay: 0.25s, 0.25s, 0.25s;
}
.mes-grelha > :nth-child(7n) .peek, .mini-grelha > :nth-child(7n) .peek { left: auto; right: 0; transform: translate(0, 6px) scale(0.98); }
.mes-grelha > :nth-child(7n):hover .peek, .mini-grelha > :nth-child(7n):hover .peek { transform: translate(0, 6px) scale(1); }
.mes-grelha > :nth-child(7n+1) .peek, .mini-grelha > :nth-child(7n+1) .peek { left: 0; transform: translate(0, 6px) scale(0.98); }
.mes-grelha > :nth-child(7n+1):hover .peek, .mini-grelha > :nth-child(7n+1):hover .peek { transform: translate(0, 6px) scale(1); }
.peek-cab { font-size: 0.74rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--sd-sub, #627283); margin-bottom: 0.35rem; }
.peek-linha { display: grid; grid-template-columns: auto 1fr auto; gap: 0.5rem; font-size: 0.82rem; padding: 0.2rem 0; border-top: 1px solid var(--sd-borda, #eeebe7); color: var(--sd-texto, #1c2937); }
.peek-linha:first-of-type { border-top: 0; }
.peek-hora { font-weight: 700; color: var(--sd-realce, #1b3b5c); white-space: nowrap; }
.peek-quem { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.peek-linha.pendente .peek-hora { color: #b0741c; }
.peek-linha.cancelada { opacity: 0.5; text-decoration: line-through; }
@media (hover: none) { .peek { display: none; } }

/* ---- Densidade compacta ---- */
.compacto .admin-corpo { font-size: 14px; }
.compacto .admin-corpo .painel-cartao { padding: 0.75rem 0.9rem; }
.compacto .admin-corpo table.agenda th, .compacto .admin-corpo table.agenda td { padding: 0.35rem 0.5rem; }
.compacto .admin-corpo .kpis .kpi { min-height: 76px; padding: 0.6rem 0.8rem; }
.compacto .admin-corpo .kpis .kpi-valor { font-size: 1.5rem; }
.compacto .admin-corpo .campo input, .compacto .admin-corpo .campo select, .compacto .admin-corpo .campo textarea { padding: 0.4rem 0.6rem; }
.compacto .admin-corpo .btn { padding: 0.4rem 0.8rem; }
.compacto .admin-corpo .admin-nav a { padding: 0.45rem 0.8rem; }
.compacto .admin-corpo .cc-bloco { padding: 0.35rem 0.6rem; }
.compacto .admin-corpo .mes-dia { min-height: 76px; }
.compacto .admin-corpo .mini-dia { min-height: 58px; }
.compacto .admin-corpo h1 { font-size: 1.5rem; }

/* ============================================================
   TIPOGRAFIA DO PAINEL · uma só voz
   Lato para tudo o que é interface; Playfair apenas no título da página
   e na saudação. Escala fixa, dois pesos (400/700), sem versaletes.
   ============================================================ */
.admin-corpo, .admin-corpo input, .admin-corpo select, .admin-corpo textarea, .admin-corpo button { font-family: var(--sans); }
.admin-corpo { font-size: 15px; line-height: 1.5; letter-spacing: 0; }
.admin-corpo .admin-cabecalho h1 { font-family: var(--serif); font-weight: 600; font-size: 1.75rem; letter-spacing: -0.01em; }
.admin-corpo .painel-cartao h3,
.admin-corpo .admin-conteudo h2,
.admin-corpo .admin-conteudo h3 { font-family: var(--sans); font-weight: 700; font-size: 1.02rem; letter-spacing: 0; }
.admin-corpo .painel-cartao h3 .sub { font-weight: 400; }
.admin-corpo .sub { font-size: 0.86rem; }
.admin-corpo .etiqueta { font-size: 0.74rem; letter-spacing: 0.02em; text-transform: none; font-weight: 700; }
.admin-corpo .kpi-rotulo { text-transform: none; letter-spacing: 0; font-size: 0.82rem; font-weight: 700; color: var(--sd-sub); }
.admin-corpo .cc-data { text-transform: none; letter-spacing: 0; font-size: 0.86rem; }
.admin-corpo .cc-saudacao { font-size: 1.5rem; }
.admin-corpo table.agenda th { text-transform: none; letter-spacing: 0; font-size: 0.8rem; font-weight: 700; }
.admin-corpo .mini-num, .admin-corpo .mes-numero { font-family: var(--sans); font-weight: 700; }
.admin-corpo .admin-marca { font-family: var(--serif); }
.admin-corpo .admin-marca span { font-family: var(--sans); letter-spacing: 0.18em; }
.admin-corpo .fp-titulo, .admin-corpo .cc-saudacao { font-family: var(--serif); }

/* ============================================================
   FICHA LATERAL · compacta
   ============================================================ */
.fp-sub { font-size: 0.86rem; color: var(--sd-sub); margin-top: 0.15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-resumo { display: grid; gap: 0.25rem; padding: 0.7rem 0.9rem; margin: 0 0 0.8rem; border-radius: 12px; background: var(--sd-superficie-2); border: 1px solid var(--sd-borda); font-size: 0.92rem; position: relative; }
.fp-estado { position: absolute; top: 0.7rem; right: 0.8rem; font-size: 0.72rem; font-weight: 700; padding: 0.2rem 0.6rem; border-radius: var(--raio-pilula, 10px); background: #e4ebf2; color: #256b43; }
.fp-estado.pendente { background: #fef6eb; color: #8a5a12; }
.fp-estado.cancelada { background: #f4dcd9; color: #8c3b31; }
.fp-estado.realizada { background: #e3eef7; color: #274d80; }
.fp-linha { padding-right: 6rem; }
.fp-link { margin-top: 0.2rem; }
.fp-painel .fp-info-oculta { display: none; }              /* a tabela grande já está no resumo */
.fp-painel .fp-sec { padding: 0.55rem 0.9rem; }
.fp-painel .fp-sec-titulo { cursor: pointer; margin: 0; display: flex; align-items: center; justify-content: space-between; font-size: 0.95rem; user-select: none; }
.fp-painel .fp-sec-titulo::after { content: '▾'; font-size: 0.85rem; color: var(--sd-sub); transition: transform 0.15s ease; }
.fp-painel .fp-sec.fechada .fp-sec-titulo::after { transform: rotate(-90deg); }
.fp-painel .fp-sec.fechada > *:not(.fp-sec-titulo) { display: none; }
.fp-painel .fp-sec:not(.fechada) .fp-sec-titulo { margin-bottom: 0.5rem; }
.tema-noturno .fp-estado { background: #233b58; color: #a9dcbb; }
.tema-noturno .fp-estado.pendente { background: #243547; color: #ecd9a8; }
.tema-noturno .fp-estado.cancelada { background: #3a2320; color: #f0b3aa; }

/* ============================================================
   POPUP «O que quer marcar?»
   ============================================================ */
.esc-caixa { width: min(560px, 92vw); background: var(--sd-superficie); border-radius: 18px; border: 1px solid var(--sd-borda); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3); padding: 1.4rem; }
.esc-cab { font-family: var(--serif); font-size: 1.35rem; margin-bottom: 1rem; color: var(--sd-texto); }
.esc-opcoes { display: grid; grid-template-columns: 1fr 1fr; gap: 0.8rem; }
.esc-opcao { display: flex; flex-direction: column; gap: 0.3rem; padding: 1.1rem 1rem; border-radius: 14px; border: 1px solid var(--sd-borda); background: var(--sd-superficie-2); text-decoration: none; color: var(--sd-texto); transition: transform 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease; }
.esc-opcao:hover, .esc-opcao:focus-visible { transform: translateY(-2px); border-color: var(--sd-realce); box-shadow: var(--sd-sombra); outline: none; }
.esc-icone { font-size: 1.6rem; }
.esc-opcao strong { font-size: 1rem; }
.esc-opcao small { color: var(--sd-sub); font-size: 0.82rem; line-height: 1.35; }
.esc-dica { margin: 0.9rem 0 0; text-align: right; }
@media (max-width: 560px) { .esc-opcoes { grid-template-columns: 1fr; } }

/* ============================================================
   NOVA RESERVA · fluxo em 3 passos com resumo vivo
   ============================================================ */
.nv-topo { display: flex; justify-content: space-between; align-items: center; margin: -0.3rem 0 1rem; flex-wrap: wrap; gap: 0.6rem; }
.nv-tabs { display: inline-flex; background: var(--sd-superficie-2); border: 1px solid var(--sd-borda); border-radius: var(--raio-pilula, 10px); padding: 3px; }
.nv-tab { padding: 0.45rem 1rem; border-radius: var(--raio-pilula, 10px); text-decoration: none; color: var(--sd-sub); font-weight: 700; font-size: 0.9rem; }
.nv-tab.ativa { background: var(--sd-superficie); color: var(--sd-texto); box-shadow: 0 1px 3px rgba(26, 42, 60, 0.12); }
.nv-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 1rem; align-items: start; }
@media (max-width: 900px) { .nv-layout { grid-template-columns: 1fr; } .nv-resumo { position: static !important; } }
.nv-passos { display: grid; gap: 0.9rem; }
.nv-passo { background: var(--sd-superficie); border: 1px solid var(--sd-borda); border-radius: var(--sd-raio); padding: 1.1rem 1.25rem 1.25rem; box-shadow: var(--sd-sombra); }
.nv-passo header { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.9rem; }
.nv-passo h3 { margin: 0; font-size: 1.02rem; }
.nv-num { width: 26px; height: 26px; border-radius: 50%; background: var(--sd-realce); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.82rem; }
.tema-noturno .nv-num { color: #0c1523; }
.nv-grelha-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.7rem 0.9rem; }
.nv-grelha-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0.7rem 0.9rem; }
.nv-campo { display: flex; flex-direction: column; gap: 0.3rem; font-size: 0.86rem; font-weight: 700; color: var(--sd-texto); }
.nv-campo input, .nv-campo select { font-weight: 400; font-size: 0.95rem; padding: 0.58rem 0.75rem; border: 1px solid var(--sd-borda); border-radius: 10px; background: var(--sd-superficie); color: var(--sd-texto); }
.nv-campo input:focus-visible, .nv-campo select:focus-visible { outline: none; border-color: var(--sd-realce); box-shadow: 0 0 0 3px rgba(27, 59, 92, 0.15); }
.tema-noturno .nv-campo input, .tema-noturno .nv-campo select { background: var(--sd-superficie-2); }
.nv-opc { font-weight: 400; color: var(--sd-sub); font-size: 0.78rem; margin-left: 0.25rem; }
.nv-fixo { padding: 0.58rem 0.75rem; border: 1px dashed var(--sd-borda); border-radius: 10px; font-weight: 400; color: var(--sd-texto); }
.nv-segmentos { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.5rem; }
.nv-seg { display: flex; flex-direction: column; gap: 0.1rem; padding: 0.6rem 0.8rem; border: 1px solid var(--sd-borda); border-radius: 10px; cursor: pointer; font-weight: 700; font-size: 0.9rem; background: var(--sd-superficie); transition: border-color 0.12s ease, background 0.12s ease; }
.nv-seg small { font-weight: 400; color: var(--sd-sub); font-size: 0.78rem; }
.nv-seg input { position: absolute; opacity: 0; pointer-events: none; }
.nv-seg.ativa { border-color: var(--sd-realce); background: #eef3ef; box-shadow: inset 0 0 0 1px var(--sd-realce); }
.tema-noturno .nv-seg.ativa { background: #233b58; }
.nv-turnos { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; margin-top: 0.7rem; font-size: 0.82rem; }
.nv-turno-tit { color: var(--sd-sub); margin-right: 0.2rem; }
.nv-turno { padding: 0.25rem 0.6rem; border-radius: var(--raio-pilula, 10px); background: var(--sd-superficie-2); border: 1px solid var(--sd-borda); }
.nv-turno.aviso { background: #fef6eb; border-color: #ecd9a8; color: #8a5a12; }
.nv-resumo { position: sticky; top: 1rem; background: var(--sd-superficie); border: 1px solid var(--sd-borda); border-radius: var(--sd-raio); box-shadow: var(--sd-sombra); padding: 1.1rem 1.2rem; }
.nv-resumo-cab { font-family: var(--serif); font-size: 1.15rem; margin-bottom: 0.7rem; }
.nv-resumo dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 0.35rem 0.8rem; font-size: 0.88rem; }
.nv-resumo dt { color: var(--sd-sub); }
.nv-resumo dd { margin: 0; font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.nv-total { display: flex; justify-content: space-between; align-items: baseline; margin: 0.9rem 0 0.8rem; padding-top: 0.7rem; border-top: 1px solid var(--sd-borda); }
.nv-total strong { font-size: 1.35rem; }
.nv-btn { width: 100%; padding: 0.75rem; font-size: 1rem; }
.nv-nota { font-size: 0.78rem; color: var(--sd-sub); margin: 0.6rem 0 0; line-height: 1.4; }
.nv-desativado { opacity: 0.55; }
.nv-desativado select { cursor: not-allowed; }

/* ============================================================
   FICHA DA RESERVA · modal centrado (substitui o painel lateral)
   ============================================================ */
.fp-fundo { background: rgba(8, 18, 29, 0.55); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; padding: 2vh 1rem; }
.fp-fundo.oculto { display: none; }
.fp-painel {
  position: relative; top: auto; right: auto; bottom: auto;
  width: min(880px, 96vw); max-height: 92vh; overflow-y: auto;
  border: 1px solid var(--sd-borda); border-left: 1px solid var(--sd-borda); border-radius: 20px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.38);
  animation: fp-surge 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
  padding: 0 1.4rem 1.4rem;
}
@keyframes fp-surge { from { transform: translateY(14px) scale(0.985); opacity: 0; } to { transform: none; opacity: 1; } }
.ficha-painel-cab { padding-top: 1.2rem; }
.fp-titulo { font-size: 1.4rem; }
/* dentro do modal: resumo a toda a largura, secções em duas colunas */
.fp-painel .fp-resumo { grid-template-columns: 1fr 1fr; gap: 0.3rem 1.2rem; }
.fp-painel .fp-resumo .fp-linha.sub, .fp-painel .fp-resumo .fp-link { grid-column: 1 / -1; }
.fp-painel .ficha-grelha { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 0.8rem !important; align-items: start; }
.fp-painel .ficha-grelha > div { display: contents; }         /* as pilhas internas dissolvem-se na grelha */
.fp-painel .ficha-grelha > * > .painel-cartao, .fp-painel .ficha-grelha > .painel-cartao { margin: 0; }
.fp-painel .fp-sec.fechada { align-self: start; }
@media (max-width: 760px) {
  .fp-painel { width: 100vw; max-height: 100vh; border-radius: 0; }
  .fp-painel .ficha-grelha { grid-template-columns: 1fr !important; }
  .fp-painel .fp-resumo { grid-template-columns: 1fr; }
}

/* ============================================================
   FORMULÁRIOS DA AGENDA E DO CIRCUITO · componentes modernos
   ============================================================ */
.rf-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 1rem; align-items: start; }
@media (max-width: 960px) { .rf-layout { grid-template-columns: 1fr; } .rf-resumo { position: static !important; } }
.rf-passos { display: grid; gap: 0.8rem; }
.rf-passo { padding: 1rem 1.1rem 1.1rem; box-shadow: none; }
.rf-passo header { margin-bottom: 0.7rem; }
.rf-linhas { display: grid; gap: 0.7rem; }
.rf-linha { border: 1px solid var(--sd-borda); border-radius: 12px; padding: 0.8rem 0.9rem; background: var(--sd-superficie-2); }
.rf-linha + .rf-linha { position: relative; }
.rf-linha-topo { display: flex; gap: 0.6rem; align-items: flex-end; margin-bottom: 0.6rem; }
.rf-servico { flex: 1; min-width: 0; }
.rf-remover { width: 34px; height: 38px; border-radius: 10px; border: 1px solid var(--sd-borda); background: var(--sd-superficie); color: #8c3b31; font-size: 1.2rem; cursor: pointer; flex-shrink: 0; }
.rf-remover:hover { background: #f4dcd9; border-color: #e2b3ad; }
.rf-resumo { position: sticky; top: 1rem; }
.tema-noturno .rf-linha { background: #1d304a; }
/* a página da agenda: separadores das abas mais leves */
.aba-btn { border-radius: var(--raio-pilula, 10px); }
.nv-campo.oculto, .nv-grelha-3 > .oculto, .nv-grelha-2 > .oculto { display: none !important; }

/* ---- Manutenção em grupos modulares ---- */
.mt-grupo h3 { display: flex; align-items: center; gap: 0.5rem; }
.mt-icone { display: inline-flex; width: 30px; height: 30px; border-radius: 9px; align-items: center; justify-content: center; background: var(--sd-superficie-2); border: 1px solid var(--sd-borda); font-size: 0.95rem; }
.mt-tabela td { vertical-align: top; }
.mt-tabela td:first-child { width: 58%; }
.mt-tabela tr + tr td { border-top: 1px solid var(--sd-borda); }
/* Diálogo do arrasto (avisar / não avisar) */
.dlg { width: min(520px, 92vw); background: var(--sd-superficie); border: 1px solid var(--sd-borda); border-radius: 18px; padding: 1.3rem 1.4rem; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3); }
.dlg-cab { font-family: var(--serif); font-size: 1.25rem; margin-bottom: 0.3rem; }
.dlg-txt { margin: 0 0 1rem; color: var(--sd-sub); }
.dlg-acoes { display: grid; gap: 0.5rem; }
.dlg-acoes .btn { width: 100%; }
/* Opção «avisar o cliente» inline nos formulários de remarcar */
.nv-seg-inline { display: inline-flex; flex-direction: row; align-items: center; gap: 0.5rem; padding: 0.45rem 0.8rem; margin: 0.4rem 0 0.6rem; font-size: 0.86rem; }
.nv-seg-inline input { position: static; opacity: 1; pointer-events: auto; accent-color: var(--sd-realce); }

/* Modal da ficha: nunca transbordar na horizontal (colunas com minmax e conteúdo contido) */
.fp-painel { overflow-x: hidden; }
.fp-painel .ficha-grelha { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
.fp-painel .painel-cartao, .fp-painel .fp-resumo { min-width: 0; max-width: 100%; box-sizing: border-box; }
.fp-painel .painel-cartao * { max-width: 100%; }
.fp-painel table { table-layout: fixed; width: 100%; }
.fp-painel .fp-resumo .fp-linha { padding-right: 0; }
.fp-painel .fp-estado { position: static; justify-self: end; }
.fp-painel .fp-resumo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: center; }
.admin-corpo input[type="hidden"] { display: none !important; width: 0 !important; margin: 0 !important; padding: 0 !important; }
.chip-radio input[type="radio"], .nv-seg input[type="radio"] { position: absolute; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; display: inline !important; margin: 0 !important; }

/* ===== PROPOSTA · ficha v2 (modal) ===== */
.fp-painel { padding: 0 1.5rem 1.5rem; }
.m2-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding: 1.3rem 0 0.6rem; }
.m2-nome { font-family: var(--serif); font-size: 1.45rem; line-height: 1.2; }
.m2-sub { color: var(--sd-sub); font-size: 0.88rem; margin-top: 0.2rem; }
.m2-dir { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.m2-dir .fp-estado { position: static; font-size: 0.78rem; }
.m2-ico { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--sd-borda); display: inline-flex; align-items: center; justify-content: center; text-decoration: none; color: var(--sd-sub); }
.m2-passos { display: flex; align-items: center; gap: 0.4rem; margin: 0.4rem 0 1rem; flex-wrap: wrap; }
.m2-passo { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; color: var(--sd-sub); white-space: nowrap; }
.m2-passo i { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 0.72rem; font-weight: 700; background: var(--sd-superficie-2); color: var(--sd-sub); }
.m2-passo.ok { color: #256b43; } .m2-passo.ok i { background: #e4ece8; color: #256b43; }
.m2-passo.agora { color: var(--sd-texto); font-weight: 700; } .m2-passo.agora i { background: var(--sd-realce); color: #fff; }
.m2-ln { flex: 1; min-width: 12px; height: 1px; background: var(--sd-borda); }
.m2-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; margin-bottom: 1rem; }
.m2-tile { background: var(--sd-superficie-2); border-radius: 10px; padding: 0.6rem 0.75rem; min-width: 0; }
.m2-tile small { display: block; font-size: 0.72rem; color: var(--sd-sub); margin-bottom: 0.1rem; }
.m2-tile b { font-size: 0.92rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.m2-falta { color: #7c603b; }
.m2-cols { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 1.1rem; align-items: start; }
.m2-cols h4 { margin: 0 0 0.5rem; font-size: 0.76rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--sd-sub); font-weight: 700; }
.m2-detalhes dl { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.35rem 0.8rem; font-size: 0.88rem; }
.m2-detalhes dt { color: var(--sd-sub); } .m2-detalhes dd { margin: 0; }
.m2-hist { margin-top: 0.9rem; padding-top: 0.6rem; border-top: 1px solid var(--sd-borda); display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.2rem 0.7rem; font-size: 0.78rem; color: var(--sd-sub); }
/* as secções de ação viram lista compacta à direita */
.m2-acoes-col .painel-cartao { padding: 0.55rem 0.8rem; margin: 0 0 0.4rem; border-radius: 10px; box-shadow: none; }
.m2-acoes-col .fp-sec-titulo { font-size: 0.88rem; }
.m2-acoes-col .fp-sec:not(.fechada) { background: #f4f8f4; border-color: #cedcec; }
.fp-painel .ficha-grelha { display: block !important; }
.fp-painel .ficha-grelha > div { display: block; }
.fp-painel .fp-info-oculta { display: none !important; }
.fp-painel .fp-resumo, .fp-painel .ficha-painel-cab { display: none; }
.m2-acoes-col .painel-cartao h3 .etiqueta { display: none; }
.m2-acoes-col .btn.perigo { background: transparent; color: #8c3b31; border: 1px solid #e2b3ad; }
@media (max-width: 760px) { .m2-cols { grid-template-columns: 1fr; } .m2-tiles { grid-template-columns: 1fr 1fr; } }
.fp-painel .fp-voltar { display: none; }
.m2-acoes-col .painel-cartao { border-radius: 10px; }
.m2-acoes-col .fp-sec-titulo { gap: 0.6rem; justify-content: flex-start; }
.m2-acoes-col .fp-sec-titulo::after { margin-left: auto; }
.m2-acoes-col .fp-sec-titulo .sub { font-size: 0.78rem; }
.fp-ico { width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; background: var(--sd-superficie-2); color: var(--sd-realce); font-size: 0.8rem; flex-shrink: 0; }
.m2-acoes-col .fp-proxima { border-color: #9cc6f0; background: #edf4fb; }
.m2-acoes-col .fp-proxima .fp-sec-titulo::before { content: 'próximo passo'; order: 5; margin-left: auto; font-size: 0.68rem; font-weight: 700; color: #256b43; background: #cce0f4; padding: 0.1rem 0.5rem; border-radius: var(--raio-pilula, 10px); }
.m2-acoes-col .fp-proxima .fp-sec-titulo::after { margin-left: 0.4rem; }
.m2-acoes-col .fp-perigo { border-color: #e2b3ad; }
.m2-acoes-col .fp-perigo .fp-ico { background: #f4dcd9; color: #8c3b31; }
.m2-acoes-col .fp-perigo .fp-sec-titulo { color: #8c3b31; }
.m2-acoes-col .fp-sec.fechada .fp-sec-titulo { margin: 0; }
.m2-acoes-col .painel-cartao:not(:has(h3)) { padding: 0.55rem 0.8rem; }
.m2-acoes-col .painel-cartao:not(:has(h3)) form { margin: 0; }
.fp-painel .fp-voltar, .fp-painel p.sub:has(> a[href^="dia.php?data="]) { display: none !important; }
.fp-painel .ficha-grelha > div { margin: 0 !important; padding: 0 !important; }
.fp-painel .ficha-grelha > div > * { margin-top: 0 !important; }
.m2-acoes-col > .ficha-grelha, .m2-acoes-col .ficha-grelha { display: flex !important; flex-direction: column; gap: 0.4rem; }
.m2-acoes-col .ficha-grelha > div { display: contents !important; }
.m2-acoes-col .painel-cartao { order: 5; }
.m2-acoes-col .fp-proxima { order: 1; }
.m2-acoes-col .painel-cartao:has(.fp-ico-user-check) { order: 2; }
.m2-acoes-col .painel-cartao:has(.fp-ico-cash), .m2-acoes-col .painel-cartao:has(.fp-ico-link) { order: 3; }
.m2-acoes-col .painel-cartao:has(.fp-ico-file-invoice) { order: 4; }
.m2-acoes-col .fp-perigo, .m2-acoes-col .painel-cartao:has(.btn.perigo) { order: 9; }
.m2-acoes-col .painel-cartao:has(.fp-ico-history) { order: 8; }
.m2-acoes-col .painel-cartao { width: 100%; box-sizing: border-box; }
.m2-acoes-col .fp-sec-titulo .sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== PROPOSTA v3 · ações em rodapé, detalhes a toda a largura ===== */
.m3-corpo { display: block; }
.m3-corpo .m2-detalhes { padding-bottom: 0.4rem; }
.m3-dl { display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr) !important; gap: 0.45rem 1rem !important; font-family: var(--sans); font-size: 0.92rem !important; }
.m3-dl dt { color: var(--sd-sub); font-weight: 700; font-size: 0.8rem; align-self: baseline; }
.m3-dl dd { font-weight: 400; }
.m2-hist { font-family: var(--sans); font-size: 0.82rem; }
.m2-detalhes h4, .m3-zona h4 { font-family: var(--sans); }
.m3-zona { margin-top: 1rem; }
.m3-zona > h4 { display: none; }
.m3-zona .ficha-grelha { display: block !important; }
.m3-zona .fp-sec-titulo::after { display: none; }
.m3-zona .m3-sec.fechada { display: none; }
.m3-zona .m3-sec { margin: 0 0 0.8rem; border-radius: 12px; padding: 0.9rem 1rem; background: #f4f8f4; border: 1px solid #cedcec; }
.m3-zona .m3-sec .fp-sec-titulo { cursor: default; margin-bottom: 0.5rem; }
.m3-rodape { display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: center; padding: 0.8rem 0 0; border-top: 1px solid var(--sd-borda); position: sticky; bottom: 0; background: var(--sd-superficie); margin-top: 0.6rem; }
.m3-btn { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.5rem 0.85rem; border-radius: var(--raio-pilula, 10px); border: 1px solid var(--sd-borda); background: var(--sd-superficie); font: inherit; font-size: 0.86rem; font-weight: 700; color: var(--sd-texto); cursor: pointer; transition: border-color 0.12s ease, background 0.12s ease; }
.m3-btn:hover { border-color: var(--sd-realce); }
.m3-btn.ativa { background: var(--sd-realce); color: #fff; border-color: var(--sd-realce); }
.m3-btn.ativa .fp-ico { background: rgba(255,255,255,0.2); color: #fff; }
.m3-btn.proxima { border-color: #9cc6f0; background: #edf4fb; }
.m3-btn.perigo { margin-left: auto; color: #8c3b31; border-color: #e2b3ad; }
.m3-btn.perigo .fp-ico { background: #f4dcd9; color: #8c3b31; }
.m3-btn .fp-ico { width: 20px; height: 20px; font-size: 0.75rem; }
.fp-painel { padding-bottom: 1rem; }
.tema-noturno .m3-zona .m3-sec { background: #1d304a; border-color: #335075; }
.tema-noturno .m3-rodape { background: var(--sd-superficie); }
.m3-rodape { justify-content: flex-start; }
.m3-btn { order: 5; }
.m3-btn:has(.fp-ico-user-check) { order: 1; } .m3-btn:has(.fp-ico-cash), .m3-btn:has(.fp-ico-link) { order: 2; }
.m3-btn:has(.fp-ico-file-invoice) { order: 3; } .m3-btn:has(.fp-ico-droplet) { order: 4; } .m3-btn:has(.fp-ico-calendar-event) { order: 5; }
.m3-btn:has(.fp-ico-switch-horizontal) { order: 6; } .m3-btn:has(.fp-ico-history) { order: 7; } .m3-btn.perigo { order: 9; margin-left: auto; }
.m3-dl dt, .m3-dl dd { font-size: 0.9rem; line-height: 1.45; }
.m3-dl dt { font-weight: 700; color: var(--sd-sub); }

/* ============================================================
   BARRA LATERAL v2 · ícones, grupos, utilizador, recolhível
   ============================================================ */
.admin-lateral { display: flex; flex-direction: column; padding: 0.9rem 0.75rem; }
.sb-marca { display: flex; align-items: center; gap: 0.6rem; padding: 0.2rem 0.4rem 0.9rem; }
.sb-logo { width: 34px; height: 34px; border-radius: 9px; background: #d4af80; color: #0c1523; display: inline-flex; align-items: center; justify-content: center; font-family: var(--serif); font-weight: 700; font-size: 1.05rem; flex-shrink: 0; }
.sb-marca-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.sb-marca-txt b { font-family: var(--serif); font-weight: 600; font-size: 0.98rem; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-marca-txt small { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: #8fa5bf; }
.sb-ico-btn { margin-left: auto; width: 30px; height: 30px; border-radius: 8px; border: 0; background: transparent; color: #8fa5bf; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; text-decoration: none; }
.sb-ico-btn:hover { background: rgba(255,255,255,0.08); color: #fff; }
.sb-grupo { font-size: 0.68rem; letter-spacing: 0.06em; text-transform: uppercase; color: #7a91aa; padding: 0.8rem 0.6rem 0.25rem; }
.sb-nav a { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.6rem; border-radius: 9px; color: #ced8e3; font-size: 0.9rem; font-weight: 600; text-decoration: none; position: relative; }
.sb-nav a .ic { color: #8fa5bf; flex-shrink: 0; }
.sb-nav a:hover { background: rgba(255,255,255,0.06); color: #fff; }
.sb-nav a.ativo { background: #1d304a; color: #fff; box-shadow: inset 3px 0 0 #d4af80; }
.sb-nav a.ativo .ic { color: #d4af80; }
.sb-nav .nav-badge { margin-left: auto; font-size: 0.68rem; font-style: normal; background: #d4af80; color: #0c1523; padding: 0.05rem 0.45rem; border-radius: var(--raio-pilula, 10px); font-weight: 700; }
.sb-suporte { margin-top: 0.5rem; }
.sb-user { margin-top: auto; display: flex; align-items: center; gap: 0.55rem; padding: 0.75rem 0.4rem 0; border-top: 1px solid rgba(255,255,255,0.1); flex-wrap: wrap; }
.sb-av { width: 32px; height: 32px; border-radius: 50%; background: #1d304a; color: #d4af80; display: inline-flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 700; flex-shrink: 0; }
.sb-user-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; flex: 1; }
.sb-user-txt b { color: #fff; font-size: 0.86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-user-txt small { color: #7a91aa; font-size: 0.72rem; }
.sb-user-acoes { display: flex; gap: 0.15rem; width: 100%; justify-content: flex-end; }
.sb-user-acoes .sb-ico-btn { margin: 0; width: 28px; height: 28px; }
/* ---- recolhida ---- */
.lateral-recolhida .admin-lateral { width: 72px; padding: 0.9rem 0.5rem; }
.lateral-recolhida .sb-marca { justify-content: center; padding-bottom: 0.6rem; flex-direction: column; gap: 0.4rem; }
.lateral-recolhida .sb-marca-txt, .lateral-recolhida .sb-rot, .lateral-recolhida .sb-grupo, .lateral-recolhida .sb-user-txt { display: none; }
.lateral-recolhida .sb-marca .sb-ico-btn { margin: 0; }
.lateral-recolhida .sb-nav a { justify-content: center; padding: 0.6rem 0; }
.lateral-recolhida .sb-nav .nav-badge { position: absolute; top: 2px; right: 6px; margin: 0; }
.lateral-recolhida .sb-user { justify-content: center; }
.lateral-recolhida .sb-user-acoes { justify-content: center; flex-wrap: wrap; }
.lateral-recolhida .admin-conteudo { margin-left: 0; }
.lateral-recolhida .sb-nav a:hover::after { content: attr(title); position: absolute; left: 100%; top: 50%; transform: translateY(-50%); margin-left: 0.6rem; background: #0c1523; color: #fff; padding: 0.3rem 0.6rem; border-radius: 6px; font-size: 0.8rem; white-space: nowrap; z-index: 50; }
.admin-lateral, .admin-conteudo { transition: width 0.2s ease, margin 0.2s ease; }
.tema-noturno .admin-lateral { background: #0c1523; }

/* ===== Página própria da reserva (R1–R5) ===== */
.m3-pagina .m2-cab { padding-top: 0.2rem; }
.m3-corpo-pagina { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1.2rem; align-items: start; }
@media (max-width: 1000px) { .m3-corpo-pagina { grid-template-columns: 1fr; } }
.m3-cliente { background: var(--sd-superficie); border: 1px solid var(--sd-borda); border-radius: var(--sd-raio); box-shadow: var(--sd-sombra); padding: 1rem 1.1rem; }
.m3-cliente h4 { font-size: 0.76rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--sd-sub); margin: 0 0 0.6rem; }
.m3-cliente h5 { font-size: 0.86rem; margin: 0 0 0.35rem; }
.m3-cl-cab { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.9rem; font-size: 0.9rem; }
.m3-cl-sec { padding-top: 0.7rem; margin-top: 0.7rem; border-top: 1px solid var(--sd-borda); }
.m3-cl-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; font-size: 0.84rem; }
.m3-cl-lista li a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 0.5rem; align-items: center; text-decoration: none; color: inherit; padding: 0.35rem 0.5rem; border-radius: 8px; }
.m3-cl-lista li a:hover { background: var(--sd-superficie-2); }
.m3-cl-lista li:not(:has(a)) { display: flex; justify-content: space-between; gap: 0.5rem; padding: 0.35rem 0.5rem; }
.m3-cl-serv { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--sd-sub); }
.m3-cl-lista .etiqueta { font-size: 0.68rem; }
.m3-cl-sec .btn { margin: 0.2rem 0.3rem 0 0; }
.m3-notas-form { display: flex; gap: 0.4rem; align-items: center; }
.m3-notas-form input { flex: 1; min-width: 0; border: 1px dashed transparent; background: transparent; padding: 0.15rem 0.3rem; border-radius: 6px; font: inherit; color: inherit; }
.m3-notas-form input:hover, .m3-notas-form input:focus { border-color: var(--sd-borda); background: var(--sd-superficie-2); outline: none; }
.m3-notas-btn { display: none; }
.m3-notas-form:focus-within .m3-notas-btn { display: inline-flex; }
.m3-rodape-pagina { position: sticky; bottom: 0; padding: 0.8rem 0; background: var(--sd-superficie-2, #f4f6f2); margin-top: 1rem; }
.admin-corpo .m3-corpo:not(.fp-painel *) .m2-detalhes { background: var(--sd-superficie); border: 1px solid var(--sd-borda); border-radius: var(--sd-raio); box-shadow: var(--sd-sombra); padding: 1rem 1.1rem; }
.admin-conteudo > .m2-cab, .admin-conteudo > .m2-passos, .admin-conteudo > .m2-tiles { max-width: 1180px; }
.admin-conteudo > .m2-tiles .m2-tile { background: var(--sd-superficie); border: 1px solid var(--sd-borda); box-shadow: var(--sd-sombra); }
.admin-conteudo .m3-zona .m3-sec { background: var(--sd-superficie); }
.admin-conteudo > .m2-cab .fp-fechar { display: none; }
.m3-btn:has(.fp-ico-corrigir) { order: 6; }
.m3-btn:has(.fp-ico-terapeuta) { order: 1; } .m3-btn:has(.fp-ico-pagamento), .m3-btn:has(.fp-ico-link) { order: 2; } .m3-btn:has(.fp-ico-fatura) { order: 3; } .m3-btn:has(.fp-ico-circuito) { order: 4; } .m3-btn:has(.fp-ico-remarcar) { order: 5; } .m3-btn:has(.fp-ico-historico) { order: 7; }

/* ===== PAINEL v2 (P1–P7) ===== */
.cc-topo { margin-top: 0.2rem; }
.k4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.k4 .kpi { flex-direction: row; gap: 0.7rem; align-items: flex-start; border-top: 0; padding: 0.85rem 1rem; }
.k4 .kpi > span:last-child { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.k-ic { flex-shrink: 0; width: 34px; height: 34px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.05rem; font-weight: 700; background: rgba(255,255,255,0.85); }
.k4 .kpi-valor { font-family: var(--sans); font-size: 1.7rem; font-weight: 700; letter-spacing: -0.01em; }
.k4 .kpi-valor small { font-size: 0.8rem; font-weight: 400; color: var(--sd-sub); }
.k-verde { background: #e4ebf2; } .k-verde .k-ic { color: #256b43; } .k-verde .kpi-rotulo, .k-verde .kpi-tendencia { color: #256b43; }
.k-ambar { background: #fef6eb; } .k-ambar .k-ic { color: #8a5a12; } .k-ambar .kpi-rotulo, .k-ambar .kpi-tendencia { color: #8a5a12; } .k-ambar .kpi-valor { color: #8a5a12; }
.k-neutro { background: #fff; } .k-neutro .k-ic { background: var(--sd-superficie-2); color: var(--sd-realce); }
.tema-noturno .k-verde { background: #233b58; } .tema-noturno .k-ambar { background: #243547; } .tema-noturno .k-neutro { background: #192b44; }
.tema-noturno .k-ic { background: rgba(0,0,0,0.25); }
.tl-mini { display: grid; gap: 0.45rem; }
.tl-pista-linha { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 0.6rem; align-items: center; }
.tl-nome { font-size: 0.82rem; color: var(--sd-sub); font-weight: 700; }
.tl-pista { position: relative; height: 34px; border-radius: 8px; background: var(--sd-superficie-2); }
.tl-pista.folga { background: repeating-linear-gradient(45deg, #f4f6f2, #f4f6f2 6px, #fff 6px, #fff 12px); }
.tl-folga { position: absolute; inset: 0; display: flex; align-items: center; padding-left: 0.7rem; font-size: 0.78rem; color: var(--sd-sub); }
.tl-bloco { position: absolute; top: 4px; bottom: 4px; border-radius: 6px; padding: 0 0.55rem; font-size: 0.78rem; font-weight: 700; display: flex; align-items: center; white-space: nowrap; overflow: hidden; text-decoration: none; color: #256b43; background: #cce0f4; border: 1px solid #9cc6f0; }
.tl-bloco.pendente { background: #fef6eb; border-color: #ecd9a8; color: #8a5a12; border-style: dashed; }
.tl-bloco.realizada { opacity: 0.55; }
.tl-bloco.circ { background: #dbe8f3; border-color: #b7cfe4; color: #274d80; }
.tl-bloco:hover { filter: brightness(0.96); }
.tl-eixo { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 0.6rem; }
.tl-eixo div { display: flex; justify-content: space-between; font-size: 0.7rem; color: var(--sd-sub); padding: 0 0.2rem; }
.tema-noturno .tl-pista.folga { background: repeating-linear-gradient(45deg, #192b44, #192b44 6px, #1d304a 6px, #1d304a 12px); }
.tema-noturno .tl-bloco { background: #233b58; border-color: #3c5c83; color: #a9dcbb; }
.tema-noturno .tl-bloco.circ { background: #1c3a44; border-color: #3d6b7d; color: #9fd0e8; }
.semana7 { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.5rem; }
.dia7 { display: flex; flex-direction: column; align-items: center; gap: 0.15rem; padding: 0.6rem 0.4rem 0.7rem; border: 1px solid var(--sd-borda); border-radius: 12px; text-decoration: none; color: var(--sd-texto); transition: transform 0.12s ease, box-shadow 0.12s ease; }
.dia7:hover { transform: translateY(-2px); box-shadow: var(--sd-sombra); }
.dia7.hoje { border-color: var(--sd-realce); box-shadow: inset 0 0 0 1px var(--sd-realce); }
.d7-rot { font-size: 0.74rem; color: var(--sd-sub); }
.d7-num { font-size: 1.35rem; font-weight: 700; }
.d7-barra { width: 100%; height: 5px; background: var(--sd-superficie-2); border-radius: 3px; overflow: hidden; margin-top: 0.3rem; }
.d7-barra i { display: block; height: 100%; background: #2e8b57; border-radius: 3px; }
.dia7.com-pendente .d7-barra i { background: #d9a83c; }
.d7-pend { font-size: 0.68rem; color: #8a5a12; font-weight: 700; margin-top: 0.15rem; }
.lista-proximas .lp-dia { list-style: none; font-size: 0.74rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--sd-sub); font-weight: 700; padding: 0.55rem 0 0.2rem; border: 0; }
.lista-proximas li:not(.lp-dia) .quando { font-weight: 700; color: var(--sd-realce); }
.btn-perigo-suave { color: #8c3b31; }
.cc-pend-acoes form { display: inline; }
.cc-pilha { display: grid; gap: 0.9rem; align-content: start; }
.admin-cabecalho:not(:has(h1)):not(:has(.cabecalho-acoes)) { display: none; }
/* O rodapé de ações não pode tapar formulários: fica no fluxo, com margem por cima; e a secção aberta deixa espaço */
.fp-painel .m3-rodape { position: static; margin-top: 0.8rem; }
.fp-painel .m3-zona .m3-sec { margin-bottom: 0.9rem; }
.fp-painel { padding-bottom: 1.2rem; }

/* ============================================================
   AGENDA · blocos curtos, peek e menu de ações
   ============================================================ */
.bloco { cursor: pointer; }
.bloco.curto { min-height: 28px; padding: 0 0.55rem; display: flex; align-items: center; }
.bloco.curto .bloco-linha { display: flex; gap: 0.4rem; align-items: baseline; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; font-size: 0.8rem; }
.bloco.curto .bloco-linha .bloco-hora { font-weight: 700; flex-shrink: 0; }
.bloco.curto .bloco-linha strong { flex-shrink: 1; overflow: hidden; text-overflow: ellipsis; }
.bloco.curto .bloco-linha .bloco-servico { color: inherit; opacity: 0.75; overflow: hidden; text-overflow: ellipsis; }
.bloco.bloco-ativo { outline: 2px solid var(--sd-realce); outline-offset: 1px; z-index: 6; }
.bloco:focus-visible { outline: 2px solid var(--sd-realce); outline-offset: 1px; }
.bpeek { position: fixed; z-index: 70; width: 250px; padding: 0.6rem 0.8rem; border-radius: 12px; background: var(--sd-superficie); border: 1px solid var(--sd-borda); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.18); font-size: 0.84rem; pointer-events: none; display: grid; gap: 0.15rem; }
.bpeek.oculto { display: none; }
.bpeek b { font-size: 0.92rem; }
.bpeek small { color: var(--sd-sub); }
.bpeek-notas { font-style: italic; }
.bpeek-estado { justify-self: start; margin-top: 0.3rem; font-size: 0.72rem; font-weight: 700; padding: 0.15rem 0.55rem; border-radius: var(--raio-pilula, 10px); background: #e4ebf2; color: #256b43; }
.bpeek-estado.pendente { background: #fef6eb; color: #8a5a12; }
.bpeek-estado.realizada { background: #e3eef7; color: #274d80; }
.bmenu { position: fixed; z-index: 75; width: 250px; padding: 0.35rem; border-radius: 14px; background: var(--sd-superficie); border: 1px solid var(--sd-borda); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2); display: grid; gap: 0.1rem; }
.bmenu.oculto { display: none; }
.bmenu-cab { padding: 0.55rem 0.7rem 0.45rem; border-bottom: 1px solid var(--sd-borda); margin-bottom: 0.2rem; }
.bmenu-cab b { display: block; font-size: 0.9rem; }
.bmenu-cab small { color: var(--sd-sub); font-size: 0.78rem; }
.bmenu form { display: contents; }
.bmenu form.oculto { display: none; }
.bmenu-item { display: block; width: 100%; text-align: left; padding: 0.5rem 0.7rem; border: 0; border-radius: 9px; background: transparent; font: inherit; font-size: 0.88rem; font-weight: 600; color: var(--sd-texto); cursor: pointer; text-decoration: none; }
.bmenu-item:hover, .bmenu-item:focus-visible { background: var(--sd-superficie-2); outline: none; }
.bmenu-item.perigo { color: #8c3b31; }
.bmenu-item.perigo:hover { background: #f4dcd9; }
@media (hover: none) { .bpeek { display: none !important; } }

/* ===== Vouchers e lista de espera · linguagem do painel ===== */
.vch-num { font-weight: 700; color: var(--sd-realce); text-decoration: none; padding: 0.2rem 0.5rem; margin-left: -0.5rem; border-radius: 7px; }
.vch-num:hover { background: var(--sd-superficie-2); text-decoration: none; }
.vch-linha.expirado td { color: var(--sd-sub); }
.vch-linha.usufruido td { opacity: 0.8; }
.fp-estado.vch-valido { background: #e4ebf2; color: #256b43; }
.fp-estado.vch-usufruido { background: #e3eef7; color: #274d80; }
.fp-estado.vch-expirado { background: #f4dcd9; color: #8c3b31; }
.tema-noturno .fp-estado.vch-valido { background: #233b58; color: #a9dcbb; }
.tema-noturno .fp-estado.vch-usufruido { background: #23364a; color: #a8c8ea; }
.tema-noturno .fp-estado.vch-expirado { background: #3a2320; color: #f0b3aa; }
.m3-rodape[data-pronto] { display: flex; }
.m3-rodape[data-pronto] .m3-btn.proxima { border-color: #9cc6f0; background: #edf4fb; }
.m3-btn svg.ic { color: currentColor; }
.admin-corpo .abas-ano .aba-btn { border-radius: var(--raio-pilula, 10px); }
.m3-rodape[data-pronto] .m3-btn { order: 5; } .m3-rodape[data-pronto] .m3-btn.proxima { order: 1; } .m3-rodape[data-pronto] form { display: contents; } .m3-rodape[data-pronto] .m3-btn.perigo { order: 9; margin-left: auto; }

/* ============================================================
   VOUCHERS · registo com pré-visualização e lista em cartões
   ============================================================ */
.vch-registo { background: var(--sd-superficie); border: 1px solid var(--sd-borda); border-radius: var(--sd-raio); box-shadow: var(--sd-sombra); margin-bottom: 1rem; overflow: hidden; }
.vch-registo > summary { display: flex; align-items: center; gap: 0.6rem; padding: 0.9rem 1.1rem; cursor: pointer; list-style: none; font-size: 0.98rem; }
.vch-registo > summary::-webkit-details-marker { display: none; }
.vch-registo > summary::after { content: '+'; margin-left: auto; font-size: 1.3rem; color: var(--sd-sub); line-height: 1; }
.vch-registo[open] > summary::after { content: '–'; }
.vch-registo[open] > summary { border-bottom: 1px solid var(--sd-borda); }
.vch-reg-ic { width: 32px; height: 32px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--sd-superficie-2); color: var(--sd-realce); }
.rf-vch { padding: 1rem 1.1rem 1.2rem; }
/* cartão de pré-visualização, com ar de voucher */
.vch-cartao { position: relative; display: grid; gap: 0.3rem; padding: 1rem 1.1rem 0.9rem; border-radius: 14px; background: linear-gradient(135deg, #1b3b5c 0%, #1e3249 100%); color: #f6f3ef; box-shadow: 0 8px 24px rgba(26, 42, 60, 0.25); overflow: hidden; }
.vch-cartao::after { content: ''; position: absolute; right: -30px; top: -30px; width: 110px; height: 110px; border-radius: 50%; background: rgba(212, 175, 128, 0.16); }
.vch-cartao-marca { font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; color: #cab69e; }
.vch-cartao b { font-family: var(--serif); font-size: 1.08rem; font-weight: 600; line-height: 1.25; }
.vch-cartao-para { font-size: 0.84rem; color: #ced8e3; }
.vch-cartao-para i { font-style: normal; font-weight: 700; color: #fff; }
.vch-cartao-rodape { display: flex; justify-content: space-between; gap: 0.5rem; margin-top: 0.5rem; padding-top: 0.5rem; border-top: 1px solid rgba(255, 255, 255, 0.18); font-size: 0.72rem; color: #b6c8dd; }
/* barra de ordenação */
.vch-barra { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; margin: 0.2rem 0 0.9rem; font-size: 0.84rem; }
.vch-barra .th-ord { display: inline-block; padding: 0; border: 0; }
.vch-barra .th-ord a { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.32rem 0.75rem; border-radius: var(--raio-pilula, 10px); border: 1px solid var(--sd-borda); background: var(--sd-superficie); font-weight: 600; }
.vch-barra .th-ord.ativa a { background: var(--sd-realce); color: #fff; border-color: var(--sd-realce); }
.tema-noturno .vch-barra .th-ord.ativa a { color: #0c1523; }
/* grelha de cartões */
.vch-grelha { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 0.8rem; }
.vch-card { display: grid; gap: 0.3rem; padding: 0.9rem 1rem 0.8rem; border-radius: 14px; border: 1px solid var(--sd-borda); background: var(--sd-superficie); text-decoration: none; color: var(--sd-texto); box-shadow: var(--sd-sombra); transition: transform 0.14s ease, box-shadow 0.14s ease, border-color 0.14s ease; position: relative; overflow: hidden; }
.vch-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #2e8b57; }
.vch-card.expirado::before { background: #b8483c; }
.vch-card.usufruido::before { background: #6b86a8; }
.vch-card:hover { transform: translateY(-3px); box-shadow: 0 3px 6px rgba(26, 42, 60, 0.07), 0 16px 34px rgba(26, 42, 60, 0.14); border-color: var(--sd-realce); }
.vch-card.expirado, .vch-card.usufruido { background: var(--sd-superficie-2); }
.vch-card-topo { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; }
.vch-card-num { font-family: var(--sans); font-weight: 700; font-size: 0.96rem; letter-spacing: 0.02em; }
.vch-card-topo .fp-estado { position: static; font-size: 0.7rem; }
.vch-card-serv { font-family: var(--serif); font-size: 1.02rem; line-height: 1.3; }
.vch-card-para { font-size: 0.86rem; color: var(--sd-texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vch-card-meta { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; margin-top: 0.2rem; }
.vch-card-valor { font-size: 1.15rem; font-weight: 700; }
.vch-card-rodape { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; margin-top: 0.45rem; padding-top: 0.45rem; border-top: 1px solid var(--sd-borda); font-size: 0.78rem; }
.vch-alerta { color: #8a5a12; font-weight: 700; }
.vch-card-tags { display: flex; gap: 0.25rem; }
.vch-tag { font-style: normal; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.04em; padding: 0.1rem 0.4rem; border-radius: 5px; background: var(--sd-superficie-2); color: var(--sd-sub); border: 1px solid var(--sd-borda); }
.vch-tag.ligada { background: #e4ebf2; color: #256b43; border-color: #cce0f4; }
.tema-noturno .vch-tag.ligada { background: #233b58; color: #a9dcbb; border-color: #3c5c83; }
.vch-cartao-rodape { font-size: 0.68rem; }
.vch-cartao-rodape span:first-child { white-space: nowrap; }
.vch-barra .th-ord a { text-decoration: none; }
.vch-barra .th-ord a:hover { border-color: var(--sd-realce); background: var(--sd-superficie-2); }
.vch-barra .th-ord.ativa a:hover { background: var(--sd-realce); }

/* Circuito · mês centrado e peek acima da grelha */
.mes-nav-centrada { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.6rem; }
.mes-nav-centrada .mes-titulo { grid-column: 2; text-align: center; margin: 0; font-family: var(--serif); font-size: 1.3rem; font-weight: 600; }
.mes-nav-centrada .cal-seta { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.mes-ir { display: flex; justify-content: center; }
.mes-ir input { max-width: 190px; }
/* O peek tem de ficar por cima: os dias com hover sobem no empilhamento e a grelha deixa transbordar */
.mini-grelha { overflow: visible; }
.mini-dia, .circ-dia, .mes-dia { position: relative; }
.mini-dia:hover, .circ-dia:hover, .mes-dia:hover { z-index: 40; }
.mini-dia:has(.peek:hover), .circ-dia:has(.peek:hover) { z-index: 41; }
.peek { z-index: 45; }
/* o hover não pode criar um novo contexto que prenda o peek: sem transform no dia com peek */
.mini-dia:has(> .peek):hover, .circ-dia:has(> .peek):hover { transform: none; box-shadow: 0 6px 14px rgba(27, 59, 92, 0.18); }
.painel-cartao:has(.mini-grelha) { overflow: visible; }
/* O dia sob o rato sobe acima de todos os irmãos; o peek herda esse contexto */
.mini-grelha .mini-dia:hover, .mini-grelha .circ-dia:hover, .mes-grelha .mes-dia:hover { z-index: 60; }
.mini-grelha .mini-dia:focus-visible, .mini-grelha .circ-dia:focus-visible, .mes-grelha .mes-dia:focus-visible { z-index: 60; }
.mini-grelha, .mes-grelha { isolation: isolate; }
.peek { z-index: 5; }
/* Causa raiz do peek tapado: o transform no hover cria contexto de empilhamento e prende-o.
   Nos dias que têm peek troca-se a elevação por sombra (sem transform). */
.admin-corpo .mini-dia:has(.peek):hover,
.admin-corpo .circ-dia:has(.peek):hover,
.admin-corpo .mes-dia:has(.peek):hover,
.mini-dia:has(.peek):hover,
.circ-dia:has(.peek):hover,
.mes-dia:has(.peek):hover {
  transform: none;
  box-shadow: 0 8px 18px rgba(27, 59, 92, 0.22);
  z-index: 60;
}
/* Números dos dias na cor do texto (não azul de link) e quarto legível no peek */
.admin-corpo .mini-dia, .admin-corpo .circ-dia, .admin-corpo .mini-dia:visited { color: var(--sd-texto); }
.admin-corpo .mini-num { color: var(--sd-texto); opacity: 0.9; }
.peek .peek-quem { max-width: none; }
.peek { min-width: 260px; }
.peek-linha { grid-template-columns: auto minmax(0, 1fr) auto; }
.mes-ir input { text-align: center; }