/* Marcar uma visita (descalabro.pt/menus/visita). Junta-se ao menus.css (mesma linguagem: areia, tinta, terracota). Sem estilos
   inline: a CSP não os deixa. Móvel primeiro; alvos de toque com pelo menos 44 px; foco sempre visível. */
.visita{display:grid;gap:18px;padding-bottom:40px;max-width:820px}
.visita-form{display:grid;gap:16px}
.visita .campos{margin-bottom:0}
.visita input:focus-visible,.visita button:focus-visible,.visita a:focus-visible{outline:3px solid var(--terra);outline-offset:2px}
.dias{display:grid;gap:18px}
.dia{border:0;min-width:0}
.dia legend{font-stretch:90%;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:13px;color:var(--terra);margin-bottom:10px}
.dia[hidden]{display:none}
.horas{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.hora{position:relative;flex-direction:row;align-items:center;justify-content:center;min-height:46px;padding:0;background:var(--sand);
  border:1px solid var(--linha);color:var(--ink);font-weight:600;cursor:pointer}
.hora input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.hora span{pointer-events:none}
.hora:hover{border-color:var(--ink)}
.hora:has(input:checked){background:var(--ink);border-color:var(--ink);color:#fff}
.hora:has(input:focus-visible){outline:3px solid var(--terra);outline-offset:2px}
/* seleção de dia (só com JavaScript) */
.dias-abas{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:6px;-webkit-overflow-scrolling:touch}
.dia-aba{flex:none;min-height:46px;padding:0 14px;background:var(--sand);border:1px solid var(--linha);color:var(--ink);font:inherit;font-size:14px;
  font-weight:600;cursor:pointer;text-align:left}
.dia-aba[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.botoes{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 14px}
.botoes .cta{border:1px solid var(--ink)}
.visita .cta{min-height:46px;display:inline-flex;align-items:center;justify-content:center}
.visita .caixa h2{margin-bottom:10px}
.visita-botao{margin:18px 0}
@media (min-width:700px){.horas{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))}}
/* com as abas de dia (JavaScript) a legenda repete o dia: fica só para os leitores de ecrã */
.com-abas .dia legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}